@geomak/ui 7.5.2 → 7.6.0

package/dist/index.cjs

@@ -1630,6 +1630,47 @@ function Badge({
     !hidden && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute -top-1 -right-1 flex", children: indicator })
   ] });
 }
+var TONE_BG = {
+  info: "bg-[color-mix(in_srgb,var(--color-info)_12%,transparent)]",
+  success: "bg-[color-mix(in_srgb,var(--color-success)_12%,transparent)]",
+  warning: "bg-[color-mix(in_srgb,var(--color-warning)_15%,transparent)]",
+  danger: "bg-[color-mix(in_srgb,var(--color-error)_12%,transparent)]"
+};
+var TONE_FG = {
+  info: "text-status-info",
+  success: "text-status-success",
+  warning: "text-status-warning",
+  danger: "text-status-error"
+};
+var DEFAULT_ICON = {
+  info: /* @__PURE__ */ jsxRuntime.jsx(chunk4V4U2W7K_cjs.Info, { size: 18 }),
+  success: /* @__PURE__ */ jsxRuntime.jsx(chunk4V4U2W7K_cjs.CheckCircle, { size: 18 }),
+  warning: /* @__PURE__ */ jsxRuntime.jsx(chunk4V4U2W7K_cjs.Warning, { size: 18 }),
+  danger: /* @__PURE__ */ jsxRuntime.jsx(chunk4V4U2W7K_cjs.Error, { size: 18 })
+};
+function Banner({ tone, children, icon, onDismiss, className = "" }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      role: tone === "warning" || tone === "danger" ? "alert" : "status",
+      className: cx("flex w-full items-start gap-2.5 rounded-md p-3 text-sm text-foreground", TONE_BG[tone], className),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx("mt-0.5 flex h-[18px] w-[18px] flex-shrink-0 items-center justify-center", TONE_FG[tone]), children: icon ?? DEFAULT_ICON[tone] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 flex-1", children }),
+        onDismiss && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onDismiss,
+            "aria-label": "Dismiss",
+            className: "-mr-1 -mt-1 flex h-6 w-6 flex-shrink-0 self-start items-center justify-center rounded-md text-foreground-muted transition-colors hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
+            children: /* @__PURE__ */ jsxRuntime.jsx(chunk4V4U2W7K_cjs.X, { size: 16 })
+          }
+        )
+      ]
+    }
+  );
+}
 var SIZES = {
   sm: { box: "h-7 w-7 text-xs", center: 14, title: "text-xs", desc: "text-[11px]" },
   md: { box: "h-9 w-9 text-sm", center: 18, title: "text-sm", desc: "text-xs" }
@@ -2515,52 +2556,68 @@ function PopConfirm({
     onCancel?.();
     setOpen(false);
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs(Popover__namespace.Root, { open: isOpen, onOpenChange: (o) => o ? setOpen(true) : handleCancel(), children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Popover__namespace.Trigger, { asChild: true, children }),
-    /* @__PURE__ */ jsxRuntime.jsx(Popover__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
-      Popover__namespace.Content,
-      {
-        side,
-        sideOffset: 8,
-        collisionPadding: 12,
-        className: cx("z-[400] focus:outline-none", className),
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(
-            framerMotion.motion.div,
-            {
-              initial: { opacity: 0, scale: 0.95 },
-              animate: { opacity: 1, scale: 1 },
-              transition: { duration: 0.12, ease: [0.16, 1, 0.3, 1] },
-              className: "w-64 rounded-lg border border-border bg-surface p-3.5 shadow-lg",
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2.5", children: [
-                  icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `mt-0.5 flex h-5 w-5 flex-shrink-0 items-center justify-center ${ICON_COLOR[tone]}`, children: icon }),
-                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
-                    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-medium text-foreground", children: title }),
-                    description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 text-xs text-foreground-secondary leading-snug", children: description })
-                  ] })
-                ] }),
-                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 flex justify-end gap-2", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(Button_default, { content: cancelText, size: "sm", variant: "ghost", onClick: handleCancel }),
-                  /* @__PURE__ */ jsxRuntime.jsx(
-                    Button_default,
-                    {
-                      content: confirmText,
-                      size: "sm",
-                      variant: CONFIRM_VARIANT[tone],
-                      loading,
-                      onClick: handleConfirm
-                    }
-                  )
-                ] })
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(Popover__namespace.Arrow, { className: "fill-surface" })
-        ]
-      }
-    ) })
-  ] });
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    Popover__namespace.Root,
+    {
+      open: isOpen,
+      onOpenChange: (o) => {
+        if (o) setOpen(true);
+        else if (!loading) handleCancel();
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Popover__namespace.Trigger, { asChild: true, children }),
+        /* @__PURE__ */ jsxRuntime.jsx(Popover__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+          Popover__namespace.Content,
+          {
+            side,
+            sideOffset: 8,
+            collisionPadding: 12,
+            className: cx("z-[400] focus:outline-none", className),
+            onEscapeKeyDown: (e) => {
+              if (loading) e.preventDefault();
+            },
+            onInteractOutside: (e) => {
+              if (loading) e.preventDefault();
+            },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                framerMotion.motion.div,
+                {
+                  initial: { opacity: 0, scale: 0.95 },
+                  animate: { opacity: 1, scale: 1 },
+                  transition: { duration: 0.12, ease: [0.16, 1, 0.3, 1] },
+                  className: "w-64 rounded-lg border border-border bg-surface p-3.5 shadow-lg",
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2.5", children: [
+                      icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `mt-0.5 flex h-5 w-5 flex-shrink-0 items-center justify-center ${ICON_COLOR[tone]}`, children: icon }),
+                      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
+                        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-medium text-foreground", children: title }),
+                        description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 text-xs text-foreground-secondary leading-snug", children: description })
+                      ] })
+                    ] }),
+                    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 flex justify-end gap-2", children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(Button_default, { content: cancelText, size: "sm", variant: "ghost", disabled: loading, onClick: handleCancel }),
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        Button_default,
+                        {
+                          content: confirmText,
+                          size: "sm",
+                          variant: CONFIRM_VARIANT[tone],
+                          loading,
+                          onClick: handleConfirm
+                        }
+                      )
+                    ] })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(Popover__namespace.Arrow, { className: "fill-surface" })
+            ]
+          }
+        ) })
+      ]
+    }
+  );
 }
 var DEFAULT_EVENTS = ["mousemove", "mousedown", "keydown", "touchstart", "scroll", "wheel"];
 var formatTime = (ms) => {
@@ -10329,6 +10386,7 @@ exports.AppShell = AppShell;
 exports.AutoComplete = AutoComplete;
 exports.Avatar = Avatar;
 exports.Badge = Badge;
+exports.Banner = Banner;
 exports.Blog = Blog;
 exports.Box = Box;
 exports.Breadcrumbs = Breadcrumbs;