@qw-ui/core 0.3.0-next.40 → 0.3.0-next.43

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;

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  /** 清除按钮 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          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\": 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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"}
+{"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;
     /** 禁用态。 */

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>;

package/dist/segmented-BaU38_L4.js

@@ -0,0 +1,367 @@
+import { o as resolveIconState } from "./icon-Cgdbnk1u.js";
+import { i as toggleSelectionValue, n as normalizeSelectionValue, r as selectionItemKey, t as normalizeSelectionItems } from "./selection-ivXqO1eu.js";
+import { t as mergeDescriptionIds } from "./aria-description-CimD2M_C.js";
+import { n as trackSelectionForm, t as syncSelectionInputs } from "./selection-form-BOM_odUk.js";
+import { createMachine } from "@zag-js/core";
+import { dataAttr, getComputedStyle, getEventKey, visuallyHiddenStyle } from "@zag-js/dom-query";
+//#region src/segmented/segmented.ts
+/** Supported single/multiple selection modes. */
+const SEGMENTED_MODES = ["single", "multiple"];
+/** Existing T3 control-height sizes; large is the mobile default. */
+const SEGMENTED_SIZES = [
+	"sm",
+	"md",
+	"lg"
+];
+/** Stable DOM parts shared by every adapter. */
+const SEGMENTED_PARTS = [
+	"root",
+	"label",
+	"description",
+	"items",
+	"item",
+	"input",
+	"content",
+	"icon",
+	"text",
+	"item-description"
+];
+/** Validate accessible identities and copy every caller option. */
+function normalizeSegmentedItems(items) {
+	return normalizeSelectionItems(items).map((entry) => {
+		const item = entry;
+		if (typeof item.label !== "string" || !item.label.trim()) throw new TypeError("Segmented item labels must be nonempty accessible text");
+		if (item.icon !== void 0 && typeof item.icon !== "string") throw new TypeError("Segmented icons must be system icon names");
+		if (item.iconOnly && !item.icon?.trim()) throw new TypeError("Segmented icon-only items require an icon and accessible label");
+		return { ...item };
+	});
+}
+/** Single selection retains the earliest unique caller value, including unknowns. */
+function normalizeSegmentedValue(value = [], mode = "single") {
+	const values = normalizeSelectionValue(value);
+	return mode === "single" ? values.slice(0, 1) : values;
+}
+function createSegmentedProps(props) {
+	if (typeof props.label !== "string" || !props.label.trim()) throw new TypeError("Segmented requires a nonempty accessible group label");
+	if (props.id !== void 0 && (typeof props.id !== "string" || !props.id.trim())) throw new TypeError("Segmented requires a nonempty instance id when provided");
+	const selectionMode = SEGMENTED_MODES.includes(props.selectionMode) ? props.selectionMode : "single";
+	return {
+		...props,
+		selectionMode,
+		items: normalizeSegmentedItems(props.items),
+		value: props.value === void 0 ? void 0 : normalizeSegmentedValue(props.value, selectionMode),
+		defaultValue: normalizeSegmentedValue(props.defaultValue, selectionMode),
+		orientation: props.orientation === "vertical" ? "vertical" : "horizontal",
+		loop: props.loop ?? true,
+		selectOnFocus: props.selectOnFocus ?? true,
+		size: SEGMENTED_SIZES.includes(props.size) ? props.size : "md"
+	};
+}
+const same = (a, b) => !!b && a.length === b.length && a.every((value, index) => value === b[index]);
+const rootId = (scope) => `segmented:${scope.id}`;
+const inputId = (scope, value) => `${rootId(scope)}:input:${selectionItemKey(value)}`;
+function currentValue(params) {
+	return normalizeSegmentedValue(params.context.get("value"), params.prop("selectionMode"));
+}
+function isDisabled(params, item) {
+	return !!params.prop("disabled") || !!item.disabled || params.context.get("disabledIds").includes(inputId(params.scope, item.value));
+}
+function sync(params) {
+	const values = currentValue(params);
+	syncSelectionInputs(params.scope, params.prop("items").map((item) => ({
+		id: inputId(params.scope, item.value),
+		checked: values.includes(item.value)
+	})));
+}
+function changeFor(params, value, selectOnly = false) {
+	const item = params.prop("items").find((entry) => entry.value === value);
+	if (!item || isDisabled(params, item) || params.prop("readOnly")) return null;
+	const values = currentValue(params);
+	if (params.prop("selectionMode") === "single") return values.includes(value) ? !selectOnly && params.prop("allowEmpty") ? [] : values : [value];
+	const result = toggleSelectionValue(values, item, {
+		min: params.prop("min"),
+		max: params.prop("max")
+	});
+	return result.blocked ? null : result.value;
+}
+/** One Zag bindable lifecycle; Core alone owns selection, keys and native forms. */
+const segmentedMachine = createMachine({
+	props: ({ props }) => createSegmentedProps({
+		...props,
+		label: props.label ?? "",
+		items: props.items ?? []
+	}),
+	initialState: () => "ready",
+	context({ prop, bindable }) {
+		return {
+			value: bindable(() => ({
+				defaultValue: prop("defaultValue"),
+				value: prop("value"),
+				isEqual: same,
+				onChange: (value) => prop("onValueChange")?.({ value: [...value] })
+			})),
+			focusedValue: bindable(() => ({ defaultValue: null })),
+			disabledIds: bindable(() => ({
+				defaultValue: [],
+				isEqual: same
+			}))
+		};
+	},
+	watch({ track, context, prop, action }) {
+		track([() => context.hash("value"), () => context.hash("disabledIds")], () => action(["syncInputs"]));
+		track([() => prop("selectionMode")], () => action(["normalizeMode"]));
+	},
+	effects: ["trackForm"],
+	on: {
+		"VALUE.SET": { actions: ["setValue"] },
+		"VALUE.TOGGLE": { actions: ["toggleValue"] },
+		"VALUE.SELECT": { actions: ["selectValue"] },
+		FOCUS: { actions: ["setFocus"] }
+	},
+	states: { ready: {} },
+	implementations: {
+		effects: { trackForm(params) {
+			return trackSelectionForm({
+				scope: params.scope,
+				rootId: rootId(params.scope),
+				form: () => params.prop("form"),
+				getState: () => params.prop("items").map((item) => ({
+					id: inputId(params.scope, item.value),
+					checked: currentValue(params).includes(item.value)
+				})),
+				onReset: () => params.context.set("value", normalizeSegmentedValue(params.prop("defaultValue"), params.prop("selectionMode"))),
+				onDisabledChange: (ids) => params.context.set("disabledIds", [...ids])
+			}).stop;
+		} },
+		actions: {
+			syncInputs: sync,
+			normalizeMode(params) {
+				params.context.set("value", currentValue(params));
+				queueMicrotask(() => sync(params));
+			},
+			setValue(params) {
+				if (params.event.type === "VALUE.SET") params.context.set("value", normalizeSegmentedValue(params.event.value, params.prop("selectionMode")));
+				queueMicrotask(() => sync(params));
+			},
+			toggleValue(params) {
+				if (params.event.type === "VALUE.TOGGLE") {
+					const values = changeFor(params, params.event.value);
+					if (values) params.context.set("value", values);
+				}
+				queueMicrotask(() => sync(params));
+			},
+			selectValue(params) {
+				if (params.event.type === "VALUE.SELECT") {
+					const values = changeFor(params, params.event.value, true);
+					if (values) params.context.set("value", values);
+				}
+				queueMicrotask(() => sync(params));
+			},
+			setFocus(params) {
+				if (params.event.type === "FOCUS") params.context.set("focusedValue", params.event.value);
+			}
+		}
+	}
+});
+/** Getters are SSR-pure; only client events/effects use the existing Zag DOM scope. */
+function connect(service, normalize) {
+	const id = rootId(service.scope), values = currentValue(service), items = service.prop("items");
+	const single = service.prop("selectionMode") === "single";
+	const enabled = items.filter((item) => !isDisabled(service, item));
+	const focused = service.context.get("focusedValue");
+	const tabAnchor = enabled.find((item) => item.value === focused) ?? enabled.find((item) => values.includes(item.value)) ?? enabled[0];
+	const requiredAnchor = service.prop("required") && !enabled.some((item) => values.includes(item.value)) ? enabled[0]?.value : void 0;
+	const resolve = ({ value }) => {
+		const item = items.find((entry) => entry.value === value);
+		if (!item) throw new RangeError("Segmented item is not present in items");
+		return item;
+	};
+	const part = (name) => ({
+		"data-scope": "segmented",
+		"data-part": name
+	});
+	const data = (item) => ({
+		"data-state": values.includes(item.value) ? "checked" : "unchecked",
+		"data-disabled": dataAttr(isDisabled(service, item)),
+		"data-readonly": dataAttr(service.prop("readOnly")),
+		"data-invalid": dataAttr(service.prop("invalid")),
+		"data-icon-only": dataAttr(item.iconOnly)
+	});
+	return {
+		value: [...values],
+		items: items.map((item) => ({ ...item })),
+		label: service.prop("label"),
+		description: service.prop("description") ?? "",
+		setValue: (value) => service.send({
+			type: "VALUE.SET",
+			value: normalizeSegmentedValue(value, service.prop("selectionMode"))
+		}),
+		toggleValue: (value) => service.send({
+			type: "VALUE.TOGGLE",
+			value
+		}),
+		getRootProps: () => normalize.element({
+			...part("root"),
+			id,
+			role: single ? "radiogroup" : "group",
+			disabled: !!service.prop("disabled"),
+			form: service.prop("form"),
+			dir: service.prop("dir"),
+			"aria-labelledby": `${id}:label`,
+			"aria-describedby": mergeDescriptionIds(service.prop("description") ? `${id}:description` : void 0, service.prop("describedBy")),
+			"aria-required": single && service.prop("required") || void 0,
+			"aria-readonly": single && service.prop("readOnly") || void 0,
+			"aria-disabled": service.prop("disabled") || items.length > 0 && !enabled.length || void 0,
+			"aria-invalid": service.prop("invalid") || void 0,
+			"data-selection-mode": service.prop("selectionMode"),
+			"data-orientation": service.prop("orientation"),
+			"data-size": service.prop("size"),
+			"data-block": dataAttr(service.prop("block")),
+			"data-scrollable": dataAttr(service.prop("scrollable")),
+			"data-disabled": dataAttr(service.prop("disabled")),
+			"data-readonly": dataAttr(service.prop("readOnly")),
+			"data-invalid": dataAttr(service.prop("invalid"))
+		}),
+		getLabelProps: () => normalize.element({
+			...part("label"),
+			id: `${id}:label`
+		}),
+		getDescriptionProps: () => normalize.element({
+			...part("description"),
+			id: `${id}:description`
+		}),
+		getItemsProps: () => normalize.element(part("items")),
+		getItemState: (props) => {
+			const item = resolve(props);
+			return {
+				selected: values.includes(item.value),
+				disabled: isDisabled(service, item),
+				readOnly: !!service.prop("readOnly"),
+				iconOnly: !!item.iconOnly
+			};
+		},
+		getItemProps: (props) => {
+			const item = resolve(props);
+			return normalize.label({
+				...part("item"),
+				...data(item),
+				htmlFor: inputId(service.scope, item.value)
+			});
+		},
+		getInputProps(props) {
+			const item = resolve(props), disabled = isDisabled(service, item);
+			return normalize.input({
+				...part("input"),
+				...data(item),
+				id: inputId(service.scope, item.value),
+				type: single ? "radio" : "checkbox",
+				value: item.value,
+				checked: values.includes(item.value),
+				disabled: !!service.prop("disabled") || !!item.disabled,
+				readOnly: !!service.prop("readOnly"),
+				name: disabled ? void 0 : service.prop("name") || (single ? service.scope.id : void 0),
+				form: service.prop("form"),
+				required: single ? !!service.prop("required") && !disabled : requiredAnchor === item.value,
+				tabIndex: single ? tabAnchor?.value === item.value ? 0 : -1 : 0,
+				"aria-checked": values.includes(item.value),
+				"aria-readonly": !single && service.prop("readOnly") || void 0,
+				"aria-invalid": service.prop("invalid") || void 0,
+				"aria-labelledby": `${id}:text:${selectionItemKey(item.value)}`,
+				"aria-describedby": item.description ? `${id}:description:${selectionItemKey(item.value)}` : void 0,
+				style: visuallyHiddenStyle,
+				onChange() {},
+				onFocus() {
+					service.send({
+						type: "FOCUS",
+						value: item.value
+					});
+				},
+				onClick(event) {
+					if (event.defaultPrevented) return;
+					if (!changeFor(service, item.value)) event.preventDefault();
+					service.send({
+						type: "VALUE.TOGGLE",
+						value: item.value
+					});
+					queueMicrotask(() => sync(service));
+				},
+				onKeyDown(event) {
+					if (event.defaultPrevented || event.ctrlKey || event.altKey || event.metaKey) return;
+					if (event.key === " " || event.key === "Enter") {
+						event.preventDefault();
+						if (!event.repeat) service.send({
+							type: "VALUE.TOGGLE",
+							value: item.value
+						});
+						queueMicrotask(() => sync(service));
+						return;
+					}
+					if (![
+						"ArrowLeft",
+						"ArrowRight",
+						"ArrowUp",
+						"ArrowDown",
+						"Home",
+						"End"
+					].includes(event.key)) return;
+					event.preventDefault();
+					const candidates = service.prop("items").filter((entry) => !isDisabled(service, entry));
+					if (!candidates.length || isDisabled(service, item)) return;
+					const direction = service.prop("dir");
+					const key = getEventKey(event, { dir: direction === "rtl" || direction === "ltr" ? direction : getComputedStyle(event.currentTarget).direction === "rtl" ? "rtl" : "ltr" }), index = candidates.findIndex((entry) => entry.value === item.value);
+					let target = key === "Home" ? 0 : key === "End" ? candidates.length - 1 : index + (key === "ArrowRight" || key === "ArrowDown" ? 1 : -1);
+					if (service.prop("loop")) target = (target + candidates.length) % candidates.length;
+					const next = candidates[target];
+					if (!next) return;
+					service.scope.getById(inputId(service.scope, next.value))?.focus();
+					service.send({
+						type: "FOCUS",
+						value: next.value
+					});
+					if (service.prop("selectionMode") === "single" && service.prop("selectOnFocus")) service.send({
+						type: "VALUE.SELECT",
+						value: next.value
+					});
+				}
+			});
+		},
+		getContentProps: (props) => normalize.element({
+			...part("content"),
+			...data(resolve(props))
+		}),
+		getItemIconProps: (props) => {
+			const item = resolve(props);
+			return normalize.element({
+				...part("icon"),
+				hidden: !item.icon,
+				"aria-hidden": true
+			});
+		},
+		getItemIconState: (props) => {
+			const item = resolve(props);
+			return resolveIconState({
+				id: `${id}:icon:${selectionItemKey(item.value)}`,
+				name: item.icon || "component"
+			});
+		},
+		getTextProps: (props) => {
+			const item = resolve(props);
+			return normalize.element({
+				...part("text"),
+				id: `${id}:text:${selectionItemKey(item.value)}`,
+				style: item.iconOnly ? visuallyHiddenStyle : void 0
+			});
+		},
+		getItemDescriptionProps: (props) => {
+			const item = resolve(props);
+			return normalize.element({
+				...part("item-description"),
+				id: `${id}:description:${selectionItemKey(item.value)}`
+			});
+		}
+	};
+}
+//#endregion
+export { createSegmentedProps as a, segmentedMachine as c, connect as i, SEGMENTED_PARTS as n, normalizeSegmentedItems as o, SEGMENTED_SIZES as r, normalizeSegmentedValue as s, SEGMENTED_MODES as t };
+
+//# sourceMappingURL=segmented-BaU38_L4.js.map