@pixpilot/formily-shadcn 1.16.0 → 1.17.0

package/dist/components/form-item/ConnectedFormItem.cjs

@@ -1,47 +1,15 @@
 const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
 const require_BaseFormItem = require('./BaseFormItem.cjs');
+const require_map_form_item_props = require('./map-form-item-props.cjs');
 let __formily_react = require("@formily/react");
 __formily_react = require_rolldown_runtime.__toESM(__formily_react);
-let __formily_core = require("@formily/core");
-__formily_core = require_rolldown_runtime.__toESM(__formily_core);
 
 //#region src/components/form-item/ConnectedFormItem.tsx
 /**
 * FormItem component connected to Formily field state.
 * Automatically maps field validation state to component props.
 */
-const FormItem = (0, __formily_react.connect)(require_BaseFormItem.BaseFormItem, (0, __formily_react.mapProps)((props, field) => {
-	const schema = (0, __formily_react.useFieldSchema)();
-	if ((0, __formily_core.isVoidField)(field)) return {
-		label: field.title ?? props.label,
-		description: props.description ?? field.description,
-		requiredMark: props.requiredMark !== void 0 ? props.requiredMark : props.asterisk
-	};
-	const takeFeedbackStatus = () => {
-		if (field.validating) return void 0;
-		if (field.selfErrors?.length) return "error";
-		if (field.selfWarnings?.length) return "warning";
-		if (field.selfSuccesses?.length) return "success";
-	};
-	const takeFeedbackText = () => {
-		if (field.validating) return void 0;
-		if (props.feedbackText != null) return props.feedbackText;
-		if (field.selfErrors?.length) return field.selfErrors.join(", ");
-		if (field.selfWarnings?.length) return field.selfWarnings.join(", ");
-		if (field.selfSuccesses?.length) return field.selfSuccesses.join(", ");
-	};
-	let resolvedRequiredMark = props.requiredMark;
-	if (resolvedRequiredMark === void 0) if (props.asterisk !== void 0) resolvedRequiredMark = Boolean(props.asterisk);
-	else if (schema.parent && Array.isArray(schema.parent.required) && schema.parent.required.includes(schema.name)) resolvedRequiredMark = true;
-	else resolvedRequiredMark = field.required && field.pattern !== "readPretty";
-	return {
-		label: props.label ?? field.title,
-		description: props.description ?? field.description,
-		feedbackStatus: takeFeedbackStatus(),
-		feedbackText: takeFeedbackText(),
-		requiredMark: resolvedRequiredMark
-	};
-}));
+const FormItem = (0, __formily_react.connect)(require_BaseFormItem.BaseFormItem, (0, __formily_react.mapProps)(require_map_form_item_props.mapFormItemProps));
 
 //#endregion
 exports.FormItem = FormItem;

package/dist/components/form-item/ConnectedFormItem.d.cts

@@ -1,13 +1,13 @@
 import { FormItemProps } from "./form-item-types.cjs";
-import * as react1246 from "react";
+import * as react1450 from "react";
 
 //#region src/components/form-item/ConnectedFormItem.d.ts
 /**
  * FormItem component connected to Formily field state.
  * Automatically maps field validation state to component props.
  */
-declare const FormItem: react1246.ForwardRefExoticComponent<Omit<Partial<FormItemProps & {
-  children?: react1246.ReactNode | undefined;
-}>, "ref"> & react1246.RefAttributes<unknown>>;
+declare const FormItem: react1450.ForwardRefExoticComponent<Omit<Partial<FormItemProps & {
+  children?: react1450.ReactNode | undefined;
+}>, "ref"> & react1450.RefAttributes<unknown>>;
 //#endregion
 export { FormItem };

package/dist/components/form-item/ConnectedFormItem.d.ts

@@ -1,13 +1,13 @@
 import { FormItemProps } from "./form-item-types.js";
-import * as react1246 from "react";
+import * as react1450 from "react";
 
 //#region src/components/form-item/ConnectedFormItem.d.ts
 /**
  * FormItem component connected to Formily field state.
  * Automatically maps field validation state to component props.
  */
-declare const FormItem: react1246.ForwardRefExoticComponent<Omit<Partial<FormItemProps & {
-  children?: react1246.ReactNode | undefined;
-}>, "ref"> & react1246.RefAttributes<unknown>>;
+declare const FormItem: react1450.ForwardRefExoticComponent<Omit<Partial<FormItemProps & {
+  children?: react1450.ReactNode | undefined;
+}>, "ref"> & react1450.RefAttributes<unknown>>;
 //#endregion
 export { FormItem };

package/dist/components/form-item/ConnectedFormItem.js

@@ -1,44 +1,13 @@
 import { BaseFormItem } from "./BaseFormItem.js";
-import { connect, mapProps, useFieldSchema } from "@formily/react";
-import { isVoidField } from "@formily/core";
+import { mapFormItemProps } from "./map-form-item-props.js";
+import { connect, mapProps } from "@formily/react";
 
 //#region src/components/form-item/ConnectedFormItem.tsx
 /**
 * FormItem component connected to Formily field state.
 * Automatically maps field validation state to component props.
 */
-const FormItem = connect(BaseFormItem, mapProps((props, field) => {
-	const schema = useFieldSchema();
-	if (isVoidField(field)) return {
-		label: field.title ?? props.label,
-		description: props.description ?? field.description,
-		requiredMark: props.requiredMark !== void 0 ? props.requiredMark : props.asterisk
-	};
-	const takeFeedbackStatus = () => {
-		if (field.validating) return void 0;
-		if (field.selfErrors?.length) return "error";
-		if (field.selfWarnings?.length) return "warning";
-		if (field.selfSuccesses?.length) return "success";
-	};
-	const takeFeedbackText = () => {
-		if (field.validating) return void 0;
-		if (props.feedbackText != null) return props.feedbackText;
-		if (field.selfErrors?.length) return field.selfErrors.join(", ");
-		if (field.selfWarnings?.length) return field.selfWarnings.join(", ");
-		if (field.selfSuccesses?.length) return field.selfSuccesses.join(", ");
-	};
-	let resolvedRequiredMark = props.requiredMark;
-	if (resolvedRequiredMark === void 0) if (props.asterisk !== void 0) resolvedRequiredMark = Boolean(props.asterisk);
-	else if (schema.parent && Array.isArray(schema.parent.required) && schema.parent.required.includes(schema.name)) resolvedRequiredMark = true;
-	else resolvedRequiredMark = field.required && field.pattern !== "readPretty";
-	return {
-		label: props.label ?? field.title,
-		description: props.description ?? field.description,
-		feedbackStatus: takeFeedbackStatus(),
-		feedbackText: takeFeedbackText(),
-		requiredMark: resolvedRequiredMark
-	};
-}));
+const FormItem = connect(BaseFormItem, mapProps(mapFormItemProps));
 
 //#endregion
 export { FormItem };

package/dist/components/form-item/map-form-item-props.cjs

@@ -0,0 +1,50 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+let __formily_react = require("@formily/react");
+__formily_react = require_rolldown_runtime.__toESM(__formily_react);
+let __formily_core = require("@formily/core");
+__formily_core = require_rolldown_runtime.__toESM(__formily_core);
+
+//#region src/components/form-item/map-form-item-props.ts
+/**
+* Maps Formily field state onto FormItem props (label, description, validation
+* feedback, required mark).
+*
+* Shared by every decorator that presents a field the way FormItem does —
+* FormItem itself plus the overlay decorators — so they stay in step.
+* Runs inside `mapProps`, which is why calling hooks here is allowed.
+*/
+function mapFormItemProps(props, field) {
+	const schema = (0, __formily_react.useFieldSchema)();
+	if ((0, __formily_core.isVoidField)(field)) return {
+		label: field.title ?? props.label,
+		description: props.description ?? field.description,
+		requiredMark: props.requiredMark !== void 0 ? props.requiredMark : props.asterisk
+	};
+	const takeFeedbackStatus = () => {
+		if (field.validating) return void 0;
+		if (field.selfErrors?.length) return "error";
+		if (field.selfWarnings?.length) return "warning";
+		if (field.selfSuccesses?.length) return "success";
+	};
+	const takeFeedbackText = () => {
+		if (field.validating) return void 0;
+		if (props.feedbackText != null) return props.feedbackText;
+		if (field.selfErrors?.length) return field.selfErrors.join(", ");
+		if (field.selfWarnings?.length) return field.selfWarnings.join(", ");
+		if (field.selfSuccesses?.length) return field.selfSuccesses.join(", ");
+	};
+	let resolvedRequiredMark = props.requiredMark;
+	if (resolvedRequiredMark === void 0) if (props.asterisk !== void 0) resolvedRequiredMark = Boolean(props.asterisk);
+	else if (schema.parent && Array.isArray(schema.parent.required) && schema.parent.required.includes(schema.name)) resolvedRequiredMark = true;
+	else resolvedRequiredMark = field.required && field.pattern !== "readPretty";
+	return {
+		label: props.label ?? field.title,
+		description: props.description ?? field.description,
+		feedbackStatus: takeFeedbackStatus(),
+		feedbackText: takeFeedbackText(),
+		requiredMark: resolvedRequiredMark
+	};
+}
+
+//#endregion
+exports.mapFormItemProps = mapFormItemProps;

package/dist/components/form-item/map-form-item-props.js

@@ -0,0 +1,47 @@
+import { useFieldSchema } from "@formily/react";
+import { isVoidField } from "@formily/core";
+
+//#region src/components/form-item/map-form-item-props.ts
+/**
+* Maps Formily field state onto FormItem props (label, description, validation
+* feedback, required mark).
+*
+* Shared by every decorator that presents a field the way FormItem does —
+* FormItem itself plus the overlay decorators — so they stay in step.
+* Runs inside `mapProps`, which is why calling hooks here is allowed.
+*/
+function mapFormItemProps(props, field) {
+	const schema = useFieldSchema();
+	if (isVoidField(field)) return {
+		label: field.title ?? props.label,
+		description: props.description ?? field.description,
+		requiredMark: props.requiredMark !== void 0 ? props.requiredMark : props.asterisk
+	};
+	const takeFeedbackStatus = () => {
+		if (field.validating) return void 0;
+		if (field.selfErrors?.length) return "error";
+		if (field.selfWarnings?.length) return "warning";
+		if (field.selfSuccesses?.length) return "success";
+	};
+	const takeFeedbackText = () => {
+		if (field.validating) return void 0;
+		if (props.feedbackText != null) return props.feedbackText;
+		if (field.selfErrors?.length) return field.selfErrors.join(", ");
+		if (field.selfWarnings?.length) return field.selfWarnings.join(", ");
+		if (field.selfSuccesses?.length) return field.selfSuccesses.join(", ");
+	};
+	let resolvedRequiredMark = props.requiredMark;
+	if (resolvedRequiredMark === void 0) if (props.asterisk !== void 0) resolvedRequiredMark = Boolean(props.asterisk);
+	else if (schema.parent && Array.isArray(schema.parent.required) && schema.parent.required.includes(schema.name)) resolvedRequiredMark = true;
+	else resolvedRequiredMark = field.required && field.pattern !== "readPretty";
+	return {
+		label: props.label ?? field.title,
+		description: props.description ?? field.description,
+		feedbackStatus: takeFeedbackStatus(),
+		feedbackText: takeFeedbackText(),
+		requiredMark: resolvedRequiredMark
+	};
+}
+
+//#endregion
+export { mapFormItemProps };

package/dist/components/overlay-common/OverlayFields.cjs

@@ -0,0 +1,26 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
+
+//#region src/components/overlay-common/OverlayFields.tsx
+/**
+* Keeps an object's fields mounted while its overlay (dialog/popover) is closed.
+*
+* Formily destroys a field instance when its component unmounts, and the fields
+* inside a closed overlay are unmounted. Without this, `form.submit()` would
+* skip them entirely — a required field the user never opened would pass
+* validation. Rendering them in a hidden container keeps the field instances
+* alive so form-level validation still covers them.
+*
+* `hidden` (rather than unmounting) is the same approach ListItem uses to keep
+* array item fields attached while a row is collapsed.
+*/
+const OverlayFields = ({ children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+	hidden: true,
+	"aria-hidden": "true",
+	children
+});
+OverlayFields.displayName = "OverlayFields";
+
+//#endregion
+exports.OverlayFields = OverlayFields;

package/dist/components/overlay-common/OverlayFields.d.cts

@@ -0,0 +1 @@
+import React from "react";

package/dist/components/overlay-common/OverlayFields.d.ts

@@ -0,0 +1 @@
+import React from "react";

package/dist/components/overlay-common/OverlayFields.js

@@ -0,0 +1,24 @@
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/overlay-common/OverlayFields.tsx
+/**
+* Keeps an object's fields mounted while its overlay (dialog/popover) is closed.
+*
+* Formily destroys a field instance when its component unmounts, and the fields
+* inside a closed overlay are unmounted. Without this, `form.submit()` would
+* skip them entirely — a required field the user never opened would pass
+* validation. Rendering them in a hidden container keeps the field instances
+* alive so form-level validation still covers them.
+*
+* `hidden` (rather than unmounting) is the same approach ListItem uses to keep
+* array item fields attached while a row is collapsed.
+*/
+const OverlayFields = ({ children }) => /* @__PURE__ */ jsx("div", {
+	hidden: true,
+	"aria-hidden": "true",
+	children
+});
+OverlayFields.displayName = "OverlayFields";
+
+//#endregion
+export { OverlayFields };

package/dist/components/overlay-common/OverlayTrigger.cjs

@@ -0,0 +1,27 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+let lucide_react = require("lucide-react");
+lucide_react = require_rolldown_runtime.__toESM(lucide_react);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
+let __pixpilot_shadcn = require("@pixpilot/shadcn");
+__pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
+
+//#region src/components/overlay-common/OverlayTrigger.tsx
+/**
+* Button that opens an object overlay (dialog or popover).
+*/
+const OverlayTrigger = ({ label, icon, invalid, className,...rest }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.Button, {
+	type: "button",
+	variant: "outline",
+	"aria-invalid": invalid === true ? true : void 0,
+	...rest,
+	className: (0, __pixpilot_shadcn.cn)("form-object-trigger w-full justify-between gap-4 font-normal", invalid === true && "border-destructive text-destructive", className),
+	children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: "min-w-0 truncate text-left",
+		children: label
+	}), icon ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronRightIcon, { className: "size-4 shrink-0 opacity-50" })]
+});
+OverlayTrigger.displayName = "OverlayTrigger";
+
+//#endregion
+exports.OverlayTrigger = OverlayTrigger;

package/dist/components/overlay-common/OverlayTrigger.d.cts

@@ -0,0 +1,15 @@
+import { SyncReactNode } from "../../types/react.cjs";
+import React from "react";
+import { Button } from "@pixpilot/shadcn";
+
+//#region src/components/overlay-common/OverlayTrigger.d.ts
+interface OverlayTriggerProps extends Omit<React.ComponentProps<typeof Button>, 'children'> {
+  /** Text of the trigger button. */
+  label?: SyncReactNode;
+  /** Icon rendered at the trailing edge. Defaults to a chevron. */
+  icon?: React.ReactNode;
+  /** Renders the trigger in an error state. */
+  invalid?: boolean;
+}
+//#endregion
+export { OverlayTriggerProps };

package/dist/components/overlay-common/OverlayTrigger.d.ts

@@ -0,0 +1,15 @@
+import { SyncReactNode } from "../../types/react.js";
+import React from "react";
+import { Button } from "@pixpilot/shadcn";
+
+//#region src/components/overlay-common/OverlayTrigger.d.ts
+interface OverlayTriggerProps extends Omit<React.ComponentProps<typeof Button>, 'children'> {
+  /** Text of the trigger button. */
+  label?: SyncReactNode;
+  /** Icon rendered at the trailing edge. Defaults to a chevron. */
+  icon?: React.ReactNode;
+  /** Renders the trigger in an error state. */
+  invalid?: boolean;
+}
+//#endregion
+export { OverlayTriggerProps };

package/dist/components/overlay-common/OverlayTrigger.js

@@ -0,0 +1,23 @@
+import { ChevronRightIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Button, cn } from "@pixpilot/shadcn";
+
+//#region src/components/overlay-common/OverlayTrigger.tsx
+/**
+* Button that opens an object overlay (dialog or popover).
+*/
+const OverlayTrigger = ({ label, icon, invalid, className,...rest }) => /* @__PURE__ */ jsxs(Button, {
+	type: "button",
+	variant: "outline",
+	"aria-invalid": invalid === true ? true : void 0,
+	...rest,
+	className: cn("form-object-trigger w-full justify-between gap-4 font-normal", invalid === true && "border-destructive text-destructive", className),
+	children: [/* @__PURE__ */ jsx("span", {
+		className: "min-w-0 truncate text-left",
+		children: label
+	}), icon ?? /* @__PURE__ */ jsx(ChevronRightIcon, { className: "size-4 shrink-0 opacity-50" })]
+});
+OverlayTrigger.displayName = "OverlayTrigger";
+
+//#endregion
+export { OverlayTrigger };

package/dist/components/overlay-common/constants.cjs

@@ -0,0 +1,10 @@
+
+//#region src/components/overlay-common/constants.ts
+/**
+* Fallback noun for the DialogItem / PopoverItem trigger when the field has
+* no title — e.g. "Add item" / "Edit item".
+*/
+const DEFAULT_TRIGGER_NOUN = "item";
+
+//#endregion
+exports.DEFAULT_TRIGGER_NOUN = DEFAULT_TRIGGER_NOUN;

package/dist/components/overlay-common/constants.js

@@ -0,0 +1,9 @@
+//#region src/components/overlay-common/constants.ts
+/**
+* Fallback noun for the DialogItem / PopoverItem trigger when the field has
+* no title — e.g. "Add item" / "Edit item".
+*/
+const DEFAULT_TRIGGER_NOUN = "item";
+
+//#endregion
+export { DEFAULT_TRIGGER_NOUN };

package/dist/components/overlay-common/index.cjs

@@ -0,0 +1,5 @@
+const require_constants = require('./constants.cjs');
+const require_is_empty_field_value = require('./is-empty-field-value.cjs');
+const require_OverlayFields = require('./OverlayFields.cjs');
+const require_OverlayTrigger = require('./OverlayTrigger.cjs');
+const require_use_overlay = require('./use-overlay.cjs');

package/dist/components/overlay-common/index.d.cts

@@ -0,0 +1,4 @@
+import { OverlayBaseSlots, OverlayProps } from "./overlay-types.cjs";
+import "./OverlayFields.cjs";
+import { OverlayTriggerProps } from "./OverlayTrigger.cjs";
+import "./use-overlay.cjs";

package/dist/components/overlay-common/index.d.ts

@@ -0,0 +1,4 @@
+import { OverlayBaseSlots, OverlayProps } from "./overlay-types.js";
+import "./OverlayFields.js";
+import { OverlayTriggerProps } from "./OverlayTrigger.js";
+import "./use-overlay.js";

package/dist/components/overlay-common/index.js

@@ -0,0 +1,5 @@
+import { DEFAULT_TRIGGER_NOUN } from "./constants.js";
+import { isEmptyFieldValue } from "./is-empty-field-value.js";
+import { OverlayFields } from "./OverlayFields.js";
+import { OverlayTrigger } from "./OverlayTrigger.js";
+import { useOverlay } from "./use-overlay.js";

package/dist/components/overlay-common/is-empty-field-value.cjs

@@ -0,0 +1,23 @@
+
+//#region src/components/overlay-common/is-empty-field-value.ts
+/**
+* Whether a field value holds nothing the user would consider data.
+*
+* Used to pick the trigger verb: an object with no data reads "Add <title>",
+* one with data reads "Edit <title>".
+*
+* Comparing `value` against `initialValue` does not work here: Formily gives an
+* object field an initial value of `{}` while its `initialValue` stays
+* undefined, so an untouched object would always look changed. Empty strings
+* count as empty because clearing an input leaves `''` behind, but `false` and
+* `0` are real values.
+*/
+function isEmptyFieldValue(value) {
+	if (value == null || value === "") return true;
+	if (Array.isArray(value)) return value.every(isEmptyFieldValue);
+	if (typeof value === "object") return Object.values(value).every(isEmptyFieldValue);
+	return false;
+}
+
+//#endregion
+exports.isEmptyFieldValue = isEmptyFieldValue;

package/dist/components/overlay-common/is-empty-field-value.js

@@ -0,0 +1,22 @@
+//#region src/components/overlay-common/is-empty-field-value.ts
+/**
+* Whether a field value holds nothing the user would consider data.
+*
+* Used to pick the trigger verb: an object with no data reads "Add <title>",
+* one with data reads "Edit <title>".
+*
+* Comparing `value` against `initialValue` does not work here: Formily gives an
+* object field an initial value of `{}` while its `initialValue` stays
+* undefined, so an untouched object would always look changed. Empty strings
+* count as empty because clearing an input leaves `''` behind, but `false` and
+* `0` are real values.
+*/
+function isEmptyFieldValue(value) {
+	if (value == null || value === "") return true;
+	if (Array.isArray(value)) return value.every(isEmptyFieldValue);
+	if (typeof value === "object") return Object.values(value).every(isEmptyFieldValue);
+	return false;
+}
+
+//#endregion
+export { isEmptyFieldValue };

package/dist/components/overlay-common/overlay-types.d.cts

@@ -0,0 +1,27 @@
+import { SyncReactNode } from "../../types/react.cjs";
+import React from "react";
+
+//#region src/components/overlay-common/overlay-types.d.ts
+
+/**
+ * The overlay itself — the `dialog` prop on DialogItem and the `popover` prop
+ * on PopoverItem.
+ *
+ * `TSlots` differs per overlay (only a dialog has a footer), so each component
+ * supplies its own slot map.
+ */
+interface OverlayProps<TSlots> {
+  /** Heading inside the overlay. Defaults to the field label. */
+  title?: SyncReactNode;
+  /** Description inside the overlay. Defaults to the field description. */
+  description?: SyncReactNode;
+  /** Props for the overlay's internal parts. */
+  slots?: TSlots;
+}
+/** Slots every overlay has, whatever kind it is. */
+interface OverlayBaseSlots {
+  header?: React.ComponentProps<'div'>;
+  body?: React.ComponentProps<'div'>;
+}
+//#endregion
+export { OverlayBaseSlots, OverlayProps };

package/dist/components/overlay-common/overlay-types.d.ts

@@ -0,0 +1,27 @@
+import { SyncReactNode } from "../../types/react.js";
+import React from "react";
+
+//#region src/components/overlay-common/overlay-types.d.ts
+
+/**
+ * The overlay itself — the `dialog` prop on DialogItem and the `popover` prop
+ * on PopoverItem.
+ *
+ * `TSlots` differs per overlay (only a dialog has a footer), so each component
+ * supplies its own slot map.
+ */
+interface OverlayProps<TSlots> {
+  /** Heading inside the overlay. Defaults to the field label. */
+  title?: SyncReactNode;
+  /** Description inside the overlay. Defaults to the field description. */
+  description?: SyncReactNode;
+  /** Props for the overlay's internal parts. */
+  slots?: TSlots;
+}
+/** Slots every overlay has, whatever kind it is. */
+interface OverlayBaseSlots {
+  header?: React.ComponentProps<'div'>;
+  body?: React.ComponentProps<'div'>;
+}
+//#endregion
+export { OverlayBaseSlots, OverlayProps };

package/dist/components/overlay-common/use-overlay.cjs

@@ -0,0 +1,110 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_resolve_responsive_space = require('../../utils/resolve-responsive-space.cjs');
+const require_use_description = require('../../hooks/use-description.cjs');
+const require_use_form_context = require('../../hooks/use-form-context.cjs');
+const require_use_label = require('../../hooks/use-label.cjs');
+require('../../hooks/index.cjs');
+const require_use_shake_animation = require('../array-common/use-shake-animation.cjs');
+require('../array-common/index.cjs');
+const require_constants = require('./constants.cjs');
+const require_is_empty_field_value = require('./is-empty-field-value.cjs');
+let __formily_react = require("@formily/react");
+__formily_react = require_rolldown_runtime.__toESM(__formily_react);
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+
+//#region src/components/overlay-common/use-overlay.ts
+/**
+* Formily glob matching the field itself and every descendant, and nothing
+* else — `*(a,a.*)` matches `a`, `a.b`, and `a.b.c`, but not the sibling `ab`.
+* One pattern covers both shapes an overlay can hold: a single input (validate
+* the field) and an object's form (validate its fields), at any depth.
+*/
+function buildValidationPattern(address) {
+	return `*(${address},${address}.*)`;
+}
+/**
+* Shared state for fields that render their input(s) inside an overlay
+* (dialog or popover) opened from a trigger button.
+*
+* Fields render in the parent form (no draft copy), so edits commit as the
+* user types. This mirrors the autoSave mode of ArrayDialog/ArrayPopover:
+* validation on close is scoped to the overlay's own fields so unrelated
+* fields elsewhere in the form are not validated.
+*/
+function useOverlay(options = {}) {
+	const { label, description, trigger, open, defaultOpen, onOpenChange, validateOnClose = true } = options;
+	const effectiveLabel = require_use_label.useLabel(label);
+	const effectiveDescription = require_use_description.useDescription(description);
+	const [uncontrolledOpen, setUncontrolledOpen] = react.default.useState(defaultOpen ?? false);
+	const isControlled = open !== void 0;
+	const isOpen = isControlled ? open : uncontrolledOpen;
+	const setOpen = react.default.useCallback((next) => {
+		if (!isControlled) setUncontrolledOpen(next);
+		onOpenChange?.(next);
+	}, [isControlled, onOpenChange]);
+	const { layout } = require_use_form_context.useFormContext();
+	const gapClass = require_resolve_responsive_space.resolveResponsiveGapClass({ density: layout?.density });
+	const field = (0, __formily_react.useField)();
+	const hasError = field.errors.length > 0;
+	const validationPath = buildValidationPattern(field.address.toString());
+	const noun = (0, __formily_react.useFieldSchema)().title ?? require_constants.DEFAULT_TRIGGER_NOUN;
+	const isEmpty = require_is_empty_field_value.isEmptyFieldValue(field.value);
+	const resolvedTrigger = {
+		...trigger,
+		label: trigger?.label ?? (isEmpty ? `Add ${noun}` : `Edit ${noun}`)
+	};
+	const { shouldShake, triggerShake } = require_use_shake_animation.useShakeAnimation();
+	const revalidateOnOpenRef = react.default.useRef(false);
+	react.default.useEffect(() => {
+		if (!isOpen || !revalidateOnOpenRef.current) return;
+		revalidateOnOpenRef.current = false;
+		Promise.resolve(field.form.validate(validationPath)).catch(() => void 0);
+	}, [
+		field.form,
+		isOpen,
+		validationPath
+	]);
+	const requestClose = react.default.useCallback(() => {
+		if (!validateOnClose) {
+			setOpen(false);
+			return;
+		}
+		Promise.resolve(field.form.validate(validationPath)).then(() => {
+			setOpen(false);
+		}).catch(() => {
+			triggerShake();
+		});
+	}, [
+		field.form,
+		setOpen,
+		triggerShake,
+		validateOnClose,
+		validationPath
+	]);
+	return {
+		label: effectiveLabel,
+		description: effectiveDescription,
+		trigger: resolvedTrigger,
+		open: isOpen,
+		gapClass,
+		hasError,
+		shouldShake,
+		handleOpenChange: react.default.useCallback((next) => {
+			if (next) {
+				revalidateOnOpenRef.current = hasError;
+				setOpen(true);
+				return;
+			}
+			requestClose();
+		}, [
+			hasError,
+			requestClose,
+			setOpen
+		]),
+		requestClose
+	};
+}
+
+//#endregion
+exports.useOverlay = useOverlay;

package/dist/components/overlay-common/use-overlay.d.cts

@@ -0,0 +1 @@
+import "./OverlayTrigger.cjs";

package/dist/components/overlay-common/use-overlay.d.ts

@@ -0,0 +1 @@
+import "./OverlayTrigger.js";