@optiaxiom/react 3.4.2 → 3.5.0

package/dist/cjs/dialog-C_RmRBrt.js

@@ -0,0 +1,533 @@
+"use client";
+const require_rolldown_runtime = require("./rolldown-runtime-C0BPl7ul.js");
+const require_box = require("./box-B2PXBdH7.js");
+const require_recipeRuntime = require("./recipeRuntime-BV5B1H9r.js");
+const require_useSurface = require("./useSurface-Dy0GdyeS.js");
+const require_button = require("./button-BO_WcwyT.js");
+const require_FocusBookmarkProvider = require("./FocusBookmarkProvider-BJWt--oq.js");
+const require_text = require("./text-BWyl3PQL.js");
+const require_group = require("./group.js");
+const require_transition = require("./transition-tqiyzYYq.js");
+const require_paper = require("./paper-BAtiTHb1.js");
+const require_Portal = require("./Portal-DI9aR5XU.js");
+const require_heading = require("./heading-hT47_aTz.js");
+const require_VisuallyHidden = require("./VisuallyHidden-DK0Wtj7A.js");
+let _optiaxiom_icons_IconXmark = require("@optiaxiom/icons/IconXmark");
+let react = require("react");
+require("./assets/layers.css.ts.vanilla-CTOkUrdE.css");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _optiaxiom_globals = require("@optiaxiom/globals");
+let _radix_ui_react_context = require("@radix-ui/react-context");
+let _radix_ui_react_compose_refs = require("@radix-ui/react-compose-refs");
+let _radix_ui_react_use_controllable_state = require("@radix-ui/react-use-controllable-state");
+let _radix_ui_react_dialog = require("@radix-ui/react-dialog");
+_radix_ui_react_dialog = require_rolldown_runtime.__toESM(_radix_ui_react_dialog, 1);
+require("./assets/ButtonGroup.css.ts.vanilla-Big2-ymt.css");
+let _vanilla_extract_dynamic = require("@vanilla-extract/dynamic");
+require("./assets/Backdrop.css.ts.vanilla-CwaUhB_d.css");
+require("./assets/DialogContent.css.ts.vanilla-TXf1xysL.css");
+require("./assets/DialogFooter.css.ts.vanilla-DJ2ZMduP.css");
+require("./assets/DialogHeader.css.ts.vanilla-mM4mjOHM.css");
+//#region src/dialog-kit/DialogKitContext.ts
+const DialogKitContext = (0, react.createContext)(void 0);
+//#endregion
+//#region src/focus-bookmark/FocusBookmarkRestore.tsx
+const FocusBookmarkRestore = (0, react.forwardRef)((_props, ref) => {
+	const { bookmarksRef } = require_FocusBookmarkProvider.useFocusBookmarkProviderContext("@optiaxiom/react/FocusBookmarkRestore");
+	(0, react.useImperativeHandle)(ref, () => ({
+		contains: () => false,
+		focus: () => {
+			bookmarksRef.current = bookmarksRef.current.filter((element) => document.body.contains(element));
+			while (bookmarksRef.current.length) {
+				const element = bookmarksRef.current.pop();
+				if (!element) break;
+				element.focus();
+				break;
+			}
+		}
+	}), [bookmarksRef]);
+	return null;
+});
+FocusBookmarkRestore.displayName = "@optiaxiom/react/FocusBookmarkRestore";
+//#endregion
+//#region src/nested-dialog-context/NestedDialogContext.ts
+const [NestedDialogProvider, useNestedDialogContext] = (0, _radix_ui_react_context.createContext)("@optiaxiom/react/NestedDialog", null);
+//#endregion
+//#region src/nested-dialog-context/useNestedDialogCount.ts
+function useNestedDialogCount(name, open) {
+	const { onCountChange } = useNestedDialogContext(name) ?? {};
+	const [nestedDialogCount, setNestedDialogCount] = (0, react.useState)(0);
+	/**
+	* Propagate nested dialog count to parent context whenever open is toggled.
+	*/
+	(0, react.useEffect)(() => {
+		if (!onCountChange) return;
+		/**
+		* Notify parent of 1 (self) + number of own nested dialogs when open.
+		*/
+		if (open) onCountChange(nestedDialogCount + 1);
+		/**
+		* Clear our nested dialog count from parent context on component unmount
+		* or if open prop is toggled.
+		*/
+		return () => onCountChange(0);
+	}, [
+		nestedDialogCount,
+		onCountChange,
+		open
+	]);
+	return [nestedDialogCount, setNestedDialogCount];
+}
+//#endregion
+//#region src/dialog/DialogContext.ts
+const [DialogProvider, useDialogContext] = (0, _radix_ui_react_context.createContext)("@optiaxiom/react/Dialog");
+//#endregion
+//#region src/dialog/Dialog.tsx
+/**
+* Display a modal dialog box.
+*
+* DialogHeader automatically includes a close button (X) in the top-right
+* corner - do not manually add a close button to the header.
+*
+* Use Dialog for forms, data entry, content display, multi-step workflows, and
+* non-critical interactions. For confirmations or destructive actions, use
+* AlertDialog instead (which has no close button and requires explicit user
+* choice).
+*
+* For forms, wrap DialogBody and DialogFooter in DialogForm and use
+* type="submit" on the primary action button.
+*
+* @category overlay
+* @group Dialog
+* @since 0.1.0
+*/
+function Dialog({ children, defaultOpen = false, onOpenChange, open: openProp, ...props }) {
+	if ((0, react.useContext)(DialogKitContext)) throw new Error("`@optiaxiom/react/Dialog` should not be used explicitly in managed mode.\n\nPlease remove it and only use `@optiaxiom/react/DialogContent` instead.");
+	const [open, setOpen] = (0, _radix_ui_react_use_controllable_state.useControllableState)({
+		caller: "@optiaxiom/react/Dialog",
+		defaultProp: defaultOpen,
+		onChange: onOpenChange,
+		prop: openProp
+	});
+	const [presence, setPresence] = (0, react.useState)(false);
+	const [nestedDialogCount, setNestedDialogCount] = useNestedDialogCount("Dialog", open);
+	const cancelRef = (0, react.useRef)(null);
+	const headerRef = (0, react.useRef)(null);
+	const footerRef = (0, react.useRef)(null);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(NestedDialogProvider, {
+		onCountChange: setNestedDialogCount,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_dialog.Root, {
+			onOpenChange: setOpen,
+			open: open || presence,
+			...props,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DialogProvider, {
+				cancelRef,
+				footerRef,
+				headerRef,
+				nestedDialogCount,
+				open,
+				presence,
+				setPresence,
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_dialog.Trigger, {
+					asChild: true,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FocusBookmarkRestore, {})
+				}), children]
+			})
+		})
+	});
+}
+Dialog.displayName = "@optiaxiom/react/Dialog";
+//#endregion
+//#region src/dialog/DialogBody.css.ts
+var body = require_recipeRuntime.recipeRuntime({ base: [{
+	flex: "1",
+	flexDirection: "column",
+	fontSize: "md",
+	gap: "16",
+	px: "24",
+	py: "16",
+	z: "0"
+}, "btuomw"] });
+//#endregion
+//#region src/dialog/DialogBody.tsx
+/**
+* @group Dialog
+*/
+const DialogBody = (0, react.forwardRef)(({ children, className, ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_group.Group, {
+		ref,
+		...body({}, className),
+		...props,
+		children
+	});
+});
+DialogBody.displayName = "@optiaxiom/react/DialogBody";
+//#endregion
+//#region src/dialog/DialogClose.tsx
+/**
+* @extends Button
+* @group Dialog
+*/
+const DialogClose = (0, react.forwardRef)(({ appearance = "subtle", asChild, children, onClick, ...props }, ref) => {
+	const { onDismiss } = (0, react.useContext)(DialogKitContext) ?? {};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_dialog.Close, {
+		asChild: true,
+		onClick: (event) => {
+			if (onDismiss) {
+				onDismiss(event, "cancel");
+				if (event.defaultPrevented) return;
+			}
+			onClick?.(event);
+		},
+		ref,
+		...props,
+		children: asChild ? children : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.Button, {
+			appearance,
+			children
+		})
+	});
+});
+DialogClose.displayName = "@optiaxiom/react/DialogClose";
+//#endregion
+//#region src/backdrop/Backdrop.css.ts
+var backdrop$1 = require_recipeRuntime.recipeRuntime({ base: [{
+	bg: "bg.overlay",
+	z: "popover"
+}, "_1cw53zu"] });
+//#endregion
+//#region src/backdrop/Backdrop.tsx
+const Backdrop = (0, react.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_box.Box, {
+	ref,
+	...backdrop$1({}, className),
+	...props
+}));
+Backdrop.displayName = "@optiaxiom/react/Backdrop";
+//#endregion
+//#region src/dialog/DialogContent.css.ts
+var DialogContent_css_exports = /* @__PURE__ */ require_rolldown_runtime.__exportAll({
+	backdrop: () => backdrop,
+	content: () => content,
+	nestedDialogCountVar: () => nestedDialogCountVar,
+	scrollPaddingBottomVar: () => scrollPaddingBottomVar,
+	scrollPaddingTopVar: () => scrollPaddingTopVar
+});
+var backdrop = require_recipeRuntime.recipeRuntime({ variants: { hidden: {
+	false: {},
+	true: "_7on3pc"
+} } });
+var content = require_recipeRuntime.recipeRuntime({
+	base: [{
+		color: "fg.default",
+		display: "flex",
+		flexDirection: "column",
+		overflow: "auto"
+	}, "_13dqv03"],
+	variants: { size: {
+		sm: "_1ufbdji",
+		md: "m3pjfu",
+		lg: "ebw5vq",
+		fullscreen: "_1rtnrjd"
+	} }
+});
+var nestedDialogCountVar = "var(--wf5fp2)";
+var scrollPaddingBottomVar = "var(--_1irlpew)";
+var scrollPaddingTopVar = "var(--pt8658)";
+//#endregion
+//#region src/dialog/DialogContentImpl.tsx
+const DialogContentImpl = (0, react.forwardRef)(({ children, ...props }, outerRef) => {
+	const { footerRef, headerRef } = useDialogContext("@optiaxiom/react/DialogContentImpl");
+	const innerRef = (0, react.useRef)(null);
+	const ref = (0, _radix_ui_react_compose_refs.useComposedRefs)(innerRef, outerRef);
+	(0, react.useEffect)(() => {
+		const observer = new ResizeObserver((entries) => {
+			if (!innerRef.current) return;
+			const padding = 16;
+			const vars = {};
+			for (const entry of entries) {
+				const side = entry.target === headerRef.current ? "Top" : "Bottom";
+				vars[DialogContent_css_exports[`scrollPadding${side}Var`]] = `${entry.borderBoxSize[0].blockSize + padding}px`;
+			}
+			(0, _vanilla_extract_dynamic.setElementVars)(innerRef.current, vars);
+		});
+		if (headerRef.current) observer.observe(headerRef.current);
+		if (footerRef.current) observer.observe(footerRef.current);
+		return () => observer.disconnect();
+	}, [footerRef, headerRef]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_box.Box, {
+		ref,
+		...props,
+		children
+	});
+});
+DialogContentImpl.displayName = "@optiaxiom/react/DialogContentImpl";
+//#endregion
+//#region src/dialog/DialogContent.tsx
+/**
+* @group Dialog
+*/
+const DialogContent = (0, react.forwardRef)(({ children, className, onCloseAutoFocus, onEscapeKeyDown, onPointerDownOutside, size = "md", style, ...props }, outerRef) => {
+	const { nestedDialogCount, open } = useDialogContext("@optiaxiom/react/DialogContent");
+	const { onClose, onDismiss } = (0, react.useContext)(DialogKitContext) ?? {};
+	const innerRef = (0, react.useRef)(null);
+	const ref = (0, _radix_ui_react_compose_refs.useComposedRefs)(innerRef, outerRef);
+	const { track } = require_useSurface.useSurface("dialog") ?? {};
+	(0, react.useEffect)(() => {
+		if (open) track?.({ name: "viewed" });
+	}, [open, track]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_transition.TransitionGroup, {
+		open,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Portal.Portal, {
+			asChild: true,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_transition.Transition, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Backdrop, {
+				asChild: true,
+				...backdrop({ hidden: nestedDialogCount > 0 }),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_dialog.Overlay, { forceMount: true })
+			}) })
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Portal.Portal, {
+			asChild: true,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_transition.Transition, {
+				type: "pop",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_paper.Paper, {
+					asChild: true,
+					elevation: size === "fullscreen" ? "screen" : "dialog",
+					onBlur: require_FocusBookmarkProvider.onReactSelectInputBlur,
+					style: {
+						...(0, _vanilla_extract_dynamic.assignInlineVars)({ [nestedDialogCountVar]: `${nestedDialogCount}` }),
+						...style
+					},
+					...content({ size }, className),
+					...props,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_dialog.Content, {
+						asChild: true,
+						forceMount: true,
+						onCloseAutoFocus: (event) => {
+							onCloseAutoFocus?.(event);
+							onClose?.();
+						},
+						onEscapeKeyDown: (event) => {
+							if (onDismiss) {
+								onDismiss(event, "cancel");
+								if (event.defaultPrevented) return;
+							}
+							onEscapeKeyDown?.(event);
+						},
+						onPointerDownOutside: onPointerDownOutside ? (event) => {
+							onPointerDownOutside(event);
+							if (event.defaultPrevented) return;
+							if (onDismiss) {
+								onDismiss(event, "cancel");
+								if (event.defaultPrevented) return;
+							}
+						} : (event) => event.preventDefault(),
+						ref,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DialogContentImpl, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_globals.ModalProvider, {
+							shardRef: innerRef,
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_FocusBookmarkProvider.FocusBookmarkProvider, {
+								containerRef: innerRef,
+								children
+							})
+						}) })
+					})
+				})
+			})
+		})]
+	});
+});
+DialogContent.displayName = "@optiaxiom/react/DialogContent";
+//#endregion
+//#region src/dialog/DialogFooter.css.ts
+var footer = require_recipeRuntime.recipeRuntime({ base: [{
+	bg: "bg.default",
+	borderColor: "border.secondary",
+	borderT: "1",
+	gap: "16",
+	justifyContent: "flex-end",
+	px: "24",
+	py: "20"
+}, "ttqcwl"] });
+//#endregion
+//#region src/dialog/DialogFooter.tsx
+/**
+* @group Dialog
+*/
+const DialogFooter = (0, react.forwardRef)(({ children, className, ...props }, outerRef) => {
+	const { footerRef } = useDialogContext("@optiaxiom/react/DialogFooter");
+	const ref = (0, _radix_ui_react_compose_refs.useComposedRefs)(footerRef, outerRef);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.ButtonProvider, {
+		size: "lg",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_group.Group, {
+			ref,
+			...footer({}, className),
+			...props,
+			children
+		})
+	});
+});
+DialogFooter.displayName = "@optiaxiom/react/DialogFooter";
+//#endregion
+//#region src/dialog/DialogForm.tsx
+/**
+* @group Dialog
+*/
+const DialogForm = (0, react.forwardRef)(({ children, className, ...props }, ref) => {
+	const { boxProps, restProps } = require_box.extractBoxProps(props);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_box.Box, {
+		asChild: true,
+		className,
+		display: "flex",
+		flexDirection: "column",
+		...boxProps,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("form", {
+			ref,
+			...restProps,
+			children
+		})
+	});
+});
+DialogForm.displayName = "@optiaxiom/react/DialogForm";
+//#endregion
+//#region src/dialog/DialogHeader.css.ts
+var actions = require_recipeRuntime.recipeRuntime({ base: [{ gap: "8" }, "_2sn30k"] });
+var close = require_recipeRuntime.recipeRuntime({ base: ["lf0z3z"] });
+var description = require_recipeRuntime.recipeRuntime({ base: [{
+	color: "fg.secondary",
+	fontSize: "md",
+	fontWeight: "400",
+	w: "full"
+}, "_5znmjo"] });
+var header = require_recipeRuntime.recipeRuntime({ base: [{
+	alignItems: "center",
+	bg: "bg.default",
+	display: "flex",
+	flexWrap: "wrap",
+	gap: "8",
+	p: "24",
+	pb: "16",
+	z: "10"
+}, "hxy15w"] });
+var title = require_recipeRuntime.recipeRuntime({ base: [{
+	flex: "1",
+	fontWeight: "600"
+}, "_8jhsm7"] });
+//#endregion
+//#region src/dialog/DialogHeader.tsx
+/**
+* @group Dialog
+*/
+const DialogHeader = (0, react.forwardRef)(({ addonAfter, children, className, description: description$1, lineClamp, truncate, ...props }, outerRef) => {
+	const { headerRef } = useDialogContext("@optiaxiom/react/DialogHeader");
+	const ref = (0, _radix_ui_react_compose_refs.useComposedRefs)(headerRef, outerRef);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_box.Box, {
+		ref,
+		...header({}, className),
+		...props,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DialogClose, {
+				appearance: "subtle",
+				"aria-label": "Close",
+				icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons_IconXmark.IconXmark, {}),
+				...close()
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_heading.Heading, {
+				asChild: true,
+				level: "3",
+				lineClamp,
+				truncate,
+				...title(),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_dialog.Title, { children })
+			}),
+			addonAfter && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_group.Group, {
+				...actions(),
+				children: addonAfter
+			}),
+			description$1 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text.Text, {
+				asChild: true,
+				...description(),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_dialog.Description, { children: description$1 })
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_VisuallyHidden.VisuallyHidden, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_dialog.Description, {}) })
+		]
+	});
+});
+DialogHeader.displayName = "@optiaxiom/react/DialogHeader";
+//#endregion
+//#region src/dialog/DialogTrigger.tsx
+/**
+* @extends Button
+* @group Dialog
+*/
+const DialogTrigger = (0, react.forwardRef)(({ asChild, children, ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_dialog.Trigger, {
+		asChild: true,
+		ref,
+		...props,
+		children: asChild ? children : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.Button, { children })
+	});
+});
+DialogTrigger.displayName = "@optiaxiom/react/DialogTrigger";
+//#endregion
+Object.defineProperty(exports, "Backdrop", {
+	enumerable: true,
+	get: function() {
+		return Backdrop;
+	}
+});
+Object.defineProperty(exports, "Dialog", {
+	enumerable: true,
+	get: function() {
+		return Dialog;
+	}
+});
+Object.defineProperty(exports, "DialogBody", {
+	enumerable: true,
+	get: function() {
+		return DialogBody;
+	}
+});
+Object.defineProperty(exports, "DialogClose", {
+	enumerable: true,
+	get: function() {
+		return DialogClose;
+	}
+});
+Object.defineProperty(exports, "DialogContent", {
+	enumerable: true,
+	get: function() {
+		return DialogContent;
+	}
+});
+Object.defineProperty(exports, "DialogFooter", {
+	enumerable: true,
+	get: function() {
+		return DialogFooter;
+	}
+});
+Object.defineProperty(exports, "DialogForm", {
+	enumerable: true,
+	get: function() {
+		return DialogForm;
+	}
+});
+Object.defineProperty(exports, "DialogHeader", {
+	enumerable: true,
+	get: function() {
+		return DialogHeader;
+	}
+});
+Object.defineProperty(exports, "DialogKitContext", {
+	enumerable: true,
+	get: function() {
+		return DialogKitContext;
+	}
+});
+Object.defineProperty(exports, "DialogTrigger", {
+	enumerable: true,
+	get: function() {
+		return DialogTrigger;
+	}
+});
+Object.defineProperty(exports, "useDialogContext", {
+	enumerable: true,
+	get: function() {
+		return useDialogContext;
+	}
+});

package/dist/cjs/dialog.js

@@ -0,0 +1,10 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_dialog = require("./dialog-C_RmRBrt.js");
+exports.Dialog = require_dialog.Dialog;
+exports.DialogBody = require_dialog.DialogBody;
+exports.DialogClose = require_dialog.DialogClose;
+exports.DialogContent = require_dialog.DialogContent;
+exports.DialogFooter = require_dialog.DialogFooter;
+exports.DialogForm = require_dialog.DialogForm;
+exports.DialogHeader = require_dialog.DialogHeader;
+exports.DialogTrigger = require_dialog.DialogTrigger;

package/dist/cjs/dialogkit-gcepZ2zv.js

@@ -0,0 +1,84 @@
+"use client";
+const require_alert_dialog = require("./alert-dialog-CYR1Bemv.js");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/dialog-kit/dialogkit.tsx
+const EMPTY = [];
+let id = 1;
+const genId = () => {
+	return "t" + id++;
+};
+/**
+* Create a dialog kit instance for managing dialogs programmatically.
+*
+* @experimental
+*/
+const createDialogKit = () => {
+	let snapshot = [];
+	const listeners = /* @__PURE__ */ new Set();
+	const emit = () => {
+		for (const listener of listeners) listener();
+	};
+	const create = (element, options) => {
+		const id = genId();
+		snapshot = [{
+			...options,
+			element,
+			id,
+			onClose: () => {
+				snapshot = snapshot.filter((item) => item.id !== id);
+				emit();
+			},
+			open: true
+		}, ...snapshot];
+		emit();
+		return id;
+	};
+	const remove = (id) => {
+		snapshot = snapshot.map((item) => item.id === id ? {
+			...item,
+			open: false
+		} : item);
+		emit();
+	};
+	return {
+		store: [
+			(callback) => {
+				listeners.add(callback);
+				return () => listeners.delete(callback);
+			},
+			() => snapshot,
+			() => EMPTY
+		],
+		clear: () => {
+			for (const item of snapshot) remove(item.id);
+		},
+		confirm: async (element) => {
+			return new Promise((resolve) => {
+				create((0, react.isValidElement)(element) ? element : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_alert_dialog.AlertDialogContent, { children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_alert_dialog.AlertDialogHeader, { children: element.header }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_alert_dialog.AlertDialogBody, { children: element.body }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_alert_dialog.AlertDialogFooter, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_alert_dialog.AlertDialogCancel, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_alert_dialog.AlertDialogAction, { children: element.action })] })
+				] }), { onDismiss: (_event, reason) => {
+					resolve(reason === "action");
+				} });
+			});
+		},
+		create,
+		remove
+	};
+};
+const dialogkit = createDialogKit();
+//#endregion
+Object.defineProperty(exports, "createDialogKit", {
+	enumerable: true,
+	get: function() {
+		return createDialogKit;
+	}
+});
+Object.defineProperty(exports, "dialogkit", {
+	enumerable: true,
+	get: function() {
+		return dialogkit;
+	}
+});