@forgedevstack/bear 1.2.6 → 1.2.7

package/README.md

@@ -1,6 +1,6 @@
 # @forgedevstack/bear
 
-Strong, reliable React UI components. Tailwind-powered, zero config required. The protective force of ForgeStack.
+Strong, reliable React UI components. AeroCraft-powered, zero config required. The protective force of ForgeStack.
 
 ## Portal
 
@@ -19,7 +19,11 @@ cd portal && npm run test:e2e:smoke
 cd portal && npm run test:e2e
 ```
 
-`BEAR_E2E_SMOKE=1` runs `e2e/specs/smoke.spec.ts` only. The e2e webServer builds Bear, then starts the portal on port `5174`.
+`BEAR_E2E_SMOKE=1` runs `e2e/specs/smoke.spec.ts` only (includes RTL direction + Toast aria-live checks). The e2e webServer builds Bear, then starts the portal on port `5174`.
+
+### Auto DOM ids
+
+Public components generate root `id` values as `Bear-{Component}-{alphanumeric}` (e.g. `Bear-Button-a48293100123`). Pass `id` to override; keep `testId` on `data-testid`.
 
 ## Features
 

package/dist/components/AppBar/AppBar.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("react/jsx-runtime"),_=require("./AppBar.const.cjs"),N=require("../../context/BearProvider.cjs");require("../../context/defaultTheme.cjs");const e=require("../../utils/cn.cjs");require("react");const l=require("../../utils/generateBearId.utils.cjs"),I=r=>{const{children:t,position:n=_.DEFAULT_APP_BAR_POSITION,variant:E=_.DEFAULT_APP_BAR_VARIANT,color:S=_.DEFAULT_APP_BAR_COLOR,className:s,leftContent:R,rightContent:B,centerContent:a,elevation:i=_.DEFAULT_APP_BAR_ELEVATION,dense:C,disableGutters:c=_.DEFAULT_APP_BAR_DISABLE_GUTTERS,enableColorOnDark:O=_.DEFAULT_APP_BAR_ENABLE_COLOR_ON_DARK,id:o,testId:T}=r,{density:L}=N.useBearDensityOptional(),P=C??L==="compact",d=o||l.generateBearId("AppBar");return A.jsx("header",{id:d,"data-testid":T,className:e.cn(_.APP_BAR_ROOT_CLASS,_.APP_BAR_BASE_CLASS,P?_.APP_BAR_HEIGHT_DENSE:_.APP_BAR_HEIGHT_COMFORTABLE,!c&&(P?_.APP_BAR_GUTTER_X_DENSE:_.APP_BAR_GUTTER_X),_.APP_BAR_POSITION_CLASSES[n],_.APP_BAR_VARIANT_CLASSES[E],_.APP_BAR_COLOR_CLASSES[S],O&&S==="default"&&_.APP_BAR_COLOR_ON_DARK_CLASS,i&&_.APP_BAR_ELEVATION_CLASS,P&&_.APP_BAR_DENSE_MODIFIER_CLASS,s),style:{backgroundColor:S==="primary"?"var(--bear-primary-600)":void 0},children:t??A.jsxs(A.Fragment,{children:[A.jsx("div",{className:e.cn(_.APP_BAR_SECTION_CLASS,_.APP_BAR_SECTION_BASE_CLASS),children:R}),A.jsx("div",{className:e.cn(_.APP_BAR_SECTION_CLASS,_.APP_BAR_SECTION_CENTER_CLASS,_.APP_BAR_SECTION_BASE_CLASS,_.APP_BAR_SECTION_GROW_CLASS),children:a}),A.jsx("div",{className:e.cn(_.APP_BAR_SECTION_CLASS,_.APP_BAR_SECTION_END_CLASS,_.APP_BAR_SECTION_BASE_CLASS),children:B})]})})};exports.AppBar=I;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("react/jsx-runtime"),_=require("./AppBar.const.cjs"),N=require("../../context/BearProvider.cjs");require("../../context/defaultTheme.cjs");const e=require("../../utils/cn.cjs");require("react");const l=require("../../utils/generateBearId.utils.cjs"),u=require("../../utils/useBearId.cjs"),D=P=>{const{children:t,position:n=_.DEFAULT_APP_BAR_POSITION,variant:s=_.DEFAULT_APP_BAR_VARIANT,color:r=_.DEFAULT_APP_BAR_COLOR,className:E,leftContent:B,rightContent:R,centerContent:a,elevation:i=_.DEFAULT_APP_BAR_ELEVATION,dense:C,disableGutters:c=_.DEFAULT_APP_BAR_DISABLE_GUTTERS,enableColorOnDark:o=_.DEFAULT_APP_BAR_ENABLE_COLOR_ON_DARK,id:O,testId:T}=P,{density:d}=N.useBearDensityOptional(),S=C??d==="compact",L=u.useBearId("AppBar"),I=l.resolveBearId(O,L);return A.jsx("header",{id:I,"data-testid":T,className:e.cn(_.APP_BAR_ROOT_CLASS,_.APP_BAR_BASE_CLASS,S?_.APP_BAR_HEIGHT_DENSE:_.APP_BAR_HEIGHT_COMFORTABLE,!c&&(S?_.APP_BAR_GUTTER_X_DENSE:_.APP_BAR_GUTTER_X),_.APP_BAR_POSITION_CLASSES[n],_.APP_BAR_VARIANT_CLASSES[s],_.APP_BAR_COLOR_CLASSES[r],o&&r==="default"&&_.APP_BAR_COLOR_ON_DARK_CLASS,i&&_.APP_BAR_ELEVATION_CLASS,S&&_.APP_BAR_DENSE_MODIFIER_CLASS,E),style:{backgroundColor:r==="primary"?"var(--bear-primary-600)":void 0},children:t??A.jsxs(A.Fragment,{children:[A.jsx("div",{className:e.cn(_.APP_BAR_SECTION_CLASS,_.APP_BAR_SECTION_BASE_CLASS),children:B}),A.jsx("div",{className:e.cn(_.APP_BAR_SECTION_CLASS,_.APP_BAR_SECTION_CENTER_CLASS,_.APP_BAR_SECTION_BASE_CLASS,_.APP_BAR_SECTION_GROW_CLASS),children:a}),A.jsx("div",{className:e.cn(_.APP_BAR_SECTION_CLASS,_.APP_BAR_SECTION_END_CLASS,_.APP_BAR_SECTION_BASE_CLASS),children:R})]})})};exports.AppBar=D;

package/dist/components/AppBar/AppBar.js

@@ -1,71 +1,72 @@
-import { jsx as _, jsxs as l, Fragment as m } from "react/jsx-runtime";
-import { DEFAULT_APP_BAR_POSITION as I, DEFAULT_APP_BAR_VARIANT as p, DEFAULT_APP_BAR_COLOR as D, DEFAULT_APP_BAR_ELEVATION as F, DEFAULT_APP_BAR_DISABLE_GUTTERS as U, DEFAULT_APP_BAR_ENABLE_COLOR_ON_DARK as h, APP_BAR_SECTION_BASE_CLASS as r, APP_BAR_SECTION_CLASS as S, APP_BAR_SECTION_GROW_CLASS as v, APP_BAR_SECTION_CENTER_CLASS as f, APP_BAR_SECTION_END_CLASS as G, APP_BAR_DENSE_MODIFIER_CLASS as u, APP_BAR_ELEVATION_CLASS as y, APP_BAR_COLOR_ON_DARK_CLASS as b, APP_BAR_COLOR_CLASSES as g, APP_BAR_VARIANT_CLASSES as H, APP_BAR_POSITION_CLASSES as V, APP_BAR_GUTTER_X_DENSE as x, APP_BAR_GUTTER_X as j, APP_BAR_HEIGHT_DENSE as k, APP_BAR_HEIGHT_COMFORTABLE as K, APP_BAR_BASE_CLASS as M, APP_BAR_ROOT_CLASS as X } from "./AppBar.const.js";
-import { useBearDensityOptional as W } from "../../context/BearProvider.js";
+import { jsx as _, jsxs as m, Fragment as I } from "react/jsx-runtime";
+import { DEFAULT_APP_BAR_POSITION as p, DEFAULT_APP_BAR_VARIANT as D, DEFAULT_APP_BAR_COLOR as v, DEFAULT_APP_BAR_ELEVATION as F, DEFAULT_APP_BAR_DISABLE_GUTTERS as U, DEFAULT_APP_BAR_ENABLE_COLOR_ON_DARK as f, APP_BAR_SECTION_BASE_CLASS as P, APP_BAR_SECTION_CLASS as t, APP_BAR_SECTION_GROW_CLASS as h, APP_BAR_SECTION_CENTER_CLASS as G, APP_BAR_SECTION_END_CLASS as u, APP_BAR_DENSE_MODIFIER_CLASS as y, APP_BAR_ELEVATION_CLASS as b, APP_BAR_COLOR_ON_DARK_CLASS as g, APP_BAR_COLOR_CLASSES as H, APP_BAR_VARIANT_CLASSES as V, APP_BAR_POSITION_CLASSES as x, APP_BAR_GUTTER_X_DENSE as j, APP_BAR_GUTTER_X as k, APP_BAR_HEIGHT_DENSE as K, APP_BAR_HEIGHT_COMFORTABLE as M, APP_BAR_BASE_CLASS as X, APP_BAR_ROOT_CLASS as W } from "./AppBar.const.js";
+import { useBearDensityOptional as q } from "../../context/BearProvider.js";
 import "../../context/defaultTheme.js";
 import { cn as A } from "../../utils/cn.js";
 import "react";
-import { generateBearId as q } from "../../utils/generateBearId.utils.js";
-const __ = (t) => {
+import { resolveBearId as w } from "../../utils/generateBearId.utils.js";
+import { useBearId as z } from "../../utils/useBearId.js";
+const r_ = (S) => {
   const {
-    children: E,
-    position: R = I,
-    variant: o = p,
-    color: P = D,
+    children: o,
+    position: E = p,
+    variant: R = D,
+    color: e = v,
     className: a,
     leftContent: n,
-    rightContent: i,
-    centerContent: B,
-    elevation: s = F,
+    rightContent: s,
+    centerContent: i,
+    elevation: B = F,
     dense: C,
     disableGutters: O = U,
-    enableColorOnDark: L = h,
+    enableColorOnDark: L = f,
     id: T,
     testId: d
-  } = t, { density: N } = W(), e = C ?? N === "compact", c = T || q("AppBar");
+  } = S, { density: N } = q(), r = C ?? N === "compact", c = z("AppBar"), l = w(T, c);
   return /* @__PURE__ */ _(
     "header",
     {
-      id: c,
+      id: l,
       "data-testid": d,
       className: A(
+        W,
         X,
-        M,
-        e ? k : K,
-        !O && (e ? x : j),
+        r ? K : M,
+        !O && (r ? j : k),
+        x[E],
         V[R],
-        H[o],
-        g[P],
-        L && P === "default" && b,
-        s && y,
-        e && u,
+        H[e],
+        L && e === "default" && g,
+        B && b,
+        r && y,
         a
       ),
       style: {
-        backgroundColor: P === "primary" ? "var(--bear-primary-600)" : void 0
+        backgroundColor: e === "primary" ? "var(--bear-primary-600)" : void 0
       },
-      children: E ?? /* @__PURE__ */ l(m, { children: [
-        /* @__PURE__ */ _("div", { className: A(S, r), children: n }),
+      children: o ?? /* @__PURE__ */ m(I, { children: [
+        /* @__PURE__ */ _("div", { className: A(t, P), children: n }),
         /* @__PURE__ */ _(
           "div",
           {
             className: A(
-              S,
-              f,
-              r,
-              v
+              t,
+              G,
+              P,
+              h
             ),
-            children: B
+            children: i
           }
         ),
         /* @__PURE__ */ _(
           "div",
           {
             className: A(
-              S,
-              G,
-              r
+              t,
+              u,
+              P
             ),
-            children: i
+            children: s
           }
         )
       ] })
@@ -73,5 +74,5 @@ const __ = (t) => {
   );
 };
 export {
-  __ as AppBar
+  r_ as AppBar
 };

package/dist/components/Autocomplete/Autocomplete.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),a=require("react"),x=require("../../utils/cn.cjs"),D=require("../Portal/Portal.cjs"),V=require("./Autocomplete.utils.cjs"),M=require("./Autocomplete.const.cjs"),C=({options:z,value:b="",onChange:i,onSelect:g,placeholder:I="Start typing...",label:k,helperText:v,error:u,disabled:f=!1,freeSolo:j=!1,loading:E=!1,filterOptions:q=V.defaultFilter,className:_,testId:B})=>{const[c,s]=a.useState(!1),[n,m]=a.useState(-1),[l,T]=a.useState({top:0,left:0,width:0}),N=a.useRef(null),P=a.useRef(null),h=a.useRef(null),A=a.useRef(null),w=a.useRef(null),o=q(z,b),y=c&&!f&&o.length>0,p=c&&!f&&o.length===0&&!!b&&!E;a.useEffect(()=>{if(!y&&!p)return;const e=()=>{var d;const r=(d=P.current)==null?void 0:d.getBoundingClientRect();r&&T({top:r.bottom+4,left:Math.max(8,Math.min(r.left,window.innerWidth-r.width-8)),width:r.width})};return e(),window.addEventListener("resize",e),window.addEventListener("scroll",e,!0),()=>{window.removeEventListener("resize",e),window.removeEventListener("scroll",e,!0)}},[y,p]),a.useEffect(()=>{if(!c)return;const e=r=>{var R,O;const d=r.target;(R=N.current)!=null&&R.contains(d)||(O=h.current)!=null&&O.contains(d)||s(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[c]),a.useEffect(()=>{m(-1)},[b]),a.useEffect(()=>{if(n>=0&&w.current){const e=w.current.children[n];e&&e.scrollIntoView({block:"nearest"})}},[n]);const U=e=>{const r=e.target.value;i==null||i(r),s(!0)},L=e=>{var r;i==null||i(e.label),g==null||g(e),s(!1),(r=A.current)==null||r.blur()},W=e=>{if(!c){(e.key==="ArrowDown"||e.key==="ArrowUp")&&(s(!0),e.preventDefault());return}switch(e.key){case"ArrowDown":e.preventDefault(),m(r=>r<o.length-1?r+1:0);break;case"ArrowUp":e.preventDefault(),m(r=>r>0?r-1:o.length-1);break;case"Enter":e.preventDefault(),n>=0&&o[n]?L(o[n]):j&&b&&s(!1);break;case"Escape":s(!1);break}};return t.jsxs("div",{className:x.cn("bear-w-full bear-relative",_),ref:N,"data-testid":B,children:[k&&t.jsx("label",{className:"bear-block bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-200 bear-mb-1.5",children:k}),t.jsxs("div",{className:"bear-relative",ref:P,children:[t.jsx("input",{ref:A,type:"text",value:b,onChange:U,onFocus:()=>s(!0),onKeyDown:W,placeholder:I,disabled:f,className:x.cn("bear-w-full bear-px-4 bear-py-2.5 bear-pr-10 bear-rounded-lg bear-border","bear-bg-white dark:bear-bg-gray-900","bear-text-sm bear-text-gray-900 dark:bear-text-white","placeholder:bear-text-gray-400","bear-transition-colors bear-outline-none",u?"bear-border-red-500 focus:bear-ring-2 focus:bear-ring-red-500/20":"bear-border-gray-300 dark:bear-border-gray-600 focus:bear-border-amber-500 focus:bear-ring-2 focus:bear-ring-amber-500/20",f&&"bear-opacity-50 bear-cursor-not-allowed bear-bg-gray-100 dark:bear-bg-gray-800")}),t.jsx("div",{className:"bear-absolute bear-right-3 bear-top-1/2 bear-transform bear--translate-y-1/2",children:E?t.jsxs("svg",{className:"bear-animate-spin bear-w-4 bear-h-4 bear-text-gray-400",viewBox:"0 0 24 24",fill:"none",children:[t.jsx("circle",{className:"bear-opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),t.jsx("path",{className:"bear-opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]}):t.jsx("svg",{className:"bear-w-4 bear-h-4 bear-text-gray-400",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:t.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"})})})]}),y&&t.jsx(D.Portal,{children:t.jsx("div",{ref:h,className:"bear-fixed bear-rounded-lg bear-border bear-border-gray-200 dark:bear-border-gray-700 bear-shadow-lg bear-bg-white dark:bear-bg-gray-800",style:{top:l.top,left:l.left,width:l.width,zIndex:M.AUTOCOMPLETE_PANEL_Z},children:t.jsx("div",{ref:w,className:"bear-max-h-60 bear-overflow-auto bear-py-1",children:o.map((e,r)=>t.jsxs("button",{type:"button",disabled:e.disabled,onClick:()=>L(e),className:x.cn("bear-w-full bear-px-4 bear-py-2 bear-text-left bear-text-sm bear-transition-colors","bear-text-gray-900 dark:bear-text-white",r===n?"bear-bg-amber-50 dark:bear-bg-amber-900/20":"hover:bear-bg-gray-50 dark:hover:bear-bg-gray-700",e.disabled&&"bear-opacity-50 bear-cursor-not-allowed"),children:[t.jsx("div",{className:"bear-font-medium",children:e.label}),e.description&&t.jsx("div",{className:"bear-text-xs bear-text-gray-500 dark:bear-text-gray-400 bear-mt-0.5",children:e.description})]},e.value))})})}),p&&t.jsx(D.Portal,{children:t.jsx("div",{ref:h,className:"bear-fixed bear-py-3 bear-px-4 bear-bg-white dark:bear-bg-gray-800 bear-border bear-border-gray-200 dark:bear-border-gray-700 bear-rounded-lg bear-shadow-lg bear-text-sm bear-text-gray-500",style:{top:l.top,left:l.left,width:l.width,zIndex:M.AUTOCOMPLETE_PANEL_Z},children:j?"Press Enter to use this value":"No results found"})}),(v||u)&&t.jsx("p",{className:x.cn("bear-mt-1.5 bear-text-xs",u?"bear-text-red-500":"bear-text-gray-500 dark:bear-text-gray-400"),children:u||v})]})};exports.Autocomplete=C;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),a=require("react"),m=require("../../utils/cn.cjs"),D=require("../Portal/Portal.cjs"),V=require("./Autocomplete.utils.cjs"),M=require("./Autocomplete.const.cjs"),C=({options:z,value:b="",onChange:i,onSelect:x,placeholder:I="Start typing...",label:v,helperText:j,error:u,disabled:f=!1,freeSolo:k=!1,loading:E=!1,filterOptions:q=V.defaultFilter,className:_,testId:B})=>{const[c,s]=a.useState(!1),[n,h]=a.useState(-1),[l,T]=a.useState({top:0,left:0,width:0}),N=a.useRef(null),P=a.useRef(null),p=a.useRef(null),A=a.useRef(null),w=a.useRef(null),o=q(z,b),g=c&&!f&&o.length>0,y=c&&!f&&o.length===0&&!!b&&!E;a.useEffect(()=>{if(!g&&!y)return;const e=()=>{var d;const r=(d=P.current)==null?void 0:d.getBoundingClientRect();r&&T({top:r.bottom+4,left:Math.max(8,Math.min(r.left,window.innerWidth-r.width-8)),width:r.width})};return e(),window.addEventListener("resize",e),window.addEventListener("scroll",e,!0),()=>{window.removeEventListener("resize",e),window.removeEventListener("scroll",e,!0)}},[g,y]),a.useEffect(()=>{if(!c)return;const e=r=>{var R,O;const d=r.target;(R=N.current)!=null&&R.contains(d)||(O=p.current)!=null&&O.contains(d)||s(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[c]),a.useEffect(()=>{h(-1)},[b]),a.useEffect(()=>{if(n>=0&&w.current){const e=w.current.children[n];e&&e.scrollIntoView({block:"nearest"})}},[n]);const U=e=>{const r=e.target.value;i==null||i(r),s(!0)},L=e=>{var r;i==null||i(e.label),x==null||x(e),s(!1),(r=A.current)==null||r.blur()},W=e=>{if(!c){(e.key==="ArrowDown"||e.key==="ArrowUp")&&(s(!0),e.preventDefault());return}switch(e.key){case"ArrowDown":e.preventDefault(),h(r=>r<o.length-1?r+1:0);break;case"ArrowUp":e.preventDefault(),h(r=>r>0?r-1:o.length-1);break;case"Enter":e.preventDefault(),n>=0&&o[n]?L(o[n]):k&&b&&s(!1);break;case"Escape":s(!1);break}};return t.jsxs("div",{className:m.cn("bear-w-full bear-relative",_),ref:N,"data-testid":B,children:[v&&t.jsx("label",{className:"bear-block bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-200 bear-mb-1.5",children:v}),t.jsxs("div",{className:"bear-relative",ref:P,children:[t.jsx("input",{ref:A,type:"text",value:b,onChange:U,onFocus:()=>s(!0),onKeyDown:W,placeholder:I,disabled:f,className:m.cn("bear-w-full bear-px-4 bear-py-2.5 bear-pr-10 bear-rounded-lg bear-border","bear-bg-[var(--bear-bg-primary)]","bear-text-sm bear-text-[var(--bear-text-primary)]","placeholder:bear-text-[var(--bear-text-muted)]","bear-transition-colors bear-outline-none",u?"bear-border-red-500 focus:bear-ring-2 focus:bear-ring-red-500/20":"bear-border-[var(--bear-border-default)] focus:bear-border-amber-500 focus:bear-ring-2 focus:bear-ring-amber-500/20",f&&"bear-opacity-50 bear-cursor-not-allowed bear-bg-[var(--bear-bg-secondary)]")}),t.jsx("div",{className:"bear-absolute bear-right-3 bear-top-1/2 bear-transform bear--translate-y-1/2",children:E?t.jsxs("svg",{className:"bear-animate-spin bear-w-4 bear-h-4 bear-text-gray-400",viewBox:"0 0 24 24",fill:"none",children:[t.jsx("circle",{className:"bear-opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),t.jsx("path",{className:"bear-opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]}):t.jsx("svg",{className:"bear-w-4 bear-h-4 bear-text-gray-400",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:t.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"})})})]}),g&&t.jsx(D.Portal,{children:t.jsx("div",{ref:p,className:"bear-fixed bear-rounded-lg bear-border bear-border-[var(--bear-border-default)] bear-shadow-lg bear-bg-[var(--bear-bg-primary)]",style:{top:l.top,left:l.left,width:l.width,zIndex:M.AUTOCOMPLETE_PANEL_Z},children:t.jsx("div",{ref:w,className:"bear-max-h-60 bear-overflow-auto bear-py-1",children:o.map((e,r)=>t.jsxs("button",{type:"button",disabled:e.disabled,onClick:()=>L(e),className:m.cn("bear-w-full bear-px-4 bear-py-2 bear-text-left bear-text-sm bear-transition-colors","bear-text-[var(--bear-text-primary)]",r===n?"bear-bg-[var(--bear-bg-tertiary)]":"hover:bear-bg-[var(--bear-bg-secondary)]",e.disabled&&"bear-opacity-50 bear-cursor-not-allowed"),children:[t.jsx("div",{className:"bear-font-medium",children:e.label}),e.description&&t.jsx("div",{className:"bear-text-xs bear-text-[var(--bear-text-muted)] bear-mt-0.5",children:e.description})]},e.value))})})}),y&&t.jsx(D.Portal,{children:t.jsx("div",{ref:p,className:"bear-fixed bear-py-3 bear-px-4 bear-bg-white dark:bear-bg-gray-800 bear-border bear-border-gray-200 dark:bear-border-gray-700 bear-rounded-lg bear-shadow-lg bear-text-sm bear-text-gray-500",style:{top:l.top,left:l.left,width:l.width,zIndex:M.AUTOCOMPLETE_PANEL_Z},children:k?"Press Enter to use this value":"No results found"})}),(j||u)&&t.jsx("p",{className:m.cn("bear-mt-1.5 bear-text-xs",u?"bear-text-red-500":"bear-text-gray-500 dark:bear-text-gray-400"),children:u||j})]})};exports.Autocomplete=C;

package/dist/components/Autocomplete/Autocomplete.js

@@ -1,6 +1,6 @@
 import { jsxs as m, jsx as t } from "react/jsx-runtime";
-import { useState as N, useRef as c, useEffect as h } from "react";
-import { cn as g } from "../../utils/cn.js";
+import { useState as N, useRef as c, useEffect as p } from "react";
+import { cn as h } from "../../utils/cn.js";
 import { Portal as B } from "../Portal/Portal.js";
 import { defaultFilter as T } from "./Autocomplete.utils.js";
 import { AUTOCOMPLETE_PANEL_Z as W } from "./Autocomplete.const.js";
@@ -20,9 +20,9 @@ const Y = ({
   className: F,
   testId: H
 }) => {
-  const [l, a] = N(!1), [n, p] = N(-1), [i, K] = N({ top: 0, left: 0, width: 0 }), D = c(null), z = c(null), y = c(null), I = c(null), x = c(null), s = V(j, b), k = l && !f && s.length > 0, v = l && !f && s.length === 0 && !!b && !A;
-  h(() => {
-    if (!k && !v) return;
+  const [l, a] = N(!1), [n, x] = N(-1), [i, K] = N({ top: 0, left: 0, width: 0 }), D = c(null), z = c(null), g = c(null), I = c(null), y = c(null), s = V(j, b), v = l && !f && s.length > 0, k = l && !f && s.length === 0 && !!b && !A;
+  p(() => {
+    if (!v && !k) return;
     const e = () => {
       var d;
       const r = (d = z.current) == null ? void 0 : d.getBoundingClientRect();
@@ -35,19 +35,19 @@ const Y = ({
     return e(), window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), () => {
       window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
     };
-  }, [k, v]), h(() => {
+  }, [v, k]), p(() => {
     if (!l) return;
     const e = (r) => {
       var M, O;
       const d = r.target;
-      (M = D.current) != null && M.contains(d) || (O = y.current) != null && O.contains(d) || a(!1);
+      (M = D.current) != null && M.contains(d) || (O = g.current) != null && O.contains(d) || a(!1);
     };
     return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
-  }, [l]), h(() => {
-    p(-1);
-  }, [b]), h(() => {
-    if (n >= 0 && x.current) {
-      const e = x.current.children[n];
+  }, [l]), p(() => {
+    x(-1);
+  }, [b]), p(() => {
+    if (n >= 0 && y.current) {
+      const e = y.current.children[n];
       e && e.scrollIntoView({ block: "nearest" });
     }
   }, [n]);
@@ -64,12 +64,12 @@ const Y = ({
     }
     switch (e.key) {
       case "ArrowDown":
-        e.preventDefault(), p(
+        e.preventDefault(), x(
           (r) => r < s.length - 1 ? r + 1 : 0
         );
         break;
       case "ArrowUp":
-        e.preventDefault(), p(
+        e.preventDefault(), x(
           (r) => r > 0 ? r - 1 : s.length - 1
         );
         break;
@@ -81,7 +81,7 @@ const Y = ({
         break;
     }
   };
-  return /* @__PURE__ */ m("div", { className: g("bear-w-full bear-relative", F), ref: D, "data-testid": H, children: [
+  return /* @__PURE__ */ m("div", { className: h("bear-w-full bear-relative", F), ref: D, "data-testid": H, children: [
     E && /* @__PURE__ */ t("label", { className: "bear-block bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-200 bear-mb-1.5", children: E }),
     /* @__PURE__ */ m("div", { className: "bear-relative", ref: z, children: [
       /* @__PURE__ */ t(
@@ -95,14 +95,14 @@ const Y = ({
           onKeyDown: C,
           placeholder: U,
           disabled: f,
-          className: g(
+          className: h(
             "bear-w-full bear-px-4 bear-py-2.5 bear-pr-10 bear-rounded-lg bear-border",
-            "bear-bg-white dark:bear-bg-gray-900",
-            "bear-text-sm bear-text-gray-900 dark:bear-text-white",
-            "placeholder:bear-text-gray-400",
+            "bear-bg-[var(--bear-bg-primary)]",
+            "bear-text-sm bear-text-[var(--bear-text-primary)]",
+            "placeholder:bear-text-[var(--bear-text-muted)]",
             "bear-transition-colors bear-outline-none",
-            u ? "bear-border-red-500 focus:bear-ring-2 focus:bear-ring-red-500/20" : "bear-border-gray-300 dark:bear-border-gray-600 focus:bear-border-amber-500 focus:bear-ring-2 focus:bear-ring-amber-500/20",
-            f && "bear-opacity-50 bear-cursor-not-allowed bear-bg-gray-100 dark:bear-bg-gray-800"
+            u ? "bear-border-red-500 focus:bear-ring-2 focus:bear-ring-red-500/20" : "bear-border-[var(--bear-border-default)] focus:bear-border-amber-500 focus:bear-ring-2 focus:bear-ring-amber-500/20",
+            f && "bear-opacity-50 bear-cursor-not-allowed bear-bg-[var(--bear-bg-secondary)]"
           )
         }
       ),
@@ -111,42 +111,42 @@ const Y = ({
         /* @__PURE__ */ t("path", { className: "bear-opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })
       ] }) : /* @__PURE__ */ t("svg", { className: "bear-w-4 bear-h-4 bear-text-gray-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ t("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" }) }) })
     ] }),
-    k && /* @__PURE__ */ t(B, { children: /* @__PURE__ */ t(
+    v && /* @__PURE__ */ t(B, { children: /* @__PURE__ */ t(
       "div",
       {
-        ref: y,
-        className: "bear-fixed bear-rounded-lg bear-border bear-border-gray-200 dark:bear-border-gray-700 bear-shadow-lg bear-bg-white dark:bear-bg-gray-800",
+        ref: g,
+        className: "bear-fixed bear-rounded-lg bear-border bear-border-[var(--bear-border-default)] bear-shadow-lg bear-bg-[var(--bear-bg-primary)]",
         style: {
           top: i.top,
           left: i.left,
           width: i.width,
           zIndex: W
         },
-        children: /* @__PURE__ */ t("div", { ref: x, className: "bear-max-h-60 bear-overflow-auto bear-py-1", children: s.map((e, r) => /* @__PURE__ */ m(
+        children: /* @__PURE__ */ t("div", { ref: y, className: "bear-max-h-60 bear-overflow-auto bear-py-1", children: s.map((e, r) => /* @__PURE__ */ m(
           "button",
           {
             type: "button",
             disabled: e.disabled,
             onClick: () => R(e),
-            className: g(
+            className: h(
               "bear-w-full bear-px-4 bear-py-2 bear-text-left bear-text-sm bear-transition-colors",
-              "bear-text-gray-900 dark:bear-text-white",
-              r === n ? "bear-bg-amber-50 dark:bear-bg-amber-900/20" : "hover:bear-bg-gray-50 dark:hover:bear-bg-gray-700",
+              "bear-text-[var(--bear-text-primary)]",
+              r === n ? "bear-bg-[var(--bear-bg-tertiary)]" : "hover:bear-bg-[var(--bear-bg-secondary)]",
               e.disabled && "bear-opacity-50 bear-cursor-not-allowed"
             ),
             children: [
               /* @__PURE__ */ t("div", { className: "bear-font-medium", children: e.label }),
-              e.description && /* @__PURE__ */ t("div", { className: "bear-text-xs bear-text-gray-500 dark:bear-text-gray-400 bear-mt-0.5", children: e.description })
+              e.description && /* @__PURE__ */ t("div", { className: "bear-text-xs bear-text-[var(--bear-text-muted)] bear-mt-0.5", children: e.description })
             ]
           },
           e.value
         )) })
       }
     ) }),
-    v && /* @__PURE__ */ t(B, { children: /* @__PURE__ */ t(
+    k && /* @__PURE__ */ t(B, { children: /* @__PURE__ */ t(
       "div",
       {
-        ref: y,
+        ref: g,
         className: "bear-fixed bear-py-3 bear-px-4 bear-bg-white dark:bear-bg-gray-800 bear-border bear-border-gray-200 dark:bear-border-gray-700 bear-rounded-lg bear-shadow-lg bear-text-sm bear-text-gray-500",
         style: {
           top: i.top,
@@ -157,7 +157,7 @@ const Y = ({
         children: P ? "Press Enter to use this value" : "No results found"
       }
     ) }),
-    (L || u) && /* @__PURE__ */ t("p", { className: g(
+    (L || u) && /* @__PURE__ */ t("p", { className: h(
       "bear-mt-1.5 bear-text-xs",
       u ? "bear-text-red-500" : "bear-text-gray-500 dark:bear-text-gray-400"
     ), children: u || L })

package/dist/components/Backdrop/Backdrop.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=require("react/jsx-runtime"),e=require("./Backdrop.const.cjs"),A=require("../../utils/cn.cjs");require("react");const C=require("../../utils/generateBearId.utils.cjs"),I=require("../../utils/useBearId.cjs"),D=n=>{const{id:d,testId:i,open:r=!0,invisible:a=!1,blur:c=!1,zIndex:o=e.BACKDROP_DEFAULT_Z_INDEX,onClick:S,children:t,className:u,...s}=n,B=I.useBearId("Backdrop"),l=C.resolveBearId(d,B);return!r&&!t?null:_.jsx("div",{...s,id:l,"data-testid":i,"aria-hidden":!r,onClick:S,className:A.cn(e.BACKDROP_ROOT_CLASS,e.BACKDROP_BASE_CLASSES,r?e.BACKDROP_VISIBLE_CLASSES:e.BACKDROP_HIDDEN_CLASSES,!a&&e.BACKDROP_TINT_CLASSES,c&&e.BACKDROP_BLUR_CLASSES,u),style:{zIndex:o,...s.style},children:t})};exports.Backdrop=D;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const D=require("react/jsx-runtime"),e=require("./Backdrop.const.cjs"),I=require("../../utils/cn.cjs");require("react");const O=require("../../utils/generateBearId.utils.cjs"),R=require("../../utils/useBearId.cjs"),E=s=>{const{id:n,testId:i,open:r=!0,invisible:a=!1,blur:o=!1,zIndex:d=e.BACKDROP_DEFAULT_Z_INDEX,transitionDuration:S=e.BACKDROP_DEFAULT_TRANSITION_MS,keepMounted:c=!1,onClick:u,children:t,className:_,style:B,...l}=s,A=R.useBearId("Backdrop"),C=O.resolveBearId(n,A);return!r&&!c&&!t?null:D.jsx("div",{...l,id:C,"data-testid":i,"aria-hidden":!r,onClick:u,className:I.cn(e.BACKDROP_ROOT_CLASS,e.BACKDROP_BASE_CLASSES,r?e.BACKDROP_VISIBLE_CLASSES:e.BACKDROP_HIDDEN_CLASSES,!a&&e.BACKDROP_TINT_CLASSES,o&&e.BACKDROP_BLUR_CLASSES,_),style:{zIndex:d,transitionDuration:`${S}ms`,...B},children:t})};exports.Backdrop=E;

package/dist/components/Backdrop/Backdrop.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S="Bear-Backdrop",e=11e3,A="bear-fixed bear-inset-0 bear-flex bear-items-center bear-justify-center bear-transition-opacity bear-duration-200",_="bear-opacity-100 bear-pointer-events-auto",r="bear-opacity-0 bear-pointer-events-none",t="bear-bg-black/50 dark:bear-bg-black/60",a="bear-backdrop-blur-sm";exports.BACKDROP_BASE_CLASSES=A;exports.BACKDROP_BLUR_CLASSES=a;exports.BACKDROP_DEFAULT_Z_INDEX=e;exports.BACKDROP_HIDDEN_CLASSES=r;exports.BACKDROP_ROOT_CLASS=S;exports.BACKDROP_TINT_CLASSES=t;exports.BACKDROP_VISIBLE_CLASSES=_;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S="Bear-Backdrop",e=11e3,A=200,_="bear-fixed bear-inset-0 bear-flex bear-items-center bear-justify-center bear-transition-opacity",t="bear-opacity-100 bear-pointer-events-auto",C="bear-opacity-0 bear-pointer-events-none",r="bear-bg-black/50 dark:bear-bg-black/60",a="bear-backdrop-blur-sm";exports.BACKDROP_BASE_CLASSES=_;exports.BACKDROP_BLUR_CLASSES=a;exports.BACKDROP_DEFAULT_TRANSITION_MS=A;exports.BACKDROP_DEFAULT_Z_INDEX=e;exports.BACKDROP_HIDDEN_CLASSES=C;exports.BACKDROP_ROOT_CLASS=S;exports.BACKDROP_TINT_CLASSES=r;exports.BACKDROP_VISIBLE_CLASSES=t;

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

@@ -1,6 +1,7 @@
 export declare const BACKDROP_ROOT_CLASS = "Bear-Backdrop";
 export declare const BACKDROP_DEFAULT_Z_INDEX = 11000;
-export declare const BACKDROP_BASE_CLASSES = "bear-fixed bear-inset-0 bear-flex bear-items-center bear-justify-center bear-transition-opacity bear-duration-200";
+export declare const BACKDROP_DEFAULT_TRANSITION_MS = 200;
+export declare const BACKDROP_BASE_CLASSES = "bear-fixed bear-inset-0 bear-flex bear-items-center bear-justify-center bear-transition-opacity";
 export declare const BACKDROP_VISIBLE_CLASSES = "bear-opacity-100 bear-pointer-events-auto";
 export declare const BACKDROP_HIDDEN_CLASSES = "bear-opacity-0 bear-pointer-events-none";
 export declare const BACKDROP_TINT_CLASSES = "bear-bg-black/50 dark:bear-bg-black/60";

package/dist/components/Backdrop/Backdrop.const.js

@@ -1,10 +1,11 @@
-const e = "Bear-Backdrop", a = 11e3, r = "bear-fixed bear-inset-0 bear-flex bear-items-center bear-justify-center bear-transition-opacity bear-duration-200", t = "bear-opacity-100 bear-pointer-events-auto", b = "bear-opacity-0 bear-pointer-events-none", n = "bear-bg-black/50 dark:bear-bg-black/60", o = "bear-backdrop-blur-sm";
+const e = "Bear-Backdrop", a = 11e3, r = 200, t = "bear-fixed bear-inset-0 bear-flex bear-items-center bear-justify-center bear-transition-opacity", S = "bear-opacity-100 bear-pointer-events-auto", b = "bear-opacity-0 bear-pointer-events-none", n = "bear-bg-black/50 dark:bear-bg-black/60", o = "bear-backdrop-blur-sm";
 export {
-  r as BACKDROP_BASE_CLASSES,
+  t as BACKDROP_BASE_CLASSES,
   o as BACKDROP_BLUR_CLASSES,
+  r as BACKDROP_DEFAULT_TRANSITION_MS,
   a as BACKDROP_DEFAULT_Z_INDEX,
   b as BACKDROP_HIDDEN_CLASSES,
   e as BACKDROP_ROOT_CLASS,
   n as BACKDROP_TINT_CLASSES,
-  t as BACKDROP_VISIBLE_CLASSES
+  S as BACKDROP_VISIBLE_CLASSES
 };

package/dist/components/Backdrop/Backdrop.js

@@ -1,43 +1,50 @@
-import { jsx as B } from "react/jsx-runtime";
-import { BACKDROP_DEFAULT_Z_INDEX as C, BACKDROP_BLUR_CLASSES as l, BACKDROP_TINT_CLASSES as c, BACKDROP_VISIBLE_CLASSES as D, BACKDROP_HIDDEN_CLASSES as I, BACKDROP_BASE_CLASSES as p, BACKDROP_ROOT_CLASS as E } from "./Backdrop.const.js";
-import { cn as L } from "../../utils/cn.js";
+import { jsx as l } from "react/jsx-runtime";
+import { BACKDROP_DEFAULT_Z_INDEX as I, BACKDROP_DEFAULT_TRANSITION_MS as c, BACKDROP_BLUR_CLASSES as p, BACKDROP_TINT_CLASSES as E, BACKDROP_VISIBLE_CLASSES as O, BACKDROP_HIDDEN_CLASSES as R, BACKDROP_BASE_CLASSES as L, BACKDROP_ROOT_CLASS as f } from "./Backdrop.const.js";
+import { cn as u } from "../../utils/cn.js";
 import "react";
-import { resolveBearId as O } from "../../utils/generateBearId.utils.js";
-import { useBearId as R } from "../../utils/useBearId.js";
-const k = (o) => {
+import { resolveBearId as K } from "../../utils/generateBearId.utils.js";
+import { useBearId as P } from "../../utils/useBearId.js";
+const b = (t) => {
   const {
-    id: s,
-    testId: S,
+    id: o,
+    testId: i,
     open: r = !0,
-    invisible: d = !1,
-    blur: i = !1,
-    zIndex: a = C,
-    onClick: n,
+    invisible: s = !1,
+    blur: n = !1,
+    zIndex: S = I,
+    transitionDuration: a = c,
+    keepMounted: d = !1,
+    onClick: A,
     children: e,
-    className: A,
-    ...t
-  } = o, _ = R("Backdrop"), m = O(s, _);
-  return !r && !e ? null : /* @__PURE__ */ B(
+    className: _,
+    style: m,
+    ...B
+  } = t, C = P("Backdrop"), D = K(o, C);
+  return !r && !d && !e ? null : /* @__PURE__ */ l(
     "div",
     {
-      ...t,
-      id: m,
-      "data-testid": S,
+      ...B,
+      id: D,
+      "data-testid": i,
       "aria-hidden": !r,
-      onClick: n,
-      className: L(
-        E,
-        p,
-        r ? D : I,
-        !d && c,
-        i && l,
-        A
+      onClick: A,
+      className: u(
+        f,
+        L,
+        r ? O : R,
+        !s && E,
+        n && p,
+        _
       ),
-      style: { zIndex: a, ...t.style },
+      style: {
+        zIndex: S,
+        transitionDuration: `${a}ms`,
+        ...m
+      },
       children: e
     }
   );
 };
 export {
-  k as Backdrop
+  b as Backdrop
 };

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

@@ -6,6 +6,8 @@ export interface BackdropProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onC
     invisible?: boolean;
     blur?: boolean;
     zIndex?: number;
+    transitionDuration?: number;
+    keepMounted?: boolean;
     onClick?: (event: MouseEvent<HTMLDivElement>) => void;
     children?: ReactNode;
     className?: string;

package/dist/components/Button/Button.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),B=require("react"),l=require("../../utils/cn.cjs"),ye=require("../../utils/generateBearId.utils.cjs"),Ne=require("../../utils/useBearId.cjs"),Ie=require("../Spinner/Spinner.cjs"),z=require("../Typography/Typography.cjs"),Te=require("../../hooks/useBearStyles.cjs");require("../../hooks/useBearComponent/useBearComponent.cjs");const Se=require("../../context/BearProvider.cjs");require("../FormControl/FormControl.context.cjs");const n=require("./Button.constants.cjs"),P=require("./Button.utils.cjs"),Ce=require("./useSpotlight.cjs"),L=B.forwardRef((D,d)=>{var U,V;const{variant:e="primary",size:i="md",loading:c=!1,loadingText:m,fullWidth:Z=!1,icon:p,iconPosition:T="left",leftIcon:F,rightIcon:Y,textVariant:S="inherit",iconOnly:H=!1,radius:W="default",ripple:X=!1,disableRipple:G=!1,disableElevation:J=!1,href:u,component:K="button",tooltip:Q,compact:ee=!1,gradient:b,gradientDirection:C=135,prefix:M,suffix:$,spotlight:j=!1,spotlightColor:te="rgba(255, 255, 255, 0.35)",spotlightSize:f=150,disabled:re,className:ne,children:ae,id:ie,testId:oe,bis:se,style:le,onMouseMove:ce,onMouseEnter:ue,onMouseLeave:be,onClick:_,...de}=D,pe=Ne.useBearId("Button"),fe=ye.resolveBearId(ie,pe),q=X&&!G,x=re||c,v=Te.useBearStyles(se,le),O=F??(p&&T==="left"?p:void 0),R=Y??(p&&T==="right"?p:void 0),[w,E]=B.useState(null),ge=r=>{if(q){const g=r.currentTarget.getBoundingClientRect(),h=Math.max(g.width,g.height)*2;E({width:h,height:h,left:r.clientX-g.left-h/2,top:r.clientY-g.top-h/2}),setTimeout(()=>E(null),600)}_==null||_(r)},o=B.useContext(Se.BearContext),y=((V=(U=o==null?void 0:o.components)==null?void 0:U.Button)==null?void 0:V.root)||{},k=(o==null?void 0:o.customVariants)||{},N=!P.isBuiltInVariant(e)&&e in k,a=N?k[e]:null,{spotlightRef:he,position:A,isHovered:Be,handlers:I}=Ce.useSpotlight({enabled:j,onMouseMove:ce,onMouseEnter:ue,onMouseLeave:be}),s=n.VARIANT_DEFAULTS[e]||n.VARIANT_DEFAULTS.primary,me=B.useMemo(()=>N&&a?{backgroundColor:`var(--bear-${e}-bg, ${a.bg})`,color:a.text||"#ffffff",borderColor:a.border,"--bear-ring-color":a.ring||a.bg,...y,...v}:{backgroundColor:b?void 0:`var(--bear-btn-${e}-bg, ${s.bg})`,background:b?`linear-gradient(${C}deg, ${b[0]}, ${b[1]})`:void 0,color:e==="outline"||e==="ghost"?`var(--bear-btn-${e}-text, ${s.text||"inherit"})`:"white",borderColor:e==="outline"?`var(--bear-btn-${e}-border, ${s.border||s.bg})`:void 0,"--bear-ring-color":`var(--bear-btn-${e}-ring, ${s.ring})`,...y,...v},[e,s,y,v,N,a,b,C]),_e=r=>{he.current=r,typeof d=="function"?d(r):d&&(d.current=r)},xe=u?"a":K,ve=u?{href:x?void 0:u}:{};return t.jsxs(xe,{ref:_e,id:fe,disabled:u?void 0:x,"aria-disabled":u&&x?!0:void 0,"aria-busy":c||void 0,style:me,title:Q,className:l.cn("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",n.BUTTON_RADIUS[W],H?n.BUTTON_ICON_ONLY_SIZE[i]:ee?n.BUTTON_COMPACT_SIZE[i]:n.BUTTON_SIZE[i],P.isBuiltInVariant(e)?n.BUTTON_VARIANT[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",Z&&"bear-w-full",c&&"bear-cursor-wait",ne),"data-testid":oe,onClick:ge,onMouseMove:I.handleMouseMove,onMouseEnter:I.handleMouseEnter,onMouseLeave:I.handleMouseLeave,...ve,...de,children:[j&&t.jsx("span",{className:l.cn("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",Be?"bear-opacity-100":"bear-opacity-0"),"aria-hidden":"true",style:{width:f,height:f,background:`radial-gradient(circle at center, ${te} 0%, transparent 70%)`,transform:`translate(${A.x-f/2}px, ${A.y-f/2}px)`,mixBlendMode:"overlay"}}),c&&t.jsxs("span",{className:l.cn("Bear-Button__loading bear-inline-flex bear-items-center bear-gap-2 bear-relative bear-z-10",!m&&"bear-absolute"),children:[t.jsx(Ie.Spinner,{size:i==="xs"?"xs":"sm",className:"Bear-Button__spinner"}),m&&t.jsx(z.Typography,{variant:S,className:"Bear-Button__text",children:m})]}),t.jsxs("span",{className:l.cn("Bear-Button__content bear-inline-flex bear-items-center bear-gap-inherit bear-relative bear-z-10",c&&"bear-invisible"),children:[M&&t.jsx("span",{className:"Bear-Button__prefix bear-inline-flex bear-shrink-0",children:M}),O&&t.jsx("span",{className:l.cn("Bear-Button__icon Bear-Button__icon--left bear-inline-flex bear-shrink-0",n.BUTTON_ICON_SIZE[i]),children:O}),t.jsx(z.Typography,{variant:S,className:"Bear-Button__text",children:ae}),R&&t.jsx("span",{className:l.cn("Bear-Button__icon Bear-Button__icon--right bear-inline-flex bear-shrink-0",n.BUTTON_ICON_SIZE[i]),children:R}),$&&t.jsx("span",{className:"Bear-Button__suffix bear-inline-flex bear-shrink-0",children:$})]}),q&&w&&t.jsx("span",{className:"Bear-Button__ripple bear-absolute bear-rounded-full bear-pointer-events-none bear-z-[2] bear-animate-ping bear-opacity-30 bear-bg-white",style:w,"aria-hidden":"true"})]})});L.displayName="Button";exports.Button=L;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),B=require("react"),l=require("../../utils/cn.cjs"),Te=require("../../utils/generateBearId.utils.cjs"),Se=require("../../utils/useBearId.cjs"),Ce=require("../Spinner/Spinner.cjs"),z=require("../Typography/Typography.cjs"),Me=require("../../hooks/useBearStyles.cjs");require("../../hooks/useBearComponent/useBearComponent.cjs");const P=require("../../context/BearProvider.cjs");require("../FormControl/FormControl.context.cjs");const n=require("./Button.constants.cjs"),D=require("./Button.utils.cjs"),$e=require("./useSpotlight.cjs"),L=B.forwardRef((Z,d)=>{var U,V;const{variant:e="primary",size:o="md",loading:c=!1,loadingText:m,fullWidth:F=!1,icon:p,iconPosition:T="left",leftIcon:Y,rightIcon:H,textVariant:S="inherit",iconOnly:W=!1,radius:X="default",ripple:G=!1,disableRipple:J=!1,disableElevation:K=!1,href:u,component:Q="button",tooltip:ee,compact:te,gradient:b,gradientDirection:C=135,prefix:M,suffix:$,spotlight:j=!1,spotlightColor:re="rgba(255, 255, 255, 0.35)",spotlightSize:f=150,disabled:ne,className:ae,children:oe,id:ie,testId:se,bis:le,style:ce,onMouseMove:ue,onMouseEnter:be,onMouseLeave:de,onClick:_,...pe}=Z,fe=Se.useBearId("Button"),ge=Te.resolveBearId(ie,fe),{density:he}=P.useBearDensityOptional(),Be=te??he==="compact",O=G&&!J,x=ne||c,v=Me.useBearStyles(le,ce),q=Y??(p&&T==="left"?p:void 0),R=H??(p&&T==="right"?p:void 0),[w,E]=B.useState(null),me=r=>{if(O){const g=r.currentTarget.getBoundingClientRect(),h=Math.max(g.width,g.height)*2;E({width:h,height:h,left:r.clientX-g.left-h/2,top:r.clientY-g.top-h/2}),setTimeout(()=>E(null),600)}_==null||_(r)},i=B.useContext(P.BearContext),y=((V=(U=i==null?void 0:i.components)==null?void 0:U.Button)==null?void 0:V.root)||{},k=(i==null?void 0:i.customVariants)||{},N=!D.isBuiltInVariant(e)&&e in k,a=N?k[e]:null,{spotlightRef:_e,position:A,isHovered:xe,handlers:I}=$e.useSpotlight({enabled:j,onMouseMove:ue,onMouseEnter:be,onMouseLeave:de}),s=n.VARIANT_DEFAULTS[e]||n.VARIANT_DEFAULTS.primary,ve=B.useMemo(()=>N&&a?{backgroundColor:`var(--bear-${e}-bg, ${a.bg})`,color:a.text||"#ffffff",borderColor:a.border,"--bear-ring-color":a.ring||a.bg,...y,...v}:{backgroundColor:b?void 0:`var(--bear-btn-${e}-bg, ${s.bg})`,background:b?`linear-gradient(${C}deg, ${b[0]}, ${b[1]})`:void 0,color:e==="outline"||e==="ghost"?`var(--bear-btn-${e}-text, ${s.text||"inherit"})`:"white",borderColor:e==="outline"?`var(--bear-btn-${e}-border, ${s.border||s.bg})`:void 0,"--bear-ring-color":`var(--bear-btn-${e}-ring, ${s.ring})`,...y,...v},[e,s,y,v,N,a,b,C]),ye=r=>{_e.current=r,typeof d=="function"?d(r):d&&(d.current=r)},Ne=u?"a":Q,Ie=u?{href:x?void 0:u}:{};return t.jsxs(Ne,{ref:ye,id:ge,disabled:u?void 0:x,"aria-disabled":u&&x?!0:void 0,"aria-busy":c||void 0,style:ve,title:ee,className:l.cn("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",!K&&"bear-shadow-sm",n.BUTTON_RADIUS[X],W?n.BUTTON_ICON_ONLY_SIZE[o]:Be?n.BUTTON_COMPACT_SIZE[o]:n.BUTTON_SIZE[o],D.isBuiltInVariant(e)?n.BUTTON_VARIANT[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",F&&"bear-w-full",c&&"bear-cursor-wait",ae),"data-testid":se,onClick:me,onMouseMove:I.handleMouseMove,onMouseEnter:I.handleMouseEnter,onMouseLeave:I.handleMouseLeave,...Ie,...pe,children:[j&&t.jsx("span",{className:l.cn("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",xe?"bear-opacity-100":"bear-opacity-0"),"aria-hidden":"true",style:{width:f,height:f,background:`radial-gradient(circle at center, ${re} 0%, transparent 70%)`,transform:`translate(${A.x-f/2}px, ${A.y-f/2}px)`,mixBlendMode:"overlay"}}),c&&t.jsxs("span",{className:l.cn("Bear-Button__loading bear-inline-flex bear-items-center bear-gap-2 bear-relative bear-z-10",!m&&"bear-absolute"),children:[t.jsx(Ce.Spinner,{size:o==="xs"?"xs":"sm",className:"Bear-Button__spinner"}),m&&t.jsx(z.Typography,{variant:S,className:"Bear-Button__text",children:m})]}),t.jsxs("span",{className:l.cn("Bear-Button__content bear-inline-flex bear-items-center bear-gap-inherit bear-relative bear-z-10",c&&"bear-invisible"),children:[M&&t.jsx("span",{className:"Bear-Button__prefix bear-inline-flex bear-shrink-0",children:M}),q&&t.jsx("span",{className:l.cn("Bear-Button__icon Bear-Button__icon--left bear-inline-flex bear-shrink-0",n.BUTTON_ICON_SIZE[o]),children:q}),t.jsx(z.Typography,{variant:S,className:"Bear-Button__text",children:oe}),R&&t.jsx("span",{className:l.cn("Bear-Button__icon Bear-Button__icon--right bear-inline-flex bear-shrink-0",n.BUTTON_ICON_SIZE[o]),children:R}),$&&t.jsx("span",{className:"Bear-Button__suffix bear-inline-flex bear-shrink-0",children:$})]}),O&&w&&t.jsx("span",{className:"Bear-Button__ripple bear-absolute bear-rounded-full bear-pointer-events-none bear-z-[2] bear-animate-ping bear-opacity-30 bear-bg-white",style:w,"aria-hidden":"true"})]})});L.displayName="Button";exports.Button=L;