@cerberus-design/react 0.14.2-next-2f75188 → 0.14.2-next-f58c1be

package/build/modern/{chunk-MUTAYS3P.js → chunk-BHB56M7S.js}

@@ -1,18 +1,10 @@
 import {
-  Modal
-} from "./chunk-JIRW4XOJ.js";
-import {
-  ModalDescription
-} from "./chunk-ZL6ZITLA.js";
-import {
-  ModalHeader
-} from "./chunk-NUMM4TNC.js";
-import {
-  ModalHeading
-} from "./chunk-7NN3SJ7W.js";
-import {
-  Portal
-} from "./chunk-IQJDVFPP.js";
+  Dialog,
+  DialogCloseTrigger,
+  DialogDescription,
+  DialogHeading,
+  DialogProvider
+} from "./chunk-TFL56AYR.js";
 import {
   Avatar
 } from "./chunk-GCQMH4QA.js";
@@ -25,12 +17,6 @@ import {
 import {
   Button
 } from "./chunk-EXGKZGML.js";
-import {
-  useModal
-} from "./chunk-KGQG5JGW.js";
-import {
-  trapFocus
-} from "./chunk-JIZQFTW6.js";
 
 // src/context/confirm-modal.tsx
 import {
@@ -42,15 +28,13 @@ import {
   useState
 } from "react";
 import { css } from "@cerberus/styled-system/css";
-import { hstack } from "@cerberus/styled-system/patterns";
 import { HStack, VStack } from "@cerberus/styled-system/jsx";
 import { jsx, jsxs } from "react/jsx-runtime";
 var ConfirmModalContext = createContext(null);
 function ConfirmModal(props) {
-  const { modalRef, show, close } = useModal();
-  const resolveRef = useRef(null);
+  const [open, setOpen] = useState(false);
   const [content, setContent] = useState(null);
-  const focusTrap = trapFocus(modalRef);
+  const resolveRef = useRef(null);
   const kind = content?.kind ?? "non-destructive";
   const { icons } = useCerberusContext();
   const { confirmModal: ConfirmIcon } = icons;
@@ -65,19 +49,19 @@ function ConfirmModal(props) {
         resolveRef.current?.(true);
       }
       resolveRef.current?.(false);
-      close();
+      setOpen(false);
     },
-    [close]
+    [setOpen]
   );
   const handleShow = useCallback(
     (options) => {
       return new Promise((resolve) => {
         setContent({ ...options });
-        show();
+        setOpen(true);
         resolveRef.current = resolve;
       });
     },
-    [show]
+    [setOpen, setContent]
   );
   const value = useMemo(
     () => ({
@@ -87,15 +71,15 @@ function ConfirmModal(props) {
   );
   return /* @__PURE__ */ jsxs(ConfirmModalContext.Provider, { value, children: [
     props.children,
-    /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Modal, { onKeyDown: focusTrap, ref: modalRef, children: /* @__PURE__ */ jsxs(VStack, { gap: "xl", w: "full", children: [
-      /* @__PURE__ */ jsxs(ModalHeader, { children: [
+    /* @__PURE__ */ jsx(DialogProvider, { open, onOpenChange: (e) => setOpen(e.open), children: /* @__PURE__ */ jsx(Dialog, { size: "sm", children: /* @__PURE__ */ jsxs(VStack, { gap: "xl", w: "full", children: [
+      /* @__PURE__ */ jsxs(VStack, { alignItems: "flex-start", gap: "md", w: "full", children: [
         /* @__PURE__ */ jsx(
-          "div",
+          HStack,
           {
-            className: hstack({
-              justify: "center",
-              w: "full"
-            }),
+            alignSelf: "center",
+            justify: "center",
+            paddingBlockEnd: "md",
+            w: "full",
             children: /* @__PURE__ */ jsx(
               Show,
               {
@@ -122,8 +106,8 @@ function ConfirmModal(props) {
             )
           }
         ),
-        /* @__PURE__ */ jsx(ModalHeading, { children: content?.heading }),
-        /* @__PURE__ */ jsx(ModalDescription, { children: content?.description })
+        /* @__PURE__ */ jsx(DialogHeading, { children: content?.heading }),
+        /* @__PURE__ */ jsx(DialogDescription, { children: content?.description })
       ] }),
       /* @__PURE__ */ jsxs(HStack, { gap: "4", w: "full", children: [
         /* @__PURE__ */ jsx(
@@ -140,7 +124,7 @@ function ConfirmModal(props) {
             children: content?.actionText
           }
         ),
-        /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx(DialogCloseTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
           Button,
           {
             className: css({
@@ -152,7 +136,7 @@ function ConfirmModal(props) {
             value: "false",
             children: content?.cancelText
           }
-        )
+        ) })
       ] })
     ] }) }) })
   ] });
@@ -171,4 +155,4 @@ export {
   ConfirmModal,
   useConfirmModal
 };
-//# sourceMappingURL=chunk-MUTAYS3P.js.map
+//# sourceMappingURL=chunk-BHB56M7S.js.map

package/build/modern/chunk-BHB56M7S.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/context/confirm-modal.tsx"],"sourcesContent":["'use client'\n\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useMemo,\n  useRef,\n  useState,\n  type MouseEvent,\n  type PropsWithChildren,\n  type ReactNode,\n} from 'react'\nimport { Button } from '../components/Button'\nimport { css } from '@cerberus/styled-system/css'\nimport { Show } from '../components/Show'\nimport { Avatar } from '../components/Avatar'\nimport { HStack, VStack } from '@cerberus/styled-system/jsx'\nimport { useCerberusContext } from './cerberus'\nimport {\n  Dialog,\n  DialogCloseTrigger,\n  DialogDescription,\n  DialogHeading,\n  DialogProvider,\n} from '../components/Dialog'\n\n/**\n * This module provides a context and hook for the confirm modal.\n * @module\n */\n\nexport interface BaseConfirmOptions {\n  /**\n   * The heading of the confirm modal.\n   */\n  heading: string\n  /**\n   * The text for the action button.\n   */\n  actionText: string\n  /**\n   * The text for the cancel button.\n   */\n  cancelText: string\n}\n\nexport interface DestructiveConfirmOptions extends BaseConfirmOptions {\n  /**\n   * The kind of confirm modal to show.\n   */\n  kind?: 'destructive'\n  /**\n   * The description of the confirm modal. Can only be a string for destructive confirm modals.\n   */\n  description?: string\n}\n\nexport interface NonDestructiveConfirmModalOptions extends BaseConfirmOptions {\n  /**\n   * The kind of confirm modal to show.\n   * @default 'non-destructive'\n   */\n  kind?: 'non-destructive'\n  /**\n   * The description of the confirm modal. Can be a ReactNode for non-destructive kind if you need to display text links.\n   * @example\n   * ```tsx\n   * description: <>Use a Fragment because we put the content within a Paragraph tag.</>\n   */\n  description?: ReactNode\n}\n\nexport type ShowConfirmModalOptions =\n  | NonDestructiveConfirmModalOptions\n  | DestructiveConfirmOptions\n\nexport type ShowResult =\n  | ((value: boolean | PromiseLike<boolean>) => void)\n  | null\n\nexport interface ConfirmModalValue {\n  show: (options: ShowConfirmModalOptions) => Promise<boolean>\n}\n\nconst ConfirmModalContext = createContext<ConfirmModalValue | null>(null)\n\nexport type ConfirmModalProviderProps = PropsWithChildren<unknown>\n\n/**\n * Provides a confirm modal to the app.\n * @see https://cerberus.digitalu.design/react/confirm-modal\n * @example\n * ```tsx\n * // Wrap the Provider around the root of the feature.\n * <ConfirmModal>\n *   <SomeFeatureSection />\n * </ConfirmModal>\n *\n * // Use the hook to show the confirm modal.\n * const confirm = useConfirmModal()\n *\n * const handleClick = useCallback(async () => {\n *  const userConsent = await confirm.show({\n *   heading: 'Add new payment method?',\n *  description:\n *   'This will add a new payment method to your account to be billed for future purchases.',\n * actionText: 'Yes, add payment method',\n * cancelText: 'No, cancel',\n * })\n * setConsent(userConsent)\n * }, [confirm])\n * ```\n */\nexport function ConfirmModal(\n  props: PropsWithChildren<ConfirmModalProviderProps>,\n) {\n  const [open, setOpen] = useState<boolean>(false)\n  const [content, setContent] = useState<ShowConfirmModalOptions | null>(null)\n  const resolveRef = useRef<ShowResult>(null)\n  const kind = content?.kind ?? 'non-destructive'\n\n  const { icons } = useCerberusContext()\n  const { confirmModal: ConfirmIcon } = icons\n\n  const palette = useMemo(\n    () => (kind === 'destructive' ? 'danger' : 'action'),\n    [kind],\n  )\n\n  const handleChoice = useCallback(\n    (e: MouseEvent<HTMLButtonElement>) => {\n      const target = e.currentTarget as HTMLButtonElement\n      if (target.value === 'true') {\n        resolveRef.current?.(true)\n      }\n      resolveRef.current?.(false)\n      setOpen(false)\n    },\n    [setOpen],\n  )\n\n  const handleShow = useCallback(\n    (options: ShowConfirmModalOptions) => {\n      return new Promise<boolean>((resolve) => {\n        setContent({ ...options })\n        setOpen(true)\n        resolveRef.current = resolve\n      })\n    },\n    [setOpen, setContent],\n  )\n\n  const value = useMemo(\n    () => ({\n      show: handleShow,\n    }),\n    [handleShow],\n  )\n\n  return (\n    <ConfirmModalContext.Provider value={value}>\n      {props.children}\n\n      <DialogProvider open={open} onOpenChange={(e) => setOpen(e.open)}>\n        <Dialog size=\"sm\">\n          <VStack gap=\"xl\" w=\"full\">\n            <VStack alignItems=\"flex-start\" gap=\"md\" w=\"full\">\n              <HStack\n                alignSelf=\"center\"\n                justify=\"center\"\n                paddingBlockEnd=\"md\"\n                w=\"full\"\n              >\n                <Show\n                  when={palette === 'danger'}\n                  fallback={\n                    <Avatar\n                      ariaLabel=\"\"\n                      gradient=\"charon-light\"\n                      icon={<ConfirmIcon size={24} />}\n                      src=\"\"\n                    />\n                  }\n                >\n                  <Avatar\n                    ariaLabel=\"\"\n                    gradient=\"hades-dark\"\n                    icon={<ConfirmIcon size={24} />}\n                    src=\"\"\n                  />\n                </Show>\n              </HStack>\n              <DialogHeading>{content?.heading}</DialogHeading>\n              <DialogDescription>{content?.description}</DialogDescription>\n            </VStack>\n\n            <HStack gap=\"4\" w=\"full\">\n              <Button\n                autoFocus\n                className={css({\n                  w: '1/2',\n                })}\n                name=\"confirm\"\n                onClick={handleChoice}\n                palette={palette}\n                value=\"true\"\n              >\n                {content?.actionText}\n              </Button>\n              <DialogCloseTrigger asChild>\n                <Button\n                  className={css({\n                    w: '1/2',\n                  })}\n                  name=\"cancel\"\n                  onClick={handleChoice}\n                  usage=\"outlined\"\n                  value=\"false\"\n                >\n                  {content?.cancelText}\n                </Button>\n              </DialogCloseTrigger>\n            </HStack>\n          </VStack>\n        </Dialog>\n      </DialogProvider>\n    </ConfirmModalContext.Provider>\n  )\n}\n\nexport function useConfirmModal(): ConfirmModalValue {\n  const context = useContext(ConfirmModalContext)\n  if (context === null) {\n    throw new Error(\n      'useConfirmModal must be used within a ConfirmModal Provider',\n    )\n  }\n  return context\n}\n"],"mappings":"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","names":[]}

package/build/modern/{chunk-R4RFWDBM.js → chunk-FGCO27TC.js}

@@ -1,21 +1,12 @@
 import {
-  Modal
-} from "./chunk-JIRW4XOJ.js";
+  DialogCloseIconTrigger
+} from "./chunk-6BN3XKQF.js";
 import {
-  ModalDescription
-} from "./chunk-ZL6ZITLA.js";
-import {
-  ModalHeader
-} from "./chunk-NUMM4TNC.js";
-import {
-  ModalHeading
-} from "./chunk-7NN3SJ7W.js";
-import {
-  IconButton
-} from "./chunk-APD6IX5R.js";
-import {
-  Portal
-} from "./chunk-IQJDVFPP.js";
+  Dialog,
+  DialogDescription,
+  DialogHeading,
+  DialogProvider
+} from "./chunk-TFL56AYR.js";
 import {
   Avatar
 } from "./chunk-GCQMH4QA.js";
@@ -28,12 +19,6 @@ import {
 import {
   Button
 } from "./chunk-EXGKZGML.js";
-import {
-  useModal
-} from "./chunk-KGQG5JGW.js";
-import {
-  trapFocus
-} from "./chunk-JIZQFTW6.js";
 
 // src/context/cta-modal.tsx
 import {
@@ -49,12 +34,11 @@ import { VStack } from "@cerberus/styled-system/jsx";
 import { jsx, jsxs } from "react/jsx-runtime";
 var CTAModalContext = createContext(null);
 function CTAModal(props) {
-  const { modalRef, show, close } = useModal();
+  const [open, setOpen] = useState(false);
   const [content, setContent] = useState(null);
-  const focusTrap = trapFocus(modalRef);
   const confirmIcon = content?.icon;
   const { icons } = useCerberusContext();
-  const { close: CloseIcon, confirmModal: FallbackIcon } = icons;
+  const { confirmModal: FallbackIcon } = icons;
   const handleShow = useCallback(
     (options) => {
       const maxActions = 2;
@@ -64,9 +48,9 @@ function CTAModal(props) {
         );
       }
       setContent({ ...options });
-      show();
+      setOpen(true);
     },
-    [show]
+    [setOpen]
   );
   const handleActionClick = useCallback(
     (event) => {
@@ -74,9 +58,9 @@ function CTAModal(props) {
       const action = content?.actions[Number(index)];
       const { onClick } = action || {};
       onClick?.(event);
-      close();
+      setOpen(false);
     },
-    [content, close]
+    [content, setOpen]
   );
   const value = useMemo(
     () => ({
@@ -86,22 +70,10 @@ function CTAModal(props) {
   );
   return /* @__PURE__ */ jsxs(CTAModalContext.Provider, { value, children: [
     props.children,
-    /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsxs(Modal, { onKeyDown: focusTrap, ref: modalRef, children: [
-      /* @__PURE__ */ jsx(
-        "span",
-        {
-          className: css({
-            padding: "md",
-            position: "absolute",
-            right: 0,
-            top: 0,
-            zIndex: "decorator"
-          }),
-          children: /* @__PURE__ */ jsx(IconButton, { ariaLabel: "Close modal", onClick: close, children: /* @__PURE__ */ jsx(CloseIcon, {}) })
-        }
-      ),
+    /* @__PURE__ */ jsx(DialogProvider, { open, onOpenChange: (e) => setOpen(e.open), children: /* @__PURE__ */ jsxs(Dialog, { size: "sm", children: [
+      /* @__PURE__ */ jsx(DialogCloseIconTrigger, {}),
       /* @__PURE__ */ jsxs(VStack, { gap: "xl", w: "full", children: [
-        /* @__PURE__ */ jsx(ModalHeader, { children: /* @__PURE__ */ jsxs(VStack, { gap: "lg", w: "full", children: [
+        /* @__PURE__ */ jsx(VStack, { alignItems: "flex-start", gap: "md", w: "full", children: /* @__PURE__ */ jsxs(VStack, { gap: "lg", w: "full", children: [
           /* @__PURE__ */ jsx(
             Avatar,
             {
@@ -118,8 +90,8 @@ function CTAModal(props) {
               src: ""
             }
           ),
-          /* @__PURE__ */ jsx(ModalHeading, { children: content?.heading }),
-          /* @__PURE__ */ jsx(ModalDescription, { children: content?.description })
+          /* @__PURE__ */ jsx(DialogHeading, { children: content?.heading }),
+          /* @__PURE__ */ jsx(DialogDescription, { children: content?.description })
         ] }) }),
         /* @__PURE__ */ jsx(HStack, { gap: "md", w: "full", children: /* @__PURE__ */ jsx(Show, { when: Boolean(content?.actions?.length), children: content?.actions?.map((action, index) => /* @__PURE__ */ jsx(
           Button,
@@ -151,4 +123,4 @@ export {
   CTAModal,
   useCTAModal
 };
-//# sourceMappingURL=chunk-R4RFWDBM.js.map
+//# sourceMappingURL=chunk-FGCO27TC.js.map

package/build/modern/chunk-FGCO27TC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/context/cta-modal.tsx"],"sourcesContent":["'use client'\n\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useMemo,\n  useState,\n  type MouseEvent,\n  type MouseEventHandler,\n  type PropsWithChildren,\n  type ReactNode,\n} from 'react'\nimport { Button } from '../components/Button'\nimport { Show } from '../components/Show'\nimport { Avatar } from '../components/Avatar'\nimport { useCerberusContext } from './cerberus'\nimport { HStack } from '@cerberus/styled-system/jsx'\nimport { css } from '@cerberus/styled-system/css'\nimport { VStack } from '@cerberus/styled-system/jsx'\nimport {\n  Dialog,\n  DialogDescription,\n  DialogHeading,\n  DialogProvider,\n} from '../components/Dialog'\nimport { DialogCloseIconTrigger } from '../components/Dialog.client'\n\n/**\n * This module provides a context and hook for the cta modal.\n * @module\n */\n\nexport interface ShowCTAModalOptions {\n  /**\n   * The heading of the cta modal.\n   */\n  heading: string\n  /**\n   * The description of the cta modal.\n   */\n  description?: string\n  /**\n   * The icon used for the modal Avatar.\n   */\n  icon?: ReactNode\n  /**\n   * The actions for the cta modal. Max of 2 actions.\n   */\n  actions: {\n    text: string\n    onClick: MouseEventHandler<HTMLButtonElement>\n  }[]\n}\n\nexport interface CTAModalValue {\n  show: (options: ShowCTAModalOptions) => void\n}\n\nconst CTAModalContext = createContext<CTAModalValue | null>(null)\n\nexport type CTAModalProviderProps = PropsWithChildren<unknown>\n\n/**\n * Provides a CTA modal to the app.\n * @see https://cerberus.digitalu.design/react/cta-modal\n * @example\n * ```tsx\n * // Wrap the Provider around the root of the feature.\n * <CTAModal>\n *   <SomeFeatureSection />\n * </CTAModal>\n *\n * // Use the hook to show the cta modal.\n * const cta = useCTAModal()\n *\n * const handleClick = useCallback(async () => {\n *  const userConsent = await cta.show({\n *   heading: 'Create or copy a Cohort',\n *  description:\n *   'Create a new cohort or copy and existing one.',\n *  icon: <Copy size={24} />,\n *  actions: [\n *  {\n *   text: 'Create Cohort',\n *   onClick: () => {},\n *  {\n *   text: 'Copy Cohort',\n *   onClick: () => {}\n *  }\n * })\n * setConsent(userConsent)\n * }, [cta])\n * ```\n */\nexport function CTAModal(props: PropsWithChildren<CTAModalProviderProps>) {\n  const [open, setOpen] = useState<boolean>(false)\n  const [content, setContent] = useState<ShowCTAModalOptions | null>(null)\n  const confirmIcon = content?.icon\n\n  const { icons } = useCerberusContext()\n  const { confirmModal: FallbackIcon } = icons\n\n  const handleShow = useCallback(\n    (options: ShowCTAModalOptions) => {\n      const maxActions = 2\n      if (options.actions.length > maxActions) {\n        throw new Error(\n          `CTA Modal only supports a maximum of ${maxActions} actions.`,\n        )\n      }\n      setContent({ ...options })\n      setOpen(true)\n    },\n    [setOpen],\n  )\n\n  const handleActionClick = useCallback(\n    (event: MouseEvent<HTMLButtonElement>) => {\n      const index = event.currentTarget.getAttribute('data-index')\n      const action = content?.actions[Number(index)]\n      const { onClick } = action || {}\n      onClick?.(event)\n      setOpen(false)\n    },\n    [content, setOpen],\n  )\n\n  const value = useMemo(\n    () => ({\n      show: handleShow,\n    }),\n    [handleShow],\n  )\n\n  return (\n    <CTAModalContext.Provider value={value}>\n      {props.children}\n\n      <DialogProvider open={open} onOpenChange={(e) => setOpen(e.open)}>\n        <Dialog size=\"sm\">\n          <DialogCloseIconTrigger />\n\n          <VStack gap=\"xl\" w=\"full\">\n            <VStack alignItems=\"flex-start\" gap=\"md\" w=\"full\">\n              <VStack gap=\"lg\" w=\"full\">\n                <Avatar\n                  ariaLabel=\"\"\n                  gradient=\"charon-light\"\n                  icon={\n                    <Show\n                      when={Boolean(confirmIcon)}\n                      fallback={<FallbackIcon size={24} />}\n                    >\n                      {confirmIcon}\n                    </Show>\n                  }\n                  src=\"\"\n                />\n                <DialogHeading>{content?.heading}</DialogHeading>\n                <DialogDescription>{content?.description}</DialogDescription>\n              </VStack>\n            </VStack>\n\n            <HStack gap=\"md\" w=\"full\">\n              <Show when={Boolean(content?.actions?.length)}>\n                {content?.actions?.map((action, index) => (\n                  <Button\n                    data-index={index}\n                    className={css({\n                      w: '1/2',\n                    })}\n                    key={index}\n                    onClick={handleActionClick}\n                    shape=\"rounded\"\n                    usage=\"outlined\"\n                  >\n                    {action.text}\n                  </Button>\n                ))}\n              </Show>\n            </HStack>\n          </VStack>\n        </Dialog>\n      </DialogProvider>\n    </CTAModalContext.Provider>\n  )\n}\n\nexport function useCTAModal(): CTAModalValue {\n  const context = useContext(CTAModalContext)\n  if (context === null) {\n    throw new Error('useCTAModal must be used within a CTAModal Provider')\n  }\n  return context\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAEA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAKK;AAKP,SAAS,cAAc;AACvB,SAAS,WAAW;AACpB,SAAS,cAAc;AA0Hb,cAII,YAJJ;AAlFV,IAAM,kBAAkB,cAAoC,IAAI;AAoCzD,SAAS,SAAS,OAAiD;AACxE,QAAM,CAAC,MAAM,OAAO,IAAI,SAAkB,KAAK;AAC/C,QAAM,CAAC,SAAS,UAAU,IAAI,SAAqC,IAAI;AACvE,QAAM,cAAc,SAAS;AAE7B,QAAM,EAAE,MAAM,IAAI,mBAAmB;AACrC,QAAM,EAAE,cAAc,aAAa,IAAI;AAEvC,QAAM,aAAa;AAAA,IACjB,CAAC,YAAiC;AAChC,YAAM,aAAa;AACnB,UAAI,QAAQ,QAAQ,SAAS,YAAY;AACvC,cAAM,IAAI;AAAA,UACR,wCAAwC,UAAU;AAAA,QACpD;AAAA,MACF;AACA,iBAAW,EAAE,GAAG,QAAQ,CAAC;AACzB,cAAQ,IAAI;AAAA,IACd;AAAA,IACA,CAAC,OAAO;AAAA,EACV;AAEA,QAAM,oBAAoB;AAAA,IACxB,CAAC,UAAyC;AACxC,YAAM,QAAQ,MAAM,cAAc,aAAa,YAAY;AAC3D,YAAM,SAAS,SAAS,QAAQ,OAAO,KAAK,CAAC;AAC7C,YAAM,EAAE,QAAQ,IAAI,UAAU,CAAC;AAC/B,gBAAU,KAAK;AACf,cAAQ,KAAK;AAAA,IACf;AAAA,IACA,CAAC,SAAS,OAAO;AAAA,EACnB;AAEA,QAAM,QAAQ;AAAA,IACZ,OAAO;AAAA,MACL,MAAM;AAAA,IACR;AAAA,IACA,CAAC,UAAU;AAAA,EACb;AAEA,SACE,qBAAC,gBAAgB,UAAhB,EAAyB,OACvB;AAAA,UAAM;AAAA,IAEP,oBAAC,kBAAe,MAAY,cAAc,CAAC,MAAM,QAAQ,EAAE,IAAI,GAC7D,+BAAC,UAAO,MAAK,MACX;AAAA,0BAAC,0BAAuB;AAAA,MAExB,qBAAC,UAAO,KAAI,MAAK,GAAE,QACjB;AAAA,4BAAC,UAAO,YAAW,cAAa,KAAI,MAAK,GAAE,QACzC,+BAAC,UAAO,KAAI,MAAK,GAAE,QACjB;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,WAAU;AAAA,cACV,UAAS;AAAA,cACT,MACE;AAAA,gBAAC;AAAA;AAAA,kBACC,MAAM,QAAQ,WAAW;AAAA,kBACzB,UAAU,oBAAC,gBAAa,MAAM,IAAI;AAAA,kBAEjC;AAAA;AAAA,cACH;AAAA,cAEF,KAAI;AAAA;AAAA,UACN;AAAA,UACA,oBAAC,iBAAe,mBAAS,SAAQ;AAAA,UACjC,oBAAC,qBAAmB,mBAAS,aAAY;AAAA,WAC3C,GACF;AAAA,QAEA,oBAAC,UAAO,KAAI,MAAK,GAAE,QACjB,8BAAC,QAAK,MAAM,QAAQ,SAAS,SAAS,MAAM,GACzC,mBAAS,SAAS,IAAI,CAAC,QAAQ,UAC9B;AAAA,UAAC;AAAA;AAAA,YACC,cAAY;AAAA,YACZ,WAAW,IAAI;AAAA,cACb,GAAG;AAAA,YACL,CAAC;AAAA,YAED,SAAS;AAAA,YACT,OAAM;AAAA,YACN,OAAM;AAAA,YAEL,iBAAO;AAAA;AAAA,UALH;AAAA,QAMP,CACD,GACH,GACF;AAAA,SACF;AAAA,OACF,GACF;AAAA,KACF;AAEJ;AAEO,SAAS,cAA6B;AAC3C,QAAM,UAAU,WAAW,eAAe;AAC1C,MAAI,YAAY,MAAM;AACpB,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AACA,SAAO;AACT;","names":[]}

package/build/modern/{chunk-VGEK2DQB.js → chunk-SD3OVTHT.js}

@@ -1,15 +1,6 @@
 import {
-  Modal
-} from "./chunk-JIRW4XOJ.js";
-import {
-  ModalDescription
-} from "./chunk-ZL6ZITLA.js";
-import {
-  ModalHeader
-} from "./chunk-NUMM4TNC.js";
-import {
-  ModalHeading
-} from "./chunk-7NN3SJ7W.js";
+  Text
+} from "./chunk-RU5LOXWI.js";
 import {
   Input
 } from "./chunk-MZ3UCDUL.js";
@@ -20,8 +11,11 @@ import {
   Field
 } from "./chunk-UZDVOIW5.js";
 import {
-  Portal
-} from "./chunk-IQJDVFPP.js";
+  Dialog,
+  DialogDescription,
+  DialogHeading,
+  DialogProvider
+} from "./chunk-TFL56AYR.js";
 import {
   Avatar
 } from "./chunk-GCQMH4QA.js";
@@ -34,12 +28,6 @@ import {
 import {
   Button
 } from "./chunk-EXGKZGML.js";
-import {
-  useModal
-} from "./chunk-KGQG5JGW.js";
-import {
-  trapFocus
-} from "./chunk-JIZQFTW6.js";
 
 // src/context/prompt-modal.tsx
 import {
@@ -51,15 +39,16 @@ import {
   useState
 } from "react";
 import { css } from "@cerberus/styled-system/css";
-import { hstack, vstack } from "@cerberus/styled-system/patterns";
+import { hstack } from "@cerberus/styled-system/patterns";
+import { HStack, VStack } from "@cerberus/styled-system/jsx";
+import { DialogCloseTrigger } from "@ark-ui/react";
 import { jsx, jsxs } from "react/jsx-runtime";
 var PromptModalContext = createContext(null);
 function PromptModal(props) {
-  const { modalRef, show, close } = useModal();
   const resolveRef = useRef(null);
+  const [open, setOpen] = useState(false);
   const [content, setContent] = useState(null);
   const [inputValue, setInputValue] = useState("");
-  const focusTrap = trapFocus(modalRef);
   const { icons } = useCerberusContext();
   const { promptModal: PromptIcon } = icons;
   const isValid = useMemo(
@@ -82,19 +71,19 @@ function PromptModal(props) {
       if (target.value === "true") {
         resolveRef.current?.(inputValue);
       }
-      close();
+      setOpen(false);
     },
-    [inputValue, close]
+    [inputValue, setOpen]
   );
   const handleShow = useCallback(
     (options) => {
       return new Promise((resolve) => {
         setContent({ ...options, kind: options.kind || "non-destructive" });
-        show();
+        setOpen(true);
         resolveRef.current = resolve;
       });
     },
-    [show]
+    [setOpen]
   );
   const value = useMemo(
     () => ({
@@ -104,15 +93,15 @@ function PromptModal(props) {
   );
   return /* @__PURE__ */ jsxs(PromptModalContext.Provider, { value, children: [
     props.children,
-    /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsxs(Modal, { onKeyDown: focusTrap, ref: modalRef, children: [
-      /* @__PURE__ */ jsxs(ModalHeader, { children: [
+    /* @__PURE__ */ jsx(DialogProvider, { open, onOpenChange: (e) => setOpen(e.open), children: /* @__PURE__ */ jsx(Dialog, { size: "sm", children: /* @__PURE__ */ jsxs(VStack, { gap: "xl", w: "full", children: [
+      /* @__PURE__ */ jsxs(VStack, { alignItems: "flex-start", gap: "md", w: "full", children: [
         /* @__PURE__ */ jsx(
-          "div",
+          HStack,
           {
-            className: hstack({
-              justify: "center",
-              w: "full"
-            }),
+            alignSelf: "center",
+            justify: "center",
+            paddingBlockEnd: "md",
+            w: "full",
             children: /* @__PURE__ */ jsx(
               Show,
               {
@@ -139,38 +128,29 @@ function PromptModal(props) {
             )
           }
         ),
-        /* @__PURE__ */ jsx(ModalHeading, { children: content?.heading }),
-        /* @__PURE__ */ jsx(ModalDescription, { children: content?.description })
+        /* @__PURE__ */ jsx(DialogHeading, { children: content?.heading }),
+        /* @__PURE__ */ jsx(DialogDescription, { children: content?.description })
       ] }),
       /* @__PURE__ */ jsx(
-        "div",
+        VStack,
         {
-          className: vstack({
-            alignItems: "flex-start",
-            mt: "4",
-            mb: "8"
-          }),
+          alignItems: "flex-start",
+          marginBlockStart: "md",
+          marginBlockEnd: "lg",
+          w: "full",
           children: /* @__PURE__ */ jsxs(Field, { invalid: !isValid, children: [
             /* @__PURE__ */ jsxs(
               Label,
               {
-                className: css({
-                  gap: 1,
-                  justifyContent: "flex-start"
+                className: hstack({
+                  gap: "xs",
+                  justify: "flex-start !important"
                 }),
                 htmlFor: "confirm",
                 size: "md",
                 children: [
                   "Type",
-                  /* @__PURE__ */ jsx(
-                    "strong",
-                    {
-                      className: css({
-                        textTransform: "uppercase"
-                      }),
-                      children: content?.key
-                    }
-                  ),
+                  /* @__PURE__ */ jsx(Text, { as: "strong", textTransform: "uppercase", children: content?.key }),
                   "to confirm"
                 ]
               }
@@ -187,46 +167,37 @@ function PromptModal(props) {
           ] })
         }
       ),
-      /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: hstack({
-            justifyContent: "stretch",
-            gap: "4"
-          }),
-          children: [
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                autoFocus: true,
-                className: css({
-                  w: "1/2"
-                }),
-                disabled: !isValid,
-                name: "confirm",
-                onClick: handleChoice,
-                palette,
-                value: "true",
-                children: content?.actionText
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                className: css({
-                  w: "1/2"
-                }),
-                name: "cancel",
-                onClick: handleChoice,
-                usage: "outlined",
-                value: "false",
-                children: content?.cancelText
-              }
-            )
-          ]
-        }
-      )
-    ] }) })
+      /* @__PURE__ */ jsxs(HStack, { gap: "md", justify: "stretch", w: "full", children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            autoFocus: true,
+            className: css({
+              w: "1/2"
+            }),
+            disabled: !isValid,
+            name: "confirm",
+            onClick: handleChoice,
+            palette,
+            value: "true",
+            children: content?.actionText
+          }
+        ),
+        /* @__PURE__ */ jsx(DialogCloseTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+          Button,
+          {
+            className: css({
+              w: "1/2"
+            }),
+            name: "cancel",
+            onClick: handleChoice,
+            usage: "outlined",
+            value: "false",
+            children: content?.cancelText
+          }
+        ) })
+      ] })
+    ] }) }) })
   ] });
 }
 function usePromptModal() {
@@ -241,4 +212,4 @@ export {
   PromptModal,
   usePromptModal
 };
-//# sourceMappingURL=chunk-VGEK2DQB.js.map
+//# sourceMappingURL=chunk-SD3OVTHT.js.map

package/build/modern/chunk-SD3OVTHT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/context/prompt-modal.tsx"],"sourcesContent":["'use client'\n\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useMemo,\n  useRef,\n  useState,\n  type ChangeEvent,\n  type MouseEvent,\n  type PropsWithChildren,\n} from 'react'\nimport { Button } from '../components/Button'\nimport { css } from '@cerberus/styled-system/css'\nimport { hstack } from '@cerberus/styled-system/patterns'\nimport { Input } from '../components/Input'\nimport { Field } from './field'\nimport { Label } from '../components/Label'\nimport { Show } from '../components/Show'\nimport { Avatar } from '../components/Avatar'\nimport { Text } from '../components/Text'\nimport { useCerberusContext } from './cerberus'\nimport {\n  Dialog,\n  DialogDescription,\n  DialogHeading,\n  DialogProvider,\n} from '../components/Dialog'\nimport { HStack, VStack } from '@cerberus/styled-system/jsx'\nimport { DialogCloseTrigger } from '@ark-ui/react'\n\n/**\n * This module provides a context and hook for the prompt modal.\n * @module PromptModal\n */\n\nexport interface ShowPromptModalOptions {\n  /**\n   * The kind of prompt modal to show.\n   * @default 'non-destructive'\n   */\n  kind?: 'destructive' | 'non-destructive'\n  /**\n   * The heading of the prompt modal.\n   */\n  heading: string\n  /**\n   * The description of the prompt modal.\n   */\n  description?: string\n  /**\n   * The key to confirm the action.\n   */\n  key: string\n  /**\n   * The text for the action button.\n   */\n  actionText: string\n  /**\n   * The text for the cancel button.\n   */\n  cancelText: string\n}\nexport type PromptShowResult =\n  | ((value: string | PromiseLike<string>) => void)\n  | null\n\nexport interface PromptModalValue {\n  /**\n   * The method to trigger the prompt modal.\n   * @returns the value of the key if the action is confirmed.\n   * @example\n   * ```tsx\n   * const accepted = await prompt.show({\n   *  kind: 'destructive',\n   *  heading: 'Delete channel?',\n   *  description:\n   *   'This will permanently delete a channel on your account. There is no going back.',\n   *  key: CHANNEL_NAME,\n   *  actionText: 'Yes, delete channel',\n   *  cancelText: 'No, cancel',\n   * })\n   */\n  show: (options: ShowPromptModalOptions) => Promise<string>\n}\n\nconst PromptModalContext = createContext<PromptModalValue | null>(null)\n\nexport type PromptModalProviderProps = PropsWithChildren<unknown>\n\n/**\n * Provides a prompt modal to the app.\n * @see https://cerberus.digitalu.design/react/prompt-modal\n * @example\n * ```tsx\n * // Wrap the Provider around the root of the feature.\n * <PromptModal>\n *   <SomeFeatureSection />\n * </PromptModal>\n *\n * // Use the hook to show the prompt modal.\n * const prompt = usePromptModal()\n *\n * const handleClick = useCallback(async () => {\n *  const accepted = await prompt.show({\n *   kind: 'destructive',\n *   heading: 'Delete channel?',\n *  description:\n *   'This will permanently delete a channel on your account. There is no going back.',\n * key: CHANNEL_NAME,\n * actionText: 'Yes, delete channel',\n * cancelText: 'No, cancel',\n * })\n * // do something with accepted\n * }, [prompt])\n * ```\n */\nexport function PromptModal(\n  props: PropsWithChildren<PromptModalProviderProps>,\n) {\n  const resolveRef = useRef<PromptShowResult>(null)\n  const [open, setOpen] = useState<boolean>(false)\n  const [content, setContent] = useState<ShowPromptModalOptions | null>(null)\n  const [inputValue, setInputValue] = useState<string>('')\n\n  const { icons } = useCerberusContext()\n  const { promptModal: PromptIcon } = icons\n\n  const isValid = useMemo(\n    () => inputValue === content?.key,\n    [inputValue, content],\n  )\n\n  const palette = useMemo(\n    () => (content?.kind === 'destructive' ? 'danger' : 'action'),\n    [content],\n  )\n\n  const handleChange = useCallback(\n    (e: ChangeEvent<HTMLInputElement>) => {\n      setInputValue(e.currentTarget.value)\n    },\n    [content],\n  )\n\n  const handleChoice = useCallback(\n    (e: MouseEvent<HTMLButtonElement>) => {\n      const target = e.currentTarget as HTMLButtonElement\n      if (target.value === 'true') {\n        resolveRef.current?.(inputValue)\n      }\n      setOpen(false)\n    },\n    [inputValue, setOpen],\n  )\n\n  const handleShow = useCallback(\n    (options: ShowPromptModalOptions) => {\n      return new Promise<string>((resolve) => {\n        setContent({ ...options, kind: options.kind || 'non-destructive' })\n        setOpen(true)\n        resolveRef.current = resolve\n      })\n    },\n    [setOpen],\n  )\n\n  const value = useMemo(\n    () => ({\n      show: handleShow,\n    }),\n    [handleShow],\n  )\n\n  return (\n    <PromptModalContext.Provider value={value}>\n      {props.children}\n\n      <DialogProvider open={open} onOpenChange={(e) => setOpen(e.open)}>\n        <Dialog size=\"sm\">\n          <VStack gap=\"xl\" w=\"full\">\n            <VStack alignItems=\"flex-start\" gap=\"md\" w=\"full\">\n              <HStack\n                alignSelf=\"center\"\n                justify=\"center\"\n                paddingBlockEnd=\"md\"\n                w=\"full\"\n              >\n                <Show\n                  when={palette === 'danger'}\n                  fallback={\n                    <Avatar\n                      ariaLabel=\"\"\n                      gradient=\"charon-light\"\n                      icon={<PromptIcon size={24} />}\n                      src=\"\"\n                    />\n                  }\n                >\n                  <Avatar\n                    ariaLabel=\"\"\n                    gradient=\"hades-dark\"\n                    icon={<PromptIcon size={24} />}\n                    src=\"\"\n                  />\n                </Show>\n              </HStack>\n              <DialogHeading>{content?.heading}</DialogHeading>\n              <DialogDescription>{content?.description}</DialogDescription>\n            </VStack>\n\n            <VStack\n              alignItems=\"flex-start\"\n              marginBlockStart=\"md\"\n              marginBlockEnd=\"lg\"\n              w=\"full\"\n            >\n              <Field invalid={!isValid}>\n                <Label\n                  className={hstack({\n                    gap: 'xs',\n                    justify: 'flex-start !important',\n                  })}\n                  htmlFor=\"confirm\"\n                  size=\"md\"\n                >\n                  Type\n                  <Text as=\"strong\" textTransform=\"uppercase\">\n                    {content?.key}\n                  </Text>\n                  to confirm\n                </Label>\n                <Input\n                  id=\"confirm\"\n                  name=\"confirm\"\n                  onChange={handleChange}\n                  type=\"text\"\n                />\n              </Field>\n            </VStack>\n\n            <HStack gap=\"md\" justify=\"stretch\" w=\"full\">\n              <Button\n                autoFocus\n                className={css({\n                  w: '1/2',\n                })}\n                disabled={!isValid}\n                name=\"confirm\"\n                onClick={handleChoice}\n                palette={palette}\n                value=\"true\"\n              >\n                {content?.actionText}\n              </Button>\n\n              <DialogCloseTrigger asChild>\n                <Button\n                  className={css({\n                    w: '1/2',\n                  })}\n                  name=\"cancel\"\n                  onClick={handleChoice}\n                  usage=\"outlined\"\n                  value=\"false\"\n                >\n                  {content?.cancelText}\n                </Button>\n              </DialogCloseTrigger>\n            </HStack>\n          </VStack>\n        </Dialog>\n      </DialogProvider>\n    </PromptModalContext.Provider>\n  )\n}\n\n/**\n * Used to retrieve the context of the PromptModal provider.\n */\nexport function usePromptModal(): PromptModalValue {\n  const context = useContext(PromptModalContext)\n  if (context === null) {\n    throw new Error('usePromptModal must be used within a PromptModal Provider')\n  }\n  return context\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AAEP,SAAS,WAAW;AACpB,SAAS,cAAc;AAcvB,SAAS,QAAQ,cAAc;AAC/B,SAAS,0BAA0B;AAwJvB,SAagB,KAbhB;AA/FZ,IAAM,qBAAqB,cAAuC,IAAI;AA+B/D,SAAS,YACd,OACA;AACA,QAAM,aAAa,OAAyB,IAAI;AAChD,QAAM,CAAC,MAAM,OAAO,IAAI,SAAkB,KAAK;AAC/C,QAAM,CAAC,SAAS,UAAU,IAAI,SAAwC,IAAI;AAC1E,QAAM,CAAC,YAAY,aAAa,IAAI,SAAiB,EAAE;AAEvD,QAAM,EAAE,MAAM,IAAI,mBAAmB;AACrC,QAAM,EAAE,aAAa,WAAW,IAAI;AAEpC,QAAM,UAAU;AAAA,IACd,MAAM,eAAe,SAAS;AAAA,IAC9B,CAAC,YAAY,OAAO;AAAA,EACtB;AAEA,QAAM,UAAU;AAAA,IACd,MAAO,SAAS,SAAS,gBAAgB,WAAW;AAAA,IACpD,CAAC,OAAO;AAAA,EACV;AAEA,QAAM,eAAe;AAAA,IACnB,CAAC,MAAqC;AACpC,oBAAc,EAAE,cAAc,KAAK;AAAA,IACrC;AAAA,IACA,CAAC,OAAO;AAAA,EACV;AAEA,QAAM,eAAe;AAAA,IACnB,CAAC,MAAqC;AACpC,YAAM,SAAS,EAAE;AACjB,UAAI,OAAO,UAAU,QAAQ;AAC3B,mBAAW,UAAU,UAAU;AAAA,MACjC;AACA,cAAQ,KAAK;AAAA,IACf;AAAA,IACA,CAAC,YAAY,OAAO;AAAA,EACtB;AAEA,QAAM,aAAa;AAAA,IACjB,CAAC,YAAoC;AACnC,aAAO,IAAI,QAAgB,CAAC,YAAY;AACtC,mBAAW,EAAE,GAAG,SAAS,MAAM,QAAQ,QAAQ,kBAAkB,CAAC;AAClE,gBAAQ,IAAI;AACZ,mBAAW,UAAU;AAAA,MACvB,CAAC;AAAA,IACH;AAAA,IACA,CAAC,OAAO;AAAA,EACV;AAEA,QAAM,QAAQ;AAAA,IACZ,OAAO;AAAA,MACL,MAAM;AAAA,IACR;AAAA,IACA,CAAC,UAAU;AAAA,EACb;AAEA,SACE,qBAAC,mBAAmB,UAAnB,EAA4B,OAC1B;AAAA,UAAM;AAAA,IAEP,oBAAC,kBAAe,MAAY,cAAc,CAAC,MAAM,QAAQ,EAAE,IAAI,GAC7D,8BAAC,UAAO,MAAK,MACX,+BAAC,UAAO,KAAI,MAAK,GAAE,QACjB;AAAA,2BAAC,UAAO,YAAW,cAAa,KAAI,MAAK,GAAE,QACzC;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,SAAQ;AAAA,YACR,iBAAgB;AAAA,YAChB,GAAE;AAAA,YAEF;AAAA,cAAC;AAAA;AAAA,gBACC,MAAM,YAAY;AAAA,gBAClB,UACE;AAAA,kBAAC;AAAA;AAAA,oBACC,WAAU;AAAA,oBACV,UAAS;AAAA,oBACT,MAAM,oBAAC,cAAW,MAAM,IAAI;AAAA,oBAC5B,KAAI;AAAA;AAAA,gBACN;AAAA,gBAGF;AAAA,kBAAC;AAAA;AAAA,oBACC,WAAU;AAAA,oBACV,UAAS;AAAA,oBACT,MAAM,oBAAC,cAAW,MAAM,IAAI;AAAA,oBAC5B,KAAI;AAAA;AAAA,gBACN;AAAA;AAAA,YACF;AAAA;AAAA,QACF;AAAA,QACA,oBAAC,iBAAe,mBAAS,SAAQ;AAAA,QACjC,oBAAC,qBAAmB,mBAAS,aAAY;AAAA,SAC3C;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,YAAW;AAAA,UACX,kBAAiB;AAAA,UACjB,gBAAe;AAAA,UACf,GAAE;AAAA,UAEF,+BAAC,SAAM,SAAS,CAAC,SACf;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,WAAW,OAAO;AAAA,kBAChB,KAAK;AAAA,kBACL,SAAS;AAAA,gBACX,CAAC;AAAA,gBACD,SAAQ;AAAA,gBACR,MAAK;AAAA,gBACN;AAAA;AAAA,kBAEC,oBAAC,QAAK,IAAG,UAAS,eAAc,aAC7B,mBAAS,KACZ;AAAA,kBAAO;AAAA;AAAA;AAAA,YAET;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,IAAG;AAAA,gBACH,MAAK;AAAA,gBACL,UAAU;AAAA,gBACV,MAAK;AAAA;AAAA,YACP;AAAA,aACF;AAAA;AAAA,MACF;AAAA,MAEA,qBAAC,UAAO,KAAI,MAAK,SAAQ,WAAU,GAAE,QACnC;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAS;AAAA,YACT,WAAW,IAAI;AAAA,cACb,GAAG;AAAA,YACL,CAAC;AAAA,YACD,UAAU,CAAC;AAAA,YACX,MAAK;AAAA,YACL,SAAS;AAAA,YACT;AAAA,YACA,OAAM;AAAA,YAEL,mBAAS;AAAA;AAAA,QACZ;AAAA,QAEA,oBAAC,sBAAmB,SAAO,MACzB;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,IAAI;AAAA,cACb,GAAG;AAAA,YACL,CAAC;AAAA,YACD,MAAK;AAAA,YACL,SAAS;AAAA,YACT,OAAM;AAAA,YACN,OAAM;AAAA,YAEL,mBAAS;AAAA;AAAA,QACZ,GACF;AAAA,SACF;AAAA,OACF,GACF,GACF;AAAA,KACF;AAEJ;AAKO,SAAS,iBAAmC;AACjD,QAAM,UAAU,WAAW,kBAAkB;AAC7C,MAAI,YAAY,MAAM;AACpB,UAAM,IAAI,MAAM,2DAA2D;AAAA,EAC7E;AACA,SAAO;AACT;","names":[]}

package/build/modern/context/confirm-modal.js

@@ -2,18 +2,13 @@
 import {
   ConfirmModal,
   useConfirmModal
-} from "../chunk-MUTAYS3P.js";
-import "../chunk-JIRW4XOJ.js";
-import "../chunk-ZL6ZITLA.js";
-import "../chunk-NUMM4TNC.js";
-import "../chunk-7NN3SJ7W.js";
+} from "../chunk-BHB56M7S.js";
+import "../chunk-TFL56AYR.js";
 import "../chunk-IQJDVFPP.js";
 import "../chunk-GCQMH4QA.js";
 import "../chunk-BUVVRQLZ.js";
 import "../chunk-GITT5645.js";
 import "../chunk-EXGKZGML.js";
-import "../chunk-KGQG5JGW.js";
-import "../chunk-JIZQFTW6.js";
 export {
   ConfirmModal,
   useConfirmModal

package/build/modern/context/cta-modal.js

@@ -2,19 +2,15 @@
 import {
   CTAModal,
   useCTAModal
-} from "../chunk-R4RFWDBM.js";
-import "../chunk-JIRW4XOJ.js";
-import "../chunk-ZL6ZITLA.js";
-import "../chunk-NUMM4TNC.js";
-import "../chunk-7NN3SJ7W.js";
+} from "../chunk-FGCO27TC.js";
+import "../chunk-6BN3XKQF.js";
 import "../chunk-APD6IX5R.js";
+import "../chunk-TFL56AYR.js";
 import "../chunk-IQJDVFPP.js";
 import "../chunk-GCQMH4QA.js";
 import "../chunk-BUVVRQLZ.js";
 import "../chunk-GITT5645.js";
 import "../chunk-EXGKZGML.js";
-import "../chunk-KGQG5JGW.js";
-import "../chunk-JIZQFTW6.js";
 export {
   CTAModal,
   useCTAModal

package/build/modern/context/prompt-modal.js

@@ -2,21 +2,17 @@
 import {
   PromptModal,
   usePromptModal
-} from "../chunk-VGEK2DQB.js";
-import "../chunk-JIRW4XOJ.js";
-import "../chunk-ZL6ZITLA.js";
-import "../chunk-NUMM4TNC.js";
-import "../chunk-7NN3SJ7W.js";
+} from "../chunk-SD3OVTHT.js";
+import "../chunk-RU5LOXWI.js";
 import "../chunk-MZ3UCDUL.js";
 import "../chunk-NMF2HYWO.js";
 import "../chunk-UZDVOIW5.js";
+import "../chunk-TFL56AYR.js";
 import "../chunk-IQJDVFPP.js";
 import "../chunk-GCQMH4QA.js";
 import "../chunk-BUVVRQLZ.js";
 import "../chunk-GITT5645.js";
 import "../chunk-EXGKZGML.js";
-import "../chunk-KGQG5JGW.js";
-import "../chunk-JIZQFTW6.js";
 export {
   PromptModal,
   usePromptModal