@lunora/studio 0.0.0 → 1.0.0-alpha.1

package/dist/packem_shared/bar-chart-CzJAgqkp.js

@@ -0,0 +1,3245 @@
+'use client';
+import { c } from 'react/compiler-runtime';
+import { useMotionValue, useSpring, useTransform, useMotionValueEvent, motion, useReducedMotion } from 'motion/react';
+import * as React from 'react';
+import { useId, useEffect, useState, use, createContext, useRef } from 'react';
+import * as RechartsPrimitive from 'recharts';
+import { ZIndexLayer, ResponsiveContainer, LineChart, Line, BarChart, Bar as Bar$1, AreaChart, Area, XAxis as XAxis$1, ReferenceLine, Rectangle } from 'recharts';
+import { jsxDEV, Fragment } from 'react/jsx-dev-runtime';
+import { c as cn } from './utils-B05Dmz_H.js';
+
+const DotsPattern = (t0) => {
+  const $ = c(3);
+  const {
+    id
+  } = t0;
+  let t1;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsxDEV("circle", {
+      className: "text-border dark:text-border",
+      cx: "2",
+      cy: "2",
+      fill: "currentColor",
+      r: "1"
+    }, void 0, false);
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] !== id) {
+    t2 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "20",
+      id,
+      patternUnits: "userSpaceOnUse",
+      width: "20",
+      x: "0",
+      y: "0",
+      children: t1
+    }, void 0, false);
+    $[1] = id;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  return t2;
+};
+const GridPattern = (t0) => {
+  const $ = c(3);
+  const {
+    id
+  } = t0;
+  let t1;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsxDEV("path", {
+      className: "text-border dark:text-border",
+      d: "M 20 0 L 0 0 0 20",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "0.5"
+    }, void 0, false);
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] !== id) {
+    t2 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "20",
+      id,
+      patternUnits: "userSpaceOnUse",
+      width: "20",
+      x: "0",
+      y: "0",
+      children: t1
+    }, void 0, false);
+    $[1] = id;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  return t2;
+};
+const CrossHatchPattern = (t0) => {
+  const $ = c(3);
+  const {
+    id
+  } = t0;
+  let t1;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsxDEV("path", {
+      className: "text-border/60 dark:text-border/50",
+      d: "M 0 0 L 20 20 M 20 0 L 0 20",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "0.5"
+    }, void 0, false);
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] !== id) {
+    t2 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "20",
+      id,
+      patternUnits: "userSpaceOnUse",
+      width: "20",
+      x: "0",
+      y: "0",
+      children: t1
+    }, void 0, false);
+    $[1] = id;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  return t2;
+};
+const DiagonalLinesPattern = (t0) => {
+  const $ = c(3);
+  const {
+    id
+  } = t0;
+  let t1;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsxDEV("line", {
+      className: "text-border dark:text-border",
+      stroke: "currentColor",
+      strokeWidth: "0.5",
+      x1: "0",
+      x2: "0",
+      y1: "0",
+      y2: "6"
+    }, void 0, false);
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] !== id) {
+    t2 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "6",
+      id,
+      patternTransform: "rotate(45)",
+      patternUnits: "userSpaceOnUse",
+      width: "6",
+      x: "0",
+      y: "0",
+      children: t1
+    }, void 0, false);
+    $[1] = id;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  return t2;
+};
+const PlusPattern = (t0) => {
+  const $ = c(3);
+  const {
+    id
+  } = t0;
+  let t1;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsxDEV("path", {
+      className: "text-border dark:text-border",
+      d: "M 8 4 L 8 12 M 4 8 L 12 8",
+      fill: "none",
+      stroke: "currentColor",
+      strokeLinecap: "round",
+      strokeWidth: "0.5"
+    }, void 0, false);
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] !== id) {
+    t2 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "16",
+      id,
+      patternUnits: "userSpaceOnUse",
+      width: "16",
+      x: "0",
+      y: "0",
+      children: t1
+    }, void 0, false);
+    $[1] = id;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  return t2;
+};
+const FallingTrianglesPattern = (t0) => {
+  const $ = c(3);
+  const {
+    id
+  } = t0;
+  let t1;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsxDEV("path", {
+      className: "text-border dark:text-border",
+      d: "M2 6h12L8 18 2 6zm18 36h12l-6 12-6-12z",
+      fill: "currentColor",
+      fillOpacity: "0.4",
+      transform: "scale(0.5)"
+    }, void 0, false);
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] !== id) {
+    t2 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "36",
+      id,
+      patternUnits: "userSpaceOnUse",
+      width: "18",
+      x: "0",
+      y: "0",
+      children: t1
+    }, void 0, false);
+    $[1] = id;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  return t2;
+};
+const FourPointedStarPattern = (t0) => {
+  const $ = c(3);
+  const {
+    id
+  } = t0;
+  let t1;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsxDEV("polygon", {
+      className: "text-border dark:text-border",
+      fill: "currentColor",
+      fillOpacity: "0.4",
+      fillRule: "evenodd",
+      points: "5 3 8 4 5 5 4 8 3 5 0 4 3 3 4 0 5 3"
+    }, void 0, false);
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] !== id) {
+    t2 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "16",
+      id,
+      patternUnits: "userSpaceOnUse",
+      width: "16",
+      x: "0",
+      y: "0",
+      children: t1
+    }, void 0, false);
+    $[1] = id;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  return t2;
+};
+const TinyCheckersPattern = (t0) => {
+  const $ = c(3);
+  const {
+    id
+  } = t0;
+  let t1;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsxDEV("path", {
+      className: "text-border dark:text-border",
+      d: "M0 0h4v4H0V0zm4 4h4v4H4V4z",
+      fill: "currentColor",
+      fillOpacity: "0.2",
+      fillRule: "evenodd"
+    }, void 0, false);
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] !== id) {
+    t2 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "8",
+      id,
+      patternUnits: "userSpaceOnUse",
+      width: "8",
+      x: "0",
+      y: "0",
+      children: t1
+    }, void 0, false);
+    $[1] = id;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  return t2;
+};
+const OverlappingCirclesPattern = (t0) => {
+  const $ = c(3);
+  const {
+    id
+  } = t0;
+  let t1;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsxDEV("path", {
+      className: "text-border dark:text-border",
+      d: "M25 25c0-2.762 2.238-5 5-5s5 2.238 5 5-2.238 5-5 5c0 2.762-2.238 5-5 5s-5-2.238-5-5 2.238-5 5-5zM5 5c0-2.762 2.238-5 5-5s5 2.238 5 5-2.238 5-5 5c0 2.762-2.238 5-5 5S0 12.762 0 10s2.238-5 5-5zm5 4c2.209 0 4-1.791 4-4s-1.791-4-4-4-4 1.791-4 4 1.791 4 4 4zm20 20c2.209 0 4-1.791 4-4s-1.791-4-4-4-4 1.791-4 4 1.791 4 4 4z",
+      fill: "currentColor",
+      fillOpacity: "0.4",
+      fillRule: "evenodd"
+    }, void 0, false);
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] !== id) {
+    t2 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "40",
+      id,
+      patternUnits: "userSpaceOnUse",
+      width: "40",
+      x: "0",
+      y: "0",
+      children: t1
+    }, void 0, false);
+    $[1] = id;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  return t2;
+};
+const WiggleLinesPattern = (t0) => {
+  const $ = c(3);
+  const {
+    id
+  } = t0;
+  let t1;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsxDEV("path", {
+      className: "text-border dark:text-border",
+      d: "M10 10c0-2.21-1.79-4-4-4-3.314 0-6-2.686-6-6h2c0 2.21 1.79 4 4 4 3.314 0 6 2.686 6 6 0 2.21 1.79 4 4 4 3.314 0 6 2.686 6 6 0 2.21 1.79 4 4 4v2c-3.314 0-6-2.686-6-6 0-2.21-1.79-4-4-4-3.314 0-6-2.686-6-6zm25.464-1.95l8.486 8.486-1.414 1.414-8.486-8.486 1.414-1.414z",
+      fill: "currentColor",
+      fillOpacity: "0.4"
+    }, void 0, false);
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] !== id) {
+    t2 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "26",
+      id,
+      patternTransform: "scale(0.6)",
+      patternUnits: "userSpaceOnUse",
+      width: "52",
+      x: "0",
+      y: "0",
+      children: t1
+    }, void 0, false);
+    $[1] = id;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  return t2;
+};
+const BubblesPattern = (t0) => {
+  const $ = c(3);
+  const {
+    id
+  } = t0;
+  let t1;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsxDEV("path", {
+      className: "text-border dark:text-border",
+      d: "M11 18c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm48 25c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm-43-7c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm63 31c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM34 90c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm56-76c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM12 86c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm28-65c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm23-11c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-6 60c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm29 22c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zM32 63c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm57-13c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-9-21c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM60 91c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM35 41c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM12 60c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2z",
+      fill: "currentColor",
+      fillOpacity: "0.4",
+      fillRule: "evenodd"
+    }, void 0, false);
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] !== id) {
+    t2 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "100",
+      id,
+      patternTransform: "scale(0.6667)",
+      patternUnits: "userSpaceOnUse",
+      width: "100",
+      x: "0",
+      y: "0",
+      children: t1
+    }, void 0, false);
+    $[1] = id;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  return t2;
+};
+const PATTERN_MAP = {
+  dots: DotsPattern,
+  grid: GridPattern,
+  plus: PlusPattern,
+  bubbles: BubblesPattern,
+  "cross-hatch": CrossHatchPattern,
+  "diagonal-lines": DiagonalLinesPattern,
+  "falling-triangles": FallingTrianglesPattern,
+  "4-pointed-star": FourPointedStarPattern,
+  "tiny-checkers": TinyCheckersPattern,
+  "overlapping-circles": OverlappingCirclesPattern,
+  "wiggle-lines": WiggleLinesPattern
+};
+const ChartBackground = (t0) => {
+  const $ = c(23);
+  const {
+    variant
+  } = t0;
+  const t1 = useId();
+  let t2;
+  if ($[0] !== t1) {
+    t2 = t1.replaceAll(":", "");
+    $[0] = t1;
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+  const baseId = t2;
+  const patternId = `${baseId}-bg-${variant}`;
+  const maskId = `${baseId}-bg-edge-fade`;
+  const filterId = `${baseId}-bg-blur`;
+  const PatternComponent = PATTERN_MAP[variant];
+  let t3;
+  if ($[2] !== PatternComponent || $[3] !== patternId) {
+    t3 = /* @__PURE__ */ jsxDEV(PatternComponent, {
+      id: patternId
+    }, void 0, false);
+    $[2] = PatternComponent;
+    $[3] = patternId;
+    $[4] = t3;
+  } else {
+    t3 = $[4];
+  }
+  let t4;
+  if ($[5] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t4 = /* @__PURE__ */ jsxDEV("feGaussianBlur", {
+      stdDeviation: "25"
+    }, void 0, false);
+    $[5] = t4;
+  } else {
+    t4 = $[5];
+  }
+  let t5;
+  if ($[6] !== filterId) {
+    t5 = /* @__PURE__ */ jsxDEV("filter", {
+      id: filterId,
+      children: t4
+    }, void 0, false);
+    $[6] = filterId;
+    $[7] = t5;
+  } else {
+    t5 = $[7];
+  }
+  const t6 = `url(#${filterId})`;
+  let t7;
+  if ($[8] !== t6) {
+    t7 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: "white",
+      filter: t6,
+      height: "60%",
+      width: "85%",
+      x: "8%",
+      y: "20%"
+    }, void 0, false);
+    $[8] = t6;
+    $[9] = t7;
+  } else {
+    t7 = $[9];
+  }
+  let t8;
+  if ($[10] !== maskId || $[11] !== t7) {
+    t8 = /* @__PURE__ */ jsxDEV("mask", {
+      id: maskId,
+      maskUnits: "userSpaceOnUse",
+      children: t7
+    }, void 0, false);
+    $[10] = maskId;
+    $[11] = t7;
+    $[12] = t8;
+  } else {
+    t8 = $[12];
+  }
+  let t9;
+  if ($[13] !== t3 || $[14] !== t5 || $[15] !== t8) {
+    t9 = /* @__PURE__ */ jsxDEV("defs", {
+      children: [t3, t5, t8]
+    }, void 0, true);
+    $[13] = t3;
+    $[14] = t5;
+    $[15] = t8;
+    $[16] = t9;
+  } else {
+    t9 = $[16];
+  }
+  const t10 = `url(#${patternId})`;
+  const t11 = `url(#${maskId})`;
+  let t12;
+  if ($[17] !== t10 || $[18] !== t11) {
+    t12 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: t10,
+      height: "100%",
+      mask: t11,
+      width: "100%"
+    }, void 0, false);
+    $[17] = t10;
+    $[18] = t11;
+    $[19] = t12;
+  } else {
+    t12 = $[19];
+  }
+  let t13;
+  if ($[20] !== t12 || $[21] !== t9) {
+    t13 = /* @__PURE__ */ jsxDEV(ZIndexLayer, {
+      zIndex: -1,
+      children: [t9, t12]
+    }, void 0, true);
+    $[20] = t12;
+    $[21] = t9;
+    $[22] = t13;
+  } else {
+    t13 = $[22];
+  }
+  return t13;
+};
+
+const THEMES = {
+  light: "",
+  dark: ".dark"
+};
+const VALID_THEME_KEYS = Object.keys(THEMES);
+function validateChartConfigColors(config) {
+  for (const [key, value] of Object.entries(config)) {
+    if (value.colors) {
+      const hasValidThemeKey = VALID_THEME_KEYS.some((themeKey) => value.colors?.[themeKey] !== void 0);
+      if (!hasValidThemeKey) {
+        throw new Error(`[EvilCharts] Invalid chart config for "${key}": colors object must have at least one theme key (${VALID_THEME_KEYS.join(", ")}). Received empty object or invalid keys.`);
+      }
+    }
+  }
+}
+const ChartContext = /* @__PURE__ */ React.createContext(null);
+function useChart() {
+  const context = React.useContext(ChartContext);
+  if (!context) {
+    throw new Error("useChart must be used within a <ChartContainer />");
+  }
+  return context;
+}
+const ChartContainer = ({
+  id,
+  config,
+  initialDimension = {
+    width: 320,
+    height: 200
+  },
+  className,
+  children,
+  footer,
+  ...props
+}) => {
+  const uniqueId = React.useId();
+  const chartId = `chart-${id ?? uniqueId.replaceAll(":", "")}`;
+  validateChartConfigColors(config);
+  return /* @__PURE__ */ jsxDEV(ChartContext.Provider, {
+    value: {
+      config
+    },
+    children: /* @__PURE__ */ jsxDEV("div", {
+      className: cn("min-h-0 w-full flex-1", "[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-axis-tick_text]:font-mono [&_.recharts-cartesian-axis-tick_text]:text-[11px] [&_.recharts-cartesian-axis-tick_text]:tracking-wide [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border relative flex flex-col justify-center text-xs [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden", !footer && "aspect-video", className),
+      "data-chart": chartId,
+      "data-slot": "chart",
+      ...props,
+      children: [/* @__PURE__ */ jsxDEV(ChartStyle, {
+        config,
+        id: chartId
+      }, void 0, false), /* @__PURE__ */ jsxDEV(RechartsPrimitive.ResponsiveContainer, {
+        className: "min-h-0 w-full flex-1",
+        initialDimension,
+        children
+      }, void 0, false), footer]
+    }, void 0, true)
+  }, void 0, false);
+};
+const LoadingIndicator = (t0) => {
+  const $ = c(1);
+  const {
+    isLoading
+  } = t0;
+  if (!isLoading) {
+    return null;
+  }
+  let t1;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsxDEV("div", {
+      className: "pointer-events-none absolute inset-0 z-20 flex items-center justify-center",
+      children: /* @__PURE__ */ jsxDEV("div", {
+        className: "text-primary bg-background flex items-center justify-center gap-2 rounded-md border px-2 py-0.5 text-sm",
+        children: [/* @__PURE__ */ jsxDEV("div", {
+          className: "border-border border-t-primary h-3 w-3 animate-spin rounded-full border"
+        }, void 0, false), /* @__PURE__ */ jsxDEV("span", {
+          children: "Loading"
+        }, void 0, false)]
+      }, void 0, true)
+    }, void 0, false);
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  return t1;
+};
+function distributeColors(colorsArray, maxCount) {
+  const availableCount = colorsArray.length;
+  if (availableCount >= maxCount) {
+    return colorsArray.slice(0, maxCount);
+  }
+  const result = [];
+  const baseSlots = Math.floor(maxCount / availableCount);
+  const extraSlots = maxCount % availableCount;
+  for (let colorIndex = 0; colorIndex < availableCount; colorIndex++) {
+    const isExtraColor = colorIndex >= availableCount - extraSlots;
+    const slotsForThisColor = baseSlots + (isExtraColor ? 1 : 0);
+    for (let j = 0; j < slotsForThisColor; j++) {
+      result.push(colorsArray[colorIndex]);
+    }
+  }
+  return result;
+}
+const ChartStyle = (t0) => {
+  const $ = c(6);
+  const {
+    id,
+    config
+  } = t0;
+  let t1;
+  let t2;
+  if ($[0] !== config || $[1] !== id) {
+    t2 = /* @__PURE__ */ Symbol.for("react.early_return_sentinel");
+    bb0: {
+      const colorConfig = Object.entries(config).filter(_temp$1);
+      if (colorConfig.length === 0) {
+        t2 = null;
+        break bb0;
+      }
+      const generateCssVariables = (theme) => colorConfig.flatMap((t32) => {
+        const [key, itemConfig] = t32;
+        const colorsArray = itemConfig.colors?.[theme];
+        if (!colorsArray || !Array.isArray(colorsArray) || colorsArray.length === 0) {
+          return [];
+        }
+        const maxCount = getColorsCount(itemConfig);
+        const distributedColors = distributeColors(colorsArray, maxCount);
+        return distributedColors.map((color, index) => `  --color-${key}-${index}: ${color};`);
+      }).filter(Boolean).join("\n");
+      t1 = Object.entries(THEMES).map((t4) => {
+        const [theme_0, prefix] = t4;
+        return `${prefix} [data-chart=${id}] {
+${generateCssVariables(theme_0)}
+}`;
+      });
+    }
+    $[0] = config;
+    $[1] = id;
+    $[2] = t1;
+    $[3] = t2;
+  } else {
+    t1 = $[2];
+    t2 = $[3];
+  }
+  if (t2 !== /* @__PURE__ */ Symbol.for("react.early_return_sentinel")) {
+    return t2;
+  }
+  const css = t1.join("\n");
+  let t3;
+  if ($[4] !== css) {
+    t3 = /* @__PURE__ */ jsxDEV("style", {
+      dangerouslySetInnerHTML: {
+        __html: css
+      }
+    }, void 0, false);
+    $[4] = css;
+    $[5] = t3;
+  } else {
+    t3 = $[5];
+  }
+  return t3;
+};
+function getPayloadConfigFromPayload(config, payload, key) {
+  if (typeof payload !== "object" || payload === null) {
+    return void 0;
+  }
+  const payloadPayload = "payload" in payload && typeof payload.payload === "object" && payload.payload !== null ? payload.payload : void 0;
+  let configLabelKey = key;
+  if (key in payload && typeof payload[key] === "string") {
+    configLabelKey = payload[key];
+  } else if (payloadPayload && key in payloadPayload && typeof payloadPayload[key] === "string") {
+    configLabelKey = payloadPayload[key];
+  }
+  return configLabelKey in config ? config[configLabelKey] : config[key];
+}
+function getColorsCount(config) {
+  if (!config.colors) {
+    return 1;
+  }
+  const counts = VALID_THEME_KEYS.map((theme) => config.colors?.[theme]?.length ?? 0);
+  return Math.max(...counts, 1);
+}
+const getLoadingData = (points = 10, min = 0, max = 70) => {
+  const range = max - min;
+  return Array.from({
+    length: points
+  }, () => {
+    return {
+      loading: Math.floor(Math.random() * range) + min
+    };
+  });
+};
+function _temp$1(t0) {
+  const [, config_0] = t0;
+  return config_0.colors;
+}
+
+const SPRING_CONFIG = {
+  stiffness: 300,
+  damping: 35,
+  mass: 0.8
+};
+function useBrushDrag(t0) {
+  const $ = c(16);
+  const {
+    range,
+    totalPoints,
+    containerRef,
+    commit
+  } = t0;
+  const dragRef = React.useRef(null);
+  const [isDragging, setIsDragging] = React.useState(false);
+  let t1;
+  if ($[0] !== containerRef || $[1] !== totalPoints) {
+    t1 = (px) => {
+      if (!containerRef.current || totalPoints <= 1) {
+        return 0;
+      }
+      return Math.round(px / containerRef.current.getBoundingClientRect().width * (totalPoints - 1));
+    };
+    $[0] = containerRef;
+    $[1] = totalPoints;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  const toIndexDelta = t1;
+  let t2;
+  if ($[3] !== range) {
+    t2 = (e, type) => {
+      e.preventDefault();
+      e.target.setPointerCapture(e.pointerId);
+      dragRef.current = {
+        type,
+        originX: e.clientX,
+        originRange: {
+          ...range
+        }
+      };
+      setIsDragging(true);
+    };
+    $[3] = range;
+    $[4] = t2;
+  } else {
+    t2 = $[4];
+  }
+  const onPointerDown = t2;
+  let t3;
+  if ($[5] !== commit || $[6] !== toIndexDelta || $[7] !== totalPoints) {
+    t3 = (e_0) => {
+      const d = dragRef.current;
+      if (!d) {
+        return;
+      }
+      const delta = toIndexDelta(e_0.clientX - d.originX);
+      const {
+        type: type_0,
+        originRange: o
+      } = d;
+      if (type_0 === "left") {
+        commit({
+          startIndex: o.startIndex + delta,
+          endIndex: o.endIndex
+        }, "left");
+      } else {
+        if (type_0 === "right") {
+          commit({
+            startIndex: o.startIndex,
+            endIndex: o.endIndex + delta
+          }, "right");
+        } else {
+          const span = o.endIndex - o.startIndex;
+          let s = o.startIndex + delta;
+          let e2 = s + span;
+          if (s < 0) {
+            s = 0;
+            e2 = span;
+          }
+          if (e2 > totalPoints - 1) {
+            e2 = totalPoints - 1;
+            s = Math.max(0, e2 - span);
+          }
+          commit({
+            startIndex: s,
+            endIndex: e2
+          }, "middle");
+        }
+      }
+    };
+    $[5] = commit;
+    $[6] = toIndexDelta;
+    $[7] = totalPoints;
+    $[8] = t3;
+  } else {
+    t3 = $[8];
+  }
+  const onPointerMove = t3;
+  let t4;
+  if ($[9] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t4 = (e_1) => {
+      e_1.target.releasePointerCapture(e_1.pointerId);
+      dragRef.current = null;
+      setIsDragging(false);
+    };
+    $[9] = t4;
+  } else {
+    t4 = $[9];
+  }
+  const onPointerUp = t4;
+  let t5;
+  if ($[10] !== onPointerDown || $[11] !== onPointerMove) {
+    t5 = (type_1) => ({
+      onPointerDown: (e_2) => {
+        onPointerDown(e_2, type_1);
+      },
+      onPointerMove,
+      onPointerUp
+    });
+    $[10] = onPointerDown;
+    $[11] = onPointerMove;
+    $[12] = t5;
+  } else {
+    t5 = $[12];
+  }
+  const bind = t5;
+  let t6;
+  if ($[13] !== bind || $[14] !== isDragging) {
+    t6 = {
+      isDragging,
+      bind
+    };
+    $[13] = bind;
+    $[14] = isDragging;
+    $[15] = t6;
+  } else {
+    t6 = $[15];
+  }
+  return t6;
+}
+const EvilBrush = ({
+  data,
+  chartConfig,
+  dataKeys,
+  xDataKey,
+  variant = "area",
+  height = 56,
+  className,
+  stacked = false,
+  strokeVariant = "solid",
+  connectNulls = false,
+  barRadius,
+  startIndex: controlledStart,
+  endIndex: controlledEnd,
+  defaultStartIndex = 0,
+  defaultEndIndex,
+  onChange,
+  formatLabel,
+  curveType = "monotone",
+  minSpan = 2,
+  showLabels = true,
+  skipStyle = false
+}) => {
+  const containerRef = React.useRef(null);
+  const keys = dataKeys ?? Object.keys(chartConfig);
+  const totalPoints = data.length;
+  const chartId = React.useId().replaceAll(":", "");
+  const isControlled = controlledStart !== void 0 && controlledEnd !== void 0;
+  const [internalRange, setInternalRange] = React.useState(() => {
+    return {
+      startIndex: Math.max(0, Math.min(defaultStartIndex, totalPoints - 1)),
+      endIndex: Math.max(0, Math.min(defaultEndIndex ?? totalPoints - 1, totalPoints - 1))
+    };
+  });
+  const lastCommittedRef = React.useRef(internalRange);
+  useEffect(() => {
+    if (!isControlled) {
+      setInternalRange((previous) => {
+        const adjusted = {
+          startIndex: Math.min(previous.startIndex, Math.max(0, totalPoints - 1)),
+          endIndex: Math.min(previous.endIndex, Math.max(0, totalPoints - 1))
+        };
+        lastCommittedRef.current = adjusted;
+        return adjusted;
+      });
+    }
+  }, [totalPoints, isControlled]);
+  const clampRange = (range, mode) => {
+    let {
+      startIndex,
+      endIndex
+    } = range;
+    const maxIndex = Math.max(0, totalPoints - 1);
+    startIndex = Math.max(0, Math.min(startIndex, maxIndex));
+    endIndex = Math.max(0, Math.min(endIndex, maxIndex));
+    if (mode === "left") {
+      const maxStart = Math.max(0, endIndex - minSpan);
+      startIndex = Math.min(startIndex, maxStart);
+      return {
+        startIndex,
+        endIndex
+      };
+    }
+    if (mode === "right") {
+      const minEnd = Math.min(maxIndex, startIndex + minSpan);
+      endIndex = Math.max(endIndex, minEnd);
+      return {
+        startIndex,
+        endIndex
+      };
+    }
+    if (endIndex - startIndex < minSpan) {
+      endIndex = Math.min(startIndex + minSpan, maxIndex);
+      if (endIndex - startIndex < minSpan) {
+        startIndex = Math.max(0, endIndex - minSpan);
+      }
+    }
+    return {
+      startIndex,
+      endIndex
+    };
+  };
+  const commit = (next, mode_0) => {
+    const clamped = clampRange(next, mode_0);
+    const last = lastCommittedRef.current;
+    if (last.startIndex === clamped.startIndex && last.endIndex === clamped.endIndex) {
+      return;
+    }
+    lastCommittedRef.current = clamped;
+    setInternalRange(clamped);
+    React.startTransition(() => {
+      onChange?.(clamped);
+    });
+  };
+  const {
+    isDragging,
+    bind
+  } = useBrushDrag({
+    range: internalRange,
+    totalPoints,
+    containerRef,
+    commit
+  });
+  const range_0 = internalRange;
+  useEffect(() => {
+    if (isControlled && !isDragging) {
+      const syncedRange = {
+        startIndex: controlledStart,
+        endIndex: controlledEnd
+      };
+      setInternalRange(syncedRange);
+      lastCommittedRef.current = syncedRange;
+    }
+  }, [isControlled, controlledStart, controlledEnd, isDragging]);
+  const leftPct = totalPoints > 1 ? range_0.startIndex / (totalPoints - 1) * 100 : 0;
+  const rightPct = totalPoints > 1 ? range_0.endIndex / (totalPoints - 1) * 100 : 100;
+  const leftTarget = useMotionValue(leftPct);
+  const rightTarget = useMotionValue(rightPct);
+  if (leftTarget.get() !== leftPct) {
+    leftTarget.set(leftPct);
+  }
+  if (rightTarget.get() !== rightPct) {
+    rightTarget.set(rightPct);
+  }
+  const leftSpring = useSpring(leftTarget, SPRING_CONFIG);
+  const rightSpring = useSpring(rightTarget, SPRING_CONFIG);
+  const leftPosition = useTransform(leftSpring, (v) => `${v}%`);
+  const rightPosition = useTransform(rightSpring, (v_0) => `${v_0}%`);
+  const leftOverlayWidth = useTransform(leftSpring, (v_1) => `${v_1}%`);
+  const rightOverlayWidth = useTransform(rightSpring, (v_2) => `${Math.max(0, 100 - v_2)}%`);
+  const selectedWidth = useMotionValue(`${Math.max(0, rightPct - leftPct)}%`);
+  const updateSelectedWidth = () => {
+    selectedWidth.set(`${Math.max(0, rightSpring.get() - leftSpring.get())}%`);
+  };
+  useMotionValueEvent(leftSpring, "change", updateSelectedWidth);
+  useMotionValueEvent(rightSpring, "change", updateSelectedWidth);
+  const getLabel = (index) => {
+    if (!xDataKey) {
+      return String(index);
+    }
+    const v_3 = data[index]?.[xDataKey];
+    return formatLabel ? formatLabel(v_3, index) : String(v_3 ?? index);
+  };
+  if (totalPoints === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxDEV("div", {
+    className: cn("group relative select-none", className),
+    "data-chart": skipStyle ? void 0 : chartId,
+    ref: containerRef,
+    style: {
+      height
+    },
+    children: [!skipStyle && /* @__PURE__ */ jsxDEV(ChartStyle, {
+      config: chartConfig,
+      id: chartId
+    }, void 0, false), /* @__PURE__ */ jsxDEV("div", {
+      className: "absolute inset-0 overflow-hidden rounded-md",
+      children: /* @__PURE__ */ jsxDEV(MiniChart, {
+        barRadius,
+        chartConfig,
+        chartId,
+        connectNulls,
+        curveType,
+        data,
+        keys,
+        stacked,
+        strokeVariant: strokeVariant === "animated-dashed" ? "dashed" : strokeVariant,
+        variant
+      }, void 0, false)
+    }, void 0, false), /* @__PURE__ */ jsxDEV(motion.div, {
+      className: "bg-background pointer-events-none absolute inset-y-0 start-0 rounded-s-md",
+      style: {
+        width: leftOverlayWidth
+      }
+    }, void 0, false), /* @__PURE__ */ jsxDEV(motion.div, {
+      className: "bg-background pointer-events-none absolute inset-y-0 end-0 rounded-e-md",
+      style: {
+        width: rightOverlayWidth
+      }
+    }, void 0, false), /* @__PURE__ */ jsxDEV(motion.div, {
+      className: "absolute inset-y-0 cursor-grab touch-none rounded-sm border active:cursor-grabbing",
+      style: {
+        left: leftPosition,
+        width: selectedWidth
+      },
+      ...bind("middle")
+    }, void 0, false), /* @__PURE__ */ jsxDEV(BrushHandle, {
+      bind: bind("left"),
+      label: showLabels ? getLabel(range_0.startIndex) : void 0,
+      position: leftPosition,
+      side: "left"
+    }, void 0, false), /* @__PURE__ */ jsxDEV(BrushHandle, {
+      bind: bind("right"),
+      label: showLabels ? getLabel(range_0.endIndex) : void 0,
+      position: rightPosition,
+      side: "right"
+    }, void 0, false)]
+  }, void 0, true);
+};
+const BrushHandle = (t0) => {
+  const $ = c(20);
+  const {
+    side,
+    position,
+    label,
+    bind
+  } = t0;
+  const isLeft = side === "left";
+  let t1;
+  if ($[0] !== position) {
+    t1 = {
+      left: position
+    };
+    $[0] = position;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const t2 = isLeft ? "" : "-translate-x-full rtl:translate-x-full";
+  let t3;
+  if ($[2] !== t2) {
+    t3 = cn("group absolute inset-y-0 flex w-3 cursor-ew-resize touch-none items-center justify-center after:absolute after:inset-y-0 after:-start-4 after:w-11 after:content-['']", t2);
+    $[2] = t2;
+    $[3] = t3;
+  } else {
+    t3 = $[3];
+  }
+  const t4 = isLeft ? "-start-[5.5px]" : "-end-[5.5px]";
+  let t5;
+  if ($[4] !== t4) {
+    t5 = cn("bg-muted-foreground group-hover:bg-foreground relative flex h-4 w-1.5 items-center justify-center rounded-md transition-colors", t4);
+    $[4] = t4;
+    $[5] = t5;
+  } else {
+    t5 = $[5];
+  }
+  let t6;
+  if ($[6] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t6 = /* @__PURE__ */ jsxDEV("div", {
+      className: "flex flex-col gap-[2px]",
+      children: [/* @__PURE__ */ jsxDEV("div", {
+        className: "bg-background h-[2px] w-[2px] rounded-full"
+      }, void 0, false), /* @__PURE__ */ jsxDEV("div", {
+        className: "bg-background h-[2px] w-[2px] rounded-full"
+      }, void 0, false), /* @__PURE__ */ jsxDEV("div", {
+        className: "bg-background h-[2px] w-[2px] rounded-full"
+      }, void 0, false)]
+    }, void 0, true);
+    $[6] = t6;
+  } else {
+    t6 = $[6];
+  }
+  let t7;
+  if ($[7] !== t5) {
+    t7 = /* @__PURE__ */ jsxDEV("div", {
+      className: t5,
+      children: t6
+    }, void 0, false);
+    $[7] = t5;
+    $[8] = t7;
+  } else {
+    t7 = $[8];
+  }
+  let t8;
+  if ($[9] !== bind || $[10] !== t3 || $[11] !== t7) {
+    t8 = /* @__PURE__ */ jsxDEV("div", {
+      className: t3,
+      ...bind,
+      children: t7
+    }, void 0, false);
+    $[9] = bind;
+    $[10] = t3;
+    $[11] = t7;
+    $[12] = t8;
+  } else {
+    t8 = $[12];
+  }
+  let t9;
+  if ($[13] !== isLeft || $[14] !== label) {
+    t9 = label && /* @__PURE__ */ jsxDEV("div", {
+      className: cn("bg-foreground text-background pointer-events-none absolute -bottom-3 -translate-y-1/2 rounded-[3px] px-1 py-px text-[8px] leading-tight font-medium whitespace-nowrap opacity-0 group-hover:opacity-100", isLeft ? "start-1.5" : "end-1.5"),
+      children: label
+    }, void 0, false);
+    $[13] = isLeft;
+    $[14] = label;
+    $[15] = t9;
+  } else {
+    t9 = $[15];
+  }
+  let t10;
+  if ($[16] !== t1 || $[17] !== t8 || $[18] !== t9) {
+    t10 = /* @__PURE__ */ jsxDEV(motion.div, {
+      className: "absolute inset-y-0 z-10",
+      style: t1,
+      children: [t8, t9]
+    }, void 0, true);
+    $[16] = t1;
+    $[17] = t8;
+    $[18] = t9;
+    $[19] = t10;
+  } else {
+    t10 = $[19];
+  }
+  return t10;
+};
+const MiniChart = ({
+  data,
+  keys,
+  chartConfig,
+  variant,
+  curveType,
+  chartId,
+  stacked,
+  strokeVariant = "solid",
+  connectNulls = false,
+  barRadius
+}) => {
+  const gradients = Object.entries(chartConfig).filter(([key]) => keys.includes(key)).map(([dataKey, config]) => {
+    return {
+      dataKey,
+      colorsCount: getColorsCount(config)
+    };
+  });
+  const dashArray = strokeVariant === "dashed" || strokeVariant === "animated-dashed" ? "4 4" : void 0;
+  const defsContent = /* @__PURE__ */ jsxDEV(Fragment, {
+    children: [variant === "area" && /* @__PURE__ */ jsxDEV("linearGradient", {
+      id: `${chartId}-zm-vertical-fade`,
+      x1: "0",
+      x2: "0",
+      y1: "0",
+      y2: "1",
+      children: [/* @__PURE__ */ jsxDEV("stop", {
+        offset: "0%",
+        stopColor: "white",
+        stopOpacity: 0.15
+      }, void 0, false), /* @__PURE__ */ jsxDEV("stop", {
+        offset: "100%",
+        stopColor: "white",
+        stopOpacity: 0
+      }, void 0, false)]
+    }, void 0, true), gradients.map(({
+      dataKey: dataKey_0,
+      colorsCount
+    }) => {
+      const colorStops = colorsCount === 1 ? /* @__PURE__ */ jsxDEV(Fragment, {
+        children: [/* @__PURE__ */ jsxDEV("stop", {
+          offset: "0%",
+          stopColor: `var(--color-${dataKey_0}-0)`
+        }, void 0, false), /* @__PURE__ */ jsxDEV("stop", {
+          offset: "100%",
+          stopColor: `var(--color-${dataKey_0}-0)`
+        }, void 0, false)]
+      }, void 0, true) : Array.from({
+        length: colorsCount
+      }, (_, i) => /* @__PURE__ */ jsxDEV("stop", {
+        offset: `${i / (colorsCount - 1) * 100}%`,
+        stopColor: `var(--color-${dataKey_0}-${i}, var(--color-${dataKey_0}-0))`
+      }, i, false));
+      return /* @__PURE__ */ jsxDEV(React.Fragment, {
+        children: [/* @__PURE__ */ jsxDEV("linearGradient", {
+          id: `${chartId}-zm-${dataKey_0}`,
+          x1: "0",
+          x2: "0",
+          y1: "0",
+          y2: "1",
+          children: colorStops
+        }, void 0, false), variant === "area" && /* @__PURE__ */ jsxDEV(Fragment, {
+          children: [/* @__PURE__ */ jsxDEV("mask", {
+            id: `${chartId}-zm-fill-mask-${dataKey_0}`,
+            children: /* @__PURE__ */ jsxDEV("rect", {
+              fill: `url(#${chartId}-zm-vertical-fade)`,
+              height: "100%",
+              width: "100%"
+            }, void 0, false)
+          }, void 0, false), /* @__PURE__ */ jsxDEV("pattern", {
+            height: "100%",
+            id: `${chartId}-zm-fill-${dataKey_0}`,
+            patternUnits: "userSpaceOnUse",
+            width: "100%",
+            children: /* @__PURE__ */ jsxDEV("rect", {
+              fill: `url(#${chartId}-zm-${dataKey_0})`,
+              height: "100%",
+              mask: `url(#${chartId}-zm-fill-mask-${dataKey_0})`,
+              width: "100%"
+            }, void 0, false)
+          }, void 0, false)]
+        }, void 0, true)]
+      }, dataKey_0, true);
+    })]
+  }, void 0, true);
+  if (variant === "line") {
+    return /* @__PURE__ */ jsxDEV(ResponsiveContainer, {
+      height: "100%",
+      width: "100%",
+      children: /* @__PURE__ */ jsxDEV(LineChart, {
+        data,
+        margin: {
+          top: 4,
+          right: 0,
+          bottom: 0,
+          left: 0
+        },
+        children: [/* @__PURE__ */ jsxDEV("defs", {
+          children: defsContent
+        }, void 0, false), keys.map((dk) => /* @__PURE__ */ jsxDEV(Line, {
+          activeDot: false,
+          connectNulls,
+          dataKey: dk,
+          dot: false,
+          isAnimationActive: false,
+          stroke: `url(#${chartId}-zm-${dk})`,
+          strokeDasharray: dashArray,
+          strokeOpacity: 0.5,
+          strokeWidth: 1,
+          type: curveType
+        }, dk, false))]
+      }, void 0, true)
+    }, void 0, false);
+  }
+  if (variant === "bar") {
+    const r = barRadius ?? 3;
+    return /* @__PURE__ */ jsxDEV(ResponsiveContainer, {
+      height: "100%",
+      width: "100%",
+      children: /* @__PURE__ */ jsxDEV(BarChart, {
+        barGap: 2,
+        barSize: 14,
+        data,
+        margin: {
+          top: 2,
+          right: 0,
+          bottom: 0,
+          left: 0
+        },
+        children: [/* @__PURE__ */ jsxDEV("defs", {
+          children: defsContent
+        }, void 0, false), keys.map((dk_0) => /* @__PURE__ */ jsxDEV(Bar$1, {
+          dataKey: dk_0,
+          fill: `url(#${chartId}-zm-${dk_0})`,
+          fillOpacity: 0.35,
+          isAnimationActive: false,
+          radius: [r, r, r, r],
+          stackId: stacked ? "zm-stack" : void 0
+        }, dk_0, false))]
+      }, void 0, true)
+    }, void 0, false);
+  }
+  return /* @__PURE__ */ jsxDEV(ResponsiveContainer, {
+    height: "100%",
+    width: "100%",
+    children: /* @__PURE__ */ jsxDEV(AreaChart, {
+      data,
+      margin: {
+        top: 4,
+        right: 0,
+        bottom: 0,
+        left: 0
+      },
+      children: [/* @__PURE__ */ jsxDEV("defs", {
+        children: defsContent
+      }, void 0, false), keys.map((dk_1) => /* @__PURE__ */ jsxDEV(Area, {
+        activeDot: false,
+        connectNulls,
+        dataKey: dk_1,
+        dot: false,
+        fill: `url(#${chartId}-zm-fill-${dk_1})`,
+        fillOpacity: 1,
+        isAnimationActive: false,
+        stackId: stacked ? "zm-stack" : void 0,
+        stroke: `url(#${chartId}-zm-${dk_1})`,
+        strokeDasharray: dashArray,
+        strokeOpacity: 0.5,
+        strokeWidth: 1,
+        type: curveType
+      }, dk_1, false))]
+    }, void 0, true)
+  }, void 0, false);
+};
+function useEvilBrush({
+  data,
+  defaultStartIndex = 0,
+  defaultEndIndex
+}) {
+  const [range, setRange] = React.useState({
+    startIndex: defaultStartIndex,
+    endIndex: defaultEndIndex ?? Math.max(0, data.length - 1)
+  });
+  const deferredRange = React.useDeferredValue(range);
+  useEffect(() => {
+    setRange({
+      startIndex: 0,
+      endIndex: Math.max(0, data.length - 1)
+    });
+  }, [data.length]);
+  const visibleData = data.slice(deferredRange.startIndex, deferredRange.endIndex + 1);
+  return {
+    range,
+    visibleData,
+    brushProps: {
+      startIndex: range.startIndex,
+      endIndex: range.endIndex,
+      onChange: setRange
+    }
+  };
+}
+
+const roundnessMap = {
+  sm: "rounded-sm",
+  md: "rounded-md",
+  lg: "rounded-lg",
+  xl: "rounded-xl"
+};
+const variantMap = {
+  default: "bg-background",
+  "frosted-glass": "bg-background"
+};
+const ChartTooltipContent = ({
+  active,
+  payload,
+  className,
+  indicator = "dot",
+  hideLabel = false,
+  hideIndicator = false,
+  label,
+  labelFormatter,
+  labelClassName,
+  formatter,
+  nameKey,
+  labelKey,
+  selected,
+  roundness = "lg",
+  variant = "default"
+}) => {
+  const {
+    config
+  } = useChart();
+  const tooltipLabel = React.useMemo(() => {
+    if (hideLabel || !payload?.length) {
+      return null;
+    }
+    const [item] = payload;
+    const key = `${labelKey ?? item?.dataKey ?? item?.name ?? "value"}`;
+    const itemConfig = getPayloadConfigFromPayload(config, item, key);
+    const value = !labelKey && typeof label === "string" ? config[label]?.label ?? label : itemConfig?.label;
+    if (labelFormatter) {
+      return /* @__PURE__ */ jsxDEV("div", {
+        className: cn("font-medium", labelClassName),
+        children: labelFormatter(value, payload)
+      }, void 0, false);
+    }
+    if (!value) {
+      return null;
+    }
+    return /* @__PURE__ */ jsxDEV("div", {
+      className: cn("font-medium", labelClassName),
+      children: value
+    }, void 0, false);
+  }, [label, labelFormatter, payload, hideLabel, labelClassName, config, labelKey]);
+  if (!active || !payload?.length) {
+    return /* @__PURE__ */ jsxDEV("span", {
+      className: "p-4"
+    }, void 0, false);
+  }
+  const nestLabel = payload.length === 1 && indicator !== "dot";
+  return /* @__PURE__ */ jsxDEV("div", {
+    className: cn("border-border/50 grid min-w-32 items-start gap-1.5 border px-2.5 py-1.5 text-xs", roundnessMap[roundness], variantMap[variant], className),
+    children: [nestLabel ? null : tooltipLabel, /* @__PURE__ */ jsxDEV("div", {
+      className: "grid gap-1.5",
+      children: payload.filter((item_0) => item_0.type !== "none").map((item_1, index) => {
+        const payloadName = nameKey && item_1.payload ? item_1.payload[nameKey] : void 0;
+        const key_0 = `${payloadName ?? item_1.name ?? item_1.dataKey ?? "value"}`;
+        const itemConfig_0 = getPayloadConfigFromPayload(config, item_1, key_0);
+        const colorsCount = itemConfig_0 ? getColorsCount(itemConfig_0) : 1;
+        return /* @__PURE__ */ jsxDEV("div", {
+          className: cn("[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5", indicator === "dot" && "items-center", selected != null && selected !== item_1.dataKey && "opacity-30"),
+          children: formatter && item_1?.value !== void 0 && item_1.name ? formatter(item_1.value, item_1.name, item_1, index, item_1.payload) : /* @__PURE__ */ jsxDEV(Fragment, {
+            children: [itemConfig_0?.icon ? /* @__PURE__ */ jsxDEV(itemConfig_0.icon, {}, void 0, false) : !hideIndicator && /* @__PURE__ */ jsxDEV("div", {
+              className: cn("shrink-0 rounded-[2px]", {
+                "h-2.5 w-2.5": indicator === "dot",
+                "w-1": indicator === "line",
+                "w-0 border-[1.5px] border-dashed bg-transparent!": indicator === "dashed",
+                "my-0.5": nestLabel && indicator === "dashed"
+              }),
+              style: getIndicatorColorStyle(key_0, colorsCount)
+            }, void 0, false), /* @__PURE__ */ jsxDEV("div", {
+              className: cn("flex flex-1 justify-between gap-4 leading-none", nestLabel ? "items-end" : "items-center"),
+              children: [/* @__PURE__ */ jsxDEV("div", {
+                className: "grid gap-1.5",
+                children: [nestLabel ? tooltipLabel : null, /* @__PURE__ */ jsxDEV("span", {
+                  className: "text-muted-foreground",
+                  children: itemConfig_0?.label ?? item_1.name
+                }, void 0, false)]
+              }, void 0, true), item_1.value != null && /* @__PURE__ */ jsxDEV("span", {
+                className: "text-foreground font-mono font-medium tabular-nums",
+                children: typeof item_1.value === "number" ? item_1.value.toLocaleString() : String(item_1.value)
+              }, void 0, false)]
+            }, void 0, true)]
+          }, void 0, true)
+        }, index, false);
+      })
+    }, void 0, false)]
+  }, void 0, true);
+};
+function getIndicatorColorStyle(dataKey, colorsCount) {
+  if (colorsCount <= 1) {
+    return {
+      background: `var(--color-${dataKey}-0)`
+    };
+  }
+  const stops = Array.from({
+    length: colorsCount
+  }, (_, index) => {
+    const offset = index / (colorsCount - 1) * 100;
+    return `var(--color-${dataKey}-${index}) ${offset}%`;
+  }).join(", ");
+  return {
+    background: `linear-gradient(to right, ${stops})`
+  };
+}
+const ChartTooltip = ({
+  animationDuration = 200,
+  ...props
+}) => /* @__PURE__ */ jsxDEV(RechartsPrimitive.Tooltip, {
+  animationDuration,
+  ...props
+}, void 0, false);
+
+const DEFAULT_BAR_RADIUS = 2;
+const LOADING_BAR_DATA_KEY = "loading";
+const LOADING_ANIMATION_DURATION = 2e3;
+const STACK_ID = "evil-stacked";
+const BAR_GROW_DURATION = 0.5;
+const BAR_STAGGER = 0.05;
+const REVEAL_EASE = [0, 0.7, 0.5, 1];
+const BarChartContext = /* @__PURE__ */ createContext(null);
+function useBarChart() {
+  const context = use(BarChartContext);
+  if (!context) {
+    throw new Error("Bar chart parts (<Bar />, <XAxis />, …) must be used within <EvilBarChart />");
+  }
+  return context;
+}
+const EvilBarChart = ({
+  config,
+  data,
+  children,
+  className,
+  chartProps,
+  stackType = "default",
+  layout = "vertical",
+  barRadius = DEFAULT_BAR_RADIUS,
+  animationType = "left-to-right",
+  barGap,
+  barCategoryGap,
+  backgroundVariant,
+  defaultSelectedDataKey = null,
+  onSelectionChange,
+  isLoading = false,
+  loadingBars,
+  showBrush = false,
+  xDataKey,
+  brushHeight,
+  brushFormatLabel,
+  onBrushChange
+}) => {
+  const chartId = useId().replaceAll(":", "");
+  const [introStartedAt] = useState(() => Date.now());
+  const [selectedDataKey, setSelectedDataKey] = useState(defaultSelectedDataKey);
+  const [isMouseInChart, setIsMouseInChart] = useState(false);
+  const {
+    loadingData,
+    onShimmerExit
+  } = useLoadingData(isLoading, loadingBars);
+  const {
+    visibleData,
+    brushProps
+  } = useEvilBrush({
+    data
+  });
+  const isStacked = stackType === "stacked" || stackType === "percent";
+  const isHorizontal = layout === "horizontal";
+  const displayData = showBrush && !isLoading ? visibleData : data;
+  const selectDataKey = (newSelectedDataKey) => {
+    setSelectedDataKey(newSelectedDataKey);
+    onSelectionChange?.(newSelectedDataKey);
+  };
+  const contextValue = {
+    config,
+    isStacked,
+    isHorizontal,
+    isLoading,
+    barRadius,
+    animationType,
+    introStartedAt,
+    dataLength: displayData.length,
+    selectedDataKey,
+    selectDataKey,
+    isMouseInChart
+  };
+  return /* @__PURE__ */ jsxDEV(BarChartContext, {
+    value: contextValue,
+    children: /* @__PURE__ */ jsxDEV(ChartContainer, {
+      className,
+      config,
+      footer: showBrush && !isLoading && /* @__PURE__ */ jsxDEV(EvilBrush, {
+        barRadius,
+        chartConfig: config,
+        className: "mt-1",
+        data,
+        formatLabel: brushFormatLabel,
+        height: brushHeight,
+        skipStyle: true,
+        stacked: isStacked,
+        variant: "bar",
+        xDataKey,
+        ...brushProps,
+        onChange: (range) => {
+          brushProps.onChange(range);
+          onBrushChange?.(range);
+        }
+      }, void 0, false),
+      children: [/* @__PURE__ */ jsxDEV(LoadingIndicator, {
+        isLoading
+      }, void 0, false), /* @__PURE__ */ jsxDEV(BarChart, {
+        accessibilityLayer: true,
+        barCategoryGap,
+        barGap,
+        data: isLoading ? loadingData : displayData,
+        id: chartId,
+        layout: isHorizontal ? "vertical" : "horizontal",
+        onMouseEnter: () => {
+          setIsMouseInChart(true);
+        },
+        onMouseLeave: () => {
+          setIsMouseInChart(false);
+        },
+        stackOffset: stackType === "percent" ? "expand" : void 0,
+        ...chartProps,
+        children: [backgroundVariant && /* @__PURE__ */ jsxDEV(ChartBackground, {
+          variant: backgroundVariant
+        }, void 0, false), /* @__PURE__ */ jsxDEV(ReferenceLine, {
+          stroke: "var(--border)"
+        }, void 0, false), children, isLoading && /* @__PURE__ */ jsxDEV(LoadingBar, {
+          chartId,
+          onShimmerExit
+        }, void 0, false)]
+      }, void 0, true)]
+    }, void 0, true)
+  }, void 0, false);
+};
+const Bar = ({
+  dataKey,
+  variant = "default",
+  radius,
+  animationType,
+  isClickable = false,
+  enableHoverHighlight = false,
+  glowing = false,
+  bufferBar = false,
+  barProps
+}) => {
+  const {
+    config,
+    isStacked,
+    isHorizontal,
+    isLoading,
+    barRadius: defaultRadius,
+    animationType: defaultAnimation,
+    introStartedAt,
+    dataLength,
+    selectedDataKey,
+    selectDataKey,
+    isMouseInChart
+  } = useBarChart();
+  const id = useId().replaceAll(":", "");
+  const shouldReduceMotion = useReducedMotion();
+  if (isLoading) {
+    return null;
+  }
+  const resolvedRadius = radius ?? defaultRadius;
+  const isSelected = selectedDataKey === dataKey;
+  const revealType = shouldReduceMotion ? "none" : animationType ?? defaultAnimation;
+  const customBarProps = {
+    id,
+    dataKey,
+    variant,
+    barRadius: resolvedRadius,
+    glowing,
+    bufferBar,
+    isClickable,
+    enableHoverHighlight,
+    isMouseInChart,
+    isHorizontal,
+    introStartedAt,
+    selectedDataKey,
+    dataLength,
+    onClick: () => {
+      if (!isClickable) {
+        return;
+      }
+      selectDataKey(isSelected ? null : dataKey);
+    }
+  };
+  return /* @__PURE__ */ jsxDEV(Fragment, {
+    children: [/* @__PURE__ */ jsxDEV(Bar$1, {
+      activeBar: (props) => (
+        // The active (hovered) bar must never re-run the grow-in animation
+        /* @__PURE__ */ jsxDEV(CustomBar, {
+          ...props,
+          ...customBarProps,
+          animationType: "none"
+        }, void 0, false)
+      ),
+      dataKey,
+      fill: `url(#${id}-colors-${dataKey})`,
+      isAnimationActive: false,
+      radius: resolvedRadius,
+      shape: (props_0) => /* @__PURE__ */ jsxDEV(CustomBar, {
+        ...props_0,
+        ...customBarProps,
+        animationType: revealType
+      }, void 0, false),
+      stackId: isStacked ? STACK_ID : void 0,
+      style: isClickable || enableHoverHighlight ? {
+        cursor: "pointer"
+      } : void 0,
+      ...barProps
+    }, void 0, false), /* @__PURE__ */ jsxDEV("defs", {
+      children: [/* @__PURE__ */ jsxDEV(ColorGradient, {
+        config,
+        dataKey,
+        id
+      }, void 0, false), variant === "hatched" && /* @__PURE__ */ jsxDEV(HatchedPattern, {
+        dataKey,
+        id
+      }, void 0, false), variant === "duotone" && /* @__PURE__ */ jsxDEV(DuotonePattern, {
+        config,
+        dataKey,
+        id
+      }, void 0, false), variant === "duotone-reverse" && /* @__PURE__ */ jsxDEV(DuotoneReversePattern, {
+        config,
+        dataKey,
+        id
+      }, void 0, false), variant === "gradient" && /* @__PURE__ */ jsxDEV(GradientPattern, {
+        dataKey,
+        id
+      }, void 0, false), variant === "stripped" && /* @__PURE__ */ jsxDEV(StrippedPattern, {
+        dataKey,
+        id
+      }, void 0, false), bufferBar && /* @__PURE__ */ jsxDEV(BufferHatchedPattern, {
+        dataKey,
+        id
+      }, void 0, false), glowing && /* @__PURE__ */ jsxDEV(GlowFilter, {
+        dataKey,
+        id
+      }, void 0, false)]
+    }, void 0, true)]
+  }, void 0, true);
+};
+const XAxis = ({
+  tickLine = false,
+  axisLine = false,
+  tickMargin = 8,
+  minTickGap = 8,
+  type,
+  ...props
+}) => {
+  const {
+    isLoading,
+    isHorizontal
+  } = useBarChart();
+  if (isLoading) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxDEV(XAxis$1, {
+    axisLine,
+    minTickGap,
+    tickLine,
+    tickMargin,
+    type: type ?? (isHorizontal ? "number" : "category"),
+    ...props
+  }, void 0, false);
+};
+const Tooltip = (t0) => {
+  const $ = c(7);
+  const {
+    variant,
+    roundness,
+    defaultIndex
+  } = t0;
+  const {
+    isLoading,
+    selectedDataKey
+  } = useBarChart();
+  if (isLoading) {
+    return null;
+  }
+  let t1;
+  if ($[0] !== roundness || $[1] !== selectedDataKey || $[2] !== variant) {
+    t1 = /* @__PURE__ */ jsxDEV(ChartTooltipContent, {
+      roundness,
+      selected: selectedDataKey,
+      variant
+    }, void 0, false);
+    $[0] = roundness;
+    $[1] = selectedDataKey;
+    $[2] = variant;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+  let t2;
+  if ($[4] !== defaultIndex || $[5] !== t1) {
+    t2 = /* @__PURE__ */ jsxDEV(ChartTooltip, {
+      content: t1,
+      cursor: false,
+      defaultIndex
+    }, void 0, false);
+    $[4] = defaultIndex;
+    $[5] = t1;
+    $[6] = t2;
+  } else {
+    t2 = $[6];
+  }
+  return t2;
+};
+const CustomBar = (props) => {
+  const {
+    x = 0,
+    y = 0,
+    width = 0,
+    height = 0,
+    id,
+    dataKey,
+    variant,
+    barRadius,
+    glowing,
+    bufferBar,
+    isClickable,
+    enableHoverHighlight,
+    isMouseInChart,
+    isHorizontal = false,
+    animationType = "none",
+    introStartedAt = 0,
+    selectedDataKey,
+    isActive,
+    dataLength = 0,
+    onClick
+  } = props;
+  const index = typeof props.index === "number" ? props.index : -1;
+  const isLastBar = bufferBar && dataLength > 0 && index === dataLength - 1;
+  const isStripped = variant === "stripped";
+  const grow = getBarGrowAnimation(animationType, index, dataLength, isHorizontal, introStartedAt);
+  const fill = isLastBar ? `url(#${id}-buffer-hatched-${dataKey})` : getVariantFill(variant, id, dataKey);
+  const filter = glowing ? `url(#${id}-bar-glow-${dataKey})` : void 0;
+  const fillOpacity = getBarOpacity({
+    isClickable,
+    selectedDataKey,
+    dataKey,
+    enableHoverHighlight,
+    isMouseInChart,
+    isActive
+  });
+  const cursorStyle = isClickable || enableHoverHighlight ? {
+    cursor: "pointer"
+  } : void 0;
+  const radius = isStripped ? [barRadius, barRadius, 0, 0] : barRadius;
+  const visibleBar = /* @__PURE__ */ jsxDEV(Fragment, {
+    children: [/* @__PURE__ */ jsxDEV(Rectangle, {
+      fill,
+      filter,
+      height: Math.max(0, height - 3),
+      opacity: fillOpacity,
+      radius,
+      stroke: isLastBar ? `url(#${id}-colors-${dataKey})` : void 0,
+      strokeWidth: isLastBar ? 1 : void 0,
+      width,
+      x,
+      y
+    }, void 0, false), isStripped && /* @__PURE__ */ jsxDEV(Rectangle, {
+      fill: `url(#${id}-colors-${dataKey})`,
+      height: 2,
+      radius: 1,
+      width,
+      x,
+      y: y - 4
+    }, void 0, false)]
+  }, void 0, true);
+  return /* @__PURE__ */ jsxDEV("g", {
+    onClick,
+    style: cursorStyle,
+    children: [/* @__PURE__ */ jsxDEV(Rectangle, {
+      ...props,
+      fill: "transparent"
+    }, void 0, false), grow ? /* @__PURE__ */ jsxDEV(motion.g, {
+      animate: grow.animate,
+      initial: grow.initial,
+      style: grow.style,
+      transition: grow.transition,
+      children: visibleBar
+    }, void 0, false) : visibleBar]
+  }, void 0, true);
+};
+const getBarGrowAnimation = (animationType, index, dataLength, isHorizontal, introStartedAt) => {
+  if (animationType === "none" || index < 0 || dataLength <= 0) {
+    return null;
+  }
+  const lastIndex = dataLength - 1;
+  const center = lastIndex / 2;
+  let step;
+  switch (animationType) {
+    case "center-out": {
+      step = Math.abs(index - center);
+      break;
+    }
+    case "edges-in": {
+      step = center - Math.abs(index - center);
+      break;
+    }
+    case "right-to-left": {
+      step = lastIndex - index;
+      break;
+    }
+    default: {
+      step = index;
+    }
+  }
+  const startMs = step * BAR_STAGGER * 1e3;
+  const durationMs = BAR_GROW_DURATION * 1e3;
+  const endMs = startMs + durationMs;
+  const elapsed = Date.now() - introStartedAt;
+  if (elapsed >= endMs) {
+    return null;
+  }
+  const from = elapsed <= startMs ? 0 : (elapsed - startMs) / durationMs;
+  const transition = {
+    duration: (endMs - Math.max(elapsed, startMs)) / 1e3,
+    ease: REVEAL_EASE,
+    delay: Math.max(0, startMs - elapsed) / 1e3
+  };
+  return isHorizontal ? {
+    initial: {
+      scaleX: from
+    },
+    animate: {
+      scaleX: 1
+    },
+    transition,
+    style: {
+      originX: 0
+    }
+  } : {
+    initial: {
+      scaleY: from
+    },
+    animate: {
+      scaleY: 1
+    },
+    transition,
+    style: {
+      originY: 1
+    }
+  };
+};
+const getVariantFill = (variant, id, dataKey) => {
+  switch (variant) {
+    case "duotone": {
+      return `url(#${id}-duotone-${dataKey})`;
+    }
+    case "duotone-reverse": {
+      return `url(#${id}-duotone-reverse-${dataKey})`;
+    }
+    case "gradient": {
+      return `url(#${id}-gradient-${dataKey})`;
+    }
+    case "hatched": {
+      return `url(#${id}-hatched-${dataKey})`;
+    }
+    case "stripped": {
+      return `url(#${id}-stripped-${dataKey})`;
+    }
+    default: {
+      return `url(#${id}-colors-${dataKey})`;
+    }
+  }
+};
+const getBarOpacity = ({
+  isClickable,
+  selectedDataKey,
+  dataKey,
+  enableHoverHighlight,
+  isMouseInChart,
+  isActive
+}) => {
+  const isSelectedDataKey = selectedDataKey === null || selectedDataKey === dataKey;
+  const clickOpacity = isClickable && selectedDataKey !== null ? isSelectedDataKey ? 1 : 0.3 : 1;
+  if (enableHoverHighlight && isMouseInChart) {
+    return isActive ? clickOpacity : clickOpacity * 0.3;
+  }
+  return clickOpacity;
+};
+const ColorGradient = (t0) => {
+  const $ = c(16);
+  const {
+    id,
+    dataKey,
+    config
+  } = t0;
+  let t1;
+  let t2;
+  let t3;
+  let t4;
+  let t5;
+  let t6;
+  if ($[0] !== config || $[1] !== dataKey || $[2] !== id) {
+    const colorsCount = getColorsCount(config[dataKey] ?? {});
+    t1 = `${id}-colors-${dataKey}`;
+    t2 = "0";
+    t3 = "0";
+    t4 = "0";
+    t5 = "1";
+    t6 = colorsCount === 1 ? /* @__PURE__ */ jsxDEV(Fragment, {
+      children: [/* @__PURE__ */ jsxDEV("stop", {
+        offset: "0%",
+        stopColor: `var(--color-${dataKey}-0)`
+      }, void 0, false), /* @__PURE__ */ jsxDEV("stop", {
+        offset: "100%",
+        stopColor: `var(--color-${dataKey}-0)`
+      }, void 0, false)]
+    }, void 0, true) : Array.from({
+      length: colorsCount
+    }, (_, index) => {
+      const offset = `${index / (colorsCount - 1) * 100}%`;
+      return /* @__PURE__ */ jsxDEV("stop", {
+        offset,
+        stopColor: `var(--color-${dataKey}-${index}, var(--color-${dataKey}-0))`
+      }, offset, false);
+    });
+    $[0] = config;
+    $[1] = dataKey;
+    $[2] = id;
+    $[3] = t1;
+    $[4] = t2;
+    $[5] = t3;
+    $[6] = t4;
+    $[7] = t5;
+    $[8] = t6;
+  } else {
+    t1 = $[3];
+    t2 = $[4];
+    t3 = $[5];
+    t4 = $[6];
+    t5 = $[7];
+    t6 = $[8];
+  }
+  let t7;
+  if ($[9] !== t1 || $[10] !== t2 || $[11] !== t3 || $[12] !== t4 || $[13] !== t5 || $[14] !== t6) {
+    t7 = /* @__PURE__ */ jsxDEV("linearGradient", {
+      id: t1,
+      x1: t2,
+      x2: t3,
+      y1: t4,
+      y2: t5,
+      children: t6
+    }, void 0, false);
+    $[9] = t1;
+    $[10] = t2;
+    $[11] = t3;
+    $[12] = t4;
+    $[13] = t5;
+    $[14] = t6;
+    $[15] = t7;
+  } else {
+    t7 = $[15];
+  }
+  return t7;
+};
+const HatchedPattern = (t0) => {
+  const $ = c(19);
+  const {
+    id,
+    dataKey
+  } = t0;
+  const t1 = `${id}-hatched-mask-pattern`;
+  let t2;
+  let t3;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t2 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: "white",
+      fillOpacity: 0.3,
+      height: "5",
+      width: "5"
+    }, void 0, false);
+    t3 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: "white",
+      fillOpacity: 1,
+      height: "5",
+      width: "1.5"
+    }, void 0, false);
+    $[0] = t2;
+    $[1] = t3;
+  } else {
+    t2 = $[0];
+    t3 = $[1];
+  }
+  let t4;
+  if ($[2] !== t1) {
+    t4 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "5",
+      id: t1,
+      patternTransform: "rotate(-45)",
+      patternUnits: "userSpaceOnUse",
+      width: "5",
+      x: "0",
+      y: "0",
+      children: [t2, t3]
+    }, void 0, true);
+    $[2] = t1;
+    $[3] = t4;
+  } else {
+    t4 = $[3];
+  }
+  const t5 = `${id}-hatched-mask-${dataKey}`;
+  const t6 = `url(#${id}-hatched-mask-pattern)`;
+  let t7;
+  if ($[4] !== t6) {
+    t7 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: t6,
+      height: "100%",
+      width: "100%"
+    }, void 0, false);
+    $[4] = t6;
+    $[5] = t7;
+  } else {
+    t7 = $[5];
+  }
+  let t8;
+  if ($[6] !== t5 || $[7] !== t7) {
+    t8 = /* @__PURE__ */ jsxDEV("mask", {
+      id: t5,
+      children: t7
+    }, void 0, false);
+    $[6] = t5;
+    $[7] = t7;
+    $[8] = t8;
+  } else {
+    t8 = $[8];
+  }
+  const t9 = `${id}-hatched-${dataKey}`;
+  const t10 = `url(#${id}-colors-${dataKey})`;
+  const t11 = `url(#${id}-hatched-mask-${dataKey})`;
+  let t12;
+  if ($[9] !== t10 || $[10] !== t11) {
+    t12 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: t10,
+      height: "100%",
+      mask: t11,
+      width: "100%"
+    }, void 0, false);
+    $[9] = t10;
+    $[10] = t11;
+    $[11] = t12;
+  } else {
+    t12 = $[11];
+  }
+  let t13;
+  if ($[12] !== t12 || $[13] !== t9) {
+    t13 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "100%",
+      id: t9,
+      patternUnits: "userSpaceOnUse",
+      width: "100%",
+      children: t12
+    }, void 0, false);
+    $[12] = t12;
+    $[13] = t9;
+    $[14] = t13;
+  } else {
+    t13 = $[14];
+  }
+  let t14;
+  if ($[15] !== t13 || $[16] !== t4 || $[17] !== t8) {
+    t14 = /* @__PURE__ */ jsxDEV(Fragment, {
+      children: [t4, t8, t13]
+    }, void 0, true);
+    $[15] = t13;
+    $[16] = t4;
+    $[17] = t8;
+    $[18] = t14;
+  } else {
+    t14 = $[18];
+  }
+  return t14;
+};
+const BufferHatchedPattern = (t0) => {
+  const $ = c(19);
+  const {
+    id,
+    dataKey
+  } = t0;
+  const t1 = `${id}-buffer-hatched-mask-pattern`;
+  let t2;
+  let t3;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t2 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: "black",
+      fillOpacity: 0,
+      height: "5",
+      width: "5"
+    }, void 0, false);
+    t3 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: "white",
+      fillOpacity: 1,
+      height: "5",
+      width: "1"
+    }, void 0, false);
+    $[0] = t2;
+    $[1] = t3;
+  } else {
+    t2 = $[0];
+    t3 = $[1];
+  }
+  let t4;
+  if ($[2] !== t1) {
+    t4 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "5",
+      id: t1,
+      patternTransform: "rotate(-45)",
+      patternUnits: "userSpaceOnUse",
+      width: "5",
+      x: "0",
+      y: "0",
+      children: [t2, t3]
+    }, void 0, true);
+    $[2] = t1;
+    $[3] = t4;
+  } else {
+    t4 = $[3];
+  }
+  const t5 = `${id}-buffer-hatched-mask-${dataKey}`;
+  const t6 = `url(#${id}-buffer-hatched-mask-pattern)`;
+  let t7;
+  if ($[4] !== t6) {
+    t7 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: t6,
+      height: "100%",
+      width: "100%"
+    }, void 0, false);
+    $[4] = t6;
+    $[5] = t7;
+  } else {
+    t7 = $[5];
+  }
+  let t8;
+  if ($[6] !== t5 || $[7] !== t7) {
+    t8 = /* @__PURE__ */ jsxDEV("mask", {
+      id: t5,
+      children: t7
+    }, void 0, false);
+    $[6] = t5;
+    $[7] = t7;
+    $[8] = t8;
+  } else {
+    t8 = $[8];
+  }
+  const t9 = `${id}-buffer-hatched-${dataKey}`;
+  const t10 = `url(#${id}-colors-${dataKey})`;
+  const t11 = `url(#${id}-buffer-hatched-mask-${dataKey})`;
+  let t12;
+  if ($[9] !== t10 || $[10] !== t11) {
+    t12 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: t10,
+      height: "100%",
+      mask: t11,
+      width: "100%"
+    }, void 0, false);
+    $[9] = t10;
+    $[10] = t11;
+    $[11] = t12;
+  } else {
+    t12 = $[11];
+  }
+  let t13;
+  if ($[12] !== t12 || $[13] !== t9) {
+    t13 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "100%",
+      id: t9,
+      patternUnits: "userSpaceOnUse",
+      width: "100%",
+      children: t12
+    }, void 0, false);
+    $[12] = t12;
+    $[13] = t9;
+    $[14] = t13;
+  } else {
+    t13 = $[14];
+  }
+  let t14;
+  if ($[15] !== t13 || $[16] !== t4 || $[17] !== t8) {
+    t14 = /* @__PURE__ */ jsxDEV(Fragment, {
+      children: [t4, t8, t13]
+    }, void 0, true);
+    $[15] = t13;
+    $[16] = t4;
+    $[17] = t8;
+    $[18] = t14;
+  } else {
+    t14 = $[18];
+  }
+  return t14;
+};
+const DuotonePattern = (t0) => {
+  const $ = c(39);
+  const {
+    id,
+    dataKey,
+    config
+  } = t0;
+  let t1;
+  let t2;
+  let t3;
+  let t4;
+  let t5;
+  let t6;
+  let t7;
+  let t8;
+  if ($[0] !== config || $[1] !== dataKey || $[2] !== id) {
+    const colorsCount = getColorsCount(config[dataKey] ?? {});
+    const t92 = `${id}-duotone-mask-gradient-${dataKey}`;
+    let t102;
+    let t112;
+    if ($[11] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+      t102 = /* @__PURE__ */ jsxDEV("stop", {
+        offset: "50%",
+        stopColor: "white",
+        stopOpacity: 0.4
+      }, void 0, false);
+      t112 = /* @__PURE__ */ jsxDEV("stop", {
+        offset: "50%",
+        stopColor: "white",
+        stopOpacity: 1
+      }, void 0, false);
+      $[11] = t102;
+      $[12] = t112;
+    } else {
+      t102 = $[11];
+      t112 = $[12];
+    }
+    if ($[13] !== t92) {
+      t8 = /* @__PURE__ */ jsxDEV("linearGradient", {
+        gradientUnits: "objectBoundingBox",
+        id: t92,
+        x1: "0",
+        x2: "1",
+        y1: "0",
+        y2: "0",
+        children: [t102, t112]
+      }, void 0, true);
+      $[13] = t92;
+      $[14] = t8;
+    } else {
+      t8 = $[14];
+    }
+    t1 = "objectBoundingBox";
+    t2 = `${id}-duotone-colors-${dataKey}`;
+    t3 = "0";
+    t4 = "0";
+    t5 = "0";
+    t6 = "1";
+    t7 = colorsCount === 1 ? /* @__PURE__ */ jsxDEV(Fragment, {
+      children: [/* @__PURE__ */ jsxDEV("stop", {
+        offset: "0%",
+        stopColor: `var(--color-${dataKey}-0)`
+      }, void 0, false), /* @__PURE__ */ jsxDEV("stop", {
+        offset: "100%",
+        stopColor: `var(--color-${dataKey}-0)`
+      }, void 0, false)]
+    }, void 0, true) : Array.from({
+      length: colorsCount
+    }, (_, index) => {
+      const offset = `${index / (colorsCount - 1) * 100}%`;
+      return /* @__PURE__ */ jsxDEV("stop", {
+        offset,
+        stopColor: `var(--color-${dataKey}-${index}, var(--color-${dataKey}-0))`
+      }, offset, false);
+    });
+    $[0] = config;
+    $[1] = dataKey;
+    $[2] = id;
+    $[3] = t1;
+    $[4] = t2;
+    $[5] = t3;
+    $[6] = t4;
+    $[7] = t5;
+    $[8] = t6;
+    $[9] = t7;
+    $[10] = t8;
+  } else {
+    t1 = $[3];
+    t2 = $[4];
+    t3 = $[5];
+    t4 = $[6];
+    t5 = $[7];
+    t6 = $[8];
+    t7 = $[9];
+    t8 = $[10];
+  }
+  let t9;
+  if ($[15] !== t1 || $[16] !== t2 || $[17] !== t3 || $[18] !== t4 || $[19] !== t5 || $[20] !== t6 || $[21] !== t7) {
+    t9 = /* @__PURE__ */ jsxDEV("linearGradient", {
+      gradientUnits: t1,
+      id: t2,
+      x1: t3,
+      x2: t4,
+      y1: t5,
+      y2: t6,
+      children: t7
+    }, void 0, false);
+    $[15] = t1;
+    $[16] = t2;
+    $[17] = t3;
+    $[18] = t4;
+    $[19] = t5;
+    $[20] = t6;
+    $[21] = t7;
+    $[22] = t9;
+  } else {
+    t9 = $[22];
+  }
+  const t10 = `${id}-duotone-mask-${dataKey}`;
+  const t11 = `url(#${id}-duotone-mask-gradient-${dataKey})`;
+  let t12;
+  if ($[23] !== t11) {
+    t12 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: t11,
+      height: "1",
+      width: "1",
+      x: "0",
+      y: "0"
+    }, void 0, false);
+    $[23] = t11;
+    $[24] = t12;
+  } else {
+    t12 = $[24];
+  }
+  let t13;
+  if ($[25] !== t10 || $[26] !== t12) {
+    t13 = /* @__PURE__ */ jsxDEV("mask", {
+      id: t10,
+      maskContentUnits: "objectBoundingBox",
+      children: t12
+    }, void 0, false);
+    $[25] = t10;
+    $[26] = t12;
+    $[27] = t13;
+  } else {
+    t13 = $[27];
+  }
+  const t14 = `${id}-duotone-${dataKey}`;
+  const t15 = `url(#${id}-duotone-colors-${dataKey})`;
+  const t16 = `url(#${id}-duotone-mask-${dataKey})`;
+  let t17;
+  if ($[28] !== t15 || $[29] !== t16) {
+    t17 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: t15,
+      height: "1",
+      mask: t16,
+      width: "1",
+      x: "0",
+      y: "0"
+    }, void 0, false);
+    $[28] = t15;
+    $[29] = t16;
+    $[30] = t17;
+  } else {
+    t17 = $[30];
+  }
+  let t18;
+  if ($[31] !== t14 || $[32] !== t17) {
+    t18 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "1",
+      id: t14,
+      patternContentUnits: "objectBoundingBox",
+      patternUnits: "objectBoundingBox",
+      width: "1",
+      children: t17
+    }, void 0, false);
+    $[31] = t14;
+    $[32] = t17;
+    $[33] = t18;
+  } else {
+    t18 = $[33];
+  }
+  let t19;
+  if ($[34] !== t13 || $[35] !== t18 || $[36] !== t8 || $[37] !== t9) {
+    t19 = /* @__PURE__ */ jsxDEV(Fragment, {
+      children: [t8, t9, t13, t18]
+    }, void 0, true);
+    $[34] = t13;
+    $[35] = t18;
+    $[36] = t8;
+    $[37] = t9;
+    $[38] = t19;
+  } else {
+    t19 = $[38];
+  }
+  return t19;
+};
+const DuotoneReversePattern = (t0) => {
+  const $ = c(39);
+  const {
+    id,
+    dataKey,
+    config
+  } = t0;
+  let t1;
+  let t2;
+  let t3;
+  let t4;
+  let t5;
+  let t6;
+  let t7;
+  let t8;
+  if ($[0] !== config || $[1] !== dataKey || $[2] !== id) {
+    const colorsCount = getColorsCount(config[dataKey] ?? {});
+    const t92 = `${id}-duotone-reverse-mask-gradient-${dataKey}`;
+    let t102;
+    let t112;
+    if ($[11] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+      t102 = /* @__PURE__ */ jsxDEV("stop", {
+        offset: "50%",
+        stopColor: "white",
+        stopOpacity: 1
+      }, void 0, false);
+      t112 = /* @__PURE__ */ jsxDEV("stop", {
+        offset: "50%",
+        stopColor: "white",
+        stopOpacity: 0.4
+      }, void 0, false);
+      $[11] = t102;
+      $[12] = t112;
+    } else {
+      t102 = $[11];
+      t112 = $[12];
+    }
+    if ($[13] !== t92) {
+      t8 = /* @__PURE__ */ jsxDEV("linearGradient", {
+        gradientUnits: "objectBoundingBox",
+        id: t92,
+        x1: "0",
+        x2: "1",
+        y1: "0",
+        y2: "0",
+        children: [t102, t112]
+      }, void 0, true);
+      $[13] = t92;
+      $[14] = t8;
+    } else {
+      t8 = $[14];
+    }
+    t1 = "objectBoundingBox";
+    t2 = `${id}-duotone-reverse-colors-${dataKey}`;
+    t3 = "0";
+    t4 = "0";
+    t5 = "0";
+    t6 = "1";
+    t7 = colorsCount === 1 ? /* @__PURE__ */ jsxDEV(Fragment, {
+      children: [/* @__PURE__ */ jsxDEV("stop", {
+        offset: "0%",
+        stopColor: `var(--color-${dataKey}-0)`
+      }, void 0, false), /* @__PURE__ */ jsxDEV("stop", {
+        offset: "100%",
+        stopColor: `var(--color-${dataKey}-0)`
+      }, void 0, false)]
+    }, void 0, true) : Array.from({
+      length: colorsCount
+    }, (_, index) => {
+      const offset = `${index / (colorsCount - 1) * 100}%`;
+      return /* @__PURE__ */ jsxDEV("stop", {
+        offset,
+        stopColor: `var(--color-${dataKey}-${index}, var(--color-${dataKey}-0))`
+      }, offset, false);
+    });
+    $[0] = config;
+    $[1] = dataKey;
+    $[2] = id;
+    $[3] = t1;
+    $[4] = t2;
+    $[5] = t3;
+    $[6] = t4;
+    $[7] = t5;
+    $[8] = t6;
+    $[9] = t7;
+    $[10] = t8;
+  } else {
+    t1 = $[3];
+    t2 = $[4];
+    t3 = $[5];
+    t4 = $[6];
+    t5 = $[7];
+    t6 = $[8];
+    t7 = $[9];
+    t8 = $[10];
+  }
+  let t9;
+  if ($[15] !== t1 || $[16] !== t2 || $[17] !== t3 || $[18] !== t4 || $[19] !== t5 || $[20] !== t6 || $[21] !== t7) {
+    t9 = /* @__PURE__ */ jsxDEV("linearGradient", {
+      gradientUnits: t1,
+      id: t2,
+      x1: t3,
+      x2: t4,
+      y1: t5,
+      y2: t6,
+      children: t7
+    }, void 0, false);
+    $[15] = t1;
+    $[16] = t2;
+    $[17] = t3;
+    $[18] = t4;
+    $[19] = t5;
+    $[20] = t6;
+    $[21] = t7;
+    $[22] = t9;
+  } else {
+    t9 = $[22];
+  }
+  const t10 = `${id}-duotone-reverse-mask-${dataKey}`;
+  const t11 = `url(#${id}-duotone-reverse-mask-gradient-${dataKey})`;
+  let t12;
+  if ($[23] !== t11) {
+    t12 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: t11,
+      height: "1",
+      width: "1",
+      x: "0",
+      y: "0"
+    }, void 0, false);
+    $[23] = t11;
+    $[24] = t12;
+  } else {
+    t12 = $[24];
+  }
+  let t13;
+  if ($[25] !== t10 || $[26] !== t12) {
+    t13 = /* @__PURE__ */ jsxDEV("mask", {
+      id: t10,
+      maskContentUnits: "objectBoundingBox",
+      children: t12
+    }, void 0, false);
+    $[25] = t10;
+    $[26] = t12;
+    $[27] = t13;
+  } else {
+    t13 = $[27];
+  }
+  const t14 = `${id}-duotone-reverse-${dataKey}`;
+  const t15 = `url(#${id}-duotone-reverse-colors-${dataKey})`;
+  const t16 = `url(#${id}-duotone-reverse-mask-${dataKey})`;
+  let t17;
+  if ($[28] !== t15 || $[29] !== t16) {
+    t17 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: t15,
+      height: "1",
+      mask: t16,
+      width: "1",
+      x: "0",
+      y: "0"
+    }, void 0, false);
+    $[28] = t15;
+    $[29] = t16;
+    $[30] = t17;
+  } else {
+    t17 = $[30];
+  }
+  let t18;
+  if ($[31] !== t14 || $[32] !== t17) {
+    t18 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "1",
+      id: t14,
+      patternContentUnits: "objectBoundingBox",
+      patternUnits: "objectBoundingBox",
+      width: "1",
+      children: t17
+    }, void 0, false);
+    $[31] = t14;
+    $[32] = t17;
+    $[33] = t18;
+  } else {
+    t18 = $[33];
+  }
+  let t19;
+  if ($[34] !== t13 || $[35] !== t18 || $[36] !== t8 || $[37] !== t9) {
+    t19 = /* @__PURE__ */ jsxDEV(Fragment, {
+      children: [t8, t9, t13, t18]
+    }, void 0, true);
+    $[34] = t13;
+    $[35] = t18;
+    $[36] = t8;
+    $[37] = t9;
+    $[38] = t19;
+  } else {
+    t19 = $[38];
+  }
+  return t19;
+};
+const GradientPattern = (t0) => {
+  const $ = c(19);
+  const {
+    id,
+    dataKey
+  } = t0;
+  const t1 = `${id}-gradient-mask-gradient`;
+  let t2;
+  let t3;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t2 = /* @__PURE__ */ jsxDEV("stop", {
+      offset: "20%",
+      stopColor: "white",
+      stopOpacity: 1
+    }, void 0, false);
+    t3 = /* @__PURE__ */ jsxDEV("stop", {
+      offset: "90%",
+      stopColor: "white",
+      stopOpacity: 0
+    }, void 0, false);
+    $[0] = t2;
+    $[1] = t3;
+  } else {
+    t2 = $[0];
+    t3 = $[1];
+  }
+  let t4;
+  if ($[2] !== t1) {
+    t4 = /* @__PURE__ */ jsxDEV("linearGradient", {
+      id: t1,
+      x1: "0",
+      x2: "0",
+      y1: "0",
+      y2: "1",
+      children: [t2, t3]
+    }, void 0, true);
+    $[2] = t1;
+    $[3] = t4;
+  } else {
+    t4 = $[3];
+  }
+  const t5 = `${id}-gradient-mask-${dataKey}`;
+  const t6 = `url(#${id}-gradient-mask-gradient)`;
+  let t7;
+  if ($[4] !== t6) {
+    t7 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: t6,
+      height: "100%",
+      width: "100%"
+    }, void 0, false);
+    $[4] = t6;
+    $[5] = t7;
+  } else {
+    t7 = $[5];
+  }
+  let t8;
+  if ($[6] !== t5 || $[7] !== t7) {
+    t8 = /* @__PURE__ */ jsxDEV("mask", {
+      id: t5,
+      children: t7
+    }, void 0, false);
+    $[6] = t5;
+    $[7] = t7;
+    $[8] = t8;
+  } else {
+    t8 = $[8];
+  }
+  const t9 = `${id}-gradient-${dataKey}`;
+  const t10 = `url(#${id}-colors-${dataKey})`;
+  const t11 = `url(#${id}-gradient-mask-${dataKey})`;
+  let t12;
+  if ($[9] !== t10 || $[10] !== t11) {
+    t12 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: t10,
+      height: "100%",
+      mask: t11,
+      width: "100%"
+    }, void 0, false);
+    $[9] = t10;
+    $[10] = t11;
+    $[11] = t12;
+  } else {
+    t12 = $[11];
+  }
+  let t13;
+  if ($[12] !== t12 || $[13] !== t9) {
+    t13 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "100%",
+      id: t9,
+      patternUnits: "userSpaceOnUse",
+      width: "100%",
+      children: t12
+    }, void 0, false);
+    $[12] = t12;
+    $[13] = t9;
+    $[14] = t13;
+  } else {
+    t13 = $[14];
+  }
+  let t14;
+  if ($[15] !== t13 || $[16] !== t4 || $[17] !== t8) {
+    t14 = /* @__PURE__ */ jsxDEV(Fragment, {
+      children: [t4, t8, t13]
+    }, void 0, true);
+    $[15] = t13;
+    $[16] = t4;
+    $[17] = t8;
+    $[18] = t14;
+  } else {
+    t14 = $[18];
+  }
+  return t14;
+};
+const StrippedPattern = (t0) => {
+  const $ = c(19);
+  const {
+    id,
+    dataKey
+  } = t0;
+  const t1 = `${id}-stripped-mask-gradient`;
+  let t2;
+  let t3;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t2 = /* @__PURE__ */ jsxDEV("stop", {
+      offset: "0%",
+      stopColor: "white",
+      stopOpacity: 0.2
+    }, void 0, false);
+    t3 = /* @__PURE__ */ jsxDEV("stop", {
+      offset: "100%",
+      stopColor: "white",
+      stopOpacity: 0.2
+    }, void 0, false);
+    $[0] = t2;
+    $[1] = t3;
+  } else {
+    t2 = $[0];
+    t3 = $[1];
+  }
+  let t4;
+  if ($[2] !== t1) {
+    t4 = /* @__PURE__ */ jsxDEV("linearGradient", {
+      id: t1,
+      x1: "0",
+      x2: "0",
+      y1: "0",
+      y2: "1",
+      children: [t2, t3]
+    }, void 0, true);
+    $[2] = t1;
+    $[3] = t4;
+  } else {
+    t4 = $[3];
+  }
+  const t5 = `${id}-stripped-mask-${dataKey}`;
+  const t6 = `url(#${id}-stripped-mask-gradient)`;
+  let t7;
+  if ($[4] !== t6) {
+    t7 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: t6,
+      height: "100%",
+      width: "100%"
+    }, void 0, false);
+    $[4] = t6;
+    $[5] = t7;
+  } else {
+    t7 = $[5];
+  }
+  let t8;
+  if ($[6] !== t5 || $[7] !== t7) {
+    t8 = /* @__PURE__ */ jsxDEV("mask", {
+      id: t5,
+      children: t7
+    }, void 0, false);
+    $[6] = t5;
+    $[7] = t7;
+    $[8] = t8;
+  } else {
+    t8 = $[8];
+  }
+  const t9 = `${id}-stripped-${dataKey}`;
+  const t10 = `url(#${id}-colors-${dataKey})`;
+  const t11 = `url(#${id}-stripped-mask-${dataKey})`;
+  let t12;
+  if ($[9] !== t10 || $[10] !== t11) {
+    t12 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: t10,
+      height: "100%",
+      mask: t11,
+      width: "100%"
+    }, void 0, false);
+    $[9] = t10;
+    $[10] = t11;
+    $[11] = t12;
+  } else {
+    t12 = $[11];
+  }
+  let t13;
+  if ($[12] !== t12 || $[13] !== t9) {
+    t13 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "100%",
+      id: t9,
+      patternUnits: "userSpaceOnUse",
+      width: "100%",
+      children: t12
+    }, void 0, false);
+    $[12] = t12;
+    $[13] = t9;
+    $[14] = t13;
+  } else {
+    t13 = $[14];
+  }
+  let t14;
+  if ($[15] !== t13 || $[16] !== t4 || $[17] !== t8) {
+    t14 = /* @__PURE__ */ jsxDEV(Fragment, {
+      children: [t4, t8, t13]
+    }, void 0, true);
+    $[15] = t13;
+    $[16] = t4;
+    $[17] = t8;
+    $[18] = t14;
+  } else {
+    t14 = $[18];
+  }
+  return t14;
+};
+const GlowFilter = (t0) => {
+  const $ = c(5);
+  const {
+    id,
+    dataKey
+  } = t0;
+  const t1 = `${id}-bar-glow-${dataKey}`;
+  let t2;
+  let t3;
+  let t4;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t2 = /* @__PURE__ */ jsxDEV("feGaussianBlur", {
+      in: "SourceGraphic",
+      result: "blur",
+      stdDeviation: "8"
+    }, void 0, false);
+    t3 = /* @__PURE__ */ jsxDEV("feColorMatrix", {
+      in: "blur",
+      result: "glow",
+      type: "matrix",
+      values: "1 0 0 0 0\n                0 1 0 0 0\n                0 0 1 0 0\n                0 0 0 0.5 0"
+    }, void 0, false);
+    t4 = /* @__PURE__ */ jsxDEV("feMerge", {
+      children: [/* @__PURE__ */ jsxDEV("feMergeNode", {
+        in: "glow"
+      }, void 0, false), /* @__PURE__ */ jsxDEV("feMergeNode", {
+        in: "SourceGraphic"
+      }, void 0, false)]
+    }, void 0, true);
+    $[0] = t2;
+    $[1] = t3;
+    $[2] = t4;
+  } else {
+    t2 = $[0];
+    t3 = $[1];
+    t4 = $[2];
+  }
+  let t5;
+  if ($[3] !== t1) {
+    t5 = /* @__PURE__ */ jsxDEV("filter", {
+      height: "300%",
+      id: t1,
+      width: "300%",
+      x: "-100%",
+      y: "-100%",
+      children: [t2, t3, t4]
+    }, void 0, true);
+    $[3] = t1;
+    $[4] = t5;
+  } else {
+    t5 = $[4];
+  }
+  return t5;
+};
+const generateEasedGradientStops = (steps = 17, minOpacity = 0.05, maxOpacity = 0.9) => Array.from({
+  length: steps
+}, (_, i) => {
+  const t = i / (steps - 1);
+  const eased = Math.sin(t * Math.PI) ** 2;
+  const opacity = minOpacity + eased * (maxOpacity - minOpacity);
+  return {
+    offset: `${(t * 100).toFixed(0)}%`,
+    opacity: Number(opacity.toFixed(3))
+  };
+});
+function useLoadingData(isLoading, t0) {
+  const $ = c(8);
+  const loadingBars = t0 === void 0 ? 12 : t0;
+  const [, setLoadingDataKey] = useState(false);
+  let t1;
+  if ($[0] !== isLoading || $[1] !== setLoadingDataKey) {
+    t1 = () => {
+      if (isLoading) {
+        setLoadingDataKey(_temp);
+      }
+    };
+    $[0] = isLoading;
+    $[1] = setLoadingDataKey;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  const onShimmerExit = t1;
+  let t2;
+  if ($[3] !== loadingBars) {
+    t2 = getLoadingData(loadingBars, 20, 80);
+    $[3] = loadingBars;
+    $[4] = t2;
+  } else {
+    t2 = $[4];
+  }
+  const loadingData = t2;
+  let t3;
+  if ($[5] !== loadingData || $[6] !== onShimmerExit) {
+    t3 = {
+      loadingData,
+      onShimmerExit
+    };
+    $[5] = loadingData;
+    $[6] = onShimmerExit;
+    $[7] = t3;
+  } else {
+    t3 = $[7];
+  }
+  return t3;
+}
+function _temp(previous) {
+  return !previous;
+}
+const LoadingBar = (t0) => {
+  const $ = c(8);
+  const {
+    chartId,
+    onShimmerExit
+  } = t0;
+  const t1 = `url(#${chartId}-loading-mask)`;
+  let t2;
+  if ($[0] !== t1) {
+    t2 = /* @__PURE__ */ jsxDEV(Bar$1, {
+      dataKey: LOADING_BAR_DATA_KEY,
+      fill: "currentColor",
+      fillOpacity: 0.15,
+      isAnimationActive: false,
+      legendType: "none",
+      radius: DEFAULT_BAR_RADIUS,
+      style: {
+        mask: t1
+      }
+    }, void 0, false);
+    $[0] = t1;
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+  let t3;
+  if ($[2] !== chartId || $[3] !== onShimmerExit) {
+    t3 = /* @__PURE__ */ jsxDEV("defs", {
+      children: /* @__PURE__ */ jsxDEV(LoadingBarPattern, {
+        chartId,
+        onShimmerExit
+      }, void 0, false)
+    }, void 0, false);
+    $[2] = chartId;
+    $[3] = onShimmerExit;
+    $[4] = t3;
+  } else {
+    t3 = $[4];
+  }
+  let t4;
+  if ($[5] !== t2 || $[6] !== t3) {
+    t4 = /* @__PURE__ */ jsxDEV(Fragment, {
+      children: [t2, t3]
+    }, void 0, true);
+    $[5] = t2;
+    $[6] = t3;
+    $[7] = t4;
+  } else {
+    t4 = $[7];
+  }
+  return t4;
+};
+const LoadingBarPattern = (t0) => {
+  const $ = c(23);
+  const {
+    chartId,
+    onShimmerExit
+  } = t0;
+  const gradientStops = generateEasedGradientStops();
+  const lastXRef = useRef(-1);
+  const t1 = `${chartId}-loading-mask-gradient`;
+  const t2 = "0";
+  const t3 = "1";
+  const t4 = "0";
+  const t5 = "0";
+  const t6 = gradientStops.map(_temp2);
+  let t7;
+  if ($[0] !== t1 || $[1] !== t6) {
+    t7 = /* @__PURE__ */ jsxDEV("linearGradient", {
+      id: t1,
+      x1: t2,
+      x2: t3,
+      y1: t4,
+      y2: t5,
+      children: t6
+    }, void 0, false);
+    $[0] = t1;
+    $[1] = t6;
+    $[2] = t7;
+  } else {
+    t7 = $[2];
+  }
+  const t8 = `${chartId}-loading-mask-pattern`;
+  let t9;
+  if ($[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t9 = {
+      x: 2
+    };
+    $[3] = t9;
+  } else {
+    t9 = $[3];
+  }
+  const t10 = `url(#${chartId}-loading-mask-gradient)`;
+  let t11;
+  if ($[4] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t11 = {
+      x: -1
+    };
+    $[4] = t11;
+  } else {
+    t11 = $[4];
+  }
+  let t12;
+  if ($[5] !== onShimmerExit) {
+    t12 = (latest) => {
+      const xValue = typeof latest.x === "number" ? latest.x : -1;
+      const lastX = lastXRef.current;
+      if (xValue >= 1 && lastX < 1) {
+        onShimmerExit();
+      }
+      lastXRef.current = xValue;
+    };
+    $[5] = onShimmerExit;
+    $[6] = t12;
+  } else {
+    t12 = $[6];
+  }
+  let t13;
+  if ($[7] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t13 = {
+      duration: LOADING_ANIMATION_DURATION / 1e3,
+      ease: "linear",
+      repeat: Infinity,
+      repeatType: "loop"
+    };
+    $[7] = t13;
+  } else {
+    t13 = $[7];
+  }
+  let t14;
+  if ($[8] !== t10 || $[9] !== t12) {
+    t14 = /* @__PURE__ */ jsxDEV(motion.rect, {
+      animate: t9,
+      fill: t10,
+      height: "1",
+      initial: t11,
+      onUpdate: t12,
+      transition: t13,
+      width: "1",
+      y: "0"
+    }, void 0, false);
+    $[8] = t10;
+    $[9] = t12;
+    $[10] = t14;
+  } else {
+    t14 = $[10];
+  }
+  let t15;
+  if ($[11] !== t14 || $[12] !== t8) {
+    t15 = /* @__PURE__ */ jsxDEV("pattern", {
+      height: "1",
+      id: t8,
+      patternContentUnits: "objectBoundingBox",
+      patternTransform: "rotate(25)",
+      patternUnits: "objectBoundingBox",
+      width: 3,
+      x: "0",
+      y: "0",
+      children: t14
+    }, void 0, false);
+    $[11] = t14;
+    $[12] = t8;
+    $[13] = t15;
+  } else {
+    t15 = $[13];
+  }
+  const t16 = `${chartId}-loading-mask`;
+  const t17 = `url(#${chartId}-loading-mask-pattern)`;
+  let t18;
+  if ($[14] !== t17) {
+    t18 = /* @__PURE__ */ jsxDEV("rect", {
+      fill: t17,
+      height: "100%",
+      width: "100%"
+    }, void 0, false);
+    $[14] = t17;
+    $[15] = t18;
+  } else {
+    t18 = $[15];
+  }
+  let t19;
+  if ($[16] !== t16 || $[17] !== t18) {
+    t19 = /* @__PURE__ */ jsxDEV("mask", {
+      id: t16,
+      maskUnits: "userSpaceOnUse",
+      children: t18
+    }, void 0, false);
+    $[16] = t16;
+    $[17] = t18;
+    $[18] = t19;
+  } else {
+    t19 = $[18];
+  }
+  let t20;
+  if ($[19] !== t15 || $[20] !== t19 || $[21] !== t7) {
+    t20 = /* @__PURE__ */ jsxDEV(Fragment, {
+      children: [t7, t15, t19]
+    }, void 0, true);
+    $[19] = t15;
+    $[20] = t19;
+    $[21] = t7;
+    $[22] = t20;
+  } else {
+    t20 = $[22];
+  }
+  return t20;
+};
+function _temp2(t0) {
+  const {
+    offset,
+    opacity
+  } = t0;
+  return /* @__PURE__ */ jsxDEV("stop", {
+    offset,
+    stopColor: "white",
+    stopOpacity: opacity
+  }, offset, false);
+}
+
+export { Bar as B, EvilBarChart as E, Tooltip as T, XAxis as X };