@forgedevstack/bear 1.2.4 → 1.2.6

package/README.md

@@ -6,6 +6,21 @@ Strong, reliable React UI components. Tailwind-powered, zero config required. Th
 
 Visit the [Bear UI Portal](https://bearui.com/) to explore all components, view live examples, and browse the documentation.
 
+## Sanity / Playwright
+
+```bash
+# Install browsers once (required — missing Chromium yields 0 passes)
+cd portal && npx playwright install chromium
+
+# Critical-path smoke (recommended before release)
+cd portal && npm run test:e2e:smoke
+
+# Full portal suite
+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`.
+
 ## Features
 
 - **Tailwind-Powered**: Built with Tailwind CSS, zero config required

package/dist/components/AppBar/AppBar.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),x=require("../../utils/cn.cjs");require("react");const u=({children:a,position:t="sticky",variant:b="default",color:r="primary",className:s,leftContent:i,rightContent:l,centerContent:c,elevation:n=!0})=>{const d={fixed:"bear-fixed bear-top-0 bear-left-0 bear-right-0 bear-z-50",sticky:"bear-sticky bear-top-0 bear-z-50",static:"bear-static",relative:"bear-relative"},o={default:"",transparent:"bear-bg-transparent",blur:"bear-backdrop-blur-md"},p={default:"bear-bg-white bear-text-gray-900 dark:bear-bg-zinc-900 dark:bear-text-white",primary:"bear-bg-primary-600 bear-text-white",dark:"bear-bg-gray-900 bear-text-white dark:bear-bg-black"},m=n?"bear-shadow-md bear-border-b bear-border-gray-200/10":"";return e.jsx("header",{className:x.cn("Bear-AppBar","bear-w-full bear-h-16 bear-px-4 bear-flex bear-items-center",d[t],o[b],p[r],m,s),style:{backgroundColor:r==="primary"?"var(--bear-primary-600)":void 0},children:a??e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"bear-flex bear-items-center bear-gap-4",children:i}),e.jsx("div",{className:"bear-flex-1 bear-flex bear-items-center bear-justify-center",children:c}),e.jsx("div",{className:"bear-flex bear-items-center bear-gap-4",children:l})]})})};exports.AppBar=u;
+"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;

package/dist/components/AppBar/AppBar.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _="Bear-AppBar",A="Bear-AppBar--dense",e="Bear-AppBar__section",P="Bear-AppBar__section--center",r="Bear-AppBar__section--end",S="sticky",a="default",E="primary",R=!0,t=!1,B=!1,T="bear-h-16",b="bear-h-12",L="bear-px-4",O="bear-px-3",C={fixed:"bear-fixed bear-top-0 bear-left-0 bear-right-0 bear-z-50",sticky:"bear-sticky bear-top-0 bear-z-50",static:"bear-static",relative:"bear-relative"},s={default:"",transparent:"bear-bg-transparent",blur:"bear-backdrop-blur-md"},c={default:"bear-bg-white bear-text-gray-900 dark:bear-bg-zinc-900 dark:bear-text-white",primary:"bear-bg-primary-600 bear-text-white",dark:"bear-bg-gray-900 bear-text-white dark:bear-bg-black"},n="dark:bear-bg-primary-600 dark:bear-text-white",N="bear-shadow-md bear-border-b bear-border-gray-200/10 dark:bear-border-gray-800/40",o="bear-w-full bear-flex bear-items-center",I="bear-flex bear-items-center bear-gap-4",i="bear-flex-1 bear-justify-center";exports.APP_BAR_BASE_CLASS=o;exports.APP_BAR_COLOR_CLASSES=c;exports.APP_BAR_COLOR_ON_DARK_CLASS=n;exports.APP_BAR_DENSE_MODIFIER_CLASS=A;exports.APP_BAR_ELEVATION_CLASS=N;exports.APP_BAR_GUTTER_X=L;exports.APP_BAR_GUTTER_X_DENSE=O;exports.APP_BAR_HEIGHT_COMFORTABLE=T;exports.APP_BAR_HEIGHT_DENSE=b;exports.APP_BAR_POSITION_CLASSES=C;exports.APP_BAR_ROOT_CLASS=_;exports.APP_BAR_SECTION_BASE_CLASS=I;exports.APP_BAR_SECTION_CENTER_CLASS=P;exports.APP_BAR_SECTION_CLASS=e;exports.APP_BAR_SECTION_END_CLASS=r;exports.APP_BAR_SECTION_GROW_CLASS=i;exports.APP_BAR_VARIANT_CLASSES=s;exports.DEFAULT_APP_BAR_COLOR=E;exports.DEFAULT_APP_BAR_DISABLE_GUTTERS=t;exports.DEFAULT_APP_BAR_ELEVATION=R;exports.DEFAULT_APP_BAR_ENABLE_COLOR_ON_DARK=B;exports.DEFAULT_APP_BAR_POSITION=S;exports.DEFAULT_APP_BAR_VARIANT=a;

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

@@ -1 +1,36 @@
-export declare const A_P_P_B_A_R_ROOT_CLASS = "Bear-AppBar";
+export declare const APP_BAR_ROOT_CLASS = "Bear-AppBar";
+export declare const APP_BAR_DENSE_MODIFIER_CLASS = "Bear-AppBar--dense";
+export declare const APP_BAR_SECTION_CLASS = "Bear-AppBar__section";
+export declare const APP_BAR_SECTION_CENTER_CLASS = "Bear-AppBar__section--center";
+export declare const APP_BAR_SECTION_END_CLASS = "Bear-AppBar__section--end";
+export declare const DEFAULT_APP_BAR_POSITION: "sticky";
+export declare const DEFAULT_APP_BAR_VARIANT: "default";
+export declare const DEFAULT_APP_BAR_COLOR: "primary";
+export declare const DEFAULT_APP_BAR_ELEVATION = true;
+export declare const DEFAULT_APP_BAR_DISABLE_GUTTERS = false;
+export declare const DEFAULT_APP_BAR_ENABLE_COLOR_ON_DARK = false;
+export declare const APP_BAR_HEIGHT_COMFORTABLE = "bear-h-16";
+export declare const APP_BAR_HEIGHT_DENSE = "bear-h-12";
+export declare const APP_BAR_GUTTER_X = "bear-px-4";
+export declare const APP_BAR_GUTTER_X_DENSE = "bear-px-3";
+export declare const APP_BAR_POSITION_CLASSES: {
+    readonly fixed: "bear-fixed bear-top-0 bear-left-0 bear-right-0 bear-z-50";
+    readonly sticky: "bear-sticky bear-top-0 bear-z-50";
+    readonly static: "bear-static";
+    readonly relative: "bear-relative";
+};
+export declare const APP_BAR_VARIANT_CLASSES: {
+    readonly default: "";
+    readonly transparent: "bear-bg-transparent";
+    readonly blur: "bear-backdrop-blur-md";
+};
+export declare const APP_BAR_COLOR_CLASSES: {
+    readonly default: "bear-bg-white bear-text-gray-900 dark:bear-bg-zinc-900 dark:bear-text-white";
+    readonly primary: "bear-bg-primary-600 bear-text-white";
+    readonly dark: "bear-bg-gray-900 bear-text-white dark:bear-bg-black";
+};
+export declare const APP_BAR_COLOR_ON_DARK_CLASS = "dark:bear-bg-primary-600 dark:bear-text-white";
+export declare const APP_BAR_ELEVATION_CLASS = "bear-shadow-md bear-border-b bear-border-gray-200/10 dark:bear-border-gray-800/40";
+export declare const APP_BAR_BASE_CLASS = "bear-w-full bear-flex bear-items-center";
+export declare const APP_BAR_SECTION_BASE_CLASS = "bear-flex bear-items-center bear-gap-4";
+export declare const APP_BAR_SECTION_GROW_CLASS = "bear-flex-1 bear-justify-center";

package/dist/components/AppBar/AppBar.const.js

@@ -0,0 +1,39 @@
+const e = "Bear-AppBar", r = "Bear-AppBar--dense", _ = "Bear-AppBar__section", A = "Bear-AppBar__section--center", a = "Bear-AppBar__section--end", t = "sticky", b = "default", P = "primary", S = !0, s = !1, E = !1, R = "bear-h-16", c = "bear-h-12", B = "bear-px-4", n = "bear-px-3", o = {
+  fixed: "bear-fixed bear-top-0 bear-left-0 bear-right-0 bear-z-50",
+  sticky: "bear-sticky bear-top-0 bear-z-50",
+  static: "bear-static",
+  relative: "bear-relative"
+}, L = {
+  default: "",
+  transparent: "bear-bg-transparent",
+  blur: "bear-backdrop-blur-md"
+}, T = {
+  default: "bear-bg-white bear-text-gray-900 dark:bear-bg-zinc-900 dark:bear-text-white",
+  primary: "bear-bg-primary-600 bear-text-white",
+  dark: "bear-bg-gray-900 bear-text-white dark:bear-bg-black"
+}, O = "dark:bear-bg-primary-600 dark:bear-text-white", i = "bear-shadow-md bear-border-b bear-border-gray-200/10 dark:bear-border-gray-800/40", C = "bear-w-full bear-flex bear-items-center", p = "bear-flex bear-items-center bear-gap-4", d = "bear-flex-1 bear-justify-center";
+export {
+  C as APP_BAR_BASE_CLASS,
+  T as APP_BAR_COLOR_CLASSES,
+  O as APP_BAR_COLOR_ON_DARK_CLASS,
+  r as APP_BAR_DENSE_MODIFIER_CLASS,
+  i as APP_BAR_ELEVATION_CLASS,
+  B as APP_BAR_GUTTER_X,
+  n as APP_BAR_GUTTER_X_DENSE,
+  R as APP_BAR_HEIGHT_COMFORTABLE,
+  c as APP_BAR_HEIGHT_DENSE,
+  o as APP_BAR_POSITION_CLASSES,
+  e as APP_BAR_ROOT_CLASS,
+  p as APP_BAR_SECTION_BASE_CLASS,
+  A as APP_BAR_SECTION_CENTER_CLASS,
+  _ as APP_BAR_SECTION_CLASS,
+  a as APP_BAR_SECTION_END_CLASS,
+  d as APP_BAR_SECTION_GROW_CLASS,
+  L as APP_BAR_VARIANT_CLASSES,
+  P as DEFAULT_APP_BAR_COLOR,
+  s as DEFAULT_APP_BAR_DISABLE_GUTTERS,
+  S as DEFAULT_APP_BAR_ELEVATION,
+  E as DEFAULT_APP_BAR_ENABLE_COLOR_ON_DARK,
+  t as DEFAULT_APP_BAR_POSITION,
+  b as DEFAULT_APP_BAR_VARIANT
+};

package/dist/components/AppBar/AppBar.js

@@ -1,54 +1,77 @@
-import { jsx as e, jsxs as f, Fragment as x } from "react/jsx-runtime";
-import { cn as g } from "../../utils/cn.js";
+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 "../../context/defaultTheme.js";
+import { cn as A } from "../../utils/cn.js";
 import "react";
-const u = ({
-  children: a,
-  position: t = "sticky",
-  variant: b = "default",
-  color: r = "primary",
-  className: s,
-  leftContent: i,
-  rightContent: l,
-  centerContent: c,
-  elevation: n = !0
-}) => {
-  const d = {
-    fixed: "bear-fixed bear-top-0 bear-left-0 bear-right-0 bear-z-50",
-    sticky: "bear-sticky bear-top-0 bear-z-50",
-    static: "bear-static",
-    relative: "bear-relative"
-  }, o = {
-    default: "",
-    transparent: "bear-bg-transparent",
-    blur: "bear-backdrop-blur-md"
-  }, p = {
-    default: "bear-bg-white bear-text-gray-900 dark:bear-bg-zinc-900 dark:bear-text-white",
-    primary: "bear-bg-primary-600 bear-text-white",
-    dark: "bear-bg-gray-900 bear-text-white dark:bear-bg-black"
-  }, m = n ? "bear-shadow-md bear-border-b bear-border-gray-200/10" : "";
-  return /* @__PURE__ */ e(
+import { generateBearId as q } from "../../utils/generateBearId.utils.js";
+const __ = (t) => {
+  const {
+    children: E,
+    position: R = I,
+    variant: o = p,
+    color: P = D,
+    className: a,
+    leftContent: n,
+    rightContent: i,
+    centerContent: B,
+    elevation: s = F,
+    dense: C,
+    disableGutters: O = U,
+    enableColorOnDark: L = h,
+    id: T,
+    testId: d
+  } = t, { density: N } = W(), e = C ?? N === "compact", c = T || q("AppBar");
+  return /* @__PURE__ */ _(
     "header",
     {
-      className: g(
-        "Bear-AppBar",
-        "bear-w-full bear-h-16 bear-px-4 bear-flex bear-items-center",
-        d[t],
-        o[b],
-        p[r],
-        m,
-        s
+      id: c,
+      "data-testid": d,
+      className: A(
+        X,
+        M,
+        e ? k : K,
+        !O && (e ? x : j),
+        V[R],
+        H[o],
+        g[P],
+        L && P === "default" && b,
+        s && y,
+        e && u,
+        a
       ),
       style: {
-        backgroundColor: r === "primary" ? "var(--bear-primary-600)" : void 0
+        backgroundColor: P === "primary" ? "var(--bear-primary-600)" : void 0
       },
-      children: a ?? /* @__PURE__ */ f(x, { children: [
-        /* @__PURE__ */ e("div", { className: "bear-flex bear-items-center bear-gap-4", children: i }),
-        /* @__PURE__ */ e("div", { className: "bear-flex-1 bear-flex bear-items-center bear-justify-center", children: c }),
-        /* @__PURE__ */ e("div", { className: "bear-flex bear-items-center bear-gap-4", children: l })
+      children: E ?? /* @__PURE__ */ l(m, { children: [
+        /* @__PURE__ */ _("div", { className: A(S, r), children: n }),
+        /* @__PURE__ */ _(
+          "div",
+          {
+            className: A(
+              S,
+              f,
+              r,
+              v
+            ),
+            children: B
+          }
+        ),
+        /* @__PURE__ */ _(
+          "div",
+          {
+            className: A(
+              S,
+              G,
+              r
+            ),
+            children: i
+          }
+        )
       ] })
     }
   );
 };
 export {
-  u as AppBar
+  __ as AppBar
 };

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

@@ -1,14 +1,20 @@
 import { ReactNode } from 'react';
+export type AppBarPosition = 'fixed' | 'sticky' | 'static' | 'relative';
+export type AppBarVariant = 'default' | 'transparent' | 'blur';
+export type AppBarColor = 'default' | 'primary' | 'dark';
 export interface AppBarProps {
     testId?: string;
     id?: string;
     children?: ReactNode;
-    position?: 'fixed' | 'sticky' | 'static' | 'relative';
-    variant?: 'default' | 'transparent' | 'blur';
-    color?: 'default' | 'primary' | 'dark';
+    position?: AppBarPosition;
+    variant?: AppBarVariant;
+    color?: AppBarColor;
     className?: string;
     leftContent?: ReactNode;
     rightContent?: ReactNode;
     centerContent?: ReactNode;
     elevation?: boolean;
+    dense?: boolean;
+    disableGutters?: boolean;
+    enableColorOnDark?: boolean;
 }

package/dist/components/Backdrop/Backdrop.cjs

@@ -0,0 +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;

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

@@ -0,0 +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=_;

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

@@ -0,0 +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_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";
+export declare const BACKDROP_BLUR_CLASSES = "bear-backdrop-blur-sm";

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

@@ -0,0 +1,10 @@
+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";
+export {
+  r as BACKDROP_BASE_CLASSES,
+  o as BACKDROP_BLUR_CLASSES,
+  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
+};

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

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { BackdropProps } from './Backdrop.types';
+export declare const Backdrop: FC<BackdropProps>;

package/dist/components/Backdrop/Backdrop.js

@@ -0,0 +1,43 @@
+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 "react";
+import { resolveBearId as O } from "../../utils/generateBearId.utils.js";
+import { useBearId as R } from "../../utils/useBearId.js";
+const k = (o) => {
+  const {
+    id: s,
+    testId: S,
+    open: r = !0,
+    invisible: d = !1,
+    blur: i = !1,
+    zIndex: a = C,
+    onClick: n,
+    children: e,
+    className: A,
+    ...t
+  } = o, _ = R("Backdrop"), m = O(s, _);
+  return !r && !e ? null : /* @__PURE__ */ B(
+    "div",
+    {
+      ...t,
+      id: m,
+      "data-testid": S,
+      "aria-hidden": !r,
+      onClick: n,
+      className: L(
+        E,
+        p,
+        r ? D : I,
+        !d && c,
+        i && l,
+        A
+      ),
+      style: { zIndex: a, ...t.style },
+      children: e
+    }
+  );
+};
+export {
+  k as Backdrop
+};

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

@@ -0,0 +1,12 @@
+import { HTMLAttributes, ReactNode, MouseEvent } from 'react';
+export interface BackdropProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onClick'> {
+    id?: string;
+    testId?: string;
+    open?: boolean;
+    invisible?: boolean;
+    blur?: boolean;
+    zIndex?: number;
+    onClick?: (event: MouseEvent<HTMLDivElement>) => void;
+    children?: ReactNode;
+    className?: string;
+}

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

@@ -0,0 +1,2 @@
+export { Backdrop } from './Backdrop';
+export type { BackdropProps } from './Backdrop.types';

package/dist/components/BottomNavigation/BottomNavigation.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),b=require("../../utils/cn.cjs");require("react");const u=({items:s,value:n,onChange:t,showLabels:i="active",variant:l="default",className:c})=>{const d={default:"bear-bg-zinc-900 bear-border-t bear-border-zinc-800",elevated:"bear-bg-zinc-900 bear-shadow-[0_-4px_20px_rgba(0,0,0,0.3)]",transparent:"bear-bg-zinc-900/80 bear-backdrop-blur-md bear-border-t bear-border-zinc-800/50"},o=e=>i===!0||i==="always"?!0:i==="active"?e:!1;return r.jsx("nav",{className:b.cn("bear-fixed bear-bottom-0 bear-left-0 bear-right-0 bear-z-50 bear-h-16 bear-flex bear-items-center bear-justify-around bear-px-2",d[l],c),children:s.map(e=>{const a=n===e.id;return r.jsxs("button",{onClick:()=>!e.disabled&&(t==null?void 0:t(e.id)),disabled:e.disabled,className:b.cn("bear-flex bear-flex-col bear-items-center bear-justify-center bear-flex-1 bear-h-full bear-py-2 bear-transition-all",a?"bear-text-primary-400":"bear-text-zinc-500 hover:bear-text-zinc-300",e.disabled&&"bear-opacity-50 bear-cursor-not-allowed"),children:[r.jsxs("div",{className:"bear-relative",children:[r.jsx("span",{className:b.cn("bear-transition-transform",a&&"bear-scale-110"),children:e.icon}),e.badge!==void 0&&r.jsx("span",{className:"bear-absolute -bear-top-1 -bear-right-1 bear-min-w-[16px] bear-h-4 bear-px-1 bear-flex bear-items-center bear-justify-center bear-text-xs bear-font-medium bear-bg-primary-500 bear-text-white bear-rounded-full",children:e.badge})]}),o(a)&&r.jsx("span",{className:b.cn("bear-text-xs bear-mt-1 bear-transition-all",a?"bear-font-medium":""),children:e.label})]},e.id)})})};exports.BottomNavigation=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),r=require("./BottomNavigation.const.cjs"),s=require("../../utils/cn.cjs");require("react");const f=require("../../utils/generateBearId.utils.cjs"),m=require("../../utils/useBearId.cjs"),A=b=>{const{items:o,value:l,onChange:n,showLabels:i="active",variant:c="default",className:d,id:u,testId:N}=b,x=m.useBearId("BottomNavigation"),I=f.resolveBearId(u,x),T=e=>i===!0||i==="always"?!0:i==="active"?e:!1;return a.jsx("nav",{id:I,"data-testid":N,className:s.cn(r.BOTTOM_NAVIGATION_ROOT_CLASS,"bear-fixed bear-bottom-0 bear-left-0 bear-right-0 bear-z-50 bear-h-16 bear-flex bear-items-center bear-justify-around bear-px-2",r.BOTTOM_NAVIGATION_VARIANT_CLASSES[c],d),children:o.map(e=>{const t=l===e.id;return a.jsxs("button",{type:"button",onClick:()=>!e.disabled&&(n==null?void 0:n(e.id)),disabled:e.disabled,className:s.cn(`${r.BOTTOM_NAVIGATION_ROOT_CLASS}__item`,"bear-flex bear-flex-col bear-items-center bear-justify-center bear-flex-1 bear-h-full bear-py-2 bear-transition-all",t?r.BOTTOM_NAVIGATION_ACTIVE_CLASSES:r.BOTTOM_NAVIGATION_INACTIVE_CLASSES,e.disabled&&"bear-opacity-50 bear-cursor-not-allowed"),children:[a.jsxs("div",{className:"bear-relative",children:[a.jsx("span",{className:s.cn("bear-transition-transform",t&&"bear-scale-110"),children:e.icon}),e.badge!==void 0&&a.jsx("span",{className:"bear-absolute -bear-top-1 -bear-right-1 bear-min-w-[16px] bear-h-4 bear-px-1 bear-flex bear-items-center bear-justify-center bear-text-xs bear-font-medium bear-bg-primary-500 bear-text-white bear-rounded-full",children:e.badge})]}),T(t)&&a.jsx("span",{className:s.cn("bear-text-xs bear-mt-1 bear-transition-all",t?"bear-font-medium":""),children:e.label})]},e.id)})})};exports.BottomNavigation=A;

package/dist/components/BottomNavigation/BottomNavigation.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r="Bear-BottomNavigation",e={default:"bear-bg-white dark:bear-bg-zinc-900 bear-border-t bear-border-gray-200 dark:bear-border-zinc-800",elevated:"bear-bg-white dark:bear-bg-zinc-900 bear-shadow-[0_-4px_20px_rgba(0,0,0,0.08)] dark:bear-shadow-[0_-4px_20px_rgba(0,0,0,0.3)]",transparent:"bear-bg-white/80 dark:bear-bg-zinc-900/80 bear-backdrop-blur-md bear-border-t bear-border-gray-200/70 dark:bear-border-zinc-800/50"},a="bear-text-primary-600 dark:bear-text-primary-400",b="bear-text-gray-500 hover:bear-text-gray-800 dark:bear-text-zinc-500 dark:hover:bear-text-zinc-300";exports.BOTTOM_NAVIGATION_ACTIVE_CLASSES=a;exports.BOTTOM_NAVIGATION_INACTIVE_CLASSES=b;exports.BOTTOM_NAVIGATION_ROOT_CLASS=r;exports.BOTTOM_NAVIGATION_VARIANT_CLASSES=e;

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

@@ -1 +1,8 @@
-export declare const B_O_T_T_O_M_N_A_V_I_G_A_T_I_O_N_ROOT_CLASS = "Bear-BottomNavigation";
+export declare const BOTTOM_NAVIGATION_ROOT_CLASS = "Bear-BottomNavigation";
+export declare const BOTTOM_NAVIGATION_VARIANT_CLASSES: {
+    readonly default: "bear-bg-white dark:bear-bg-zinc-900 bear-border-t bear-border-gray-200 dark:bear-border-zinc-800";
+    readonly elevated: "bear-bg-white dark:bear-bg-zinc-900 bear-shadow-[0_-4px_20px_rgba(0,0,0,0.08)] dark:bear-shadow-[0_-4px_20px_rgba(0,0,0,0.3)]";
+    readonly transparent: "bear-bg-white/80 dark:bear-bg-zinc-900/80 bear-backdrop-blur-md bear-border-t bear-border-gray-200/70 dark:bear-border-zinc-800/50";
+};
+export declare const BOTTOM_NAVIGATION_ACTIVE_CLASSES = "bear-text-primary-600 dark:bear-text-primary-400";
+export declare const BOTTOM_NAVIGATION_INACTIVE_CLASSES = "bear-text-gray-500 hover:bear-text-gray-800 dark:bear-text-zinc-500 dark:hover:bear-text-zinc-300";

package/dist/components/BottomNavigation/BottomNavigation.const.js

@@ -0,0 +1,11 @@
+const r = "Bear-BottomNavigation", a = {
+  default: "bear-bg-white dark:bear-bg-zinc-900 bear-border-t bear-border-gray-200 dark:bear-border-zinc-800",
+  elevated: "bear-bg-white dark:bear-bg-zinc-900 bear-shadow-[0_-4px_20px_rgba(0,0,0,0.08)] dark:bear-shadow-[0_-4px_20px_rgba(0,0,0,0.3)]",
+  transparent: "bear-bg-white/80 dark:bear-bg-zinc-900/80 bear-backdrop-blur-md bear-border-t bear-border-gray-200/70 dark:bear-border-zinc-800/50"
+}, e = "bear-text-primary-600 dark:bear-text-primary-400", b = "bear-text-gray-500 hover:bear-text-gray-800 dark:bear-text-zinc-500 dark:hover:bear-text-zinc-300";
+export {
+  e as BOTTOM_NAVIGATION_ACTIVE_CLASSES,
+  b as BOTTOM_NAVIGATION_INACTIVE_CLASSES,
+  r as BOTTOM_NAVIGATION_ROOT_CLASS,
+  a as BOTTOM_NAVIGATION_VARIANT_CLASSES
+};

package/dist/components/BottomNavigation/BottomNavigation.js

@@ -1,50 +1,68 @@
-import { jsx as a, jsxs as l } from "react/jsx-runtime";
-import { cn as b } from "../../utils/cn.js";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { BOTTOM_NAVIGATION_ACTIVE_CLASSES as A, BOTTOM_NAVIGATION_INACTIVE_CLASSES as I, BOTTOM_NAVIGATION_ROOT_CLASS as o, BOTTOM_NAVIGATION_VARIANT_CLASSES as T } from "./BottomNavigation.const.js";
+import { cn as t } from "../../utils/cn.js";
 import "react";
-const m = ({
-  items: s,
-  value: n,
-  onChange: t,
-  showLabels: i = "active",
-  variant: c = "default",
-  className: d
-}) => {
-  const o = {
-    default: "bear-bg-zinc-900 bear-border-t bear-border-zinc-800",
-    elevated: "bear-bg-zinc-900 bear-shadow-[0_-4px_20px_rgba(0,0,0,0.3)]",
-    transparent: "bear-bg-zinc-900/80 bear-backdrop-blur-md bear-border-t bear-border-zinc-800/50"
-  }, u = (e) => i === !0 || i === "always" ? !0 : i === "active" ? e : !1;
-  return /* @__PURE__ */ a("nav", { className: b(
-    "bear-fixed bear-bottom-0 bear-left-0 bear-right-0 bear-z-50 bear-h-16 bear-flex bear-items-center bear-justify-around bear-px-2",
-    o[c],
-    d
-  ), children: s.map((e) => {
-    const r = n === e.id;
-    return /* @__PURE__ */ l(
-      "button",
-      {
-        onClick: () => !e.disabled && (t == null ? void 0 : t(e.id)),
-        disabled: e.disabled,
-        className: b(
-          "bear-flex bear-flex-col bear-items-center bear-justify-center bear-flex-1 bear-h-full bear-py-2 bear-transition-all",
-          r ? "bear-text-primary-400" : "bear-text-zinc-500 hover:bear-text-zinc-300",
-          e.disabled && "bear-opacity-50 bear-cursor-not-allowed"
-        ),
-        children: [
-          /* @__PURE__ */ l("div", { className: "bear-relative", children: [
-            /* @__PURE__ */ a("span", { className: b("bear-transition-transform", r && "bear-scale-110"), children: e.icon }),
-            e.badge !== void 0 && /* @__PURE__ */ a("span", { className: "bear-absolute -bear-top-1 -bear-right-1 bear-min-w-[16px] bear-h-4 bear-px-1 bear-flex bear-items-center bear-justify-center bear-text-xs bear-font-medium bear-bg-primary-500 bear-text-white bear-rounded-full", children: e.badge })
-          ] }),
-          u(r) && /* @__PURE__ */ a("span", { className: b(
-            "bear-text-xs bear-mt-1 bear-transition-all",
-            r ? "bear-font-medium" : ""
-          ), children: e.label })
-        ]
-      },
-      e.id
-    );
-  }) });
+import { resolveBearId as h } from "../../utils/generateBearId.utils.js";
+import { useBearId as O } from "../../utils/useBearId.js";
+const V = (l) => {
+  const {
+    items: n,
+    value: d,
+    onChange: s,
+    showLabels: b = "active",
+    variant: c = "default",
+    className: m,
+    id: f,
+    testId: u
+  } = l, p = O("BottomNavigation"), N = h(f, p), x = (e) => b === !0 || b === "always" ? !0 : b === "active" ? e : !1;
+  return /* @__PURE__ */ r(
+    "nav",
+    {
+      id: N,
+      "data-testid": u,
+      className: t(
+        o,
+        "bear-fixed bear-bottom-0 bear-left-0 bear-right-0 bear-z-50 bear-h-16 bear-flex bear-items-center bear-justify-around bear-px-2",
+        T[c],
+        m
+      ),
+      children: n.map((e) => {
+        const a = d === e.id;
+        return /* @__PURE__ */ i(
+          "button",
+          {
+            type: "button",
+            onClick: () => !e.disabled && (s == null ? void 0 : s(e.id)),
+            disabled: e.disabled,
+            className: t(
+              `${o}__item`,
+              "bear-flex bear-flex-col bear-items-center bear-justify-center bear-flex-1 bear-h-full bear-py-2 bear-transition-all",
+              a ? A : I,
+              e.disabled && "bear-opacity-50 bear-cursor-not-allowed"
+            ),
+            children: [
+              /* @__PURE__ */ i("div", { className: "bear-relative", children: [
+                /* @__PURE__ */ r("span", { className: t("bear-transition-transform", a && "bear-scale-110"), children: e.icon }),
+                e.badge !== void 0 && /* @__PURE__ */ r("span", { className: "bear-absolute -bear-top-1 -bear-right-1 bear-min-w-[16px] bear-h-4 bear-px-1 bear-flex bear-items-center bear-justify-center bear-text-xs bear-font-medium bear-bg-primary-500 bear-text-white bear-rounded-full", children: e.badge })
+              ] }),
+              x(a) && /* @__PURE__ */ r(
+                "span",
+                {
+                  className: t(
+                    "bear-text-xs bear-mt-1 bear-transition-all",
+                    a ? "bear-font-medium" : ""
+                  ),
+                  children: e.label
+                }
+              )
+            ]
+          },
+          e.id
+        );
+      })
+    }
+  );
 };
 export {
-  m as BottomNavigation
+  V as BottomNavigation
 };

package/dist/components/Breadcrumbs/Breadcrumbs.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),b=require("react"),F=require("../../context/BearProvider.cjs"),H=require("../../utils/maxVisible.utils.cjs"),R=require("../../utils/cn.cjs"),v=require("../Dropdown/Dropdown.cjs"),u=require("../Icon/index.cjs"),c=require("./Breadcrumbs.const.cjs"),Z=N=>{const{items:n,separator:k,maxItems:p,itemsBeforeCollapse:x=c.BREADCRUMBS_DEFAULTS.ITEMS_BEFORE_COLLAPSE,itemsAfterCollapse:d=c.BREADCRUMBS_DEFAULTS.ITEMS_AFTER_COLLAPSE,className:D,size:h=c.BREADCRUMBS_DEFAULTS.SIZE,showHomeIcon:_=c.BREADCRUMBS_DEFAULTS.SHOW_HOME_ICON,testId:A,"aria-label":z="Breadcrumb"}=N,w=F.useBearThemeOptional(),[i,f]=b.useState(null),[M,E]=b.useState({}),[I,O]=b.useState(()=>typeof window<"u"?window.innerWidth:1200);b.useEffect(()=>{const e=()=>O(window.innerWidth);return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[]),b.useEffect(()=>{f(null),E({})},[n]);const S=b.useMemo(()=>p==null?void 0:H.resolveMaxVisible(p,{width:I,theme:w}),[p,I,w]),U=()=>k||r.jsx(u.BearIcons.ChevronRightIcon,{className:R.cn(c.BREADCRUMBS_ICON_SIZE[h],"bear-text-zinc-500 bear-mx-2")}),y=(e,s,t)=>{const a=r.jsxs("span",{className:"bear-flex bear-items-center bear-gap-1 bear-max-w-[12rem] bear-truncate md:bear-max-w-none",children:[s===0&&_&&r.jsx(u.BearIcons.HomeIcon,{className:c.BREADCRUMBS_ICON_SIZE[h]}),e.icon,e.label]}),o=t?r.jsx("span",{className:"bear-text-zinc-300 bear-font-medium","aria-current":"page",children:a}):e.href?r.jsx("a",{href:e.href,className:"bear-text-zinc-400 hover:bear-text-primary-400 bear-transition-colors bear-truncate",children:a}):e.onClick?r.jsx("button",{type:"button",onClick:e.onClick,className:"bear-text-zinc-400 hover:bear-text-primary-400 bear-transition-colors bear-truncate",children:a}):r.jsx("span",{className:"bear-text-zinc-400 bear-truncate",children:a});if(e.dropdownItems&&e.dropdownItems.length>0&&!t){const m=M[s],j=e.dropdownItems.find(l=>l.key===m);return r.jsx(v.Dropdown,{placement:"bottom-start",closeOnSelect:!0,trigger:r.jsxs("button",{type:"button",className:"bear-inline-flex bear-items-center bear-gap-1 bear-text-zinc-400 hover:bear-text-primary-400 bear-transition-colors","aria-haspopup":"true",children:[a,j&&r.jsx("span",{className:"bear-ml-1 bear-max-w-[8rem] bear-truncate bear-text-xs bear-text-zinc-300",children:j.label}),r.jsx(u.BearIcons.ChevronDownIcon,{size:14})]}),items:e.dropdownItems.map(l=>({key:l.key,label:l.label,disabled:l.disabled,selected:m===l.key,onClick:()=>{var g;E(q=>({...q,[s]:l.key})),(g=l.onClick)==null||g.call(l)}}))})}return o},L=S!=null&&n.length>S,B=x,T=n.length-d;let C=n.map((e,s)=>({type:"item",item:e,index:s}));if(L){const e=n.slice(0,x),s=n.slice(-d),t=n.slice(x,n.length-d);C=[...e.map((a,o)=>({type:"item",item:a,index:o})),...t.length?[{type:"ellipsis",hidden:t}]:[],...s.map((a,o)=>({type:"item",item:a,index:n.length-d+o}))]}const P=i!=null&&i>=B&&i<T;return r.jsx("nav",{"data-testid":A,className:R.cn("bear-flex bear-min-w-0 bear-items-center bear-flex-wrap",c.BREADCRUMBS_SIZE[h],D),"aria-label":z,children:r.jsx("ol",{className:"bear-flex bear-min-w-0 bear-items-center bear-flex-wrap bear-list-none bear-p-0 bear-m-0",children:C.map((e,s)=>r.jsxs("li",{className:"bear-flex bear-min-w-0 bear-items-center",children:[s>0&&r.jsx("span",{"aria-hidden":"true",children:U()}),e.type==="ellipsis"?r.jsxs("span",{className:"bear-inline-flex bear-min-w-0 bear-max-w-full bear-items-center bear-gap-1",children:[r.jsx(v.Dropdown,{placement:"bottom-start",closeOnSelect:!0,trigger:r.jsx("button",{type:"button",className:"bear-inline-flex bear-items-center bear-justify-center bear-rounded bear-px-2 bear-py-1 bear-text-zinc-400 hover:bear-bg-[var(--bear-bg-tertiary)] hover:bear-text-primary-400 bear-transition-colors","aria-label":"Hidden breadcrumbs",children:r.jsx(u.BearIcons.MoreHorizIcon,{size:18})}),items:e.hidden.map((t,a)=>{const o=B+a;return{key:`${t.label}-${a}`,label:t.label,onClick:()=>{var m;f(o),(m=t.onClick)==null||m.call(t)}}})}),P&&i!=null&&r.jsx("span",{className:"bear-min-w-0 bear-max-w-[12rem] bear-truncate md:bear-max-w-none bear-inline-flex bear-items-center",children:y(n[i],i,i===n.length-1)})]}):y(e.item,e.index,e.index===n.length-1)]},s))})})};exports.Breadcrumbs=Z;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),b=require("react"),v=require("../../context/BearProvider.cjs"),Z=require("../../utils/maxVisible.utils.cjs"),w=require("../../utils/cn.cjs"),D=require("../Dropdown/Dropdown.cjs"),d=require("../Icon/index.cjs"),l=require("./Breadcrumbs.const.cjs"),V=_=>{const{items:n,separator:k,maxItems:p,itemsBeforeCollapse:h=l.BREADCRUMBS_DEFAULTS.ITEMS_BEFORE_COLLAPSE,itemsAfterCollapse:u=l.BREADCRUMBS_DEFAULTS.ITEMS_AFTER_COLLAPSE,className:A,size:x=l.BREADCRUMBS_DEFAULTS.SIZE,showHomeIcon:z=l.BREADCRUMBS_DEFAULTS.SHOW_HOME_ICON,testId:M,"aria-label":O="Breadcrumb"}=_,f=v.useBearThemeOptional(),{direction:I}=v.useBearDirectionOptional(),[o,E]=b.useState(null),[U,S]=b.useState({}),[B,L]=b.useState(()=>typeof window<"u"?window.innerWidth:1200);b.useEffect(()=>{const e=()=>L(window.innerWidth);return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[]),b.useEffect(()=>{E(null),S({})},[n]);const C=b.useMemo(()=>p==null?void 0:Z.resolveMaxVisible(p,{width:B,theme:f}),[p,B,f]),T=()=>k||(I==="rtl"?r.jsx(d.BearIcons.ChevronLeftIcon,{className:w.cn(l.BREADCRUMBS_ICON_SIZE[x],"bear-text-zinc-500 bear-mx-2")}):r.jsx(d.BearIcons.ChevronRightIcon,{className:w.cn(l.BREADCRUMBS_ICON_SIZE[x],"bear-text-zinc-500 bear-mx-2")})),y=(e,s,t)=>{const a=r.jsxs("span",{className:"bear-flex bear-items-center bear-gap-1 bear-max-w-[12rem] bear-truncate md:bear-max-w-none",children:[s===0&&z&&r.jsx(d.BearIcons.HomeIcon,{className:l.BREADCRUMBS_ICON_SIZE[x]}),e.icon,e.label]}),c=t?r.jsx("span",{className:"bear-text-zinc-300 bear-font-medium","aria-current":"page",children:a}):e.href?r.jsx("a",{href:e.href,className:"bear-text-zinc-400 hover:bear-text-primary-400 bear-transition-colors bear-truncate",children:a}):e.onClick?r.jsx("button",{type:"button",onClick:e.onClick,className:"bear-text-zinc-400 hover:bear-text-primary-400 bear-transition-colors bear-truncate",children:a}):r.jsx("span",{className:"bear-text-zinc-400 bear-truncate",children:a});if(e.dropdownItems&&e.dropdownItems.length>0&&!t){const m=U[s],N=e.dropdownItems.find(i=>i.key===m);return r.jsx(D.Dropdown,{placement:"bottom-start",closeOnSelect:!0,trigger:r.jsxs("button",{type:"button",className:"bear-inline-flex bear-items-center bear-gap-1 bear-text-zinc-400 hover:bear-text-primary-400 bear-transition-colors","aria-haspopup":"true",children:[a,N&&r.jsx("span",{className:"bear-ml-1 bear-max-w-[8rem] bear-truncate bear-text-xs bear-text-zinc-300",children:N.label}),r.jsx(d.BearIcons.ChevronDownIcon,{size:14})]}),items:e.dropdownItems.map(i=>({key:i.key,label:i.label,disabled:i.disabled,selected:m===i.key,onClick:()=>{var g;S(H=>({...H,[s]:i.key})),(g=i.onClick)==null||g.call(i)}}))})}return c},P=C!=null&&n.length>C,j=h,q=n.length-u;let R=n.map((e,s)=>({type:"item",item:e,index:s}));if(P){const e=n.slice(0,h),s=n.slice(-u),t=n.slice(h,n.length-u);R=[...e.map((a,c)=>({type:"item",item:a,index:c})),...t.length?[{type:"ellipsis",hidden:t}]:[],...s.map((a,c)=>({type:"item",item:a,index:n.length-u+c}))]}const F=o!=null&&o>=j&&o<q;return r.jsx("nav",{dir:I,"data-testid":M,className:w.cn("bear-flex bear-min-w-0 bear-items-center bear-flex-wrap",l.BREADCRUMBS_SIZE[x],A),"aria-label":O,children:r.jsx("ol",{className:"bear-flex bear-min-w-0 bear-items-center bear-flex-wrap bear-list-none bear-p-0 bear-m-0",children:R.map((e,s)=>r.jsxs("li",{className:"bear-flex bear-min-w-0 bear-items-center",children:[s>0&&r.jsx("span",{"aria-hidden":"true",children:T()}),e.type==="ellipsis"?r.jsxs("span",{className:"bear-inline-flex bear-min-w-0 bear-max-w-full bear-items-center bear-gap-1",children:[r.jsx(D.Dropdown,{placement:"bottom-start",closeOnSelect:!0,trigger:r.jsx("button",{type:"button",className:"bear-inline-flex bear-items-center bear-justify-center bear-rounded bear-px-2 bear-py-1 bear-text-zinc-400 hover:bear-bg-[var(--bear-bg-tertiary)] hover:bear-text-primary-400 bear-transition-colors","aria-label":"Hidden breadcrumbs",children:r.jsx(d.BearIcons.MoreHorizIcon,{size:18})}),items:e.hidden.map((t,a)=>{const c=j+a;return{key:`${t.label}-${a}`,label:t.label,onClick:()=>{var m;E(c),(m=t.onClick)==null||m.call(t)}}})}),F&&o!=null&&r.jsx("span",{className:"bear-min-w-0 bear-max-w-[12rem] bear-truncate md:bear-max-w-none bear-inline-flex bear-items-center",children:y(n[o],o,o===n.length-1)})]}):y(e.item,e.index,e.index===n.length-1)]},s))})})};exports.Breadcrumbs=V;