@forgedevstack/bear 1.0.3 → 1.0.4-alpha

package/dist/components/Card/Card.js

@@ -1,113 +1,109 @@
-import { jsx as b, jsxs as i } from "react/jsx-runtime";
+import { jsx as t, jsxs as l } from "react/jsx-runtime";
 import { forwardRef as o } from "react";
-import { cn as t } from "../../utils/cn.js";
-const h = {
-  none: "",
-  xs: "bear-p-2",
-  sm: "bear-p-3",
-  md: "bear-p-4",
-  lg: "bear-p-6",
-  xl: "bear-p-8"
-}, u = {
-  none: "",
-  sm: "bear-rounded-sm",
-  md: "bear-rounded-md",
-  lg: "bear-rounded-lg",
-  xl: "bear-rounded-xl",
-  "2xl": "bear-rounded-2xl"
-}, C = {
-  elevated: "bear-bg-white dark:bear-bg-gray-900 bear-shadow-md",
-  outlined: "bear-bg-white dark:bear-bg-gray-900 bear-border bear-border-gray-200 dark:bear-border-gray-700",
-  filled: "bear-bg-gray-100 dark:bear-bg-gray-800",
-  ghost: "bear-bg-transparent"
-}, m = o(
-  ({
-    variant: r = "elevated",
-    padding: e = "none",
-    interactive: a = !1,
-    radius: d = "lg",
-    className: s,
-    children: n,
-    testId: l,
-    ...y
-  }, x) => /* @__PURE__ */ b(
-    "div",
-    {
-      ref: x,
-      className: t(
-        "bear-overflow-hidden",
-        C[r],
-        h[e],
-        u[d],
-        a && "bear-transition-all bear-duration-200 bear-cursor-pointer hover:bear-shadow-lg hover:bear-scale-[1.02]",
-        s
-      ),
-      "data-testid": l,
-      ...y,
-      children: n
-    }
-  )
+import { cn as i } from "../../utils/cn.js";
+import { CARD_INTERACTIVE_CLASSES as D, CARD_RADIUS_CLASSES as h, CARD_PADDING_CLASSES as B, CARD_VARIANT_CLASSES as p, CARD_TITLE_CLASSES as v, CARD_SUBTITLE_CLASSES as L, CARD_HEADER_CLASSES as f, CARD_BODY_CLASSES as I, CARD_FOOTER_DIVIDER_CLASSES as b, CARD_FOOTER_CLASSES as u } from "./Card.const.js";
+const _ = o(
+  (d, s) => {
+    const {
+      variant: e = "elevated",
+      padding: a = "none",
+      interactive: r = !1,
+      radius: C = "lg",
+      className: n,
+      children: c,
+      testId: E,
+      id: N,
+      ...R
+    } = d;
+    return /* @__PURE__ */ t(
+      "div",
+      {
+        ref: s,
+        id: N,
+        className: i(
+          "Bear-Card",
+          `Bear-Card--${e}`,
+          "bear-overflow-hidden",
+          p[e],
+          B[a],
+          h[C],
+          r && `Bear-Card--interactive ${D}`,
+          n
+        ),
+        "data-testid": E,
+        ...R,
+        children: c
+      }
+    );
+  }
 );
-m.displayName = "Card";
-const g = o(
-  ({ title: r, subtitle: e, action: a, className: d, children: s, ...n }, l) => /* @__PURE__ */ i(
-    "div",
-    {
-      ref: l,
-      className: t(
-        "bear-flex bear-items-start bear-justify-between bear-p-4 bear-border-b bear-border-gray-200 dark:bear-border-gray-700",
-        d
-      ),
-      ...n,
-      children: [
-        /* @__PURE__ */ i("div", { className: "bear-flex-1 bear-min-w-0", children: [
-          r && /* @__PURE__ */ b("h3", { className: "bear-text-lg bear-font-semibold bear-text-gray-900 dark:bear-text-white bear-truncate", children: r }),
-          e && /* @__PURE__ */ b("p", { className: "bear-text-sm bear-text-gray-500 dark:bear-text-gray-400 bear-mt-1", children: e }),
-          s
-        ] }),
-        a && /* @__PURE__ */ b("div", { className: "bear-ml-4 bear-shrink-0", children: a })
-      ]
-    }
-  )
+_.displayName = "Card";
+const S = o(
+  (d, s) => {
+    const { title: e, subtitle: a, action: r, className: C, children: n, ...c } = d;
+    return /* @__PURE__ */ l(
+      "div",
+      {
+        ref: s,
+        className: i("Bear-Card__header", f, C),
+        ...c,
+        children: [
+          /* @__PURE__ */ l("div", { className: "Bear-Card__header-content bear-flex-1 bear-min-w-0", children: [
+            e && /* @__PURE__ */ t("h3", { className: i("Bear-Card__title", v), children: e }),
+            a && /* @__PURE__ */ t("p", { className: i("Bear-Card__subtitle", L), children: a }),
+            n
+          ] }),
+          r && /* @__PURE__ */ t("div", { className: "Bear-Card__header-action bear-ml-4 bear-shrink-0", children: r })
+        ]
+      }
+    );
+  }
 );
-g.displayName = "CardHeader";
-const c = o(
-  ({ className: r, children: e, ...a }, d) => /* @__PURE__ */ b(
-    "div",
-    {
-      ref: d,
-      className: t("bear-p-4", r),
-      ...a,
-      children: e
-    }
-  )
+S.displayName = "CardHeader";
+const m = o(
+  (d, s) => {
+    const { className: e, children: a, ...r } = d;
+    return /* @__PURE__ */ t(
+      "div",
+      {
+        ref: s,
+        className: i("Bear-Card__body", I, e),
+        ...r,
+        children: a
+      }
+    );
+  }
 );
-c.displayName = "CardBody";
-const p = o(
-  ({ divider: r = !0, className: e, children: a, ...d }, s) => /* @__PURE__ */ b(
-    "div",
-    {
-      ref: s,
-      className: t(
-        "bear-p-4",
-        r && "bear-border-t bear-border-gray-200 dark:bear-border-gray-700",
-        e
-      ),
-      ...d,
-      children: a
-    }
-  )
+m.displayName = "CardBody";
+const A = o(
+  (d, s) => {
+    const { divider: e = !0, className: a, children: r, ...C } = d;
+    return /* @__PURE__ */ t(
+      "div",
+      {
+        ref: s,
+        className: i(
+          "Bear-Card__footer",
+          u,
+          e && b,
+          a
+        ),
+        ...C,
+        children: r
+      }
+    );
+  }
 );
-p.displayName = "CardFooter";
-const k = Object.assign(m, {
-  Header: g,
-  Body: c,
-  Footer: p
+A.displayName = "CardFooter";
+const x = Object.assign(_, {
+  Header: S,
+  Body: m,
+  Footer: A
 });
 export {
-  m as Card,
-  c as CardBody,
-  k as CardCompound,
-  p as CardFooter,
-  g as CardHeader
+  _ as Card,
+  m as CardBody,
+  x as CardCompound,
+  A as CardFooter,
+  S as CardHeader
 };

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

@@ -1,2 +1,3 @@
-export { Card, CardHeader, CardBody, CardFooter, CardCompound } from './Card';
-export type { CardProps, CardHeaderProps, CardBodyProps, CardFooterProps } from './Card.types';
+export { Card, CardHeader, CardBody, CardFooter, CardCompound, default } from './Card';
+export * from './Card.types';
+export * from './Card.const';

package/dist/components/Chart/Chart.cjs

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

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

@@ -0,0 +1,15 @@
+/**
+ * Chart constants
+ */
+export declare const CHART: {
+    readonly DEFAULT_HEIGHT: 200;
+    readonly DEFAULT_BAR_RADIUS: 4;
+    readonly DEFAULT_BAR_GAP: 0.2;
+    readonly DEFAULT_STROKE_WIDTH: 2;
+    readonly DEFAULT_INNER_RADIUS: 0.6;
+    readonly DEFAULT_START_ANGLE: -90;
+    readonly DEFAULT_PAD_ANGLE: 2;
+    readonly OUTER_RADIUS: 45;
+    readonly CENTER: 50;
+};
+export declare const DEFAULT_COLORS: readonly ["#ec4899", "#8b5cf6", "#3b82f6", "#10b981", "#f59e0b", "#ef4444", "#06b6d4", "#84cc16"];

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

@@ -0,0 +1,18 @@
+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>;
+/**
+ * Main Chart Component
+ */
+export declare const Chart: FC<ChartProps>;

package/dist/components/Chart/Chart.js

@@ -0,0 +1,225 @@
+import { jsx as t, jsxs as h } from "react/jsx-runtime";
+import { useMemo as C } from "react";
+import { cn as d } from "../../utils/cn.js";
+const L = [
+  "#ec4899",
+  // pink
+  "#8b5cf6",
+  // purple
+  "#3b82f6",
+  // blue
+  "#10b981",
+  // emerald
+  "#f59e0b",
+  // amber
+  "#ef4444",
+  // red
+  "#06b6d4",
+  // cyan
+  "#84cc16"
+  // lime
+], k = (l, o) => o || L[l % L.length], R = ({
+  data: l,
+  height: o = 200,
+  showLabels: p = !0,
+  showValues: $ = !1,
+  animated: f = !0,
+  color: m,
+  orientation: g = "vertical",
+  barRadius: u = 4,
+  barGap: v = 0.2,
+  className: y,
+  ...N
+}) => {
+  const n = Math.max(...l.map((s) => s.value));
+  return /* @__PURE__ */ t("div", { className: d("w-full", y), style: { height: o }, ...N, children: g === "vertical" ? /* @__PURE__ */ t("div", { className: "flex items-end justify-between h-full gap-2", children: l.map((s, r) => {
+    const e = s.value / n * 100, a = k(r, s.color || m);
+    return /* @__PURE__ */ h("div", { className: "flex-1 flex flex-col items-center gap-1", children: [
+      /* @__PURE__ */ t("div", { className: "w-full flex-1 flex items-end", children: /* @__PURE__ */ t(
+        "div",
+        {
+          className: d(
+            "w-full transition-all duration-500 ease-out",
+            f && "animate-grow-up"
+          ),
+          style: {
+            height: `${e}%`,
+            backgroundColor: a,
+            borderRadius: `${u}px ${u}px 0 0`,
+            opacity: 0.9
+          }
+        }
+      ) }),
+      $ && /* @__PURE__ */ t("span", { className: "text-xs text-gray-500 dark:text-slate-400", children: s.value }),
+      p && /* @__PURE__ */ t("span", { className: "text-xs text-gray-600 dark:text-slate-300 truncate max-w-full", children: s.label })
+    ] }, r);
+  }) }) : /* @__PURE__ */ t("div", { className: "flex flex-col justify-between h-full gap-2", children: l.map((s, r) => {
+    const e = s.value / n * 100, a = k(r, s.color || m);
+    return /* @__PURE__ */ h("div", { className: "flex-1 flex items-center gap-2", children: [
+      p && /* @__PURE__ */ t("span", { className: "text-xs text-gray-600 dark:text-slate-300 w-16 truncate", children: s.label }),
+      /* @__PURE__ */ t("div", { className: "flex-1 h-full flex items-center", children: /* @__PURE__ */ t(
+        "div",
+        {
+          className: d(
+            "h-3/4 transition-all duration-500 ease-out",
+            f && "animate-grow-right"
+          ),
+          style: {
+            width: `${e}%`,
+            backgroundColor: a,
+            borderRadius: `0 ${u}px ${u}px 0`,
+            opacity: 0.9
+          }
+        }
+      ) }),
+      $ && /* @__PURE__ */ t("span", { className: "text-xs text-gray-500 dark:text-slate-400 w-10 text-right", children: s.value })
+    ] }, r);
+  }) }) });
+}, A = ({
+  data: l,
+  height: o = 200,
+  showLabels: p = !0,
+  showDots: $ = !0,
+  smooth: f = !0,
+  fill: m = !1,
+  strokeWidth: g = 2,
+  color: u = "#ec4899",
+  animated: v = !0,
+  className: y,
+  ...N
+}) => {
+  const n = C(() => {
+    const e = Math.max(...l.map((c) => c.value)), a = Math.min(...l.map((c) => c.value)), i = e - a || 1;
+    return l.map((c, x) => ({
+      x: x / (l.length - 1 || 1) * 100,
+      y: 100 - (c.value - a) / i * 80 - 10,
+      ...c
+    }));
+  }, [l]), s = C(() => n.length === 0 ? "" : f ? n.reduce((e, a, i, c) => {
+    if (i === 0) return `M ${a.x},${a.y}`;
+    const x = c[i - 1], b = x.x + (a.x - x.x) / 3, w = a.x - (a.x - x.x) / 3;
+    return `${e} C ${b},${x.y} ${w},${a.y} ${a.x},${a.y}`;
+  }, "") : n.reduce((e, a, i) => `${e} ${i === 0 ? "M" : "L"} ${a.x},${a.y}`, ""), [n, f]), r = C(() => n.length === 0 ? "" : `${s} L 100,100 L 0,100 Z`, [s, n]);
+  return /* @__PURE__ */ h("div", { className: d("w-full", y), style: { height: o }, ...N, children: [
+    /* @__PURE__ */ h("svg", { viewBox: "0 0 100 100", preserveAspectRatio: "none", className: "w-full h-full", children: [
+      /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ h("linearGradient", { id: "line-gradient", x1: "0%", y1: "0%", x2: "0%", y2: "100%", children: [
+        /* @__PURE__ */ t("stop", { offset: "0%", stopColor: u, stopOpacity: "0.3" }),
+        /* @__PURE__ */ t("stop", { offset: "100%", stopColor: u, stopOpacity: "0" })
+      ] }) }),
+      m && /* @__PURE__ */ t(
+        "path",
+        {
+          d: r,
+          fill: "url(#line-gradient)",
+          className: d(v && "animate-fade-in")
+        }
+      ),
+      /* @__PURE__ */ t(
+        "path",
+        {
+          d: s,
+          fill: "none",
+          stroke: u,
+          strokeWidth: g / 10,
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          className: d(v && "animate-draw-line")
+        }
+      ),
+      $ && n.map((e, a) => /* @__PURE__ */ t(
+        "circle",
+        {
+          cx: e.x,
+          cy: e.y,
+          r: 1.5,
+          fill: u,
+          className: d(v && "animate-scale-in"),
+          style: { animationDelay: `${a * 50}ms` }
+        },
+        a
+      ))
+    ] }),
+    p && /* @__PURE__ */ t("div", { className: "flex justify-between mt-2", children: l.map((e, a) => /* @__PURE__ */ t("span", { className: "text-xs text-gray-600 dark:text-slate-300", children: e.label }, a)) })
+  ] });
+}, j = ({
+  data: l,
+  height: o = 200,
+  showLabels: p = !0,
+  innerRadius: $ = 0,
+  startAngle: f = -90,
+  padAngle: m = 2,
+  animated: g = !0,
+  className: u,
+  ...v
+}) => {
+  const y = l.reduce((r, e) => r + e.value, 0), N = C(() => {
+    let r = f;
+    return l.map((e, a) => {
+      const i = e.value / y * 360 - m, c = {
+        startAngle: r,
+        endAngle: r + i,
+        color: k(a, e.color),
+        ...e
+      };
+      return r += i + m, c;
+    });
+  }, [l, y, f, m]), n = (r, e) => {
+    const a = r * Math.PI / 180;
+    return {
+      x: 50 + e * Math.cos(a),
+      y: 50 + e * Math.sin(a)
+    };
+  }, s = (r, e) => {
+    const i = $ * 45, c = n(r, 45), x = n(e, 45), b = n(r, i), w = n(e, i), M = e - r > 180 ? 1 : 0;
+    return $ > 0 ? `M ${c.x},${c.y} A 45,45 0 ${M},1 ${x.x},${x.y} L ${w.x},${w.y} A ${i},${i} 0 ${M},0 ${b.x},${b.y} Z` : `M 50,50 L ${c.x},${c.y} A 45,45 0 ${M},1 ${x.x},${x.y} Z`;
+  };
+  return /* @__PURE__ */ h("div", { className: d("flex items-center gap-4", u), ...v, children: [
+    /* @__PURE__ */ t("div", { style: { width: o, height: o }, children: /* @__PURE__ */ t("svg", { viewBox: "0 0 100 100", className: "w-full h-full", children: N.map((r, e) => /* @__PURE__ */ t(
+      "path",
+      {
+        d: s(r.startAngle, r.endAngle),
+        fill: r.color,
+        className: d(
+          "transition-opacity hover:opacity-80",
+          g && "animate-scale-in"
+        ),
+        style: { animationDelay: `${e * 100}ms` }
+      },
+      e
+    )) }) }),
+    p && /* @__PURE__ */ t("div", { className: "flex flex-col gap-2", children: l.map((r, e) => /* @__PURE__ */ h("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ t(
+        "div",
+        {
+          className: "w-3 h-3 rounded-full",
+          style: { backgroundColor: k(e, r.color) }
+        }
+      ),
+      /* @__PURE__ */ t("span", { className: "text-sm text-gray-600 dark:text-slate-300", children: r.label }),
+      /* @__PURE__ */ h("span", { className: "text-sm text-gray-400 dark:text-slate-500", children: [
+        Math.round(r.value / y * 100),
+        "%"
+      ] })
+    ] }, e)) })
+  ] });
+}, I = ({ type: l, ...o }) => {
+  switch (l) {
+    case "bar":
+      return /* @__PURE__ */ t(R, { ...o });
+    case "line":
+    case "area":
+      return /* @__PURE__ */ t(A, { ...o, fill: l === "area" });
+    case "pie":
+      return /* @__PURE__ */ t(j, { ...o });
+    case "donut":
+      return /* @__PURE__ */ t(j, { ...o, innerRadius: 0.6 });
+    default:
+      return /* @__PURE__ */ t(R, { ...o });
+  }
+};
+export {
+  R as BarChart,
+  I as Chart,
+  A as LineChart,
+  j as PieChart
+};

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

@@ -0,0 +1,51 @@
+import { HTMLAttributes } from 'react';
+export type ChartType = 'bar' | 'line' | 'area' | 'pie' | 'donut';
+export interface ChartDataPoint {
+    label: string;
+    value: number;
+    color?: string;
+}
+export interface ChartProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
+    /** Chart type */
+    type: ChartType;
+    /** Data points */
+    data: ChartDataPoint[];
+    /** Chart height */
+    height?: number;
+    /** Show labels */
+    showLabels?: boolean;
+    /** Show values */
+    showValues?: boolean;
+    /** Animate on render */
+    animated?: boolean;
+    /** Primary color (used for single-color charts) */
+    color?: string;
+    /** Show grid lines */
+    showGrid?: boolean;
+}
+export interface BarChartProps extends Omit<ChartProps, 'type'> {
+    /** Bar orientation */
+    orientation?: 'vertical' | 'horizontal';
+    /** Bar border radius */
+    barRadius?: number;
+    /** Gap between bars (0-1) */
+    barGap?: number;
+}
+export interface LineChartProps extends Omit<ChartProps, 'type'> {
+    /** Show area fill */
+    fill?: boolean;
+    /** Line width */
+    strokeWidth?: number;
+    /** Show dots at data points */
+    showDots?: boolean;
+    /** Smooth curve */
+    smooth?: boolean;
+}
+export interface PieChartProps extends Omit<ChartProps, 'type'> {
+    /** Inner radius for donut chart (0-1) */
+    innerRadius?: number;
+    /** Start angle in degrees */
+    startAngle?: number;
+    /** Padding between slices */
+    padAngle?: number;
+}

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

@@ -0,0 +1,31 @@
+/**
+ * Get color for chart element by index
+ */
+export declare const getChartColor: (index: number, customColor?: string) => string;
+/**
+ * Convert polar coordinates to cartesian
+ */
+export declare const polarToCartesian: (angle: number, radius: number) => {
+    x: number;
+    y: number;
+};
+/**
+ * Create SVG arc path for pie/donut charts
+ */
+export declare const createArcPath: (startAngle: number, endAngle: number, innerRadius?: number) => string;
+/**
+ * Generate smooth bezier line path
+ */
+export declare const generateLinePath: (points: Array<{
+    x: number;
+    y: number;
+}>, smooth?: boolean) => string;
+/**
+ * Calculate line chart points from data
+ */
+export declare const calculateLinePoints: (data: Array<{
+    value: number;
+}>) => Array<{
+    x: number;
+    y: number;
+}>;

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

@@ -0,0 +1,2 @@
+export { Chart, BarChart, LineChart, PieChart } from './Chart';
+export type { ChartProps, BarChartProps, LineChartProps, PieChartProps, ChartDataPoint, ChartType, } from './Chart.types';

package/dist/components/CodeBlock/CodeBlock.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("react"),x=c.forwardRef(({code:a,language:o="typescript",showLineNumbers:g=!0,title:s,copyable:d=!0,maxHeight:t,theme:r="dark",className:y="",...p},h)=>{const[n,i]=c.useState(!1),b=async()=>{await navigator.clipboard.writeText(a),i(!0),setTimeout(()=>i(!1),2e3)},u=a.split(`
-`),j=r==="dark"?"bg-gray-900 text-gray-100":"bg-gray-50 text-gray-900 border border-gray-200";return e.jsxs("div",{className:`bear-code-block rounded-lg overflow-hidden ${j} ${y}`.trim(),children:[(s||d)&&e.jsxs("div",{className:`flex items-center justify-between px-4 py-2 ${r==="dark"?"bg-gray-800 border-b border-gray-700":"bg-gray-100 border-b border-gray-200"}`,children:[e.jsxs("div",{className:"flex items-center gap-2",children:[s&&e.jsx("span",{className:`text-sm font-medium ${r==="dark"?"text-gray-300":"text-gray-700"}`,children:s}),o&&e.jsx("span",{className:`text-xs px-2 py-0.5 rounded ${r==="dark"?"bg-gray-700 text-gray-400":"bg-gray-200 text-gray-600"}`,children:o})]}),d&&e.jsx("button",{onClick:b,className:`p-1.5 rounded transition-colors ${r==="dark"?"hover:bg-gray-700 text-gray-400 hover:text-gray-200":"hover:bg-gray-200 text-gray-500 hover:text-gray-700"}`,title:n?"Copied!":"Copy code",children:n?e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:e.jsx("polyline",{points:"20 6 9 17 4 12"})}):e.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[e.jsx("rect",{x:"9",y:"9",width:"13",height:"13",rx:"2",ry:"2"}),e.jsx("path",{d:"M5 15H4a2 2 0 01-2-2V4a2 2 0 012-2h9a2 2 0 012 2v1"})]})})]}),e.jsx("pre",{ref:h,className:"overflow-x-auto p-4",style:{maxHeight:t?typeof t=="number"?`${t}px`:t:void 0},...p,children:e.jsx("code",{className:"text-sm font-mono",children:u.map((m,l)=>e.jsxs("div",{className:"flex",children:[g&&e.jsx("span",{className:`select-none w-8 flex-shrink-0 text-right pr-4 ${r==="dark"?"text-gray-600":"text-gray-400"}`,children:l+1}),e.jsx("span",{className:"flex-1",children:m||" "})]},l))})})]})});x.displayName="CodeBlock";exports.CodeBlock=x;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),C=require("react"),a=require("../../utils/cn.cjs"),f=require("../Typography/Typography.cjs"),K="Bear-CodeBlock bear-rounded-lg bear-overflow-hidden",S="bear-bg-white bear-text-gray-900 bear-border bear-border-gray-200",N="bear-bg-zinc-900 bear-text-gray-100",v="bear-bg-white dark:bear-bg-zinc-900 bear-text-gray-900 dark:bear-text-gray-100 bear-border bear-border-gray-200 dark:bear-border-zinc-700",R="Bear-CodeBlock__header bear-flex bear-items-center bear-justify-between bear-px-4 bear-py-2",j="bear-bg-gray-50 bear-border-b bear-border-gray-200",z="bear-bg-zinc-800 bear-border-b bear-border-zinc-700",T="bear-bg-gray-50 dark:bear-bg-zinc-800 bear-border-b bear-border-gray-200 dark:bear-border-zinc-700",m="Bear-CodeBlock__language bear-text-xs bear-px-2 bear-py-0.5 bear-rounded",w="bear-bg-gray-200 bear-text-gray-600",G="bear-bg-zinc-700 bear-text-zinc-400",U="bear-bg-gray-200 dark:bear-bg-zinc-700 bear-text-gray-600 dark:bear-text-zinc-400",I="Bear-CodeBlock__copy bear-p-1.5 bear-rounded bear-transition-colors",H="hover:bear-bg-gray-200 bear-text-gray-500 hover:bear-text-gray-700",M="hover:bear-bg-zinc-700 bear-text-zinc-400 hover:bear-text-zinc-200",P="hover:bear-bg-gray-200 dark:hover:bear-bg-zinc-700 bear-text-gray-500 dark:bear-text-zinc-400 hover:bear-text-gray-700 dark:hover:bear-text-zinc-200",q="Bear-CodeBlock__pre bear-overflow-x-auto bear-p-4 bear-m-0",Y="Bear-CodeBlock__code bear-text-sm bear-font-mono",W="Bear-CodeBlock__line bear-flex",V="Bear-CodeBlock__line-number bear-select-none bear-w-8 bear-flex-shrink-0 bear-text-right bear-pr-4",$="bear-text-gray-400",F="bear-text-zinc-600",J="bear-text-gray-400 dark:bear-text-zinc-600",l=C.forwardRef(({code:s,language:c="typescript",showLineNumbers:_=!0,title:o,copyable:b=!0,maxHeight:t,theme:r="auto",className:O="",testId:g,id:E,...x},B)=>{const[n,i]=C.useState(!1),L=async()=>{await navigator.clipboard.writeText(s),i(!0),setTimeout(()=>i(!1),2e3)},u=s.split(`
+`),y=()=>r==="light"?S:r==="dark"?N:v,h=()=>r==="light"?j:r==="dark"?z:T,p=()=>r==="light"?w:r==="dark"?G:U,k=()=>r==="light"?H:r==="dark"?M:P,D=()=>r==="light"?$:r==="dark"?F:J;return e.jsxs("div",{id:E,"data-testid":g,className:a.cn(K,y(),O),children:[(o||b)&&e.jsxs("div",{className:a.cn(R,h()),children:[e.jsxs("div",{className:"bear-flex bear-items-center bear-gap-2",children:[o&&e.jsx(f.Typography,{variant:"caption",className:"Bear-CodeBlock__title bear-font-medium",children:o}),c&&e.jsx("span",{className:a.cn(m,p()),children:c})]}),b&&e.jsx("button",{onClick:L,className:a.cn(I,k()),title:n?"Copied!":"Copy code","aria-label":n?"Copied!":"Copy code",children:n?e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2","aria-hidden":"true",children:e.jsx("polyline",{points:"20 6 9 17 4 12"})}):e.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2","aria-hidden":"true",children:[e.jsx("rect",{x:"9",y:"9",width:"13",height:"13",rx:"2",ry:"2"}),e.jsx("path",{d:"M5 15H4a2 2 0 01-2-2V4a2 2 0 012-2h9a2 2 0 012 2v1"})]})})]}),e.jsx("pre",{ref:B,className:q,style:{maxHeight:t?typeof t=="number"?`${t}px`:t:void 0},...x,children:e.jsx("code",{className:Y,children:u.map((A,d)=>e.jsxs("div",{className:W,children:[_&&e.jsx("span",{className:a.cn(V,D()),children:d+1}),e.jsx("span",{className:"Bear-CodeBlock__line-content bear-flex-1",children:A||" "})]},d))})})]})});l.displayName="CodeBlock";exports.CodeBlock=l;