npm - @automattic/charts - Versions diffs - 0.46.3 → 0.48.0 - Mend

@automattic/charts 0.46.3 → 0.48.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (120) hide show

package/dist/chunk-REQT5QUF.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../src/components/pie-chart/pie-chart.tsx","../src/components/pie-chart/pie-chart.module.scss"],"sourcesContent":["import { localPoint } from '@visx/event';\nimport { Group } from '@visx/group';\nimport { Pie } from '@visx/shape';\nimport { useTooltip, useTooltipInPortal } from '@visx/tooltip';\nimport { __ } from '@wordpress/i18n';\nimport clsx from 'clsx';\nimport { useCallback, useContext, useMemo } from 'react';\nimport { useElementHeight, useInteractiveLegendData } from '../../hooks';\nimport {\n\tGlobalChartsProvider,\n\tuseChartId,\n\tuseChartRegistration,\n\tuseGlobalChartsContext,\n\tuseGlobalChartsTheme,\n\tGlobalChartsContext,\n} from '../../providers';\nimport { attachSubComponents } from '../../utils';\nimport { getStringWidth } from '../../visx/text';\nimport { Legend, useChartLegendItems } from '../legend';\nimport { ChartSVG, ChartHTML, useChartChildren } from '../private/chart-composition';\nimport { SingleChartContext } from '../private/single-chart-context';\nimport { withResponsive, ResponsiveConfig } from '../private/with-responsive';\nimport { BaseTooltip } from '../tooltip';\nimport styles from './pie-chart.module.scss';\nimport type { BaseChartProps, DataPointPercentage, Optional } from '../../types';\nimport type { LegendValueDisplay } from '../legend';\nimport type { ChartComponentWithComposition } from '../private/chart-composition';\nimport type { SVGProps, MouseEvent, ReactNode, FC } from 'react';\n\nexport interface PieChartProps extends BaseChartProps< DataPointPercentage[] > {\n\t/**\n\t * Inner radius in pixels. If > 0, creates a donut chart. Defaults to 0.\n\t */\n\tinnerRadius?: number;\n\n\t/**\n\t * Add padding to the chart\n\t */\n\tpadding?: number;\n\n\t/**\n\t * Thickness of the pie chart.\n\t * A value between 0 and 1, where 0 means no thickness\n\t * and 1 means the maximum thickness.\n\t */\n\tthickness?: number;\n\n\t/**\n\t * Scale of the gap between groups in the pie chart\n\t * A value between 0 and 1, where 0 means no gap.\n\t */\n\tgapScale?: number;\n\n\t/**\n\t * Scale of the corner radius for the pie chart segments.\n\t * A value between 0 and 1, where 0 means no corner radius.\n\t */\n\tcornerScale?: number;\n\n\t/**\n\t * Whether to show labels on pie segments. Defaults to true.\n\t */\n\tshowLabels?: boolean;\n\n\t/**\n\t * What type of value to display in the legend when showValues is true.\n\t * - 'percentage': Shows percentage values (e.g., \"23%\") [default]\n\t * - 'value': Shows raw numeric values (e.g., \"30000\")\n\t * - 'valueDisplay': Shows formatted values (e.g., \"30K\")\n\t * - 'none': Shows no values, only labels\n\t */\n\tlegendValueDisplay?: LegendValueDisplay;\n\n\t/**\n\t * Enable interactive legend items that can toggle segment visibility.\n\t * Requires chartId and GlobalChartsProvider.\n\t * When segments are hidden, percentages are recalculated so visible segments total 100%.\n\t */\n\tlegendInteractive?: boolean;\n\n\t/**\n\t * Use the children prop to render additional elements on the chart.\n\t */\n\tchildren?: ReactNode;\n\n\t/**\n\t * Horizontal offset for tooltip positioning in pixels (default: 0)\n\t */\n\ttooltipOffsetX?: number;\n\n\t/**\n\t * Vertical offset for tooltip positioning in pixels (default: -15)\n\t */\n\ttooltipOffsetY?: number;\n}\n\n// Base props type with optional responsive properties\ntype PieChartBaseProps = Optional< PieChartProps, 'size' >;\n\n// Composition API types\ntype PieChartComponent = ChartComponentWithComposition< PieChartBaseProps >;\ntype PieChartResponsiveComponent = ChartComponentWithComposition<\n\tPieChartBaseProps & ResponsiveConfig\n>;\n\n/**\n * Validates the pie chart data\n * @param data - The data to validate\n * @return Object containing validation result and error message\n */\nconst validateData = ( data: DataPointPercentage[] ) => {\n\tif ( ! data.length ) {\n\t\treturn { isValid: false, message: 'No data available' };\n\t}\n\n\t// Check for negative values\n\tconst hasNegativeValues = data.some( item => item.percentage < 0 || item.value < 0 );\n\tif ( hasNegativeValues ) {\n\t\treturn { isValid: false, message: 'Invalid data: Negative values are not allowed' };\n\t}\n\n\t// Validate total percentage\n\tconst totalPercentage = data.reduce( ( sum, item ) => sum + item.percentage, 0 );\n\tif ( Math.abs( totalPercentage - 100 ) > 0.01 ) {\n\t\t// Using small epsilon for floating point comparison\n\t\treturn { isValid: false, message: 'Invalid percentage total: Must equal 100' };\n\t}\n\n\treturn { isValid: true, message: '' };\n};\n\n/**\n * Renders a pie or donut chart using the provided data.\n *\n * @param {PieChartProps} props - Component props\n * @return {JSX.Element} The rendered chart component\n */\nconst PieChartInternal = ( {\n\tdata,\n\tchartId: providedChartId,\n\twithTooltips = false,\n\tclassName,\n\tshowLegend = false,\n\tlegendOrientation = 'horizontal',\n\tlegendPosition = 'bottom',\n\tlegendAlignment = 'center',\n\tlegendMaxWidth,\n\tlegendTextOverflow = 'wrap',\n\tlegendItemClassName,\n\tlegendShape = 'circle',\n\tsize,\n\tthickness = 1,\n\tpadding = 0,\n\tgapScale = 0,\n\tcornerScale = 0,\n\tshowLabels = true,\n\tlegendValueDisplay = 'percentage',\n\tlegendInteractive = false,\n\tchildren = null,\n\ttooltipOffsetX = 0,\n\ttooltipOffsetY = -15,\n}: PieChartProps ) => {\n\tconst providerTheme = useGlobalChartsTheme();\n\tconst chartId = useChartId( providedChartId );\n\tconst [ legendRef, legendHeight ] = useElementHeight< HTMLDivElement >();\n\tconst { tooltipOpen, tooltipLeft, tooltipTop, tooltipData, hideTooltip, showTooltip } =\n\t\tuseTooltip< DataPointPercentage >();\n\n\t// Set up portal tooltip for better z-index handling\n\tconst { containerRef, TooltipInPortal } = useTooltipInPortal( {\n\t\tdetectBounds: true,\n\t\tscroll: true,\n\t\tdebounce: 0,\n\t} );\n\n\tconst onMouseLeave = useCallback( () => {\n\t\tif ( ! withTooltips ) {\n\t\t\treturn;\n\t\t}\n\t\thideTooltip();\n\t}, [ withTooltips, hideTooltip ] );\n\n\tconst { getElementStyles, isSeriesVisible } = useGlobalChartsContext();\n\n\t// Filter and recalculate data for interactive legends\n\tconst { visibleData, allSegmentsHidden, legendData } = useInteractiveLegendData( {\n\t\tdata,\n\t\tchartId,\n\t\tlegendInteractive,\n\t\tisSeriesVisible,\n\t} );\n\n\t// Memoize legend options to prevent unnecessary re-calculations\n\tconst legendOptions = useMemo(\n\t\t() => ( { showValues: true, legendValueDisplay } ),\n\t\t[ legendValueDisplay ]\n\t);\n\n\t// Create legend items using legendData (has recalculated percentages for visible items)\n\tconst legendItems = useChartLegendItems( legendData, legendOptions );\n\n\tconst { isValid, message } = validateData( data );\n\n\t// Process children to extract compound components\n\tconst { svgChildren, htmlChildren, otherChildren } = useChartChildren( children, 'PieChart' );\n\n\t// Memoize metadata to prevent unnecessary re-registration\n\tconst chartMetadata = useMemo(\n\t\t() => ( {\n\t\t\tthickness,\n\t\t\tgapScale,\n\t\t\tcornerScale,\n\t\t} ),\n\t\t[ thickness, gapScale, cornerScale ]\n\t);\n\n\t// Register chart with context only if data is valid\n\tuseChartRegistration( {\n\t\tchartId,\n\t\tlegendItems,\n\t\tchartType: 'pie',\n\t\tisDataValid: isValid,\n\t\tmetadata: chartMetadata,\n\t} );\n\n\tif ( ! isValid ) {\n\t\treturn (\n\t\t\t<div className={ clsx( 'pie-chart', styles[ 'pie-chart' ], className ) }>\n\t\t\t\t<div className={ styles[ 'error-message' ] }>{ message }</div>\n\t\t\t</div>\n\t\t);\n\t}\n\n\tconst width = size;\n\tconst height = size;\n\tconst adjustedHeight = showLegend && legendPosition === 'top' ? height - legendHeight : height;\n\n\t// Calculate radius based on width/height\n\tconst radius = Math.min( width, adjustedHeight ) / 2;\n\n\t// Center the chart in the available space\n\tconst centerX = width / 2;\n\tconst centerY = adjustedHeight / 2;\n\n\t// Calculate the angle between each (use original data length for consistent spacing)\n\tconst padAngle = gapScale * ( ( 2 * Math.PI ) / data.length );\n\n\tconst outerRadius = radius - padding;\n\tconst innerRadius = thickness === 0 ? 0 : outerRadius * ( 1 - thickness );\n\n\tconst maxCornerRadius = ( outerRadius - innerRadius ) / 2;\n\tconst cornerRadius = cornerScale ? Math.min( cornerScale * outerRadius, maxCornerRadius ) : 0;\n\n\t// Map the data to include index for color assignment\n\t// When interactive, we need to find the original index to maintain consistent colors\n\tconst dataWithIndex = visibleData.map( d => {\n\t\tconst originalIndex = data.findIndex( item => item.label === d.label );\n\t\treturn {\n\t\t\t...d,\n\t\t\tindex: originalIndex >= 0 ? originalIndex : 0,\n\t\t};\n\t} );\n\n\tconst accessors = {\n\t\tvalue: ( d: DataPointPercentage ) => d.value,\n\t\tfill: ( d: DataPointPercentage & { index: number } ) => {\n\t\t\treturn getElementStyles( { data: d, index: d.index } ).color;\n\t\t},\n\t};\n\n\treturn (\n\t\t<SingleChartContext.Provider\n\t\t\tvalue={ {\n\t\t\t\tchartId,\n\t\t\t\tchartWidth: width,\n\t\t\t\tchartHeight: adjustedHeight,\n\t\t\t} }\n\t\t>\n\t\t\t<div\n\t\t\t\tref={ containerRef }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'pie-chart',\n\t\t\t\t\tstyles[ 'pie-chart' ],\n\t\t\t\t\t{ [ styles[ 'pie-chart--legend-top' ] ]: showLegend && legendPosition === 'top' },\n\t\t\t\t\tclassName\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tviewBox={ `0 0 ${ width } ${ adjustedHeight }` }\n\t\t\t\t\tpreserveAspectRatio=\"xMidYMid meet\"\n\t\t\t\t\twidth={ width }\n\t\t\t\t\theight={ adjustedHeight }\n\t\t\t\t>\n\t\t\t\t\t<Group top={ centerY } left={ centerX }>\n\t\t\t\t\t\t{ allSegmentsHidden ? (\n\t\t\t\t\t\t\t<text\n\t\t\t\t\t\t\t\ttextAnchor=\"middle\"\n\t\t\t\t\t\t\t\tdy=\".33em\"\n\t\t\t\t\t\t\t\tfill={ providerTheme.gridColor || '#ccc' }\n\t\t\t\t\t\t\t\tfontSize=\"14\"\n\t\t\t\t\t\t\t\tfontFamily=\"-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t'All segments are hidden. Click legend items to show data.',\n\t\t\t\t\t\t\t\t\t'jetpack-charts'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</text>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<Pie< DataPointPercentage & { index: number } >\n\t\t\t\t\t\t\t\tdata={ dataWithIndex }\n\t\t\t\t\t\t\t\tpieValue={ accessors.value }\n\t\t\t\t\t\t\t\touterRadius={ outerRadius }\n\t\t\t\t\t\t\t\tinnerRadius={ innerRadius }\n\t\t\t\t\t\t\t\tpadAngle={ padAngle }\n\t\t\t\t\t\t\t\tcornerRadius={ cornerRadius }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ pie => {\n\t\t\t\t\t\t\t\t\treturn pie.arcs.map( ( arc, index ) => {\n\t\t\t\t\t\t\t\t\t\tconst [ centroidX, centroidY ] = pie.path.centroid( arc );\n\t\t\t\t\t\t\t\t\t\tconst hasSpaceForLabel = arc.endAngle - arc.startAngle >= 0.25;\n\t\t\t\t\t\t\t\t\t\tconst handleMouseMove = ( event: MouseEvent< SVGElement > ) => {\n\t\t\t\t\t\t\t\t\t\t\tif ( ! withTooltips ) {\n\t\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t\t// Get coordinates relative to the current target element\n\t\t\t\t\t\t\t\t\t\t\tconst coords = localPoint( event );\n\t\t\t\t\t\t\t\t\t\t\tif ( coords ) {\n\t\t\t\t\t\t\t\t\t\t\t\t// Account for legend offset when legend is on top\n\t\t\t\t\t\t\t\t\t\t\t\tconst legendOffset =\n\t\t\t\t\t\t\t\t\t\t\t\t\tshowLegend && legendPosition === 'top' ? legendHeight : 0;\n\t\t\t\t\t\t\t\t\t\t\t\tshowTooltip( {\n\t\t\t\t\t\t\t\t\t\t\t\t\ttooltipData: arc.data,\n\t\t\t\t\t\t\t\t\t\t\t\t\ttooltipLeft: coords.x + tooltipOffsetX,\n\t\t\t\t\t\t\t\t\t\t\t\t\ttooltipTop: coords.y + legendOffset + tooltipOffsetY,\n\t\t\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t};\n\n\t\t\t\t\t\t\t\t\t\tconst pathProps: SVGProps< SVGPathElement > & { 'data-testid'?: string } = {\n\t\t\t\t\t\t\t\t\t\t\td: pie.path( arc ) || '',\n\t\t\t\t\t\t\t\t\t\t\tfill: accessors.fill( arc.data ),\n\t\t\t\t\t\t\t\t\t\t\t'data-testid': 'pie-segment',\n\t\t\t\t\t\t\t\t\t\t};\n\n\t\t\t\t\t\t\t\t\t\tconst groupProps: SVGProps< SVGGElement > = {};\n\t\t\t\t\t\t\t\t\t\tif ( withTooltips ) {\n\t\t\t\t\t\t\t\t\t\t\tgroupProps.onMouseMove = handleMouseMove;\n\t\t\t\t\t\t\t\t\t\t\tgroupProps.onMouseLeave = onMouseLeave;\n\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t// Estimate text width more accurately for background sizing\n\t\t\t\t\t\t\t\t\t\tconst fontSize = 12;\n\t\t\t\t\t\t\t\t\t\tconst estimatedTextWidth = getStringWidth( arc.data.label, { fontSize } );\n\t\t\t\t\t\t\t\t\t\tconst labelPadding = 6;\n\t\t\t\t\t\t\t\t\t\tconst backgroundWidth = estimatedTextWidth + labelPadding * 2;\n\t\t\t\t\t\t\t\t\t\tconst backgroundHeight = fontSize + labelPadding * 2;\n\n\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t<g key={ `arc-${ index }` } { ...groupProps }>\n\t\t\t\t\t\t\t\t\t\t\t\t<path { ...pathProps } />\n\t\t\t\t\t\t\t\t\t\t\t\t{ showLabels && hasSpaceForLabel && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<g>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{ providerTheme.labelBackgroundColor && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tx={ centroidX - backgroundWidth / 2 }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ty={ centroidY - backgroundHeight / 2 }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth={ backgroundWidth }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\theight={ backgroundHeight }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfill={ providerTheme.labelBackgroundColor }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\trx={ 4 }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\try={ 4 }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tpointerEvents=\"none\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<text\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tx={ centroidX }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ty={ centroidY }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdy=\".33em\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfill={ providerTheme.labelTextColor || '#333' }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfontSize={ fontSize }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAnchor=\"middle\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tpointerEvents=\"none\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{ arc.data.label }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</text>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</g>\n\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t</g>\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t</Pie>\n\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t{ /* Render SVG children (like Group, Text) inside the SVG */ }\n\t\t\t\t\t\t{ ! allSegmentsHidden && svgChildren }\n\t\t\t\t\t</Group>\n\t\t\t\t</svg>\n\n\t\t\t\t{ showLegend && (\n\t\t\t\t\t<Legend\n\t\t\t\t\t\torientation={ legendOrientation }\n\t\t\t\t\t\tposition={ legendPosition }\n\t\t\t\t\t\talignment={ legendAlignment }\n\t\t\t\t\t\tmaxWidth={ legendMaxWidth }\n\t\t\t\t\t\ttextOverflow={ legendTextOverflow }\n\t\t\t\t\t\tlegendItemClassName={ legendItemClassName }\n\t\t\t\t\t\tclassName={ styles[ 'pie-chart-legend' ] }\n\t\t\t\t\t\tshape={ legendShape }\n\t\t\t\t\t\tref={ legendRef }\n\t\t\t\t\t\tchartId={ chartId }\n\t\t\t\t\t\tinteractive={ legendInteractive }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\n\t\t\t\t{ withTooltips && tooltipOpen && tooltipData && (\n\t\t\t\t\t<TooltipInPortal top={ tooltipTop || 0 } left={ tooltipLeft || 0 }>\n\t\t\t\t\t\t<div role=\"tooltip\">\n\t\t\t\t\t\t\t<BaseTooltip data={ tooltipData } top={ 0 } left={ 0 } renderContainer={ false } />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</TooltipInPortal>\n\t\t\t\t) }\n\n\t\t\t\t{ /* Render HTML component children from PieChart.HTML */ }\n\t\t\t\t{ htmlChildren }\n\n\t\t\t\t{ /* Render other React children for backward compatibility */ }\n\t\t\t\t{ otherChildren }\n\t\t\t</div>\n\t\t</SingleChartContext.Provider>\n\t);\n};\n\nconst PieChartWithProvider: FC< PieChartProps > = 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 <PieChartInternal { ...props } />;\n\t}\n\n\t// Otherwise, create our own GlobalChartsProvider\n\treturn (\n\t\t<GlobalChartsProvider>\n\t\t\t<PieChartInternal { ...props } />\n\t\t</GlobalChartsProvider>\n\t);\n};\n\nPieChartWithProvider.displayName = 'PieChart';\n\n// Create PieChart with composition API\nconst PieChart = attachSubComponents( PieChartWithProvider, {\n\tLegend: Legend,\n\tSVG: ChartSVG,\n\tHTML: ChartHTML,\n} ) as PieChartComponent;\n\n// Create responsive PieChart with composition API\nconst PieChartResponsive = attachSubComponents(\n\twithResponsive< PieChartProps >( PieChartWithProvider ),\n\t{\n\t\tLegend: Legend,\n\t\tSVG: ChartSVG,\n\t\tHTML: ChartHTML,\n\t}\n) as PieChartResponsiveComponent;\n\nexport { PieChartResponsive as default, PieChart as PieChartUnresponsive };\n","import 'css-chunk:src/components/pie-chart/pie-chart.module.scss';export default {\n \"pie-chart\": \"a8ccharts-R12VhH\",\n \"pie-chart--legend-top\": \"a8ccharts-eG7-zj\"\n};"],"mappings":"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","names":[]}

package/dist/{chunk-VOMSG7KV.cjs → chunk-RP2RT6RU.cjs} RENAMED Viewed

@@ -38,6 +38,7 @@ var _react = require('react');
 // src/components/pie-semi-circle-chart/pie-semi-circle-chart.module.scss
 var pie_semi_circle_chart_module_default = {
   "pie-semi-circle-chart": "a8ccharts-r5jk9c",
+  "pie-semi-circle-chart--legend-top": "a8ccharts-XEH--U",
   "label": "a8ccharts-nPqOgD",
   "note": "a8ccharts-LpBZQh"
 };
@@ -181,12 +182,15 @@ var PieSemiCircleChartInternal = ({
         "div",
         {
           ref: containerRef,
-          className: _clsx2.default.call(void 0, "pie-semi-circle-chart", pie_semi_circle_chart_module_default["pie-semi-circle-chart"], className),
+          className: _clsx2.default.call(void 0,
+            "pie-semi-circle-chart",
+            pie_semi_circle_chart_module_default["pie-semi-circle-chart"],
+            {
+              [pie_semi_circle_chart_module_default["pie-semi-circle-chart--legend-top"]]: showLegend && legendPosition === "top"
+            },
+            className
+          ),
           "data-testid": "pie-chart-container",
-          style: {
-            display: "flex",
-            flexDirection: showLegend && legendPosition === "top" ? "column-reverse" : "column"
-          },
           children: [
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
               "svg",
@@ -317,4 +321,4 @@ var PieSemiCircleChartResponsive = _chunkLSGYIUQXcjs.attachSubComponents.call(vo
 exports.PieSemiCircleChart = PieSemiCircleChart; exports.PieSemiCircleChartResponsive = PieSemiCircleChartResponsive;
-//# sourceMappingURL=chunk-VOMSG7KV.cjs.map
+//# sourceMappingURL=chunk-RP2RT6RU.cjs.map

package/dist/chunk-RP2RT6RU.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["/home/runner/work/jetpack/jetpack/projects/js-packages/charts/dist/chunk-RP2RT6RU.cjs","../src/components/pie-semi-circle-chart/pie-semi-circle-chart.tsx","../src/components/pie-semi-circle-chart/pie-semi-circle-chart.module.scss"],"names":[],"mappings":"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","file":"/home/runner/work/jetpack/jetpack/projects/js-packages/charts/dist/chunk-RP2RT6RU.cjs","sourcesContent":[null,"import { localPoint } from '@visx/event';\nimport { Group } from '@visx/group';\nimport { Pie } from '@visx/shape';\nimport { Text } from '@visx/text';\nimport { useTooltip, useTooltipInPortal } from '@visx/tooltip';\nimport { __ } from '@wordpress/i18n';\nimport clsx from 'clsx';\nimport { useCallback, useContext, useMemo } from 'react';\nimport { useElementHeight, useInteractiveLegendData } from '../../hooks';\nimport {\n\tGlobalChartsProvider,\n\tuseChartId,\n\tuseChartRegistration,\n\tuseGlobalChartsContext,\n\tGlobalChartsContext,\n} from '../../providers';\nimport { attachSubComponents } from '../../utils';\nimport { Legend, useChartLegendItems } from '../legend';\nimport { ChartSVG, ChartHTML, useChartChildren } from '../private/chart-composition';\nimport { SingleChartContext } from '../private/single-chart-context';\nimport { withResponsive } from '../private/with-responsive';\nimport { BaseTooltip } from '../tooltip';\nimport styles from './pie-semi-circle-chart.module.scss';\nimport type { BaseChartProps, DataPointPercentage, Optional } from '../../types';\nimport type { LegendValueDisplay } from '../legend';\nimport type { ChartComponentWithComposition } from '../private/chart-composition';\nimport type { ResponsiveConfig } from '../private/with-responsive';\nimport type { PieArcDatum } from '@visx/shape/lib/shapes/Pie';\nimport type { FC, MouseEvent, ReactNode } from 'react';\n\nconst PAD_ANGLE = 0.03; // Padding between segments\n\nexport interface PieSemiCircleChartProps extends BaseChartProps< DataPointPercentage[] > {\n\t/**\n\t * Width of the chart in pixels; height would be half of this value calculated automatically.\n\t */\n\twidth?: number;\n\n\t/**\n\t * Thickness of the pie chart. A value between 0 and 1\n\t */\n\tthickness?: number;\n\n\t/**\n\t * Direction of chart rendering\n\t * true for clockwise, false for counter-clockwise\n\t */\n\tclockwise?: boolean;\n\n\t/**\n\t * Label text to display above the chart\n\t */\n\tlabel?: string;\n\n\t/**\n\t * Note text to display below the label\n\t */\n\tnote?: string;\n\n\t/**\n\t * Use the children prop to render additional elements on the chart.\n\t */\n\tchildren?: ReactNode;\n\n\t/**\n\t * What type of value to display in the legend when showValues is true.\n\t * - 'percentage': Shows percentage values (e.g., \"23%\") [default]\n\t * - 'value': Shows raw numeric values (e.g., \"30000\")\n\t * - 'valueDisplay': Shows formatted values (e.g., \"30K\")\n\t * - 'none': Shows no values, only labels\n\t */\n\tlegendValueDisplay?: LegendValueDisplay;\n\n\t/**\n\t * Enable interactive legend items that can toggle segment visibility.\n\t * Requires chartId and GlobalChartsProvider.\n\t * When segments are hidden, percentages are recalculated so visible segments total 100%.\n\t */\n\tlegendInteractive?: boolean;\n\n\t/**\n\t * Horizontal offset for tooltip positioning in pixels (default: 0)\n\t */\n\ttooltipOffsetX?: number;\n\n\t/**\n\t * Vertical offset for tooltip positioning in pixels (default: -15)\n\t */\n\ttooltipOffsetY?: number;\n}\n\n// Base props type with optional responsive properties\ntype PieSemiCircleChartBaseProps = Optional< PieSemiCircleChartProps, 'width' >;\n\n// Composition API types\ntype PieSemiCircleChartComponent = ChartComponentWithComposition< PieSemiCircleChartBaseProps >;\ntype PieSemiCircleChartResponsiveComponent = ChartComponentWithComposition<\n\tPieSemiCircleChartBaseProps & ResponsiveConfig\n>;\n\nexport type ArcData = PieArcDatum< DataPointPercentage >;\n\n/**\n * Validates the semi-circle pie chart data\n * @param data - The data to validate\n * @return Object containing validation result and error message\n */\nconst validateData = ( data: DataPointPercentage[] ) => {\n\tif ( ! data.length ) {\n\t\treturn { isValid: false, message: 'No data available' };\n\t}\n\n\t// Check for negative values\n\tconst hasNegativeValues = data.some( item => item.percentage < 0 || item.value < 0 );\n\tif ( hasNegativeValues ) {\n\t\treturn { isValid: false, message: 'Invalid data: Negative values are not allowed' };\n\t}\n\n\t// Validate total percentage is greater than 0\n\tconst totalPercentage = data.reduce( ( sum, item ) => sum + item.percentage, 0 );\n\tif ( totalPercentage <= 0 ) {\n\t\treturn { isValid: false, message: 'Invalid percentage total: Must be greater than 0' };\n\t}\n\n\treturn { isValid: true, message: '' };\n};\n\nconst PieSemiCircleChartInternal: FC< PieSemiCircleChartProps > = ( {\n\tdata,\n\tchartId: providedChartId,\n\twidth = 400,\n\tthickness = 0.4,\n\tclockwise = true,\n\twithTooltips = false,\n\tshowLegend = false,\n\tlegendOrientation = 'horizontal',\n\tlegendPosition = 'bottom',\n\tlegendAlignment = 'center',\n\tlegendMaxWidth,\n\tlegendTextOverflow = 'wrap',\n\tlegendItemClassName,\n\tlegendShape = 'circle',\n\tlegendValueDisplay = 'percentage',\n\tlegendInteractive = false,\n\tlabel,\n\tnote,\n\tclassName,\n\tchildren,\n\ttooltipOffsetX = 0,\n\ttooltipOffsetY = -15,\n} ) => {\n\tconst chartId = useChartId( providedChartId );\n\tconst [ legendRef, legendHeight ] = useElementHeight< HTMLDivElement >();\n\tconst { tooltipOpen, tooltipLeft, tooltipTop, tooltipData, hideTooltip, showTooltip } =\n\t\tuseTooltip< DataPointPercentage >();\n\n\t// Set up portal tooltip for better z-index handling\n\tconst { containerRef, TooltipInPortal } = useTooltipInPortal( {\n\t\tdetectBounds: true,\n\t\tscroll: true,\n\t\tdebounce: 0,\n\t} );\n\n\tconst handleMouseMove = useCallback(\n\t\t( event: MouseEvent< SVGElement >, arc: ArcData ) => {\n\t\t\t// Get coordinates relative to the current target element\n\t\t\tconst coords = localPoint( event );\n\t\t\tif ( coords ) {\n\t\t\t\t// Account for legend offset when legend is on top\n\t\t\t\tconst legendOffset = showLegend && legendPosition === 'top' ? legendHeight : 0;\n\t\t\t\tshowTooltip( {\n\t\t\t\t\ttooltipData: arc.data,\n\t\t\t\t\ttooltipLeft: coords.x + tooltipOffsetX,\n\t\t\t\t\ttooltipTop: coords.y + legendOffset + tooltipOffsetY,\n\t\t\t\t} );\n\t\t\t}\n\t\t},\n\t\t[ showTooltip, tooltipOffsetX, tooltipOffsetY, showLegend, legendPosition, legendHeight ]\n\t);\n\n\tconst handleMouseLeave = useCallback( () => {\n\t\thideTooltip();\n\t}, [ hideTooltip ] );\n\n\tconst handleArcMouseMove = useCallback(\n\t\t( arc: ArcData ) => ( event: MouseEvent< SVGElement > ) => {\n\t\t\thandleMouseMove( event, arc );\n\t\t},\n\t\t[ handleMouseMove ]\n\t);\n\n\t// Validate data first to get validation result\n\tconst { isValid, message } = validateData( data );\n\n\tconst { getElementStyles, isSeriesVisible } = useGlobalChartsContext();\n\n\t// Filter and recalculate data for interactive legends\n\tconst { visibleData, allSegmentsHidden, legendData } = useInteractiveLegendData( {\n\t\tdata,\n\t\tchartId,\n\t\tlegendInteractive,\n\t\tisSeriesVisible,\n\t} );\n\n\t// Define accessors with useMemo to avoid changing dependencies\n\tconst accessors = useMemo(\n\t\t() => ( {\n\t\t\tvalue: ( d: DataPointPercentage ) => d.value,\n\t\t\tsort: (\n\t\t\t\ta: DataPointPercentage & { index: number },\n\t\t\t\tb: DataPointPercentage & { index: number }\n\t\t\t) => b.value - a.value,\n\t\t\tfill: ( d: DataPointPercentage & { index: number } ) =>\n\t\t\t\tgetElementStyles( { data: d, index: d.index } ).color,\n\t\t} ),\n\t\t[ getElementStyles ]\n\t);\n\n\t// Memoize legend options to prevent unnecessary re-calculations\n\tconst legendOptions = useMemo(\n\t\t() => ( { showValues: true, legendValueDisplay } ),\n\t\t[ legendValueDisplay ]\n\t);\n\n\t// Create legend items using legendData (has recalculated percentages for visible items)\n\tconst legendItems = useChartLegendItems( legendData, legendOptions );\n\n\t// Process children to extract compound components\n\tconst { svgChildren, htmlChildren, otherChildren } = useChartChildren(\n\t\tchildren,\n\t\t'PieSemiCircleChart'\n\t);\n\n\t// Memoize metadata to prevent unnecessary re-registration\n\tconst chartMetadata = useMemo(\n\t\t() => ( {\n\t\t\tthickness,\n\t\t\tclockwise,\n\t\t} ),\n\t\t[ thickness, clockwise ]\n\t);\n\n\t// Register chart with context only if data is valid\n\tuseChartRegistration( {\n\t\tchartId,\n\t\tlegendItems,\n\t\tchartType: 'pie-semi-circle',\n\t\tisDataValid: isValid,\n\t\tmetadata: chartMetadata,\n\t} );\n\n\tif ( ! isValid ) {\n\t\treturn (\n\t\t\t<div className={ styles[ 'pie-semi-circle-chart' ] }>\n\t\t\t\t<svg width={ width } height={ width / 2 } data-testid=\"pie-chart-svg\">\n\t\t\t\t\t<text x=\"50%\" y=\"50%\" textAnchor=\"middle\" className={ styles.error }>\n\t\t\t\t\t\t{ message }\n\t\t\t\t\t</text>\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n\n\t// Calculate chart dimensions\n\t// TODO: we might want to accept height as a prop in the future, because the height of container might not always be enough.\n\tconst height = width / 2;\n\t// The chart only takes the height minus the legend height.\n\tconst chartHeight = height - ( showLegend && legendPosition === 'top' ? legendHeight : 0 );\n\tconst radius = Math.min( width / 2, chartHeight );\n\tconst innerRadius = radius * ( 1 - thickness );\n\n\t// Map data with index for color assignment\n\t// When interactive, we need to find the original index to maintain consistent colors\n\tconst dataWithIndex = visibleData.map( d => {\n\t\tconst originalIndex = data.findIndex( item => item.label === d.label );\n\t\treturn {\n\t\t\t...d,\n\t\t\tindex: originalIndex >= 0 ? originalIndex : 0,\n\t\t};\n\t} );\n\n\t// Configure pie angles based on clockwise direction\n\tconst startAngle = clockwise ? -Math.PI / 2 : Math.PI / 2;\n\tconst endAngle = clockwise ? Math.PI / 2 : -Math.PI / 2;\n\n\treturn (\n\t\t<SingleChartContext.Provider\n\t\t\tvalue={ {\n\t\t\t\tchartId,\n\t\t\t\tchartWidth: width,\n\t\t\t\tchartHeight: radius,\n\t\t\t} }\n\t\t>\n\t\t\t<div\n\t\t\t\tref={ containerRef }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'pie-semi-circle-chart',\n\t\t\t\t\tstyles[ 'pie-semi-circle-chart' ],\n\t\t\t\t\t{\n\t\t\t\t\t\t[ styles[ 'pie-semi-circle-chart--legend-top' ] ]:\n\t\t\t\t\t\t\tshowLegend && legendPosition === 'top',\n\t\t\t\t\t},\n\t\t\t\t\tclassName\n\t\t\t\t) }\n\t\t\t\tdata-testid=\"pie-chart-container\"\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\twidth={ width }\n\t\t\t\t\theight={ radius }\n\t\t\t\t\tviewBox={ `0 0 ${ width } ${ chartHeight }` }\n\t\t\t\t\tdata-testid=\"pie-chart-svg\"\n\t\t\t\t>\n\t\t\t\t\t{ /* Main chart group centered horizontally and positioned at bottom */ }\n\t\t\t\t\t<Group top={ chartHeight } left={ width / 2 }>\n\t\t\t\t\t\t{ allSegmentsHidden ? (\n\t\t\t\t\t\t\t<text\n\t\t\t\t\t\t\t\ttextAnchor=\"middle\"\n\t\t\t\t\t\t\t\ty={ -radius / 2 }\n\t\t\t\t\t\t\t\tfill=\"#ccc\"\n\t\t\t\t\t\t\t\tfontSize=\"14\"\n\t\t\t\t\t\t\t\tfontFamily=\"-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t'All segments are hidden. Click legend items to show data.',\n\t\t\t\t\t\t\t\t\t'jetpack-charts'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</text>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t{ /* Pie chart */ }\n\t\t\t\t\t\t\t\t<Pie< DataPointPercentage & { index: number } >\n\t\t\t\t\t\t\t\t\tdata={ dataWithIndex }\n\t\t\t\t\t\t\t\t\tpieValue={ accessors.value }\n\t\t\t\t\t\t\t\t\touterRadius={ radius }\n\t\t\t\t\t\t\t\t\tinnerRadius={ innerRadius }\n\t\t\t\t\t\t\t\t\tcornerRadius={ 3 }\n\t\t\t\t\t\t\t\t\tpadAngle={ PAD_ANGLE }\n\t\t\t\t\t\t\t\t\tstartAngle={ startAngle }\n\t\t\t\t\t\t\t\t\tendAngle={ endAngle }\n\t\t\t\t\t\t\t\t\tpieSort={ accessors.sort }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ pie => {\n\t\t\t\t\t\t\t\t\t\treturn pie.arcs.map( arc => (\n\t\t\t\t\t\t\t\t\t\t\t<g\n\t\t\t\t\t\t\t\t\t\t\t\tkey={ arc.data.label }\n\t\t\t\t\t\t\t\t\t\t\t\tonMouseMove={ withTooltips ? handleArcMouseMove( arc ) : undefined }\n\t\t\t\t\t\t\t\t\t\t\t\tonMouseLeave={ withTooltips ? handleMouseLeave : undefined }\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\t\t\t\t\td={ pie.path( arc ) || '' }\n\t\t\t\t\t\t\t\t\t\t\t\t\tfill={ accessors.fill( arc.data ) }\n\t\t\t\t\t\t\t\t\t\t\t\t\tdata-testid=\"pie-segment\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</g>\n\t\t\t\t\t\t\t\t\t\t) );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t</Pie>\n\n\t\t\t\t\t\t\t\t{ /* Label and note text */ }\n\t\t\t\t\t\t\t\t<Group>\n\t\t\t\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\t\t\t\ttextAnchor=\"middle\"\n\t\t\t\t\t\t\t\t\t\tverticalAnchor=\"start\"\n\t\t\t\t\t\t\t\t\t\ty={ -40 } // Position above the chart with space for note\n\t\t\t\t\t\t\t\t\t\tclassName={ styles.label }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\t\t\t\ttextAnchor=\"middle\"\n\t\t\t\t\t\t\t\t\t\tverticalAnchor=\"start\"\n\t\t\t\t\t\t\t\t\t\ty={ -20 } // Position between label and chart\n\t\t\t\t\t\t\t\t\t\tclassName={ styles.note }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ note }\n\t\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t\t</Group>\n\n\t\t\t\t\t\t\t\t{ /* Render SVG children from composition API */ }\n\t\t\t\t\t\t\t\t{ ! allSegmentsHidden && svgChildren }\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Group>\n\t\t\t\t</svg>\n\n\t\t\t\t{ withTooltips && tooltipOpen && tooltipData && (\n\t\t\t\t\t<TooltipInPortal top={ tooltipTop || 0 } left={ tooltipLeft || 0 }>\n\t\t\t\t\t\t<div role=\"tooltip\">\n\t\t\t\t\t\t\t<BaseTooltip data={ tooltipData } top={ 0 } left={ 0 } renderContainer={ false } />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</TooltipInPortal>\n\t\t\t\t) }\n\n\t\t\t\t{ showLegend && (\n\t\t\t\t\t<Legend\n\t\t\t\t\t\torientation={ legendOrientation }\n\t\t\t\t\t\tposition={ legendPosition }\n\t\t\t\t\t\talignment={ legendAlignment }\n\t\t\t\t\t\tmaxWidth={ legendMaxWidth }\n\t\t\t\t\t\ttextOverflow={ legendTextOverflow }\n\t\t\t\t\t\tlegendItemClassName={ legendItemClassName }\n\t\t\t\t\t\tshape={ legendShape }\n\t\t\t\t\t\tref={ legendRef }\n\t\t\t\t\t\tchartId={ chartId }\n\t\t\t\t\t\tinteractive={ legendInteractive }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\n\t\t\t\t{ /* Render HTML children from composition API */ }\n\t\t\t\t{ htmlChildren }\n\n\t\t\t\t{ /* Render any other children that aren't compound components */ }\n\t\t\t\t{ otherChildren }\n\t\t\t</div>\n\t\t</SingleChartContext.Provider>\n\t);\n};\n\nconst PieSemiCircleChartWithProvider: FC< PieSemiCircleChartProps > = 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 <PieSemiCircleChartInternal { ...props } />;\n\t}\n\n\t// Otherwise, create our own GlobalChartsProvider\n\treturn (\n\t\t<GlobalChartsProvider>\n\t\t\t<PieSemiCircleChartInternal { ...props } />\n\t\t</GlobalChartsProvider>\n\t);\n};\n\nPieSemiCircleChartWithProvider.displayName = 'PieSemiCircleChart';\n\n// Create PieSemiCircleChart with composition API\nconst PieSemiCircleChart = attachSubComponents( PieSemiCircleChartWithProvider, {\n\tLegend: Legend,\n\tSVG: ChartSVG,\n\tHTML: ChartHTML,\n} ) as PieSemiCircleChartComponent;\n\n// Create responsive PieSemiCircleChart with composition API\nconst PieSemiCircleChartResponsive = attachSubComponents(\n\twithResponsive< PieSemiCircleChartProps >( PieSemiCircleChartWithProvider ),\n\t{\n\t\tLegend: Legend,\n\t\tSVG: ChartSVG,\n\t\tHTML: ChartHTML,\n\t}\n) as PieSemiCircleChartResponsiveComponent;\n\nexport {\n\tPieSemiCircleChartResponsive as default,\n\tPieSemiCircleChart as PieSemiCircleChartUnresponsive,\n};\n","import 'css-chunk:src/components/pie-semi-circle-chart/pie-semi-circle-chart.module.scss';export default {\n \"pie-semi-circle-chart\": \"a8ccharts-r5jk9c\",\n \"pie-semi-circle-chart--legend-top\": \"a8ccharts-XEH--U\",\n \"label\": \"a8ccharts-nPqOgD\",\n \"note\": \"a8ccharts-LpBZQh\"\n};"]}

package/dist/{chunk-GEB4GELE.cjs → chunk-TJFB2TPL.cjs} RENAMED Viewed

@@ -63,6 +63,9 @@ var DefaultGlyph = (props) => {
 // src/components/line-chart/line-chart.module.scss
 var line_chart_module_default = {
   "line-chart": "a8ccharts-ITM3dm",
+  "line-chart--animated": "a8ccharts-fXvEBi",
+  "rise": "a8ccharts-gb7M8E",
+  "line-chart--legend-top": "a8ccharts-zQLTUG",
   "line-chart__tooltip": "a8ccharts-aqcmeq",
   "line-chart__annotation-label-popover": "a8ccharts-TqNZkh",
   "line-chart__tooltip-date": "a8ccharts-4Dzab-",
@@ -676,6 +679,7 @@ var LineChartInternal = _react.forwardRef.call(void 0,
     withStartGlyphs = false,
     withEndGlyphs = false,
     legendInteractive = false,
+    animation,
     options = {},
     onPointerDown = void 0,
     onPointerUp = void 0,
@@ -814,14 +818,17 @@ var LineChartInternal = _react.forwardRef.call(void 0,
         children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
           "div",
           {
-            className: _clsx2.default.call(void 0, "line-chart", line_chart_module_default["line-chart"], className),
+            className: _clsx2.default.call(void 0,
+              "line-chart",
+              line_chart_module_default["line-chart"],
+              { [line_chart_module_default["line-chart--animated"]]: animation },
+              { [line_chart_module_default["line-chart--legend-top"]]: showLegend && legendPosition === "top" },
+              className
+            ),
             "data-testid": "line-chart",
             style: {
               width,
-              height,
-              display: "flex",
-              flexDirection: showLegend && legendPosition === "top" ? "column-reverse" : "column",
-              position: "relative"
+              height
             },
             children: [
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
@@ -1027,4 +1034,4 @@ var LineChartResponsive = _chunkLSGYIUQXcjs.attachSubComponents.call(void 0,
 exports.LineChart = LineChart; exports.LineChartResponsive = LineChartResponsive;
-//# sourceMappingURL=chunk-GEB4GELE.cjs.map
+//# sourceMappingURL=chunk-TJFB2TPL.cjs.map

package/dist/chunk-TJFB2TPL.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["/home/runner/work/jetpack/jetpack/projects/js-packages/charts/dist/chunk-TJFB2TPL.cjs","../src/components/line-chart/line-chart.tsx","../src/components/private/default-glyph/default-glyph.tsx","../src/components/line-chart/line-chart.module.scss","../src/components/line-chart/private/line-chart-annotation-label-popover.tsx","../src/components/line-chart/private/line-chart-annotations-overlay.tsx","../src/components/line-chart/private/line-chart-annotation.tsx","../src/components/line-chart/private/line-chart-glyph.tsx"],"names":["jsx","useEffect","useRef","yMax","xMax","x","y","yMin","xMin","jsxs","useContext"],"mappings":"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","file":"/home/runner/work/jetpack/jetpack/projects/js-packages/charts/dist/chunk-TJFB2TPL.cjs","sourcesContent":[null,"import { formatNumberCompact } from '@automattic/number-formatters';\nimport { curveCatmullRom, curveLinear, curveMonotoneX } from '@visx/curve';\nimport { LinearGradient } from '@visx/gradient';\nimport { scaleTime } from '@visx/scale';\nimport { XYChart, AreaSeries, Grid, Axis, DataContext } from '@visx/xychart';\nimport { __ } from '@wordpress/i18n';\nimport clsx from 'clsx';\nimport { differenceInHours, differenceInYears } from 'date-fns';\nimport { useMemo, useContext, forwardRef, useImperativeHandle, useState, useRef } from 'react';\nimport {\n\tuseXYChartTheme,\n\tuseChartDataTransform,\n\tuseChartMargin,\n\tuseElementHeight,\n} from '../../hooks';\nimport {\n\tGlobalChartsProvider,\n\tGlobalChartsContext,\n\tuseChartId,\n\tuseChartRegistration,\n\tuseGlobalChartsContext,\n\tuseGlobalChartsTheme,\n} from '../../providers';\nimport { attachSubComponents } from '../../utils';\nimport { Legend, useChartLegendItems } from '../legend';\nimport { DefaultGlyph } from '../private/default-glyph';\nimport { SingleChartContext, type SingleChartRef } from '../private/single-chart-context';\nimport { withResponsive } from '../private/with-responsive';\nimport { AccessibleTooltip, useKeyboardNavigation } from '../tooltip';\nimport styles from './line-chart.module.scss';\nimport { LineChartAnnotation, LineChartAnnotationsOverlay, LineChartGlyph } from './private';\nimport type { CurveType, RenderLineGlyphProps, LineChartProps, TooltipDatum } from './types';\nimport type { DataPoint, DataPointDate, SeriesData, Optional } from '../../types';\nimport type { ResponsiveConfig } from '../private/with-responsive';\nimport type { TickFormatter } from '@visx/axis';\nimport type { GlyphProps } from '@visx/xychart';\nimport type { RenderTooltipParams } from '@visx/xychart/lib/components/Tooltip';\nimport type { FC, Ref } from 'react';\n\nconst X_TICK_WIDTH = 60;\n\nconst defaultRenderGlyph = < Datum extends object >( props: RenderLineGlyphProps< Datum > ) => {\n\treturn <DefaultGlyph { ...props } key={ props.key } />;\n};\n\nconst toNumber = ( val?: number | string | null ): number | undefined => {\n\tconst num = typeof val === 'number' ? val : parseFloat( val );\n\treturn isNaN( num ) ? undefined : num;\n};\n\n/**\n * Determines the curve type for the line chart based on the provided type and smoothing parameters\n *\n * @param {CurveType} type - The explicit curve type to use\n * @param {boolean} smoothing - Legacy smoothing parameter\n * @return The curve function to use for the line\n */\nconst getCurveType = ( type?: CurveType, smoothing?: boolean ) => {\n\t// If no type specified, use legacy smoothing behavior\n\tif ( ! type ) {\n\t\treturn smoothing ? curveCatmullRom : curveLinear;\n\t}\n\n\t// Handle explicit curve types\n\tswitch ( type ) {\n\t\tcase 'smooth':\n\t\t\treturn curveCatmullRom;\n\t\tcase 'monotone':\n\t\t\treturn curveMonotoneX;\n\t\tcase 'linear':\n\t\t\treturn curveLinear;\n\t\tdefault:\n\t\t\treturn curveLinear;\n\t}\n};\n\nconst renderDefaultTooltip = ( params: RenderTooltipParams< DataPointDate > ) => {\n\tconst { tooltipData } = params;\n\tconst nearestDatum = tooltipData?.nearestDatum?.datum;\n\tif ( ! nearestDatum ) return null;\n\n\tconst tooltipPoints: TooltipDatum[] = Object.entries( tooltipData?.datumByKey || {} )\n\t\t.map( ( [ key, { datum } ] ) => ( {\n\t\t\tkey,\n\t\t\tvalue: datum.value as number,\n\t\t} ) )\n\t\t.sort( ( a, b ) => b.value - a.value );\n\n\treturn (\n\t\t<div className={ styles[ 'line-chart__tooltip' ] }>\n\t\t\t<div className={ styles[ 'line-chart__tooltip-date' ] }>\n\t\t\t\t{ nearestDatum.date?.toLocaleDateString() }\n\t\t\t</div>\n\t\t\t{ tooltipPoints.map( point => (\n\t\t\t\t<div key={ point.key } className={ styles[ 'line-chart__tooltip-row' ] }>\n\t\t\t\t\t<span className={ styles[ 'line-chart__tooltip-label' ] }>{ point.key }:</span>\n\t\t\t\t\t<span className={ styles[ 'line-chart__tooltip-value' ] }>{ point.value }</span>\n\t\t\t\t</div>\n\t\t\t) ) }\n\t\t</div>\n\t);\n};\n\nconst formatYearTick = ( timestamp: number ) => {\n\tconst date = new Date( timestamp );\n\treturn date.toLocaleDateString( undefined, {\n\t\tyear: 'numeric',\n\t} );\n};\n\nconst formatDateTick = ( timestamp: number ) => {\n\tconst date = new Date( timestamp );\n\treturn date.toLocaleDateString( undefined, {\n\t\tmonth: 'short',\n\t\tday: 'numeric',\n\t} );\n};\n\nconst formatHourTick = ( timestamp: number ) => {\n\tconst date = new Date( timestamp );\n\treturn date.toLocaleTimeString( undefined, {\n\t\thour: 'numeric',\n\t\thour12: true,\n\t} );\n};\n\nconst getFormatter = ( sortedData: ReturnType< typeof useChartDataTransform > ) => {\n\tconst minX = Math.min( ...sortedData.map( datom => datom.data.at( 0 )?.date ) );\n\tconst maxX = Math.max( ...sortedData.map( datom => datom.data.at( -1 )?.date ) );\n\n\tconst diffInHours = Math.abs( differenceInHours( maxX, minX ) );\n\tif ( diffInHours <= 24 ) {\n\t\treturn formatHourTick;\n\t}\n\n\tconst diffInYears = Math.abs( differenceInYears( maxX, minX ) );\n\tif ( diffInYears <= 1 ) {\n\t\treturn formatDateTick;\n\t}\n\n\treturn formatYearTick;\n};\n\nconst guessOptimalNumTicks = (\n\tdata: ReturnType< typeof useChartDataTransform >,\n\tchartWidth: number,\n\ttickFormatter: ( timestamp: number ) => string\n) => {\n\tconst minX = Math.min( ...data.map( datom => datom.data.at( 0 )?.date ) );\n\tconst maxX = Math.max( ...data.map( datom => datom.data.at( -1 )?.date ) );\n\tconst xScale = scaleTime( { domain: [ minX, maxX ] } );\n\n\t// Calculate upper bound of tick numbers based on data points and chart width\n\tconst upperBound = Math.min( data[ 0 ]?.data.length, Math.ceil( chartWidth / X_TICK_WIDTH ) );\n\tlet secondBestGuess = 1; // a tick number that's no greater than upperBound\n\n\tfor ( let numTicks = upperBound; numTicks > 1; --numTicks ) {\n\t\tconst ticks = xScale.ticks( numTicks ).map( d => tickFormatter( d.getTime() ) );\n\n\t\t// The .ticks() function doesn't properly respect the requested number of ticks, so we need to check the length\n\t\tif ( ticks.length > upperBound ) {\n\t\t\tcontinue;\n\t\t}\n\n\t\tsecondBestGuess = Math.max( secondBestGuess, ticks.length );\n\n\t\tconst uniqueTicks = Array.from( new Set( ticks ) );\n\t\tif ( uniqueTicks.length === 1 ) {\n\t\t\t// All ticks are the same, so skip further processing\n\t\t\treturn 1;\n\t\t}\n\n\t\t// Example: OCT 1 JAN 1 APR 1 JUL 1 OCT 1\n\t\t// Here, the two OCTs are not duplicates as they represent October of two different years.\n\t\tconst hasConsecutiveDuplicate = ticks.some(\n\t\t\t( tick, idx ) => idx > 0 && tick === ticks[ idx - 1 ]\n\t\t);\n\n\t\tif ( hasConsecutiveDuplicate ) {\n\t\t\tcontinue;\n\t\t}\n\n\t\treturn ticks.length;\n\t}\n\n\treturn secondBestGuess;\n};\n\nconst validateData = ( data: SeriesData[] ) => {\n\tif ( ! data?.length ) return 'No data available';\n\n\tconst hasInvalidData = data.some( series =>\n\t\tseries.data.some(\n\t\t\t( point: DataPointDate | DataPoint ) =>\n\t\t\t\tisNaN( point.value as number ) ||\n\t\t\t\tpoint.value === null ||\n\t\t\t\tpoint.value === undefined ||\n\t\t\t\t( 'date' in point && point.date && isNaN( point.date.getTime() ) )\n\t\t)\n\t);\n\n\tif ( hasInvalidData ) return 'Invalid data';\n\treturn null;\n};\n\n// Inner component to access DataContext and provide scale data to ref\nconst LineChartScalesRef: FC< {\n\tchartRef?: Ref< SingleChartRef >;\n\twidth: number;\n\theight: number;\n\tmargin?: { top?: number; right?: number; bottom?: number; left?: number };\n} > = ( { chartRef, width, height, margin } ) => {\n\tconst context = useContext( DataContext );\n\n\tuseImperativeHandle(\n\t\tchartRef,\n\t\t() => ( {\n\t\t\tgetScales: () => {\n\t\t\t\tif ( ! context?.xScale || ! context?.yScale ) {\n\t\t\t\t\treturn null;\n\t\t\t\t}\n\t\t\t\treturn {\n\t\t\t\t\txScale: context.xScale,\n\t\t\t\t\tyScale: context.yScale,\n\t\t\t\t};\n\t\t\t},\n\t\t\tgetChartDimensions: () => ( {\n\t\t\t\twidth,\n\t\t\t\theight,\n\t\t\t\tmargin: margin || {},\n\t\t\t} ),\n\t\t} ),\n\t\t[ context, width, height, margin ]\n\t);\n\n\treturn null; // This component only provides the ref interface\n};\n\nconst LineChartInternal = forwardRef< SingleChartRef, LineChartProps >(\n\t(\n\t\t{\n\t\t\tdata,\n\t\t\tchartId: providedChartId,\n\t\t\twidth,\n\t\t\theight,\n\t\t\tclassName,\n\t\t\tmargin,\n\t\t\twithTooltips = true,\n\t\t\twithTooltipCrosshairs,\n\t\t\tshowLegend = false,\n\t\t\tlegendOrientation = 'horizontal',\n\t\t\tlegendAlignment = 'center',\n\t\t\tlegendPosition = 'bottom',\n\t\t\tlegendMaxWidth,\n\t\t\tlegendTextOverflow = 'wrap',\n\t\t\tlegendItemClassName,\n\t\t\trenderGlyph = defaultRenderGlyph,\n\t\t\tglyphStyle = {},\n\t\t\tlegendShape = 'line',\n\t\t\twithLegendGlyph = false,\n\t\t\twithGradientFill = false,\n\t\t\tsmoothing = true,\n\t\t\tcurveType,\n\t\t\trenderTooltip = renderDefaultTooltip,\n\t\t\twithStartGlyphs = false,\n\t\t\twithEndGlyphs = false,\n\t\t\tlegendInteractive = false,\n\t\t\tanimation,\n\t\t\toptions = {},\n\t\t\tonPointerDown = undefined,\n\t\t\tonPointerUp = undefined,\n\t\t\tonPointerMove = undefined,\n\t\t\tonPointerOut = undefined,\n\t\t\tchildren,\n\t\t},\n\t\tref\n\t) => {\n\t\tconst providerTheme = useGlobalChartsTheme();\n\t\tconst theme = useXYChartTheme( data );\n\t\tconst chartId = useChartId( providedChartId );\n\t\tconst [ legendRef, legendHeight ] = useElementHeight< HTMLDivElement >();\n\t\tconst chartRef = useRef< HTMLDivElement >( null );\n\t\tconst [ selectedIndex, setSelectedIndex ] = useState< number | undefined >( undefined );\n\t\tconst [ isNavigating, setIsNavigating ] = useState( false );\n\t\tconst internalChartRef = useRef< SingleChartRef >( null );\n\n\t\t// Forward the external ref to the internal ref\n\t\tuseImperativeHandle(\n\t\t\tref,\n\t\t\t() => ( {\n\t\t\t\tgetScales: () => internalChartRef.current?.getScales() || null,\n\t\t\t\tgetChartDimensions: () =>\n\t\t\t\t\tinternalChartRef.current?.getChartDimensions() || { width: 0, height: 0, margin: {} },\n\t\t\t} ),\n\t\t\t[ internalChartRef ]\n\t\t);\n\n\t\tconst dataSorted = useChartDataTransform( data );\n\t\tconst { getElementStyles, isSeriesVisible } = useGlobalChartsContext();\n\n\t\t// Add visibility information to series when using interactive legends\n\t\tconst seriesWithVisibility = useMemo( () => {\n\t\t\tif ( ! chartId || ! legendInteractive ) {\n\t\t\t\treturn dataSorted.map( ( series, index ) => ( { series, index, isVisible: true } ) );\n\t\t\t}\n\t\t\treturn dataSorted.map( ( series, index ) => ( {\n\t\t\t\tseries,\n\t\t\t\tindex,\n\t\t\t\tisVisible: isSeriesVisible( chartId, series.label ),\n\t\t\t} ) );\n\t\t}, [ dataSorted, chartId, isSeriesVisible, legendInteractive ] );\n\n\t\t// Check if all series are hidden\n\t\tconst allSeriesHidden = useMemo( () => {\n\t\t\treturn seriesWithVisibility.every( ( { isVisible } ) => ! isVisible );\n\t\t}, [ seriesWithVisibility ] );\n\n\t\t// Use the keyboard navigation hook\n\t\tconst { tooltipRef, onChartFocus, onChartBlur, onChartKeyDown } = useKeyboardNavigation( {\n\t\t\tselectedIndex,\n\t\t\tsetSelectedIndex,\n\t\t\tisNavigating,\n\t\t\tsetIsNavigating,\n\t\t\tchartRef,\n\t\t\ttotalPoints: dataSorted[ 0 ]?.data.length || 0,\n\t\t} );\n\n\t\tconst chartOptions = useMemo( () => {\n\t\t\tconst formatter = getFormatter( dataSorted );\n\n\t\t\treturn {\n\t\t\t\taxis: {\n\t\t\t\t\tx: {\n\t\t\t\t\t\torientation: 'bottom' as const,\n\t\t\t\t\t\tnumTicks: guessOptimalNumTicks( dataSorted, width, formatter ),\n\t\t\t\t\t\ttickFormat: formatter,\n\t\t\t\t\t\t...options?.axis?.x,\n\t\t\t\t\t},\n\t\t\t\t\ty: {\n\t\t\t\t\t\torientation: 'left' as const,\n\t\t\t\t\t\tnumTicks: 4,\n\t\t\t\t\t\ttickFormat: formatNumberCompact as TickFormatter< number >,\n\t\t\t\t\t\t...options?.axis?.y,\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\txScale: {\n\t\t\t\t\ttype: 'time' as const,\n\t\t\t\t\t...options?.xScale,\n\t\t\t\t},\n\t\t\t\tyScale: {\n\t\t\t\t\ttype: 'linear' as const,\n\t\t\t\t\tnice: true,\n\t\t\t\t\tzero: false,\n\t\t\t\t\t...options?.yScale,\n\t\t\t\t},\n\t\t\t};\n\t\t}, [ options, dataSorted, width ] );\n\n\t\tconst tooltipRenderGlyph = useMemo( () => {\n\t\t\treturn ( props: GlyphProps< DataPointDate > ) => {\n\t\t\t\tconst seriesIndex = dataSorted.findIndex(\n\t\t\t\t\tseries =>\n\t\t\t\t\t\tseries.label === props.key || series.data.includes( props.datum as DataPointDate )\n\t\t\t\t);\n\n\t\t\t\tconst seriesData = dataSorted[ seriesIndex ];\n\n\t\t\t\tconst { color, glyph: themeGlyph } = getElementStyles( {\n\t\t\t\t\tdata: seriesData,\n\t\t\t\t\tindex: seriesIndex,\n\t\t\t\t} );\n\n\t\t\t\tconst propsWithResolvedColor = { ...props, color };\n\n\t\t\t\treturn themeGlyph\n\t\t\t\t\t? themeGlyph( propsWithResolvedColor )\n\t\t\t\t\t: renderGlyph( propsWithResolvedColor );\n\t\t\t};\n\t\t}, [ dataSorted, renderGlyph, getElementStyles ] );\n\n\t\tconst defaultMargin = useChartMargin( height, chartOptions, dataSorted, theme );\n\n\t\tconst error = validateData( dataSorted );\n\t\tconst isDataValid = ! error;\n\n\t\t// Memoize legend options to prevent unnecessary re-calculations\n\t\tconst legendOptions = useMemo(\n\t\t\t() => ( {\n\t\t\t\twithGlyph: withLegendGlyph,\n\t\t\t\tglyphSize: Math.max( 0, toNumber( glyphStyle?.radius ) ?? 4 ),\n\t\t\t\trenderGlyph,\n\t\t\t} ),\n\t\t\t[ withLegendGlyph, glyphStyle?.radius, renderGlyph ]\n\t\t);\n\n\t\t// Create legend items using the reusable hook\n\t\tconst legendItems = useChartLegendItems( dataSorted, legendOptions, legendShape );\n\n\t\t// Memoize metadata to prevent unnecessary re-registration\n\t\tconst chartMetadata = useMemo(\n\t\t\t() => ( {\n\t\t\t\twithGradientFill,\n\t\t\t\tsmoothing,\n\t\t\t\tcurveType,\n\t\t\t\twithStartGlyphs,\n\t\t\t\twithEndGlyphs,\n\t\t\t\twithLegendGlyph,\n\t\t\t} ),\n\t\t\t[ withGradientFill, smoothing, curveType, withStartGlyphs, withEndGlyphs, withLegendGlyph ]\n\t\t);\n\n\t\t// Register chart with context only if data is valid\n\t\tuseChartRegistration( {\n\t\t\tchartId,\n\t\t\tlegendItems,\n\t\t\tchartType: 'line',\n\t\t\tisDataValid,\n\t\t\tmetadata: chartMetadata,\n\t\t} );\n\n\t\tconst accessors = {\n\t\t\txAccessor: ( d: DataPointDate ) => d?.date,\n\t\t\tyAccessor: ( d: DataPointDate ) => d?.value,\n\t\t};\n\n\t\t// Create a custom renderTooltip that includes focus capability\n\t\tif ( error ) {\n\t\t\treturn <div className={ clsx( 'line-chart', styles[ 'line-chart' ] ) }>{ error }</div>;\n\t\t}\n\n\t\treturn (\n\t\t\t<SingleChartContext.Provider\n\t\t\t\tvalue={ {\n\t\t\t\t\tchartId,\n\t\t\t\t\tchartRef: internalChartRef,\n\t\t\t\t\tchartWidth: width,\n\t\t\t\t\tchartHeight: height - ( showLegend ? legendHeight : 0 ),\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t'line-chart',\n\t\t\t\t\t\tstyles[ 'line-chart' ],\n\t\t\t\t\t\t{ [ styles[ 'line-chart--animated' ] ]: animation },\n\t\t\t\t\t\t{ [ styles[ 'line-chart--legend-top' ] ]: showLegend && legendPosition === 'top' },\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tdata-testid=\"line-chart\"\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\twidth,\n\t\t\t\t\t\theight,\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\trole=\"grid\"\n\t\t\t\t\t\taria-label={ __( 'Line chart', 'jetpack-charts' ) }\n\t\t\t\t\t\ttabIndex={ 0 }\n\t\t\t\t\t\tonKeyDown={ onChartKeyDown }\n\t\t\t\t\t\tonFocus={ onChartFocus }\n\t\t\t\t\t\tonBlur={ onChartBlur }\n\t\t\t\t\t\tref={ chartRef }\n\t\t\t\t\t>\n\t\t\t\t\t\t<XYChart\n\t\t\t\t\t\t\ttheme={ theme }\n\t\t\t\t\t\t\twidth={ width }\n\t\t\t\t\t\t\theight={ height - ( showLegend ? legendHeight : 0 ) }\n\t\t\t\t\t\t\tmargin={ {\n\t\t\t\t\t\t\t\t...defaultMargin,\n\t\t\t\t\t\t\t\t...margin,\n\t\t\t\t\t\t\t\t...( showLegend && legendPosition === 'top'\n\t\t\t\t\t\t\t\t\t? { top: ( defaultMargin.top || 0 ) + legendHeight }\n\t\t\t\t\t\t\t\t\t: {} ),\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t// xScale and yScale could be set in Axis as well, but they are `scale` props there.\n\t\t\t\t\t\t\txScale={ chartOptions.xScale }\n\t\t\t\t\t\t\tyScale={ chartOptions.yScale }\n\t\t\t\t\t\t\tonPointerDown={ onPointerDown }\n\t\t\t\t\t\t\tonPointerUp={ onPointerUp }\n\t\t\t\t\t\t\tonPointerMove={ onPointerMove }\n\t\t\t\t\t\t\tonPointerOut={ onPointerOut }\n\t\t\t\t\t\t\tpointerEventsDataKey=\"nearest\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Grid columns={ false } numTicks={ 4 } />\n\t\t\t\t\t\t\t<Axis { ...chartOptions.axis.x } />\n\t\t\t\t\t\t\t<Axis { ...chartOptions.axis.y } />\n\n\t\t\t\t\t\t\t{ allSeriesHidden ? (\n\t\t\t\t\t\t\t\t<text\n\t\t\t\t\t\t\t\t\tx={ width / 2 }\n\t\t\t\t\t\t\t\t\ty={ ( height - ( showLegend ? legendHeight : 0 ) ) / 2 }\n\t\t\t\t\t\t\t\t\ttextAnchor=\"middle\"\n\t\t\t\t\t\t\t\t\tfill={ providerTheme.gridStyles?.stroke || '#ccc' }\n\t\t\t\t\t\t\t\t\tfontSize=\"14\"\n\t\t\t\t\t\t\t\t\tfontFamily=\"-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t\t'All series are hidden. Click legend items to show data.',\n\t\t\t\t\t\t\t\t\t\t'jetpack-charts'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</text>\n\t\t\t\t\t\t\t) : null }\n\n\t\t\t\t\t\t\t{ seriesWithVisibility.map( ( { series: seriesData, index, isVisible } ) => {\n\t\t\t\t\t\t\t\t// Skip rendering invisible series\n\t\t\t\t\t\t\t\tif ( ! isVisible ) {\n\t\t\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\tconst { color, lineStyles, glyph } = getElementStyles( {\n\t\t\t\t\t\t\t\t\tdata: seriesData,\n\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t} );\n\n\t\t\t\t\t\t\t\tconst lineProps = {\n\t\t\t\t\t\t\t\t\tstroke: color,\n\t\t\t\t\t\t\t\t\t...lineStyles,\n\t\t\t\t\t\t\t\t};\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<g key={ seriesData?.label || index }>\n\t\t\t\t\t\t\t\t\t\t{ withGradientFill && (\n\t\t\t\t\t\t\t\t\t\t\t<LinearGradient\n\t\t\t\t\t\t\t\t\t\t\t\tid={ `area-gradient-${ chartId }-${ index + 1 }` }\n\t\t\t\t\t\t\t\t\t\t\t\tfrom={ color }\n\t\t\t\t\t\t\t\t\t\t\t\tfromOpacity={ 0.4 }\n\t\t\t\t\t\t\t\t\t\t\t\ttoOpacity={ 0.1 }\n\t\t\t\t\t\t\t\t\t\t\t\tto={ providerTheme.backgroundColor }\n\t\t\t\t\t\t\t\t\t\t\t\t{ ...seriesData.options?.gradient }\n\t\t\t\t\t\t\t\t\t\t\t\tdata-testid=\"line-gradient\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{ seriesData.options?.gradient?.stops?.map( ( stop, stopIndex ) => (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<stop\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={ `${ stop.offset }-${ stop.color || color }` }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\toffset={ stop.offset }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tstopColor={ stop.color || color }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tstopOpacity={ stop.opacity ?? 1 }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdata-testid={ `line-gradient-stop-${ chartId }-${ index }-${ stopIndex }` }\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t\t\t\t\t</LinearGradient>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t<AreaSeries\n\t\t\t\t\t\t\t\t\t\t\tkey={ seriesData?.label }\n\t\t\t\t\t\t\t\t\t\t\tdataKey={ seriesData?.label }\n\t\t\t\t\t\t\t\t\t\t\tdata={ seriesData.data as DataPointDate[] }\n\t\t\t\t\t\t\t\t\t\t\t{ ...accessors }\n\t\t\t\t\t\t\t\t\t\t\tfill={\n\t\t\t\t\t\t\t\t\t\t\t\twithGradientFill\n\t\t\t\t\t\t\t\t\t\t\t\t\t? `url(#area-gradient-${ chartId }-${ index + 1 })`\n\t\t\t\t\t\t\t\t\t\t\t\t\t: 'transparent'\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\trenderLine={ true }\n\t\t\t\t\t\t\t\t\t\t\tcurve={ getCurveType( curveType, smoothing ) }\n\t\t\t\t\t\t\t\t\t\t\tlineProps={ lineProps }\n\t\t\t\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t\t\t\t{ withStartGlyphs && (\n\t\t\t\t\t\t\t\t\t\t\t<LineChartGlyph\n\t\t\t\t\t\t\t\t\t\t\t\tindex={ index }\n\t\t\t\t\t\t\t\t\t\t\t\tdata={ seriesData }\n\t\t\t\t\t\t\t\t\t\t\t\tcolor={ color }\n\t\t\t\t\t\t\t\t\t\t\t\trenderGlyph={ glyph ?? renderGlyph }\n\t\t\t\t\t\t\t\t\t\t\t\taccessors={ accessors }\n\t\t\t\t\t\t\t\t\t\t\t\tglyphStyle={ glyphStyle }\n\t\t\t\t\t\t\t\t\t\t\t\tposition=\"start\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t\t\t\t\t{ withEndGlyphs && (\n\t\t\t\t\t\t\t\t\t\t\t<LineChartGlyph\n\t\t\t\t\t\t\t\t\t\t\t\tindex={ index }\n\t\t\t\t\t\t\t\t\t\t\t\tdata={ seriesData }\n\t\t\t\t\t\t\t\t\t\t\t\tcolor={ color }\n\t\t\t\t\t\t\t\t\t\t\t\trenderGlyph={ glyph ?? renderGlyph }\n\t\t\t\t\t\t\t\t\t\t\t\taccessors={ accessors }\n\t\t\t\t\t\t\t\t\t\t\t\tglyphStyle={ glyphStyle }\n\t\t\t\t\t\t\t\t\t\t\t\tposition=\"end\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</g>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} ) }\n\n\t\t\t\t\t\t\t{ withTooltips && (\n\t\t\t\t\t\t\t\t<AccessibleTooltip\n\t\t\t\t\t\t\t\t\tdetectBounds\n\t\t\t\t\t\t\t\t\tsnapTooltipToDatumX\n\t\t\t\t\t\t\t\t\tsnapTooltipToDatumY\n\t\t\t\t\t\t\t\t\tshowSeriesGlyphs\n\t\t\t\t\t\t\t\t\trenderTooltip={ renderTooltip }\n\t\t\t\t\t\t\t\t\trenderGlyph={ tooltipRenderGlyph }\n\t\t\t\t\t\t\t\t\tglyphStyle={ glyphStyle }\n\t\t\t\t\t\t\t\t\tshowVerticalCrosshair={ withTooltipCrosshairs?.showVertical }\n\t\t\t\t\t\t\t\t\tshowHorizontalCrosshair={ withTooltipCrosshairs?.showHorizontal }\n\t\t\t\t\t\t\t\t\tselectedIndex={ selectedIndex }\n\t\t\t\t\t\t\t\t\ttooltipRef={ tooltipRef }\n\t\t\t\t\t\t\t\t\tkeyboardFocusedClassName={ styles[ 'line-chart__tooltip--keyboard-focused' ] }\n\t\t\t\t\t\t\t\t\tseries={ dataSorted }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t\t{ /* Component to expose scale data via ref */ }\n\t\t\t\t\t\t\t<LineChartScalesRef\n\t\t\t\t\t\t\t\tchartRef={ internalChartRef }\n\t\t\t\t\t\t\t\twidth={ width }\n\t\t\t\t\t\t\t\theight={ height }\n\t\t\t\t\t\t\t\tmargin={ margin }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</XYChart>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{ showLegend && (\n\t\t\t\t\t\t<Legend\n\t\t\t\t\t\t\torientation={ legendOrientation }\n\t\t\t\t\t\t\talignment={ legendAlignment }\n\t\t\t\t\t\t\tposition={ legendPosition }\n\t\t\t\t\t\t\tmaxWidth={ legendMaxWidth }\n\t\t\t\t\t\t\ttextOverflow={ legendTextOverflow }\n\t\t\t\t\t\t\tlegendItemClassName={ legendItemClassName }\n\t\t\t\t\t\t\tclassName={ styles[ 'line-chart-legend' ] }\n\t\t\t\t\t\t\tshape={ legendShape }\n\t\t\t\t\t\t\tchartId={ chartId }\n\t\t\t\t\t\t\tinteractive={ legendInteractive }\n\t\t\t\t\t\t\tref={ legendRef }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ children }\n\t\t\t\t</div>\n\t\t\t</SingleChartContext.Provider>\n\t\t);\n\t}\n);\n\n// Component type definitions for composition API\ntype LineChartAnnotationComponents = {\n\tAnnotationsOverlay: typeof LineChartAnnotationsOverlay;\n\tAnnotation: typeof LineChartAnnotation;\n\tLegend: typeof Legend;\n};\n\ntype LineChartBaseProps = Optional< LineChartProps, 'width' | 'height' | 'size' >;\n\ntype LineChartComponent = React.ForwardRefExoticComponent<\n\tLineChartBaseProps & React.RefAttributes< SingleChartRef >\n> &\n\tLineChartAnnotationComponents;\n\ntype LineChartResponsiveComponent = React.ForwardRefExoticComponent<\n\tLineChartBaseProps & ResponsiveConfig & React.RefAttributes< SingleChartRef >\n> &\n\tLineChartAnnotationComponents;\n\nconst LineChartWithProvider = forwardRef< SingleChartRef, LineChartProps >( ( props, ref ) => {\n\tconst existingContext = useContext( GlobalChartsContext );\n\n\t// If we're already in a GlobalChartsProvider context, render the core component directly\n\tif ( existingContext ) {\n\t\treturn <LineChartInternal { ...props } ref={ ref } />;\n\t}\n\n\t// Otherwise, wrap with our own GlobalChartsProvider\n\treturn (\n\t\t<GlobalChartsProvider>\n\t\t\t<LineChartInternal { ...props } ref={ ref } />\n\t\t</GlobalChartsProvider>\n\t);\n} );\n\nLineChartWithProvider.displayName = 'LineChart';\n\nconst LineChart = attachSubComponents( LineChartWithProvider, {\n\tLegend: Legend,\n\tAnnotationsOverlay: LineChartAnnotationsOverlay,\n\tAnnotation: LineChartAnnotation,\n} ) as LineChartComponent;\n\nconst LineChartResponsive = attachSubComponents(\n\twithResponsive< LineChartProps >( LineChartWithProvider ),\n\t{\n\t\tLegend: Legend,\n\t\tAnnotationsOverlay: LineChartAnnotationsOverlay,\n\t\tAnnotation: LineChartAnnotation,\n\t}\n) as LineChartResponsiveComponent;\n\nexport { LineChartResponsive as default, LineChart as LineChartUnresponsive };\n","import { DataContext } from '@visx/xychart';\nimport { useContext } from 'react';\nimport type { RenderLineGlyphProps } from '../../line-chart';\n\nexport const DefaultGlyph = < Datum extends object >( props: RenderLineGlyphProps< Datum > ) => {\n\tconst { theme } = useContext( DataContext ) || {};\n\tconst position = props.position || 'start';\n\n\treturn (\n\t\t<circle\n\t\t\tcx={ props.x }\n\t\t\tcy={ props.y }\n\t\t\tr={ props.size }\n\t\t\tfill={ props.color }\n\t\t\tstroke={ theme?.backgroundColor }\n\t\t\tstrokeWidth={ 1.5 }\n\t\t\tpaintOrder=\"fill\"\n\t\t\tdata-testid={ `${ position }-glyph-${ props.index }` }\n\t\t\t{ ...props.glyphStyle }\n\t\t/>\n\t);\n};\n","import 'css-chunk:src/components/line-chart/line-chart.module.scss';export default {\n \"line-chart\": \"a8ccharts-ITM3dm\",\n \"line-chart--animated\": \"a8ccharts-fXvEBi\",\n \"rise\": \"a8ccharts-gb7M8E\",\n \"line-chart--legend-top\": \"a8ccharts-zQLTUG\",\n \"line-chart__tooltip\": \"a8ccharts-aqcmeq\",\n \"line-chart__annotation-label-popover\": \"a8ccharts-TqNZkh\",\n \"line-chart__tooltip-date\": \"a8ccharts-4Dzab-\",\n \"line-chart__tooltip-row\": \"a8ccharts-6A37Gb\",\n \"line-chart__tooltip-label\": \"a8ccharts-IvnFFF\",\n \"line-chart__annotations-overlay\": \"a8ccharts-4nR2pv\",\n \"line-chart__annotation-label\": \"a8ccharts-OmgiTA\",\n \"line-chart__annotation-label-trigger-button\": \"a8ccharts-mcIb3E\",\n \"line-chart__annotation-label-popover--visible\": \"a8ccharts-dE0cVP\",\n \"line-chart__annotation-label-popover--safari\": \"a8ccharts-i3NHTh\",\n \"line-chart__annotation-label-popover-header\": \"a8ccharts-OwypoS\",\n \"line-chart__annotation-label-popover-content\": \"a8ccharts-vtgQtP\",\n \"line-chart__annotation-label-popover-close-button\": \"a8ccharts-i8KUcG\"\n};","import { __ } from '@wordpress/i18n';\nimport clsx from 'clsx';\nimport Gridicon from 'gridicons';\nimport { useEffect, useId, useRef, useState } from 'react';\nimport { isSafari } from '../../../utils';\nimport styles from '../line-chart.module.scss';\nimport type { ButtonWithPopover, PopoverElement, ToggleEvent } from '../../../types';\nimport type { FC } from 'react';\n\nexport const POPOVER_BUTTON_SIZE = 44;\n\ninterface LineChartAnnotationLabelWithPopoverProps {\n\ttitle: string;\n\tsubtitle?: string;\n\trenderLabel: FC< { title: string; subtitle?: string } >;\n\trenderLabelPopover: FC< { title: string; subtitle?: string } >;\n}\n\nconst LineChartAnnotationLabelWithPopover: FC< LineChartAnnotationLabelWithPopoverProps > = ( {\n\ttitle,\n\tsubtitle,\n\trenderLabel,\n\trenderLabelPopover,\n} ) => {\n\tconst popoverId = useId();\n\tconst buttonRef = useRef< HTMLButtonElement >( null );\n\tconst popoverRef = useRef< HTMLDivElement >( null );\n\tconst [ isPositioned, setIsPositioned ] = useState( false );\n\tconst isBrowserSafari = isSafari();\n\n\tuseEffect( () => {\n\t\tconst button = buttonRef.current;\n\t\tconst popover = popoverRef.current;\n\n\t\tif ( ! button || ! popover ) return;\n\n\t\tconst positionPopover = () => {\n\t\t\t// Popover positioning in Safari is complicated due to issues with SVG foreign objects (https://bugs.webkit.org/show_bug.cgi?id=23113), so let it be positioned in the centre of the viewport.\n\t\t\tif ( ! isBrowserSafari ) {\n\t\t\t\tconst buttonRect = button.getBoundingClientRect();\n\t\t\t\tpopover.style.left = `${ buttonRect.right }px`;\n\t\t\t\tpopover.style.top = `${ buttonRect.top }px`;\n\t\t\t}\n\n\t\t\tsetIsPositioned( true );\n\t\t};\n\n\t\t// Position when popover shows\n\t\tpopover.addEventListener( 'toggle', ( e: ToggleEvent ) => {\n\t\t\tif ( e.newState === 'open' ) {\n\t\t\t\tpositionPopover();\n\t\t\t}\n\t\t} );\n\n\t\t// Initial positioning if already open\n\t\ttry {\n\t\t\tif ( popover.matches( ':popover-open' ) ) {\n\t\t\t\tpositionPopover();\n\t\t\t}\n\t\t} catch {\n\t\t\t// Ignore errors in test environments (e.g., JSDOM does not support :popover-open)\n\t\t}\n\t}, [ isBrowserSafari ] );\n\n\treturn (\n\t\t<div className={ styles[ 'line-chart__annotation-label' ] }>\n\t\t\t<button\n\t\t\t\tref={ buttonRef }\n\t\t\t\t{ ...( { popovertarget: popoverId } as ButtonWithPopover ) }\n\t\t\t\tclassName={ styles[ 'line-chart__annotation-label-trigger-button' ] }\n\t\t\t\tstyle={ {\n\t\t\t\t\twidth: `${ POPOVER_BUTTON_SIZE }px`,\n\t\t\t\t\theight: `${ POPOVER_BUTTON_SIZE }px`,\n\t\t\t\t\ttransform: `translate(${ POPOVER_BUTTON_SIZE / 2 }px, 0)`,\n\t\t\t\t} }\n\t\t\t\taria-label={ title || __( 'View details', 'jetpack-charts' ) }\n\t\t\t>\n\t\t\t\t{ renderLabel( { title, subtitle } ) }\n\t\t\t</button>\n\t\t\t<div\n\t\t\t\tref={ popoverRef }\n\t\t\t\tid={ popoverId }\n\t\t\t\t{ ...( { popover: 'auto' } as PopoverElement ) }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tstyles[ 'line-chart__annotation-label-popover' ],\n\t\t\t\t\tisPositioned && styles[ 'line-chart__annotation-label-popover--visible' ],\n\t\t\t\t\tisBrowserSafari && styles[ 'line-chart__annotation-label-popover--safari' ]\n\t\t\t\t) }\n\t\t\t\tdata-testid=\"line-chart-annotation-label-popover\"\n\t\t\t>\n\t\t\t\t<div className={ styles[ 'line-chart__annotation-label-popover-header' ] }>\n\t\t\t\t\t<div className={ styles[ 'line-chart__annotation-label-popover-content' ] }>\n\t\t\t\t\t\t{ renderLabelPopover( { title, subtitle } ) }\n\t\t\t\t\t</div>\n\t\t\t\t\t<button\n\t\t\t\t\t\t{ ...( {\n\t\t\t\t\t\t\tpopovertarget: popoverId,\n\t\t\t\t\t\t\tpopovertargetaction: 'hide',\n\t\t\t\t\t\t} as ButtonWithPopover ) }\n\t\t\t\t\t\tclassName={ styles[ 'line-chart__annotation-label-popover-close-button' ] }\n\t\t\t\t\t\taria-label={ __( 'Close', 'jetpack-charts' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Gridicon icon=\"cross\" size={ 16 } />\n\t\t\t\t\t</button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nexport default LineChartAnnotationLabelWithPopover;\n","import { DataContext } from '@visx/xychart';\nimport { useEffect, useState, useCallback } from 'react';\nimport { useSingleChartContext } from '../../private/single-chart-context';\nimport styles from '../line-chart.module.scss';\nimport type { AxisScale } from '@visx/axis';\nimport type { FC, ReactNode } from 'react';\n\nexport interface LineChartAnnotationsProps {\n\tchildren?: ReactNode;\n}\n\ninterface ScaleData {\n\txScale: AxisScale< Date >;\n\tyScale: AxisScale< number >;\n}\n\nconst LineChartAnnotationsOverlay: FC< LineChartAnnotationsProps > = ( { children } ) => {\n\tconst { chartRef, chartWidth, chartHeight } = useSingleChartContext();\n\n\tconst [ scales, setScales ] = useState< ScaleData | null >( null );\n\tconst [ scalesStable, setScalesStable ] = useState< boolean >( false );\n\n\t// Create a signature for scale data to enable easy comparison\n\tconst createScaleSignature = useCallback( ( scaleData: ScaleData ) => {\n\t\tconst xDomain = scaleData.xScale.domain();\n\t\tconst yDomain = scaleData.yScale.domain();\n\t\tconst xRange = scaleData.xScale.range();\n\t\tconst yRange = scaleData.yScale.range();\n\n\t\treturn `${ xDomain.join( ',' ) }-${ yDomain.join( ',' ) }-${ xRange.join(\n\t\t\t','\n\t\t) }-${ yRange.join( ',' ) }`;\n\t}, [] );\n\n\t// Get scales from chart ref and return them with signature for comparison\n\tconst getScalesData = useCallback( () => {\n\t\tif ( chartRef?.current ) {\n\t\t\tconst scaleData = chartRef.current.getScales();\n\n\t\t\tif ( scaleData ) {\n\t\t\t\tconst scaleInfo = {\n\t\t\t\t\txScale: scaleData.xScale as AxisScale< Date >,\n\t\t\t\t\tyScale: scaleData.yScale as AxisScale< number >,\n\t\t\t\t};\n\n\t\t\t\treturn {\n\t\t\t\t\tscales: scaleInfo,\n\t\t\t\t\tsignature: createScaleSignature( scaleInfo ),\n\t\t\t\t};\n\t\t\t}\n\t\t}\n\n\t\treturn null;\n\t}, [ chartRef, createScaleSignature ] );\n\n\t// The chart resizes on render so we need to monitor the scales until they stabilize\n\tuseEffect( () => {\n\t\tlet timeoutId: number | null = null;\n\t\tlet lastSignature: string | null = null;\n\t\tlet retryCount = 0;\n\t\tconst maxRetries = 20; // 20 * 50ms = 1 second max\n\t\tconst checkInterval = 50; // Check every 50ms\n\n\t\t// Reset stability state when monitoring starts\n\t\tsetScalesStable( false );\n\n\t\tconst monitorScales = () => {\n\t\t\tconst currentScaleData = getScalesData();\n\n\t\t\t// If we got scales, compare signatures\n\t\t\tif ( currentScaleData ) {\n\t\t\t\t// Check if scales have settled by comparing signatures\n\t\t\t\tconst scalesSettled = lastSignature && currentScaleData.signature === lastSignature;\n\n\t\t\t\tif ( scalesSettled ) {\n\t\t\t\t\t// Scales have stabilized, mark as stable\n\t\t\t\t\tsetScalesStable( true );\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Update scales and remember signature for next comparison\n\t\t\t\tsetScales( currentScaleData.scales );\n\t\t\t\tlastSignature = currentScaleData.signature;\n\t\t\t}\n\n\t\t\t// Continue monitoring if we haven't exceeded max retries\n\t\t\tif ( retryCount < maxRetries ) {\n\t\t\t\tretryCount++;\n\t\t\t\ttimeoutId = setTimeout( monitorScales, checkInterval ) as unknown as number;\n\t\t\t}\n\t\t};\n\n\t\tmonitorScales();\n\n\t\treturn () => {\n\t\t\tif ( timeoutId ) {\n\t\t\t\tclearTimeout( timeoutId );\n\t\t\t}\n\t\t};\n\t}, [ getScalesData, chartWidth, chartHeight ] );\n\n\t// Early return if no chart data available\n\tif ( ! chartRef || ! children ) {\n\t\treturn null;\n\t}\n\n\tif ( ! scales || ! scalesStable ) {\n\t\treturn null;\n\t}\n\n\t// Create a DataContext value that mimics what visx provides\n\t// We're intentionally providing minimal context for annotations to work\n\tconst dataContextValue = {\n\t\txScale: scales.xScale,\n\t\tyScale: scales.yScale,\n\t\tmargin: { top: 0, right: 0, bottom: 0, left: 0 },\n\t\twidth: chartWidth,\n\t\theight: chartHeight,\n\t} as unknown as Parameters< typeof DataContext.Provider >[ 0 ][ 'value' ];\n\n\treturn (\n\t\t<DataContext.Provider value={ dataContextValue }>\n\t\t\t<svg\n\t\t\t\twidth={ chartWidth }\n\t\t\t\theight={ chartHeight }\n\t\t\t\tclassName={ styles[ 'line-chart__annotations-overlay' ] }\n\t\t\t\tdata-testid=\"line-chart-annotations-overlay\"\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</svg>\n\t\t</DataContext.Provider>\n\t);\n};\n\nexport default LineChartAnnotationsOverlay;\n","import {\n\tAnnotation,\n\tCircleSubject,\n\tConnector,\n\tHtmlLabel,\n\tLabel,\n\tLineSubject,\n} from '@visx/annotation';\nimport { DataContext } from '@visx/xychart';\nimport merge from 'deepmerge';\nimport { useContext, useRef, useEffect, useState, useMemo } from 'react';\nimport { useGlobalChartsTheme } from '../../../providers';\nimport { isSafari } from '../../../utils';\nimport LineChartAnnotationLabelWithPopover, {\n\tPOPOVER_BUTTON_SIZE,\n} from './line-chart-annotation-label-popover';\nimport type { LineChartAnnotationProps } from '../types';\nimport type { LabelProps } from '@visx/annotation/lib/components/Label';\nimport type { TextProps } from '@visx/text';\nimport type { FC } from 'react';\n\ntype SubjectType = 'circle' | 'line-vertical' | 'line-horizontal';\n\nconst ANNOTATION_MAX_WIDTH = 125; // visx default\nconst ANNOTATION_INIT_HEIGHT = 100;\n\nexport const getLabelPosition = ( {\n\tsubjectType,\n\tx,\n\txMax,\n\ty,\n\tyMin,\n\tyMax,\n\tmaxWidth,\n\theight,\n}: {\n\tsubjectType: SubjectType;\n\tx: number;\n\txMax: number;\n\ty: number;\n\tyMin: number;\n\tyMax: number;\n\tmaxWidth?: number;\n\theight?: number | null;\n} ): {\n\tdx: number;\n\tdy: number;\n\tisFlippedHorizontally: boolean;\n\tisFlippedVertically: boolean;\n} => {\n\tconst annotationMaxWidth = maxWidth ?? ANNOTATION_MAX_WIDTH;\n\tconst annotationHeight = height ?? ANNOTATION_INIT_HEIGHT;\n\tlet dx = 15;\n\tlet dy = 15;\n\tlet isFlippedHorizontally = false;\n\tlet isFlippedVertically = false;\n\n\tif ( subjectType === 'line-horizontal' ) {\n\t\tdx = 0;\n\t\tdy = 20;\n\t}\n\n\tif ( subjectType === 'line-vertical' ) {\n\t\tdx = 20;\n\t\tdy = 0;\n\t}\n\n\t// Smart horizontal positioning: if annotation would extend beyond right edge, position it to the left\n\t// Account for the connector offset (dx) in boundary calculations\n\tconst effectiveX = x + dx;\n\n\tif ( effectiveX + annotationMaxWidth > xMax ) {\n\t\tisFlippedHorizontally = true;\n\n\t\tif ( subjectType === 'circle' ) {\n\t\t\tdx = -dx; // Just flip to the left side with same offset\n\t\t} else if ( subjectType === 'line-vertical' ) {\n\t\t\tdx = -20; // Position to the left of the line\n\t\t}\n\t}\n\n\t// Smart vertical positioning: check both top and bottom edges\n\t// For circle annotations, they are positioned below by default (dy > 0)\n\t// Only flip when close to bottom edge to position above\n\tif ( subjectType === 'circle' ) {\n\t\t// Check if positioning below would extend beyond bottom edge\n\t\tif ( y + dy + annotationHeight > yMin ) {\n\t\t\t// Too close to bottom edge, position above\n\t\t\tisFlippedVertically = true;\n\t\t\tdy = -Math.abs( dy ); // Ensure negative value to position above the point\n\t\t}\n\t\t// When close to top edge, keep default below positioning (no flip needed)\n\t} else if ( y - annotationHeight < yMax ) {\n\t\t// Too close to top edge, position below\n\t\tif ( subjectType === 'line-horizontal' ) {\n\t\t\tisFlippedVertically = true;\n\t\t\tdy = Math.abs( dy ); // Ensure positive value to position below the point\n\t\t} else if ( subjectType === 'line-vertical' ) {\n\t\t\tisFlippedVertically = true; // For anchor adjustment only\n\t\t}\n\t} else if ( y + annotationHeight > yMin ) {\n\t\t// Too close to bottom edge, position above\n\t\tif ( subjectType === 'line-horizontal' ) {\n\t\t\tisFlippedVertically = true;\n\t\t\tdy = -Math.abs( dy ); // Ensure negative value to position above the point\n\t\t} else if ( subjectType === 'line-vertical' ) {\n\t\t\tisFlippedVertically = true; // For anchor adjustment only\n\t\t}\n\t}\n\n\treturn { dx, dy, isFlippedHorizontally, isFlippedVertically };\n};\n\nconst getHorizontalAnchor = (\n\tsubjectType: SubjectType,\n\tisFlippedHorizontally: boolean\n): LabelProps[ 'horizontalAnchor' ] => {\n\tif ( subjectType === 'line-horizontal' ) {\n\t\treturn isFlippedHorizontally ? 'end' : 'start';\n\t}\n\n\treturn undefined;\n};\n\nconst getVerticalAnchor = (\n\tsubjectType: SubjectType,\n\tisFlippedVertically: boolean,\n\ty: number,\n\tyMax: number,\n\theight: number\n): TextProps[ 'verticalAnchor' ] => {\n\tif ( subjectType === 'line-vertical' ) {\n\t\tif ( isFlippedVertically ) {\n\t\t\t// If flipped due to top edge, anchor to top; if flipped due to bottom edge, anchor to bottom\n\t\t\treturn y - height < yMax ? 'start' : 'end';\n\t\t}\n\n\t\treturn 'start';\n\t}\n\n\treturn undefined;\n};\n\nconst LineChartAnnotation: FC< LineChartAnnotationProps > = ( {\n\tdatum,\n\ttitle,\n\tsubtitle,\n\tsubjectType = 'circle',\n\tstyles: datumStyles,\n\ttestId,\n\trenderLabel,\n\trenderLabelPopover,\n} ) => {\n\tconst providerTheme = useGlobalChartsTheme();\n\tconst { xScale, yScale } = useContext( DataContext ) || {};\n\tconst labelRef = useRef< SVGGElement >( null );\n\tconst [ height, setHeight ] = useState< number | null >( null );\n\n\t// Deep merge styles to preserve nested object properties\n\tconst styles = merge( providerTheme.annotationStyles ?? {}, datumStyles ?? {} );\n\n\t// Measure the label height once after initial render\n\tuseEffect( () => {\n\t\tif ( labelRef.current?.getBBox ) {\n\t\t\tconst bbox = labelRef.current.getBBox();\n\t\t\tsetHeight( bbox.height );\n\t\t}\n\t}, [] );\n\n\tconst positionData = useMemo( () => {\n\t\tif ( ! datum || ! datum.date || datum.value == null || ! xScale || ! yScale ) return null;\n\n\t\tconst x = xScale( datum.date );\n\t\tconst y = yScale( datum.value );\n\n\t\tif ( typeof x !== 'number' || typeof y !== 'number' ) return null;\n\n\t\tconst [ yMin, yMax ] = yScale.range().map( Number );\n\t\tconst [ xMin, xMax ] = xScale.range().map( Number );\n\n\t\t// If a custom label is provided, use the provided position\n\t\tif ( renderLabel ) {\n\t\t\treturn {\n\t\t\t\tx,\n\t\t\t\tdx: 0,\n\t\t\t\ty,\n\t\t\t\tdy: 0,\n\t\t\t\tyMin,\n\t\t\t\tyMax,\n\t\t\t\txMin,\n\t\t\t\txMax,\n\t\t\t\tisFlippedHorizontally: false,\n\t\t\t\tisFlippedVertically: false,\n\t\t\t};\n\t\t}\n\n\t\tconst position = getLabelPosition( {\n\t\t\tsubjectType,\n\t\t\tx,\n\t\t\txMax,\n\t\t\ty,\n\t\t\tyMin,\n\t\t\tyMax,\n\t\t\tmaxWidth: styles?.label?.maxWidth,\n\t\t\theight,\n\t\t} );\n\n\t\treturn { x, y, yMin, yMax, xMin, xMax, ...position };\n\t}, [ datum, xScale, yScale, subjectType, styles?.label?.maxWidth, height, renderLabel ] );\n\n\tif ( ! positionData ) return null;\n\n\tconst { x, y, yMin, yMax, xMin, xMax, dx, dy, isFlippedHorizontally, isFlippedVertically } =\n\t\tpositionData;\n\n\tconst getLabelY = () => {\n\t\tconst labelY = styles?.label?.y;\n\n\t\tif ( labelY === 'start' ) return yMax;\n\t\tif ( labelY === 'end' ) return yMin;\n\n\t\treturn labelY;\n\t};\n\n\tconst getLabelX = () => {\n\t\tconst labelX = styles?.label?.x;\n\n\t\tif ( labelX === 'start' ) return xMin;\n\t\tif ( labelX === 'end' ) return xMax;\n\n\t\treturn labelX;\n\t};\n\n\tconst labelPosition = {\n\t\tx: getLabelX(),\n\t\ty: getLabelY(),\n\t};\n\n\t// Safari has a bug where children of an SVG foreignObject are not positioned correctly https://bugs.webkit.org/show_bug.cgi?id=23113\n\t// This is a workaround to position the label correctly\n\tconst getSafariHTMLLabelPosition = () => {\n\t\tconst labelWidth = POPOVER_BUTTON_SIZE;\n\t\tconst labelHeight = POPOVER_BUTTON_SIZE;\n\n\t\treturn isSafari()\n\t\t\t? {\n\t\t\t\t\ttransform: `translate(${\n\t\t\t\t\t\tx +\n\t\t\t\t\t\t( dx || 0 ) +\n\t\t\t\t\t\t( typeof labelPosition.x === 'number' ? labelPosition.x - x : 0 ) -\n\t\t\t\t\t\tlabelWidth\n\t\t\t\t\t}px, ${\n\t\t\t\t\t\ty +\n\t\t\t\t\t\t( dy || 0 ) +\n\t\t\t\t\t\t( typeof labelPosition.y === 'number' ? labelPosition.y - y : 0 ) -\n\t\t\t\t\t\tlabelHeight\n\t\t\t\t\t}px)`,\n\t\t\t\t\twidth: labelWidth,\n\t\t\t\t\theight: labelHeight,\n\t\t\t }\n\t\t\t: undefined;\n\t};\n\n\treturn (\n\t\t<g data-testid={ testId }>\n\t\t\t<Annotation x={ x } y={ y } dx={ dx } dy={ dy }>\n\t\t\t\t<Connector { ...styles?.connector } />\n\t\t\t\t{ subjectType === 'circle' && <CircleSubject { ...styles?.circleSubject } /> }\n\t\t\t\t{ subjectType === 'line-vertical' && (\n\t\t\t\t\t<LineSubject\n\t\t\t\t\t\tmin={ yMax }\n\t\t\t\t\t\tmax={ yMin }\n\t\t\t\t\t\t{ ...{ ...styles?.lineSubject, orientation: 'vertical' } }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ subjectType === 'line-horizontal' && (\n\t\t\t\t\t<LineSubject\n\t\t\t\t\t\tmin={ xMin }\n\t\t\t\t\t\tmax={ xMax }\n\t\t\t\t\t\t{ ...{ ...styles?.lineSubject, orientation: 'horizontal' } }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ renderLabel ? (\n\t\t\t\t\t<HtmlLabel { ...styles?.label } { ...labelPosition }>\n\t\t\t\t\t\t<div style={ getSafariHTMLLabelPosition() }>\n\t\t\t\t\t\t\t{ renderLabelPopover ? (\n\t\t\t\t\t\t\t\t<LineChartAnnotationLabelWithPopover\n\t\t\t\t\t\t\t\t\ttitle={ title }\n\t\t\t\t\t\t\t\t\tsubtitle={ subtitle }\n\t\t\t\t\t\t\t\t\trenderLabel={ renderLabel }\n\t\t\t\t\t\t\t\t\trenderLabelPopover={ renderLabelPopover }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\trenderLabel( { title, subtitle } )\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</HtmlLabel>\n\t\t\t\t) : (\n\t\t\t\t\t<g ref={ labelRef }>\n\t\t\t\t\t\t<Label\n\t\t\t\t\t\t\ttitle={ title }\n\t\t\t\t\t\t\tsubtitle={ subtitle }\n\t\t\t\t\t\t\t{ ...styles?.label }\n\t\t\t\t\t\t\t{ ...labelPosition }\n\t\t\t\t\t\t\thorizontalAnchor={ getHorizontalAnchor( subjectType, isFlippedHorizontally ) }\n\t\t\t\t\t\t\tverticalAnchor={ getVerticalAnchor(\n\t\t\t\t\t\t\t\tsubjectType,\n\t\t\t\t\t\t\t\tisFlippedVertically,\n\t\t\t\t\t\t\t\ty,\n\t\t\t\t\t\t\t\tyMax,\n\t\t\t\t\t\t\t\theight ?? ANNOTATION_INIT_HEIGHT\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</g>\n\t\t\t\t) }\n\t\t\t</Annotation>\n\t\t</g>\n\t);\n};\n\nexport default LineChartAnnotation;\n","import { DataContext } from '@visx/xychart';\nimport { useContext } from 'react';\nimport type { LineChartGlyphProps } from '../types';\nimport type { FC } from 'react';\n\nconst toNumber = ( val?: number | string | null ): number | undefined => {\n\tconst num = typeof val === 'number' ? val : parseFloat( val );\n\treturn isNaN( num ) ? undefined : num;\n};\n\nconst LineChartGlyph: FC< LineChartGlyphProps > = ( {\n\tdata,\n\tindex,\n\tcolor,\n\tglyphStyle,\n\trenderGlyph,\n\taccessors,\n\tposition,\n} ) => {\n\tconst { xScale, yScale } = useContext( DataContext ) || {};\n\tif ( ! xScale || ! yScale ) return null;\n\n\tif ( data.data.length === 0 ) return null;\n\n\tconst point = position === 'start' ? data.data[ 0 ] : data.data[ data.data.length - 1 ];\n\n\tconst x = xScale( accessors.xAccessor( point ) );\n\tconst y = yScale( accessors.yAccessor( point ) );\n\n\tif ( typeof x !== 'number' || typeof y !== 'number' ) return null;\n\n\tconst size = Math.max( 0, toNumber( glyphStyle?.radius ) ?? 4 );\n\n\treturn renderGlyph( {\n\t\tkey: `${ position }-glyph-${ data.label }`,\n\t\tindex,\n\t\tdatum: point,\n\t\tcolor,\n\t\tsize,\n\t\tx,\n\t\ty,\n\t\tglyphStyle,\n\t\tposition,\n\t} );\n};\n\nexport default LineChartGlyph;\n"]}

package/dist/components/bar-chart/index.cjs CHANGED Viewed

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
-var _chunkCNAKHZMWcjs = require('../../chunk-CNAKHZMW.cjs');
+var _chunkEZYNBPAAcjs = require('../../chunk-EZYNBPAA.cjs');
 require('../../chunk-6GO5PFYL.cjs');
 require('../../chunk-FX2PTUFC.cjs');
 require('../../chunk-PNSMPZ3E.cjs');
@@ -10,5 +10,5 @@ require('../../chunk-EMMSS5I5.cjs');
-exports.BarChart = _chunkCNAKHZMWcjs.BarChartResponsive; exports.BarChartUnresponsive = _chunkCNAKHZMWcjs.BarChart;
+exports.BarChart = _chunkEZYNBPAAcjs.BarChartResponsive; exports.BarChartUnresponsive = _chunkEZYNBPAAcjs.BarChart;
 //# sourceMappingURL=index.cjs.map

package/dist/components/bar-chart/index.css CHANGED Viewed

@@ -111,10 +111,35 @@
   display: flex;
   flex-direction: column;
 }
+.a8ccharts-SQjaa0 {
+  flex-direction: column-reverse;
+}
 .a8ccharts-lmYNi- svg {
   overflow: visible;
 }
 .a8ccharts-vgKKqG {
   margin-top: 1rem;
 }
+.a8ccharts-vHWVsO rect {
+  transform-origin: bottom;
+  transform-box: fill-box;
+  transform: scaleY(0);
+  animation: a8ccharts-wCPctT 1s ease-out forwards;
+}
+@keyframes a8ccharts-wCPctT {
+  to {
+    transform: scaleY(1);
+  }
+}
+.a8ccharts-3kCz4q rect {
+  transform-origin: left;
+  transform-box: fill-box;
+  transform: scaleX(0);
+  animation: a8ccharts-MtfGVm 1s ease-out forwards;
+}
+@keyframes a8ccharts-MtfGVm {
+  to {
+    transform: scaleX(1);
+  }
+}
 /*# sourceMappingURL=index.css.map */

package/dist/components/bar-chart/index.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["esbuild-sass-plugin:css-chunk:src/components/legend/private/base-legend.module.scss","esbuild-sass-plugin:css-chunk:src/components/tooltip/base-tooltip.module.scss","esbuild-sass-plugin:css-chunk:src/components/bar-chart/bar-chart.module.scss"],"sourcesContent":[".a8ccharts-AELBvX {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 16px;\n}\n.a8ccharts-fX8uQe {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.a8ccharts-fX8uQe.a8ccharts-DEe0wg {\n align-items: flex-start;\n}\n.a8ccharts-fX8uQe.a8ccharts-WBKF9I {\n align-items: center;\n}\n.a8ccharts-fX8uQe.a8ccharts-JfwMng {\n align-items: flex-end;\n}\n.a8ccharts-8Y73Kh {\n position: relative;\n}\n.a8ccharts-8Y73Kh.a8ccharts-DEe0wg {\n justify-content: flex-start;\n}\n.a8ccharts-8Y73Kh.a8ccharts-WBKF9I {\n justify-content: center;\n}\n.a8ccharts-8Y73Kh.a8ccharts-JfwMng {\n justify-content: flex-end;\n}\n.a8ccharts-TVM-IY {\n position: relative;\n}\n.a8ccharts-TVM-IY.a8ccharts-DEe0wg {\n justify-content: flex-start;\n}\n.a8ccharts-TVM-IY.a8ccharts-WBKF9I {\n justify-content: center;\n}\n.a8ccharts-TVM-IY.a8ccharts-JfwMng {\n justify-content: flex-end;\n}\n\n.a8ccharts-Vflwq8 {\n display: flex;\n align-items: center;\n font-size: 0.875rem;\n}\n.a8ccharts-qGsavM {\n cursor: pointer;\n user-select: none;\n transition: opacity 0.2s ease;\n}\n.a8ccharts-qGsavM:hover {\n opacity: 0.8;\n}\n.a8ccharts-qGsavM:focus {\n outline: 2px solid currentColor;\n outline-offset: 2px;\n border-radius: 4px;\n}\n.a8ccharts-qGsavM:focus:not(:focus-visible) {\n outline: none;\n}\n.a8ccharts-ZtDY-Q {\n opacity: 0.4;\n}\n.a8ccharts-ZtDY-Q .a8ccharts-2H65Kr {\n text-decoration: line-through;\n}\n\n.a8ccharts-2H65Kr {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n /* Text wrapping is handled at the text level, not the label container */\n}\n\n.a8ccharts-faSDBI {\n word-wrap: break-word;\n overflow-wrap: break-word;\n white-space: normal;\n hyphens: auto;\n}\n.a8ccharts-FISUIO {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex-shrink: 1;\n min-width: 0;\n}\n\n.a8ccharts-DTZlT- {\n font-weight: 500;\n flex-shrink: 0;\n}",".a8ccharts-OfX6nd {\n padding: 0.5rem;\n background-color: rgba(0, 0, 0, 0.85);\n color: #fff;\n border-radius: 4px;\n font-size: 14px;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\n position: absolute;\n pointer-events: none;\n transform: translate(-50%, -100%);\n}",".a8ccharts-lmYNi- {\n display: flex;\n flex-direction: column;\n}\n.a8ccharts-lmYNi- svg {\n overflow: visible;\n}\n.a8ccharts-vgKKqG {\n margin-top: 1rem;\n}"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,kBAAgB;AAChB,aAAW;AACX,OAAK;AACP;AACA,CAAC;AACC,WAAS;AACT,kBAAgB;AAChB,OAAK;AACP;AACA,CALC,gBAKgB,CAAC;AAChB,eAAa;AACf;AACA,CARC,gBAQgB,CAAC;AAChB,eAAa;AACf;AACA,CAXC,gBAWgB,CAAC;AAChB,eAAa;AACf;AACA,CAAC;AACC,YAAU;AACZ;AACA,CAHC,gBAGgB,CAZC;AAahB,mBAAiB;AACnB;AACA,CANC,gBAMgB,CAZC;AAahB,mBAAiB;AACnB;AACA,CATC,gBASgB,CAZC;AAahB,mBAAiB;AACnB;AACA,CAAC;AACC,YAAU;AACZ;AACA,CAHC,gBAGgB,CAxBC;AAyBhB,mBAAiB;AACnB;AACA,CANC,gBAMgB,CAxBC;AAyBhB,mBAAiB;AACnB;AACA,CATC,gBASgB,CAxBC;AAyBhB,mBAAiB;AACnB;AAEA,CAAC;AACC,WAAS;AACT,eAAa;AACb,aAAW;AACb;AACA,CAAC;AACC,UAAQ;AACR,eAAa;AACb,cAAY,QAAQ,KAAK;AAC3B;AACA,CALC,gBAKgB;AACf,WAAS;AACX;AACA,CARC,gBAQgB;AACf,WAAS,IAAI,MAAM;AACnB,kBAAgB;AAChB,iBAAe;AACjB;AACA,CAbC,gBAagB,MAAM,KAAK;AAC1B,WAAS;AACX;AACA,CAAC;AACC,WAAS;AACX;AACA,CAHC,iBAGiB,CAAC;AACjB,mBAAiB;AACnB;AAEA,CAJmB;AAKjB,WAAS;AACT,eAAa;AACb,OAAK;AAEP;AAEA,CAAC;AACC,aAAW;AACX,iBAAe;AACf,eAAa;AACb,WAAS;AACX;AACA,CAAC;AACC,eAAa;AACb,YAAU;AACV,iBAAe;AACf,eAAa;AACb,aAAW;AACb;AAEA,CAAC;AACC,eAAa;AACb,eAAa;AACf;;;ACjGA,CAAC;AACC,WAAS;AACT,oBAAkB,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AAChC,SAAO;AACP,iBAAe;AACf,aAAW;AACX,cAAY,EAAE,IAAI,IAAI,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AACpC,YAAU;AACV,kBAAgB;AAChB,aAAW,UAAU,IAAI,EAAE;AAC7B;;;ACVA,CAAC;AACC,WAAS;AACT,kBAAgB;AAClB;AACA,~~CAJC~~,~~iBAIiB~~;AAChB,YAAU;AACZ;AACA,CAAC;AACC,cAAY;AACd;","names":[]}
1	+ {"version":3,"sources":["esbuild-sass-plugin:css-chunk:src/components/legend/private/base-legend.module.scss","esbuild-sass-plugin:css-chunk:src/components/tooltip/base-tooltip.module.scss","esbuild-sass-plugin:css-chunk:src/components/bar-chart/bar-chart.module.scss"],"sourcesContent":[".a8ccharts-AELBvX {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 16px;\n}\n.a8ccharts-fX8uQe {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.a8ccharts-fX8uQe.a8ccharts-DEe0wg {\n align-items: flex-start;\n}\n.a8ccharts-fX8uQe.a8ccharts-WBKF9I {\n align-items: center;\n}\n.a8ccharts-fX8uQe.a8ccharts-JfwMng {\n align-items: flex-end;\n}\n.a8ccharts-8Y73Kh {\n position: relative;\n}\n.a8ccharts-8Y73Kh.a8ccharts-DEe0wg {\n justify-content: flex-start;\n}\n.a8ccharts-8Y73Kh.a8ccharts-WBKF9I {\n justify-content: center;\n}\n.a8ccharts-8Y73Kh.a8ccharts-JfwMng {\n justify-content: flex-end;\n}\n.a8ccharts-TVM-IY {\n position: relative;\n}\n.a8ccharts-TVM-IY.a8ccharts-DEe0wg {\n justify-content: flex-start;\n}\n.a8ccharts-TVM-IY.a8ccharts-WBKF9I {\n justify-content: center;\n}\n.a8ccharts-TVM-IY.a8ccharts-JfwMng {\n justify-content: flex-end;\n}\n\n.a8ccharts-Vflwq8 {\n display: flex;\n align-items: center;\n font-size: 0.875rem;\n}\n.a8ccharts-qGsavM {\n cursor: pointer;\n user-select: none;\n transition: opacity 0.2s ease;\n}\n.a8ccharts-qGsavM:hover {\n opacity: 0.8;\n}\n.a8ccharts-qGsavM:focus {\n outline: 2px solid currentColor;\n outline-offset: 2px;\n border-radius: 4px;\n}\n.a8ccharts-qGsavM:focus:not(:focus-visible) {\n outline: none;\n}\n.a8ccharts-ZtDY-Q {\n opacity: 0.4;\n}\n.a8ccharts-ZtDY-Q .a8ccharts-2H65Kr {\n text-decoration: line-through;\n}\n\n.a8ccharts-2H65Kr {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n /* Text wrapping is handled at the text level, not the label container */\n}\n\n.a8ccharts-faSDBI {\n word-wrap: break-word;\n overflow-wrap: break-word;\n white-space: normal;\n hyphens: auto;\n}\n.a8ccharts-FISUIO {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex-shrink: 1;\n min-width: 0;\n}\n\n.a8ccharts-DTZlT- {\n font-weight: 500;\n flex-shrink: 0;\n}",".a8ccharts-OfX6nd {\n padding: 0.5rem;\n background-color: rgba(0, 0, 0, 0.85);\n color: #fff;\n border-radius: 4px;\n font-size: 14px;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\n position: absolute;\n pointer-events: none;\n transform: translate(-50%, -100%);\n}",".a8ccharts-lmYNi- {\n display: flex;\n flex-direction: column;\n}\n.a8ccharts-SQjaa0 {\n flex-direction: column-reverse;\n}\n.a8ccharts-lmYNi- svg {\n overflow: visible;\n}\n.a8ccharts-vgKKqG {\n margin-top: 1rem;\n}\n\n.a8ccharts-vHWVsO rect {\n transform-origin: bottom;\n transform-box: fill-box;\n transform: scaleY(0);\n animation: a8ccharts-wCPctT 1s ease-out forwards;\n}\n\n@keyframes a8ccharts-wCPctT {\n to {\n transform: scaleY(1);\n }\n}\n.a8ccharts-3kCz4q rect {\n transform-origin: left;\n transform-box: fill-box;\n transform: scaleX(0);\n animation: a8ccharts-MtfGVm 1s ease-out forwards;\n}\n\n@keyframes a8ccharts-MtfGVm {\n to {\n transform: scaleX(1);\n }\n}"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,kBAAgB;AAChB,aAAW;AACX,OAAK;AACP;AACA,CAAC;AACC,WAAS;AACT,kBAAgB;AAChB,OAAK;AACP;AACA,CALC,gBAKgB,CAAC;AAChB,eAAa;AACf;AACA,CARC,gBAQgB,CAAC;AAChB,eAAa;AACf;AACA,CAXC,gBAWgB,CAAC;AAChB,eAAa;AACf;AACA,CAAC;AACC,YAAU;AACZ;AACA,CAHC,gBAGgB,CAZC;AAahB,mBAAiB;AACnB;AACA,CANC,gBAMgB,CAZC;AAahB,mBAAiB;AACnB;AACA,CATC,gBASgB,CAZC;AAahB,mBAAiB;AACnB;AACA,CAAC;AACC,YAAU;AACZ;AACA,CAHC,gBAGgB,CAxBC;AAyBhB,mBAAiB;AACnB;AACA,CANC,gBAMgB,CAxBC;AAyBhB,mBAAiB;AACnB;AACA,CATC,gBASgB,CAxBC;AAyBhB,mBAAiB;AACnB;AAEA,CAAC;AACC,WAAS;AACT,eAAa;AACb,aAAW;AACb;AACA,CAAC;AACC,UAAQ;AACR,eAAa;AACb,cAAY,QAAQ,KAAK;AAC3B;AACA,CALC,gBAKgB;AACf,WAAS;AACX;AACA,CARC,gBAQgB;AACf,WAAS,IAAI,MAAM;AACnB,kBAAgB;AAChB,iBAAe;AACjB;AACA,CAbC,gBAagB,MAAM,KAAK;AAC1B,WAAS;AACX;AACA,CAAC;AACC,WAAS;AACX;AACA,CAHC,iBAGiB,CAAC;AACjB,mBAAiB;AACnB;AAEA,CAJmB;AAKjB,WAAS;AACT,eAAa;AACb,OAAK;AAEP;AAEA,CAAC;AACC,aAAW;AACX,iBAAe;AACf,eAAa;AACb,WAAS;AACX;AACA,CAAC;AACC,eAAa;AACb,YAAU;AACV,iBAAe;AACf,eAAa;AACb,aAAW;AACb;AAEA,CAAC;AACC,eAAa;AACb,eAAa;AACf;;;ACjGA,CAAC;AACC,WAAS;AACT,oBAAkB,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AAChC,SAAO;AACP,iBAAe;AACf,aAAW;AACX,cAAY,EAAE,IAAI,IAAI,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AACpC,YAAU;AACV,kBAAgB;AAChB,aAAW,UAAU,IAAI,EAAE;AAC7B;;;ACVA,CAAC;AACC,WAAS;AACT,kBAAgB;AAClB;AACA,CAAC;AACC,kBAAgB;AAClB;AACA,CAPC,iBAOiB;AAChB,YAAU;AACZ;AACA,CAAC;AACC,cAAY;AACd;AAEA,CAAC,iBAAiB;AAChB,oBAAkB;AAClB,iBAAe;AACf,aAAW,OAAO;AAClB,aAAW,iBAAiB,GAAG,SAAS;AAC1C;AAEA,WAHa;AAIX;AACE,eAAW,OAAO;AACpB;AACF;AACA,CAAC,iBAAiB;AAChB,oBAAkB;AAClB,iBAAe;AACf,aAAW,OAAO;AAClB,aAAW,iBAAiB,GAAG,SAAS;AAC1C;AAEA,WAHa;AAIX;AACE,eAAW,OAAO;AACpB;AACF;","names":[]}

package/dist/components/bar-chart/index.d.cts CHANGED Viewed

@@ -1,5 +1,5 @@
 import { L as Legend } from '../../legend-C9ahiwOt.cjs';
-import { O as Optional, B as BaseChartProps, c as SeriesData, b as DataPointDate } from '../../types-73KOEWs9.cjs';
+import { O as Optional, B as BaseChartProps, c as SeriesData, b as DataPointDate } from '../../types-DU5eF3uf.cjs';
 import { FC, ReactNode, ComponentType } from 'react';
 import { R as ResponsiveConfig } from '../../with-responsive-Cp2qnQPo.cjs';
 import { RenderTooltipParams } from '@visx/xychart/lib/components/Tooltip';

package/dist/components/bar-chart/index.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import { L as Legend } from '../../legend-jjMmhSg3.js';
-import { O as Optional, B as BaseChartProps, c as SeriesData, b as DataPointDate } from '../../types-73KOEWs9.js';
+import { O as Optional, B as BaseChartProps, c as SeriesData, b as DataPointDate } from '../../types-DU5eF3uf.js';
 import { FC, ReactNode, ComponentType } from 'react';
 import { R as ResponsiveConfig } from '../../with-responsive-Cp2qnQPo.js';
 import { RenderTooltipParams } from '@visx/xychart/lib/components/Tooltip';

package/dist/components/bar-chart/index.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import {
   BarChart,
   BarChartResponsive
-} from "../../chunk-HVWETEEV.js";
+} from "../../chunk-2UKC2E5X.js";
 import "../../chunk-W5KOH3TV.js";
 import "../../chunk-TYYW4BG3.js";
 import "../../chunk-PFT2X4OW.js";

package/dist/components/bar-list-chart/index.cjs CHANGED Viewed

@@ -1,8 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
-var _chunkN36WJKYMcjs = require('../../chunk-N36WJKYM.cjs');
-require('../../chunk-CNAKHZMW.cjs');
+var _chunkEIMF7X6Fcjs = require('../../chunk-EIMF7X6F.cjs');
+require('../../chunk-EZYNBPAA.cjs');
 require('../../chunk-6GO5PFYL.cjs');
 require('../../chunk-FX2PTUFC.cjs');
 require('../../chunk-PNSMPZ3E.cjs');
@@ -11,5 +11,5 @@ require('../../chunk-EMMSS5I5.cjs');
-exports.BarListChart = _chunkN36WJKYMcjs.BarListChartResponsive; exports.BarListChartUnresponsive = _chunkN36WJKYMcjs.BarListChart;
+exports.BarListChart = _chunkEIMF7X6Fcjs.BarListChartResponsive; exports.BarListChartUnresponsive = _chunkEIMF7X6Fcjs.BarListChart;
 //# sourceMappingURL=index.cjs.map

package/dist/components/bar-list-chart/index.css CHANGED Viewed

@@ -111,10 +111,35 @@
   display: flex;
   flex-direction: column;
 }
+.a8ccharts-SQjaa0 {
+  flex-direction: column-reverse;
+}
 .a8ccharts-lmYNi- svg {
   overflow: visible;
 }
 .a8ccharts-vgKKqG {
   margin-top: 1rem;
 }
+.a8ccharts-vHWVsO rect {
+  transform-origin: bottom;
+  transform-box: fill-box;
+  transform: scaleY(0);
+  animation: a8ccharts-wCPctT 1s ease-out forwards;
+}
+@keyframes a8ccharts-wCPctT {
+  to {
+    transform: scaleY(1);
+  }
+}
+.a8ccharts-3kCz4q rect {
+  transform-origin: left;
+  transform-box: fill-box;
+  transform: scaleX(0);
+  animation: a8ccharts-MtfGVm 1s ease-out forwards;
+}
+@keyframes a8ccharts-MtfGVm {
+  to {
+    transform: scaleX(1);
+  }
+}
 /*# sourceMappingURL=index.css.map */

package/dist/components/bar-list-chart/index.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["esbuild-sass-plugin:css-chunk:src/components/legend/private/base-legend.module.scss","esbuild-sass-plugin:css-chunk:src/components/tooltip/base-tooltip.module.scss","esbuild-sass-plugin:css-chunk:src/components/bar-chart/bar-chart.module.scss"],"sourcesContent":[".a8ccharts-AELBvX {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 16px;\n}\n.a8ccharts-fX8uQe {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.a8ccharts-fX8uQe.a8ccharts-DEe0wg {\n align-items: flex-start;\n}\n.a8ccharts-fX8uQe.a8ccharts-WBKF9I {\n align-items: center;\n}\n.a8ccharts-fX8uQe.a8ccharts-JfwMng {\n align-items: flex-end;\n}\n.a8ccharts-8Y73Kh {\n position: relative;\n}\n.a8ccharts-8Y73Kh.a8ccharts-DEe0wg {\n justify-content: flex-start;\n}\n.a8ccharts-8Y73Kh.a8ccharts-WBKF9I {\n justify-content: center;\n}\n.a8ccharts-8Y73Kh.a8ccharts-JfwMng {\n justify-content: flex-end;\n}\n.a8ccharts-TVM-IY {\n position: relative;\n}\n.a8ccharts-TVM-IY.a8ccharts-DEe0wg {\n justify-content: flex-start;\n}\n.a8ccharts-TVM-IY.a8ccharts-WBKF9I {\n justify-content: center;\n}\n.a8ccharts-TVM-IY.a8ccharts-JfwMng {\n justify-content: flex-end;\n}\n\n.a8ccharts-Vflwq8 {\n display: flex;\n align-items: center;\n font-size: 0.875rem;\n}\n.a8ccharts-qGsavM {\n cursor: pointer;\n user-select: none;\n transition: opacity 0.2s ease;\n}\n.a8ccharts-qGsavM:hover {\n opacity: 0.8;\n}\n.a8ccharts-qGsavM:focus {\n outline: 2px solid currentColor;\n outline-offset: 2px;\n border-radius: 4px;\n}\n.a8ccharts-qGsavM:focus:not(:focus-visible) {\n outline: none;\n}\n.a8ccharts-ZtDY-Q {\n opacity: 0.4;\n}\n.a8ccharts-ZtDY-Q .a8ccharts-2H65Kr {\n text-decoration: line-through;\n}\n\n.a8ccharts-2H65Kr {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n /* Text wrapping is handled at the text level, not the label container */\n}\n\n.a8ccharts-faSDBI {\n word-wrap: break-word;\n overflow-wrap: break-word;\n white-space: normal;\n hyphens: auto;\n}\n.a8ccharts-FISUIO {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex-shrink: 1;\n min-width: 0;\n}\n\n.a8ccharts-DTZlT- {\n font-weight: 500;\n flex-shrink: 0;\n}",".a8ccharts-OfX6nd {\n padding: 0.5rem;\n background-color: rgba(0, 0, 0, 0.85);\n color: #fff;\n border-radius: 4px;\n font-size: 14px;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\n position: absolute;\n pointer-events: none;\n transform: translate(-50%, -100%);\n}",".a8ccharts-lmYNi- {\n display: flex;\n flex-direction: column;\n}\n.a8ccharts-lmYNi- svg {\n overflow: visible;\n}\n.a8ccharts-vgKKqG {\n margin-top: 1rem;\n}"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,kBAAgB;AAChB,aAAW;AACX,OAAK;AACP;AACA,CAAC;AACC,WAAS;AACT,kBAAgB;AAChB,OAAK;AACP;AACA,CALC,gBAKgB,CAAC;AAChB,eAAa;AACf;AACA,CARC,gBAQgB,CAAC;AAChB,eAAa;AACf;AACA,CAXC,gBAWgB,CAAC;AAChB,eAAa;AACf;AACA,CAAC;AACC,YAAU;AACZ;AACA,CAHC,gBAGgB,CAZC;AAahB,mBAAiB;AACnB;AACA,CANC,gBAMgB,CAZC;AAahB,mBAAiB;AACnB;AACA,CATC,gBASgB,CAZC;AAahB,mBAAiB;AACnB;AACA,CAAC;AACC,YAAU;AACZ;AACA,CAHC,gBAGgB,CAxBC;AAyBhB,mBAAiB;AACnB;AACA,CANC,gBAMgB,CAxBC;AAyBhB,mBAAiB;AACnB;AACA,CATC,gBASgB,CAxBC;AAyBhB,mBAAiB;AACnB;AAEA,CAAC;AACC,WAAS;AACT,eAAa;AACb,aAAW;AACb;AACA,CAAC;AACC,UAAQ;AACR,eAAa;AACb,cAAY,QAAQ,KAAK;AAC3B;AACA,CALC,gBAKgB;AACf,WAAS;AACX;AACA,CARC,gBAQgB;AACf,WAAS,IAAI,MAAM;AACnB,kBAAgB;AAChB,iBAAe;AACjB;AACA,CAbC,gBAagB,MAAM,KAAK;AAC1B,WAAS;AACX;AACA,CAAC;AACC,WAAS;AACX;AACA,CAHC,iBAGiB,CAAC;AACjB,mBAAiB;AACnB;AAEA,CAJmB;AAKjB,WAAS;AACT,eAAa;AACb,OAAK;AAEP;AAEA,CAAC;AACC,aAAW;AACX,iBAAe;AACf,eAAa;AACb,WAAS;AACX;AACA,CAAC;AACC,eAAa;AACb,YAAU;AACV,iBAAe;AACf,eAAa;AACb,aAAW;AACb;AAEA,CAAC;AACC,eAAa;AACb,eAAa;AACf;;;ACjGA,CAAC;AACC,WAAS;AACT,oBAAkB,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AAChC,SAAO;AACP,iBAAe;AACf,aAAW;AACX,cAAY,EAAE,IAAI,IAAI,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AACpC,YAAU;AACV,kBAAgB;AAChB,aAAW,UAAU,IAAI,EAAE;AAC7B;;;ACVA,CAAC;AACC,WAAS;AACT,kBAAgB;AAClB;AACA,~~CAJC~~,~~iBAIiB~~;AAChB,YAAU;AACZ;AACA,CAAC;AACC,cAAY;AACd;","names":[]}
1	+ {"version":3,"sources":["esbuild-sass-plugin:css-chunk:src/components/legend/private/base-legend.module.scss","esbuild-sass-plugin:css-chunk:src/components/tooltip/base-tooltip.module.scss","esbuild-sass-plugin:css-chunk:src/components/bar-chart/bar-chart.module.scss"],"sourcesContent":[".a8ccharts-AELBvX {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 16px;\n}\n.a8ccharts-fX8uQe {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.a8ccharts-fX8uQe.a8ccharts-DEe0wg {\n align-items: flex-start;\n}\n.a8ccharts-fX8uQe.a8ccharts-WBKF9I {\n align-items: center;\n}\n.a8ccharts-fX8uQe.a8ccharts-JfwMng {\n align-items: flex-end;\n}\n.a8ccharts-8Y73Kh {\n position: relative;\n}\n.a8ccharts-8Y73Kh.a8ccharts-DEe0wg {\n justify-content: flex-start;\n}\n.a8ccharts-8Y73Kh.a8ccharts-WBKF9I {\n justify-content: center;\n}\n.a8ccharts-8Y73Kh.a8ccharts-JfwMng {\n justify-content: flex-end;\n}\n.a8ccharts-TVM-IY {\n position: relative;\n}\n.a8ccharts-TVM-IY.a8ccharts-DEe0wg {\n justify-content: flex-start;\n}\n.a8ccharts-TVM-IY.a8ccharts-WBKF9I {\n justify-content: center;\n}\n.a8ccharts-TVM-IY.a8ccharts-JfwMng {\n justify-content: flex-end;\n}\n\n.a8ccharts-Vflwq8 {\n display: flex;\n align-items: center;\n font-size: 0.875rem;\n}\n.a8ccharts-qGsavM {\n cursor: pointer;\n user-select: none;\n transition: opacity 0.2s ease;\n}\n.a8ccharts-qGsavM:hover {\n opacity: 0.8;\n}\n.a8ccharts-qGsavM:focus {\n outline: 2px solid currentColor;\n outline-offset: 2px;\n border-radius: 4px;\n}\n.a8ccharts-qGsavM:focus:not(:focus-visible) {\n outline: none;\n}\n.a8ccharts-ZtDY-Q {\n opacity: 0.4;\n}\n.a8ccharts-ZtDY-Q .a8ccharts-2H65Kr {\n text-decoration: line-through;\n}\n\n.a8ccharts-2H65Kr {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n /* Text wrapping is handled at the text level, not the label container */\n}\n\n.a8ccharts-faSDBI {\n word-wrap: break-word;\n overflow-wrap: break-word;\n white-space: normal;\n hyphens: auto;\n}\n.a8ccharts-FISUIO {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex-shrink: 1;\n min-width: 0;\n}\n\n.a8ccharts-DTZlT- {\n font-weight: 500;\n flex-shrink: 0;\n}",".a8ccharts-OfX6nd {\n padding: 0.5rem;\n background-color: rgba(0, 0, 0, 0.85);\n color: #fff;\n border-radius: 4px;\n font-size: 14px;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\n position: absolute;\n pointer-events: none;\n transform: translate(-50%, -100%);\n}",".a8ccharts-lmYNi- {\n display: flex;\n flex-direction: column;\n}\n.a8ccharts-SQjaa0 {\n flex-direction: column-reverse;\n}\n.a8ccharts-lmYNi- svg {\n overflow: visible;\n}\n.a8ccharts-vgKKqG {\n margin-top: 1rem;\n}\n\n.a8ccharts-vHWVsO rect {\n transform-origin: bottom;\n transform-box: fill-box;\n transform: scaleY(0);\n animation: a8ccharts-wCPctT 1s ease-out forwards;\n}\n\n@keyframes a8ccharts-wCPctT {\n to {\n transform: scaleY(1);\n }\n}\n.a8ccharts-3kCz4q rect {\n transform-origin: left;\n transform-box: fill-box;\n transform: scaleX(0);\n animation: a8ccharts-MtfGVm 1s ease-out forwards;\n}\n\n@keyframes a8ccharts-MtfGVm {\n to {\n transform: scaleX(1);\n }\n}"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,kBAAgB;AAChB,aAAW;AACX,OAAK;AACP;AACA,CAAC;AACC,WAAS;AACT,kBAAgB;AAChB,OAAK;AACP;AACA,CALC,gBAKgB,CAAC;AAChB,eAAa;AACf;AACA,CARC,gBAQgB,CAAC;AAChB,eAAa;AACf;AACA,CAXC,gBAWgB,CAAC;AAChB,eAAa;AACf;AACA,CAAC;AACC,YAAU;AACZ;AACA,CAHC,gBAGgB,CAZC;AAahB,mBAAiB;AACnB;AACA,CANC,gBAMgB,CAZC;AAahB,mBAAiB;AACnB;AACA,CATC,gBASgB,CAZC;AAahB,mBAAiB;AACnB;AACA,CAAC;AACC,YAAU;AACZ;AACA,CAHC,gBAGgB,CAxBC;AAyBhB,mBAAiB;AACnB;AACA,CANC,gBAMgB,CAxBC;AAyBhB,mBAAiB;AACnB;AACA,CATC,gBASgB,CAxBC;AAyBhB,mBAAiB;AACnB;AAEA,CAAC;AACC,WAAS;AACT,eAAa;AACb,aAAW;AACb;AACA,CAAC;AACC,UAAQ;AACR,eAAa;AACb,cAAY,QAAQ,KAAK;AAC3B;AACA,CALC,gBAKgB;AACf,WAAS;AACX;AACA,CARC,gBAQgB;AACf,WAAS,IAAI,MAAM;AACnB,kBAAgB;AAChB,iBAAe;AACjB;AACA,CAbC,gBAagB,MAAM,KAAK;AAC1B,WAAS;AACX;AACA,CAAC;AACC,WAAS;AACX;AACA,CAHC,iBAGiB,CAAC;AACjB,mBAAiB;AACnB;AAEA,CAJmB;AAKjB,WAAS;AACT,eAAa;AACb,OAAK;AAEP;AAEA,CAAC;AACC,aAAW;AACX,iBAAe;AACf,eAAa;AACb,WAAS;AACX;AACA,CAAC;AACC,eAAa;AACb,YAAU;AACV,iBAAe;AACf,eAAa;AACb,aAAW;AACb;AAEA,CAAC;AACC,eAAa;AACb,eAAa;AACf;;;ACjGA,CAAC;AACC,WAAS;AACT,oBAAkB,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AAChC,SAAO;AACP,iBAAe;AACf,aAAW;AACX,cAAY,EAAE,IAAI,IAAI,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AACpC,YAAU;AACV,kBAAgB;AAChB,aAAW,UAAU,IAAI,EAAE;AAC7B;;;ACVA,CAAC;AACC,WAAS;AACT,kBAAgB;AAClB;AACA,CAAC;AACC,kBAAgB;AAClB;AACA,CAPC,iBAOiB;AAChB,YAAU;AACZ;AACA,CAAC;AACC,cAAY;AACd;AAEA,CAAC,iBAAiB;AAChB,oBAAkB;AAClB,iBAAe;AACf,aAAW,OAAO;AAClB,aAAW,iBAAiB,GAAG,SAAS;AAC1C;AAEA,WAHa;AAIX;AACE,eAAW,OAAO;AACpB;AACF;AACA,CAAC,iBAAiB;AAChB,oBAAkB;AAClB,iBAAe;AACf,aAAW,OAAO;AAClB,aAAW,iBAAiB,GAAG,SAAS;AAC1C;AAEA,WAHa;AAIX;AACE,eAAW,OAAO;AACpB;AACF;","names":[]}

package/dist/components/bar-list-chart/index.d.cts CHANGED Viewed

@@ -3,7 +3,7 @@ import { R as ResponsiveConfig } from '../../with-responsive-Cp2qnQPo.cjs';
 import { TextProps } from '@visx/text';
 import { BarChartProps } from '../bar-chart/index.cjs';
 import { ComponentType, FC } from 'react';
-import { f as ScaleOptions, c as SeriesData } from '../../types-73KOEWs9.cjs';
+import { f as ScaleOptions, c as SeriesData } from '../../types-DU5eF3uf.cjs';
 import '../../legend-C9ahiwOt.cjs';
 import '../../types-C05PdDJa.cjs';
 import '@visx/legend';

package/dist/components/bar-list-chart/index.d.ts CHANGED Viewed

@@ -3,7 +3,7 @@ import { R as ResponsiveConfig } from '../../with-responsive-Cp2qnQPo.js';
 import { TextProps } from '@visx/text';
 import { BarChartProps } from '../bar-chart/index.js';
 import { ComponentType, FC } from 'react';
-import { f as ScaleOptions, c as SeriesData } from '../../types-73KOEWs9.js';
+import { f as ScaleOptions, c as SeriesData } from '../../types-DU5eF3uf.js';
 import '../../legend-jjMmhSg3.js';
 import '../../types-C05PdDJa.js';
 import '@visx/legend';

package/dist/components/bar-list-chart/index.js CHANGED Viewed

@@ -1,8 +1,8 @@
 import {
   BarListChart,
   BarListChartResponsive
-} from "../../chunk-JI6OGGGF.js";
-import "../../chunk-HVWETEEV.js";
+} from "../../chunk-OBTBYVUR.js";
+import "../../chunk-2UKC2E5X.js";
 import "../../chunk-W5KOH3TV.js";
 import "../../chunk-TYYW4BG3.js";
 import "../../chunk-PFT2X4OW.js";

package/dist/components/conversion-funnel-chart/index.cjs CHANGED Viewed

@@ -1,9 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
-var _chunkQPHNEQCKcjs = require('../../chunk-QPHNEQCK.cjs');
+var _chunkJ6XON6FMcjs = require('../../chunk-J6XON6FM.cjs');
 require('../../chunk-LSGYIUQX.cjs');
 require('../../chunk-EMMSS5I5.cjs');
-exports.ConversionFunnelChart = _chunkQPHNEQCKcjs.ConversionFunnelChartWithProvider;
+exports.ConversionFunnelChart = _chunkJ6XON6FMcjs.ConversionFunnelChartWithProvider;
 //# sourceMappingURL=index.cjs.map

package/dist/components/conversion-funnel-chart/index.css CHANGED Viewed

@@ -133,4 +133,15 @@
   color: #6b7280;
   font-size: 16px;
 }
+.a8ccharts-wvCpVT {
+  transform-origin: bottom;
+  transform-box: fill-box;
+  transform: scaleY(0);
+  animation: a8ccharts-4otxiv 1s ease-out forwards;
+}
+@keyframes a8ccharts-4otxiv {
+  to {
+    transform: scaleY(1);
+  }
+}
 /*# sourceMappingURL=index.css.map */