组件 / other

ConfigProvider

全局配置总入口，借助 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）。

设计文档

如何引入

import { ConfigProvider } from '@chenzy-design/svelte';

基本用法（时区）

通过 timeZone 为时间类组件统一配置时区，切换时区后 DatePicker / TimePicker 的显示随之按新时区呈现。

传入 timeZone 参数，为时间类组件统一配置时区；切换下方时区观察 DatePicker / TimePicker 的显示随之变化。

手动获取值

组件内部通常自动消费 ConfigProvider 的值；特殊场景可用 getConfigContext（等价 Semi ConfigConsumer）手动读取合并后的配置。

在 ConfigProvider 子树内的组件里，用 getConfigContext() 手动获取合并后的全局配置。
{"direction":"ltr","timeZone":"GMT+08:00"}

响应式断点监听

开启 responsiveObserve 后，子组件经 onBreakpoint 订阅断点变化；responsiveMap 自定义断点，默认关闭时不注册任何 matchMedia。

开启 responsiveObserve 后，子组件经 onBreakpoint 订阅断点变化；缩放窗口宽度观察命中断点更新（默认 false 时不注册任何 matchMedia）。
当前命中断点：（无命中） {"xs":false,"sm":false,"md":false,"lg":false,"xl":false,"xxl":false}

RTL / LTR

全局配置 direction 改变组件文本方向；rtl 时渲染 cd-rtl 包裹层驱动组件镜像，可在 ltr / rtl 间切换。

全局配置 direction 改变组件文本方向；切换 ltr / rtl 观察按钮、标签、输入框的排布与对齐。
当前方向：rtl
起始侧标签

全局浮层容器

getPopupContainer 经 context 提供全局默认浮层容器，Dropdown 等浮层未传自身 prop 时统一 portal 到此宿主。

getPopupContainer 经 context 提供全局默认浮层容器；Dropdown 等浮层组件未传自身 getPopupContainer 时，统一 portal 到此宿主（而非 document.body）。
浮层挂载宿主（下方菜单将 portal 进这里）：

API 参考

ConfigProvider

Props

属性说明类型默认值
locale语言包对象；提供则注入 locale context（复用 LocaleProvider 机制），未提供则沿用上层。对齐 Semi localeLocaleundefined
direction文本方向；rtl 时渲染 `<div class="cd-rtl">` 包裹层驱动组件镜像，undefined 继承父级。对齐 Semi direction'ltr'|'rtl''ltr'
timeZone默认时区标识（数字为距 UTC 偏移小时，字符串为 GMT± 或 IANA 如 Asia/Shanghai），注入时间类组件；undefined 继承父级。对齐 Semi timeZonestring|numberundefined
getPopupContainer全局浮层默认挂载容器；经 context 暴露给浮层组件（Modal/Dropdown 等），其自身 getContainer/getPopupContainer prop 优先，未传时回退此值；undefined 继承父级。对齐 Semi getPopupContainer() => HTMLElement | null | undefined() => document.body
responsiveObserve是否开启响应式断点监听；默认关闭以避免全局注册 matchMedia 的性能开销，开启后首次订阅时懒注册、无订阅时自动注销。对齐 Semi responsiveObservebooleanfalse
responsiveMap自定义断点配置（key 为 xs/sm/md/lg/xl/xxl，value 为 media query 字符串）；未传用默认断点。引用比较：inline 新对象会触发重注册，建议定义在组件外。对齐 Semi responsiveMapResponsiveMapdefaultResponsiveMap

Slots

名称说明
children受配置作用域覆盖的后代内容

Accessibility

  • direction=rtl 时渲染 `<div class="cd-rtl">` 承载方向作用域供 RTL 辅助技术读取（对齐 Semi .semi-rtl）；其余方向 renderless 无 DOM、不打断 a11y 树；推荐宿主同步 html lang/dir。