dishui 0.0.105 → 0.0.108

package/dist/.release-verified.json

@@ -1,6 +1,6 @@
 {
-  "version": "0.0.105",
+  "version": "0.0.108",
   "full": false,
   "node": "v22.13.1",
-  "verifiedAt": "2026-09-24T01:30:57.673Z"
+  "verifiedAt": "2026-09-26T14:47:10.114Z"
 }

package/dist/components/ChoicePicker/index.js

@@ -1,5 +1,5 @@
 import { cn as e } from "../../utils/cn.js";
-import { useCallback as t, useMemo as n, useState as r } from "react";
+import { useCallback as t, useId as n, useState as r } from "react";
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/components/ChoicePicker/index.tsx
 var o = {
@@ -31,16 +31,18 @@ var o = {
 }, u = ({ options: u, value: d, defaultValue: f, onChange: p, appearance: m = "list", orientation: h = "vertical", variant: g = "primary", size: _ = "sm", disabled: v = !1, label: y, name: b, className: x = "", style: S }) => {
 	let [C, w] = r(f), T = d !== void 0, E = T ? d : C, D = t((e) => {
 		T || w(e), p?.(e);
-	}, [T, p]), O = n(() => b ?? `choicepicker-${Math.random().toString(36).slice(2, 8)}`, [b]), k = h === "horizontal" ? "flex flex-wrap items-center" : "flex flex-col";
+	}, [T, p]), O = n(), k = b ?? `choicepicker-${O}`, A = `${O}-label`, j = h === "horizontal" ? "flex flex-wrap items-center" : "flex flex-col";
 	return /* @__PURE__ */ a("div", {
 		className: e("w-full", x),
 		style: S,
-		role: "radiogroup",
+		role: m === "chip" ? "group" : "radiogroup",
+		"aria-labelledby": y == null ? void 0 : A,
 		children: [y !== void 0 && /* @__PURE__ */ i("div", {
+			id: A,
 			className: "mb-1.5 text-sm font-medium text-base-content/80",
 			children: y
 		}), m === "chip" ? /* @__PURE__ */ i("div", {
-			className: e(k, "gap-2"),
+			className: e(j, "gap-2"),
 			children: u.map((t) => {
 				let n = E === t.value;
 				return /* @__PURE__ */ i("button", {
@@ -53,7 +55,7 @@ var o = {
 				}, String(t.value));
 			})
 		}) : /* @__PURE__ */ i("div", {
-			className: e(k, "gap-2.5"),
+			className: e(j, "gap-2.5"),
 			children: u.map((t) => {
 				let n = E === t.value;
 				return /* @__PURE__ */ a("label", {
@@ -61,7 +63,7 @@ var o = {
 					children: [/* @__PURE__ */ i("input", {
 						type: "radio",
 						className: e("radio", g !== "default" && s[g], l[_]),
-						name: O,
+						name: k,
 						value: String(t.value),
 						checked: n,
 						disabled: v || t.disabled,

package/dist/components/ChoicePicker/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/ChoicePicker/index.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState } from 'react';\nimport { cn } from '../../utils/cn';\n\nexport type ChoicePickerOption = {\n  /** Value submitted for this option. */\n  value: string | number;\n  /** Display label. */\n  label: React.ReactNode;\n  /** Disable this option only. */\n  disabled?: boolean;\n};\n\nexport type ChoicePickerVariant =\n  | 'default'\n  | 'primary'\n  | 'secondary'\n  | 'accent'\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'error';\n\nexport type ChoicePickerProps = {\n  /** Available options. */\n  options: ChoicePickerOption[];\n  /** Controlled selected value. */\n  value?: string | number;\n  /** Uncontrolled initial value. */\n  defaultValue?: string | number;\n  /** Change handler with the selected value. */\n  onChange?: (value: string | number) => void;\n  /** `list` renders radio rows; `chip` renders a button group. */\n  appearance?: 'list' | 'chip';\n  /** Layout of list rows or chip wrapping. */\n  orientation?: 'vertical' | 'horizontal';\n  /** Color variant. */\n  variant?: ChoicePickerVariant;\n  /** Size (daisyUI). */\n  size?: 'xs' | 'sm' | 'md' | 'lg';\n  /** Disable the whole group. */\n  disabled?: boolean;\n  /** Optional group label rendered above the options. */\n  label?: React.ReactNode;\n  /** Native name attribute for the radios. */\n  name?: string;\n  /** Extra class names on the wrapper. */\n  className?: string;\n  /** Inline styles on the wrapper. */\n  style?: React.CSSProperties;\n};\n\nconst VARIANT_CHIP_ACTIVE: Record<Exclude<ChoicePickerVariant, 'default'>, string> = {\n  primary: 'btn-primary',\n  secondary: 'btn-secondary',\n  accent: 'btn-accent',\n  info: 'btn-info',\n  success: 'btn-success',\n  warning: 'btn-warning',\n  error: 'btn-error',\n};\n\nconst VARIANT_RADIO: Record<Exclude<ChoicePickerVariant, 'default'>, string> = {\n  primary: 'radio-primary',\n  secondary: 'radio-secondary',\n  accent: 'radio-accent',\n  info: 'radio-info',\n  success: 'radio-success',\n  warning: 'radio-warning',\n  error: 'radio-error',\n};\n\nconst SIZE_CHIP: Record<ChoicePickerProps['size'] & string, string> = {\n  xs: 'btn-xs',\n  sm: 'btn-sm',\n  md: 'btn-md',\n  lg: 'btn-lg',\n};\n\nconst SIZE_RADIO: Record<ChoicePickerProps['size'] & string, string> = {\n  xs: 'radio-xs',\n  sm: 'radio-sm',\n  md: 'radio-md',\n  lg: 'radio-lg',\n};\n\n/**\n * ChoicePicker —— A2UI 交互组件（v0.9）：单选项组。\n * `list` 外观为 radio 行（daisyUI radio），`chip` 外观为按钮组（daisyUI btn）。\n */\nconst ChoicePicker: React.FC<ChoicePickerProps> = ({\n  options,\n  value,\n  defaultValue,\n  onChange,\n  appearance = 'list',\n  orientation = 'vertical',\n  variant = 'primary',\n  size = 'sm',\n  disabled = false,\n  label,\n  name,\n  className = '',\n  style,\n}) => {\n  const [internal, setInternal] = useState<string | number | undefined>(defaultValue);\n  const isControlled = value !== undefined;\n  const selected = isControlled ? value : internal;\n\n  const select = useCallback(\n    (optionValue: string | number) => {\n      if (!isControlled) setInternal(optionValue);\n      onChange?.(optionValue);\n    },\n    [isControlled, onChange],\n  );\n\n  const groupName = useMemo(() => name ?? `choicepicker-${Math.random().toString(36).slice(2, 8)}`, [name]);\n\n  const layoutClass =\n    orientation === 'horizontal' ? 'flex flex-wrap items-center' : 'flex flex-col';\n\n  return (\n    <div className={cn('w-full', className)} style={style} role=\"radiogroup\">\n      {label !== undefined && (\n        <div className=\"mb-1.5 text-sm font-medium text-base-content/80\">{label}</div>\n      )}\n\n      {appearance === 'chip' ? (\n        <div className={cn(layoutClass, 'gap-2')}>\n          {options.map((option) => {\n            const active = selected === option.value;\n            return (\n              <button\n                key={String(option.value)}\n                type=\"button\"\n                disabled={disabled || option.disabled}\n                aria-pressed={active}\n                onClick={() => select(option.value)}\n                className={cn(\n                  'btn',\n                  SIZE_CHIP[size],\n                  active\n                    ? variant === 'default'\n                      ? 'btn-neutral'\n                      : VARIANT_CHIP_ACTIVE[variant]\n                    : 'btn-outline',\n                )}\n              >\n                {option.label}\n              </button>\n            );\n          })}\n        </div>\n      ) : (\n        <div className={cn(layoutClass, 'gap-2.5')}>\n          {options.map((option) => {\n            const active = selected === option.value;\n            return (\n              <label\n                key={String(option.value)}\n                className={cn(\n                  'flex w-full cursor-pointer items-center gap-2.5',\n                  (disabled || option.disabled) && 'cursor-not-allowed opacity-50',\n                )}\n              >\n                <input\n                  type=\"radio\"\n                  className={cn(\n                    'radio',\n                    variant !== 'default' && VARIANT_RADIO[variant],\n                    SIZE_RADIO[size],\n                  )}\n                  name={groupName}\n                  value={String(option.value)}\n                  checked={active}\n                  disabled={disabled || option.disabled}\n                  onChange={() => select(option.value)}\n                />\n                <span className=\"text-sm text-base-content\">{option.label}</span>\n              </label>\n            );\n          })}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default ChoicePicker;\n"],"mappings":";;;;AAmDA,IAAM,IAA+E;CACnF,SAAS;CACT,WAAW;CACX,QAAQ;CACR,MAAM;CACN,SAAS;CACT,SAAS;CACT,OAAO;AACT,GAEM,IAAyE;CAC7E,SAAS;CACT,WAAW;CACX,QAAQ;CACR,MAAM;CACN,SAAS;CACT,SAAS;CACT,OAAO;AACT,GAEM,IAAgE;CACpE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN,GAEM,IAAiE;CACrE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN,GAMM,KAA6C,EACjD,YACA,UACA,iBACA,aACA,gBAAa,QACb,iBAAc,YACd,aAAU,WACV,UAAO,MACP,cAAW,IACX,UACA,SACA,eAAY,IACZ,eACI;CACJ,IAAM,CAAC,GAAU,KAAe,EAAsC,CAAY,GAC5E,IAAe,MAAU,KAAA,GACzB,IAAW,IAAe,IAAQ,GAElC,IAAS,GACZ,MAAiC;EAEhC,AADK,KAAc,EAAY,CAAW,GAC1C,IAAW,CAAW;CACxB,GACA,CAAC,GAAc,CAAQ,CACzB,GAEM,IAAY,QAAc,KAAQ,gBAAgB,KAAK,OAAO,CAAC,CAAC,SAAS,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,KAAK,CAAC,CAAI,CAAC,GAElG,IACJ,MAAgB,eAAe,gCAAgC;CAEjE,OACE,kBAAC,OAAD;EAAK,WAAW,EAAG,UAAU,CAAS;EAAU;EAAO,MAAK;EAA5D,UAAA,CACG,MAAU,KAAA,KACT,kBAAC,OAAD;GAAK,WAAU;GAAmD,UAAA;EAAW,CAAA,GAG9E,MAAe,SACd,kBAAC,OAAD;GAAK,WAAW,EAAG,GAAa,OAAO;GACpC,UAAA,EAAQ,KAAK,MAAW;IACvB,IAAM,IAAS,MAAa,EAAO;IACnC,OACE,kBAAC,UAAD;KAEE,MAAK;KACL,UAAU,KAAY,EAAO;KAC7B,gBAAc;KACd,eAAe,EAAO,EAAO,KAAK;KAClC,WAAW,EACT,OACA,EAAU,IACV,IACI,MAAY,YACV,gBACA,EAAoB,KACtB,aACN;KAEC,UAAA,EAAO;IACF,GAhBD,OAAO,EAAO,KAAK,CAgBlB;GAEZ,CAAC;EACE,CAAA,IAEL,kBAAC,OAAD;GAAK,WAAW,EAAG,GAAa,SAAS;GACtC,UAAA,EAAQ,KAAK,MAAW;IACvB,IAAM,IAAS,MAAa,EAAO;IACnC,OACE,kBAAC,SAAD;KAEE,WAAW,EACT,oDACC,KAAY,EAAO,aAAa,+BACnC;KALF,UAAA,CAOE,kBAAC,SAAD;MACE,MAAK;MACL,WAAW,EACT,SACA,MAAY,aAAa,EAAc,IACvC,EAAW,EACb;MACA,MAAM;MACN,OAAO,OAAO,EAAO,KAAK;MAC1B,SAAS;MACT,UAAU,KAAY,EAAO;MAC7B,gBAAgB,EAAO,EAAO,KAAK;KACpC,CAAA,GACD,kBAAC,QAAD;MAAM,WAAU;MAA6B,UAAA,EAAO;KAAY,CAAA,CAC3D;IApBA,GAAA,OAAO,EAAO,KAAK,CAoBnB;GAEX,CAAC;EACE,CAAA,CAEJ;;AAET"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/ChoicePicker/index.tsx"],"sourcesContent":["import React, { useCallback, useId, useState } from 'react';\nimport { cn } from '../../utils/cn';\n\nexport type ChoicePickerOption = {\n  /** Value submitted for this option. */\n  value: string | number;\n  /** Display label. */\n  label: React.ReactNode;\n  /** Disable this option only. */\n  disabled?: boolean;\n};\n\nexport type ChoicePickerVariant =\n  | 'default'\n  | 'primary'\n  | 'secondary'\n  | 'accent'\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'error';\n\nexport type ChoicePickerProps = {\n  /** Available options. */\n  options: ChoicePickerOption[];\n  /** Controlled selected value. */\n  value?: string | number;\n  /** Uncontrolled initial value. */\n  defaultValue?: string | number;\n  /** Change handler with the selected value. */\n  onChange?: (value: string | number) => void;\n  /** `list` renders radio rows; `chip` renders a button group. */\n  appearance?: 'list' | 'chip';\n  /** Layout of list rows or chip wrapping. */\n  orientation?: 'vertical' | 'horizontal';\n  /** Color variant. */\n  variant?: ChoicePickerVariant;\n  /** Size (daisyUI). */\n  size?: 'xs' | 'sm' | 'md' | 'lg';\n  /** Disable the whole group. */\n  disabled?: boolean;\n  /** Optional group label rendered above the options. */\n  label?: React.ReactNode;\n  /** Native name attribute for the radios. */\n  name?: string;\n  /** Extra class names on the wrapper. */\n  className?: string;\n  /** Inline styles on the wrapper. */\n  style?: React.CSSProperties;\n};\n\nconst VARIANT_CHIP_ACTIVE: Record<Exclude<ChoicePickerVariant, 'default'>, string> = {\n  primary: 'btn-primary',\n  secondary: 'btn-secondary',\n  accent: 'btn-accent',\n  info: 'btn-info',\n  success: 'btn-success',\n  warning: 'btn-warning',\n  error: 'btn-error',\n};\n\nconst VARIANT_RADIO: Record<Exclude<ChoicePickerVariant, 'default'>, string> = {\n  primary: 'radio-primary',\n  secondary: 'radio-secondary',\n  accent: 'radio-accent',\n  info: 'radio-info',\n  success: 'radio-success',\n  warning: 'radio-warning',\n  error: 'radio-error',\n};\n\nconst SIZE_CHIP: Record<ChoicePickerProps['size'] & string, string> = {\n  xs: 'btn-xs',\n  sm: 'btn-sm',\n  md: 'btn-md',\n  lg: 'btn-lg',\n};\n\nconst SIZE_RADIO: Record<ChoicePickerProps['size'] & string, string> = {\n  xs: 'radio-xs',\n  sm: 'radio-sm',\n  md: 'radio-md',\n  lg: 'radio-lg',\n};\n\n/**\n * ChoicePicker —— A2UI 交互组件（v0.9）：单选项组。\n * `list` 外观为 radio 行（daisyUI radio），`chip` 外观为按钮组（daisyUI btn）。\n */\nconst ChoicePicker: React.FC<ChoicePickerProps> = ({\n  options,\n  value,\n  defaultValue,\n  onChange,\n  appearance = 'list',\n  orientation = 'vertical',\n  variant = 'primary',\n  size = 'sm',\n  disabled = false,\n  label,\n  name,\n  className = '',\n  style,\n}) => {\n  const [internal, setInternal] = useState<string | number | undefined>(defaultValue);\n  const isControlled = value !== undefined;\n  const selected = isControlled ? value : internal;\n\n  const select = useCallback(\n    (optionValue: string | number) => {\n      if (!isControlled) setInternal(optionValue);\n      onChange?.(optionValue);\n    },\n    [isControlled, onChange],\n  );\n\n  const generatedName = useId();\n  const groupName = name ?? `choicepicker-${generatedName}`;\n  const labelId = `${generatedName}-label`;\n\n  const layoutClass =\n    orientation === 'horizontal' ? 'flex flex-wrap items-center' : 'flex flex-col';\n\n  return (\n    <div className={cn('w-full', className)} style={style} role={appearance === 'chip' ? 'group' : 'radiogroup'} aria-labelledby={label !== undefined && label !== null ? labelId : undefined}>\n      {label !== undefined && (\n        <div id={labelId} className=\"mb-1.5 text-sm font-medium text-base-content/80\">{label}</div>\n      )}\n\n      {appearance === 'chip' ? (\n        <div className={cn(layoutClass, 'gap-2')}>\n          {options.map((option) => {\n            const active = selected === option.value;\n            return (\n              <button\n                key={String(option.value)}\n                type=\"button\"\n                disabled={disabled || option.disabled}\n                aria-pressed={active}\n                onClick={() => select(option.value)}\n                className={cn(\n                  'btn',\n                  SIZE_CHIP[size],\n                  active\n                    ? variant === 'default'\n                      ? 'btn-neutral'\n                      : VARIANT_CHIP_ACTIVE[variant]\n                    : 'btn-outline',\n                )}\n              >\n                {option.label}\n              </button>\n            );\n          })}\n        </div>\n      ) : (\n        <div className={cn(layoutClass, 'gap-2.5')}>\n          {options.map((option) => {\n            const active = selected === option.value;\n            return (\n              <label\n                key={String(option.value)}\n                className={cn(\n                  'flex w-full cursor-pointer items-center gap-2.5',\n                  (disabled || option.disabled) && 'cursor-not-allowed opacity-50',\n                )}\n              >\n                <input\n                  type=\"radio\"\n                  className={cn(\n                    'radio',\n                    variant !== 'default' && VARIANT_RADIO[variant],\n                    SIZE_RADIO[size],\n                  )}\n                  name={groupName}\n                  value={String(option.value)}\n                  checked={active}\n                  disabled={disabled || option.disabled}\n                  onChange={() => select(option.value)}\n                />\n                <span className=\"text-sm text-base-content\">{option.label}</span>\n              </label>\n            );\n          })}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default ChoicePicker;\n"],"mappings":";;;;AAmDA,IAAM,IAA+E;CACnF,SAAS;CACT,WAAW;CACX,QAAQ;CACR,MAAM;CACN,SAAS;CACT,SAAS;CACT,OAAO;AACT,GAEM,IAAyE;CAC7E,SAAS;CACT,WAAW;CACX,QAAQ;CACR,MAAM;CACN,SAAS;CACT,SAAS;CACT,OAAO;AACT,GAEM,IAAgE;CACpE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN,GAEM,IAAiE;CACrE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN,GAMM,KAA6C,EACjD,YACA,UACA,iBACA,aACA,gBAAa,QACb,iBAAc,YACd,aAAU,WACV,UAAO,MACP,cAAW,IACX,UACA,SACA,eAAY,IACZ,eACI;CACJ,IAAM,CAAC,GAAU,KAAe,EAAsC,CAAY,GAC5E,IAAe,MAAU,KAAA,GACzB,IAAW,IAAe,IAAQ,GAElC,IAAS,GACZ,MAAiC;EAEhC,AADK,KAAc,EAAY,CAAW,GAC1C,IAAW,CAAW;CACxB,GACA,CAAC,GAAc,CAAQ,CACzB,GAEM,IAAgB,EAAM,GACtB,IAAY,KAAQ,gBAAgB,KACpC,IAAU,GAAG,EAAc,SAE3B,IACJ,MAAgB,eAAe,gCAAgC;CAEjE,OACE,kBAAC,OAAD;EAAK,WAAW,EAAG,UAAU,CAAS;EAAU;EAAO,MAAM,MAAe,SAAS,UAAU;EAAc,mBAAiB,KAAiC,OAAiB,KAAA,IAAV;EAAtK,UAAA,CACG,MAAU,KAAA,KACT,kBAAC,OAAD;GAAK,IAAI;GAAS,WAAU;GAAmD,UAAA;EAAW,CAAA,GAG3F,MAAe,SACd,kBAAC,OAAD;GAAK,WAAW,EAAG,GAAa,OAAO;GACpC,UAAA,EAAQ,KAAK,MAAW;IACvB,IAAM,IAAS,MAAa,EAAO;IACnC,OACE,kBAAC,UAAD;KAEE,MAAK;KACL,UAAU,KAAY,EAAO;KAC7B,gBAAc;KACd,eAAe,EAAO,EAAO,KAAK;KAClC,WAAW,EACT,OACA,EAAU,IACV,IACI,MAAY,YACV,gBACA,EAAoB,KACtB,aACN;KAEC,UAAA,EAAO;IACF,GAhBD,OAAO,EAAO,KAAK,CAgBlB;GAEZ,CAAC;EACE,CAAA,IAEL,kBAAC,OAAD;GAAK,WAAW,EAAG,GAAa,SAAS;GACtC,UAAA,EAAQ,KAAK,MAAW;IACvB,IAAM,IAAS,MAAa,EAAO;IACnC,OACE,kBAAC,SAAD;KAEE,WAAW,EACT,oDACC,KAAY,EAAO,aAAa,+BACnC;KALF,UAAA,CAOE,kBAAC,SAAD;MACE,MAAK;MACL,WAAW,EACT,SACA,MAAY,aAAa,EAAc,IACvC,EAAW,EACb;MACA,MAAM;MACN,OAAO,OAAO,EAAO,KAAK;MAC1B,SAAS;MACT,UAAU,KAAY,EAAO;MAC7B,gBAAgB,EAAO,EAAO,KAAK;KACpC,CAAA,GACD,kBAAC,QAAD;MAAM,WAAU;MAA6B,UAAA,EAAO;KAAY,CAAA,CAC3D;IApBA,GAAA,OAAO,EAAO,KAAK,CAoBnB;GAEX,CAAC;EACE,CAAA,CAEJ;;AAET"}

package/dist/components/Column/index.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
-export type ColumnAlign = 'start' | 'center' | 'end' | 'baseline' | 'stretch';
-export type ColumnJustify = 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly';
+import { type FlexAlign, type FlexJustify } from '../../utils/flexLayout';
+export type ColumnAlign = FlexAlign;
+export type ColumnJustify = FlexJustify;
 export type ColumnProps = {
     children?: React.ReactNode;
     /** Gap between children; number is treated as px. */

package/dist/components/Column/index.js

@@ -1,24 +1,12 @@
 import { cn as e } from "../../utils/cn.js";
+import { FLEX_ALIGN_CLASS as t, FLEX_JUSTIFY_CLASS as n, flexGap as r } from "../../utils/flexLayout.js";
 import "react";
-import { jsx as t } from "react/jsx-runtime";
+import { jsx as i } from "react/jsx-runtime";
 //#region src/components/Column/index.tsx
-var n = {
-	start: "items-start",
-	center: "items-center",
-	end: "items-end",
-	baseline: "items-baseline",
-	stretch: "items-stretch"
-}, r = {
-	start: "justify-start",
-	center: "justify-center",
-	end: "justify-end",
-	between: "justify-between",
-	around: "justify-around",
-	evenly: "justify-evenly"
-}, i = (e) => typeof e == "number" ? `${e}px` : e, a = ({ children: a, gap: o, align: s = "stretch", justify: c = "start", wrap: l = !1, reverse: u = !1, className: d = "", style: f, onClick: p }) => /* @__PURE__ */ t("div", {
-	className: e("flex", u ? "flex-col-reverse" : "flex-col", n[s], r[c], l && "flex-wrap", d),
+var a = ({ children: a, gap: o, align: s = "stretch", justify: c = "start", wrap: l = !1, reverse: u = !1, className: d = "", style: f, onClick: p }) => /* @__PURE__ */ i("div", {
+	className: e("flex", u ? "flex-col-reverse" : "flex-col", t[s], n[c], l && "flex-wrap", d),
 	style: {
-		gap: i(o),
+		gap: r(o),
 		...f
 	},
 	onClick: p,

package/dist/components/Column/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Column/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '../../utils/cn';\n\nexport type ColumnAlign = 'start' | 'center' | 'end' | 'baseline' | 'stretch';\nexport type ColumnJustify =\n  | 'start'\n  | 'center'\n  | 'end'\n  | 'between'\n  | 'around'\n  | 'evenly';\n\nexport type ColumnProps = {\n  children?: React.ReactNode;\n  /** Gap between children; number is treated as px. */\n  gap?: number | string;\n  /** Cross-axis alignment. */\n  align?: ColumnAlign;\n  /** Main-axis (vertical) distribution. */\n  justify?: ColumnJustify;\n  /** Allow children to wrap (rarely used in a column). */\n  wrap?: boolean;\n  /** Reverse the visual order of children. */\n  reverse?: boolean;\n  /** Extra class names on the container. */\n  className?: string;\n  /** Inline styles on the container. */\n  style?: React.CSSProperties;\n  /** Click handler on the container. */\n  onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;\n};\n\nconst ALIGN_CLASS: Record<ColumnAlign, string> = {\n  start: 'items-start',\n  center: 'items-center',\n  end: 'items-end',\n  baseline: 'items-baseline',\n  stretch: 'items-stretch',\n};\n\nconst JUSTIFY_CLASS: Record<ColumnJustify, string> = {\n  start: 'justify-start',\n  center: 'justify-center',\n  end: 'justify-end',\n  between: 'justify-between',\n  around: 'justify-around',\n  evenly: 'justify-evenly',\n};\n\nconst size = (v: number | string | undefined): string | undefined =>\n  typeof v === 'number' ? `${v}px` : v;\n\n/**\n * Column —— A2UI 布局组件：垂直排列子元素。\n * 等价于 `display: flex; flex-direction: column` 的语义化封装。\n */\nconst Column: React.FC<ColumnProps> = ({\n  children,\n  gap,\n  align = 'stretch',\n  justify = 'start',\n  wrap = false,\n  reverse = false,\n  className = '',\n  style,\n  onClick,\n}) => (\n  <div\n    className={cn(\n      'flex',\n      reverse ? 'flex-col-reverse' : 'flex-col',\n      ALIGN_CLASS[align],\n      JUSTIFY_CLASS[justify],\n      wrap && 'flex-wrap',\n      className,\n    )}\n    style={{ gap: size(gap), ...style }}\n    onClick={onClick}\n  >\n    {children}\n  </div>\n);\n\nexport default Column;\n"],"mappings":";;;;AAgCA,IAAM,IAA2C;CAC/C,OAAO;CACP,QAAQ;CACR,KAAK;CACL,UAAU;CACV,SAAS;AACX,GAEM,IAA+C;CACnD,OAAO;CACP,QAAQ;CACR,KAAK;CACL,SAAS;CACT,QAAQ;CACR,QAAQ;AACV,GAEM,KAAQ,MACZ,OAAO,KAAM,WAAW,GAAG,EAAE,MAAM,GAM/B,KAAiC,EACrC,aACA,QACA,WAAQ,WACR,aAAU,SACV,UAAO,IACP,aAAU,IACV,eAAY,IACZ,UACA,iBAEA,kBAAC,OAAD;CACE,WAAW,EACT,QACA,IAAU,qBAAqB,YAC/B,EAAY,IACZ,EAAc,IACd,KAAQ,aACR,CACF;CACA,OAAO;EAAE,KAAK,EAAK,CAAG;EAAG,GAAG;CAAM;CACzB;CAER;AACE,CAAA"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Column/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '../../utils/cn';\nimport { FLEX_ALIGN_CLASS, FLEX_JUSTIFY_CLASS, flexGap, type FlexAlign, type FlexJustify } from '../../utils/flexLayout';\n\nexport type ColumnAlign = FlexAlign;\nexport type ColumnJustify = FlexJustify;\n\nexport type ColumnProps = {\n  children?: React.ReactNode;\n  /** Gap between children; number is treated as px. */\n  gap?: number | string;\n  /** Cross-axis alignment. */\n  align?: ColumnAlign;\n  /** Main-axis (vertical) distribution. */\n  justify?: ColumnJustify;\n  /** Allow children to wrap (rarely used in a column). */\n  wrap?: boolean;\n  /** Reverse the visual order of children. */\n  reverse?: boolean;\n  /** Extra class names on the container. */\n  className?: string;\n  /** Inline styles on the container. */\n  style?: React.CSSProperties;\n  /** Click handler on the container. */\n  onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;\n};\n\n\n/**\n * Column —— A2UI 布局组件：垂直排列子元素。\n * 等价于 `display: flex; flex-direction: column` 的语义化封装。\n */\nconst Column: React.FC<ColumnProps> = ({\n  children,\n  gap,\n  align = 'stretch',\n  justify = 'start',\n  wrap = false,\n  reverse = false,\n  className = '',\n  style,\n  onClick,\n}) => (\n  <div\n    className={cn(\n      'flex',\n      reverse ? 'flex-col-reverse' : 'flex-col',\n      FLEX_ALIGN_CLASS[align],\n      FLEX_JUSTIFY_CLASS[justify],\n      wrap && 'flex-wrap',\n      className,\n    )}\n    style={{ gap: flexGap(gap), ...style }}\n    onClick={onClick}\n  >\n    {children}\n  </div>\n);\n\nexport default Column;\n"],"mappings":";;;;;AAgCA,IAAM,KAAiC,EACrC,aACA,QACA,WAAQ,WACR,aAAU,SACV,UAAO,IACP,aAAU,IACV,eAAY,IACZ,UACA,iBAEA,kBAAC,OAAD;CACE,WAAW,EACT,QACA,IAAU,qBAAqB,YAC/B,EAAiB,IACjB,EAAmB,IACnB,KAAQ,aACR,CACF;CACA,OAAO;EAAE,KAAK,EAAQ,CAAG;EAAG,GAAG;CAAM;CAC5B;CAER;AACE,CAAA"}

package/dist/components/ConfirmDialog/index.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+export type ConfirmDialogProps = {
+    open: boolean;
+    onClose: () => void;
+    /** Called once per confirmation. Reject to keep the dialog open and show an error. */
+    onConfirm: () => void | Promise<void>;
+    title: string;
+    /** Name of the object affected by the action. */
+    objectName: string;
+    /** Explain the effect of confirming (including irreversible consequences). */
+    consequence: string;
+    /** Require the exact object name before enabling confirmation for highest-risk actions. */
+    requireName?: boolean;
+    confirmLabel?: string;
+    cancelLabel?: string;
+    pendingLabel?: string;
+    failureMessage?: string;
+    namePrompt?: string;
+};
+export default function ConfirmDialog(props: ConfirmDialogProps): React.JSX.Element | null;

package/dist/components/ConfirmDialog/index.js

@@ -0,0 +1,84 @@
+import e from "../Button/index.js";
+import t from "../Modal/index.js";
+import { useEffect as n, useId as r, useRef as i, useState as a } from "react";
+import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/components/ConfirmDialog/index.tsx
+function l(e) {
+	return e.open ? /* @__PURE__ */ s(u, { ...e }) : null;
+}
+function u({ onClose: l, onConfirm: u, title: d, objectName: f, consequence: p, requireName: m = !1, confirmLabel: h = "Confirm", cancelLabel: g = "Cancel", pendingLabel: _ = "Working…", failureMessage: v = "The action failed. Try again or cancel.", namePrompt: y = "Type the object name to confirm" }) {
+	let [b, x] = a(!1), [S, C] = a(!1), [w, T] = a(""), E = i(!1), D = i(!0), O = r();
+	n(() => (D.current = !0, () => {
+		D.current = !1;
+	}), []);
+	let k = () => {
+		E.current || l();
+	};
+	return /* @__PURE__ */ c(t, {
+		open: !0,
+		onClose: k,
+		title: d,
+		description: /* @__PURE__ */ c(o, { children: [
+			"Object: ",
+			/* @__PURE__ */ s("strong", { children: f }),
+			". ",
+			p
+		] }),
+		size: "sm",
+		showClose: !1,
+		closeOnOverlay: !1,
+		footer: /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ s(e, {
+			type: "button",
+			variant: "neutral",
+			autoFocus: !0,
+			disabled: b,
+			onClick: k,
+			children: g
+		}), /* @__PURE__ */ s(e, {
+			type: "button",
+			variant: "destructive",
+			disabled: b || m && w !== f,
+			onClick: async () => {
+				if (!(E.current || m && w !== f)) {
+					E.current = !0, C(!1), x(!0);
+					try {
+						await u(), D.current && l();
+					} catch {
+						D.current && C(!0);
+					} finally {
+						D.current && (E.current = !1, x(!1));
+					}
+				}
+			},
+			children: b ? _ : h
+		})] }),
+		children: [m && /* @__PURE__ */ c("div", {
+			className: "flex flex-col gap-2",
+			children: [/* @__PURE__ */ c("label", {
+				htmlFor: O,
+				className: "text-body-sm font-medium",
+				children: [
+					y,
+					": ",
+					f
+				]
+			}), /* @__PURE__ */ s("input", {
+				id: O,
+				type: "text",
+				value: w,
+				disabled: b,
+				onChange: (e) => T(e.target.value),
+				className: "input input-bordered w-full",
+				autoComplete: "off"
+			})]
+		}), S && /* @__PURE__ */ s("p", {
+			role: "alert",
+			className: "mt-3 text-body-sm text-error",
+			children: v
+		})]
+	});
+}
+//#endregion
+export { l as default };
+
+//# sourceMappingURL=index.js.map

package/dist/components/ConfirmDialog/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/ConfirmDialog/index.tsx"],"sourcesContent":["import React, { useEffect, useId, useRef, useState } from 'react';\nimport Button from '../Button';\nimport Modal from '../Modal';\n\nexport type ConfirmDialogProps = {\n    open: boolean;\n    onClose: () => void;\n    /** Called once per confirmation. Reject to keep the dialog open and show an error. */\n    onConfirm: () => void | Promise<void>;\n    title: string;\n    /** Name of the object affected by the action. */\n    objectName: string;\n    /** Explain the effect of confirming (including irreversible consequences). */\n    consequence: string;\n    /** Require the exact object name before enabling confirmation for highest-risk actions. */\n    requireName?: boolean;\n    confirmLabel?: string;\n    cancelLabel?: string;\n    pendingLabel?: string;\n    failureMessage?: string;\n    namePrompt?: string;\n};\n\nexport default function ConfirmDialog(props: ConfirmDialogProps) {\n    return props.open ? <ConfirmDialogContent {...props} /> : null;\n}\n\nfunction ConfirmDialogContent({\n    onClose,\n    onConfirm,\n    title,\n    objectName,\n    consequence,\n    requireName = false,\n    confirmLabel = 'Confirm',\n    cancelLabel = 'Cancel',\n    pendingLabel = 'Working…',\n    failureMessage = 'The action failed. Try again or cancel.',\n    namePrompt = 'Type the object name to confirm',\n}: ConfirmDialogProps) {\n    const [pending, setPending] = useState(false);\n    const [error, setError] = useState(false);\n    const [enteredName, setEnteredName] = useState('');\n    const submitting = useRef(false);\n    const mounted = useRef(true);\n    const nameId = useId();\n\n    useEffect(() => {\n        mounted.current = true;\n        return () => { mounted.current = false; };\n    }, []);\n\n    const dismiss = () => {\n        if (!submitting.current) onClose();\n    };\n    const confirm = async () => {\n        if (submitting.current || (requireName && enteredName !== objectName)) return;\n        submitting.current = true;\n\n        setError(false);\n        setPending(true);\n        try {\n            await onConfirm();\n            if (mounted.current) onClose();\n        } catch {\n            if (mounted.current) setError(true);\n        } finally {\n            if (mounted.current) {\n                submitting.current = false;\n                setPending(false);\n            }\n        }\n    };\n\n    return (\n        <Modal\n            open\n            onClose={dismiss}\n            title={title}\n            description={<>Object: <strong>{objectName}</strong>. {consequence}</>}\n            size=\"sm\"\n            showClose={false}\n            closeOnOverlay={false}\n            footer={<>\n                <Button type=\"button\" variant=\"neutral\" autoFocus disabled={pending} onClick={dismiss}>{cancelLabel}</Button>\n                <Button type=\"button\" variant=\"destructive\" disabled={pending || (requireName && enteredName !== objectName)} onClick={confirm}>\n                    {pending ? pendingLabel : confirmLabel}\n                </Button>\n            </>}\n        >\n            {requireName && (\n                <div className=\"flex flex-col gap-2\">\n                    <label htmlFor={nameId} className=\"text-body-sm font-medium\">{namePrompt}: {objectName}</label>\n                    <input id={nameId} type=\"text\" value={enteredName} disabled={pending} onChange={event => setEnteredName(event.target.value)}\n                        className=\"input input-bordered w-full\" autoComplete=\"off\" />\n                </div>\n            )}\n            {error && <p role=\"alert\" className=\"mt-3 text-body-sm text-error\">{failureMessage}</p>}\n        </Modal>\n    );\n}\n"],"mappings":";;;;;AAuBA,SAAwB,EAAc,GAA2B;CAC7D,OAAO,EAAM,OAAO,kBAAC,GAAD,EAAsB,GAAI,EAAQ,CAAA,IAAI;AAC9D;AAEA,SAAS,EAAqB,EAC1B,YACA,cACA,UACA,eACA,gBACA,iBAAc,IACd,kBAAe,WACf,iBAAc,UACd,kBAAe,YACf,oBAAiB,2CACjB,gBAAa,qCACM;CACnB,IAAM,CAAC,GAAS,KAAc,EAAS,EAAK,GACtC,CAAC,GAAO,KAAY,EAAS,EAAK,GAClC,CAAC,GAAa,KAAkB,EAAS,EAAE,GAC3C,IAAa,EAAO,EAAK,GACzB,IAAU,EAAO,EAAI,GACrB,IAAS,EAAM;CAErB,SACI,EAAQ,UAAU,UACL;EAAE,EAAQ,UAAU;CAAO,IACzC,CAAC,CAAC;CAEL,IAAM,UAAgB;EAClB,AAAK,EAAW,WAAS,EAAQ;CACrC;CAoBA,OACI,kBAAC,GAAD;EACI,MAAA;EACA,SAAS;EACF;EACP,aAAa,kBAAA,GAAA,EAAA,UAAA;GAAE;GAAQ,kBAAC,UAAD,EAAA,UAAS,EAAmB,CAAA;GAAC;GAAG;EAAc,EAAA,CAAA;EACrE,MAAK;EACL,WAAW;EACX,gBAAgB;EAChB,QAAQ,kBAAA,GAAA,EAAA,UAAA,CACJ,kBAAC,GAAD;GAAQ,MAAK;GAAS,SAAQ;GAAU,WAAA;GAAU,UAAU;GAAS,SAAS;GAAU,UAAA;EAAoB,CAAA,GAC5G,kBAAC,GAAD;GAAQ,MAAK;GAAS,SAAQ;GAAc,UAAU,KAAY,KAAe,MAAgB;GAAa,SAAS,YA9BvG;IACpB,QAAW,WAAY,KAAe,MAAgB,IAI1D;KAHA,EAAW,UAAU,IAErB,EAAS,EAAK,GACd,EAAW,EAAI;KACf,IAAI;MAEA,AADA,MAAM,EAAU,GACZ,EAAQ,WAAS,EAAQ;KACjC,QAAQ;MACJ,AAAI,EAAQ,WAAS,EAAS,EAAI;KACtC,UAAU;MACN,AAAI,EAAQ,YACR,EAAW,UAAU,IACrB,EAAW,EAAK;KAExB;IAXe;GAYnB;GAciB,UAAA,IAAU,IAAe;EACtB,CAAA,CACV,EAAA,CAAA;EAbN,UAAA,CAeK,KACG,kBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACI,kBAAC,SAAD;IAAO,SAAS;IAAQ,WAAU;IAAlC,UAAA;KAA8D;KAAW;KAAG;IAAkB;GAC9F,CAAA,GAAA,kBAAC,SAAD;IAAO,IAAI;IAAQ,MAAK;IAAO,OAAO;IAAa,UAAU;IAAS,WAAU,MAAS,EAAe,EAAM,OAAO,KAAK;IACtH,WAAU;IAA8B,cAAa;GAAO,CAAA,CAC/D;EAER,CAAA,GAAA,KAAS,kBAAC,KAAD;GAAG,MAAK;GAAQ,WAAU;GAAgC,UAAA;EAAkB,CAAA,CACnF;;AAEf"}

package/dist/components/DateTimeInput/index.js

@@ -1,9 +1,9 @@
 import { cn as e } from "../../utils/cn.js";
 /* empty css              */
-import { useCallback as t } from "react";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { useCallback as t, useId as n } from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/components/DateTimeInput/index.tsx
-var i = {
+var a = {
 	default: "",
 	primary: "input-primary",
 	secondary: "input-secondary",
@@ -12,38 +12,40 @@ var i = {
 	success: "input-success",
 	warning: "input-warning",
 	error: "input-error"
-}, a = {
+}, o = {
 	xs: "input-xs",
 	sm: "input-sm",
 	md: "input-md",
 	lg: "input-lg"
-}, o = ({ type: o = "date", value: s, defaultValue: c, onChange: l, min: u, max: d, step: f, label: p, placeholder: m, variant: h = "default", size: g = "sm", disabled: _ = !1, readOnly: v = !1, name: y, className: b = "", style: x }) => {
-	let S = t((e) => {
-		l?.(e.target.value, e);
-	}, [l]), C = /* @__PURE__ */ n("input", {
-		type: o,
-		className: e("input dishui-datetime-input w-full", i[h], a[g], b),
-		value: s,
-		defaultValue: s === void 0 ? c : void 0,
-		min: u,
-		max: d,
-		step: f,
-		placeholder: m,
-		disabled: _,
-		readOnly: v,
-		name: y,
-		onChange: S
+}, s = ({ type: s = "date", value: c, defaultValue: l, onChange: u, min: d, max: f, step: p, label: m, placeholder: h, variant: g = "default", size: _ = "sm", disabled: v = !1, readOnly: y = !1, name: b, className: x = "", style: S }) => {
+	let C = n(), w = t((e) => {
+		u?.(e.target.value, e);
+	}, [u]), T = /* @__PURE__ */ r("input", {
+		id: C,
+		type: s,
+		className: e("input dishui-datetime-input w-full", a[g], o[_], x),
+		value: c,
+		defaultValue: c === void 0 ? l : void 0,
+		min: d,
+		max: f,
+		step: p,
+		placeholder: h,
+		disabled: v,
+		readOnly: y,
+		name: b,
+		onChange: w
 	});
-	return p == null || p === "" ? C : /* @__PURE__ */ r("div", {
+	return m == null || m === "" ? T : /* @__PURE__ */ i("div", {
 		className: "dishui-datetime-field w-full",
-		style: x,
-		children: [/* @__PURE__ */ n("label", {
+		style: S,
+		children: [/* @__PURE__ */ r("label", {
+			htmlFor: C,
 			className: "label-text mb-1 block text-sm text-base-content/80",
-			children: p
-		}), C]
+			children: m
+		}), T]
 	});
 };
 //#endregion
-export { o as default };
+export { s as default };
 
 //# sourceMappingURL=index.js.map

package/dist/components/DateTimeInput/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/DateTimeInput/index.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\nimport { cn } from '../../utils/cn';\nimport './DateTimeInput.css';\n\nexport type DateTimeType = 'date' | 'time' | 'datetime-local' | 'month' | 'week';\n\nexport type DateTimeVariant =\n  | 'default'\n  | 'primary'\n  | 'secondary'\n  | 'accent'\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'error';\n\nexport type DateTimeSize = 'xs' | 'sm' | 'md' | 'lg';\n\nexport type DateTimeInputProps = {\n  /** Which native picker to render. */\n  type?: DateTimeType;\n  /** Controlled value (`YYYY-MM-DD`, `HH:mm`, … per `type`). */\n  value?: string;\n  /** Uncontrolled initial value. */\n  defaultValue?: string;\n  /** Change handler with the raw input value. */\n  onChange?: (value: string, e: React.ChangeEvent<HTMLInputElement>) => void;\n  /** Minimum allowed value. */\n  min?: string;\n  /** Maximum allowed value. */\n  max?: string;\n  /** Step (seconds for time / datetime-local, days for date, …). */\n  step?: number | string;\n  /** Optional label rendered above the field. */\n  label?: React.ReactNode;\n  /** Placeholder (only shown by browsers that support it). */\n  placeholder?: string;\n  /** Color variant (daisyUI). */\n  variant?: DateTimeVariant;\n  /** Size (daisyUI). */\n  size?: DateTimeSize;\n  /** Disabled state. */\n  disabled?: boolean;\n  /** Read-only state. */\n  readOnly?: boolean;\n  /** Native name attribute. */\n  name?: string;\n  /** Extra class names on the input. */\n  className?: string;\n  /** Inline styles on the wrapper. */\n  style?: React.CSSProperties;\n};\n\nconst VARIANT_CLASS: Record<DateTimeVariant, string> = {\n  default: '',\n  primary: 'input-primary',\n  secondary: 'input-secondary',\n  accent: 'input-accent',\n  info: 'input-info',\n  success: 'input-success',\n  warning: 'input-warning',\n  error: 'input-error',\n};\n\nconst SIZE_CLASS: Record<DateTimeSize, string> = {\n  xs: 'input-xs',\n  sm: 'input-sm',\n  md: 'input-md',\n  lg: 'input-lg',\n};\n\n/**\n * DateTimeInput —— A2UI 交互组件：日期 / 时间选择输入。\n * 基于原生 `date / time / datetime-local / month / week` 输入，套用 daisyUI input 样式。\n */\nconst DateTimeInput: React.FC<DateTimeInputProps> = ({\n  type = 'date',\n  value,\n  defaultValue,\n  onChange,\n  min,\n  max,\n  step,\n  label,\n  placeholder,\n  variant = 'default',\n  size = 'sm',\n  disabled = false,\n  readOnly = false,\n  name,\n  className = '',\n  style,\n}) => {\n  const handleChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      onChange?.(e.target.value, e);\n    },\n    [onChange],\n  );\n\n  const input = (\n    <input\n      type={type}\n      className={cn('input dishui-datetime-input w-full', VARIANT_CLASS[variant], SIZE_CLASS[size], className)}\n      value={value}\n      defaultValue={value !== undefined ? undefined : defaultValue}\n      min={min}\n      max={max}\n      step={step}\n      placeholder={placeholder}\n      disabled={disabled}\n      readOnly={readOnly}\n      name={name}\n      onChange={handleChange}\n    />\n  );\n\n  if (label === undefined || label === null || label === '') {\n    return input;\n  }\n\n  return (\n    <div className=\"dishui-datetime-field w-full\" style={style}>\n      <label className=\"label-text mb-1 block text-sm text-base-content/80\">\n        {label}\n      </label>\n      {input}\n    </div>\n  );\n};\n\nexport default DateTimeInput;\n"],"mappings":";;;;;AAqDA,IAAM,IAAiD;CACrD,SAAS;CACT,SAAS;CACT,WAAW;CACX,QAAQ;CACR,MAAM;CACN,SAAS;CACT,SAAS;CACT,OAAO;AACT,GAEM,IAA2C;CAC/C,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN,GAMM,KAA+C,EACnD,UAAO,QACP,UACA,iBACA,aACA,QACA,QACA,SACA,UACA,gBACA,aAAU,WACV,UAAO,MACP,cAAW,IACX,cAAW,IACX,SACA,eAAY,IACZ,eACI;CACJ,IAAM,IAAe,GAClB,MAA2C;EAC1C,IAAW,EAAE,OAAO,OAAO,CAAC;CAC9B,GACA,CAAC,CAAQ,CACX,GAEM,IACJ,kBAAC,SAAD;EACQ;EACN,WAAW,EAAG,sCAAsC,EAAc,IAAU,EAAW,IAAO,CAAS;EAChG;EACP,cAAc,MAAU,KAAA,IAAwB,IAAZ,KAAA;EAC/B;EACA;EACC;EACO;EACH;EACA;EACJ;EACN,UAAU;CACX,CAAA;CAOH,OAJI,KAAiC,QAAQ,MAAU,KAC9C,IAIP,kBAAC,OAAD;EAAK,WAAU;EAAsC;EAArD,UAAA,CACE,kBAAC,SAAD;GAAO,WAAU;GACd,UAAA;EACI,CAAA,GACN,CACE;;AAET"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/DateTimeInput/index.tsx"],"sourcesContent":["import React, { useCallback, useId } from 'react';\nimport { cn } from '../../utils/cn';\nimport './DateTimeInput.css';\n\nexport type DateTimeType = 'date' | 'time' | 'datetime-local' | 'month' | 'week';\n\nexport type DateTimeVariant =\n  | 'default'\n  | 'primary'\n  | 'secondary'\n  | 'accent'\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'error';\n\nexport type DateTimeSize = 'xs' | 'sm' | 'md' | 'lg';\n\nexport type DateTimeInputProps = {\n  /** Which native picker to render. */\n  type?: DateTimeType;\n  /** Controlled value (`YYYY-MM-DD`, `HH:mm`, … per `type`). */\n  value?: string;\n  /** Uncontrolled initial value. */\n  defaultValue?: string;\n  /** Change handler with the raw input value. */\n  onChange?: (value: string, e: React.ChangeEvent<HTMLInputElement>) => void;\n  /** Minimum allowed value. */\n  min?: string;\n  /** Maximum allowed value. */\n  max?: string;\n  /** Step (seconds for time / datetime-local, days for date, …). */\n  step?: number | string;\n  /** Optional label rendered above the field. */\n  label?: React.ReactNode;\n  /** Placeholder (only shown by browsers that support it). */\n  placeholder?: string;\n  /** Color variant (daisyUI). */\n  variant?: DateTimeVariant;\n  /** Size (daisyUI). */\n  size?: DateTimeSize;\n  /** Disabled state. */\n  disabled?: boolean;\n  /** Read-only state. */\n  readOnly?: boolean;\n  /** Native name attribute. */\n  name?: string;\n  /** Extra class names on the input. */\n  className?: string;\n  /** Inline styles on the wrapper. */\n  style?: React.CSSProperties;\n};\n\nconst VARIANT_CLASS: Record<DateTimeVariant, string> = {\n  default: '',\n  primary: 'input-primary',\n  secondary: 'input-secondary',\n  accent: 'input-accent',\n  info: 'input-info',\n  success: 'input-success',\n  warning: 'input-warning',\n  error: 'input-error',\n};\n\nconst SIZE_CLASS: Record<DateTimeSize, string> = {\n  xs: 'input-xs',\n  sm: 'input-sm',\n  md: 'input-md',\n  lg: 'input-lg',\n};\n\n/**\n * DateTimeInput —— A2UI 交互组件：日期 / 时间选择输入。\n * 基于原生 `date / time / datetime-local / month / week` 输入，套用 daisyUI input 样式。\n */\nconst DateTimeInput: React.FC<DateTimeInputProps> = ({\n  type = 'date',\n  value,\n  defaultValue,\n  onChange,\n  min,\n  max,\n  step,\n  label,\n  placeholder,\n  variant = 'default',\n  size = 'sm',\n  disabled = false,\n  readOnly = false,\n  name,\n  className = '',\n  style,\n}) => {\n  const inputId = useId();\n  const handleChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      onChange?.(e.target.value, e);\n    },\n    [onChange],\n  );\n\n  const input = (\n    <input\n      id={inputId}\n      type={type}\n      className={cn('input dishui-datetime-input w-full', VARIANT_CLASS[variant], SIZE_CLASS[size], className)}\n      value={value}\n      defaultValue={value !== undefined ? undefined : defaultValue}\n      min={min}\n      max={max}\n      step={step}\n      placeholder={placeholder}\n      disabled={disabled}\n      readOnly={readOnly}\n      name={name}\n      onChange={handleChange}\n    />\n  );\n\n  if (label === undefined || label === null || label === '') {\n    return input;\n  }\n\n  return (\n    <div className=\"dishui-datetime-field w-full\" style={style}>\n      <label htmlFor={inputId} className=\"label-text mb-1 block text-sm text-base-content/80\">\n        {label}\n      </label>\n      {input}\n    </div>\n  );\n};\n\nexport default DateTimeInput;\n"],"mappings":";;;;;AAqDA,IAAM,IAAiD;CACrD,SAAS;CACT,SAAS;CACT,WAAW;CACX,QAAQ;CACR,MAAM;CACN,SAAS;CACT,SAAS;CACT,OAAO;AACT,GAEM,IAA2C;CAC/C,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN,GAMM,KAA+C,EACnD,UAAO,QACP,UACA,iBACA,aACA,QACA,QACA,SACA,UACA,gBACA,aAAU,WACV,UAAO,MACP,cAAW,IACX,cAAW,IACX,SACA,eAAY,IACZ,eACI;CACJ,IAAM,IAAU,EAAM,GAChB,IAAe,GAClB,MAA2C;EAC1C,IAAW,EAAE,OAAO,OAAO,CAAC;CAC9B,GACA,CAAC,CAAQ,CACX,GAEM,IACJ,kBAAC,SAAD;EACE,IAAI;EACE;EACN,WAAW,EAAG,sCAAsC,EAAc,IAAU,EAAW,IAAO,CAAS;EAChG;EACP,cAAc,MAAU,KAAA,IAAwB,IAAZ,KAAA;EAC/B;EACA;EACC;EACO;EACH;EACA;EACJ;EACN,UAAU;CACX,CAAA;CAOH,OAJI,KAAiC,QAAQ,MAAU,KAC9C,IAIP,kBAAC,OAAD;EAAK,WAAU;EAAsC;EAArD,UAAA,CACE,kBAAC,SAAD;GAAO,SAAS;GAAS,WAAU;GAChC,UAAA;EACI,CAAA,GACN,CACE;;AAET"}

package/dist/components/Input/index.js

@@ -10,7 +10,7 @@ var a = ({ placeholder: a, value: o, onChange: s, type: c = "text", variant: l,
 		if (!F.current) return;
 		let t = F.current.checkValidity(), n = [];
 		x.length > 0 && x.forEach((t) => {
-			t.pattern.test(e) || n.push(t.message);
+			(t.pattern.global || t.pattern.sticky ? new RegExp(t.pattern.source, t.pattern.flags) : t.pattern).test(e) || n.push(t.message);
 		}), P(n), A(t && n.length === 0);
 	}, z = () => {
 		O(!D);

package/dist/components/Input/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Input/index.tsx"],"sourcesContent":["import React, { useState, useRef, useId } from 'react';\nimport './Input.css';\n\nexport type InputProps = Pick<React.InputHTMLAttributes<HTMLInputElement>, 'id' | 'name' | 'readOnly' | 'aria-label' | 'aria-labelledby' | 'aria-describedby' | 'aria-invalid'> & {\n  placeholder?: string;\n  value?: string;\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  type?: string;\n  variant?: 'neutral' | 'primary' | 'secondary' | 'accent' | 'info' | 'success' | 'warning' | 'error' | 'ghost';\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  disabled?: boolean;\n  required?: boolean;\n  label?: string;\n  labelPosition?: 'inline' | 'top';\n  leftSection?: React.ReactNode;\n  rightSection?: React.ReactNode;\n  pattern?: string;\n  className?: string;\n  validator?: boolean;\n  validatorHint?: string;\n  validationRules?: {\n    pattern: RegExp;\n    message: string;\n  }[];\n};\n\nconst Input = ({\n  placeholder,\n  value,\n  onChange,\n  type = 'text',\n  variant,\n  size = 'sm',\n  disabled = false,\n  required = false,\n  label,\n  labelPosition = 'inline',\n  leftSection,\n  rightSection,\n  pattern,\n  className = '',\n  validator = false,\n  validatorHint,\n  validationRules = [],\n  id,\n  readOnly,\n  ...inputAttributes\n}: InputProps) => {\n  const generatedId = useId();\n  const fieldId = id || generatedId;\n\n  // 密码显示/隐藏状态\n  const [showPassword, setShowPassword] = useState(false);\n  // 表单验证状态\n  const [isValid, setIsValid] = useState<boolean | null>(null);\n  // 显示验证提示\n  const [showValidationHint, setShowValidationHint] = useState(false);\n  // 验证失败的规则消息\n  const [failedRules, setFailedRules] = useState<string[]>([]);\n  \n  // 输入框引用，用于焦点和验证\n  const inputRef = useRef<HTMLInputElement>(null);\n  \n  // 确定实际使用的输入类型\n  const actualType = type === 'password' && showPassword ? 'text' : type;\n  \n  // 处理输入变化和验证\n  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const newValue = e.target.value;\n    \n    // 验证输入\n    if (validator && inputRef.current) {\n      validateInput(newValue);\n    }\n    \n    // 调用原始的onChange处理函数\n    if (onChange) {\n      onChange(e);\n    }\n  };\n  \n  // 验证输入值\n  const validateInput = (inputValue: string) => {\n    if (!inputRef.current) return;\n    \n    // 使用HTML5自带的验证\n    const isNativeValid = inputRef.current.checkValidity();\n    \n    // 检查自定义验证规则\n    const failedMessages: string[] = [];\n    \n    if (validationRules.length > 0) {\n      validationRules.forEach(rule => {\n        if (!rule.pattern.test(inputValue)) {\n          failedMessages.push(rule.message);\n        }\n      });\n    }\n    \n    setFailedRules(failedMessages);\n    setIsValid(isNativeValid && failedMessages.length === 0);\n  };\n  \n  // 切换密码显示/隐藏\n  const togglePasswordVisibility = () => {\n    setShowPassword(!showPassword);\n  };\n  \n  // 鼠标悬停事件处理\n  const handleMouseEnter = () => {\n    if (validator && !isValid) {\n      setShowValidationHint(true);\n    }\n  };\n  \n  const handleMouseLeave = () => {\n    setShowValidationHint(false);\n  };\n  \n  // 验证状态相关的类名\n  let validationStateClass = '';\n  if (validator && isValid !== null) {\n    validationStateClass = isValid ? 'input-success' : 'input-error';\n  }\n  \n  const fieldAttributes = {\n    ...inputAttributes,\n    id: fieldId,\n    readOnly,\n    'aria-invalid': inputAttributes['aria-invalid'] ?? (validator && isValid === false ? true : undefined),\n  };\n  const baseClass = 'input dishui-input';\n  const variantClass = variant && !validationStateClass ? `input-${variant}` : '';\n  const sizeClass = size ? `input-${size}` : '';\n  const validatorClass = validator ? 'validator' : '';\n  \n\n  // 密码可见性切换按钮\n  const passwordToggle = type === 'password' && (\n    <button\n      type=\"button\"\n      disabled={disabled}\n      aria-label={showPassword ? 'Hide password' : 'Show password'}\n      aria-pressed={showPassword}\n      className=\"cursor-pointer opacity-70 hover:opacity-100\"\n      onClick={togglePasswordVisibility}\n    >\n      {showPassword ? (\n        // 眼睛关闭图标\n        <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-5 w-5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n          <path d=\"M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94\" />\n          <path d=\"M14.12 14.12a3 3 0 1 1-4.24-4.24\" />\n          <path d=\"M1 1l22 22\" />\n          <path d=\"M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19\" />\n        </svg>\n      ) : (\n        // 眼睛打开图标\n        <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-5 w-5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n          <path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\" />\n          <circle cx=\"12\" cy=\"12\" r=\"3\" />\n        </svg>\n      )}\n    </button>\n  );\n  \n  // 构建验证提示悬浮框\n  const validationTooltip = (\n    <div className=\"validation-tooltip\">\n      {failedRules.length > 0 ? (\n        <ul className=\"text-xs list-disc pl-4 py-1\">\n          {failedRules.map((rule, index) => (\n            <li key={index}>{rule}</li>\n          ))}\n        </ul>\n      ) : validatorHint ? (\n        <p className=\"text-xs py-1\">{validatorHint}</p>\n      ) : null}\n    </div>\n  );\n\n  // 如果有label，则使用label作为容器\n  if (label || leftSection || rightSection || type === 'password') {\n    // labelPosition === 'top': label above the input field\n    if (label && labelPosition === 'top') {\n      return (\n        <div className={`relative w-full ${className}`} onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>\n          <label htmlFor={fieldId} className=\"text-sm font-medium mb-1 block\">{label}</label>\n          <label className={`${baseClass} ${variantClass} ${sizeClass} ${validatorClass} ${validationStateClass} w-full flex items-center gap-2`}>\n            {leftSection && <span>{leftSection}</span>}\n            <input\n              {...fieldAttributes}\n              ref={inputRef}\n              type={actualType}\n              placeholder={placeholder}\n              value={value}\n              onChange={handleInputChange}\n              disabled={disabled}\n              required={required}\n              className=\"grow\"\n              pattern={pattern}\n            />\n            {type === 'password' ? (\n              <button type=\"button\" disabled={disabled} aria-label={showPassword ? 'Hide password' : 'Show password'} aria-pressed={showPassword} className=\"cursor-pointer opacity-70 hover:opacity-100\" onClick={togglePasswordVisibility}>\n                {showPassword ? (\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-5 w-5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n                    <path d=\"M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94\" />\n                    <path d=\"M14.12 14.12a3 3 0 1 1-4.24-4.24\" />\n                    <path d=\"M1 1l22 22\" />\n                    <path d=\"M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19\" />\n                  </svg>\n                ) : (\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-5 w-5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n                    <path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\" />\n                    <circle cx=\"12\" cy=\"12\" r=\"3\" />\n                  </svg>\n                )}\n              </button>\n            ) : rightSection ? (\n              <span>{rightSection}</span>\n            ) : null}\n          </label>\n          {validator && validatorHint && !showValidationHint && (\n            <p className=\"validator-hint text-xs mt-1 opacity-70\">{validatorHint}</p>\n          )}\n          {showValidationHint && validator && !isValid && (\n            <div className=\"absolute z-10 mt-1 bg-base-200 border border-error rounded shadow-lg text-error px-3 py-1\">\n              {validationTooltip}\n            </div>\n          )}\n        </div>\n      );\n    }\n\n    // Default: inline label\n    return (\n      <div className={`relative w-full ${className}`} onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>\n        <label className={`${baseClass} ${variantClass} ${sizeClass} ${validatorClass} ${validationStateClass} w-full flex items-center gap-2`}>\n          {leftSection && <span>{leftSection}</span>}\n          {label && <span>{label}</span>}\n          <input\n            {...fieldAttributes}\n            ref={inputRef}\n            type={actualType}\n            placeholder={placeholder}\n            value={value}\n            onChange={handleInputChange}\n            disabled={disabled}\n            required={required}\n            className=\"grow\"\n            pattern={pattern}\n          />\n          {/* 加入密码切换按钮或其他右侧元素 */}\n          {type === 'password' ? (\n            <span>{passwordToggle}</span>\n          ) : rightSection ? (\n            <span>{rightSection}</span>\n          ) : null}\n        </label>\n        {validator && validatorHint && !showValidationHint && (\n          <p className=\"validator-hint text-xs mt-1 opacity-70\">{validatorHint}</p>\n        )}\n        {showValidationHint && validator && !isValid && (\n          <div className=\"absolute z-10 mt-1 bg-base-200 border border-error rounded shadow-lg text-error px-3 py-1\">\n            {validationTooltip}\n          </div>\n        )}\n      </div>\n    );\n  }\n\n  // 如果没有label，则直接返回input\n  return (\n    <div className={`relative w-full ${className}`} onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>\n      <input\n        {...fieldAttributes}\n        ref={inputRef}\n        type={actualType}\n        placeholder={placeholder}\n        value={value}\n        onChange={handleInputChange}\n        disabled={disabled}\n        required={required}\n        className={`${baseClass} ${variantClass} ${sizeClass} ${validatorClass} ${validationStateClass} w-full`}\n        pattern={pattern}\n      />\n      {validator && validatorHint && !showValidationHint && (\n        <p className=\"validator-hint text-xs mt-1 opacity-70\">{validatorHint}</p>\n      )}\n      {showValidationHint && validator && !isValid && (\n        <div className=\"absolute z-10 mt-1 bg-base-200 border border-error rounded shadow-lg text-error px-3 py-1\">\n          {validationTooltip}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default Input; "],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Input/index.tsx"],"sourcesContent":["import React, { useState, useRef, useId } from 'react';\nimport './Input.css';\n\nexport type InputProps = Pick<React.InputHTMLAttributes<HTMLInputElement>, 'id' | 'name' | 'readOnly' | 'aria-label' | 'aria-labelledby' | 'aria-describedby' | 'aria-invalid'> & {\n  placeholder?: string;\n  value?: string;\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n  type?: string;\n  variant?: 'neutral' | 'primary' | 'secondary' | 'accent' | 'info' | 'success' | 'warning' | 'error' | 'ghost';\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  disabled?: boolean;\n  required?: boolean;\n  label?: string;\n  labelPosition?: 'inline' | 'top';\n  leftSection?: React.ReactNode;\n  rightSection?: React.ReactNode;\n  pattern?: string;\n  className?: string;\n  validator?: boolean;\n  validatorHint?: string;\n  validationRules?: {\n    pattern: RegExp;\n    message: string;\n  }[];\n};\n\nconst Input = ({\n  placeholder,\n  value,\n  onChange,\n  type = 'text',\n  variant,\n  size = 'sm',\n  disabled = false,\n  required = false,\n  label,\n  labelPosition = 'inline',\n  leftSection,\n  rightSection,\n  pattern,\n  className = '',\n  validator = false,\n  validatorHint,\n  validationRules = [],\n  id,\n  readOnly,\n  ...inputAttributes\n}: InputProps) => {\n  const generatedId = useId();\n  const fieldId = id || generatedId;\n\n  // 密码显示/隐藏状态\n  const [showPassword, setShowPassword] = useState(false);\n  // 表单验证状态\n  const [isValid, setIsValid] = useState<boolean | null>(null);\n  // 显示验证提示\n  const [showValidationHint, setShowValidationHint] = useState(false);\n  // 验证失败的规则消息\n  const [failedRules, setFailedRules] = useState<string[]>([]);\n  \n  // 输入框引用，用于焦点和验证\n  const inputRef = useRef<HTMLInputElement>(null);\n  \n  // 确定实际使用的输入类型\n  const actualType = type === 'password' && showPassword ? 'text' : type;\n  \n  // 处理输入变化和验证\n  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const newValue = e.target.value;\n    \n    // 验证输入\n    if (validator && inputRef.current) {\n      validateInput(newValue);\n    }\n    \n    // 调用原始的onChange处理函数\n    if (onChange) {\n      onChange(e);\n    }\n  };\n  \n  // 验证输入值\n  const validateInput = (inputValue: string) => {\n    if (!inputRef.current) return;\n    \n    // 使用HTML5自带的验证\n    const isNativeValid = inputRef.current.checkValidity();\n    \n    // 检查自定义验证规则\n    const failedMessages: string[] = [];\n    \n    if (validationRules.length > 0) {\n      validationRules.forEach(rule => {\n        // Global/sticky RegExp.test mutates lastIndex; validation must not depend on prior keystrokes.\n        const rulePattern = rule.pattern.global || rule.pattern.sticky\n          ? new RegExp(rule.pattern.source, rule.pattern.flags)\n          : rule.pattern;\n        if (!rulePattern.test(inputValue)) {\n          failedMessages.push(rule.message);\n        }\n      });\n    }\n    \n    setFailedRules(failedMessages);\n    setIsValid(isNativeValid && failedMessages.length === 0);\n  };\n  \n  // 切换密码显示/隐藏\n  const togglePasswordVisibility = () => {\n    setShowPassword(!showPassword);\n  };\n  \n  // 鼠标悬停事件处理\n  const handleMouseEnter = () => {\n    if (validator && !isValid) {\n      setShowValidationHint(true);\n    }\n  };\n  \n  const handleMouseLeave = () => {\n    setShowValidationHint(false);\n  };\n  \n  // 验证状态相关的类名\n  let validationStateClass = '';\n  if (validator && isValid !== null) {\n    validationStateClass = isValid ? 'input-success' : 'input-error';\n  }\n  \n  const fieldAttributes = {\n    ...inputAttributes,\n    id: fieldId,\n    readOnly,\n    'aria-invalid': inputAttributes['aria-invalid'] ?? (validator && isValid === false ? true : undefined),\n  };\n  const baseClass = 'input dishui-input';\n  const variantClass = variant && !validationStateClass ? `input-${variant}` : '';\n  const sizeClass = size ? `input-${size}` : '';\n  const validatorClass = validator ? 'validator' : '';\n  \n\n  // 密码可见性切换按钮\n  const passwordToggle = type === 'password' && (\n    <button\n      type=\"button\"\n      disabled={disabled}\n      aria-label={showPassword ? 'Hide password' : 'Show password'}\n      aria-pressed={showPassword}\n      className=\"cursor-pointer opacity-70 hover:opacity-100\"\n      onClick={togglePasswordVisibility}\n    >\n      {showPassword ? (\n        // 眼睛关闭图标\n        <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-5 w-5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n          <path d=\"M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94\" />\n          <path d=\"M14.12 14.12a3 3 0 1 1-4.24-4.24\" />\n          <path d=\"M1 1l22 22\" />\n          <path d=\"M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19\" />\n        </svg>\n      ) : (\n        // 眼睛打开图标\n        <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-5 w-5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n          <path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\" />\n          <circle cx=\"12\" cy=\"12\" r=\"3\" />\n        </svg>\n      )}\n    </button>\n  );\n  \n  // 构建验证提示悬浮框\n  const validationTooltip = (\n    <div className=\"validation-tooltip\">\n      {failedRules.length > 0 ? (\n        <ul className=\"text-xs list-disc pl-4 py-1\">\n          {failedRules.map((rule, index) => (\n            <li key={index}>{rule}</li>\n          ))}\n        </ul>\n      ) : validatorHint ? (\n        <p className=\"text-xs py-1\">{validatorHint}</p>\n      ) : null}\n    </div>\n  );\n\n  // 如果有label，则使用label作为容器\n  if (label || leftSection || rightSection || type === 'password') {\n    // labelPosition === 'top': label above the input field\n    if (label && labelPosition === 'top') {\n      return (\n        <div className={`relative w-full ${className}`} onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>\n          <label htmlFor={fieldId} className=\"text-sm font-medium mb-1 block\">{label}</label>\n          <label className={`${baseClass} ${variantClass} ${sizeClass} ${validatorClass} ${validationStateClass} w-full flex items-center gap-2`}>\n            {leftSection && <span>{leftSection}</span>}\n            <input\n              {...fieldAttributes}\n              ref={inputRef}\n              type={actualType}\n              placeholder={placeholder}\n              value={value}\n              onChange={handleInputChange}\n              disabled={disabled}\n              required={required}\n              className=\"grow\"\n              pattern={pattern}\n            />\n            {type === 'password' ? (\n              <button type=\"button\" disabled={disabled} aria-label={showPassword ? 'Hide password' : 'Show password'} aria-pressed={showPassword} className=\"cursor-pointer opacity-70 hover:opacity-100\" onClick={togglePasswordVisibility}>\n                {showPassword ? (\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-5 w-5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n                    <path d=\"M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94\" />\n                    <path d=\"M14.12 14.12a3 3 0 1 1-4.24-4.24\" />\n                    <path d=\"M1 1l22 22\" />\n                    <path d=\"M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19\" />\n                  </svg>\n                ) : (\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-5 w-5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\">\n                    <path d=\"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z\" />\n                    <circle cx=\"12\" cy=\"12\" r=\"3\" />\n                  </svg>\n                )}\n              </button>\n            ) : rightSection ? (\n              <span>{rightSection}</span>\n            ) : null}\n          </label>\n          {validator && validatorHint && !showValidationHint && (\n            <p className=\"validator-hint text-xs mt-1 opacity-70\">{validatorHint}</p>\n          )}\n          {showValidationHint && validator && !isValid && (\n            <div className=\"absolute z-10 mt-1 bg-base-200 border border-error rounded shadow-lg text-error px-3 py-1\">\n              {validationTooltip}\n            </div>\n          )}\n        </div>\n      );\n    }\n\n    // Default: inline label\n    return (\n      <div className={`relative w-full ${className}`} onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>\n        <label className={`${baseClass} ${variantClass} ${sizeClass} ${validatorClass} ${validationStateClass} w-full flex items-center gap-2`}>\n          {leftSection && <span>{leftSection}</span>}\n          {label && <span>{label}</span>}\n          <input\n            {...fieldAttributes}\n            ref={inputRef}\n            type={actualType}\n            placeholder={placeholder}\n            value={value}\n            onChange={handleInputChange}\n            disabled={disabled}\n            required={required}\n            className=\"grow\"\n            pattern={pattern}\n          />\n          {/* 加入密码切换按钮或其他右侧元素 */}\n          {type === 'password' ? (\n            <span>{passwordToggle}</span>\n          ) : rightSection ? (\n            <span>{rightSection}</span>\n          ) : null}\n        </label>\n        {validator && validatorHint && !showValidationHint && (\n          <p className=\"validator-hint text-xs mt-1 opacity-70\">{validatorHint}</p>\n        )}\n        {showValidationHint && validator && !isValid && (\n          <div className=\"absolute z-10 mt-1 bg-base-200 border border-error rounded shadow-lg text-error px-3 py-1\">\n            {validationTooltip}\n          </div>\n        )}\n      </div>\n    );\n  }\n\n  // 如果没有label，则直接返回input\n  return (\n    <div className={`relative w-full ${className}`} onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>\n      <input\n        {...fieldAttributes}\n        ref={inputRef}\n        type={actualType}\n        placeholder={placeholder}\n        value={value}\n        onChange={handleInputChange}\n        disabled={disabled}\n        required={required}\n        className={`${baseClass} ${variantClass} ${sizeClass} ${validatorClass} ${validationStateClass} w-full`}\n        pattern={pattern}\n      />\n      {validator && validatorHint && !showValidationHint && (\n        <p className=\"validator-hint text-xs mt-1 opacity-70\">{validatorHint}</p>\n      )}\n      {showValidationHint && validator && !isValid && (\n        <div className=\"absolute z-10 mt-1 bg-base-200 border border-error rounded shadow-lg text-error px-3 py-1\">\n          {validationTooltip}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default Input; "],"mappings":"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"}

package/dist/components/MultipleChoice/index.js

@@ -40,7 +40,8 @@ var s = ({ options: s, value: c, defaultValue: l = [], onChange: u, orientation:
 					variant: f === "default" ? "default" : f,
 					size: p,
 					disabled: r,
-					name: _
+					name: _,
+					value: String(e.value)
 				}, String(e.value));
 			})
 		})]

package/dist/components/MultipleChoice/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/MultipleChoice/index.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState } from 'react';\nimport { cn } from '../../utils/cn';\nimport Checkbox from '../Checkbox';\n\nexport type MultipleChoiceOption = {\n  /** Value submitted for this option. */\n  value: string | number;\n  /** Display label. */\n  label: React.ReactNode;\n  /** Disable this option only. */\n  disabled?: boolean;\n};\n\nexport type MultipleChoiceVariant =\n  | 'default'\n  | 'primary'\n  | 'secondary'\n  | 'accent'\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'error';\n\nexport type MultipleChoiceProps = {\n  /** Available options. */\n  options: MultipleChoiceOption[];\n  /** Controlled selected values. */\n  value?: Array<string | number>;\n  /** Uncontrolled initial selection. */\n  defaultValue?: Array<string | number>;\n  /** Change handler with the full selected-value array. */\n  onChange?: (values: Array<string | number>) => void;\n  /** Layout of the options. */\n  orientation?: 'vertical' | 'horizontal';\n  /** Color variant forwarded to each checkbox. */\n  variant?: MultipleChoiceVariant;\n  /** Size forwarded to each checkbox. */\n  size?: 'xs' | 'sm' | 'md' | 'lg';\n  /** Disable the whole group. */\n  disabled?: boolean;\n  /** Limit the number of selectable options. */\n  maxSelected?: number;\n  /** Optional group label rendered above the options. */\n  label?: React.ReactNode;\n  /** Native name attribute for each checkbox. */\n  name?: string;\n  /** Extra class names on the wrapper. */\n  className?: string;\n  /** Inline styles on the wrapper. */\n  style?: React.CSSProperties;\n};\n\n/**\n * MultipleChoice —— A2UI 交互组件（v0.8）：多选项组。\n * 基于 dishui Checkbox 的受控 / 非受控多选组，支持横竖排与最大选择数限制。\n */\nconst MultipleChoice: React.FC<MultipleChoiceProps> = ({\n  options,\n  value,\n  defaultValue = [],\n  onChange,\n  orientation = 'vertical',\n  variant = 'default',\n  size = 'sm',\n  disabled = false,\n  maxSelected,\n  label,\n  name,\n  className = '',\n  style,\n}) => {\n  const [internal, setInternal] = useState<Array<string | number>>(defaultValue);\n  const isControlled = value !== undefined;\n  const selected = useMemo(\n    () => new Set<string | number>(isControlled ? (value as Array<string | number>) : internal),\n    [isControlled, value, internal],\n  );\n\n  const toggle = useCallback(\n    (optionValue: string | number, next: boolean) => {\n      const base = Array.from(selected);\n      const result = next ? [...base, optionValue] : base.filter((v) => v !== optionValue);\n      if (!isControlled) setInternal(result);\n      onChange?.(result);\n    },\n    [selected, isControlled, onChange],\n  );\n\n  const handleToggle = useCallback(\n    (optionValue: string | number, next: boolean) => {\n      // Enforce maxSelected only when turning a new option ON.\n      if (next && maxSelected !== undefined && selected.size >= maxSelected) return;\n      toggle(optionValue, next);\n    },\n    [toggle, maxSelected, selected],\n  );\n\n  return (\n    <div className={cn('w-full', className)} style={style}>\n      {label !== undefined && (\n        <div className=\"mb-1.5 text-sm font-medium text-base-content/80\">{label}</div>\n      )}\n      <div\n        className={cn(\n          'gap-2',\n          orientation === 'horizontal' ? 'flex flex-wrap items-center' : 'flex flex-col',\n        )}\n        role=\"group\"\n      >\n        {options.map((option) => {\n          const checked = selected.has(option.value);\n          const optionDisabled = disabled || option.disabled;\n          return (\n            <Checkbox\n              key={String(option.value)}\n              label={option.label}\n              checked={checked}\n              onChange={(next) => handleToggle(option.value, next)}\n              variant={variant === 'default' ? 'default' : variant}\n              size={size}\n              disabled={optionDisabled}\n              name={name}\n            />\n          );\n        })}\n      </div>\n    </div>\n  );\n};\n\nexport default MultipleChoice;\n"],"mappings":";;;;;AAwDA,IAAM,KAAiD,EACrD,YACA,UACA,kBAAe,CAAC,GAChB,aACA,iBAAc,YACd,aAAU,WACV,UAAO,MACP,cAAW,IACX,gBACA,UACA,SACA,eAAY,IACZ,eACI;CACJ,IAAM,CAAC,GAAU,KAAe,EAAiC,CAAY,GACvE,IAAe,MAAU,KAAA,GACzB,IAAW,QACT,IAAI,IAAqB,IAAgB,IAAmC,CAAQ,GAC1F;EAAC;EAAc;EAAO;CAAQ,CAChC,GAEM,IAAS,GACZ,GAA8B,MAAkB;EAC/C,IAAM,IAAO,MAAM,KAAK,CAAQ,GAC1B,IAAS,IAAO,CAAC,GAAG,GAAM,CAAW,IAAI,EAAK,QAAQ,MAAM,MAAM,CAAW;EAEnF,AADK,KAAc,EAAY,CAAM,GACrC,IAAW,CAAM;CACnB,GACA;EAAC;EAAU;EAAc;CAAQ,CACnC,GAEM,IAAe,GAClB,GAA8B,MAAkB;EAE3C,KAAQ,MAAgB,KAAA,KAAa,EAAS,QAAQ,KAC1D,EAAO,GAAa,CAAI;CAC1B,GACA;EAAC;EAAQ;EAAa;CAAQ,CAChC;CAEA,OACE,kBAAC,OAAD;EAAK,WAAW,EAAG,UAAU,CAAS;EAAU;EAAhD,UAAA,CACG,MAAU,KAAA,KACT,kBAAC,OAAD;GAAK,WAAU;GAAmD,UAAA;EAAW,CAAA,GAE/E,kBAAC,OAAD;GACE,WAAW,EACT,SACA,MAAgB,eAAe,gCAAgC,eACjE;GACA,MAAK;GAEJ,UAAA,EAAQ,KAAK,MAAW;IACvB,IAAM,IAAU,EAAS,IAAI,EAAO,KAAK,GACnC,IAAiB,KAAY,EAAO;IAC1C,OACE,kBAAC,GAAD;KAEE,OAAO,EAAO;KACL;KACT,WAAW,MAAS,EAAa,EAAO,OAAO,CAAI;KACnD,SAAS,MAAY,YAAY,YAAY;KACvC;KACN,UAAU;KACJ;IACP,GARM,OAAO,EAAO,KAAK,CAQzB;GAEL,CAAC;EACE,CAAA,CACF;;AAET"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/MultipleChoice/index.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState } from 'react';\nimport { cn } from '../../utils/cn';\nimport Checkbox from '../Checkbox';\n\nexport type MultipleChoiceOption = {\n  /** Value submitted for this option. */\n  value: string | number;\n  /** Display label. */\n  label: React.ReactNode;\n  /** Disable this option only. */\n  disabled?: boolean;\n};\n\nexport type MultipleChoiceVariant =\n  | 'default'\n  | 'primary'\n  | 'secondary'\n  | 'accent'\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'error';\n\nexport type MultipleChoiceProps = {\n  /** Available options. */\n  options: MultipleChoiceOption[];\n  /** Controlled selected values. */\n  value?: Array<string | number>;\n  /** Uncontrolled initial selection. */\n  defaultValue?: Array<string | number>;\n  /** Change handler with the full selected-value array. */\n  onChange?: (values: Array<string | number>) => void;\n  /** Layout of the options. */\n  orientation?: 'vertical' | 'horizontal';\n  /** Color variant forwarded to each checkbox. */\n  variant?: MultipleChoiceVariant;\n  /** Size forwarded to each checkbox. */\n  size?: 'xs' | 'sm' | 'md' | 'lg';\n  /** Disable the whole group. */\n  disabled?: boolean;\n  /** Limit the number of selectable options. */\n  maxSelected?: number;\n  /** Optional group label rendered above the options. */\n  label?: React.ReactNode;\n  /** Native name attribute for each checkbox. */\n  name?: string;\n  /** Extra class names on the wrapper. */\n  className?: string;\n  /** Inline styles on the wrapper. */\n  style?: React.CSSProperties;\n};\n\n/**\n * MultipleChoice —— A2UI 交互组件（v0.8）：多选项组。\n * 基于 dishui Checkbox 的受控 / 非受控多选组，支持横竖排与最大选择数限制。\n */\nconst MultipleChoice: React.FC<MultipleChoiceProps> = ({\n  options,\n  value,\n  defaultValue = [],\n  onChange,\n  orientation = 'vertical',\n  variant = 'default',\n  size = 'sm',\n  disabled = false,\n  maxSelected,\n  label,\n  name,\n  className = '',\n  style,\n}) => {\n  const [internal, setInternal] = useState<Array<string | number>>(defaultValue);\n  const isControlled = value !== undefined;\n  const selected = useMemo(\n    () => new Set<string | number>(isControlled ? (value as Array<string | number>) : internal),\n    [isControlled, value, internal],\n  );\n\n  const toggle = useCallback(\n    (optionValue: string | number, next: boolean) => {\n      const base = Array.from(selected);\n      const result = next ? [...base, optionValue] : base.filter((v) => v !== optionValue);\n      if (!isControlled) setInternal(result);\n      onChange?.(result);\n    },\n    [selected, isControlled, onChange],\n  );\n\n  const handleToggle = useCallback(\n    (optionValue: string | number, next: boolean) => {\n      // Enforce maxSelected only when turning a new option ON.\n      if (next && maxSelected !== undefined && selected.size >= maxSelected) return;\n      toggle(optionValue, next);\n    },\n    [toggle, maxSelected, selected],\n  );\n\n  return (\n    <div className={cn('w-full', className)} style={style}>\n      {label !== undefined && (\n        <div className=\"mb-1.5 text-sm font-medium text-base-content/80\">{label}</div>\n      )}\n      <div\n        className={cn(\n          'gap-2',\n          orientation === 'horizontal' ? 'flex flex-wrap items-center' : 'flex flex-col',\n        )}\n        role=\"group\"\n      >\n        {options.map((option) => {\n          const checked = selected.has(option.value);\n          const optionDisabled = disabled || option.disabled;\n          return (\n            <Checkbox\n              key={String(option.value)}\n              label={option.label}\n              checked={checked}\n              onChange={(next) => handleToggle(option.value, next)}\n              variant={variant === 'default' ? 'default' : variant}\n              size={size}\n              disabled={optionDisabled}\n              name={name}\n              value={String(option.value)}\n            />\n          );\n        })}\n      </div>\n    </div>\n  );\n};\n\nexport default MultipleChoice;\n"],"mappings":";;;;;AAwDA,IAAM,KAAiD,EACrD,YACA,UACA,kBAAe,CAAC,GAChB,aACA,iBAAc,YACd,aAAU,WACV,UAAO,MACP,cAAW,IACX,gBACA,UACA,SACA,eAAY,IACZ,eACI;CACJ,IAAM,CAAC,GAAU,KAAe,EAAiC,CAAY,GACvE,IAAe,MAAU,KAAA,GACzB,IAAW,QACT,IAAI,IAAqB,IAAgB,IAAmC,CAAQ,GAC1F;EAAC;EAAc;EAAO;CAAQ,CAChC,GAEM,IAAS,GACZ,GAA8B,MAAkB;EAC/C,IAAM,IAAO,MAAM,KAAK,CAAQ,GAC1B,IAAS,IAAO,CAAC,GAAG,GAAM,CAAW,IAAI,EAAK,QAAQ,MAAM,MAAM,CAAW;EAEnF,AADK,KAAc,EAAY,CAAM,GACrC,IAAW,CAAM;CACnB,GACA;EAAC;EAAU;EAAc;CAAQ,CACnC,GAEM,IAAe,GAClB,GAA8B,MAAkB;EAE3C,KAAQ,MAAgB,KAAA,KAAa,EAAS,QAAQ,KAC1D,EAAO,GAAa,CAAI;CAC1B,GACA;EAAC;EAAQ;EAAa;CAAQ,CAChC;CAEA,OACE,kBAAC,OAAD;EAAK,WAAW,EAAG,UAAU,CAAS;EAAU;EAAhD,UAAA,CACG,MAAU,KAAA,KACT,kBAAC,OAAD;GAAK,WAAU;GAAmD,UAAA;EAAW,CAAA,GAE/E,kBAAC,OAAD;GACE,WAAW,EACT,SACA,MAAgB,eAAe,gCAAgC,eACjE;GACA,MAAK;GAEJ,UAAA,EAAQ,KAAK,MAAW;IACvB,IAAM,IAAU,EAAS,IAAI,EAAO,KAAK,GACnC,IAAiB,KAAY,EAAO;IAC1C,OACE,kBAAC,GAAD;KAEE,OAAO,EAAO;KACL;KACT,WAAW,MAAS,EAAa,EAAO,OAAO,CAAI;KACnD,SAAS,MAAY,YAAY,YAAY;KACvC;KACN,UAAU;KACJ;KACN,OAAO,OAAO,EAAO,KAAK;IAC3B,GATM,OAAO,EAAO,KAAK,CASzB;GAEL,CAAC;EACE,CAAA,CACF;;AAET"}

package/dist/components/Row/index.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
-export type RowAlign = 'start' | 'center' | 'end' | 'baseline' | 'stretch';
-export type RowJustify = 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly';
+import { type FlexAlign, type FlexJustify } from '../../utils/flexLayout';
+export type RowAlign = FlexAlign;
+export type RowJustify = FlexJustify;
 export type RowProps = {
     children?: React.ReactNode;
     /** Gap between children; number is treated as px. */

package/dist/components/Row/index.js

@@ -1,24 +1,12 @@
 import { cn as e } from "../../utils/cn.js";
+import { FLEX_ALIGN_CLASS as t, FLEX_JUSTIFY_CLASS as n, flexGap as r } from "../../utils/flexLayout.js";
 import "react";
-import { jsx as t } from "react/jsx-runtime";
+import { jsx as i } from "react/jsx-runtime";
 //#region src/components/Row/index.tsx
-var n = {
-	start: "items-start",
-	center: "items-center",
-	end: "items-end",
-	baseline: "items-baseline",
-	stretch: "items-stretch"
-}, r = {
-	start: "justify-start",
-	center: "justify-center",
-	end: "justify-end",
-	between: "justify-between",
-	around: "justify-around",
-	evenly: "justify-evenly"
-}, i = (e) => typeof e == "number" ? `${e}px` : e, a = ({ children: a, gap: o, align: s = "center", justify: c = "start", wrap: l = !1, reverse: u = !1, className: d = "", style: f, onClick: p }) => /* @__PURE__ */ t("div", {
-	className: e("flex", u ? "flex-row-reverse" : "flex-row", n[s], r[c], l && "flex-wrap", d),
+var a = ({ children: a, gap: o, align: s = "center", justify: c = "start", wrap: l = !1, reverse: u = !1, className: d = "", style: f, onClick: p }) => /* @__PURE__ */ i("div", {
+	className: e("flex", u ? "flex-row-reverse" : "flex-row", t[s], n[c], l && "flex-wrap", d),
 	style: {
-		gap: i(o),
+		gap: r(o),
 		...f
 	},
 	onClick: p,

package/dist/components/Row/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Row/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '../../utils/cn';\n\nexport type RowAlign = 'start' | 'center' | 'end' | 'baseline' | 'stretch';\nexport type RowJustify = 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly';\n\nexport type RowProps = {\n  children?: React.ReactNode;\n  /** Gap between children; number is treated as px. */\n  gap?: number | string;\n  /** Cross-axis alignment. */\n  align?: RowAlign;\n  /** Main-axis distribution. */\n  justify?: RowJustify;\n  /** Allow children to wrap onto the next line. */\n  wrap?: boolean;\n  /** Reverse the visual order of children. */\n  reverse?: boolean;\n  /** Extra class names on the container. */\n  className?: string;\n  /** Inline styles on the container. */\n  style?: React.CSSProperties;\n  /** Click handler on the container. */\n  onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;\n};\n\nconst ALIGN_CLASS: Record<RowAlign, string> = {\n  start: 'items-start',\n  center: 'items-center',\n  end: 'items-end',\n  baseline: 'items-baseline',\n  stretch: 'items-stretch',\n};\n\nconst JUSTIFY_CLASS: Record<RowJustify, string> = {\n  start: 'justify-start',\n  center: 'justify-center',\n  end: 'justify-end',\n  between: 'justify-between',\n  around: 'justify-around',\n  evenly: 'justify-evenly',\n};\n\nconst size = (v: number | string | undefined): string | undefined =>\n  typeof v === 'number' ? `${v}px` : v;\n\n/**\n * Row —— A2UI 布局组件：水平排列子元素。\n * 等价于 `display: flex; flex-direction: row` 的语义化封装。\n */\nconst Row: React.FC<RowProps> = ({\n  children,\n  gap,\n  align = 'center',\n  justify = 'start',\n  wrap = false,\n  reverse = false,\n  className = '',\n  style,\n  onClick,\n}) => (\n  <div\n    className={cn(\n      'flex',\n      reverse ? 'flex-row-reverse' : 'flex-row',\n      ALIGN_CLASS[align],\n      JUSTIFY_CLASS[justify],\n      wrap && 'flex-wrap',\n      className,\n    )}\n    style={{ gap: size(gap), ...style }}\n    onClick={onClick}\n  >\n    {children}\n  </div>\n);\n\nexport default Row;\n"],"mappings":";;;;AA0BA,IAAM,IAAwC;CAC5C,OAAO;CACP,QAAQ;CACR,KAAK;CACL,UAAU;CACV,SAAS;AACX,GAEM,IAA4C;CAChD,OAAO;CACP,QAAQ;CACR,KAAK;CACL,SAAS;CACT,QAAQ;CACR,QAAQ;AACV,GAEM,KAAQ,MACZ,OAAO,KAAM,WAAW,GAAG,EAAE,MAAM,GAM/B,KAA2B,EAC/B,aACA,QACA,WAAQ,UACR,aAAU,SACV,UAAO,IACP,aAAU,IACV,eAAY,IACZ,UACA,iBAEA,kBAAC,OAAD;CACE,WAAW,EACT,QACA,IAAU,qBAAqB,YAC/B,EAAY,IACZ,EAAc,IACd,KAAQ,aACR,CACF;CACA,OAAO;EAAE,KAAK,EAAK,CAAG;EAAG,GAAG;CAAM;CACzB;CAER;AACE,CAAA"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Row/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '../../utils/cn';\nimport { FLEX_ALIGN_CLASS, FLEX_JUSTIFY_CLASS, flexGap, type FlexAlign, type FlexJustify } from '../../utils/flexLayout';\n\nexport type RowAlign = FlexAlign;\nexport type RowJustify = FlexJustify;\n\nexport type RowProps = {\n  children?: React.ReactNode;\n  /** Gap between children; number is treated as px. */\n  gap?: number | string;\n  /** Cross-axis alignment. */\n  align?: RowAlign;\n  /** Main-axis distribution. */\n  justify?: RowJustify;\n  /** Allow children to wrap onto the next line. */\n  wrap?: boolean;\n  /** Reverse the visual order of children. */\n  reverse?: boolean;\n  /** Extra class names on the container. */\n  className?: string;\n  /** Inline styles on the container. */\n  style?: React.CSSProperties;\n  /** Click handler on the container. */\n  onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;\n};\n\n\n/**\n * Row —— A2UI 布局组件：水平排列子元素。\n * 等价于 `display: flex; flex-direction: row` 的语义化封装。\n */\nconst Row: React.FC<RowProps> = ({\n  children,\n  gap,\n  align = 'center',\n  justify = 'start',\n  wrap = false,\n  reverse = false,\n  className = '',\n  style,\n  onClick,\n}) => (\n  <div\n    className={cn(\n      'flex',\n      reverse ? 'flex-row-reverse' : 'flex-row',\n      FLEX_ALIGN_CLASS[align],\n      FLEX_JUSTIFY_CLASS[justify],\n      wrap && 'flex-wrap',\n      className,\n    )}\n    style={{ gap: flexGap(gap), ...style }}\n    onClick={onClick}\n  >\n    {children}\n  </div>\n);\n\nexport default Row;\n"],"mappings":";;;;;AAgCA,IAAM,KAA2B,EAC/B,aACA,QACA,WAAQ,UACR,aAAU,SACV,UAAO,IACP,aAAU,IACV,eAAY,IACZ,UACA,iBAEA,kBAAC,OAAD;CACE,WAAW,EACT,QACA,IAAU,qBAAqB,YAC/B,EAAiB,IACjB,EAAmB,IACnB,KAAQ,aACR,CACF;CACA,OAAO;EAAE,KAAK,EAAQ,CAAG;EAAG,GAAG;CAAM;CAC5B;CAER;AACE,CAAA"}