@automattic/charts 0.58.0 → 1.0.0

package/dist/chunk-WTQYGUNF.js

@@ -1,400 +0,0 @@
-import {
-  GlobalChartsContext,
-  useGlobalChartsContext,
-  useGlobalChartsTheme,
-  useTextTruncation
-} from "./chunk-2I67QUIV.js";
-import {
-  formatPercentage
-} from "./chunk-JJIMABHT.js";
-
-// src/components/legend/legend.tsx
-import { useContext as useContext3, useMemo, forwardRef as forwardRef2 } from "react";
-
-// src/charts/private/single-chart-context/single-chart-context.tsx
-import { createContext } from "react";
-var ChartInstanceContext = /* @__PURE__ */ createContext(null);
-var SingleChartContext = ChartInstanceContext;
-
-// src/charts/private/single-chart-context/use-single-chart-context.ts
-import { useContext } from "react";
-var useChartInstanceContext = () => {
-  const context = useContext(ChartInstanceContext);
-  if (!context) {
-    throw new Error("useChartInstanceContext must be used within a Chart component");
-  }
-  return context;
-};
-var useSingleChartContext = useChartInstanceContext;
-
-// src/components/legend/private/base-legend.tsx
-import { Group } from "@visx/group";
-import { LegendItem, LegendLabel, LegendOrdinal, LegendShape } from "@visx/legend";
-import { scaleOrdinal } from "@visx/scale";
-import clsx from "clsx";
-import { forwardRef, useCallback, useContext as useContext2 } from "react";
-
-// src/components/legend/utils/value-or-identity.ts
-function valueOrIdentity(_) {
-  if (_ && typeof _ === "object" && "value" in _ && typeof _.value !== "undefined")
-    return _.value;
-  return _;
-}
-function valueOrIdentityString(_) {
-  return String(valueOrIdentity(_));
-}
-
-// src/components/legend/utils/label-transform-factory.ts
-function labelTransformFactory({
-  scale,
-  labelFormat
-}) {
-  return (d, i) => ({
-    datum: d,
-    index: i,
-    text: `${labelFormat(d, i)}`,
-    value: scale(d)
-  });
-}
-
-// src/components/legend/private/base-legend.module.scss
-var base_legend_module_default = {
-  "legend": "a8ccharts-89ApsU",
-  "legend--horizontal": "a8ccharts-AELBvX",
-  "legend--vertical": "a8ccharts-fX8uQe",
-  "legend--alignment-start": "a8ccharts-DEe0wg",
-  "legend--alignment-center": "a8ccharts-WBKF9I",
-  "legend--alignment-end": "a8ccharts-JfwMng",
-  "legend-item": "a8ccharts-Vflwq8",
-  "legend-item--interactive": "a8ccharts-qGsavM",
-  "legend-item--inactive": "a8ccharts-ZtDY-Q",
-  "legend-item-label": "a8ccharts-2H65Kr",
-  "legend-item-text--wrap": "a8ccharts-faSDBI",
-  "legend-item-text--ellipsis": "a8ccharts-FISUIO",
-  "legend-item-value": "a8ccharts-DTZlT-"
-};
-
-// src/components/legend/private/base-legend.tsx
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-var orientationToFlexDirection = {
-  horizontal: "row",
-  vertical: "column"
-};
-var LegendText = ({
-  text,
-  textOverflow,
-  maxWidth
-}) => {
-  const isEllipsis = maxWidth != null && textOverflow === "ellipsis";
-  const [textRef, isTruncated] = useTextTruncation(Boolean(isEllipsis));
-  return /* @__PURE__ */ _jsx("span", {
-    ref: textRef,
-    className: clsx(base_legend_module_default["legend-item-text"], maxWidth != null && base_legend_module_default[`legend-item-text--${textOverflow}`]),
-    style: {
-      ...maxWidth != null && {
-        maxWidth,
-        minWidth: 0
-      }
-    },
-    title: isEllipsis && isTruncated ? text : void 0,
-    children: text
-  });
-};
-var BaseLegend = /* @__PURE__ */ forwardRef(({
-  items,
-  className,
-  orientation = "horizontal",
-  alignment = "center",
-  shape = "rect",
-  fill = valueOrIdentityString,
-  size = valueOrIdentityString,
-  labelFormat = valueOrIdentity,
-  labelTransform = labelTransformFactory,
-  itemStyles,
-  itemClassName,
-  labelStyles,
-  labelClassName,
-  shapeStyles,
-  render,
-  interactive = false,
-  chartId
-}, ref) => {
-  const {
-    margin: itemMargin = "0",
-    flexDirection: itemDirection = "row"
-  } = itemStyles ?? {};
-  const {
-    justifyContent: labelJustifyContent = "flex-start",
-    flex: labelFlex = "0 0 auto",
-    margin: labelMargin = "0 4px",
-    maxWidth,
-    textOverflow = "wrap"
-  } = labelStyles ?? {};
-  const {
-    width: shapeWidth = 16,
-    height: shapeHeight = 16,
-    margin: shapeMargin = "2px 4px 2px 0"
-  } = shapeStyles ?? {};
-  const theme = useGlobalChartsTheme();
-  const context = useContext2(GlobalChartsContext);
-  const legendScale = scaleOrdinal({
-    domain: items.map((item) => item.label),
-    range: items.map((item) => item.color)
-  });
-  const domain = legendScale.domain();
-  const getShapeStyle = useCallback(({
-    index
-  }) => items[index]?.shapeStyle, [items]);
-  const handleLegendClick = useCallback((seriesLabel) => {
-    if (interactive && chartId && context) {
-      context.toggleSeriesVisibility(chartId, seriesLabel);
-    }
-  }, [interactive, chartId, context]);
-  const isSeriesVisible = useCallback((seriesLabel) => {
-    if (!interactive || !chartId || !context) {
-      return true;
-    }
-    return context.isSeriesVisible(chartId, seriesLabel);
-  }, [interactive, chartId, context]);
-  const createClickHandler = useCallback((labelText) => {
-    if (!interactive) {
-      return void 0;
-    }
-    return () => handleLegendClick(labelText);
-  }, [interactive, handleLegendClick]);
-  const createKeyDownHandler = useCallback((labelText) => {
-    if (!interactive) {
-      return void 0;
-    }
-    return (event) => {
-      if (event.key === "Enter" || event.key === " ") {
-        event.preventDefault();
-        handleLegendClick(labelText);
-      }
-    };
-  }, [interactive, handleLegendClick]);
-  return render ? render(items) : /* @__PURE__ */ _jsx(LegendOrdinal, {
-    scale: legendScale,
-    labelFormat,
-    labelTransform,
-    children: (labels) => /* @__PURE__ */ _jsx("div", {
-      ref,
-      role: "list",
-      className: clsx(base_legend_module_default.legend, base_legend_module_default[`legend--${orientation}`], base_legend_module_default[`legend--alignment-${alignment}`], className),
-      style: {
-        flexDirection: orientationToFlexDirection[orientation],
-        ...theme.legend?.containerStyles
-      },
-      children: labels.map((label, i) => {
-        const visible = isSeriesVisible(label.text);
-        const handleClick = createClickHandler(label.text);
-        const handleKeyDown = createKeyDownHandler(label.text);
-        const matchedItem = items[i];
-        return /* @__PURE__ */ _jsxs(LegendItem, {
-          className: clsx("visx-legend-item", base_legend_module_default["legend-item"], interactive && base_legend_module_default["legend-item--interactive"], !visible && base_legend_module_default["legend-item--inactive"], itemClassName),
-          margin: itemMargin,
-          flexDirection: orientation === "vertical" && alignment === "end" ? "row-reverse" : itemDirection,
-          onClick: handleClick,
-          onKeyDown: handleKeyDown,
-          role: interactive ? "button" : void 0,
-          tabIndex: interactive ? 0 : void 0,
-          "aria-pressed": interactive ? visible : void 0,
-          "aria-label": interactive ? `${label.text}: ${visible ? "visible" : "hidden"}. Toggle visibility.` : void 0,
-          children: [items[i]?.renderGlyph ? /* @__PURE__ */ _jsx("svg", {
-            width: items[i]?.glyphSize * 2,
-            height: items[i]?.glyphSize * 2,
-            children: /* @__PURE__ */ _jsx(Group, {
-              children: items[i]?.renderGlyph({
-                key: `legend-glyph-${label.text}`,
-                datum: {},
-                index: i,
-                color: fill(label),
-                size: items[i]?.glyphSize,
-                x: items[i]?.glyphSize,
-                y: items[i]?.glyphSize
-              })
-            })
-          }) : /* @__PURE__ */ _jsx(LegendShape, {
-            shape,
-            height: shapeHeight,
-            width: shapeWidth,
-            margin: shapeMargin,
-            item: domain[i],
-            itemIndex: i,
-            label,
-            fill,
-            size,
-            shapeStyle: getShapeStyle
-          }), /* @__PURE__ */ _jsxs(LegendLabel, {
-            className: clsx("visx-legend-label", base_legend_module_default["legend-item-label"], labelClassName),
-            style: {
-              justifyContent: labelJustifyContent,
-              flex: labelFlex,
-              margin: labelMargin,
-              ...theme.legend?.labelStyles
-            },
-            children: [/* @__PURE__ */ _jsx(LegendText, {
-              text: label.text,
-              textOverflow,
-              maxWidth
-            }), matchedItem?.value != null && matchedItem.value !== "" && /* @__PURE__ */ _jsxs("span", {
-              className: base_legend_module_default["legend-item-value"],
-              children: ["\xA0", matchedItem.value]
-            })]
-          })]
-        }, `legend-${label.text}-${i}`);
-      })
-    })
-  });
-});
-
-// src/components/legend/legend.tsx
-import { jsx as _jsx2 } from "react/jsx-runtime";
-var Legend = /* @__PURE__ */ forwardRef2(({
-  chartId,
-  items,
-  ...props
-}, ref) => {
-  const context = useContext3(GlobalChartsContext);
-  const singleChartContext = useContext3(SingleChartContext);
-  const contextChartId = chartId ?? singleChartContext?.chartId;
-  const contextItems = useMemo(() => {
-    return contextChartId && context ? context.getChartData(contextChartId)?.legendItems : void 0;
-  }, [contextChartId, context]);
-  const legendItems = items || contextItems;
-  if (!legendItems) {
-    return null;
-  }
-  return /* @__PURE__ */ _jsx2(BaseLegend, {
-    ref,
-    items: legendItems,
-    ...props,
-    chartId: contextChartId
-  });
-});
-
-// src/components/legend/hooks/use-chart-legend-items.ts
-import { formatNumber } from "@automattic/number-formatters";
-import { useMemo as useMemo2 } from "react";
-function formatPointValue(point, showValues, legendValueDisplay = "percentage") {
-  if (!showValues || legendValueDisplay === "none") {
-    return "";
-  }
-  if ("percentage" in point) {
-    const percentagePoint = point;
-    switch (legendValueDisplay) {
-      case "percentage":
-        return formatPercentage(percentagePoint.percentage);
-      case "value":
-        return formatNumber(percentagePoint.value);
-      case "valueDisplay":
-        return percentagePoint.valueDisplay || formatNumber(percentagePoint.value);
-      default:
-        return "";
-    }
-  }
-  if ("value" in point) {
-    return point.value !== null ? formatNumber(point.value) : "";
-  }
-  return "";
-}
-function applyGlyphToLegendItem(baseItem, withGlyph, glyph, renderGlyph, glyphSize) {
-  if (withGlyph) {
-    const glyphToUse = glyph || renderGlyph;
-    if (glyphToUse) {
-      return {
-        ...baseItem,
-        glyphSize,
-        renderGlyph: glyphToUse
-      };
-    }
-  }
-  return baseItem;
-}
-function processSeriesData(seriesData, getElementStyles, showValues, withGlyph, glyphSize, renderGlyph, legendShape) {
-  const mapper = (series, index) => {
-    const { color, glyph, shapeStyles } = getElementStyles({
-      data: series,
-      index,
-      legendShape
-    });
-    const baseItem = {
-      label: series.label,
-      value: showValues ? series.data?.length?.toString() || "0" : "",
-      color,
-      shapeStyle: shapeStyles
-    };
-    return applyGlyphToLegendItem(baseItem, withGlyph, glyph, renderGlyph, glyphSize);
-  };
-  return seriesData.map(mapper);
-}
-function processPointData(pointData, getElementStyles, showValues, legendValueDisplay, withGlyph, glyphSize, renderGlyph, legendShape) {
-  const mapper = (point, index) => {
-    const { color, glyph, shapeStyles } = getElementStyles({
-      data: point,
-      index,
-      legendShape
-    });
-    const baseItem = {
-      label: point.label,
-      value: formatPointValue(point, showValues, legendValueDisplay),
-      color,
-      shapeStyle: shapeStyles
-    };
-    return applyGlyphToLegendItem(baseItem, withGlyph, glyph, renderGlyph, glyphSize);
-  };
-  return pointData.map(mapper);
-}
-function useChartLegendItems(data, options = {}, legendShape) {
-  const {
-    showValues = false,
-    legendValueDisplay = "percentage",
-    withGlyph = false,
-    glyphSize = 8,
-    renderGlyph
-  } = options;
-  const { getElementStyles } = useGlobalChartsContext();
-  return useMemo2(() => {
-    if (!data || !Array.isArray(data) || data.length === 0) {
-      return [];
-    }
-    if ("data" in data[0]) {
-      return processSeriesData(
-        data,
-        getElementStyles,
-        showValues,
-        withGlyph,
-        glyphSize,
-        renderGlyph,
-        legendShape
-      );
-    }
-    return processPointData(
-      data,
-      getElementStyles,
-      showValues,
-      legendValueDisplay,
-      withGlyph,
-      glyphSize,
-      renderGlyph,
-      legendShape
-    );
-  }, [
-    data,
-    getElementStyles,
-    showValues,
-    legendValueDisplay,
-    withGlyph,
-    glyphSize,
-    renderGlyph,
-    legendShape
-  ]);
-}
-
-export {
-  SingleChartContext,
-  useSingleChartContext,
-  Legend,
-  useChartLegendItems
-};
-//# sourceMappingURL=chunk-WTQYGUNF.js.map

package/dist/chunk-WTQYGUNF.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/legend/legend.tsx","../src/charts/private/single-chart-context/single-chart-context.tsx","../src/charts/private/single-chart-context/use-single-chart-context.ts","../src/components/legend/private/base-legend.tsx","../src/components/legend/utils/value-or-identity.ts","../src/components/legend/utils/label-transform-factory.ts","../src/components/legend/private/base-legend.module.scss","../src/components/legend/hooks/use-chart-legend-items.ts"],"sourcesContent":["import { useContext, useMemo, forwardRef } from 'react';\nimport { SingleChartContext } from '../../charts/private/single-chart-context';\nimport { GlobalChartsContext } from '../../providers';\nimport { BaseLegend } from './private';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const Legend = /*#__PURE__*/forwardRef(({\n  chartId,\n  items,\n  ...props\n}, ref) => {\n  // Get context but don't throw if it doesn't exist\n  const context = useContext(GlobalChartsContext);\n  const singleChartContext = useContext(SingleChartContext);\n\n  // When chartId is used, it is standalone mode\n  // When chartId is not provided, we use the context's chartId, meaning it is in a single chart context\n  const contextChartId = chartId ?? singleChartContext?.chartId;\n\n  // Use useMemo to ensure re-rendering when context changes\n  const contextItems = useMemo(() => {\n    return contextChartId && context ? context.getChartData(contextChartId)?.legendItems : undefined;\n  }, [contextChartId, context]);\n\n  // Provided items take precedence over context items\n  const legendItems = items || contextItems;\n  if (!legendItems) {\n    return null;\n  }\n  return /*#__PURE__*/_jsx(BaseLegend, {\n    ref: ref,\n    items: legendItems,\n    ...props,\n    chartId: contextChartId\n  });\n});","import { createContext } from 'react';\n\n// Local context for chart implicit state sharing\n\nexport const ChartInstanceContext = /*#__PURE__*/createContext(null);\n\n// Backward compatibility exports\nexport const SingleChartContext = ChartInstanceContext;","import { useContext } from 'react';\nimport { ChartInstanceContext, type ChartInstanceContextValue } from './single-chart-context';\n\nexport const useChartInstanceContext = (): ChartInstanceContextValue => {\n\tconst context = useContext( ChartInstanceContext );\n\tif ( ! context ) {\n\t\tthrow new Error( 'useChartInstanceContext must be used within a Chart component' );\n\t}\n\treturn context;\n};\n\nexport const useSingleChartContext = useChartInstanceContext;\n","import { Group } from '@visx/group';\nimport { LegendItem, LegendLabel, LegendOrdinal, LegendShape } from '@visx/legend';\nimport { scaleOrdinal } from '@visx/scale';\nimport clsx from 'clsx';\nimport { forwardRef, useCallback, useContext } from 'react';\nimport { useTextTruncation } from '../../../hooks';\nimport { GlobalChartsContext, useGlobalChartsTheme } from '../../../providers';\nimport { valueOrIdentity, valueOrIdentityString, labelTransformFactory } from '../utils';\nimport styles from './base-legend.module.scss';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst orientationToFlexDirection = {\n  horizontal: 'row',\n  vertical: 'column'\n};\n\n// Component for legend text with truncation detection\n// Moved outside BaseLegend to prevent recreation on every render\nconst LegendText = ({\n  text,\n  textOverflow,\n  maxWidth\n}) => {\n  const isEllipsis = maxWidth != null && textOverflow === 'ellipsis';\n  const [textRef, isTruncated] = useTextTruncation(Boolean(isEllipsis));\n  return /*#__PURE__*/_jsx(\"span\", {\n    ref: textRef,\n    className: clsx(styles['legend-item-text'], maxWidth != null && styles[`legend-item-text--${textOverflow}`]),\n    style: {\n      ...(maxWidth != null && {\n        maxWidth,\n        minWidth: 0\n      })\n    },\n    title: isEllipsis && isTruncated ? text : undefined,\n    children: text\n  });\n};\n\n/*\n * Base legend component that displays color-coded items with labels based on visx LegendOrdinal.\n * We avoid using LegendOrdinal directly to enable support for advanced features such as interactivity.\n */\nexport const BaseLegend = /*#__PURE__*/forwardRef(({\n  items,\n  className,\n  orientation = 'horizontal',\n  alignment = 'center',\n  shape = 'rect',\n  fill = valueOrIdentityString,\n  size = valueOrIdentityString,\n  labelFormat = valueOrIdentity,\n  labelTransform = labelTransformFactory,\n  itemStyles,\n  itemClassName,\n  labelStyles,\n  labelClassName,\n  shapeStyles,\n  render,\n  interactive = false,\n  chartId\n}, ref) => {\n  const {\n    margin: itemMargin = '0',\n    flexDirection: itemDirection = 'row'\n  } = itemStyles ?? {};\n  const {\n    justifyContent: labelJustifyContent = 'flex-start',\n    flex: labelFlex = '0 0 auto',\n    margin: labelMargin = '0 4px',\n    maxWidth,\n    textOverflow = 'wrap'\n  } = labelStyles ?? {};\n  const {\n    width: shapeWidth = 16,\n    height: shapeHeight = 16,\n    margin: shapeMargin = '2px 4px 2px 0'\n  } = shapeStyles ?? {};\n  const theme = useGlobalChartsTheme();\n  const context = useContext(GlobalChartsContext);\n  const legendScale = scaleOrdinal({\n    domain: items.map(item => item.label),\n    range: items.map(item => item.color)\n  });\n  const domain = legendScale.domain();\n  const getShapeStyle = useCallback(({\n    index\n  }) => items[index]?.shapeStyle, [items]);\n\n  // Handle legend item clicks for interactive mode\n  const handleLegendClick = useCallback(seriesLabel => {\n    if (interactive && chartId && context) {\n      context.toggleSeriesVisibility(chartId, seriesLabel);\n    }\n  }, [interactive, chartId, context]);\n\n  // Check if a series is visible\n  const isSeriesVisible = useCallback(seriesLabel => {\n    if (!interactive || !chartId || !context) {\n      return true;\n    }\n    return context.isSeriesVisible(chartId, seriesLabel);\n  }, [interactive, chartId, context]);\n\n  // Create event handlers to avoid inline arrow functions\n  const createClickHandler = useCallback(labelText => {\n    if (!interactive) {\n      return undefined;\n    }\n    return () => handleLegendClick(labelText);\n  }, [interactive, handleLegendClick]);\n  const createKeyDownHandler = useCallback(labelText => {\n    if (!interactive) {\n      return undefined;\n    }\n    return event => {\n      if (event.key === 'Enter' || event.key === ' ') {\n        event.preventDefault();\n        handleLegendClick(labelText);\n      }\n    };\n  }, [interactive, handleLegendClick]);\n  return render ? render(items) : /*#__PURE__*/_jsx(LegendOrdinal, {\n    scale: legendScale,\n    labelFormat: labelFormat,\n    labelTransform: labelTransform,\n    children: labels => /*#__PURE__*/_jsx(\"div\", {\n      ref: ref,\n      role: \"list\",\n      className: clsx(styles.legend, styles[`legend--${orientation}`], styles[`legend--alignment-${alignment}`], className),\n      style: {\n        flexDirection: orientationToFlexDirection[orientation],\n        ...theme.legend?.containerStyles\n      },\n      children: labels.map((label, i) => {\n        const visible = isSeriesVisible(label.text);\n        const handleClick = createClickHandler(label.text);\n        const handleKeyDown = createKeyDownHandler(label.text);\n        const matchedItem = items[i];\n        return /*#__PURE__*/_jsxs(LegendItem, {\n          className: clsx('visx-legend-item', styles['legend-item'], interactive && styles['legend-item--interactive'], !visible && styles['legend-item--inactive'], itemClassName),\n          margin: itemMargin,\n          flexDirection: orientation === 'vertical' && alignment === 'end' ? 'row-reverse' : itemDirection,\n          onClick: handleClick,\n          onKeyDown: handleKeyDown,\n          role: interactive ? 'button' : undefined,\n          tabIndex: interactive ? 0 : undefined,\n          \"aria-pressed\": interactive ? visible : undefined,\n          \"aria-label\": interactive ? `${label.text}: ${visible ? 'visible' : 'hidden'}. Toggle visibility.` : undefined,\n          children: [items[i]?.renderGlyph ? /*#__PURE__*/_jsx(\"svg\", {\n            width: items[i]?.glyphSize * 2,\n            height: items[i]?.glyphSize * 2,\n            children: /*#__PURE__*/_jsx(Group, {\n              children: items[i]?.renderGlyph({\n                key: `legend-glyph-${label.text}`,\n                datum: {},\n                index: i,\n                color: fill(label),\n                size: items[i]?.glyphSize,\n                x: items[i]?.glyphSize,\n                y: items[i]?.glyphSize\n              })\n            })\n          }) : /*#__PURE__*/_jsx(LegendShape, {\n            shape: shape,\n            height: shapeHeight,\n            width: shapeWidth,\n            margin: shapeMargin,\n            item: domain[i],\n            itemIndex: i,\n            label: label,\n            fill: fill,\n            size: size,\n            shapeStyle: getShapeStyle\n          }), /*#__PURE__*/_jsxs(LegendLabel, {\n            className: clsx('visx-legend-label', styles['legend-item-label'], labelClassName),\n            style: {\n              justifyContent: labelJustifyContent,\n              flex: labelFlex,\n              margin: labelMargin,\n              ...theme.legend?.labelStyles\n            },\n            children: [/*#__PURE__*/_jsx(LegendText, {\n              text: label.text,\n              textOverflow: textOverflow,\n              maxWidth: maxWidth\n            }), matchedItem?.value != null && matchedItem.value !== '' && /*#__PURE__*/_jsxs(\"span\", {\n              className: styles['legend-item-value'],\n              children: ['\\u00A0', matchedItem.value]\n            })]\n          })]\n        }, `legend-${label.text}-${i}`);\n      })\n    })\n  });\n});","export type ValueOrIdentity< T > = T | { value?: T };\n\n/**\n * Returns an object's value if defined, or the object.\n * @param _ - The object to return the value of.\n * @return The value of the object, or the object itself.\n */\nexport function valueOrIdentity< T >( _: ValueOrIdentity< T > ): T {\n\tif ( _ && typeof _ === 'object' && 'value' in _ && typeof _.value !== 'undefined' )\n\t\treturn _.value;\n\treturn _ as T;\n}\n\n/**\n * Returns an object's value if defined, or the object, coerced to a string.\n * @param _ - The object to return the value of.\n * @return The value of the object, or the object itself.\n */\nexport function valueOrIdentityString< T >( _: ValueOrIdentity< T > ): string {\n\treturn String( valueOrIdentity( _ ) );\n}\n","import type { ItemTransformer, LabelFormatter } from '@visx/legend/lib/types';\nimport type { AnyD3Scale, ScaleInput } from '@visx/scale';\n\n/**\n * Returns a function which takes a Datum and index as input, and returns a formatted label object.\n * @param {object}                            root0             - The object to return the value of.\n * @param {AnyD3Scale}                        root0.scale       - The scale to use.\n * @param {LabelFormatter<ScaleInput<Scale>>} root0.labelFormat - The label format to use.\n * @return {ItemTransformer<ScaleInput<Scale>, ReturnType<Scale>>} The label transform factory.\n */\nexport function labelTransformFactory< Scale extends AnyD3Scale >( {\n\tscale,\n\tlabelFormat,\n}: {\n\tscale: Scale;\n\tlabelFormat: LabelFormatter< ScaleInput< Scale > >;\n} ): ItemTransformer< ScaleInput< Scale >, ReturnType< Scale > > {\n\treturn ( d, i ) => ( {\n\t\tdatum: d,\n\t\tindex: i,\n\t\ttext: `${ labelFormat( d, i ) }`,\n\t\tvalue: scale( d ),\n\t} );\n}\n","import 'css-chunk:src/components/legend/private/base-legend.module.scss';export default {\n  \"legend\": \"a8ccharts-89ApsU\",\n  \"legend--horizontal\": \"a8ccharts-AELBvX\",\n  \"legend--vertical\": \"a8ccharts-fX8uQe\",\n  \"legend--alignment-start\": \"a8ccharts-DEe0wg\",\n  \"legend--alignment-center\": \"a8ccharts-WBKF9I\",\n  \"legend--alignment-end\": \"a8ccharts-JfwMng\",\n  \"legend-item\": \"a8ccharts-Vflwq8\",\n  \"legend-item--interactive\": \"a8ccharts-qGsavM\",\n  \"legend-item--inactive\": \"a8ccharts-ZtDY-Q\",\n  \"legend-item-label\": \"a8ccharts-2H65Kr\",\n  \"legend-item-text--wrap\": \"a8ccharts-faSDBI\",\n  \"legend-item-text--ellipsis\": \"a8ccharts-FISUIO\",\n  \"legend-item-value\": \"a8ccharts-DTZlT-\"\n};","import { formatNumber } from '@automattic/number-formatters';\nimport { useMemo } from 'react';\nimport {\n\tuseGlobalChartsContext,\n\ttype GetElementStylesParams,\n\ttype ElementStyles,\n} from '../../../providers';\nimport { formatPercentage } from '../../../utils';\nimport type { SeriesData, DataPointDate, DataPointPercentage } from '../../../types';\nimport type { BaseLegendItem } from '../types';\nimport type { LegendShape } from '@visx/legend/lib/types';\nimport type { GlyphProps } from '@visx/xychart';\nimport type { ReactNode } from 'react';\n\nexport type LegendValueDisplay = 'percentage' | 'value' | 'valueDisplay' | 'none';\n\nexport interface ChartLegendOptions {\n\twithGlyph?: boolean;\n\tglyphSize?: number;\n\trenderGlyph?: < Datum extends object >( props: GlyphProps< Datum > ) => ReactNode;\n\tshowValues?: boolean;\n\tlegendValueDisplay?: LegendValueDisplay;\n\tlegendShape?: LegendShape< SeriesData[], number >;\n}\n\n/**\n * Formats the value for a data point based on its type and display preference\n * @param point              - The data point to format\n * @param showValues         - Whether to show values or return empty string\n * @param legendValueDisplay - What type of value to display\n * @return Formatted value string\n */\nfunction formatPointValue(\n\tpoint: DataPointDate | DataPointPercentage,\n\tshowValues: boolean,\n\tlegendValueDisplay: LegendValueDisplay = 'percentage'\n): string {\n\tif ( ! showValues || legendValueDisplay === 'none' ) {\n\t\treturn '';\n\t}\n\n\t// Handle DataPointPercentage (pie chart data)\n\tif ( 'percentage' in point ) {\n\t\tconst percentagePoint = point as DataPointPercentage;\n\t\tswitch ( legendValueDisplay ) {\n\t\t\tcase 'percentage':\n\t\t\t\treturn formatPercentage( percentagePoint.percentage );\n\t\t\tcase 'value':\n\t\t\t\treturn formatNumber( percentagePoint.value );\n\t\t\tcase 'valueDisplay':\n\t\t\t\treturn percentagePoint.valueDisplay || formatNumber( percentagePoint.value );\n\t\t\tdefault:\n\t\t\t\treturn '';\n\t\t}\n\t}\n\n\t// Handle DataPointDate (time series data)\n\tif ( 'value' in point ) {\n\t\treturn point.value !== null ? formatNumber( point.value ) : '';\n\t}\n\n\treturn '';\n}\n\n/**\n * Applies glyph configuration to a legend item if needed\n * @param baseItem    - The base legend item\n * @param withGlyph   - Whether to include glyph rendering\n * @param glyph       - Glyph component from theme\n * @param renderGlyph - Custom glyph render function\n * @param glyphSize   - Size of the glyph\n * @return The legend item with glyph configuration applied if applicable\n */\nfunction applyGlyphToLegendItem(\n\tbaseItem: BaseLegendItem,\n\twithGlyph: boolean,\n\tglyph?: < Datum extends object >( props: GlyphProps< Datum > ) => ReactNode,\n\trenderGlyph?: < Datum extends object >( props: GlyphProps< Datum > ) => ReactNode,\n\tglyphSize?: number\n): BaseLegendItem {\n\tif ( withGlyph ) {\n\t\tconst glyphToUse = glyph || renderGlyph;\n\t\tif ( glyphToUse ) {\n\t\t\treturn {\n\t\t\t\t...baseItem,\n\t\t\t\tglyphSize,\n\t\t\t\trenderGlyph: glyphToUse,\n\t\t\t};\n\t\t}\n\t}\n\n\treturn baseItem;\n}\n\n/**\n * Processes SeriesData into legend items\n * @param seriesData       - The series data to process\n * @param getElementStyles - Function to get element styles\n * @param showValues       - Whether to show values in legend\n * @param withGlyph        - Whether to include glyph rendering\n * @param glyphSize        - Size of the glyph\n * @param renderGlyph      - Component to render the glyph\n * @param legendShape      - The shape type for legend items (string literal or React component)\n * @return Array of processed legend items\n */\nfunction processSeriesData(\n\tseriesData: SeriesData[],\n\tgetElementStyles: ( params: GetElementStylesParams ) => ElementStyles,\n\tshowValues: boolean,\n\twithGlyph: boolean,\n\tglyphSize: number,\n\trenderGlyph?: < Datum extends object >( props: GlyphProps< Datum > ) => ReactNode,\n\tlegendShape?: LegendShape< SeriesData[], number >\n): BaseLegendItem[] {\n\tconst mapper = ( series: SeriesData, index: number ) => {\n\t\tconst { color, glyph, shapeStyles } = getElementStyles( {\n\t\t\tdata: series,\n\t\t\tindex,\n\t\t\tlegendShape,\n\t\t} );\n\n\t\tconst baseItem: BaseLegendItem = {\n\t\t\tlabel: series.label,\n\t\t\tvalue: showValues ? series.data?.length?.toString() || '0' : '',\n\t\t\tcolor,\n\t\t\tshapeStyle: shapeStyles,\n\t\t};\n\n\t\treturn applyGlyphToLegendItem( baseItem, withGlyph, glyph, renderGlyph, glyphSize );\n\t};\n\n\treturn seriesData.map( mapper );\n}\n\n/**\n * Processes point data into legend items\n * @param pointData          - The point data to process\n * @param getElementStyles   - Function to get element styles\n * @param showValues         - Whether to show values in legend\n * @param legendValueDisplay - What type of value to display\n * @param withGlyph          - Whether to include glyph rendering\n * @param glyphSize          - Size of the glyph\n * @param renderGlyph        - Component to render the glyph\n * @param legendShape        - The shape type for legend items (string literal or React component)\n * @return Array of processed legend items\n */\nfunction processPointData(\n\tpointData: ( DataPointDate | DataPointPercentage )[],\n\tgetElementStyles: ( params: GetElementStylesParams ) => ElementStyles,\n\tshowValues: boolean,\n\tlegendValueDisplay: LegendValueDisplay,\n\twithGlyph: boolean,\n\tglyphSize: number,\n\trenderGlyph?: < Datum extends object >( props: GlyphProps< Datum > ) => ReactNode,\n\tlegendShape?: LegendShape< SeriesData[], number >\n): BaseLegendItem[] {\n\tconst mapper = ( point: DataPointDate | DataPointPercentage, index: number ) => {\n\t\tconst { color, glyph, shapeStyles } = getElementStyles( {\n\t\t\tdata: point as DataPointPercentage,\n\t\t\tindex,\n\t\t\tlegendShape,\n\t\t} );\n\n\t\tconst baseItem: BaseLegendItem = {\n\t\t\tlabel: point.label,\n\t\t\tvalue: formatPointValue( point, showValues, legendValueDisplay ),\n\t\t\tcolor,\n\t\t\tshapeStyle: shapeStyles,\n\t\t};\n\n\t\treturn applyGlyphToLegendItem( baseItem, withGlyph, glyph, renderGlyph, glyphSize );\n\t};\n\n\treturn pointData.map( mapper );\n}\n\n/**\n * Hook to transform chart data into legend items\n * @param data        - The chart data to transform\n * @param options     - Configuration options for legend generation\n * @param legendShape - The shape type for legend items (string literal or React component)\n * @return Array of legend items ready for display\n */\nexport function useChartLegendItems<\n\tT extends SeriesData[] | DataPointDate[] | DataPointPercentage[],\n>(\n\tdata: T,\n\toptions: ChartLegendOptions = {},\n\tlegendShape?: LegendShape< SeriesData[], number >\n): BaseLegendItem[] {\n\tconst {\n\t\tshowValues = false,\n\t\tlegendValueDisplay = 'percentage',\n\t\twithGlyph = false,\n\t\tglyphSize = 8,\n\t\trenderGlyph,\n\t} = options;\n\tconst { getElementStyles } = useGlobalChartsContext();\n\n\treturn useMemo( () => {\n\t\tif ( ! data || ! Array.isArray( data ) || data.length === 0 ) {\n\t\t\treturn [];\n\t\t}\n\n\t\t// Handle SeriesData (multiple series with data points)\n\t\tif ( 'data' in data[ 0 ] ) {\n\t\t\treturn processSeriesData(\n\t\t\t\tdata as SeriesData[],\n\t\t\t\tgetElementStyles,\n\t\t\t\tshowValues,\n\t\t\t\twithGlyph,\n\t\t\t\tglyphSize,\n\t\t\t\trenderGlyph,\n\t\t\t\tlegendShape\n\t\t\t);\n\t\t}\n\n\t\t// Handle DataPointDate or DataPointPercentage (single data points)\n\t\treturn processPointData(\n\t\t\tdata as ( DataPointDate | DataPointPercentage )[],\n\t\t\tgetElementStyles,\n\t\t\tshowValues,\n\t\t\tlegendValueDisplay,\n\t\t\twithGlyph,\n\t\t\tglyphSize,\n\t\t\trenderGlyph,\n\t\t\tlegendShape\n\t\t);\n\t}, [\n\t\tdata,\n\t\tgetElementStyles,\n\t\tshowValues,\n\t\tlegendValueDisplay,\n\t\twithGlyph,\n\t\tglyphSize,\n\t\trenderGlyph,\n\t\tlegendShape,\n\t] );\n}\n"],"mappings":"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","names":["useContext","forwardRef","useContext","useContext","_jsx","forwardRef","useContext","useMemo","useMemo"]}