@cerberus-design/react 0.12.0-next-34ac941 → 0.12.0-next-635644c

package/build/legacy/index.cjs

@@ -87,6 +87,7 @@ __export(src_exports, {
   Thead: () => Thead,
   ThemeProvider: () => ThemeProvider,
   Toggle: () => Toggle,
+  Tooltip: () => Tooltip,
   Tr: () => Tr,
   createNavTriggerProps: () => createNavTriggerProps,
   defineIcons: () => defineIcons,
@@ -1724,11 +1725,8 @@ function NotificationDescription(props) {
 // src/components/Portal.tsx
 var import_react_dom = require("react-dom");
 function Portal(props) {
-  if (typeof window !== "undefined") {
-    const container = props.container || document.body;
-    return (0, import_react_dom.createPortal)(props.children, container, props.key);
-  }
-  return null;
+  const container = props.container || document.body;
+  return (0, import_react_dom.createPortal)(props.children, container, props.key);
 }
 
 // src/components/Radio.tsx
@@ -2316,9 +2314,36 @@ function Toggle(props) {
   );
 }
 
+// src/components/Tooltip.tsx
+var import_tooltip = require("@ark-ui/react/tooltip");
+var import_css41 = require("@cerberus/styled-system/css");
+var import_recipes33 = require("@cerberus/styled-system/recipes");
+var import_jsx_runtime49 = require("react/jsx-runtime");
+function Tooltip(props) {
+  const { content, children, ...nativeProps } = props;
+  const styles = (0, import_recipes33.tooltip)();
+  const position = {
+    placement: props.position || "top"
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_tooltip.Tooltip.Root, { openDelay: 400, positioning: position, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_tooltip.Tooltip.Trigger, { className: styles.trigger, children }),
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_tooltip.Tooltip.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
+      import_tooltip.Tooltip.Content,
+      {
+        ...nativeProps,
+        className: (0, import_css41.cx)(nativeProps.className, styles.content),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_tooltip.Tooltip.Arrow, { className: styles.arrow, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_tooltip.Tooltip.ArrowTip, { className: styles.arrowTip }) }),
+          content
+        ]
+      }
+    ) })
+  ] });
+}
+
 // src/context/confirm-modal.tsx
 var import_react17 = require("react");
-var import_css41 = require("@cerberus/styled-system/css");
+var import_css42 = require("@cerberus/styled-system/css");
 var import_patterns16 = require("@cerberus/styled-system/patterns");
 
 // src/hooks/useModal.ts
@@ -2347,7 +2372,7 @@ function useModal() {
 }
 
 // src/context/confirm-modal.tsx
-var import_jsx_runtime49 = require("react/jsx-runtime");
+var import_jsx_runtime50 = require("react/jsx-runtime");
 var ConfirmModalContext = (0, import_react17.createContext)(null);
 function ConfirmModal(props) {
   const { modalRef, show, close } = useModal();
@@ -2387,36 +2412,36 @@ function ConfirmModal(props) {
     }),
     [handleShow]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(ConfirmModalContext.Provider, { value, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(ConfirmModalContext.Provider, { value, children: [
     props.children,
-    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(Modal, { onKeyDown: focusTrap, ref: modalRef, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(ModalHeader, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(Modal, { onKeyDown: focusTrap, ref: modalRef, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(ModalHeader, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
           "div",
           {
             className: (0, import_patterns16.hstack)({
               justify: "center",
               w: "full"
             }),
-            children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
               Show,
               {
                 when: palette === "danger",
-                fallback: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+                fallback: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
                   Avatar,
                   {
                     ariaLabel: "",
                     gradient: "charon-light",
-                    icon: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ConfirmIcon, { size: 24 }),
+                    icon: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(ConfirmIcon, { size: 24 }),
                     src: ""
                   }
                 ),
-                children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+                children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
                   Avatar,
                   {
                     ariaLabel: "",
                     gradient: "hades-dark",
-                    icon: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ConfirmIcon, { size: 24 }),
+                    icon: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(ConfirmIcon, { size: 24 }),
                     src: ""
                   }
                 )
@@ -2424,21 +2449,21 @@ function ConfirmModal(props) {
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ModalHeading, { children: content == null ? void 0 : content.heading }),
-        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ModalDescription, { children: content == null ? void 0 : content.description })
+        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(ModalHeading, { children: content == null ? void 0 : content.heading }),
+        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(ModalDescription, { children: content == null ? void 0 : content.description })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
         "div",
         {
           className: (0, import_patterns16.hstack)({
             gap: "4"
           }),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
               Button,
               {
                 autoFocus: true,
-                className: (0, import_css41.css)({
+                className: (0, import_css42.css)({
                   w: "1/2"
                 }),
                 name: "confirm",
@@ -2448,10 +2473,10 @@ function ConfirmModal(props) {
                 children: content == null ? void 0 : content.actionText
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
               Button,
               {
-                className: (0, import_css41.css)({
+                className: (0, import_css42.css)({
                   w: "1/2"
                 }),
                 name: "cancel",
@@ -2480,9 +2505,9 @@ function useConfirmModal() {
 // src/context/cta-modal.tsx
 var import_react18 = require("react");
 var import_jsx = require("@cerberus/styled-system/jsx");
-var import_css42 = require("@cerberus/styled-system/css");
+var import_css43 = require("@cerberus/styled-system/css");
 var import_jsx2 = require("@cerberus/styled-system/jsx");
-var import_jsx_runtime50 = require("react/jsx-runtime");
+var import_jsx_runtime51 = require("react/jsx-runtime");
 var CTAModalContext = (0, import_react18.createContext)(null);
 function CTAModal(props) {
   var _a, _b;
@@ -2522,49 +2547,49 @@ function CTAModal(props) {
     }),
     [handleShow]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(CTAModalContext.Provider, { value, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(CTAModalContext.Provider, { value, children: [
     props.children,
-    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(Modal, { onKeyDown: focusTrap, ref: modalRef, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(Modal, { onKeyDown: focusTrap, ref: modalRef, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
         "span",
         {
-          className: (0, import_css42.css)({
+          className: (0, import_css43.css)({
             padding: "md",
             position: "absolute",
             right: 0,
             top: 0,
             zIndex: "decorator"
           }),
-          children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(IconButton, { ariaLabel: "Close modal", onClick: close, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(CloseIcon, {}) })
+          children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(IconButton, { ariaLabel: "Close modal", onClick: close, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(CloseIcon, {}) })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(ModalHeader, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_jsx.HStack, { justify: "center", w: "full", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ModalHeader, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_jsx.HStack, { justify: "center", w: "full", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
           Avatar,
           {
             ariaLabel: "",
             gradient: "charon-light",
-            icon: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+            icon: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
               Show,
               {
                 when: Boolean(confirmIcon),
-                fallback: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(FallbackIcon, { size: 24 }),
+                fallback: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(FallbackIcon, { size: 24 }),
                 children: confirmIcon
               }
             ),
             src: ""
           }
         ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx2.VStack, { gap: "lg", w: "full", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(ModalHeading, { children: content == null ? void 0 : content.heading }),
-          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(ModalDescription, { children: content == null ? void 0 : content.description })
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx2.VStack, { gap: "lg", w: "full", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ModalHeading, { children: content == null ? void 0 : content.heading }),
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ModalDescription, { children: content == null ? void 0 : content.description })
         ] })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_jsx.HStack, { gap: "md", pt: "sm", w: "full", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Show, { when: Boolean((_a = content == null ? void 0 : content.actions) == null ? void 0 : _a.length), children: (_b = content == null ? void 0 : content.actions) == null ? void 0 : _b.map((action, index) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_jsx.HStack, { gap: "md", pt: "sm", w: "full", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Show, { when: Boolean((_a = content == null ? void 0 : content.actions) == null ? void 0 : _a.length), children: (_b = content == null ? void 0 : content.actions) == null ? void 0 : _b.map((action, index) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
         Button,
         {
           "data-index": index,
-          className: (0, import_css42.css)({
+          className: (0, import_css43.css)({
             w: "1/2"
           }),
           onClick: handleActionClick,
@@ -2588,13 +2613,13 @@ function useCTAModal() {
 // src/context/notification-center.tsx
 var import_react19 = require("react");
 var import_patterns17 = require("@cerberus/styled-system/patterns");
-var import_recipes33 = require("@cerberus/styled-system/recipes");
-var import_css43 = require("@cerberus/styled-system/css");
-var import_jsx_runtime51 = require("react/jsx-runtime");
+var import_recipes34 = require("@cerberus/styled-system/recipes");
+var import_css44 = require("@cerberus/styled-system/css");
+var import_jsx_runtime52 = require("react/jsx-runtime");
 var NotificationsContext = (0, import_react19.createContext)(null);
 function NotificationCenter(props) {
   const [activeNotifications, setActiveNotifications] = (0, import_react19.useState)([]);
-  const styles = (0, import_recipes33.notification)();
+  const styles = (0, import_recipes34.notification)();
   const handleNotify = (0, import_react19.useCallback)((options) => {
     setActiveNotifications((prev) => {
       const id = `${options.palette}:${prev.length + 1}`;
@@ -2623,13 +2648,13 @@ function NotificationCenter(props) {
     }),
     [handleNotify]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(NotificationsContext.Provider, { value, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(NotificationsContext.Provider, { value, children: [
     props.children,
-    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Show, { when: activeNotifications.length > 0, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Portal, { container: props.container, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: styles.center, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Show, { when: activeNotifications.length >= 4, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Show, { when: activeNotifications.length > 0, children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Portal, { container: props.container, children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: styles.center, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Show, { when: activeNotifications.length >= 4, children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
         Button,
         {
-          className: (0, import_css43.cx)(styles.closeAll, (0, import_patterns17.animateIn)()),
+          className: (0, import_css44.cx)(styles.closeAll, (0, import_patterns17.animateIn)()),
           onClick: handleCloseAll,
           palette: "action",
           shape: "rounded",
@@ -2638,7 +2663,7 @@ function NotificationCenter(props) {
           children: "Close all"
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
         "div",
         {
           className: (0, import_patterns17.vstack)({
@@ -2648,7 +2673,7 @@ function NotificationCenter(props) {
           style: {
             alignItems: "flex-end"
           },
-          children: activeNotifications.map((option) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+          children: activeNotifications.map((option) => /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
             MatchNotification,
             {
               ...option,
@@ -2665,7 +2690,7 @@ function MatchNotification(props) {
   const { palette, id, onClose, heading, description } = props;
   switch (palette) {
     case "success":
-      return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
+      return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
         Notification,
         {
           id,
@@ -2673,14 +2698,14 @@ function MatchNotification(props) {
           open: true,
           palette: "success",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(NotificationHeading, { palette: "success", children: heading }),
-            /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(NotificationDescription, { palette: "success", children: description })
+            /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(NotificationHeading, { palette: "success", children: heading }),
+            /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(NotificationDescription, { palette: "success", children: description })
           ]
         },
         id
       );
     case "warning":
-      return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
+      return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
         Notification,
         {
           id,
@@ -2688,22 +2713,22 @@ function MatchNotification(props) {
           open: true,
           palette: "warning",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(NotificationHeading, { palette: "warning", children: heading }),
-            /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(NotificationDescription, { palette: "warning", children: description })
+            /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(NotificationHeading, { palette: "warning", children: heading }),
+            /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(NotificationDescription, { palette: "warning", children: description })
           ]
         },
         id
       );
     case "danger":
-      return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(Notification, { id, onClose, open: true, palette: "danger", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(NotificationHeading, { palette: "danger", children: heading }),
-        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(NotificationDescription, { palette: "danger", children: description })
+      return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(Notification, { id, onClose, open: true, palette: "danger", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(NotificationHeading, { palette: "danger", children: heading }),
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(NotificationDescription, { palette: "danger", children: description })
       ] }, id);
     case "info":
     default:
-      return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(Notification, { id, onClose, open: true, palette: "info", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(NotificationHeading, { palette: "info", children: heading }),
-        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(NotificationDescription, { palette: "info", children: description })
+      return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(Notification, { id, onClose, open: true, palette: "info", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(NotificationHeading, { palette: "info", children: heading }),
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(NotificationDescription, { palette: "info", children: description })
       ] }, id);
   }
 }
@@ -2719,9 +2744,9 @@ function useNotificationCenter() {
 
 // src/context/prompt-modal.tsx
 var import_react20 = require("react");
-var import_css44 = require("@cerberus/styled-system/css");
+var import_css45 = require("@cerberus/styled-system/css");
 var import_patterns18 = require("@cerberus/styled-system/patterns");
-var import_jsx_runtime52 = require("react/jsx-runtime");
+var import_jsx_runtime53 = require("react/jsx-runtime");
 var PromptModalContext = (0, import_react20.createContext)(null);
 function PromptModal(props) {
   const { modalRef, show, close } = useModal();
@@ -2771,36 +2796,36 @@ function PromptModal(props) {
     }),
     [handleShow]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(PromptModalContext.Provider, { value, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(PromptModalContext.Provider, { value, children: [
     props.children,
-    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(Modal, { onKeyDown: focusTrap, ref: modalRef, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(ModalHeader, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(Modal, { onKeyDown: focusTrap, ref: modalRef, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(ModalHeader, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
           "div",
           {
             className: (0, import_patterns18.hstack)({
               justify: "center",
               w: "full"
             }),
-            children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
               Show,
               {
                 when: palette === "danger",
-                fallback: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+                fallback: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
                   Avatar,
                   {
                     ariaLabel: "",
                     gradient: "charon-light",
-                    icon: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(PromptIcon, { size: 24 }),
+                    icon: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(PromptIcon, { size: 24 }),
                     src: ""
                   }
                 ),
-                children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+                children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
                   Avatar,
                   {
                     ariaLabel: "",
                     gradient: "hades-dark",
-                    icon: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(PromptIcon, { size: 24 }),
+                    icon: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(PromptIcon, { size: 24 }),
                     src: ""
                   }
                 )
@@ -2808,10 +2833,10 @@ function PromptModal(props) {
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(ModalHeading, { children: content == null ? void 0 : content.heading }),
-        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(ModalDescription, { children: content == null ? void 0 : content.description })
+        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(ModalHeading, { children: content == null ? void 0 : content.heading }),
+        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(ModalDescription, { children: content == null ? void 0 : content.description })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
         "div",
         {
           className: (0, import_patterns18.vstack)({
@@ -2819,11 +2844,11 @@ function PromptModal(props) {
             mt: "4",
             mb: "8"
           }),
-          children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(Field, { invalid: !isValid, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(Field, { invalid: !isValid, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
               Label,
               {
-                className: (0, import_css44.css)({
+                className: (0, import_css45.css)({
                   gap: 1,
                   justifyContent: "flex-start"
                 }),
@@ -2831,10 +2856,10 @@ function PromptModal(props) {
                 size: "md",
                 children: [
                   "Type",
-                  /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
                     "strong",
                     {
-                      className: (0, import_css44.css)({
+                      className: (0, import_css45.css)({
                         textTransform: "uppercase"
                       }),
                       children: content == null ? void 0 : content.key
@@ -2844,7 +2869,7 @@ function PromptModal(props) {
                 ]
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
               Input,
               {
                 id: "confirm",
@@ -2856,7 +2881,7 @@ function PromptModal(props) {
           ] })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
         "div",
         {
           className: (0, import_patterns18.hstack)({
@@ -2864,11 +2889,11 @@ function PromptModal(props) {
             gap: "4"
           }),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
               Button,
               {
                 autoFocus: true,
-                className: (0, import_css44.css)({
+                className: (0, import_css45.css)({
                   w: "1/2"
                 }),
                 disabled: !isValid,
@@ -2879,10 +2904,10 @@ function PromptModal(props) {
                 children: content == null ? void 0 : content.actionText
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
               Button,
               {
-                className: (0, import_css44.css)({
+                className: (0, import_css45.css)({
                   w: "1/2"
                 }),
                 name: "cancel",
@@ -2973,7 +2998,7 @@ function useTheme(defaultTheme = "cerberus", defaultColorMode = "light", options
 }
 
 // src/context/theme.tsx
-var import_jsx_runtime53 = require("react/jsx-runtime");
+var import_jsx_runtime54 = require("react/jsx-runtime");
 var ThemeContext = (0, import_react22.createContext)(
   null
 );
@@ -2983,7 +3008,7 @@ function ThemeProvider(props) {
     updateMode: props.updateMode,
     updateTheme: props.updateTheme
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(ThemeContext.Provider, { value: state, children: props.children });
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ThemeContext.Provider, { value: state, children: props.children });
 }
 function useThemeContext() {
   const context = (0, import_react22.useContext)(ThemeContext);
@@ -3087,6 +3112,7 @@ __reExport(src_exports, require("@dnd-kit/core"), module.exports);
   Thead,
   ThemeProvider,
   Toggle,
+  Tooltip,
   Tr,
   createNavTriggerProps,
   defineIcons,