@parto-system-design/ui 1.1.5 → 1.1.8

package/dist/chunk-KYM7NIJO.cjs

@@ -0,0 +1,433 @@
+'use strict';
+
+var chunkD2EBLE2B_cjs = require('./chunk-D2EBLE2B.cjs');
+var chunkNV4JOKWL_cjs = require('./chunk-NV4JOKWL.cjs');
+var React2 = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React2__namespace = /*#__PURE__*/_interopNamespace(React2);
+
+function useRootStyles() {
+  const [version, setVersion] = React2.useState(0);
+  React2.useEffect(() => {
+    if (typeof window === "undefined" || !document?.documentElement) {
+      return;
+    }
+    const target = document.documentElement;
+    const observer = new MutationObserver(() => {
+      setVersion((prev) => prev + 1);
+    });
+    observer.observe(target, {
+      attributes: true,
+      attributeFilter: ["class", "data-theme"]
+    });
+    const media = window.matchMedia("(prefers-color-scheme: dark)");
+    const mediaHandler = () => setVersion((prev) => prev + 1);
+    media.addEventListener("change", mediaHandler);
+    return () => {
+      observer.disconnect();
+      media.removeEventListener("change", mediaHandler);
+    };
+  }, []);
+  return React2.useMemo(() => {
+    if (typeof window === "undefined" || !document?.documentElement) {
+      return null;
+    }
+    return getComputedStyle(document.documentElement);
+  }, [version]);
+}
+
+// src/lib/theme.ts
+var COLOR_VALUE_REGEX = /^(#|rgb|hsl|oklch)/i;
+function resolveCssColor(styles, variable, fallback) {
+  if (!styles) return fallback;
+  const raw = styles.getPropertyValue(variable).trim();
+  if (!raw) return fallback;
+  if (COLOR_VALUE_REGEX.test(raw)) return raw;
+  if (raw.includes("%")) return `hsl(${raw})`;
+  return raw;
+}
+
+// src/hooks/use-chart-theme.ts
+var FALLBACKS = {
+  foregroundMuted: "hsl(0 0% 50%)",
+  border: "hsl(0 0% 22%)",
+  popover: "hsl(0 0% 10%)",
+  popoverForeground: "hsl(0 0% 98%)",
+  chart1: "hsl(153 55% 42%)",
+  chart2: "hsl(198 50% 48%)",
+  chart3: "hsl(240 40% 54%)",
+  chart4: "hsl(310 38% 52%)",
+  chart5: "hsl(355 45% 52%)",
+  chart6: "hsl(35 52% 48%)",
+  chart7: "hsl(75 38% 46%)",
+  chart8: "hsl(118 35% 46%)"
+};
+var CHART_FONT_FAMILY = "Yekan Bakh, system-ui, -apple-system, sans-serif";
+function useChartTheme() {
+  const styles = useRootStyles();
+  return React2__namespace.useMemo(() => {
+    const getColor = (variable, fallback) => resolveCssColor(styles, variable, fallback);
+    const chartColors = [
+      getColor("--chart-1", FALLBACKS.chart1),
+      getColor("--chart-2", FALLBACKS.chart2),
+      getColor("--chart-3", FALLBACKS.chart3),
+      getColor("--chart-4", FALLBACKS.chart4),
+      getColor("--chart-5", FALLBACKS.chart5),
+      getColor("--chart-6", FALLBACKS.chart6),
+      getColor("--chart-7", FALLBACKS.chart7),
+      getColor("--chart-8", FALLBACKS.chart8)
+    ];
+    const axisTickStyle = {
+      fontFamily: CHART_FONT_FAMILY,
+      fill: getColor("--foreground-lighter", FALLBACKS.foregroundMuted),
+      fontSize: 11,
+      fontWeight: 400
+    };
+    const gridStyle = {
+      stroke: getColor("--border", FALLBACKS.border),
+      strokeDasharray: "3 3",
+      strokeOpacity: 0.15
+    };
+    const tooltipStyle = {
+      fontFamily: CHART_FONT_FAMILY,
+      background: getColor("--background-overlay-default", FALLBACKS.popover),
+      color: getColor("--foreground-default", FALLBACKS.popoverForeground),
+      fontSize: 12,
+      lineHeight: "1.5",
+      borderRadius: "10px",
+      border: `1px solid ${getColor("--border-muted", FALLBACKS.border)}`,
+      boxShadow: "0 4px 24px -4px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.06)",
+      padding: "10px 14px",
+      backdropFilter: "blur(8px)",
+      WebkitBackdropFilter: "blur(8px)"
+    };
+    const crosshairStyle = {
+      stroke: getColor("--foreground-muted", FALLBACKS.foregroundMuted),
+      strokeWidth: 1,
+      strokeDasharray: "4 4",
+      strokeOpacity: 0.5
+    };
+    return {
+      chartColors,
+      getColor,
+      fontFamily: CHART_FONT_FAMILY,
+      axisTickStyle,
+      gridStyle,
+      tooltipStyle,
+      crosshairStyle
+    };
+  }, [styles]);
+}
+var ChartContainer = React2__namespace.forwardRef(
+  ({ className, dataSlot, ariaLabel, children }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className,
+      dir: "ltr",
+      "data-slot": dataSlot,
+      role: "img",
+      "aria-label": ariaLabel ?? "\u0646\u0645\u0648\u062F\u0627\u0631",
+      style: { position: "relative", width: "100%", height: "100%" },
+      children
+    }
+  )
+);
+ChartContainer.displayName = "ChartContainer";
+function ChartLoadingSkeleton({ className, shape = "rect" }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "chart-loading-skeleton",
+      className,
+      dir: "ltr",
+      style: { position: "relative", width: "100%", height: "100%" },
+      role: "status",
+      "aria-label": "Loading chart",
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        chunkD2EBLE2B_cjs.Skeleton,
+        {
+          shape,
+          className: shape === "circle" ? "w-full h-full min-h-[200px] aspect-square mx-auto" : "w-full h-full min-h-[200px]"
+        }
+      )
+    }
+  );
+}
+var LOCALE_TO_BCP47 = {
+  fa: "fa-IR",
+  ar: "ar",
+  en: "en-US"
+};
+function ChartTooltip({ active, payload, label, tooltipStyle, formatter, locale = "fa" }) {
+  if (!active || !payload?.length) return null;
+  const bcp47 = LOCALE_TO_BCP47[locale] ?? "fa-IR";
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-slot": "chart-tooltip", style: tooltipStyle, children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontWeight: 500, fontSize: 13, marginBottom: 6 }, children: label }),
+    payload.map((entry, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: 8, marginTop: i > 0 ? 4 : 0 }, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          style: {
+            width: 10,
+            height: 10,
+            borderRadius: 2,
+            backgroundColor: entry.color,
+            flexShrink: 0
+          }
+        }
+      ),
+      formatter ? formatter(entry.name, entry.value) : /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { display: "flex", justifyContent: "space-between", width: "100%", gap: 16 }, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { style: { opacity: 0.7 }, children: entry.name }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontWeight: 600, fontVariantNumeric: "tabular-nums" }, children: typeof entry.value === "number" ? entry.value.toLocaleString(bcp47) : entry.value })
+      ] })
+    ] }, i))
+  ] });
+}
+function localeAwareNumberTick(locale) {
+  return (value) => {
+    if (typeof value === "number") return chunkNV4JOKWL_cjs.formatLargeNumber(value, locale);
+    if (typeof value === "string") {
+      if (/^-?\d+(\.\d+)?$/.test(value)) return chunkNV4JOKWL_cjs.convertToLocalNumbers(value, locale);
+      return value;
+    }
+    return String(value ?? "");
+  };
+}
+function localeAwareCategoryTick(locale) {
+  return (value) => chunkNV4JOKWL_cjs.convertToLocalNumbers(String(value ?? ""), locale);
+}
+var PATTERN_DASHARRAY = {
+  solid: void 0,
+  dashed: "4 3",
+  dotted: "1 3",
+  "dash-dot": "4 2 1 2"
+};
+var ChartLegend = React2__namespace.forwardRef(
+  ({ className, items, orientation = "horizontal", swatchSize = 10, ...props }, ref) => {
+    const isVertical = orientation === "vertical";
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        "data-slot": "chart-legend",
+        "data-orientation": orientation,
+        className,
+        style: {
+          display: "flex",
+          flexWrap: isVertical ? "nowrap" : "wrap",
+          flexDirection: isVertical ? "column" : "row",
+          gap: isVertical ? "6px" : "12px 16px",
+          fontSize: 12,
+          color: "hsl(var(--foreground-light))"
+        },
+        role: "list",
+        ...props,
+        children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            role: "listitem",
+            "data-slot": "chart-legend-item",
+            style: { display: "inline-flex", alignItems: "center", gap: 6, lineHeight: 1.2 },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                ChartLegendSwatch,
+                {
+                  color: item.color,
+                  shape: item.shape ?? "dot",
+                  pattern: item.pattern ?? "solid",
+                  size: swatchSize
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontWeight: 500 }, children: item.label }),
+              item.value !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(
+                "span",
+                {
+                  style: { marginInlineStart: 4, fontVariantNumeric: "tabular-nums", opacity: 0.7 },
+                  "data-slot": "chart-legend-value",
+                  children: item.value
+                }
+              )
+            ]
+          },
+          item.key
+        ))
+      }
+    );
+  }
+);
+ChartLegend.displayName = "ChartLegend";
+function ChartLegendSwatch({
+  color,
+  shape,
+  pattern,
+  size
+}) {
+  if (shape === "dot") {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        "aria-hidden": "true",
+        style: {
+          display: "inline-block",
+          width: size,
+          height: size,
+          borderRadius: "50%",
+          backgroundColor: color,
+          flexShrink: 0
+        }
+      }
+    );
+  }
+  if (shape === "bar") {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        "aria-hidden": "true",
+        style: {
+          display: "inline-block",
+          width: size + 4,
+          height: Math.max(3, Math.round(size / 2.5)),
+          borderRadius: 2,
+          backgroundColor: color,
+          flexShrink: 0
+        }
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      "aria-hidden": "true",
+      width: size + 8,
+      height: Math.max(8, Math.round(size / 1.5)),
+      viewBox: `0 0 ${size + 8} ${Math.max(8, Math.round(size / 1.5))}`,
+      style: { flexShrink: 0 },
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "line",
+        {
+          x1: 1,
+          y1: Math.max(8, Math.round(size / 1.5)) / 2,
+          x2: size + 7,
+          y2: Math.max(8, Math.round(size / 1.5)) / 2,
+          stroke: color,
+          strokeWidth: 2,
+          strokeLinecap: "round",
+          strokeDasharray: PATTERN_DASHARRAY[pattern]
+        }
+      )
+    }
+  );
+}
+var ChartGradientLegend = React2__namespace.forwardRef(
+  ({
+    className,
+    startColor,
+    endColor,
+    startLabel,
+    endLabel,
+    caption,
+    width = 160,
+    height = 8,
+    "aria-label": ariaLabelProp,
+    ...props
+  }, ref) => {
+    const ariaLabel = ariaLabelProp ?? (typeof startLabel === "string" && typeof endLabel === "string" ? `${startLabel} \u062A\u0627 ${endLabel}` : "\u0645\u0642\u06CC\u0627\u0633 \u0631\u0646\u06AF");
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        "data-slot": "chart-gradient-legend",
+        className,
+        role: "img",
+        "aria-label": ariaLabel,
+        style: {
+          display: "inline-flex",
+          flexDirection: "column",
+          gap: 4,
+          fontSize: 12,
+          color: "hsl(var(--foreground-light))"
+        },
+        ...props,
+        children: [
+          caption && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "chart-gradient-legend-caption", style: { fontWeight: 500 }, children: caption }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              "data-slot": "chart-gradient-legend-bar",
+              "aria-hidden": "true",
+              style: {
+                width,
+                height,
+                borderRadius: height / 2,
+                background: `linear-gradient(to right, ${startColor}, ${endColor})`
+              }
+            }
+          ),
+          (startLabel !== void 0 || endLabel !== void 0) && /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              style: {
+                display: "flex",
+                justifyContent: "space-between",
+                width,
+                fontVariantNumeric: "tabular-nums",
+                opacity: 0.85
+              },
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { "data-slot": "chart-gradient-legend-start", children: startLabel }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { "data-slot": "chart-gradient-legend-end", children: endLabel })
+              ]
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+ChartGradientLegend.displayName = "ChartGradientLegend";
+function transformNivoLineData(nivoData) {
+  const dataKeys = nivoData.map((s) => s.id);
+  const xValues = nivoData[0]?.data.map((d) => d.x) ?? [];
+  const data = xValues.map((x, xi) => {
+    const row = { name: x };
+    for (const series of nivoData) {
+      row[series.id] = series.data[xi]?.y ?? 0;
+    }
+    return row;
+  });
+  return { data, dataKeys };
+}
+
+exports.CHART_FONT_FAMILY = CHART_FONT_FAMILY;
+exports.ChartContainer = ChartContainer;
+exports.ChartGradientLegend = ChartGradientLegend;
+exports.ChartLegend = ChartLegend;
+exports.ChartLoadingSkeleton = ChartLoadingSkeleton;
+exports.ChartTooltip = ChartTooltip;
+exports.localeAwareCategoryTick = localeAwareCategoryTick;
+exports.localeAwareNumberTick = localeAwareNumberTick;
+exports.transformNivoLineData = transformNivoLineData;
+exports.useChartTheme = useChartTheme;
+exports.useRootStyles = useRootStyles;
+//# sourceMappingURL=chunk-KYM7NIJO.cjs.map
+//# sourceMappingURL=chunk-KYM7NIJO.cjs.map

package/dist/chunk-KYM7NIJO.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/use-root-styles.ts","../src/lib/theme.ts","../src/hooks/use-chart-theme.ts","../src/components/charts/chart-utils.tsx"],"names":["useState","useEffect","useMemo","React","React2","jsx","Skeleton","jsxs","formatLargeNumber","convertToLocalNumbers"],"mappings":"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","file":"chunk-KYM7NIJO.cjs","sourcesContent":["'use client'\n\nimport { useEffect, useMemo, useState } from 'react'\n\n/**\n * Returns a snapshot of the current document root computed styles and\n * re-renders when the theme class or OS color scheme changes.\n */\nexport function useRootStyles() {\n  const [version, setVersion] = useState(0)\n\n  useEffect(() => {\n    if (typeof window === 'undefined' || !document?.documentElement) {\n      return\n    }\n\n    const target = document.documentElement\n    const observer = new MutationObserver(() => {\n      setVersion((prev) => prev + 1)\n    })\n\n    observer.observe(target, {\n      attributes: true,\n      attributeFilter: ['class', 'data-theme'],\n    })\n\n    const media = window.matchMedia('(prefers-color-scheme: dark)')\n    const mediaHandler = () => setVersion((prev) => prev + 1)\n    media.addEventListener('change', mediaHandler)\n\n    return () => {\n      observer.disconnect()\n      media.removeEventListener('change', mediaHandler)\n    }\n  }, [])\n\n  return useMemo(() => {\n    if (typeof window === 'undefined' || !document?.documentElement) {\n      return null\n    }\n\n    return getComputedStyle(document.documentElement)\n  }, [version])\n}\n","const COLOR_VALUE_REGEX = /^(#|rgb|hsl|oklch)/i;\n\nexport function resolveCssColor(\n  styles: CSSStyleDeclaration | null,\n  variable: string,\n  fallback: string,\n) {\n  if (!styles) return fallback;\n  const raw = styles.getPropertyValue(variable).trim();\n  if (!raw) return fallback;\n  if (COLOR_VALUE_REGEX.test(raw)) return raw;\n  if (raw.includes('%')) return `hsl(${raw})`;\n  return raw;\n}\n\n","'use client'\n\nimport * as React from 'react'\nimport { useRootStyles } from './use-root-styles'\nimport { resolveCssColor } from '@/lib/theme'\n\n/**\n * Chart theme hook — reads CSS design tokens at runtime and produces\n * resolved colors and styles for Recharts + Visx chart components.\n * Inspired by Linear, Vercel, and Stripe data visualizations.\n */\n\nconst FALLBACKS = {\n  foreground: 'hsl(0 0% 98%)',\n  foregroundMuted: 'hsl(0 0% 50%)',\n  border: 'hsl(0 0% 22%)',\n  popover: 'hsl(0 0% 10%)',\n  popoverForeground: 'hsl(0 0% 98%)',\n  chart1: 'hsl(153 55% 42%)',\n  chart2: 'hsl(198 50% 48%)',\n  chart3: 'hsl(240 40% 54%)',\n  chart4: 'hsl(310 38% 52%)',\n  chart5: 'hsl(355 45% 52%)',\n  chart6: 'hsl(35 52% 48%)',\n  chart7: 'hsl(75 38% 46%)',\n  chart8: 'hsl(118 35% 46%)',\n}\n\nexport const CHART_FONT_FAMILY = 'Yekan Bakh, system-ui, -apple-system, sans-serif'\n\nexport function useChartTheme() {\n  const styles = useRootStyles()\n\n  return React.useMemo(() => {\n    const getColor = (variable: string, fallback: string) => resolveCssColor(styles, variable, fallback)\n\n    const chartColors = [\n      getColor('--chart-1', FALLBACKS.chart1),\n      getColor('--chart-2', FALLBACKS.chart2),\n      getColor('--chart-3', FALLBACKS.chart3),\n      getColor('--chart-4', FALLBACKS.chart4),\n      getColor('--chart-5', FALLBACKS.chart5),\n      getColor('--chart-6', FALLBACKS.chart6),\n      getColor('--chart-7', FALLBACKS.chart7),\n      getColor('--chart-8', FALLBACKS.chart8),\n    ]\n\n    const axisTickStyle = {\n      fontFamily: CHART_FONT_FAMILY,\n      fill: getColor('--foreground-lighter', FALLBACKS.foregroundMuted),\n      fontSize: 11,\n      fontWeight: 400 as const,\n    }\n\n    const gridStyle = {\n      stroke: getColor('--border', FALLBACKS.border),\n      strokeDasharray: '3 3',\n      strokeOpacity: 0.15,\n    }\n\n    const tooltipStyle: React.CSSProperties = {\n      fontFamily: CHART_FONT_FAMILY,\n      background: getColor('--background-overlay-default', FALLBACKS.popover),\n      color: getColor('--foreground-default', FALLBACKS.popoverForeground),\n      fontSize: 12,\n      lineHeight: '1.5',\n      borderRadius: '10px',\n      border: `1px solid ${getColor('--border-muted', FALLBACKS.border)}`,\n      boxShadow: '0 4px 24px -4px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.06)',\n      padding: '10px 14px',\n      backdropFilter: 'blur(8px)',\n      WebkitBackdropFilter: 'blur(8px)',\n    }\n\n    const crosshairStyle = {\n      stroke: getColor('--foreground-muted', FALLBACKS.foregroundMuted),\n      strokeWidth: 1,\n      strokeDasharray: '4 4',\n      strokeOpacity: 0.5,\n    }\n\n    return {\n      chartColors,\n      getColor,\n      fontFamily: CHART_FONT_FAMILY,\n      axisTickStyle,\n      gridStyle,\n      tooltipStyle,\n      crosshairStyle,\n    }\n  }, [styles])\n}\n","'use client'\n\nimport * as React from 'react'\nimport { Skeleton } from '@/components/ui/skeleton'\nimport { convertToLocalNumbers, formatLargeNumber, type SupportedLocale } from '@/lib/utils'\n\n// ─── Chart Container ─────────────────────────────────────────────────────────\n\ninterface ChartContainerProps {\n  className?: string\n  dataSlot: string\n  ariaLabel?: string\n  children: React.ReactNode\n}\n\nexport const ChartContainer = React.forwardRef<HTMLDivElement, ChartContainerProps>(\n  ({ className, dataSlot, ariaLabel, children }, ref) => (\n    <div\n      ref={ref}\n      className={className}\n      dir=\"ltr\"\n      data-slot={dataSlot}\n      role=\"img\"\n      aria-label={ariaLabel ?? 'نمودار'}\n      style={{ position: 'relative', width: '100%', height: '100%' }}\n    >\n      {children}\n    </div>\n  )\n)\nChartContainer.displayName = 'ChartContainer'\n\n// ─── Chart Skeleton ──────────────────────────────────────────────────────────\n\ninterface ChartSkeletonProps {\n  className?: string\n  shape?: 'rect' | 'circle'\n}\n\nexport function ChartLoadingSkeleton({ className, shape = 'rect' }: ChartSkeletonProps) {\n  return (\n    <div\n      data-slot=\"chart-loading-skeleton\"\n      className={className}\n      dir=\"ltr\"\n      style={{ position: 'relative', width: '100%', height: '100%' }}\n      role=\"status\"\n      aria-label=\"Loading chart\"\n    >\n      <Skeleton\n        shape={shape}\n        className={\n          shape === 'circle' ? 'w-full h-full min-h-[200px] aspect-square mx-auto' : 'w-full h-full min-h-[200px]'\n        }\n      />\n    </div>\n  )\n}\n\n// ─── Chart Tooltip ───────────────────────────────────────────────────────────\n\ninterface ChartTooltipProps {\n  active?: boolean\n  payload?: Array<{ name: string; value: number; color: string; dataKey?: string }>\n  label?: string\n  tooltipStyle: React.CSSProperties\n  formatter?: (name: string, value: number) => React.ReactNode\n  /** Locale for the default value formatter. fa/ar render Persian/Arabic digits with thousands separators; en uses Latin. */\n  locale?: SupportedLocale\n}\n\nconst LOCALE_TO_BCP47: Record<SupportedLocale, string> = {\n  fa: 'fa-IR',\n  ar: 'ar',\n  en: 'en-US',\n}\n\nexport function ChartTooltip({ active, payload, label, tooltipStyle, formatter, locale = 'fa' }: ChartTooltipProps) {\n  if (!active || !payload?.length) return null\n\n  const bcp47 = LOCALE_TO_BCP47[locale] ?? 'fa-IR'\n\n  return (\n    <div data-slot=\"chart-tooltip\" style={tooltipStyle}>\n      {label && <div style={{ fontWeight: 500, fontSize: 13, marginBottom: 6 }}>{label}</div>}\n      {payload.map((entry, i) => (\n        <div key={i} style={{ display: 'flex', alignItems: 'center', gap: 8, marginTop: i > 0 ? 4 : 0 }}>\n          <div\n            style={{\n              width: 10,\n              height: 10,\n              borderRadius: 2,\n              backgroundColor: entry.color,\n              flexShrink: 0,\n            }}\n          />\n          {formatter ? (\n            formatter(entry.name, entry.value)\n          ) : (\n            <span style={{ display: 'flex', justifyContent: 'space-between', width: '100%', gap: 16 }}>\n              <span style={{ opacity: 0.7 }}>{entry.name}</span>\n              <span style={{ fontWeight: 600, fontVariantNumeric: 'tabular-nums' }}>\n                {typeof entry.value === 'number' ? entry.value.toLocaleString(bcp47) : entry.value}\n              </span>\n            </span>\n          )}\n        </div>\n      ))}\n    </div>\n  )\n}\n\n// ─── Locale-aware tick formatter ─────────────────────────────────────────────\n\n/**\n * Default tickFormatter for numeric chart axes (Y axis on Line/Area/Bar, both\n * axes on Scatter, radial on Radar). Renders Persian/Arabic digits + locale\n * suffix (\"۱.۵ هزار\", \"1.5K\") for fa/ar, Latin K/M/B for en.\n *\n * Pass via `axisLeft={{ tickFormatter: localeAwareNumberTick('fa') }}`, or rely\n * on the chart wrapper's `locale` prop which wires this in by default.\n */\nexport function localeAwareNumberTick(locale: SupportedLocale): (value: unknown) => string {\n  return (value) => {\n    if (typeof value === 'number') return formatLargeNumber(value, locale)\n    if (typeof value === 'string') {\n      // Numeric strings: convert digits only (don't touch labels).\n      if (/^-?\\d+(\\.\\d+)?$/.test(value)) return convertToLocalNumbers(value, locale)\n      return value\n    }\n    return String(value ?? '')\n  }\n}\n\n/**\n * Default tickFormatter for categorical chart axes — converts embedded digits\n * to the locale's numerals (e.g. \"۱۴۰۳-۰۱\" for \"1403-01\") without altering\n * letters. Use on date/time axes whose labels carry digits.\n */\nexport function localeAwareCategoryTick(locale: SupportedLocale): (value: unknown) => string {\n  return (value) => convertToLocalNumbers(String(value ?? ''), locale)\n}\n\n// ─── Chart Legend ────────────────────────────────────────────────────────────\n\nexport interface ChartLegendItem {\n  /** Unique identifier — typically the dataKey or series id. */\n  key: string\n  /** Display label. Strings preferred so AT can read it. */\n  label: React.ReactNode\n  /** Marker color. Pass the resolved value (hsl, hex, or `var(--token)`). */\n  color: string\n  /**\n   * Marker shape. `dot` for categorical (Bar/Pie), `line` for series (Line/Area),\n   * `bar` for stacked distributions. @default `dot`\n   */\n  shape?: 'dot' | 'line' | 'bar'\n  /**\n   * Optional stroke pattern when `shape=\"line\"`. Lets color-blind users\n   * distinguish series by texture in addition to color. WCAG 1.4.1\n   * (Use of Color) recommends adding a non-color signal.\n   */\n  pattern?: 'solid' | 'dashed' | 'dotted' | 'dash-dot'\n  /** Optional trailing value (count, percent, etc.). */\n  value?: React.ReactNode\n}\n\nexport interface ChartLegendProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Series to enumerate. */\n  items: ChartLegendItem[]\n  /** Layout — `horizontal` wraps, `vertical` stacks. @default `horizontal` */\n  orientation?: 'horizontal' | 'vertical'\n  /** Marker square/dot edge length in px. @default `10` */\n  swatchSize?: number\n}\n\nconst PATTERN_DASHARRAY: Record<NonNullable<ChartLegendItem['pattern']>, string | undefined> = {\n  solid: undefined,\n  dashed: '4 3',\n  dotted: '1 3',\n  'dash-dot': '4 2 1 2',\n}\n\n/**\n * Reusable chart legend. Pair with `PartoLineChart`, `PartoBarChart`, etc. by\n * passing `legend={[…]}` or rendering `<ChartLegend>` next to the chart. Each\n * line-shape entry can carry a stroke pattern so colorblind users can read\n * series identity without relying on color alone.\n *\n * The legend has no chart-aware behavior on its own — pass the same colors\n * (resolved via `useChartTheme`) you handed to the chart's `Cell`/series.\n */\nexport const ChartLegend = React.forwardRef<HTMLDivElement, ChartLegendProps>(\n  ({ className, items, orientation = 'horizontal', swatchSize = 10, ...props }, ref) => {\n    const isVertical = orientation === 'vertical'\n    return (\n      <div\n        ref={ref}\n        data-slot=\"chart-legend\"\n        data-orientation={orientation}\n        className={className}\n        style={{\n          display: 'flex',\n          flexWrap: isVertical ? 'nowrap' : 'wrap',\n          flexDirection: isVertical ? 'column' : 'row',\n          gap: isVertical ? '6px' : '12px 16px',\n          fontSize: 12,\n          color: 'hsl(var(--foreground-light))',\n        }}\n        // role=list + role=listitem because we use inline elements for layout\n        // (some browsers/AT strip implicit list semantics from non-li children).\n        role=\"list\"\n        {...props}\n      >\n        {items.map((item) => (\n          <div\n            key={item.key}\n            role=\"listitem\"\n            data-slot=\"chart-legend-item\"\n            style={{ display: 'inline-flex', alignItems: 'center', gap: 6, lineHeight: 1.2 }}\n          >\n            <ChartLegendSwatch\n              color={item.color}\n              shape={item.shape ?? 'dot'}\n              pattern={item.pattern ?? 'solid'}\n              size={swatchSize}\n            />\n            <span style={{ fontWeight: 500 }}>{item.label}</span>\n            {item.value !== undefined && (\n              <span\n                style={{ marginInlineStart: 4, fontVariantNumeric: 'tabular-nums', opacity: 0.7 }}\n                data-slot=\"chart-legend-value\"\n              >\n                {item.value}\n              </span>\n            )}\n          </div>\n        ))}\n      </div>\n    )\n  }\n)\nChartLegend.displayName = 'ChartLegend'\n\nfunction ChartLegendSwatch({\n  color,\n  shape,\n  pattern,\n  size,\n}: {\n  color: string\n  shape: NonNullable<ChartLegendItem['shape']>\n  pattern: NonNullable<ChartLegendItem['pattern']>\n  size: number\n}) {\n  if (shape === 'dot') {\n    return (\n      <span\n        aria-hidden=\"true\"\n        style={{\n          display: 'inline-block',\n          width: size,\n          height: size,\n          borderRadius: '50%',\n          backgroundColor: color,\n          flexShrink: 0,\n        }}\n      />\n    )\n  }\n  if (shape === 'bar') {\n    return (\n      <span\n        aria-hidden=\"true\"\n        style={{\n          display: 'inline-block',\n          width: size + 4,\n          height: Math.max(3, Math.round(size / 2.5)),\n          borderRadius: 2,\n          backgroundColor: color,\n          flexShrink: 0,\n        }}\n      />\n    )\n  }\n  // Line shape — SVG so we can render a stroke-dasharray pattern\n  return (\n    <svg\n      aria-hidden=\"true\"\n      width={size + 8}\n      height={Math.max(8, Math.round(size / 1.5))}\n      viewBox={`0 0 ${size + 8} ${Math.max(8, Math.round(size / 1.5))}`}\n      style={{ flexShrink: 0 }}\n    >\n      <line\n        x1={1}\n        y1={Math.max(8, Math.round(size / 1.5)) / 2}\n        x2={size + 7}\n        y2={Math.max(8, Math.round(size / 1.5)) / 2}\n        stroke={color}\n        strokeWidth={2}\n        strokeLinecap=\"round\"\n        strokeDasharray={PATTERN_DASHARRAY[pattern]}\n      />\n    </svg>\n  )\n}\n\n// ─── Chart Gradient Legend ───────────────────────────────────────────────────\n\nexport interface ChartGradientLegendProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Color at the low end of the scale (e.g. background-muted). */\n  startColor: string\n  /** Color at the high end (e.g. brand). */\n  endColor: string\n  /** Optional left/start label (typically the minimum value). */\n  startLabel?: React.ReactNode\n  /** Optional right/end label (typically the maximum value). */\n  endLabel?: React.ReactNode\n  /** Optional caption above the bar (e.g. \"تراکم انتشار\"). */\n  caption?: React.ReactNode\n  /** Bar width in px @default 160 */\n  width?: number\n  /** Bar height in px @default 8 */\n  height?: number\n}\n\n/**\n * Continuous-scale legend for charts whose data is encoded as color intensity\n * (HeatMap, choropleth, gradient density). Renders a horizontal gradient bar\n * with start/end labels, captioned for AT via `role=\"img\"` + `aria-label`.\n *\n * For discrete categorical legends (Line/Bar/Pie), use `<ChartLegend>` instead.\n */\nexport const ChartGradientLegend = React.forwardRef<HTMLDivElement, ChartGradientLegendProps>(\n  (\n    {\n      className,\n      startColor,\n      endColor,\n      startLabel,\n      endLabel,\n      caption,\n      width = 160,\n      height = 8,\n      'aria-label': ariaLabelProp,\n      ...props\n    },\n    ref\n  ) => {\n    const ariaLabel =\n      ariaLabelProp ??\n      (typeof startLabel === 'string' && typeof endLabel === 'string' ? `${startLabel} تا ${endLabel}` : 'مقیاس رنگ')\n    return (\n      <div\n        ref={ref}\n        data-slot=\"chart-gradient-legend\"\n        className={className}\n        role=\"img\"\n        aria-label={ariaLabel}\n        style={{\n          display: 'inline-flex',\n          flexDirection: 'column',\n          gap: 4,\n          fontSize: 12,\n          color: 'hsl(var(--foreground-light))',\n        }}\n        {...props}\n      >\n        {caption && (\n          <div data-slot=\"chart-gradient-legend-caption\" style={{ fontWeight: 500 }}>\n            {caption}\n          </div>\n        )}\n        <div\n          data-slot=\"chart-gradient-legend-bar\"\n          aria-hidden=\"true\"\n          style={{\n            width,\n            height,\n            borderRadius: height / 2,\n            background: `linear-gradient(to right, ${startColor}, ${endColor})`,\n          }}\n        />\n        {(startLabel !== undefined || endLabel !== undefined) && (\n          <div\n            style={{\n              display: 'flex',\n              justifyContent: 'space-between',\n              width,\n              fontVariantNumeric: 'tabular-nums',\n              opacity: 0.85,\n            }}\n          >\n            <span data-slot=\"chart-gradient-legend-start\">{startLabel}</span>\n            <span data-slot=\"chart-gradient-legend-end\">{endLabel}</span>\n          </div>\n        )}\n      </div>\n    )\n  }\n)\nChartGradientLegend.displayName = 'ChartGradientLegend'\n\n// ─── Data Transform Utility ──────────────────────────────────────────────────\n\n/**\n * Transforms Nivo line/area data format to Recharts row-oriented format.\n * Useful for consumers migrating from Nivo data shape.\n *\n * @example\n * // Nivo: [{ id: \"فروش\", data: [{ x: \"فروردین\", y: 50 }] }]\n * // Recharts: [{ name: \"فروردین\", فروش: 50 }]\n */\nexport function transformNivoLineData(\n  nivoData: Array<{ id: string; data: Array<{ x: string | number; y: number }> }>\n): { data: Array<Record<string, string | number>>; dataKeys: string[] } {\n  const dataKeys = nivoData.map((s) => s.id)\n  const xValues = nivoData[0]?.data.map((d) => d.x) ?? []\n\n  const data = xValues.map((x, xi) => {\n    const row: Record<string, string | number> = { name: x }\n    for (const series of nivoData) {\n      row[series.id] = series.data[xi]?.y ?? 0\n    }\n    return row\n  })\n\n  return { data, dataKeys }\n}\n"]}