@forgedevstack/bear 1.3.1 → 1.3.3

package/dist/components/Sidebar/components/SidebarItem/SidebarItem.js

@@ -1,67 +1,71 @@
-import { jsxs as n, Fragment as d, jsx as a } from "react/jsx-runtime";
-import { useState as C, useCallback as D } from "react";
-import { cn as o } from "../../../../utils/cn.js";
-import { ChevronDownIcon as N } from "../../../Icon/index.js";
-import { SIDEBAR_ICON_SIZE as v, SIDEBAR_ITEM_DISABLED_CLASSES as u, SIDEBAR_ITEM_ACTIVE_BY_VARIANT as T, SIDEBAR_ITEM_INACTIVE_CLASSES as R, SIDEBAR_ITEM_BASE_CLASSES as g, SIDEBAR_PADDING_BASE as m, SIDEBAR_DEPTH_INDENT as k } from "../../Sidebar.const.js";
-const x = (_) => {
+import { jsxs as l, jsx as r } from "react/jsx-runtime";
+import { useState as N } from "react";
+import { cn as b } from "../../../../utils/cn.js";
+import { ChevronDownIcon as D } from "@forgedevstack/bear-icons";
+import { SIDEBAR_ITEM_DISABLED_CLASSES as v, SIDEBAR_ITEM_ACTIVE_BY_VARIANT as T, SIDEBAR_ITEM_INACTIVE_CLASSES as u, SIDEBAR_ITEM_BASE_CLASSES as R, SIDEBAR_PADDING_BASE as _, SIDEBAR_ICON_SIZE as x, SIDEBAR_DEPTH_INDENT as w } from "../../Sidebar.const.js";
+import { sidebarItemContainsId as g } from "../../Sidebar.utils.js";
+const L = (S) => {
   const {
     item: e,
-    isActive: b,
-    collapsed: r,
-    depth: l = 0,
-    onClick: i,
-    activeVariant: S = "fill"
-  } = _, [c, h] = C(!1), t = e.children && e.children.length > 0, E = r ? m : m + l * k, I = D(() => {
-    t && h((s) => !s), e.onClick && e.onClick(), i == null || i(e);
-  }, [t, e, i]), B = /* @__PURE__ */ n(d, { children: [
-    e.icon && /* @__PURE__ */ a("span", { className: "Bear-Sidebar__item-icon bear-shrink-0 bear-w-5 bear-h-5 bear-flex bear-items-center bear-justify-center", children: e.icon }),
-    !r && /* @__PURE__ */ n(d, { children: [
-      /* @__PURE__ */ a("span", { className: "Bear-Sidebar__item-label bear-flex-1 bear-truncate", children: e.label }),
-      e.badge && /* @__PURE__ */ a("span", { className: "Bear-Sidebar__item-badge bear-ml-auto", children: e.badge }),
-      t && /* @__PURE__ */ a(
-        N,
-        {
-          size: v,
-          className: o(
-            "Bear-Sidebar__item-chevron bear-ml-1 bear-transition-transform bear-duration-200",
-            c && "bear-rotate-180"
-          )
-        }
-      )
-    ] })
-  ] }), A = T[S], f = o(
+    isActive: I,
+    collapsed: a,
+    depth: c = 0,
+    onClick: t,
+    activeVariant: d = "fill",
+    activeItemId: s
+  } = S, m = e.children ?? [], n = m.length > 0, [o, h] = N(() => g(e, s)), E = a ? _ : _ + c * w, B = () => {
+    n && h((i) => !i), e.onClick && e.onClick(), t == null || t(e);
+  }, p = n && o && !a, f = T[d], A = b(
     "Bear-Sidebar__item",
-    g,
-    b ? `Bear-Sidebar__item--active ${A}` : R,
-    e.disabled && `Bear-Sidebar__item--disabled ${u}`,
-    r && "Bear-Sidebar__item--collapsed bear-justify-center"
-  ), p = e.href ? "a" : "button";
-  return /* @__PURE__ */ n("div", { className: "Bear-Sidebar__item-wrapper", children: [
-    /* @__PURE__ */ a(
-      p,
+    R,
+    I ? `Bear-Sidebar__item--active ${f}` : u,
+    e.disabled && `Bear-Sidebar__item--disabled ${v}`,
+    a && "Bear-Sidebar__item--collapsed bear-justify-center"
+  ), C = e.href ? "a" : "button";
+  return /* @__PURE__ */ l("div", { className: "Bear-Sidebar__item-wrapper", children: [
+    /* @__PURE__ */ l(
+      C,
       {
         href: e.href,
-        onClick: I,
+        onClick: B,
         disabled: e.disabled,
-        className: f,
+        className: A,
         style: { paddingLeft: E },
-        title: r ? e.label : void 0,
-        children: B
+        title: a ? e.label : void 0,
+        children: [
+          e.icon && /* @__PURE__ */ r("span", { className: "Bear-Sidebar__item-icon bear-shrink-0 bear-w-5 bear-h-5 bear-flex bear-items-center bear-justify-center", children: e.icon }),
+          !a && /* @__PURE__ */ l("span", { className: "Bear-Sidebar__item-row bear-flex bear-items-center bear-flex-1 bear-min-w-0", children: [
+            /* @__PURE__ */ r("span", { className: "Bear-Sidebar__item-label bear-flex-1 bear-truncate", children: e.label }),
+            e.badge && /* @__PURE__ */ r("span", { className: "Bear-Sidebar__item-badge bear-ml-auto", children: e.badge }),
+            n && /* @__PURE__ */ r(
+              D,
+              {
+                size: x,
+                className: b(
+                  "Bear-Sidebar__item-chevron bear-ml-1 bear-transition-transform bear-duration-200",
+                  o && "bear-rotate-180"
+                )
+              }
+            )
+          ] })
+        ]
       }
     ),
-    t && c && !r && /* @__PURE__ */ a("div", { className: "Bear-Sidebar__children bear-mt-1", children: e.children.map((s) => /* @__PURE__ */ a(
-      x,
+    p && /* @__PURE__ */ r("div", { className: "Bear-Sidebar__children bear-mt-1", children: m.map((i) => /* @__PURE__ */ r(
+      L,
       {
-        item: s,
-        isActive: !1,
-        collapsed: r,
-        depth: l + 1,
-        onClick: i
+        item: i,
+        isActive: i.id === s,
+        collapsed: a,
+        depth: c + 1,
+        onClick: t,
+        activeVariant: d,
+        activeItemId: s
       },
-      s.id
+      i.id
     )) })
   ] });
 };
 export {
-  x as SidebarItem
+  L as SidebarItem
 };

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

@@ -1,5 +1,6 @@
 export { Sidebar, default } from './Sidebar';
 export { SidebarGroup } from './components/SidebarGroup';
 export { SidebarItem } from './components/SidebarItem';
+export { sidebarItemContainsId } from './Sidebar.utils';
 export * from './Sidebar.types';
 export * from './Sidebar.const';

package/dist/components/Skeleton/Skeleton.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),S=require("react"),_=require("../../utils/cn.cjs"),d=require("./Skeleton.const.cjs"),j=require("./Skeleton.utils.cjs"),a=S.forwardRef(({variant:e="text",animation:r="pulse",width:l,height:s,borderRadius:o,count:i=1,gap:u=8,className:n,style:f,testId:k,...N},m)=>{S.useEffect(()=>{r==="wave"&&j.injectStyles()},[r]);const x=c=>{if(c!==void 0)return typeof c=="number"?`${c}px`:c},p={width:x(l),height:x(s)||(e==="text"?d.SKELETON_TEXT_HEIGHT:void 0),borderRadius:o?x(o):void 0,...f},y=_.cn(d.SKELETON_BASE_CLASSES,d.SKELETON_VARIANT_CLASSES[e],d.SKELETON_ANIMATION_CLASSES[r],d.SKELETON_BG_CLASSES,n);return i>1?t.jsx("div",{className:"Bear-Skeleton__group flex flex-col",style:{gap:x(u)},"data-testid":k,children:Array.from({length:i}).map((c,g)=>t.jsx("div",{ref:g===0?m:void 0,className:y,style:p,...N},g))}):t.jsx("div",{ref:m,className:y,style:p,"data-testid":k,...N})});a.displayName="Skeleton";const E=S.forwardRef(({lines:e=3,lastLineWidth:r="80%",gap:l=8,animation:s="pulse",...o},i)=>{S.useEffect(()=>{s==="wave"&&j.injectStyles()},[s]);const u=n=>{if(n!==void 0)return typeof n=="number"?`${n}px`:n};return t.jsx("div",{ref:i,className:"Bear-SkeletonText flex flex-col",style:{gap:u(l)},children:Array.from({length:e}).map((n,f)=>t.jsx(a,{variant:"text",animation:s,width:f===e-1?r:"100%",...o},f))})});E.displayName="SkeletonText";const h=S.forwardRef(({size:e="md",animation:r="pulse",...l},s)=>{const o=typeof e=="number"?e:d.SKELETON_AVATAR_SIZES[e];return t.jsx(a,{ref:s,variant:"circular",animation:r,width:o,height:o,...l})});h.displayName="SkeletonAvatar";const A=S.forwardRef(({animation:e="pulse",className:r,...l},s)=>t.jsxs("div",{ref:s,className:_.cn("Bear-SkeletonCard p-4 rounded-lg border border-gray-200 dark:border-zinc-700 bg-white dark:bg-zinc-900",r),...l,children:[t.jsxs("div",{className:"flex items-center gap-3 mb-4",children:[t.jsx(h,{animation:e}),t.jsxs("div",{className:"flex-1",children:[t.jsx(a,{animation:e,width:"60%",height:16,className:"mb-2"}),t.jsx(a,{animation:e,width:"40%",height:12})]})]}),t.jsx(E,{animation:e,lines:3})]}));A.displayName="SkeletonCard";exports.Skeleton=a;exports.SkeletonAvatar=h;exports.SkeletonCard=A;exports.SkeletonText=E;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),d=require("react"),j=require("../../utils/cn.cjs"),S=require("./Skeleton.const.cjs"),A=require("./Skeleton.utils.cjs"),c=d.forwardRef(({variant:e="text",animation:r="pulse",width:l,height:s,borderRadius:o,count:i=1,gap:u=8,className:n,style:f,testId:p,...N},y)=>{d.useEffect(()=>{r==="wave"&&A.injectStyles()},[r]);const x=a=>{if(a!==void 0)return typeof a=="number"?`${a}px`:a},E={width:x(l),height:x(s)||(e==="text"?S.SKELETON_TEXT_HEIGHT:void 0),borderRadius:o?x(o):void 0,...f},g=j.cn(S.SKELETON_BASE_CLASSES,S.SKELETON_VARIANT_CLASSES[e],r==="pulse"&&"Bear-Skeleton--pulse",S.SKELETON_ANIMATION_CLASSES[r],n);return i>1?t.jsx("div",{className:"Bear-Skeleton__group flex flex-col",style:{gap:x(u)},"data-testid":p,children:Array.from({length:i}).map((a,m)=>t.jsx("div",{ref:m===0?y:void 0,className:g,style:E,...N},m))}):t.jsx("div",{ref:y,className:g,style:E,"data-testid":p,...N})});c.displayName="Skeleton";const k=d.forwardRef(({lines:e=3,lastLineWidth:r="80%",gap:l=8,animation:s="pulse",...o},i)=>{d.useEffect(()=>{s==="wave"&&A.injectStyles()},[s]);const u=n=>{if(n!==void 0)return typeof n=="number"?`${n}px`:n};return t.jsx("div",{ref:i,className:"Bear-SkeletonText flex flex-col",style:{gap:u(l)},children:Array.from({length:e}).map((n,f)=>t.jsx(c,{variant:"text",animation:s,width:f===e-1?r:"100%",...o},f))})});k.displayName="SkeletonText";const h=d.forwardRef(({size:e="md",animation:r="pulse",...l},s)=>{const o=typeof e=="number"?e:S.SKELETON_AVATAR_SIZES[e];return t.jsx(c,{ref:s,variant:"circular",animation:r,width:o,height:o,...l})});h.displayName="SkeletonAvatar";const T=d.forwardRef(({animation:e="pulse",className:r,...l},s)=>t.jsxs("div",{ref:s,className:j.cn("Bear-SkeletonCard p-4 rounded-lg border border-gray-200 dark:border-zinc-700 bg-white dark:bg-zinc-900",r),...l,children:[t.jsxs("div",{className:"flex items-center gap-3 mb-4",children:[t.jsx(h,{animation:e}),t.jsxs("div",{className:"flex-1",children:[t.jsx(c,{animation:e,width:"60%",height:16,className:"mb-2"}),t.jsx(c,{animation:e,width:"40%",height:12})]})]}),t.jsx(k,{animation:e,lines:3})]}));T.displayName="SkeletonCard";exports.Skeleton=c;exports.SkeletonAvatar=h;exports.SkeletonCard=T;exports.SkeletonText=k;

package/dist/components/Skeleton/Skeleton.const.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="Bear-Skeleton relative overflow-hidden",n={text:"rounded",circular:"rounded-full",rectangular:"rounded-none",rounded:"rounded-lg"},a={pulse:"animate-pulse",wave:"Bear-Skeleton--wave",none:""},r="bg-gray-200 dark:bg-zinc-700",S=`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="Bear-Skeleton relative overflow-hidden",n={text:"rounded",circular:"rounded-full",rectangular:"rounded-none",rounded:"rounded-lg"},a={pulse:"animate-pulse",wave:"Bear-Skeleton--wave",none:""},r=`
   @keyframes Bear-Skeleton-wave {
     0% {
       transform: translateX(-100%);
@@ -33,4 +33,4 @@
       transparent
     );
   }
-`,t="1em",E={sm:32,md:40,lg:56};exports.SKELETON_ANIMATION_CLASSES=a;exports.SKELETON_AVATAR_SIZES=E;exports.SKELETON_BASE_CLASSES=e;exports.SKELETON_BG_CLASSES=r;exports.SKELETON_TEXT_HEIGHT=t;exports.SKELETON_VARIANT_CLASSES=n;exports.SKELETON_WAVE_STYLES=S;
+`,t="1em",S={sm:32,md:40,lg:56};exports.SKELETON_ANIMATION_CLASSES=a;exports.SKELETON_AVATAR_SIZES=S;exports.SKELETON_BASE_CLASSES=e;exports.SKELETON_TEXT_HEIGHT=t;exports.SKELETON_VARIANT_CLASSES=n;exports.SKELETON_WAVE_STYLES=r;

package/dist/components/Skeleton/Skeleton.const.js

@@ -7,7 +7,7 @@ const e = "Bear-Skeleton relative overflow-hidden", n = {
   pulse: "animate-pulse",
   wave: "Bear-Skeleton--wave",
   none: ""
-}, r = "bg-gray-200 dark:bg-zinc-700", t = `
+}, r = `
   @keyframes Bear-Skeleton-wave {
     0% {
       transform: translateX(-100%);
@@ -42,17 +42,16 @@ const e = "Bear-Skeleton relative overflow-hidden", n = {
       transparent
     );
   }
-`, o = "1em", S = {
+`, t = "1em", o = {
   sm: 32,
   md: 40,
   lg: 56
 };
 export {
   a as SKELETON_ANIMATION_CLASSES,
-  S as SKELETON_AVATAR_SIZES,
+  o as SKELETON_AVATAR_SIZES,
   e as SKELETON_BASE_CLASSES,
-  r as SKELETON_BG_CLASSES,
-  o as SKELETON_TEXT_HEIGHT,
+  t as SKELETON_TEXT_HEIGHT,
   n as SKELETON_VARIANT_CLASSES,
-  t as SKELETON_WAVE_STYLES
+  r as SKELETON_WAVE_STYLES
 };

package/dist/components/Skeleton/Skeleton.js

@@ -1,88 +1,88 @@
-import { jsx as t, jsxs as f } from "react/jsx-runtime";
-import { forwardRef as m, useEffect as _ } from "react";
-import { cn as k } from "../../utils/cn.js";
-import { SKELETON_BG_CLASSES as v, SKELETON_ANIMATION_CLASSES as b, SKELETON_VARIANT_CLASSES as L, SKELETON_BASE_CLASSES as w, SKELETON_TEXT_HEIGHT as C, SKELETON_AVATAR_SIZES as O } from "./Skeleton.const.js";
-import { injectStyles as x } from "./Skeleton.utils.js";
-const S = m(
+import { jsx as r, jsxs as p } from "react/jsx-runtime";
+import { forwardRef as m, useEffect as u } from "react";
+import { cn as x } from "../../utils/cn.js";
+import { SKELETON_ANIMATION_CLASSES as v, SKELETON_VARIANT_CLASSES as b, SKELETON_BASE_CLASSES as w, SKELETON_TEXT_HEIGHT as L, SKELETON_AVATAR_SIZES as C } from "./Skeleton.const.js";
+import { injectStyles as A } from "./Skeleton.utils.js";
+const a = m(
   ({
     variant: e = "text",
-    animation: r = "pulse",
+    animation: t = "pulse",
     width: s,
     height: l,
     borderRadius: o,
-    count: a = 1,
-    gap: p = 8,
+    count: S = 1,
+    gap: f = 8,
     className: d,
     style: n,
     testId: h,
-    ...E
-  }, N) => {
-    _(() => {
-      r === "wave" && x();
-    }, [r]);
+    ...N
+  }, E) => {
+    u(() => {
+      t === "wave" && A();
+    }, [t]);
     const c = (i) => {
       if (i !== void 0)
         return typeof i == "number" ? `${i}px` : i;
     }, g = {
       width: c(s),
-      height: c(l) || (e === "text" ? C : void 0),
+      height: c(l) || (e === "text" ? L : void 0),
       borderRadius: o ? c(o) : void 0,
       ...n
-    }, y = k(
+    }, k = x(
       w,
-      L[e],
-      b[r],
-      v,
+      b[e],
+      t === "pulse" && "Bear-Skeleton--pulse",
+      v[t],
       d
     );
-    return a > 1 ? /* @__PURE__ */ t(
+    return S > 1 ? /* @__PURE__ */ r(
       "div",
       {
         className: "Bear-Skeleton__group flex flex-col",
-        style: { gap: c(p) },
+        style: { gap: c(f) },
         "data-testid": h,
-        children: Array.from({ length: a }).map((i, A) => /* @__PURE__ */ t(
+        children: Array.from({ length: S }).map((i, y) => /* @__PURE__ */ r(
           "div",
           {
-            ref: A === 0 ? N : void 0,
-            className: y,
+            ref: y === 0 ? E : void 0,
+            className: k,
             style: g,
-            ...E
+            ...N
           },
-          A
+          y
         ))
       }
-    ) : /* @__PURE__ */ t(
+    ) : /* @__PURE__ */ r(
       "div",
       {
-        ref: N,
-        className: y,
+        ref: E,
+        className: k,
         style: g,
         "data-testid": h,
-        ...E
+        ...N
       }
     );
   }
 );
-S.displayName = "Skeleton";
+a.displayName = "Skeleton";
 const T = m(
-  ({ lines: e = 3, lastLineWidth: r = "80%", gap: s = 8, animation: l = "pulse", ...o }, a) => (_(() => {
-    l === "wave" && x();
-  }, [l]), /* @__PURE__ */ t(
+  ({ lines: e = 3, lastLineWidth: t = "80%", gap: s = 8, animation: l = "pulse", ...o }, S) => (u(() => {
+    l === "wave" && A();
+  }, [l]), /* @__PURE__ */ r(
     "div",
     {
-      ref: a,
+      ref: S,
       className: "Bear-SkeletonText flex flex-col",
       style: { gap: ((d) => {
         if (d !== void 0)
           return typeof d == "number" ? `${d}px` : d;
       })(s) },
-      children: Array.from({ length: e }).map((d, n) => /* @__PURE__ */ t(
-        S,
+      children: Array.from({ length: e }).map((d, n) => /* @__PURE__ */ r(
+        a,
         {
           variant: "text",
           animation: l,
-          width: n === e - 1 ? r : "100%",
+          width: n === e - 1 ? t : "100%",
           ...o
         },
         n
@@ -91,15 +91,15 @@ const T = m(
   ))
 );
 T.displayName = "SkeletonText";
-const u = m(
-  ({ size: e = "md", animation: r = "pulse", ...s }, l) => {
-    const o = typeof e == "number" ? e : O[e];
-    return /* @__PURE__ */ t(
-      S,
+const _ = m(
+  ({ size: e = "md", animation: t = "pulse", ...s }, l) => {
+    const o = typeof e == "number" ? e : C[e];
+    return /* @__PURE__ */ r(
+      a,
       {
         ref: l,
         variant: "circular",
-        animation: r,
+        animation: t,
         width: o,
         height: o,
         ...s
@@ -107,34 +107,34 @@ const u = m(
     );
   }
 );
-u.displayName = "SkeletonAvatar";
-const K = m(
-  ({ animation: e = "pulse", className: r, ...s }, l) => /* @__PURE__ */ f(
+_.displayName = "SkeletonAvatar";
+const O = m(
+  ({ animation: e = "pulse", className: t, ...s }, l) => /* @__PURE__ */ p(
     "div",
     {
       ref: l,
-      className: k(
+      className: x(
         "Bear-SkeletonCard p-4 rounded-lg border border-gray-200 dark:border-zinc-700 bg-white dark:bg-zinc-900",
-        r
+        t
       ),
       ...s,
       children: [
-        /* @__PURE__ */ f("div", { className: "flex items-center gap-3 mb-4", children: [
-          /* @__PURE__ */ t(u, { animation: e }),
-          /* @__PURE__ */ f("div", { className: "flex-1", children: [
-            /* @__PURE__ */ t(S, { animation: e, width: "60%", height: 16, className: "mb-2" }),
-            /* @__PURE__ */ t(S, { animation: e, width: "40%", height: 12 })
+        /* @__PURE__ */ p("div", { className: "flex items-center gap-3 mb-4", children: [
+          /* @__PURE__ */ r(_, { animation: e }),
+          /* @__PURE__ */ p("div", { className: "flex-1", children: [
+            /* @__PURE__ */ r(a, { animation: e, width: "60%", height: 16, className: "mb-2" }),
+            /* @__PURE__ */ r(a, { animation: e, width: "40%", height: 12 })
           ] })
         ] }),
-        /* @__PURE__ */ t(T, { animation: e, lines: 3 })
+        /* @__PURE__ */ r(T, { animation: e, lines: 3 })
       ]
     }
   )
 );
-K.displayName = "SkeletonCard";
+O.displayName = "SkeletonCard";
 export {
-  S as Skeleton,
-  u as SkeletonAvatar,
-  K as SkeletonCard,
+  a as Skeleton,
+  _ as SkeletonAvatar,
+  O as SkeletonCard,
   T as SkeletonText
 };

package/dist/components/SliderRange/SliderRange.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),u=require("react"),i=require("../../utils/cn.cjs"),V=require("./SliderRange.utils.cjs"),X={xs:{track:"bear-h-1",thumb:"bear-w-3 bear-h-3",height:"bear-h-6"},sm:{track:"bear-h-1.5",thumb:"bear-w-4 bear-h-4",height:"bear-h-8"},md:{track:"bear-h-2",thumb:"bear-w-5 bear-h-5",height:"bear-h-10"},lg:{track:"bear-h-2.5",thumb:"bear-w-6 bear-h-6",height:"bear-h-12"},xl:{track:"bear-h-3",thumb:"bear-w-7 bear-h-7",height:"bear-h-14"}},Y={primary:{track:"bear-bg-bear-500",thumb:"bear-bg-bear-500 bear-border-bear-600"},secondary:{track:"bear-bg-gray-500",thumb:"bear-bg-gray-500 bear-border-gray-600"},success:{track:"bear-bg-green-500",thumb:"bear-bg-green-500 bear-border-green-600"},warning:{track:"bear-bg-amber-500",thumb:"bear-bg-amber-500 bear-border-amber-600"},error:{track:"bear-bg-red-500",thumb:"bear-bg-red-500 bear-border-red-600"},danger:{track:"bear-bg-red-500",thumb:"bear-bg-red-500 bear-border-red-600"},info:{track:"bear-bg-blue-500",thumb:"bear-bg-blue-500 bear-border-blue-600"},ghost:{track:"bear-bg-gray-400",thumb:"bear-bg-gray-400 bear-border-gray-500"},outline:{track:"bear-bg-gray-600",thumb:"bear-bg-white dark:bear-bg-gray-200 bear-border-gray-600 dark:bear-border-gray-400"}},A=({value:h,defaultValue:D=[20,80],min:e=0,max:t=100,step:d=1,size:I="md",color:$="primary",disabled:a=!1,onChange:s,onChangeCommitted:g,valueFormatter:B=f=>String(f),className:z,...O})=>{const[f,R]=u.useState(D),[b,L]=u.useState(null),w=u.useRef(null),y=h??f,[c,l]=y,k=(c-e)/(t-e)*100,E=(l-e)/(t-e)*100,m=X[I],x=Y[$],S=u.useCallback((r,v)=>{if(!w.current||a)return;const N=w.current.getBoundingClientRect(),P=Math.max(0,Math.min(1,(r-N.left)/N.width)),_=e+P*(t-e),T=V.stepValue(_,e,t,d);if(v==="min"){const n=[Math.min(T,l-d),l];h===void 0&&R(n),s==null||s(n)}else{const q=Math.max(T,c+d),n=[c,q];h===void 0&&R(n),s==null||s(n)}},[e,t,d,c,l,a,h,s]),j=(r,v)=>{a||(r.preventDefault(),L(v),S(r.clientX,v))},p=u.useCallback(r=>{b&&S(r.clientX,b)},[b,S]),M=u.useCallback(()=>{b&&(L(null),g==null||g(y))},[b,y,g]);return u.useEffect(()=>{if(b)return document.addEventListener("mousemove",p),document.addEventListener("mouseup",M),()=>{document.removeEventListener("mousemove",p),document.removeEventListener("mouseup",M)}},[b,p,M]),o.jsx("div",{className:i.cn("bear-relative bear-w-full bear-flex bear-items-center",m.height,a&&"bear-opacity-50 bear-cursor-not-allowed",z),"data-testid":"slider-range",...O,children:o.jsxs("div",{ref:w,className:i.cn("bear-relative bear-w-full bear-rounded-full bear-bg-gray-200 dark:bear-bg-gray-700",m.track,!a&&"bear-cursor-pointer"),children:[o.jsx("div",{className:i.cn("bear-absolute bear-inset-y-0 bear-left-0 bear-rounded-full",x.track),style:{left:`${k}%`,width:`${E-k}%`}}),o.jsx("div",{role:"slider",tabIndex:a?-1:0,"aria-valuemin":e,"aria-valuemax":t,"aria-valuenow":c,"aria-label":"Range minimum",className:i.cn("bear-absolute bear-top-1/2 bear--translate-y-1/2 bear--translate-x-1/2 bear-rounded-full bear-border-2 bear-shadow-md",m.thumb,x.thumb,!a&&"bear-cursor-grab active:bear-cursor-grabbing hover:bear-scale-110",b==="min"&&"bear-scale-125 bear-z-10"),style:{left:`${k}%`},onMouseDown:r=>j(r,"min")}),o.jsx("div",{role:"slider",tabIndex:a?-1:0,"aria-valuemin":e,"aria-valuemax":t,"aria-valuenow":l,"aria-label":"Range maximum",className:i.cn("bear-absolute bear-top-1/2 bear--translate-y-1/2 bear--translate-x-1/2 bear-rounded-full bear-border-2 bear-shadow-md",m.thumb,x.thumb,!a&&"bear-cursor-grab active:bear-cursor-grabbing hover:bear-scale-110",b==="max"&&"bear-scale-125 bear-z-10"),style:{left:`${E}%`},onMouseDown:r=>j(r,"max")})]})})};exports.SliderRange=A;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),u=require("react"),i=require("../../utils/cn.cjs"),F=require("./SliderRange.utils.cjs"),V={xs:{track:"bear-h-1",thumb:"bear-w-3 bear-h-3",height:"bear-h-6"},sm:{track:"bear-h-1.5",thumb:"bear-w-4 bear-h-4",height:"bear-h-8"},md:{track:"bear-h-2",thumb:"bear-w-5 bear-h-5",height:"bear-h-10"},lg:{track:"bear-h-2.5",thumb:"bear-w-6 bear-h-6",height:"bear-h-12"},xl:{track:"bear-h-3",thumb:"bear-w-7 bear-h-7",height:"bear-h-14"}},X={primary:{track:"bear-bg-bear-500",thumb:"bear-bg-bear-500 bear-border-bear-600"},secondary:{track:"bear-bg-gray-500",thumb:"bear-bg-gray-500 bear-border-gray-600"},success:{track:"bear-bg-green-500",thumb:"bear-bg-green-500 bear-border-green-600"},warning:{track:"bear-bg-amber-500",thumb:"bear-bg-amber-500 bear-border-amber-600"},error:{track:"bear-bg-red-500",thumb:"bear-bg-red-500 bear-border-red-600"},danger:{track:"bear-bg-red-500",thumb:"bear-bg-red-500 bear-border-red-600"},info:{track:"bear-bg-blue-500",thumb:"bear-bg-blue-500 bear-border-blue-600"},ghost:{track:"bear-bg-gray-400",thumb:"bear-bg-gray-400 bear-border-gray-500"},outline:{track:"bear-bg-gray-600",thumb:"bear-bg-white dark:bear-bg-gray-200 bear-border-gray-600 dark:bear-border-gray-400"}},Y=({value:h,defaultValue:D=[20,80],min:e=0,max:t=100,step:d=1,size:I="md",color:_="primary",disabled:a=!1,onChange:s,onChangeCommitted:g,valueFormatter:A=f=>String(f),className:$,...z})=>{const[f,R]=u.useState(D),[b,L]=u.useState(null),w=u.useRef(null),y=h??f,[c,l]=y,k=(c-e)/(t-e)*100,E=(l-e)/(t-e)*100,m=V[I],x=X[_],S=u.useCallback((r,v)=>{if(!w.current||a)return;const N=w.current.getBoundingClientRect(),O=Math.max(0,Math.min(1,(r-N.left)/N.width)),P=e+O*(t-e),T=F.stepValue(P,e,t,d);if(v==="min"){const n=[Math.min(T,l-d),l];h===void 0&&R(n),s==null||s(n)}else{const q=Math.max(T,c+d),n=[c,q];h===void 0&&R(n),s==null||s(n)}},[e,t,d,c,l,a,h,s]),j=(r,v)=>{a||(r.preventDefault(),L(v),S(r.clientX,v))},p=u.useCallback(r=>{b&&S(r.clientX,b)},[b,S]),M=u.useCallback(()=>{b&&(L(null),g==null||g(y))},[b,y,g]);return u.useEffect(()=>{if(b)return document.addEventListener("mousemove",p),document.addEventListener("mouseup",M),()=>{document.removeEventListener("mousemove",p),document.removeEventListener("mouseup",M)}},[b,p,M]),o.jsx("div",{className:i.cn("bear-relative bear-w-full bear-flex bear-items-center",m.height,a&&"bear-opacity-50 bear-cursor-not-allowed",$),"data-testid":"slider-range",...z,children:o.jsxs("div",{ref:w,className:i.cn("bear-relative bear-w-full bear-rounded-full bear-bg-gray-200 dark:bear-bg-gray-700",m.track,!a&&"bear-cursor-pointer"),children:[o.jsx("div",{className:i.cn("bear-absolute bear-inset-y-0 bear-left-0 bear-rounded-full",x.track),style:{left:`${k}%`,width:`${E-k}%`}}),o.jsx("div",{role:"slider",tabIndex:a?-1:0,"aria-valuemin":e,"aria-valuemax":t,"aria-valuenow":c,"aria-label":"Range minimum",className:i.cn("bear-absolute bear-top-1/2 bear--translate-y-1/2 bear--translate-x-1/2 bear-rounded-full bear-border-2 bear-shadow-md",m.thumb,x.thumb,!a&&"bear-cursor-grab active:bear-cursor-grabbing hover:bear-scale-110",b==="min"&&"bear-scale-125 bear-z-10"),style:{left:`${k}%`},onMouseDown:r=>j(r,"min")}),o.jsx("div",{role:"slider",tabIndex:a?-1:0,"aria-valuemin":e,"aria-valuemax":t,"aria-valuenow":l,"aria-label":"Range maximum",className:i.cn("bear-absolute bear-top-1/2 bear--translate-y-1/2 bear--translate-x-1/2 bear-rounded-full bear-border-2 bear-shadow-md",m.thumb,x.thumb,!a&&"bear-cursor-grab active:bear-cursor-grabbing hover:bear-scale-110",b==="max"&&"bear-scale-125 bear-z-10"),style:{left:`${E}%`},onMouseDown:r=>j(r,"max")})]})})};exports.SliderRange=Y;

package/dist/components/SliderRange/SliderRange.js

@@ -1,7 +1,7 @@
-import { jsx as g, jsxs as _ } from "react/jsx-runtime";
-import { useState as $, useRef as A, useCallback as S, useEffect as B } from "react";
+import { jsx as g, jsxs as X } from "react/jsx-runtime";
+import { useState as $, useRef as Y, useCallback as S, useEffect as A } from "react";
 import { cn as l } from "../../utils/cn.js";
-import { stepValue as F } from "./SliderRange.utils.js";
+import { stepValue as B } from "./SliderRange.utils.js";
 const H = {
   xs: { track: "bear-h-1", thumb: "bear-w-3 bear-h-3", height: "bear-h-6" },
   sm: { track: "bear-h-1.5", thumb: "bear-w-4 bear-h-4", height: "bear-h-8" },
@@ -24,28 +24,28 @@ const H = {
   min: e = 0,
   max: t = 100,
   step: i = 1,
-  size: j = "md",
-  color: O = "primary",
+  size: _ = "md",
+  color: j = "primary",
   disabled: a = !1,
-  onChange: s,
+  onChange: u,
   onChangeCommitted: h,
   valueFormatter: Z = (v) => String(v),
-  className: P,
-  ...V
+  className: F,
+  ...O
 }) => {
-  const [v, L] = $(z), [b, E] = $(null), f = A(null), w = n ?? v, [u, o] = w, y = (u - e) / (t - e) * 100, R = (o - e) / (t - e) * 100, m = H[j], k = U[O], p = S(
+  const [v, L] = $(z), [b, E] = $(null), f = Y(null), w = n ?? v, [s, o] = w, y = (s - e) / (t - e) * 100, R = (o - e) / (t - e) * 100, m = H[_], k = U[j], p = S(
     (r, d) => {
       if (!f.current || a) return;
-      const D = f.current.getBoundingClientRect(), X = Math.max(0, Math.min(1, (r - D.left) / D.width)), Y = e + X * (t - e), I = F(Y, e, t, i);
+      const D = f.current.getBoundingClientRect(), P = Math.max(0, Math.min(1, (r - D.left) / D.width)), V = e + P * (t - e), I = B(V, e, t, i);
       if (d === "min") {
         const c = [Math.min(I, o - i), o];
-        n === void 0 && L(c), s == null || s(c);
+        n === void 0 && L(c), u == null || u(c);
       } else {
-        const T = Math.max(I, u + i), c = [u, T];
-        n === void 0 && L(c), s == null || s(c);
+        const T = Math.max(I, s + i), c = [s, T];
+        n === void 0 && L(c), u == null || u(c);
       }
     },
-    [e, t, i, u, o, a, n, s]
+    [e, t, i, s, o, a, n, u]
   ), N = (r, d) => {
     a || (r.preventDefault(), E(d), p(r.clientX, d));
   }, x = S(
@@ -56,7 +56,7 @@ const H = {
   ), M = S(() => {
     b && (E(null), h == null || h(w));
   }, [b, w, h]);
-  return B(() => {
+  return A(() => {
     if (b)
       return document.addEventListener("mousemove", x), document.addEventListener("mouseup", M), () => {
         document.removeEventListener("mousemove", x), document.removeEventListener("mouseup", M);
@@ -68,11 +68,11 @@ const H = {
         "bear-relative bear-w-full bear-flex bear-items-center",
         m.height,
         a && "bear-opacity-50 bear-cursor-not-allowed",
-        P
+        F
       ),
       "data-testid": "slider-range",
-      ...V,
-      children: /* @__PURE__ */ _(
+      ...O,
+      children: /* @__PURE__ */ X(
         "div",
         {
           ref: f,
@@ -96,7 +96,7 @@ const H = {
                 tabIndex: a ? -1 : 0,
                 "aria-valuemin": e,
                 "aria-valuemax": t,
-                "aria-valuenow": u,
+                "aria-valuenow": s,
                 "aria-label": "Range minimum",
                 className: l(
                   "bear-absolute bear-top-1/2 bear--translate-y-1/2 bear--translate-x-1/2 bear-rounded-full bear-border-2 bear-shadow-md",

package/dist/components/Sparkline/Sparkline.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),N=require("react"),i=require("../../utils/cn.cjs"),t=require("./Sparkline.const.cjs"),S=require("./Sparkline.utils.cjs"),L=d=>{const{data:a,width:I=t.SPARKLINE.DEFAULT_WIDTH,height:f=t.SPARKLINE.DEFAULT_HEIGHT,color:s=t.SPARKLINE.DEFAULT_COLOR,fill:p=!1,strokeWidth:R=t.SPARKLINE.DEFAULT_STROKE_WIDTH,showExtremes:o=!1,animated:c=!0,className:x,...A}=d,{path:u,areaPath:E,minPoint:n,maxPoint:r}=N.useMemo(()=>S.calculateSparklinePathData(a),[a]),l=`sparkline-gradient-${s.replace("#","")}`;return e.jsx("div",{className:i.cn("inline-block",x),style:{width:I,height:f},...A,children:e.jsxs("svg",{viewBox:"0 0 100 100",preserveAspectRatio:"none",className:"w-full h-full",children:[e.jsx("defs",{children:e.jsxs("linearGradient",{id:l,x1:"0%",y1:"0%",x2:"0%",y2:"100%",children:[e.jsx("stop",{offset:"0%",stopColor:s,stopOpacity:"0.4"}),e.jsx("stop",{offset:"100%",stopColor:s,stopOpacity:"0"})]})}),p&&e.jsx("path",{d:E,fill:`url(#${l})`,className:i.cn(c&&"animate-fade-in")}),e.jsx("path",{d:u,fill:"none",stroke:s,strokeWidth:R,strokeLinecap:"round",strokeLinejoin:"round",vectorEffect:"non-scaling-stroke",className:i.cn(c&&"animate-draw-line")}),o&&n&&e.jsx("circle",{cx:n.x,cy:n.y,r:t.SPARKLINE.INDICATOR_RADIUS,fill:t.SPARKLINE.MIN_INDICATOR_COLOR,vectorEffect:"non-scaling-stroke"}),o&&r&&e.jsx("circle",{cx:r.x,cy:r.y,r:t.SPARKLINE.INDICATOR_RADIUS,fill:t.SPARKLINE.MAX_INDICATOR_COLOR,vectorEffect:"non-scaling-stroke"})]})})};exports.Sparkline=L;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("../../utils/cn.cjs");require("react");const t=require("./Sparkline.const.cjs"),A=require("./Sparkline.utils.cjs"),j=d=>{const{data:a,width:p=t.SPARKLINE.DEFAULT_WIDTH,height:x=t.SPARKLINE.DEFAULT_HEIGHT,color:s=t.SPARKLINE.DEFAULT_COLOR,fill:S=!1,strokeWidth:E=t.SPARKLINE.DEFAULT_STROKE_WIDTH,showExtremes:I=!1,animated:l=!0,variant:R=t.SPARKLINE_VARIANT_LINE,showLastPoint:h=!1,className:L,...u}=d,P=S||R===t.SPARKLINE_VARIANT_AREA,{path:_,areaPath:k,minPoint:c,maxPoint:r}=A.calculateSparklinePathData(a),T=A.calculateSparklineBars(a),f=A.calculateSparklinePoints(a),o=f[f.length-1],N=`sparkline-gradient-${s.replace("#","")}`;return e.jsx("div",{className:i.cn("inline-block",L),style:{width:p,height:x},...u,children:e.jsxs("svg",{viewBox:"0 0 100 100",preserveAspectRatio:"none",className:"w-full h-full",children:[e.jsx("defs",{children:e.jsxs("linearGradient",{id:N,x1:"0%",y1:"0%",x2:"0%",y2:"100%",children:[e.jsx("stop",{offset:"0%",stopColor:s,stopOpacity:"0.4"}),e.jsx("stop",{offset:"100%",stopColor:s,stopOpacity:"0"})]})}),R===t.SPARKLINE_VARIANT_BARS?T.map((n,m)=>e.jsx("rect",{x:n.x,y:n.y,width:n.width,height:n.height,fill:s,className:i.cn(l&&"animate-grow-up")},m)):e.jsxs(e.Fragment,{children:[P&&e.jsx("path",{d:k,fill:`url(#${N})`,className:i.cn(l&&"animate-fade-in")}),e.jsx("path",{d:_,fill:"none",stroke:s,strokeWidth:E,strokeLinecap:"round",strokeLinejoin:"round",vectorEffect:"non-scaling-stroke",className:i.cn(l&&"animate-draw-line")})]}),I&&c&&e.jsx("circle",{cx:c.x,cy:c.y,r:t.SPARKLINE.INDICATOR_RADIUS,fill:t.SPARKLINE.MIN_INDICATOR_COLOR,vectorEffect:"non-scaling-stroke"}),I&&r&&e.jsx("circle",{cx:r.x,cy:r.y,r:t.SPARKLINE.INDICATOR_RADIUS,fill:t.SPARKLINE.MAX_INDICATOR_COLOR,vectorEffect:"non-scaling-stroke"}),h&&o&&e.jsx("circle",{cx:o.x,cy:o.y,r:t.SPARKLINE.LAST_POINT_RADIUS,fill:s,vectorEffect:"non-scaling-stroke"})]})})};exports.Sparkline=j;

package/dist/components/Sparkline/Sparkline.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const I={DEFAULT_WIDTH:100,DEFAULT_HEIGHT:32,DEFAULT_COLOR:"var(--bear-primary-500, #ec4899)",DEFAULT_STROKE_WIDTH:2,VIEWBOX_SIZE:100,Y_PADDING:10,Y_RANGE:80,CONTROL_POINT_FACTOR:3,MIN_INDICATOR_COLOR:"#ef4444",MAX_INDICATOR_COLOR:"#10b981",INDICATOR_RADIUS:3};exports.SPARKLINE=I;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A={DEFAULT_WIDTH:100,DEFAULT_HEIGHT:32,DEFAULT_COLOR:"var(--bear-primary-500, #ec4899)",DEFAULT_STROKE_WIDTH:2,VIEWBOX_SIZE:100,Y_PADDING:10,Y_RANGE:80,CONTROL_POINT_FACTOR:3,MIN_INDICATOR_COLOR:"#ef4444",MAX_INDICATOR_COLOR:"#10b981",INDICATOR_RADIUS:3,LAST_POINT_RADIUS:3.5,BAR_GAP_RATIO:.25},I="line",R="area",_="bars";exports.SPARKLINE=A;exports.SPARKLINE_VARIANT_AREA=R;exports.SPARKLINE_VARIANT_BARS=_;exports.SPARKLINE_VARIANT_LINE=I;

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

@@ -13,4 +13,9 @@ export declare const SPARKLINE: {
     readonly MIN_INDICATOR_COLOR: "#ef4444";
     readonly MAX_INDICATOR_COLOR: "#10b981";
     readonly INDICATOR_RADIUS: 3;
+    readonly LAST_POINT_RADIUS: 3.5;
+    readonly BAR_GAP_RATIO: 0.25;
 };
+export declare const SPARKLINE_VARIANT_LINE = "line";
+export declare const SPARKLINE_VARIANT_AREA = "area";
+export declare const SPARKLINE_VARIANT_BARS = "bars";

package/dist/components/Sparkline/Sparkline.const.js

@@ -1,4 +1,4 @@
-const I = {
+const A = {
   DEFAULT_WIDTH: 100,
   DEFAULT_HEIGHT: 32,
   DEFAULT_COLOR: "var(--bear-primary-500, #ec4899)",
@@ -9,8 +9,13 @@ const I = {
   CONTROL_POINT_FACTOR: 3,
   MIN_INDICATOR_COLOR: "#ef4444",
   MAX_INDICATOR_COLOR: "#10b981",
-  INDICATOR_RADIUS: 3
-};
+  INDICATOR_RADIUS: 3,
+  LAST_POINT_RADIUS: 3.5,
+  BAR_GAP_RATIO: 0.25
+}, I = "line", _ = "area", R = "bars";
 export {
-  I as SPARKLINE
+  A as SPARKLINE,
+  _ as SPARKLINE_VARIANT_AREA,
+  R as SPARKLINE_VARIANT_BARS,
+  I as SPARKLINE_VARIANT_LINE
 };

package/dist/components/Sparkline/Sparkline.d.ts

@@ -1,3 +1,2 @@
-import { FC } from 'react';
 import { SparklineProps } from './Sparkline.types';
-export declare const Sparkline: FC<SparklineProps>;
+export declare const Sparkline: (props: SparklineProps) => import("react/jsx-runtime").JSX.Element;