@versini/ui-panel 3.1.0 → 3.1.2

package/dist/components/Panel/Panel.js

@@ -1,10 +1,10 @@
-import { jsxs as E, jsx as l, Fragment as L } from "react/jsx-runtime";
-import { ButtonIcon as O } from "@versini/ui-button";
+import { jsxs as v, jsx as l, Fragment as y } from "react/jsx-runtime";
+import { ButtonIcon as A } from "@versini/ui-button";
 import * as c from "react";
-import { useId as A, useRef as $, useState as R, useEffect as S } from "react";
-import N from "clsx";
-import { useFloating as T, useClick as D, useDismiss as P, useRole as B, useInteractions as V, useMergeRefs as F, FloatingPortal as U, FloatingOverlay as Y, FloatingFocusManager as z } from "@floating-ui/react";
-const M = "av-messagebox", _ = "av-panel", G = ({
+import { useId as M, useRef as L, useState as O, useEffect as N } from "react";
+import E from "clsx";
+import { useFloating as P, useClick as R, useDismiss as T, useRole as D, useInteractions as B, useMergeRefs as $, FloatingPortal as V, FloatingOverlay as F, FloatingFocusManager as U } from "@floating-ui/react";
+const Y = "av-messagebox", z = "av-panel", G = ({
   children: t,
   fill: e,
   viewBox: r,
@@ -15,8 +15,8 @@ const M = "av-messagebox", _ = "av-panel", G = ({
   semantic: d = !1,
   ...m
 }) => {
-  const u = N(a, s);
-  return /* @__PURE__ */ E(
+  const u = E(a, s);
+  return /* @__PURE__ */ v(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -35,13 +35,13 @@ const M = "av-messagebox", _ = "av-panel", G = ({
   );
 };
 /*!
-  @versini/ui-svgicon v4.2.1
+  @versini/ui-svgicon v4.2.2
   © 2025 gizmette.com
 */
 try {
   window.__VERSINI_UI_SVGICON__ || (window.__VERSINI_UI_SVGICON__ = {
-    version: "4.2.1",
-    buildTime: "08/27/2025 08:27 AM EDT",
+    version: "4.2.2",
+    buildTime: "10/17/2025 12:12 PM EDT",
     homepage: "https://github.com/aversini/ui-components",
     license: "MIT"
   });
@@ -72,33 +72,33 @@ const j = ({
   }
 );
 /*!
-  @versini/ui-icons v4.11.0
+  @versini/ui-icons v4.12.3
   © 2025 gizmette.com
 */
 try {
   window.__VERSINI_UI_ICONS__ || (window.__VERSINI_UI_ICONS__ = {
-    version: "4.11.0",
-    buildTime: "08/27/2025 08:28 AM EDT",
+    version: "4.12.3",
+    buildTime: "10/17/2025 12:12 PM EDT",
     homepage: "https://github.com/aversini/ui-components",
     license: "MIT"
   });
 } catch {
 }
-const y = c.createContext(null);
+const C = c.createContext(null);
 function X({
   initialOpen: t = !1,
   open: e,
   onOpenChange: r
 } = {}) {
-  const [s, o] = c.useState(t), [a, n] = c.useState(), [d, m] = c.useState(), u = e ?? s, w = r ?? o, p = T({
+  const [s, o] = c.useState(t), [a, n] = c.useState(), [d, m] = c.useState(), u = e ?? s, w = r ?? o, p = P({
     open: u,
     onOpenChange: w
-  }), f = p.context, v = D(f, {
+  }), f = p.context, b = R(f, {
     enabled: e == null
-  }), x = P(f, {
+  }), x = T(f, {
     outsidePress: !1,
     outsidePressEvent: "mousedown"
-  }), h = B(f), I = V([v, x, h]);
+  }), h = D(f), I = B([b, x, h]);
   return c.useMemo(
     () => ({
       open: u,
@@ -113,8 +113,8 @@ function X({
     [u, w, I, p, a, d]
   );
 }
-const b = () => {
-  const t = c.useContext(y);
+const _ = () => {
+  const t = c.useContext(C);
   if (t == null)
     throw new Error("Modal components must be wrapped in <Modal />");
   return t;
@@ -124,17 +124,17 @@ function H({
   ...e
 }) {
   const r = X(e);
-  return /* @__PURE__ */ l(y.Provider, { value: r, children: t });
+  return /* @__PURE__ */ l(C.Provider, { value: r, children: t });
 }
 const q = c.forwardRef(function(t, e) {
-  const { context: r, ...s } = b(), o = F([s.refs.setFloating, e]);
+  const { context: r, ...s } = _(), o = $([s.refs.setFloating, e]);
   if (!r.open)
     return null;
-  const { overlayBackground: a, ...n } = t, d = N("grid place-items-center", {
+  const { overlayBackground: a, ...n } = t, d = E("grid place-items-center", {
     [`${a}`]: a,
     "bg-black sm:bg-black/[.8]": !a
   });
-  return /* @__PURE__ */ l(U, { children: /* @__PURE__ */ l(Y, { className: d, lockScroll: !0, children: /* @__PURE__ */ l(z, { context: r, children: /* @__PURE__ */ l(
+  return /* @__PURE__ */ l(V, { children: /* @__PURE__ */ l(F, { className: d, lockScroll: !0, children: /* @__PURE__ */ l(U, { context: r, children: /* @__PURE__ */ l(
     "div",
     {
       ref: o,
@@ -145,13 +145,13 @@ const q = c.forwardRef(function(t, e) {
     }
   ) }) }) });
 }), J = c.forwardRef(function({ children: t, ...e }, r) {
-  const { setLabelId: s } = b(), o = A();
+  const { setLabelId: s } = _(), o = M();
   return c.useLayoutEffect(() => (s(o), () => s(void 0)), [o, s]), /* @__PURE__ */ l("h1", { ...e, ref: r, id: o, children: t });
 }), K = c.forwardRef(function({ children: t, ...e }, r) {
-  const { setDescriptionId: s } = b(), o = A();
+  const { setDescriptionId: s } = _(), o = M();
   return c.useLayoutEffect(() => (s(o), () => s(void 0)), [o, s]), /* @__PURE__ */ l("div", { ...e, ref: r, id: o, children: t });
 }), Q = c.forwardRef(function(t, e) {
-  const { setOpen: r } = b(), { trigger: s, className: o, ...a } = t, n = c.useCallback(() => r(!1), [r]);
+  const { setOpen: r } = _(), { trigger: s, className: o, ...a } = t, n = c.useCallback(() => r(!1), [r]);
   return /* @__PURE__ */ l("div", { className: o, children: c.cloneElement(s, {
     ref: e,
     onClick: n,
@@ -159,13 +159,13 @@ const q = c.forwardRef(function(t, e) {
   }) });
 });
 /*!
-  @versini/ui-modal v3.0.1
+  @versini/ui-modal v3.0.2
   © 2025 gizmette.com
 */
 try {
   window.__VERSINI_UI_MODAL__ || (window.__VERSINI_UI_MODAL__ = {
-    version: "3.0.1",
-    buildTime: "10/11/2025 12:41 PM EDT",
+    version: "3.0.2",
+    buildTime: "10/17/2025 12:52 PM EDT",
     homepage: "https://github.com/aversini/ui-components",
     license: "MIT"
   });
@@ -181,27 +181,27 @@ const i = "panel", g = "messagebox", Z = ({
 }) => {
   const n = a ?? (e === i ? "large" : void 0);
   return {
-    main: N("prose prose-lighter flex flex-col bg-surface-dark", {
+    main: E("prose prose-lighter flex flex-col bg-surface-dark", {
       "duration-200 ease-out": s,
       /**
        * Panel styles
        */
-      [`${_} min-h-full sm:min-h-[10rem] sm:rounded-lg sm:border-2`]: e === i,
-      [`${_} w-full sm:w-[95%] md:max-w-2xl`]: e === i && !t && o === "small",
-      [`${_} w-full sm:w-[95%] md:max-w-3xl`]: e === i && !t && o === "medium",
-      [`${_} w-full sm:w-[95%] md:max-w-4xl`]: e === i && !t && o === "large",
-      "max-h-full sm:max-h-[75%]": e === i && n === "small",
-      "max-h-full sm:max-h-[85%]": e === i && n === "medium",
+      [`${z} min-h-full sm:min-h-[10rem] sm:rounded-lg sm:border-2`]: e === i,
+      "w-full sm:w-[95%] md:max-w-2xl": e === i && !t && o === "small",
+      "w-full sm:w-[95%] md:max-w-3xl": e === i && !t && o === "medium",
+      "w-full sm:w-[95%] md:max-w-4xl": e === i && !t && o === "large",
+      "max-h-full sm:max-h-[40%]": e === i && n === "small",
+      "max-h-full sm:max-h-[60%]": e === i && n === "medium",
       "max-h-full sm:max-h-[95%]": e === i && n === "large",
       "sm:border-border-dark": r === "dark" && e === i,
       "sm:border-border-accent": r === "light" && e === i,
       /**
        * Messagebox styles
        */
-      [`${M} rounded-lg border-2`]: e === g,
-      [`${M} w-[95%] sm:w-[50%] md:max-w-2xl`]: e === g && !t,
-      "max-h-[75%]": e === g && n === "small",
-      "max-h-[85%]": e === g && n === "medium",
+      [`${Y} rounded-lg border-2`]: e === g,
+      "w-[95%] sm:w-[50%] md:max-w-2xl": e === g && !t,
+      "max-h-[20%]": e === g && n === "small",
+      "max-h-[50%]": e === g && n === "medium",
       "max-h-[95%]": e === g && n === "large",
       "border-border-dark": r === "dark" && e === g,
       "border-border-accent": r === "light" && e === g,
@@ -212,7 +212,7 @@ const i = "panel", g = "messagebox", Z = ({
     header: "sm:p-4 mb-0 p-2",
     close: "sm:p-4 p-2"
   };
-}, W = "slide", C = "fade", oe = ({
+}, W = "slide", S = "fade", oe = ({
   open: t,
   onOpenChange: e,
   title: r,
@@ -226,8 +226,8 @@ const i = "panel", g = "messagebox", Z = ({
   maxWidth: w = "medium",
   maxHeight: p
 }) => {
-  const f = $(""), [v, x] = R(
-    m ? u === C ? { opacity: 0 } : {
+  const f = L(""), [b, x] = O(
+    m ? u === S ? { opacity: 0 } : {
       transform: "translateY(-100vh)"
     } : {}
   ), h = Z({
@@ -238,12 +238,12 @@ const i = "panel", g = "messagebox", Z = ({
     maxWidth: w,
     maxHeight: p
   });
-  return S(() => (t && (f.current = document.title, document.title = `${r} | ${f.current}`), () => {
+  return N(() => (t && (f.current = document.title, document.title = `${r} | ${f.current}`), () => {
     t && (document.title = f.current);
-  }), [r, t]), S(() => {
+  }), [r, t]), N(() => {
     if (m && t) {
       x(
-        m ? u === C ? { opacity: 0 } : {
+        m ? u === S ? { opacity: 0 } : {
           transform: "translateY(-666vh)"
         } : {}
       );
@@ -256,14 +256,14 @@ const i = "panel", g = "messagebox", Z = ({
       }, 100);
       return () => clearTimeout(I);
     }
-  }, [t, m, u]), /* @__PURE__ */ l(L, { children: t && /* @__PURE__ */ l(H, { open: t, onOpenChange: e, children: /* @__PURE__ */ E(q, { className: h.main, style: v, children: [
-    /* @__PURE__ */ E("div", { className: "flex flex-row-reverse items-center justify-between", children: [
+  }, [t, m, u]), /* @__PURE__ */ l(y, { children: t && /* @__PURE__ */ l(H, { open: t, onOpenChange: e, children: /* @__PURE__ */ v(q, { className: h.main, style: b, children: [
+    /* @__PURE__ */ v("div", { className: "flex flex-row-reverse items-center justify-between", children: [
       /* @__PURE__ */ l(
         Q,
         {
           className: h.close,
           trigger: /* @__PURE__ */ l(
-            O,
+            A,
             {
               mode: "dark",
               focusMode: "light",
@@ -281,7 +281,7 @@ const i = "panel", g = "messagebox", Z = ({
   ] }) }) });
 };
 export {
-  M as MESSAGEBOX_CLASSNAME,
-  _ as PANEL_CLASSNAME,
+  Y as MESSAGEBOX_CLASSNAME,
+  z as PANEL_CLASSNAME,
   oe as Panel
 };

package/dist/index.js

@@ -1,12 +1,12 @@
 import { MESSAGEBOX_CLASSNAME as o, PANEL_CLASSNAME as E, Panel as n } from "./components/Panel/Panel.js";
 /*!
-  @versini/ui-panel v3.1.0
+  @versini/ui-panel v3.1.2
   © 2025 gizmette.com
 */
 try {
   window.__VERSINI_UI_PANEL__ || (window.__VERSINI_UI_PANEL__ = {
-    version: "3.1.0",
-    buildTime: "10/11/2025 12:42 PM EDT",
+    version: "3.1.2",
+    buildTime: "10/17/2025 12:53 PM EDT",
     homepage: "https://github.com/aversini/ui-components",
     license: "MIT"
   });

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@versini/ui-panel",
-	"version": "3.1.0",
+	"version": "3.1.2",
 	"license": "MIT",
 	"author": "Arno Versini",
 	"publishConfig": {
@@ -36,23 +36,19 @@
 		"test:watch": "vitest",
 		"test": "vitest run"
 	},
-	"peerDependencies": {
-		"react": "^19.1.0",
-		"react-dom": "^19.1.0"
-	},
 	"devDependencies": {
-		"@testing-library/jest-dom": "6.8.0"
+		"@testing-library/jest-dom": "6.9.1"
 	},
 	"dependencies": {
-		"@tailwindcss/typography": "0.5.16",
-		"@versini/ui-button": "8.0.1",
-		"@versini/ui-icons": "4.11.0",
-		"@versini/ui-modal": "3.0.1",
+		"@tailwindcss/typography": "0.5.19",
+		"@versini/ui-button": "8.0.2",
+		"@versini/ui-icons": "4.12.3",
+		"@versini/ui-modal": "3.0.2",
 		"clsx": "2.1.1",
-		"tailwindcss": "4.1.12"
+		"tailwindcss": "4.1.14"
 	},
 	"sideEffects": [
 		"**/*.css"
 	],
-	"gitHead": "731554d2c2fc2ae1c3c62ffbe09eba2b77308a70"
+	"gitHead": "67e049c9b2e46e8f52509bf6198ca0cdaf5d970a"
 }