@chenzy-design/svelte 0.3.0 → 0.4.1

package/dist/config-provider/meta.d.ts

@@ -1,119 +1,74 @@
 /**
  * Machine-readable component metadata for AI/docs consumption.
  * ConfigProvider — see specs/components/other/ConfigProvider.spec.md
+ * 严格对齐 Semi ConfigProvider（packages/semi-ui/configProvider）。
  */
 export declare const meta: {
     readonly name: "ConfigProvider";
     readonly category: "other";
     readonly renderless: true;
-    readonly description: "全局配置总入口，通过 setContext 注入 locale/theme/dir/size/zIndexBase/transition/reducedMotion 等配置 context 供子树继承；嵌套时浅合并（undefined 继承、就近 wins）；theme=\"dark\" 在 wrap 根写 data-theme 触发 tokens 暗色调色板，theme=\"auto\" 经命令式 matchMedia 监听 prefers-color-scheme 实时解析 light/dark（系统切换自动响应、带 cleanup）；reducedMotion(boolean|\"auto\") 控制动画降级，显式开启时写全局标记（wrap 时在包裹 div、renderless 时命令式写 documentElement 的 data-reduced-motion）令依赖 motion-duration token 的动画退化，\"auto\" 沿用系统原生 @media；wrap=true 渲染 display:contents 包裹元素建立独立主题/方向作用域，默认 wrap=false renderless 无 DOM；locale 维度复用 LocaleProvider 的 createLocale + LOCALE_CONTEXT_KEY 机制；getPopupContainer 经 context 暴露全局浮层默认容器供浮层组件（Modal/Dropdown 等）在自身 prop 未传时回退；getValidateMessages 经 context 暴露全局表单校验文案覆盖供 Form 在 locale 内置文案之上按 Form.* 键覆盖（支持插值）；wrap 时 as 可自定义包裹元素标签（section/article/main 等，默认 div）。函数型配置（getPopupContainer/getValidateMessages）不参与 core 纯配置合并，由 ConfigProvider 在 context 层就近合并（未提供继承父级）。";
+    readonly description: "全局配置总入口，借助 Svelte Context 向子树注入跨组件公共配置：locale（多语言，复用 LocaleProvider 的 createLocale + LOCALE_CONTEXT_KEY 机制注入）、direction（文本方向，rtl 时渲染 `<div class=\"cd-rtl\">` 包裹层驱动组件镜像，否则 renderless 无 DOM）、timeZone（时区标识，数字偏移 / GMT± / IANA，透传给时间类组件）、getPopupContainer（全局浮层默认挂载容器，经 context 暴露给浮层组件在自身 prop 未传时回退，最终回退 document.body）。嵌套时浅合并（undefined 继承、就近 wins）。响应式断点：responsiveObserve 默认 false（不注册任何 matchMedia），开启后在首次订阅时懒注册监听、无订阅时自动注销；responsiveMap 自定义断点（key 为 xs/sm/md/lg/xl/xxl，引用比较，inline 新对象触发重注册）；onBreakpoint / screens 非 props，经 getConfigResponsive（等价 Semi ConfigConsumer）读取，onBreakpoint 支持 `(cb)`（拿完整 screens）与 `(breakpoints, cb)`（拿单断点变化）两种签名、订阅时立即回调一次；defaultResponsiveMap 作为默认断点导出。ConfigProvider 本身无独立 token / scss，是纯逻辑组件（对齐 Semi）。";
     readonly exports: readonly ["ConfigProvider"];
     readonly props: readonly [{
         readonly name: "locale";
         readonly type: "Locale";
         readonly default: "undefined";
-        readonly desc: "语言包对象；提供则注入 locale context（复用 LocaleProvider 机制），未提供则沿用上层";
+        readonly desc: "语言包对象；提供则注入 locale context（复用 LocaleProvider 机制），未提供则沿用上层。对齐 Semi locale";
     }, {
-        readonly name: "theme";
-        readonly type: "'light'|'dark'|'auto'";
-        readonly default: "undefined";
-        readonly desc: "主题，undefined 继承父级；dark 在 wrap 根写 data-theme 触发暗色调色板；auto 跟随系统 prefers-color-scheme 实时切 light/dark";
-    }, {
-        readonly name: "reducedMotion";
-        readonly type: "boolean|'auto'";
-        readonly default: "'auto'";
-        readonly desc: "动画降级开关，undefined 继承父级（默认 auto）；true 强制降级、false 强制开启、auto 跟随系统 prefers-reduced-motion；显式开启时写全局 data-reduced-motion 标记令动画退化";
-    }, {
-        readonly name: "dir";
+        readonly name: "direction";
         readonly type: "'ltr'|'rtl'";
-        readonly default: "undefined";
-        readonly desc: "文本方向，undefined 继承父级";
-    }, {
-        readonly name: "size";
-        readonly type: "'small'|'default'|'large'";
-        readonly default: "undefined";
-        readonly desc: "默认尺寸，undefined 继承父级";
+        readonly default: "'ltr'";
+        readonly desc: "文本方向；rtl 时渲染 `<div class=\"cd-rtl\">` 包裹层驱动组件镜像，undefined 继承父级。对齐 Semi direction";
     }, {
-        readonly name: "zIndexBase";
-        readonly type: "number";
+        readonly name: "timeZone";
+        readonly type: "string|number";
         readonly default: "undefined";
-        readonly desc: "浮层 z-index 基线，undefined 继承父级（DEFAULT 1000）";
-    }, {
-        readonly name: "transition";
-        readonly type: "boolean";
-        readonly default: "undefined";
-        readonly desc: "是否启用过渡动画，undefined 继承父级";
+        readonly desc: "默认时区标识（数字为距 UTC 偏移小时，字符串为 GMT± 或 IANA 如 Asia/Shanghai），注入时间类组件；undefined 继承父级。对齐 Semi timeZone";
     }, {
         readonly name: "getPopupContainer";
         readonly type: "() => HTMLElement | null | undefined";
-        readonly default: "undefined";
-        readonly desc: "全局浮层默认挂载容器；经 context 暴露给浮层组件（Modal/Dropdown 等），其自身 getContainer/getPopupContainer prop 优先，未传时回退此值（最终回退 document.body）；undefined 继承父级";
+        readonly default: "() => document.body";
+        readonly desc: "全局浮层默认挂载容器；经 context 暴露给浮层组件（Modal/Dropdown 等），其自身 getContainer/getPopupContainer prop 优先，未传时回退此值；undefined 继承父级。对齐 Semi getPopupContainer";
     }, {
-        readonly name: "getValidateMessages";
-        readonly type: "() => Record<string, string>";
-        readonly default: "undefined";
-        readonly desc: "全局表单校验文案覆盖；按 Form.* 键返回模板字符串（支持 {label}/{min}/{max} 占位符插值），仅覆盖列出的键、其余回退 locale 内置文案；经 context 暴露给 Form；undefined 继承父级";
-    }, {
-        readonly name: "wrap";
+        readonly name: "responsiveObserve";
         readonly type: "boolean";
         readonly default: "false";
-        readonly desc: "true 时渲染 display:contents 包裹元素，建立主题/方向作用域；false 为 renderless 无 DOM";
+        readonly desc: "是否开启响应式断点监听；默认关闭以避免全局注册 matchMedia 的性能开销，开启后首次订阅时懒注册、无订阅时自动注销。对齐 Semi responsiveObserve";
     }, {
-        readonly name: "as";
-        readonly type: "string";
-        readonly default: "'div'";
-        readonly desc: "wrap=true 时包裹元素的标签，可设 section/article/main 等语义标签；wrap=false 时无效";
-    }];
-    readonly events: readonly [{
-        readonly name: "onThemeChange";
-        readonly desc: "theme 变化时通知（受控，不回写）；info.applied 为 auto 解析后实际落地的 light/dark";
-    }, {
-        readonly name: "onReducedMotionChange";
-        readonly desc: "reducedMotion 解析结果变化时通知（受控，不回写）；info.reduced=true 表示已降级";
-    }, {
-        readonly name: "onLocaleChange";
-        readonly desc: "locale 变化时通知（受控，不回写）";
-    }, {
-        readonly name: "onDirChange";
-        readonly desc: "dir 变化时通知（受控，不回写）";
-    }, {
-        readonly name: "onConfigChange";
-        readonly desc: "合并后配置变化时通知（受控，不回写）";
+        readonly name: "responsiveMap";
+        readonly type: "ResponsiveMap";
+        readonly default: "defaultResponsiveMap";
+        readonly desc: "自定义断点配置（key 为 xs/sm/md/lg/xl/xxl，value 为 media query 字符串）；未传用默认断点。引用比较：inline 新对象会触发重注册，建议定义在组件外。对齐 Semi responsiveMap";
     }];
+    readonly events: readonly [];
     readonly slots: readonly [{
         readonly name: "children";
         readonly desc: "受配置作用域覆盖的后代内容";
     }];
     readonly a11y: {
         readonly hasRole: false;
-        readonly note: "无 role；wrap div 用 display:contents 不生成盒子、不打断 a11y 树；dir 属性写入供 RTL 辅助技术读取；推荐宿主同步 html lang/dir。";
+        readonly note: "direction=rtl 时渲染 `<div class=\"cd-rtl\">` 承载方向作用域供 RTL 辅助技术读取（对齐 Semi .semi-rtl）；其余方向 renderless 无 DOM、不打断 a11y 树；推荐宿主同步 html lang/dir。";
     };
     readonly tokens: readonly [];
-    readonly responsive: false;
+    readonly responsive: true;
     readonly examples: readonly [{
-        readonly title: "应用根配置";
-        readonly code: "<ConfigProvider {locale} theme=\"light\" dir=\"ltr\">{@render app()}</ConfigProvider>";
+        readonly title: "基本用法（时区）";
+        readonly code: "<ConfigProvider timeZone=\"GMT+08:00\">{@render app()}</ConfigProvider>";
     }, {
-        readonly title: "局部暗色覆盖";
-        readonly code: "<ConfigProvider wrap theme=\"dark\">{@render panel()}</ConfigProvider>";
+        readonly title: "手动获取值";
+        readonly code: "const cfg = getConfigContext(); // { direction, timeZone }";
     }, {
-        readonly title: "跟随系统主题（auto）";
-        readonly code: "<ConfigProvider wrap theme=\"auto\">{@render app()}</ConfigProvider>";
+        readonly title: "响应式断点监听";
+        readonly code: "<ConfigProvider responsiveObserve {responsiveMap}>{@render app()}</ConfigProvider>";
     }, {
-        readonly title: "强制降级动画";
-        readonly code: "<ConfigProvider reducedMotion>{@render app()}</ConfigProvider>";
-    }, {
-        readonly title: "嵌套 dir 覆盖";
-        readonly code: "<ConfigProvider dir=\"ltr\"><ConfigProvider wrap dir=\"rtl\">{@render rtlSection()}</ConfigProvider></ConfigProvider>";
+        readonly title: "RTL 方向";
+        readonly code: "<ConfigProvider direction=\"rtl\">{@render app()}</ConfigProvider>";
     }, {
         readonly title: "全局浮层容器";
         readonly code: "<ConfigProvider getPopupContainer={() => document.getElementById(\"app\")!}>{@render app()}</ConfigProvider>";
     }, {
-        readonly title: "全局校验文案覆盖";
-        readonly code: "<ConfigProvider getValidateMessages={() => ({ \"Form.required\": \"{label}不能为空\" })}>{@render form()}</ConfigProvider>";
-    }, {
-        readonly title: "自定义 wrap 标签";
-        readonly code: "<ConfigProvider wrap as=\"section\" theme=\"dark\">{@render panel()}</ConfigProvider>";
+        readonly title: "嵌套 direction 覆盖";
+        readonly code: "<ConfigProvider direction=\"ltr\"><ConfigProvider direction=\"rtl\">{@render rtlSection()}</ConfigProvider></ConfigProvider>";
     }];
 };
 //# sourceMappingURL=meta.d.ts.map

package/dist/config-provider/meta.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../src/config-provider/meta.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2HP,CAAC"}
+{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../src/config-provider/meta.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+EP,CAAC"}

package/dist/config-provider/meta.js

@@ -1,127 +1,84 @@
 /**
  * Machine-readable component metadata for AI/docs consumption.
  * ConfigProvider — see specs/components/other/ConfigProvider.spec.md
+ * 严格对齐 Semi ConfigProvider（packages/semi-ui/configProvider）。
  */
 export const meta = {
     name: 'ConfigProvider',
     category: 'other',
     renderless: true,
-    description: '全局配置总入口，通过 setContext 注入 locale/theme/dir/size/zIndexBase/transition/reducedMotion 等配置 context 供子树继承；嵌套时浅合并（undefined 继承、就近 wins）；theme="dark" 在 wrap 根写 data-theme 触发 tokens 暗色调色板，theme="auto" 经命令式 matchMedia 监听 prefers-color-scheme 实时解析 light/dark（系统切换自动响应、带 cleanup）；reducedMotion(boolean|"auto") 控制动画降级，显式开启时写全局标记（wrap 时在包裹 div、renderless 时命令式写 documentElement 的 data-reduced-motion）令依赖 motion-duration token 的动画退化，"auto" 沿用系统原生 @media；wrap=true 渲染 display:contents 包裹元素建立独立主题/方向作用域，默认 wrap=false renderless 无 DOM；locale 维度复用 LocaleProvider 的 createLocale + LOCALE_CONTEXT_KEY 机制；getPopupContainer 经 context 暴露全局浮层默认容器供浮层组件（Modal/Dropdown 等）在自身 prop 未传时回退；getValidateMessages 经 context 暴露全局表单校验文案覆盖供 Form 在 locale 内置文案之上按 Form.* 键覆盖（支持插值）；wrap 时 as 可自定义包裹元素标签（section/article/main 等，默认 div）。函数型配置（getPopupContainer/getValidateMessages）不参与 core 纯配置合并，由 ConfigProvider 在 context 层就近合并（未提供继承父级）。',
+    description: '全局配置总入口，借助 Svelte Context 向子树注入跨组件公共配置：locale（多语言，复用 LocaleProvider 的 createLocale + LOCALE_CONTEXT_KEY 机制注入）、direction（文本方向，rtl 时渲染 `<div class="cd-rtl">` 包裹层驱动组件镜像，否则 renderless 无 DOM）、timeZone（时区标识，数字偏移 / GMT± / IANA，透传给时间类组件）、getPopupContainer（全局浮层默认挂载容器，经 context 暴露给浮层组件在自身 prop 未传时回退，最终回退 document.body）。嵌套时浅合并（undefined 继承、就近 wins）。响应式断点：responsiveObserve 默认 false（不注册任何 matchMedia），开启后在首次订阅时懒注册监听、无订阅时自动注销；responsiveMap 自定义断点（key 为 xs/sm/md/lg/xl/xxl，引用比较，inline 新对象触发重注册）；onBreakpoint / screens 非 props，经 getConfigResponsive（等价 Semi ConfigConsumer）读取，onBreakpoint 支持 `(cb)`（拿完整 screens）与 `(breakpoints, cb)`（拿单断点变化）两种签名、订阅时立即回调一次；defaultResponsiveMap 作为默认断点导出。ConfigProvider 本身无独立 token / scss，是纯逻辑组件（对齐 Semi）。',
     exports: ['ConfigProvider'],
     props: [
         {
             name: 'locale',
             type: 'Locale',
             default: 'undefined',
-            desc: '语言包对象；提供则注入 locale context（复用 LocaleProvider 机制），未提供则沿用上层',
+            desc: '语言包对象；提供则注入 locale context（复用 LocaleProvider 机制），未提供则沿用上层。对齐 Semi locale',
         },
         {
-            name: 'theme',
-            type: "'light'|'dark'|'auto'",
-            default: 'undefined',
-            desc: '主题，undefined 继承父级；dark 在 wrap 根写 data-theme 触发暗色调色板；auto 跟随系统 prefers-color-scheme 实时切 light/dark',
-        },
-        {
-            name: 'reducedMotion',
-            type: "boolean|'auto'",
-            default: "'auto'",
-            desc: '动画降级开关，undefined 继承父级（默认 auto）；true 强制降级、false 强制开启、auto 跟随系统 prefers-reduced-motion；显式开启时写全局 data-reduced-motion 标记令动画退化',
-        },
-        {
-            name: 'dir',
+            name: 'direction',
             type: "'ltr'|'rtl'",
-            default: 'undefined',
-            desc: '文本方向，undefined 继承父级',
-        },
-        {
-            name: 'size',
-            type: "'small'|'default'|'large'",
-            default: 'undefined',
-            desc: '默认尺寸，undefined 继承父级',
-        },
-        {
-            name: 'zIndexBase',
-            type: 'number',
-            default: 'undefined',
-            desc: '浮层 z-index 基线，undefined 继承父级（DEFAULT 1000）',
+            default: "'ltr'",
+            desc: '文本方向；rtl 时渲染 `<div class="cd-rtl">` 包裹层驱动组件镜像，undefined 继承父级。对齐 Semi direction',
         },
         {
-            name: 'transition',
-            type: 'boolean',
+            name: 'timeZone',
+            type: 'string|number',
             default: 'undefined',
-            desc: '是否启用过渡动画，undefined 继承父级',
+            desc: '默认时区标识（数字为距 UTC 偏移小时，字符串为 GMT± 或 IANA 如 Asia/Shanghai），注入时间类组件；undefined 继承父级。对齐 Semi timeZone',
         },
         {
             name: 'getPopupContainer',
             type: '() => HTMLElement | null | undefined',
-            default: 'undefined',
-            desc: '全局浮层默认挂载容器；经 context 暴露给浮层组件（Modal/Dropdown 等），其自身 getContainer/getPopupContainer prop 优先，未传时回退此值（最终回退 document.body）；undefined 继承父级',
-        },
-        {
-            name: 'getValidateMessages',
-            type: '() => Record<string, string>',
-            default: 'undefined',
-            desc: '全局表单校验文案覆盖；按 Form.* 键返回模板字符串（支持 {label}/{min}/{max} 占位符插值），仅覆盖列出的键、其余回退 locale 内置文案；经 context 暴露给 Form；undefined 继承父级',
+            default: '() => document.body',
+            desc: '全局浮层默认挂载容器；经 context 暴露给浮层组件（Modal/Dropdown 等），其自身 getContainer/getPopupContainer prop 优先，未传时回退此值；undefined 继承父级。对齐 Semi getPopupContainer',
         },
         {
-            name: 'wrap',
+            name: 'responsiveObserve',
             type: 'boolean',
             default: 'false',
-            desc: 'true 时渲染 display:contents 包裹元素，建立主题/方向作用域；false 为 renderless 无 DOM',
+            desc: '是否开启响应式断点监听；默认关闭以避免全局注册 matchMedia 的性能开销，开启后首次订阅时懒注册、无订阅时自动注销。对齐 Semi responsiveObserve',
         },
         {
-            name: 'as',
-            type: 'string',
-            default: "'div'",
-            desc: 'wrap=true 时包裹元素的标签，可设 section/article/main 等语义标签；wrap=false 时无效',
+            name: 'responsiveMap',
+            type: 'ResponsiveMap',
+            default: 'defaultResponsiveMap',
+            desc: '自定义断点配置（key 为 xs/sm/md/lg/xl/xxl，value 为 media query 字符串）；未传用默认断点。引用比较：inline 新对象会触发重注册，建议定义在组件外。对齐 Semi responsiveMap',
         },
     ],
-    events: [
-        { name: 'onThemeChange', desc: 'theme 变化时通知（受控，不回写）；info.applied 为 auto 解析后实际落地的 light/dark' },
-        { name: 'onReducedMotionChange', desc: 'reducedMotion 解析结果变化时通知（受控，不回写）；info.reduced=true 表示已降级' },
-        { name: 'onLocaleChange', desc: 'locale 变化时通知（受控，不回写）' },
-        { name: 'onDirChange', desc: 'dir 变化时通知（受控，不回写）' },
-        { name: 'onConfigChange', desc: '合并后配置变化时通知（受控，不回写）' },
-    ],
+    events: [],
     slots: [{ name: 'children', desc: '受配置作用域覆盖的后代内容' }],
     a11y: {
         hasRole: false,
-        note: '无 role；wrap div 用 display:contents 不生成盒子、不打断 a11y 树；dir 属性写入供 RTL 辅助技术读取；推荐宿主同步 html lang/dir。',
+        note: 'direction=rtl 时渲染 `<div class="cd-rtl">` 承载方向作用域供 RTL 辅助技术读取（对齐 Semi .semi-rtl）；其余方向 renderless 无 DOM、不打断 a11y 树；推荐宿主同步 html lang/dir。',
     },
     tokens: [],
-    responsive: false,
+    responsive: true,
     examples: [
         {
-            title: '应用根配置',
-            code: '<ConfigProvider {locale} theme="light" dir="ltr">{@render app()}</ConfigProvider>',
-        },
-        {
-            title: '局部暗色覆盖',
-            code: '<ConfigProvider wrap theme="dark">{@render panel()}</ConfigProvider>',
+            title: '基本用法（时区）',
+            code: '<ConfigProvider timeZone="GMT+08:00">{@render app()}</ConfigProvider>',
         },
         {
-            title: '跟随系统主题（auto）',
-            code: '<ConfigProvider wrap theme="auto">{@render app()}</ConfigProvider>',
+            title: '手动获取值',
+            code: 'const cfg = getConfigContext(); // { direction, timeZone }',
         },
         {
-            title: '强制降级动画',
-            code: '<ConfigProvider reducedMotion>{@render app()}</ConfigProvider>',
+            title: '响应式断点监听',
+            code: '<ConfigProvider responsiveObserve {responsiveMap}>{@render app()}</ConfigProvider>',
         },
         {
-            title: '嵌套 dir 覆盖',
-            code: '<ConfigProvider dir="ltr"><ConfigProvider wrap dir="rtl">{@render rtlSection()}</ConfigProvider></ConfigProvider>',
+            title: 'RTL 方向',
+            code: '<ConfigProvider direction="rtl">{@render app()}</ConfigProvider>',
         },
         {
             title: '全局浮层容器',
             code: '<ConfigProvider getPopupContainer={() => document.getElementById("app")!}>{@render app()}</ConfigProvider>',
         },
         {
-            title: '全局校验文案覆盖',
-            code: '<ConfigProvider getValidateMessages={() => ({ "Form.required": "{label}不能为空" })}>{@render form()}</ConfigProvider>',
-        },
-        {
-            title: '自定义 wrap 标签',
-            code: '<ConfigProvider wrap as="section" theme="dark">{@render panel()}</ConfigProvider>',
+            title: '嵌套 direction 覆盖',
+            code: '<ConfigProvider direction="ltr"><ConfigProvider direction="rtl">{@render rtlSection()}</ConfigProvider></ConfigProvider>',
         },
     ],
 };