@qw-ui/core 0.3.0-next.8 → 0.3.0

package/dist/safe-area/safe-area.d.ts

@@ -0,0 +1,28 @@
+/** Beta passive, physical-edge safe-area layout. All rules are shared across adapters. */
+export declare const SAFE_AREA_EDGES: readonly ["top", "right", "bottom", "left"];
+export declare const SAFE_AREA_MODES: readonly ["padding", "margin"];
+export declare const SAFE_AREA_MINIMUM_PRESETS: readonly ["none", "sm", "md", "lg"];
+export type SafeAreaEdge = (typeof SAFE_AREA_EDGES)[number];
+export type SafeAreaMode = (typeof SAFE_AREA_MODES)[number];
+export interface QwSafeAreaProps {
+    /** Protected physical edges, default bottom. An empty list disables all edges. */
+    edges?: readonly SafeAreaEdge[];
+    /** Apply protection as padding or margin; default padding. Margin follows CSS collapse rules. */
+    mode?: SafeAreaMode;
+    /** Minimum per selected edge: none/sm/md/lg, nonnegative pixels or CSS length. Default none. */
+    minInset?: number | string;
+}
+export interface ResolvedSafeAreaState {
+    edges: readonly SafeAreaEdge[];
+    mode: SafeAreaMode;
+    minimum: string;
+}
+export declare function resolveSafeAreaState(props?: QwSafeAreaProps): ResolvedSafeAreaState;
+export interface SafeAreaRootProps {
+    "data-scope": "safe-area";
+    "data-part": "root";
+    "data-mode": SafeAreaMode;
+    "data-edges": string;
+}
+export declare function getSafeAreaRootProps(state: ResolvedSafeAreaState): SafeAreaRootProps;
+export declare function getSafeAreaStyle(state: ResolvedSafeAreaState): Readonly<Record<string, string>>;

package/dist/search-bar/index.js

@@ -150,6 +150,8 @@ function connect(service, normalizeProps) {
 				role: "searchbox",
 				value,
 				placeholder: prop("placeholder"),
+				"aria-label": prop("labelledBy")?.trim() ? void 0 : prop("accessibleLabel"),
+				"aria-labelledby": prop("labelledBy")?.trim() || void 0,
 				disabled,
 				readOnly,
 				maxLength: maxLength && maxLength > 0 ? maxLength : void 0,
@@ -169,7 +171,7 @@ function connect(service, normalizeProps) {
 				},
 				onChange(event) {
 					const target = event.target;
-					const isComposing = !!event.nativeEvent?.isComposing;
+					const isComposing = !!(event.nativeEvent ?? event).isComposing;
 					let next = target.value;
 					if (!isComposing) {
 						const maxLen = prop("maxLength") ?? 0;
@@ -195,7 +197,7 @@ function connect(service, normalizeProps) {
 				"data-part": "clear-button",
 				type: "button",
 				disabled: disabled || readOnly,
-				"aria-label": "清除搜索内容",
+				"aria-label": prop("clearLabel") ?? "清除搜索内容",
 				"aria-hidden": !showClear,
 				hidden: !showClear,
 				onClick() {

package/dist/search-bar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/search-bar/search-bar.ts"],"sourcesContent":["import { createMachine } from \"@zag-js/core\";\nimport type { MachineSchema, Service } from \"@zag-js/core\";\nimport type { PropTypes, NormalizeProps } from \"@zag-js/types\";\nimport type { JSX } from \"@zag-js/types\";\nimport { compact } from \"@zag-js/utils\";\n\n/**\n * 清除按钮显示策略。\n */\nexport type SearchBarClearable = boolean | { showWhen?: \"always\" | \"focus\" | \"non-empty\" };\n\n/**\n * 内部归一化后的显示策略（包含 `never`，表示 `clearable={false}`）。\n */\nexport type SearchBarClearableMode = \"always\" | \"focus\" | \"non-empty\" | \"never\";\n\nexport interface SearchBarClearableConfig {\n  showWhen: SearchBarClearableMode;\n}\n\n/**\n * 右侧 action 按钮角色。\n */\nexport type SearchBarActionType = \"cancel\" | \"search\";\n\n/**\n * 右侧 action 按钮配置。\n */\nexport interface SearchBarAction {\n  /** 按钮角色。 */\n  type: SearchBarActionType;\n  /** 展示内容：文案或自定义节点。 */\n  content: string | unknown;\n  /** 取消时是否清空输入。 */\n  clearOnCancel?: boolean;\n  /** 按钮可访问名称；当 content 为纯图标时必填。 */\n  ariaLabel?: string;\n}\n\n/**\n * SearchBar 公共 props 契约（双栈共享）。\n */\nexport interface QwSearchBarProps {\n  /** 唯一 id 前缀。 */\n  id?: string;\n  /** 受控值。 */\n  value?: string;\n  /** 非受控初始值。 */\n  defaultValue?: string;\n  /** 占位符。 */\n  placeholder?: string;\n  /** 最大字符数。 */\n  maxLength?: number;\n  /** 禁用态。 */\n  disabled?: boolean;\n  /** 只读态。 */\n  readOnly?: boolean;\n  /** 清除按钮配置。 */\n  clearable?: SearchBarClearable;\n  /** 左侧搜索图标：字符串文案或自定义节点。 */\n  searchIcon?: string | unknown;\n  /** 左侧按钮配置。 */\n  prefix?: SearchBarAction;\n  /** 右侧按钮配置。 */\n  action?: SearchBarAction;\n  /** 输入变化回调。 */\n  onChange?: (value: string) => void;\n  /** 搜索确认回调（Enter 或点击搜索按钮）。 */\n  onSearch?: (value: string) => void;\n  /** 清空回调。 */\n  onClear?: () => void;\n  /** 取消回调。 */\n  onCancel?: () => void;\n  /** 聚焦回调。 */\n  onFocus?: () => void;\n  /** 失焦回调。 */\n  onBlur?: () => void;\n}\n\n/**\n * 内部 schema，用于 createMachine 类型推导。\n */\ninterface SearchBarSchema extends MachineSchema {\n  props: QwSearchBarProps;\n  context: {\n    value: string;\n    focused: boolean;\n  };\n  computed: {\n    showClear: boolean;\n    clearableConfig: SearchBarClearableConfig;\n  };\n  state: \"idle\";\n  event:\n    | { type: \"VALUE.SET\"; value: string; src?: string }\n    | { type: \"VALUE.CLEAR\" }\n    | { type: \"FOCUS.SET\"; focused: boolean }\n    | { type: \"SEARCH\" }\n    | { type: \"CANCEL\"; src?: \"prefix\" | \"action\" };\n  action:\n    | \"setValue\"\n    | \"clearValue\"\n    | \"setFocused\"\n    | \"invokeOnSearch\"\n    | \"invokeOnClear\"\n    | \"invokeOnCancel\"\n    | \"invokeOnFocus\"\n    | \"invokeOnBlur\";\n}\n\n/**\n * 解析 clearable 配置为统一对象。\n */\nfunction normalizeClearable(clearable?: SearchBarClearable): SearchBarClearableConfig {\n  if (clearable === false) return { showWhen: \"never\" };\n  if (clearable === true || clearable == null) return { showWhen: \"non-empty\" };\n  return { showWhen: clearable.showWhen ?? \"non-empty\" };\n}\n\n/**\n * SearchBar zag.js machine。\n * 所有交互逻辑唯一来源：value、focus、clear、action、keyboard。\n */\nexport const machine = createMachine<SearchBarSchema>({\n  props({ props }) {\n    return {\n      defaultValue: \"\",\n      disabled: false,\n      readOnly: false,\n      ...props,\n    };\n  },\n\n  initialState() {\n    return \"idle\";\n  },\n\n  context({ bindable, prop }) {\n    return {\n      value: bindable<string>(() => {\n        const controlledValue = prop(\"value\");\n        return {\n          defaultValue: prop(\"defaultValue\") ?? \"\",\n          sync: true,\n          ...(controlledValue !== undefined ? { value: controlledValue } : {}),\n          onChange(value, prev) {\n            if (value !== prev) {\n              prop(\"onChange\")?.(value);\n            }\n          },\n        };\n      }),\n      focused: bindable(() => ({\n        defaultValue: false,\n      })),\n    };\n  },\n\n  computed: {\n    clearableConfig({ prop }) {\n      return normalizeClearable(prop(\"clearable\"));\n    },\n    showClear({ context, computed }) {\n      const cfg = computed(\"clearableConfig\");\n      if (cfg.showWhen === \"always\") return true;\n      if (cfg.showWhen === \"never\") return false;\n      if (cfg.showWhen === \"focus\") return context.get(\"focused\");\n      return context.get(\"value\").length > 0;\n    },\n  },\n\n  watch({ track, prop, context }) {\n    track([() => prop(\"value\")], () => {\n      const external = prop(\"value\");\n      if (external !== undefined && external !== context.get(\"value\")) {\n        context.set(\"value\", external);\n      }\n    });\n  },\n\n  states: {\n    idle: {\n      on: {\n        \"VALUE.SET\": {\n          actions: [\"setValue\"],\n        },\n        \"VALUE.CLEAR\": {\n          actions: [\"clearValue\", \"invokeOnClear\"],\n        },\n        \"FOCUS.SET\": {\n          actions: [\"setFocused\"],\n        },\n        SEARCH: {\n          actions: [\"invokeOnSearch\"],\n        },\n        CANCEL: {\n          actions: [\"invokeOnCancel\"],\n        },\n      },\n    },\n  },\n\n  implementations: {\n    actions: {\n      setValue({ context, event, prop }) {\n        if (event.type === \"VALUE.SET\") {\n          const maxLength = prop(\"maxLength\") ?? 0;\n          const current = context.get(\"value\");\n          let next = event.value;\n          if (maxLength > 0 && next.length > maxLength) {\n            // 达到 maxLength 后阻止继续输入，保留旧值\n            next = current;\n          }\n          context.set(\"value\", next);\n        }\n      },\n      clearValue({ context }) {\n        context.set(\"value\", \"\");\n      },\n      setFocused({ context, event, prop }) {\n        if (event.type === \"FOCUS.SET\") {\n          const next = event.focused;\n          const prev = context.get(\"focused\");\n          context.set(\"focused\", next);\n          if (next && !prev) prop(\"onFocus\")?.();\n          if (!next && prev) prop(\"onBlur\")?.();\n        }\n      },\n      invokeOnSearch({ context, prop }) {\n        prop(\"onSearch\")?.(context.get(\"value\"));\n      },\n      invokeOnClear({ prop }) {\n        prop(\"onClear\")?.();\n      },\n      invokeOnCancel({ context, prop, event }) {\n        const config = event.src === \"prefix\" ? prop(\"prefix\") : prop(\"action\");\n        if (config?.type === \"cancel\" && config.clearOnCancel && !prop(\"readOnly\")) {\n          context.set(\"value\", \"\");\n        }\n        prop(\"onCancel\")?.();\n      },\n      invokeOnFocus() {\n        // focus 回调在 setFocused 中已触发\n      },\n      invokeOnBlur() {\n        // blur 回调在 setFocused 中已触发\n      },\n    },\n  },\n});\n\n/**\n * SearchBar api 类型（由 connect 返回）。\n */\nexport interface SearchBarApi<T extends PropTypes = PropTypes> {\n  /** 当前输入值。 */\n  value: string;\n  /** 当前是否聚焦。 */\n  focused: boolean;\n  /** 是否显示清除按钮。 */\n  showClear: boolean;\n  /** 清空输入。 */\n  clear(): void;\n  /** 触发搜索。 */\n  search(): void;\n  /** 根容器 prop-getter。 */\n  getRootProps(): T[\"element\"];\n  /** 输入区容器 prop-getter（包含图标、输入框、清除按钮）。 */\n  getFieldProps(): T[\"element\"];\n  /** 输入框 prop-getter。 */\n  getInputProps(): T[\"input\"];\n  /** 左侧图标 prop-getter。 */\n  getIconProps(): T[\"element\"];\n  /** 清除按钮 prop-getter。 */\n  getClearButtonProps(): T[\"button\"];\n  /** 左侧 prefix 按钮 prop-getter。 */\n  getPrefixButtonProps(): T[\"button\"];\n  /** 右侧 action 按钮 prop-getter。 */\n  getActionButtonProps(): T[\"button\"];\n}\n\n/**\n * connect：把 service 接成业务友好的 prop-getter。\n * 适配层只需调用 connect(service, normalizeProps)。\n */\nexport function connect<T extends PropTypes>(service: Service<SearchBarSchema>, normalizeProps: NormalizeProps<T>): SearchBarApi<T> {\n  const { context, computed, prop, send } = service;\n\n  const value = context.get(\"value\");\n  const focused = context.get(\"focused\");\n  const showClear = computed(\"showClear\");\n  const disabled = !!prop(\"disabled\");\n  const readOnly = !!prop(\"readOnly\");\n  const maxLength = prop(\"maxLength\");\n  const prefix = prop(\"prefix\");\n  const action = prop(\"action\");\n\n  return {\n    value,\n    focused,\n    showClear,\n\n    clear() {\n      send({ type: \"VALUE.CLEAR\" });\n    },\n\n    search() {\n      send({ type: \"SEARCH\" });\n    },\n\n    getRootProps() {\n      return normalizeProps.element(\n        compact({\n          \"data-scope\": \"search-bar\",\n          \"data-part\": \"root\",\n          // readOnly/disabled 时输入区仍可聚焦（readOnly HTML 语义），但不应呈现聚焦视觉态\n          \"data-focused\": focused && !readOnly && !disabled ? \"true\" : undefined,\n          \"data-disabled\": disabled ? \"true\" : undefined,\n          \"data-readonly\": readOnly ? \"true\" : undefined,\n        }),\n      );\n    },\n\n    getFieldProps() {\n      return normalizeProps.element(\n        compact({\n          \"data-scope\": \"search-bar\",\n          \"data-part\": \"field\",\n        }),\n      );\n    },\n\n    getInputProps() {\n      return normalizeProps.input(\n        compact({\n          \"data-scope\": \"search-bar\",\n          \"data-part\": \"input\",\n          type: \"search\" as const,\n          role: \"searchbox\" as const,\n          value,\n          placeholder: prop(\"placeholder\"),\n          disabled,\n          readOnly,\n          maxLength: maxLength && maxLength > 0 ? maxLength : undefined,\n          \"aria-disabled\": disabled ? (\"true\" as const) : undefined,\n          \"aria-readonly\": readOnly ? (\"true\" as const) : undefined,\n          onFocus() {\n            send({ type: \"FOCUS.SET\", focused: true });\n          },\n          onBlur() {\n            send({ type: \"FOCUS.SET\", focused: false });\n          },\n          onChange(event: JSX.ChangeEvent<HTMLInputElement>) {\n            const target = event.target as HTMLInputElement;\n            const nativeEvent = (event as { nativeEvent?: { isComposing?: boolean } }).nativeEvent;\n            const isComposing = !!nativeEvent?.isComposing;\n            let next = target.value;\n            // IME composing 期间跳过 maxLength 截断，允许拼音中间态值流过\n            if (!isComposing) {\n              const maxLen = prop(\"maxLength\") ?? 0;\n              if (maxLen > 0 && next.length > maxLen) {\n                next = next.slice(0, maxLen);\n              }\n            }\n            // 直接同步更新，绕过 send() 的 queueMicrotask 延迟\n            context.set(\"value\", next);\n          },\n          onKeyDown(event: JSX.KeyboardEvent<HTMLInputElement>) {\n            if (event.key === \"Enter\") {\n              send({ type: \"SEARCH\" });\n            }\n          },\n        }),\n      );\n    },\n\n    getIconProps() {\n      return normalizeProps.element(\n        compact({\n          \"data-scope\": \"search-bar\",\n          \"data-part\": \"icon\",\n          \"aria-hidden\": \"true\" as const,\n        }),\n      );\n    },\n\n    getClearButtonProps() {\n      return normalizeProps.button(\n        compact({\n          \"data-scope\": \"search-bar\",\n          \"data-part\": \"clear-button\",\n          type: \"button\" as const,\n          disabled: disabled || readOnly,\n          \"aria-label\": \"清除搜索内容\" as const,\n          \"aria-hidden\": !showClear,\n          hidden: !showClear,\n          onClick() {\n            send({ type: \"VALUE.CLEAR\" });\n          },\n        }),\n      );\n    },\n\n    getPrefixButtonProps() {\n      return normalizeProps.button(\n        compact({\n          \"data-scope\": \"search-bar\",\n          \"data-part\": \"prefix-button\",\n          type: \"button\" as const,\n          disabled,\n          \"aria-label\": prefix?.ariaLabel,\n          \"data-action\": prefix?.type,\n          onClick() {\n            if (prefix?.type === \"cancel\") {\n              send({ type: \"CANCEL\", src: \"prefix\" });\n            } else if (prefix?.type === \"search\") {\n              send({ type: \"SEARCH\" });\n            }\n          },\n        }),\n      );\n    },\n\n    getActionButtonProps() {\n      return normalizeProps.button(\n        compact({\n          \"data-scope\": \"search-bar\",\n          \"data-part\": \"action-button\",\n          type: \"button\" as const,\n          disabled,\n          \"aria-label\": action?.ariaLabel,\n          \"data-action\": action?.type,\n          onClick() {\n            if (action?.type === \"cancel\") {\n              send({ type: \"CANCEL\", src: \"action\" });\n            } else if (action?.type === \"search\") {\n              send({ type: \"SEARCH\" });\n            }\n          },\n        }),\n      );\n    },\n  };\n}\n\n/**\n * 把 QwSearchBarProps 转成 machine context（默认值收口）。\n */\nexport function createSearchBarProps(props: QwSearchBarProps = {}): Partial<QwSearchBarProps> {\n  return {\n    defaultValue: props.defaultValue ?? \"\",\n    disabled: props.disabled ?? false,\n    readOnly: props.readOnly ?? false,\n    ...props,\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/search-bar/search-bar.ts"],"sourcesContent":["import { createMachine } from \"@zag-js/core\";\nimport type { MachineSchema, Service } from \"@zag-js/core\";\nimport type { PropTypes, NormalizeProps } from \"@zag-js/types\";\nimport type { JSX } from \"@zag-js/types\";\nimport { compact } from \"@zag-js/utils\";\n\n/**\n * 清除按钮显示策略。\n */\nexport type SearchBarClearable = boolean | { showWhen?: \"always\" | \"focus\" | \"non-empty\" };\n\n/**\n * 内部归一化后的显示策略（包含 `never`，表示 `clearable={false}`）。\n */\nexport type SearchBarClearableMode = \"always\" | \"focus\" | \"non-empty\" | \"never\";\n\nexport interface SearchBarClearableConfig {\n  showWhen: SearchBarClearableMode;\n}\n\n/**\n * 右侧 action 按钮角色。\n */\nexport type SearchBarActionType = \"cancel\" | \"search\";\n\n/**\n * 右侧 action 按钮配置。\n */\nexport interface SearchBarAction {\n  /** 按钮角色。 */\n  type: SearchBarActionType;\n  /** 展示内容：文案或自定义节点。 */\n  content: string | unknown;\n  /** 取消时是否清空输入。 */\n  clearOnCancel?: boolean;\n  /** 按钮可访问名称；当 content 为纯图标时必填。 */\n  ariaLabel?: string;\n}\n\n/**\n * SearchBar 公共 props 契约（双栈共享）。\n */\nexport interface QwSearchBarProps {\n  /** 唯一 id 前缀。 */\n  id?: string;\n  /** 受控值。 */\n  value?: string;\n  /** 非受控初始值。 */\n  defaultValue?: string;\n  /** 占位符。 */\n  placeholder?: string;\n  /** 搜索框的可访问名称；可见标签优先使用 labelledBy 关联。 */\n  accessibleLabel?: string;\n  /** 可见标签节点的 ID，可用空格分隔多个 ID；优先于 accessibleLabel。 */\n  labelledBy?: string;\n  /** 最大字符数。 */\n  maxLength?: number;\n  /** 禁用态。 */\n  disabled?: boolean;\n  /** 只读态。 */\n  readOnly?: boolean;\n  /** 清除按钮配置。 */\n  clearable?: SearchBarClearable;\n  /** 清除按钮 aria-label，默认「清除搜索内容」。 */\n  clearLabel?: string;\n  /** 左侧搜索图标：字符串文案或自定义节点。 */\n  searchIcon?: string | unknown;\n  /** 左侧按钮配置。 */\n  prefix?: SearchBarAction;\n  /** 右侧按钮配置。 */\n  action?: SearchBarAction;\n  /** 输入变化回调。 */\n  onChange?: (value: string) => void;\n  /** 搜索确认回调（Enter 或点击搜索按钮）。 */\n  onSearch?: (value: string) => void;\n  /** 清空回调。 */\n  onClear?: () => void;\n  /** 取消回调。 */\n  onCancel?: () => void;\n  /** 聚焦回调。 */\n  onFocus?: () => void;\n  /** 失焦回调。 */\n  onBlur?: () => void;\n}\n\n/**\n * 内部 schema，用于 createMachine 类型推导。\n */\ninterface SearchBarSchema extends MachineSchema {\n  props: QwSearchBarProps;\n  context: {\n    value: string;\n    focused: boolean;\n  };\n  computed: {\n    showClear: boolean;\n    clearableConfig: SearchBarClearableConfig;\n  };\n  state: \"idle\";\n  event:\n    | { type: \"VALUE.SET\"; value: string; src?: string }\n    | { type: \"VALUE.CLEAR\" }\n    | { type: \"FOCUS.SET\"; focused: boolean }\n    | { type: \"SEARCH\" }\n    | { type: \"CANCEL\"; src?: \"prefix\" | \"action\" };\n  action:\n    | \"setValue\"\n    | \"clearValue\"\n    | \"setFocused\"\n    | \"invokeOnSearch\"\n    | \"invokeOnClear\"\n    | \"invokeOnCancel\"\n    | \"invokeOnFocus\"\n    | \"invokeOnBlur\";\n}\n\n/**\n * 解析 clearable 配置为统一对象。\n */\nfunction normalizeClearable(clearable?: SearchBarClearable): SearchBarClearableConfig {\n  if (clearable === false) return { showWhen: \"never\" };\n  if (clearable === true || clearable == null) return { showWhen: \"non-empty\" };\n  return { showWhen: clearable.showWhen ?? \"non-empty\" };\n}\n\n/**\n * SearchBar zag.js machine。\n * 所有交互逻辑唯一来源：value、focus、clear、action、keyboard。\n */\nexport const machine = createMachine<SearchBarSchema>({\n  props({ props }) {\n    return {\n      defaultValue: \"\",\n      disabled: false,\n      readOnly: false,\n      ...props,\n    };\n  },\n\n  initialState() {\n    return \"idle\";\n  },\n\n  context({ bindable, prop }) {\n    return {\n      value: bindable<string>(() => {\n        const controlledValue = prop(\"value\");\n        return {\n          defaultValue: prop(\"defaultValue\") ?? \"\",\n          sync: true,\n          ...(controlledValue !== undefined ? { value: controlledValue } : {}),\n          onChange(value, prev) {\n            if (value !== prev) {\n              prop(\"onChange\")?.(value);\n            }\n          },\n        };\n      }),\n      focused: bindable(() => ({\n        defaultValue: false,\n      })),\n    };\n  },\n\n  computed: {\n    clearableConfig({ prop }) {\n      return normalizeClearable(prop(\"clearable\"));\n    },\n    showClear({ context, computed }) {\n      const cfg = computed(\"clearableConfig\");\n      if (cfg.showWhen === \"always\") return true;\n      if (cfg.showWhen === \"never\") return false;\n      if (cfg.showWhen === \"focus\") return context.get(\"focused\");\n      return context.get(\"value\").length > 0;\n    },\n  },\n\n  watch({ track, prop, context }) {\n    track([() => prop(\"value\")], () => {\n      const external = prop(\"value\");\n      if (external !== undefined && external !== context.get(\"value\")) {\n        context.set(\"value\", external);\n      }\n    });\n  },\n\n  states: {\n    idle: {\n      on: {\n        \"VALUE.SET\": {\n          actions: [\"setValue\"],\n        },\n        \"VALUE.CLEAR\": {\n          actions: [\"clearValue\", \"invokeOnClear\"],\n        },\n        \"FOCUS.SET\": {\n          actions: [\"setFocused\"],\n        },\n        SEARCH: {\n          actions: [\"invokeOnSearch\"],\n        },\n        CANCEL: {\n          actions: [\"invokeOnCancel\"],\n        },\n      },\n    },\n  },\n\n  implementations: {\n    actions: {\n      setValue({ context, event, prop }) {\n        if (event.type === \"VALUE.SET\") {\n          const maxLength = prop(\"maxLength\") ?? 0;\n          const current = context.get(\"value\");\n          let next = event.value;\n          if (maxLength > 0 && next.length > maxLength) {\n            // 达到 maxLength 后阻止继续输入，保留旧值\n            next = current;\n          }\n          context.set(\"value\", next);\n        }\n      },\n      clearValue({ context }) {\n        context.set(\"value\", \"\");\n      },\n      setFocused({ context, event, prop }) {\n        if (event.type === \"FOCUS.SET\") {\n          const next = event.focused;\n          const prev = context.get(\"focused\");\n          context.set(\"focused\", next);\n          if (next && !prev) prop(\"onFocus\")?.();\n          if (!next && prev) prop(\"onBlur\")?.();\n        }\n      },\n      invokeOnSearch({ context, prop }) {\n        prop(\"onSearch\")?.(context.get(\"value\"));\n      },\n      invokeOnClear({ prop }) {\n        prop(\"onClear\")?.();\n      },\n      invokeOnCancel({ context, prop, event }) {\n        const config = event.src === \"prefix\" ? prop(\"prefix\") : prop(\"action\");\n        if (config?.type === \"cancel\" && config.clearOnCancel && !prop(\"readOnly\")) {\n          context.set(\"value\", \"\");\n        }\n        prop(\"onCancel\")?.();\n      },\n      invokeOnFocus() {\n        // focus 回调在 setFocused 中已触发\n      },\n      invokeOnBlur() {\n        // blur 回调在 setFocused 中已触发\n      },\n    },\n  },\n});\n\n/**\n * SearchBar api 类型（由 connect 返回）。\n */\nexport interface SearchBarApi<T extends PropTypes = PropTypes> {\n  /** 当前输入值。 */\n  value: string;\n  /** 当前是否聚焦。 */\n  focused: boolean;\n  /** 是否显示清除按钮。 */\n  showClear: boolean;\n  /** 清空输入。 */\n  clear(): void;\n  /** 触发搜索。 */\n  search(): void;\n  /** 根容器 prop-getter。 */\n  getRootProps(): T[\"element\"];\n  /** 输入区容器 prop-getter（包含图标、输入框、清除按钮）。 */\n  getFieldProps(): T[\"element\"];\n  /** 输入框 prop-getter。 */\n  getInputProps(): T[\"input\"];\n  /** 左侧图标 prop-getter。 */\n  getIconProps(): T[\"element\"];\n  /** 清除按钮 prop-getter。 */\n  getClearButtonProps(): T[\"button\"];\n  /** 左侧 prefix 按钮 prop-getter。 */\n  getPrefixButtonProps(): T[\"button\"];\n  /** 右侧 action 按钮 prop-getter。 */\n  getActionButtonProps(): T[\"button\"];\n}\n\n/**\n * connect：把 service 接成业务友好的 prop-getter。\n * 适配层只需调用 connect(service, normalizeProps)。\n */\nexport function connect<T extends PropTypes>(service: Service<SearchBarSchema>, normalizeProps: NormalizeProps<T>): SearchBarApi<T> {\n  const { context, computed, prop, send } = service;\n\n  const value = context.get(\"value\");\n  const focused = context.get(\"focused\");\n  const showClear = computed(\"showClear\");\n  const disabled = !!prop(\"disabled\");\n  const readOnly = !!prop(\"readOnly\");\n  const maxLength = prop(\"maxLength\");\n  const prefix = prop(\"prefix\");\n  const action = prop(\"action\");\n\n  return {\n    value,\n    focused,\n    showClear,\n\n    clear() {\n      send({ type: \"VALUE.CLEAR\" });\n    },\n\n    search() {\n      send({ type: \"SEARCH\" });\n    },\n\n    getRootProps() {\n      return normalizeProps.element(\n        compact({\n          \"data-scope\": \"search-bar\",\n          \"data-part\": \"root\",\n          // readOnly/disabled 时输入区仍可聚焦（readOnly HTML 语义），但不应呈现聚焦视觉态\n          \"data-focused\": focused && !readOnly && !disabled ? \"true\" : undefined,\n          \"data-disabled\": disabled ? \"true\" : undefined,\n          \"data-readonly\": readOnly ? \"true\" : undefined,\n        }),\n      );\n    },\n\n    getFieldProps() {\n      return normalizeProps.element(\n        compact({\n          \"data-scope\": \"search-bar\",\n          \"data-part\": \"field\",\n        }),\n      );\n    },\n\n    getInputProps() {\n      return normalizeProps.input(\n        compact({\n          \"data-scope\": \"search-bar\",\n          \"data-part\": \"input\",\n          type: \"search\" as const,\n          role: \"searchbox\" as const,\n          value,\n          placeholder: prop(\"placeholder\"),\n          \"aria-label\": prop(\"labelledBy\")?.trim() ? undefined : prop(\"accessibleLabel\"),\n          \"aria-labelledby\": prop(\"labelledBy\")?.trim() || undefined,\n          disabled,\n          readOnly,\n          maxLength: maxLength && maxLength > 0 ? maxLength : undefined,\n          \"aria-disabled\": disabled ? (\"true\" as const) : undefined,\n          \"aria-readonly\": readOnly ? (\"true\" as const) : undefined,\n          onFocus() {\n            send({ type: \"FOCUS.SET\", focused: true });\n          },\n          onBlur() {\n            send({ type: \"FOCUS.SET\", focused: false });\n          },\n          onChange(event: JSX.ChangeEvent<HTMLInputElement>) {\n            const target = event.target as HTMLInputElement;\n            const nativeEvent = (event as { nativeEvent?: { isComposing?: boolean } }).nativeEvent ?? event;\n            const isComposing = !!(nativeEvent as { isComposing?: boolean }).isComposing;\n            let next = target.value;\n            // IME composing 期间跳过 maxLength 截断，允许拼音中间态值流过\n            if (!isComposing) {\n              const maxLen = prop(\"maxLength\") ?? 0;\n              if (maxLen > 0 && next.length > maxLen) {\n                next = next.slice(0, maxLen);\n              }\n            }\n            // 直接同步更新，绕过 send() 的 queueMicrotask 延迟\n            context.set(\"value\", next);\n          },\n          onKeyDown(event: JSX.KeyboardEvent<HTMLInputElement>) {\n            if (event.key === \"Enter\") {\n              send({ type: \"SEARCH\" });\n            }\n          },\n        }),\n      );\n    },\n\n    getIconProps() {\n      return normalizeProps.element(\n        compact({\n          \"data-scope\": \"search-bar\",\n          \"data-part\": \"icon\",\n          \"aria-hidden\": \"true\" as const,\n        }),\n      );\n    },\n\n    getClearButtonProps() {\n      return normalizeProps.button(\n        compact({\n          \"data-scope\": \"search-bar\",\n          \"data-part\": \"clear-button\",\n          type: \"button\" as const,\n          disabled: disabled || readOnly,\n          \"aria-label\": prop(\"clearLabel\") ?? \"清除搜索内容\",\n          \"aria-hidden\": !showClear,\n          hidden: !showClear,\n          onClick() {\n            send({ type: \"VALUE.CLEAR\" });\n          },\n        }),\n      );\n    },\n\n    getPrefixButtonProps() {\n      return normalizeProps.button(\n        compact({\n          \"data-scope\": \"search-bar\",\n          \"data-part\": \"prefix-button\",\n          type: \"button\" as const,\n          disabled,\n          \"aria-label\": prefix?.ariaLabel,\n          \"data-action\": prefix?.type,\n          onClick() {\n            if (prefix?.type === \"cancel\") {\n              send({ type: \"CANCEL\", src: \"prefix\" });\n            } else if (prefix?.type === \"search\") {\n              send({ type: \"SEARCH\" });\n            }\n          },\n        }),\n      );\n    },\n\n    getActionButtonProps() {\n      return normalizeProps.button(\n        compact({\n          \"data-scope\": \"search-bar\",\n          \"data-part\": \"action-button\",\n          type: \"button\" as const,\n          disabled,\n          \"aria-label\": action?.ariaLabel,\n          \"data-action\": action?.type,\n          onClick() {\n            if (action?.type === \"cancel\") {\n              send({ type: \"CANCEL\", src: \"action\" });\n            } else if (action?.type === \"search\") {\n              send({ type: \"SEARCH\" });\n            }\n          },\n        }),\n      );\n    },\n  };\n}\n\n/**\n * 把 QwSearchBarProps 转成 machine context（默认值收口）。\n */\nexport function createSearchBarProps(props: QwSearchBarProps = {}): Partial<QwSearchBarProps> {\n  return {\n    defaultValue: props.defaultValue ?? \"\",\n    disabled: props.disabled ?? false,\n    readOnly: props.readOnly ?? false,\n    ...props,\n  };\n}\n"],"mappings":"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"}

package/dist/search-bar/search-bar.d.ts

@@ -42,6 +42,10 @@ export interface QwSearchBarProps {
     defaultValue?: string;
     /** 占位符。 */
     placeholder?: string;
+    /** 搜索框的可访问名称；可见标签优先使用 labelledBy 关联。 */
+    accessibleLabel?: string;
+    /** 可见标签节点的 ID，可用空格分隔多个 ID；优先于 accessibleLabel。 */
+    labelledBy?: string;
     /** 最大字符数。 */
     maxLength?: number;
     /** 禁用态。 */
@@ -50,6 +54,8 @@ export interface QwSearchBarProps {
     readOnly?: boolean;
     /** 清除按钮配置。 */
     clearable?: SearchBarClearable;
+    /** 清除按钮 aria-label，默认「清除搜索内容」。 */
+    clearLabel?: string;
     /** 左侧搜索图标：字符串文案或自定义节点。 */
     searchIcon?: string | unknown;
     /** 左侧按钮配置。 */

package/dist/segmented/index.d.ts

@@ -0,0 +1,2 @@
+export { SEGMENTED_MODES, SEGMENTED_SIZES, SEGMENTED_PARTS, normalizeSegmentedItems, normalizeSegmentedValue, createSegmentedProps, segmentedMachine, connect } from "./segmented.js";
+export type { SegmentedSelectionMode, SegmentedSize, SegmentedValueChangeDetails, QwSegmentedItem, QwSegmentedProps, QwSegmentedSchema, QwSegmentedMachine, QwSegmentedService, QwSegmentedItemProps, QwSegmentedItemState, QwSegmentedApi } from "./segmented.js";

package/dist/segmented/index.js

@@ -0,0 +1,2 @@
+import { a as createSegmentedProps, c as segmentedMachine, i as connect, n as SEGMENTED_PARTS, o as normalizeSegmentedItems, r as SEGMENTED_SIZES, s as normalizeSegmentedValue, t as SEGMENTED_MODES } from "../segmented-BaU38_L4.js";
+export { SEGMENTED_MODES, SEGMENTED_PARTS, SEGMENTED_SIZES, connect, createSegmentedProps, normalizeSegmentedItems, normalizeSegmentedValue, segmentedMachine };

package/dist/segmented/segmented.d.ts

@@ -0,0 +1,127 @@
+import { type Machine, type Service } from "@zag-js/core";
+import type { NormalizeProps, PropTypes } from "@zag-js/types";
+import { type QwSelectionItem } from "../selection.js";
+import { type IconNameInput, type IconState } from "../icon/index.js";
+/** Supported single/multiple selection modes. */
+export declare const SEGMENTED_MODES: readonly ["single", "multiple"];
+/** Existing T3 control-height sizes; large is the mobile default. */
+export declare const SEGMENTED_SIZES: readonly ["sm", "md", "lg"];
+/** Stable DOM parts shared by every adapter. */
+export declare const SEGMENTED_PARTS: readonly ["root", "label", "description", "items", "item", "input", "content", "icon", "text", "item-description"];
+export type SegmentedSelectionMode = (typeof SEGMENTED_MODES)[number];
+export type SegmentedSize = (typeof SEGMENTED_SIZES)[number];
+/** Accessible option name remains required even in icon-only presentation. */
+export interface QwSegmentedItem extends QwSelectionItem {
+    icon?: IconNameInput;
+    iconOnly?: boolean;
+}
+/** Requested ordered values; callers receive independent snapshots. */
+export interface SegmentedValueChangeDetails {
+    value: string[];
+}
+/** SSR-safe input shared by all adapters. */
+export interface QwSegmentedProps {
+    id?: string;
+    /** Visible, nonempty accessible group name rendered as legend. */
+    label: string;
+    description?: string;
+    /** External Field help/error references, merged with the control-owned description. */
+    describedBy?: string;
+    /** Unique nonempty values and nonempty accessible labels. */
+    items: QwSegmentedItem[];
+    selectionMode?: SegmentedSelectionMode;
+    /** Defined arrays, including [], are controlled. Unknown values are retained. */
+    value?: string[];
+    /** Initial value and form reset target; defaults to []. */
+    defaultValue?: string[];
+    /** Allow a selected single item to toggle off; defaults false. */
+    allowEmpty?: boolean;
+    /** Minimum/maximum apply only to multiple-mode user removals/additions. */
+    min?: number;
+    max?: number;
+    disabled?: boolean;
+    /** Block user selection while retaining focus and native submitted values. */
+    readOnly?: boolean;
+    /** Native form validation requires an enabled rendered selection. */
+    required?: boolean;
+    invalid?: boolean;
+    name?: string;
+    form?: string;
+    orientation?: "horizontal" | "vertical";
+    /** Standard HTML direction; auto/empty inherit the input's direction. */
+    dir?: string;
+    /** Keyboard navigation wraps by default. */
+    loop?: boolean;
+    /** Single-mode arrow/Home/End selection; defaults true. Multiple only focuses. */
+    selectOnFocus?: boolean;
+    size?: SegmentedSize;
+    block?: boolean;
+    /** Horizontal content scrolls with intrinsic option widths. */
+    scrollable?: boolean;
+    onValueChange?: (details: SegmentedValueChangeDetails) => void;
+}
+export interface QwSegmentedSchema {
+    props: QwSegmentedProps & {
+        selectionMode: SegmentedSelectionMode;
+        defaultValue: string[];
+        orientation: "horizontal" | "vertical";
+        loop: boolean;
+        selectOnFocus: boolean;
+        size: SegmentedSize;
+    };
+    context: {
+        value: string[];
+        focusedValue: string | null;
+        disabledIds: string[];
+    };
+    state: "ready";
+    action: "setValue" | "toggleValue" | "selectValue" | "setFocus" | "syncInputs" | "normalizeMode";
+    effect: "trackForm";
+    event: {
+        type: "VALUE.SET";
+        value: string[];
+    } | {
+        type: "VALUE.TOGGLE" | "VALUE.SELECT" | "FOCUS";
+        value: string;
+    };
+}
+export type QwSegmentedMachine = Machine<QwSegmentedSchema>;
+export type QwSegmentedService = Service<QwSegmentedSchema>;
+export interface QwSegmentedItemProps {
+    value: string;
+}
+export interface QwSegmentedItemState {
+    selected: boolean;
+    disabled: boolean;
+    readOnly: boolean;
+    iconOnly: boolean;
+}
+/** Validate accessible identities and copy every caller option. */
+export declare function normalizeSegmentedItems(items: readonly QwSegmentedItem[]): QwSegmentedItem[];
+/** Single selection retains the earliest unique caller value, including unknowns. */
+export declare function normalizeSegmentedValue(value?: readonly string[], mode?: SegmentedSelectionMode): string[];
+export declare function createSegmentedProps(props: QwSegmentedProps): Partial<QwSegmentedSchema["props"]>;
+/** One Zag bindable lifecycle; Core alone owns selection, keys and native forms. */
+export declare const segmentedMachine: QwSegmentedMachine;
+export interface QwSegmentedApi<T extends PropTypes = PropTypes> {
+    value: string[];
+    items: QwSegmentedItem[];
+    label: string;
+    description: string;
+    setValue(value: string[]): void;
+    toggleValue(value: string): void;
+    getRootProps(): T["element"];
+    getLabelProps(): T["element"];
+    getDescriptionProps(): T["element"];
+    getItemsProps(): T["element"];
+    getItemState(item: QwSegmentedItemProps): QwSegmentedItemState;
+    getItemProps(item: QwSegmentedItemProps): T["label"];
+    getInputProps(item: QwSegmentedItemProps): T["input"];
+    getContentProps(item: QwSegmentedItemProps): T["element"];
+    getItemIconProps(item: QwSegmentedItemProps): T["element"];
+    getItemIconState(item: QwSegmentedItemProps): IconState;
+    getTextProps(item: QwSegmentedItemProps): T["element"];
+    getItemDescriptionProps(item: QwSegmentedItemProps): T["element"];
+}
+/** Getters are SSR-pure; only client events/effects use the existing Zag DOM scope. */
+export declare function connect<T extends PropTypes>(service: QwSegmentedService, normalize: NormalizeProps<T>): QwSegmentedApi<T>;