@entropix/data 0.0.0 → 1.0.1

package/dist/area-chart.cjs

@@ -0,0 +1,14 @@
+'use strict';
+
+var chunkWOVSQALY_cjs = require('./chunk-WOVSQALY.cjs');
+require('./chunk-GCZSXJAA.cjs');
+require('./chunk-6YAOO76S.cjs');
+
+
+
+Object.defineProperty(exports, "AreaChart", {
+  enumerable: true,
+  get: function () { return chunkWOVSQALY_cjs.AreaChart; }
+});
+//# sourceMappingURL=area-chart.cjs.map
+//# sourceMappingURL=area-chart.cjs.map

package/dist/area-chart.css

@@ -0,0 +1,144 @@
+/* src/styles/chart.css */
+:root {
+  --chart-bg: var(--entropix-color-bg-primary, #ffffff);
+  --chart-border-color: var(--entropix-color-border-default, #e5e7eb);
+  --chart-grid-color: var(--entropix-color-border-subtle, #f3f4f6);
+  --chart-text-color: var(--entropix-color-text-secondary, #6b7280);
+  --chart-tooltip-bg: var(--entropix-color-bg-inverse, #1f2937);
+  --chart-tooltip-text: var(--entropix-color-text-inverse, #ffffff);
+  --chart-font-size: var(--entropix-font-size-xs, 0.75rem);
+  --chart-series-1: var(--entropix-color-action-primary-default, #3b82f6);
+  --chart-series-2: var(--entropix-color-chart-2, #ef4444);
+  --chart-series-3: var(--entropix-color-chart-3, #22c55e);
+  --chart-series-4: var(--entropix-color-chart-4, #f59e0b);
+  --chart-series-5: var(--entropix-color-chart-5, #a855f7);
+  --chart-series-6: var(--entropix-color-chart-6, #06b6d4);
+  --chart-series-7: var(--entropix-color-chart-7, #f97316);
+  --chart-series-8: var(--entropix-color-chart-8, #ec4899);
+}
+.entropix-chart {
+  position: relative;
+  width: 100%;
+  background: var(--chart-bg);
+  font-family: var(--entropix-font-family-sans, system-ui, sans-serif);
+  font-size: var(--chart-font-size);
+  color: var(--chart-text-color);
+}
+.entropix-chart__svg {
+  display: block;
+  overflow: visible;
+}
+.entropix-chart__axis-text {
+  fill: var(--chart-text-color);
+  font-size: var(--chart-font-size);
+  font-family: inherit;
+  user-select: none;
+}
+.entropix-chart__grid-line {
+  stroke: var(--chart-grid-color);
+  stroke-width: 1;
+  shape-rendering: crispEdges;
+}
+.entropix-chart__tooltip {
+  position: absolute;
+  background: var(--chart-tooltip-bg);
+  color: var(--chart-tooltip-text);
+  padding: 6px 10px;
+  border-radius: 6px;
+  font-size: var(--chart-font-size);
+  line-height: 1.4;
+  white-space: nowrap;
+  pointer-events: none;
+  z-index: 10;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+  opacity: 0;
+  transition: opacity 0.15s ease-in-out;
+}
+.entropix-chart__tooltip--visible {
+  opacity: 1;
+}
+.entropix-chart__tooltip-row {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+.entropix-chart__tooltip-swatch {
+  display: inline-block;
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  flex-shrink: 0;
+}
+.entropix-chart__legend {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px;
+  padding: 8px 0 0;
+  justify-content: center;
+}
+.entropix-chart__legend-item {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  cursor: pointer;
+  user-select: none;
+  font-size: var(--chart-font-size);
+  color: var(--chart-text-color);
+  transition: opacity 0.15s ease-in-out;
+}
+.entropix-chart__legend-item--inactive {
+  opacity: 0.4;
+}
+.entropix-chart__legend-swatch {
+  display: inline-block;
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  flex-shrink: 0;
+}
+.entropix-chart__bar {
+  transition: opacity 0.15s ease-in-out;
+}
+.entropix-chart__bar:hover {
+  opacity: 0.8;
+}
+.entropix-chart__line {
+  fill: none;
+  stroke-width: 2;
+  stroke-linejoin: round;
+  stroke-linecap: round;
+}
+.entropix-chart__area {
+  stroke: none;
+  stroke-linejoin: round;
+}
+.entropix-chart__point {
+  stroke: var(--chart-bg);
+  stroke-width: 2;
+  transition: r 0.15s ease-in-out;
+}
+.entropix-chart__point:hover {
+  r: 5;
+}
+.entropix-chart__arc {
+  transition: opacity 0.15s ease-in-out, transform 0.15s ease-in-out;
+  transform-origin: center;
+}
+.entropix-chart__arc:hover {
+  opacity: 0.85;
+  transform: scale(1.03);
+}
+@container (max-width: 400px) {
+  .entropix-chart {
+    font-size: 0.625rem;
+  }
+}
+@media (max-width: 480px) {
+  .entropix-chart {
+    font-size: 0.625rem;
+  }
+  .entropix-chart__legend {
+    gap: 8px;
+  }
+}
+/*# sourceMappingURL=area-chart.css.map */

package/dist/area-chart.d.cts

@@ -0,0 +1,19 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ChartData, AxisConfig } from '@entropix/core';
+
+interface AreaChartProps {
+    data: ChartData;
+    height?: number;
+    colors?: string[];
+    curved?: boolean;
+    opacity?: number;
+    showGrid?: boolean;
+    showTooltip?: boolean;
+    showLegend?: boolean;
+    xAxis?: AxisConfig;
+    yAxis?: AxisConfig;
+    className?: string;
+}
+declare function AreaChart({ data, height, colors, curved, opacity, showGrid, showTooltip, showLegend, xAxis, yAxis, className, }: AreaChartProps): react_jsx_runtime.JSX.Element;
+
+export { AreaChart, type AreaChartProps };

package/dist/area-chart.d.ts

@@ -0,0 +1,19 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ChartData, AxisConfig } from '@entropix/core';
+
+interface AreaChartProps {
+    data: ChartData;
+    height?: number;
+    colors?: string[];
+    curved?: boolean;
+    opacity?: number;
+    showGrid?: boolean;
+    showTooltip?: boolean;
+    showLegend?: boolean;
+    xAxis?: AxisConfig;
+    yAxis?: AxisConfig;
+    className?: string;
+}
+declare function AreaChart({ data, height, colors, curved, opacity, showGrid, showTooltip, showLegend, xAxis, yAxis, className, }: AreaChartProps): react_jsx_runtime.JSX.Element;
+
+export { AreaChart, type AreaChartProps };

package/dist/area-chart.js

@@ -0,0 +1,5 @@
+export { AreaChart } from './chunk-CMAQ7DZD.js';
+import './chunk-4WXLJDQU.js';
+import './chunk-FQACLZYR.js';
+//# sourceMappingURL=area-chart.js.map
+//# sourceMappingURL=area-chart.js.map

package/dist/bar-chart.cjs

@@ -0,0 +1,14 @@
+'use strict';
+
+var chunkK6ZRQYSZ_cjs = require('./chunk-K6ZRQYSZ.cjs');
+require('./chunk-GCZSXJAA.cjs');
+require('./chunk-6YAOO76S.cjs');
+
+
+
+Object.defineProperty(exports, "BarChart", {
+  enumerable: true,
+  get: function () { return chunkK6ZRQYSZ_cjs.BarChart; }
+});
+//# sourceMappingURL=bar-chart.cjs.map
+//# sourceMappingURL=bar-chart.cjs.map

package/dist/bar-chart.css

@@ -0,0 +1,144 @@
+/* src/styles/chart.css */
+:root {
+  --chart-bg: var(--entropix-color-bg-primary, #ffffff);
+  --chart-border-color: var(--entropix-color-border-default, #e5e7eb);
+  --chart-grid-color: var(--entropix-color-border-subtle, #f3f4f6);
+  --chart-text-color: var(--entropix-color-text-secondary, #6b7280);
+  --chart-tooltip-bg: var(--entropix-color-bg-inverse, #1f2937);
+  --chart-tooltip-text: var(--entropix-color-text-inverse, #ffffff);
+  --chart-font-size: var(--entropix-font-size-xs, 0.75rem);
+  --chart-series-1: var(--entropix-color-action-primary-default, #3b82f6);
+  --chart-series-2: var(--entropix-color-chart-2, #ef4444);
+  --chart-series-3: var(--entropix-color-chart-3, #22c55e);
+  --chart-series-4: var(--entropix-color-chart-4, #f59e0b);
+  --chart-series-5: var(--entropix-color-chart-5, #a855f7);
+  --chart-series-6: var(--entropix-color-chart-6, #06b6d4);
+  --chart-series-7: var(--entropix-color-chart-7, #f97316);
+  --chart-series-8: var(--entropix-color-chart-8, #ec4899);
+}
+.entropix-chart {
+  position: relative;
+  width: 100%;
+  background: var(--chart-bg);
+  font-family: var(--entropix-font-family-sans, system-ui, sans-serif);
+  font-size: var(--chart-font-size);
+  color: var(--chart-text-color);
+}
+.entropix-chart__svg {
+  display: block;
+  overflow: visible;
+}
+.entropix-chart__axis-text {
+  fill: var(--chart-text-color);
+  font-size: var(--chart-font-size);
+  font-family: inherit;
+  user-select: none;
+}
+.entropix-chart__grid-line {
+  stroke: var(--chart-grid-color);
+  stroke-width: 1;
+  shape-rendering: crispEdges;
+}
+.entropix-chart__tooltip {
+  position: absolute;
+  background: var(--chart-tooltip-bg);
+  color: var(--chart-tooltip-text);
+  padding: 6px 10px;
+  border-radius: 6px;
+  font-size: var(--chart-font-size);
+  line-height: 1.4;
+  white-space: nowrap;
+  pointer-events: none;
+  z-index: 10;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+  opacity: 0;
+  transition: opacity 0.15s ease-in-out;
+}
+.entropix-chart__tooltip--visible {
+  opacity: 1;
+}
+.entropix-chart__tooltip-row {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+.entropix-chart__tooltip-swatch {
+  display: inline-block;
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  flex-shrink: 0;
+}
+.entropix-chart__legend {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px;
+  padding: 8px 0 0;
+  justify-content: center;
+}
+.entropix-chart__legend-item {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  cursor: pointer;
+  user-select: none;
+  font-size: var(--chart-font-size);
+  color: var(--chart-text-color);
+  transition: opacity 0.15s ease-in-out;
+}
+.entropix-chart__legend-item--inactive {
+  opacity: 0.4;
+}
+.entropix-chart__legend-swatch {
+  display: inline-block;
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  flex-shrink: 0;
+}
+.entropix-chart__bar {
+  transition: opacity 0.15s ease-in-out;
+}
+.entropix-chart__bar:hover {
+  opacity: 0.8;
+}
+.entropix-chart__line {
+  fill: none;
+  stroke-width: 2;
+  stroke-linejoin: round;
+  stroke-linecap: round;
+}
+.entropix-chart__area {
+  stroke: none;
+  stroke-linejoin: round;
+}
+.entropix-chart__point {
+  stroke: var(--chart-bg);
+  stroke-width: 2;
+  transition: r 0.15s ease-in-out;
+}
+.entropix-chart__point:hover {
+  r: 5;
+}
+.entropix-chart__arc {
+  transition: opacity 0.15s ease-in-out, transform 0.15s ease-in-out;
+  transform-origin: center;
+}
+.entropix-chart__arc:hover {
+  opacity: 0.85;
+  transform: scale(1.03);
+}
+@container (max-width: 400px) {
+  .entropix-chart {
+    font-size: 0.625rem;
+  }
+}
+@media (max-width: 480px) {
+  .entropix-chart {
+    font-size: 0.625rem;
+  }
+  .entropix-chart__legend {
+    gap: 8px;
+  }
+}
+/*# sourceMappingURL=bar-chart.css.map */

package/dist/bar-chart.d.cts

@@ -0,0 +1,18 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ChartData, AxisConfig } from '@entropix/core';
+
+interface BarChartProps {
+    data: ChartData;
+    height?: number;
+    colors?: string[];
+    stacked?: boolean;
+    showGrid?: boolean;
+    showTooltip?: boolean;
+    showLegend?: boolean;
+    xAxis?: AxisConfig;
+    yAxis?: AxisConfig;
+    className?: string;
+}
+declare function BarChart({ data, height, colors, stacked, showGrid, showTooltip, showLegend, xAxis, yAxis, className, }: BarChartProps): react_jsx_runtime.JSX.Element;
+
+export { BarChart, type BarChartProps };

package/dist/bar-chart.d.ts

@@ -0,0 +1,18 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ChartData, AxisConfig } from '@entropix/core';
+
+interface BarChartProps {
+    data: ChartData;
+    height?: number;
+    colors?: string[];
+    stacked?: boolean;
+    showGrid?: boolean;
+    showTooltip?: boolean;
+    showLegend?: boolean;
+    xAxis?: AxisConfig;
+    yAxis?: AxisConfig;
+    className?: string;
+}
+declare function BarChart({ data, height, colors, stacked, showGrid, showTooltip, showLegend, xAxis, yAxis, className, }: BarChartProps): react_jsx_runtime.JSX.Element;
+
+export { BarChart, type BarChartProps };

package/dist/bar-chart.js

@@ -0,0 +1,5 @@
+export { BarChart } from './chunk-X7GZD7KZ.js';
+import './chunk-4WXLJDQU.js';
+import './chunk-FQACLZYR.js';
+//# sourceMappingURL=bar-chart.js.map
+//# sourceMappingURL=bar-chart.js.map

package/dist/chunk-42HKJHUY.js

@@ -0,0 +1,96 @@
+import { CSS_CHART_COLORS, ChartContainer, ChartTooltip, ChartLegend } from './chunk-FQACLZYR.js';
+import { useState, useRef, useCallback } from 'react';
+import { getSeriesColor, computeArcGeometry } from '@entropix/core';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function PieChart({
+  data,
+  height = 300,
+  colors,
+  innerRadius = 0,
+  showTooltip = true,
+  showLegend = true,
+  className
+}) {
+  const [hiddenSlices, setHiddenSlices] = useState(/* @__PURE__ */ new Set());
+  const [tooltip, setTooltip] = useState(null);
+  const containerRef = useRef(null);
+  const toggleSlice = useCallback((name) => {
+    setHiddenSlices((prev) => {
+      const next = new Set(prev);
+      if (next.has(name)) next.delete(name);
+      else next.add(name);
+      return next;
+    });
+  }, []);
+  const palette = colors ?? CSS_CHART_COLORS;
+  const coloredData = data.map((d, i) => ({
+    ...d,
+    color: getSeriesColor(i, palette)
+  }));
+  const visibleData = coloredData.filter((d) => !hiddenSlices.has(d.label));
+  const legendItems = coloredData.map((d) => ({
+    name: d.label,
+    color: d.color,
+    active: !hiddenSlices.has(d.label)
+  }));
+  const handleArcEnter = useCallback(
+    (label, value, percentage, color, cx, cy) => {
+      if (!showTooltip) return;
+      setTooltip({
+        x: cx,
+        y: cy,
+        series: `${(percentage * 100).toFixed(1)}%`,
+        label,
+        value,
+        color
+      });
+    },
+    [showTooltip]
+  );
+  const handleArcLeave = useCallback(() => {
+    setTooltip(null);
+  }, []);
+  return /* @__PURE__ */ jsxs("div", { ref: containerRef, className: className ? `entropix-chart ${className}` : "entropix-chart", style: { position: "relative" }, children: [
+    /* @__PURE__ */ jsx(ChartContainer, { height, children: (width, h) => {
+      const cx = width / 2;
+      const cy = h / 2;
+      const outerRadius = Math.min(cx, cy) - 10;
+      if (outerRadius <= 0) return null;
+      const slices = computeArcGeometry(
+        visibleData,
+        outerRadius,
+        innerRadius
+      );
+      return /* @__PURE__ */ jsx("g", { transform: `translate(${cx}, ${cy})`, children: slices.map((slice, i) => {
+        const midAngle = (slice.startAngle + slice.endAngle) / 2;
+        const tooltipX = cx + outerRadius * 0.6 * Math.cos(midAngle);
+        const tooltipY = cy + outerRadius * 0.6 * Math.sin(midAngle);
+        return /* @__PURE__ */ jsx(
+          "path",
+          {
+            className: "entropix-chart__arc",
+            d: slice.path,
+            fill: slice.color,
+            onMouseEnter: () => handleArcEnter(
+              slice.label,
+              slice.value,
+              slice.percentage,
+              slice.color,
+              tooltipX,
+              tooltipY
+            ),
+            onMouseLeave: handleArcLeave
+          },
+          i
+        );
+      }) });
+    } }),
+    showTooltip && /* @__PURE__ */ jsx(ChartTooltip, { data: tooltip, containerRef }),
+    showLegend && /* @__PURE__ */ jsx(ChartLegend, { items: legendItems, onToggle: toggleSlice })
+  ] });
+}
+
+export { PieChart };
+//# sourceMappingURL=chunk-42HKJHUY.js.map
+//# sourceMappingURL=chunk-42HKJHUY.js.map

package/dist/chunk-4WXLJDQU.js

@@ -0,0 +1,74 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/components/chart-primitives/x-axis.tsx
+function XAxis({ scale, y, height: _height, formatter }) {
+  const domain = scale.domain();
+  const bandwidth = scale.bandwidth();
+  return /* @__PURE__ */ jsxs("g", { children: [
+    domain.map((label) => {
+      const x = scale(label) + bandwidth / 2;
+      return /* @__PURE__ */ jsxs("g", { transform: `translate(${x}, ${y})`, children: [
+        /* @__PURE__ */ jsx("line", { y2: 6, stroke: "currentColor", strokeWidth: 1 }),
+        /* @__PURE__ */ jsx(
+          "text",
+          {
+            className: "entropix-chart__axis-text",
+            y: 18,
+            textAnchor: "middle",
+            dominantBaseline: "auto",
+            children: formatter ? formatter(label) : label
+          }
+        )
+      ] }, label);
+    }),
+    /* @__PURE__ */ jsx(
+      "line",
+      {
+        x1: scale.range()[0],
+        x2: scale.range()[1],
+        y1: y,
+        y2: y,
+        stroke: "currentColor",
+        strokeWidth: 1
+      }
+    )
+  ] });
+}
+function YAxis({
+  scale,
+  x,
+  width,
+  formatter,
+  showGrid = true
+}) {
+  const ticks = scale.ticks();
+  return /* @__PURE__ */ jsx("g", { children: ticks.map((tick) => {
+    const y = scale(tick);
+    return /* @__PURE__ */ jsxs("g", { transform: `translate(${x}, ${y})`, children: [
+      /* @__PURE__ */ jsx(
+        "text",
+        {
+          className: "entropix-chart__axis-text",
+          x: -8,
+          textAnchor: "end",
+          dominantBaseline: "middle",
+          children: formatter ? formatter(tick) : String(tick)
+        }
+      ),
+      showGrid && /* @__PURE__ */ jsx(
+        "line",
+        {
+          className: "entropix-chart__grid-line",
+          x1: 0,
+          x2: width,
+          y1: 0,
+          y2: 0
+        }
+      )
+    ] }, tick);
+  }) });
+}
+
+export { XAxis, YAxis };
+//# sourceMappingURL=chunk-4WXLJDQU.js.map
+//# sourceMappingURL=chunk-4WXLJDQU.js.map