@lobehub/ui 3.4.2 → 3.4.4

package/es/Form/components/FormSubmitFooter.mjs

@@ -0,0 +1,125 @@
+'use client';
+
+import FlexBasic_default from "../../Flex/FlexBasic.mjs";
+import Icon_default from "../../Icon/Icon.mjs";
+import Button_default from "../../Button/Button.mjs";
+import { useSubmitFooterStyles } from "../style.mjs";
+import { useFormContext } from "./FormProvider.mjs";
+import { merge, removeUndefined } from "./merge.mjs";
+import { memo, useEffect, useMemo, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { Form } from "antd";
+import { motion } from "motion/react";
+import { InfoIcon } from "lucide-react";
+import isEqual from "fast-deep-equal";
+
+//#region src/Form/components/FormSubmitFooter.tsx
+const FormSubmitFooter = memo(({ enableReset = true, buttonProps, float, onReset, saveButtonProps, resetButtonProps, enableUnsavedWarning, children, texts, className, ...rest }) => {
+	const { form, initialValues, submitLoading } = useFormContext();
+	const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false);
+	const values = Form.useWatch([], form) || {};
+	const { cx, styles, theme } = useSubmitFooterStyles();
+	const v = useMemo(() => removeUndefined(values), [values]);
+	const initialV = useMemo(() => removeUndefined(initialValues), [initialValues]);
+	const mergedV = useMemo(() => merge(initialV, v), [v, initialV]);
+	useEffect(() => {
+		setHasUnsavedChanges(!isEqual(mergedV, initialV));
+	}, [
+		mergedV,
+		initialV,
+		submitLoading
+	]);
+	const fn = (e) => {
+		if (hasUnsavedChanges) e.returnValue = texts?.unSavedWarning || "You have unsaved changes. Are you sure you want to leave?";
+		else delete e.returnValue;
+	};
+	useEffect(() => {
+		if (!enableUnsavedWarning) return;
+		if (typeof window === "undefined" || !hasUnsavedChanges) return;
+		window.addEventListener("beforeunload", fn);
+		return () => window.removeEventListener("beforeunload", fn);
+	}, [enableUnsavedWarning, hasUnsavedChanges]);
+	const content = /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		(float || hasUnsavedChanges) && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Icon_default, {
+			color: theme.colorTextDescription,
+			icon: InfoIcon,
+			size: 12,
+			style: { marginLeft: 8 }
+		}), /* @__PURE__ */ jsx("span", {
+			style: {
+				color: theme.colorTextDescription,
+				flex: "none",
+				fontSize: 12,
+				marginRight: float ? 16 : 4
+			},
+			children: texts?.unSaved || "Unsaved changes"
+		})] }),
+		children,
+		enableReset && (float || hasUnsavedChanges) && /* @__PURE__ */ jsx(Button_default, {
+			htmlType: "button",
+			onClick: () => {
+				onReset?.(v, initialV);
+				form?.resetFields();
+			},
+			shape: float ? "round" : void 0,
+			variant: "filled",
+			...buttonProps,
+			...resetButtonProps,
+			children: texts?.reset || "Reset"
+		}),
+		/* @__PURE__ */ jsx(Button_default, {
+			htmlType: "submit",
+			loading: submitLoading,
+			shape: float ? "round" : void 0,
+			type: "primary",
+			...buttonProps,
+			...saveButtonProps,
+			children: texts?.submit || "Submit"
+		})
+	] });
+	if (!float) return /* @__PURE__ */ jsx(FlexBasic_default, {
+		align: "center",
+		className: cx(styles.footer, className),
+		gap: 8,
+		horizontal: true,
+		justify: "flex-end",
+		...rest,
+		children: content
+	});
+	return /* @__PURE__ */ jsx(motion.div, {
+		animate: hasUnsavedChanges ? "visible" : "hidden",
+		className: styles.floatFooter,
+		initial: "hidden",
+		transition: {
+			duration: .1,
+			ease: "easeOut"
+		},
+		variants: {
+			hidden: {
+				opacity: 0,
+				x: "-50%",
+				y: 20
+			},
+			visible: {
+				opacity: 1,
+				x: "-50%",
+				y: 0
+			}
+		},
+		children: /* @__PURE__ */ jsx(FlexBasic_default, {
+			align: "center",
+			className,
+			gap: 8,
+			horizontal: true,
+			justify: "center",
+			...rest,
+			children: content
+		})
+	});
+});
+FormSubmitFooter.displayName = "FormSubmitFooter";
+var FormSubmitFooter_default = FormSubmitFooter;
+
+//#endregion
+export { FormSubmitFooter_default as default };
+//# sourceMappingURL=FormSubmitFooter.mjs.map

package/es/Form/components/FormSubmitFooter.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormSubmitFooter.mjs","names":["useStyles","Icon","Button","Flexbox"],"sources":["../../../src/Form/components/FormSubmitFooter.tsx"],"sourcesContent":["'use client';\n\nimport { Form } from 'antd';\nimport isEqual from 'fast-deep-equal';\nimport { InfoIcon } from 'lucide-react';\nimport { motion } from 'motion/react';\nimport { memo, useEffect, useMemo, useState } from 'react';\n\nimport Button from '@/Button';\nimport { Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\n\nimport { useSubmitFooterStyles as useStyles } from '../style';\nimport type { FormSubmitFooterProps } from '../type';\nimport { useFormContext } from './FormProvider';\nimport { merge, removeUndefined } from './merge';\n\nconst FormSubmitFooter = memo<FormSubmitFooterProps>(\n  ({\n    enableReset = true,\n    buttonProps,\n    float,\n    onReset,\n    saveButtonProps,\n    resetButtonProps,\n    enableUnsavedWarning,\n    children,\n    texts,\n    className,\n    ...rest\n  }) => {\n    const { form, initialValues, submitLoading } = useFormContext();\n    const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false);\n    const values = Form.useWatch([], form) || {};\n\n    const { cx, styles, theme } = useStyles();\n\n    const v = useMemo(() => removeUndefined(values), [values]);\n\n    const initialV = useMemo(() => removeUndefined(initialValues), [initialValues]);\n\n    const mergedV = useMemo(() => merge(initialV, v), [v, initialV]);\n\n    useEffect(() => {\n      setHasUnsavedChanges(!isEqual(mergedV, initialV));\n    }, [mergedV, initialV, submitLoading]);\n\n    const fn = (e: BeforeUnloadEvent) => {\n      if (hasUnsavedChanges) {\n        e.returnValue =\n          texts?.unSavedWarning || 'You have unsaved changes. Are you sure you want to leave?';\n      } else {\n        delete e.returnValue;\n      }\n    };\n\n    useEffect(() => {\n      if (!enableUnsavedWarning) return;\n      if (typeof window === 'undefined' || !hasUnsavedChanges) return;\n      // 添加离开页面的提示\n      window.addEventListener('beforeunload', fn);\n      return () => window.removeEventListener('beforeunload', fn);\n    }, [enableUnsavedWarning, hasUnsavedChanges]);\n\n    const content = (\n      <>\n        {(float || hasUnsavedChanges) && (\n          <>\n            <Icon\n              color={theme.colorTextDescription}\n              icon={InfoIcon}\n              size={12}\n              style={{ marginLeft: 8 }}\n            />\n            <span\n              style={{\n                color: theme.colorTextDescription,\n                flex: 'none',\n                fontSize: 12,\n                marginRight: float ? 16 : 4,\n              }}\n            >\n              {texts?.unSaved || 'Unsaved changes'}\n            </span>\n          </>\n        )}\n        {children}\n        {enableReset && (float || hasUnsavedChanges) && (\n          <Button\n            htmlType=\"button\"\n            onClick={() => {\n              onReset?.(v, initialV);\n              form?.resetFields();\n            }}\n            shape={float ? 'round' : undefined}\n            variant={'filled'}\n            {...buttonProps}\n            {...resetButtonProps}\n          >\n            {texts?.reset || 'Reset'}\n          </Button>\n        )}\n        <Button\n          htmlType=\"submit\"\n          loading={submitLoading}\n          shape={float ? 'round' : undefined}\n          type=\"primary\"\n          {...buttonProps}\n          {...saveButtonProps}\n        >\n          {texts?.submit || 'Submit'}\n        </Button>\n      </>\n    );\n\n    if (!float)\n      return (\n        <Flexbox\n          align={'center'}\n          className={cx(styles.footer, className)}\n          gap={8}\n          horizontal\n          justify={'flex-end'}\n          {...rest}\n        >\n          {content}\n        </Flexbox>\n      );\n\n    return (\n      <motion.div\n        animate={hasUnsavedChanges ? 'visible' : 'hidden'}\n        className={styles.floatFooter}\n        initial={'hidden'}\n        transition={{ duration: 0.1, ease: 'easeOut' }}\n        variants={{\n          hidden: {\n            opacity: 0,\n            x: '-50%',\n            y: 20,\n          },\n          visible: {\n            opacity: 1,\n            x: '-50%',\n            y: 0,\n          },\n        }}\n      >\n        <Flexbox\n          align={'center'}\n          className={className}\n          gap={8}\n          horizontal\n          justify={'center'}\n          {...rest}\n        >\n          {content}\n        </Flexbox>\n      </motion.div>\n    );\n  },\n);\n\nFormSubmitFooter.displayName = 'FormSubmitFooter';\n\nexport default FormSubmitFooter;\n"],"mappings":";;;;;;;;;;;;;;;;AAiBA,MAAM,mBAAmB,MACtB,EACC,cAAc,MACd,aACA,OACA,SACA,iBACA,kBACA,sBACA,UACA,OACA,WACA,GAAG,WACC;CACJ,MAAM,EAAE,MAAM,eAAe,kBAAkB,gBAAgB;CAC/D,MAAM,CAAC,mBAAmB,wBAAwB,SAAS,MAAM;CACjE,MAAM,SAAS,KAAK,SAAS,EAAE,EAAE,KAAK,IAAI,EAAE;CAE5C,MAAM,EAAE,IAAI,QAAQ,UAAUA,uBAAW;CAEzC,MAAM,IAAI,cAAc,gBAAgB,OAAO,EAAE,CAAC,OAAO,CAAC;CAE1D,MAAM,WAAW,cAAc,gBAAgB,cAAc,EAAE,CAAC,cAAc,CAAC;CAE/E,MAAM,UAAU,cAAc,MAAM,UAAU,EAAE,EAAE,CAAC,GAAG,SAAS,CAAC;AAEhE,iBAAgB;AACd,uBAAqB,CAAC,QAAQ,SAAS,SAAS,CAAC;IAChD;EAAC;EAAS;EAAU;EAAc,CAAC;CAEtC,MAAM,MAAM,MAAyB;AACnC,MAAI,kBACF,GAAE,cACA,OAAO,kBAAkB;MAE3B,QAAO,EAAE;;AAIb,iBAAgB;AACd,MAAI,CAAC,qBAAsB;AAC3B,MAAI,OAAO,WAAW,eAAe,CAAC,kBAAmB;AAEzD,SAAO,iBAAiB,gBAAgB,GAAG;AAC3C,eAAa,OAAO,oBAAoB,gBAAgB,GAAG;IAC1D,CAAC,sBAAsB,kBAAkB,CAAC;CAE7C,MAAM,UACJ;GACI,SAAS,sBACT,8CACE,oBAACC;GACC,OAAO,MAAM;GACb,MAAM;GACN,MAAM;GACN,OAAO,EAAE,YAAY,GAAG;IACxB,EACF,oBAAC;GACC,OAAO;IACL,OAAO,MAAM;IACb,MAAM;IACN,UAAU;IACV,aAAa,QAAQ,KAAK;IAC3B;aAEA,OAAO,WAAW;IACd,IACN;EAEJ;EACA,gBAAgB,SAAS,sBACxB,oBAACC;GACC,UAAS;GACT,eAAe;AACb,cAAU,GAAG,SAAS;AACtB,UAAM,aAAa;;GAErB,OAAO,QAAQ,UAAU;GACzB,SAAS;GACT,GAAI;GACJ,GAAI;aAEH,OAAO,SAAS;IACV;EAEX,oBAACA;GACC,UAAS;GACT,SAAS;GACT,OAAO,QAAQ,UAAU;GACzB,MAAK;GACL,GAAI;GACJ,GAAI;aAEH,OAAO,UAAU;IACX;KACR;AAGL,KAAI,CAAC,MACH,QACE,oBAACC;EACC,OAAO;EACP,WAAW,GAAG,OAAO,QAAQ,UAAU;EACvC,KAAK;EACL;EACA,SAAS;EACT,GAAI;YAEH;GACO;AAGd,QACE,oBAAC,OAAO;EACN,SAAS,oBAAoB,YAAY;EACzC,WAAW,OAAO;EAClB,SAAS;EACT,YAAY;GAAE,UAAU;GAAK,MAAM;GAAW;EAC9C,UAAU;GACR,QAAQ;IACN,SAAS;IACT,GAAG;IACH,GAAG;IACJ;GACD,SAAS;IACP,SAAS;IACT,GAAG;IACH,GAAG;IACJ;GACF;YAED,oBAACA;GACC,OAAO;GACI;GACX,KAAK;GACL;GACA,SAAS;GACT,GAAI;aAEH;IACO;GACC;EAGlB;AAED,iBAAiB,cAAc;AAE/B,+BAAe"}

package/es/Form/components/FormTitle.d.mts

@@ -0,0 +1,8 @@
+import { FormTitleProps } from "../type.mjs";
+import { FC } from "react";
+
+//#region src/Form/components/FormTitle.d.ts
+declare const FormTitle: FC<FormTitleProps>;
+//#endregion
+export { FormTitle };
+//# sourceMappingURL=FormTitle.d.mts.map

package/es/Form/components/FormTitle.mjs

@@ -0,0 +1,44 @@
+'use client';
+
+import FlexBasic_default from "../../Flex/FlexBasic.mjs";
+import Tag_default from "../../Tag/Tag.mjs";
+import { useTitleStyles } from "../style.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/Form/components/FormTitle.tsx
+const FormTitle = ({ tag, title, desc, avatar, classNames, styles: customStyles, ...rest }) => {
+	const { cx, styles } = useTitleStyles();
+	return /* @__PURE__ */ jsxs(FlexBasic_default, {
+		align: `center`,
+		gap: 8,
+		horizontal: true,
+		...rest,
+		children: [avatar, /* @__PURE__ */ jsxs(FlexBasic_default, {
+			className: cx(styles.content, classNames?.content),
+			gap: 8,
+			style: customStyles?.content,
+			children: [/* @__PURE__ */ jsxs(FlexBasic_default, {
+				align: "center",
+				className: cx(styles.title, classNames?.title),
+				direction: "horizontal",
+				gap: 8,
+				style: customStyles?.title,
+				children: [title, tag && /* @__PURE__ */ jsx(Tag_default, {
+					className: classNames?.tag,
+					style: customStyles?.tag,
+					children: tag
+				})]
+			}), desc && /* @__PURE__ */ jsx("small", {
+				className: cx(styles.desc, classNames?.desc),
+				style: customStyles?.desc,
+				children: desc
+			})]
+		})]
+	});
+};
+FormTitle.displayName = "FormTitle";
+var FormTitle_default = FormTitle;
+
+//#endregion
+export { FormTitle_default as default };
+//# sourceMappingURL=FormTitle.mjs.map

package/es/Form/components/FormTitle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormTitle.mjs","names":["FormTitle: FC<FormTitleProps>","useStyles","Flexbox","Tag"],"sources":["../../../src/Form/components/FormTitle.tsx"],"sourcesContent":["'use client';\n\nimport { type FC } from 'react';\n\nimport { Flexbox } from '@/Flex';\nimport Tag from '@/Tag';\n\nimport { useTitleStyles as useStyles } from '../style';\nimport type { FormTitleProps } from '../type';\n\nconst FormTitle: FC<FormTitleProps> = ({\n  tag,\n  title,\n  desc,\n  avatar,\n  classNames,\n  styles: customStyles,\n  ...rest\n}) => {\n  const { cx, styles } = useStyles();\n\n  return (\n    <Flexbox align={`center`} gap={8} horizontal {...rest}>\n      {avatar}\n      <Flexbox\n        className={cx(styles.content, classNames?.content)}\n        gap={8}\n        style={customStyles?.content}\n      >\n        <Flexbox\n          align={'center'}\n          className={cx(styles.title, classNames?.title)}\n          direction={'horizontal'}\n          gap={8}\n          style={customStyles?.title}\n        >\n          {title}\n          {tag && (\n            <Tag className={classNames?.tag} style={customStyles?.tag}>\n              {tag}\n            </Tag>\n          )}\n        </Flexbox>\n        {desc && (\n          <small className={cx(styles.desc, classNames?.desc)} style={customStyles?.desc}>\n            {desc}\n          </small>\n        )}\n      </Flexbox>\n    </Flexbox>\n  );\n};\n\nFormTitle.displayName = 'FormTitle';\n\nexport default FormTitle;\n"],"mappings":";;;;;;;;AAUA,MAAMA,aAAiC,EACrC,KACA,OACA,MACA,QACA,YACA,QAAQ,cACR,GAAG,WACC;CACJ,MAAM,EAAE,IAAI,WAAWC,gBAAW;AAElC,QACE,qBAACC;EAAQ,OAAO;EAAU,KAAK;EAAG;EAAW,GAAI;aAC9C,QACD,qBAACA;GACC,WAAW,GAAG,OAAO,SAAS,YAAY,QAAQ;GAClD,KAAK;GACL,OAAO,cAAc;cAErB,qBAACA;IACC,OAAO;IACP,WAAW,GAAG,OAAO,OAAO,YAAY,MAAM;IAC9C,WAAW;IACX,KAAK;IACL,OAAO,cAAc;eAEpB,OACA,OACC,oBAACC;KAAI,WAAW,YAAY;KAAK,OAAO,cAAc;eACnD;MACG;KAEA,EACT,QACC,oBAAC;IAAM,WAAW,GAAG,OAAO,MAAM,YAAY,KAAK;IAAE,OAAO,cAAc;cACvE;KACK;IAEF;GACF;;AAId,UAAU,cAAc;AAExB,wBAAe"}

package/es/Form/components/merge.mjs

@@ -0,0 +1,23 @@
+import { isEmpty, isObject, mergeWith, pickBy } from "lodash-es";
+
+//#region src/Form/components/merge.ts
+const removeUndefined = (obj) => {
+	if (!isObject(obj)) return obj;
+	if (Array.isArray(obj)) return obj.map((item) => removeUndefined(item)).filter((item) => item !== void 0);
+	return pickBy(Object.entries(obj).reduce((acc, [key, value]) => {
+		acc[key] = removeUndefined(value);
+		return acc;
+	}, {}), (value) => value !== void 0);
+};
+/**
+* 用于合并对象，如果是数组则直接替换
+* @param target
+* @param source
+*/
+const merge$1 = (target, source) => mergeWith({}, target, source, (obj, src) => {
+	if (Array.isArray(obj)) return src;
+});
+
+//#endregion
+export { merge$1 as merge, removeUndefined };
+//# sourceMappingURL=merge.mjs.map

package/es/Form/components/merge.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"merge.mjs","names":["merge: typeof _merge"],"sources":["../../../src/Form/components/merge.ts"],"sourcesContent":["import { merge as _merge, isEmpty, isObject, mergeWith, pickBy } from 'lodash-es';\n\nexport const removeUndefined = (obj: any): any => {\n  if (!isObject(obj)) return obj;\n\n  if (Array.isArray(obj)) {\n    return obj.map((item) => removeUndefined(item)).filter((item) => item !== undefined);\n  }\n\n  return pickBy(\n    Object.entries(obj).reduce((acc: any, [key, value]) => {\n      acc[key] = removeUndefined(value);\n      return acc;\n    }, {}),\n    (value) => value !== undefined,\n  );\n};\n\n/**\n * 用于合并对象，如果是数组则直接替换\n * @param target\n * @param source\n */\nexport const merge: typeof _merge = <T = object>(target: T, source: T) =>\n  mergeWith({}, target, source, (obj, src) => {\n    if (Array.isArray(obj)) return src;\n  });\n\ntype MergeableItem = {\n  [key: string]: any;\n  id: string;\n};\n\n/**\n * Merge two arrays based on id, preserving metadata from default items\n * @param defaultItems Items with default configuration and metadata\n * @param userItems User-defined items with higher priority\n */\nexport const mergeArrayById = <T extends MergeableItem>(defaultItems: T[], userItems: T[]): T[] => {\n  // Create a map of default items for faster lookup\n  const defaultItemsMap = new Map(defaultItems.map((item) => [item.id, item]));\n\n  // 使用 Map 存储合并结果，这样重复 ID 的后项会自然覆盖前项\n  const mergedItemsMap = new Map<string, T>();\n\n  // Process user items with default metadata\n  for (const userItem of userItems) {\n    const defaultItem = defaultItemsMap.get(userItem.id);\n    if (!defaultItem) {\n      mergedItemsMap.set(userItem.id, userItem);\n      continue;\n    }\n\n    const mergedItem: T = { ...defaultItem };\n    for (const [key, value] of Object.entries(userItem)) {\n      if (value !== null && value !== undefined && !(typeof value === 'object' && isEmpty(value))) {\n        // @ts-expect-error\n        mergedItem[key] = value;\n      }\n\n      if (typeof value === 'object' && !isEmpty(value)) {\n        // @ts-expect-error\n        mergedItem[key] = merge(defaultItem[key], value);\n      }\n    }\n\n    mergedItemsMap.set(userItem.id, mergedItem);\n  }\n\n  // 添加只在默认配置中存在的项\n  for (const item of defaultItems) {\n    if (!mergedItemsMap.has(item.id)) {\n      mergedItemsMap.set(item.id, item);\n    }\n  }\n\n  return [...mergedItemsMap.values()];\n};\n"],"mappings":";;;AAEA,MAAa,mBAAmB,QAAkB;AAChD,KAAI,CAAC,SAAS,IAAI,CAAE,QAAO;AAE3B,KAAI,MAAM,QAAQ,IAAI,CACpB,QAAO,IAAI,KAAK,SAAS,gBAAgB,KAAK,CAAC,CAAC,QAAQ,SAAS,SAAS,OAAU;AAGtF,QAAO,OACL,OAAO,QAAQ,IAAI,CAAC,QAAQ,KAAU,CAAC,KAAK,WAAW;AACrD,MAAI,OAAO,gBAAgB,MAAM;AACjC,SAAO;IACN,EAAE,CAAC,GACL,UAAU,UAAU,OACtB;;;;;;;AAQH,MAAaA,WAAoC,QAAW,WAC1D,UAAU,EAAE,EAAE,QAAQ,SAAS,KAAK,QAAQ;AAC1C,KAAI,MAAM,QAAQ,IAAI,CAAE,QAAO;EAC/B"}

package/es/Form/index.d.mts

@@ -0,0 +1,22 @@
+import { FormDividerProps, FormFlatGroupProps, FormFooterProps, FormGroupItemType, FormGroupProps, FormInstance, FormItemProps, FormProps, FormSubmitFooterProps, FormTitleProps, FormVariant, ItemsType } from "./type.mjs";
+import { FormGroup } from "./components/FormGroup.mjs";
+import { FormItem } from "./components/FormItem.mjs";
+import { FormSubmitFooter } from "./components/FormSubmitFooter.mjs";
+import { FormTitle } from "./components/FormTitle.mjs";
+import { ReactNode, RefAttributes } from "react";
+import { Form as Form$1, FormInstance as FormInstance$1 } from "antd";
+
+//#region src/Form/index.d.ts
+interface IForm {
+  (props: FormProps & RefAttributes<FormInstance$1>): ReactNode;
+  Group: typeof FormGroup;
+  Item: typeof FormItem;
+  Provider: typeof Form$1.Provider;
+  SubmitFooter: typeof FormSubmitFooter;
+  Title: typeof FormTitle;
+  useForm: typeof Form$1.useForm;
+}
+declare const Form: IForm;
+//#endregion
+export { FormDividerProps, FormFlatGroupProps, FormFooterProps, FormGroup, FormGroupItemType, FormGroupProps, FormInstance, FormItem, FormItemProps, FormProps, FormSubmitFooter, FormSubmitFooterProps, FormTitle, FormTitleProps, FormVariant, ItemsType, Form as default };
+//# sourceMappingURL=index.d.mts.map

package/es/Form/index.d.ts

@@ -1,23 +1 @@
-import { Form as AntForm, type FormInstance } from 'antd';
-import { type ReactNode, RefAttributes } from 'react';
-import FormGroup from './components/FormGroup';
-import FormItem from './components/FormItem';
-import FormSubmitFooter from './components/FormSubmitFooter';
-import FormTitle from './components/FormTitle';
-import type { FormProps } from './type';
-interface IForm {
-    (props: FormProps & RefAttributes<FormInstance>): ReactNode;
-    Group: typeof FormGroup;
-    Item: typeof FormItem;
-    Provider: typeof AntForm.Provider;
-    SubmitFooter: typeof FormSubmitFooter;
-    Title: typeof FormTitle;
-    useForm: typeof AntForm.useForm;
-}
-declare const Form: IForm;
-export default Form;
-export { default as FormGroup } from './components/FormGroup';
-export { default as FormItem } from './components/FormItem';
-export { default as FormSubmitFooter } from './components/FormSubmitFooter';
-export { default as FormTitle } from './components/FormTitle';
-export type * from './type';
+export * from './index.d.mts';

package/es/Form/index.js

@@ -1,20 +1 @@
-'use client';
-
-import { Form as AntForm } from 'antd';
-import FormParent from "./Form";
-import FormGroup from "./components/FormGroup";
-import FormItem from "./components/FormItem";
-import FormSubmitFooter from "./components/FormSubmitFooter";
-import FormTitle from "./components/FormTitle";
-var Form = FormParent;
-Form.Item = FormItem;
-Form.Group = FormGroup;
-Form.Title = FormTitle;
-Form.useForm = AntForm.useForm;
-Form.Provider = AntForm.Provider;
-Form.SubmitFooter = FormSubmitFooter;
-export default Form;
-export { default as FormGroup } from "./components/FormGroup";
-export { default as FormItem } from "./components/FormItem";
-export { default as FormSubmitFooter } from "./components/FormSubmitFooter";
-export { default as FormTitle } from "./components/FormTitle";
+export * from './index.mjs';

package/es/Form/index.mjs

@@ -0,0 +1,22 @@
+'use client';
+
+import FormGroup_default from "./components/FormGroup.mjs";
+import FormTitle_default from "./components/FormTitle.mjs";
+import FormItem_default from "./components/FormItem.mjs";
+import Form_default$1 from "./Form.mjs";
+import FormSubmitFooter_default from "./components/FormSubmitFooter.mjs";
+import { Form } from "antd";
+
+//#region src/Form/index.ts
+const Form$1 = Form_default$1;
+Form$1.Item = FormItem_default;
+Form$1.Group = FormGroup_default;
+Form$1.Title = FormTitle_default;
+Form$1.useForm = Form.useForm;
+Form$1.Provider = Form.Provider;
+Form$1.SubmitFooter = FormSubmitFooter_default;
+var Form_default = Form$1;
+
+//#endregion
+export { FormGroup_default as FormGroup, FormItem_default as FormItem, FormSubmitFooter_default as FormSubmitFooter, FormTitle_default as FormTitle, Form_default as default };
+//# sourceMappingURL=index.mjs.map

package/es/Form/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["Form","FormParent","FormItem","FormGroup","FormTitle","AntForm","FormSubmitFooter"],"sources":["../../src/Form/index.ts"],"sourcesContent":["'use client';\n\nimport { Form as AntForm, type FormInstance } from 'antd';\nimport { type ReactNode, RefAttributes } from 'react';\n\nimport FormParent from './Form';\nimport FormGroup from './components/FormGroup';\nimport FormItem from './components/FormItem';\nimport FormSubmitFooter from './components/FormSubmitFooter';\nimport FormTitle from './components/FormTitle';\nimport type { FormProps } from './type';\n\ninterface IForm {\n  (props: FormProps & RefAttributes<FormInstance>): ReactNode;\n  Group: typeof FormGroup;\n  Item: typeof FormItem;\n  Provider: typeof AntForm.Provider;\n  SubmitFooter: typeof FormSubmitFooter;\n  Title: typeof FormTitle;\n  useForm: typeof AntForm.useForm;\n}\n\nconst Form = FormParent as unknown as IForm;\n\nForm.Item = FormItem;\nForm.Group = FormGroup;\nForm.Title = FormTitle;\nForm.useForm = AntForm.useForm;\nForm.Provider = AntForm.Provider;\nForm.SubmitFooter = FormSubmitFooter;\n\nexport default Form;\nexport { default as FormGroup } from './components/FormGroup';\nexport { default as FormItem } from './components/FormItem';\nexport { default as FormSubmitFooter } from './components/FormSubmitFooter';\nexport { default as FormTitle } from './components/FormTitle';\nexport type * from './type';\n"],"mappings":";;;;;;;;;;AAsBA,MAAMA,SAAOC;AAEb,OAAK,OAAOC;AACZ,OAAK,QAAQC;AACb,OAAK,QAAQC;AACb,OAAK,UAAUC,KAAQ;AACvB,OAAK,WAAWA,KAAQ;AACxB,OAAK,eAAeC;AAEpB,mBAAeN"}

package/es/Form/style.mjs

@@ -0,0 +1,217 @@
+import { createStyles } from "antd-style";
+import { isNumber } from "lodash-es";
+
+//#region src/Form/style.ts
+const useStyles = createStyles(({ css: css$1, token, prefixCls, responsive }) => ({
+	borderless: css$1`
+    gap: 48px;
+    .${prefixCls}-collapse .${prefixCls}-collapse-header {
+      padding-block-end: 16px;
+      border-block-end: 1px solid ${token.colorBorderSecondary};
+    }
+  `,
+	root: css$1`
+    position: relative;
+
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+
+    width: 100%;
+
+    .${prefixCls}-form-item {
+      margin: 0 !important;
+    }
+
+    .${prefixCls}-form-item .${prefixCls}-form-item-label > label {
+      height: unset;
+    }
+
+    .${prefixCls}-row {
+      position: relative;
+      flex-wrap: nowrap;
+    }
+
+    .${prefixCls}-form-item-label {
+      position: relative;
+      flex: 1;
+      max-width: 100%;
+    }
+
+    .${prefixCls}-form-item-row {
+      align-items: center;
+    }
+
+    .${prefixCls}-form-item-control {
+      position: relative;
+      flex: 0;
+      min-width: unset !important;
+    }
+
+    .${prefixCls}-collapse-item {
+      border-radius: ${token.borderRadius}px !important;
+    }
+
+    ${responsive.mobile} {
+      gap: 0 !important;
+    }
+  `
+}));
+const useFlatGroupStyles = createStyles(({ cx: cx$1, css: css$1, token, stylish }) => {
+	return {
+		borderless: cx$1(stylish.variantBorderlessWithoutHover, css$1`
+        padding-inline: 0;
+      `),
+		filled: stylish.variantFilledWithoutHover,
+		mobile: css$1`
+      padding-block: 0;
+      padding-inline: 16px;
+      background: ${token.colorBgContainer};
+      border-radius: 0;
+    `,
+		outlined: stylish.variantOutlinedWithoutHover,
+		root: css$1`
+      padding-inline: 16px;
+      border-radius: ${token.borderRadiusLG}px;
+    `
+	};
+});
+const useFooterStyles = createStyles(({ css: css$1, token, responsive }) => {
+	return { root: css$1`
+      ${responsive.mobile} {
+        padding: 16px;
+        background: ${token.colorBgContainer};
+        border-block-start: 1px solid ${token.colorBorderSecondary};
+      }
+    ` };
+});
+const useGroupStyles = createStyles(({ css: css$1, token, responsive }) => {
+	return {
+		mobileGroupBody: css$1`
+      padding-block: 0;
+      padding-inline: 16px;
+      background: ${token.colorBgContainer};
+    `,
+		mobileGroupHeader: css$1`
+      padding: 16px;
+      background: ${token.colorBgLayout};
+    `,
+		title: css$1`
+      align-items: center;
+      font-size: 16px;
+      font-weight: bold;
+    `,
+		titleBorderless: css$1`
+      font-size: 18px;
+      font-weight: bold;
+    `,
+		titleMobile: css$1`
+      ${responsive.mobile} {
+        font-size: 14px;
+        font-weight: 400;
+        opacity: 0.5;
+      }
+    `
+	};
+});
+const useItemStyles = createStyles(({ css: css$1, responsive, prefixCls }, { minWidth }) => ({
+	itemMinWidth: css$1`
+      .${prefixCls}-form-item-control {
+        width: ${isNumber(minWidth) ? `${minWidth}px` : minWidth};
+      }
+    `,
+	itemNoDivider: css$1`
+      &:not(:first-child) {
+        padding-block-start: 0;
+      }
+    `,
+	root: css$1`
+      &.${prefixCls}-form-item {
+        padding-block: 16px;
+        padding-inline: 0;
+
+        .${prefixCls}-form-item-label {
+          text-align: start;
+        }
+
+        .${prefixCls}-row {
+          gap: 12px;
+          justify-content: space-between;
+
+          > div {
+            flex: unset;
+            flex-grow: unset;
+          }
+        }
+
+        .${prefixCls}-form-item-required::before {
+          align-self: flex-start;
+        }
+
+        ${responsive.mobile} {
+          &.${prefixCls}-form-item-horizontal {
+            .${prefixCls}-form-item-label {
+              flex: 1 !important;
+            }
+            .${prefixCls}-form-item-control {
+              flex: none !important;
+            }
+          }
+        }
+      }
+    `,
+	verticalLayout: css$1`
+      &.${prefixCls}-form-item {
+        .${prefixCls}-row {
+          align-items: stretch;
+        }
+      }
+    `
+}));
+const useSubmitFooterStyles = createStyles(({ responsive, css: css$1, token }) => ({
+	floatFooter: css$1`
+    position: fixed;
+    z-index: 1000;
+    inset-block-end: 24px;
+    inset-inline-start: 50%;
+    transform: translateX(-50%);
+
+    width: max-content;
+    padding: 8px;
+
+    background: ${token.colorBgContainer};
+    border: 1px solid ${token.colorBorderSecondary};
+    border-radius: 48px;
+    box-shadow: ${token.boxShadowSecondary};
+  `,
+	footer: css$1`
+    ${responsive.mobile} {
+      margin-block-start: -${token.borderRadius}px;
+      padding: 16px;
+      background: ${token.colorBgContainer};
+      border-block-start: 1px solid ${token.colorBorderSecondary};
+    }
+  `
+}));
+const useTitleStyles = createStyles(({ css: css$1, token }) => ({
+	content: css$1`
+    position: relative;
+    text-align: start;
+  `,
+	desc: css$1`
+    display: block;
+
+    line-height: 1.44;
+    color: ${token.colorTextDescription};
+    word-wrap: break-word;
+    white-space: pre-wrap;
+  `,
+	title: css$1`
+    font-weight: 500;
+    line-height: 1;
+  `
+}));
+
+//#endregion
+export { useFlatGroupStyles, useGroupStyles, useItemStyles, useStyles, useSubmitFooterStyles, useTitleStyles };
+//# sourceMappingURL=style.mjs.map

package/es/Form/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":["cx"],"sources":["../../src/Form/style.ts"],"sourcesContent":["import { createStyles } from 'antd-style';\nimport { isNumber } from 'lodash-es';\n\nexport const useStyles = createStyles(({ css, token, prefixCls, responsive }) => ({\n  borderless: css`\n    gap: 48px;\n    .${prefixCls}-collapse .${prefixCls}-collapse-header {\n      padding-block-end: 16px;\n      border-block-end: 1px solid ${token.colorBorderSecondary};\n    }\n  `,\n  root: css`\n    position: relative;\n\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n\n    width: 100%;\n\n    .${prefixCls}-form-item {\n      margin: 0 !important;\n    }\n\n    .${prefixCls}-form-item .${prefixCls}-form-item-label > label {\n      height: unset;\n    }\n\n    .${prefixCls}-row {\n      position: relative;\n      flex-wrap: nowrap;\n    }\n\n    .${prefixCls}-form-item-label {\n      position: relative;\n      flex: 1;\n      max-width: 100%;\n    }\n\n    .${prefixCls}-form-item-row {\n      align-items: center;\n    }\n\n    .${prefixCls}-form-item-control {\n      position: relative;\n      flex: 0;\n      min-width: unset !important;\n    }\n\n    .${prefixCls}-collapse-item {\n      border-radius: ${token.borderRadius}px !important;\n    }\n\n    ${responsive.mobile} {\n      gap: 0 !important;\n    }\n  `,\n}));\n\nexport const useFlatGroupStyles = createStyles(({ cx, css, token, stylish }) => {\n  return {\n    borderless: cx(\n      stylish.variantBorderlessWithoutHover,\n      css`\n        padding-inline: 0;\n      `,\n    ),\n    filled: stylish.variantFilledWithoutHover,\n    mobile: css`\n      padding-block: 0;\n      padding-inline: 16px;\n      background: ${token.colorBgContainer};\n      border-radius: 0;\n    `,\n    outlined: stylish.variantOutlinedWithoutHover,\n    root: css`\n      padding-inline: 16px;\n      border-radius: ${token.borderRadiusLG}px;\n    `,\n  };\n});\n\nexport const useFooterStyles = createStyles(({ css, token, responsive }) => {\n  return {\n    root: css`\n      ${responsive.mobile} {\n        padding: 16px;\n        background: ${token.colorBgContainer};\n        border-block-start: 1px solid ${token.colorBorderSecondary};\n      }\n    `,\n  };\n});\n\nexport const useGroupStyles = createStyles(({ css, token, responsive }) => {\n  return {\n    mobileGroupBody: css`\n      padding-block: 0;\n      padding-inline: 16px;\n      background: ${token.colorBgContainer};\n    `,\n    mobileGroupHeader: css`\n      padding: 16px;\n      background: ${token.colorBgLayout};\n    `,\n    title: css`\n      align-items: center;\n      font-size: 16px;\n      font-weight: bold;\n    `,\n    titleBorderless: css`\n      font-size: 18px;\n      font-weight: bold;\n    `,\n    titleMobile: css`\n      ${responsive.mobile} {\n        font-size: 14px;\n        font-weight: 400;\n        opacity: 0.5;\n      }\n    `,\n  };\n});\n\nexport const useItemStyles = createStyles(\n  ({ css, responsive, prefixCls }, { minWidth }: { minWidth?: string | number }) => ({\n    itemMinWidth: css`\n      .${prefixCls}-form-item-control {\n        width: ${isNumber(minWidth) ? `${minWidth}px` : minWidth};\n      }\n    `,\n    itemNoDivider: css`\n      &:not(:first-child) {\n        padding-block-start: 0;\n      }\n    `,\n    root: css`\n      &.${prefixCls}-form-item {\n        padding-block: 16px;\n        padding-inline: 0;\n\n        .${prefixCls}-form-item-label {\n          text-align: start;\n        }\n\n        .${prefixCls}-row {\n          gap: 12px;\n          justify-content: space-between;\n\n          > div {\n            flex: unset;\n            flex-grow: unset;\n          }\n        }\n\n        .${prefixCls}-form-item-required::before {\n          align-self: flex-start;\n        }\n\n        ${responsive.mobile} {\n          &.${prefixCls}-form-item-horizontal {\n            .${prefixCls}-form-item-label {\n              flex: 1 !important;\n            }\n            .${prefixCls}-form-item-control {\n              flex: none !important;\n            }\n          }\n        }\n      }\n    `,\n    verticalLayout: css`\n      &.${prefixCls}-form-item {\n        .${prefixCls}-row {\n          align-items: stretch;\n        }\n      }\n    `,\n  }),\n);\n\nexport const useSubmitFooterStyles = createStyles(({ responsive, css, token }) => ({\n  floatFooter: css`\n    position: fixed;\n    z-index: 1000;\n    inset-block-end: 24px;\n    inset-inline-start: 50%;\n    transform: translateX(-50%);\n\n    width: max-content;\n    padding: 8px;\n\n    background: ${token.colorBgContainer};\n    border: 1px solid ${token.colorBorderSecondary};\n    border-radius: 48px;\n    box-shadow: ${token.boxShadowSecondary};\n  `,\n  footer: css`\n    ${responsive.mobile} {\n      margin-block-start: -${token.borderRadius}px;\n      padding: 16px;\n      background: ${token.colorBgContainer};\n      border-block-start: 1px solid ${token.colorBorderSecondary};\n    }\n  `,\n}));\n\nexport const useTitleStyles = createStyles(({ css, token }) => ({\n  content: css`\n    position: relative;\n    text-align: start;\n  `,\n\n  desc: css`\n    display: block;\n\n    line-height: 1.44;\n    color: ${token.colorTextDescription};\n    word-wrap: break-word;\n    white-space: pre-wrap;\n  `,\n  title: css`\n    font-weight: 500;\n    line-height: 1;\n  `,\n}));\n"],"mappings":";;;;AAGA,MAAa,YAAY,cAAc,EAAE,YAAK,OAAO,WAAW,kBAAkB;CAChF,YAAY,KAAG;;OAEV,UAAU,aAAa,UAAU;;oCAEJ,MAAM,qBAAqB;;;CAG7D,MAAM,KAAG;;;;;;;;;OASJ,UAAU;;;;OAIV,UAAU,cAAc,UAAU;;;;OAIlC,UAAU;;;;;OAKV,UAAU;;;;;;OAMV,UAAU;;;;OAIV,UAAU;;;;;;OAMV,UAAU;uBACM,MAAM,aAAa;;;MAGpC,WAAW,OAAO;;;;CAIvB,EAAE;AAEH,MAAa,qBAAqB,cAAc,EAAE,UAAI,YAAK,OAAO,cAAc;AAC9E,QAAO;EACL,YAAYA,KACV,QAAQ,+BACR,KAAG;;QAGJ;EACD,QAAQ,QAAQ;EAChB,QAAQ,KAAG;;;oBAGK,MAAM,iBAAiB;;;EAGvC,UAAU,QAAQ;EAClB,MAAM,KAAG;;uBAEU,MAAM,eAAe;;EAEzC;EACD;AAEF,MAAa,kBAAkB,cAAc,EAAE,YAAK,OAAO,iBAAiB;AAC1E,QAAO,EACL,MAAM,KAAG;QACL,WAAW,OAAO;;sBAEJ,MAAM,iBAAiB;wCACL,MAAM,qBAAqB;;OAGhE;EACD;AAEF,MAAa,iBAAiB,cAAc,EAAE,YAAK,OAAO,iBAAiB;AACzE,QAAO;EACL,iBAAiB,KAAG;;;oBAGJ,MAAM,iBAAiB;;EAEvC,mBAAmB,KAAG;;oBAEN,MAAM,cAAc;;EAEpC,OAAO,KAAG;;;;;EAKV,iBAAiB,KAAG;;;;EAIpB,aAAa,KAAG;QACZ,WAAW,OAAO;;;;;;EAMvB;EACD;AAEF,MAAa,gBAAgB,cAC1B,EAAE,YAAK,YAAY,aAAa,EAAE,gBAAgD;CACjF,cAAc,KAAG;SACZ,UAAU;iBACF,SAAS,SAAS,GAAG,GAAG,SAAS,MAAM,SAAS;;;CAG7D,eAAe,KAAG;;;;;CAKlB,MAAM,KAAG;UACH,UAAU;;;;WAIT,UAAU;;;;WAIV,UAAU;;;;;;;;;;WAUV,UAAU;;;;UAIX,WAAW,OAAO;cACd,UAAU;eACT,UAAU;;;eAGV,UAAU;;;;;;;CAOrB,gBAAgB,KAAG;UACb,UAAU;WACT,UAAU;;;;;CAKlB,EACF;AAED,MAAa,wBAAwB,cAAc,EAAE,YAAY,YAAK,aAAa;CACjF,aAAa,KAAG;;;;;;;;;;kBAUA,MAAM,iBAAiB;wBACjB,MAAM,qBAAqB;;kBAEjC,MAAM,mBAAmB;;CAEzC,QAAQ,KAAG;MACP,WAAW,OAAO;6BACK,MAAM,aAAa;;oBAE5B,MAAM,iBAAiB;sCACL,MAAM,qBAAqB;;;CAGhE,EAAE;AAEH,MAAa,iBAAiB,cAAc,EAAE,YAAK,aAAa;CAC9D,SAAS,KAAG;;;;CAKZ,MAAM,KAAG;;;;aAIE,MAAM,qBAAqB;;;;CAItC,OAAO,KAAG;;;;CAIX,EAAE"}