@pixpilot/shadcn-ui 1.33.0 → 1.34.0

package/dist/ButtonExtended.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime3 from "react/jsx-runtime";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
 import { Button, Tooltip, TooltipContent, TooltipTrigger, buttonVariants } from "@pixpilot/shadcn";
 import React from "react";
 import { VariantProps } from "class-variance-authority";
@@ -50,7 +50,7 @@ interface ButtonExtendedProps extends React.ComponentProps<typeof Button>, Varia
 }
 declare function ButtonExtended(props: ButtonExtendedProps & {
   ref?: React.Ref<HTMLButtonElement>;
-}): react_jsx_runtime3.JSX.Element;
+}): react_jsx_runtime1.JSX.Element;
 declare namespace ButtonExtended {
   var displayName: string;
 }

package/dist/Card.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime1 from "react/jsx-runtime";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
 import { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@pixpilot/shadcn";
 import React from "react";
 
@@ -6,10 +6,10 @@ import React from "react";
 declare function CardTitle$1({
   className,
   ...props
-}: React.ComponentProps<typeof CardTitle>): react_jsx_runtime1.JSX.Element;
+}: React.ComponentProps<typeof CardTitle>): react_jsx_runtime2.JSX.Element;
 declare function CardHeader$1({
   className,
   ...props
-}: React.ComponentProps<typeof CardHeader>): react_jsx_runtime1.JSX.Element;
+}: React.ComponentProps<typeof CardHeader>): react_jsx_runtime2.JSX.Element;
 //#endregion
 export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader$1 as CardHeader, CardTitle$1 as CardTitle };

package/dist/confirmation-dialog/ConfirmationDialog.cjs

@@ -1,12 +1,12 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
 const require_get_id = require('../utils/get-id.cjs');
 const require_variant_config = require('../variant-config.cjs');
+const require_dialog_registry = require('../dialog-provider/dialog-registry.cjs');
+require('../dialog-provider/index.cjs');
 let __pixpilot_shadcn = require("@pixpilot/shadcn");
 __pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
 let react_jsx_runtime = require("react/jsx-runtime");
 react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
-let __ebay_nice_modal_react = require("@ebay/nice-modal-react");
-__ebay_nice_modal_react = require_rolldown_runtime.__toESM(__ebay_nice_modal_react);
 
 //#region src/confirmation-dialog/ConfirmationDialog.tsx
 const variantMap = {
@@ -15,9 +15,9 @@ const variantMap = {
 	primary: "info",
 	default: "default"
 };
-const ConfirmationDialog = __ebay_nice_modal_react.default.create((props) => {
+const ConfirmationDialog = require_dialog_registry.dialog.create((props) => {
 	const { id, title = "Confirmation Dialog", variant, showIcon = true } = props;
-	const modal = (0, __ebay_nice_modal_react.useModal)();
+	const modal = require_dialog_registry.dialog.useDialog();
 	const handleConfirm = () => {
 		props.onConfirm?.();
 		modal.resolve(true);

package/dist/confirmation-dialog/ConfirmationDialog.d.cts

@@ -1,4 +1,4 @@
-import "react";
+import "../index.cjs";
 
 //#region src/confirmation-dialog/ConfirmationDialog.d.ts
 type ConfirmationDialogVariant = 'destructive' | 'warning' | 'primary' | 'default';

package/dist/confirmation-dialog/ConfirmationDialog.d.ts

@@ -1,5 +1,4 @@
-import "react";
-import "@ebay/nice-modal-react";
+import "../index.js";
 
 //#region src/confirmation-dialog/ConfirmationDialog.d.ts
 type ConfirmationDialogVariant = 'destructive' | 'warning' | 'primary' | 'default';

package/dist/confirmation-dialog/ConfirmationDialog.js

@@ -1,8 +1,9 @@
 import { getId } from "../utils/get-id.js";
 import { variantConfig } from "../variant-config.js";
+import { dialog } from "../dialog-provider/dialog-registry.js";
+import "../dialog-provider/index.js";
 import { Button, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, cn } from "@pixpilot/shadcn";
 import { jsx, jsxs } from "react/jsx-runtime";
-import NiceModal, { useModal } from "@ebay/nice-modal-react";
 
 //#region src/confirmation-dialog/ConfirmationDialog.tsx
 const variantMap = {
@@ -11,9 +12,9 @@ const variantMap = {
 	primary: "info",
 	default: "default"
 };
-const ConfirmationDialog = NiceModal.create((props) => {
+const ConfirmationDialog = dialog.create((props) => {
 	const { id, title = "Confirmation Dialog", variant, showIcon = true } = props;
-	const modal = useModal();
+	const modal = dialog.useDialog();
 	const handleConfirm = () => {
 		props.onConfirm?.();
 		modal.resolve(true);

package/dist/confirmation-dialog/confirmation-dialogs.cjs

@@ -1,12 +1,15 @@
-const require_dialog_registry = require('../dialog-provider/dialog-registry.cjs');
-require('../dialog-provider/index.cjs');
 const require_ConfirmationDialog = require('./ConfirmationDialog.cjs');
 
 //#region src/confirmation-dialog/confirmation-dialogs.tsx
 async function showConfirmDialog(props) {
-	const id = crypto.randomUUID();
-	return require_dialog_registry.dialog.register(id, require_ConfirmationDialog.default).show(props);
+	return require_ConfirmationDialog.default.show(props);
 }
+const confirmDialog = {
+	show: showConfirmDialog,
+	hide: require_ConfirmationDialog.default.hide,
+	remove: require_ConfirmationDialog.default.remove
+};
 
 //#endregion
+exports.confirmDialog = confirmDialog;
 exports.showConfirmDialog = showConfirmDialog;

package/dist/confirmation-dialog/confirmation-dialogs.d.cts

@@ -3,5 +3,10 @@ import { ConfirmationDialogProps } from "./ConfirmationDialog.cjs";
 //#region src/confirmation-dialog/confirmation-dialogs.d.ts
 interface ConfirmDialog extends ConfirmationDialogProps {}
 declare function showConfirmDialog(props: ConfirmDialog): Promise<boolean>;
+declare const confirmDialog: {
+  show: typeof showConfirmDialog;
+  hide: <TResult = unknown>() => Promise<TResult>;
+  remove: () => void;
+};
 //#endregion
-export { showConfirmDialog };
+export { confirmDialog, showConfirmDialog };

package/dist/confirmation-dialog/confirmation-dialogs.d.ts

@@ -3,5 +3,10 @@ import { ConfirmationDialogProps } from "./ConfirmationDialog.js";
 //#region src/confirmation-dialog/confirmation-dialogs.d.ts
 interface ConfirmDialog extends ConfirmationDialogProps {}
 declare function showConfirmDialog(props: ConfirmDialog): Promise<boolean>;
+declare const confirmDialog: {
+  show: typeof showConfirmDialog;
+  hide: <TResult = unknown>() => Promise<TResult>;
+  remove: () => void;
+};
 //#endregion
-export { showConfirmDialog };
+export { confirmDialog, showConfirmDialog };

package/dist/confirmation-dialog/confirmation-dialogs.js

@@ -1,12 +1,14 @@
-import { dialog } from "../dialog-provider/dialog-registry.js";
-import "../dialog-provider/index.js";
 import ConfirmationDialog_default from "./ConfirmationDialog.js";
 
 //#region src/confirmation-dialog/confirmation-dialogs.tsx
 async function showConfirmDialog(props) {
-	const id = crypto.randomUUID();
-	return dialog.register(id, ConfirmationDialog_default).show(props);
+	return ConfirmationDialog_default.show(props);
 }
+const confirmDialog = {
+	show: showConfirmDialog,
+	hide: ConfirmationDialog_default.hide,
+	remove: ConfirmationDialog_default.remove
+};
 
 //#endregion
-export { showConfirmDialog };
+export { confirmDialog, showConfirmDialog };

package/dist/confirmation-dialog/index.d.cts

@@ -1,2 +1,2 @@
 import { ConfirmationDialogProps, ConfirmationDialogVariant } from "./ConfirmationDialog.cjs";
-import { showConfirmDialog } from "./confirmation-dialogs.cjs";
+import { confirmDialog, showConfirmDialog } from "./confirmation-dialogs.cjs";

package/dist/confirmation-dialog/index.d.ts

@@ -1,2 +1,2 @@
 import { ConfirmationDialogProps, ConfirmationDialogVariant } from "./ConfirmationDialog.js";
-import { showConfirmDialog } from "./confirmation-dialogs.js";
+import { confirmDialog, showConfirmDialog } from "./confirmation-dialogs.js";

package/dist/confirmation-dialog/index.js

@@ -2,4 +2,4 @@
 
 
 import "./ConfirmationDialog.js";
-import { showConfirmDialog } from "./confirmation-dialogs.js";
+import { confirmDialog, showConfirmDialog } from "./confirmation-dialogs.js";

package/dist/dialog-provider/dialog-registry.cjs

@@ -5,6 +5,17 @@ let __ebay_nice_modal_react = require("@ebay/nice-modal-react");
 __ebay_nice_modal_react = require_rolldown_runtime.__toESM(__ebay_nice_modal_react);
 
 //#region src/dialog-provider/dialog-registry.ts
+const useDialog = __ebay_nice_modal_react.useModal;
+function createDialog(component) {
+	const CreatedDialog = __ebay_nice_modal_react.default.create(component);
+	return Object.assign(CreatedDialog, {
+		show: async (props) => __ebay_nice_modal_react.default.show(CreatedDialog, props),
+		hide: async () => __ebay_nice_modal_react.default.hide(CreatedDialog),
+		remove: () => {
+			__ebay_nice_modal_react.default.remove(CreatedDialog);
+		}
+	});
+}
 /**
 * Hides a registered dialog by id.
 *
@@ -71,15 +82,19 @@ function unregisterDialog(id) {
 * ```
 */
 const dialog = {
+	create: createDialog,
 	hide: hideDialog,
 	register: require_register_dialog.registerDialog,
 	remove: removeDialog,
 	show: require_show_dialog.showDialog,
-	unregister: unregisterDialog
+	unregister: unregisterDialog,
+	useDialog
 };
 
 //#endregion
+exports.createDialog = createDialog;
 exports.dialog = dialog;
 exports.hideDialog = hideDialog;
 exports.removeDialog = removeDialog;
-exports.unregisterDialog = unregisterDialog;
+exports.unregisterDialog = unregisterDialog;
+exports.useDialog = useDialog;

package/dist/dialog-provider/dialog-registry.d.cts

@@ -1,8 +1,16 @@
 import { registerDialog } from "./register-dialog.cjs";
 import { showDialog } from "./show-dialog.cjs";
+import { ComponentType, FC } from "react";
+import { NiceModalHocProps, useModal } from "@ebay/nice-modal-react";
 
 //#region src/dialog-provider/dialog-registry.d.ts
-
+declare const useDialog: typeof useModal;
+interface CreatedDialog<TProps extends object> extends FC<TProps & NiceModalHocProps> {
+  show: <TResult = unknown>(props?: TProps) => Promise<TResult>;
+  hide: <TResult = unknown>() => Promise<TResult>;
+  remove: () => void;
+}
+declare function createDialog<TProps extends object>(component: ComponentType<TProps>): CreatedDialog<TProps>;
 /**
  * Hides a registered dialog by id.
  *
@@ -57,6 +65,23 @@ interface DialogRegistry {
    * ```
    */
   register: typeof registerDialog;
+  /**
+   * Creates a custom NiceModal dialog component with controller helpers.
+   *
+   * Use this for dialogs that need to control `useDialog()` directly. For simple
+   * shadcn dialogs, prefer `dialog.register(...)`.
+   *
+   * Usage:
+   * ```ts
+   * const CustomDialog = dialog.create((props) => {
+   *   const modal = dialog.useDialog();
+   *   return <Dialog open={modal.visible} onOpenChange={(open) => !open && modal.hide()} />;
+   * });
+   *
+   * await CustomDialog.show({ projectId: 'project-1' });
+   * ```
+   */
+  create: typeof createDialog;
   /**
    * Shows a registered dialog by id with generic props.
    *
@@ -101,6 +126,7 @@ interface DialogRegistry {
    * ```
    */
   unregister: typeof unregisterDialog;
+  useDialog: typeof useDialog;
 }
 /**
  * Convenience registry facade for dialog operations.
@@ -121,4 +147,4 @@ interface DialogRegistry {
  */
 declare const dialog: DialogRegistry;
 //#endregion
-export { DialogRegistry, dialog, hideDialog, removeDialog, unregisterDialog };
+export { CreatedDialog, DialogRegistry, createDialog, dialog, hideDialog, removeDialog, unregisterDialog, useDialog };

package/dist/dialog-provider/dialog-registry.d.ts

@@ -1,8 +1,16 @@
 import { registerDialog } from "./register-dialog.js";
 import { showDialog } from "./show-dialog.js";
+import { ComponentType, FC } from "react";
+import { NiceModalHocProps, useModal } from "@ebay/nice-modal-react";
 
 //#region src/dialog-provider/dialog-registry.d.ts
-
+declare const useDialog: typeof useModal;
+interface CreatedDialog<TProps extends object> extends FC<TProps & NiceModalHocProps> {
+  show: <TResult = unknown>(props?: TProps) => Promise<TResult>;
+  hide: <TResult = unknown>() => Promise<TResult>;
+  remove: () => void;
+}
+declare function createDialog<TProps extends object>(component: ComponentType<TProps>): CreatedDialog<TProps>;
 /**
  * Hides a registered dialog by id.
  *
@@ -57,6 +65,23 @@ interface DialogRegistry {
    * ```
    */
   register: typeof registerDialog;
+  /**
+   * Creates a custom NiceModal dialog component with controller helpers.
+   *
+   * Use this for dialogs that need to control `useDialog()` directly. For simple
+   * shadcn dialogs, prefer `dialog.register(...)`.
+   *
+   * Usage:
+   * ```ts
+   * const CustomDialog = dialog.create((props) => {
+   *   const modal = dialog.useDialog();
+   *   return <Dialog open={modal.visible} onOpenChange={(open) => !open && modal.hide()} />;
+   * });
+   *
+   * await CustomDialog.show({ projectId: 'project-1' });
+   * ```
+   */
+  create: typeof createDialog;
   /**
    * Shows a registered dialog by id with generic props.
    *
@@ -101,6 +126,7 @@ interface DialogRegistry {
    * ```
    */
   unregister: typeof unregisterDialog;
+  useDialog: typeof useDialog;
 }
 /**
  * Convenience registry facade for dialog operations.
@@ -121,4 +147,4 @@ interface DialogRegistry {
  */
 declare const dialog: DialogRegistry;
 //#endregion
-export { DialogRegistry, dialog, hideDialog, removeDialog, unregisterDialog };
+export { CreatedDialog, DialogRegistry, createDialog, dialog, hideDialog, removeDialog, unregisterDialog, useDialog };

package/dist/dialog-provider/dialog-registry.js

@@ -1,8 +1,19 @@
 import { registerDialog } from "./register-dialog.js";
 import { showDialog } from "./show-dialog.js";
-import NiceModal, { unregister } from "@ebay/nice-modal-react";
+import NiceModal, { unregister, useModal } from "@ebay/nice-modal-react";
 
 //#region src/dialog-provider/dialog-registry.ts
+const useDialog = useModal;
+function createDialog(component) {
+	const CreatedDialog = NiceModal.create(component);
+	return Object.assign(CreatedDialog, {
+		show: async (props) => NiceModal.show(CreatedDialog, props),
+		hide: async () => NiceModal.hide(CreatedDialog),
+		remove: () => {
+			NiceModal.remove(CreatedDialog);
+		}
+	});
+}
 /**
 * Hides a registered dialog by id.
 *
@@ -69,12 +80,14 @@ function unregisterDialog(id) {
 * ```
 */
 const dialog = {
+	create: createDialog,
 	hide: hideDialog,
 	register: registerDialog,
 	remove: removeDialog,
 	show: showDialog,
-	unregister: unregisterDialog
+	unregister: unregisterDialog,
+	useDialog
 };
 
 //#endregion
-export { dialog, hideDialog, removeDialog, unregisterDialog };
+export { createDialog, dialog, hideDialog, removeDialog, unregisterDialog, useDialog };

package/dist/dialog-provider/index.d.cts

@@ -1,4 +1,4 @@
-import { RegisteredDialog, RegisteredDialogShowProps, registerDialog } from "./register-dialog.cjs";
+import { RegisteredDialog, RegisteredDialogInjectedProps, RegisteredDialogShowProps, registerDialog } from "./register-dialog.cjs";
 import { ShowDialogProps, showDialog } from "./show-dialog.cjs";
-import { DialogRegistry, dialog, hideDialog, removeDialog, unregisterDialog } from "./dialog-registry.cjs";
+import { CreatedDialog, DialogRegistry, createDialog, dialog, hideDialog, removeDialog, unregisterDialog, useDialog } from "./dialog-registry.cjs";
 import { DialogProvider, DialogProviderProps } from "./DialogProvider.cjs";

package/dist/dialog-provider/index.d.ts

@@ -1,4 +1,4 @@
-import { RegisteredDialog, RegisteredDialogShowProps, registerDialog } from "./register-dialog.js";
+import { RegisteredDialog, RegisteredDialogInjectedProps, RegisteredDialogShowProps, registerDialog } from "./register-dialog.js";
 import { ShowDialogProps, showDialog } from "./show-dialog.js";
-import { DialogRegistry, dialog, hideDialog, removeDialog, unregisterDialog } from "./dialog-registry.js";
+import { CreatedDialog, DialogRegistry, createDialog, dialog, hideDialog, removeDialog, unregisterDialog, useDialog } from "./dialog-registry.js";
 import { DialogProvider, DialogProviderProps } from "./DialogProvider.js";

package/dist/dialog-provider/index.js

@@ -1,4 +1,4 @@
 import { registerDialog } from "./register-dialog.js";
 import { showDialog } from "./show-dialog.js";
-import { dialog, hideDialog, removeDialog, unregisterDialog } from "./dialog-registry.js";
+import { createDialog, dialog, hideDialog, removeDialog, unregisterDialog, useDialog } from "./dialog-registry.js";
 import { DialogProvider } from "./DialogProvider.js";

package/dist/dialog-provider/register-dialog.cjs

@@ -1,16 +1,21 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
 let __ebay_nice_modal_react = require("@ebay/nice-modal-react");
 __ebay_nice_modal_react = require_rolldown_runtime.__toESM(__ebay_nice_modal_react);
 
 //#region src/dialog-provider/register-dialog.ts
 /**
-* Registers a NiceModal dialog component and returns a typed controller for it.
+* Registers a dialog component and returns a typed controller for it.
 *
 * Use this when a dialog has a known component and you want type-safe props for
-* default values and `show(...)` calls.
+* default values and `show(...)` calls. The component is wrapped with
+* NiceModal automatically, and receives controlled `open` and `onOpenChange`
+* props.
 *
 * @param id - Stable dialog id used by NiceModal and by generic `showDialog`.
-* @param component - Dialog component, usually created with `NiceModal.create`.
+* @param component - Dialog component. Use `dialog.create(...)` instead when a
+* component needs custom NiceModal lifecycle behavior.
 * @param defaultProps - Optional component props registered as defaults.
 * @returns A controller with `id`, `show`, `hide`, and `remove` helpers.
 *
@@ -26,7 +31,25 @@ __ebay_nice_modal_react = require_rolldown_runtime.__toESM(__ebay_nice_modal_rea
 * ```
 */
 function registerDialog(id, component, defaultProps) {
-	__ebay_nice_modal_react.default.register(id, component, defaultProps);
+	const WrappedDialog = __ebay_nice_modal_react.default.create((props) => {
+		const modal = (0, __ebay_nice_modal_react.useModal)();
+		const { open: _open, onOpenChange,...componentProps } = props;
+		const Component = component;
+		const handleClose = (result) => {
+			modal.resolve(result);
+			modal.hide();
+		};
+		return react.default.createElement(Component, {
+			...componentProps,
+			open: modal.visible,
+			onOpenChange: (isOpen) => {
+				onOpenChange?.(isOpen);
+				if (!isOpen) handleClose("Closed");
+			}
+		});
+	});
+	WrappedDialog.displayName = `RegisteredDialog(${component.displayName ?? component.name ?? id})`;
+	__ebay_nice_modal_react.default.register(id, WrappedDialog, defaultProps);
 	return {
 		id,
 		show: async (props) => __ebay_nice_modal_react.default.show(id, props),

package/dist/dialog-provider/register-dialog.d.cts

@@ -3,12 +3,18 @@ import { NiceModalHocProps } from "@ebay/nice-modal-react";
 
 //#region src/dialog-provider/register-dialog.d.ts
 type NiceModalInjectedKeys = keyof NiceModalHocProps;
+type DialogInjectedKeys = 'open' | 'onOpenChange';
+type RegisteredDialogInjectedKeys = NiceModalInjectedKeys | DialogInjectedKeys;
+interface RegisteredDialogInjectedProps {
+  open?: boolean;
+  onOpenChange?: (isOpen: boolean) => void;
+}
 type Pretty<TValue> = { [TKey in keyof TValue]: TValue[TKey] } & {};
-type OptionalNiceModalProps<TProps extends object> = Pretty<Omit<TProps, Extract<keyof TProps, NiceModalInjectedKeys>> & Partial<Pick<TProps, Extract<keyof TProps, NiceModalInjectedKeys>>>>;
+type OptionalRegisteredDialogProps<TProps extends object> = Pretty<Omit<TProps, Extract<keyof TProps, RegisteredDialogInjectedKeys>> & Partial<Pick<TProps, Extract<keyof TProps, RegisteredDialogInjectedKeys>>>>;
 type DefaultedDialogProps<TProps extends object, TDefaultProps extends Partial<TProps>> = Pretty<Omit<TProps, keyof TDefaultProps> & Partial<Pick<TProps, Extract<keyof TProps, keyof TDefaultProps>>>>;
 type EmptyDialogDefaultProps = Record<never, never>;
-type RegisteredDialogShowProps<TProps extends object, TDefaultProps extends Partial<OptionalNiceModalProps<TProps>> = EmptyDialogDefaultProps> = DefaultedDialogProps<OptionalNiceModalProps<TProps>, TDefaultProps>;
-interface RegisteredDialog<TProps extends object, TDefaultProps extends Partial<OptionalNiceModalProps<TProps>> = EmptyDialogDefaultProps> {
+type RegisteredDialogShowProps<TProps extends object, TDefaultProps extends Partial<OptionalRegisteredDialogProps<TProps>> = EmptyDialogDefaultProps> = DefaultedDialogProps<OptionalRegisteredDialogProps<TProps>, TDefaultProps>;
+interface RegisteredDialog<TProps extends object, TDefaultProps extends Partial<OptionalRegisteredDialogProps<TProps>> = EmptyDialogDefaultProps> {
   /**
    * The stable NiceModal id used to register, show, hide, and remove this dialog.
    *
@@ -63,13 +69,16 @@ interface RegisteredDialog<TProps extends object, TDefaultProps extends Partial<
   remove: () => void;
 }
 /**
- * Registers a NiceModal dialog component and returns a typed controller for it.
+ * Registers a dialog component and returns a typed controller for it.
  *
  * Use this when a dialog has a known component and you want type-safe props for
- * default values and `show(...)` calls.
+ * default values and `show(...)` calls. The component is wrapped with
+ * NiceModal automatically, and receives controlled `open` and `onOpenChange`
+ * props.
  *
  * @param id - Stable dialog id used by NiceModal and by generic `showDialog`.
- * @param component - Dialog component, usually created with `NiceModal.create`.
+ * @param component - Dialog component. Use `dialog.create(...)` instead when a
+ * component needs custom NiceModal lifecycle behavior.
  * @param defaultProps - Optional component props registered as defaults.
  * @returns A controller with `id`, `show`, `hide`, and `remove` helpers.
  *
@@ -84,6 +93,6 @@ interface RegisteredDialog<TProps extends object, TDefaultProps extends Partial<
  * });
  * ```
  */
-declare function registerDialog<TProps extends object, TDefaultProps extends Partial<OptionalNiceModalProps<TProps>> = EmptyDialogDefaultProps>(id: string, component: React.FC<TProps>, defaultProps?: TDefaultProps): RegisteredDialog<TProps, TDefaultProps>;
+declare function registerDialog<TProps extends object, TDefaultProps extends Partial<OptionalRegisteredDialogProps<TProps>> = EmptyDialogDefaultProps>(id: string, component: React.FC<TProps>, defaultProps?: TDefaultProps): RegisteredDialog<TProps, TDefaultProps>;
 //#endregion
-export { RegisteredDialog, RegisteredDialogShowProps, registerDialog };
+export { RegisteredDialog, RegisteredDialogInjectedProps, RegisteredDialogShowProps, registerDialog };

package/dist/dialog-provider/register-dialog.d.ts

@@ -3,12 +3,18 @@ import { NiceModalHocProps } from "@ebay/nice-modal-react";
 
 //#region src/dialog-provider/register-dialog.d.ts
 type NiceModalInjectedKeys = keyof NiceModalHocProps;
+type DialogInjectedKeys = 'open' | 'onOpenChange';
+type RegisteredDialogInjectedKeys = NiceModalInjectedKeys | DialogInjectedKeys;
+interface RegisteredDialogInjectedProps {
+  open?: boolean;
+  onOpenChange?: (isOpen: boolean) => void;
+}
 type Pretty<TValue> = { [TKey in keyof TValue]: TValue[TKey] } & {};
-type OptionalNiceModalProps<TProps extends object> = Pretty<Omit<TProps, Extract<keyof TProps, NiceModalInjectedKeys>> & Partial<Pick<TProps, Extract<keyof TProps, NiceModalInjectedKeys>>>>;
+type OptionalRegisteredDialogProps<TProps extends object> = Pretty<Omit<TProps, Extract<keyof TProps, RegisteredDialogInjectedKeys>> & Partial<Pick<TProps, Extract<keyof TProps, RegisteredDialogInjectedKeys>>>>;
 type DefaultedDialogProps<TProps extends object, TDefaultProps extends Partial<TProps>> = Pretty<Omit<TProps, keyof TDefaultProps> & Partial<Pick<TProps, Extract<keyof TProps, keyof TDefaultProps>>>>;
 type EmptyDialogDefaultProps = Record<never, never>;
-type RegisteredDialogShowProps<TProps extends object, TDefaultProps extends Partial<OptionalNiceModalProps<TProps>> = EmptyDialogDefaultProps> = DefaultedDialogProps<OptionalNiceModalProps<TProps>, TDefaultProps>;
-interface RegisteredDialog<TProps extends object, TDefaultProps extends Partial<OptionalNiceModalProps<TProps>> = EmptyDialogDefaultProps> {
+type RegisteredDialogShowProps<TProps extends object, TDefaultProps extends Partial<OptionalRegisteredDialogProps<TProps>> = EmptyDialogDefaultProps> = DefaultedDialogProps<OptionalRegisteredDialogProps<TProps>, TDefaultProps>;
+interface RegisteredDialog<TProps extends object, TDefaultProps extends Partial<OptionalRegisteredDialogProps<TProps>> = EmptyDialogDefaultProps> {
   /**
    * The stable NiceModal id used to register, show, hide, and remove this dialog.
    *
@@ -63,13 +69,16 @@ interface RegisteredDialog<TProps extends object, TDefaultProps extends Partial<
   remove: () => void;
 }
 /**
- * Registers a NiceModal dialog component and returns a typed controller for it.
+ * Registers a dialog component and returns a typed controller for it.
  *
  * Use this when a dialog has a known component and you want type-safe props for
- * default values and `show(...)` calls.
+ * default values and `show(...)` calls. The component is wrapped with
+ * NiceModal automatically, and receives controlled `open` and `onOpenChange`
+ * props.
  *
  * @param id - Stable dialog id used by NiceModal and by generic `showDialog`.
- * @param component - Dialog component, usually created with `NiceModal.create`.
+ * @param component - Dialog component. Use `dialog.create(...)` instead when a
+ * component needs custom NiceModal lifecycle behavior.
  * @param defaultProps - Optional component props registered as defaults.
  * @returns A controller with `id`, `show`, `hide`, and `remove` helpers.
  *
@@ -84,6 +93,6 @@ interface RegisteredDialog<TProps extends object, TDefaultProps extends Partial<
  * });
  * ```
  */
-declare function registerDialog<TProps extends object, TDefaultProps extends Partial<OptionalNiceModalProps<TProps>> = EmptyDialogDefaultProps>(id: string, component: React.FC<TProps>, defaultProps?: TDefaultProps): RegisteredDialog<TProps, TDefaultProps>;
+declare function registerDialog<TProps extends object, TDefaultProps extends Partial<OptionalRegisteredDialogProps<TProps>> = EmptyDialogDefaultProps>(id: string, component: React.FC<TProps>, defaultProps?: TDefaultProps): RegisteredDialog<TProps, TDefaultProps>;
 //#endregion
-export { RegisteredDialog, RegisteredDialogShowProps, registerDialog };
+export { RegisteredDialog, RegisteredDialogInjectedProps, RegisteredDialogShowProps, registerDialog };

package/dist/dialog-provider/register-dialog.js

@@ -1,14 +1,18 @@
-import NiceModal from "@ebay/nice-modal-react";
+import React from "react";
+import NiceModal, { useModal } from "@ebay/nice-modal-react";
 
 //#region src/dialog-provider/register-dialog.ts
 /**
-* Registers a NiceModal dialog component and returns a typed controller for it.
+* Registers a dialog component and returns a typed controller for it.
 *
 * Use this when a dialog has a known component and you want type-safe props for
-* default values and `show(...)` calls.
+* default values and `show(...)` calls. The component is wrapped with
+* NiceModal automatically, and receives controlled `open` and `onOpenChange`
+* props.
 *
 * @param id - Stable dialog id used by NiceModal and by generic `showDialog`.
-* @param component - Dialog component, usually created with `NiceModal.create`.
+* @param component - Dialog component. Use `dialog.create(...)` instead when a
+* component needs custom NiceModal lifecycle behavior.
 * @param defaultProps - Optional component props registered as defaults.
 * @returns A controller with `id`, `show`, `hide`, and `remove` helpers.
 *
@@ -24,7 +28,25 @@ import NiceModal from "@ebay/nice-modal-react";
 * ```
 */
 function registerDialog(id, component, defaultProps) {
-	NiceModal.register(id, component, defaultProps);
+	const WrappedDialog = NiceModal.create((props) => {
+		const modal = useModal();
+		const { open: _open, onOpenChange,...componentProps } = props;
+		const Component = component;
+		const handleClose = (result) => {
+			modal.resolve(result);
+			modal.hide();
+		};
+		return React.createElement(Component, {
+			...componentProps,
+			open: modal.visible,
+			onOpenChange: (isOpen) => {
+				onOpenChange?.(isOpen);
+				if (!isOpen) handleClose("Closed");
+			}
+		});
+	});
+	WrappedDialog.displayName = `RegisteredDialog(${component.displayName ?? component.name ?? id})`;
+	NiceModal.register(id, WrappedDialog, defaultProps);
 	return {
 		id,
 		show: async (props) => NiceModal.show(id, props),

package/dist/file-upload-root/FileUploadRoot.d.cts

@@ -1,11 +1,11 @@
 import { FileUploadRootProps } from "./types.cjs";
-import * as react_jsx_runtime16 from "react/jsx-runtime";
+import * as react_jsx_runtime17 from "react/jsx-runtime";
 
 //#region src/file-upload-root/FileUploadRoot.d.ts
 /**
  * FileUploadInline - An inline file upload component using FileUpload primitives
  */
-declare function FileUploadRoot(props: FileUploadRootProps): react_jsx_runtime16.JSX.Element;
+declare function FileUploadRoot(props: FileUploadRootProps): react_jsx_runtime17.JSX.Element;
 declare namespace FileUploadRoot {
   var displayName: string;
 }

package/dist/index.cjs

@@ -212,6 +212,8 @@ Object.defineProperty(exports, 'ToggleGroupItem', {
   }
 });
 exports.cn = __pixpilot_shadcn.cn;
+exports.confirmDialog = require_confirmation_dialogs.confirmDialog;
+exports.createDialog = require_dialog_registry.createDialog;
 exports.dialog = require_dialog_registry.dialog;
 exports.getId = require_get_id.getId;
 exports.hideDialog = require_dialog_registry.hideDialog;
@@ -225,6 +227,7 @@ exports.toast = require_toast.toast;
 exports.unregisterDialog = require_dialog_registry.unregisterDialog;
 exports.useColorPickerContext = require_color_picker_context.useColorPickerContext;
 exports.useDelayedVisibility = require_use_delayed_visibility.useDelayedVisibility;
+exports.useDialog = require_dialog_registry.useDialog;
 exports.useMediaQuery = require_use_media_query.useMediaQuery;
 exports.useSelectKeyboard = require_use_select_keyboard.useSelectKeyboard;
 exports.useTabsContext = require_TabsContext.useTabsContext;

package/dist/index.d.cts

@@ -35,15 +35,15 @@ import "./ColorPickerBase/index.cjs";
 import { BaseColorSelectProps, ColorSelect, ColorSelectOption } from "./ColorSelect.cjs";
 import { Combobox } from "./Combobox.cjs";
 import { ConfirmationDialogProps, ConfirmationDialogVariant } from "./confirmation-dialog/ConfirmationDialog.cjs";
-import { showConfirmDialog } from "./confirmation-dialog/confirmation-dialogs.cjs";
+import { confirmDialog, showConfirmDialog } from "./confirmation-dialog/confirmation-dialogs.cjs";
 import "./confirmation-dialog/index.cjs";
 import { ContentCard } from "./ContentCard.cjs";
 import { DatePicker, DatePickerProps } from "./DatePicker.cjs";
 import { DialogBody, DialogClose, DialogContent, DialogContentProps, DialogFooter, DialogHeader } from "./dialog/Dialog.cjs";
 import { Dialog, DialogDescription, DialogTitle, DialogTrigger } from "./dialog/index.cjs";
-import { RegisteredDialog, RegisteredDialogShowProps, registerDialog } from "./dialog-provider/register-dialog.cjs";
+import { RegisteredDialog, RegisteredDialogInjectedProps, RegisteredDialogShowProps, registerDialog } from "./dialog-provider/register-dialog.cjs";
 import { ShowDialogProps, showDialog } from "./dialog-provider/show-dialog.cjs";
-import { DialogRegistry, dialog, hideDialog, removeDialog, unregisterDialog } from "./dialog-provider/dialog-registry.cjs";
+import { CreatedDialog, DialogRegistry, createDialog, dialog, hideDialog, removeDialog, unregisterDialog, useDialog } from "./dialog-provider/dialog-registry.cjs";
 import { DialogProvider, DialogProviderProps } from "./dialog-provider/DialogProvider.cjs";
 import "./dialog-provider/index.cjs";
 import { FileUploadRootItem, FileUploadRootItemProps } from "./file-upload-root/FileUploadRootItem.cjs";
@@ -108,4 +108,4 @@ import { ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, T
 import { getId } from "./utils/get-id.cjs";
 import { isSvgMarkupString, svgMarkupToMaskUrl } from "./utils/svg.cjs";
 import { cn } from "@pixpilot/shadcn";
-export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertToastProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonExtended, ButtonExtendedLoaderProps, ButtonExtendedProps, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonProps, COLOR_PICKER_PALETTE_BUTTON_CLASSES, COMMON_COLORS, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerAlphaSlider, ColorPickerArea, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerButton, ColorPickerButtonProps, ColorPickerColorPalette, ColorPickerColorPaletteProps, ColorPickerCompactControls, ColorPickerCompactControlsProps, ColorPickerContent, ColorPickerContentProps, ColorPickerContext, Consumer as ColorPickerContextContextConsumer, Provider as ColorPickerContextContextProvider, ColorPickerContextStates, ColorPickerControls, ColorPickerControlsProps, ColorPickerEyeDropper, ColorPickerFormatControls, ColorPickerFormatControlsProps, ColorPickerFormatInput, ColorPickerFormatInputProps, ColorPickerFormatSelect, ColorPickerFullControls, ColorPickerFullControlsProps, ColorPickerHueSlider, ColorPickerInput, ColorPickerInputProps, ColorPickerPaletteButton, ColorPickerPaletteButtonProps, ColorPickerPaletteSwatch, ColorPickerProps, ColorPickerResetOptions, ColorPickerRoot, ColorPickerRootProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ConfirmationDialogVariant, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogContentProps, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogRegistry, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadCallbacks, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, FileUploadRoot, FileUploadRootItem, FileUploadRootItemProps, FileUploadRootProps, FileUploadRootPropsBaseProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoadingOverlay, LoadingOverlayProps, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverContentUnstyled, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RegisteredDialog, RegisteredDialogShowProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, ShowDialogProps, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputInline, TagsInputInlineItem, TagsInputInlineProps, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastFunction, ToastMessage, Toaster, ToggleButton, ToggleButtonProps, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, UseDelayedVisibilityOptions, UseDelayedVisibilityResult, cn, dialog, getId, hideDialog, isSvgMarkupString, registerDialog, removeDialog, showConfirmDialog, showDialog, svgMarkupToMaskUrl, toast, unregisterDialog, useColorPickerContext, useDelayedVisibility, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertToastProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonExtended, ButtonExtendedLoaderProps, ButtonExtendedProps, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonProps, COLOR_PICKER_PALETTE_BUTTON_CLASSES, COMMON_COLORS, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerAlphaSlider, ColorPickerArea, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerButton, ColorPickerButtonProps, ColorPickerColorPalette, ColorPickerColorPaletteProps, ColorPickerCompactControls, ColorPickerCompactControlsProps, ColorPickerContent, ColorPickerContentProps, ColorPickerContext, Consumer as ColorPickerContextContextConsumer, Provider as ColorPickerContextContextProvider, ColorPickerContextStates, ColorPickerControls, ColorPickerControlsProps, ColorPickerEyeDropper, ColorPickerFormatControls, ColorPickerFormatControlsProps, ColorPickerFormatInput, ColorPickerFormatInputProps, ColorPickerFormatSelect, ColorPickerFullControls, ColorPickerFullControlsProps, ColorPickerHueSlider, ColorPickerInput, ColorPickerInputProps, ColorPickerPaletteButton, ColorPickerPaletteButtonProps, ColorPickerPaletteSwatch, ColorPickerProps, ColorPickerResetOptions, ColorPickerRoot, ColorPickerRootProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ConfirmationDialogVariant, ContentCard, CreatedDialog, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogContentProps, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogRegistry, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadCallbacks, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, FileUploadRoot, FileUploadRootItem, FileUploadRootItemProps, FileUploadRootProps, FileUploadRootPropsBaseProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoadingOverlay, LoadingOverlayProps, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverContentUnstyled, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RegisteredDialog, RegisteredDialogInjectedProps, RegisteredDialogShowProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, ShowDialogProps, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputInline, TagsInputInlineItem, TagsInputInlineProps, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastFunction, ToastMessage, Toaster, ToggleButton, ToggleButtonProps, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, UseDelayedVisibilityOptions, UseDelayedVisibilityResult, cn, confirmDialog, createDialog, dialog, getId, hideDialog, isSvgMarkupString, registerDialog, removeDialog, showConfirmDialog, showDialog, svgMarkupToMaskUrl, toast, unregisterDialog, useColorPickerContext, useDelayedVisibility, useDialog, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/index.d.ts

@@ -35,15 +35,15 @@ import "./ColorPickerBase/index.js";
 import { BaseColorSelectProps, ColorSelect, ColorSelectOption } from "./ColorSelect.js";
 import { Combobox } from "./Combobox.js";
 import { ConfirmationDialogProps, ConfirmationDialogVariant } from "./confirmation-dialog/ConfirmationDialog.js";
-import { showConfirmDialog } from "./confirmation-dialog/confirmation-dialogs.js";
+import { confirmDialog, showConfirmDialog } from "./confirmation-dialog/confirmation-dialogs.js";
 import "./confirmation-dialog/index.js";
 import { ContentCard } from "./ContentCard.js";
 import { DatePicker, DatePickerProps } from "./DatePicker.js";
 import { DialogBody, DialogClose, DialogContent, DialogContentProps, DialogFooter, DialogHeader } from "./dialog/Dialog.js";
 import { Dialog, DialogDescription, DialogTitle, DialogTrigger } from "./dialog/index.js";
-import { RegisteredDialog, RegisteredDialogShowProps, registerDialog } from "./dialog-provider/register-dialog.js";
+import { RegisteredDialog, RegisteredDialogInjectedProps, RegisteredDialogShowProps, registerDialog } from "./dialog-provider/register-dialog.js";
 import { ShowDialogProps, showDialog } from "./dialog-provider/show-dialog.js";
-import { DialogRegistry, dialog, hideDialog, removeDialog, unregisterDialog } from "./dialog-provider/dialog-registry.js";
+import { CreatedDialog, DialogRegistry, createDialog, dialog, hideDialog, removeDialog, unregisterDialog, useDialog } from "./dialog-provider/dialog-registry.js";
 import { DialogProvider, DialogProviderProps } from "./dialog-provider/DialogProvider.js";
 import "./dialog-provider/index.js";
 import { FileUploadRootItem, FileUploadRootItemProps } from "./file-upload-root/FileUploadRootItem.js";
@@ -108,4 +108,4 @@ import { ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, T
 import { getId } from "./utils/get-id.js";
 import { isSvgMarkupString, svgMarkupToMaskUrl } from "./utils/svg.js";
 import { cn } from "@pixpilot/shadcn";
-export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertToastProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonExtended, ButtonExtendedLoaderProps, ButtonExtendedProps, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonProps, COLOR_PICKER_PALETTE_BUTTON_CLASSES, COMMON_COLORS, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerAlphaSlider, ColorPickerArea, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerButton, ColorPickerButtonProps, ColorPickerColorPalette, ColorPickerColorPaletteProps, ColorPickerCompactControls, ColorPickerCompactControlsProps, ColorPickerContent, ColorPickerContentProps, ColorPickerContext, Consumer as ColorPickerContextContextConsumer, Provider as ColorPickerContextContextProvider, ColorPickerContextStates, ColorPickerControls, ColorPickerControlsProps, ColorPickerEyeDropper, ColorPickerFormatControls, ColorPickerFormatControlsProps, ColorPickerFormatInput, ColorPickerFormatInputProps, ColorPickerFormatSelect, ColorPickerFullControls, ColorPickerFullControlsProps, ColorPickerHueSlider, ColorPickerInput, ColorPickerInputProps, ColorPickerPaletteButton, ColorPickerPaletteButtonProps, ColorPickerPaletteSwatch, ColorPickerProps, ColorPickerResetOptions, ColorPickerRoot, ColorPickerRootProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ConfirmationDialogVariant, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogContentProps, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogRegistry, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadCallbacks, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, FileUploadRoot, FileUploadRootItem, FileUploadRootItemProps, FileUploadRootProps, FileUploadRootPropsBaseProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoadingOverlay, LoadingOverlayProps, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverContentUnstyled, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RegisteredDialog, RegisteredDialogShowProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, ShowDialogProps, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputInline, TagsInputInlineItem, TagsInputInlineProps, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastFunction, ToastMessage, Toaster, ToggleButton, ToggleButtonProps, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, UseDelayedVisibilityOptions, UseDelayedVisibilityResult, cn, dialog, getId, hideDialog, isSvgMarkupString, registerDialog, removeDialog, showConfirmDialog, showDialog, svgMarkupToMaskUrl, toast, unregisterDialog, useColorPickerContext, useDelayedVisibility, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertToastProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonExtended, ButtonExtendedLoaderProps, ButtonExtendedProps, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonProps, COLOR_PICKER_PALETTE_BUTTON_CLASSES, COMMON_COLORS, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerAlphaSlider, ColorPickerArea, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerButton, ColorPickerButtonProps, ColorPickerColorPalette, ColorPickerColorPaletteProps, ColorPickerCompactControls, ColorPickerCompactControlsProps, ColorPickerContent, ColorPickerContentProps, ColorPickerContext, Consumer as ColorPickerContextContextConsumer, Provider as ColorPickerContextContextProvider, ColorPickerContextStates, ColorPickerControls, ColorPickerControlsProps, ColorPickerEyeDropper, ColorPickerFormatControls, ColorPickerFormatControlsProps, ColorPickerFormatInput, ColorPickerFormatInputProps, ColorPickerFormatSelect, ColorPickerFullControls, ColorPickerFullControlsProps, ColorPickerHueSlider, ColorPickerInput, ColorPickerInputProps, ColorPickerPaletteButton, ColorPickerPaletteButtonProps, ColorPickerPaletteSwatch, ColorPickerProps, ColorPickerResetOptions, ColorPickerRoot, ColorPickerRootProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ConfirmationDialogVariant, ContentCard, CreatedDialog, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogContentProps, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogRegistry, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadCallbacks, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, FileUploadRoot, FileUploadRootItem, FileUploadRootItemProps, FileUploadRootProps, FileUploadRootPropsBaseProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoadingOverlay, LoadingOverlayProps, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverContentUnstyled, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RegisteredDialog, RegisteredDialogInjectedProps, RegisteredDialogShowProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, ShowDialogProps, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputInline, TagsInputInlineItem, TagsInputInlineProps, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastFunction, ToastMessage, Toaster, ToggleButton, ToggleButtonProps, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, UseDelayedVisibilityOptions, UseDelayedVisibilityResult, cn, confirmDialog, createDialog, dialog, getId, hideDialog, isSvgMarkupString, registerDialog, removeDialog, showConfirmDialog, showDialog, svgMarkupToMaskUrl, toast, unregisterDialog, useColorPickerContext, useDelayedVisibility, useDialog, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/index.js

@@ -36,10 +36,10 @@ import { ColorSelect } from "./ColorSelect.js";
 import { Combobox } from "./Combobox.js";
 import { registerDialog } from "./dialog-provider/register-dialog.js";
 import { showDialog } from "./dialog-provider/show-dialog.js";
-import { dialog, hideDialog, removeDialog, unregisterDialog } from "./dialog-provider/dialog-registry.js";
+import { createDialog, dialog, hideDialog, removeDialog, unregisterDialog, useDialog } from "./dialog-provider/dialog-registry.js";
 import { DialogProvider } from "./dialog-provider/DialogProvider.js";
 import "./dialog-provider/index.js";
-import { showConfirmDialog } from "./confirmation-dialog/confirmation-dialogs.js";
+import { confirmDialog, showConfirmDialog } from "./confirmation-dialog/confirmation-dialogs.js";
 import "./confirmation-dialog/index.js";
 import { ContentCard } from "./ContentCard.js";
 import { DatePicker } from "./DatePicker.js";
@@ -100,4 +100,4 @@ import "./toast/index.js";
 import { ToggleGroup, ToggleGroupItem } from "./ToggleGroup.js";
 import { cn } from "@pixpilot/shadcn";
 
-export { AbsoluteFill, Alert, AvatarUpload, Button, ButtonExtended, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, COLOR_PICKER_PALETTE_BUTTON_CLASSES, COMMON_COLORS, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CircleLoader, CloseButtonAbsolute, CloseButtonRounded, ColorPicker, ColorPickerAlphaSlider, ColorPickerArea, ColorPickerBase, ColorPickerButton, ColorPickerColorPalette, ColorPickerCompactControls, ColorPickerContent, ColorPickerContext, Consumer as ColorPickerContextContextConsumer, Provider as ColorPickerContextContextProvider, ColorPickerControls, ColorPickerEyeDropper, ColorPickerFormatControls, ColorPickerFormatInput, ColorPickerFormatSelect, ColorPickerFullControls, ColorPickerHueSlider, ColorPickerInput, ColorPickerPaletteButton, ColorPickerPaletteSwatch, ColorPickerRoot, ColorSelect, Combobox, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogTitle, DialogTrigger, FileUpload, FileUploadInline, FileUploadRoot, FileUploadRootItem, IconPicker, IconToggle, Input, Layout, LayoutFooter, LayoutHeader, LayoutMain, LoadingOverlay, Pagination, Popover, PopoverAnchor, PopoverContent, PopoverContentUnstyled, PopoverTrigger, Rating, RatingButton, RichTextEditor, ScaledPreview, Select, Slider, SliderInput, SliderSelect, Tabs, TabsContent, TabsContext, TabsList, TabsTrigger, TagsInput, TagsInputInline, ThemeModeDropdown, ThemeModeSwitchInside, ThemeModeSwitchOutside, ThemeModeToggleButton, ThemeProvider, Toaster, ToggleButton, ToggleGroup, ToggleGroupItem, cn, dialog, getId, hideDialog, isSvgMarkupString, registerDialog, removeDialog, showConfirmDialog, showDialog, svgMarkupToMaskUrl, toast, unregisterDialog, useColorPickerContext, useDelayedVisibility, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AvatarUpload, Button, ButtonExtended, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, COLOR_PICKER_PALETTE_BUTTON_CLASSES, COMMON_COLORS, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CircleLoader, CloseButtonAbsolute, CloseButtonRounded, ColorPicker, ColorPickerAlphaSlider, ColorPickerArea, ColorPickerBase, ColorPickerButton, ColorPickerColorPalette, ColorPickerCompactControls, ColorPickerContent, ColorPickerContext, Consumer as ColorPickerContextContextConsumer, Provider as ColorPickerContextContextProvider, ColorPickerControls, ColorPickerEyeDropper, ColorPickerFormatControls, ColorPickerFormatInput, ColorPickerFormatSelect, ColorPickerFullControls, ColorPickerHueSlider, ColorPickerInput, ColorPickerPaletteButton, ColorPickerPaletteSwatch, ColorPickerRoot, ColorSelect, Combobox, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogTitle, DialogTrigger, FileUpload, FileUploadInline, FileUploadRoot, FileUploadRootItem, IconPicker, IconToggle, Input, Layout, LayoutFooter, LayoutHeader, LayoutMain, LoadingOverlay, Pagination, Popover, PopoverAnchor, PopoverContent, PopoverContentUnstyled, PopoverTrigger, Rating, RatingButton, RichTextEditor, ScaledPreview, Select, Slider, SliderInput, SliderSelect, Tabs, TabsContent, TabsContext, TabsList, TabsTrigger, TagsInput, TagsInputInline, ThemeModeDropdown, ThemeModeSwitchInside, ThemeModeSwitchOutside, ThemeModeToggleButton, ThemeProvider, Toaster, ToggleButton, ToggleGroup, ToggleGroupItem, cn, confirmDialog, createDialog, dialog, getId, hideDialog, isSvgMarkupString, registerDialog, removeDialog, showConfirmDialog, showDialog, svgMarkupToMaskUrl, toast, unregisterDialog, useColorPickerContext, useDelayedVisibility, useDialog, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/input/Input.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime17 from "react/jsx-runtime";
+import * as react_jsx_runtime16 from "react/jsx-runtime";
 import { InputProps } from "@pixpilot/shadcn";
 import * as React$1 from "react";
 
@@ -10,6 +10,6 @@ type InputProps$1 = InputProps & {
   prefixClassName?: string;
   suffixClassName?: string;
 };
-declare function Input(props: InputProps$1): react_jsx_runtime17.JSX.Element;
+declare function Input(props: InputProps$1): react_jsx_runtime16.JSX.Element;
 //#endregion
 export { Input, InputProps$1 as InputProps };

package/dist/tags-input/TagsInput.d.cts

@@ -1,5 +1,5 @@
 import { CommandOptionListItem } from "../CommandOptionList.cjs";
-import * as react_jsx_runtime23 from "react/jsx-runtime";
+import * as react_jsx_runtime19 from "react/jsx-runtime";
 
 //#region src/tags-input/TagsInput.d.ts
 interface TagsInputProps {
@@ -59,6 +59,6 @@ declare function TagsInput({
   addOnTab,
   onValidate,
   addButtonVisibility
-}: TagsInputProps): react_jsx_runtime23.JSX.Element;
+}: TagsInputProps): react_jsx_runtime19.JSX.Element;
 //#endregion
 export { TagsInput, TagsInputProps };

package/dist/tags-input/TagsInput.d.ts

@@ -1,5 +1,5 @@
 import { CommandOptionListItem } from "../CommandOptionList.js";
-import * as react_jsx_runtime20 from "react/jsx-runtime";
+import * as react_jsx_runtime19 from "react/jsx-runtime";
 
 //#region src/tags-input/TagsInput.d.ts
 interface TagsInputProps {
@@ -59,6 +59,6 @@ declare function TagsInput({
   addOnTab,
   onValidate,
   addButtonVisibility
-}: TagsInputProps): react_jsx_runtime20.JSX.Element;
+}: TagsInputProps): react_jsx_runtime19.JSX.Element;
 //#endregion
 export { TagsInput, TagsInputProps };

package/dist/tags-input/TagsInputInline.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime22 from "react/jsx-runtime";
+import * as react_jsx_runtime18 from "react/jsx-runtime";
 import { ChangeEventHandler, FocusEventHandler, KeyboardEventHandler, MouseEventHandler, Ref } from "react";
 
 //#region src/tags-input/TagsInputInline.d.ts
@@ -77,6 +77,6 @@ declare function TagsInputInline({
   canAddCurrentValue,
   onAddCurrentInput,
   showClear
-}: TagsInputInlineProps): react_jsx_runtime22.JSX.Element;
+}: TagsInputInlineProps): react_jsx_runtime18.JSX.Element;
 //#endregion
 export { TagsInputInline, TagsInputInlineItem, TagsInputInlineProps };

package/dist/theme-toggle/ThemeModeDropdown.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime19 from "react/jsx-runtime";
+import * as react_jsx_runtime21 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeDropdown.d.ts
 interface ThemeModeDropdownProps {
@@ -18,7 +18,7 @@ interface ThemeModeDropdownProps {
  * Provides Light / Dark / System options.
  * Pure component - requires themeValue and onChange props.
  */
-declare function ThemeModeDropdown(props: ThemeModeDropdownProps): react_jsx_runtime19.JSX.Element;
+declare function ThemeModeDropdown(props: ThemeModeDropdownProps): react_jsx_runtime21.JSX.Element;
 declare namespace ThemeModeDropdown {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeSwitchInside.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime20 from "react/jsx-runtime";
+import * as react_jsx_runtime22 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeSwitchInside.d.ts
 type ThemeModeSwitchInsideSize = 'sm' | 'md' | 'lg';
@@ -26,7 +26,7 @@ interface ThemeModeSwitchInsideProps {
  * Icons are embedded within the switch control.
  * Pure component - requires value and onChange props.
  */
-declare function ThemeModeSwitchInside(props: ThemeModeSwitchInsideProps): react_jsx_runtime20.JSX.Element;
+declare function ThemeModeSwitchInside(props: ThemeModeSwitchInsideProps): react_jsx_runtime22.JSX.Element;
 declare namespace ThemeModeSwitchInside {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeSwitchOutside.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime21 from "react/jsx-runtime";
+import * as react_jsx_runtime23 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeSwitchOutside.d.ts
 interface ThemeModeSwitchOutsideProps {
@@ -23,7 +23,7 @@ interface ThemeModeSwitchOutsideProps {
  * Icons flank the switch control on either side.
  * Pure component - requires value and onChange props.
  */
-declare function ThemeModeSwitchOutside(props: ThemeModeSwitchOutsideProps): react_jsx_runtime21.JSX.Element;
+declare function ThemeModeSwitchOutside(props: ThemeModeSwitchOutsideProps): react_jsx_runtime23.JSX.Element;
 declare namespace ThemeModeSwitchOutside {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeToggleButton.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime18 from "react/jsx-runtime";
+import * as react_jsx_runtime20 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeToggleButton.d.ts
 interface ThemeModeToggleButtonProps {
@@ -14,7 +14,7 @@ interface ThemeModeToggleButtonProps {
  * Light/Dark toggle button.
  * Pure component - toggles between light and dark.
  */
-declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime18.JSX.Element;
+declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime20.JSX.Element;
 declare namespace ThemeModeToggleButton {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeToggleButton.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime19 from "react/jsx-runtime";
+import * as react_jsx_runtime20 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeToggleButton.d.ts
 interface ThemeModeToggleButtonProps {
@@ -14,7 +14,7 @@ interface ThemeModeToggleButtonProps {
  * Light/Dark toggle button.
  * Pure component - toggles between light and dark.
  */
-declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime19.JSX.Element;
+declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime20.JSX.Element;
 declare namespace ThemeModeToggleButton {
   var displayName: string;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pixpilot/shadcn-ui",
   "type": "module",
-  "version": "1.33.0",
+  "version": "1.34.0",
   "description": "Custom UI components and utilities built with shadcn/ui.",
   "author": "m.doaie <m.doaie@hotmail.com>",
   "license": "MIT",