@kjaniec-dev/ui 0.9.3 → 1.0.0

package/dist/index.js

@@ -529,9 +529,18 @@ var CheckboxField = React52.forwardRef(
 );
 CheckboxField.displayName = "CheckboxField";
 var Switch = React52.forwardRef(
-  ({ className, label, id, ...props }, ref) => {
+  ({ className, label, id, checked, defaultChecked, onChange, ...props }, ref) => {
     const autoId = React52.useId();
     const inputId = id ?? autoId;
+    const isControlled = checked !== void 0;
+    const [internalChecked, setInternalChecked] = React52.useState(Boolean(defaultChecked));
+    const isChecked = isControlled ? Boolean(checked) : internalChecked;
+    const handleChange = (e) => {
+      if (!isControlled) {
+        setInternalChecked(e.target.checked);
+      }
+      onChange?.(e);
+    };
     return /* @__PURE__ */ jsxs(
       "label",
       {
@@ -548,6 +557,10 @@ var Switch = React52.forwardRef(
               id: inputId,
               type: "checkbox",
               role: "switch",
+              "aria-checked": isChecked,
+              checked: isControlled ? checked : void 0,
+              defaultChecked: !isControlled ? defaultChecked : void 0,
+              onChange: handleChange,
               className: "peer sr-only",
               ...props
             }
@@ -1654,16 +1667,44 @@ function ToastProvider({ children }) {
       "div",
       {
         role: "status",
-        onClick: () => remove(t.id),
         className: cn(
-          "flex items-center gap-2.5 min-w-[280px] px-4 py-3 cursor-pointer",
+          "flex items-center justify-between gap-3 min-w-[280px] px-4 py-3",
           "bg-surface border border-border border-l-[3px] rounded-kj-md shadow-kj-lg text-[0.85rem] font-medium",
           toneBorder[t.tone],
           t.leaving ? "animate-[kjtoastout_.25s_ease_forwards]" : "animate-[kjtoastin_.25s_ease]"
         ),
         children: [
-          /* @__PURE__ */ jsx("span", { className: "grid place-items-center", children: icons[t.tone] }),
-          /* @__PURE__ */ jsx("span", { children: t.message })
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5", children: [
+            /* @__PURE__ */ jsx("span", { className: "grid place-items-center", children: icons[t.tone] }),
+            /* @__PURE__ */ jsx("span", { children: t.message })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "aria-label": "Dismiss notification",
+              onClick: () => remove(t.id),
+              className: "ml-auto text-muted-foreground hover:text-foreground p-1 -mr-1 rounded-kj-sm transition-colors cursor-pointer",
+              children: /* @__PURE__ */ jsxs(
+                "svg",
+                {
+                  width: 14,
+                  height: 14,
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: 2,
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  "aria-hidden": "true",
+                  children: [
+                    /* @__PURE__ */ jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+                    /* @__PURE__ */ jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+                  ]
+                }
+              )
+            }
+          )
         ]
       },
       t.id
@@ -1889,7 +1930,7 @@ function DataTable({
     onSelectionChange(next);
   };
   return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-4 w-full", className), children: [
-    toolbar && /* @__PURE__ */ jsx("div", { className: "flex flex-col sm:flex-row items-stretch sm:items-center justify-between gap-3", children: toolbar }),
+    toolbar && /* @__PURE__ */ jsx("div", { className: "w-full min-w-0", children: toolbar }),
     /* @__PURE__ */ jsxs(
       TableWrap,
       {
@@ -2362,12 +2403,12 @@ var TableToolbar = React52.forwardRef(
       {
         ref,
         className: cn(
-          "flex flex-col sm:flex-row items-stretch sm:items-center justify-between gap-3 w-full pb-1",
+          "flex flex-col sm:flex-row flex-wrap items-stretch sm:items-center justify-between gap-3 w-full pb-1",
           className
         ),
         ...props,
         children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col sm:flex-row items-stretch sm:items-center gap-2 max-w-xl", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col sm:flex-row sm:flex-wrap items-stretch sm:items-center gap-2 min-w-0 max-w-xl", children: [
             onSearchChange && /* @__PURE__ */ jsx(
               Input,
               {
@@ -2375,7 +2416,7 @@ var TableToolbar = React52.forwardRef(
                 placeholder: searchPlaceholder,
                 value: searchQuery,
                 onChange: (e) => onSearchChange(e.target.value),
-                className: "sm:w-64",
+                className: "w-full sm:w-64 max-w-full",
                 leadingIcon: /* @__PURE__ */ jsx(
                   "svg",
                   {
@@ -2396,9 +2437,9 @@ var TableToolbar = React52.forwardRef(
                 )
               }
             ),
-            filters && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: filters })
+            filters && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-2 min-w-0", children: filters })
           ] }),
-          actions && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 shrink-0 justify-end", children: actions })
+          actions && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-2 shrink-0 justify-end sm:ml-auto", children: actions })
         ]
       }
     );
@@ -2984,7 +3025,6 @@ function BottomSheet({
   return /* @__PURE__ */ jsx(BottomSheetContext.Provider, { value: { titleId, descId }, children: /* @__PURE__ */ jsx(
     "div",
     {
-      role: "presentation",
       onClick: (e) => e.target === e.currentTarget && onClose(),
       className: cn(
         "fixed inset-0 z-[100] grid items-end sm:place-items-center p-0 sm:p-6 backdrop-blur-[3px] transition-all duration-200",
@@ -7284,6 +7324,2077 @@ var InPostGeowidgetModal = ({
   ] });
 };
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AppShell, AppShellBanner, AppShellFooter, AppShellHeader, AppShellMain, Avatar, AvatarGroup, Badge, BlogCard, BottomNavigation, BottomSheet, BottomSheetContent, BottomSheetDescription, BottomSheetFooter, BottomSheetHeader, BottomSheetTitle, Breadcrumb, BreadcrumbItem, BreadcrumbSeparator, Button, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, CheckboxField, CodeBlock, ColorPicker, ColorPickerField, ColorPickerSwatch, Combobox, ComboboxField, CommandPalette, ConfirmDialog, DEFAULT_COLOR_SWATCHES, DashboardShell, DataTable, DatePicker, DatePickerField, DateRangePicker, DateRangePickerField, DetailPageLayout, Drawer, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, Dropzone, EmptyState, ErrorState, Fab, Field, FileUpload, FileUploadField, FormField, Hint, ImageGallery, InPostGeowidget, InPostGeowidgetModal, InboxContent, InboxPopover, InboxTrigger, Input, Kbd, Label, MetricCard, Modal, ModalActions, ModalDescription, ModalTitle, NotificationItem, PageHeader, Pagination, Popover, PopoverContent, PopoverTrigger, PricingCard, Progress, ProgressRing, ProgressRingField, ProjectCard, Radio, RangeCalendar, Rating, RatingField, RatingSummary, SectionHeader, Segmented, Select, SelectField, Separator, SettingsLayout, SidebarNav, Skeleton, Slider, Spinner, Stat, Stepper, StepperContent, StepperDescription, StepperIndicator, StepperItem, StepperList, StepperSeparator, StepperTitle, StepperTrigger, Switch, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, TableToolbar, TableWrap, Tabs, TabsContent, TabsList, TabsTrigger, TextField, Textarea, Timeline, TimelineConnector, TimelineContent, TimelineDot, TimelineItem, TimelineSeparator, TimelineTime, TimelineTitle, ToastProvider, ToggleGroup, Tooltip, badgeVariants, buttonVariants, cn, formatRelativeTime, hexToHsl, hslToHex, isValidHex, normalizeHex, sliderThumbCSS, useInPostScript, useInboxState, useStepper, useToast };
+// src/components/chart-math.ts
+function formatCoordinate(val) {
+  if (!Number.isFinite(val)) return "0";
+  return Number.isInteger(val) ? val.toString() : Number(val.toFixed(2)).toString();
+}
+function niceNum(range2, round) {
+  if (range2 <= 0 || !Number.isFinite(range2)) return 1;
+  const exponent = Math.floor(Math.log10(range2));
+  const fraction = range2 / 10 ** exponent;
+  let niceFraction;
+  {
+    if (fraction < 1.5) niceFraction = 1;
+    else if (fraction < 3) niceFraction = 2;
+    else if (fraction < 7) niceFraction = 5;
+    else niceFraction = 10;
+  }
+  return niceFraction * 10 ** exponent;
+}
+function getNiceScale(minInput, maxInput, tickCount = 5) {
+  let min = Number.isFinite(minInput) ? minInput : 0;
+  let max = Number.isFinite(maxInput) ? maxInput : 1;
+  if (min > max) {
+    const temp = min;
+    min = max;
+    max = temp;
+  }
+  if (min === max) {
+    if (min === 0) {
+      min = 0;
+      max = 1;
+    } else {
+      const delta = Math.abs(min) * 0.2 || 1;
+      min = min - delta;
+      max = max + delta;
+    }
+  }
+  const rawRange = max - min;
+  const count = Math.max(2, tickCount);
+  const step = niceNum(rawRange / count);
+  const niceMin = Math.floor(min / step) * step;
+  const niceMax = Math.ceil(max / step) * step;
+  const ticks = [];
+  const totalTicks = Math.round((niceMax - niceMin) / step);
+  for (let i = 0; i <= totalTicks; i++) {
+    const val = niceMin + i * step;
+    ticks.push(Number(parseFloat(val.toPrecision(12))));
+  }
+  return {
+    min: Number(parseFloat(niceMin.toPrecision(12))),
+    max: Number(parseFloat(niceMax.toPrecision(12))),
+    ticks
+  };
+}
+function linearScale(val, domain, range2) {
+  if (!Number.isFinite(val)) return range2[0];
+  const [d0, d1] = domain;
+  const [r0, r1] = range2;
+  const domainDelta = d1 - d0;
+  if (domainDelta === 0) {
+    return r0;
+  }
+  const ratio = (val - d0) / domainDelta;
+  return r0 + ratio * (r1 - r0);
+}
+function generateLinePath(points, curve = "linear") {
+  const n = points.length;
+  if (n === 0) return "";
+  if (n === 1) return `M ${formatCoordinate(points[0].x)} ${formatCoordinate(points[0].y)}`;
+  if (curve === "step") {
+    const commands2 = [
+      `M ${formatCoordinate(points[0].x)} ${formatCoordinate(points[0].y)}`
+    ];
+    for (let i = 1; i < n; i++) {
+      const p = points[i];
+      commands2.push(`H ${formatCoordinate(p.x)} V ${formatCoordinate(p.y)}`);
+    }
+    return commands2.join(" ");
+  }
+  if (curve === "smooth") {
+    const commands2 = [
+      `M ${formatCoordinate(points[0].x)} ${formatCoordinate(points[0].y)}`
+    ];
+    for (let i = 0; i < n - 1; i++) {
+      const p0 = i > 0 ? points[i - 1] : {
+        x: 2 * points[0].x - points[1].x,
+        y: 2 * points[0].y - points[1].y
+      };
+      const p1 = points[i];
+      const p2 = points[i + 1];
+      const p3 = i + 2 < n ? points[i + 2] : {
+        x: 2 * points[n - 1].x - points[n - 2].x,
+        y: 2 * points[n - 1].y - points[n - 2].y
+      };
+      const cp1x = p1.x + (p2.x - p0.x) / 6;
+      const cp1y = p1.y + (p2.y - p0.y) / 6;
+      const cp2x = p2.x - (p3.x - p1.x) / 6;
+      const cp2y = p2.y - (p3.y - p1.y) / 6;
+      commands2.push(
+        `C ${formatCoordinate(cp1x)} ${formatCoordinate(cp1y)}, ${formatCoordinate(cp2x)} ${formatCoordinate(cp2y)}, ${formatCoordinate(p2.x)} ${formatCoordinate(p2.y)}`
+      );
+    }
+    return commands2.join(" ");
+  }
+  const commands = points.map(
+    (p, i) => i === 0 ? `M ${formatCoordinate(p.x)} ${formatCoordinate(p.y)}` : `L ${formatCoordinate(p.x)} ${formatCoordinate(p.y)}`
+  );
+  return commands.join(" ");
+}
+function generateAreaPath(points, baselineY, curve = "linear") {
+  if (points.length === 0) return "";
+  if (points.length === 1) {
+    const p = points[0];
+    return `M ${formatCoordinate(p.x)} ${formatCoordinate(p.y)} L ${formatCoordinate(p.x)} ${formatCoordinate(baselineY)} Z`;
+  }
+  const linePath = generateLinePath(points, curve);
+  const first = points[0];
+  const last = points[points.length - 1];
+  return `${linePath} L ${formatCoordinate(last.x)} ${formatCoordinate(baselineY)} L ${formatCoordinate(first.x)} ${formatCoordinate(baselineY)} Z`;
+}
+function calculateBarLayout(options) {
+  const {
+    dataCount,
+    seriesCount,
+    plotWidth,
+    plotHeight,
+    yDomain,
+    data,
+    mode = "grouped",
+    layout = "vertical",
+    barMaxWidth,
+    groupPadding = 0.2,
+    barPadding = 2
+  } = options;
+  if (data.length === 0 || dataCount <= 0 || seriesCount <= 0) {
+    return [];
+  }
+  const domainSpan = yDomain[1] - yDomain[0];
+  const safeDomainSpan = domainSpan !== 0 ? domainSpan : 1;
+  const isVertical = layout === "vertical";
+  const slotSize = isVertical ? plotWidth / dataCount : plotHeight / dataCount;
+  if (isVertical) {
+    if (mode === "grouped") {
+      const groupWidth = slotSize * (1 - groupPadding);
+      const totalGaps = Math.max(0, seriesCount - 1) * barPadding;
+      let rawBarWidth2 = (groupWidth - totalGaps) / seriesCount;
+      if (rawBarWidth2 < 1) rawBarWidth2 = Math.max(1, groupWidth / seriesCount);
+      const barWidth2 = barMaxWidth ? Math.min(rawBarWidth2, barMaxWidth) : rawBarWidth2;
+      const actualGroupBarsWidth = seriesCount * barWidth2 + (seriesCount - 1) * barPadding;
+      return data.map((item) => {
+        const groupStart = item.group * slotSize + (slotSize - actualGroupBarsWidth) / 2;
+        const x = groupStart + item.seriesIndex * (barWidth2 + barPadding);
+        const height = Math.abs(item.value) / safeDomainSpan * plotHeight;
+        const y = plotHeight - height;
+        return {
+          ...item,
+          x: Number(parseFloat(x.toPrecision(10))),
+          y: Number(parseFloat(y.toPrecision(10))),
+          width: Number(parseFloat(barWidth2.toPrecision(10))),
+          height: Number(parseFloat(height.toPrecision(10)))
+        };
+      });
+    }
+    const rawBarWidth = slotSize * (1 - groupPadding);
+    const barWidth = barMaxWidth ? Math.min(rawBarWidth, barMaxWidth) : rawBarWidth;
+    const currentStackTops = /* @__PURE__ */ new Map();
+    return data.map((item) => {
+      const groupCenter = item.group * slotSize + slotSize / 2;
+      const x = groupCenter - barWidth / 2;
+      const height = Math.abs(item.value) / safeDomainSpan * plotHeight;
+      const currentY = currentStackTops.get(item.group) ?? plotHeight;
+      const y = currentY - height;
+      currentStackTops.set(item.group, y);
+      return {
+        ...item,
+        x: Number(parseFloat(x.toPrecision(10))),
+        y: Number(parseFloat(y.toPrecision(10))),
+        width: Number(parseFloat(barWidth.toPrecision(10))),
+        height: Number(parseFloat(height.toPrecision(10)))
+      };
+    });
+  }
+  if (mode === "grouped") {
+    const groupHeight = slotSize * (1 - groupPadding);
+    const totalGaps = Math.max(0, seriesCount - 1) * barPadding;
+    let rawBarHeight2 = (groupHeight - totalGaps) / seriesCount;
+    if (rawBarHeight2 < 1) rawBarHeight2 = Math.max(1, groupHeight / seriesCount);
+    const barHeight2 = barMaxWidth ? Math.min(rawBarHeight2, barMaxWidth) : rawBarHeight2;
+    const actualGroupBarsHeight = seriesCount * barHeight2 + (seriesCount - 1) * barPadding;
+    return data.map((item) => {
+      const groupStart = item.group * slotSize + (slotSize - actualGroupBarsHeight) / 2;
+      const y = groupStart + item.seriesIndex * (barHeight2 + barPadding);
+      const width = Math.abs(item.value) / safeDomainSpan * plotWidth;
+      const x = 0;
+      return {
+        ...item,
+        x: Number(parseFloat(x.toPrecision(10))),
+        y: Number(parseFloat(y.toPrecision(10))),
+        width: Number(parseFloat(width.toPrecision(10))),
+        height: Number(parseFloat(barHeight2.toPrecision(10)))
+      };
+    });
+  }
+  const rawBarHeight = slotSize * (1 - groupPadding);
+  const barHeight = barMaxWidth ? Math.min(rawBarHeight, barMaxWidth) : rawBarHeight;
+  const currentStackRights = /* @__PURE__ */ new Map();
+  return data.map((item) => {
+    const groupCenter = item.group * slotSize + slotSize / 2;
+    const y = groupCenter - barHeight / 2;
+    const width = Math.abs(item.value) / safeDomainSpan * plotWidth;
+    const currentX = currentStackRights.get(item.group) ?? 0;
+    const x = currentX;
+    currentStackRights.set(item.group, currentX + width);
+    return {
+      ...item,
+      x: Number(parseFloat(x.toPrecision(10))),
+      y: Number(parseFloat(y.toPrecision(10))),
+      width: Number(parseFloat(width.toPrecision(10))),
+      height: Number(parseFloat(barHeight.toPrecision(10)))
+    };
+  });
+}
+function calculateDonutSegments(slices, options) {
+  const { cx, cy, innerRadius, outerRadius, startAngle = -90 } = options;
+  if (slices.length === 0) {
+    return [];
+  }
+  const total = slices.reduce((sum, s) => sum + (s.value > 0 ? s.value : 0), 0);
+  if (total === 0) {
+    return slices.map((slice) => ({
+      ...slice,
+      percentage: 0,
+      path: "",
+      startAngle: 0,
+      endAngle: 0,
+      middleAngle: 0
+    }));
+  }
+  let currentAngleRad = startAngle * Math.PI / 180;
+  const segments = [];
+  for (const slice of slices) {
+    if (slice.value <= 0) {
+      segments.push({
+        ...slice,
+        percentage: 0,
+        path: "",
+        startAngle: Number(parseFloat((currentAngleRad * (180 / Math.PI)).toPrecision(8))),
+        endAngle: Number(parseFloat((currentAngleRad * (180 / Math.PI)).toPrecision(8))),
+        middleAngle: Number(parseFloat((currentAngleRad * (180 / Math.PI)).toPrecision(8)))
+      });
+      continue;
+    }
+    const ratio = slice.value / total;
+    const percentage = Math.round(ratio * 1e4) / 100;
+    const angleSpanRad = ratio * 2 * Math.PI;
+    const startA = currentAngleRad;
+    const endA = currentAngleRad + angleSpanRad;
+    const middleA = currentAngleRad + angleSpanRad / 2;
+    currentAngleRad = endA;
+    const startDeg = Number(parseFloat((startA * (180 / Math.PI)).toPrecision(8)));
+    const endDeg = Number(parseFloat((endA * (180 / Math.PI)).toPrecision(8)));
+    const middleDeg = Number(parseFloat((middleA * (180 / Math.PI)).toPrecision(8)));
+    if (ratio >= 0.99999) {
+      let fullPath = "";
+      if (innerRadius > 0) {
+        fullPath = `M ${formatCoordinate(cx)} ${formatCoordinate(cy - outerRadius)} A ${formatCoordinate(outerRadius)} ${formatCoordinate(outerRadius)} 0 1 1 ${formatCoordinate(cx)} ${formatCoordinate(cy + outerRadius)} A ${formatCoordinate(outerRadius)} ${formatCoordinate(outerRadius)} 0 1 1 ${formatCoordinate(cx)} ${formatCoordinate(cy - outerRadius)} L ${formatCoordinate(cx)} ${formatCoordinate(cy - innerRadius)} A ${formatCoordinate(innerRadius)} ${formatCoordinate(innerRadius)} 0 1 0 ${formatCoordinate(cx)} ${formatCoordinate(cy + innerRadius)} A ${formatCoordinate(innerRadius)} ${formatCoordinate(innerRadius)} 0 1 0 ${formatCoordinate(cx)} ${formatCoordinate(cy - innerRadius)} Z`;
+      } else {
+        fullPath = `M ${formatCoordinate(cx)} ${formatCoordinate(cy - outerRadius)} A ${formatCoordinate(outerRadius)} ${formatCoordinate(outerRadius)} 0 1 1 ${formatCoordinate(cx)} ${formatCoordinate(cy + outerRadius)} A ${formatCoordinate(outerRadius)} ${formatCoordinate(outerRadius)} 0 1 1 ${formatCoordinate(cx)} ${formatCoordinate(cy - outerRadius)} Z`;
+      }
+      segments.push({
+        ...slice,
+        percentage,
+        path: fullPath,
+        startAngle: startDeg,
+        endAngle: endDeg,
+        middleAngle: middleDeg
+      });
+      continue;
+    }
+    const x1 = cx + outerRadius * Math.cos(startA);
+    const y1 = cy + outerRadius * Math.sin(startA);
+    const x2 = cx + outerRadius * Math.cos(endA);
+    const y2 = cy + outerRadius * Math.sin(endA);
+    const largeArcFlag = angleSpanRad > Math.PI ? 1 : 0;
+    let path = "";
+    if (innerRadius > 0) {
+      const x3 = cx + innerRadius * Math.cos(endA);
+      const y3 = cy + innerRadius * Math.sin(endA);
+      const x4 = cx + innerRadius * Math.cos(startA);
+      const y4 = cy + innerRadius * Math.sin(startA);
+      path = `M ${formatCoordinate(x1)} ${formatCoordinate(y1)} A ${formatCoordinate(outerRadius)} ${formatCoordinate(outerRadius)} 0 ${largeArcFlag} 1 ${formatCoordinate(x2)} ${formatCoordinate(y2)} L ${formatCoordinate(x3)} ${formatCoordinate(y3)} A ${formatCoordinate(innerRadius)} ${formatCoordinate(innerRadius)} 0 ${largeArcFlag} 0 ${formatCoordinate(x4)} ${formatCoordinate(y4)} Z`;
+    } else {
+      path = `M ${formatCoordinate(x1)} ${formatCoordinate(y1)} A ${formatCoordinate(outerRadius)} ${formatCoordinate(outerRadius)} 0 ${largeArcFlag} 1 ${formatCoordinate(x2)} ${formatCoordinate(y2)} L ${formatCoordinate(cx)} ${formatCoordinate(cy)} Z`;
+    }
+    segments.push({
+      ...slice,
+      percentage,
+      path,
+      startAngle: startDeg,
+      endAngle: endDeg,
+      middleAngle: middleDeg
+    });
+  }
+  return segments;
+}
+var CHART_COLOR_VARS = {
+  chart1: "var(--kj-chart1, #a84f08)",
+  chart2: "var(--kj-chart2, #0f746d)",
+  chart3: "var(--kj-chart3, #0284c7)",
+  chart4: "var(--kj-chart4, #7c3aed)",
+  chart5: "var(--kj-chart5, #e11d48)",
+  chart6: "var(--kj-chart6, #65a30d)"
+};
+var DEFAULT_CHART_COLORS = [
+  "chart1",
+  "chart2",
+  "chart3",
+  "chart4",
+  "chart5",
+  "chart6"
+];
+function getChartColor(color, fallbackIndex = 0) {
+  if (!color) {
+    const defaultKey = DEFAULT_CHART_COLORS[fallbackIndex % DEFAULT_CHART_COLORS.length];
+    return CHART_COLOR_VARS[defaultKey] || defaultKey;
+  }
+  return CHART_COLOR_VARS[color] ?? color;
+}
+var SVG_TAGS = /* @__PURE__ */ new Set([
+  "path",
+  "rect",
+  "circle",
+  "ellipse",
+  "line",
+  "polyline",
+  "polygon",
+  "text",
+  "tspan",
+  "g",
+  "defs",
+  "linearGradient",
+  "radialGradient",
+  "stop",
+  "pattern",
+  "clipPath",
+  "mask",
+  "image",
+  "use",
+  "symbol",
+  "animate",
+  "animateTransform",
+  "foreignObject"
+]);
+function isSvgChild(child) {
+  if (!React52.isValidElement(child)) return false;
+  if (typeof child.type === "string") {
+    return SVG_TAGS.has(child.type);
+  }
+  const comp = child.type;
+  if (comp.isSvg) return true;
+  const name = comp.displayName || comp.name || "";
+  if (name.includes("Grid") || name.includes("Axis")) {
+    return true;
+  }
+  return false;
+}
+function isOverlayChild(child) {
+  if (!React52.isValidElement(child)) return false;
+  const comp = child.type;
+  const name = comp?.displayName || comp?.name || "";
+  if (name.includes("Tooltip")) return true;
+  const className = child.props?.className;
+  if (typeof className === "string") {
+    if (className.includes("chart-tooltip") || className.includes("chart-donut-center") || className.includes("chart-empty-message") || className.includes("absolute")) {
+      return true;
+    }
+  }
+  return false;
+}
+function partitionChildren(children) {
+  const svgChildren = [];
+  const overlayChildren = [];
+  const flowChildren = [];
+  const categorize = (child) => {
+    if (child === null || child === void 0 || typeof child === "boolean") {
+      return;
+    }
+    if (React52.isValidElement(child) && child.type === React52.Fragment) {
+      const inner = partitionChildren(child.props.children);
+      svgChildren.push(...inner.svgChildren);
+      overlayChildren.push(...inner.overlayChildren);
+      flowChildren.push(...inner.flowChildren);
+      return;
+    }
+    if (isSvgChild(child)) {
+      svgChildren.push(child);
+      return;
+    }
+    if (isOverlayChild(child)) {
+      overlayChildren.push(child);
+      return;
+    }
+    flowChildren.push(child);
+  };
+  React52.Children.forEach(children, categorize);
+  return { svgChildren, overlayChildren, flowChildren };
+}
+function useChartWidth(containerRef, defaultWidth = 600) {
+  const [width, setWidth] = React52.useState(defaultWidth);
+  React52.useEffect(() => {
+    const el = containerRef.current;
+    if (!el) return;
+    const measure = () => {
+      const rect = el.getBoundingClientRect();
+      if (rect.width > 0) {
+        setWidth(Math.round(rect.width));
+      }
+    };
+    measure();
+    if (typeof ResizeObserver === "undefined") {
+      return;
+    }
+    const observer = new ResizeObserver((entries) => {
+      for (const entry of entries) {
+        const w = entry.contentRect.width;
+        if (w > 0) {
+          setWidth(Math.round(w));
+        }
+      }
+    });
+    observer.observe(el);
+    return () => {
+      observer.disconnect();
+    };
+  }, [containerRef]);
+  return width;
+}
+var ChartContainer = React52.forwardRef(
+  ({
+    width,
+    height,
+    viewBox,
+    "aria-label": ariaLabelProp,
+    ariaLabel,
+    overlay,
+    svgClassName,
+    svgRef,
+    plotWrapperClassName,
+    plotWrapperStyle,
+    children,
+    className,
+    style,
+    ...props
+  }, ref) => {
+    const label = ariaLabelProp || ariaLabel;
+    const { svgChildren, overlayChildren, flowChildren } = partitionChildren(children);
+    const heightNum = typeof height === "number" ? height : void 0;
+    const computedViewBox = viewBox || (width !== void 0 && heightNum !== void 0 ? `0 0 ${width} ${heightNum}` : void 0);
+    const plotHeightStyle = typeof height === "number" ? `${height}px` : height ?? void 0;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn("chart-container relative w-full flex flex-col", className),
+        style,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: cn("chart-plot-wrapper relative w-full", plotWrapperClassName),
+              style: {
+                height: plotHeightStyle,
+                width: typeof width === "number" ? `${width}px` : void 0,
+                ...plotWrapperStyle
+              },
+              children: [
+                svgChildren.length > 0 && /* @__PURE__ */ jsx(
+                  "svg",
+                  {
+                    ref: svgRef,
+                    role: "img",
+                    "aria-label": label,
+                    viewBox: computedViewBox,
+                    width,
+                    height: heightNum,
+                    className: cn(
+                      "chart-svg block w-full overflow-visible",
+                      height !== void 0 ? "h-full" : "h-auto",
+                      svgClassName
+                    ),
+                    children: svgChildren
+                  }
+                ),
+                overlayChildren,
+                overlay
+              ]
+            }
+          ),
+          flowChildren
+        ]
+      }
+    );
+  }
+);
+ChartContainer.displayName = "ChartContainer";
+var ChartGrid = ({
+  width = 0,
+  height = 0,
+  yTicks,
+  xTicks,
+  scaleY,
+  scaleX,
+  yDomain,
+  yRange,
+  xDomain,
+  xRange,
+  stroke = "var(--kj-border-subtle, #e5e7eb)",
+  strokeDasharray = "3 3",
+  strokeWidth = 1,
+  strokeOpacity = 1,
+  horizontal = true,
+  vertical,
+  className,
+  ...props
+}) => {
+  const shouldDrawHorizontal = horizontal && Boolean(yTicks && yTicks.length > 0);
+  const shouldDrawVertical = (vertical ?? Boolean(xTicks && xTicks.length > 0)) && Boolean(xTicks && xTicks.length > 0);
+  const getY = scaleY ?? (yDomain && yRange ? (val) => linearScale(val, yDomain, yRange) : (val) => val);
+  const getX = scaleX ?? (xDomain && xRange ? (val) => linearScale(val, xDomain, xRange) : (val) => val);
+  return /* @__PURE__ */ jsxs("g", { className: cn("chart-grid pointer-events-none", className), ...props, children: [
+    shouldDrawHorizontal && yTicks?.map((tick, idx) => {
+      const yPos = getY(tick);
+      return /* @__PURE__ */ jsx(
+        "line",
+        {
+          x1: 0,
+          y1: yPos,
+          x2: width,
+          y2: yPos,
+          stroke,
+          strokeDasharray,
+          strokeWidth,
+          strokeOpacity,
+          className: "chart-grid-line chart-grid-line-y"
+        },
+        `grid-y-${idx}-${tick}`
+      );
+    }),
+    shouldDrawVertical && xTicks?.map((tick, idx) => {
+      const xPos = getX(tick);
+      return /* @__PURE__ */ jsx(
+        "line",
+        {
+          x1: xPos,
+          y1: 0,
+          x2: xPos,
+          y2: height,
+          stroke,
+          strokeDasharray,
+          strokeWidth,
+          strokeOpacity,
+          className: "chart-grid-line chart-grid-line-x"
+        },
+        `grid-x-${idx}-${tick}`
+      );
+    })
+  ] });
+};
+ChartGrid.displayName = "ChartGrid";
+var ChartXAxis = ({
+  ticks,
+  y,
+  formatter,
+  valueFormatter,
+  textAnchor = "middle",
+  dy = "1.2em",
+  className,
+  tickClassName,
+  ...props
+}) => {
+  const format = formatter ?? valueFormatter ?? ((v) => String(v));
+  return /* @__PURE__ */ jsx("g", { className: cn("chart-x-axis", className), ...props, children: ticks.map((tick, idx) => /* @__PURE__ */ jsx(
+    "text",
+    {
+      x: tick.x,
+      y,
+      dy,
+      textAnchor,
+      fill: "currentColor",
+      className: cn("chart-x-tick text-xs fill-muted-foreground select-none", tickClassName),
+      children: format(tick.value)
+    },
+    `x-tick-${idx}-${tick.value}`
+  )) });
+};
+ChartXAxis.displayName = "ChartXAxis";
+var ChartYAxis = ({
+  ticks,
+  x,
+  formatter,
+  valueFormatter,
+  textAnchor = "end",
+  dx = "-0.5em",
+  dominantBaseline = "middle",
+  className,
+  tickClassName,
+  ...props
+}) => {
+  const format = formatter ?? valueFormatter ?? ((v) => String(v));
+  return /* @__PURE__ */ jsx("g", { className: cn("chart-y-axis", className), ...props, children: ticks.map((tick, idx) => /* @__PURE__ */ jsx(
+    "text",
+    {
+      x,
+      y: tick.y,
+      dx,
+      textAnchor,
+      dominantBaseline,
+      fill: "currentColor",
+      className: cn("chart-y-tick text-xs fill-muted-foreground select-none", tickClassName),
+      children: format(tick.value)
+    },
+    `y-tick-${idx}-${tick.value}`
+  )) });
+};
+ChartYAxis.displayName = "ChartYAxis";
+var ChartTooltip = React52.forwardRef(
+  ({
+    title,
+    items,
+    x,
+    y,
+    open = true,
+    crosshairX,
+    crosshairHeight,
+    showCrosshair = false,
+    valueFormatter,
+    content,
+    className,
+    style,
+    ...props
+  }, ref) => {
+    if (!open) {
+      return null;
+    }
+    const hasCoordinates = x !== void 0 && y !== void 0;
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      showCrosshair && crosshairX !== void 0 && /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "chart-crosshair pointer-events-none absolute top-0 w-px border-l border-dashed border-border/80",
+          style: {
+            left: `${crosshairX}px`,
+            height: crosshairHeight !== void 0 ? `${crosshairHeight}px` : "100%"
+          },
+          "aria-hidden": "true"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          ref,
+          className: cn(
+            "chart-tooltip pointer-events-none absolute z-50 min-w-[120px] rounded-lg border border-border bg-popover/95 p-2.5 text-xs text-popover-foreground shadow-md backdrop-blur-sm transition-opacity duration-150",
+            className
+          ),
+          style: {
+            left: x !== void 0 ? `${x}px` : void 0,
+            top: y !== void 0 ? `${y}px` : void 0,
+            transform: hasCoordinates ? "translate(-50%, -100%) translateY(-8px)" : void 0,
+            ...style
+          },
+          ...props,
+          children: content ? content : /* @__PURE__ */ jsxs(Fragment, { children: [
+            title && /* @__PURE__ */ jsx("div", { className: "chart-tooltip-title font-medium text-foreground mb-1.5 pb-1 border-b border-border/50", children: title }),
+            items && items.length > 0 && /* @__PURE__ */ jsx("div", { className: "chart-tooltip-items space-y-1", children: items.map((item, idx) => {
+              const itemVal = item.formattedValue ?? (typeof item.value === "number" && valueFormatter ? valueFormatter(item.value) : item.value);
+              return /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  className: "chart-tooltip-item flex items-center justify-between gap-3",
+                  children: [
+                    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 min-w-0", children: [
+                      /* @__PURE__ */ jsx(
+                        "span",
+                        {
+                          className: "chart-tooltip-dot h-2 w-2 rounded-full shrink-0",
+                          style: { backgroundColor: getChartColor(item.color, idx) },
+                          "aria-hidden": "true"
+                        }
+                      ),
+                      /* @__PURE__ */ jsx("span", { className: "truncate text-muted-foreground", children: item.label })
+                    ] }),
+                    /* @__PURE__ */ jsx("span", { className: "font-semibold text-foreground shrink-0", children: itemVal })
+                  ]
+                },
+                item.key ?? idx
+              );
+            }) })
+          ] })
+        }
+      )
+    ] });
+  }
+);
+ChartTooltip.displayName = "ChartTooltip";
+ChartTooltip.isHtml = true;
+var ChartLegend = ({
+  series,
+  activeSeries,
+  disabledSeries,
+  onToggle,
+  orientation = "horizontal",
+  className,
+  itemClassName,
+  ...props
+}) => {
+  const isInteractive = Boolean(onToggle);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "chart-legend flex flex-wrap items-center justify-center gap-4 py-2",
+        orientation === "vertical" && "flex-col items-start gap-2",
+        className
+      ),
+      ...props,
+      children: series.map((item, idx) => {
+        const isDisabled = disabledSeries?.includes(item.key) || activeSeries !== void 0 && !activeSeries.includes(item.key);
+        const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: "chart-legend-dot h-2.5 w-2.5 rounded-full shrink-0",
+              style: { backgroundColor: getChartColor(item.color, idx) },
+              "aria-hidden": "true"
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: "chart-legend-label", children: item.label })
+        ] });
+        if (isInteractive) {
+          return /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => onToggle?.(item.key),
+              onKeyDown: (e) => {
+                if (e.key === "Enter" || e.key === " ") {
+                  e.preventDefault();
+                  onToggle?.(item.key);
+                }
+              },
+              "aria-pressed": !isDisabled,
+              className: cn(
+                "chart-legend-item inline-flex items-center gap-1.5 text-xs font-medium transition-opacity cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 rounded px-1 py-0.5",
+                isDisabled ? "opacity-40 line-through text-muted-foreground" : "text-foreground hover:opacity-80",
+                itemClassName
+              ),
+              children: content
+            },
+            item.key
+          );
+        }
+        return /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "chart-legend-item inline-flex items-center gap-1.5 text-xs font-medium",
+              isDisabled ? "opacity-40 text-muted-foreground" : "text-foreground",
+              itemClassName
+            ),
+            children: content
+          },
+          item.key
+        );
+      })
+    }
+  );
+};
+ChartLegend.displayName = "ChartLegend";
+ChartLegend.isHtml = true;
+var ChartA11yTable = ({
+  caption,
+  categories,
+  series,
+  data,
+  indexKey,
+  index,
+  valueFormatter,
+  className
+}) => {
+  const categoryKey = indexKey ?? index;
+  return /* @__PURE__ */ jsxs("table", { className: cn("sr-only", className), children: [
+    caption && /* @__PURE__ */ jsx("caption", { children: caption }),
+    /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
+      /* @__PURE__ */ jsx("th", { scope: "col", children: categoryKey || "Category" }),
+      series.map((s) => /* @__PURE__ */ jsx("th", { scope: "col", children: s.label }, s.key))
+    ] }) }),
+    /* @__PURE__ */ jsx("tbody", { children: data.map((row, rowIdx) => {
+      let categoryLabel = "";
+      if (typeof row === "object" && row !== null && categoryKey && row[categoryKey] !== void 0) {
+        categoryLabel = String(row[categoryKey]);
+      } else if (categories && categories[rowIdx] !== void 0) {
+        categoryLabel = String(categories[rowIdx]);
+      } else {
+        categoryLabel = `Item ${rowIdx + 1}`;
+      }
+      return /* @__PURE__ */ jsxs("tr", { children: [
+        /* @__PURE__ */ jsx("th", { scope: "row", children: categoryLabel }),
+        series.map((s) => {
+          let rawVal;
+          if (typeof row === "number") {
+            rawVal = row;
+          } else if (typeof row === "object" && row !== null) {
+            rawVal = row[s.key];
+          }
+          const displayVal = valueFormatter && typeof rawVal === "number" ? valueFormatter(rawVal) : rawVal !== void 0 && rawVal !== null ? String(rawVal) : "-";
+          return /* @__PURE__ */ jsx("td", { children: displayVal }, s.key);
+        })
+      ] }, `a11y-row-${rowIdx}`);
+    }) })
+  ] });
+};
+ChartA11yTable.displayName = "ChartA11yTable";
+ChartA11yTable.isHtml = true;
+var Sparkline = React52.forwardRef(
+  ({
+    data,
+    dataKey,
+    variant = "line",
+    curve = "smooth",
+    color = "chart1",
+    strokeWidth = 2,
+    showEndDot = false,
+    showGradient = true,
+    height = 36,
+    width = "100%",
+    barRadius = 2,
+    barPadding = 2,
+    ariaLabel,
+    className,
+    style,
+    preserveAspectRatio = "none",
+    ...props
+  }, ref) => {
+    const rawId = React52.useId();
+    const gradientId = `sparkline-grad-${rawId.replace(/[^a-zA-Z0-9_-]/g, "")}`;
+    const values = React52.useMemo(() => {
+      if (!data || !Array.isArray(data) || data.length === 0) return [];
+      return data.map((item) => {
+        if (typeof item === "number") return item;
+        if (typeof item === "object" && item !== null) {
+          if (dataKey && item[dataKey] !== void 0) {
+            const num = Number(item[dataKey]);
+            return Number.isFinite(num) ? num : 0;
+          }
+          if ("value" in item && item.value !== void 0) {
+            const num = Number(item.value);
+            return Number.isFinite(num) ? num : 0;
+          }
+          for (const key of Object.keys(item)) {
+            const val = item[key];
+            if (typeof val === "number") return val;
+            const num = Number(val);
+            if (Number.isFinite(num)) return num;
+          }
+        }
+        const parsed = Number(item);
+        return Number.isFinite(parsed) ? parsed : 0;
+      }).filter((v) => Number.isFinite(v));
+    }, [data, dataKey]);
+    const resolvedColor = getChartColor(color, 0);
+    const computedAriaLabel = props["aria-label"] ?? ariaLabel ?? "Sparkline";
+    const viewBoxWidth = typeof width === "number" && width > 0 ? width : 120;
+    const isHidden = props["aria-hidden"] === true || props["aria-hidden"] === "true";
+    if (values.length === 0) {
+      return /* @__PURE__ */ jsx(
+        "svg",
+        {
+          ref,
+          role: isHidden ? void 0 : "img",
+          "aria-label": isHidden ? void 0 : computedAriaLabel,
+          viewBox: `0 0 ${viewBoxWidth} ${height}`,
+          width,
+          height,
+          className: cn("chart-sparkline chart-sparkline-empty overflow-visible", className),
+          style: {
+            height: typeof height === "number" ? `${height}px` : height,
+            width: typeof width === "number" ? `${width}px` : width,
+            ...style
+          },
+          preserveAspectRatio,
+          ...props,
+          children: /* @__PURE__ */ jsx(
+            "line",
+            {
+              x1: 0,
+              y1: height / 2,
+              x2: viewBoxWidth,
+              y2: height / 2,
+              stroke: "currentColor",
+              strokeDasharray: "2 2",
+              strokeWidth: 1,
+              className: "text-muted-foreground/30 stroke-current"
+            }
+          )
+        }
+      );
+    }
+    if (variant === "bar") {
+      const minVal2 = Math.min(0, ...values);
+      const maxVal2 = Math.max(0, ...values) || 1;
+      const barData = values.map((val, idx) => ({
+        group: idx,
+        seriesIndex: 0,
+        value: val
+      }));
+      const barRects = calculateBarLayout({
+        dataCount: values.length,
+        seriesCount: 1,
+        plotWidth: viewBoxWidth,
+        plotHeight: height,
+        yDomain: [minVal2, maxVal2],
+        data: barData,
+        mode: "grouped",
+        layout: "vertical",
+        groupPadding: 0.2,
+        barPadding
+      });
+      const lastBar = barRects.length > 0 ? barRects[barRects.length - 1] : void 0;
+      return /* @__PURE__ */ jsxs(
+        "svg",
+        {
+          ref,
+          role: isHidden ? void 0 : "img",
+          "aria-label": isHidden ? void 0 : computedAriaLabel,
+          viewBox: `0 0 ${viewBoxWidth} ${height}`,
+          width,
+          height,
+          className: cn("chart-sparkline chart-sparkline-bars overflow-visible", className),
+          style: {
+            height: typeof height === "number" ? `${height}px` : height,
+            width: typeof width === "number" ? `${width}px` : width,
+            ...style
+          },
+          preserveAspectRatio,
+          ...props,
+          children: [
+            barRects.map((bar, idx) => /* @__PURE__ */ jsx(
+              "rect",
+              {
+                x: bar.x,
+                y: bar.y,
+                width: bar.width,
+                height: Math.max(bar.height, bar.value === 0 ? 0 : 1),
+                rx: barRadius,
+                fill: resolvedColor,
+                className: "chart-sparkline-bar"
+              },
+              `sparkline-bar-${idx}-${bar.x}`
+            )),
+            showEndDot && lastBar && /* @__PURE__ */ jsx(
+              "circle",
+              {
+                cx: lastBar.x + lastBar.width / 2,
+                cy: lastBar.y,
+                r: 3,
+                fill: resolvedColor,
+                className: "chart-sparkline-dot"
+              }
+            )
+          ]
+        }
+      );
+    }
+    const paddingTop = 4;
+    const paddingBottom = 4;
+    const paddingLeft = showEndDot ? 4 : 2;
+    const paddingRight = showEndDot ? 4 : 2;
+    const minVal = Math.min(...values);
+    const maxVal = Math.max(...values);
+    const points = values.map((val, idx) => {
+      const x = values.length === 1 ? viewBoxWidth / 2 : linearScale(idx, [0, values.length - 1], [paddingLeft, viewBoxWidth - paddingRight]);
+      const y = minVal === maxVal ? height / 2 : linearScale(val, [minVal, maxVal], [height - paddingBottom, paddingTop]);
+      return { x, y };
+    });
+    const linePath = generateLinePath(points, curve);
+    const areaPath = variant === "area" ? generateAreaPath(points, height, curve) : "";
+    const lastPoint = points[points.length - 1];
+    return /* @__PURE__ */ jsxs(
+      "svg",
+      {
+        ref,
+        role: isHidden ? void 0 : "img",
+        "aria-label": isHidden ? void 0 : computedAriaLabel,
+        viewBox: `0 0 ${viewBoxWidth} ${height}`,
+        width,
+        height,
+        className: cn(
+          "chart-sparkline overflow-visible",
+          variant === "area" ? "chart-sparkline-area-container" : "chart-sparkline-line-container",
+          className
+        ),
+        style: {
+          height: typeof height === "number" ? `${height}px` : height,
+          width: typeof width === "number" ? `${width}px` : width,
+          ...style
+        },
+        preserveAspectRatio,
+        ...props,
+        children: [
+          variant === "area" && showGradient && /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: gradientId, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+            /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: resolvedColor, stopOpacity: "0.28" }),
+            /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: resolvedColor, stopOpacity: "0.0" })
+          ] }) }),
+          variant === "area" && areaPath && /* @__PURE__ */ jsx(
+            "path",
+            {
+              d: areaPath,
+              fill: showGradient ? `url(#${gradientId})` : resolvedColor,
+              fillOpacity: showGradient ? void 0 : 0.15,
+              stroke: "none",
+              className: "chart-sparkline-area"
+            }
+          ),
+          linePath && /* @__PURE__ */ jsx(
+            "path",
+            {
+              d: linePath,
+              fill: "none",
+              stroke: resolvedColor,
+              strokeWidth,
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              vectorEffect: "non-scaling-stroke",
+              className: "chart-sparkline-line"
+            }
+          ),
+          showEndDot && lastPoint && /* @__PURE__ */ jsx(
+            "circle",
+            {
+              cx: lastPoint.x,
+              cy: lastPoint.y,
+              r: 3,
+              fill: resolvedColor,
+              stroke: "var(--kj-background, #ffffff)",
+              strokeWidth: 1.5,
+              vectorEffect: "non-scaling-stroke",
+              className: "chart-sparkline-dot"
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Sparkline.displayName = "Sparkline";
+var LineChart = React52.forwardRef(
+  ({
+    data,
+    index,
+    series,
+    variant = "line",
+    curve = "linear",
+    showGrid = true,
+    showXAxis = true,
+    showYAxis = true,
+    showLegend,
+    showTooltip = true,
+    showDots = false,
+    showGradient = true,
+    showA11yTable,
+    valueFormatter,
+    indexFormatter,
+    emptyMessage = "Brak danych do wy\u015Bwietlenia",
+    height = 280,
+    width = "100%",
+    margin: marginProp,
+    ariaLabel,
+    caption,
+    strokeWidth = 2,
+    activeSeries: activeSeriesProp,
+    onSeriesToggle,
+    yTicksCount = 5,
+    yDomain: yDomainProp,
+    autoScale = false,
+    className,
+    style,
+    ...props
+  }, ref) => {
+    const rawId = React52.useId();
+    const idPrefix = `kj-chart-${rawId.replace(/[^a-zA-Z0-9_-]/g, "")}`;
+    const containerRef = React52.useRef(null);
+    const combinedRef = (node) => {
+      containerRef.current = node;
+      if (typeof ref === "function") {
+        ref(node);
+      } else if (ref) {
+        ref.current = node;
+      }
+    };
+    const [internalDisabledSeries, setInternalDisabledSeries] = React52.useState([]);
+    const disabledSeries = activeSeriesProp ? series.filter((s) => !activeSeriesProp.includes(s.key)).map((s) => s.key) : internalDisabledSeries;
+    const handleSeriesToggle = (key) => {
+      onSeriesToggle?.(key);
+      setInternalDisabledSeries(
+        (prev) => prev.includes(key) ? prev.filter((k) => k !== key) : [...prev, key]
+      );
+    };
+    const activeSeriesList = React52.useMemo(
+      () => series.filter((s) => !disabledSeries.includes(s.key)),
+      [series, disabledSeries]
+    );
+    const [activeIndex, setActiveIndex] = React52.useState(null);
+    const [tooltipPos, setTooltipPos] = React52.useState(null);
+    const computedAriaLabel = props["aria-label"] ?? ariaLabel ?? (variant === "area" ? "Wykres warstwowy" : "Wykres liniowy");
+    if (!data || data.length === 0) {
+      return /* @__PURE__ */ jsx(
+        ChartContainer,
+        {
+          ref: combinedRef,
+          width: typeof width === "number" ? width : void 0,
+          height,
+          "aria-label": computedAriaLabel,
+          className: cn("chart-line-empty", className),
+          style,
+          ...props,
+          children: /* @__PURE__ */ jsx("div", { className: "chart-empty-message flex h-full min-h-[160px] w-full items-center justify-center text-sm text-muted-foreground select-none", children: emptyMessage })
+        }
+      );
+    }
+    const measuredWidth = useChartWidth(
+      containerRef,
+      typeof width === "number" && width > 0 ? width : 600
+    );
+    const viewBoxWidth = typeof width === "number" && width > 0 ? width : measuredWidth > 0 ? measuredWidth : 600;
+    const viewBoxHeight = typeof height === "number" && height > 0 ? height : 280;
+    const margin = {
+      top: 16,
+      right: 20,
+      bottom: showXAxis ? 32 : 16,
+      left: showYAxis ? 48 : 16,
+      ...marginProp
+    };
+    const plotLeft = margin.left;
+    const plotRight = viewBoxWidth - margin.right;
+    const plotTop = margin.top;
+    const plotBottom = viewBoxHeight - margin.bottom;
+    const plotWidth = Math.max(0, plotRight - plotLeft);
+    const plotHeight = Math.max(0, plotBottom - plotTop);
+    const allValues = [];
+    for (const row of data) {
+      for (const s of activeSeriesList) {
+        const val = row[s.key];
+        if (typeof val === "number" && Number.isFinite(val)) {
+          allValues.push(val);
+        }
+      }
+    }
+    let dataMin = allValues.length > 0 ? Math.min(...allValues) : 0;
+    const dataMax = allValues.length > 0 ? Math.max(...allValues) : 100;
+    if (!autoScale && dataMin > 0) {
+      dataMin = 0;
+    }
+    const niceScale = getNiceScale(dataMin, dataMax, yTicksCount);
+    const domainMin = yDomainProp ? yDomainProp[0] : niceScale.min;
+    const domainMax = yDomainProp ? yDomainProp[1] : niceScale.max;
+    const getY = (val) => {
+      return linearScale(val, [domainMin, domainMax], [plotBottom, plotTop]);
+    };
+    const getX = (idx) => {
+      if (data.length <= 1) {
+        return plotLeft + plotWidth / 2;
+      }
+      return linearScale(idx, [0, data.length - 1], [plotLeft, plotRight]);
+    };
+    const yTicks = (yDomainProp ? getNiceScale(yDomainProp[0], yDomainProp[1], yTicksCount).ticks : niceScale.ticks).map((val) => ({
+      value: val,
+      y: getY(val)
+    }));
+    const maxXTicks = Math.max(2, Math.floor(plotWidth / 60));
+    const xStep = data.length > maxXTicks ? Math.ceil(data.length / maxXTicks) : 1;
+    const xTicks = data.map((row, idx) => ({
+      value: row[index] ?? "",
+      x: getX(idx),
+      idx
+    })).filter((_, i) => i % xStep === 0 || i === data.length - 1);
+    const handlePointerMove = (clientX, clientY, target) => {
+      const rect = target.getBoundingClientRect();
+      let relativeX;
+      if (rect.width > 0) {
+        relativeX = (clientX - rect.left) / rect.width * plotWidth + plotLeft;
+      } else {
+        relativeX = clientX;
+      }
+      let closestIdx = 0;
+      let minDiff = Infinity;
+      for (let i = 0; i < data.length; i++) {
+        const ptX = getX(i);
+        const diff = Math.abs(ptX - relativeX);
+        if (diff < minDiff) {
+          minDiff = diff;
+          closestIdx = i;
+        }
+      }
+      setActiveIndex(closestIdx);
+      if (containerRef.current) {
+        const containerRect = containerRef.current.getBoundingClientRect();
+        if (containerRect.width > 0) {
+          const scaleX = containerRect.width / viewBoxWidth;
+          const pixelX = getX(closestIdx) * scaleX;
+          const pixelY = clientY - containerRect.top;
+          setTooltipPos({ x: pixelX, y: Math.max(20, pixelY) });
+          return;
+        }
+      }
+      setTooltipPos({ x: getX(closestIdx), y: clientY });
+    };
+    const handleMouseMove = (e) => {
+      handlePointerMove(e.clientX, e.clientY, e.currentTarget);
+    };
+    const handleTouch = (e) => {
+      if (e.touches.length > 0) {
+        const touch = e.touches[0];
+        handlePointerMove(touch.clientX, touch.clientY, e.currentTarget);
+      }
+    };
+    const handleMouseLeave = () => {
+      setActiveIndex(null);
+      setTooltipPos(null);
+    };
+    const activeRow = activeIndex !== null && data[activeIndex] ? data[activeIndex] : null;
+    const tooltipTitle = activeRow !== null ? indexFormatter ? indexFormatter(activeRow[index]) : String(activeRow[index] ?? "") : "";
+    const tooltipItems = activeRow !== null ? activeSeriesList.map((s, sIdx) => {
+      const origIdx = series.findIndex((orig) => orig.key === s.key);
+      const seriesColorIndex = origIdx >= 0 ? origIdx : sIdx;
+      const raw = activeRow[s.key];
+      const num = typeof raw === "number" ? raw : Number(raw) || 0;
+      return {
+        key: s.key,
+        label: s.label,
+        value: num,
+        color: s.color ?? `chart${seriesColorIndex % 6 + 1}`,
+        formattedValue: valueFormatter ? valueFormatter(num) : void 0
+      };
+    }) : [];
+    const baselineY = getY(Math.max(0, domainMin));
+    const shouldShowLegend = showLegend ?? series.length > 1;
+    const shouldShowA11yTable = showA11yTable ?? Boolean(caption);
+    return /* @__PURE__ */ jsxs(
+      ChartContainer,
+      {
+        ref: combinedRef,
+        width: typeof width === "number" ? width : void 0,
+        height,
+        viewBox: `0 0 ${viewBoxWidth} ${viewBoxHeight}`,
+        "aria-label": computedAriaLabel,
+        className: cn(
+          "chart-line-root flex flex-col",
+          variant === "area" ? "chart-area-root" : "chart-line-root",
+          className
+        ),
+        style,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("defs", { children: variant === "area" && showGradient && series.map((s, idx) => {
+            const gradColor = getChartColor(s.color, idx);
+            return /* @__PURE__ */ jsxs(
+              "linearGradient",
+              {
+                id: `${idPrefix}-grad-${s.key}`,
+                x1: "0",
+                y1: "0",
+                x2: "0",
+                y2: "1",
+                children: [
+                  /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: gradColor, stopOpacity: "0.28" }),
+                  /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: gradColor, stopOpacity: "0.0" })
+                ]
+              },
+              `grad-${s.key}`
+            );
+          }) }),
+          showGrid && /* @__PURE__ */ jsx("g", { transform: `translate(${plotLeft}, 0)`, children: /* @__PURE__ */ jsx(
+            ChartGrid,
+            {
+              horizontal: true,
+              yTicks: yTicks.map((t) => t.value),
+              scaleY: getY,
+              width: plotWidth
+            }
+          ) }),
+          activeSeriesList.map((s, sIdx) => {
+            const origIdx = series.findIndex((orig) => orig.key === s.key);
+            const seriesColorIndex = origIdx >= 0 ? origIdx : sIdx;
+            const sColor = getChartColor(s.color, seriesColorIndex);
+            const points = [];
+            for (let i = 0; i < data.length; i++) {
+              const rawVal = data[i][s.key];
+              if (rawVal !== void 0 && rawVal !== null && Number.isFinite(Number(rawVal))) {
+                points.push({ x: getX(i), y: getY(Number(rawVal)) });
+              }
+            }
+            if (points.length === 0) return null;
+            const linePath = generateLinePath(points, curve);
+            const areaPath = variant === "area" ? generateAreaPath(points, baselineY, curve) : "";
+            return /* @__PURE__ */ jsxs("g", { className: `chart-series chart-series-${s.key}`, children: [
+              variant === "area" && areaPath && /* @__PURE__ */ jsx(
+                "path",
+                {
+                  d: areaPath,
+                  fill: showGradient ? `url(#${idPrefix}-grad-${s.key})` : sColor,
+                  fillOpacity: showGradient ? void 0 : 0.15,
+                  stroke: "none",
+                  className: "chart-area pointer-events-none transition-opacity duration-200"
+                }
+              ),
+              linePath && /* @__PURE__ */ jsx(
+                "path",
+                {
+                  d: linePath,
+                  fill: "none",
+                  stroke: sColor,
+                  strokeWidth,
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  vectorEffect: "non-scaling-stroke",
+                  className: "chart-line pointer-events-none transition-opacity duration-200"
+                }
+              ),
+              showDots && points.map((pt, ptIdx) => /* @__PURE__ */ jsx(
+                "circle",
+                {
+                  cx: pt.x,
+                  cy: pt.y,
+                  r: 3,
+                  fill: sColor,
+                  stroke: "var(--kj-background, #ffffff)",
+                  strokeWidth: 1.5,
+                  className: "chart-dot pointer-events-none"
+                },
+                `dot-${s.key}-${ptIdx}`
+              )),
+              activeIndex !== null && activeRow && activeRow[s.key] !== void 0 && activeRow[s.key] !== null && Number.isFinite(Number(activeRow[s.key])) && /* @__PURE__ */ jsx(
+                "circle",
+                {
+                  cx: getX(activeIndex),
+                  cy: getY(Number(activeRow[s.key])),
+                  r: 4.5,
+                  fill: sColor,
+                  stroke: "var(--kj-background, #ffffff)",
+                  strokeWidth: 2,
+                  className: "chart-active-dot pointer-events-none"
+                }
+              )
+            ] }, `series-${s.key}`);
+          }),
+          showXAxis && /* @__PURE__ */ jsx(ChartXAxis, { ticks: xTicks, y: plotBottom + 16, formatter: indexFormatter }),
+          showYAxis && /* @__PURE__ */ jsx(
+            ChartYAxis,
+            {
+              ticks: yTicks,
+              x: plotLeft - 8,
+              formatter: valueFormatter
+            }
+          ),
+          showTooltip && /* biome-ignore lint/a11y/noStaticElementInteractions: transparent SVG overlay tracks pointer for chart tooltip */
+          /* @__PURE__ */ jsx(
+            "rect",
+            {
+              className: "chart-interactive-overlay cursor-crosshair",
+              x: plotLeft,
+              y: plotTop,
+              width: plotWidth,
+              height: plotHeight,
+              fill: "transparent",
+              pointerEvents: "all",
+              onMouseMove: handleMouseMove,
+              onMouseLeave: handleMouseLeave,
+              onTouchStart: handleTouch,
+              onTouchMove: handleTouch,
+              onTouchEnd: handleMouseLeave
+            }
+          ),
+          showTooltip && activeIndex !== null && tooltipPos && /* @__PURE__ */ jsx(
+            ChartTooltip,
+            {
+              open: activeIndex !== null,
+              title: tooltipTitle,
+              items: tooltipItems,
+              x: tooltipPos.x,
+              y: tooltipPos.y,
+              showCrosshair: true,
+              crosshairX: tooltipPos.x,
+              crosshairHeight: plotBottom,
+              valueFormatter
+            }
+          ),
+          shouldShowLegend && /* @__PURE__ */ jsx(
+            ChartLegend,
+            {
+              series,
+              disabledSeries,
+              onToggle: handleSeriesToggle
+            }
+          ),
+          shouldShowA11yTable && /* @__PURE__ */ jsx(
+            ChartA11yTable,
+            {
+              caption: caption ?? computedAriaLabel,
+              series,
+              data,
+              indexKey: index,
+              valueFormatter
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+LineChart.displayName = "LineChart";
+var AreaChart = React52.forwardRef((props, ref) => /* @__PURE__ */ jsx(LineChart, { ref, variant: "area", ...props }));
+AreaChart.displayName = "AreaChart";
+var BarChart = React52.forwardRef(
+  ({
+    data,
+    index,
+    series,
+    type = "grouped",
+    layout = "vertical",
+    radius = 4,
+    showGrid = true,
+    showXAxis = true,
+    showYAxis = true,
+    showLegend,
+    showTooltip = true,
+    showA11yTable,
+    valueFormatter,
+    indexFormatter,
+    emptyMessage = "Brak danych do wy\u015Bwietlenia",
+    height = 280,
+    width = "100%",
+    margin: marginProp,
+    ariaLabel,
+    caption,
+    activeSeries: activeSeriesProp,
+    onSeriesToggle,
+    yTicksCount = 5,
+    yDomain: yDomainProp,
+    autoScale = false,
+    barMaxWidth,
+    groupPadding = 0.2,
+    barPadding = 2,
+    barClassName,
+    className,
+    style,
+    ...props
+  }, ref) => {
+    const containerRef = React52.useRef(null);
+    const combinedRef = (node) => {
+      containerRef.current = node;
+      if (typeof ref === "function") {
+        ref(node);
+      } else if (ref) {
+        ref.current = node;
+      }
+    };
+    const [internalDisabledSeries, setInternalDisabledSeries] = React52.useState([]);
+    const disabledSeries = activeSeriesProp ? series.filter((s) => !activeSeriesProp.includes(s.key)).map((s) => s.key) : internalDisabledSeries;
+    const handleSeriesToggle = (key) => {
+      onSeriesToggle?.(key);
+      setInternalDisabledSeries(
+        (prev) => prev.includes(key) ? prev.filter((k) => k !== key) : [...prev, key]
+      );
+    };
+    const activeSeriesList = React52.useMemo(
+      () => series.filter((s) => !disabledSeries.includes(s.key)),
+      [series, disabledSeries]
+    );
+    const [activeGroup, setActiveGroup] = React52.useState(null);
+    const [activeSeriesKey, setActiveSeriesKey] = React52.useState(null);
+    const [tooltipPos, setTooltipPos] = React52.useState(null);
+    const computedAriaLabel = props["aria-label"] ?? ariaLabel ?? (type === "stacked" ? "Wykres s\u0142upkowy skumulowany" : "Wykres s\u0142upkowy");
+    if (!data || data.length === 0) {
+      return /* @__PURE__ */ jsx(
+        ChartContainer,
+        {
+          ref: combinedRef,
+          width: typeof width === "number" ? width : void 0,
+          height,
+          "aria-label": computedAriaLabel,
+          className: cn("chart-bar-empty", className),
+          style,
+          ...props,
+          children: /* @__PURE__ */ jsx("div", { className: "chart-empty-message flex h-full min-h-[160px] w-full items-center justify-center text-sm text-muted-foreground select-none", children: emptyMessage })
+        }
+      );
+    }
+    const measuredWidth = useChartWidth(
+      containerRef,
+      typeof width === "number" && width > 0 ? width : 600
+    );
+    const viewBoxWidth = typeof width === "number" && width > 0 ? width : measuredWidth > 0 ? measuredWidth : 600;
+    const viewBoxHeight = typeof height === "number" && height > 0 ? height : 280;
+    const margin = {
+      top: 16,
+      right: 20,
+      bottom: showXAxis ? 32 : 16,
+      left: showYAxis ? layout === "horizontal" ? 64 : 48 : 16,
+      ...marginProp
+    };
+    const plotLeft = margin.left;
+    const plotRight = viewBoxWidth - margin.right;
+    const plotTop = margin.top;
+    const plotBottom = viewBoxHeight - margin.bottom;
+    const plotWidth = Math.max(0, plotRight - plotLeft);
+    const plotHeight = Math.max(0, plotBottom - plotTop);
+    let dataMin = 0;
+    let dataMax = 100;
+    if (type === "stacked") {
+      const stackSums = [];
+      for (const row of data) {
+        let sum = 0;
+        for (const s of activeSeriesList) {
+          const val = row[s.key];
+          if (typeof val === "number" && Number.isFinite(val)) {
+            sum += Math.max(0, val);
+          }
+        }
+        stackSums.push(sum);
+      }
+      dataMax = stackSums.length > 0 ? Math.max(...stackSums, 0) : 100;
+      if (dataMax === 0) dataMax = 100;
+    } else {
+      const allValues = [];
+      for (const row of data) {
+        for (const s of activeSeriesList) {
+          const val = row[s.key];
+          if (typeof val === "number" && Number.isFinite(val)) {
+            allValues.push(val);
+          }
+        }
+      }
+      dataMax = allValues.length > 0 ? Math.max(...allValues, 0) : 100;
+      if (allValues.length > 0 && autoScale) {
+        dataMin = Math.min(...allValues, 0);
+      }
+      if (dataMax === 0) dataMax = 100;
+    }
+    const niceScale = getNiceScale(dataMin, dataMax, yTicksCount);
+    const domainMin = yDomainProp ? yDomainProp[0] : niceScale.min;
+    const domainMax = yDomainProp ? yDomainProp[1] : niceScale.max;
+    const yDomain = [domainMin, domainMax];
+    const barDataPoints = [];
+    for (let group = 0; group < data.length; group++) {
+      const row = data[group];
+      for (let sIdx = 0; sIdx < activeSeriesList.length; sIdx++) {
+        const s = activeSeriesList[sIdx];
+        const rawVal = row[s.key];
+        const num = typeof rawVal === "number" && Number.isFinite(rawVal) ? rawVal : Number(rawVal) || 0;
+        barDataPoints.push({
+          group,
+          seriesIndex: sIdx,
+          value: num,
+          seriesKey: s.key,
+          seriesLabel: s.label,
+          categoryValue: row[index]
+        });
+      }
+    }
+    const barRects = calculateBarLayout({
+      dataCount: data.length,
+      seriesCount: activeSeriesList.length,
+      plotWidth,
+      plotHeight,
+      yDomain,
+      data: barDataPoints,
+      mode: type,
+      layout,
+      barMaxWidth,
+      groupPadding,
+      barPadding
+    });
+    const isVertical = layout === "vertical";
+    const slotSize = data.length > 0 ? isVertical ? plotWidth / data.length : plotHeight / data.length : 0;
+    const categoryTicks = data.map((row, idx) => ({
+      value: row[index] ?? "",
+      coord: isVertical ? plotLeft + (idx + 0.5) * slotSize : plotTop + (idx + 0.5) * slotSize
+    }));
+    const valueTicks = (yDomainProp ? getNiceScale(yDomainProp[0], yDomainProp[1], yTicksCount).ticks : niceScale.ticks).map((val) => ({
+      value: val,
+      coord: isVertical ? linearScale(val, yDomain, [plotBottom, plotTop]) : linearScale(val, yDomain, [plotLeft, plotRight])
+    }));
+    const updateTooltipPosition = (bar) => {
+      let targetX;
+      let targetY;
+      if (layout === "horizontal") {
+        targetX = plotLeft + bar.x + bar.width;
+        targetY = plotTop + bar.y + bar.height / 2;
+      } else {
+        targetX = plotLeft + bar.x + bar.width / 2;
+        targetY = plotTop + bar.y;
+      }
+      if (containerRef.current) {
+        const containerRect = containerRef.current.getBoundingClientRect();
+        if (containerRect.width > 0 && containerRect.height > 0) {
+          const scaleX = containerRect.width / viewBoxWidth;
+          const scaleY = containerRect.height / viewBoxHeight;
+          setTooltipPos({ x: targetX * scaleX, y: targetY * scaleY });
+          return;
+        }
+      }
+      setTooltipPos({ x: targetX, y: targetY });
+    };
+    const handleBarMouseEnter = (bar) => {
+      if (!showTooltip) return;
+      setActiveGroup(bar.group);
+      setActiveSeriesKey(bar.seriesKey);
+      updateTooltipPosition(bar);
+    };
+    const handleBarMouseLeave = () => {
+      setActiveGroup(null);
+      setActiveSeriesKey(null);
+      setTooltipPos(null);
+    };
+    const handleBarTouchStart = (bar) => {
+      if (!showTooltip) return;
+      setActiveGroup(bar.group);
+      setActiveSeriesKey(bar.seriesKey);
+      updateTooltipPosition(bar);
+    };
+    const handleBarTouchEnd = () => {
+      setActiveGroup(null);
+      setActiveSeriesKey(null);
+      setTooltipPos(null);
+    };
+    const activeRow = activeGroup !== null && data[activeGroup] ? data[activeGroup] : null;
+    const tooltipTitle = activeRow !== null ? indexFormatter ? indexFormatter(activeRow[index]) : String(activeRow[index] ?? "") : "";
+    const tooltipItems = activeRow !== null ? activeSeriesList.map((s, sIdx) => {
+      const origIdx = series.findIndex((orig) => orig.key === s.key);
+      const seriesColorIndex = origIdx >= 0 ? origIdx : sIdx;
+      const raw = activeRow[s.key];
+      const num = typeof raw === "number" ? raw : Number(raw) || 0;
+      return {
+        key: s.key,
+        label: s.label,
+        value: num,
+        color: s.color ?? `chart${seriesColorIndex % 6 + 1}`,
+        formattedValue: valueFormatter ? valueFormatter(num) : void 0
+      };
+    }) : [];
+    const shouldShowLegend = showLegend ?? series.length > 1;
+    const shouldShowA11yTable = showA11yTable ?? Boolean(caption);
+    return /* @__PURE__ */ jsxs(
+      ChartContainer,
+      {
+        ref: combinedRef,
+        width: typeof width === "number" ? width : void 0,
+        height,
+        viewBox: `0 0 ${viewBoxWidth} ${viewBoxHeight}`,
+        "aria-label": computedAriaLabel,
+        className: cn(
+          "chart-bar-root flex flex-col",
+          type === "stacked" ? "chart-bar-stacked" : "chart-bar-grouped",
+          layout === "horizontal" ? "chart-bar-horizontal" : "chart-bar-vertical",
+          className
+        ),
+        style,
+        ...props,
+        children: [
+          showGrid && (isVertical ? /* @__PURE__ */ jsx("g", { transform: `translate(${plotLeft}, 0)`, children: /* @__PURE__ */ jsx(
+            ChartGrid,
+            {
+              horizontal: true,
+              yTicks: valueTicks.map((t) => t.value),
+              scaleY: (val) => linearScale(val, yDomain, [plotBottom, plotTop]),
+              width: plotWidth
+            }
+          ) }) : /* @__PURE__ */ jsx("g", { transform: `translate(0, ${plotTop})`, children: /* @__PURE__ */ jsx(
+            ChartGrid,
+            {
+              vertical: true,
+              horizontal: false,
+              xTicks: valueTicks.map((t) => t.value),
+              scaleX: (val) => linearScale(val, yDomain, [plotLeft, plotRight]),
+              height: plotHeight
+            }
+          ) })),
+          /* @__PURE__ */ jsx("g", { transform: `translate(${plotLeft}, ${plotTop})`, className: "chart-bars-group", children: barRects.map((bar) => {
+            const origIdx = series.findIndex((orig) => orig.key === bar.seriesKey);
+            const seriesColorIndex = origIdx >= 0 ? origIdx : bar.seriesIndex;
+            const matchingSeries = series[origIdx] ?? activeSeriesList[bar.seriesIndex];
+            const sColor = getChartColor(matchingSeries?.color, seriesColorIndex);
+            const barW = Math.max(0, bar.width);
+            const barH = Math.max(0, bar.height);
+            const safeRadius = radius > 0 ? Math.min(radius, Math.max(0, barW / 2), Math.max(0, barH / 2)) : 0;
+            const isDimmed = activeGroup !== null && (bar.group !== activeGroup || type === "grouped" && activeSeriesKey !== null && bar.seriesKey !== activeSeriesKey);
+            return /* @__PURE__ */ jsx(
+              "rect",
+              {
+                className: cn(
+                  "chart-bar transition-opacity duration-150 cursor-pointer",
+                  barClassName
+                ),
+                x: bar.x,
+                y: bar.y,
+                width: barW,
+                height: barH,
+                rx: safeRadius,
+                ry: safeRadius,
+                fill: sColor,
+                opacity: isDimmed ? 0.45 : 1,
+                tabIndex: 0,
+                role: "graphics-symbol",
+                "aria-label": `${bar.seriesLabel ?? bar.seriesKey}: ${valueFormatter ? valueFormatter(bar.value) : bar.value}, ${bar.categoryValue}`,
+                onMouseEnter: () => handleBarMouseEnter(bar),
+                onMouseMove: () => handleBarMouseEnter(bar),
+                onMouseLeave: handleBarMouseLeave,
+                onTouchStart: () => handleBarTouchStart(bar),
+                onTouchEnd: handleBarTouchEnd,
+                onFocus: () => handleBarMouseEnter(bar),
+                onBlur: handleBarMouseLeave
+              },
+              `bar-${bar.group}-${bar.seriesKey}`
+            );
+          }) }),
+          showXAxis && /* @__PURE__ */ jsx(
+            ChartXAxis,
+            {
+              ticks: isVertical ? categoryTicks.map((t) => ({ value: t.value, x: t.coord })) : valueTicks.map((t) => ({ value: t.value, x: t.coord })),
+              y: plotBottom + 16,
+              formatter: isVertical ? indexFormatter : valueFormatter
+            }
+          ),
+          showYAxis && /* @__PURE__ */ jsx(
+            ChartYAxis,
+            {
+              ticks: isVertical ? valueTicks.map((t) => ({ value: t.value, y: t.coord })) : categoryTicks.map((t) => ({ value: t.value, y: t.coord })),
+              x: plotLeft - 8,
+              formatter: isVertical ? valueFormatter : indexFormatter
+            }
+          ),
+          showTooltip && activeGroup !== null && tooltipPos && /* @__PURE__ */ jsx(
+            ChartTooltip,
+            {
+              open: activeGroup !== null,
+              title: tooltipTitle,
+              items: tooltipItems,
+              x: tooltipPos.x,
+              y: tooltipPos.y,
+              valueFormatter
+            }
+          ),
+          shouldShowLegend && /* @__PURE__ */ jsx(
+            ChartLegend,
+            {
+              series,
+              disabledSeries,
+              onToggle: handleSeriesToggle
+            }
+          ),
+          shouldShowA11yTable && /* @__PURE__ */ jsx(
+            ChartA11yTable,
+            {
+              caption: caption ?? computedAriaLabel,
+              series,
+              data,
+              indexKey: index,
+              valueFormatter
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+BarChart.displayName = "BarChart";
+var SIZE_MAP = {
+  sm: 160,
+  md: 220,
+  lg: 280
+};
+function getDimension(size = "md") {
+  if (typeof size === "number") {
+    return size > 0 ? size : 220;
+  }
+  return SIZE_MAP[size] ?? 220;
+}
+var DonutChart = React52.forwardRef(
+  ({
+    data,
+    category,
+    value,
+    centerLabel,
+    size = "md",
+    innerRadius: innerRadiusProp,
+    colors,
+    showLegend = true,
+    showTooltip = true,
+    showA11yTable,
+    valueFormatter,
+    emptyMessage = "Brak danych do wy\u015Bwietlenia",
+    ariaLabel,
+    caption,
+    valueLabel = "Warto\u015B\u0107",
+    activeCategories: activeCategoriesProp,
+    onCategoryToggle,
+    sliceClassName,
+    className,
+    style,
+    ...props
+  }, ref) => {
+    const containerRef = React52.useRef(null);
+    const combinedRef = (node) => {
+      containerRef.current = node;
+      if (typeof ref === "function") {
+        ref(node);
+      } else if (ref) {
+        ref.current = node;
+      }
+    };
+    const [internalDisabled, setInternalDisabled] = React52.useState([]);
+    const [activeIdx, setActiveIdx] = React52.useState(null);
+    const [tooltipPos, setTooltipPos] = React52.useState(null);
+    const safeData = data || [];
+    const dimension = getDimension(size);
+    const cx = dimension / 2;
+    const cy = dimension / 2;
+    const padding = 8;
+    const outerRadius = Math.max(10, dimension / 2 - padding);
+    let computedInnerRadius;
+    if (innerRadiusProp !== void 0) {
+      if (innerRadiusProp >= 0 && innerRadiusProp <= 1) {
+        computedInnerRadius = outerRadius * innerRadiusProp;
+      } else {
+        computedInnerRadius = Math.min(innerRadiusProp, Math.max(0, outerRadius - 4));
+      }
+    } else {
+      computedInnerRadius = outerRadius * 0.65;
+    }
+    const legendSeries = React52.useMemo(() => {
+      return safeData.map((item, idx) => {
+        const cat = String(item[category] ?? `Item ${idx + 1}`);
+        const rawColor = item.color ?? (colors ? colors[idx % colors.length] : DEFAULT_CHART_COLORS[idx % DEFAULT_CHART_COLORS.length]);
+        return {
+          key: cat,
+          label: cat,
+          color: rawColor
+        };
+      });
+    }, [safeData, category, colors]);
+    const disabledCategories = activeCategoriesProp ? legendSeries.filter((s) => !activeCategoriesProp.includes(s.key)).map((s) => s.key) : internalDisabled;
+    const handleLegendToggle = (catKey) => {
+      onCategoryToggle?.(catKey);
+      setInternalDisabled(
+        (prev) => prev.includes(catKey) ? prev.filter((k) => k !== catKey) : [...prev, catKey]
+      );
+    };
+    const sliceInputs = React52.useMemo(() => {
+      return safeData.map((item, idx) => {
+        const cat = String(item[category] ?? `Item ${idx + 1}`);
+        const isDisabled = disabledCategories.includes(cat);
+        const rawVal = item[value];
+        const numVal = typeof rawVal === "number" && Number.isFinite(rawVal) ? rawVal : Number(rawVal) || 0;
+        const rawColor = item.color ?? (colors ? colors[idx % colors.length] : DEFAULT_CHART_COLORS[idx % DEFAULT_CHART_COLORS.length]);
+        return {
+          label: cat,
+          value: isDisabled ? 0 : Math.max(0, numVal),
+          color: getChartColor(rawColor, idx),
+          originalValue: numVal,
+          originalIndex: idx
+        };
+      });
+    }, [safeData, category, value, colors, disabledCategories]);
+    const segments = React52.useMemo(() => {
+      return calculateDonutSegments(sliceInputs, {
+        cx,
+        cy,
+        innerRadius: computedInnerRadius,
+        outerRadius,
+        startAngle: -90
+      });
+    }, [sliceInputs, cx, cy, computedInnerRadius, outerRadius]);
+    const computedAriaLabel = props["aria-label"] ?? ariaLabel ?? "Wykres pier\u015Bcieniowy";
+    if (!data || data.length === 0) {
+      return /* @__PURE__ */ jsx(
+        ChartContainer,
+        {
+          ref: combinedRef,
+          "aria-label": computedAriaLabel,
+          className: cn("chart-donut-empty flex flex-col items-center justify-center", className),
+          style,
+          ...props,
+          children: /* @__PURE__ */ jsx("div", { className: "chart-empty-message flex min-h-[160px] w-full items-center justify-center text-sm text-muted-foreground select-none", children: emptyMessage })
+        }
+      );
+    }
+    const updateTooltipPosition = (segment, clientX, clientY) => {
+      const midRad = segment.middleAngle * Math.PI / 180;
+      const midRadius = (computedInnerRadius + outerRadius) / 2;
+      const targetX = cx + midRadius * Math.cos(midRad);
+      const targetY = cy + midRadius * Math.sin(midRad);
+      if (containerRef.current) {
+        const containerRect = containerRef.current.getBoundingClientRect();
+        if (containerRect.width > 0 && containerRect.height > 0 && clientX !== void 0 && clientY !== void 0) {
+          setTooltipPos({
+            x: clientX - containerRect.left,
+            y: clientY - containerRect.top
+          });
+          return;
+        }
+      }
+      setTooltipPos({ x: targetX, y: targetY });
+    };
+    const handleSliceMouseEnter = (idx, segment, e) => {
+      if (!showTooltip) return;
+      setActiveIdx(idx);
+      updateTooltipPosition(segment, e.clientX, e.clientY);
+    };
+    const handleSliceMouseMove = (_idx, segment, e) => {
+      if (!showTooltip) return;
+      updateTooltipPosition(segment, e.clientX, e.clientY);
+    };
+    const handleSliceMouseLeave = () => {
+      setActiveIdx(null);
+      setTooltipPos(null);
+    };
+    const handleSliceTouchStart = (idx, segment, e) => {
+      if (!showTooltip) return;
+      setActiveIdx(idx);
+      if (e.touches.length > 0) {
+        const touch = e.touches[0];
+        updateTooltipPosition(segment, touch.clientX, touch.clientY);
+      } else {
+        updateTooltipPosition(segment);
+      }
+    };
+    const handleSliceTouchEnd = () => {
+      setActiveIdx(null);
+      setTooltipPos(null);
+    };
+    const activeSegment = activeIdx !== null && segments[activeIdx] ? segments[activeIdx] : null;
+    const shouldShowA11yTable = showA11yTable ?? Boolean(caption);
+    const a11ySeries = [
+      { key: value, label: valueLabel },
+      { key: "__percentage__", label: "Udzia\u0142 (%)" }
+    ];
+    const a11yData = data.map((row) => {
+      const cat = String(row[category] ?? "");
+      const seg = segments.find((s) => s.label === cat);
+      return {
+        ...row,
+        __percentage__: seg ? `${seg.percentage}%` : "0%"
+      };
+    });
+    const sizeClass = typeof size === "number" ? void 0 : size === "sm" ? "max-w-[160px] max-h-[160px]" : size === "lg" ? "max-w-[280px] max-h-[280px]" : "max-w-[220px] max-h-[220px]";
+    return /* @__PURE__ */ jsxs(
+      ChartContainer,
+      {
+        ref: combinedRef,
+        width: dimension,
+        height: dimension,
+        viewBox: `0 0 ${dimension} ${dimension}`,
+        "aria-label": computedAriaLabel,
+        className: cn(
+          "chart-donut-root relative flex flex-col items-center justify-start mx-auto w-full",
+          className
+        ),
+        svgClassName: cn("chart-donut-svg mx-auto shrink-0", sizeClass),
+        style: {
+          "--donut-dim": `${dimension}px`,
+          ...style
+        },
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("g", { className: "chart-donut-slices", children: segments.map((segment, idx) => {
+            const isHovered = activeIdx === idx;
+            const isDimmed = activeIdx !== null && !isHovered;
+            const origVal = segment.originalValue ?? segment.value;
+            const displayVal = valueFormatter ? valueFormatter(origVal) : String(origVal);
+            const hasPath = Boolean(segment.path);
+            return /* @__PURE__ */ jsx(
+              "path",
+              {
+                className: cn(
+                  "chart-donut-slice transition-all duration-150 cursor-pointer outline-none",
+                  sliceClassName
+                ),
+                d: segment.path || "",
+                fill: segment.color,
+                opacity: !hasPath ? 0 : isDimmed ? 0.4 : 1,
+                style: {
+                  transformOrigin: `${cx}px ${cy}px`,
+                  transform: isHovered && hasPath ? "scale(1.03)" : "scale(1)",
+                  filter: isHovered && hasPath ? "brightness(1.1)" : void 0,
+                  pointerEvents: hasPath ? void 0 : "none"
+                },
+                tabIndex: hasPath ? 0 : -1,
+                role: "graphics-symbol",
+                "aria-label": `${segment.label}: ${displayVal} (${segment.percentage}%)`,
+                onMouseEnter: hasPath ? (e) => handleSliceMouseEnter(idx, segment, e) : void 0,
+                onMouseMove: hasPath ? (e) => handleSliceMouseMove(idx, segment, e) : void 0,
+                onMouseLeave: hasPath ? handleSliceMouseLeave : void 0,
+                onTouchStart: hasPath ? (e) => handleSliceTouchStart(idx, segment, e) : void 0,
+                onTouchEnd: hasPath ? handleSliceTouchEnd : void 0,
+                onFocus: hasPath ? (e) => handleSliceMouseEnter(
+                  idx,
+                  segment,
+                  e
+                ) : void 0,
+                onBlur: hasPath ? handleSliceMouseLeave : void 0
+              },
+              `slice-${idx}-${segment.label}`
+            );
+          }) }),
+          centerLabel && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "chart-donut-center pointer-events-none absolute flex flex-col items-center justify-center text-center select-none",
+              style: {
+                width: `${Math.max(20, Math.floor(computedInnerRadius * 1.8))}px`,
+                height: `${Math.max(20, Math.floor(computedInnerRadius * 1.8))}px`,
+                left: "50%",
+                top: `${dimension / 2}px`,
+                transform: "translate(-50%, -50%)"
+              },
+              children: centerLabel
+            }
+          ),
+          showTooltip && activeSegment && tooltipPos && activeSegment.path && /* @__PURE__ */ jsx(
+            ChartTooltip,
+            {
+              open: Boolean(activeSegment),
+              x: tooltipPos.x,
+              y: tooltipPos.y,
+              items: [
+                {
+                  key: activeSegment.label,
+                  label: activeSegment.label,
+                  value: activeSegment.originalValue ?? activeSegment.value,
+                  formattedValue: `${valueFormatter ? valueFormatter(activeSegment.originalValue ?? activeSegment.value) : activeSegment.originalValue ?? activeSegment.value} (${activeSegment.percentage}%)`,
+                  color: activeSegment.color
+                }
+              ]
+            }
+          ),
+          showLegend && /* @__PURE__ */ jsx(
+            ChartLegend,
+            {
+              series: legendSeries,
+              disabledSeries: disabledCategories,
+              onToggle: handleLegendToggle
+            }
+          ),
+          shouldShowA11yTable && /* @__PURE__ */ jsx(
+            ChartA11yTable,
+            {
+              caption: caption ?? computedAriaLabel,
+              series: a11ySeries,
+              data: a11yData,
+              indexKey: category,
+              valueFormatter: (v) => typeof v === "number" && valueFormatter ? valueFormatter(v) : String(v)
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+DonutChart.displayName = "DonutChart";
+
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AppShell, AppShellBanner, AppShellFooter, AppShellHeader, AppShellMain, AreaChart, Avatar, AvatarGroup, Badge, BarChart, BlogCard, BottomNavigation, BottomSheet, BottomSheetContent, BottomSheetDescription, BottomSheetFooter, BottomSheetHeader, BottomSheetTitle, Breadcrumb, BreadcrumbItem, BreadcrumbSeparator, Button, CHART_COLOR_VARS, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ChartA11yTable, ChartContainer, ChartGrid, ChartLegend, ChartTooltip, ChartXAxis, ChartYAxis, Checkbox, CheckboxField, CodeBlock, ColorPicker, ColorPickerField, ColorPickerSwatch, Combobox, ComboboxField, CommandPalette, ConfirmDialog, DEFAULT_CHART_COLORS, DEFAULT_COLOR_SWATCHES, DashboardShell, DataTable, DatePicker, DatePickerField, DateRangePicker, DateRangePickerField, DetailPageLayout, DonutChart, Drawer, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, Dropzone, EmptyState, ErrorState, Fab, Field, FileUpload, FileUploadField, FormField, Hint, ImageGallery, InPostGeowidget, InPostGeowidgetModal, InboxContent, InboxPopover, InboxTrigger, Input, Kbd, Label, LineChart, MetricCard, Modal, ModalActions, ModalDescription, ModalTitle, NotificationItem, PageHeader, Pagination, Popover, PopoverContent, PopoverTrigger, PricingCard, Progress, ProgressRing, ProgressRingField, ProjectCard, Radio, RangeCalendar, Rating, RatingField, RatingSummary, SectionHeader, Segmented, Select, SelectField, Separator, SettingsLayout, SidebarNav, Skeleton, Slider, Sparkline, Spinner, Stat, Stepper, StepperContent, StepperDescription, StepperIndicator, StepperItem, StepperList, StepperSeparator, StepperTitle, StepperTrigger, Switch, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, TableToolbar, TableWrap, Tabs, TabsContent, TabsList, TabsTrigger, TextField, Textarea, Timeline, TimelineConnector, TimelineContent, TimelineDot, TimelineItem, TimelineSeparator, TimelineTime, TimelineTitle, ToastProvider, ToggleGroup, Tooltip, badgeVariants, buttonVariants, cn, fabVariants, formatRelativeTime, getChartColor, hexToHsl, hslToHex, isValidHex, normalizeHex, sliderThumbCSS, useChartWidth, useInPostScript, useInboxState, useStepper, useToast };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map