@automattic/charts 0.57.0 → 0.59.0

package/dist/chunk-IU4DYUAV.js

@@ -1,120 +0,0 @@
-import {
-  withResponsive
-} from "./chunk-OP6PHB2U.js";
-import {
-  GlobalChartsContext,
-  GlobalChartsProvider,
-  useGlobalChartsContext
-} from "./chunk-32DH6JDF.js";
-import {
-  lightenHexColor,
-  normalizeColorToHex,
-  resolveCssVariable
-} from "./chunk-DAU3HNEG.js";
-
-// src/charts/geo-chart/geo-chart.tsx
-import { __ } from "@wordpress/i18n";
-import clsx from "clsx";
-import { useContext, useMemo } from "react";
-import { Chart } from "react-google-charts";
-
-// src/charts/geo-chart/geo-chart.module.scss
-var geo_chart_module_default = {
-  "container": "a8ccharts-JvcqOz"
-};
-
-// src/charts/geo-chart/geo-chart.tsx
-import { jsx as _jsx } from "react/jsx-runtime";
-var DEFAULT_FEATURE_FILL_COLOR = "#ffffff";
-var DEFAULT_BACKGROUND_COLOR = "#ffffff";
-var GeoChartInternal = ({
-  className,
-  data,
-  width,
-  height,
-  region = "world",
-  resolution = "countries",
-  renderPlaceholder
-}) => {
-  const {
-    getElementStyles,
-    theme: {
-      geoChart: {
-        featureFillColor
-      },
-      backgroundColor
-    }
-  } = useGlobalChartsContext();
-  const loadingPlaceholder = /* @__PURE__ */ _jsx("div", {
-    className: clsx("geo-chart", geo_chart_module_default.container, className),
-    style: {
-      width,
-      height
-    },
-    children: renderPlaceholder ? renderPlaceholder() : __("Loading map", "jetpack-charts")
-  });
-  const fullColorHex = getElementStyles({
-    index: 0
-  }).color;
-  const lightColorHex = lightenHexColor(fullColorHex, 0.8);
-  const backgroundColorHex = normalizeColorToHex(backgroundColor, null, resolveCssVariable) || DEFAULT_BACKGROUND_COLOR;
-  const defaultFillColorHex = normalizeColorToHex(featureFillColor, null, resolveCssVariable) || DEFAULT_FEATURE_FILL_COLOR;
-  const hasHtmlTooltips = useMemo(() => data.length > 0 && data[0].some((col) => typeof col === "object" && col !== null && "role" in col && col.role === "tooltip" && "p" in col && typeof col.p === "object" && col.p !== null && "html" in col.p && col.p.html === true), [data]);
-  const options = useMemo(() => ({
-    ...region !== "world" && {
-      region
-    },
-    ...resolution !== "countries" && {
-      resolution
-    },
-    colorAxis: {
-      colors: [lightColorHex, fullColorHex]
-    },
-    backgroundColor: backgroundColorHex,
-    datalessRegionColor: defaultFillColorHex,
-    defaultColor: defaultFillColorHex,
-    tooltip: {
-      trigger: "focus",
-      isHtml: hasHtmlTooltips
-    },
-    legend: "none",
-    keepAspectRatio: true
-  }), [region, resolution, lightColorHex, fullColorHex, backgroundColorHex, defaultFillColorHex, hasHtmlTooltips]);
-  return /* @__PURE__ */ _jsx("div", {
-    className: clsx("geo-chart", geo_chart_module_default.container, className),
-    style: {
-      width,
-      height,
-      backgroundColor
-    },
-    children: /* @__PURE__ */ _jsx(Chart, {
-      chartType: "GeoChart",
-      width,
-      height,
-      data,
-      options,
-      loader: loadingPlaceholder
-    })
-  });
-};
-var GeoChartWithProvider = (props) => {
-  const existingContext = useContext(GlobalChartsContext);
-  if (existingContext) {
-    return /* @__PURE__ */ _jsx(GeoChartInternal, {
-      ...props
-    });
-  }
-  return /* @__PURE__ */ _jsx(GlobalChartsProvider, {
-    children: /* @__PURE__ */ _jsx(GeoChartInternal, {
-      ...props
-    })
-  });
-};
-GeoChartWithProvider.displayName = "GeoChart";
-var GeoChartResponsive = withResponsive(GeoChartWithProvider);
-
-export {
-  GeoChartWithProvider,
-  GeoChartResponsive
-};
-//# sourceMappingURL=chunk-IU4DYUAV.js.map

package/dist/chunk-IU4DYUAV.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/charts/geo-chart/geo-chart.tsx","../src/charts/geo-chart/geo-chart.module.scss"],"sourcesContent":["/**\n * External dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport clsx from 'clsx';\nimport { useContext, useMemo } from 'react';\nimport { Chart } from 'react-google-charts';\n/**\n * Internal dependencies\n */\nimport { GlobalChartsContext, GlobalChartsProvider, useGlobalChartsContext } from '../../providers';\nimport { lightenHexColor, normalizeColorToHex } from '../../utils/color-utils';\nimport { resolveCssVariable } from '../../utils/resolve-css-var';\nimport { withResponsive } from '../private/with-responsive';\nimport styles from './geo-chart.module.scss';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst DEFAULT_FEATURE_FILL_COLOR = '#ffffff';\nconst DEFAULT_BACKGROUND_COLOR = '#ffffff';\n\n/**\n * Renders a geographical chart using Google Charts GeoChart to visualize data.\n *\n * Supports the full Google Charts data format including custom tooltips, formatted values,\n * and multiple data columns for maximum flexibility.\n *\n * Locations can be identified by full name (e.g., 'United States', 'California') or codes\n * (e.g., 'US', 'US-CA'). Full names are recommended for better readability in tooltips.\n *\n * @param props                   - The props for the GeoChart component\n * @param props.data              - Data in Google Charts format (array of arrays with headers)\n * @param props.width             - Width of the chart in pixels\n * @param props.height            - Height of the chart in pixels\n * @param props.region            - Region to display ('world', 'US', or ISO 3166-1 alpha-2 code)\n * @param props.resolution        - Resolution level ('countries', 'provinces', or 'metros')\n * @param props.className         - Additional CSS class name for the chart container\n * @param props.renderPlaceholder - Optional render function for the loading placeholder\n * @return A React component displaying an interactive map with data visualization\n */\nconst GeoChartInternal = ({\n  className,\n  data,\n  width,\n  height,\n  region = 'world',\n  resolution = 'countries',\n  renderPlaceholder\n}) => {\n  const {\n    getElementStyles,\n    theme: {\n      geoChart: {\n        featureFillColor\n      },\n      backgroundColor\n    }\n  } = useGlobalChartsContext();\n\n  // Render loading placeholder\n  const loadingPlaceholder = /*#__PURE__*/_jsx(\"div\", {\n    className: clsx('geo-chart', styles.container, className),\n    style: {\n      width,\n      height\n    },\n    children: renderPlaceholder ? renderPlaceholder() : __('Loading map', 'jetpack-charts')\n  });\n\n  // Google charts doesn't accept CSS variables, so we need to convert them to hex colors\n  const fullColorHex = getElementStyles({\n    index: 0\n  }).color;\n  const lightColorHex = lightenHexColor(fullColorHex, 0.8);\n  // Use normalizeColorToHex to ensure HSL/RGB values from CSS variables are converted to hex\n  const backgroundColorHex = normalizeColorToHex(backgroundColor, null, resolveCssVariable) || DEFAULT_BACKGROUND_COLOR;\n  const defaultFillColorHex = normalizeColorToHex(featureFillColor, null, resolveCssVariable) || DEFAULT_FEATURE_FILL_COLOR;\n\n  // Check if data has HTML tooltips (column with role: 'tooltip' and p.html: true)\n  const hasHtmlTooltips = useMemo(() => data.length > 0 && data[0].some(col => typeof col === 'object' && col !== null && 'role' in col && col.role === 'tooltip' && 'p' in col && typeof col.p === 'object' && col.p !== null && 'html' in col.p && col.p.html === true), [data]);\n  const options = useMemo(() => ({\n    ...(region !== 'world' && {\n      region\n    }),\n    ...(resolution !== 'countries' && {\n      resolution\n    }),\n    colorAxis: {\n      colors: [lightColorHex, fullColorHex]\n    },\n    backgroundColor: backgroundColorHex,\n    datalessRegionColor: defaultFillColorHex,\n    defaultColor: defaultFillColorHex,\n    tooltip: {\n      trigger: 'focus',\n      isHtml: hasHtmlTooltips\n    },\n    legend: 'none',\n    keepAspectRatio: true\n  }), [region, resolution, lightColorHex, fullColorHex, backgroundColorHex, defaultFillColorHex, hasHtmlTooltips]);\n  return /*#__PURE__*/_jsx(\"div\", {\n    className: clsx('geo-chart', styles.container, className),\n    style: {\n      width,\n      height,\n      backgroundColor\n    },\n    children: /*#__PURE__*/_jsx(Chart, {\n      chartType: \"GeoChart\",\n      width: width,\n      height: height,\n      data: data,\n      options: options,\n      loader: loadingPlaceholder\n    })\n  });\n};\nconst GeoChartWithProvider = props => {\n  const existingContext = useContext(GlobalChartsContext);\n\n  // If we're already in a GlobalChartsProvider context, don't create a new one\n  if (existingContext) {\n    return /*#__PURE__*/_jsx(GeoChartInternal, {\n      ...props\n    });\n  }\n\n  // Otherwise, create our own GlobalChartsProvider\n  return /*#__PURE__*/_jsx(GlobalChartsProvider, {\n    children: /*#__PURE__*/_jsx(GeoChartInternal, {\n      ...props\n    })\n  });\n};\nGeoChartWithProvider.displayName = 'GeoChart';\nconst GeoChartResponsive = withResponsive(GeoChartWithProvider);\nexport { GeoChartResponsive as default, GeoChartWithProvider as GeoChartUnresponsive };","import 'css-chunk:src/charts/geo-chart/geo-chart.module.scss';export default {\n  \"container\": \"a8ccharts-JvcqOz\"\n};"],"mappings":";;;;;;;;;;;;;;;AAGA,SAAS,UAAU;AACnB,OAAO,UAAU;AACjB,SAAS,YAAY,eAAe;AACpC,SAAS,aAAa;;;ACNwC,IAAO,2BAAQ;AAAA,EAC3E,aAAa;AACf;;;ADaA,SAAS,OAAO,YAAY;AAC5B,IAAM,6BAA6B;AACnC,IAAM,2BAA2B;AAqBjC,IAAM,mBAAmB,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT,aAAa;AAAA,EACb;AACF,MAAM;AACJ,QAAM;AAAA,IACJ;AAAA,IACA,OAAO;AAAA,MACL,UAAU;AAAA,QACR;AAAA,MACF;AAAA,MACA;AAAA,IACF;AAAA,EACF,IAAI,uBAAuB;AAG3B,QAAM,qBAAkC,qBAAK,OAAO;AAAA,IAClD,WAAW,KAAK,aAAa,yBAAO,WAAW,SAAS;AAAA,IACxD,OAAO;AAAA,MACL;AAAA,MACA;AAAA,IACF;AAAA,IACA,UAAU,oBAAoB,kBAAkB,IAAI,GAAG,eAAe,gBAAgB;AAAA,EACxF,CAAC;AAGD,QAAM,eAAe,iBAAiB;AAAA,IACpC,OAAO;AAAA,EACT,CAAC,EAAE;AACH,QAAM,gBAAgB,gBAAgB,cAAc,GAAG;AAEvD,QAAM,qBAAqB,oBAAoB,iBAAiB,MAAM,kBAAkB,KAAK;AAC7F,QAAM,sBAAsB,oBAAoB,kBAAkB,MAAM,kBAAkB,KAAK;AAG/F,QAAM,kBAAkB,QAAQ,MAAM,KAAK,SAAS,KAAK,KAAK,CAAC,EAAE,KAAK,SAAO,OAAO,QAAQ,YAAY,QAAQ,QAAQ,UAAU,OAAO,IAAI,SAAS,aAAa,OAAO,OAAO,OAAO,IAAI,MAAM,YAAY,IAAI,MAAM,QAAQ,UAAU,IAAI,KAAK,IAAI,EAAE,SAAS,IAAI,GAAG,CAAC,IAAI,CAAC;AAC/Q,QAAM,UAAU,QAAQ,OAAO;AAAA,IAC7B,GAAI,WAAW,WAAW;AAAA,MACxB;AAAA,IACF;AAAA,IACA,GAAI,eAAe,eAAe;AAAA,MAChC;AAAA,IACF;AAAA,IACA,WAAW;AAAA,MACT,QAAQ,CAAC,eAAe,YAAY;AAAA,IACtC;AAAA,IACA,iBAAiB;AAAA,IACjB,qBAAqB;AAAA,IACrB,cAAc;AAAA,IACd,SAAS;AAAA,MACP,SAAS;AAAA,MACT,QAAQ;AAAA,IACV;AAAA,IACA,QAAQ;AAAA,IACR,iBAAiB;AAAA,EACnB,IAAI,CAAC,QAAQ,YAAY,eAAe,cAAc,oBAAoB,qBAAqB,eAAe,CAAC;AAC/G,SAAoB,qBAAK,OAAO;AAAA,IAC9B,WAAW,KAAK,aAAa,yBAAO,WAAW,SAAS;AAAA,IACxD,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,UAAuB,qBAAK,OAAO;AAAA,MACjC,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,IACV,CAAC;AAAA,EACH,CAAC;AACH;AACA,IAAM,uBAAuB,WAAS;AACpC,QAAM,kBAAkB,WAAW,mBAAmB;AAGtD,MAAI,iBAAiB;AACnB,WAAoB,qBAAK,kBAAkB;AAAA,MACzC,GAAG;AAAA,IACL,CAAC;AAAA,EACH;AAGA,SAAoB,qBAAK,sBAAsB;AAAA,IAC7C,UAAuB,qBAAK,kBAAkB;AAAA,MAC5C,GAAG;AAAA,IACL,CAAC;AAAA,EACH,CAAC;AACH;AACA,qBAAqB,cAAc;AACnC,IAAM,qBAAqB,eAAe,oBAAoB;","names":[]}

package/dist/chunk-KXRWNFQJ.js

@@ -1,51 +0,0 @@
-// src/charts/private/radial-wipe-animation/radial-wipe-animation.tsx
-import { jsx as _jsx } from "react/jsx-runtime";
-function RadialWipeAnimation({
-  id,
-  radius,
-  innerRadius = 0,
-  durationMs = 1e3,
-  wipePercentage = 100,
-  direction = "clockwise",
-  startAngle = "-90deg"
-}) {
-  const strokeWidth = (radius - innerRadius) * 2 + // The stroke is centered on the circumference, so we need to double the width.
-  1;
-  const scaleY = direction === "clockwise" ? -1 : 1;
-  const isValidWipePercentage = 0 < wipePercentage && wipePercentage <= 100;
-  const animationDuration = `${// If wipePercentage is invalid, set animation duration to 0 to disable animation.
-  isValidWipePercentage ? durationMs * (100 / wipePercentage) : 0}ms`;
-  return /* @__PURE__ */ _jsx("mask", {
-    id,
-    children: /* @__PURE__ */ _jsx("circle", {
-      cx: 0,
-      cy: 0,
-      r: radius,
-      pathLength: "100",
-      fill: "white",
-      stroke: "black",
-      strokeWidth,
-      strokeDasharray: "100, 1000",
-      strokeDashoffset: "0",
-      style: {
-        transform: `rotate(${startAngle}) scaleY(${scaleY})`
-      },
-      children: /* @__PURE__ */ _jsx("animate", {
-        attributeName: "stroke-dashoffset",
-        from: "0",
-        to: "100.1",
-        dur: animationDuration,
-        fill: "freeze",
-        calcMode: "spline",
-        keySplines: "0.42 0 0.58 1;0 0 1 1",
-        keyTimes: `0;${wipePercentage / 100};1`
-      })
-    })
-  });
-}
-var radial_wipe_animation_default = RadialWipeAnimation;
-
-export {
-  radial_wipe_animation_default
-};
-//# sourceMappingURL=chunk-KXRWNFQJ.js.map

package/dist/chunk-KXRWNFQJ.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/charts/private/radial-wipe-animation/radial-wipe-animation.tsx"],"sourcesContent":["import { jsx as _jsx } from \"react/jsx-runtime\";\n/**\n * This animation uses the SVG self-drawing technique (source: https://www.joshwcomeau.com/svg/friendly-introduction-to-svg/),\n * leveraging stroke-dasharray and stroke-dashoffset properties to create the effect.\n *\n * Here, we reverse the animation to \"un-draw\" the circle for the revealing / radial wipe effect:\n * - Initially, the entire circle is drawn with a white mask.\n * - The circle's border (stroke) is drawn with a black stroke, wide enough to cover the circle.\n * - The stroke is then \"un-drawn,\" creating the wipe animation.\n * - A white mask makes the area visible, while a black mask makes the area invisible.\n */\n\n/**\n * RadialWipeAnimationProps - SVG mask props that requires a radial wipe animation effect.\n *\n * @param {object}                            props                         - The properties object.\n * @param {string}                            props.id                      - The unique ID for the mask.\n * @param {number}                            props.radius                  - The outer radius of the radial wipe.\n * @param {number}                            [props.innerRadius=0]         - The inner radius of the radial wipe.\n * @param {number}                            [props.durationMs=1000]       - The duration of the animation in milliseconds.\n * @param {number}                            [props.wipePercentage=100]    - The percentage of the wipe animation to complete.\n * @param {'clockwise' | 'counter-clockwise'} [props.direction='clockwise'] - The direction of the wipe animation.\n * @param {Angle}                             [props.startAngle='-90deg']   - The starting angle of the wipe animation.\n *\n * @return {JSX.Element} The radial wipe mask element.\n */\n\n/**\n * Renders a SVG mask that creates a radial wipe animation effect.\n *\n * @param {RadialWipeAnimationProps} props - Component props\n * @return {JSX.Element} The rendered mask component\n */\nfunction RadialWipeAnimation({\n  id,\n  radius,\n  innerRadius = 0,\n  durationMs = 1000,\n  wipePercentage = 100,\n  direction = 'clockwise',\n  startAngle = '-90deg'\n}) {\n  const strokeWidth = (radius - innerRadius) * 2 +\n  // The stroke is centered on the circumference, so we need to double the width.\n  1; // Added 1 to prevent sub-pixel rendering issues.\n\n  const scaleY = direction === 'clockwise' ? -1 : 1;\n  const isValidWipePercentage = 0 < wipePercentage && wipePercentage <= 100;\n  const animationDuration = `${\n  // If wipePercentage is invalid, set animation duration to 0 to disable animation.\n  isValidWipePercentage ? durationMs * (100 / wipePercentage) : 0}ms`;\n  return /*#__PURE__*/_jsx(\"mask\", {\n    id: id,\n    children: /*#__PURE__*/_jsx(\"circle\", {\n      cx: 0,\n      cy: 0,\n      r: radius,\n      pathLength: \"100\",\n      fill: \"white\",\n      stroke: \"black\" // The stroke will be un-drawn, hence 'black' mask.\n      ,\n      strokeWidth: strokeWidth,\n      strokeDasharray: \"100, 1000\",\n      strokeDashoffset: \"0\",\n      style: {\n        transform: `rotate(${startAngle}) scaleY(${scaleY})`\n      },\n      children: /*#__PURE__*/_jsx(\"animate\", {\n        attributeName: \"stroke-dashoffset\",\n        from: \"0\",\n        to: \"100.1\",\n        dur: animationDuration,\n        fill: \"freeze\" // Same as CSS 'forwards' to retain the final state after animation.\n        ,\n        calcMode: \"spline\" // custom easing\n        ,\n        keySplines: \"0.42 0 0.58 1;0 0 1 1\" // ease-in-out ; linear (unimportant)\n        ,\n        keyTimes: `0;${wipePercentage / 100};1`\n      })\n    })\n  });\n}\nexport default RadialWipeAnimation;"],"mappings":";AAAA,SAAS,OAAO,YAAY;AAiC5B,SAAS,oBAAoB;AAAA,EAC3B;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,YAAY;AAAA,EACZ,aAAa;AACf,GAAG;AACD,QAAM,eAAe,SAAS,eAAe;AAAA,EAE7C;AAEA,QAAM,SAAS,cAAc,cAAc,KAAK;AAChD,QAAM,wBAAwB,IAAI,kBAAkB,kBAAkB;AACtE,QAAM,oBAAoB;AAAA,EAE1B,wBAAwB,cAAc,MAAM,kBAAkB,CAAC;AAC/D,SAAoB,qBAAK,QAAQ;AAAA,IAC/B;AAAA,IACA,UAAuB,qBAAK,UAAU;AAAA,MACpC,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,GAAG;AAAA,MACH,YAAY;AAAA,MACZ,MAAM;AAAA,MACN,QAAQ;AAAA,MAER;AAAA,MACA,iBAAiB;AAAA,MACjB,kBAAkB;AAAA,MAClB,OAAO;AAAA,QACL,WAAW,UAAU,UAAU,YAAY,MAAM;AAAA,MACnD;AAAA,MACA,UAAuB,qBAAK,WAAW;AAAA,QACrC,eAAe;AAAA,QACf,MAAM;AAAA,QACN,IAAI;AAAA,QACJ,KAAK;AAAA,QACL,MAAM;AAAA,QAEN,UAAU;AAAA,QAEV,YAAY;AAAA,QAEZ,UAAU,KAAK,iBAAiB,GAAG;AAAA,MACrC,CAAC;AAAA,IACH,CAAC;AAAA,EACH,CAAC;AACH;AACA,IAAO,gCAAQ;","names":[]}

package/dist/chunk-OP6PHB2U.js

@@ -1,81 +0,0 @@
-// src/charts/private/with-responsive/with-responsive.tsx
-import { useParentSize } from "@visx/responsive";
-
-// src/charts/private/with-responsive/with-responsive.module.scss
-var with_responsive_module_default = {
-  "container": "a8ccharts-GSKfBD"
-};
-
-// src/charts/private/with-responsive/with-responsive.tsx
-import { jsx as _jsx } from "react/jsx-runtime";
-var useResponsiveDimensions = ({
-  resizeDebounceTime = 300,
-  maxWidth = 1200,
-  aspectRatio
-}) => {
-  const {
-    parentRef,
-    width: parentWidth,
-    height: parentHeight
-  } = useParentSize({
-    debounceTime: resizeDebounceTime,
-    enableDebounceLeadingCall: true
-  });
-  const containerWidth = parentWidth > 0 ? Math.min(parentWidth, maxWidth) : 0;
-  const containerHeight = aspectRatio !== void 0 ? containerWidth * aspectRatio : parentHeight;
-  return {
-    parentRef,
-    width: containerWidth,
-    height: containerHeight,
-    /**
-     * Whether an aspectRatio was provided. Used to determine container
-     * height styling: 'auto' when true (height derived from width),
-     * '100%' when false (fill parent container).
-     */
-    hasAspectRatio: aspectRatio !== void 0
-  };
-};
-function withResponsive(WrappedComponent) {
-  return function ResponsiveChart({
-    resizeDebounceTime = 300,
-    maxWidth = 1200,
-    aspectRatio,
-    size,
-    width,
-    height,
-    ...chartProps
-  }) {
-    const {
-      parentRef,
-      width: measuredWidth,
-      height: measuredHeight,
-      hasAspectRatio
-    } = useResponsiveDimensions({
-      resizeDebounceTime,
-      maxWidth,
-      aspectRatio
-    });
-    const effectiveWidth = measuredWidth || width || 0;
-    const effectiveHeight = measuredHeight || height || 0;
-    const defaultHeight = hasAspectRatio ? "auto" : "100%";
-    return /* @__PURE__ */ _jsx("div", {
-      ref: parentRef,
-      className: with_responsive_module_default.container,
-      style: {
-        width: width ?? "100%",
-        height: height ?? defaultHeight
-      },
-      children: /* @__PURE__ */ _jsx(WrappedComponent, {
-        width: effectiveWidth,
-        height: effectiveHeight,
-        size,
-        ...chartProps
-      })
-    });
-  };
-}
-
-export {
-  withResponsive
-};
-//# sourceMappingURL=chunk-OP6PHB2U.js.map

package/dist/chunk-OP6PHB2U.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/charts/private/with-responsive/with-responsive.tsx","../src/charts/private/with-responsive/with-responsive.module.scss"],"sourcesContent":["import { useParentSize } from '@visx/responsive';\nimport styles from './with-responsive.module.scss';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useResponsiveDimensions = ({\n  resizeDebounceTime = 300,\n  maxWidth = 1200,\n  aspectRatio\n}) => {\n  const {\n    parentRef,\n    width: parentWidth,\n    height: parentHeight\n  } = useParentSize({\n    debounceTime: resizeDebounceTime,\n    enableDebounceLeadingCall: true\n  });\n  const containerWidth = parentWidth > 0 ? Math.min(parentWidth, maxWidth) : 0;\n  const containerHeight = aspectRatio !== undefined ? containerWidth * aspectRatio : parentHeight;\n  return {\n    parentRef,\n    width: containerWidth,\n    height: containerHeight,\n    /**\n     * Whether an aspectRatio was provided. Used to determine container\n     * height styling: 'auto' when true (height derived from width),\n     * '100%' when false (fill parent container).\n     */\n    hasAspectRatio: aspectRatio !== undefined\n  };\n};\n\n/**\n * A higher-order component that provides responsive dimensions\n * to the wrapped chart component using useParentSize from `@visx/responsive`.\n *\n * @param WrappedComponent - The chart component to be wrapped.\n * @return A functional component that renders the wrapped component with responsive dimensions.\n */\nexport function withResponsive(\n// 'options' is excluded so that each chart can define its own options type\nWrappedComponent) {\n  return function ResponsiveChart({\n    resizeDebounceTime = 300,\n    maxWidth = 1200,\n    aspectRatio,\n    size,\n    width,\n    height,\n    ...chartProps\n  }) {\n    const {\n      parentRef,\n      width: measuredWidth,\n      height: measuredHeight,\n      hasAspectRatio\n    } = useResponsiveDimensions({\n      resizeDebounceTime,\n      maxWidth,\n      aspectRatio\n    });\n\n    // Use measured dimensions, but fall back to explicit width/height props if measurement returns 0\n    // (e.g., during initial render or in test environments without DOM measurement).\n    // Do not use size here — size controls chart element dimensions (e.g. pie diameter), not container dimensions.\n    const effectiveWidth = measuredWidth || width || 0;\n    const effectiveHeight = measuredHeight || height || 0;\n    const defaultHeight = hasAspectRatio ? 'auto' : '100%';\n    return /*#__PURE__*/_jsx(\"div\", {\n      ref: parentRef,\n      className: styles.container,\n      style: {\n        width: width ?? '100%',\n        height: height ?? defaultHeight\n      },\n      children: /*#__PURE__*/_jsx(WrappedComponent, {\n        width: effectiveWidth,\n        height: effectiveHeight,\n        size: size,\n        ...chartProps\n      })\n    });\n  };\n}","import 'css-chunk:src/charts/private/with-responsive/with-responsive.module.scss';export default {\n  \"container\": \"a8ccharts-GSKfBD\"\n};"],"mappings":";AAAA,SAAS,qBAAqB;;;ACAoD,IAAO,iCAAQ;AAAA,EAC/F,aAAa;AACf;;;ADAA,SAAS,OAAO,YAAY;AAC5B,IAAM,0BAA0B,CAAC;AAAA,EAC/B,qBAAqB;AAAA,EACrB,WAAW;AAAA,EACX;AACF,MAAM;AACJ,QAAM;AAAA,IACJ;AAAA,IACA,OAAO;AAAA,IACP,QAAQ;AAAA,EACV,IAAI,cAAc;AAAA,IAChB,cAAc;AAAA,IACd,2BAA2B;AAAA,EAC7B,CAAC;AACD,QAAM,iBAAiB,cAAc,IAAI,KAAK,IAAI,aAAa,QAAQ,IAAI;AAC3E,QAAM,kBAAkB,gBAAgB,SAAY,iBAAiB,cAAc;AACnF,SAAO;AAAA,IACL;AAAA,IACA,OAAO;AAAA,IACP,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMR,gBAAgB,gBAAgB;AAAA,EAClC;AACF;AASO,SAAS,eAEhB,kBAAkB;AAChB,SAAO,SAAS,gBAAgB;AAAA,IAC9B,qBAAqB;AAAA,IACrB,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GAAG;AACD,UAAM;AAAA,MACJ;AAAA,MACA,OAAO;AAAA,MACP,QAAQ;AAAA,MACR;AAAA,IACF,IAAI,wBAAwB;AAAA,MAC1B;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAKD,UAAM,iBAAiB,iBAAiB,SAAS;AACjD,UAAM,kBAAkB,kBAAkB,UAAU;AACpD,UAAM,gBAAgB,iBAAiB,SAAS;AAChD,WAAoB,qBAAK,OAAO;AAAA,MAC9B,KAAK;AAAA,MACL,WAAW,+BAAO;AAAA,MAClB,OAAO;AAAA,QACL,OAAO,SAAS;AAAA,QAChB,QAAQ,UAAU;AAAA,MACpB;AAAA,MACA,UAAuB,qBAAK,kBAAkB;AAAA,QAC5C,OAAO;AAAA,QACP,QAAQ;AAAA,QACR;AAAA,QACA,GAAG;AAAA,MACL,CAAC;AAAA,IACH,CAAC;AAAA,EACH;AACF;","names":[]}

package/dist/chunk-PXLEMUGJ.js

@@ -1,165 +0,0 @@
-import {
-  LineChart
-} from "./chunk-WLODYNLB.js";
-import {
-  withResponsive
-} from "./chunk-OP6PHB2U.js";
-import {
-  useGlobalChartsTheme
-} from "./chunk-32DH6JDF.js";
-
-// src/charts/sparkline/sparkline.tsx
-import clsx from "clsx";
-import { useMemo, forwardRef } from "react";
-
-// src/charts/sparkline/sparkline.module.scss
-var sparkline_module_default = {
-  "sparkline": "a8ccharts-o-3Z8B",
-  "sparkline--empty": "a8ccharts-CbLbcd"
-};
-
-// src/charts/sparkline/sparkline.tsx
-import { jsx as _jsx } from "react/jsx-runtime";
-var DEFAULT_WIDTH = 100;
-var DEFAULT_HEIGHT = 40;
-var transformToSeriesData = (data, color, strokeWidth) => {
-  const baseDate = new Date(2e3, 0, 1);
-  return [{
-    label: "sparkline",
-    data: data.map((value, index) => ({
-      date: new Date(baseDate.getTime() + index * 864e5),
-      // Add days
-      value
-    })),
-    options: {
-      stroke: color,
-      seriesLineStyle: strokeWidth ? {
-        strokeWidth
-      } : void 0
-    }
-  }];
-};
-var SparklineComponent = /* @__PURE__ */ forwardRef(({
-  data,
-  width = DEFAULT_WIDTH,
-  height = DEFAULT_HEIGHT,
-  color,
-  strokeWidth: strokeWidthProp,
-  withGradientFill = true,
-  gradient,
-  className,
-  chartId,
-  margin: marginProp,
-  animation
-}, ref) => {
-  const theme = useGlobalChartsTheme();
-  const themeStrokeWidth = theme.sparkline?.strokeWidth ?? 1.5;
-  const strokeWidth = strokeWidthProp ?? themeStrokeWidth;
-  const seriesData = useMemo(() => {
-    if (!data || data.length === 0) {
-      return [];
-    }
-    return transformToSeriesData(data, color, strokeWidth);
-  }, [data, color, strokeWidth]);
-  const finalMargin = useMemo(() => {
-    const themeMargin = theme.sparkline?.margin ?? {
-      top: 2,
-      right: 2,
-      bottom: 2,
-      left: 2
-    };
-    const margin = marginProp ?? themeMargin;
-    return {
-      ...themeMargin,
-      ...margin
-    };
-  }, [marginProp, theme.sparkline?.margin]);
-  const seriesWithGradient = useMemo(() => {
-    if (!gradient || seriesData.length === 0) {
-      return seriesData;
-    }
-    return seriesData.map((series) => ({
-      ...series,
-      options: {
-        ...series.options,
-        gradient: {
-          from: gradient.from || color || "#000000",
-          to: gradient.to || "#ffffff",
-          fromOpacity: gradient.fromOpacity ?? 0.5,
-          toOpacity: gradient.toOpacity ?? 0
-        }
-      }
-    }));
-  }, [seriesData, gradient, color]);
-  if (!data || data.length === 0) {
-    return /* @__PURE__ */ _jsx("div", {
-      ref,
-      className: clsx("sparkline", sparkline_module_default.sparkline, sparkline_module_default["sparkline--empty"], className),
-      style: {
-        width,
-        height
-      }
-    });
-  }
-  if (data.length === 1) {
-    const cx = width / 2;
-    const cy = height / 2;
-    const resolvedColor = color || "#000000";
-    return /* @__PURE__ */ _jsx("div", {
-      ref,
-      className: clsx("sparkline", sparkline_module_default.sparkline, sparkline_module_default["sparkline--single-point"], className),
-      style: {
-        width,
-        height
-      },
-      children: /* @__PURE__ */ _jsx("svg", {
-        width,
-        height,
-        "aria-hidden": "true",
-        children: /* @__PURE__ */ _jsx("circle", {
-          cx,
-          cy,
-          r: strokeWidth * 1.5,
-          fill: resolvedColor
-        })
-      })
-    });
-  }
-  return /* @__PURE__ */ _jsx("div", {
-    ref,
-    className: clsx("sparkline", sparkline_module_default.sparkline, className),
-    children: /* @__PURE__ */ _jsx(LineChart, {
-      data: seriesWithGradient,
-      width,
-      height,
-      margin: finalMargin,
-      chartId,
-      withGradientFill,
-      withTooltips: false,
-      showLegend: false,
-      gridVisibility: "none",
-      options: {
-        axis: {
-          x: {
-            display: false
-          },
-          y: {
-            display: false
-          }
-        }
-      },
-      curveType: "monotone",
-      animation
-    })
-  });
-});
-SparklineComponent.displayName = "SparklineComponent";
-var SparklineUnresponsive = SparklineComponent;
-SparklineUnresponsive.displayName = "SparklineUnresponsive";
-var Sparkline = withResponsive(SparklineUnresponsive);
-
-export {
-  SparklineUnresponsive,
-  Sparkline
-};
-//# sourceMappingURL=chunk-PXLEMUGJ.js.map

package/dist/chunk-PXLEMUGJ.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/charts/sparkline/sparkline.tsx","../src/charts/sparkline/sparkline.module.scss"],"sourcesContent":["import clsx from 'clsx';\nimport { useMemo, forwardRef } from 'react';\nimport { useGlobalChartsTheme } from '../../providers';\nimport { LineChartUnresponsive } from '../line-chart';\nimport { withResponsive } from '../private/with-responsive';\nimport styles from './sparkline.module.scss';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst DEFAULT_WIDTH = 100;\nconst DEFAULT_HEIGHT = 40;\n\n/**\n * Transforms a simple number array into SeriesData format for LineChart.\n * Uses index-based dates to create a linear x-axis.\n *\n * @param data        - Array of numeric values to plot\n * @param color       - Optional color for the line stroke\n * @param strokeWidth - Optional stroke width for the line\n * @return SeriesData array suitable for LineChart\n */\nconst transformToSeriesData = (data, color, strokeWidth) => {\n  // Use a fixed base date and increment by index to create linear spacing\n  const baseDate = new Date(2000, 0, 1);\n  return [{\n    label: 'sparkline',\n    data: data.map((value, index) => ({\n      date: new Date(baseDate.getTime() + index * 86400000),\n      // Add days\n      value\n    })),\n    options: {\n      stroke: color,\n      seriesLineStyle: strokeWidth ? {\n        strokeWidth\n      } : undefined\n    }\n  }];\n};\nconst SparklineComponent = /*#__PURE__*/forwardRef(({\n  data,\n  width = DEFAULT_WIDTH,\n  height = DEFAULT_HEIGHT,\n  color,\n  strokeWidth: strokeWidthProp,\n  withGradientFill = true,\n  gradient,\n  className,\n  chartId,\n  margin: marginProp,\n  animation\n}, ref) => {\n  const theme = useGlobalChartsTheme();\n\n  // Get theme defaults for sparkline\n  const themeStrokeWidth = theme.sparkline?.strokeWidth ?? 1.5;\n\n  // Use prop values or fall back to theme defaults\n  const strokeWidth = strokeWidthProp ?? themeStrokeWidth;\n\n  // Transform number[] to SeriesData[] for LineChart\n  const seriesData = useMemo(() => {\n    if (!data || data.length === 0) {\n      return [];\n    }\n    return transformToSeriesData(data, color, strokeWidth);\n  }, [data, color, strokeWidth]);\n\n  // Merge margins with theme defaults\n  const finalMargin = useMemo(() => {\n    const themeMargin = theme.sparkline?.margin ?? {\n      top: 2,\n      right: 2,\n      bottom: 2,\n      left: 2\n    };\n    const margin = marginProp ?? themeMargin;\n    return {\n      ...themeMargin,\n      ...margin\n    };\n  }, [marginProp, theme.sparkline?.margin]);\n\n  // Build gradient options for the series if custom gradient is provided\n  // Note: This must be called before any early returns to follow React hooks rules\n  const seriesWithGradient = useMemo(() => {\n    if (!gradient || seriesData.length === 0) {\n      return seriesData;\n    }\n    return seriesData.map(series => ({\n      ...series,\n      options: {\n        ...series.options,\n        gradient: {\n          from: gradient.from || color || '#000000',\n          to: gradient.to || '#ffffff',\n          fromOpacity: gradient.fromOpacity ?? 0.5,\n          toOpacity: gradient.toOpacity ?? 0.0\n        }\n      }\n    }));\n  }, [seriesData, gradient, color]);\n\n  // Handle empty data\n  if (!data || data.length === 0) {\n    return /*#__PURE__*/_jsx(\"div\", {\n      ref: ref,\n      className: clsx('sparkline', styles.sparkline, styles['sparkline--empty'], className),\n      style: {\n        width,\n        height\n      }\n    });\n  }\n\n  // Handle single data point - render a simple dot\n  if (data.length === 1) {\n    const cx = width / 2;\n    const cy = height / 2;\n    const resolvedColor = color || '#000000';\n    return /*#__PURE__*/_jsx(\"div\", {\n      ref: ref,\n      className: clsx('sparkline', styles.sparkline, styles['sparkline--single-point'], className),\n      style: {\n        width,\n        height\n      },\n      children: /*#__PURE__*/_jsx(\"svg\", {\n        width: width,\n        height: height,\n        \"aria-hidden\": \"true\",\n        children: /*#__PURE__*/_jsx(\"circle\", {\n          cx: cx,\n          cy: cy,\n          r: strokeWidth * 1.5,\n          fill: resolvedColor\n        })\n      })\n    });\n  }\n  return /*#__PURE__*/_jsx(\"div\", {\n    ref: ref,\n    className: clsx('sparkline', styles.sparkline, className),\n    children: /*#__PURE__*/_jsx(LineChartUnresponsive, {\n      data: seriesWithGradient,\n      width: width,\n      height: height,\n      margin: finalMargin,\n      chartId: chartId,\n      withGradientFill: withGradientFill,\n      withTooltips: false,\n      showLegend: false,\n      gridVisibility: \"none\",\n      options: {\n        axis: {\n          x: {\n            display: false\n          },\n          y: {\n            display: false\n          }\n        }\n      },\n      curveType: \"monotone\",\n      animation: animation\n    })\n  });\n});\nSparklineComponent.displayName = 'SparklineComponent';\n\n/**\n * Sparkline - A minimal line chart for inline data visualization.\n *\n * Sparklines are compact charts designed to be embedded inline with text or\n * displayed in small spaces like table cells or dashboards. They show trends\n * without axes, labels, or other chart chrome.\n *\n * This component is built on top of LineChart with preconfigured settings\n * for minimal display (no axes, grid, tooltips, or legend).\n */\nconst SparklineUnresponsive = SparklineComponent;\nSparklineUnresponsive.displayName = 'SparklineUnresponsive';\n\n/**\n * Responsive Sparkline chart component\n */\nconst Sparkline = withResponsive(SparklineUnresponsive);\nexport { Sparkline as default, SparklineUnresponsive };","import 'css-chunk:src/charts/sparkline/sparkline.module.scss';export default {\n  \"sparkline\": \"a8ccharts-o-3Z8B\",\n  \"sparkline--empty\": \"a8ccharts-CbLbcd\"\n};"],"mappings":"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","names":[]}

package/dist/chunk-RCY6XLGU.cjs

@@ -1,63 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }// src/charts/private/chart-composition/chart-svg.tsx
-var _jsxruntime = require('react/jsx-runtime');
-var ChartSVG = ({
-  children
-}) => {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, {
-    children
-  });
-};
-ChartSVG.displayName = "Chart.SVG";
-
-// src/charts/private/chart-composition/chart-html.tsx
-
-var ChartHTML = ({
-  children
-}) => {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, {
-    children
-  });
-};
-ChartHTML.displayName = "Chart.HTML";
-
-// src/charts/private/chart-composition/use-chart-children.ts
-var _group = require('@visx/group');
-var _react = require('react');
-function useChartChildren(children, chartType) {
-  return _react.useMemo.call(void 0, () => {
-    const svg = [];
-    const html = [];
-    const other = [];
-    _react.Children.forEach(children, (child) => {
-      if (_react.isValidElement.call(void 0, child)) {
-        const childType = child.type;
-        const displayName = _optionalChain([childType, 'optionalAccess', _ => _.displayName]);
-        if (displayName === `${chartType}.SVG` || displayName === "Chart.SVG") {
-          if (_optionalChain([child, 'access', _2 => _2.props, 'optionalAccess', _3 => _3.children])) {
-            _react.Children.forEach(child.props.children, (svgChild) => {
-              svg.push(svgChild);
-            });
-          }
-        } else if (displayName === `${chartType}.HTML` || displayName === "Chart.HTML") {
-          if (_optionalChain([child, 'access', _4 => _4.props, 'optionalAccess', _5 => _5.children])) {
-            _react.Children.forEach(child.props.children, (htmlChild) => {
-              html.push(htmlChild);
-            });
-          }
-        } else if (child.type === _group.Group) {
-          svg.push(child);
-        } else {
-          other.push(child);
-        }
-      }
-    });
-    return { svgChildren: svg, htmlChildren: html, otherChildren: other };
-  }, [children, chartType]);
-}
-
-
-
-
-
-exports.ChartSVG = ChartSVG; exports.ChartHTML = ChartHTML; exports.useChartChildren = useChartChildren;
-//# sourceMappingURL=chunk-RCY6XLGU.cjs.map

package/dist/chunk-RCY6XLGU.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["/home/runner/work/jetpack/jetpack/projects/js-packages/charts/dist/chunk-RCY6XLGU.cjs","../src/charts/private/chart-composition/chart-svg.tsx","../src/charts/private/chart-composition/chart-html.tsx","../src/charts/private/chart-composition/use-chart-children.ts"],"names":["_jsx","_Fragment"],"mappings":"AAAA;ACAA,+CAAmD;AAU5C,IAAM,SAAA,EAAW,CAAC;AAAA,EACvB;AACF,CAAA,EAAA,GAAM;AAGJ,EAAA,uBAAoB,6BAAA,oBAAK,EAAW;AAAA,IAClC;AAAA,EACF,CAAC,CAAA;AACH,CAAA;AAGA,QAAA,CAAS,YAAA,EAAc,WAAA;ADXvB;AACA;AEXA;AAUO,IAAM,UAAA,EAAY,CAAC;AAAA,EACxB;AACF,CAAA,EAAA,GAAM;AAGJ,EAAA,uBAAoBA,6BAAAA,oBAAKC,EAAW;AAAA,IAClC;AAAA,EACF,CAAC,CAAA;AACH,CAAA;AAGA,SAAA,CAAU,YAAA,EAAc,YAAA;AFAxB;AACA;AGtBA,oCAAsB;AACtB,8BAAkD;AAkB3C,SAAS,gBAAA,CAAkB,QAAA,EAAqB,SAAA,EAAmC;AACzF,EAAA,OAAO,4BAAA,CAAS,EAAA,GAAM;AACrB,IAAA,MAAM,IAAA,EAAmB,CAAC,CAAA;AAC1B,IAAA,MAAM,KAAA,EAAoB,CAAC,CAAA;AAC3B,IAAA,MAAM,MAAA,EAAqB,CAAC,CAAA;AAE5B,IAAA,eAAA,CAAS,OAAA,CAAS,QAAA,EAAU,CAAA,KAAA,EAAA,GAAS;AACpC,MAAA,GAAA,CAAK,mCAAA,KAAsB,CAAA,EAAI;AAE9B,QAAA,MAAM,UAAA,EAAY,KAAA,CAAM,IAAA;AACxB,QAAA,MAAM,YAAA,kBAAc,SAAA,2BAAW,aAAA;AAG/B,QAAA,GAAA,CAAK,YAAA,IAAgB,CAAA,EAAA;AAEF,UAAA;AACC,YAAA;AACP,cAAA;AACT,YAAA;AACH,UAAA;AACW,QAAA;AAEO,UAAA;AACC,YAAA;AACN,cAAA;AACV,YAAA;AACH,UAAA;AACiB,QAAA;AAED,UAAA;AACV,QAAA;AACY,UAAA;AACnB,QAAA;AACD,MAAA;AACC,IAAA;AAEoB,IAAA;AACI,EAAA;AAC5B;AHD6B;AACA;AACA;AACA;AACA;AACA","file":"/home/runner/work/jetpack/jetpack/projects/js-packages/charts/dist/chunk-RCY6XLGU.cjs","sourcesContent":[null,"import { Fragment as _Fragment, jsx as _jsx } from \"react/jsx-runtime\";\n/**\n * Compound component for SVG children in charts.\n * This component serves as a marker for SVG content that should be rendered\n * inside the chart's SVG element. The actual rendering is handled by the parent chart.\n *\n * @param {PropsWithChildren} props          - Component props\n * @param {ReactNode}         props.children - Child elements to render inside the SVG\n * @return {JSX.Element} The children wrapped in a fragment\n */\nexport const ChartSVG = ({\n  children\n}) => {\n  // This component doesn't render directly - its children are extracted by the parent chart\n  // We just return the children as-is\n  return /*#__PURE__*/_jsx(_Fragment, {\n    children: children\n  });\n};\n\n// Set displayName for better debugging and type checking\nChartSVG.displayName = 'Chart.SVG';","import { Fragment as _Fragment, jsx as _jsx } from \"react/jsx-runtime\";\n/**\n * Compound component for HTML children in charts.\n * This component serves as a marker for HTML content that should be rendered\n * outside the chart's SVG element. The actual rendering is handled by the parent chart.\n *\n * @param {PropsWithChildren} props          - Component props\n * @param {ReactNode}         props.children - Child elements to render outside the SVG\n * @return {JSX.Element} The children wrapped in a fragment\n */\nexport const ChartHTML = ({\n  children\n}) => {\n  // This component doesn't render directly - its children are extracted by the parent chart\n  // We just return the children as-is\n  return /*#__PURE__*/_jsx(_Fragment, {\n    children: children\n  });\n};\n\n// Set displayName for better debugging and type checking\nChartHTML.displayName = 'Chart.HTML';","import { Group } from '@visx/group';\nimport { useMemo, Children, isValidElement } from 'react';\nimport type { ReactNode } from 'react';\n\ninterface ChartChildren {\n\tsvgChildren: ReactNode[];\n\thtmlChildren: ReactNode[];\n\totherChildren: ReactNode[];\n}\n\n/**\n * Custom hook to process and categorize chart children for composition API.\n * Extracts children from compound components (Chart.SVG, Chart.HTML) and\n * maintains backward compatibility with legacy Group components.\n *\n * @param {ReactNode} children  - The children prop from the chart component\n * @param {string}    chartType - The type of chart (e.g., 'PieChart', 'BarChart')\n * @return {ChartChildren} Categorized children for rendering\n */\nexport function useChartChildren( children: ReactNode, chartType: string ): ChartChildren {\n\treturn useMemo( () => {\n\t\tconst svg: ReactNode[] = [];\n\t\tconst html: ReactNode[] = [];\n\t\tconst other: ReactNode[] = [];\n\n\t\tChildren.forEach( children, child => {\n\t\t\tif ( isValidElement( child ) ) {\n\t\t\t\t// Check displayName for compound components\n\t\t\t\tconst childType = child.type as { displayName?: string };\n\t\t\t\tconst displayName = childType?.displayName;\n\n\t\t\t\t// Handle chart-specific compound components (e.g., PieChart.SVG)\n\t\t\t\tif ( displayName === `${ chartType }.SVG` || displayName === 'Chart.SVG' ) {\n\t\t\t\t\t// Extract children from Chart.SVG with safety checks\n\t\t\t\t\tif ( child.props?.children ) {\n\t\t\t\t\t\tChildren.forEach( child.props.children, svgChild => {\n\t\t\t\t\t\t\tsvg.push( svgChild );\n\t\t\t\t\t\t} );\n\t\t\t\t\t}\n\t\t\t\t} else if ( displayName === `${ chartType }.HTML` || displayName === 'Chart.HTML' ) {\n\t\t\t\t\t// Extract children from Chart.HTML with safety checks\n\t\t\t\t\tif ( child.props?.children ) {\n\t\t\t\t\t\tChildren.forEach( child.props.children, htmlChild => {\n\t\t\t\t\t\t\thtml.push( htmlChild );\n\t\t\t\t\t\t} );\n\t\t\t\t\t}\n\t\t\t\t} else if ( child.type === Group ) {\n\t\t\t\t\t// Legacy support: still check for Group type for backward compatibility\n\t\t\t\t\tsvg.push( child );\n\t\t\t\t} else {\n\t\t\t\t\tother.push( child );\n\t\t\t\t}\n\t\t\t}\n\t\t} );\n\n\t\treturn { svgChildren: svg, htmlChildren: html, otherChildren: other };\n\t}, [ children, chartType ] );\n}\n"]}