@pibit.ai/cure-design-system 0.6.42 → 0.6.43

package/dist/primitives/donut-chart/donut-chart.d.ts

@@ -0,0 +1,32 @@
+export interface DonutChartDatum {
+    name: string;
+    value: number;
+}
+export interface DonutChartProps {
+    data: DonutChartDatum[];
+    colors: string[];
+    innerRadius?: number;
+    outerRadius?: number;
+    isPercentage: boolean;
+    /** When true, renders a color swatch + label + value to the right of the chart. */
+    showLegend?: boolean;
+    /** When true, shows the numeric total in the donut hole. */
+    showCenterLabel?: boolean;
+    /** Smaller line under the center total (e.g. “Total Public Audit Clients”). */
+    centerSubLabel?: string;
+    /** Title above the chart + legend row (top-left). */
+    title?: string;
+    /**
+     * Pixel width/height of the chart container. Defaults to 240.
+     * Use with `compact` for small inline indicators (e.g. 16px header chips).
+     */
+    size?: number;
+    /**
+     * Compact chrome: no min-height / full-bleed white wrapper, no slice gaps/rounding.
+     * Intended for tiny progress indicators.
+     */
+    compact?: boolean;
+}
+export declare function DonutChart({ data, colors, innerRadius, outerRadius, isPercentage, showLegend, showCenterLabel, centerSubLabel, title, size, compact, }: DonutChartProps): import("react/jsx-runtime").JSX.Element;
+export default DonutChart;
+//# sourceMappingURL=donut-chart.d.ts.map

package/dist/primitives/donut-chart/donut-chart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"donut-chart.d.ts","sourceRoot":"","sources":["../../../src/primitives/donut-chart/donut-chart.tsx"],"names":[],"mappings":"AAQA,MAAM,WAAW,eAAe;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,eAAe;IAC5B,IAAI,EAAE,eAAe,EAAE,CAAC;IACxB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,OAAO,CAAC;IACtB,mFAAmF;IACnF,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,4DAA4D;IAC5D,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,+EAA+E;IAC/E,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,qDAAqD;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB;AAqBD,wBAAgB,UAAU,CAAC,EACvB,IAAI,EACJ,MAAM,EACN,WAAgB,EAChB,WAAiB,EACjB,YAAmB,EACnB,UAAkB,EAClB,eAAuB,EACvB,cAAc,EACd,KAAK,EACL,IAAU,EACV,OAAe,GAClB,EAAE,eAAe,2CAiHjB;AAED,eAAe,UAAU,CAAC"}

package/dist/primitives/donut-chart/donut-chart.js

@@ -0,0 +1,111 @@
+import { jsxs as a, jsx as e } from "react/jsx-runtime";
+import { useMemo as p } from "react";
+import { ResponsiveContainer as v } from "../../node_modules/recharts/es6/component/ResponsiveContainer.js";
+import { PieChart as $ } from "../../node_modules/recharts/es6/chart/PieChart.js";
+import { Pie as b } from "../../node_modules/recharts/es6/polar/Pie.js";
+import { Cell as j } from "../../node_modules/recharts/es6/component/Cell.js";
+const C = (s, i) => {
+  if (s <= i.length)
+    return i.slice(0, s);
+  const o = [...i], c = s - i.length;
+  for (let r = 0; r < c; r++) {
+    const u = r * 360 / c, d = 65 + r % 3 * 10, m = 50 + r % 2 * 10;
+    o.push(`hsl(${u}, ${d}%, ${m}%)`);
+  }
+  return o;
+};
+function R({
+  data: s,
+  colors: i,
+  innerRadius: o = 72,
+  outerRadius: c = 120,
+  isPercentage: r = !0,
+  showLegend: u = !1,
+  showCenterLabel: d = !1,
+  centerSubLabel: m,
+  title: g,
+  size: h = 240,
+  compact: f = !1
+}) {
+  const n = p(() => [...s], [s]), w = p(() => C(n.length, i), [n, i]), y = p(() => n.reduce((t, l) => t + (Number.isFinite(l.value) ? l.value : 0), 0), [n]), N = (t) => `${Number.isFinite(t) ? t : 0}${r ? "%" : ""}`, x = /* @__PURE__ */ a("div", { className: "pointer-events-none relative", style: { width: h, height: h }, children: [
+    /* @__PURE__ */ e(v, { width: "100%", height: "100%", children: /* @__PURE__ */ e($, { children: /* @__PURE__ */ e(
+      b,
+      {
+        data: n,
+        dataKey: "value",
+        nameKey: "name",
+        cx: "50%",
+        cy: "50%",
+        innerRadius: o,
+        outerRadius: c,
+        startAngle: 90,
+        endAngle: -270,
+        paddingAngle: f ? 0 : 2,
+        strokeWidth: 0,
+        cornerRadius: f ? 0 : 4,
+        style: { outline: "none" },
+        isAnimationActive: !1,
+        children: n.map((t, l) => /* @__PURE__ */ e(
+          j,
+          {
+            fill: w[l],
+            stroke: "none",
+            style: { outline: "none", cursor: "default" }
+          },
+          `cell-${l}`
+        ))
+      }
+    ) }) }),
+    d && /* @__PURE__ */ a(
+      "div",
+      {
+        className: "pointer-events-none absolute inset-0 flex flex-col items-center justify-center px-4 text-center",
+        "aria-hidden": !0,
+        children: [
+          /* @__PURE__ */ e("span", { className: "text-2xl font-semibold tabular-nums text-primary", children: Number.isFinite(y) ? y : 0 }),
+          m ? /* @__PURE__ */ e("span", { className: "mt-1 max-w-[7.5rem] text-sm font-normal leading-snug text-secondary text-center", children: m }) : null
+        ]
+      }
+    )
+  ] });
+  return u ? /* @__PURE__ */ a("div", { className: "flex w-full min-w-0 max-w-[1100px] flex-col gap-3 bg-white", style: { outline: "none" }, children: [
+    g ? /* @__PURE__ */ e("h4", { className: "text-sm font-normal text-primary", children: g }) : null,
+    /* @__PURE__ */ a("div", { className: "flex w-full min-w-0 flex-row flex-wrap items-center gap-[60px]", children: [
+      x,
+      n.length > 0 ? /* @__PURE__ */ e("ul", { className: "flex min-h-[2.75rem] min-w-0 flex-1 flex-row flex-wrap content-center items-stretch gap-x-[60px] gap-y-4", children: n.map((t, l) => /* @__PURE__ */ a("li", { className: "flex w-[132px] items-stretch gap-2.5", children: [
+        /* @__PURE__ */ e(
+          "div",
+          {
+            className: "w-1.5 shrink-0 rounded-sm",
+            style: {
+              backgroundColor: w[l],
+              minHeight: "2.75rem"
+            }
+          }
+        ),
+        /* @__PURE__ */ a("div", { className: "flex min-w-0 flex-col justify-center", children: [
+          /* @__PURE__ */ e("span", { className: "text-xs text-secondary", children: t.name }),
+          /* @__PURE__ */ e("span", { className: "text-xl font-semibold tabular-nums text-primary", children: N(t.value) })
+        ] })
+      ] }, `${String(t.name)}-${l}`)) }) : null
+    ] })
+  ] }) : f ? /* @__PURE__ */ e(
+    "div",
+    {
+      className: "flex items-center justify-center",
+      style: { outline: "none", width: h, height: h },
+      children: x
+    }
+  ) : /* @__PURE__ */ e(
+    "div",
+    {
+      className: "flex h-full min-h-[150px] w-full items-center justify-center bg-white",
+      style: { outline: "none" },
+      children: x
+    }
+  );
+}
+export {
+  R as DonutChart,
+  R as default
+};

package/dist/primitives/donut-chart/index.d.ts

@@ -0,0 +1,2 @@
+export { DonutChart, type DonutChartProps, type DonutChartDatum } from './donut-chart';
+//# sourceMappingURL=index.d.ts.map

package/dist/primitives/donut-chart/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/primitives/donut-chart/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC"}