@forgedevstack/bear 1.1.9 → 1.2.1

package/dist/components/Popover/Popover.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),l=require("react"),D=require("react-dom"),p=require("../../utils/cn.cjs"),H=1e4;function X(f,t,a){const e={position:"fixed",zIndex:H},s=f.split("-")[0],r=f.includes("start"),n=f.includes("end");return s==="bottom"?(e.top=t.bottom+a,r?e.left=t.left:n?e.left=t.right:e.left=t.left+t.width/2):s==="top"?(e.bottom=window.innerHeight-t.top+a,r?e.left=t.left:n?e.left=t.right:e.left=t.left+t.width/2):s==="left"?(e.right=window.innerWidth-t.left+a,r?e.top=t.top:n?e.bottom=window.innerHeight-t.bottom:e.top=t.top+t.height/2):(e.left=t.right+a,r?e.top=t.top:n?e.bottom=window.innerHeight-t.bottom:e.top=t.top+t.height/2),s==="bottom"||s==="top"?!r&&!n?e.transform="translateX(-50%)":n&&(e.transform="translateX(-100%)"):!r&&!n?e.transform="translateY(-50%)":n&&(e.transform="translateY(-100%)"),e}const T=({children:f,content:t,placement:a="bottom",trigger:e="click",open:s,onOpenChange:r,className:n,contentClassName:E,arrow:k=!0,closeOnClickOutside:m=!0,closeOnEscape:h=!0,offset:v=8})=>{const[z,R]=l.useState(!1),[S,j]=l.useState({}),d=l.useRef(null),w=l.useRef(null),i=s!==void 0?s:z,b=l.useCallback(o=>{R(o),r==null||r(o)},[r]);l.useEffect(()=>{if(i&&d.current){const o=d.current.getBoundingClientRect();j(X(a,o,v))}},[i,a,v]),l.useEffect(()=>{if(!m)return;const o=c=>{var g,x;const y=c.target;(g=d.current)!=null&&g.contains(y)||(x=w.current)!=null&&x.contains(y)||b(!1)};return i&&document.addEventListener("mousedown",o),()=>document.removeEventListener("mousedown",o)},[i,m,b]),l.useEffect(()=>{if(!h)return;const o=c=>{c.key==="Escape"&&b(!1)};return i&&document.addEventListener("keydown",o),()=>document.removeEventListener("keydown",o)},[i,h,b]);const L=()=>{e==="click"&&b(!i)},P=()=>{e==="hover"&&b(!0)},M=()=>{e==="hover"&&b(!1)},N={top:"bear-top-full bear-left-1/2 -bear-translate-x-1/2 bear-border-t-zinc-700 bear-border-x-transparent bear-border-b-transparent",bottom:"bear-bottom-full bear-left-1/2 -bear-translate-x-1/2 bear-border-b-zinc-700 bear-border-x-transparent bear-border-t-transparent",left:"bear-left-full bear-top-1/2 -bear-translate-y-1/2 bear-border-l-zinc-700 bear-border-y-transparent bear-border-r-transparent",right:"bear-right-full bear-top-1/2 -bear-translate-y-1/2 bear-border-r-zinc-700 bear-border-y-transparent bear-border-l-transparent"},q=a.split("-")[0],I=i&&typeof document<"u"&&D.createPortal(u.jsxs("div",{ref:w,"data-bear-popover":!0,className:p.cn("bear-bg-zinc-800 bear-border bear-border-zinc-700 bear-rounded-lg bear-shadow-xl bear-p-3",E),style:S,children:[t,k&&u.jsx("div",{className:p.cn("bear-absolute bear-w-0 bear-h-0 bear-border-8",N[q])})]}),document.body);return u.jsxs("div",{ref:d,className:p.cn("bear-relative bear-inline-block",n),onMouseEnter:P,onMouseLeave:M,children:[u.jsx("div",{onClick:L,className:"bear-cursor-pointer",children:f}),I]})};exports.Popover=T;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),l=require("react"),D=require("react-dom"),p=require("../../utils/cn.cjs"),H=11e3;function X(d,t,s){const e={position:"fixed",zIndex:H},a=d.split("-")[0],n=d.includes("start"),o=d.includes("end");return a==="bottom"?(e.top=t.bottom+s,n?e.left=t.left:o?e.left=t.right:e.left=t.left+t.width/2):a==="top"?(e.bottom=window.innerHeight-t.top+s,n?e.left=t.left:o?e.left=t.right:e.left=t.left+t.width/2):a==="left"?(e.right=window.innerWidth-t.left+s,n?e.top=t.top:o?e.bottom=window.innerHeight-t.bottom:e.top=t.top+t.height/2):(e.left=t.right+s,n?e.top=t.top:o?e.bottom=window.innerHeight-t.bottom:e.top=t.top+t.height/2),a==="bottom"||a==="top"?!n&&!o?e.transform="translateX(-50%)":o&&(e.transform="translateX(-100%)"):!n&&!o?e.transform="translateY(-50%)":o&&(e.transform="translateY(-100%)"),e}const T=({children:d,content:t,placement:s="bottom",trigger:e="click",open:a,onOpenChange:n,className:o,contentClassName:x,arrow:L=!0,closeOnClickOutside:m=!0,closeOnEscape:v=!0,offset:w=8})=>{const[k,z]=l.useState(!1),[R,S]=l.useState({}),f=l.useRef(null),h=l.useRef(null),i=a!==void 0?a:k,b=l.useCallback(r=>{z(r),n==null||n(r)},[n]);l.useEffect(()=>{if(!i||!f.current)return;const r=()=>{if(!f.current)return;const u=f.current.getBoundingClientRect();S(X(s,u,w))};return r(),window.addEventListener("resize",r),window.addEventListener("scroll",r,!0),()=>{window.removeEventListener("resize",r),window.removeEventListener("scroll",r,!0)}},[i,s,w]),l.useEffect(()=>{if(!m)return;const r=u=>{var y,g;const E=u.target;(y=f.current)!=null&&y.contains(E)||(g=h.current)!=null&&g.contains(E)||b(!1)};return i&&document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[i,m,b]),l.useEffect(()=>{if(!v)return;const r=u=>{u.key==="Escape"&&b(!1)};return i&&document.addEventListener("keydown",r),()=>document.removeEventListener("keydown",r)},[i,v,b]);const j=()=>{e==="click"&&b(!i)},P=()=>{e==="hover"&&b(!0)},M=()=>{e==="hover"&&b(!1)},N={top:"bear-top-full bear-left-1/2 -bear-translate-x-1/2 bear-border-t-zinc-700 bear-border-x-transparent bear-border-b-transparent",bottom:"bear-bottom-full bear-left-1/2 -bear-translate-x-1/2 bear-border-b-zinc-700 bear-border-x-transparent bear-border-t-transparent",left:"bear-left-full bear-top-1/2 -bear-translate-y-1/2 bear-border-l-zinc-700 bear-border-y-transparent bear-border-r-transparent",right:"bear-right-full bear-top-1/2 -bear-translate-y-1/2 bear-border-r-zinc-700 bear-border-y-transparent bear-border-l-transparent"},q=s.split("-")[0],I=i&&typeof document<"u"&&D.createPortal(c.jsxs("div",{ref:h,"data-bear-popover":!0,className:p.cn("bear-bg-zinc-800 bear-border bear-border-zinc-700 bear-rounded-lg bear-shadow-xl bear-p-3",x),style:R,children:[t,L&&c.jsx("div",{className:p.cn("bear-absolute bear-w-0 bear-h-0 bear-border-8",N[q])})]}),document.body);return c.jsxs("div",{ref:f,className:p.cn("bear-relative bear-inline-block",o),onMouseEnter:P,onMouseLeave:M,children:[c.jsx("div",{onClick:j,className:"bear-cursor-pointer",children:d}),I]})};exports.Popover=T;

package/dist/components/Popover/Popover.js

@@ -1,11 +1,11 @@
-import { jsxs as x, jsx as E } from "react/jsx-runtime";
-import { useState as k, useRef as z, useCallback as B, useEffect as u } from "react";
+import { jsxs as g, jsx as x } from "react/jsx-runtime";
+import { useState as L, useRef as k, useCallback as B, useEffect as u } from "react";
 import { createPortal as T } from "react-dom";
 import { cn as c } from "../../utils/cn.js";
-const W = 1e4;
+const W = 11e3;
 function Z(b, t, a) {
-  const e = { position: "fixed", zIndex: W }, s = b.split("-")[0], r = b.includes("start"), o = b.includes("end");
-  return s === "bottom" ? (e.top = t.bottom + a, r ? e.left = t.left : o ? e.left = t.right : e.left = t.left + t.width / 2) : s === "top" ? (e.bottom = window.innerHeight - t.top + a, r ? e.left = t.left : o ? e.left = t.right : e.left = t.left + t.width / 2) : s === "left" ? (e.right = window.innerWidth - t.left + a, r ? e.top = t.top : o ? e.bottom = window.innerHeight - t.bottom : e.top = t.top + t.height / 2) : (e.left = t.right + a, r ? e.top = t.top : o ? e.bottom = window.innerHeight - t.bottom : e.top = t.top + t.height / 2), s === "bottom" || s === "top" ? !r && !o ? e.transform = "translateX(-50%)" : o && (e.transform = "translateX(-100%)") : !r && !o ? e.transform = "translateY(-50%)" : o && (e.transform = "translateY(-100%)"), e;
+  const e = { position: "fixed", zIndex: W }, s = b.split("-")[0], n = b.includes("start"), o = b.includes("end");
+  return s === "bottom" ? (e.top = t.bottom + a, n ? e.left = t.left : o ? e.left = t.right : e.left = t.left + t.width / 2) : s === "top" ? (e.bottom = window.innerHeight - t.top + a, n ? e.left = t.left : o ? e.left = t.right : e.left = t.left + t.width / 2) : s === "left" ? (e.right = window.innerWidth - t.left + a, n ? e.top = t.top : o ? e.bottom = window.innerHeight - t.bottom : e.top = t.top + t.height / 2) : (e.left = t.right + a, n ? e.top = t.top : o ? e.bottom = window.innerHeight - t.bottom : e.top = t.top + t.height / 2), s === "bottom" || s === "top" ? !n && !o ? e.transform = "translateX(-50%)" : o && (e.transform = "translateX(-100%)") : !n && !o ? e.transform = "translateY(-50%)" : o && (e.transform = "translateY(-100%)"), e;
 }
 const F = ({
   children: b,
@@ -13,36 +13,41 @@ const F = ({
   placement: a = "bottom",
   trigger: e = "click",
   open: s,
-  onOpenChange: r,
+  onOpenChange: n,
   className: o,
-  contentClassName: L,
+  contentClassName: z,
   arrow: N = !0,
   closeOnClickOutside: p = !0,
   closeOnEscape: m = !0,
-  offset: h = 8
+  offset: w = 8
 }) => {
-  const [I, M] = k(!1), [P, R] = k({}), f = z(null), v = z(null), i = s !== void 0 ? s : I, l = B((n) => {
-    M(n), r == null || r(n);
-  }, [r]);
+  const [I, M] = L(!1), [P, R] = L({}), d = k(null), h = k(null), i = s !== void 0 ? s : I, l = B((r) => {
+    M(r), n == null || n(r);
+  }, [n]);
   u(() => {
-    if (i && f.current) {
-      const n = f.current.getBoundingClientRect();
-      R(Z(a, n, h));
-    }
-  }, [i, a, h]), u(() => {
+    if (!i || !d.current) return;
+    const r = () => {
+      if (!d.current) return;
+      const f = d.current.getBoundingClientRect();
+      R(Z(a, f, w));
+    };
+    return r(), window.addEventListener("resize", r), window.addEventListener("scroll", r, !0), () => {
+      window.removeEventListener("resize", r), window.removeEventListener("scroll", r, !0);
+    };
+  }, [i, a, w]), u(() => {
     if (!p) return;
-    const n = (d) => {
-      var y, g;
-      const w = d.target;
-      (y = f.current) != null && y.contains(w) || (g = v.current) != null && g.contains(w) || l(!1);
+    const r = (f) => {
+      var E, y;
+      const v = f.target;
+      (E = d.current) != null && E.contains(v) || (y = h.current) != null && y.contains(v) || l(!1);
     };
-    return i && document.addEventListener("mousedown", n), () => document.removeEventListener("mousedown", n);
+    return i && document.addEventListener("mousedown", r), () => document.removeEventListener("mousedown", r);
   }, [i, p, l]), u(() => {
     if (!m) return;
-    const n = (d) => {
-      d.key === "Escape" && l(!1);
+    const r = (f) => {
+      f.key === "Escape" && l(!1);
     };
-    return i && document.addEventListener("keydown", n), () => document.removeEventListener("keydown", n);
+    return i && document.addEventListener("keydown", r), () => document.removeEventListener("keydown", r);
   }, [i, m, l]);
   const S = () => {
     e === "click" && l(!i);
@@ -56,33 +61,33 @@ const F = ({
     left: "bear-left-full bear-top-1/2 -bear-translate-y-1/2 bear-border-l-zinc-700 bear-border-y-transparent bear-border-r-transparent",
     right: "bear-right-full bear-top-1/2 -bear-translate-y-1/2 bear-border-r-zinc-700 bear-border-y-transparent bear-border-l-transparent"
   }, D = a.split("-")[0], Y = i && typeof document < "u" && T(
-    /* @__PURE__ */ x(
+    /* @__PURE__ */ g(
       "div",
       {
-        ref: v,
+        ref: h,
         "data-bear-popover": !0,
         className: c(
           "bear-bg-zinc-800 bear-border bear-border-zinc-700 bear-rounded-lg bear-shadow-xl bear-p-3",
-          L
+          z
         ),
         style: P,
         children: [
           t,
-          N && /* @__PURE__ */ E("div", { className: c("bear-absolute bear-w-0 bear-h-0 bear-border-8", j[D]) })
+          N && /* @__PURE__ */ x("div", { className: c("bear-absolute bear-w-0 bear-h-0 bear-border-8", j[D]) })
         ]
       }
     ),
     document.body
   );
-  return /* @__PURE__ */ x(
+  return /* @__PURE__ */ g(
     "div",
     {
-      ref: f,
+      ref: d,
       className: c("bear-relative bear-inline-block", o),
       onMouseEnter: H,
       onMouseLeave: X,
       children: [
-        /* @__PURE__ */ E("div", { onClick: S, className: "bear-cursor-pointer", children: b }),
+        /* @__PURE__ */ x("div", { onClick: S, className: "bear-cursor-pointer", children: b }),
         Y
       ]
     }

package/dist/components/Portal/Portal.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),n=require("react-dom"),u=({children:e,target:r,disabled:o=!1})=>o?t.jsx(t.Fragment,{children:e}):typeof document>"u"?null:n.createPortal(e,r??document.body);exports.Portal=u;

package/dist/components/Portal/Portal.d.ts

@@ -0,0 +1,8 @@
+import { FC, ReactNode } from 'react';
+export interface PortalProps {
+    children: ReactNode;
+    target?: HTMLElement | null;
+    disabled?: boolean;
+}
+export declare const Portal: FC<PortalProps>;
+export default Portal;

package/dist/components/Portal/Portal.js

@@ -0,0 +1,6 @@
+import { jsx as o, Fragment as n } from "react/jsx-runtime";
+import { createPortal as f } from "react-dom";
+const a = ({ children: r, target: t, disabled: e = !1 }) => e ? /* @__PURE__ */ o(n, { children: r }) : typeof document > "u" ? null : f(r, t ?? document.body);
+export {
+  a as Portal
+};

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

@@ -0,0 +1,2 @@
+export { Portal, default } from './Portal';
+export type { PortalProps } from './Portal';

package/dist/components/Select/Select.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),n=require("react"),s=require("../../utils/cn.cjs"),j=require("../../hooks/useClickOutside.cjs");require("../../context/BearProvider.cjs");require("../../hooks/useBearComponent/useBearComponent.cjs");const m=require("../Icon/index.cjs"),p={sm:"bear-h-8 bear-text-sm bear-px-3",md:"bear-h-10 bear-text-base bear-px-4",lg:"bear-h-12 bear-text-lg bear-px-5"},N=({options:u,value:a,onChange:t,placeholder:v="Select an option",label:i,error:l,disabled:o=!1,size:y="md",fullWidth:g=!1,className:h})=>{const[c,d]=n.useState(!1),f=n.useRef(null),x=!!l,b=u.find(e=>e.value===a),k=n.useCallback(()=>d(!1),[]);j.useClickOutside(f,k);const w=e=>{t==null||t(e),d(!1)};return r.jsxs("div",{ref:f,className:s.cn("bear-relative bear-flex bear-flex-col bear-gap-1.5",g&&"bear-w-full"),children:[i&&r.jsx("label",{className:"bear-text-sm bear-font-medium",style:{color:"var(--bear-text-secondary)"},children:i}),r.jsxs("button",{type:"button",disabled:o,onClick:()=>!o&&d(!c),className:s.cn("bear-flex bear-items-center bear-justify-between bear-w-full","bear-rounded-lg bear-border bear-text-left bear-outline-none bear-transition-all bear-duration-200","focus:bear-ring-2 focus:bear-ring-offset-2 focus:bear-ring-offset-[var(--bear-bg-primary)]",x?"bear-border-red-500 focus:bear-ring-red-500":"focus:bear-border-bear-500 focus:bear-ring-bear-500 dark:focus:bear-border-bear-500 dark:focus:bear-ring-bear-500",o&&"bear-opacity-50 bear-cursor-not-allowed",p[y],h),style:{backgroundColor:"var(--bear-bg-primary)",borderColor:x?void 0:"var(--bear-border-default)",color:b?"var(--bear-text-primary)":"var(--bear-text-muted)"},children:[r.jsx("span",{children:(b==null?void 0:b.label)||v}),r.jsx(m.ChevronDownIcon,{className:s.cn("bear-w-4 bear-h-4 bear-shrink-0 bear-transition-transform",c&&"bear-rotate-180"),style:{color:"var(--bear-text-muted)"}})]}),c&&r.jsx("div",{className:"bear-absolute bear-z-50 bear-w-full bear-mt-1 bear-rounded-lg bear-border bear-shadow-lg bear-overflow-hidden bear-top-full",style:{backgroundColor:"var(--bear-bg-primary)",borderColor:"var(--bear-border-default)"},children:r.jsx("div",{className:"bear-max-h-60 bear-overflow-y-auto",children:u.map(e=>r.jsxs("button",{type:"button",disabled:e.disabled,onClick:()=>!e.disabled&&w(e.value),className:s.cn("bear-flex bear-items-center bear-justify-between bear-w-full bear-px-4 bear-py-2","bear-text-left bear-transition-colors",e.disabled&&"bear-cursor-not-allowed",e.value===a&&"bear-bg-bear-100 bear-text-bear-700 dark:bear-bg-bear-600/20 dark:bear-text-bear-300",!e.disabled&&e.value!==a&&"hover:bear-bg-[var(--bear-bg-tertiary)]"),style:e.disabled?{color:"var(--bear-text-muted)"}:e.value===a?void 0:{color:"var(--bear-text-secondary)"},children:[e.label,e.value===a&&r.jsx(m.CheckIcon,{className:"bear-w-4 bear-h-4 bear-shrink-0 bear-text-bear-600 dark:bear-text-bear-400"})]},e.value))})}),l&&r.jsx("p",{className:"bear-text-sm bear-text-red-500",children:l})]})};exports.Select=N;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),t=require("react"),o=require("../../utils/cn.cjs"),S=require("../../hooks/useClickOutside.cjs");require("../../context/BearProvider.cjs");require("../../hooks/useBearComponent/useBearComponent.cjs");const g=require("../Icon/index.cjs"),R=require("../Portal/Portal.cjs"),E={sm:"bear-h-8 bear-text-sm bear-px-3",md:"bear-h-10 bear-text-base bear-px-4",lg:"bear-h-12 bear-text-lg bear-px-5"},P=({options:x,value:s,onChange:n,placeholder:y="Select an option",label:m,error:d,disabled:i=!1,size:j="md",fullWidth:k=!1,className:p})=>{const[a,c]=t.useState(!1),[u,C]=t.useState({top:0,left:0,width:0}),f=t.useRef(null),v=t.useRef(null),w=!!d,l=x.find(e=>e.value===s),N=t.useCallback(()=>c(!1),[]);S.useClickOutsideMultiple([f,v],N,{enabled:a});const q=e=>{n==null||n(e),c(!1)};return t.useEffect(()=>{if(!a)return;const e=()=>{var h;const b=(h=f.current)==null?void 0:h.getBoundingClientRect();b&&C({top:b.bottom+4,left:Math.max(8,Math.min(b.left,window.innerWidth-b.width-8)),width:b.width})};return e(),window.addEventListener("resize",e),window.addEventListener("scroll",e,!0),()=>{window.removeEventListener("resize",e),window.removeEventListener("scroll",e,!0)}},[a]),r.jsxs("div",{ref:f,className:o.cn("bear-relative bear-flex bear-flex-col bear-gap-1.5",k&&"bear-w-full"),children:[m&&r.jsx("label",{className:"bear-text-sm bear-font-medium",style:{color:"var(--bear-text-secondary)"},children:m}),r.jsxs("button",{type:"button",disabled:i,onClick:()=>!i&&c(!a),className:o.cn("bear-flex bear-items-center bear-justify-between bear-w-full","bear-rounded-lg bear-border bear-text-left bear-outline-none bear-transition-all bear-duration-200","focus:bear-ring-2 focus:bear-ring-offset-2 focus:bear-ring-offset-[var(--bear-bg-primary)]",w?"bear-border-red-500 focus:bear-ring-red-500":"focus:bear-border-bear-500 focus:bear-ring-bear-500 dark:focus:bear-border-bear-500 dark:focus:bear-ring-bear-500",i&&"bear-opacity-50 bear-cursor-not-allowed",E[j],p),style:{backgroundColor:"var(--bear-bg-primary)",borderColor:w?void 0:"var(--bear-border-default)",color:l?"var(--bear-text-primary)":"var(--bear-text-muted)"},children:[r.jsx("span",{children:(l==null?void 0:l.label)||y}),r.jsx(g.ChevronDownIcon,{className:o.cn("bear-w-4 bear-h-4 bear-shrink-0 bear-transition-transform",a&&"bear-rotate-180"),style:{color:"var(--bear-text-muted)"}})]}),a&&r.jsx(R.Portal,{children:r.jsx("div",{ref:v,className:"bear-fixed bear-rounded-lg bear-border bear-shadow-lg bear-overflow-hidden",style:{backgroundColor:"var(--bear-bg-primary)",borderColor:"var(--bear-border-default)",top:u.top,left:u.left,width:u.width,zIndex:1e4},children:r.jsx("div",{className:"bear-max-h-60 bear-overflow-y-auto",children:x.map(e=>r.jsxs("button",{type:"button",disabled:e.disabled,onClick:()=>!e.disabled&&q(e.value),className:o.cn("bear-flex bear-items-center bear-justify-between bear-w-full bear-px-4 bear-py-2","bear-text-left bear-transition-colors",e.disabled&&"bear-cursor-not-allowed",e.value===s&&"bear-bg-bear-100 bear-text-bear-700 dark:bear-bg-bear-600/20 dark:bear-text-bear-300",!e.disabled&&e.value!==s&&"hover:bear-bg-[var(--bear-bg-tertiary)]"),style:e.disabled?{color:"var(--bear-text-muted)"}:e.value===s?void 0:{color:"var(--bear-text-secondary)"},children:[e.label,e.value===s&&r.jsx(g.CheckIcon,{className:"bear-w-4 bear-h-4 bear-shrink-0 bear-text-bear-600 dark:bear-text-bear-400"})]},e.value))})})}),d&&r.jsx("p",{className:"bear-text-sm bear-text-red-500",children:d})]})};exports.Select=P;

package/dist/components/Select/Select.js

@@ -1,106 +1,126 @@
-import { jsxs as n, jsx as r } from "react/jsx-runtime";
-import { useState as w, useRef as k, useCallback as N } from "react";
-import { cn as t } from "../../utils/cn.js";
-import { useClickOutside as C } from "../../hooks/useClickOutside.js";
+import { jsxs as u, jsx as r } from "react/jsx-runtime";
+import { useState as p, useRef as g, useCallback as I, useEffect as L } from "react";
+import { cn as o } from "../../utils/cn.js";
+import { useClickOutsideMultiple as M } from "../../hooks/useClickOutside.js";
 import "../../context/BearProvider.js";
 import "../../hooks/useBearComponent/useBearComponent.js";
-import { ChevronDownIcon as j, CheckIcon as S } from "../Icon/index.js";
-const I = {
+import { ChevronDownIcon as P, CheckIcon as R } from "../Icon/index.js";
+import { Portal as S } from "../Portal/Portal.js";
+const B = {
   sm: "bear-h-8 bear-text-sm bear-px-3",
   md: "bear-h-10 bear-text-base bear-px-4",
   lg: "bear-h-12 bear-text-lg bear-px-5"
-}, A = ({
-  options: i,
-  value: a,
-  onChange: l,
-  placeholder: x = "Select an option",
-  label: f,
-  error: s,
-  disabled: o = !1,
-  size: v = "md",
-  fullWidth: h = !1,
-  className: y
+}, J = ({
+  options: m,
+  value: t,
+  onChange: s,
+  placeholder: y = "Select an option",
+  label: x,
+  error: n,
+  disabled: d = !1,
+  size: k = "md",
+  fullWidth: N = !1,
+  className: C
 }) => {
-  const [d, c] = w(!1), u = k(null), m = !!s, b = i.find((e) => e.value === a), g = N(() => c(!1), []);
-  C(u, g);
-  const p = (e) => {
-    l == null || l(e), c(!1);
+  const [a, i] = p(!1), [c, E] = p({ top: 0, left: 0, width: 0 }), f = g(null), v = g(null), w = !!n, l = m.find((e) => e.value === t), j = I(() => i(!1), []);
+  M([f, v], j, { enabled: a });
+  const z = (e) => {
+    s == null || s(e), i(!1);
   };
-  return /* @__PURE__ */ n(
+  return L(() => {
+    if (!a) return;
+    const e = () => {
+      var h;
+      const b = (h = f.current) == null ? void 0 : h.getBoundingClientRect();
+      b && E({
+        top: b.bottom + 4,
+        left: Math.max(8, Math.min(b.left, window.innerWidth - b.width - 8)),
+        width: b.width
+      });
+    };
+    return e(), window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), () => {
+      window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
+    };
+  }, [a]), /* @__PURE__ */ u(
     "div",
     {
-      ref: u,
-      className: t("bear-relative bear-flex bear-flex-col bear-gap-1.5", h && "bear-w-full"),
+      ref: f,
+      className: o("bear-relative bear-flex bear-flex-col bear-gap-1.5", N && "bear-w-full"),
       children: [
-        f && /* @__PURE__ */ r("label", { className: "bear-text-sm bear-font-medium", style: { color: "var(--bear-text-secondary)" }, children: f }),
-        /* @__PURE__ */ n(
+        x && /* @__PURE__ */ r("label", { className: "bear-text-sm bear-font-medium", style: { color: "var(--bear-text-secondary)" }, children: x }),
+        /* @__PURE__ */ u(
           "button",
           {
             type: "button",
-            disabled: o,
-            onClick: () => !o && c(!d),
-            className: t(
+            disabled: d,
+            onClick: () => !d && i(!a),
+            className: o(
               "bear-flex bear-items-center bear-justify-between bear-w-full",
               "bear-rounded-lg bear-border bear-text-left bear-outline-none bear-transition-all bear-duration-200",
               "focus:bear-ring-2 focus:bear-ring-offset-2 focus:bear-ring-offset-[var(--bear-bg-primary)]",
-              m ? "bear-border-red-500 focus:bear-ring-red-500" : "focus:bear-border-bear-500 focus:bear-ring-bear-500 dark:focus:bear-border-bear-500 dark:focus:bear-ring-bear-500",
-              o && "bear-opacity-50 bear-cursor-not-allowed",
-              I[v],
-              y
+              w ? "bear-border-red-500 focus:bear-ring-red-500" : "focus:bear-border-bear-500 focus:bear-ring-bear-500 dark:focus:bear-border-bear-500 dark:focus:bear-ring-bear-500",
+              d && "bear-opacity-50 bear-cursor-not-allowed",
+              B[k],
+              C
             ),
             style: {
               backgroundColor: "var(--bear-bg-primary)",
-              borderColor: m ? void 0 : "var(--bear-border-default)",
-              color: b ? "var(--bear-text-primary)" : "var(--bear-text-muted)"
+              borderColor: w ? void 0 : "var(--bear-border-default)",
+              color: l ? "var(--bear-text-primary)" : "var(--bear-text-muted)"
             },
             children: [
-              /* @__PURE__ */ r("span", { children: (b == null ? void 0 : b.label) || x }),
+              /* @__PURE__ */ r("span", { children: (l == null ? void 0 : l.label) || y }),
               /* @__PURE__ */ r(
-                j,
+                P,
                 {
-                  className: t("bear-w-4 bear-h-4 bear-shrink-0 bear-transition-transform", d && "bear-rotate-180"),
+                  className: o("bear-w-4 bear-h-4 bear-shrink-0 bear-transition-transform", a && "bear-rotate-180"),
                   style: { color: "var(--bear-text-muted)" }
                 }
               )
             ]
           }
         ),
-        d && /* @__PURE__ */ r(
+        a && /* @__PURE__ */ r(S, { children: /* @__PURE__ */ r(
           "div",
           {
-            className: "bear-absolute bear-z-50 bear-w-full bear-mt-1 bear-rounded-lg bear-border bear-shadow-lg bear-overflow-hidden bear-top-full",
+            ref: v,
+            className: "bear-fixed bear-rounded-lg bear-border bear-shadow-lg bear-overflow-hidden",
             style: {
               backgroundColor: "var(--bear-bg-primary)",
-              borderColor: "var(--bear-border-default)"
+              borderColor: "var(--bear-border-default)",
+              top: c.top,
+              left: c.left,
+              width: c.width,
+              zIndex: 1e4
             },
-            children: /* @__PURE__ */ r("div", { className: "bear-max-h-60 bear-overflow-y-auto", children: i.map((e) => /* @__PURE__ */ n(
+            children: /* @__PURE__ */ r("div", { className: "bear-max-h-60 bear-overflow-y-auto", children: m.map((e) => /* @__PURE__ */ u(
               "button",
               {
                 type: "button",
                 disabled: e.disabled,
-                onClick: () => !e.disabled && p(e.value),
-                className: t(
+                onClick: () => !e.disabled && z(e.value),
+                className: o(
                   "bear-flex bear-items-center bear-justify-between bear-w-full bear-px-4 bear-py-2",
                   "bear-text-left bear-transition-colors",
                   e.disabled && "bear-cursor-not-allowed",
-                  e.value === a && "bear-bg-bear-100 bear-text-bear-700 dark:bear-bg-bear-600/20 dark:bear-text-bear-300",
-                  !e.disabled && e.value !== a && "hover:bear-bg-[var(--bear-bg-tertiary)]"
+                  e.value === t && "bear-bg-bear-100 bear-text-bear-700 dark:bear-bg-bear-600/20 dark:bear-text-bear-300",
+                  !e.disabled && e.value !== t && "hover:bear-bg-[var(--bear-bg-tertiary)]"
                 ),
-                style: e.disabled ? { color: "var(--bear-text-muted)" } : e.value === a ? void 0 : { color: "var(--bear-text-secondary)" },
+                style: e.disabled ? { color: "var(--bear-text-muted)" } : e.value === t ? void 0 : { color: "var(--bear-text-secondary)" },
                 children: [
                   e.label,
-                  e.value === a && /* @__PURE__ */ r(S, { className: "bear-w-4 bear-h-4 bear-shrink-0 bear-text-bear-600 dark:bear-text-bear-400" })
+                  e.value === t && /* @__PURE__ */ r(R, { className: "bear-w-4 bear-h-4 bear-shrink-0 bear-text-bear-600 dark:bear-text-bear-400" })
                 ]
               },
               e.value
             )) })
           }
-        ),
-        s && /* @__PURE__ */ r("p", { className: "bear-text-sm bear-text-red-500", children: s })
+        ) }),
+        n && /* @__PURE__ */ r("p", { className: "bear-text-sm bear-text-red-500", children: n })
       ]
     }
   );
 };
 export {
-  A as Select
+  J as Select
 };

package/dist/components/Stepper/Stepper.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),P=require("react"),t=require("../../utils/cn.cjs"),r=require("./Stepper.const.cjs"),p=require("../Button/Button.cjs"),y=()=>e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"3",children:e.jsx("polyline",{points:"20 6 9 17 4 12"})}),k=()=>e.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"3",children:[e.jsx("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),e.jsx("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]}),v=P.forwardRef(({steps:l,activeStep:c,onStepClick:a,orientation:m="horizontal",size:d="md",showNumbers:h=!0,clickable:S=!1,showConnectors:x=!0,connectorStyle:_="solid",alternativeLabel:E=!1,completedIcon:N,errorIcon:f,testId:j,className:A,...I},L)=>{const g=(s,n)=>n.status?n.status:s<c?"completed":s===c?"active":"pending",C=m==="horizontal",B=r.STEP_INDICATOR_SIZES[d],u=r.STEP_LABEL_SIZES[d],R=(s,n,i)=>{const T=r.STEP_STATUS_CLASSES[i];let o=null;return s.icon?o=s.icon:i==="completed"?o=N||e.jsx(y,{}):i==="error"?o=f||e.jsx(k,{}):h&&(o=n+1),e.jsx("div",{className:t.cn(r.STEP_INDICATOR_BASE,B,T.indicator,S&&!s.disabled&&"cursor-pointer hover:scale-105"),onClick:()=>{S&&!s.disabled&&a&&a(n)},children:o})},b=s=>{if(!x||s===l.length-1)return null;const n=s<c;return e.jsx("div",{className:t.cn(r.CONNECTOR_BASE,C?r.CONNECTOR_HORIZONTAL:r.CONNECTOR_VERTICAL,n?r.CONNECTOR_STATUS.completed:r.CONNECTOR_STATUS.pending,_==="dashed"&&"border-t-2 border-dashed bg-transparent")})};return e.jsx("div",{ref:L,className:t.cn(r.STEPPER_BASE_CLASSES,C?r.STEPPER_HORIZONTAL_CLASSES:r.STEPPER_VERTICAL_CLASSES,A),"data-testid":j,...I,children:l.map((s,n)=>{const i=g(n,s),T=r.STEP_STATUS_CLASSES[i];return e.jsxs("div",{className:t.cn("Bear-Stepper__step",C?r.STEP_WRAPPER_HORIZONTAL:r.STEP_WRAPPER_VERTICAL),children:[C?e.jsxs("div",{className:t.cn("flex",E?"flex-col items-center":"items-center gap-3"),children:[R(s,n,i),e.jsxs("div",{className:t.cn(E&&"text-center mt-2"),children:[e.jsx("div",{className:t.cn(r.STEP_LABEL_BASE,u.label,T.label),children:s.label}),s.description&&e.jsx("div",{className:t.cn(r.STEP_DESCRIPTION_CLASSES,u.description),children:s.description})]})]}):e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"flex-shrink-0 mr-4",children:R(s,n,i)}),e.jsxs("div",{className:"flex-1 pt-0.5",children:[e.jsx("div",{className:t.cn(r.STEP_LABEL_BASE,u.label,T.label),children:s.label}),s.description&&e.jsx("div",{className:t.cn(r.STEP_DESCRIPTION_CLASSES,u.description),children:s.description}),s.content&&i==="active"&&e.jsx("div",{className:"mt-4",children:s.content})]})]}),b(n)]},n)})})});v.displayName="Stepper";const O=P.forwardRef(({activeStep:l,totalSteps:c,onPrev:a,onNext:m,onComplete:d,disablePrev:h=!1,disableNext:S=!1,prevLabel:x="Previous",nextLabel:_="Next",completeLabel:E="Complete",showIndicator:N=!0},f)=>{const j=l===0,A=l===c-1;return e.jsxs("div",{ref:f,className:"Bear-StepperControls flex items-center justify-between mt-6",children:[e.jsx(p.Button,{variant:"outline",onClick:a,disabled:j||h,children:x}),N&&e.jsxs("span",{className:"text-sm text-gray-500 dark:text-gray-400",children:["Step ",l+1," of ",c]}),A?e.jsx(p.Button,{variant:"primary",onClick:d,children:E}):e.jsx(p.Button,{variant:"primary",onClick:m,disabled:S,children:_})]})});O.displayName="StepperControls";exports.Stepper=v;exports.StepperControls=O;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),m=require("react"),J=require("../../context/BearProvider.cjs"),K=require("../../utils/maxVisible.utils.cjs"),o=require("../../utils/cn.cjs"),s=require("./Stepper.const.cjs"),I=require("../Button/Button.cjs"),Q=require("../Dropdown/Dropdown.cjs"),X=require("../Icon/index.cjs"),Y=()=>r.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"3",children:r.jsx("polyline",{points:"20 6 9 17 4 12"})}),ee=()=>r.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"3",children:[r.jsx("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),r.jsx("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]}),Z=m.forwardRef(({steps:i,activeStep:d,onStepClick:S,orientation:C="horizontal",size:f="md",showNumbers:p=!0,clickable:x=!1,showConnectors:A=!0,connectorStyle:j="solid",alternativeLabel:u=!1,completedIcon:v,errorIcon:P,maxVisibleSteps:E,testId:g,className:U,...V},F)=>{const O=J.useBearThemeOptional(),[w,$]=m.useState(()=>typeof window<"u"?window.innerWidth:1200);m.useEffect(()=>{const e=()=>$(window.innerWidth);return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[]);const _=m.useMemo(()=>E==null?void 0:K.resolveMaxVisible(E,{width:w,theme:O}),[E,w,O]),B=(e,n)=>n.status?n.status:e<d?"completed":e===d?"active":"pending",h=C==="horizontal",L=s.STEP_INDICATOR_SIZES[f],N=s.STEP_LABEL_SIZES[f],T=h&&_!=null&&i.length>_,{visibleIndices:y,leftHidden:H,rightHidden:W}=m.useMemo(()=>{if(!T||_==null)return{visibleIndices:i.map((a,b)=>b),leftHidden:[],rightHidden:[]};const e=_,n=Math.max(0,Math.min(d-Math.floor(e/2),i.length-e)),t=Array.from({length:e},(a,b)=>n+b),l=[],c=[];for(let a=0;a<n;a++)l.push(a);for(let a=n+e;a<i.length;a++)c.push(a);return{visibleIndices:t,leftHidden:l,rightHidden:c}},[T,_,i.length,d]),z=T?s.STEP_WRAPPER_HORIZONTAL_WINDOW:s.STEP_WRAPPER_HORIZONTAL,q=(e,n,t)=>{const l=s.STEP_STATUS_CLASSES[t];let c=null;return e.icon?c=e.icon:t==="completed"?c=v||r.jsx(Y,{}):t==="error"?c=P||r.jsx(ee,{}):p&&(c=n+1),r.jsx("div",{className:o.cn(s.STEP_INDICATOR_BASE,L,l.indicator,x&&!e.disabled&&"cursor-pointer hover:scale-105"),onClick:()=>{x&&!e.disabled&&S&&S(n)},children:c})},R=e=>{if(!A||e===i.length-1)return null;const n=e<d;return r.jsx("div",{className:o.cn(s.CONNECTOR_BASE,h?s.CONNECTOR_HORIZONTAL:s.CONNECTOR_VERTICAL,n?s.CONNECTOR_STATUS.completed:s.CONNECTOR_STATUS.pending,j==="dashed"&&"border-t-2 border-dashed bg-transparent")})},M=(e,n)=>{const t=B(n,e),l=s.STEP_STATUS_CLASSES[t];return r.jsxs("div",{className:o.cn("flex",u?"flex-col items-center":"items-center gap-3"),children:[q(e,n,t),r.jsxs("div",{className:o.cn(u&&"text-center mt-2"),children:[r.jsx("div",{className:o.cn(s.STEP_LABEL_BASE,N.label,l.label),children:e.label}),e.description&&r.jsx("div",{className:o.cn(s.STEP_DESCRIPTION_CLASSES,N.description),children:e.description})]})]})},G=(e,n)=>{const t=B(n,e),l=s.STEP_STATUS_CLASSES[t];return r.jsxs(r.Fragment,{children:[r.jsx("div",{className:"flex-shrink-0 mr-4",children:q(e,n,t)}),r.jsxs("div",{className:"flex-1 pt-0.5",children:[r.jsx("div",{className:o.cn(s.STEP_LABEL_BASE,N.label,l.label),children:e.label}),e.description&&r.jsx("div",{className:o.cn(s.STEP_DESCRIPTION_CLASSES,N.description),children:e.description}),e.content&&t==="active"&&r.jsx("div",{className:"mt-4",children:e.content})]})]})},D=(e,n)=>r.jsx("div",{className:o.cn("Bear-Stepper__step","Bear-Stepper__overflow",z),children:r.jsxs("div",{className:o.cn("flex",u?"flex-col items-center":"items-center gap-3"),children:[r.jsx(Q.Dropdown,{placement:"bottom-start",closeOnSelect:!0,trigger:r.jsx("button",{type:"button",className:o.cn(s.STEP_INDICATOR_BASE,L,s.STEP_STATUS_CLASSES.pending.indicator,"bear-cursor-pointer bear-border-0"),"aria-label":n==="left"?"Previous steps":"More steps",children:r.jsx(X.BearIcons.MoreHorizIcon,{size:16})}),items:e.map(t=>({key:`step-${t}`,label:i[t].label,disabled:i[t].disabled,onClick:()=>{i[t].disabled||S==null||S(t)}}))}),u&&r.jsx("div",{className:"text-center mt-2 bear-text-xs bear-text-gray-400",children:" "})]})},`overflow-${n}`);return r.jsxs("div",{ref:F,className:o.cn(s.STEPPER_BASE_CLASSES,h?s.STEPPER_HORIZONTAL_CLASSES:s.STEPPER_VERTICAL_CLASSES,U),"data-testid":g,...V,children:[h&&!T&&i.map((e,n)=>r.jsxs("div",{className:o.cn("Bear-Stepper__step",s.STEP_WRAPPER_HORIZONTAL),children:[M(e,n),R(n)]},n)),h&&T&&r.jsxs(r.Fragment,{children:[H.length>0&&D(H,"left"),y.map((e,n)=>{const t=i[e],l=y[n+1],c=l!=null&&l===e+1;return r.jsxs("div",{className:o.cn("Bear-Stepper__step",z),children:[M(t,e),c&&R(e)]},e)}),W.length>0&&D(W,"right")]}),!h&&i.map((e,n)=>r.jsxs("div",{className:o.cn("Bear-Stepper__step",s.STEP_WRAPPER_VERTICAL),children:[G(e,n),R(n)]},n))]})});Z.displayName="Stepper";const k=m.forwardRef(({activeStep:i,totalSteps:d,onPrev:S,onNext:C,onComplete:f,disablePrev:p=!1,disableNext:x=!1,prevLabel:A="Previous",nextLabel:j="Next",completeLabel:u="Complete",showIndicator:v=!0},P)=>{const E=i===0,g=i===d-1;return r.jsxs("div",{ref:P,className:"Bear-StepperControls flex items-center justify-between mt-6",children:[r.jsx(I.Button,{variant:"outline",onClick:S,disabled:E||p,children:A}),v&&r.jsxs("span",{className:"text-sm text-gray-500 dark:text-gray-400",children:["Step ",i+1," of ",d]}),g?r.jsx(I.Button,{variant:"primary",onClick:f,children:u}):r.jsx(I.Button,{variant:"primary",onClick:C,disabled:x,children:j})]})});k.displayName="StepperControls";exports.Stepper=Z;exports.StepperControls=k;

package/dist/components/Stepper/Stepper.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t="Bear-Stepper",e="flex items-start",S="flex flex-col",E="flex-1 relative",r="relative flex items-start pb-8 last:pb-0",_="Bear-Stepper__indicator flex items-center justify-center rounded-full font-medium transition-all",a={sm:"w-6 h-6 text-xs",md:"w-8 h-8 text-sm",lg:"w-10 h-10 text-base"},T={pending:{indicator:"bg-gray-200 dark:bg-zinc-700 text-gray-500 dark:text-gray-400",label:"text-gray-500 dark:text-gray-400"},active:{indicator:"bg-pink-500 text-white shadow-lg shadow-pink-500/30",label:"text-gray-900 dark:text-white font-medium"},completed:{indicator:"bg-green-500 text-white",label:"text-gray-700 dark:text-gray-300"},error:{indicator:"bg-red-500 text-white",label:"text-red-500 dark:text-red-400"}},n="Bear-Stepper__connector absolute transition-colors",o="top-4 left-1/2 right-0 h-0.5 -translate-y-1/2",l="left-4 top-8 w-0.5 h-full -translate-x-1/2",s={pending:"bg-gray-200 dark:bg-zinc-700",completed:"bg-green-500"},A="Bear-Stepper__label transition-colors",i={sm:{label:"text-xs",description:"text-[10px]"},md:{label:"text-sm",description:"text-xs"},lg:{label:"text-base",description:"text-sm"}},R="text-gray-500 dark:text-gray-400 mt-0.5";exports.CONNECTOR_BASE=n;exports.CONNECTOR_HORIZONTAL=o;exports.CONNECTOR_STATUS=s;exports.CONNECTOR_VERTICAL=l;exports.STEPPER_BASE_CLASSES=t;exports.STEPPER_HORIZONTAL_CLASSES=e;exports.STEPPER_VERTICAL_CLASSES=S;exports.STEP_DESCRIPTION_CLASSES=R;exports.STEP_INDICATOR_BASE=_;exports.STEP_INDICATOR_SIZES=a;exports.STEP_LABEL_BASE=A;exports.STEP_LABEL_SIZES=i;exports.STEP_STATUS_CLASSES=T;exports.STEP_WRAPPER_HORIZONTAL=E;exports.STEP_WRAPPER_VERTICAL=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t="Bear-Stepper",e="flex w-full min-w-0 items-start overflow-x-auto pb-1 flex-nowrap",S="flex flex-col",E="relative min-w-[7rem] shrink-0 flex-1",r="relative min-w-[5rem] max-w-[9rem] shrink-0",_="relative flex items-start pb-8 last:pb-0",a="Bear-Stepper__indicator flex items-center justify-center rounded-full font-medium transition-all",T={sm:"w-6 h-6 text-xs",md:"w-8 h-8 text-sm",lg:"w-10 h-10 text-base"},n={pending:{indicator:"bg-gray-200 dark:bg-zinc-700 text-gray-500 dark:text-gray-400",label:"text-gray-500 dark:text-gray-400"},active:{indicator:"bg-pink-500 text-white shadow-lg shadow-pink-500/30",label:"text-gray-900 dark:text-white font-medium"},completed:{indicator:"bg-green-500 text-white",label:"text-gray-700 dark:text-gray-300"},error:{indicator:"bg-red-500 text-white",label:"text-red-500 dark:text-red-400"}},o="Bear-Stepper__connector absolute transition-colors",l="top-4 left-1/2 right-0 h-0.5 -translate-y-1/2",i="left-4 top-8 w-0.5 h-full -translate-x-1/2",s={pending:"bg-gray-200 dark:bg-zinc-700",completed:"bg-green-500"},A="Bear-Stepper__label transition-colors",R={sm:{label:"text-xs",description:"text-[10px]"},md:{label:"text-sm",description:"text-xs"},lg:{label:"text-base",description:"text-sm"}},P="text-gray-500 dark:text-gray-400 mt-0.5";exports.CONNECTOR_BASE=o;exports.CONNECTOR_HORIZONTAL=l;exports.CONNECTOR_STATUS=s;exports.CONNECTOR_VERTICAL=i;exports.STEPPER_BASE_CLASSES=t;exports.STEPPER_HORIZONTAL_CLASSES=e;exports.STEPPER_VERTICAL_CLASSES=S;exports.STEP_DESCRIPTION_CLASSES=P;exports.STEP_INDICATOR_BASE=a;exports.STEP_INDICATOR_SIZES=T;exports.STEP_LABEL_BASE=A;exports.STEP_LABEL_SIZES=R;exports.STEP_STATUS_CLASSES=n;exports.STEP_WRAPPER_HORIZONTAL=E;exports.STEP_WRAPPER_HORIZONTAL_WINDOW=r;exports.STEP_WRAPPER_VERTICAL=_;

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

@@ -1,8 +1,9 @@
 import { StepperSize, StepStatus } from './Stepper.types';
 export declare const STEPPER_BASE_CLASSES = "Bear-Stepper";
-export declare const STEPPER_HORIZONTAL_CLASSES = "flex items-start";
+export declare const STEPPER_HORIZONTAL_CLASSES = "flex w-full min-w-0 items-start overflow-x-auto pb-1 flex-nowrap";
 export declare const STEPPER_VERTICAL_CLASSES = "flex flex-col";
-export declare const STEP_WRAPPER_HORIZONTAL = "flex-1 relative";
+export declare const STEP_WRAPPER_HORIZONTAL = "relative min-w-[7rem] shrink-0 flex-1";
+export declare const STEP_WRAPPER_HORIZONTAL_WINDOW = "relative min-w-[5rem] max-w-[9rem] shrink-0";
 export declare const STEP_WRAPPER_VERTICAL = "relative flex items-start pb-8 last:pb-0";
 export declare const STEP_INDICATOR_BASE = "Bear-Stepper__indicator flex items-center justify-center rounded-full font-medium transition-all";
 export declare const STEP_INDICATOR_SIZES: Record<StepperSize, string>;

package/dist/components/Stepper/Stepper.const.js

@@ -1,8 +1,8 @@
-const t = "Bear-Stepper", e = "flex items-start", r = "flex flex-col", a = "flex-1 relative", n = "relative flex items-start pb-8 last:pb-0", o = "Bear-Stepper__indicator flex items-center justify-center rounded-full font-medium transition-all", s = {
+const t = "Bear-Stepper", e = "flex w-full min-w-0 items-start overflow-x-auto pb-1 flex-nowrap", r = "flex flex-col", a = "relative min-w-[7rem] shrink-0 flex-1", n = "relative min-w-[5rem] max-w-[9rem] shrink-0", o = "relative flex items-start pb-8 last:pb-0", l = "Bear-Stepper__indicator flex items-center justify-center rounded-full font-medium transition-all", i = {
   sm: "w-6 h-6 text-xs",
   md: "w-8 h-8 text-sm",
   lg: "w-10 h-10 text-base"
-}, l = {
+}, s = {
   pending: {
     indicator: "bg-gray-200 dark:bg-zinc-700 text-gray-500 dark:text-gray-400",
     label: "text-gray-500 dark:text-gray-400"
@@ -19,28 +19,29 @@ const t = "Bear-Stepper", e = "flex items-start", r = "flex flex-col", a = "flex
     indicator: "bg-red-500 text-white",
     label: "text-red-500 dark:text-red-400"
   }
-}, S = "Bear-Stepper__connector absolute transition-colors", i = "top-4 left-1/2 right-0 h-0.5 -translate-y-1/2", E = "left-4 top-8 w-0.5 h-full -translate-x-1/2", x = {
+}, S = "Bear-Stepper__connector absolute transition-colors", x = "top-4 left-1/2 right-0 h-0.5 -translate-y-1/2", E = "left-4 top-8 w-0.5 h-full -translate-x-1/2", c = {
   pending: "bg-gray-200 dark:bg-zinc-700",
   completed: "bg-green-500"
-}, c = "Bear-Stepper__label transition-colors", _ = {
+}, _ = "Bear-Stepper__label transition-colors", d = {
   sm: { label: "text-xs", description: "text-[10px]" },
   md: { label: "text-sm", description: "text-xs" },
   lg: { label: "text-base", description: "text-sm" }
-}, d = "text-gray-500 dark:text-gray-400 mt-0.5";
+}, T = "text-gray-500 dark:text-gray-400 mt-0.5";
 export {
   S as CONNECTOR_BASE,
-  i as CONNECTOR_HORIZONTAL,
-  x as CONNECTOR_STATUS,
+  x as CONNECTOR_HORIZONTAL,
+  c as CONNECTOR_STATUS,
   E as CONNECTOR_VERTICAL,
   t as STEPPER_BASE_CLASSES,
   e as STEPPER_HORIZONTAL_CLASSES,
   r as STEPPER_VERTICAL_CLASSES,
-  d as STEP_DESCRIPTION_CLASSES,
-  o as STEP_INDICATOR_BASE,
-  s as STEP_INDICATOR_SIZES,
-  c as STEP_LABEL_BASE,
-  _ as STEP_LABEL_SIZES,
-  l as STEP_STATUS_CLASSES,
+  T as STEP_DESCRIPTION_CLASSES,
+  l as STEP_INDICATOR_BASE,
+  i as STEP_INDICATOR_SIZES,
+  _ as STEP_LABEL_BASE,
+  d as STEP_LABEL_SIZES,
+  s as STEP_STATUS_CLASSES,
   a as STEP_WRAPPER_HORIZONTAL,
-  n as STEP_WRAPPER_VERTICAL
+  n as STEP_WRAPPER_HORIZONTAL_WINDOW,
+  o as STEP_WRAPPER_VERTICAL
 };

package/dist/components/Stepper/Stepper.d.ts

@@ -1,10 +1,3 @@
 import { StepperProps, StepperControlsProps } from './Stepper.types';
-/**
- * Stepper - Multi-step wizard component
- */
 export declare const Stepper: import('react').ForwardRefExoticComponent<StepperProps & import('react').RefAttributes<HTMLDivElement>>;
-/**
- * StepperControls - Navigation buttons for stepper
- */
 export declare const StepperControls: import('react').ForwardRefExoticComponent<StepperControlsProps & import('react').RefAttributes<HTMLDivElement>>;
-export default Stepper;