@boxcustodia/library 2.0.0-alpha.5 → 2.0.0-alpha.6

package/dist/index.es.js

@@ -10476,8 +10476,9 @@ function eW({
     Hd,
     {
       "data-slot": "alert-dialog-backdrop",
+      forceRender: !0,
       className: me(
-        "fixed inset-0 z-50 bg-black/50",
+        "fixed inset-0 z-overlay bg-black/50",
         "transition-opacity duration-200",
         "data-starting-style:opacity-0 data-ending-style:opacity-0",
         e
@@ -10495,7 +10496,7 @@ function tW({
     {
       "data-slot": "alert-dialog-viewport",
       className: me(
-        "fixed inset-0 z-50 flex items-center justify-center p-4",
+        "fixed inset-0 z-overlay flex items-center justify-center p-4",
         e
       ),
       ...t
@@ -10674,8 +10675,9 @@ function lW({
     Hd,
     {
       "data-slot": "dialog-backdrop",
+      forceRender: !0,
       className: me(
-        "fixed inset-0 z-50 bg-black/50",
+        "fixed inset-0 z-overlay bg-black/50",
         "transition-opacity duration-200",
         "data-starting-style:opacity-0 data-ending-style:opacity-0",
         e
@@ -10693,7 +10695,7 @@ function uW({
     {
       "data-slot": "dialog-viewport",
       className: me(
-        "fixed inset-0 z-50 flex items-center justify-center p-4",
+        "fixed inset-0 z-overlay flex items-center justify-center p-4",
         e
       ),
       ...t
@@ -32117,7 +32119,7 @@ function $ne({
 }) {
   return /* @__PURE__ */ we(Pne, { open: n, defaultOpen: r, onOpenChange: o, children: [
     /* @__PURE__ */ E(Tne, { delay: u, closeDelay: c, render: t, ...m }),
-    /* @__PURE__ */ E(r0, { children: /* @__PURE__ */ E(s0, { side: i, align: s, sideOffset: a, children: /* @__PURE__ */ we(_ne, { className: f, children: [
+    /* @__PURE__ */ E(r0, { children: /* @__PURE__ */ E(s0, { side: i, align: s, sideOffset: a, className: "z-float", children: /* @__PURE__ */ we(_ne, { className: f, children: [
       /* @__PURE__ */ E(One, { className: p }),
       e
     ] }) }) })
@@ -35974,7 +35976,7 @@ function Zre() {
       toast: t,
       "data-slot": "toast",
       className: me(
-        "absolute right-0 bottom-0 left-auto z-[calc(1000-var(--toast-index))] mr-0 h-[var(--height)] w-full origin-bottom select-none",
+        "absolute right-0 bottom-0 left-auto z-[calc(var(--z-toast)-var(--toast-index))] mr-0 h-[var(--height)] w-full origin-bottom select-none",
         zre({ variant: t.variant }),
         "[--gap:0.75rem] [--height:var(--toast-frontmost-height,var(--toast-height))] [--offset-y:calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y))] [--peek:0.75rem] [--scale:calc(max(0,1-(var(--toast-index)*0.1)))] [--shrink:calc(1-var(--scale))]",
         "[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)-(var(--toast-index)*var(--peek))-(var(--shrink)*var(--height))))_scale(var(--scale))] [transition:transform_0.5s_cubic-bezier(0.22,1,0.36,1),opacity_0.5s,height_0.15s]",
@@ -40120,7 +40122,7 @@ const Ole = (e) => /* @__PURE__ */ E(gle, { "data-slot": "menu", ...e }), $le =
   {
     "data-slot": "menu-sub-content",
     className: me(
-      "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state='open']:animate-in data-[state='closed']:animate-out data-[state='closed']:fade-out-0 data-[state='open']:fade-in-0 data-[state='closed']:zoom-out-95 data-[state='open']:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      "z-float min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state='open']:animate-in data-[state='closed']:animate-out data-[state='closed']:fade-out-0 data-[state='open']:fade-in-0 data-[state='closed']:zoom-out-95 data-[state='open']:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
       e
     ),
     ...t
@@ -40135,7 +40137,7 @@ const Ole = (e) => /* @__PURE__ */ E(gle, { "data-slot": "menu", ...e }), $le =
     "data-slot": "menu-content",
     sideOffset: t,
     className: me(
-      "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state='open']:animate-in data-[state='closed']:animate-out data-[state='closed']:fade-out-0 data-[state='open']:fade-in-0 data-[state='closed']:zoom-out-95 data-[state='open']:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      "z-float min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state='open']:animate-in data-[state='closed']:animate-out data-[state='closed']:fade-out-0 data-[state='open']:fade-in-0 data-[state='closed']:zoom-out-95 data-[state='open']:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
       e
     ),
     ...n
@@ -40661,7 +40663,7 @@ const Kh = (e) => /* @__PURE__ */ E(oue, { "data-slot": "popover", ...e }), Hh =
       !i && a.preventDefault(), s?.onOpenAutoFocus?.(a);
     },
     className: me(
-      "z-50 w-72 p-4 rounded-md border bg-popover text-popover-foreground shadow-md outline-none open:animate-in closed:animate-out closed:fade-out-0 open:fade-in-0 closed:zoom-out-95 open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      "z-float w-72 p-4 rounded-md border bg-popover text-popover-foreground shadow-md outline-none open:animate-in closed:animate-out closed:fade-out-0 open:fade-in-0 closed:zoom-out-95 open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
       e
     ),
     style: {
@@ -42574,7 +42576,7 @@ const vce = (e) => /* @__PURE__ */ E(rce, { "data-slot": "select", ...e }), bce
   {
     "data-slot": "select-content",
     className: me(
-      "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md open:animate-in closed:animate-out closed:fade-out-0 open:fade-in-0 closed:zoom-out-95 open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      "relative z-float max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md open:animate-in closed:animate-out closed:fade-out-0 open:fade-in-0 closed:zoom-out-95 open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
       n === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
       e
     ),

package/dist/theme.css

@@ -50,6 +50,10 @@
   --radius-checkbox: 0.25rem;
 
   --icon-size: 1rem;
+
+  --z-overlay: 50;
+  --z-float: 60;
+  --z-toast: 70;
 }
 /* Tooltip enter animation — @starting-style is more reliable than data-[starting-style]
    because it guarantees the browser paints the initial state before the transition fires,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@boxcustodia/library",
-  "version": "2.0.0-alpha.5",
+  "version": "2.0.0-alpha.6",
   "type": "module",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",