@forgedevstack/bear 1.1.9 → 1.2.1

package/dist/components/Dropdown/Dropdown.d.ts

@@ -16,4 +16,3 @@ import { DropdownProps } from './Dropdown.types';
  * ```
  */
 export declare const Dropdown: FC<DropdownProps>;
-export default Dropdown;

package/dist/components/Dropdown/Dropdown.js

@@ -1,86 +1,93 @@
-import { jsxs as I, jsx as o } from "react/jsx-runtime";
-import { useState as D, useRef as v, useCallback as c, useEffect as S, isValidElement as q, cloneElement as G } from "react";
-import { cn as h } from "../../utils/cn.js";
-import { useClickOutside as H } from "../../hooks/useClickOutside.js";
+import { jsxs as j, jsx as o } from "react/jsx-runtime";
+import { useState as m, useRef as E, useCallback as u, useEffect as I, useMemo as $, isValidElement as O, cloneElement as ee } from "react";
+import { cn as C } from "../../utils/cn.js";
+import { useClickOutsideMultiple as re } from "../../hooks/useClickOutside.js";
 import "../../context/BearProvider.js";
 import "../../hooks/useBearComponent/useBearComponent.js";
-const J = {
-  xs: "bear-text-xs bear-py-1 bear-px-2",
-  sm: "bear-text-sm bear-py-1.5 bear-px-3",
-  md: "bear-text-sm bear-py-2 bear-px-3",
-  lg: "bear-text-base bear-py-2.5 bear-px-4",
-  xl: "bear-text-lg bear-py-3 bear-px-5"
-}, Q = {
-  "bottom-start": "bear-top-full bear-left-0 bear-mt-1",
-  "bottom-end": "bear-top-full bear-right-0 bear-mt-1",
-  bottom: "bear-top-full bear-left-1/2 -bear-translate-x-1/2 bear-mt-1",
-  "top-start": "bear-bottom-full bear-left-0 bear-mb-1",
-  "top-end": "bear-bottom-full bear-right-0 bear-mb-1",
-  top: "bear-bottom-full bear-left-1/2 -bear-translate-x-1/2 bear-mb-1",
-  left: "bear-right-full bear-top-0 bear-mr-1",
-  right: "bear-left-full bear-top-0 bear-ml-1"
-}, te = ({
-  trigger: p,
-  items: i,
-  open: y,
-  defaultOpen: A = !1,
-  placement: L = "bottom-start",
-  offset: X = 4,
-  matchWidth: R = !1,
-  minWidth: j = 150,
-  maxHeight: W = 300,
-  size: z = "md",
-  closeOnSelect: g = !0,
-  closeOnClickOutside: k = !0,
-  disabled: w = !1,
+import { Portal as te } from "../Portal/Portal.js";
+import { SIZE_CLASSES as ae } from "./Dropdown.const.js";
+const pe = ({
+  trigger: v,
+  items: d,
+  open: L,
+  defaultOpen: z = !1,
+  placement: i = "bottom-start",
+  offset: x = 4,
+  matchWidth: N = !1,
+  minWidth: h = 150,
+  maxHeight: A = 300,
+  size: U = "md",
+  closeOnSelect: D = !0,
+  closeOnClickOutside: g = !0,
+  disabled: M = !1,
   onOpenChange: f,
-  className: F,
-  testId: M,
-  ..._
+  className: B,
+  testId: F,
+  ...K
 }) => {
-  var C;
-  const [B, K] = D(A), [n, s] = D(-1), E = v(null), P = v(null), N = v(null), x = y !== void 0, a = x ? y : B, u = c((e) => {
-    x || K(e), f == null || f(e);
-  }, [x, f]), T = c(() => {
-    w || u(!a);
-  }, [w, a, u]), l = c(() => {
-    u(!1), s(-1);
-  }, [u]), m = c((e) => {
-    var t;
-    e.disabled || e.divider || e.header || ((t = e.onClick) == null || t.call(e), g && !e.items && l());
-  }, [g, l]), U = c(() => {
-    a && k && l();
-  }, [a, k, l]);
-  H(E, U), S(() => {
+  const [T, V] = m(z), [b, c] = m(-1), [w, Z] = m({ top: 0, left: 0, minWidth: h }), R = E(null), W = E(null), P = E(null), y = L !== void 0, a = y ? L : T, p = u((e) => {
+    y || V(e), f == null || f(e);
+  }, [y, f]), _ = u(() => {
+    M || p(!a);
+  }, [M, a, p]), l = u(() => {
+    p(!1), c(-1);
+  }, [p]), k = u((e) => {
+    var r;
+    e.disabled || e.divider || e.header || ((r = e.onClick) == null || r.call(e), D && !e.items && l());
+  }, [D, l]), q = u(() => {
+    a && g && l();
+  }, [a, g, l]);
+  re([R, W], q, {
+    enabled: a && g
+  }), I(() => {
     if (!a) return;
-    const e = i.filter((r) => !r.disabled && !r.divider && !r.header), t = (r) => {
-      switch (r.key) {
+    const e = d.filter((t) => !t.disabled && !t.divider && !t.header), r = (t) => {
+      switch (t.key) {
         case "Escape":
-          r.preventDefault(), l();
+          t.preventDefault(), l();
           break;
         case "ArrowDown":
-          r.preventDefault(), s((d) => {
-            const b = d + 1;
-            return b >= e.length ? 0 : b;
+          t.preventDefault(), c((n) => {
+            const s = n + 1;
+            return s >= e.length ? 0 : s;
           });
           break;
         case "ArrowUp":
-          r.preventDefault(), s((d) => {
-            const b = d - 1;
-            return b < 0 ? e.length - 1 : b;
+          t.preventDefault(), c((n) => {
+            const s = n - 1;
+            return s < 0 ? e.length - 1 : s;
           });
           break;
         case "Enter":
         case " ":
-          r.preventDefault(), n >= 0 && n < e.length && m(e[n]);
+          t.preventDefault(), b >= 0 && b < e.length && k(e[b]);
           break;
       }
     };
-    return document.addEventListener("keydown", t), () => document.removeEventListener("keydown", t);
-  }, [a, i, n, l, m]), S(() => {
-    a || s(-1);
+    return document.addEventListener("keydown", r), () => document.removeEventListener("keydown", r);
+  }, [a, d, b, l, k]), I(() => {
+    if (!a) return;
+    const e = () => {
+      var S;
+      const r = (S = P.current) == null ? void 0 : S.getBoundingClientRect();
+      if (!r) return;
+      const t = window.innerWidth, n = N ? r.width : h, Q = i.endsWith("end") ? r.right - n : i === "top" || i === "bottom" ? r.left + r.width / 2 - n / 2 : r.left, X = Math.min(Math.max(8, Q), Math.max(8, t - n - 8)), Y = i.startsWith("top") ? r.top - x : r.bottom + x;
+      Z({
+        top: Y,
+        left: X,
+        minWidth: n
+      });
+    };
+    return e(), window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), () => {
+      window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
+    };
+  }, [a, N, h, i, x]), I(() => {
+    a || c(-1);
   }, [a]);
-  const V = (e, t) => {
+  const G = $(
+    () => d.map((e, r) => ({ item: e, index: r })).filter(({ item: e }) => !e.disabled && !e.divider && !e.header),
+    [d]
+  ), H = (e, r) => {
     if (e.divider)
       return /* @__PURE__ */ o(
         "div",
@@ -101,20 +108,21 @@ const J = {
         },
         e.key
       );
-    const r = i.slice(0, t).filter((b) => !b.disabled && !b.divider && !b.header).length, d = n === r;
-    return /* @__PURE__ */ I(
+    const t = G.findIndex((s) => s.index === r), n = b === t;
+    return /* @__PURE__ */ j(
       "button",
       {
         type: "button",
         role: "menuitem",
         disabled: e.disabled,
-        onClick: () => m(e),
-        onMouseEnter: () => s(r),
-        className: h(
+        onClick: () => k(e),
+        onMouseEnter: () => c(t),
+        className: C(
           "bear-w-full bear-flex bear-items-center bear-gap-2 bear-text-left bear-border-none bear-bg-transparent",
-          J[z],
+          ae[U],
           "bear-transition-colors bear-cursor-pointer",
-          d && !e.danger && "bear-bg-[var(--bear-bg-tertiary)]",
+          e.selected && !e.danger && "bear-bg-[var(--bear-bg-tertiary)] bear-text-[var(--bear-text-primary)]",
+          n && !e.danger && "bear-bg-[var(--bear-bg-tertiary)]",
           e.danger && "bear-text-red-600 dark:bear-text-red-400 hover:bear-bg-red-50 dark:hover:bear-bg-red-900/20",
           !e.danger && !e.disabled && "hover:bear-bg-[var(--bear-bg-tertiary)]",
           e.disabled && "bear-opacity-50 bear-cursor-not-allowed bear-pointer-events-none"
@@ -129,46 +137,48 @@ const J = {
       },
       e.key
     );
-  }, Z = q(p) ? G(p, {
-    onClick: T,
-    ref: N,
+  }, J = O(v) ? ee(v, {
+    onClick: _,
+    ref: P,
     "aria-expanded": a,
     "aria-haspopup": !0
-  }) : p;
-  return /* @__PURE__ */ I(
+  }) : v;
+  return /* @__PURE__ */ j(
     "div",
     {
-      ref: E,
-      className: h("bear-relative bear-inline-block", F),
-      "data-testid": M,
-      ..._,
+      ref: R,
+      className: C("bear-relative bear-inline-block", B),
+      "data-testid": F,
+      ...K,
       children: [
-        Z,
-        a && /* @__PURE__ */ o(
+        J,
+        a && /* @__PURE__ */ o(te, { children: /* @__PURE__ */ o(
           "div",
           {
-            ref: P,
+            ref: W,
             role: "menu",
-            className: h(
-              "bear-absolute bear-z-50",
+            className: C(
+              "bear-fixed",
               "bear-border bear-rounded-lg bear-shadow-lg",
               "bear-py-1 bear-overflow-y-auto",
-              "bear-animate-in bear-fade-in-0 bear-zoom-in-95 bear-duration-100",
-              Q[L]
+              "bear-duration-100"
             ),
             style: {
               backgroundColor: "var(--bear-bg-primary)",
               borderColor: "var(--bear-border-default)",
-              minWidth: R ? (C = N.current) == null ? void 0 : C.offsetWidth : j,
-              maxHeight: W
+              minWidth: w.minWidth,
+              maxHeight: A,
+              top: w.top,
+              left: w.left,
+              zIndex: 11e3
             },
-            children: i.map((e, t) => V(e, t))
+            children: d.map((e, r) => H(e, r))
           }
-        )
+        ) })
       ]
     }
   );
 };
 export {
-  te as Dropdown
+  pe as Dropdown
 };

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

@@ -17,6 +17,8 @@ export interface DropdownItem {
     header?: boolean;
     /** Danger/destructive action */
     danger?: boolean;
+    /** Selected/active visual state */
+    selected?: boolean;
     /** Click handler */
     onClick?: () => void;
     /** Nested items for submenu */

package/dist/components/Gauge/Gauge.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),h=require("react"),o=require("../../utils/cn.cjs"),C=({value:a,min:r=0,max:l=100,size:i=120,strokeWidth:t=10,color:y="#ec4899",trackColor:j,showLabel:g=!0,label:p,animated:k=!0,arcAngle:n=270,gradient:s,className:M,...N})=>{const f=h.useId(),{percentage:v,circumference:u,offset:b,startAngle:x}=h.useMemo(()=>{const m=Math.min(Math.max((a-r)/(l-r)*100,0),100),w=50-t/2,c=2*Math.PI*w*(n/360),D=c-m/100*c,q=90+(360-n)/2;return{percentage:m,circumference:c,offset:D,startAngle:q}},[a,r,l,n,t]),d=50-t/2;return e.jsxs("div",{className:o.cn("relative inline-flex items-center justify-center",M),style:{width:i,height:i},...N,children:[e.jsxs("svg",{viewBox:"0 0 100 100",className:"w-full h-full -rotate-90",children:[e.jsx("defs",{children:s&&e.jsxs("linearGradient",{id:f,x1:"0%",y1:"0%",x2:"100%",y2:"0%",children:[e.jsx("stop",{offset:"0%",stopColor:s[0]}),e.jsx("stop",{offset:"100%",stopColor:s[1]})]})}),e.jsx("circle",{cx:"50",cy:"50",r:d,fill:"none",stroke:j||"currentColor",strokeWidth:t,strokeLinecap:"round",strokeDasharray:u,strokeDashoffset:0,className:o.cn("text-gray-200 dark:text-slate-700"),style:{transformOrigin:"center",transform:`rotate(${x}deg)`}}),e.jsx("circle",{cx:"50",cy:"50",r:d,fill:"none",stroke:s?`url(#${f})`:y,strokeWidth:t,strokeLinecap:"round",strokeDasharray:u,strokeDashoffset:b,className:o.cn(k&&"transition-all duration-1000 ease-out"),style:{transformOrigin:"center",transform:`rotate(${x}deg)`}})]}),g&&e.jsx("div",{className:"absolute inset-0 flex items-center justify-center",children:p||e.jsxs("span",{className:"text-2xl font-semibold text-gray-800 dark:text-white",children:[Math.round(v),"%"]})})]})};exports.Gauge=C;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("react"),g=require("../../utils/cn.cjs"),F=({value:x,min:a=0,max:d=100,size:h=120,strokeWidth:s=10,color:p="#ec4899",trackColor:v,showLabel:k=!0,label:b,animated:t=!0,fillDurationMs:D=900,arcAngle:f=270,gradient:n,className:M,...N})=>{const m=i.useId(),{percentage:O,circumference:r,offset:o,startAngle:y}=i.useMemo(()=>{const c=Math.min(Math.max((x-a)/(d-a)*100,0),100),w=50-s/2,u=2*Math.PI*w*(f/360),$=u-c/100*u,C=90+(360-f)/2;return{percentage:c,circumference:u,offset:$,startAngle:C}},[x,a,d,f,s]),[q,l]=i.useState(()=>t?r:o);i.useLayoutEffect(()=>{if(!t){l(o);return}l(r);const c=requestAnimationFrame(()=>l(o));return()=>cancelAnimationFrame(c)},[t,r,o]);const j=50-s/2;return e.jsxs("div",{className:g.cn("relative inline-flex items-center justify-center",M),style:{width:h,height:h},...N,children:[e.jsxs("svg",{viewBox:"0 0 100 100",className:"h-full w-full -rotate-90",children:[e.jsx("defs",{children:n&&e.jsxs("linearGradient",{id:m,x1:"0%",y1:"0%",x2:"100%",y2:"0%",children:[e.jsx("stop",{offset:"0%",stopColor:n[0]}),e.jsx("stop",{offset:"100%",stopColor:n[1]})]})}),e.jsx("circle",{cx:"50",cy:"50",r:j,fill:"none",stroke:v||"currentColor",strokeWidth:s,strokeLinecap:"round",strokeDasharray:r,strokeDashoffset:0,className:g.cn("text-gray-200 dark:text-slate-700"),style:{transformOrigin:"center",transform:`rotate(${y}deg)`}}),e.jsx("circle",{cx:"50",cy:"50",r:j,fill:"none",stroke:n?`url(#${m})`:p,strokeWidth:s,strokeLinecap:"round",strokeDasharray:r,strokeDashoffset:q,style:{transformOrigin:"center",transform:`rotate(${y}deg)`,transitionProperty:t?"stroke-dashoffset":void 0,transitionDuration:t?`${D}ms`:void 0,transitionTimingFunction:t?"cubic-bezier(0.4, 0, 0.2, 1)":void 0}})]}),k&&e.jsx("div",{className:"absolute inset-0 flex items-center justify-center",children:b||e.jsxs("span",{className:"text-2xl font-semibold text-gray-800 dark:text-white",children:[Math.round(O),"%"]})})]})};exports.Gauge=F;

package/dist/components/Gauge/Gauge.js

@@ -1,86 +1,97 @@
-import { jsxs as s, jsx as e } from "react/jsx-runtime";
-import { useId as $, useMemo as b } from "react";
-import { cn as c } from "../../utils/cn.js";
-const B = ({
-  value: l,
-  min: o = 0,
-  max: i = 100,
-  size: f = 120,
-  strokeWidth: t = 10,
-  color: p = "#ec4899",
-  trackColor: y,
-  showLabel: g = !0,
-  label: k,
-  animated: N = !0,
-  arcAngle: n = 270,
-  gradient: r,
-  className: M,
+import { jsxs as i, jsx as t } from "react/jsx-runtime";
+import { useId as I, useMemo as L, useState as A, useLayoutEffect as G } from "react";
+import { cn as g } from "../../utils/cn.js";
+const E = ({
+  value: m,
+  min: a = 0,
+  max: d = 100,
+  size: h = 120,
+  strokeWidth: r = 10,
+  color: k = "#ec4899",
+  trackColor: v,
+  showLabel: D = !0,
+  label: M,
+  animated: e = !0,
+  fillDurationMs: N = 900,
+  arcAngle: f = 270,
+  gradient: o,
+  className: b,
   ...j
 }) => {
-  const u = $(), { percentage: v, circumference: m, offset: w, startAngle: d } = b(() => {
-    const h = Math.min(Math.max((l - o) / (i - o) * 100, 0), 100), D = 50 - t / 2, a = 2 * Math.PI * D * (n / 360), C = a - h / 100 * a, I = 90 + (360 - n) / 2;
+  const x = I(), { percentage: w, circumference: s, offset: n, startAngle: p } = L(() => {
+    const c = Math.min(Math.max((m - a) / (d - a) * 100, 0), 100), $ = 50 - r / 2, u = 2 * Math.PI * $ * (f / 360), C = u - c / 100 * u, F = 90 + (360 - f) / 2;
     return {
-      percentage: h,
-      circumference: a,
+      percentage: c,
+      circumference: u,
       offset: C,
-      startAngle: I
+      startAngle: F
     };
-  }, [l, o, i, n, t]), x = 50 - t / 2;
-  return /* @__PURE__ */ s(
+  }, [m, a, d, f, r]), [O, l] = A(() => e ? s : n);
+  G(() => {
+    if (!e) {
+      l(n);
+      return;
+    }
+    l(s);
+    const c = requestAnimationFrame(() => l(n));
+    return () => cancelAnimationFrame(c);
+  }, [e, s, n]);
+  const y = 50 - r / 2;
+  return /* @__PURE__ */ i(
     "div",
     {
-      className: c("relative inline-flex items-center justify-center", M),
-      style: { width: f, height: f },
+      className: g("relative inline-flex items-center justify-center", b),
+      style: { width: h, height: h },
       ...j,
       children: [
-        /* @__PURE__ */ s("svg", { viewBox: "0 0 100 100", className: "w-full h-full -rotate-90", children: [
-          /* @__PURE__ */ e("defs", { children: r && /* @__PURE__ */ s("linearGradient", { id: u, x1: "0%", y1: "0%", x2: "100%", y2: "0%", children: [
-            /* @__PURE__ */ e("stop", { offset: "0%", stopColor: r[0] }),
-            /* @__PURE__ */ e("stop", { offset: "100%", stopColor: r[1] })
+        /* @__PURE__ */ i("svg", { viewBox: "0 0 100 100", className: "h-full w-full -rotate-90", children: [
+          /* @__PURE__ */ t("defs", { children: o && /* @__PURE__ */ i("linearGradient", { id: x, x1: "0%", y1: "0%", x2: "100%", y2: "0%", children: [
+            /* @__PURE__ */ t("stop", { offset: "0%", stopColor: o[0] }),
+            /* @__PURE__ */ t("stop", { offset: "100%", stopColor: o[1] })
           ] }) }),
-          /* @__PURE__ */ e(
+          /* @__PURE__ */ t(
             "circle",
             {
               cx: "50",
               cy: "50",
-              r: x,
+              r: y,
               fill: "none",
-              stroke: y || "currentColor",
-              strokeWidth: t,
+              stroke: v || "currentColor",
+              strokeWidth: r,
               strokeLinecap: "round",
-              strokeDasharray: m,
+              strokeDasharray: s,
               strokeDashoffset: 0,
-              className: c("text-gray-200 dark:text-slate-700"),
+              className: g("text-gray-200 dark:text-slate-700"),
               style: {
                 transformOrigin: "center",
-                transform: `rotate(${d}deg)`
+                transform: `rotate(${p}deg)`
               }
             }
           ),
-          /* @__PURE__ */ e(
+          /* @__PURE__ */ t(
             "circle",
             {
               cx: "50",
               cy: "50",
-              r: x,
+              r: y,
               fill: "none",
-              stroke: r ? `url(#${u})` : p,
-              strokeWidth: t,
+              stroke: o ? `url(#${x})` : k,
+              strokeWidth: r,
               strokeLinecap: "round",
-              strokeDasharray: m,
-              strokeDashoffset: w,
-              className: c(
-                N && "transition-all duration-1000 ease-out"
-              ),
+              strokeDasharray: s,
+              strokeDashoffset: O,
               style: {
                 transformOrigin: "center",
-                transform: `rotate(${d}deg)`
+                transform: `rotate(${p}deg)`,
+                transitionProperty: e ? "stroke-dashoffset" : void 0,
+                transitionDuration: e ? `${N}ms` : void 0,
+                transitionTimingFunction: e ? "cubic-bezier(0.4, 0, 0.2, 1)" : void 0
               }
             }
           )
         ] }),
-        g && /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center", children: k || /* @__PURE__ */ s("span", { className: "text-2xl font-semibold text-gray-800 dark:text-white", children: [
-          Math.round(v),
+        D && /* @__PURE__ */ t("div", { className: "absolute inset-0 flex items-center justify-center", children: M || /* @__PURE__ */ i("span", { className: "text-2xl font-semibold text-gray-800 dark:text-white", children: [
+          Math.round(w),
           "%"
         ] }) })
       ]
@@ -88,5 +99,5 @@ const B = ({
   );
 };
 export {
-  B as Gauge
+  E as Gauge
 };

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

@@ -20,6 +20,8 @@ export interface GaugeProps extends HTMLAttributes<HTMLDivElement> {
     label?: ReactNode;
     /** Animate on render */
     animated?: boolean;
+    /** Fill transition duration in ms when animated */
+    fillDurationMs?: number;
     /** Arc angle (180 for half, 270 for 3/4, 360 for full) */
     arcAngle?: number;
     /** Gradient colors [start, end] */

package/dist/components/HoverCard/HoverCard.cjs

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),t=require("react"),u=require("./HoverCard.utils.cjs"),c=t.forwardRef(({children:l,cardContent:d,side:o="bottom",align:b="center",openDelay:m=200,closeDelay:v=300,arrow:f=!0,className:g="",...p},y)=>{const[h,a]=t.useState(!1),e=t.useRef(),r=t.useRef(),n=()=>{r.current&&clearTimeout(r.current),e.current=setTimeout(()=>{a(!0)},m)},i=()=>{e.current&&clearTimeout(e.current),r.current=setTimeout(()=>{a(!1)},v)};return t.useEffect(()=>()=>{e.current&&clearTimeout(e.current),r.current&&clearTimeout(r.current)},[]),s.jsxs("div",{ref:y,className:`bear-hover-card relative inline-block ${g}`.trim(),onMouseEnter:n,onMouseLeave:i,...p,children:[l,s.jsx("div",{className:`
-          absolute z-50 w-72
-          ${u.getSideClasses(o,b)}
-          transition-all duration-200
-          ${h?"opacity-100 visible scale-100":"opacity-0 invisible scale-95 pointer-events-none"}
-        `,onMouseEnter:n,onMouseLeave:i,children:s.jsxs("div",{className:"bg-white dark:bg-gray-800 rounded-lg shadow-xl border border-gray-200 dark:border-gray-700 p-4",children:[f&&s.jsx("div",{className:`absolute w-3 h-3 bg-white dark:bg-gray-800 border-gray-200 dark:border-gray-700 ${u.getArrowClasses(o)}`,style:{borderWidth:o==="top"||o==="left"?"0 1px 1px 0":"1px 0 0 1px"}}),d]})})]})});c.displayName="HoverCard";exports.HoverCard=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react/jsx-runtime"),o=require("react"),P=require("../Portal/Portal.cjs"),C=11e3,i=288,u=200;function N(e,l,n){let t=0,r=0;const h=i/2;return l==="bottom"?(t=e.bottom+8,r=e.left+e.width/2-h,n==="start"&&(r=e.left),n==="end"&&(r=e.right-i)):l==="top"?(t=e.top-u-8,r=e.left+e.width/2-h,n==="start"&&(r=e.left),n==="end"&&(r=e.right-i)):l==="right"?(r=e.right+8,t=e.top+e.height/2-u/2,n==="start"&&(t=e.top),n==="end"&&(t=e.bottom-u)):(r=e.left-i-8,t=e.top+e.height/2-u/2,n==="start"&&(t=e.top),n==="end"&&(t=e.bottom-u)),r=Math.max(8,Math.min(r,window.innerWidth-i-8)),t=Math.max(8,Math.min(t,window.innerHeight-u-8)),{position:"fixed",zIndex:C,top:t,left:r,width:i}}const T=o.forwardRef(({children:e,cardContent:l,side:n="bottom",align:m="center",openDelay:t=200,closeDelay:r=300,arrow:h=!0,className:x="",...L},H)=>{const[a,p]=o.useState(!1),[S,j]=o.useState({}),d=o.useRef(),c=o.useRef(),f=o.useRef(null),v=o.useRef(null);o.useEffect(()=>{if(!a||!f.current)return;const s=()=>{const w=f.current.getBoundingClientRect();j(N(w,n,m))};return s(),window.addEventListener("resize",s),window.addEventListener("scroll",s,!0),()=>{window.removeEventListener("resize",s),window.removeEventListener("scroll",s,!0)}},[a,n,m]),o.useEffect(()=>{if(!a)return;const s=w=>{var y,M;const R=w.target;(y=f.current)!=null&&y.contains(R)||(M=v.current)!=null&&M.contains(R)||p(!1)};return document.addEventListener("mousedown",s),()=>document.removeEventListener("mousedown",s)},[a]);const g=()=>{c.current&&clearTimeout(c.current),d.current=setTimeout(()=>p(!0),t)},E=()=>{d.current&&clearTimeout(d.current),c.current=setTimeout(()=>p(!1),r)};return o.useEffect(()=>()=>{d.current&&clearTimeout(d.current),c.current&&clearTimeout(c.current)},[]),b.jsxs("div",{ref:H,className:`bear-hover-card bear-relative bear-inline-block ${x}`.trim(),onMouseEnter:g,onMouseLeave:E,...L,children:[b.jsx("div",{ref:f,className:"bear-inline-block",children:e}),a&&b.jsx(P.Portal,{children:b.jsx("div",{ref:v,style:S,className:`
+              bear-bg-white dark:bear-bg-gray-800 bear-rounded-lg bear-shadow-xl
+              bear-border bear-border-gray-200 dark:bear-border-gray-700 bear-p-4
+              bear-transition-all bear-duration-200
+              ${a?"bear-opacity-100 bear-scale-100":"bear-opacity-0 bear-scale-95"}
+            `,onMouseEnter:g,onMouseLeave:E,children:l})})]})});T.displayName="HoverCard";exports.HoverCard=T;

package/dist/components/HoverCard/HoverCard.js

@@ -1,68 +1,86 @@
-import { jsxs as n, jsx as i } from "react/jsx-runtime";
-import { forwardRef as y, useState as x, useRef as c, useEffect as T } from "react";
-import { getArrowClasses as w, getSideClasses as M } from "./HoverCard.utils.js";
-const k = y(({
-  children: u,
-  cardContent: l,
-  side: t = "bottom",
-  align: d = "center",
-  openDelay: m = 200,
-  closeDelay: b = 300,
-  arrow: f = !0,
-  className: p = "",
-  ...v
-}, g) => {
-  const [h, o] = x(!1), e = c(), r = c(), a = () => {
-    r.current && clearTimeout(r.current), e.current = setTimeout(() => {
-      o(!0);
-    }, m);
-  }, s = () => {
-    e.current && clearTimeout(e.current), r.current = setTimeout(() => {
-      o(!1);
-    }, b);
+import { jsxs as C, jsx as w } from "react/jsx-runtime";
+import { forwardRef as O, useState as R, useRef as c, useEffect as v } from "react";
+import { Portal as P } from "../Portal/Portal.js";
+const S = 11e3, a = 288, s = 200;
+function z(e, u, n) {
+  let t = 0, r = 0;
+  const b = a / 2;
+  return u === "bottom" ? (t = e.bottom + 8, r = e.left + e.width / 2 - b, n === "start" && (r = e.left), n === "end" && (r = e.right - a)) : u === "top" ? (t = e.top - s - 8, r = e.left + e.width / 2 - b, n === "start" && (r = e.left), n === "end" && (r = e.right - a)) : u === "right" ? (r = e.right + 8, t = e.top + e.height / 2 - s / 2, n === "start" && (t = e.top), n === "end" && (t = e.bottom - s)) : (r = e.left - a - 8, t = e.top + e.height / 2 - s / 2, n === "start" && (t = e.top), n === "end" && (t = e.bottom - s)), r = Math.max(8, Math.min(r, window.innerWidth - a - 8)), t = Math.max(8, Math.min(t, window.innerHeight - s - 8)), {
+    position: "fixed",
+    zIndex: S,
+    top: t,
+    left: r,
+    width: a
   };
-  return T(() => () => {
-    e.current && clearTimeout(e.current), r.current && clearTimeout(r.current);
-  }, []), /* @__PURE__ */ n(
+}
+const I = O(({
+  children: e,
+  cardContent: u,
+  side: n = "bottom",
+  align: m = "center",
+  openDelay: t = 200,
+  closeDelay: r = 300,
+  arrow: b = !0,
+  className: x = "",
+  ...H
+}, N) => {
+  const [i, p] = R(!1), [_, k] = R({}), d = c(), l = c(), f = c(null), g = c(null);
+  v(() => {
+    if (!i || !f.current) return;
+    const o = () => {
+      const h = f.current.getBoundingClientRect();
+      k(z(h, n, m));
+    };
+    return o(), window.addEventListener("resize", o), window.addEventListener("scroll", o, !0), () => {
+      window.removeEventListener("resize", o), window.removeEventListener("scroll", o, !0);
+    };
+  }, [i, n, m]), v(() => {
+    if (!i) return;
+    const o = (h) => {
+      var T, y;
+      const M = h.target;
+      (T = f.current) != null && T.contains(M) || (y = g.current) != null && y.contains(M) || p(!1);
+    };
+    return document.addEventListener("mousedown", o), () => document.removeEventListener("mousedown", o);
+  }, [i]);
+  const E = () => {
+    l.current && clearTimeout(l.current), d.current = setTimeout(() => p(!0), t);
+  }, L = () => {
+    d.current && clearTimeout(d.current), l.current = setTimeout(() => p(!1), r);
+  };
+  return v(() => () => {
+    d.current && clearTimeout(d.current), l.current && clearTimeout(l.current);
+  }, []), /* @__PURE__ */ C(
     "div",
     {
-      ref: g,
-      className: `bear-hover-card relative inline-block ${p}`.trim(),
-      onMouseEnter: a,
-      onMouseLeave: s,
-      ...v,
+      ref: N,
+      className: `bear-hover-card bear-relative bear-inline-block ${x}`.trim(),
+      onMouseEnter: E,
+      onMouseLeave: L,
+      ...H,
       children: [
-        u,
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ w("div", { ref: f, className: "bear-inline-block", children: e }),
+        i && /* @__PURE__ */ w(P, { children: /* @__PURE__ */ w(
           "div",
           {
+            ref: g,
+            style: _,
             className: `
-          absolute z-50 w-72
-          ${M(t, d)}
-          transition-all duration-200
-          ${h ? "opacity-100 visible scale-100" : "opacity-0 invisible scale-95 pointer-events-none"}
-        `,
-            onMouseEnter: a,
-            onMouseLeave: s,
-            children: /* @__PURE__ */ n("div", { className: "bg-white dark:bg-gray-800 rounded-lg shadow-xl border border-gray-200 dark:border-gray-700 p-4", children: [
-              f && /* @__PURE__ */ i(
-                "div",
-                {
-                  className: `absolute w-3 h-3 bg-white dark:bg-gray-800 border-gray-200 dark:border-gray-700 ${w(t)}`,
-                  style: {
-                    borderWidth: t === "top" || t === "left" ? "0 1px 1px 0" : "1px 0 0 1px"
-                  }
-                }
-              ),
-              l
-            ] })
+              bear-bg-white dark:bear-bg-gray-800 bear-rounded-lg bear-shadow-xl
+              bear-border bear-border-gray-200 dark:bear-border-gray-700 bear-p-4
+              bear-transition-all bear-duration-200
+              ${i ? "bear-opacity-100 bear-scale-100" : "bear-opacity-0 bear-scale-95"}
+            `,
+            onMouseEnter: E,
+            onMouseLeave: L,
+            children: u
           }
-        )
+        ) })
       ]
     }
   );
 });
-k.displayName = "HoverCard";
+I.displayName = "HoverCard";
 export {
-  k as HoverCard
+  I as HoverCard
 };

package/dist/components/Icon/icons/commerce.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),c=require("../Icon.cjs"),x=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("circle",{cx:"9",cy:"21",r:"1"}),n.jsx("circle",{cx:"20",cy:"21",r:"1"}),n.jsx("path",{d:"M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6"})]}),o=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("path",{d:"M6 2L3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z"}),n.jsx("line",{x1:"3",y1:"6",x2:"21",y2:"6"}),n.jsx("path",{d:"M16 10a4 4 0 0 1-8 0"})]}),t=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("rect",{x:"1",y:"4",width:"22",height:"16",rx:"2",ry:"2"}),n.jsx("line",{x1:"1",y1:"10",x2:"23",y2:"10"})]}),h=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("line",{x1:"12",y1:"1",x2:"12",y2:"23"}),n.jsx("path",{d:"M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"})]}),j=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("path",{d:"M4 10h12"}),n.jsx("path",{d:"M4 14h12"}),n.jsx("path",{d:"M19 6a7.7 7.7 0 0 0-5.2-2A7.9 7.9 0 0 0 6 12a7.9 7.9 0 0 0 7.8 8 7.7 7.7 0 0 0 5.2-2"})]}),a=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("path",{d:"M4 18h12"}),n.jsx("path",{d:"M4 14h8"}),n.jsx("path",{d:"M17 4a4 4 0 0 0-7.4 2.1L8 18"})]}),e=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("rect",{x:"2",y:"6",width:"20",height:"14",rx:"2"}),n.jsx("path",{d:"M2 10h20"}),n.jsx("path",{d:"M16 14h2"})]}),i=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("path",{d:"M4 2v20l2-1 2 1 2-1 2 1 2-1 2 1 2-1 2 1V2l-2 1-2-1-2 1-2-1-2 1-2-1-2 1-2-1z"}),n.jsx("line",{x1:"8",y1:"8",x2:"16",y2:"8"}),n.jsx("line",{x1:"8",y1:"12",x2:"16",y2:"12"}),n.jsx("line",{x1:"8",y1:"16",x2:"12",y2:"16"})]}),l=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("path",{d:"M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"}),n.jsx("line",{x1:"7",y1:"7",x2:"7.01",y2:"7"})]}),d=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("path",{d:"M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"}),n.jsx("line",{x1:"7",y1:"7",x2:"7.01",y2:"7"}),n.jsx("path",{d:"M22 7l-8.97 8.97"})]}),r=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("line",{x1:"19",y1:"5",x2:"5",y2:"19"}),n.jsx("circle",{cx:"6.5",cy:"6.5",r:"2.5"}),n.jsx("circle",{cx:"17.5",cy:"17.5",r:"2.5"})]}),p=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("polyline",{points:"23 6 13.5 15.5 8.5 10.5 1 18"}),n.jsx("polyline",{points:"17 6 23 6 23 12"})]}),I=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("polyline",{points:"23 18 13.5 8.5 8.5 13.5 1 6"}),n.jsx("polyline",{points:"17 18 23 18 23 12"})]}),y=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("path",{d:"M3 5v14"}),n.jsx("path",{d:"M8 5v14"}),n.jsx("path",{d:"M12 5v14"}),n.jsx("path",{d:"M17 5v14"}),n.jsx("path",{d:"M21 5v14"}),n.jsx("path",{d:"M6 5v14"}),n.jsx("path",{d:"M14 5v14"}),n.jsx("path",{d:"M10 5v14"}),n.jsx("path",{d:"M19 5v14"})]}),M=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("polyline",{points:"20 12 20 22 4 22 4 12"}),n.jsx("rect",{x:"2",y:"7",width:"20",height:"5"}),n.jsx("line",{x1:"12",y1:"22",x2:"12",y2:"7"}),n.jsx("path",{d:"M12 7H7.5a2.5 2.5 0 0 1 0-5C11 2 12 7 12 7z"}),n.jsx("path",{d:"M12 7h4.5a2.5 2.5 0 0 0 0-5C13 2 12 7 12 7z"})]}),v=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("path",{d:"M3 9l1-4h16l1 4"}),n.jsx("path",{d:"M3 9v10a1 1 0 0 0 1 1h16a1 1 0 0 0 1-1V9"}),n.jsx("path",{d:"M9 21V12h6v9"}),n.jsx("path",{d:"M3 9a3 3 0 0 0 3 3 3 3 0 0 0 3-3"}),n.jsx("path",{d:"M9 9a3 3 0 0 0 3 3 3 3 0 0 0 3-3"}),n.jsx("path",{d:"M15 9a3 3 0 0 0 3 3 3 3 0 0 0 3-3"})]}),g=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("rect",{x:"1",y:"3",width:"15",height:"13"}),n.jsx("polygon",{points:"16 8 20 8 23 11 23 16 16 16 16 8"}),n.jsx("circle",{cx:"5.5",cy:"18.5",r:"2.5"}),n.jsx("circle",{cx:"18.5",cy:"18.5",r:"2.5"})]}),u=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("line",{x1:"16.5",y1:"9.4",x2:"7.5",y2:"4.21"}),n.jsx("path",{d:"M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"}),n.jsx("polyline",{points:"3.27 6.96 12 12.01 20.73 6.96"}),n.jsx("line",{x1:"12",y1:"22.08",x2:"12",y2:"12"})]}),T=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("path",{d:"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"}),n.jsx("polyline",{points:"14 2 14 8 20 8"}),n.jsx("line",{x1:"8",y1:"13",x2:"16",y2:"13"}),n.jsx("line",{x1:"8",y1:"17",x2:"12",y2:"17"}),n.jsx("line",{x1:"14",y1:"17",x2:"16",y2:"17"})]}),C=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("rect",{x:"2",y:"7",width:"20",height:"14",rx:"2",ry:"2"}),n.jsx("path",{d:"M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16"})]}),S=s=>n.jsxs(c.Icon,{...s,children:[n.jsx("path",{d:"M3 22h18"}),n.jsx("path",{d:"M6 18v-4"}),n.jsx("path",{d:"M10 18v-4"}),n.jsx("path",{d:"M14 18v-4"}),n.jsx("path",{d:"M18 18v-4"}),n.jsx("path",{d:"M3 10l9-7 9 7"}),n.jsx("path",{d:"M3 10h18v4H3z"})]});exports.BankIcon=S;exports.BarCodeIcon=y;exports.BriefcaseIcon=C;exports.CreditCardIcon=t;exports.DollarSignIcon=h;exports.EuroIcon=j;exports.GiftIcon=M;exports.InvoiceIcon=T;exports.PackageIcon=u;exports.PercentIcon=r;exports.PoundIcon=a;exports.ReceiptIcon=i;exports.ShoppingBagIcon=o;exports.ShoppingCartIcon=x;exports.StoreIcon=v;exports.TagIcon=l;exports.TagsIcon=d;exports.TrendDownIcon=I;exports.TrendUpIcon=p;exports.TruckIcon=g;exports.WalletIcon=e;