@snksergio/design-system 0.43.1 → 0.43.3

package/dist-lib/chunks/{panel-D43Xnc-N.cjs → panel-CvfP8eP1.cjs}

@@ -3,7 +3,7 @@ var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 const jsxRuntime = require("react/jsx-runtime");
-const sheet = require("./sheet-B68Q4-Hn.cjs");
+const sheet = require("./sheet-j-d_UX7R.cjs");
 const React = require("react");
 const core = require("@dnd-kit/core");
 const sortable = require("@dnd-kit/sortable");
@@ -87,51 +87,60 @@ function AlertModal({
     }
     onConfirm?.();
   };
-  return /* @__PURE__ */ jsxRuntime.jsx(sheet.AlertDialog, { open, onOpenChange, children: /* @__PURE__ */ jsxRuntime.jsxs(sheet.AlertDialogContent, { className, children: [
-    !hideClose && /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        type: "button",
-        onClick: () => onOpenChange(false),
-        disabled: loading,
-        "aria-label": "Fechar",
-        className: "absolute top-pad-lg right-pad-lg z-10 grid place-items-center size-form-sm rounded-radius-md bg-transparent text-fg-muted opacity-55 transition-[background-color,color,opacity] outline-none hover:bg-bg-muted hover:text-fg-default hover:opacity-100 focus-visible:opacity-100 focus-visible:shadow-sh-ring disabled:pointer-events-none",
-        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "size-4" })
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsxs(sheet.AlertDialogHeader, { children: [
-      iconNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: alertModalIcon({ tone }), "aria-hidden": "true", children: iconNode }),
-      /* @__PURE__ */ jsxRuntime.jsx(sheet.AlertDialogTitle, { children: title2 }),
-      description && /* @__PURE__ */ jsxRuntime.jsx(sheet.AlertDialogDescription, { children: description })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(sheet.AlertDialogFooter, { children: [
-      !hideCancel && /* @__PURE__ */ jsxRuntime.jsx(sheet.AlertDialogCancel, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
-        avatar.Button,
-        {
-          type: "button",
-          color: "secondary",
-          variant: "outline",
-          size: "md",
-          fullWidth: true,
-          disabled: loading,
-          children: cancelLabel
-        }
-      ) }),
-      /* @__PURE__ */ jsxRuntime.jsx(sheet.AlertDialogAction, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
-        avatar.Button,
-        {
-          type: "button",
-          color: TONE_BUTTON_COLOR[tone],
-          variant: "filled",
-          size: "md",
-          fullWidth: true,
-          loading,
-          onClick: handleConfirm,
-          children: confirmLabel
-        }
-      ) })
-    ] })
-  ] }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(sheet.AlertDialog, { open, onOpenChange, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    sheet.AlertDialogContent,
+    {
+      className,
+      onEscapeKeyDown: (e) => {
+        if (loading) e.preventDefault();
+      },
+      children: [
+        !hideClose && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => onOpenChange(false),
+            disabled: loading,
+            "aria-label": "Fechar",
+            className: "absolute top-pad-lg right-pad-lg z-10 grid place-items-center size-form-sm rounded-radius-md bg-transparent text-fg-muted opacity-55 transition-[background-color,color,opacity] outline-none hover:bg-bg-muted hover:text-fg-default hover:opacity-100 focus-visible:opacity-100 focus-visible:shadow-sh-ring disabled:pointer-events-none",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "size-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs(sheet.AlertDialogHeader, { children: [
+          iconNode && /* @__PURE__ */ jsxRuntime.jsx("div", { className: alertModalIcon({ tone }), "aria-hidden": "true", children: iconNode }),
+          /* @__PURE__ */ jsxRuntime.jsx(sheet.AlertDialogTitle, { children: title2 }),
+          description && /* @__PURE__ */ jsxRuntime.jsx(sheet.AlertDialogDescription, { children: description })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs(sheet.AlertDialogFooter, { children: [
+          !hideCancel && /* @__PURE__ */ jsxRuntime.jsx(sheet.AlertDialogCancel, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+            avatar.Button,
+            {
+              type: "button",
+              color: "secondary",
+              variant: "outline",
+              size: "md",
+              fullWidth: true,
+              disabled: loading,
+              children: cancelLabel
+            }
+          ) }),
+          /* @__PURE__ */ jsxRuntime.jsx(sheet.AlertDialogAction, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+            avatar.Button,
+            {
+              type: "button",
+              color: TONE_BUTTON_COLOR[tone],
+              variant: "filled",
+              size: "md",
+              fullWidth: true,
+              loading,
+              onClick: handleConfirm,
+              children: confirmLabel
+            }
+          ) })
+        ] })
+      ]
+    }
+  ) });
 }
 function hexToRgb(hex) {
   if (typeof hex !== "string") return null;
@@ -4099,6 +4108,16 @@ const floatingPanelStyles = avatar.tv({
       "rounded-radius-xl border border-border-default outline-float shadow-sh-2xl",
       // Desktop (md+) — gutter top/bottom 24px
       "md:top-pad-4xl md:bottom-pad-4xl",
+      // …e o mesmo gutter de 24px como TETO de largura, simétrico (24+24=48).
+      //
+      // Sem isto o painel estoura a viewport com props DEFAULT: `side="right"` ancora a
+      // 24px da borda e `resizableMaxWidth` default é 800 → 800+24 = 824px de necessidade.
+      // Em qualquer janela entre 768 e 824 (≥md, então sem o sheet mobile) a borda esquerda
+      // ia pra fora da tela. Mesmo caso com `size={n}` grande num monitor pequeno.
+      //
+      // O `min`/`max` do hook de resize é em PIXEL e cego à viewport — quem clampa é isto.
+      // Não regride nada: `max-width` só age quando a largura já estouraria.
+      "md:max-w-[calc(100vw-48px)]",
       // Mobile (max-md) — sheet bottom-up colado nas bordas do device:
       // flush nas laterais + bottom, só top arredondado, sem outline/shadow, cap 92vh
       "max-md:inset-x-0 max-md:bottom-0 max-md:top-auto max-md:!w-auto",
@@ -13041,4 +13060,4 @@ exports.useColumnResize = useColumnResize;
 exports.useColumnWidths = useColumnWidths;
 exports.useDataTableContext = useDataTableContext;
 exports.useFloatingPanelResize = useFloatingPanelResize;
-//# sourceMappingURL=panel-D43Xnc-N.cjs.map
+//# sourceMappingURL=panel-CvfP8eP1.cjs.map