@forgedevstack/bear 1.3.3 → 1.3.4

package/dist/components/AlertDialog/AlertDialog.js

@@ -1,118 +1,101 @@
-import { jsxs as b, jsx as r } from "react/jsx-runtime";
-import { useId as K, useRef as _, useCallback as h, useEffect as P } from "react";
-import { createPortal as S } from "react-dom";
-import { ZERO as A } from "../../constants/numbers.const.js";
-import { LABEL_CONFIRM as $, LABEL_CANCEL as z, VARIANT_DANGER as q, BOOLEAN_FALSE as v, BOOLEAN_TRUE as V, ALERT_DESC_ID_PREFIX as X, ALERT_TITLE_ID_PREFIX as Y } from "../../constants/generals.const.js";
-import { KEY_ESCAPE as G, KEY_TAB as M } from "../../constants/keys.const.js";
-import { cn as m } from "../../utils/cn.js";
-import { Button as k } from "../Button/Button.js";
-import { Typography as L } from "../Typography/Typography.js";
-const ae = (B) => {
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { useId as I, useRef as k, useEffect as L } from "react";
+import { createPortal as T } from "react-dom";
+import { LABEL_CONFIRM as C, LABEL_CANCEL as R, VARIANT_DANGER as O, BOOLEAN_FALSE as m, BOOLEAN_TRUE as w, ALERT_DESC_ID_PREFIX as j, ALERT_TITLE_ID_PREFIX as F } from "../../constants/generals.const.js";
+import { cn as n } from "../../utils/cn.js";
+import { useFocusTrap as $ } from "../../hooks/useFocusTrap/useFocusTrap.js";
+import { Button as f } from "../Button/Button.js";
+import { Typography as g } from "../Typography/Typography.js";
+const q = (p) => {
   const {
-    isOpen: l,
-    onClose: a,
-    onConfirm: D,
-    title: N,
-    description: d,
-    confirmText: C = $,
-    cancelText: I = z,
-    confirmVariant: R = q,
-    loading: t = v,
-    loadingText: T,
-    closeOnBackdrop: w = v,
-    closeOnEscape: u = V,
-    icon: o,
-    className: O,
-    testId: F
-  } = B, f = K(), p = `${Y}${f}`, E = `${X}${f}`, n = _(null), g = _(null), c = h(
-    (e) => {
-      u && e.key === G && !t && a();
-    },
-    [u, a, t]
-  ), s = h((e) => {
-    if (e.key !== M || !n.current)
-      return;
-    const i = n.current.querySelectorAll(
-      'button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])'
-    );
-    if (i.length === A)
-      return;
-    const y = i[A], x = i[i.length - 1];
-    e.shiftKey && document.activeElement === y ? (e.preventDefault(), x.focus()) : !e.shiftKey && document.activeElement === x && (e.preventDefault(), y.focus());
-  }, []);
-  if (P(() => (l && (g.current = document.activeElement, document.addEventListener("keydown", c), document.addEventListener("keydown", s), document.body.style.overflow = "hidden", requestAnimationFrame(() => {
-    var e;
-    return (e = n.current) == null ? void 0 : e.focus();
-  })), () => {
-    var e;
-    document.removeEventListener("keydown", c), document.removeEventListener("keydown", s), document.body.style.overflow = "", (e = g.current) == null || e.focus();
-  }), [l, c, s]), !l)
+    isOpen: r,
+    onClose: i,
+    onConfirm: u,
+    title: _,
+    description: o,
+    confirmText: x = C,
+    cancelText: A = R,
+    confirmVariant: y = O,
+    loading: a = m,
+    loadingText: E,
+    closeOnBackdrop: h = m,
+    closeOnEscape: v = w,
+    icon: t,
+    className: N,
+    testId: B
+  } = p, d = I(), b = `${F}${d}`, s = `${j}${d}`, c = k(null);
+  if ($(c, {
+    enabled: r,
+    onEscape: v && !a ? i : void 0
+  }), L(() => (r && (document.body.style.overflow = "hidden"), () => {
+    document.body.style.overflow = "";
+  }), [r]), !r)
     return null;
-  const j = /* @__PURE__ */ b(
+  const D = /* @__PURE__ */ l(
     "div",
     {
       className: "Bear-AlertDialog bear-fixed bear-inset-0 bear-z-50 bear-flex bear-items-center bear-justify-center bear-p-4",
-      "data-testid": F,
+      "data-testid": B,
       children: [
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ e(
           "div",
           {
             className: "Bear-AlertDialog__backdrop bear-absolute bear-inset-0 bear-bg-black/60 bear-backdrop-blur-sm bear-transition-opacity animate-fade-in",
-            onClick: w && !t ? a : void 0,
+            onClick: h && !a ? i : void 0,
             "aria-hidden": "true"
           }
         ),
-        /* @__PURE__ */ b(
+        /* @__PURE__ */ l(
           "div",
           {
-            ref: n,
+            ref: c,
             role: "alertdialog",
             "aria-modal": "true",
-            "aria-labelledby": p,
-            "aria-describedby": d ? E : void 0,
+            "aria-labelledby": b,
+            "aria-describedby": o ? s : void 0,
             tabIndex: -1,
-            className: m(
+            className: n(
               "Bear-AlertDialog__container bear-relative bear-w-full bear-max-w-md bear-bg-white dark:bear-bg-zinc-900 bear-rounded-xl bear-shadow-2xl bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-transform bear-transition-all animate-alert-dialog-in bear-p-6",
-              O
+              N
             ),
             children: [
-              o && /* @__PURE__ */ r("div", { className: "Bear-AlertDialog__icon bear-mb-4 bear-flex bear-justify-center", children: o }),
-              /* @__PURE__ */ r(
-                L,
+              t && /* @__PURE__ */ e("div", { className: "Bear-AlertDialog__icon bear-mb-4 bear-flex bear-justify-center", children: t }),
+              /* @__PURE__ */ e(
+                g,
                 {
                   variant: "h6",
-                  id: p,
-                  className: m("Bear-AlertDialog__title bear-text-lg bear-font-semibold bear-text-gray-900 dark:bear-text-white", o && "bear-text-center"),
-                  children: N
+                  id: b,
+                  className: n("Bear-AlertDialog__title bear-text-lg bear-font-semibold bear-text-gray-900 dark:bear-text-white", t && "bear-text-center"),
+                  children: _
                 }
               ),
-              d && /* @__PURE__ */ r(
-                L,
+              o && /* @__PURE__ */ e(
+                g,
                 {
                   variant: "body2",
-                  id: E,
-                  className: m("Bear-AlertDialog__description bear-text-sm bear-text-gray-600 dark:bear-text-gray-400 bear-mt-2", o && "bear-text-center"),
-                  children: d
+                  id: s,
+                  className: n("Bear-AlertDialog__description bear-text-sm bear-text-gray-600 dark:bear-text-gray-400 bear-mt-2", t && "bear-text-center"),
+                  children: o
                 }
               ),
-              /* @__PURE__ */ b("div", { className: "Bear-AlertDialog__footer bear-flex bear-items-center bear-justify-end bear-gap-3 bear-pt-6", children: [
-                /* @__PURE__ */ r(
-                  k,
+              /* @__PURE__ */ l("div", { className: "Bear-AlertDialog__footer bear-flex bear-items-center bear-justify-end bear-gap-3 bear-pt-6", children: [
+                /* @__PURE__ */ e(
+                  f,
                   {
                     variant: "ghost",
-                    onClick: a,
-                    disabled: t,
-                    children: I
+                    onClick: i,
+                    disabled: a,
+                    children: A
                   }
                 ),
-                /* @__PURE__ */ r(
-                  k,
+                /* @__PURE__ */ e(
+                  f,
                   {
-                    variant: R,
-                    onClick: D,
-                    loading: t,
-                    loadingText: T,
-                    children: C
+                    variant: y,
+                    onClick: u,
+                    loading: a,
+                    loadingText: E,
+                    children: x
                   }
                 )
               ] })
@@ -122,8 +105,8 @@ const ae = (B) => {
       ]
     }
   );
-  return S(j, document.body);
+  return T(D, document.body);
 };
 export {
-  ae as AlertDialog
+  q as AlertDialog
 };

package/dist/components/BottomSheet/BottomSheet.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),t=require("react"),w=require("react-dom"),d=require("../../constants/numbers.const.cjs"),e=require("../../constants/generals.const.cjs"),g=require("../../constants/keys.const.cjs"),b=require("../../utils/cn.cjs"),l=require("../Box/Box.cjs"),R=require("../Button/Button.cjs"),E=require("../Flex/Flex.cjs"),j=require("@forgedevstack/bear-icons"),q=require("../Typography/Typography.cjs"),F=require("./BottomSheet.const.cjs"),v=A=>{const{isOpen:i,onClose:o,title:s,children:_,size:y=e.SIZE_MD,showCloseButton:m=e.BOOLEAN_TRUE,closeOnBackdrop:L=e.BOOLEAN_TRUE,closeOnEscape:O=e.BOOLEAN_TRUE,showHandle:N=e.BOOLEAN_TRUE,enableScroll:f=e.BOOLEAN_TRUE,isSticky:S=e.BOOLEAN_FALSE,className:p}=A,[a,h]=t.useState(i),[x,c]=t.useState(e.BOOLEAN_FALSE),[T,B]=t.useState(e.BOOLEAN_FALSE);t.useEffect(()=>{if(i){h(e.BOOLEAN_TRUE),c(e.BOOLEAN_FALSE);const n=requestAnimationFrame(()=>B(e.BOOLEAN_TRUE));return()=>cancelAnimationFrame(n)}if(a){B(e.BOOLEAN_FALSE),c(e.BOOLEAN_TRUE);const n=setTimeout(()=>{h(e.BOOLEAN_FALSE),c(e.BOOLEAN_FALSE)},d.THREE_HUNDRED);return()=>clearTimeout(n)}},[i,a]);const u=t.useCallback(n=>{O&&n.key===g.KEY_ESCAPE&&o()},[O,o]);if(t.useEffect(()=>(a&&(document.addEventListener("keydown",u),document.body.style.overflow="hidden"),()=>{document.removeEventListener("keydown",u),document.body.style.overflow=""}),[a,u]),!a)return null;const k=r.jsxs(E.Flex,{className:"bear-fixed bear-inset-0 bear-items-end bear-justify-center",style:{zIndex:d.BACKDROP_DEFAULT_Z_INDEX},children:[r.jsx(l.Box,{className:b.cn("bear-absolute bear-inset-0 bear-bg-black/60 bear-backdrop-blur-sm bear-transition-opacity",x?"bear-opacity-0":"bear-opacity-100"),style:{transitionDuration:`${d.THREE_HUNDRED}ms`},onClick:L?o:void 0,"aria-hidden":"true"}),r.jsxs(l.Box,{role:"dialog","aria-modal":"true","aria-labelledby":s?"bottom-sheet-title":void 0,className:b.cn("Bear-BottomSheet bear-relative bear-w-full bear-rounded-t-2xl bear-shadow-2xl bear-transition-transform bear-duration-300","bear-flex bear-flex-col bear-min-h-0 bear-overflow-hidden","bear-bg-white dark:bear-bg-neutral-900 bear-border-t bear-border-neutral-200 dark:bear-border-neutral-700",F.BOTTOM_SHEET_SIZE_CLASSES[y],T&&!x?"bear-translate-y-0":"bear-translate-y-full",p),children:[N&&r.jsx(E.Flex,{className:"bear-justify-center bear-pt-2 bear-pb-1",children:r.jsx(l.Box,{className:"bear-w-12 bear-h-1 bear-rounded-full bear-bg-neutral-300 dark:bear-bg-neutral-600","aria-hidden":!0})}),(s||m)&&r.jsxs(E.Flex,{className:b.cn("bear-items-center bear-justify-between bear-px-4 bear-py-3 bear-border-b bear-border-neutral-200 dark:bear-border-neutral-700 bear-shrink-0",S&&"bear-sticky bear-top-0 bear-z-10 bear-bg-white dark:bear-bg-neutral-900"),children:[s&&r.jsx(q.Typography,{id:"bottom-sheet-title",weight:"semibold",className:"bear-text-lg bear-text-neutral-900 dark:bear-text-white",children:s}),m&&r.jsx(R.Button,{variant:e.VARIANT_GHOST,onClick:o,"aria-label":e.LABEL_CLOSE,children:r.jsx(j.XIcon,{className:"bear-w-5 bear-h-5"})})]}),r.jsx(l.Box,{className:b.cn("bear-flex-1 bear-min-h-0 bear-p-4 bear-text-neutral-700 dark:bear-text-neutral-300",f?"bear-overflow-y-auto":"bear-overflow-hidden"),children:_})]})]});return w.createPortal(k,document.body)};exports.BottomSheet=v;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),t=require("react"),R=require("react-dom"),g=require("../../hooks/useFocusTrap/useFocusTrap.cjs"),m=require("../../constants/numbers.const.cjs"),e=require("../../constants/generals.const.cjs"),F=require("../../constants/keys.const.cjs"),l=require("../../utils/cn.cjs"),b=require("../Box/Box.cjs"),j=require("../Button/Button.cjs"),O=require("../Flex/Flex.cjs"),q=require("@forgedevstack/bear-icons"),v=require("../Typography/Typography.cjs"),C=require("./BottomSheet.const.cjs"),U=_=>{const{isOpen:i,onClose:n,title:o,children:f,size:y=e.SIZE_MD,showCloseButton:h=e.BOOLEAN_TRUE,closeOnBackdrop:L=e.BOOLEAN_TRUE,closeOnEscape:c=e.BOOLEAN_TRUE,showHandle:N=e.BOOLEAN_TRUE,enableScroll:S=e.BOOLEAN_TRUE,isSticky:p=e.BOOLEAN_FALSE,className:T}=_,[a,x]=t.useState(i),[u,d]=t.useState(e.BOOLEAN_FALSE),[k,B]=t.useState(e.BOOLEAN_FALSE);t.useEffect(()=>{if(i){x(e.BOOLEAN_TRUE),d(e.BOOLEAN_FALSE);const s=requestAnimationFrame(()=>B(e.BOOLEAN_TRUE));return()=>cancelAnimationFrame(s)}if(a){B(e.BOOLEAN_FALSE),d(e.BOOLEAN_TRUE);const s=setTimeout(()=>{x(e.BOOLEAN_FALSE),d(e.BOOLEAN_FALSE)},m.THREE_HUNDRED);return()=>clearTimeout(s)}},[i,a]);const A=t.useRef(null);g.useFocusTrap(A,{enabled:a&&!u,onEscape:c?n:void 0});const E=t.useCallback(s=>{c&&s.key===F.KEY_ESCAPE&&n()},[c,n]);if(t.useEffect(()=>(a&&(document.addEventListener("keydown",E),document.body.style.overflow="hidden"),()=>{document.removeEventListener("keydown",E),document.body.style.overflow=""}),[a,E]),!a)return null;const w=r.jsxs(O.Flex,{className:"bear-fixed bear-inset-0 bear-items-end bear-justify-center",style:{zIndex:m.BACKDROP_DEFAULT_Z_INDEX},children:[r.jsx(b.Box,{className:l.cn("bear-absolute bear-inset-0 bear-bg-black/60 bear-backdrop-blur-sm bear-transition-opacity",u?"bear-opacity-0":"bear-opacity-100"),style:{transitionDuration:`${m.THREE_HUNDRED}ms`},onClick:L?n:void 0,"aria-hidden":"true"}),r.jsxs(b.Box,{ref:A,role:"dialog",tabIndex:-1,"aria-modal":"true","aria-labelledby":o?"bottom-sheet-title":void 0,className:l.cn("Bear-BottomSheet bear-relative bear-w-full bear-rounded-t-2xl bear-shadow-2xl bear-transition-transform bear-duration-300","bear-flex bear-flex-col bear-min-h-0 bear-overflow-hidden","bear-bg-white dark:bear-bg-neutral-900 bear-border-t bear-border-neutral-200 dark:bear-border-neutral-700",C.BOTTOM_SHEET_SIZE_CLASSES[y],k&&!u?"bear-translate-y-0":"bear-translate-y-full",T),children:[N&&r.jsx(O.Flex,{className:"bear-justify-center bear-pt-2 bear-pb-1",children:r.jsx(b.Box,{className:"bear-w-12 bear-h-1 bear-rounded-full bear-bg-neutral-300 dark:bear-bg-neutral-600","aria-hidden":!0})}),(o||h)&&r.jsxs(O.Flex,{className:l.cn("bear-items-center bear-justify-between bear-px-4 bear-py-3 bear-border-b bear-border-neutral-200 dark:bear-border-neutral-700 bear-shrink-0",p&&"bear-sticky bear-top-0 bear-z-10 bear-bg-white dark:bear-bg-neutral-900"),children:[o&&r.jsx(v.Typography,{id:"bottom-sheet-title",weight:"semibold",className:"bear-text-lg bear-text-neutral-900 dark:bear-text-white",children:o}),h&&r.jsx(j.Button,{variant:e.VARIANT_GHOST,onClick:n,"aria-label":e.LABEL_CLOSE,children:r.jsx(q.XIcon,{className:"bear-w-5 bear-h-5"})})]}),r.jsx(b.Box,{className:l.cn("bear-flex-1 bear-min-h-0 bear-p-4 bear-text-neutral-700 dark:bear-text-neutral-300",S?"bear-overflow-y-auto":"bear-overflow-hidden"),children:f})]})]});return R.createPortal(w,document.body)};exports.BottomSheet=U;

package/dist/components/BottomSheet/BottomSheet.js

@@ -1,99 +1,107 @@
-import { jsxs as c, jsx as r } from "react/jsx-runtime";
-import { useState as u, useEffect as w, useCallback as L } from "react";
-import { createPortal as I } from "react-dom";
-import { THREE_HUNDRED as x, BACKDROP_DEFAULT_Z_INDEX as D } from "../../constants/numbers.const.js";
-import { SIZE_MD as H, BOOLEAN_TRUE as e, BOOLEAN_FALSE as a, LABEL_CLOSE as j, VARIANT_GHOST as F } from "../../constants/generals.const.js";
-import { KEY_ESCAPE as R } from "../../constants/keys.const.js";
+import { jsxs as f, jsx as r } from "react/jsx-runtime";
+import { useState as p, useEffect as w, useRef as I, useCallback as D } from "react";
+import { createPortal as R } from "react-dom";
+import { useFocusTrap as F } from "../../hooks/useFocusTrap/useFocusTrap.js";
+import { THREE_HUNDRED as N, BACKDROP_DEFAULT_Z_INDEX as H } from "../../constants/numbers.const.js";
+import { SIZE_MD as j, BOOLEAN_TRUE as e, BOOLEAN_FALSE as a, LABEL_CLOSE as M, VARIANT_GHOST as z } from "../../constants/generals.const.js";
+import { KEY_ESCAPE as P } from "../../constants/keys.const.js";
 import { cn as i } from "../../utils/cn.js";
-import { Box as l } from "../Box/Box.js";
-import { Button as M } from "../Button/Button.js";
-import { Flex as f } from "../Flex/Flex.js";
-import { XIcon as z } from "@forgedevstack/bear-icons";
-import { Typography as P } from "../Typography/Typography.js";
-import { BOTTOM_SHEET_SIZE_CLASSES as U } from "./BottomSheet.const.js";
-const ae = (N) => {
+import { Box as s } from "../Box/Box.js";
+import { Button as U } from "../Button/Button.js";
+import { Flex as h } from "../Flex/Flex.js";
+import { XIcon as Z } from "@forgedevstack/bear-icons";
+import { Typography as K } from "../Typography/Typography.js";
+import { BOTTOM_SHEET_SIZE_CLASSES as X } from "./BottomSheet.const.js";
+const be = (S) => {
   const {
-    isOpen: s,
-    onClose: n,
+    isOpen: l,
+    onClose: o,
     title: b,
-    children: S,
-    size: O = H,
-    showCloseButton: p = e,
-    closeOnBackdrop: g = e,
-    closeOnEscape: h = e,
+    children: O,
+    size: g = j,
+    showCloseButton: y = e,
+    closeOnBackdrop: v = e,
+    closeOnEscape: d = e,
     showHandle: _ = e,
-    enableScroll: v = e,
-    isSticky: A = a,
-    className: B
-  } = N, [t, y] = u(s), [E, d] = u(a), [C, k] = u(a);
+    enableScroll: A = e,
+    isSticky: B = a,
+    className: T
+  } = S, [t, E] = p(l), [m, c] = p(a), [C, k] = p(a);
   w(() => {
-    if (s) {
-      y(e), d(a);
-      const o = requestAnimationFrame(() => k(e));
-      return () => cancelAnimationFrame(o);
+    if (l) {
+      E(e), c(a);
+      const n = requestAnimationFrame(() => k(e));
+      return () => cancelAnimationFrame(n);
     }
     if (t) {
-      k(a), d(e);
-      const o = setTimeout(() => {
-        y(a), d(a);
-      }, x);
-      return () => clearTimeout(o);
+      k(a), c(e);
+      const n = setTimeout(() => {
+        E(a), c(a);
+      }, N);
+      return () => clearTimeout(n);
     }
-  }, [s, t]);
-  const m = L(
-    (o) => {
-      h && o.key === R && n();
+  }, [l, t]);
+  const x = I(null);
+  F(x, {
+    enabled: t && !m,
+    onEscape: d ? o : void 0
+  });
+  const u = D(
+    (n) => {
+      d && n.key === P && o();
     },
-    [h, n]
+    [d, o]
   );
-  if (w(() => (t && (document.addEventListener("keydown", m), document.body.style.overflow = "hidden"), () => {
-    document.removeEventListener("keydown", m), document.body.style.overflow = "";
-  }), [t, m]), !t)
+  if (w(() => (t && (document.addEventListener("keydown", u), document.body.style.overflow = "hidden"), () => {
+    document.removeEventListener("keydown", u), document.body.style.overflow = "";
+  }), [t, u]), !t)
     return null;
-  const T = /* @__PURE__ */ c(
-    f,
+  const L = /* @__PURE__ */ f(
+    h,
     {
       className: "bear-fixed bear-inset-0 bear-items-end bear-justify-center",
-      style: { zIndex: D },
+      style: { zIndex: H },
       children: [
         /* @__PURE__ */ r(
-          l,
+          s,
           {
             className: i(
               "bear-absolute bear-inset-0 bear-bg-black/60 bear-backdrop-blur-sm bear-transition-opacity",
-              E ? "bear-opacity-0" : "bear-opacity-100"
+              m ? "bear-opacity-0" : "bear-opacity-100"
             ),
-            style: { transitionDuration: `${x}ms` },
-            onClick: g ? n : void 0,
+            style: { transitionDuration: `${N}ms` },
+            onClick: v ? o : void 0,
             "aria-hidden": "true"
           }
         ),
-        /* @__PURE__ */ c(
-          l,
+        /* @__PURE__ */ f(
+          s,
           {
+            ref: x,
             role: "dialog",
+            tabIndex: -1,
             "aria-modal": "true",
             "aria-labelledby": b ? "bottom-sheet-title" : void 0,
             className: i(
               "Bear-BottomSheet bear-relative bear-w-full bear-rounded-t-2xl bear-shadow-2xl bear-transition-transform bear-duration-300",
               "bear-flex bear-flex-col bear-min-h-0 bear-overflow-hidden",
               "bear-bg-white dark:bear-bg-neutral-900 bear-border-t bear-border-neutral-200 dark:bear-border-neutral-700",
-              U[O],
-              C && !E ? "bear-translate-y-0" : "bear-translate-y-full",
-              B
+              X[g],
+              C && !m ? "bear-translate-y-0" : "bear-translate-y-full",
+              T
             ),
             children: [
-              _ && /* @__PURE__ */ r(f, { className: "bear-justify-center bear-pt-2 bear-pb-1", children: /* @__PURE__ */ r(l, { className: "bear-w-12 bear-h-1 bear-rounded-full bear-bg-neutral-300 dark:bear-bg-neutral-600", "aria-hidden": !0 }) }),
-              (b || p) && /* @__PURE__ */ c(
-                f,
+              _ && /* @__PURE__ */ r(h, { className: "bear-justify-center bear-pt-2 bear-pb-1", children: /* @__PURE__ */ r(s, { className: "bear-w-12 bear-h-1 bear-rounded-full bear-bg-neutral-300 dark:bear-bg-neutral-600", "aria-hidden": !0 }) }),
+              (b || y) && /* @__PURE__ */ f(
+                h,
                 {
                   className: i(
                     "bear-items-center bear-justify-between bear-px-4 bear-py-3 bear-border-b bear-border-neutral-200 dark:bear-border-neutral-700 bear-shrink-0",
-                    A && "bear-sticky bear-top-0 bear-z-10 bear-bg-white dark:bear-bg-neutral-900"
+                    B && "bear-sticky bear-top-0 bear-z-10 bear-bg-white dark:bear-bg-neutral-900"
                   ),
                   children: [
                     b && /* @__PURE__ */ r(
-                      P,
+                      K,
                       {
                         id: "bottom-sheet-title",
                         weight: "semibold",
@@ -101,18 +109,18 @@ const ae = (N) => {
                         children: b
                       }
                     ),
-                    p && /* @__PURE__ */ r(M, { variant: F, onClick: n, "aria-label": j, children: /* @__PURE__ */ r(z, { className: "bear-w-5 bear-h-5" }) })
+                    y && /* @__PURE__ */ r(U, { variant: z, onClick: o, "aria-label": M, children: /* @__PURE__ */ r(Z, { className: "bear-w-5 bear-h-5" }) })
                   ]
                 }
               ),
               /* @__PURE__ */ r(
-                l,
+                s,
                 {
                   className: i(
                     "bear-flex-1 bear-min-h-0 bear-p-4 bear-text-neutral-700 dark:bear-text-neutral-300",
-                    v ? "bear-overflow-y-auto" : "bear-overflow-hidden"
+                    A ? "bear-overflow-y-auto" : "bear-overflow-hidden"
                   ),
-                  children: S
+                  children: O
                 }
               )
             ]
@@ -121,8 +129,8 @@ const ae = (N) => {
       ]
     }
   );
-  return I(T, document.body);
+  return R(L, document.body);
 };
 export {
-  ae as BottomSheet
+  be as BottomSheet
 };

package/dist/components/ChipGroup/ChipGroup.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),s=require("react"),e=require("./ChipGroup.const.cjs"),n=require("../../utils/cn.cjs"),b=require("../../utils/generateBearId.utils.cjs"),h=require("../../utils/useBearId.cjs"),v=S=>{const{id:C,testId:m,children:O,max:l,size:P="md",spacing:p="md",overflowMenu:i=!1,onDeleteAll:_,deleteAllLabel:I=e.CHIP_GROUP_DEFAULT_DELETE_ALL_LABEL,className:A,...R}=S,E=h.useBearId("ChipGroup"),L=b.resolveBearId(C,E),[a,c]=s.useState(!1),o=s.Children.toArray(O).filter(s.isValidElement).map(t=>s.isValidElement(t)?s.cloneElement(t,{size:t.props.size??P}):t),G=typeof l=="number"?o.slice(0,l):o,d=typeof l=="number"?o.slice(l):[],u=d.length;return r.jsxs("div",{...R,id:L,"data-testid":m,className:n.cn(e.CHIP_GROUP_ROOT_CLASS,e.CHIP_GROUP_BASE_CLASSES,e.CHIP_GROUP_SPACING_CLASSES[p],A),children:[G,u>0&&r.jsxs("div",{className:`${e.CHIP_GROUP_ROOT_CLASS}__overflow-wrap bear-relative`,children:[r.jsxs("button",{type:"button",className:n.cn(`${e.CHIP_GROUP_ROOT_CLASS}__overflow`,e.CHIP_GROUP_OVERFLOW_CLASSES),onClick:()=>i&&c(t=>!t),"aria-expanded":i?a:void 0,"aria-haspopup":i?"menu":void 0,children:["+",u]}),i&&a&&r.jsxs("div",{role:"menu",className:n.cn(`${e.CHIP_GROUP_ROOT_CLASS}__menu`,e.CHIP_GROUP_MENU_CLASSES),children:[d.map((t,U)=>r.jsx("div",{role:"menuitem",className:n.cn(`${e.CHIP_GROUP_ROOT_CLASS}__menu-item`,e.CHIP_GROUP_MENU_ITEM_CLASSES),children:t},`overflow-${U}`)),_&&r.jsx("button",{type:"button",role:"menuitem",className:n.cn(`${e.CHIP_GROUP_ROOT_CLASS}__delete-all`,e.CHIP_GROUP_MENU_ITEM_CLASSES,"bear-text-red-600 dark:bear-text-red-400 bear-w-full bear-text-left"),onClick:()=>{_(),c(!1)},children:I})]})]})]})};exports.ChipGroup=v;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),r=require("react"),e=require("./ChipGroup.const.cjs"),n=require("../../utils/cn.cjs"),T=require("../../utils/generateBearId.utils.cjs"),h=require("../../utils/useBearId.cjs"),M=require("../../context/BearProvider.cjs");require("../../context/defaultTheme.cjs");const l=require("../../constants/generals.const.cjs"),x=O=>{const{id:P,testId:m,children:I,max:i,size:p="md",spacing:A="md",overflowMenu:_=!1,onDeleteAll:c,deleteAllLabel:E=e.CHIP_GROUP_DEFAULT_DELETE_ALL_LABEL,className:R,...L}=O,{density:G}=M.useBearDensityOptional(),o=G===l.DENSITY_COMPACT,U=o?l.SIZE_SM:A,f=o?l.SIZE_SM:p,v=h.useBearId(e.COMPONENT_NAME_CHIP_GROUP),b=T.resolveBearId(P,v),[d,S]=r.useState(!1),a=r.Children.toArray(I).filter(r.isValidElement).map(t=>r.isValidElement(t)?r.cloneElement(t,{size:t.props.size??f}):t),H=typeof i=="number"?a.slice(0,i):a,C=typeof i=="number"?a.slice(i):[],u=C.length;return s.jsxs("div",{...L,id:b,"data-testid":m,className:n.cn(e.CHIP_GROUP_ROOT_CLASS,e.CHIP_GROUP_BASE_CLASSES,e.CHIP_GROUP_SPACING_CLASSES[U],o&&e.CHIP_GROUP_COMPACT_CLASS,R),children:[H,u>0&&s.jsxs("div",{className:`${e.CHIP_GROUP_ROOT_CLASS}__overflow-wrap bear-relative`,children:[s.jsxs("button",{type:"button",className:n.cn(`${e.CHIP_GROUP_ROOT_CLASS}__overflow`,e.CHIP_GROUP_OVERFLOW_CLASSES),onClick:()=>_&&S(t=>!t),"aria-expanded":_?d:void 0,"aria-haspopup":_?"menu":void 0,children:["+",u]}),_&&d&&s.jsxs("div",{role:"menu",className:n.cn(`${e.CHIP_GROUP_ROOT_CLASS}__menu`,e.CHIP_GROUP_MENU_CLASSES),children:[C.map((t,N)=>s.jsx("div",{role:"menuitem",className:n.cn(`${e.CHIP_GROUP_ROOT_CLASS}__menu-item`,e.CHIP_GROUP_MENU_ITEM_CLASSES),children:t},`overflow-${N}`)),c&&s.jsx("button",{type:"button",role:"menuitem",className:n.cn(`${e.CHIP_GROUP_ROOT_CLASS}__delete-all`,e.CHIP_GROUP_MENU_ITEM_CLASSES,"bear-text-red-600 dark:bear-text-red-400 bear-w-full bear-text-left"),onClick:()=>{c(),S(!1)},children:E})]})]})]})};exports.ChipGroup=x;

package/dist/components/ChipGroup/ChipGroup.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="Bear-ChipGroup",r="bear-inline-flex bear-flex-wrap bear-items-center",a={sm:"bear-gap-1",md:"bear-gap-2",lg:"bear-gap-3"},b="bear-inline-flex bear-items-center bear-justify-center bear-h-8 bear-min-w-8 bear-px-2 bear-rounded-full bear-text-sm bear-font-medium bear-bg-gray-200 bear-text-gray-700 dark:bear-bg-zinc-700 dark:bear-text-zinc-200 bear-border-none bear-cursor-pointer",_="Delete all",S="bear-absolute bear-z-20 bear-top-full bear-left-0 bear-mt-1 bear-min-w-[10rem] bear-rounded-lg bear-border bear-border-[var(--bear-border-default)] bear-bg-[var(--bear-bg-primary)] bear-shadow-lg bear-p-2 bear-flex bear-flex-col bear-gap-2",t="bear-text-sm";exports.CHIP_GROUP_BASE_CLASSES=r;exports.CHIP_GROUP_DEFAULT_DELETE_ALL_LABEL=_;exports.CHIP_GROUP_MENU_CLASSES=S;exports.CHIP_GROUP_MENU_ITEM_CLASSES=t;exports.CHIP_GROUP_OVERFLOW_CLASSES=b;exports.CHIP_GROUP_ROOT_CLASS=e;exports.CHIP_GROUP_SPACING_CLASSES=a;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="Bear-ChipGroup",r="bear-inline-flex bear-flex-wrap bear-items-center",a={sm:"bear-gap-1",md:"bear-gap-2",lg:"bear-gap-3"},_="bear-inline-flex bear-items-center bear-justify-center bear-h-8 bear-min-w-8 bear-px-2 bear-rounded-full bear-text-sm bear-font-medium bear-bg-gray-200 bear-text-gray-700 dark:bear-bg-zinc-700 dark:bear-text-zinc-200 bear-border-none bear-cursor-pointer",b="Delete all",S="bear-absolute bear-z-20 bear-top-full bear-left-0 bear-mt-1 bear-min-w-[10rem] bear-rounded-lg bear-border bear-border-[var(--bear-border-default)] bear-bg-[var(--bear-bg-primary)] bear-shadow-lg bear-p-2 bear-flex bear-flex-col bear-gap-2",C="bear-text-sm",P="ChipGroup",t="Bear-ChipGroup--compact";exports.CHIP_GROUP_BASE_CLASSES=r;exports.CHIP_GROUP_COMPACT_CLASS=t;exports.CHIP_GROUP_DEFAULT_DELETE_ALL_LABEL=b;exports.CHIP_GROUP_MENU_CLASSES=S;exports.CHIP_GROUP_MENU_ITEM_CLASSES=C;exports.CHIP_GROUP_OVERFLOW_CLASSES=_;exports.CHIP_GROUP_ROOT_CLASS=e;exports.CHIP_GROUP_SPACING_CLASSES=a;exports.COMPONENT_NAME_CHIP_GROUP=P;

package/dist/components/ChipGroup/ChipGroup.const.d.ts

@@ -9,3 +9,5 @@ export declare const CHIP_GROUP_OVERFLOW_CLASSES = "bear-inline-flex bear-items-
 export declare const CHIP_GROUP_DEFAULT_DELETE_ALL_LABEL = "Delete all";
 export declare const CHIP_GROUP_MENU_CLASSES = "bear-absolute bear-z-20 bear-top-full bear-left-0 bear-mt-1 bear-min-w-[10rem] bear-rounded-lg bear-border bear-border-[var(--bear-border-default)] bear-bg-[var(--bear-bg-primary)] bear-shadow-lg bear-p-2 bear-flex bear-flex-col bear-gap-2";
 export declare const CHIP_GROUP_MENU_ITEM_CLASSES = "bear-text-sm";
+export declare const COMPONENT_NAME_CHIP_GROUP = "ChipGroup";
+export declare const CHIP_GROUP_COMPACT_CLASS = "Bear-ChipGroup--compact";

package/dist/components/ChipGroup/ChipGroup.const.js

@@ -2,13 +2,15 @@ const e = "Bear-ChipGroup", r = "bear-inline-flex bear-flex-wrap bear-items-cent
   sm: "bear-gap-1",
   md: "bear-gap-2",
   lg: "bear-gap-3"
-}, b = "bear-inline-flex bear-items-center bear-justify-center bear-h-8 bear-min-w-8 bear-px-2 bear-rounded-full bear-text-sm bear-font-medium bear-bg-gray-200 bear-text-gray-700 dark:bear-bg-zinc-700 dark:bear-text-zinc-200 bear-border-none bear-cursor-pointer", t = "Delete all", n = "bear-absolute bear-z-20 bear-top-full bear-left-0 bear-mt-1 bear-min-w-[10rem] bear-rounded-lg bear-border bear-border-[var(--bear-border-default)] bear-bg-[var(--bear-bg-primary)] bear-shadow-lg bear-p-2 bear-flex bear-flex-col bear-gap-2", _ = "bear-text-sm";
+}, b = "bear-inline-flex bear-items-center bear-justify-center bear-h-8 bear-min-w-8 bear-px-2 bear-rounded-full bear-text-sm bear-font-medium bear-bg-gray-200 bear-text-gray-700 dark:bear-bg-zinc-700 dark:bear-text-zinc-200 bear-border-none bear-cursor-pointer", t = "Delete all", _ = "bear-absolute bear-z-20 bear-top-full bear-left-0 bear-mt-1 bear-min-w-[10rem] bear-rounded-lg bear-border bear-border-[var(--bear-border-default)] bear-bg-[var(--bear-bg-primary)] bear-shadow-lg bear-p-2 bear-flex bear-flex-col bear-gap-2", o = "bear-text-sm", n = "ChipGroup", C = "Bear-ChipGroup--compact";
 export {
   r as CHIP_GROUP_BASE_CLASSES,
+  C as CHIP_GROUP_COMPACT_CLASS,
   t as CHIP_GROUP_DEFAULT_DELETE_ALL_LABEL,
-  n as CHIP_GROUP_MENU_CLASSES,
-  _ as CHIP_GROUP_MENU_ITEM_CLASSES,
+  _ as CHIP_GROUP_MENU_CLASSES,
+  o as CHIP_GROUP_MENU_ITEM_CLASSES,
   b as CHIP_GROUP_OVERFLOW_CLASSES,
   e as CHIP_GROUP_ROOT_CLASS,
-  a as CHIP_GROUP_SPACING_CLASSES
+  a as CHIP_GROUP_SPACING_CLASSES,
+  n as COMPONENT_NAME_CHIP_GROUP
 };

package/dist/components/ChipGroup/ChipGroup.js

@@ -1,83 +1,87 @@
-import { jsxs as n, jsx as c } from "react/jsx-runtime";
-import { useState as N, Children as U, isValidElement as p, cloneElement as R } from "react";
-import { CHIP_GROUP_DEFAULT_DELETE_ALL_LABEL as x, CHIP_GROUP_ROOT_CLASS as r, CHIP_GROUP_OVERFLOW_CLASSES as w, CHIP_GROUP_MENU_ITEM_CLASSES as u, CHIP_GROUP_MENU_CLASSES as y, CHIP_GROUP_SPACING_CLASSES as H, CHIP_GROUP_BASE_CLASSES as $ } from "./ChipGroup.const.js";
-import { cn as t } from "../../utils/cn.js";
-import { resolveBearId as M } from "../../utils/generateBearId.utils.js";
-import { useBearId as z } from "../../utils/useBearId.js";
-const V = (C) => {
+import { jsxs as i, jsx as p } from "react/jsx-runtime";
+import { useState as H, Children as x, isValidElement as C, cloneElement as T } from "react";
+import { CHIP_GROUP_DEFAULT_DELETE_ALL_LABEL as w, COMPONENT_NAME_CHIP_GROUP as $, CHIP_GROUP_ROOT_CLASS as t, CHIP_GROUP_OVERFLOW_CLASSES as z, CHIP_GROUP_MENU_ITEM_CLASSES as S, CHIP_GROUP_MENU_CLASSES as B, CHIP_GROUP_COMPACT_CLASS as D, CHIP_GROUP_SPACING_CLASSES as g, CHIP_GROUP_BASE_CLASSES as k } from "./ChipGroup.const.js";
+import { cn as r } from "../../utils/cn.js";
+import { resolveBearId as j } from "../../utils/generateBearId.utils.js";
+import { useBearId as F } from "../../utils/useBearId.js";
+import { useBearDensityOptional as V } from "../../context/BearProvider.js";
+import "../../context/defaultTheme.js";
+import { SIZE_SM as f, DENSITY_COMPACT as W } from "../../constants/generals.const.js";
+const oe = (u) => {
   const {
-    id: S,
-    testId: f,
-    children: E,
+    id: P,
+    testId: E,
+    children: A,
     max: o,
-    size: A = "md",
-    spacing: P = "md",
-    overflowMenu: l = !1,
+    size: O = "md",
+    spacing: I = "md",
+    overflowMenu: n = !1,
     onDeleteAll: a,
-    deleteAllLabel: v = x,
-    className: I,
-    ...L
-  } = C, b = z("ChipGroup"), h = M(S, b), [i, m] = N(!1), s = U.toArray(E).filter(p).map(
-    (e) => p(e) ? R(e, {
-      size: e.props.size ?? A
+    deleteAllLabel: v = w,
+    className: L,
+    ...N
+  } = u, { density: b } = V(), s = b === W, h = s ? f : I, U = s ? f : O, G = F($), R = j(P, G), [m, _] = H(!1), l = x.toArray(A).filter(C).map(
+    (e) => C(e) ? T(e, {
+      size: e.props.size ?? U
     }) : e
-  ), O = typeof o == "number" ? s.slice(0, o) : s, d = typeof o == "number" ? s.slice(o) : [], _ = d.length;
-  return /* @__PURE__ */ n(
+  ), M = typeof o == "number" ? l.slice(0, o) : l, d = typeof o == "number" ? l.slice(o) : [], c = d.length;
+  return /* @__PURE__ */ i(
     "div",
     {
-      ...L,
-      id: h,
-      "data-testid": f,
-      className: t(
-        r,
-        $,
-        H[P],
-        I
+      ...N,
+      id: R,
+      "data-testid": E,
+      className: r(
+        t,
+        k,
+        g[h],
+        s && D,
+        L
       ),
       children: [
-        O,
-        _ > 0 && /* @__PURE__ */ n("div", { className: `${r}__overflow-wrap bear-relative`, children: [
-          /* @__PURE__ */ n(
+        M,
+        c > 0 && /* @__PURE__ */ i("div", { className: `${t}__overflow-wrap bear-relative`, children: [
+          /* @__PURE__ */ i(
             "button",
             {
               type: "button",
-              className: t(`${r}__overflow`, w),
-              onClick: () => l && m((e) => !e),
-              "aria-expanded": l ? i : void 0,
-              "aria-haspopup": l ? "menu" : void 0,
+              className: r(`${t}__overflow`, z),
+              onClick: () => n && _((e) => !e),
+              "aria-expanded": n ? m : void 0,
+              "aria-haspopup": n ? "menu" : void 0,
               children: [
                 "+",
-                _
+                c
               ]
             }
           ),
-          l && i && /* @__PURE__ */ n(
+          n && m && /* @__PURE__ */ i(
             "div",
             {
               role: "menu",
-              className: t(`${r}__menu`, y),
+              className: r(`${t}__menu`, B),
               children: [
-                d.map((e, G) => /* @__PURE__ */ c(
+                d.map((e, y) => /* @__PURE__ */ p(
                   "div",
                   {
                     role: "menuitem",
-                    className: t(`${r}__menu-item`, u),
+                    className: r(`${t}__menu-item`, S),
                     children: e
                   },
-                  `overflow-${G}`
+                  `overflow-${y}`
                 )),
-                a && /* @__PURE__ */ c(
+                a && /* @__PURE__ */ p(
                   "button",
                   {
                     type: "button",
                     role: "menuitem",
-                    className: t(
-                      `${r}__delete-all`,
-                      u,
+                    className: r(
+                      `${t}__delete-all`,
+                      S,
                       "bear-text-red-600 dark:bear-text-red-400 bear-w-full bear-text-left"
                     ),
                     onClick: () => {
-                      a(), m(!1);
+                      a(), _(!1);
                     },
                     children: v
                   }
@@ -91,5 +95,5 @@ const V = (C) => {
   );
 };
 export {
-  V as ChipGroup
+  oe as ChipGroup
 };

package/dist/components/CommandPalette/CommandItem.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),s=require("../../utils/cn.cjs");require("react");const n=require("./CommandPalette.utils.cjs"),l=({command:e,isHighlighted:a,onSelect:t})=>r.jsxs("button",{type:"button",onClick:t,disabled:e.disabled,className:s.cn("Bear-CommandPalette__item bear-w-full bear-flex bear-items-center bear-gap-3 bear-px-4 bear-py-2.5 bear-text-left bear-transition-colors",a?"bear-bg-primary-500/20 bear-text-primary-400":"bear-text-gray-700 dark:bear-text-zinc-300 hover:bear-bg-gray-100 dark:hover:bear-bg-zinc-700",e.disabled&&"bear-opacity-50 bear-cursor-not-allowed"),children:[e.icon&&r.jsx("span",{className:"Bear-CommandPalette__item-icon bear-text-gray-500 dark:bear-text-zinc-400 bear-shrink-0",children:e.icon}),r.jsxs("div",{className:"Bear-CommandPalette__item-content bear-flex-1 bear-min-w-0",children:[r.jsx("div",{className:"Bear-CommandPalette__item-label bear-text-sm bear-font-medium bear-truncate",children:e.label}),e.description&&r.jsx("div",{className:"Bear-CommandPalette__item-description bear-text-xs bear-text-gray-500 dark:bear-text-zinc-500 bear-truncate",children:e.description})]}),e.shortcut&&r.jsx("div",{className:"Bear-CommandPalette__item-shortcut bear-flex bear-gap-1 bear-shrink-0",children:n.formatShortcut(e.shortcut).map((b,i)=>r.jsx("kbd",{className:"bear-px-1.5 bear-py-0.5 bear-text-xs bear-font-mono bear-bg-gray-200 bear-text-gray-600 dark:bear-bg-zinc-700 dark:bear-text-zinc-400 bear-rounded",children:b},i))})]});exports.CommandItem=l;

package/dist/components/CommandPalette/CommandItem.d.ts

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+import { CommandItemComponentProps } from './CommandPalette.types';
+/**
+ * CommandItem - Single command item within CommandPalette
+ */
+export declare const CommandItem: FC<CommandItemComponentProps>;