@stenajs-webui/panels 18.8.0 → 18.9.1

package/dist/components/collapsible/CollapsibleWithCheckbox.d.ts

@@ -2,5 +2,6 @@ import { CheckboxProps } from "@stenajs-webui/forms";
 import * as React from "react";
 import { CollapsibleProps } from "./Collapsible";
 export interface CollapsibleWithCheckboxProps extends Omit<CollapsibleProps, "contentLeft" | "onChange">, Pick<CheckboxProps, "value" | "onValueChange" | "onChange" | "indeterminate"> {
+    checkboxDisabled: CheckboxProps["disabled"];
 }
 export declare const CollapsibleWithCheckbox: React.FC<CollapsibleWithCheckboxProps>;

package/dist/index.es.js

@@ -6,7 +6,7 @@ import { useBoolean as U, Column as L, Box as c, Row as p, Indent as g, Heading
 import { Popover as T } from "@stenajs-webui/tooltip";
 import { jsx as e, jsxs as i, Fragment as m } from "react/jsx-runtime";
 import { Checkbox as se, TextInput as Se } from "@stenajs-webui/forms";
-import d from "classnames";
+import u from "classnames";
 import { cssColor as B } from "@stenajs-webui/theme";
 import { faChevronDown as Ie } from "@fortawesome/free-solid-svg-icons";
 import { faChevronUp as Le } from "@fortawesome/free-solid-svg-icons/faChevronUp";
@@ -19,7 +19,7 @@ const V = ({
   rightIcon: a = ae,
   portalTarget: o = "parent",
   zIndex: s,
-  menuWidth: u,
+  menuWidth: l,
   menuTop: h,
   onClick: _,
   disableArrow: v = !1,
@@ -64,7 +64,7 @@ const V = ({
     placement: r,
     content: C && /* @__PURE__ */ e(re, {
       variant: "outlined",
-      width: u,
+      width: l,
       top: h,
       trapFocus: !0,
       children: /* @__PURE__ */ e(me.Provider, {
@@ -150,7 +150,7 @@ const V = ({
   onClick: r
 }) => /* @__PURE__ */ e("button", {
   onClick: r,
-  className: d(Y.sidebarMenuButton, n),
+  className: u(Y.sidebarMenuButton, n),
   children: /* @__PURE__ */ e(Te, {
     className: Y.icon
   })
@@ -165,11 +165,11 @@ const V = ({
   menuButtonVisibility: a = "visible",
   children: o,
   right: s,
-  center: u,
+  center: l,
   variant: h = "standard",
   onClickMenuButton: _
 }) => {
-  const v = u ? 1 : void 0, f = le(h);
+  const v = l ? 1 : void 0, f = le(h);
   return /* @__PURE__ */ i(p, {
     height: f,
     minHeight: f,
@@ -177,7 +177,7 @@ const V = ({
     style: {
       ["--swui-nav-bar-height"]: f
     },
-    className: d($e.navBar, r),
+    className: u($e.navBar, r),
     children: [/* @__PURE__ */ i(p, {
       flex: v,
       justifyContent: "flex-start",
@@ -205,10 +205,10 @@ const V = ({
           }))
         })
       })]
-    }), u && /* @__PURE__ */ e(p, {
+    }), l && /* @__PURE__ */ e(p, {
       justifyContent: "center",
       alignItems: "center",
-      children: u
+      children: l
     }), /* @__PURE__ */ i(p, {
       justifyContent: "flex-end",
       alignItems: "center",
@@ -227,7 +227,7 @@ const V = ({
   ...t
 }) => /* @__PURE__ */ e($, {
   ...t,
-  className: d(ee.navBarButton, n && ee.selected, r)
+  className: u(ee.navBarButton, n && ee.selected, r)
 }), et = (n) => /* @__PURE__ */ e(Z, {
   whiteSpace: "nowrap",
   color: "#fff",
@@ -265,20 +265,20 @@ const V = ({
   labelClassName: a,
   iconClassName: o,
   icon: s = fe,
-  ...u
+  ...l
 }) => {
   const h = n > 0;
   return /* @__PURE__ */ e($, {
-    ...u,
+    ...l,
     leftIcon: s,
-    className: d({
+    className: u({
       [R.unread]: r
     }, {
       [R.hasCount]: h
     }, R.navBarNotificationButton, t),
     label: h ? String(n) : void 0,
-    labelClassName: d(a, R.label),
-    iconClassName: d(o, R.icon)
+    labelClassName: u(a, R.label),
+    iconClassName: u(o, R.icon)
   });
 }, Je = "_navBarSearchFieldInput_4knxd_1", Ke = "_navBarSearchField_4knxd_1", ne = {
   navBarSearchFieldInput: Je,
@@ -289,8 +289,8 @@ const V = ({
   wrapperClassName: t,
   ...a
 }) => /* @__PURE__ */ e(Se, {
-  wrapperClassName: d(ne.navBarSearchField, t),
-  className: d(ne.navBarSearchFieldInput, r),
+  wrapperClassName: u(ne.navBarSearchField, t),
+  className: u(ne.navBarSearchFieldInput, r),
   placeholder: n,
   contentRight: /* @__PURE__ */ e(q, {
     children: /* @__PURE__ */ e(A, {
@@ -310,7 +310,7 @@ const V = ({
   ...s
 }) => /* @__PURE__ */ e(je, {
   ...s,
-  className: d({
+  className: u({
     [te.initials]: t != null
   }, te.navBarUserButton, n),
   leftIcon: r != null ? a : void 0,
@@ -323,7 +323,7 @@ const V = ({
   iconAriaLabel: a,
   iconColor: o,
   contentLeft: s,
-  contentRight: u,
+  contentRight: l,
   onClose: h
 }) => /* @__PURE__ */ i(p, {
   alignItems: "flex-start",
@@ -357,7 +357,7 @@ const V = ({
         color: B("--lhds-color-ui-600"),
         children: r
       })]
-    }), u]
+    }), l]
   }), h && /* @__PURE__ */ e(c, {
     flex: "none",
     justifyContent: "center",
@@ -403,7 +403,7 @@ const V = ({
   role: "alert",
   position: "relative",
   children: [/* @__PURE__ */ e(c, {
-    className: d({
+    className: u({
       [O.nonClickable]: n
     }),
     children: /* @__PURE__ */ e(de, {
@@ -411,7 +411,7 @@ const V = ({
     })
   }), t && /* @__PURE__ */ i(c, {
     indent: 3,
-    className: d({
+    className: u({
       [O.nonClickable]: n
     }),
     children: [t, /* @__PURE__ */ e(k, {
@@ -422,7 +422,7 @@ const V = ({
     className: O.clickable,
     "aria-label": r
   })]
-}), nn = "_collapsible_1nroa_1", tn = "_header_1nroa_46", rn = "_indicator_1nroa_59", an = "_headerText_1nroa_103", on = "_label_1nroa_114", sn = "_contentLeft_1nroa_123", cn = "_contentRight_1nroa_124", ln = "_content_1nroa_123", dn = "_groupHeading_1nroa_155", un = "_contentEnter_1nroa_180", hn = "_contentEnterActive_1nroa_184", pn = "_contentExitDone_1nroa_189", l = {
+}), nn = "_collapsible_1nroa_1", tn = "_header_1nroa_46", rn = "_indicator_1nroa_59", an = "_headerText_1nroa_103", on = "_label_1nroa_114", sn = "_contentLeft_1nroa_123", cn = "_contentRight_1nroa_124", ln = "_content_1nroa_123", dn = "_groupHeading_1nroa_155", un = "_contentEnter_1nroa_180", hn = "_contentEnterActive_1nroa_184", pn = "_contentExitDone_1nroa_189", d = {
   collapsible: nn,
   header: tn,
   indicator: rn,
@@ -455,13 +455,13 @@ const V = ({
   children: a,
   ...o
 }) => /* @__PURE__ */ i("div", {
-  className: d(l.content, t),
+  className: u(d.content, t),
   ...o,
   children: [n && /* @__PURE__ */ e("div", {
-    className: l.contentLeft,
+    className: d.contentLeft,
     children: n
   }), a != null ? a : /* @__PURE__ */ e(G, {}), r && /* @__PURE__ */ e("div", {
-    className: l.contentRight,
+    className: d.contentRight,
     children: r
   })]
 }), mn = (n) => {
@@ -480,7 +480,7 @@ const V = ({
   contentRight: a,
   collapsed: o = !1,
   onClick: s,
-  className: u,
+  className: l,
   disabled: h = !1,
   unmountOnCollapse: _ = !1,
   mountOnEnter: v = !0,
@@ -493,34 +493,34 @@ const V = ({
 }, F) {
   const w = I.useRef(null), j = w.current ? mn(getComputedStyle(w.current).getPropertyValue("--swui-collapsible-animation-time")) : void 0;
   return /* @__PURE__ */ i("div", {
-    className: d(l.collapsible, u),
+    className: u(d.collapsible, l),
     "aria-expanded": !o,
     ref: w,
     ...N,
     children: [/* @__PURE__ */ i(q, {
       disableFocusHighlight: !0,
       disableOpacityOnClick: !0,
-      className: l.header,
+      className: d.header,
       onClick: s,
       disabled: h,
       autoFocus: E,
       ref: F,
       children: [t && /* @__PURE__ */ e("div", {
-        className: l.contentLeft,
+        className: d.contentLeft,
         children: t
       }), /* @__PURE__ */ e("div", {
-        className: l.label,
+        className: d.label,
         children: /* @__PURE__ */ e(S, {
           color: "var(--swui-collapsible-header-text-color)",
-          className: l.headerText,
+          className: d.headerText,
           children: r
         })
       }), a && /* @__PURE__ */ e("div", {
-        className: l.contentRight,
+        className: d.contentRight,
         children: a
       }), /* @__PURE__ */ e(A, {
         icon: o ? C : f,
-        className: l.indicator,
+        className: d.indicator,
         size: x,
         fixedWidth: !0
       })]
@@ -530,11 +530,11 @@ const V = ({
         enter: j
       },
       classNames: {
-        enter: l.contentEnter,
-        enterActive: l.contentEnterActive,
-        exit: l.contentExit,
-        exitActive: l.contentExitActive,
-        exitDone: l.contentExitDone
+        enter: d.contentEnter,
+        enterActive: d.contentEnterActive,
+        exit: d.contentExit,
+        exitActive: d.contentExitActive,
+        exitDone: d.contentExitDone
       },
       mountOnEnter: v,
       unmountOnExit: _,
@@ -551,16 +551,18 @@ const V = ({
   onValueChange: r,
   onChange: t,
   indeterminate: a,
-  ...o
+  checkboxDisabled: o,
+  ...s
 }) => /* @__PURE__ */ e(ue, {
   contentLeft: /* @__PURE__ */ e(se, {
     value: n,
     indeterminate: a,
     onValueChange: r,
     onChange: t,
-    onClick: (s) => s.stopPropagation()
+    disabled: o,
+    onClick: (l) => l.stopPropagation()
   }),
-  ...o
+  ...s
 }), ct = ({
   contentLeft: n,
   contentRight: r,
@@ -571,21 +573,21 @@ const V = ({
 }) => /* @__PURE__ */ i(q, {
   disableFocusHighlight: !0,
   disableOpacityOnClick: !0,
-  className: d(l.content, t),
+  className: u(d.content, t),
   onClick: a,
   ...s,
   children: [n && /* @__PURE__ */ e("div", {
-    className: l.contentLeft,
+    className: d.contentLeft,
     children: n
   }), o != null ? o : /* @__PURE__ */ e(G, {}), r && /* @__PURE__ */ e("div", {
-    className: l.contentRight,
+    className: d.contentRight,
     children: r
   })]
 }), lt = ({
   className: n,
   ...r
 }) => /* @__PURE__ */ e(J, {
-  className: d(l.groupHeading, n),
+  className: u(d.groupHeading, n),
   ...r
 }), bn = ({
   text: n = "Something unexpected happened."
@@ -694,7 +696,7 @@ const V = ({
   onClick: r
 }) => /* @__PURE__ */ e("button", {
   onClick: r,
-  className: d(z.sidebarMenuCloseButton, n),
+  className: u(z.sidebarMenuCloseButton, n),
   children: /* @__PURE__ */ e(c, {
     className: z.iconWrapper,
     children: /* @__PURE__ */ e(Bn, {
@@ -711,17 +713,17 @@ const V = ({
   collapsed: a = !1,
   hideCloseButton: o = !1,
   variant: s = "standard",
-  ...u
+  ...l
 }) => {
   const h = le(s);
   return /* @__PURE__ */ i(c, {
-    className: d(W.sidebarMenu, a ? W.collapsed : null, n),
+    className: u(W.sidebarMenu, a ? W.collapsed : null, n),
     style: {
       ["--swui-sidebar-menu-item-height"]: h,
       ["--swui-nav-bar-height"]: h
     },
     "data-collapsed": a || void 0,
-    ...u,
+    ...l,
     children: [!o && /* @__PURE__ */ i(m, {
       children: [/* @__PURE__ */ e(Nn, {
         onClick: t
@@ -769,7 +771,7 @@ const V = ({
   indent: a,
   label: o,
   loading: s,
-  left: u,
+  left: l,
   leftIcon: h,
   right: _,
   rightIcon: v,
@@ -779,7 +781,7 @@ const V = ({
   style: b,
   ...E
 }) => {
-  const N = u || h || s || f, F = d(y.button, t ? y.selected : void 0, n), w = {
+  const N = l || h || s || f, F = u(y.button, t ? y.selected : void 0, n), w = {
     ...b,
     width: C,
     height: "var(--swui-sidebar-menu-item-height)"
@@ -792,14 +794,14 @@ const V = ({
     }), /* @__PURE__ */ e(Ne, {
       label: o,
       loading: s,
-      left: u,
+      left: l,
       leftIcon: h,
       right: _,
       rightIcon: v,
       success: f,
       labelClassName: y.label,
       spinnerClassName: y.spinner,
-      iconClassName: d(y.icon),
+      iconClassName: u(y.icon),
       leftWrapperClassName: y.leftWrapper
     })]
   });
@@ -907,12 +909,12 @@ const V = ({
       const {
         type: o,
         label: s,
-        ...u
+        ...l
       } = t;
       return /* @__PURE__ */ e(D, {
         title: s,
         width: "var(--swui-sidebar-menu-item-height)",
-        ...u
+        ...l
       }, a);
     }
     case "grouped":