@lobehub/ui 5.19.3 → 5.20.1

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

@@ -0,0 +1,139 @@
+import { FlexboxProps } from "../../Flex/type.mjs";
+import { DivProps } from "../../types/index.mjs";
+import { IconProps } from "../../Icon/type.mjs";
+import { TagProps } from "../../Tag/type.mjs";
+import { ButtonProps } from "../Button/type.mjs";
+import { CSSProperties, ComponentProps, ReactNode, Ref } from "react";
+import { Field } from "@base-ui/react/field";
+import { Form } from "@base-ui/react/form";
+
+//#region src/base-ui/Form/type.d.ts
+type FormVariant = 'filled' | 'outlined' | 'borderless';
+type FormLayout = 'horizontal' | 'vertical';
+type ItemsType = 'group' | 'flat';
+type FormValues = Record<string, any>;
+type BaseFormProps = Omit<ComponentProps<typeof Form>, 'render' | 'className' | 'style'>;
+interface FormProps extends BaseFormProps {
+  activeKey?: (string | number)[];
+  className?: string;
+  classNames?: {
+    group?: string;
+    item?: string;
+  };
+  collapsible?: boolean;
+  defaultActiveKey?: (string | number)[];
+  footer?: ReactNode;
+  gap?: number | string;
+  /**
+   * Initial values distributed to fields as `defaultValue` by name.
+   * Also the baseline for unsaved-changes detection and native reset.
+   */
+  initialValues?: FormValues;
+  itemMinWidth?: FormFieldProps['minWidth'];
+  items?: FormGroupItemType[] | FormFieldProps[];
+  itemsType?: ItemsType;
+  layout?: FormLayout;
+  onCollapse?: (key: (string | number)[]) => void;
+  /**
+   * Called with collected field values on submit. Async callbacks drive submit loading state.
+   */
+  onFinish?: (values: FormValues, eventDetails: Parameters<NonNullable<BaseFormProps['onFormSubmit']>>[1]) => void | Promise<void>;
+  ref?: Ref<HTMLFormElement>;
+  style?: CSSProperties;
+  styles?: {
+    group?: CSSProperties;
+    item?: CSSProperties;
+  };
+  variant?: FormVariant;
+}
+interface FormFieldProps extends Omit<ComponentProps<typeof Field.Root>, 'render' | 'children' | 'className' | 'style'> {
+  avatar?: ReactNode;
+  children?: ReactNode;
+  className?: string;
+  desc?: ReactNode;
+  divider?: boolean;
+  hidden?: boolean;
+  label?: ReactNode;
+  layout?: FormLayout;
+  minWidth?: string | number;
+  required?: boolean;
+  style?: CSSProperties;
+  tag?: string;
+  variant?: FormVariant;
+}
+interface FormGroupItemType {
+  children: FormFieldProps[] | ReactNode;
+  collapsible?: boolean;
+  defaultActive?: boolean;
+  desc?: ReactNode;
+  extra?: ReactNode;
+  icon?: IconProps['icon'];
+  key?: string;
+  title: ReactNode;
+  variant?: FormVariant;
+}
+interface FormGroupProps extends Omit<DivProps, 'title'> {
+  active?: boolean;
+  collapsible?: boolean;
+  defaultActive?: boolean;
+  desc?: ReactNode;
+  extra?: ReactNode;
+  icon?: IconProps['icon'];
+  keyValue?: string | number;
+  onCollapse?: (active: boolean) => void;
+  title?: ReactNode;
+  variant?: FormVariant;
+}
+interface FormFlatGroupProps extends FlexboxProps {
+  variant?: FormVariant;
+}
+interface FormDividerProps extends DivProps {
+  visible?: boolean;
+}
+type FormFooterProps = FlexboxProps;
+interface FormSubmitFooterProps extends Omit<FlexboxProps, 'onReset'> {
+  buttonProps?: Omit<ButtonProps, 'children'>;
+  enableReset?: boolean;
+  enableUnsavedWarning?: boolean;
+  float?: boolean;
+  onReset?: () => void;
+  resetButtonProps?: Omit<ButtonProps, 'children'>;
+  saveButtonProps?: Omit<ButtonProps, 'children'>;
+  texts?: {
+    reset?: string;
+    submit?: string;
+    unSaved?: string;
+    unSavedWarning?: string;
+  };
+}
+interface FormTitleProps extends Omit<FlexboxProps, 'title'> {
+  avatar?: ReactNode;
+  classNames?: {
+    content?: string;
+    desc?: string;
+    tag?: string;
+    title?: string;
+  };
+  desc?: ReactNode;
+  styles?: {
+    content?: CSSProperties;
+    desc?: CSSProperties;
+    tag?: CSSProperties;
+    title?: CSSProperties;
+  };
+  tag?: string;
+  tagProps?: Omit<TagProps, 'children'>;
+  title: ReactNode;
+}
+interface FormContextValue {
+  hasUnsavedChanges: boolean;
+  initialValues?: FormValues;
+  itemMinWidth?: FormFieldProps['minWidth'];
+  layout: FormLayout;
+  requestReset: () => void;
+  submitLoading: boolean;
+  variant: FormVariant;
+}
+//#endregion
+export { FormContextValue, FormDividerProps, FormFieldProps, FormFlatGroupProps, FormFooterProps, FormGroupItemType, FormGroupProps, FormLayout, FormProps, FormSubmitFooterProps, FormTitleProps, FormValues, FormVariant, ItemsType };
+//# sourceMappingURL=type.d.mts.map

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

@@ -0,0 +1,8 @@
+import { InputProps } from "./type.mjs";
+import * as _$react from "react";
+
+//#region src/base-ui/Input/Input.d.ts
+declare const Input: _$react.NamedExoticComponent<InputProps>;
+//#endregion
+export { Input };
+//# sourceMappingURL=Input.d.mts.map

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

@@ -0,0 +1,43 @@
+"use client";
+import { rootVariants, styles } from "./style.mjs";
+import { memo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx, useThemeMode } from "antd-style";
+import { Input } from "@base-ui/react/input";
+//#region src/base-ui/Input/Input.tsx
+const Input$1 = memo(({ ref, className, classNames, styles: customStyles, style, variant, shadow, size = "middle", prefix, suffix, disabled, ...rest }) => {
+	const { isDarkMode } = useThemeMode();
+	return /* @__PURE__ */ jsxs("div", {
+		className: cx(rootVariants({
+			shadow,
+			size,
+			variant: variant || (isDarkMode ? "filled" : "outlined")
+		}), className),
+		"data-disabled": disabled ? "" : void 0,
+		style,
+		children: [
+			prefix && /* @__PURE__ */ jsx("span", {
+				className: cx(styles.slot, classNames?.prefix),
+				style: customStyles?.prefix,
+				children: prefix
+			}),
+			/* @__PURE__ */ jsx(Input, {
+				className: cx(styles.input, classNames?.input),
+				disabled,
+				ref,
+				style: customStyles?.input,
+				...rest
+			}),
+			suffix && /* @__PURE__ */ jsx("span", {
+				className: cx(styles.slot, classNames?.suffix),
+				style: customStyles?.suffix,
+				children: suffix
+			})
+		]
+	});
+});
+Input$1.displayName = "Input";
+//#endregion
+export { Input$1 as default };
+
+//# sourceMappingURL=Input.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Input.mjs","names":["Input","BaseInput"],"sources":["../../../src/base-ui/Input/Input.tsx"],"sourcesContent":["'use client';\n\nimport { Input as BaseInput } from '@base-ui/react/input';\nimport { cx, useThemeMode } from 'antd-style';\nimport { memo } from 'react';\n\nimport { rootVariants, styles } from './style';\nimport type { InputProps } from './type';\n\nconst Input = memo<InputProps>(\n  ({\n    ref,\n    className,\n    classNames,\n    styles: customStyles,\n    style,\n    variant,\n    shadow,\n    size = 'middle',\n    prefix,\n    suffix,\n    disabled,\n    ...rest\n  }) => {\n    const { isDarkMode } = useThemeMode();\n    const mergedVariant = variant || (isDarkMode ? 'filled' : 'outlined');\n\n    return (\n      <div\n        className={cx(rootVariants({ shadow, size, variant: mergedVariant }), className)}\n        data-disabled={disabled ? '' : undefined}\n        style={style}\n      >\n        {prefix && (\n          <span className={cx(styles.slot, classNames?.prefix)} style={customStyles?.prefix}>\n            {prefix}\n          </span>\n        )}\n        <BaseInput\n          className={cx(styles.input, classNames?.input)}\n          disabled={disabled}\n          ref={ref}\n          style={customStyles?.input}\n          {...rest}\n        />\n        {suffix && (\n          <span className={cx(styles.slot, classNames?.suffix)} style={customStyles?.suffix}>\n            {suffix}\n          </span>\n        )}\n      </div>\n    );\n  },\n);\n\nInput.displayName = 'Input';\n\nexport default Input;\n"],"mappings":";;;;;;;AASA,MAAMA,UAAQ,MACX,EACC,KACA,WACA,YACA,QAAQ,cACR,OACA,SACA,QACA,OAAO,UACP,QACA,QACA,UACA,GAAG,WACC;CACJ,MAAM,EAAE,eAAe,cAAc;AAGrC,QACE,qBAAC,OAAD;EACE,WAAW,GAAG,aAAa;GAAE;GAAQ;GAAM,SAJzB,YAAY,aAAa,WAAW;GAIa,CAAC,EAAE,UAAU;EAChF,iBAAe,WAAW,KAAK,KAAA;EACxB;YAHT;GAKG,UACC,oBAAC,QAAD;IAAM,WAAW,GAAG,OAAO,MAAM,YAAY,OAAO;IAAE,OAAO,cAAc;cACxE;IACI,CAAA;GAET,oBAACC,OAAD;IACE,WAAW,GAAG,OAAO,OAAO,YAAY,MAAM;IACpC;IACL;IACL,OAAO,cAAc;IACrB,GAAI;IACJ,CAAA;GACD,UACC,oBAAC,QAAD;IAAM,WAAW,GAAG,OAAO,MAAM,YAAY,OAAO;IAAE,OAAO,cAAc;cACxE;IACI,CAAA;GAEL;;EAGX;AAED,QAAM,cAAc"}

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

@@ -0,0 +1,8 @@
+import { InputNumberProps } from "./type.mjs";
+import * as _$react from "react";
+
+//#region src/base-ui/Input/InputNumber.d.ts
+declare const InputNumber: _$react.NamedExoticComponent<InputNumberProps>;
+//#endregion
+export { InputNumber };
+//# sourceMappingURL=InputNumber.d.mts.map

package/es/base-ui/Input/InputNumber.mjs

@@ -0,0 +1,50 @@
+"use client";
+import Icon from "../../Icon/Icon.mjs";
+import { rootVariants, styles } from "./style.mjs";
+import { memo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx, useThemeMode } from "antd-style";
+import { ChevronDown, ChevronUp } from "lucide-react";
+import { NumberField } from "@base-ui/react/number-field";
+//#region src/base-ui/Input/InputNumber.tsx
+const InputNumber = memo(({ ref, className, classNames, styles: customStyles, style, variant, shadow, size = "middle", controls = true, changeOnWheel, onChange, placeholder, ...rest }) => {
+	const { isDarkMode } = useThemeMode();
+	const mergedVariant = variant || (isDarkMode ? "filled" : "outlined");
+	return /* @__PURE__ */ jsxs(NumberField.Root, {
+		allowWheelScrub: changeOnWheel,
+		className: cx(rootVariants({
+			shadow,
+			size,
+			variant: mergedVariant
+		}), className),
+		style,
+		onValueChange: onChange,
+		...rest,
+		children: [/* @__PURE__ */ jsx(NumberField.Input, {
+			className: cx(styles.input, styles.numberInput, classNames?.input),
+			placeholder,
+			ref,
+			style: customStyles?.input
+		}), controls && /* @__PURE__ */ jsxs("div", {
+			className: styles.numberControls,
+			children: [/* @__PURE__ */ jsx(NumberField.Increment, {
+				className: styles.numberControl,
+				children: /* @__PURE__ */ jsx(Icon, {
+					icon: ChevronUp,
+					size: 12
+				})
+			}), /* @__PURE__ */ jsx(NumberField.Decrement, {
+				className: styles.numberControl,
+				children: /* @__PURE__ */ jsx(Icon, {
+					icon: ChevronDown,
+					size: 12
+				})
+			})]
+		})]
+	});
+});
+InputNumber.displayName = "InputNumber";
+//#endregion
+export { InputNumber as default };
+
+//# sourceMappingURL=InputNumber.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InputNumber.mjs","names":[],"sources":["../../../src/base-ui/Input/InputNumber.tsx"],"sourcesContent":["'use client';\n\nimport { NumberField } from '@base-ui/react/number-field';\nimport { cx, useThemeMode } from 'antd-style';\nimport { ChevronDown, ChevronUp } from 'lucide-react';\nimport { memo } from 'react';\n\nimport Icon from '@/Icon';\n\nimport { rootVariants, styles } from './style';\nimport type { InputNumberProps } from './type';\n\nconst InputNumber = memo<InputNumberProps>(\n  ({\n    ref,\n    className,\n    classNames,\n    styles: customStyles,\n    style,\n    variant,\n    shadow,\n    size = 'middle',\n    controls = true,\n    changeOnWheel,\n    onChange,\n    placeholder,\n    ...rest\n  }) => {\n    const { isDarkMode } = useThemeMode();\n    const mergedVariant = variant || (isDarkMode ? 'filled' : 'outlined');\n\n    return (\n      <NumberField.Root\n        allowWheelScrub={changeOnWheel}\n        className={cx(rootVariants({ shadow, size, variant: mergedVariant }), className)}\n        style={style}\n        onValueChange={onChange}\n        {...rest}\n      >\n        <NumberField.Input\n          className={cx(styles.input, styles.numberInput, classNames?.input)}\n          placeholder={placeholder}\n          ref={ref}\n          style={customStyles?.input}\n        />\n        {controls && (\n          <div className={styles.numberControls}>\n            <NumberField.Increment className={styles.numberControl}>\n              <Icon icon={ChevronUp} size={12} />\n            </NumberField.Increment>\n            <NumberField.Decrement className={styles.numberControl}>\n              <Icon icon={ChevronDown} size={12} />\n            </NumberField.Decrement>\n          </div>\n        )}\n      </NumberField.Root>\n    );\n  },\n);\n\nInputNumber.displayName = 'InputNumber';\n\nexport default InputNumber;\n"],"mappings":";;;;;;;;;AAYA,MAAM,cAAc,MACjB,EACC,KACA,WACA,YACA,QAAQ,cACR,OACA,SACA,QACA,OAAO,UACP,WAAW,MACX,eACA,UACA,aACA,GAAG,WACC;CACJ,MAAM,EAAE,eAAe,cAAc;CACrC,MAAM,gBAAgB,YAAY,aAAa,WAAW;AAE1D,QACE,qBAAC,YAAY,MAAb;EACE,iBAAiB;EACjB,WAAW,GAAG,aAAa;GAAE;GAAQ;GAAM,SAAS;GAAe,CAAC,EAAE,UAAU;EACzE;EACP,eAAe;EACf,GAAI;YALN,CAOE,oBAAC,YAAY,OAAb;GACE,WAAW,GAAG,OAAO,OAAO,OAAO,aAAa,YAAY,MAAM;GACrD;GACR;GACL,OAAO,cAAc;GACrB,CAAA,EACD,YACC,qBAAC,OAAD;GAAK,WAAW,OAAO;aAAvB,CACE,oBAAC,YAAY,WAAb;IAAuB,WAAW,OAAO;cACvC,oBAAC,MAAD;KAAM,MAAM;KAAW,MAAM;KAAM,CAAA;IACb,CAAA,EACxB,oBAAC,YAAY,WAAb;IAAuB,WAAW,OAAO;cACvC,oBAAC,MAAD;KAAM,MAAM;KAAa,MAAM;KAAM,CAAA;IACf,CAAA,CACpB;KAES;;EAGxB;AAED,YAAY,cAAc"}

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

@@ -0,0 +1,8 @@
+import { InputOTPProps } from "./type.mjs";
+import * as _$react from "react";
+
+//#region src/base-ui/Input/InputOTP.d.ts
+declare const InputOTP: _$react.NamedExoticComponent<InputOTPProps>;
+//#endregion
+export { InputOTP };
+//# sourceMappingURL=InputOTP.d.mts.map

package/es/base-ui/Input/InputOTP.mjs

@@ -0,0 +1,31 @@
+"use client";
+import { rootVariants, styles } from "./style.mjs";
+import { memo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx, useThemeMode } from "antd-style";
+import { OTPField } from "@base-ui/react/otp-field";
+//#region src/base-ui/Input/InputOTP.tsx
+const InputOTP = memo(({ className, classNames, styles: customStyles, style, variant, shadow, size = "middle", length = 6, onChange, ...rest }) => {
+	const { isDarkMode } = useThemeMode();
+	const mergedVariant = variant || (isDarkMode ? "filled" : "outlined");
+	return /* @__PURE__ */ jsx(OTPField.Root, {
+		className: cx(styles.otpRoot, className),
+		length,
+		style,
+		onValueChange: onChange,
+		...rest,
+		children: Array.from({ length }, (_, index) => /* @__PURE__ */ jsx(OTPField.Input, {
+			style: customStyles?.input,
+			className: cx(rootVariants({
+				shadow,
+				size,
+				variant: mergedVariant
+			}), styles.otpCell, classNames?.input)
+		}, index))
+	});
+});
+InputOTP.displayName = "InputOTP";
+//#endregion
+export { InputOTP as default };
+
+//# sourceMappingURL=InputOTP.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InputOTP.mjs","names":[],"sources":["../../../src/base-ui/Input/InputOTP.tsx"],"sourcesContent":["'use client';\n\nimport { OTPField } from '@base-ui/react/otp-field';\nimport { cx, useThemeMode } from 'antd-style';\nimport { memo } from 'react';\n\nimport { rootVariants, styles } from './style';\nimport type { InputOTPProps } from './type';\n\nconst InputOTP = memo<InputOTPProps>(\n  ({\n    className,\n    classNames,\n    styles: customStyles,\n    style,\n    variant,\n    shadow,\n    size = 'middle',\n    length = 6,\n    onChange,\n    ...rest\n  }) => {\n    const { isDarkMode } = useThemeMode();\n    const mergedVariant = variant || (isDarkMode ? 'filled' : 'outlined');\n\n    return (\n      <OTPField.Root\n        className={cx(styles.otpRoot, className)}\n        length={length}\n        style={style}\n        onValueChange={onChange}\n        {...rest}\n      >\n        {Array.from({ length }, (_, index) => (\n          <OTPField.Input\n            key={index}\n            style={customStyles?.input}\n            className={cx(\n              rootVariants({ shadow, size, variant: mergedVariant }),\n              styles.otpCell,\n              classNames?.input,\n            )}\n          />\n        ))}\n      </OTPField.Root>\n    );\n  },\n);\n\nInputOTP.displayName = 'InputOTP';\n\nexport default InputOTP;\n"],"mappings":";;;;;;;AASA,MAAM,WAAW,MACd,EACC,WACA,YACA,QAAQ,cACR,OACA,SACA,QACA,OAAO,UACP,SAAS,GACT,UACA,GAAG,WACC;CACJ,MAAM,EAAE,eAAe,cAAc;CACrC,MAAM,gBAAgB,YAAY,aAAa,WAAW;AAE1D,QACE,oBAAC,SAAS,MAAV;EACE,WAAW,GAAG,OAAO,SAAS,UAAU;EAChC;EACD;EACP,eAAe;EACf,GAAI;YAEH,MAAM,KAAK,EAAE,QAAQ,GAAG,GAAG,UAC1B,oBAAC,SAAS,OAAV;GAEE,OAAO,cAAc;GACrB,WAAW,GACT,aAAa;IAAE;IAAQ;IAAM,SAAS;IAAe,CAAC,EACtD,OAAO,SACP,YAAY,MACb;GACD,EAPK,MAOL,CACF;EACY,CAAA;EAGrB;AAED,SAAS,cAAc"}

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

@@ -0,0 +1,8 @@
+import { InputPasswordProps } from "./type.mjs";
+import * as _$react from "react";
+
+//#region src/base-ui/Input/InputPassword.d.ts
+declare const InputPassword: _$react.NamedExoticComponent<InputPasswordProps>;
+//#endregion
+export { InputPassword };
+//# sourceMappingURL=InputPassword.d.mts.map

package/es/base-ui/Input/InputPassword.mjs

@@ -0,0 +1,31 @@
+"use client";
+import Icon from "../../Icon/Icon.mjs";
+import { styles } from "./style.mjs";
+import Input from "./Input.mjs";
+import { memo, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { Eye, EyeOff } from "lucide-react";
+//#region src/base-ui/Input/InputPassword.tsx
+const InputPassword = memo(({ visibilityToggle = true, suffix, ...rest }) => {
+	const [visible, setVisible] = useState(false);
+	return /* @__PURE__ */ jsx(Input, {
+		type: visible ? "text" : "password",
+		suffix: /* @__PURE__ */ jsxs(Fragment$1, { children: [suffix, visibilityToggle && /* @__PURE__ */ jsx("button", {
+			"aria-label": visible ? "Hide password" : "Show password",
+			className: styles.passwordToggle,
+			tabIndex: -1,
+			type: "button",
+			onClick: () => setVisible((v) => !v),
+			children: /* @__PURE__ */ jsx(Icon, {
+				icon: visible ? Eye : EyeOff,
+				size: 16
+			})
+		})] }),
+		...rest
+	});
+});
+InputPassword.displayName = "InputPassword";
+//#endregion
+export { InputPassword as default };
+
+//# sourceMappingURL=InputPassword.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InputPassword.mjs","names":[],"sources":["../../../src/base-ui/Input/InputPassword.tsx"],"sourcesContent":["'use client';\n\nimport { Eye, EyeOff } from 'lucide-react';\nimport { memo, useState } from 'react';\n\nimport Icon from '@/Icon';\n\nimport Input from './Input';\nimport { styles } from './style';\nimport type { InputPasswordProps } from './type';\n\nconst InputPassword = memo<InputPasswordProps>(({ visibilityToggle = true, suffix, ...rest }) => {\n  const [visible, setVisible] = useState(false);\n\n  return (\n    <Input\n      type={visible ? 'text' : 'password'}\n      suffix={\n        <>\n          {suffix}\n          {visibilityToggle && (\n            <button\n              aria-label={visible ? 'Hide password' : 'Show password'}\n              className={styles.passwordToggle}\n              tabIndex={-1}\n              type={'button'}\n              onClick={() => setVisible((v) => !v)}\n            >\n              <Icon icon={visible ? Eye : EyeOff} size={16} />\n            </button>\n          )}\n        </>\n      }\n      {...rest}\n    />\n  );\n});\n\nInputPassword.displayName = 'InputPassword';\n\nexport default InputPassword;\n"],"mappings":";;;;;;;;AAWA,MAAM,gBAAgB,MAA0B,EAAE,mBAAmB,MAAM,QAAQ,GAAG,WAAW;CAC/F,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;AAE7C,QACE,oBAAC,OAAD;EACE,MAAM,UAAU,SAAS;EACzB,QACE,qBAAA,YAAA,EAAA,UAAA,CACG,QACA,oBACC,oBAAC,UAAD;GACE,cAAY,UAAU,kBAAkB;GACxC,WAAW,OAAO;GAClB,UAAU;GACV,MAAM;GACN,eAAe,YAAY,MAAM,CAAC,EAAE;aAEpC,oBAAC,MAAD;IAAM,MAAM,UAAU,MAAM;IAAQ,MAAM;IAAM,CAAA;GACzC,CAAA,CAEV,EAAA,CAAA;EAEL,GAAI;EACJ,CAAA;EAEJ;AAEF,cAAc,cAAc"}

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

@@ -0,0 +1,8 @@
+import { TextAreaProps } from "./type.mjs";
+import * as _$react from "react";
+
+//#region src/base-ui/Input/TextArea.d.ts
+declare const TextArea: _$react.NamedExoticComponent<TextAreaProps>;
+//#endregion
+export { TextArea };
+//# sourceMappingURL=TextArea.d.mts.map

package/es/base-ui/Input/TextArea.mjs

@@ -0,0 +1,43 @@
+"use client";
+import { rootVariants, styles } from "./style.mjs";
+import { memo, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx, useThemeMode } from "antd-style";
+import { Field } from "@base-ui/react/field";
+//#region src/base-ui/Input/TextArea.tsx
+const TextArea = memo(({ ref, className, classNames, styles: customStyles, style, variant, shadow, autoSize, resize = false, disabled, ...rest }) => {
+	const { isDarkMode } = useThemeMode();
+	const mergedVariant = variant || (isDarkMode ? "filled" : "outlined");
+	const cssVariables = useMemo(() => {
+		if (typeof autoSize !== "object") return {};
+		return {
+			"--textarea-max-height": autoSize.maxRows ? `calc(1.5em * ${autoSize.maxRows})` : void 0,
+			"--textarea-min-rows": autoSize.minRows
+		};
+	}, [autoSize]);
+	return /* @__PURE__ */ jsx("div", {
+		"data-disabled": disabled ? "" : void 0,
+		style: {
+			...cssVariables,
+			...style
+		},
+		className: cx(rootVariants({
+			shadow,
+			variant: mergedVariant
+		}), styles.textarea, autoSize && styles.textareaAutoSize, resize && styles.textareaResize, className),
+		children: /* @__PURE__ */ jsx(Field.Control, {
+			className: cx(styles.input, classNames?.input),
+			disabled,
+			render: /* @__PURE__ */ jsx("textarea", {
+				ref,
+				...rest
+			}),
+			style: customStyles?.input
+		})
+	});
+});
+TextArea.displayName = "TextArea";
+//#endregion
+export { TextArea as default };
+
+//# sourceMappingURL=TextArea.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.mjs","names":[],"sources":["../../../src/base-ui/Input/TextArea.tsx"],"sourcesContent":["'use client';\n\nimport { Field } from '@base-ui/react/field';\nimport { cx, useThemeMode } from 'antd-style';\nimport { type CSSProperties, memo, useMemo } from 'react';\n\nimport { rootVariants, styles } from './style';\nimport type { TextAreaProps } from './type';\n\nconst TextArea = memo<TextAreaProps>(\n  ({\n    ref,\n    className,\n    classNames,\n    styles: customStyles,\n    style,\n    variant,\n    shadow,\n    autoSize,\n    resize = false,\n    disabled,\n    ...rest\n  }) => {\n    const { isDarkMode } = useThemeMode();\n    const mergedVariant = variant || (isDarkMode ? 'filled' : 'outlined');\n\n    const cssVariables = useMemo<CSSProperties>(() => {\n      if (typeof autoSize !== 'object') return {};\n      return {\n        '--textarea-max-height': autoSize.maxRows ? `calc(1.5em * ${autoSize.maxRows})` : undefined,\n        '--textarea-min-rows': autoSize.minRows,\n      } as CSSProperties;\n    }, [autoSize]);\n\n    return (\n      <div\n        data-disabled={disabled ? '' : undefined}\n        style={{ ...cssVariables, ...style }}\n        className={cx(\n          rootVariants({ shadow, variant: mergedVariant }),\n          styles.textarea,\n          autoSize && styles.textareaAutoSize,\n          resize && styles.textareaResize,\n          className,\n        )}\n      >\n        <Field.Control\n          className={cx(styles.input, classNames?.input)}\n          disabled={disabled}\n          render={<textarea ref={ref} {...rest} />}\n          style={customStyles?.input}\n        />\n      </div>\n    );\n  },\n);\n\nTextArea.displayName = 'TextArea';\n\nexport default TextArea;\n"],"mappings":";;;;;;;AASA,MAAM,WAAW,MACd,EACC,KACA,WACA,YACA,QAAQ,cACR,OACA,SACA,QACA,UACA,SAAS,OACT,UACA,GAAG,WACC;CACJ,MAAM,EAAE,eAAe,cAAc;CACrC,MAAM,gBAAgB,YAAY,aAAa,WAAW;CAE1D,MAAM,eAAe,cAA6B;AAChD,MAAI,OAAO,aAAa,SAAU,QAAO,EAAE;AAC3C,SAAO;GACL,yBAAyB,SAAS,UAAU,gBAAgB,SAAS,QAAQ,KAAK,KAAA;GAClF,uBAAuB,SAAS;GACjC;IACA,CAAC,SAAS,CAAC;AAEd,QACE,oBAAC,OAAD;EACE,iBAAe,WAAW,KAAK,KAAA;EAC/B,OAAO;GAAE,GAAG;GAAc,GAAG;GAAO;EACpC,WAAW,GACT,aAAa;GAAE;GAAQ,SAAS;GAAe,CAAC,EAChD,OAAO,UACP,YAAY,OAAO,kBACnB,UAAU,OAAO,gBACjB,UACD;YAED,oBAAC,MAAM,SAAP;GACE,WAAW,GAAG,OAAO,OAAO,YAAY,MAAM;GACpC;GACV,QAAQ,oBAAC,YAAD;IAAe;IAAK,GAAI;IAAQ,CAAA;GACxC,OAAO,cAAc;GACrB,CAAA;EACE,CAAA;EAGX;AAED,SAAS,cAAc"}

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

@@ -0,0 +1,7 @@
+import { InputClassNames, InputNumberProps, InputOTPProps, InputPasswordProps, InputProps, InputSize, InputStyles, InputVariant, TextAreaAutoSize, TextAreaProps } from "./type.mjs";
+import { Input } from "./Input.mjs";
+import { InputNumber } from "./InputNumber.mjs";
+import { InputOTP } from "./InputOTP.mjs";
+import { InputPassword } from "./InputPassword.mjs";
+import { rootVariants, styles } from "./style.mjs";
+import { TextArea } from "./TextArea.mjs";

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

@@ -0,0 +1,33 @@
+import * as _$class_variance_authority_types0 from "class-variance-authority/types";
+
+//#region src/base-ui/Input/style.d.ts
+declare const styles: {
+  borderless: string;
+  filled: string;
+  input: string;
+  invalid: string;
+  outlined: string;
+  root: string;
+  shadow: string;
+  sizeLarge: string;
+  sizeMiddle: string;
+  sizeSmall: string;
+  numberControl: string;
+  numberControls: string;
+  numberInput: string;
+  otpCell: string;
+  otpRoot: string;
+  passwordToggle: string;
+  slot: string;
+  textarea: string;
+  textareaAutoSize: string;
+  textareaResize: string;
+};
+declare const rootVariants: (props?: ({
+  shadow?: boolean | null | undefined;
+  size?: "small" | "large" | "middle" | null | undefined;
+  variant?: "filled" | "outlined" | "borderless" | null | undefined;
+} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
+//#endregion
+export { rootVariants, styles };
+//# sourceMappingURL=style.d.mts.map