@forgedevstack/bear 1.2.6 → 1.2.7

package/dist/components/Button/Button.js

@@ -1,18 +1,18 @@
 import { jsxs as N, jsx as r } from "react/jsx-runtime";
-import { forwardRef as ye, useState as Ne, useContext as Ie, useMemo as Te } from "react";
+import { forwardRef as Ie, useState as Ce, useContext as Te, useMemo as Se } from "react";
 import { cn as s } from "../../utils/cn.js";
-import { resolveBearId as Ce } from "../../utils/generateBearId.utils.js";
-import { useBearId as Se } from "../../utils/useBearId.js";
-import { Spinner as Me } from "../Spinner/Spinner.js";
-import { Typography as L } from "../Typography/Typography.js";
-import { useBearStyles as $e } from "../../hooks/useBearStyles.js";
+import { resolveBearId as Me } from "../../utils/generateBearId.utils.js";
+import { useBearId as $e } from "../../utils/useBearId.js";
+import { Spinner as we } from "../Spinner/Spinner.js";
+import { Typography as D } from "../Typography/Typography.js";
+import { useBearStyles as Oe } from "../../hooks/useBearStyles.js";
 import "../../hooks/useBearComponent/useBearComponent.js";
-import { BearContext as we } from "../../context/BearProvider.js";
+import { useBearDensityOptional as ke, BearContext as Ee } from "../../context/BearProvider.js";
 import "../FormControl/FormControl.context.js";
-import { VARIANT_DEFAULTS as P, BUTTON_ICON_SIZE as D, BUTTON_VARIANT as Oe, BUTTON_ICON_ONLY_SIZE as ke, BUTTON_COMPACT_SIZE as Ee, BUTTON_SIZE as Re, BUTTON_RADIUS as ze } from "./Button.constants.js";
+import { VARIANT_DEFAULTS as L, BUTTON_ICON_SIZE as P, BUTTON_VARIANT as Re, BUTTON_ICON_ONLY_SIZE as ze, BUTTON_COMPACT_SIZE as Ue, BUTTON_SIZE as Ve, BUTTON_RADIUS as Ae } from "./Button.constants.js";
 import { isBuiltInVariant as Z } from "./Button.utils.js";
-import { useSpotlight as Ue } from "./useSpotlight.js";
-const Ve = ye(
+import { useSpotlight as De } from "./useSpotlight.js";
+const Le = Ie(
   (j, d) => {
     var V, A;
     const {
@@ -25,18 +25,18 @@ const Ve = ye(
       iconPosition: I = "left",
       leftIcon: F,
       rightIcon: H,
-      textVariant: T = "inherit",
+      textVariant: C = "inherit",
       iconOnly: W = !1,
       radius: X = "default",
       ripple: q = !1,
       disableRipple: G = !1,
       disableElevation: J = !1,
-      href: b,
+      href: c,
       component: K = "button",
       tooltip: Q,
-      compact: ee = !1,
-      gradient: c,
-      gradientDirection: C = 135,
+      compact: ee,
+      gradient: b,
+      gradientDirection: T = 135,
       prefix: S,
       suffix: M,
       spotlight: $ = !1,
@@ -49,12 +49,12 @@ const Ve = ye(
       testId: ie,
       bis: se,
       style: le,
-      onMouseMove: be,
-      onMouseEnter: ce,
+      onMouseMove: ce,
+      onMouseEnter: be,
       onMouseLeave: de,
       onClick: g,
       ...ue
-    } = j, pe = Se("Button"), fe = Ce(ne, pe), w = q && !G, B = re || l, v = $e(se, le), O = F ?? (u && I === "left" ? u : void 0), k = H ?? (u && I === "right" ? u : void 0), [E, R] = Ne(null), me = (t) => {
+    } = j, pe = $e("Button"), fe = Me(ne, pe), { density: me } = ke(), he = ee ?? me === "compact", w = q && !G, B = re || l, v = Oe(se, le), O = F ?? (u && I === "left" ? u : void 0), k = H ?? (u && I === "right" ? u : void 0), [E, R] = Ce(null), ge = (t) => {
       if (w) {
         const f = t.currentTarget.getBoundingClientRect(), m = Math.max(f.width, f.height) * 2;
         R({
@@ -65,12 +65,12 @@ const Ve = ye(
         }), setTimeout(() => R(null), 600);
       }
       g == null || g(t);
-    }, n = Ie(we), _ = ((A = (V = n == null ? void 0 : n.components) == null ? void 0 : V.Button) == null ? void 0 : A.root) || {}, z = (n == null ? void 0 : n.customVariants) || {}, x = !Z(e) && e in z, a = x ? z[e] : null, { spotlightRef: he, position: U, isHovered: ge, handlers: y } = Ue({
+    }, n = Te(Ee), _ = ((A = (V = n == null ? void 0 : n.components) == null ? void 0 : V.Button) == null ? void 0 : A.root) || {}, z = (n == null ? void 0 : n.customVariants) || {}, y = !Z(e) && e in z, a = y ? z[e] : null, { spotlightRef: Be, position: U, isHovered: ve, handlers: x } = De({
       enabled: $,
-      onMouseMove: be,
-      onMouseEnter: ce,
+      onMouseMove: ce,
+      onMouseEnter: be,
       onMouseLeave: de
-    }), i = P[e] || P.primary, Be = Te(() => x && a ? {
+    }), i = L[e] || L.primary, _e = Se(() => y && a ? {
       backgroundColor: `var(--bear-${e}-bg, ${a.bg})`,
       color: a.text || "#ffffff",
       borderColor: a.border,
@@ -78,43 +78,43 @@ const Ve = ye(
       ..._,
       ...v
     } : {
-      backgroundColor: c ? void 0 : `var(--bear-btn-${e}-bg, ${i.bg})`,
-      background: c ? `linear-gradient(${C}deg, ${c[0]}, ${c[1]})` : void 0,
+      backgroundColor: b ? void 0 : `var(--bear-btn-${e}-bg, ${i.bg})`,
+      background: b ? `linear-gradient(${T}deg, ${b[0]}, ${b[1]})` : void 0,
       color: e === "outline" || e === "ghost" ? `var(--bear-btn-${e}-text, ${i.text || "inherit"})` : "white",
       borderColor: e === "outline" ? `var(--bear-btn-${e}-border, ${i.border || i.bg})` : void 0,
       "--bear-ring-color": `var(--bear-btn-${e}-ring, ${i.ring})`,
       ..._,
       ...v
-    }, [e, i, _, v, x, a, c, C]), ve = (t) => {
-      he.current = t, typeof d == "function" ? d(t) : d && (d.current = t);
-    }, _e = b ? "a" : K, xe = b ? { href: B ? void 0 : b } : {};
+    }, [e, i, _, v, y, a, b, T]), ye = (t) => {
+      Be.current = t, typeof d == "function" ? d(t) : d && (d.current = t);
+    }, xe = c ? "a" : K, Ne = c ? { href: B ? void 0 : c } : {};
     return /* @__PURE__ */ N(
-      _e,
+      xe,
       {
-        ref: ve,
+        ref: ye,
         id: fe,
-        disabled: b ? void 0 : B,
-        "aria-disabled": b && B ? !0 : void 0,
+        disabled: c ? void 0 : B,
+        "aria-disabled": c && B ? !0 : void 0,
         "aria-busy": l || void 0,
-        style: Be,
+        style: _e,
         title: Q,
         className: s(
           "Bear-Button",
           "bear-inline-flex bear-items-center bear-justify-center bear-font-medium bear-transition-all bear-duration-200 bear-outline-none bear-relative bear-overflow-hidden",
           !J && "bear-shadow-sm",
-          ze[X],
-          W ? ke[o] : ee ? Ee[o] : Re[o],
-          Z(e) ? Oe[e] : "bear-btn-custom bear-text-white focus:bear-ring-2 focus:bear-ring-offset-2 disabled:bear-opacity-50 disabled:bear-cursor-not-allowed hover:bear-brightness-110 active:bear-brightness-95",
+          Ae[X],
+          W ? ze[o] : he ? Ue[o] : Ve[o],
+          Z(e) ? Re[e] : "bear-btn-custom bear-text-white focus:bear-ring-2 focus:bear-ring-offset-2 disabled:bear-opacity-50 disabled:bear-cursor-not-allowed hover:bear-brightness-110 active:bear-brightness-95",
           Y && "bear-w-full",
           l && "bear-cursor-wait",
           ae
         ),
         "data-testid": ie,
-        onClick: me,
-        onMouseMove: y.handleMouseMove,
-        onMouseEnter: y.handleMouseEnter,
-        onMouseLeave: y.handleMouseLeave,
-        ...xe,
+        onClick: ge,
+        onMouseMove: x.handleMouseMove,
+        onMouseEnter: x.handleMouseEnter,
+        onMouseLeave: x.handleMouseLeave,
+        ...Ne,
         ...ue,
         children: [
           $ && /* @__PURE__ */ r(
@@ -124,7 +124,7 @@ const Ve = ye(
                 "Bear-Button__spotlight",
                 "bear-absolute bear-left-0 bear-top-0 bear-rounded-full bear-pointer-events-none bear-z-[1]",
                 "bear-transition-opacity bear-duration-150 bear-ease-out",
-                ge ? "bear-opacity-100" : "bear-opacity-0"
+                ve ? "bear-opacity-100" : "bear-opacity-0"
               ),
               "aria-hidden": "true",
               style: {
@@ -140,8 +140,8 @@ const Ve = ye(
             "Bear-Button__loading bear-inline-flex bear-items-center bear-gap-2 bear-relative bear-z-10",
             !h && "bear-absolute"
           ), children: [
-            /* @__PURE__ */ r(Me, { size: o === "xs" ? "xs" : "sm", className: "Bear-Button__spinner" }),
-            h && /* @__PURE__ */ r(L, { variant: T, className: "Bear-Button__text", children: h })
+            /* @__PURE__ */ r(we, { size: o === "xs" ? "xs" : "sm", className: "Bear-Button__spinner" }),
+            h && /* @__PURE__ */ r(D, { variant: C, className: "Bear-Button__text", children: h })
           ] }),
           /* @__PURE__ */ N(
             "span",
@@ -152,9 +152,9 @@ const Ve = ye(
               ),
               children: [
                 S && /* @__PURE__ */ r("span", { className: "Bear-Button__prefix bear-inline-flex bear-shrink-0", children: S }),
-                O && /* @__PURE__ */ r("span", { className: s("Bear-Button__icon Bear-Button__icon--left bear-inline-flex bear-shrink-0", D[o]), children: O }),
-                /* @__PURE__ */ r(L, { variant: T, className: "Bear-Button__text", children: oe }),
-                k && /* @__PURE__ */ r("span", { className: s("Bear-Button__icon Bear-Button__icon--right bear-inline-flex bear-shrink-0", D[o]), children: k }),
+                O && /* @__PURE__ */ r("span", { className: s("Bear-Button__icon Bear-Button__icon--left bear-inline-flex bear-shrink-0", P[o]), children: O }),
+                /* @__PURE__ */ r(D, { variant: C, className: "Bear-Button__text", children: oe }),
+                k && /* @__PURE__ */ r("span", { className: s("Bear-Button__icon Bear-Button__icon--right bear-inline-flex bear-shrink-0", P[o]), children: k }),
                 M && /* @__PURE__ */ r("span", { className: "Bear-Button__suffix bear-inline-flex bear-shrink-0", children: M })
               ]
             }
@@ -172,7 +172,7 @@ const Ve = ye(
     );
   }
 );
-Ve.displayName = "Button";
+Le.displayName = "Button";
 export {
-  Ve as Button
+  Le as Button
 };

package/dist/components/Chip/Chip.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),e=require("./Chip.const.cjs"),i=require("../../utils/cn.cjs");require("react");const O=require("../../utils/generateBearId.utils.cjs"),L=require("../../utils/useBearId.cjs"),v=c=>{const{children:_,variant:d="filled",color:b="default",size:n="md",icon:s,avatar:t,onDelete:l,onClick:o,disabled:a=!1,className:u,id:C,testId:S}=c,p=L.useBearId("Chip"),m=O.resolveBearId(C,p),I=o?"button":"span";return r.jsxs(I,{id:m,"data-testid":S,onClick:o,disabled:a,className:i.cn(e.C_H_I_P_ROOT_CLASS,"bear-inline-flex bear-items-center bear-rounded-full bear-font-medium bear-transition-all",e.CHIP_SIZE_CLASSES[n],e.CHIP_COLOR_CLASSES[d][b],o&&!a&&"bear-cursor-pointer hover:bear-opacity-80",a&&"bear-opacity-50 bear-cursor-not-allowed",u),children:[t&&r.jsx("span",{className:`${e.C_H_I_P_ROOT_CLASS}__avatar bear--ml-1`,children:t}),s&&r.jsx("span",{className:`${e.C_H_I_P_ROOT_CLASS}__icon`,children:s}),r.jsx("span",{className:`${e.C_H_I_P_ROOT_CLASS}__label`,children:_}),l&&r.jsx("button",{type:"button",onClick:h=>{h.stopPropagation(),l()},disabled:a,className:i.cn(`${e.C_H_I_P_ROOT_CLASS}__delete`,"bear-ml-1 bear-rounded-full bear-p-0.5 hover:bear-bg-black/10 dark:hover:bear-bg-black/20 bear-transition-colors",a&&"bear-cursor-not-allowed"),"aria-label":"Remove",children:r.jsx("svg",{className:e.CHIP_DELETE_ICON_SIZES[n],fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:r.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]})};exports.Chip=v;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),e=require("./Chip.const.cjs"),l=require("../../utils/cn.cjs");require("react");const P=require("../../utils/generateBearId.utils.cjs"),A=require("../../utils/useBearId.cjs"),v=require("../../context/BearProvider.cjs"),E=c=>{const{children:_,variant:d="filled",color:C="default",size:s="md",icon:t,avatar:o,onDelete:i,onClick:n,disabled:a=!1,className:u,id:b,testId:S}=c,I=A.useBearId("Chip"),p=P.resolveBearId(b,I),{density:m}=v.useBearDensityOptional(),O=m==="compact"?e.CHIP_SIZE_COMPACT_CLASSES:e.CHIP_SIZE_CLASSES,h=n?"button":"span";return r.jsxs(h,{id:p,"data-testid":S,onClick:n,disabled:a,className:l.cn(e.C_H_I_P_ROOT_CLASS,"bear-inline-flex bear-items-center bear-rounded-full bear-font-medium bear-transition-all",O[s],o&&e.CHIP_AVATAR_SIZE_CLASSES[s],e.CHIP_COLOR_CLASSES[d][C],n&&!a&&"bear-cursor-pointer hover:bear-opacity-80",a&&"bear-opacity-50 bear-cursor-not-allowed",u),children:[o&&r.jsx("span",{className:`${e.C_H_I_P_ROOT_CLASS}__avatar bear--ml-1`,children:o}),t&&r.jsx("span",{className:`${e.C_H_I_P_ROOT_CLASS}__icon`,children:t}),r.jsx("span",{className:`${e.C_H_I_P_ROOT_CLASS}__label`,children:_}),i&&r.jsx("button",{type:"button",onClick:L=>{L.stopPropagation(),i()},disabled:a,className:l.cn(`${e.C_H_I_P_ROOT_CLASS}__delete`,"bear-ml-1 bear-rounded-full bear-p-0.5 hover:bear-bg-black/10 dark:hover:bear-bg-black/20 bear-transition-colors",a&&"bear-cursor-not-allowed"),"aria-label":"Remove",children:r.jsx("svg",{className:e.CHIP_DELETE_ICON_SIZES[s],fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:r.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]})};exports.Chip=E;

package/dist/components/Chip/Chip.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="Bear-Chip",r={filled:{default:"bear-bg-gray-600 bear-text-white dark:bear-bg-zinc-600",primary:"bear-bg-primary-500 bear-text-white",secondary:"bear-bg-purple-500 bear-text-white",success:"bear-bg-green-500 bear-text-white",warning:"bear-bg-yellow-500 bear-text-black",error:"bear-bg-red-500 bear-text-white",info:"bear-bg-blue-500 bear-text-white"},outlined:{default:"bear-border bear-border-gray-400 bear-text-gray-700 dark:bear-border-zinc-500 dark:bear-text-zinc-300",primary:"bear-border bear-border-primary-500 bear-text-primary-600 dark:bear-text-primary-400",secondary:"bear-border bear-border-purple-500 bear-text-purple-600 dark:bear-text-purple-400",success:"bear-border bear-border-green-500 bear-text-green-700 dark:bear-text-green-400",warning:"bear-border bear-border-yellow-500 bear-text-yellow-700 dark:bear-text-yellow-400",error:"bear-border bear-border-red-500 bear-text-red-600 dark:bear-text-red-400",info:"bear-border bear-border-blue-500 bear-text-blue-600 dark:bear-text-blue-400"},soft:{default:"bear-bg-gray-500/15 bear-text-gray-700 dark:bear-bg-zinc-500/20 dark:bear-text-zinc-300",primary:"bear-bg-primary-500/15 bear-text-primary-700 dark:bear-bg-primary-500/20 dark:bear-text-primary-400",secondary:"bear-bg-purple-500/15 bear-text-purple-700 dark:bear-bg-purple-500/20 dark:bear-text-purple-400",success:"bear-bg-green-500/15 bear-text-green-700 dark:bear-bg-green-500/20 dark:bear-text-green-400",warning:"bear-bg-yellow-500/15 bear-text-yellow-800 dark:bear-bg-yellow-500/20 dark:bear-text-yellow-400",error:"bear-bg-red-500/15 bear-text-red-700 dark:bear-bg-red-500/20 dark:bear-text-red-400",info:"bear-bg-blue-500/15 bear-text-blue-700 dark:bear-bg-blue-500/20 dark:bear-text-blue-400"}},a={sm:"bear-h-6 bear-text-xs bear-px-2 bear-gap-1",md:"bear-h-8 bear-text-sm bear-px-3 bear-gap-1.5",lg:"bear-h-10 bear-text-base bear-px-4 bear-gap-2"},b={sm:"bear-w-3 bear-h-3",md:"bear-w-4 bear-h-4",lg:"bear-w-5 bear-h-5"};exports.CHIP_COLOR_CLASSES=r;exports.CHIP_DELETE_ICON_SIZES=b;exports.CHIP_SIZE_CLASSES=a;exports.C_H_I_P_ROOT_CLASS=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="Bear-Chip",r={filled:{default:"bear-bg-gray-600 bear-text-white dark:bear-bg-zinc-600",primary:"bear-bg-primary-500 bear-text-white",secondary:"bear-bg-purple-500 bear-text-white",success:"bear-bg-green-500 bear-text-white",warning:"bear-bg-yellow-500 bear-text-black",error:"bear-bg-red-500 bear-text-white",info:"bear-bg-blue-500 bear-text-white"},outlined:{default:"bear-border bear-border-gray-400 bear-text-gray-700 dark:bear-border-zinc-500 dark:bear-text-zinc-300",primary:"bear-border bear-border-primary-500 bear-text-primary-600 dark:bear-text-primary-400",secondary:"bear-border bear-border-purple-500 bear-text-purple-600 dark:bear-text-purple-400",success:"bear-border bear-border-green-500 bear-text-green-700 dark:bear-text-green-400",warning:"bear-border bear-border-yellow-500 bear-text-yellow-700 dark:bear-text-yellow-400",error:"bear-border bear-border-red-500 bear-text-red-600 dark:bear-text-red-400",info:"bear-border bear-border-blue-500 bear-text-blue-600 dark:bear-text-blue-400"},soft:{default:"bear-bg-gray-500/15 bear-text-gray-700 dark:bear-bg-zinc-500/20 dark:bear-text-zinc-300",primary:"bear-bg-primary-500/15 bear-text-primary-700 dark:bear-bg-primary-500/20 dark:bear-text-primary-400",secondary:"bear-bg-purple-500/15 bear-text-purple-700 dark:bear-bg-purple-500/20 dark:bear-text-purple-400",success:"bear-bg-green-500/15 bear-text-green-700 dark:bear-bg-green-500/20 dark:bear-text-green-400",warning:"bear-bg-yellow-500/15 bear-text-yellow-800 dark:bear-bg-yellow-500/20 dark:bear-text-yellow-400",error:"bear-bg-red-500/15 bear-text-red-700 dark:bear-bg-red-500/20 dark:bear-text-red-400",info:"bear-bg-blue-500/15 bear-text-blue-700 dark:bear-bg-blue-500/20 dark:bear-text-blue-400"}},a={sm:"bear-h-6 bear-text-xs bear-px-2 bear-gap-1",md:"bear-h-8 bear-text-sm bear-px-3 bear-gap-1.5",lg:"bear-h-10 bear-text-base bear-px-4 bear-gap-2"},b={sm:"bear-h-5 bear-text-xs bear-px-1.5 bear-gap-0.5",md:"bear-h-6 bear-text-xs bear-px-2 bear-gap-1",lg:"bear-h-8 bear-text-sm bear-px-3 bear-gap-1.5"},t={sm:"[&_.Bear-Avatar]:bear-w-4 [&_.Bear-Avatar]:bear-h-4",md:"[&_.Bear-Avatar]:bear-w-5 [&_.Bear-Avatar]:bear-h-5",lg:"[&_.Bear-Avatar]:bear-w-6 [&_.Bear-Avatar]:bear-h-6"},d={sm:"bear-w-3 bear-h-3",md:"bear-w-4 bear-h-4",lg:"bear-w-5 bear-h-5"};exports.CHIP_AVATAR_SIZE_CLASSES=t;exports.CHIP_COLOR_CLASSES=r;exports.CHIP_DELETE_ICON_SIZES=d;exports.CHIP_SIZE_CLASSES=a;exports.CHIP_SIZE_COMPACT_CLASSES=b;exports.C_H_I_P_ROOT_CLASS=e;

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

@@ -33,6 +33,16 @@ export declare const CHIP_SIZE_CLASSES: {
     readonly md: "bear-h-8 bear-text-sm bear-px-3 bear-gap-1.5";
     readonly lg: "bear-h-10 bear-text-base bear-px-4 bear-gap-2";
 };
+export declare const CHIP_SIZE_COMPACT_CLASSES: {
+    readonly sm: "bear-h-5 bear-text-xs bear-px-1.5 bear-gap-0.5";
+    readonly md: "bear-h-6 bear-text-xs bear-px-2 bear-gap-1";
+    readonly lg: "bear-h-8 bear-text-sm bear-px-3 bear-gap-1.5";
+};
+export declare const CHIP_AVATAR_SIZE_CLASSES: {
+    readonly sm: "[&_.Bear-Avatar]:bear-w-4 [&_.Bear-Avatar]:bear-h-4";
+    readonly md: "[&_.Bear-Avatar]:bear-w-5 [&_.Bear-Avatar]:bear-h-5";
+    readonly lg: "[&_.Bear-Avatar]:bear-w-6 [&_.Bear-Avatar]:bear-h-6";
+};
 export declare const CHIP_DELETE_ICON_SIZES: {
     readonly sm: "bear-w-3 bear-h-3";
     readonly md: "bear-w-4 bear-h-4";

package/dist/components/Chip/Chip.const.js

@@ -31,13 +31,23 @@ const e = "Bear-Chip", r = {
   md: "bear-h-8 bear-text-sm bear-px-3 bear-gap-1.5",
   lg: "bear-h-10 bear-text-base bear-px-4 bear-gap-2"
 }, b = {
+  sm: "bear-h-5 bear-text-xs bear-px-1.5 bear-gap-0.5",
+  md: "bear-h-6 bear-text-xs bear-px-2 bear-gap-1",
+  lg: "bear-h-8 bear-text-sm bear-px-3 bear-gap-1.5"
+}, t = {
+  sm: "[&_.Bear-Avatar]:bear-w-4 [&_.Bear-Avatar]:bear-h-4",
+  md: "[&_.Bear-Avatar]:bear-w-5 [&_.Bear-Avatar]:bear-h-5",
+  lg: "[&_.Bear-Avatar]:bear-w-6 [&_.Bear-Avatar]:bear-h-6"
+}, d = {
   sm: "bear-w-3 bear-h-3",
   md: "bear-w-4 bear-h-4",
   lg: "bear-w-5 bear-h-5"
 };
 export {
+  t as CHIP_AVATAR_SIZE_CLASSES,
   r as CHIP_COLOR_CLASSES,
-  b as CHIP_DELETE_ICON_SIZES,
+  d as CHIP_DELETE_ICON_SIZES,
   a as CHIP_SIZE_CLASSES,
+  b as CHIP_SIZE_COMPACT_CLASSES,
   e as C_H_I_P_ROOT_CLASS
 };

package/dist/components/Chip/Chip.js

@@ -1,50 +1,52 @@
-import { jsxs as I, jsx as e } from "react/jsx-runtime";
-import { C_H_I_P_ROOT_CLASS as a, CHIP_DELETE_ICON_SIZES as S, CHIP_COLOR_CLASSES as v, CHIP_SIZE_CLASSES as k } from "./Chip.const.js";
+import { jsxs as h, jsx as e } from "react/jsx-runtime";
+import { C_H_I_P_ROOT_CLASS as a, CHIP_DELETE_ICON_SIZES as E, CHIP_COLOR_CLASSES as v, CHIP_AVATAR_SIZE_CLASSES as L, CHIP_SIZE_COMPACT_CLASSES as k, CHIP_SIZE_CLASSES as A } from "./Chip.const.js";
 import { cn as i } from "../../utils/cn.js";
 import "react";
-import { resolveBearId as L } from "../../utils/generateBearId.utils.js";
-import { useBearId as N } from "../../utils/useBearId.js";
+import { resolveBearId as N } from "../../utils/generateBearId.utils.js";
+import { useBearId as P } from "../../utils/useBearId.js";
+import { useBearDensityOptional as O } from "../../context/BearProvider.js";
 const j = (c) => {
   const {
     children: d,
     variant: m = "filled",
     color: b = "default",
-    size: t = "md",
+    size: o = "md",
     icon: n,
-    avatar: l,
-    onDelete: s,
-    onClick: o,
+    avatar: t,
+    onDelete: l,
+    onClick: s,
     disabled: r = !1,
     className: p,
     id: _,
-    testId: u
-  } = c, C = N("Chip"), f = L(_, C);
-  return /* @__PURE__ */ I(
-    o ? "button" : "span",
+    testId: C
+  } = c, S = P("Chip"), u = N(_, S), { density: I } = O();
+  return /* @__PURE__ */ h(
+    s ? "button" : "span",
     {
-      id: f,
-      "data-testid": u,
-      onClick: o,
+      id: u,
+      "data-testid": C,
+      onClick: s,
       disabled: r,
       className: i(
         a,
         "bear-inline-flex bear-items-center bear-rounded-full bear-font-medium bear-transition-all",
-        k[t],
+        (I === "compact" ? k : A)[o],
+        t && L[o],
         v[m][b],
-        o && !r && "bear-cursor-pointer hover:bear-opacity-80",
+        s && !r && "bear-cursor-pointer hover:bear-opacity-80",
         r && "bear-opacity-50 bear-cursor-not-allowed",
         p
       ),
       children: [
-        l && /* @__PURE__ */ e("span", { className: `${a}__avatar bear--ml-1`, children: l }),
+        t && /* @__PURE__ */ e("span", { className: `${a}__avatar bear--ml-1`, children: t }),
         n && /* @__PURE__ */ e("span", { className: `${a}__icon`, children: n }),
         /* @__PURE__ */ e("span", { className: `${a}__label`, children: d }),
-        s && /* @__PURE__ */ e(
+        l && /* @__PURE__ */ e(
           "button",
           {
             type: "button",
-            onClick: (h) => {
-              h.stopPropagation(), s();
+            onClick: (f) => {
+              f.stopPropagation(), l();
             },
             disabled: r,
             className: i(
@@ -53,7 +55,7 @@ const j = (c) => {
               r && "bear-cursor-not-allowed"
             ),
             "aria-label": "Remove",
-            children: /* @__PURE__ */ e("svg", { className: S[t], fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
+            children: /* @__PURE__ */ e("svg", { className: E[o], fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
           }
         )
       ]

package/dist/components/ChipGroup/ChipGroup.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),i=require("react"),e=require("./ChipGroup.const.cjs"),o=require("../../utils/cn.cjs"),m=require("../../utils/generateBearId.utils.cjs"),O=require("../../utils/useBearId.cjs"),P=c=>{const{id:a,testId:d,children:l,max:r,spacing:u="md",className:_,...S}=c,C=O.useBearId("ChipGroup"),p=m.resolveBearId(a,C),s=i.Children.toArray(l).filter(i.isValidElement),I=typeof r=="number"?s.slice(0,r):s,t=typeof r=="number"?Math.max(0,s.length-r):0;return n.jsxs("div",{...S,id:p,"data-testid":d,className:o.cn(e.CHIP_GROUP_ROOT_CLASS,e.CHIP_GROUP_BASE_CLASSES,e.CHIP_GROUP_SPACING_CLASSES[u],_),children:[I,t>0&&n.jsxs("span",{className:o.cn(`${e.CHIP_GROUP_ROOT_CLASS}__overflow`,e.CHIP_GROUP_OVERFLOW_CLASSES),children:["+",t]})]})};exports.ChipGroup=P;
+"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;

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-1.5",lg:"bear-gap-2"},S="bear-inline-flex bear-items-center bear-justify-center bear-rounded-full bear-bg-gray-200 dark:bear-bg-zinc-700 bear-text-gray-700 dark:bear-text-zinc-200 bear-text-xs bear-font-medium bear-h-8 bear-min-w-[2rem] bear-px-2";exports.CHIP_GROUP_BASE_CLASSES=r;exports.CHIP_GROUP_OVERFLOW_CLASSES=S;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"},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;

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

@@ -2,7 +2,10 @@ export declare const CHIP_GROUP_ROOT_CLASS = "Bear-ChipGroup";
 export declare const CHIP_GROUP_BASE_CLASSES = "bear-inline-flex bear-flex-wrap bear-items-center";
 export declare const CHIP_GROUP_SPACING_CLASSES: {
     readonly sm: "bear-gap-1";
-    readonly md: "bear-gap-1.5";
-    readonly lg: "bear-gap-2";
+    readonly md: "bear-gap-2";
+    readonly lg: "bear-gap-3";
 };
-export declare const CHIP_GROUP_OVERFLOW_CLASSES = "bear-inline-flex bear-items-center bear-justify-center bear-rounded-full bear-bg-gray-200 dark:bear-bg-zinc-700 bear-text-gray-700 dark:bear-text-zinc-200 bear-text-xs bear-font-medium bear-h-8 bear-min-w-[2rem] bear-px-2";
+export declare const CHIP_GROUP_OVERFLOW_CLASSES = "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";
+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";

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

@@ -1,10 +1,13 @@
 const e = "Bear-ChipGroup", r = "bear-inline-flex bear-flex-wrap bear-items-center", a = {
   sm: "bear-gap-1",
-  md: "bear-gap-1.5",
-  lg: "bear-gap-2"
-}, b = "bear-inline-flex bear-items-center bear-justify-center bear-rounded-full bear-bg-gray-200 dark:bear-bg-zinc-700 bear-text-gray-700 dark:bear-text-zinc-200 bear-text-xs bear-font-medium bear-h-8 bear-min-w-[2rem] bear-px-2";
+  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";
 export {
   r as CHIP_GROUP_BASE_CLASSES,
+  t as CHIP_GROUP_DEFAULT_DELETE_ALL_LABEL,
+  n as CHIP_GROUP_MENU_CLASSES,
+  _ as CHIP_GROUP_MENU_ITEM_CLASSES,
   b as CHIP_GROUP_OVERFLOW_CLASSES,
   e as CHIP_GROUP_ROOT_CLASS,
   a as CHIP_GROUP_SPACING_CLASSES

package/dist/components/ChipGroup/ChipGroup.js

@@ -1,41 +1,95 @@
-import { jsxs as t } from "react/jsx-runtime";
-import { Children as f, isValidElement as I } from "react";
-import { CHIP_GROUP_OVERFLOW_CLASSES as h, CHIP_GROUP_ROOT_CLASS as s, CHIP_GROUP_SPACING_CLASSES as P, CHIP_GROUP_BASE_CLASSES as A } from "./ChipGroup.const.js";
-import { cn as i } from "../../utils/cn.js";
-import { resolveBearId as O } from "../../utils/generateBearId.utils.js";
-import { useBearId as G } from "../../utils/useBearId.js";
-const y = (m) => {
+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) => {
   const {
-    id: n,
-    testId: a,
-    children: d,
-    max: r,
-    spacing: c = "md",
-    className: l,
-    ...p
-  } = m, _ = G("ChipGroup"), S = O(n, _), e = f.toArray(d).filter(I), C = typeof r == "number" ? e.slice(0, r) : e, o = typeof r == "number" ? Math.max(0, e.length - r) : 0;
-  return /* @__PURE__ */ t(
+    id: S,
+    testId: f,
+    children: E,
+    max: o,
+    size: A = "md",
+    spacing: P = "md",
+    overflowMenu: l = !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
+    }) : e
+  ), O = typeof o == "number" ? s.slice(0, o) : s, d = typeof o == "number" ? s.slice(o) : [], _ = d.length;
+  return /* @__PURE__ */ n(
     "div",
     {
-      ...p,
-      id: S,
-      "data-testid": a,
-      className: i(
-        s,
-        A,
-        P[c],
-        l
+      ...L,
+      id: h,
+      "data-testid": f,
+      className: t(
+        r,
+        $,
+        H[P],
+        I
       ),
       children: [
-        C,
-        o > 0 && /* @__PURE__ */ t("span", { className: i(`${s}__overflow`, h), children: [
-          "+",
-          o
+        O,
+        _ > 0 && /* @__PURE__ */ n("div", { className: `${r}__overflow-wrap bear-relative`, children: [
+          /* @__PURE__ */ n(
+            "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,
+              children: [
+                "+",
+                _
+              ]
+            }
+          ),
+          l && i && /* @__PURE__ */ n(
+            "div",
+            {
+              role: "menu",
+              className: t(`${r}__menu`, y),
+              children: [
+                d.map((e, G) => /* @__PURE__ */ c(
+                  "div",
+                  {
+                    role: "menuitem",
+                    className: t(`${r}__menu-item`, u),
+                    children: e
+                  },
+                  `overflow-${G}`
+                )),
+                a && /* @__PURE__ */ c(
+                  "button",
+                  {
+                    type: "button",
+                    role: "menuitem",
+                    className: t(
+                      `${r}__delete-all`,
+                      u,
+                      "bear-text-red-600 dark:bear-text-red-400 bear-w-full bear-text-left"
+                    ),
+                    onClick: () => {
+                      a(), m(!1);
+                    },
+                    children: v
+                  }
+                )
+              ]
+            }
+          )
         ] })
       ]
     }
   );
 };
 export {
-  y as ChipGroup
+  V as ChipGroup
 };

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

@@ -1,9 +1,14 @@
 import { HTMLAttributes, ReactNode } from 'react';
+export type ChipGroupSize = 'sm' | 'md' | 'lg';
 export interface ChipGroupProps extends HTMLAttributes<HTMLDivElement> {
     id?: string;
     testId?: string;
     children: ReactNode;
     max?: number;
+    size?: ChipGroupSize;
     spacing?: 'sm' | 'md' | 'lg';
+    overflowMenu?: boolean;
+    onDeleteAll?: () => void;
+    deleteAllLabel?: string;
     className?: string;
 }

package/dist/components/Drawer/Drawer.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),D=require("react-dom"),R=require("../../context/BearProvider.cjs"),S=require("../../utils/cn.cjs"),p=require("../Icon/index.cjs"),r=require("./Drawer.const.cjs"),M=require("./Drawer.utils.cjs"),j=({isOpen:d,onClose:o,title:i,children:k,side:w="right",anchor:y,variant:O="temporary",size:N="md",showCloseButton:u=!0,closeOnBackdrop:_=!0,closeOnEscape:m=!0,className:A,container:E,id:q,testId:T})=>{const{direction:f}=R.useBearDirectionOptional(),l=y??w,n=f==="rtl"&&(l==="left"||l==="right")?l==="left"?"right":"left":l,[s,x]=t.useState(d),[v,c]=t.useState(!1),[g,h]=t.useState(!1);t.useEffect(()=>{if(d){x(!0),c(!1);const a=requestAnimationFrame(()=>h(!0));return()=>cancelAnimationFrame(a)}if(s){h(!1),c(!0);const a=setTimeout(()=>{x(!1),c(!1)},r.DRAWER_ANIMATION_MS);return()=>clearTimeout(a)}},[d,s]);const b=t.useCallback(a=>{m&&a.key==="Escape"&&o()},[m,o]);if(t.useEffect(()=>{if(s){document.addEventListener("keydown",b);const a=M.lockBodyScroll();return()=>{document.removeEventListener("keydown",b),a()}}return()=>{document.removeEventListener("keydown",b)}},[s,b]),!s)return null;const I=e.jsxs("div",{className:"bear-fixed bear-inset-0 bear-z-[11000]",children:[e.jsx("div",{className:S.cn("bear-absolute bear-inset-0 bear-bg-black/60 bear-backdrop-blur-sm bear-transition-opacity",v?"bear-opacity-0":"bear-opacity-100"),style:{transitionDuration:`${r.DRAWER_ANIMATION_MS}ms`},onClick:_?o:void 0,"aria-hidden":"true"}),e.jsxs("div",{role:"dialog","aria-modal":"true","aria-labelledby":i?"drawer-title":void 0,className:S.cn("bear-absolute bear-bg-white dark:bear-bg-neutral-900 bear-shadow-2xl","bear-border-neutral-200 dark:bear-border-neutral-700","bear-flex bear-flex-col bear-overflow-hidden","bear-transform bear-transition-transform",r.BORDER_SIDE_MAP[n],r.POSITION_CLASSES[n],r.SIZE_CLASSES[n][N],g&&!v?r.TRANSFORM_OPEN[n]:r.TRANSFORM_CLOSED[n],A),style:{transitionDuration:`${r.DRAWER_ANIMATION_MS}ms`},children:[(i||u)&&e.jsxs("div",{className:"bear-flex 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",dir:f,children:[i&&e.jsx("h2",{id:"drawer-title",className:"bear-text-lg bear-font-semibold bear-text-neutral-900 dark:bear-text-white",children:i}),u&&e.jsx("button",{onClick:o,className:"bear-p-1 bear-rounded-lg bear-text-neutral-500 dark:bear-text-neutral-400 hover:bear-text-neutral-900 dark:hover:bear-text-white hover:bear-bg-neutral-100 dark:hover:bear-bg-neutral-700 bear-transition-colors","aria-label":"Close drawer",children:e.jsx(p.XIcon,{className:"bear-w-5 bear-h-5"})})]}),e.jsx("div",{className:"bear-flex-1 bear-min-h-0 bear-overflow-y-auto bear-overscroll-contain bear-p-4 bear-text-neutral-700 dark:bear-text-neutral-300",children:k})]})]});return D.createPortal(I,E??document.body)};exports.Drawer=j;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),M=require("react-dom"),q=require("../../context/BearProvider.cjs"),B=require("../../utils/cn.cjs"),j=require("../../utils/generateBearId.utils.cjs"),O=require("../../utils/useBearId.cjs"),T=require("../Icon/index.cjs"),C=require("../Backdrop/Backdrop.cjs"),r=require("./Drawer.const.cjs"),L=require("./Drawer.utils.cjs"),P=({isOpen:u,onClose:o,title:i,children:w,side:_="right",anchor:I,variant:F="temporary",size:D="md",showCloseButton:m=!0,closeOnBackdrop:N=!0,closeOnEscape:f=!0,className:g,container:A,id:E,testId:p})=>{const y=O.useBearId("Drawer"),c=j.resolveBearId(E,y),{direction:x}=q.useBearDirectionOptional(),l=I??_,n=x==="rtl"&&(l==="left"||l==="right")?l==="left"?"right":"left":l,[s,v]=t.useState(u),[S,b]=t.useState(!1),[h,k]=t.useState(!1);t.useEffect(()=>{if(u){v(!0),b(!1);const a=requestAnimationFrame(()=>k(!0));return()=>cancelAnimationFrame(a)}if(s){k(!1),b(!0);const a=setTimeout(()=>{v(!1),b(!1)},r.DRAWER_ANIMATION_MS);return()=>clearTimeout(a)}},[u,s]);const d=t.useCallback(a=>{f&&a.key==="Escape"&&o()},[f,o]);if(t.useEffect(()=>{if(s){document.addEventListener("keydown",d);const a=L.lockBodyScroll();return()=>{document.removeEventListener("keydown",d),a()}}return()=>{document.removeEventListener("keydown",d)}},[s,d]),!s)return null;const R=e.jsxs("div",{id:c,"data-testid":p,className:"Bear-Drawer bear-fixed bear-inset-0 bear-z-[11000]",children:[e.jsx(C.Backdrop,{open:h&&!S,keepMounted:!0,blur:!0,transitionDuration:r.DRAWER_ANIMATION_MS,className:"Bear-Drawer__backdrop",onClick:N?()=>o():void 0}),e.jsxs("div",{role:"dialog","aria-modal":"true","aria-labelledby":i?`${c}-title`:void 0,className:B.cn("Bear-Drawer__panel","bear-absolute bear-bg-white dark:bear-bg-neutral-900 bear-shadow-2xl","bear-border-neutral-200 dark:bear-border-neutral-700","bear-flex bear-flex-col bear-overflow-hidden","bear-transform bear-transition-transform",r.BORDER_SIDE_MAP[n],r.POSITION_CLASSES[n],r.SIZE_CLASSES[n][D],h&&!S?r.TRANSFORM_OPEN[n]:r.TRANSFORM_CLOSED[n],g),style:{transitionDuration:`${r.DRAWER_ANIMATION_MS}ms`},children:[(i||m)&&e.jsxs("div",{className:"bear-flex 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",dir:x,children:[i&&e.jsx("h2",{id:`${c}-title`,className:"bear-text-lg bear-font-semibold bear-text-neutral-900 dark:bear-text-white",children:i}),m&&e.jsx("button",{onClick:o,className:"bear-p-1 bear-rounded-lg bear-text-neutral-500 dark:bear-text-neutral-400 hover:bear-text-neutral-900 dark:hover:bear-text-white hover:bear-bg-neutral-100 dark:hover:bear-bg-neutral-700 bear-transition-colors","aria-label":"Close drawer",children:e.jsx(T.XIcon,{className:"bear-w-5 bear-h-5"})})]}),e.jsx("div",{className:"bear-flex-1 bear-min-h-0 bear-overflow-y-auto bear-overscroll-contain bear-p-4 bear-text-neutral-700 dark:bear-text-neutral-300",children:w})]})]});return M.createPortal(R,A??document.body)};exports.Drawer=P;