@automattic/charts 0.56.2 → 0.56.4

package/dist/chunk-MFRS2PEY.cjs

@@ -1,121 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var _chunkNW3RUYK2cjs = require('./chunk-NW3RUYK2.cjs');
-
-
-
-
-var _chunkTVV7ZI7Ccjs = require('./chunk-TVV7ZI7C.cjs');
-
-
-
-
-var _chunkZVGEDXDPcjs = require('./chunk-ZVGEDXDP.cjs');
-
-// src/charts/geo-chart/geo-chart.tsx
-var _i18n = require('@wordpress/i18n');
-var _clsx = require('clsx'); var _clsx2 = _interopRequireDefault(_clsx);
-var _react = require('react');
-var _reactgooglecharts = require('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
-var _jsxruntime = require('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
-    }
-  } = _chunkTVV7ZI7Ccjs.useGlobalChartsContext.call(void 0, );
-  const loadingPlaceholder = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    "div",
-    {
-      className: _clsx2.default.call(void 0, "geo-chart", geo_chart_module_default.container, className),
-      "data-testid": "geo-chart-loading",
-      style: { width, height },
-      children: renderPlaceholder ? renderPlaceholder() : _i18n.__.call(void 0, "Loading map", "jetpack-charts")
-    }
-  );
-  const fullColorHex = getElementStyles({ index: 0 }).color;
-  const lightColorHex = _chunkZVGEDXDPcjs.lightenHexColor.call(void 0, fullColorHex, 0.8);
-  const backgroundColorHex = _chunkZVGEDXDPcjs.normalizeColorToHex.call(void 0, backgroundColor, null, _chunkZVGEDXDPcjs.resolveCssVariable) || DEFAULT_BACKGROUND_COLOR;
-  const defaultFillColorHex = _chunkZVGEDXDPcjs.normalizeColorToHex.call(void 0, featureFillColor, null, _chunkZVGEDXDPcjs.resolveCssVariable) || DEFAULT_FEATURE_FILL_COLOR;
-  const hasHtmlTooltips = _react.useMemo.call(void 0, 
-    () => 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 = _react.useMemo.call(void 0, 
-    () => ({
-      ...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__ */ _jsxruntime.jsx.call(void 0, 
-    "div",
-    {
-      className: _clsx2.default.call(void 0, "geo-chart", geo_chart_module_default.container, className),
-      "data-testid": "geo-chart",
-      style: { width, height, backgroundColor },
-      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _reactgooglecharts.Chart,
-        {
-          chartType: "GeoChart",
-          width,
-          height,
-          data,
-          options,
-          loader: loadingPlaceholder
-        }
-      )
-    }
-  );
-};
-var GeoChartWithProvider = (props) => {
-  const existingContext = _react.useContext.call(void 0, _chunkTVV7ZI7Ccjs.GlobalChartsContext);
-  if (existingContext) {
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, GeoChartInternal, { ...props });
-  }
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkTVV7ZI7Ccjs.GlobalChartsProvider, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, GeoChartInternal, { ...props }) });
-};
-GeoChartWithProvider.displayName = "GeoChart";
-var GeoChartResponsive = _chunkNW3RUYK2cjs.withResponsive.call(void 0, GeoChartWithProvider);
-
-
-
-
-exports.GeoChartWithProvider = GeoChartWithProvider; exports.GeoChartResponsive = GeoChartResponsive;
-//# sourceMappingURL=chunk-MFRS2PEY.cjs.map

package/dist/chunk-MFRS2PEY.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["/home/runner/work/jetpack/jetpack/projects/js-packages/charts/dist/chunk-MFRS2PEY.cjs","../src/charts/geo-chart/geo-chart.tsx","../src/charts/geo-chart/geo-chart.module.scss"],"names":[],"mappings":"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","file":"/home/runner/work/jetpack/jetpack/projects/js-packages/charts/dist/chunk-MFRS2PEY.cjs","sourcesContent":[null,"/**\n * External dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport clsx from 'clsx';\nimport { FC, useContext, useMemo } from 'react';\nimport { Chart, type GoogleChartOptions } 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 { GeoChartProps } from './types';\n\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: FC< GeoChartProps > = ( {\n\tclassName,\n\tdata,\n\twidth,\n\theight,\n\tregion = 'world',\n\tresolution = 'countries',\n\trenderPlaceholder,\n} ) => {\n\tconst {\n\t\tgetElementStyles,\n\t\ttheme: {\n\t\t\tgeoChart: { featureFillColor },\n\t\t\tbackgroundColor,\n\t\t},\n\t} = useGlobalChartsContext();\n\n\t// Render loading placeholder\n\tconst loadingPlaceholder = (\n\t\t<div\n\t\t\tclassName={ clsx( 'geo-chart', styles.container, className ) }\n\t\t\tdata-testid=\"geo-chart-loading\"\n\t\t\tstyle={ { width, height } }\n\t\t>\n\t\t\t{ renderPlaceholder ? renderPlaceholder() : __( 'Loading map', 'jetpack-charts' ) }\n\t\t</div>\n\t);\n\n\t// Google charts doesn't accept CSS variables, so we need to convert them to hex colors\n\tconst fullColorHex = getElementStyles( { index: 0 } ).color;\n\tconst lightColorHex = lightenHexColor( fullColorHex, 0.8 );\n\t// Use normalizeColorToHex to ensure HSL/RGB values from CSS variables are converted to hex\n\tconst backgroundColorHex =\n\t\tnormalizeColorToHex( backgroundColor, null, resolveCssVariable ) || DEFAULT_BACKGROUND_COLOR;\n\tconst defaultFillColorHex =\n\t\tnormalizeColorToHex( featureFillColor, null, resolveCssVariable ) || DEFAULT_FEATURE_FILL_COLOR;\n\n\t// Check if data has HTML tooltips (column with role: 'tooltip' and p.html: true)\n\tconst hasHtmlTooltips = useMemo(\n\t\t() =>\n\t\t\tdata.length > 0 &&\n\t\t\tdata[ 0 ].some(\n\t\t\t\tcol =>\n\t\t\t\t\ttypeof col === 'object' &&\n\t\t\t\t\tcol !== null &&\n\t\t\t\t\t'role' in col &&\n\t\t\t\t\tcol.role === 'tooltip' &&\n\t\t\t\t\t'p' in col &&\n\t\t\t\t\ttypeof col.p === 'object' &&\n\t\t\t\t\tcol.p !== null &&\n\t\t\t\t\t'html' in col.p &&\n\t\t\t\t\tcol.p.html === true\n\t\t\t),\n\t\t[ data ]\n\t);\n\n\tconst options: GoogleChartOptions = useMemo(\n\t\t() => ( {\n\t\t\t...( region !== 'world' && { region } ),\n\t\t\t...( resolution !== 'countries' && { resolution } ),\n\t\t\tcolorAxis: { colors: [ lightColorHex, fullColorHex ] },\n\t\t\tbackgroundColor: backgroundColorHex,\n\t\t\tdatalessRegionColor: defaultFillColorHex,\n\t\t\tdefaultColor: defaultFillColorHex,\n\t\t\ttooltip: { trigger: 'focus', isHtml: hasHtmlTooltips },\n\t\t\tlegend: 'none',\n\t\t\tkeepAspectRatio: true,\n\t\t} ),\n\t\t[\n\t\t\tregion,\n\t\t\tresolution,\n\t\t\tlightColorHex,\n\t\t\tfullColorHex,\n\t\t\tbackgroundColorHex,\n\t\t\tdefaultFillColorHex,\n\t\t\thasHtmlTooltips,\n\t\t]\n\t);\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx( 'geo-chart', styles.container, className ) }\n\t\t\tdata-testid=\"geo-chart\"\n\t\t\tstyle={ { width, height, backgroundColor } }\n\t\t>\n\t\t\t<Chart\n\t\t\t\tchartType=\"GeoChart\"\n\t\t\t\twidth={ width }\n\t\t\t\theight={ height }\n\t\t\t\tdata={ data }\n\t\t\t\toptions={ options }\n\t\t\t\tloader={ loadingPlaceholder }\n\t\t\t/>\n\t\t</div>\n\t);\n};\n\nconst GeoChartWithProvider: FC< GeoChartProps > = props => {\n\tconst existingContext = useContext( GlobalChartsContext );\n\n\t// If we're already in a GlobalChartsProvider context, don't create a new one\n\tif ( existingContext ) {\n\t\treturn <GeoChartInternal { ...props } />;\n\t}\n\n\t// Otherwise, create our own GlobalChartsProvider\n\treturn (\n\t\t<GlobalChartsProvider>\n\t\t\t<GeoChartInternal { ...props } />\n\t\t</GlobalChartsProvider>\n\t);\n};\n\nGeoChartWithProvider.displayName = 'GeoChart';\n\nconst GeoChartResponsive = withResponsive< GeoChartProps >( GeoChartWithProvider );\n\nexport { GeoChartResponsive as default, GeoChartWithProvider as GeoChartUnresponsive };\n","import 'css-chunk:src/charts/geo-chart/geo-chart.module.scss';export default {\n  \"container\": \"a8ccharts-JvcqOz\"\n};"]}

package/dist/chunk-MMDLXS6O.js

@@ -1,75 +0,0 @@
-// src/components/trend-indicator/trend-indicator.tsx
-import clsx from "clsx";
-
-// src/components/trend-indicator/trend-indicator.module.scss
-var trend_indicator_module_default = {
-  "trend-indicator": "a8ccharts-tGw1PY",
-  "trend-indicator--up": "a8ccharts-Fn-D1W",
-  "trend-indicator--down": "a8ccharts-HqtGQO",
-  "trend-indicator--neutral": "a8ccharts-S10nvO",
-  "trend-indicator__icon": "a8ccharts-5HjpOT",
-  "trend-indicator__value": "a8ccharts-muLL2Q"
-};
-
-// src/components/trend-indicator/trend-indicator.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
-var DIRECTION_LABELS = {
-  up: "Increase",
-  down: "Decrease",
-  neutral: "No change"
-};
-var Icon = ({ direction }) => {
-  if (direction === "neutral") {
-    return null;
-  }
-  const isUp = direction === "up";
-  return /* @__PURE__ */ jsx(
-    "svg",
-    {
-      className: trend_indicator_module_default["trend-indicator__icon"],
-      viewBox: "0 0 16 16",
-      fill: "none",
-      "aria-hidden": "true",
-      children: /* @__PURE__ */ jsx(
-        "path",
-        {
-          d: isUp ? "M8 13V3M4 7l4-4 4 4" : "M8 3v10M4 9l4 4 4-4",
-          stroke: "currentColor",
-          strokeWidth: "1.5",
-          strokeLinecap: "round",
-          strokeLinejoin: "round"
-        }
-      )
-    }
-  );
-};
-function TrendIndicator({
-  direction,
-  value,
-  className,
-  style,
-  showIcon = true
-}) {
-  const ariaLabel = `${DIRECTION_LABELS[direction]}: ${value}`;
-  return /* @__PURE__ */ jsxs(
-    "span",
-    {
-      className: clsx(
-        trend_indicator_module_default["trend-indicator"],
-        trend_indicator_module_default[`trend-indicator--${direction}`],
-        className
-      ),
-      style,
-      "aria-label": ariaLabel,
-      children: [
-        showIcon && /* @__PURE__ */ jsx(Icon, { direction }),
-        /* @__PURE__ */ jsx("span", { className: trend_indicator_module_default["trend-indicator__value"], children: value })
-      ]
-    }
-  );
-}
-
-export {
-  TrendIndicator
-};
-//# sourceMappingURL=chunk-MMDLXS6O.js.map

package/dist/chunk-MMDLXS6O.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/trend-indicator/trend-indicator.tsx","../src/components/trend-indicator/trend-indicator.module.scss"],"sourcesContent":["import clsx from 'clsx';\nimport styles from './trend-indicator.module.scss';\nimport type { TrendIndicatorProps, TrendDirection } from './types';\n\nconst DIRECTION_LABELS: Record< TrendDirection, string > = {\n\tup: 'Increase',\n\tdown: 'Decrease',\n\tneutral: 'No change',\n};\n\nconst Icon = ( { direction }: { direction: TrendDirection } ) => {\n\tif ( direction === 'neutral' ) {\n\t\treturn null;\n\t}\n\n\tconst isUp = direction === 'up';\n\treturn (\n\t\t<svg\n\t\t\tclassName={ styles[ 'trend-indicator__icon' ] }\n\t\t\tviewBox=\"0 0 16 16\"\n\t\t\tfill=\"none\"\n\t\t\taria-hidden=\"true\"\n\t\t>\n\t\t\t<path\n\t\t\t\td={ isUp ? 'M8 13V3M4 7l4-4 4 4' : 'M8 3v10M4 9l4 4 4-4' }\n\t\t\t\tstroke=\"currentColor\"\n\t\t\t\tstrokeWidth=\"1.5\"\n\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\tstrokeLinejoin=\"round\"\n\t\t\t/>\n\t\t</svg>\n\t);\n};\n\n/**\n * TrendIndicator displays a directional trend with a value.\n * Used to show percentage changes or growth metrics.\n *\n * @param {TrendIndicatorProps} props - Component props\n * @return {JSX.Element} The rendered trend indicator\n */\nexport function TrendIndicator( {\n\tdirection,\n\tvalue,\n\tclassName,\n\tstyle,\n\tshowIcon = true,\n}: TrendIndicatorProps ) {\n\tconst ariaLabel = `${ DIRECTION_LABELS[ direction ] }: ${ value }`;\n\n\treturn (\n\t\t<span\n\t\t\tclassName={ clsx(\n\t\t\t\tstyles[ 'trend-indicator' ],\n\t\t\t\tstyles[ `trend-indicator--${ direction }` ],\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tstyle={ style }\n\t\t\taria-label={ ariaLabel }\n\t\t>\n\t\t\t{ showIcon && <Icon direction={ direction } /> }\n\t\t\t<span className={ styles[ 'trend-indicator__value' ] }>{ value }</span>\n\t\t</span>\n\t);\n}\n","import 'css-chunk:src/components/trend-indicator/trend-indicator.module.scss';export default {\n  \"trend-indicator\": \"a8ccharts-tGw1PY\",\n  \"trend-indicator--up\": \"a8ccharts-Fn-D1W\",\n  \"trend-indicator--down\": \"a8ccharts-HqtGQO\",\n  \"trend-indicator--neutral\": \"a8ccharts-S10nvO\",\n  \"trend-indicator__icon\": \"a8ccharts-5HjpOT\",\n  \"trend-indicator__value\": \"a8ccharts-muLL2Q\"\n};"],"mappings":";AAAA,OAAO,UAAU;;;ACA6D,IAAO,iCAAQ;AAAA,EAC3F,mBAAmB;AAAA,EACnB,uBAAuB;AAAA,EACvB,yBAAyB;AAAA,EACzB,4BAA4B;AAAA,EAC5B,yBAAyB;AAAA,EACzB,0BAA0B;AAC5B;;;ADgBG,cA4BD,YA5BC;AAnBH,IAAM,mBAAqD;AAAA,EAC1D,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,SAAS;AACV;AAEA,IAAM,OAAO,CAAE,EAAE,UAAU,MAAsC;AAChE,MAAK,cAAc,WAAY;AAC9B,WAAO;AAAA,EACR;AAEA,QAAM,OAAO,cAAc;AAC3B,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAY,+BAAQ,uBAAwB;AAAA,MAC5C,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,eAAY;AAAA,MAEZ;AAAA,QAAC;AAAA;AAAA,UACA,GAAI,OAAO,wBAAwB;AAAA,UACnC,QAAO;AAAA,UACP,aAAY;AAAA,UACZ,eAAc;AAAA,UACd,gBAAe;AAAA;AAAA,MAChB;AAAA;AAAA,EACD;AAEF;AASO,SAAS,eAAgB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AACZ,GAAyB;AACxB,QAAM,YAAY,GAAI,iBAAkB,SAAU,CAAE,KAAM,KAAM;AAEhE,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAY;AAAA,QACX,+BAAQ,iBAAkB;AAAA,QAC1B,+BAAQ,oBAAqB,SAAU,EAAG;AAAA,QAC1C;AAAA,MACD;AAAA,MACA;AAAA,MACA,cAAa;AAAA,MAEX;AAAA,oBAAY,oBAAC,QAAK,WAAwB;AAAA,QAC5C,oBAAC,UAAK,WAAY,+BAAQ,wBAAyB,GAAM,iBAAO;AAAA;AAAA;AAAA,EACjE;AAEF;","names":[]}

package/dist/chunk-NW3RUYK2.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["/home/runner/work/jetpack/jetpack/projects/js-packages/charts/dist/chunk-NW3RUYK2.cjs","../src/charts/private/with-responsive/with-responsive.tsx","../src/charts/private/with-responsive/with-responsive.module.scss"],"names":[],"mappings":"AAAA;ACAA,8CAA8B;ADE9B;AACA;AEHkF,IAAO,+BAAA,EAAQ;AAAA,EAC/F,WAAA,EAAa;AACf,CAAA;AFKA;AACA;ACiGI,+CAAA;AA7EJ,IAAM,wBAAA,EAA0B,CAAE;AAAA,EACjC,mBAAA,EAAqB,GAAA;AAAA,EACrB,SAAA,EAAW,IAAA;AAAA,EACX;AACD,CAAA,EAAA,GAAyB;AACxB,EAAA,MAAM;AAAA,IACL,SAAA;AAAA,IACA,KAAA,EAAO,WAAA;AAAA,IACP,MAAA,EAAQ;AAAA,EACT,EAAA,EAAI,uCAAA;AAAe,IAClB,YAAA,EAAc,kBAAA;AAAA,IACd,yBAAA,EAA2B;AAAA,EAC5B,CAAE,CAAA;AAEF,EAAA,MAAM,eAAA,EAAiB,YAAA,EAAc,EAAA,EAAI,IAAA,CAAK,GAAA,CAAK,WAAA,EAAa,QAAS,EAAA,EAAI,CAAA;AAC7E,EAAA,MAAM,gBAAA,EAAkB,YAAA,IAAgB,KAAA,EAAA,EAAY,eAAA,EAAiB,YAAA,EAAc,YAAA;AAEnF,EAAA,OAAO;AAAA,IACN,SAAA;AAAA,IACA,KAAA,EAAO,cAAA;AAAA,IACP,MAAA,EAAQ,eAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMR,cAAA,EAAgB,YAAA,IAAgB,KAAA;AAAA,EACjC,CAAA;AACD,CAAA;AASO,SAAS,cAAA,CACf,gBAAA,EACC;AACD,EAAA,OAAO,SAAS,eAAA,CAAiB;AAAA,IAChC,mBAAA,EAAqB,GAAA;AAAA,IACrB,SAAA,EAAW,IAAA;AAAA,IACX,WAAA;AAAA,IACA,IAAA;AAAA,IACA,KAAA;AAAA,IACA,MAAA;AAAA,IACA,GAAG;AAAA,EACJ,CAAA,EAAgF;AAC/E,IAAA,MAAM;AAAA,MACL,SAAA;AAAA,MACA,KAAA,EAAO,aAAA;AAAA,MACP,MAAA,EAAQ,cAAA;AAAA,MACR;AAAA,IACD,EAAA,EAAI,uBAAA,CAAyB;AAAA,MAC5B,kBAAA;AAAA,MACA,QAAA;AAAA,MACA;AAAA,IACD,CAAE,CAAA;AAIF,IAAA,MAAM,eAAA,EAAiB,cAAA,GAAiB,KAAA,GAAQ,MAAA,GAAS,CAAA;AACzD,IAAA,MAAM,gBAAA,EAAkB,eAAA,GAAkB,KAAA,GAAQ,OAAA,GAAU,CAAA;AAE5D,IAAA,MAAM,cAAA,EAAgB,eAAA,EAAiB,OAAA,EAAS,MAAA;AAEhD,IAAA,uBACC,6BAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACA,GAAA,EAAM,SAAA;AAAA,QACN,aAAA,EAAY,oBAAA;AAAA,QACZ,SAAA,EAAY,8BAAA,CAAO,SAAA;AAAA,QACnB,KAAA,EAAQ;AAAA,UACP,KAAA,oCAAO,IAAA,UAAQ,OAAA,UAAS,QAAA;AAAA,UACxB,MAAA,oCAAQ,IAAA,UAAQ,QAAA,UAAU;AAAA,QAC3B,CAAA;AAAA,QAEA,QAAA,kBAAA,6BAAA;AAAA,UAAC,gBAAA;AAAA,UAAA;AAAA,YACA,KAAA,EAAQ,cAAA;AAAA,YACR,MAAA,EAAS,eAAA;AAAA,YACT,IAAA,EAAO,cAAA;AAAA,YACL,GAAK;AAAA,UAAA;AAAA,QACR;AAAA,MAAA;AAAA,IACD,CAAA;AAAA,EAEF,CAAA;AACD;AD/BA;AACA;AACE;AACF,wCAAC","file":"/home/runner/work/jetpack/jetpack/projects/js-packages/charts/dist/chunk-NW3RUYK2.cjs","sourcesContent":[null,"import { useParentSize } from '@visx/responsive';\nimport styles from './with-responsive.module.scss';\nimport type { BaseChartProps } from '../../../types';\nimport type { ComponentType } from 'react';\n\ntype DimensionProps = {\n\twidth?: number;\n\theight?: number;\n\tsize?: number;\n};\n\nexport type ResponsiveConfig = {\n\t/**\n\t * The maximum width of the chart. Defaults to 1200.\n\t */\n\tmaxWidth?: number;\n\t/**\n\t * The aspect ratio of the chart (height = width * aspectRatio).\n\t * When provided, height is calculated from width.\n\t * When omitted, the chart fills the parent container's height.\n\t */\n\taspectRatio?: number;\n\t/**\n\t * Child render updates upon resize are delayed until debounceTime milliseconds after the last resize event is observed.\n\t */\n\tresizeDebounceTime?: number;\n};\n\nconst useResponsiveDimensions = ( {\n\tresizeDebounceTime = 300,\n\tmaxWidth = 1200,\n\taspectRatio,\n}: ResponsiveConfig ) => {\n\tconst {\n\t\tparentRef,\n\t\twidth: parentWidth,\n\t\theight: parentHeight,\n\t} = useParentSize( {\n\t\tdebounceTime: resizeDebounceTime,\n\t\tenableDebounceLeadingCall: true,\n\t} );\n\n\tconst containerWidth = parentWidth > 0 ? Math.min( parentWidth, maxWidth ) : 0;\n\tconst containerHeight = aspectRatio !== undefined ? containerWidth * aspectRatio : parentHeight;\n\n\treturn {\n\t\tparentRef,\n\t\twidth: containerWidth,\n\t\theight: containerHeight,\n\t\t/**\n\t\t * Whether an aspectRatio was provided. Used to determine container\n\t\t * height styling: 'auto' when true (height derived from width),\n\t\t * '100%' when false (fill parent container).\n\t\t */\n\t\thasAspectRatio: aspectRatio !== undefined,\n\t};\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< T extends Exclude< BaseChartProps< unknown >, 'options' > >( // 'options' is excluded so that each chart can define its own options type\n\tWrappedComponent: ComponentType< T >\n) {\n\treturn function ResponsiveChart( {\n\t\tresizeDebounceTime = 300,\n\t\tmaxWidth = 1200,\n\t\taspectRatio,\n\t\tsize,\n\t\twidth,\n\t\theight,\n\t\t...chartProps\n\t}: Omit< T, 'width' | 'height' | 'size' > & DimensionProps & ResponsiveConfig ) {\n\t\tconst {\n\t\t\tparentRef,\n\t\t\twidth: measuredWidth,\n\t\t\theight: measuredHeight,\n\t\t\thasAspectRatio,\n\t\t} = useResponsiveDimensions( {\n\t\t\tresizeDebounceTime,\n\t\t\tmaxWidth,\n\t\t\taspectRatio,\n\t\t} );\n\n\t\t// Use measured dimensions, but fall back to explicit props if measurement returns 0\n\t\t// (e.g., during initial render or in test environments without DOM measurement)\n\t\tconst effectiveWidth = measuredWidth || size || width || 0;\n\t\tconst effectiveHeight = measuredHeight || size || height || 0;\n\n\t\tconst defaultHeight = hasAspectRatio ? 'auto' : '100%';\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ parentRef }\n\t\t\t\tdata-testid=\"responsive-wrapper\"\n\t\t\t\tclassName={ styles.container }\n\t\t\t\tstyle={ {\n\t\t\t\t\twidth: size ?? width ?? '100%',\n\t\t\t\t\theight: size ?? height ?? defaultHeight,\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<WrappedComponent\n\t\t\t\t\twidth={ effectiveWidth }\n\t\t\t\t\theight={ effectiveHeight }\n\t\t\t\t\tsize={ effectiveWidth }\n\t\t\t\t\t{ ...( chartProps as T ) }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t};\n}\n","import 'css-chunk:src/charts/private/with-responsive/with-responsive.module.scss';export default {\n  \"container\": \"a8ccharts-GSKfBD\"\n};"]}