@forgedevstack/bear 1.2.0 → 1.2.1

package/dist/components/Cascader/Cascader.js

@@ -1,218 +1,181 @@
-import { jsxs as h, jsx as c } from "react/jsx-runtime";
-import { useState as R, useRef as H, useMemo as O, useEffect as P, useCallback as w } from "react";
+import { jsxs as h, jsx as o } from "react/jsx-runtime";
+import { useState as E, useRef as M, useMemo as A, useEffect as g, useCallback as x } from "react";
 import { createPortal as $ } from "react-dom";
-import { cn as y } from "../../utils/cn.js";
-import { CASCADER_DEFAULT_TRANSLATIONS as ee, CASCADER_PATH_SEPARATOR as re, CASCADER_VARIANT_CLASSES as ae, CASCADER_SIZE_CLASSES as te, CASCADER_DROPDOWN_Z_INDEX as ne } from "./Cascader.const.js";
-const ce = ({
-  options: b,
-  selectedPath: s,
-  expandedPath: o,
-  onSelect: B,
-  onExpand: p,
-  expandTrigger: k,
-  level: i
-}) => {
-  const m = (a) => {
-    var d;
-    B(a, i), (d = a.children) != null && d.length && p(a, i);
-  }, v = (a) => {
-    var d;
-    k === "hover" && ((d = a.children) != null && d.length) && p(a, i);
-  };
-  return /* @__PURE__ */ c("div", { className: "Bear-Cascader__panel bear-min-w-[180px] bear-max-h-[280px] bear-overflow-y-auto bear-border-r bear-border-zinc-200 dark:bear-border-zinc-700 last:bear-border-r-0", children: b.map((a) => {
-    const d = s[i] === a.value, C = o[i] === a.value, N = a.children && a.children.length > 0;
-    return /* @__PURE__ */ h(
-      "button",
-      {
-        type: "button",
-        disabled: a.disabled,
-        onClick: () => m(a),
-        onMouseEnter: () => v(a),
-        className: y(
-          "Bear-Cascader__option bear-w-full bear-flex bear-items-center bear-justify-between bear-px-3 bear-py-2 bear-text-sm bear-text-left bear-transition-colors",
-          d && "Bear-Cascader__option--selected bear-bg-pink-500/20 bear-text-pink-600 dark:bear-text-pink-400",
-          C && !d && "Bear-Cascader__option--expanded bear-bg-gray-100 dark:bear-bg-zinc-700",
-          !d && !C && "bear-text-gray-700 dark:bear-text-zinc-300 hover:bear-bg-gray-100 dark:hover:bear-bg-zinc-700",
-          a.disabled && "Bear-Cascader__option--disabled bear-opacity-50 bear-cursor-not-allowed"
-        ),
-        children: [
-          /* @__PURE__ */ h("span", { className: "bear-flex bear-items-center bear-gap-2", children: [
-            a.icon && /* @__PURE__ */ c("span", { className: "Bear-Cascader__option-icon", children: a.icon }),
-            /* @__PURE__ */ c("span", { className: "Bear-Cascader__option-label", children: a.label })
-          ] }),
-          N && /* @__PURE__ */ c("svg", { className: "Bear-Cascader__arrow bear-w-4 bear-h-4 bear-text-gray-500 dark:bear-text-zinc-500", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ c("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" }) })
-        ]
-      },
-      a.value
-    );
-  }) });
-}, be = ({
-  options: b,
+import { cn as N } from "../../utils/cn.js";
+import { CASCADER_DEFAULT_TRANSLATIONS as ee, CASCADER_PATH_SEPARATOR as re, CASCADER_VARIANT_CLASSES as te, CASCADER_SIZE_CLASSES as ae, CASCADER_DROPDOWN_Z_INDEX as ne } from "./Cascader.const.js";
+import { CascaderPanel as oe } from "./components/CascaderPanel/CascaderPanel.js";
+const fe = ({
+  options: i,
   value: s = [],
-  onChange: o,
-  placeholder: B,
-  label: p,
-  helperText: k,
-  error: i,
+  onChange: c,
+  placeholder: I,
+  label: y,
+  helperText: L,
+  error: u,
   disabled: m = !1,
-  loading: v = !1,
-  clearable: a = !0,
-  size: d = "md",
-  variant: C = "default",
-  expandTrigger: N = "click",
-  showFullPath: D = !0,
-  pathSeparator: j = re,
-  changeOnSelect: M = !1,
-  className: U,
-  testId: V,
-  translations: T,
-  icon: Y
+  loading: W = !1,
+  clearable: T = !0,
+  size: Z = "md",
+  variant: H = "default",
+  expandTrigger: U = "click",
+  showFullPath: S = !0,
+  pathSeparator: z = re,
+  changeOnSelect: B = !1,
+  className: V,
+  testId: X,
+  translations: R,
+  icon: q
 }) => {
-  const [x, E] = R(!1), [_, A] = R([]), [I, q] = R({ top: 0, left: 0 }), W = H(null), z = H(null), S = O(() => ({
+  const [b, w] = E(!1), [f, _] = E([]), [O, F] = E({ top: 0, left: 0 }), P = M(null), k = M(null), v = A(() => ({
     ...ee,
-    ...T
-  }), [T]);
-  P(() => {
-    if (x && z.current) {
-      const e = z.current.getBoundingClientRect(), t = window.scrollY || document.documentElement.scrollTop, r = window.scrollX || document.documentElement.scrollLeft;
-      q({
-        top: e.bottom + t + 8,
-        left: e.left + r
+    ...R
+  }), [R]);
+  g(() => {
+    if (!b || !k.current) return;
+    const e = () => {
+      const t = k.current.getBoundingClientRect(), r = Math.min(560, window.innerWidth - 16);
+      let a = Math.max(8, Math.min(t.left, window.innerWidth - r - 8));
+      F({
+        top: t.bottom + 8,
+        left: a
       });
-    }
-  }, [x]), P(() => {
+    };
+    return e(), window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), () => {
+      window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
+    };
+  }, [b]), g(() => {
     const e = (t) => {
-      var n, l;
+      var a, n;
       const r = t.target;
-      (n = W.current) != null && n.contains(r) || (l = r.closest) != null && l.call(r, "[data-bear-cascader-dropdown]") || E(!1);
+      (a = P.current) != null && a.contains(r) || (n = r.closest) != null && n.call(r, "[data-bear-cascader-dropdown]") || w(!1);
     };
     return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
-  }, []), P(() => {
-    s.length > 0 && A(s.slice(0, -1));
+  }, []), g(() => {
+    s.length > 0 && _(s.slice(0, -1));
   }, [s]);
-  const F = w((e, t) => {
+  const G = x((e, t) => {
     for (const r of e) {
       if (r.value === t) return r;
       if (r.children) {
-        const n = F(r.children, t);
-        if (n) return n;
+        const a = G(r.children, t);
+        if (a) return a;
       }
     }
-  }, []), X = O(() => {
+  }, []), D = A(() => {
     var t;
     if (s.length === 0) return "";
-    const e = s.map((r, n) => {
-      let l = b;
-      for (let f = 0; f < n; f++) {
-        const u = l.find((L) => L.value === s[f]);
-        u != null && u.children && (l = u.children);
+    const e = s.map((r, a) => {
+      let n = i;
+      for (let d = 0; d < a; d++) {
+        const l = n.find((C) => C.value === s[d]);
+        l != null && l.children && (n = l.children);
       }
-      return l.find((f) => f.value === r);
+      return n.find((d) => d.value === r);
     }).filter(Boolean);
-    return D ? e.map((r) => r.label).join(j) : ((t = e[e.length - 1]) == null ? void 0 : t.label) || "";
-  }, [s, b, D, j]), Z = O(() => {
-    const e = [b];
-    let t = b;
-    for (const r of _) {
-      const n = t.find((l) => l.value === r);
-      if (n != null && n.children)
-        e.push(n.children), t = n.children;
+    return S ? e.map((r) => r.label).join(z) : ((t = e[e.length - 1]) == null ? void 0 : t.label) || "";
+  }, [s, i, S, z]), j = A(() => {
+    const e = [i];
+    let t = i;
+    for (const r of f) {
+      const a = t.find((n) => n.value === r);
+      if (a != null && a.children)
+        e.push(a.children), t = a.children;
       else
         break;
     }
     return e;
-  }, [b, _]), G = w((e, t) => {
-    var n, l;
-    const r = [..._.slice(0, t), e.value];
-    if (!((n = e.children) != null && n.length) || M) {
-      const f = [];
-      let u = b;
-      for (const L of r) {
-        const g = u.find((Q) => Q.value === L);
-        g && (f.push(g), g.children && (u = g.children));
+  }, [i, f]), J = x((e, t) => {
+    var a, n;
+    const r = [...f.slice(0, t), e.value];
+    if (!((a = e.children) != null && a.length) || B) {
+      const d = [];
+      let l = i;
+      for (const C of r) {
+        const p = l.find((Y) => Y.value === C);
+        p && (d.push(p), p.children && (l = p.children));
       }
-      o == null || o(r, f), (l = e.children) != null && l.length || E(!1);
+      c == null || c(r, d), (n = e.children) != null && n.length || w(!1);
     }
-  }, [_, b, o, M]), J = w((e, t) => {
-    A((r) => [...r.slice(0, t), e.value]);
-  }, []), K = w((e) => {
-    e.stopPropagation(), o == null || o([], []), A([]);
-  }, [o]);
+  }, [f, i, c, B]), K = x((e, t) => {
+    _((r) => [...r.slice(0, t), e.value]);
+  }, []), Q = x((e) => {
+    e.stopPropagation(), c == null || c([], []), _([]);
+  }, [c]);
   return /* @__PURE__ */ h(
     "div",
     {
-      ref: W,
-      className: y("Bear-Cascader bear-relative", U),
-      "data-testid": V,
+      ref: P,
+      className: N("Bear-Cascader bear-relative", V),
+      "data-testid": X,
       children: [
-        p && /* @__PURE__ */ c("label", { className: "Bear-Cascader__label bear-block bear-text-sm bear-font-medium bear-text-zinc-700 dark:bear-text-zinc-300 bear-mb-1.5", children: p }),
+        y && /* @__PURE__ */ o("label", { className: "Bear-Cascader__label bear-block bear-text-sm bear-font-medium bear-text-zinc-700 dark:bear-text-zinc-300 bear-mb-1.5", children: y }),
         /* @__PURE__ */ h(
           "button",
           {
-            ref: z,
+            ref: k,
             type: "button",
-            onClick: () => !m && E(!x),
+            onClick: () => !m && w(!b),
             disabled: m,
-            className: y(
+            className: N(
               "Bear-Cascader__trigger bear-w-full bear-flex bear-items-center bear-justify-between bear-rounded-lg bear-border bear-text-left bear-transition-colors",
-              te[d],
-              ae[C],
-              i ? "bear-border-red-500" : "focus:bear-border-pink-500",
+              ae[Z],
+              te[H],
+              u ? "bear-border-red-500" : "focus:bear-border-pink-500",
               m && "bear-opacity-50 bear-cursor-not-allowed",
-              X ? "bear-text-gray-900 dark:bear-text-white" : "bear-text-gray-500 dark:bear-text-zinc-500"
+              D ? "bear-text-gray-900 dark:bear-text-white" : "bear-text-gray-500 dark:bear-text-zinc-500"
             ),
             children: [
-              /* @__PURE__ */ c("span", { className: "Bear-Cascader__value bear-truncate bear-flex-1", children: v ? S.loading : X || B || S.placeholder }),
+              /* @__PURE__ */ o("span", { className: "Bear-Cascader__value bear-truncate bear-flex-1", children: W ? v.loading : D || I || v.placeholder }),
               /* @__PURE__ */ h("span", { className: "Bear-Cascader__icons bear-flex bear-items-center bear-gap-1", children: [
-                a && s.length > 0 && !m && /* @__PURE__ */ c(
+                T && s.length > 0 && !m && /* @__PURE__ */ o(
                   "span",
                   {
-                    onClick: K,
+                    onClick: Q,
                     className: "Bear-Cascader__clear bear-p-0.5 bear-rounded hover:bear-bg-gray-200 dark:hover:bear-bg-zinc-700 bear-cursor-pointer",
-                    children: /* @__PURE__ */ c("svg", { className: "bear-w-4 bear-h-4 bear-text-gray-500 dark:bear-text-zinc-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ c("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
+                    children: /* @__PURE__ */ o("svg", { className: "bear-w-4 bear-h-4 bear-text-gray-500 dark:bear-text-zinc-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ o("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
                   }
                 ),
-                Y ?? /* @__PURE__ */ c(
+                q ?? /* @__PURE__ */ o(
                   "svg",
                   {
-                    className: y(
+                    className: N(
                       "Bear-Cascader__chevron bear-w-4 bear-h-4 bear-text-gray-500 dark:bear-text-zinc-400 bear-transition-transform",
-                      x && "bear-rotate-180"
+                      b && "bear-rotate-180"
                     ),
                     fill: "none",
                     viewBox: "0 0 24 24",
                     stroke: "currentColor",
-                    children: /* @__PURE__ */ c("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" })
+                    children: /* @__PURE__ */ o("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" })
                   }
                 )
               ] })
             ]
           }
         ),
-        i && /* @__PURE__ */ c("p", { className: "Bear-Cascader__error bear-mt-1 bear-text-xs bear-text-red-400", children: i }),
-        k && !i && /* @__PURE__ */ c("p", { className: "Bear-Cascader__helper bear-mt-1 bear-text-xs bear-text-zinc-500 dark:bear-text-zinc-400", children: k }),
-        x && typeof document < "u" && $(
+        u && /* @__PURE__ */ o("p", { className: "Bear-Cascader__error bear-mt-1 bear-text-xs bear-text-red-400", children: u }),
+        L && !u && /* @__PURE__ */ o("p", { className: "Bear-Cascader__helper bear-mt-1 bear-text-xs bear-text-zinc-500 dark:bear-text-zinc-400", children: L }),
+        b && typeof document < "u" && $(
           /* @__PURE__ */ h(
             "div",
             {
               "data-bear-cascader-dropdown": !0,
-              className: "Bear-Cascader__dropdown bear-fixed bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-zinc-200 dark:bear-border-zinc-700 bear-rounded-lg bear-shadow-xl bear-flex bear-overflow-hidden",
-              style: { top: I.top, left: I.left, zIndex: ne },
+              className: "Bear-Cascader__dropdown bear-fixed bear-max-w-[calc(100vw-16px)] bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-zinc-200 dark:bear-border-zinc-700 bear-rounded-lg bear-shadow-xl bear-flex bear-flex-col sm:bear-flex-row bear-overflow-hidden",
+              style: { top: O.top, left: O.left, zIndex: ne },
               children: [
-                Z.map((e, t) => /* @__PURE__ */ c(
-                  ce,
+                j.map((e, t) => /* @__PURE__ */ o(
+                  oe,
                   {
                     options: e,
                     selectedPath: s,
-                    expandedPath: _,
-                    onSelect: G,
-                    onExpand: J,
-                    expandTrigger: N,
+                    expandedPath: f,
+                    onSelect: J,
+                    onExpand: K,
+                    expandTrigger: U,
                     level: t
                   },
                   t
                 )),
-                Z.every((e) => e.length === 0) && /* @__PURE__ */ c("div", { className: "Bear-Cascader__empty bear-px-4 bear-py-3 bear-text-sm bear-text-gray-500 dark:bear-text-zinc-500", children: S.noOptions })
+                j.every((e) => e.length === 0) && /* @__PURE__ */ o("div", { className: "Bear-Cascader__empty bear-px-4 bear-py-3 bear-text-sm bear-text-gray-500 dark:bear-text-zinc-500", children: v.noOptions })
               ]
             }
           ),
@@ -223,5 +186,5 @@ const ce = ({
   );
 };
 export {
-  be as Cascader
+  fe as Cascader
 };

package/dist/components/Cascader/components/CascaderPanel/CascaderPanel.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),u=require("../../../../utils/cn.cjs");require("react");const g=({options:t,selectedPath:b,expandedPath:d,onSelect:l,onExpand:n,expandTrigger:i,level:s})=>{const o=e=>{var r;l(e,s),(r=e.children)!=null&&r.length&&n(e,s)},h=e=>{var r;i==="hover"&&((r=e.children)!=null&&r.length)&&n(e,s)};return a.jsx("div",{className:"Bear-Cascader__panel bear-min-w-[180px] bear-max-h-[280px] bear-overflow-y-auto bear-border-r bear-border-zinc-200 dark:bear-border-zinc-700 last:bear-border-r-0",children:t.map(e=>{const r=b[s]===e.value,c=d[s]===e.value,x=e.children&&e.children.length>0;return a.jsxs("button",{type:"button",disabled:e.disabled,onClick:()=>o(e),onMouseEnter:()=>h(e),className:u.cn("Bear-Cascader__option bear-w-full bear-flex bear-items-center bear-justify-between bear-px-3 bear-py-2 bear-text-sm bear-text-left bear-transition-colors",r&&"Bear-Cascader__option--selected bear-bg-pink-500/20 bear-text-pink-600 dark:bear-text-pink-400",c&&!r&&"Bear-Cascader__option--expanded bear-bg-gray-100 dark:bear-bg-zinc-700",!r&&!c&&"bear-text-gray-700 dark:bear-text-zinc-300 hover:bear-bg-gray-100 dark:hover:bear-bg-zinc-700",e.disabled&&"Bear-Cascader__option--disabled bear-opacity-50 bear-cursor-not-allowed"),children:[a.jsxs("span",{className:"bear-flex bear-items-center bear-gap-2",children:[e.icon&&a.jsx("span",{className:"Bear-Cascader__option-icon",children:e.icon}),a.jsx("span",{className:"Bear-Cascader__option-label",children:e.label})]}),x&&a.jsx("svg",{className:"Bear-Cascader__arrow bear-w-4 bear-h-4 bear-text-gray-500 dark:bear-text-zinc-500",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:a.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 5l7 7-7 7"})})]},e.value)})})};exports.CascaderPanel=g;

package/dist/components/Cascader/components/CascaderPanel/CascaderPanel.d.ts

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

package/dist/components/Cascader/components/CascaderPanel/CascaderPanel.js

@@ -0,0 +1,50 @@
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { cn as u } from "../../../../utils/cn.js";
+import "react";
+const p = ({
+  options: t,
+  selectedPath: d,
+  expandedPath: l,
+  onSelect: i,
+  onExpand: n,
+  expandTrigger: o,
+  level: a
+}) => {
+  const h = (e) => {
+    var r;
+    i(e, a), (r = e.children) != null && r.length && n(e, a);
+  }, x = (e) => {
+    var r;
+    o === "hover" && ((r = e.children) != null && r.length) && n(e, a);
+  };
+  return /* @__PURE__ */ s("div", { className: "Bear-Cascader__panel bear-min-w-[180px] bear-max-h-[280px] bear-overflow-y-auto bear-border-r bear-border-zinc-200 dark:bear-border-zinc-700 last:bear-border-r-0", children: t.map((e) => {
+    const r = d[a] === e.value, b = l[a] === e.value, m = e.children && e.children.length > 0;
+    return /* @__PURE__ */ c(
+      "button",
+      {
+        type: "button",
+        disabled: e.disabled,
+        onClick: () => h(e),
+        onMouseEnter: () => x(e),
+        className: u(
+          "Bear-Cascader__option bear-w-full bear-flex bear-items-center bear-justify-between bear-px-3 bear-py-2 bear-text-sm bear-text-left bear-transition-colors",
+          r && "Bear-Cascader__option--selected bear-bg-pink-500/20 bear-text-pink-600 dark:bear-text-pink-400",
+          b && !r && "Bear-Cascader__option--expanded bear-bg-gray-100 dark:bear-bg-zinc-700",
+          !r && !b && "bear-text-gray-700 dark:bear-text-zinc-300 hover:bear-bg-gray-100 dark:hover:bear-bg-zinc-700",
+          e.disabled && "Bear-Cascader__option--disabled bear-opacity-50 bear-cursor-not-allowed"
+        ),
+        children: [
+          /* @__PURE__ */ c("span", { className: "bear-flex bear-items-center bear-gap-2", children: [
+            e.icon && /* @__PURE__ */ s("span", { className: "Bear-Cascader__option-icon", children: e.icon }),
+            /* @__PURE__ */ s("span", { className: "Bear-Cascader__option-label", children: e.label })
+          ] }),
+          m && /* @__PURE__ */ s("svg", { className: "Bear-Cascader__arrow bear-w-4 bear-h-4 bear-text-gray-500 dark:bear-text-zinc-500", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" }) })
+        ]
+      },
+      e.value
+    );
+  }) });
+};
+export {
+  p as CascaderPanel
+};

package/dist/components/Cascader/components/CascaderPanel/index.d.ts

@@ -0,0 +1 @@
+export { CascaderPanel } from './CascaderPanel';

package/dist/components/Chart/BarChart.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("../../utils/cn.cjs");require("react");const f=require("./Chart.utils.cjs"),v=({data:s,height:m=200,showLabels:x=!0,showValues:i=!1,animated:o=!0,color:u,orientation:g="vertical",barRadius:a=4,barGap:d=.2,className:p,...j})=>{const h=Math.max(...s.map(t=>t.value));return e.jsx("div",{className:n.cn("w-full",p),style:{height:m},...j,children:g==="vertical"?e.jsx("div",{className:"flex items-end justify-between h-full",style:{gap:`${d}rem`},children:s.map((t,l)=>{const r=t.value/h*100,c=f.getChartColor(l,t.color||u);return e.jsxs("div",{className:"flex-1 flex flex-col items-center gap-1",children:[e.jsx("div",{className:"w-full flex-1 flex items-end",children:e.jsx("div",{className:n.cn("w-full transition-all duration-500 ease-out",o&&"animate-grow-up"),style:{height:`${r}%`,backgroundColor:c,borderRadius:`${a}px ${a}px 0 0`,opacity:.9}})}),i&&e.jsx("span",{className:"text-xs text-gray-500 dark:text-slate-400",children:t.value}),x&&e.jsx("span",{className:"text-xs text-gray-600 dark:text-slate-300 truncate max-w-full",children:t.label})]},l)})}):e.jsx("div",{className:"flex flex-col justify-between h-full",style:{gap:`${d}rem`},children:s.map((t,l)=>{const r=t.value/h*100,c=f.getChartColor(l,t.color||u);return e.jsxs("div",{className:"flex-1 flex items-center gap-2",children:[x&&e.jsx("span",{className:"text-xs text-gray-600 dark:text-slate-300 w-16 truncate",children:t.label}),e.jsx("div",{className:"flex-1 h-full flex items-center",children:e.jsx("div",{className:n.cn("h-3/4 transition-all duration-500 ease-out",o&&"animate-grow-right"),style:{width:`${r}%`,backgroundColor:c,borderRadius:`0 ${a}px ${a}px 0`,opacity:.9}})}),i&&e.jsx("span",{className:"text-xs text-gray-500 dark:text-slate-400 w-10 text-right",children:t.value})]},l)})})})};exports.BarChart=v;

package/dist/components/Chart/BarChart.d.ts

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

package/dist/components/Chart/BarChart.js

@@ -0,0 +1,65 @@
+import { jsx as l, jsxs as f } from "react/jsx-runtime";
+import { cn as n } from "../../utils/cn.js";
+import "react";
+import { getChartColor as h } from "./Chart.utils.js";
+const C = ({
+  data: r,
+  height: p = 200,
+  showLabels: o = !0,
+  showValues: i = !1,
+  animated: x = !0,
+  color: d,
+  orientation: g = "vertical",
+  barRadius: a = 4,
+  barGap: m = 0.2,
+  className: v,
+  ...y
+}) => {
+  const u = Math.max(...r.map((e) => e.value));
+  return /* @__PURE__ */ l("div", { className: n("w-full", v), style: { height: p }, ...y, children: g === "vertical" ? /* @__PURE__ */ l("div", { className: "flex items-end justify-between h-full", style: { gap: `${m}rem` }, children: r.map((e, t) => {
+    const s = e.value / u * 100, c = h(t, e.color || d);
+    return /* @__PURE__ */ f("div", { className: "flex-1 flex flex-col items-center gap-1", children: [
+      /* @__PURE__ */ l("div", { className: "w-full flex-1 flex items-end", children: /* @__PURE__ */ l(
+        "div",
+        {
+          className: n(
+            "w-full transition-all duration-500 ease-out",
+            x && "animate-grow-up"
+          ),
+          style: {
+            height: `${s}%`,
+            backgroundColor: c,
+            borderRadius: `${a}px ${a}px 0 0`,
+            opacity: 0.9
+          }
+        }
+      ) }),
+      i && /* @__PURE__ */ l("span", { className: "text-xs text-gray-500 dark:text-slate-400", children: e.value }),
+      o && /* @__PURE__ */ l("span", { className: "text-xs text-gray-600 dark:text-slate-300 truncate max-w-full", children: e.label })
+    ] }, t);
+  }) }) : /* @__PURE__ */ l("div", { className: "flex flex-col justify-between h-full", style: { gap: `${m}rem` }, children: r.map((e, t) => {
+    const s = e.value / u * 100, c = h(t, e.color || d);
+    return /* @__PURE__ */ f("div", { className: "flex-1 flex items-center gap-2", children: [
+      o && /* @__PURE__ */ l("span", { className: "text-xs text-gray-600 dark:text-slate-300 w-16 truncate", children: e.label }),
+      /* @__PURE__ */ l("div", { className: "flex-1 h-full flex items-center", children: /* @__PURE__ */ l(
+        "div",
+        {
+          className: n(
+            "h-3/4 transition-all duration-500 ease-out",
+            x && "animate-grow-right"
+          ),
+          style: {
+            width: `${s}%`,
+            backgroundColor: c,
+            borderRadius: `0 ${a}px ${a}px 0`,
+            opacity: 0.9
+          }
+        }
+      ) }),
+      i && /* @__PURE__ */ l("span", { className: "text-xs text-gray-500 dark:text-slate-400 w-10 text-right", children: e.value })
+    ] }, t);
+  }) }) });
+};
+export {
+  C as BarChart
+};

package/dist/components/Chart/Chart.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),C=require("react"),d=require("../../utils/cn.cjs"),w=require("./Chart.utils.cjs"),M=({data:r,height:o=200,showLabels:y=!0,showValues:f=!1,animated:h=!0,color:m,orientation:p="vertical",barRadius:i=4,barGap:$=.2,className:j,...v})=>{const n=Math.max(...r.map(l=>l.value));return e.jsx("div",{className:d.cn("w-full",j),style:{height:o},...v,children:p==="vertical"?e.jsx("div",{className:"flex items-end justify-between h-full gap-2",children:r.map((l,a)=>{const t=l.value/n*100,s=w.getChartColor(a,l.color||m);return e.jsxs("div",{className:"flex-1 flex flex-col items-center gap-1",children:[e.jsx("div",{className:"w-full flex-1 flex items-end",children:e.jsx("div",{className:d.cn("w-full transition-all duration-500 ease-out",h&&"animate-grow-up"),style:{height:`${t}%`,backgroundColor:s,borderRadius:`${i}px ${i}px 0 0`,opacity:.9}})}),f&&e.jsx("span",{className:"text-xs text-gray-500 dark:text-slate-400",children:l.value}),y&&e.jsx("span",{className:"text-xs text-gray-600 dark:text-slate-300 truncate max-w-full",children:l.label})]},a)})}):e.jsx("div",{className:"flex flex-col justify-between h-full gap-2",children:r.map((l,a)=>{const t=l.value/n*100,s=w.getChartColor(a,l.color||m);return e.jsxs("div",{className:"flex-1 flex items-center gap-2",children:[y&&e.jsx("span",{className:"text-xs text-gray-600 dark:text-slate-300 w-16 truncate",children:l.label}),e.jsx("div",{className:"flex-1 h-full flex items-center",children:e.jsx("div",{className:d.cn("h-3/4 transition-all duration-500 ease-out",h&&"animate-grow-right"),style:{width:`${t}%`,backgroundColor:s,borderRadius:`0 ${i}px ${i}px 0`,opacity:.9}})}),f&&e.jsx("span",{className:"text-xs text-gray-500 dark:text-slate-400 w-10 text-right",children:l.value})]},a)})})})},R=({data:r,height:o=200,showLabels:y=!0,showDots:f=!0,smooth:h=!0,fill:m=!1,strokeWidth:p=2,color:i="#ec4899",animated:$=!0,className:j,...v})=>{const n=C.useMemo(()=>{const t=Math.max(...r.map(c=>c.value)),s=Math.min(...r.map(c=>c.value)),x=t-s||1;return r.map((c,u)=>({x:u/(r.length-1||1)*100,y:100-(c.value-s)/x*80-10,...c}))},[r]),l=C.useMemo(()=>n.length===0?"":h?n.reduce((t,s,x,c)=>{if(x===0)return`M ${s.x},${s.y}`;const u=c[x-1],g=u.x+(s.x-u.x)/3,N=s.x-(s.x-u.x)/3;return`${t} C ${g},${u.y} ${N},${s.y} ${s.x},${s.y}`},""):n.reduce((t,s,x)=>`${t} ${x===0?"M":"L"} ${s.x},${s.y}`,""),[n,h]),a=C.useMemo(()=>n.length===0?"":`${l} L 100,100 L 0,100 Z`,[l,n]);return e.jsxs("div",{className:d.cn("w-full",j),style:{height:o},...v,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:"line-gradient",x1:"0%",y1:"0%",x2:"0%",y2:"100%",children:[e.jsx("stop",{offset:"0%",stopColor:i,stopOpacity:"0.3"}),e.jsx("stop",{offset:"100%",stopColor:i,stopOpacity:"0"})]})}),m&&e.jsx("path",{d:a,fill:"url(#line-gradient)",className:d.cn($&&"animate-fade-in")}),e.jsx("path",{d:l,fill:"none",stroke:i,strokeWidth:p/10,strokeLinecap:"round",strokeLinejoin:"round",className:d.cn($&&"animate-draw-line")}),f&&n.map((t,s)=>e.jsx("circle",{cx:t.x,cy:t.y,r:1.5,fill:i,className:d.cn($&&"animate-scale-in"),style:{animationDelay:`${s*50}ms`}},s))]}),y&&e.jsx("div",{className:"flex justify-between mt-2",children:r.map((t,s)=>e.jsx("span",{className:"text-xs text-gray-600 dark:text-slate-300",children:t.label},s))})]})},k=({data:r,height:o=200,showLabels:y=!0,innerRadius:f=0,startAngle:h=-90,padAngle:m=2,animated:p=!0,className:i,...$})=>{const j=r.reduce((a,t)=>a+t.value,0),v=C.useMemo(()=>{let a=h;return r.map((t,s)=>{const x=t.value/j*360-m,c={startAngle:a,endAngle:a+x,color:w.getChartColor(s,t.color),...t};return a+=x+m,c})},[r,j,h,m]),n=(a,t)=>{const s=a*Math.PI/180;return{x:50+t*Math.cos(s),y:50+t*Math.sin(s)}},l=(a,t)=>{const x=f*45,c=n(a,45),u=n(t,45),g=n(a,x),N=n(t,x),b=t-a>180?1:0;return f>0?`M ${c.x},${c.y} A 45,45 0 ${b},1 ${u.x},${u.y} L ${N.x},${N.y} A ${x},${x} 0 ${b},0 ${g.x},${g.y} Z`:`M 50,50 L ${c.x},${c.y} A 45,45 0 ${b},1 ${u.x},${u.y} Z`};return e.jsxs("div",{className:d.cn("flex items-center gap-4",i),...$,children:[e.jsx("div",{style:{width:o,height:o},children:e.jsx("svg",{viewBox:"0 0 100 100",className:"w-full h-full",children:v.map((a,t)=>e.jsx("path",{d:l(a.startAngle,a.endAngle),fill:a.color,className:d.cn("transition-opacity hover:opacity-80",p&&"animate-scale-in"),style:{animationDelay:`${t*100}ms`}},t))})}),y&&e.jsx("div",{className:"flex flex-col gap-2",children:r.map((a,t)=>e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("div",{className:"w-3 h-3 rounded-full",style:{backgroundColor:w.getChartColor(t,a.color)}}),e.jsx("span",{className:"text-sm text-gray-600 dark:text-slate-300",children:a.label}),e.jsxs("span",{className:"text-sm text-gray-400 dark:text-slate-500",children:[Math.round(a.value/j*100),"%"]})]},t))})]})},L=({type:r,...o})=>{switch(r){case"bar":return e.jsx(M,{...o});case"line":case"area":return e.jsx(R,{...o,fill:r==="area"});case"pie":return e.jsx(k,{...o});case"donut":return e.jsx(k,{...o,innerRadius:.6});default:return e.jsx(M,{...o})}};exports.BarChart=M;exports.Chart=L;exports.LineChart=R;exports.PieChart=k;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),n=require("./BarChart.cjs"),s=require("./LineChart.cjs"),i=require("./PieChart.cjs"),r=require("./Chart.const.cjs"),C=({type:a,...e})=>{switch(a){case r.CHART_TYPES.BAR:return t.jsx(n.BarChart,{...e});case r.CHART_TYPES.LINE:case r.CHART_TYPES.AREA:return t.jsx(s.LineChart,{...e,fill:a===r.CHART_TYPES.AREA});case r.CHART_TYPES.PIE:return t.jsx(i.PieChart,{...e});case r.CHART_TYPES.DONUT:return t.jsx(i.PieChart,{...e,innerRadius:r.CHART.DEFAULT_INNER_RADIUS});default:return t.jsx(n.BarChart,{...e})}};exports.Chart=C;

package/dist/components/Chart/Chart.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=["#ec4899","#8b5cf6","#3b82f6","#10b981","#f59e0b","#ef4444","#06b6d4","#84cc16"];exports.DEFAULT_COLORS=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={DEFAULT_INNER_RADIUS:.6},A={BAR:"bar",LINE:"line",AREA:"area",PIE:"pie",DONUT:"donut"},T=["#ec4899","#8b5cf6","#3b82f6","#10b981","#f59e0b","#ef4444","#06b6d4","#84cc16"];exports.CHART=e;exports.CHART_TYPES=A;exports.DEFAULT_COLORS=T;

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

@@ -12,4 +12,11 @@ export declare const CHART: {
     readonly OUTER_RADIUS: 45;
     readonly CENTER: 50;
 };
+export declare const CHART_TYPES: {
+    readonly BAR: "bar";
+    readonly LINE: "line";
+    readonly AREA: "area";
+    readonly PIE: "pie";
+    readonly DONUT: "donut";
+};
 export declare const DEFAULT_COLORS: readonly ["#ec4899", "#8b5cf6", "#3b82f6", "#10b981", "#f59e0b", "#ef4444", "#06b6d4", "#84cc16"];

package/dist/components/Chart/Chart.const.js

@@ -1,4 +1,12 @@
-const b = [
+const A = {
+  DEFAULT_INNER_RADIUS: 0.6
+}, c = {
+  BAR: "bar",
+  LINE: "line",
+  AREA: "area",
+  PIE: "pie",
+  DONUT: "donut"
+}, e = [
   "#ec4899",
   // pink
   "#8b5cf6",
@@ -17,5 +25,7 @@ const b = [
   // lime
 ];
 export {
-  b as DEFAULT_COLORS
+  A as CHART,
+  c as CHART_TYPES,
+  e as DEFAULT_COLORS
 };

package/dist/components/Chart/Chart.d.ts

@@ -1,17 +1,5 @@
 import { FC } from 'react';
-import { ChartProps, BarChartProps, LineChartProps, PieChartProps } from './Chart.types';
-/**
- * BarChart Component
- */
-export declare const BarChart: FC<BarChartProps>;
-/**
- * LineChart Component
- */
-export declare const LineChart: FC<LineChartProps>;
-/**
- * PieChart Component
- */
-export declare const PieChart: FC<PieChartProps>;
+import { ChartProps } from './Chart.types';
 /**
  * Main Chart Component
  */