chore(docs): 同步配方 13 的索引产物

This commit is contained in:
HIsheR
2026-10-26 20:02:20 +08:00
parent 1ac8baedfe
commit 0c978c9811
2 changed files with 11 additions and 4 deletions
+10 -4
View File
@@ -1,6 +1,6 @@
{ {
"$schema": "ui-arch-registry-index/0.1", "$schema": "ui-arch-registry-index/0.1",
"generatedAt": "2026-10-26T11:52:57.122Z", "generatedAt": "2026-10-26T11:59:09.023Z",
"repoRoot": ".", "repoRoot": ".",
"packages": [ "packages": [
{ {
@@ -267,7 +267,7 @@
"无障碍基线:装饰性占位(skeleton)aria-hidden、加载指示(spinner)role=status、关闭按钮必须 aria-label、弹层弹窗 aria-haspopup/expanded、读屏可见的状态一律同步 aria-*" "无障碍基线:装饰性占位(skeleton)aria-hidden、加载指示(spinner)role=status、关闭按钮必须 aria-label、弹层弹窗 aria-haspopup/expanded、读屏可见的状态一律同步 aria-*"
], ],
"docs": { "docs": {
"intro": "28 个 DOM 组件,统一用法:组件是普通函数,传入 props 返回 DOM 节点;需要状态时先创建 signal 再双向绑定。引入 CSS:import '@ui-arch/ui/ui.css'(内部已消费 tokens)。\n\n阴影对照表:下拉弹层=shadow-2 / 浮层与悬浮按钮=shadow-3 / 模态弹窗与抽屉及通知=shadow-4 / 卡片与输入组轻浮起=shadow-1;主按钮与强调件的主题色投影=shadow-accent / shadow-accent-strong,组件内不得再手写 box-shadow 字面值。", "intro": "70 个 DOM 组件,统一用法:组件是普通函数,传入 props 返回 DOM 节点;需要状态时先创建 signal 再双向绑定。引入 CSS:import '@ui-arch/ui/ui.css'(内部已消费 tokens)。\n\n阴影对照表:下拉弹层=shadow-2 / 浮层与悬浮按钮=shadow-3 / 模态弹窗与抽屉及通知=shadow-4 / 卡片与输入组轻浮起=shadow-1;主按钮与强调件的主题色投影=shadow-accent / shadow-accent-strong,组件内不得再手写 box-shadow 字面值。\n\n浮层入场统一:新弹层用 animation: ua-pop-drop var(--ua-duration-fast) var(--ua-ease-out) both(自上而下 4px 淡入),弹层翻到触发器上方时叠 .is-flip 覆盖成 ua-pop-rise(自下而上),不要再为单个组件自造 keyframes——方向与时长各写一份就会出现「翻转后还朝下入场」的错位。",
"steps": [ "steps": [
"安装依赖:pnpm add @ui-arch/ui @ui-arch/frame(workspace 内自动链接)", "安装依赖:pnpm add @ui-arch/ui @ui-arch/frame(workspace 内自动链接)",
"引入样式:在应用入口 import '@ui-arch/ui/ui.css',暗色主题在根元素设 data-theme='dark'", "引入样式:在应用入口 import '@ui-arch/ui/ui.css',暗色主题在根元素设 data-theme='dark'",
@@ -3798,6 +3798,11 @@
"t": "number", "t": "number",
"d": "分钟步长;缺省 5,超过 30 按 30 处理(如 15 只有 00/15/30/45)" "d": "分钟步长;缺省 5,超过 30 按 30 处理(如 15 只有 00/15/30/45)"
}, },
{
"n": "clearable",
"t": "boolean",
"d": "显示清空按钮 ×(仅在有值时出现);缺省 false,键盘 Delete / Backspace 等价"
},
{ {
"n": "placeholder", "n": "placeholder",
"t": "string", "t": "string",
@@ -3817,10 +3822,11 @@
"example": "const at = signal('09:30'); timePicker({ value: at, minuteStep: 15, onChange: (t) => toast.info(`定在 ${t}`) })", "example": "const at = signal('09:30'); timePicker({ value: at, minuteStep: 15, onChange: (t) => toast.info(`定在 ${t}`) })",
"steps": [ "steps": [
"创建信号 at = signal('09:30') 并传入 value:组件读它显示、选完写回,双向绑定", "创建信号 at = signal('09:30') 并传入 value:组件读它显示、选完写回,双向绑定",
"点触发器展开时 / 分两列,当前值所在格高亮并自动滚到列中部,不必手动找", "点触发器展开时 / 分两列:当前值所在格高亮并自动滚到列中部;还没选过时停在此刻(当前小时 / 当前分钟档),打开即可就近选",
"先点时列定小时(分默认落到首个步长值,值立刻可用),再点分列即完成并收起,焦点回到触发器", "先点时列定小时(分默认落到首个步长值,值立刻可用),再点分列即完成并收起,焦点回到触发器",
"列内可用 ↑↓ 环形移动、Home/End 直达首末;Tab、Esc、点击外部都能正常进出与收起", "列内可用 ↑↓ 环形移动、Home/End 直达首末;Tab、Esc、点击外部都能正常进出与收起",
"需要 15 分钟一档就传 minuteStep: 15,步长只影响分列的可选值,时列始终 24 档" "需要 15 分钟一档就传 minuteStep: 15,步长只影响分列的可选值,时列始终 24 档",
"需要允许回到「未选」态就传 clearable: true:有值时触发器右侧出现 ×(不进 Tab 序),聚焦触发器按 Delete / Backspace 也能清空,回调收到空串"
] ]
} }
] ]
+1
View File
@@ -160,3 +160,4 @@
- 配方 10:暗色主题切换(只切 data-theme,不改令牌名)(3 条要点) - 配方 10:暗色主题切换(只切 data-theme,不改令牌名)(3 条要点)
- 配方 11:数据看板筛选区(区间滑块 + 日期预设 + 分组下拉)(3 条要点) - 配方 11:数据看板筛选区(区间滑块 + 日期预设 + 分组下拉)(3 条要点)
- 配方 12:命令面板(⌘K 全局操作入口)(6 条要点) - 配方 12:命令面板(⌘K 全局操作入口)(6 条要点)
- 配方 13:预约时点(日期 + 时间两段拼装)(5 条要点)