@lobehub/ui 5.51.1 → 5.52.0

package/es/base-ui/Input/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../../src/base-ui/Input/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { controlHeight } from '@/base-ui/controlSize';\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  borderless: css`\n    border: 1px solid transparent;\n    background: none;\n  `,\n  filled: css`\n    border: 1px solid transparent;\n    background: ${cssVar.colorFillTertiary};\n\n    &:hover:not(:focus-within, [data-disabled]) {\n      background: ${cssVar.colorFillSecondary};\n    }\n  `,\n  input: css`\n    flex: 1;\n\n    min-width: 0;\n    padding: 0;\n    border: none;\n\n    font: inherit;\n    color: inherit;\n\n    appearance: none;\n    background: transparent;\n    outline: none;\n\n    &::placeholder {\n      color: ${cssVar.colorTextPlaceholder};\n    }\n  `,\n  invalid: css`\n    &:has([data-invalid]) {\n      border-color: ${cssVar.colorError};\n\n      &:focus-within {\n        border-color: ${cssVar.colorError};\n        box-shadow: 0 0 0 2px ${cssVar.colorErrorBg};\n      }\n    }\n  `,\n  outlined: css`\n    border: 1px solid ${cssVar.colorBorderSecondary};\n    background: ${cssVar.colorBgContainer};\n\n    &:hover:not(:focus-within, [data-disabled]) {\n      border-color: ${cssVar.colorBorder};\n    }\n\n    &:focus-within {\n      border-color: ${cssVar.colorPrimary};\n      box-shadow: 0 0 0 2px ${cssVar.colorPrimaryBg};\n    }\n  `,\n  root: css`\n    cursor: text;\n\n    display: inline-flex;\n    gap: 8px;\n    align-items: center;\n\n    box-sizing: border-box;\n    width: 100%;\n    padding-inline: 12px;\n    border-radius: ${cssVar.borderRadius};\n\n    font-size: 14px;\n    color: ${cssVar.colorText};\n\n    transition:\n      background 150ms ${cssVar.motionEaseOut},\n      border-color 150ms ${cssVar.motionEaseOut},\n      box-shadow 150ms ${cssVar.motionEaseOut};\n\n    &[data-disabled],\n    &:has(:disabled) {\n      cursor: not-allowed;\n      color: ${cssVar.colorTextQuaternary};\n      opacity: 0.66;\n    }\n  `,\n  shadow: lobeStaticStylish.shadow,\n  sizeLarge: css`\n    height: ${controlHeight.large}px;\n    border-radius: ${cssVar.borderRadiusLG};\n    font-size: 16px;\n  `,\n  sizeMiddle: css`\n    height: ${controlHeight.middle}px;\n  `,\n  sizeSmall: css`\n    height: ${controlHeight.small}px;\n    padding-inline: 8px;\n    border-radius: ${cssVar.borderRadiusSM};\n    font-size: 12px;\n  `,\n  numberControl: css`\n    cursor: pointer;\n\n    display: flex;\n    flex: 1;\n    align-items: center;\n    justify-content: center;\n\n    margin: 0;\n    padding: 0;\n    border: none;\n\n    color: ${cssVar.colorTextTertiary};\n\n    background: none;\n    outline: none;\n\n    transition: color 150ms ${cssVar.motionEaseOut};\n\n    &:hover:not(:disabled) {\n      color: ${cssVar.colorText};\n    }\n\n    &:disabled {\n      cursor: not-allowed;\n      opacity: 0.4;\n    }\n  `,\n  numberControls: css`\n    display: flex;\n    flex: none;\n    flex-direction: column;\n    align-self: stretch;\n\n    width: 22px;\n    margin-inline-end: -8px;\n    border-inline-start: 1px solid ${cssVar.colorBorderSecondary};\n  `,\n  numberInput: css`\n    font-variant-numeric: tabular-nums;\n  `,\n  otpCell: css`\n    flex: none;\n    width: ${controlHeight.middle}px;\n    padding-inline: 0;\n    text-align: center;\n  `,\n  otpRoot: css`\n    display: inline-flex;\n    gap: 8px;\n    align-items: center;\n  `,\n  passwordToggle: css`\n    cursor: pointer;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    margin: 0;\n    padding: 0;\n    border: none;\n\n    color: ${cssVar.colorTextTertiary};\n\n    background: none;\n    outline: none;\n\n    transition: color 150ms ${cssVar.motionEaseOut};\n\n    &:hover {\n      color: ${cssVar.colorText};\n    }\n  `,\n  slot: css`\n    display: inline-flex;\n    flex: none;\n    align-items: center;\n    color: ${cssVar.colorTextTertiary};\n  `,\n  textarea: css`\n    height: auto;\n    padding-block: 8px;\n\n    textarea {\n      resize: none;\n      min-height: calc(1.5em * var(--textarea-min-rows, 2));\n      max-height: var(--textarea-max-height, none);\n      line-height: 1.5;\n    }\n  `,\n  textareaAutoSize: css`\n    textarea {\n      field-sizing: content;\n    }\n  `,\n  textareaResize: css`\n    textarea {\n      resize: vertical;\n    }\n  `,\n}));\n\nexport const rootVariants = cva([styles.root, styles.invalid], {\n  defaultVariants: {\n    shadow: false,\n    size: 'middle',\n    variant: 'outlined',\n  },\n  variants: {\n    shadow: {\n      false: null,\n      true: styles.shadow,\n    },\n    size: {\n      large: styles.sizeLarge,\n      middle: styles.sizeMiddle,\n      small: styles.sizeSmall,\n    },\n    variant: {\n      borderless: styles.borderless,\n      filled: styles.filled,\n      outlined: styles.outlined,\n    },\n  },\n});\n"],"mappings":";;;;;AAMA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,YAAY,GAAG;;;;CAIf,QAAQ,GAAG;;kBAEK,OAAO,kBAAkB;;;oBAGvB,OAAO,mBAAmB;;;CAG5C,OAAO,GAAG;;;;;;;;;;;;;;;eAeG,OAAO,qBAAqB;;;CAGzC,SAAS,GAAG;;sBAEQ,OAAO,WAAW;;;wBAGhB,OAAO,WAAW;gCACV,OAAO,aAAa;;;;CAIlD,UAAU,GAAG;wBACS,OAAO,qBAAqB;kBAClC,OAAO,iBAAiB;;;sBAGpB,OAAO,YAAY;;;;sBAInB,OAAO,aAAa;8BACZ,OAAO,eAAe;;;CAGlD,MAAM,GAAG;;;;;;;;;;qBAUU,OAAO,aAAa;;;aAG5B,OAAO,UAAU;;;yBAGL,OAAO,cAAc;2BACnB,OAAO,cAAc;yBACvB,OAAO,cAAc;;;;;eAK/B,OAAO,oBAAoB;;;;CAIxC,QAAQA,cAAkB;CAC1B,WAAW,GAAG;cACF,cAAc,MAAM;qBACb,OAAO,eAAe;;;CAGzC,YAAY,GAAG;cACH,cAAc,OAAO;;CAEjC,WAAW,GAAG;cACF,cAAc,MAAM;;qBAEb,OAAO,eAAe;;;CAGzC,eAAe,GAAG;;;;;;;;;;;;aAYP,OAAO,kBAAkB;;;;;8BAKR,OAAO,cAAc;;;eAGpC,OAAO,UAAU;;;;;;;;CAQ9B,gBAAgB,GAAG;;;;;;;;qCAQgB,OAAO,qBAAqB;;CAE/D,aAAa,GAAG;;;CAGhB,SAAS,GAAG;;aAED,cAAc,OAAO;;;;CAIhC,SAAS,GAAG;;;;;CAKZ,gBAAgB,GAAG;;;;;;;;;;;aAWR,OAAO,kBAAkB;;;;;8BAKR,OAAO,cAAc;;;eAGpC,OAAO,UAAU;;;CAG9B,MAAM,GAAG;;;;aAIE,OAAO,kBAAkB;;CAEpC,UAAU,GAAG;;;;;;;;;;;CAWb,kBAAkB,GAAG;;;;;CAKrB,gBAAgB,GAAG;;;;;AAKrB,EAAE;AAEF,MAAa,eAAe,IAAI,CAAC,OAAO,MAAM,OAAO,OAAO,GAAG;CAC7D,iBAAiB;EACf,QAAQ;EACR,MAAM;EACN,SAAS;CACX;CACA,UAAU;EACR,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,MAAM;GACJ,OAAO,OAAO;GACd,QAAQ,OAAO;GACf,OAAO,OAAO;EAChB;EACA,SAAS;GACP,YAAY,OAAO;GACnB,QAAQ,OAAO;GACf,UAAU,OAAO;EACnB;CACF;AACF,CAAC"}
+{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../../src/base-ui/Input/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { controlHeight } from '@/base-ui/controlSize';\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  clear: css`\n    cursor: pointer;\n\n    display: inline-flex;\n    flex: none;\n    align-items: center;\n    justify-content: center;\n\n    width: 16px;\n    height: 16px;\n    padding: 0;\n    border: 0;\n    border-radius: 50%;\n\n    color: ${cssVar.colorBgContainer};\n\n    visibility: hidden;\n    background: ${cssVar.colorTextQuaternary};\n\n    &:hover {\n      background: ${cssVar.colorTextTertiary};\n    }\n  `,\n  count: css`\n    pointer-events: none;\n\n    position: absolute;\n    inset-block-end: 6px;\n    inset-inline-end: 8px;\n\n    display: inline-flex;\n    align-items: center;\n\n    height: 20px;\n    padding-inline: 8px;\n    border-radius: 999px;\n\n    font-size: 11px;\n    font-weight: 600;\n    font-variant-numeric: tabular-nums;\n    color: ${cssVar.colorTextSecondary};\n\n    background: ${cssVar.colorFillTertiary};\n\n    &[data-over] {\n      color: ${cssVar.colorWhite};\n      background: ${cssVar.colorError};\n    }\n  `,\n  textareaClear: css`\n    position: absolute;\n    inset-block-start: 10px;\n    inset-inline-end: 10px;\n  `,\n  textareaWithCount: css`\n    padding-block-end: 30px;\n  `,\n  borderless: css`\n    border: 1px solid transparent;\n    background: none;\n  `,\n  filled: css`\n    border: 1px solid transparent;\n    background: ${cssVar.colorFillTertiary};\n\n    &:hover:not(:focus-within, [data-disabled]) {\n      background: ${cssVar.colorFillSecondary};\n    }\n  `,\n  input: css`\n    flex: 1;\n\n    min-width: 0;\n    padding: 0;\n    border: none;\n\n    font: inherit;\n    color: inherit;\n\n    appearance: none;\n    background: transparent;\n    outline: none;\n\n    &::placeholder {\n      color: ${cssVar.colorTextPlaceholder};\n    }\n  `,\n  invalid: css`\n    &:has([data-invalid], [aria-invalid='true']) {\n      border-color: ${cssVar.colorError};\n\n      &:focus-within {\n        border-color: ${cssVar.colorError};\n        box-shadow: 0 0 0 2px ${cssVar.colorErrorBg};\n      }\n    }\n  `,\n  outlined: css`\n    border: 1px solid ${cssVar.colorBorderSecondary};\n    background: ${cssVar.colorBgContainer};\n\n    &:hover:not(:focus-within, [data-disabled]) {\n      border-color: ${cssVar.colorBorder};\n    }\n\n    &:focus-within {\n      border-color: ${cssVar.colorPrimary};\n      box-shadow: 0 0 0 2px ${cssVar.colorPrimaryBg};\n    }\n  `,\n  root: css`\n    cursor: text;\n\n    display: inline-flex;\n    gap: 8px;\n    align-items: center;\n\n    box-sizing: border-box;\n    width: 100%;\n    padding-inline: 12px;\n    border-radius: ${cssVar.borderRadius};\n\n    font-size: 14px;\n    color: ${cssVar.colorText};\n\n    transition:\n      background 150ms ${cssVar.motionEaseOut},\n      border-color 150ms ${cssVar.motionEaseOut},\n      box-shadow 150ms ${cssVar.motionEaseOut};\n\n    &[data-disabled],\n    &:has(:disabled) {\n      cursor: not-allowed;\n      color: ${cssVar.colorTextQuaternary};\n      opacity: 0.66;\n    }\n\n    &:hover [data-lobe-input-clear],\n    &:focus-within [data-lobe-input-clear] {\n      visibility: visible;\n    }\n  `,\n  shadow: lobeStaticStylish.shadow,\n  sizeLarge: css`\n    min-height: ${controlHeight.large}px;\n    border-radius: ${cssVar.borderRadiusLG};\n    font-size: 16px;\n  `,\n  sizeMiddle: css`\n    min-height: ${controlHeight.middle}px;\n  `,\n  sizeSmall: css`\n    min-height: ${controlHeight.small}px;\n    padding-inline: 8px;\n    border-radius: ${cssVar.borderRadiusSM};\n    font-size: 12px;\n  `,\n  numberControl: css`\n    cursor: pointer;\n\n    display: flex;\n    flex: 1;\n    align-items: center;\n    justify-content: center;\n\n    margin: 0;\n    padding: 0;\n    border: none;\n\n    color: ${cssVar.colorTextTertiary};\n\n    background: none;\n    outline: none;\n\n    transition: color 150ms ${cssVar.motionEaseOut};\n\n    &:hover:not(:disabled) {\n      color: ${cssVar.colorText};\n    }\n\n    &:disabled {\n      cursor: not-allowed;\n      opacity: 0.4;\n    }\n  `,\n  numberControls: css`\n    display: flex;\n    flex: none;\n    flex-direction: column;\n    align-self: stretch;\n\n    width: 22px;\n    margin-inline-end: -8px;\n    border-inline-start: 1px solid ${cssVar.colorBorderSecondary};\n  `,\n  numberInput: css`\n    font-variant-numeric: tabular-nums;\n  `,\n  otpCell: css`\n    flex: none;\n    width: ${controlHeight.middle}px;\n    padding-inline: 0;\n    text-align: center;\n  `,\n  otpRoot: css`\n    display: inline-flex;\n    gap: 8px;\n    align-items: center;\n  `,\n  passwordToggle: css`\n    cursor: pointer;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    margin: 0;\n    padding: 0;\n    border: none;\n\n    color: ${cssVar.colorTextTertiary};\n\n    background: none;\n    outline: none;\n\n    transition: color 150ms ${cssVar.motionEaseOut};\n\n    &:hover {\n      color: ${cssVar.colorText};\n    }\n  `,\n  slot: css`\n    display: inline-flex;\n    flex: none;\n    align-items: center;\n    color: ${cssVar.colorTextTertiary};\n  `,\n  textarea: css`\n    position: relative;\n    height: auto;\n    padding-block: 8px;\n\n    textarea {\n      resize: none;\n      min-height: calc(1.5em * var(--textarea-min-rows, 2));\n      max-height: var(--textarea-max-height, none);\n      line-height: 1.5;\n    }\n  `,\n  textareaAutoSize: css`\n    textarea {\n      field-sizing: content;\n    }\n  `,\n  textareaResize: css`\n    textarea {\n      resize: vertical;\n    }\n  `,\n}));\n\nexport const rootVariants = cva([styles.root, styles.invalid], {\n  defaultVariants: {\n    shadow: false,\n    size: 'middle',\n    variant: 'outlined',\n  },\n  variants: {\n    shadow: {\n      false: null,\n      true: styles.shadow,\n    },\n    size: {\n      large: styles.sizeLarge,\n      middle: styles.sizeMiddle,\n      small: styles.sizeSmall,\n    },\n    variant: {\n      borderless: styles.borderless,\n      filled: styles.filled,\n      outlined: styles.outlined,\n    },\n  },\n});\n"],"mappings":";;;;;AAMA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,OAAO,GAAG;;;;;;;;;;;;;;aAcC,OAAO,iBAAiB;;;kBAGnB,OAAO,oBAAoB;;;oBAGzB,OAAO,kBAAkB;;;CAG3C,OAAO,GAAG;;;;;;;;;;;;;;;;;aAiBC,OAAO,mBAAmB;;kBAErB,OAAO,kBAAkB;;;eAG5B,OAAO,WAAW;oBACb,OAAO,WAAW;;;CAGpC,eAAe,GAAG;;;;;CAKlB,mBAAmB,GAAG;;;CAGtB,YAAY,GAAG;;;;CAIf,QAAQ,GAAG;;kBAEK,OAAO,kBAAkB;;;oBAGvB,OAAO,mBAAmB;;;CAG5C,OAAO,GAAG;;;;;;;;;;;;;;;eAeG,OAAO,qBAAqB;;;CAGzC,SAAS,GAAG;;sBAEQ,OAAO,WAAW;;;wBAGhB,OAAO,WAAW;gCACV,OAAO,aAAa;;;;CAIlD,UAAU,GAAG;wBACS,OAAO,qBAAqB;kBAClC,OAAO,iBAAiB;;;sBAGpB,OAAO,YAAY;;;;sBAInB,OAAO,aAAa;8BACZ,OAAO,eAAe;;;CAGlD,MAAM,GAAG;;;;;;;;;;qBAUU,OAAO,aAAa;;;aAG5B,OAAO,UAAU;;;yBAGL,OAAO,cAAc;2BACnB,OAAO,cAAc;yBACvB,OAAO,cAAc;;;;;eAK/B,OAAO,oBAAoB;;;;;;;;;CASxC,QAAQA,cAAkB;CAC1B,WAAW,GAAG;kBACE,cAAc,MAAM;qBACjB,OAAO,eAAe;;;CAGzC,YAAY,GAAG;kBACC,cAAc,OAAO;;CAErC,WAAW,GAAG;kBACE,cAAc,MAAM;;qBAEjB,OAAO,eAAe;;;CAGzC,eAAe,GAAG;;;;;;;;;;;;aAYP,OAAO,kBAAkB;;;;;8BAKR,OAAO,cAAc;;;eAGpC,OAAO,UAAU;;;;;;;;CAQ9B,gBAAgB,GAAG;;;;;;;;qCAQgB,OAAO,qBAAqB;;CAE/D,aAAa,GAAG;;;CAGhB,SAAS,GAAG;;aAED,cAAc,OAAO;;;;CAIhC,SAAS,GAAG;;;;;CAKZ,gBAAgB,GAAG;;;;;;;;;;;aAWR,OAAO,kBAAkB;;;;;8BAKR,OAAO,cAAc;;;eAGpC,OAAO,UAAU;;;CAG9B,MAAM,GAAG;;;;aAIE,OAAO,kBAAkB;;CAEpC,UAAU,GAAG;;;;;;;;;;;;CAYb,kBAAkB,GAAG;;;;;CAKrB,gBAAgB,GAAG;;;;;AAKrB,EAAE;AAEF,MAAa,eAAe,IAAI,CAAC,OAAO,MAAM,OAAO,OAAO,GAAG;CAC7D,iBAAiB;EACf,QAAQ;EACR,MAAM;EACN,SAAS;CACX;CACA,UAAU;EACR,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,MAAM;GACJ,OAAO,OAAO;GACd,QAAQ,OAAO;GACf,OAAO,OAAO;EAChB;EACA,SAAS;GACP,YAAY,OAAO;GACnB,QAAQ,OAAO;GACf,UAAU,OAAO;EACnB;CACF;AACF,CAAC"}

package/es/base-ui/Input/type.d.mts

@@ -1,4 +1,4 @@
-import { CSSProperties, ComponentProps, ReactNode, Ref } from "react";
+import { CSSProperties, ComponentProps, KeyboardEvent, ReactNode, Ref } from "react";
 import { Input } from "@base-ui/react/input";
 import { NumberField } from "@base-ui/react/number-field";
 import { OTPField } from "@base-ui/react/otp-field";
@@ -17,11 +17,14 @@ interface InputStyles {
 }
 type BaseInputProps = Omit<ComponentProps<typeof Input>, 'size' | 'prefix' | 'render' | 'className' | 'style'>;
 interface InputProps extends BaseInputProps {
+  allowClear?: boolean;
   className?: string;
   /**
    * Custom class names for each part
    */
   classNames?: InputClassNames;
+  onClear?: () => void;
+  onPressEnter?: (event: KeyboardEvent<HTMLInputElement>) => void;
   /**
    * Prefix node rendered before the input
    */
@@ -60,7 +63,7 @@ interface InputPasswordProps extends Omit<InputProps, 'type'> {
    */
   visibilityToggle?: boolean;
 }
-type BaseNumberFieldProps = Omit<ComponentProps<typeof NumberField.Root>, 'className' | 'style' | 'render' | 'onValueChange' | 'children'>;
+type BaseNumberFieldProps = Omit<ComponentProps<typeof NumberField.Root>, 'className' | 'style' | 'render' | 'onValueChange' | 'children' | 'prefix'>;
 interface InputNumberProps extends BaseNumberFieldProps {
   /**
    * Change value on wheel scrub
@@ -74,12 +77,16 @@ interface InputNumberProps extends BaseNumberFieldProps {
    */
   controls?: boolean;
   onChange?: (value: number | null) => void;
+  onPressEnter?: (event: KeyboardEvent<HTMLInputElement>) => void;
   placeholder?: string;
+  precision?: number;
+  prefix?: ReactNode;
   ref?: Ref<HTMLInputElement>;
   shadow?: boolean;
   size?: InputSize;
   style?: CSSProperties;
   styles?: Pick<InputStyles, 'input'>;
+  suffix?: ReactNode;
   variant?: InputVariant;
 }
 type BaseOTPFieldProps = Omit<ComponentProps<typeof OTPField.Root>, 'className' | 'style' | 'render' | 'onValueChange' | 'children' | 'length'>;
@@ -103,17 +110,21 @@ type TextAreaAutoSize = boolean | {
   minRows?: number;
 };
 interface TextAreaProps extends Omit<ComponentProps<'textarea'>, 'prefix'>, Pick<InputProps, 'shadow' | 'variant'> {
+  allowClear?: boolean;
   /**
    * Auto grow with content, optionally bounded by minRows/maxRows
    */
   autoSize?: TextAreaAutoSize;
   classNames?: Pick<InputClassNames, 'input'>;
+  onClear?: () => void;
+  onPressEnter?: (event: KeyboardEvent<HTMLTextAreaElement>) => void;
   ref?: Ref<HTMLTextAreaElement>;
   /**
    * Allow manual resize
    * @default false
    */
   resize?: boolean;
+  showCount?: boolean;
   styles?: Pick<InputStyles, 'input'>;
 }
 //#endregion

package/es/base-ui/List/List.d.mts

@@ -0,0 +1,6 @@
+import { ListProps } from "./type.mjs";
+//#region src/base-ui/List/List.d.ts
+declare const List: import("react").NamedExoticComponent<ListProps>;
+//#endregion
+export { List as default };
+//# sourceMappingURL=List.d.mts.map

package/es/base-ui/List/List.mjs

@@ -0,0 +1,50 @@
+"use client";
+import { styles } from "./style.mjs";
+import ListRow from "./ListRow.mjs";
+import { memo, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx } from "antd-style";
+//#region src/base-ui/List/List.tsx
+const isDivider = (item) => item.type === "divider";
+const variantClass = {
+	borderless: void 0,
+	filled: styles.filled,
+	outlined: styles.outlined
+};
+const List = memo(({ activeKey, className, classNames, compact = false, defaultActiveKey, items, onActiveChange, onClick, ref, selectable = false, styles: customStyles, variant = "borderless", ...rest }) => {
+	const [innerKey, setInnerKey] = useState(defaultActiveKey);
+	const currentKey = activeKey === void 0 ? innerKey : activeKey;
+	const handleSelect = (item, domEvent) => {
+		const info = {
+			domEvent,
+			item,
+			key: item.key
+		};
+		item.onClick?.(info);
+		onClick?.(info);
+		if (!selectable || item.key === currentKey) return;
+		if (activeKey === void 0) setInnerKey(item.key);
+		onActiveChange?.(item.key);
+	};
+	return /* @__PURE__ */ jsx("ul", {
+		className: cx(styles.root, variantClass[variant], compact && styles.compact, className),
+		ref,
+		role: "list",
+		...rest,
+		children: items.map((item, index) => isDivider(item) ? /* @__PURE__ */ jsx("li", {
+			className: styles.divider,
+			role: "separator"
+		}, item.key ?? `divider-${index}`) : /* @__PURE__ */ jsx(ListRow, {
+			active: currentKey !== void 0 && currentKey !== null && item.key === currentKey,
+			classNames,
+			item,
+			styles: customStyles,
+			onSelect: handleSelect
+		}, item.key))
+	});
+});
+List.displayName = "List";
+//#endregion
+export { List as default };
+
+//# sourceMappingURL=List.mjs.map

package/es/base-ui/List/List.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.mjs","names":[],"sources":["../../../src/base-ui/List/List.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { type Key, memo, type MouseEvent, useState } from 'react';\n\nimport ListRow from './ListRow';\nimport { styles } from './style';\nimport type { ListDividerType, ListItem, ListItemType, ListProps } from './type';\n\nconst isDivider = (item: ListItem): item is ListDividerType => item.type === 'divider';\n\nconst variantClass = {\n  borderless: undefined,\n  filled: styles.filled,\n  outlined: styles.outlined,\n};\n\nconst List = memo<ListProps>(\n  ({\n    activeKey,\n    className,\n    classNames,\n    compact = false,\n    defaultActiveKey,\n    items,\n    onActiveChange,\n    onClick,\n    ref,\n    selectable = false,\n    styles: customStyles,\n    variant = 'borderless',\n    ...rest\n  }) => {\n    const [innerKey, setInnerKey] = useState<Key | undefined>(defaultActiveKey);\n    const currentKey = activeKey === undefined ? innerKey : activeKey;\n\n    const handleSelect = (item: ListItemType, domEvent: MouseEvent<HTMLElement>) => {\n      const info = { domEvent, item, key: item.key };\n      item.onClick?.(info);\n      onClick?.(info);\n\n      if (!selectable || item.key === currentKey) return;\n      if (activeKey === undefined) setInnerKey(item.key);\n      onActiveChange?.(item.key);\n    };\n\n    return (\n      <ul\n        className={cx(styles.root, variantClass[variant], compact && styles.compact, className)}\n        ref={ref}\n        role=\"list\"\n        {...rest}\n      >\n        {items.map((item, index) =>\n          isDivider(item) ? (\n            <li className={styles.divider} key={item.key ?? `divider-${index}`} role=\"separator\" />\n          ) : (\n            <ListRow\n              active={currentKey !== undefined && currentKey !== null && item.key === currentKey}\n              classNames={classNames}\n              item={item}\n              key={item.key}\n              styles={customStyles}\n              onSelect={handleSelect}\n            />\n          ),\n        )}\n      </ul>\n    );\n  },\n);\n\nList.displayName = 'List';\n\nexport default List;\n"],"mappings":";;;;;;;AASA,MAAM,aAAa,SAA4C,KAAK,SAAS;AAE7E,MAAM,eAAe;CACnB,YAAY,KAAA;CACZ,QAAQ,OAAO;CACf,UAAU,OAAO;AACnB;AAEA,MAAM,OAAO,MACV,EACC,WACA,WACA,YACA,UAAU,OACV,kBACA,OACA,gBACA,SACA,KACA,aAAa,OACb,QAAQ,cACR,UAAU,cACV,GAAG,WACC;CACJ,MAAM,CAAC,UAAU,eAAe,SAA0B,gBAAgB;CAC1E,MAAM,aAAa,cAAc,KAAA,IAAY,WAAW;CAExD,MAAM,gBAAgB,MAAoB,aAAsC;EAC9E,MAAM,OAAO;GAAE;GAAU;GAAM,KAAK,KAAK;EAAI;EAC7C,KAAK,UAAU,IAAI;EACnB,UAAU,IAAI;EAEd,IAAI,CAAC,cAAc,KAAK,QAAQ,YAAY;EAC5C,IAAI,cAAc,KAAA,GAAW,YAAY,KAAK,GAAG;EACjD,iBAAiB,KAAK,GAAG;CAC3B;CAEA,OACE,oBAAC,MAAD;EACE,WAAW,GAAG,OAAO,MAAM,aAAa,UAAU,WAAW,OAAO,SAAS,SAAS;EACjF;EACL,MAAK;EACL,GAAI;EAEH,UAAA,MAAM,KAAK,MAAM,UAChB,UAAU,IAAI,IACZ,oBAAC,MAAD;GAAI,WAAW,OAAO;GAA8C,MAAK;EAAa,GAAlD,KAAK,OAAO,WAAW,OAA2B,IAEtF,oBAAC,SAAD;GACE,QAAQ,eAAe,KAAA,KAAa,eAAe,QAAQ,KAAK,QAAQ;GAC5D;GACN;GAEN,QAAQ;GACR,UAAU;EACX,GAHM,KAAK,GAGX,CAEL;CACE,CAAA;AAER,CACF;AAEA,KAAK,cAAc"}

package/es/base-ui/List/ListRow.mjs

@@ -0,0 +1,74 @@
+"use client";
+import A from "../../A/index.mjs";
+import Icon from "../../Icon/Icon.mjs";
+import { styles } from "./style.mjs";
+import { memo } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "antd-style";
+//#region src/base-ui/List/ListRow.tsx
+const ListRow = memo(({ active, classNames, item, onSelect, styles: customStyles }) => {
+	const { actions, avatar, danger, description, disabled, extra, href, icon, label, showAction } = item;
+	const handleClick = (event) => {
+		if (disabled) {
+			event.preventDefault();
+			return;
+		}
+		onSelect(item, event);
+	};
+	const rowClassName = cx(styles.row, active && styles.active, danger && styles.danger, disabled && styles.disabled, classNames?.item, item.className);
+	const rowStyle = {
+		...customStyles?.item,
+		...item.style
+	};
+	const content = /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		avatar ?? (icon ? /* @__PURE__ */ jsx(Icon, {
+			icon,
+			size: 16
+		}) : null),
+		/* @__PURE__ */ jsxs("span", {
+			className: styles.body,
+			children: [/* @__PURE__ */ jsx("span", {
+				className: cx(styles.label, classNames?.label),
+				style: customStyles?.label,
+				children: label
+			}), description != null && /* @__PURE__ */ jsx("span", {
+				className: cx(styles.description, classNames?.description),
+				style: customStyles?.description,
+				children: description
+			})]
+		}),
+		extra != null && /* @__PURE__ */ jsx("span", {
+			className: cx(styles.extra, classNames?.extra),
+			style: customStyles?.extra,
+			children: extra
+		})
+	] });
+	return /* @__PURE__ */ jsxs("li", {
+		className: cx(styles.item, showAction && styles.showAction),
+		children: [href && !disabled ? /* @__PURE__ */ jsx(A, {
+			"aria-current": active ? "page" : void 0,
+			className: rowClassName,
+			href,
+			style: rowStyle,
+			onClick: handleClick,
+			children: content
+		}) : /* @__PURE__ */ jsx("button", {
+			"aria-current": active ? "true" : void 0,
+			"aria-disabled": disabled || void 0,
+			className: rowClassName,
+			style: rowStyle,
+			type: "button",
+			onClick: handleClick,
+			children: content
+		}), actions != null && /* @__PURE__ */ jsx("span", {
+			className: cx(styles.actions, classNames?.actions),
+			style: customStyles?.actions,
+			children: actions
+		})]
+	});
+});
+ListRow.displayName = "ListRow";
+//#endregion
+export { ListRow as default };
+
+//# sourceMappingURL=ListRow.mjs.map

package/es/base-ui/List/ListRow.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListRow.mjs","names":[],"sources":["../../../src/base-ui/List/ListRow.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { memo, type MouseEvent } from 'react';\n\nimport A from '@/A';\nimport Icon from '@/Icon';\n\nimport { styles } from './style';\nimport type { ListItemType, ListProps } from './type';\n\ninterface ListRowProps {\n  active: boolean;\n  classNames?: ListProps['classNames'];\n  item: ListItemType;\n  onSelect: (item: ListItemType, event: MouseEvent<HTMLElement>) => void;\n  styles?: ListProps['styles'];\n}\n\nconst ListRow = memo<ListRowProps>(\n  ({ active, classNames, item, onSelect, styles: customStyles }) => {\n    const { actions, avatar, danger, description, disabled, extra, href, icon, label, showAction } =\n      item;\n\n    const handleClick = (event: MouseEvent<HTMLElement>) => {\n      if (disabled) {\n        event.preventDefault();\n        return;\n      }\n      onSelect(item, event);\n    };\n\n    const rowClassName = cx(\n      styles.row,\n      active && styles.active,\n      danger && styles.danger,\n      disabled && styles.disabled,\n      classNames?.item,\n      item.className,\n    );\n    const rowStyle = { ...customStyles?.item, ...item.style };\n\n    const content = (\n      <>\n        {avatar ?? (icon ? <Icon icon={icon} size={16} /> : null)}\n        <span className={styles.body}>\n          <span className={cx(styles.label, classNames?.label)} style={customStyles?.label}>\n            {label}\n          </span>\n          {description != null && (\n            <span\n              className={cx(styles.description, classNames?.description)}\n              style={customStyles?.description}\n            >\n              {description}\n            </span>\n          )}\n        </span>\n        {extra != null && (\n          <span className={cx(styles.extra, classNames?.extra)} style={customStyles?.extra}>\n            {extra}\n          </span>\n        )}\n      </>\n    );\n\n    return (\n      <li className={cx(styles.item, showAction && styles.showAction)}>\n        {href && !disabled ? (\n          <A\n            aria-current={active ? 'page' : undefined}\n            className={rowClassName}\n            href={href}\n            style={rowStyle}\n            onClick={handleClick}\n          >\n            {content}\n          </A>\n        ) : (\n          <button\n            aria-current={active ? 'true' : undefined}\n            aria-disabled={disabled || undefined}\n            className={rowClassName}\n            style={rowStyle}\n            type=\"button\"\n            onClick={handleClick}\n          >\n            {content}\n          </button>\n        )}\n        {actions != null && (\n          <span className={cx(styles.actions, classNames?.actions)} style={customStyles?.actions}>\n            {actions}\n          </span>\n        )}\n      </li>\n    );\n  },\n);\n\nListRow.displayName = 'ListRow';\n\nexport default ListRow;\n"],"mappings":";;;;;;;;AAmBA,MAAM,UAAU,MACb,EAAE,QAAQ,YAAY,MAAM,UAAU,QAAQ,mBAAmB;CAChE,MAAM,EAAE,SAAS,QAAQ,QAAQ,aAAa,UAAU,OAAO,MAAM,MAAM,OAAO,eAChF;CAEF,MAAM,eAAe,UAAmC;EACtD,IAAI,UAAU;GACZ,MAAM,eAAe;GACrB;EACF;EACA,SAAS,MAAM,KAAK;CACtB;CAEA,MAAM,eAAe,GACnB,OAAO,KACP,UAAU,OAAO,QACjB,UAAU,OAAO,QACjB,YAAY,OAAO,UACnB,YAAY,MACZ,KAAK,SACP;CACA,MAAM,WAAW;EAAE,GAAG,cAAc;EAAM,GAAG,KAAK;CAAM;CAExD,MAAM,UACJ,qBAAA,YAAA,EAAA,UAAA;EACG,WAAW,OAAO,oBAAC,MAAD;GAAY;GAAM,MAAM;EAAK,CAAA,IAAI;EACpD,qBAAC,QAAD;GAAM,WAAW,OAAO;GAAxB,UAAA,CACE,oBAAC,QAAD;IAAM,WAAW,GAAG,OAAO,OAAO,YAAY,KAAK;IAAG,OAAO,cAAc;IACxE,UAAA;GACG,CAAA,GACL,eAAe,QACd,oBAAC,QAAD;IACE,WAAW,GAAG,OAAO,aAAa,YAAY,WAAW;IACzD,OAAO,cAAc;IAEpB,UAAA;GACG,CAAA,CAEJ;;EACL,SAAS,QACR,oBAAC,QAAD;GAAM,WAAW,GAAG,OAAO,OAAO,YAAY,KAAK;GAAG,OAAO,cAAc;GACxE,UAAA;EACG,CAAA;CAER,EAAA,CAAA;CAGJ,OACE,qBAAC,MAAD;EAAI,WAAW,GAAG,OAAO,MAAM,cAAc,OAAO,UAAU;EAA9D,UAAA,CACG,QAAQ,CAAC,WACR,oBAAC,GAAD;GACE,gBAAc,SAAS,SAAS,KAAA;GAChC,WAAW;GACL;GACN,OAAO;GACP,SAAS;GAER,UAAA;EACA,CAAA,IAEH,oBAAC,UAAD;GACE,gBAAc,SAAS,SAAS,KAAA;GAChC,iBAAe,YAAY,KAAA;GAC3B,WAAW;GACX,OAAO;GACP,MAAK;GACL,SAAS;GAER,UAAA;EACK,CAAA,GAET,WAAW,QACV,oBAAC,QAAD;GAAM,WAAW,GAAG,OAAO,SAAS,YAAY,OAAO;GAAG,OAAO,cAAc;GAC5E,UAAA;EACG,CAAA,CAEN;;AAER,CACF;AAEA,QAAQ,cAAc"}

package/es/base-ui/List/index.d.mts

@@ -0,0 +1,3 @@
+import { ListClickInfo, ListDividerType, ListItem, ListItemType, ListProps, ListSemanticName } from "./type.mjs";
+import List from "./List.mjs";
+export { type ListClickInfo, type ListDividerType, type ListItem, type ListItemType, type ListProps, type ListSemanticName, List as default };

package/es/base-ui/List/style.mjs

@@ -0,0 +1,146 @@
+import { focusRing } from "../focusRing.mjs";
+import { createStaticStyles } from "antd-style";
+//#region src/base-ui/List/style.ts
+const styles = createStaticStyles(({ css, cssVar }) => ({
+	actions: css`
+    position: absolute;
+    inset-block-start: 50%;
+    inset-inline-end: 8px;
+    transform: translateY(-50%);
+
+    display: none;
+    gap: 4px;
+    align-items: center;
+  `,
+	active: css`
+    font-weight: 500;
+    color: ${cssVar.colorText};
+    background: ${cssVar.colorFillSecondary};
+
+    &:hover {
+      background: ${cssVar.colorFillSecondary};
+    }
+  `,
+	body: css`
+    display: flex;
+    flex: 1;
+    flex-direction: column;
+    gap: 1px;
+
+    min-width: 0;
+  `,
+	compact: css`
+    gap: 2px;
+
+    & > li > a,
+    & > li > button {
+      padding-inline: 8px;
+    }
+  `,
+	danger: css`
+    color: ${cssVar.colorError};
+
+    &:hover {
+      color: ${cssVar.colorError};
+    }
+  `,
+	description: css`
+    overflow: hidden;
+
+    font-size: 12px;
+    font-weight: 400;
+    line-height: 1.4;
+    color: ${cssVar.colorTextDescription};
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  `,
+	disabled: css`
+    cursor: not-allowed;
+    opacity: 0.45;
+  `,
+	divider: css`
+    height: 1px;
+    margin-block: 4px;
+    background: ${cssVar.colorBorderSecondary};
+  `,
+	extra: css`
+    flex: none;
+    font-size: 12px;
+    color: ${cssVar.colorTextDescription};
+  `,
+	filled: css`
+    padding: 4px;
+    border-radius: ${cssVar.borderRadiusLG};
+    background: ${cssVar.colorFillQuaternary};
+  `,
+	item: css`
+    position: relative;
+
+    &:hover > span:last-child,
+    &:focus-within > span:last-child {
+      display: inline-flex;
+    }
+  `,
+	label: css`
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+
+    a {
+      color: inherit;
+    }
+  `,
+	outlined: css`
+    padding: 4px;
+    border: 1px solid ${cssVar.colorBorderSecondary};
+    border-radius: ${cssVar.borderRadiusLG};
+  `,
+	root: css`
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+
+    margin: 0;
+    padding: 0;
+
+    list-style: none;
+  `,
+	row: css`
+    ${focusRing};
+    cursor: pointer;
+
+    display: flex;
+    gap: 12px;
+    align-items: center;
+
+    box-sizing: border-box;
+    width: 100%;
+    min-height: 32px;
+    padding-block: 6px;
+    padding-inline: 12px;
+    border: 0;
+    border-radius: ${cssVar.borderRadius};
+
+    font: inherit;
+    font-size: 14px;
+    color: ${cssVar.colorTextSecondary};
+    text-align: start;
+    text-decoration: none;
+
+    background: none;
+
+    &:hover {
+      color: ${cssVar.colorText};
+      background: ${cssVar.colorFillTertiary};
+    }
+  `,
+	showAction: css`
+    & > span:last-child {
+      display: inline-flex;
+    }
+  `
+}));
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/es/base-ui/List/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/List/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nimport { focusRing } from '@/base-ui/focusRing';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  actions: css`\n    position: absolute;\n    inset-block-start: 50%;\n    inset-inline-end: 8px;\n    transform: translateY(-50%);\n\n    display: none;\n    gap: 4px;\n    align-items: center;\n  `,\n  active: css`\n    font-weight: 500;\n    color: ${cssVar.colorText};\n    background: ${cssVar.colorFillSecondary};\n\n    &:hover {\n      background: ${cssVar.colorFillSecondary};\n    }\n  `,\n  body: css`\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    gap: 1px;\n\n    min-width: 0;\n  `,\n  compact: css`\n    gap: 2px;\n\n    & > li > a,\n    & > li > button {\n      padding-inline: 8px;\n    }\n  `,\n  danger: css`\n    color: ${cssVar.colorError};\n\n    &:hover {\n      color: ${cssVar.colorError};\n    }\n  `,\n  description: css`\n    overflow: hidden;\n\n    font-size: 12px;\n    font-weight: 400;\n    line-height: 1.4;\n    color: ${cssVar.colorTextDescription};\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  `,\n  disabled: css`\n    cursor: not-allowed;\n    opacity: 0.45;\n  `,\n  divider: css`\n    height: 1px;\n    margin-block: 4px;\n    background: ${cssVar.colorBorderSecondary};\n  `,\n  extra: css`\n    flex: none;\n    font-size: 12px;\n    color: ${cssVar.colorTextDescription};\n  `,\n  filled: css`\n    padding: 4px;\n    border-radius: ${cssVar.borderRadiusLG};\n    background: ${cssVar.colorFillQuaternary};\n  `,\n  item: css`\n    position: relative;\n\n    &:hover > span:last-child,\n    &:focus-within > span:last-child {\n      display: inline-flex;\n    }\n  `,\n  label: css`\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n\n    a {\n      color: inherit;\n    }\n  `,\n  outlined: css`\n    padding: 4px;\n    border: 1px solid ${cssVar.colorBorderSecondary};\n    border-radius: ${cssVar.borderRadiusLG};\n  `,\n  root: css`\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n\n    margin: 0;\n    padding: 0;\n\n    list-style: none;\n  `,\n  row: css`\n    ${focusRing};\n    cursor: pointer;\n\n    display: flex;\n    gap: 12px;\n    align-items: center;\n\n    box-sizing: border-box;\n    width: 100%;\n    min-height: 32px;\n    padding-block: 6px;\n    padding-inline: 12px;\n    border: 0;\n    border-radius: ${cssVar.borderRadius};\n\n    font: inherit;\n    font-size: 14px;\n    color: ${cssVar.colorTextSecondary};\n    text-align: start;\n    text-decoration: none;\n\n    background: none;\n\n    &:hover {\n      color: ${cssVar.colorText};\n      background: ${cssVar.colorFillTertiary};\n    }\n  `,\n  showAction: css`\n    & > span:last-child {\n      display: inline-flex;\n    }\n  `,\n}));\n"],"mappings":";;;AAIA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,SAAS,GAAG;;;;;;;;;;CAUZ,QAAQ,GAAG;;aAEA,OAAO,UAAU;kBACZ,OAAO,mBAAmB;;;oBAGxB,OAAO,mBAAmB;;;CAG5C,MAAM,GAAG;;;;;;;;CAQT,SAAS,GAAG;;;;;;;;CAQZ,QAAQ,GAAG;aACA,OAAO,WAAW;;;eAGhB,OAAO,WAAW;;;CAG/B,aAAa,GAAG;;;;;;aAML,OAAO,qBAAqB;;;;CAIvC,UAAU,GAAG;;;;CAIb,SAAS,GAAG;;;kBAGI,OAAO,qBAAqB;;CAE5C,OAAO,GAAG;;;aAGC,OAAO,qBAAqB;;CAEvC,QAAQ,GAAG;;qBAEQ,OAAO,eAAe;kBACzB,OAAO,oBAAoB;;CAE3C,MAAM,GAAG;;;;;;;;CAQT,OAAO,GAAG;;;;;;;;;CASV,UAAU,GAAG;;wBAES,OAAO,qBAAqB;qBAC/B,OAAO,eAAe;;CAEzC,MAAM,GAAG;;;;;;;;;;CAUT,KAAK,GAAG;MACJ,UAAU;;;;;;;;;;;;;qBAaK,OAAO,aAAa;;;;aAI5B,OAAO,mBAAmB;;;;;;;eAOxB,OAAO,UAAU;oBACZ,OAAO,kBAAkB;;;CAG3C,YAAY,GAAG;;;;;AAKjB,EAAE"}

package/es/base-ui/List/type.d.mts

@@ -0,0 +1,48 @@
+import { IconProps } from "../../Icon/type.mjs";
+import "../../Icon/index.mjs";
+import { CSSProperties, ComponentProps, Key, MouseEvent, ReactNode, Ref } from "react";
+//#region src/base-ui/List/type.d.ts
+interface ListClickInfo {
+  domEvent: MouseEvent<HTMLElement>;
+  item: ListItemType;
+  key: Key;
+}
+interface ListItemType {
+  actions?: ReactNode;
+  avatar?: ReactNode;
+  className?: string;
+  danger?: boolean;
+  description?: ReactNode;
+  disabled?: boolean;
+  extra?: ReactNode;
+  href?: string;
+  icon?: IconProps['icon'];
+  key: Key;
+  label: ReactNode;
+  onClick?: (info: ListClickInfo) => void;
+  showAction?: boolean;
+  style?: CSSProperties;
+  type?: undefined;
+}
+interface ListDividerType {
+  key?: Key;
+  type: 'divider';
+}
+type ListItem = ListItemType | ListDividerType;
+type ListSemanticName = 'actions' | 'description' | 'extra' | 'item' | 'label';
+interface ListProps extends Omit<ComponentProps<'ul'>, 'onClick'> {
+  activeKey?: Key | null;
+  classNames?: Partial<Record<ListSemanticName, string>>;
+  compact?: boolean;
+  defaultActiveKey?: Key;
+  items: ListItem[];
+  onActiveChange?: (key: Key) => void;
+  onClick?: (info: ListClickInfo) => void;
+  ref?: Ref<HTMLUListElement>;
+  selectable?: boolean;
+  styles?: Partial<Record<ListSemanticName, CSSProperties>>;
+  variant?: 'borderless' | 'filled' | 'outlined';
+}
+//#endregion
+export { ListClickInfo, ListDividerType, ListItem, ListItemType, ListProps, ListSemanticName };
+//# sourceMappingURL=type.d.mts.map

package/es/base-ui/Modal/atoms.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"atoms.mjs","names":[],"sources":["../../../src/base-ui/Modal/atoms.tsx"],"sourcesContent":["'use client';\n\nimport { Dialog } from '@base-ui/react/dialog';\nimport { mergeProps } from '@base-ui/react/merge-props';\nimport { cx } from 'antd-style';\nimport { X } from 'lucide-react';\nimport { AnimatePresence } from 'motion/react';\nimport type React from 'react';\nimport {\n  cloneElement,\n  createContext,\n  isValidElement,\n  use,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { mergeRefs, useMergeRefs } from 'react-merge-refs';\n\nimport { useNativeButton } from '@/hooks/useNativeButton';\nimport { useMotionComponent } from '@/MotionProvider';\nimport { useAppElement } from '@/ThemeProvider';\n\nimport { useLayerZIndex } from '../zIndex';\nimport { backdropTransition, modalMotionConfig } from './constants';\nimport { ModalLayerProvider, useModalLayer } from './ModalLayerContext';\nimport { styles } from './style';\n\nconst mergeStateClassName = <TState,>(\n  base: string,\n  className: string | ((state: TState) => string | undefined) | undefined,\n) => {\n  if (typeof className === 'function') return (state: TState) => cx(base, className(state));\n  return cx(base, className);\n};\n\n// --- Animation Contexts (granular to minimize re-renders) ---\n\n// State: open boolean, null = non-animated mode\nconst ModalOpenContext = createContext<boolean | null>(null);\n\n// Actions: stable callbacks, null = non-animated mode\ninterface ModalAnimationActions {\n  onExitComplete: () => void;\n}\nconst ModalActionsContext = createContext<ModalAnimationActions | null>(null);\n\nexport const useModalOpen = () => use(ModalOpenContext);\nexport const useModalActions = () => use(ModalActionsContext);\n\n// --- Root ---\nexport type ModalRootProps = Dialog.Root.Props & {\n  onExitComplete?: () => void;\n  zIndex?: number;\n};\n\nconst AnimatedModalRoot = ({\n  open,\n  children,\n  onExitComplete: onExitCompleteProp,\n  zIndex: explicitZIndex,\n  ...rest\n}: Omit<ModalRootProps, 'open'> & { open: boolean }) => {\n  const [isPresent, setIsPresent] = useState(!!open);\n\n  useEffect(() => {\n    if (open) setIsPresent(true);\n  }, [open]);\n\n  const handleExitComplete = useCallback(() => {\n    setIsPresent(false);\n    onExitCompleteProp?.();\n  }, [onExitCompleteProp]);\n\n  const actions = useMemo(() => ({ onExitComplete: handleExitComplete }), [handleExitComplete]);\n\n  const { zIndex, ref: popupRef } = useLayerZIndex<HTMLDivElement>('modal', explicitZIndex);\n  const layer = useMemo(\n    () => ({ popupRef: popupRef as (node: HTMLElement | null) => void, zIndex }),\n    [zIndex, popupRef],\n  );\n\n  if (!isPresent) return null;\n\n  return (\n    <ModalOpenContext value={open}>\n      <ModalActionsContext value={actions}>\n        <ModalLayerProvider value={layer}>\n          <Dialog.Root modal open {...rest}>\n            {children}\n          </Dialog.Root>\n        </ModalLayerProvider>\n      </ModalActionsContext>\n    </ModalOpenContext>\n  );\n};\n\nconst NonAnimatedModalRoot = ({ zIndex: explicitZIndex, children, ...rest }: ModalRootProps) => {\n  const { zIndex, ref: popupRef } = useLayerZIndex<HTMLDivElement>('modal', explicitZIndex);\n  const layer = useMemo(\n    () => ({ popupRef: popupRef as (node: HTMLElement | null) => void, zIndex }),\n    [zIndex, popupRef],\n  );\n  return (\n    <ModalLayerProvider value={layer}>\n      <Dialog.Root modal {...rest}>\n        {children}\n      </Dialog.Root>\n    </ModalLayerProvider>\n  );\n};\n\nexport const ModalRoot = ({ open, onExitComplete, ...rest }: ModalRootProps) => {\n  if (open !== undefined) {\n    return <AnimatedModalRoot open={open} onExitComplete={onExitComplete} {...rest} />;\n  }\n  return <NonAnimatedModalRoot {...rest} />;\n};\n\n// --- Portal ---\nexport type ModalPortalProps = React.ComponentProps<typeof Dialog.Portal> & {\n  container?: HTMLElement | null;\n};\nexport const ModalPortal = ({ container, ...rest }: ModalPortalProps) => {\n  const appElement = useAppElement();\n  return <Dialog.Portal container={container ?? appElement ?? undefined} {...rest} />;\n};\n\n// --- Viewport ---\nexport type ModalViewportProps = React.ComponentProps<typeof Dialog.Viewport>;\nexport const ModalViewport = ({ className, ...rest }: ModalViewportProps) => (\n  <Dialog.Viewport\n    {...rest}\n    className={mergeStateClassName(styles.viewport, className as any) as any}\n  />\n);\n\n// --- Backdrop ---\nexport type ModalBackdropProps = React.ComponentProps<typeof Dialog.Backdrop>;\nexport const ModalBackdrop = ({ className, style, ...rest }: ModalBackdropProps) => {\n  const open = useModalOpen();\n  const layer = useModalLayer();\n  const Motion = useMotionComponent();\n  const layerStyle = layer?.zIndex !== undefined ? { zIndex: layer.zIndex } : undefined;\n\n  if (open !== null) {\n    return (\n      <Dialog.Backdrop\n        {...rest}\n        className={cx(styles.backdrop, className as string)}\n        style={{ ...layerStyle, ...style, transition: 'none' }}\n        render={\n          <Motion.div\n            animate={{ opacity: open ? 1 : 0 }}\n            initial={{ opacity: 0 }}\n            transition={backdropTransition}\n          />\n        }\n      />\n    );\n  }\n\n  return (\n    <Dialog.Backdrop\n      {...rest}\n      className={mergeStateClassName(styles.backdrop, className as any) as any}\n      style={{ ...layerStyle, ...style }}\n    />\n  );\n};\n\n// --- Popup ---\nexport type ModalPopupProps = React.ComponentProps<typeof Dialog.Popup> & {\n  motionProps?: Record<string, any>;\n  panelClassName?: string;\n  popupStyle?: React.CSSProperties;\n  width?: number | string;\n};\nexport const ModalPopup = ({\n  className,\n  children,\n  width,\n  style,\n  motionProps,\n  panelClassName,\n  popupStyle,\n  ref: forwardedRef,\n  ...rest\n}: ModalPopupProps) => {\n  const open = useModalOpen();\n  const actions = useModalActions();\n  const layer = useModalLayer();\n  const Motion = useMotionComponent();\n  const popupZIndexStyle = layer?.zIndex !== undefined ? { zIndex: layer.zIndex + 1 } : undefined;\n  const composedRef = useMergeRefs([forwardedRef, layer?.popupRef]);\n\n  if (open !== null && actions) {\n    return (\n      <Dialog.Popup\n        {...rest}\n        className={cx(styles.popup, className as string)}\n        ref={composedRef as any}\n        style={{ ...popupZIndexStyle, ...popupStyle }}\n      >\n        <AnimatePresence onExitComplete={actions.onExitComplete}>\n          {open ? (\n            <Motion.div\n              {...modalMotionConfig}\n              {...motionProps}\n              className={cx(styles.popupInner, panelClassName)}\n              key=\"modal-popup-panel\"\n              style={{ maxWidth: width ?? undefined, transition: 'none', ...style }}\n            >\n              {children}\n            </Motion.div>\n          ) : null}\n        </AnimatePresence>\n      </Dialog.Popup>\n    );\n  }\n\n  return (\n    <Dialog.Popup\n      {...rest}\n      className={mergeStateClassName(styles.popup, className as any) as any}\n      ref={composedRef as any}\n      style={{ ...popupZIndexStyle, ...popupStyle }}\n    >\n      <div\n        className={cx(styles.popupInner, panelClassName)}\n        style={{ maxWidth: width ?? undefined, ...style }}\n      >\n        {children}\n      </div>\n    </Dialog.Popup>\n  );\n};\n\n// --- Header ---\nexport type ModalHeaderProps = React.HTMLAttributes<HTMLDivElement> & {\n  ref?: React.Ref<HTMLDivElement>;\n};\nexport const ModalHeader = ({ className, ...rest }: ModalHeaderProps) => (\n  <div {...rest} className={cx(styles.header, className)} />\n);\n\n// --- Title ---\nexport type ModalTitleProps = React.ComponentProps<typeof Dialog.Title>;\nexport const ModalTitle = ({ className, ...rest }: ModalTitleProps) => (\n  <Dialog.Title {...rest} className={mergeStateClassName(styles.title, className as any) as any} />\n);\n\n// --- Description ---\nexport type ModalDescriptionProps = React.ComponentProps<typeof Dialog.Description>;\nexport const ModalDescription: React.FC<ModalDescriptionProps> = Dialog.Description;\n\n// --- Content ---\nexport type ModalContentProps = React.HTMLAttributes<HTMLDivElement> & {\n  ref?: React.Ref<HTMLDivElement>;\n};\nexport const ModalContent = ({ className, ...rest }: ModalContentProps) => (\n  <div {...rest} className={cx(styles.content, className)} />\n);\n\n// --- Footer ---\nexport type ModalFooterProps = React.HTMLAttributes<HTMLDivElement> & {\n  ref?: React.Ref<HTMLDivElement>;\n};\nexport const ModalFooter = ({ className, ...rest }: ModalFooterProps) => (\n  <div {...rest} className={cx(styles.footer, className)} />\n);\n\n// --- Close ---\nexport type ModalCloseProps = React.ComponentProps<typeof Dialog.Close>;\nexport const ModalClose = ({ className, children, ...rest }: ModalCloseProps) => (\n  <Dialog.Close {...rest} className={mergeStateClassName(styles.close, className as any) as any}>\n    {children ?? <X size={16} />}\n  </Dialog.Close>\n);\n\n// --- Trigger ---\nexport type ModalTriggerProps = Omit<\n  React.ComponentPropsWithRef<typeof Dialog.Trigger>,\n  'children' | 'render'\n> & {\n  children?: React.ReactNode;\n  nativeButton?: boolean;\n};\n\nexport const ModalTrigger = ({\n  children,\n  className,\n  nativeButton,\n  ref: refProp,\n  ...rest\n}: ModalTriggerProps) => {\n  const { isNativeButtonTriggerElement, resolvedNativeButton } = useNativeButton({\n    children,\n    nativeButton,\n  });\n\n  const renderer = (props: any) => {\n    const resolvedProps = (() => {\n      if (isNativeButtonTriggerElement) return props as any;\n      // eslint-disable-next-line unused-imports/no-unused-vars\n      const { type, ...restProps } = props as any;\n      return restProps;\n    })();\n\n    const mergedProps = mergeProps((children as any).props, resolvedProps);\n    return cloneElement(children as any, {\n      ...mergedProps,\n      ref: mergeRefs([(children as any).ref, (props as any).ref, refProp]),\n    });\n  };\n\n  if (isValidElement(children)) {\n    return (\n      <Dialog.Trigger\n        {...rest}\n        className={className}\n        nativeButton={resolvedNativeButton}\n        render={renderer as any}\n      />\n    );\n  }\n\n  return (\n    <Dialog.Trigger\n      {...rest}\n      className={className}\n      nativeButton={resolvedNativeButton}\n      ref={refProp as any}\n    >\n      {children}\n    </Dialog.Trigger>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"atoms.mjs","names":[],"sources":["../../../src/base-ui/Modal/atoms.tsx"],"sourcesContent":["'use client';\n\nimport { Dialog } from '@base-ui/react/dialog';\nimport { mergeProps } from '@base-ui/react/merge-props';\nimport { cx } from 'antd-style';\nimport { X } from 'lucide-react';\nimport { AnimatePresence } from 'motion/react';\nimport type React from 'react';\nimport {\n  cloneElement,\n  createContext,\n  isValidElement,\n  use,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { mergeRefs, useMergeRefs } from 'react-merge-refs';\n\nimport { useNativeButton } from '@/hooks/useNativeButton';\nimport { useMotionComponent } from '@/MotionProvider';\nimport { useAppElement } from '@/ThemeProvider/AppElementContext';\n\nimport { useLayerZIndex } from '../zIndex';\nimport { backdropTransition, modalMotionConfig } from './constants';\nimport { ModalLayerProvider, useModalLayer } from './ModalLayerContext';\nimport { styles } from './style';\n\nconst mergeStateClassName = <TState,>(\n  base: string,\n  className: string | ((state: TState) => string | undefined) | undefined,\n) => {\n  if (typeof className === 'function') return (state: TState) => cx(base, className(state));\n  return cx(base, className);\n};\n\n// --- Animation Contexts (granular to minimize re-renders) ---\n\n// State: open boolean, null = non-animated mode\nconst ModalOpenContext = createContext<boolean | null>(null);\n\n// Actions: stable callbacks, null = non-animated mode\ninterface ModalAnimationActions {\n  onExitComplete: () => void;\n}\nconst ModalActionsContext = createContext<ModalAnimationActions | null>(null);\n\nexport const useModalOpen = () => use(ModalOpenContext);\nexport const useModalActions = () => use(ModalActionsContext);\n\n// --- Root ---\nexport type ModalRootProps = Dialog.Root.Props & {\n  onExitComplete?: () => void;\n  zIndex?: number;\n};\n\nconst AnimatedModalRoot = ({\n  open,\n  children,\n  onExitComplete: onExitCompleteProp,\n  zIndex: explicitZIndex,\n  ...rest\n}: Omit<ModalRootProps, 'open'> & { open: boolean }) => {\n  const [isPresent, setIsPresent] = useState(!!open);\n\n  useEffect(() => {\n    if (open) setIsPresent(true);\n  }, [open]);\n\n  const handleExitComplete = useCallback(() => {\n    setIsPresent(false);\n    onExitCompleteProp?.();\n  }, [onExitCompleteProp]);\n\n  const actions = useMemo(() => ({ onExitComplete: handleExitComplete }), [handleExitComplete]);\n\n  const { zIndex, ref: popupRef } = useLayerZIndex<HTMLDivElement>('modal', explicitZIndex);\n  const layer = useMemo(\n    () => ({ popupRef: popupRef as (node: HTMLElement | null) => void, zIndex }),\n    [zIndex, popupRef],\n  );\n\n  if (!isPresent) return null;\n\n  return (\n    <ModalOpenContext value={open}>\n      <ModalActionsContext value={actions}>\n        <ModalLayerProvider value={layer}>\n          <Dialog.Root modal open {...rest}>\n            {children}\n          </Dialog.Root>\n        </ModalLayerProvider>\n      </ModalActionsContext>\n    </ModalOpenContext>\n  );\n};\n\nconst NonAnimatedModalRoot = ({ zIndex: explicitZIndex, children, ...rest }: ModalRootProps) => {\n  const { zIndex, ref: popupRef } = useLayerZIndex<HTMLDivElement>('modal', explicitZIndex);\n  const layer = useMemo(\n    () => ({ popupRef: popupRef as (node: HTMLElement | null) => void, zIndex }),\n    [zIndex, popupRef],\n  );\n  return (\n    <ModalLayerProvider value={layer}>\n      <Dialog.Root modal {...rest}>\n        {children}\n      </Dialog.Root>\n    </ModalLayerProvider>\n  );\n};\n\nexport const ModalRoot = ({ open, onExitComplete, ...rest }: ModalRootProps) => {\n  if (open !== undefined) {\n    return <AnimatedModalRoot open={open} onExitComplete={onExitComplete} {...rest} />;\n  }\n  return <NonAnimatedModalRoot {...rest} />;\n};\n\n// --- Portal ---\nexport type ModalPortalProps = React.ComponentProps<typeof Dialog.Portal> & {\n  container?: HTMLElement | null;\n};\nexport const ModalPortal = ({ container, ...rest }: ModalPortalProps) => {\n  const appElement = useAppElement();\n  return <Dialog.Portal container={container ?? appElement ?? undefined} {...rest} />;\n};\n\n// --- Viewport ---\nexport type ModalViewportProps = React.ComponentProps<typeof Dialog.Viewport>;\nexport const ModalViewport = ({ className, ...rest }: ModalViewportProps) => (\n  <Dialog.Viewport\n    {...rest}\n    className={mergeStateClassName(styles.viewport, className as any) as any}\n  />\n);\n\n// --- Backdrop ---\nexport type ModalBackdropProps = React.ComponentProps<typeof Dialog.Backdrop>;\nexport const ModalBackdrop = ({ className, style, ...rest }: ModalBackdropProps) => {\n  const open = useModalOpen();\n  const layer = useModalLayer();\n  const Motion = useMotionComponent();\n  const layerStyle = layer?.zIndex !== undefined ? { zIndex: layer.zIndex } : undefined;\n\n  if (open !== null) {\n    return (\n      <Dialog.Backdrop\n        {...rest}\n        className={cx(styles.backdrop, className as string)}\n        style={{ ...layerStyle, ...style, transition: 'none' }}\n        render={\n          <Motion.div\n            animate={{ opacity: open ? 1 : 0 }}\n            initial={{ opacity: 0 }}\n            transition={backdropTransition}\n          />\n        }\n      />\n    );\n  }\n\n  return (\n    <Dialog.Backdrop\n      {...rest}\n      className={mergeStateClassName(styles.backdrop, className as any) as any}\n      style={{ ...layerStyle, ...style }}\n    />\n  );\n};\n\n// --- Popup ---\nexport type ModalPopupProps = React.ComponentProps<typeof Dialog.Popup> & {\n  motionProps?: Record<string, any>;\n  panelClassName?: string;\n  popupStyle?: React.CSSProperties;\n  width?: number | string;\n};\nexport const ModalPopup = ({\n  className,\n  children,\n  width,\n  style,\n  motionProps,\n  panelClassName,\n  popupStyle,\n  ref: forwardedRef,\n  ...rest\n}: ModalPopupProps) => {\n  const open = useModalOpen();\n  const actions = useModalActions();\n  const layer = useModalLayer();\n  const Motion = useMotionComponent();\n  const popupZIndexStyle = layer?.zIndex !== undefined ? { zIndex: layer.zIndex + 1 } : undefined;\n  const composedRef = useMergeRefs([forwardedRef, layer?.popupRef]);\n\n  if (open !== null && actions) {\n    return (\n      <Dialog.Popup\n        {...rest}\n        className={cx(styles.popup, className as string)}\n        ref={composedRef as any}\n        style={{ ...popupZIndexStyle, ...popupStyle }}\n      >\n        <AnimatePresence onExitComplete={actions.onExitComplete}>\n          {open ? (\n            <Motion.div\n              {...modalMotionConfig}\n              {...motionProps}\n              className={cx(styles.popupInner, panelClassName)}\n              key=\"modal-popup-panel\"\n              style={{ maxWidth: width ?? undefined, transition: 'none', ...style }}\n            >\n              {children}\n            </Motion.div>\n          ) : null}\n        </AnimatePresence>\n      </Dialog.Popup>\n    );\n  }\n\n  return (\n    <Dialog.Popup\n      {...rest}\n      className={mergeStateClassName(styles.popup, className as any) as any}\n      ref={composedRef as any}\n      style={{ ...popupZIndexStyle, ...popupStyle }}\n    >\n      <div\n        className={cx(styles.popupInner, panelClassName)}\n        style={{ maxWidth: width ?? undefined, ...style }}\n      >\n        {children}\n      </div>\n    </Dialog.Popup>\n  );\n};\n\n// --- Header ---\nexport type ModalHeaderProps = React.HTMLAttributes<HTMLDivElement> & {\n  ref?: React.Ref<HTMLDivElement>;\n};\nexport const ModalHeader = ({ className, ...rest }: ModalHeaderProps) => (\n  <div {...rest} className={cx(styles.header, className)} />\n);\n\n// --- Title ---\nexport type ModalTitleProps = React.ComponentProps<typeof Dialog.Title>;\nexport const ModalTitle = ({ className, ...rest }: ModalTitleProps) => (\n  <Dialog.Title {...rest} className={mergeStateClassName(styles.title, className as any) as any} />\n);\n\n// --- Description ---\nexport type ModalDescriptionProps = React.ComponentProps<typeof Dialog.Description>;\nexport const ModalDescription: React.FC<ModalDescriptionProps> = Dialog.Description;\n\n// --- Content ---\nexport type ModalContentProps = React.HTMLAttributes<HTMLDivElement> & {\n  ref?: React.Ref<HTMLDivElement>;\n};\nexport const ModalContent = ({ className, ...rest }: ModalContentProps) => (\n  <div {...rest} className={cx(styles.content, className)} />\n);\n\n// --- Footer ---\nexport type ModalFooterProps = React.HTMLAttributes<HTMLDivElement> & {\n  ref?: React.Ref<HTMLDivElement>;\n};\nexport const ModalFooter = ({ className, ...rest }: ModalFooterProps) => (\n  <div {...rest} className={cx(styles.footer, className)} />\n);\n\n// --- Close ---\nexport type ModalCloseProps = React.ComponentProps<typeof Dialog.Close>;\nexport const ModalClose = ({ className, children, ...rest }: ModalCloseProps) => (\n  <Dialog.Close {...rest} className={mergeStateClassName(styles.close, className as any) as any}>\n    {children ?? <X size={16} />}\n  </Dialog.Close>\n);\n\n// --- Trigger ---\nexport type ModalTriggerProps = Omit<\n  React.ComponentPropsWithRef<typeof Dialog.Trigger>,\n  'children' | 'render'\n> & {\n  children?: React.ReactNode;\n  nativeButton?: boolean;\n};\n\nexport const ModalTrigger = ({\n  children,\n  className,\n  nativeButton,\n  ref: refProp,\n  ...rest\n}: ModalTriggerProps) => {\n  const { isNativeButtonTriggerElement, resolvedNativeButton } = useNativeButton({\n    children,\n    nativeButton,\n  });\n\n  const renderer = (props: any) => {\n    const resolvedProps = (() => {\n      if (isNativeButtonTriggerElement) return props as any;\n      // eslint-disable-next-line unused-imports/no-unused-vars\n      const { type, ...restProps } = props as any;\n      return restProps;\n    })();\n\n    const mergedProps = mergeProps((children as any).props, resolvedProps);\n    return cloneElement(children as any, {\n      ...mergedProps,\n      ref: mergeRefs([(children as any).ref, (props as any).ref, refProp]),\n    });\n  };\n\n  if (isValidElement(children)) {\n    return (\n      <Dialog.Trigger\n        {...rest}\n        className={className}\n        nativeButton={resolvedNativeButton}\n        render={renderer as any}\n      />\n    );\n  }\n\n  return (\n    <Dialog.Trigger\n      {...rest}\n      className={className}\n      nativeButton={resolvedNativeButton}\n      ref={refProp as any}\n    >\n      {children}\n    </Dialog.Trigger>\n  );\n};\n"],"mappings":"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"}

package/es/base-ui/Modal/imperative.mjs

@@ -195,7 +195,7 @@ function createModalSystem() {
 			content: /* @__PURE__ */ jsx(ConfirmBody, { config }),
 			styles: { content: { padding: 0 } },
 			title: config.title,
-			width: 420
+			width: config.width ?? 420
 		});
 		return {
 			close: instance.close,

package/es/base-ui/Modal/imperative.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"imperative.mjs","names":[],"sources":["../../../src/base-ui/Modal/imperative.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport type { ReactNode } from 'react';\nimport { memo, useCallback, useEffect, useState, useSyncExternalStore } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { useIsClient } from '@/hooks/useIsClient';\nimport { useAppElement } from '@/ThemeProvider';\nimport { registerDevSingleton } from '@/utils/devSingleton';\n\nimport { Button } from '../Button';\nimport {\n  ModalBackdrop,\n  ModalClose,\n  ModalContent,\n  ModalFooter,\n  ModalHeader,\n  ModalPopup,\n  ModalPortal,\n  ModalRoot,\n  ModalTitle,\n} from './atoms';\nimport { ModalContext, useModalContext } from './context';\nimport { styles } from './style';\nimport type { ImperativeModalProps, ModalConfirmConfig, ModalInstance } from './type';\n\n// --- Shared types ---\n\ntype ModalStackEntry = {\n  id: string;\n  props: ImperativeModalProps;\n};\n\n// --- Shared components (stack-independent) ---\n\nconst ModalPortalWrapper = ({\n  children,\n  root,\n}: {\n  children: ReactNode;\n  root?: HTMLElement | ShadowRoot | null;\n}) => {\n  const appElement = useAppElement();\n  const container = root ?? appElement ?? document.body;\n  return createPortal(children, container);\n};\n\nconst ConfirmBody = ({ config }: { config: ModalConfirmConfig }) => {\n  const { close } = useModalContext();\n  const [loading, setLoading] = useState(false);\n\n  const { cancelText = 'Cancel', content, okButtonProps, okText = 'OK', onCancel, onOk } = config;\n\n  const handleCancel = useCallback(() => {\n    close();\n    onCancel?.();\n  }, [close, onCancel]);\n\n  const handleOk = useCallback(async () => {\n    if (onOk) {\n      try {\n        const result = onOk();\n        if (result && typeof (result as any).then === 'function') {\n          setLoading(true);\n          await result;\n          setLoading(false);\n        }\n      } catch {\n        setLoading(false);\n        return;\n      }\n    }\n    close();\n  }, [close, onOk]);\n\n  return (\n    <>\n      {content && <div style={{ padding: '12px 16px' }}>{content}</div>}\n      <ModalFooter>\n        <Button onClick={handleCancel}>{cancelText}</Button>\n        <Button loading={loading} type=\"primary\" {...okButtonProps} onClick={handleOk}>\n          {okText}\n        </Button>\n      </ModalFooter>\n    </>\n  );\n};\nConfirmBody.displayName = 'ConfirmBody';\n\n// --- Factory ---\n\nexport interface ModalHostProps {\n  root?: HTMLElement | ShadowRoot | null;\n}\n\nexport interface ModalSystem {\n  confirmModal: (config: ModalConfirmConfig) => { close: () => void; destroy: () => void };\n  createModal: (props: ImperativeModalProps) => ModalInstance;\n  ModalHost: React.FC<ModalHostProps>;\n}\n\nlet systemSeed = 0;\n\nexport function createModalSystem(): ModalSystem {\n  const systemId = systemSeed++;\n  const singletonName = systemId === 0 ? 'BaseModalHost' : `BaseModalHost-${systemId}`;\n\n  // --- Stack state (isolated per system) ---\n  let modalStack: ModalStackEntry[] = [];\n  let modalSeed = 0;\n  const listeners = new Set<() => void>();\n\n  const notify = () => listeners.forEach((l) => l());\n  const subscribe = (l: () => void) => {\n    listeners.add(l);\n    return () => listeners.delete(l);\n  };\n  const EMPTY: ModalStackEntry[] = [];\n  const getSnapshot = () => modalStack;\n  const getServerSnapshot = () => EMPTY;\n\n  // --- Stack operations ---\n\n  const updateModal = (id: string, next: Partial<ImperativeModalProps>) => {\n    let changed = false;\n    modalStack = modalStack.map((item) => {\n      if (item.id !== id) return item;\n      changed = true;\n      return { ...item, props: { ...item.props, ...next } };\n    });\n    if (changed) notify();\n  };\n\n  const closeModal = (id: string) => {\n    updateModal(id, { open: false });\n  };\n\n  const destroyModal = (id: string) => {\n    const next = modalStack.filter((item) => item.id !== id);\n    if (next.length === modalStack.length) return;\n    modalStack = next;\n    notify();\n  };\n\n  // --- Stack Item (captures operations via closure) ---\n\n  const StackItem = memo(({ entry }: { entry: ModalStackEntry }) => {\n    const { id, props } = entry;\n    const {\n      children,\n      classNames,\n      content,\n      footer,\n      maskClosable,\n      onOpenChange,\n      onOpenChangeComplete,\n      open,\n      styles: semanticStyles,\n      title,\n      width,\n    } = props;\n\n    const isOpen = open ?? true;\n\n    const handleOpenChange = useCallback(\n      (nextOpen: boolean, eventDetails?: { reason: string }) => {\n        if (!nextOpen && maskClosable === false && eventDetails?.reason === 'outside-press') return;\n        if (!nextOpen) closeModal(id);\n        onOpenChange?.(nextOpen);\n      },\n      [id, maskClosable, onOpenChange],\n    );\n\n    const handleExitComplete = useCallback(() => {\n      onOpenChangeComplete?.(false);\n      destroyModal(id);\n    }, [id, onOpenChangeComplete]);\n\n    const close = useCallback(() => closeModal(id), [id]);\n    const setCanDismissByClickOutside = useCallback(\n      (value: boolean) => updateModal(id, { maskClosable: value }),\n      [id],\n    );\n\n    const showTitle = title !== undefined && title !== false && title !== null;\n\n    return (\n      <ModalContext value={{ close, setCanDismissByClickOutside }}>\n        <ModalRoot\n          open={isOpen}\n          onExitComplete={handleExitComplete}\n          onOpenChange={handleOpenChange}\n        >\n          <ModalPortal>\n            <ModalBackdrop className={classNames?.backdrop} style={semanticStyles?.backdrop} />\n            <ModalPopup\n              className={classNames?.popup}\n              popupStyle={semanticStyles?.popup}\n              width={width}\n            >\n              {showTitle && (\n                <ModalHeader className={classNames?.header} style={semanticStyles?.header}>\n                  <ModalTitle className={classNames?.title} style={semanticStyles?.title}>\n                    {title}\n                  </ModalTitle>\n                  <ModalClose className={classNames?.close} style={semanticStyles?.close} />\n                </ModalHeader>\n              )}\n              <ModalContent\n                className={cx(!showTitle && styles.contentNoHeader, classNames?.content)}\n                style={semanticStyles?.content}\n              >\n                {content ?? children}\n              </ModalContent>\n              {footer}\n            </ModalPopup>\n          </ModalPortal>\n        </ModalRoot>\n      </ModalContext>\n    );\n  });\n  StackItem.displayName = 'ModalStackItem';\n\n  const StackRenderer = memo(({ stack }: { stack: ModalStackEntry[] }) => {\n    const isClient = useIsClient();\n    if (!isClient) return null;\n    return stack.map((entry) => <StackItem entry={entry} key={entry.id} />);\n  });\n  StackRenderer.displayName = 'ModalStackRenderer';\n\n  // --- ModalHost ---\n\n  const Host = ({ root }: ModalHostProps) => {\n    const stack = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);\n    const isClient = useIsClient();\n\n    useEffect(() => {\n      if (!isClient) return;\n      const scope = root ?? document.body;\n      return registerDevSingleton(singletonName, scope);\n    }, [isClient, root]);\n\n    if (!isClient) return null;\n    if (stack.length === 0) return null;\n\n    return (\n      <ModalPortalWrapper root={root}>\n        <StackRenderer stack={stack} />\n      </ModalPortalWrapper>\n    );\n  };\n\n  // --- createModal ---\n\n  const create = (props: ImperativeModalProps): ModalInstance => {\n    const id = `base-modal-${Date.now()}-${modalSeed++}`;\n    modalStack = [...modalStack, { id, props: { ...props, open: props.open ?? true } }];\n    notify();\n\n    return {\n      close: () => closeModal(id),\n      destroy: () => destroyModal(id),\n      setCanDismissByClickOutside: (value) => updateModal(id, { maskClosable: value }),\n      update: (nextProps) => updateModal(id, nextProps),\n    };\n  };\n\n  // --- confirmModal ---\n\n  const confirm = (config: ModalConfirmConfig) => {\n    const instance = create({\n      content: <ConfirmBody config={config} />,\n      styles: { content: { padding: 0 } },\n      title: config.title,\n      width: 420,\n    });\n\n    return {\n      close: instance.close,\n      destroy: instance.destroy,\n    };\n  };\n\n  return { ModalHost: Host, confirmModal: confirm, createModal: create };\n}\n\n// --- Default global instance (backward compatible) ---\n\nconst defaultSystem = createModalSystem();\nexport const ModalHost = defaultSystem.ModalHost;\nexport const createModal = defaultSystem.createModal;\nexport const confirmModal = defaultSystem.confirmModal;\n"],"mappings":"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"}
+{"version":3,"file":"imperative.mjs","names":[],"sources":["../../../src/base-ui/Modal/imperative.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport type { ReactNode } from 'react';\nimport { memo, useCallback, useEffect, useState, useSyncExternalStore } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { useIsClient } from '@/hooks/useIsClient';\nimport { useAppElement } from '@/ThemeProvider/AppElementContext';\nimport { registerDevSingleton } from '@/utils/devSingleton';\n\nimport { Button } from '../Button';\nimport {\n  ModalBackdrop,\n  ModalClose,\n  ModalContent,\n  ModalFooter,\n  ModalHeader,\n  ModalPopup,\n  ModalPortal,\n  ModalRoot,\n  ModalTitle,\n} from './atoms';\nimport { ModalContext, useModalContext } from './context';\nimport { styles } from './style';\nimport type { ImperativeModalProps, ModalConfirmConfig, ModalInstance } from './type';\n\n// --- Shared types ---\n\ntype ModalStackEntry = {\n  id: string;\n  props: ImperativeModalProps;\n};\n\n// --- Shared components (stack-independent) ---\n\nconst ModalPortalWrapper = ({\n  children,\n  root,\n}: {\n  children: ReactNode;\n  root?: HTMLElement | ShadowRoot | null;\n}) => {\n  const appElement = useAppElement();\n  const container = root ?? appElement ?? document.body;\n  return createPortal(children, container);\n};\n\nconst ConfirmBody = ({ config }: { config: ModalConfirmConfig }) => {\n  const { close } = useModalContext();\n  const [loading, setLoading] = useState(false);\n\n  const { cancelText = 'Cancel', content, okButtonProps, okText = 'OK', onCancel, onOk } = config;\n\n  const handleCancel = useCallback(() => {\n    close();\n    onCancel?.();\n  }, [close, onCancel]);\n\n  const handleOk = useCallback(async () => {\n    if (onOk) {\n      try {\n        const result = onOk();\n        if (result && typeof (result as any).then === 'function') {\n          setLoading(true);\n          await result;\n          setLoading(false);\n        }\n      } catch {\n        setLoading(false);\n        return;\n      }\n    }\n    close();\n  }, [close, onOk]);\n\n  return (\n    <>\n      {content && <div style={{ padding: '12px 16px' }}>{content}</div>}\n      <ModalFooter>\n        <Button onClick={handleCancel}>{cancelText}</Button>\n        <Button loading={loading} type=\"primary\" {...okButtonProps} onClick={handleOk}>\n          {okText}\n        </Button>\n      </ModalFooter>\n    </>\n  );\n};\nConfirmBody.displayName = 'ConfirmBody';\n\n// --- Factory ---\n\nexport interface ModalHostProps {\n  root?: HTMLElement | ShadowRoot | null;\n}\n\nexport interface ModalSystem {\n  confirmModal: (config: ModalConfirmConfig) => { close: () => void; destroy: () => void };\n  createModal: (props: ImperativeModalProps) => ModalInstance;\n  ModalHost: React.FC<ModalHostProps>;\n}\n\nlet systemSeed = 0;\n\nexport function createModalSystem(): ModalSystem {\n  const systemId = systemSeed++;\n  const singletonName = systemId === 0 ? 'BaseModalHost' : `BaseModalHost-${systemId}`;\n\n  // --- Stack state (isolated per system) ---\n  let modalStack: ModalStackEntry[] = [];\n  let modalSeed = 0;\n  const listeners = new Set<() => void>();\n\n  const notify = () => listeners.forEach((l) => l());\n  const subscribe = (l: () => void) => {\n    listeners.add(l);\n    return () => listeners.delete(l);\n  };\n  const EMPTY: ModalStackEntry[] = [];\n  const getSnapshot = () => modalStack;\n  const getServerSnapshot = () => EMPTY;\n\n  // --- Stack operations ---\n\n  const updateModal = (id: string, next: Partial<ImperativeModalProps>) => {\n    let changed = false;\n    modalStack = modalStack.map((item) => {\n      if (item.id !== id) return item;\n      changed = true;\n      return { ...item, props: { ...item.props, ...next } };\n    });\n    if (changed) notify();\n  };\n\n  const closeModal = (id: string) => {\n    updateModal(id, { open: false });\n  };\n\n  const destroyModal = (id: string) => {\n    const next = modalStack.filter((item) => item.id !== id);\n    if (next.length === modalStack.length) return;\n    modalStack = next;\n    notify();\n  };\n\n  // --- Stack Item (captures operations via closure) ---\n\n  const StackItem = memo(({ entry }: { entry: ModalStackEntry }) => {\n    const { id, props } = entry;\n    const {\n      children,\n      classNames,\n      content,\n      footer,\n      maskClosable,\n      onOpenChange,\n      onOpenChangeComplete,\n      open,\n      styles: semanticStyles,\n      title,\n      width,\n    } = props;\n\n    const isOpen = open ?? true;\n\n    const handleOpenChange = useCallback(\n      (nextOpen: boolean, eventDetails?: { reason: string }) => {\n        if (!nextOpen && maskClosable === false && eventDetails?.reason === 'outside-press') return;\n        if (!nextOpen) closeModal(id);\n        onOpenChange?.(nextOpen);\n      },\n      [id, maskClosable, onOpenChange],\n    );\n\n    const handleExitComplete = useCallback(() => {\n      onOpenChangeComplete?.(false);\n      destroyModal(id);\n    }, [id, onOpenChangeComplete]);\n\n    const close = useCallback(() => closeModal(id), [id]);\n    const setCanDismissByClickOutside = useCallback(\n      (value: boolean) => updateModal(id, { maskClosable: value }),\n      [id],\n    );\n\n    const showTitle = title !== undefined && title !== false && title !== null;\n\n    return (\n      <ModalContext value={{ close, setCanDismissByClickOutside }}>\n        <ModalRoot\n          open={isOpen}\n          onExitComplete={handleExitComplete}\n          onOpenChange={handleOpenChange}\n        >\n          <ModalPortal>\n            <ModalBackdrop className={classNames?.backdrop} style={semanticStyles?.backdrop} />\n            <ModalPopup\n              className={classNames?.popup}\n              popupStyle={semanticStyles?.popup}\n              width={width}\n            >\n              {showTitle && (\n                <ModalHeader className={classNames?.header} style={semanticStyles?.header}>\n                  <ModalTitle className={classNames?.title} style={semanticStyles?.title}>\n                    {title}\n                  </ModalTitle>\n                  <ModalClose className={classNames?.close} style={semanticStyles?.close} />\n                </ModalHeader>\n              )}\n              <ModalContent\n                className={cx(!showTitle && styles.contentNoHeader, classNames?.content)}\n                style={semanticStyles?.content}\n              >\n                {content ?? children}\n              </ModalContent>\n              {footer}\n            </ModalPopup>\n          </ModalPortal>\n        </ModalRoot>\n      </ModalContext>\n    );\n  });\n  StackItem.displayName = 'ModalStackItem';\n\n  const StackRenderer = memo(({ stack }: { stack: ModalStackEntry[] }) => {\n    const isClient = useIsClient();\n    if (!isClient) return null;\n    return stack.map((entry) => <StackItem entry={entry} key={entry.id} />);\n  });\n  StackRenderer.displayName = 'ModalStackRenderer';\n\n  // --- ModalHost ---\n\n  const Host = ({ root }: ModalHostProps) => {\n    const stack = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);\n    const isClient = useIsClient();\n\n    useEffect(() => {\n      if (!isClient) return;\n      const scope = root ?? document.body;\n      return registerDevSingleton(singletonName, scope);\n    }, [isClient, root]);\n\n    if (!isClient) return null;\n    if (stack.length === 0) return null;\n\n    return (\n      <ModalPortalWrapper root={root}>\n        <StackRenderer stack={stack} />\n      </ModalPortalWrapper>\n    );\n  };\n\n  // --- createModal ---\n\n  const create = (props: ImperativeModalProps): ModalInstance => {\n    const id = `base-modal-${Date.now()}-${modalSeed++}`;\n    modalStack = [...modalStack, { id, props: { ...props, open: props.open ?? true } }];\n    notify();\n\n    return {\n      close: () => closeModal(id),\n      destroy: () => destroyModal(id),\n      setCanDismissByClickOutside: (value) => updateModal(id, { maskClosable: value }),\n      update: (nextProps) => updateModal(id, nextProps),\n    };\n  };\n\n  // --- confirmModal ---\n\n  const confirm = (config: ModalConfirmConfig) => {\n    const instance = create({\n      content: <ConfirmBody config={config} />,\n      styles: { content: { padding: 0 } },\n      title: config.title,\n      width: config.width ?? 420,\n    });\n\n    return {\n      close: instance.close,\n      destroy: instance.destroy,\n    };\n  };\n\n  return { ModalHost: Host, confirmModal: confirm, createModal: create };\n}\n\n// --- Default global instance (backward compatible) ---\n\nconst defaultSystem = createModalSystem();\nexport const ModalHost = defaultSystem.ModalHost;\nexport const createModal = defaultSystem.createModal;\nexport const confirmModal = defaultSystem.confirmModal;\n"],"mappings":"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"}

package/es/base-ui/Modal/type.d.mts

@@ -101,6 +101,7 @@ interface ModalConfirmConfig {
   onCancel?: () => void;
   onOk?: (() => void) | (() => Promise<void>);
   title?: ReactNode;
+  width?: number | string;
 }
 //#endregion
 export { BaseModalProps, ImperativeModalProps, ModalComponentProps, ModalConfirmConfig, ModalContextValue, ModalInstance };

package/es/base-ui/Popover/PopoverPortal.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"PopoverPortal.mjs","names":[],"sources":["../../../src/base-ui/Popover/PopoverPortal.tsx"],"sourcesContent":["'use client';\n\nimport { useAppElement } from '@/ThemeProvider';\n\nexport const usePopoverPortalContainer = (\n  root?: HTMLElement | ShadowRoot | null,\n): HTMLElement | null => {\n  const appElement = useAppElement();\n  if (typeof document === 'undefined') return null;\n  return (root as HTMLElement | null) ?? appElement ?? document.body;\n};\n"],"mappings":";;;AAIA,MAAa,6BACX,SACuB;CACvB,MAAM,aAAa,cAAc;CACjC,IAAI,OAAO,aAAa,aAAa,OAAO;CAC5C,OAAQ,QAA+B,cAAc,SAAS;AAChE"}
+{"version":3,"file":"PopoverPortal.mjs","names":[],"sources":["../../../src/base-ui/Popover/PopoverPortal.tsx"],"sourcesContent":["'use client';\n\nimport { useAppElement } from '@/ThemeProvider/AppElementContext';\n\nexport const usePopoverPortalContainer = (\n  root?: HTMLElement | ShadowRoot | null,\n): HTMLElement | null => {\n  const appElement = useAppElement();\n  if (typeof document === 'undefined') return null;\n  return (root as HTMLElement | null) ?? appElement ?? document.body;\n};\n"],"mappings":";;;AAIA,MAAa,6BACX,SACuB;CACvB,MAAM,aAAa,cAAc;CACjC,IAAI,OAAO,aAAa,aAAa,OAAO;CAC5C,OAAQ,QAA+B,cAAc,SAAS;AAChE"}