@automattic/charts 0.58.0 → 0.59.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 (253) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/README.md +7 -54
  3. package/dist/index.cjs +9606 -22
  4. package/dist/index.cjs.map +1 -1
  5. package/dist/index.css +20 -25
  6. package/dist/index.css.map +1 -1
  7. package/dist/index.d.cts +1612 -33
  8. package/dist/index.d.ts +1612 -33
  9. package/dist/index.js +9640 -56
  10. package/dist/index.js.map +1 -1
  11. package/package.json +8 -125
  12. package/src/charts/bar-chart/bar-chart.module.scss +0 -5
  13. package/src/charts/bar-chart/bar-chart.tsx +131 -137
  14. package/src/charts/leaderboard-chart/leaderboard-chart.tsx +23 -40
  15. package/src/charts/line-chart/line-chart.module.scss +0 -5
  16. package/src/charts/line-chart/line-chart.tsx +190 -183
  17. package/src/charts/line-chart/private/line-chart-annotations-overlay.tsx +1 -2
  18. package/src/charts/pie-chart/pie-chart.module.scss +2 -10
  19. package/src/charts/pie-chart/pie-chart.tsx +198 -199
  20. package/src/charts/pie-chart/test/composition-api.test.tsx +3 -3
  21. package/src/charts/pie-chart/test/pie-chart.test.tsx +42 -35
  22. package/src/charts/pie-semi-circle-chart/pie-semi-circle-chart.module.scss +2 -8
  23. package/src/charts/pie-semi-circle-chart/pie-semi-circle-chart.tsx +155 -155
  24. package/src/charts/pie-semi-circle-chart/test/pie-semi-circle-chart.test.tsx +25 -25
  25. package/src/charts/private/chart-layout/chart-layout.module.scss +7 -0
  26. package/src/charts/private/chart-layout/chart-layout.tsx +106 -0
  27. package/src/charts/private/chart-layout/index.ts +2 -0
  28. package/src/charts/private/chart-layout/test/chart-layout.test.tsx +167 -0
  29. package/src/charts/private/single-chart-context/single-chart-context.tsx +2 -2
  30. package/src/charts/private/svg-empty-state/index.ts +1 -0
  31. package/src/charts/private/svg-empty-state/svg-empty-state.module.scss +7 -0
  32. package/src/charts/private/svg-empty-state/svg-empty-state.tsx +40 -0
  33. package/src/components/legend/hooks/test/use-chart-legend-items.test.tsx +12 -8
  34. package/src/components/legend/hooks/use-chart-legend-items.ts +12 -13
  35. package/src/components/legend/legend.tsx +33 -8
  36. package/src/components/legend/test/legend.test.tsx +93 -1
  37. package/src/hooks/index.ts +1 -0
  38. package/src/hooks/use-data-with-percentages.ts +24 -0
  39. package/src/hooks/use-interactive-legend-data.ts +18 -15
  40. package/src/index.ts +65 -2
  41. package/src/providers/chart-context/global-charts-provider.tsx +7 -1
  42. package/src/providers/chart-context/hooks/use-chart-registration.ts +2 -1
  43. package/src/providers/chart-context/types.ts +2 -2
  44. package/src/types.ts +27 -7
  45. package/src/utils/test/resolve-css-var.test.ts +2 -0
  46. package/dist/base-tooltip-DOq93wjU.d.cts +0 -38
  47. package/dist/base-tooltip-DOq93wjU.d.ts +0 -38
  48. package/dist/charts/bar-chart/index.cjs +0 -17
  49. package/dist/charts/bar-chart/index.cjs.map +0 -1
  50. package/dist/charts/bar-chart/index.css +0 -141
  51. package/dist/charts/bar-chart/index.css.map +0 -1
  52. package/dist/charts/bar-chart/index.d.cts +0 -36
  53. package/dist/charts/bar-chart/index.d.ts +0 -36
  54. package/dist/charts/bar-chart/index.js +0 -17
  55. package/dist/charts/bar-chart/index.js.map +0 -1
  56. package/dist/charts/bar-list-chart/index.cjs +0 -18
  57. package/dist/charts/bar-list-chart/index.cjs.map +0 -1
  58. package/dist/charts/bar-list-chart/index.css +0 -141
  59. package/dist/charts/bar-list-chart/index.css.map +0 -1
  60. package/dist/charts/bar-list-chart/index.d.cts +0 -92
  61. package/dist/charts/bar-list-chart/index.d.ts +0 -92
  62. package/dist/charts/bar-list-chart/index.js +0 -18
  63. package/dist/charts/bar-list-chart/index.js.map +0 -1
  64. package/dist/charts/conversion-funnel-chart/index.cjs +0 -11
  65. package/dist/charts/conversion-funnel-chart/index.cjs.map +0 -1
  66. package/dist/charts/conversion-funnel-chart/index.css +0 -157
  67. package/dist/charts/conversion-funnel-chart/index.css.map +0 -1
  68. package/dist/charts/conversion-funnel-chart/index.d.cts +0 -97
  69. package/dist/charts/conversion-funnel-chart/index.d.ts +0 -97
  70. package/dist/charts/conversion-funnel-chart/index.js +0 -11
  71. package/dist/charts/conversion-funnel-chart/index.js.map +0 -1
  72. package/dist/charts/geo-chart/index.cjs +0 -13
  73. package/dist/charts/geo-chart/index.cjs.map +0 -1
  74. package/dist/charts/geo-chart/index.css +0 -23
  75. package/dist/charts/geo-chart/index.css.map +0 -1
  76. package/dist/charts/geo-chart/index.d.cts +0 -67
  77. package/dist/charts/geo-chart/index.d.ts +0 -67
  78. package/dist/charts/geo-chart/index.js +0 -13
  79. package/dist/charts/geo-chart/index.js.map +0 -1
  80. package/dist/charts/leaderboard-chart/index.cjs +0 -21
  81. package/dist/charts/leaderboard-chart/index.cjs.map +0 -1
  82. package/dist/charts/leaderboard-chart/index.css +0 -160
  83. package/dist/charts/leaderboard-chart/index.css.map +0 -1
  84. package/dist/charts/leaderboard-chart/index.d.cts +0 -46
  85. package/dist/charts/leaderboard-chart/index.d.ts +0 -46
  86. package/dist/charts/leaderboard-chart/index.js +0 -21
  87. package/dist/charts/leaderboard-chart/index.js.map +0 -1
  88. package/dist/charts/line-chart/index.cjs +0 -17
  89. package/dist/charts/line-chart/index.cjs.map +0 -1
  90. package/dist/charts/line-chart/index.css +0 -213
  91. package/dist/charts/line-chart/index.css.map +0 -1
  92. package/dist/charts/line-chart/index.d.cts +0 -98
  93. package/dist/charts/line-chart/index.d.ts +0 -98
  94. package/dist/charts/line-chart/index.js +0 -17
  95. package/dist/charts/line-chart/index.js.map +0 -1
  96. package/dist/charts/pie-chart/index.cjs +0 -19
  97. package/dist/charts/pie-chart/index.cjs.map +0 -1
  98. package/dist/charts/pie-chart/index.css +0 -131
  99. package/dist/charts/pie-chart/index.css.map +0 -1
  100. package/dist/charts/pie-chart/index.d.cts +0 -91
  101. package/dist/charts/pie-chart/index.d.ts +0 -91
  102. package/dist/charts/pie-chart/index.js +0 -19
  103. package/dist/charts/pie-chart/index.js.map +0 -1
  104. package/dist/charts/pie-semi-circle-chart/index.cjs +0 -18
  105. package/dist/charts/pie-semi-circle-chart/index.cjs.map +0 -1
  106. package/dist/charts/pie-semi-circle-chart/index.css +0 -132
  107. package/dist/charts/pie-semi-circle-chart/index.css.map +0 -1
  108. package/dist/charts/pie-semi-circle-chart/index.d.cts +0 -88
  109. package/dist/charts/pie-semi-circle-chart/index.d.ts +0 -88
  110. package/dist/charts/pie-semi-circle-chart/index.js +0 -18
  111. package/dist/charts/pie-semi-circle-chart/index.js.map +0 -1
  112. package/dist/charts/sparkline/index.cjs +0 -18
  113. package/dist/charts/sparkline/index.cjs.map +0 -1
  114. package/dist/charts/sparkline/index.css +0 -230
  115. package/dist/charts/sparkline/index.css.map +0 -1
  116. package/dist/charts/sparkline/index.d.cts +0 -113
  117. package/dist/charts/sparkline/index.d.ts +0 -113
  118. package/dist/charts/sparkline/index.js +0 -18
  119. package/dist/charts/sparkline/index.js.map +0 -1
  120. package/dist/chunk-2A34OA5O.cjs +0 -51
  121. package/dist/chunk-2A34OA5O.cjs.map +0 -1
  122. package/dist/chunk-2I67QUIV.js +0 -895
  123. package/dist/chunk-2I67QUIV.js.map +0 -1
  124. package/dist/chunk-2ICEEQOC.js +0 -1071
  125. package/dist/chunk-2ICEEQOC.js.map +0 -1
  126. package/dist/chunk-4B7BL2DD.js +0 -120
  127. package/dist/chunk-4B7BL2DD.js.map +0 -1
  128. package/dist/chunk-4OXMTKAL.js +0 -401
  129. package/dist/chunk-4OXMTKAL.js.map +0 -1
  130. package/dist/chunk-ASLARV7L.cjs +0 -81
  131. package/dist/chunk-ASLARV7L.cjs.map +0 -1
  132. package/dist/chunk-B6NLZFRW.js +0 -617
  133. package/dist/chunk-B6NLZFRW.js.map +0 -1
  134. package/dist/chunk-BBAUQOW6.cjs +0 -120
  135. package/dist/chunk-BBAUQOW6.cjs.map +0 -1
  136. package/dist/chunk-BPYKWMI7.js +0 -194
  137. package/dist/chunk-BPYKWMI7.js.map +0 -1
  138. package/dist/chunk-CMMHCTBX.cjs +0 -373
  139. package/dist/chunk-CMMHCTBX.cjs.map +0 -1
  140. package/dist/chunk-CPPXJATQ.cjs +0 -1071
  141. package/dist/chunk-CPPXJATQ.cjs.map +0 -1
  142. package/dist/chunk-DKU775VC.js +0 -219
  143. package/dist/chunk-DKU775VC.js.map +0 -1
  144. package/dist/chunk-GRA7Y2ZG.cjs +0 -401
  145. package/dist/chunk-GRA7Y2ZG.cjs.map +0 -1
  146. package/dist/chunk-I2276W3I.cjs +0 -66
  147. package/dist/chunk-I2276W3I.cjs.map +0 -1
  148. package/dist/chunk-JJIMABHT.js +0 -351
  149. package/dist/chunk-JJIMABHT.js.map +0 -1
  150. package/dist/chunk-KJHWXOCZ.js +0 -421
  151. package/dist/chunk-KJHWXOCZ.js.map +0 -1
  152. package/dist/chunk-KRWGSOJ2.js +0 -91
  153. package/dist/chunk-KRWGSOJ2.js.map +0 -1
  154. package/dist/chunk-KXRWNFQJ.js +0 -51
  155. package/dist/chunk-KXRWNFQJ.js.map +0 -1
  156. package/dist/chunk-LTFH7SEG.js +0 -373
  157. package/dist/chunk-LTFH7SEG.js.map +0 -1
  158. package/dist/chunk-MUNOKLLE.js +0 -165
  159. package/dist/chunk-MUNOKLLE.js.map +0 -1
  160. package/dist/chunk-MXGLYWVP.cjs +0 -351
  161. package/dist/chunk-MXGLYWVP.cjs.map +0 -1
  162. package/dist/chunk-OP6PHB2U.js +0 -81
  163. package/dist/chunk-OP6PHB2U.js.map +0 -1
  164. package/dist/chunk-OYC34VTO.cjs +0 -3957
  165. package/dist/chunk-OYC34VTO.cjs.map +0 -1
  166. package/dist/chunk-PQL5I3F6.cjs +0 -421
  167. package/dist/chunk-PQL5I3F6.cjs.map +0 -1
  168. package/dist/chunk-REZTQ4PH.cjs +0 -488
  169. package/dist/chunk-REZTQ4PH.cjs.map +0 -1
  170. package/dist/chunk-TZRUHQOH.cjs +0 -91
  171. package/dist/chunk-TZRUHQOH.cjs.map +0 -1
  172. package/dist/chunk-UTYVIOWZ.js +0 -3957
  173. package/dist/chunk-UTYVIOWZ.js.map +0 -1
  174. package/dist/chunk-W2LDIX26.cjs +0 -165
  175. package/dist/chunk-W2LDIX26.cjs.map +0 -1
  176. package/dist/chunk-WSG64BVN.cjs +0 -219
  177. package/dist/chunk-WSG64BVN.cjs.map +0 -1
  178. package/dist/chunk-WTQYGUNF.js +0 -400
  179. package/dist/chunk-WTQYGUNF.js.map +0 -1
  180. package/dist/chunk-WYK7EL5R.cjs +0 -895
  181. package/dist/chunk-WYK7EL5R.cjs.map +0 -1
  182. package/dist/chunk-XC4KHJYX.cjs +0 -617
  183. package/dist/chunk-XC4KHJYX.cjs.map +0 -1
  184. package/dist/chunk-XVBH5XHE.cjs +0 -400
  185. package/dist/chunk-XVBH5XHE.cjs.map +0 -1
  186. package/dist/chunk-XWYZIFZW.js +0 -66
  187. package/dist/chunk-XWYZIFZW.js.map +0 -1
  188. package/dist/chunk-Y3NNQMAX.cjs +0 -194
  189. package/dist/chunk-Y3NNQMAX.cjs.map +0 -1
  190. package/dist/chunk-YAFQVVDI.js +0 -488
  191. package/dist/chunk-YAFQVVDI.js.map +0 -1
  192. package/dist/components/legend/index.cjs +0 -12
  193. package/dist/components/legend/index.cjs.map +0 -1
  194. package/dist/components/legend/index.css +0 -91
  195. package/dist/components/legend/index.css.map +0 -1
  196. package/dist/components/legend/index.d.cts +0 -37
  197. package/dist/components/legend/index.d.ts +0 -37
  198. package/dist/components/legend/index.js +0 -12
  199. package/dist/components/legend/index.js.map +0 -1
  200. package/dist/components/tooltip/index.cjs +0 -12
  201. package/dist/components/tooltip/index.cjs.map +0 -1
  202. package/dist/components/tooltip/index.css +0 -13
  203. package/dist/components/tooltip/index.css.map +0 -1
  204. package/dist/components/tooltip/index.d.cts +0 -71
  205. package/dist/components/tooltip/index.d.ts +0 -71
  206. package/dist/components/tooltip/index.js +0 -12
  207. package/dist/components/tooltip/index.js.map +0 -1
  208. package/dist/components/trend-indicator/index.cjs +0 -8
  209. package/dist/components/trend-indicator/index.cjs.map +0 -1
  210. package/dist/components/trend-indicator/index.css +0 -27
  211. package/dist/components/trend-indicator/index.css.map +0 -1
  212. package/dist/components/trend-indicator/index.d.cts +0 -44
  213. package/dist/components/trend-indicator/index.d.ts +0 -44
  214. package/dist/components/trend-indicator/index.js +0 -8
  215. package/dist/components/trend-indicator/index.js.map +0 -1
  216. package/dist/format-metric-value-MXm5DtQ_.d.cts +0 -24
  217. package/dist/format-metric-value-MXm5DtQ_.d.ts +0 -24
  218. package/dist/hooks/index.cjs +0 -29
  219. package/dist/hooks/index.cjs.map +0 -1
  220. package/dist/hooks/index.css +0 -9
  221. package/dist/hooks/index.css.map +0 -1
  222. package/dist/hooks/index.d.cts +0 -264
  223. package/dist/hooks/index.d.ts +0 -264
  224. package/dist/hooks/index.js +0 -29
  225. package/dist/hooks/index.js.map +0 -1
  226. package/dist/leaderboard-chart-BSbg0ufV.d.cts +0 -79
  227. package/dist/leaderboard-chart-odEYxxEC.d.ts +0 -79
  228. package/dist/legend-DFkosEvC.d.cts +0 -9
  229. package/dist/legend-DLswHhOk.d.ts +0 -9
  230. package/dist/providers/index.cjs +0 -21
  231. package/dist/providers/index.cjs.map +0 -1
  232. package/dist/providers/index.css +0 -9
  233. package/dist/providers/index.css.map +0 -1
  234. package/dist/providers/index.d.cts +0 -28
  235. package/dist/providers/index.d.ts +0 -28
  236. package/dist/providers/index.js +0 -21
  237. package/dist/providers/index.js.map +0 -1
  238. package/dist/themes-D0qc5JaW.d.cts +0 -67
  239. package/dist/themes-itO4Ht5g.d.ts +0 -67
  240. package/dist/types-B5f6XQ7Q.d.cts +0 -19
  241. package/dist/types-BsHooDbM.d.ts +0 -19
  242. package/dist/types-BuSrRM4p.d.ts +0 -49
  243. package/dist/types-ChOUI9-N.d.cts +0 -545
  244. package/dist/types-ChOUI9-N.d.ts +0 -545
  245. package/dist/types-Dfw9VOKI.d.cts +0 -49
  246. package/dist/utils/index.cjs +0 -44
  247. package/dist/utils/index.cjs.map +0 -1
  248. package/dist/utils/index.d.cts +0 -226
  249. package/dist/utils/index.d.ts +0 -226
  250. package/dist/utils/index.js +0 -44
  251. package/dist/utils/index.js.map +0 -1
  252. package/dist/with-responsive-CNfhzAUu.d.cts +0 -18
  253. package/dist/with-responsive-CNfhzAUu.d.ts +0 -18
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/charts/bar-chart/bar-chart.tsx","../src/charts/bar-chart/bar-chart.module.scss","../src/charts/bar-chart/private/use-bar-chart-options.ts","../src/charts/bar-chart/private/truncated-tick-component.tsx"],"sourcesContent":["import { formatNumber } from '@automattic/number-formatters';\nimport { PatternLines, PatternCircles, PatternWaves, PatternHexagons } from '@visx/pattern';\nimport { Axis, BarSeries, BarGroup, Grid, XYChart } from '@visx/xychart';\nimport { __ } from '@wordpress/i18n';\nimport { Stack } from '@wordpress/ui';\nimport clsx from 'clsx';\nimport { useCallback, useContext, useState, useRef, useMemo } from 'react';\nimport { Legend, useChartLegendItems } from '../../components/legend';\nimport { AccessibleTooltip, useKeyboardNavigation } from '../../components/tooltip';\nimport { useXYChartTheme, useChartDataTransform, useZeroValueDisplay, useChartMargin, useElementSize, usePrefersReducedMotion } from '../../hooks';\nimport { GlobalChartsProvider, useChartId, useChartRegistration, useGlobalChartsContext, useGlobalChartsTheme, GlobalChartsContext } from '../../providers';\nimport { attachSubComponents } from '../../utils';\nimport { useChartChildren, renderLegendSlot } from '../private/chart-composition';\nimport { SingleChartContext } from '../private/single-chart-context';\nimport { withResponsive } from '../private/with-responsive';\nimport styles from './bar-chart.module.scss';\nimport { useBarChartOptions } from './private';\n\n// Base props type with optional responsive properties\n\n// Composition API types\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\n// Validation function similar to LineChart\nconst validateData = data => {\n if (!data?.length) return 'No data available';\n const hasInvalidData = data.some(series => series.data.some(point => isNaN(point.value) || point.value === null || point.value === undefined || !point.label && (!('date' in point && point.date) || isNaN(point.date.getTime()))));\n if (hasInvalidData) return 'Invalid data';\n return null;\n};\nconst getPatternId = (chartId, index) => `bar-pattern-${chartId}-${index}`;\nconst BarChartInternal = ({\n data,\n chartId: providedChartId,\n width,\n height,\n className,\n margin,\n withTooltips = false,\n showLegend = false,\n legend = {},\n gridVisibility: gridVisibilityProp,\n renderTooltip,\n options = {},\n orientation = 'vertical',\n withPatterns = false,\n showZeroValues = false,\n animation,\n children,\n gap = 'md'\n}) => {\n const legendInteractive = legend.interactive ?? false;\n const horizontal = orientation === 'horizontal';\n const chartId = useChartId(providedChartId);\n const theme = useXYChartTheme(data);\n const dataSorted = useChartDataTransform(data);\n\n // Transform data to add a small value for zero bars to make them visible\n // For vertical bars, height determines bar pixel height; for horizontal bars, width does\n const dataWithVisibleZeros = useZeroValueDisplay(dataSorted, {\n enabled: showZeroValues,\n valueAxisLength: horizontal ? width : height\n });\n\n // Create legend items using the reusable hook\n const legendItems = useChartLegendItems(dataSorted);\n const chartOptions = useBarChartOptions(dataWithVisibleZeros, horizontal, options);\n const defaultMargin = useChartMargin(height, chartOptions, dataSorted, theme, horizontal);\n const [svgWrapperRef,, svgWrapperHeight] = useElementSize();\n const chartRef = useRef(null);\n\n // Process children for composition API (Legend, etc.)\n const {\n legendChildren,\n nonLegendChildren\n } = useChartChildren(children, 'BarChart');\n const hasLegendChild = legendChildren.length > 0;\n\n // Use the measured SVG wrapper height, falling back to the passed height if provided.\n // When there's a legend (via prop or composition), we must wait for measurement because\n // the legend takes space and the svg-wrapper height will be less than the total height.\n const chartHeight = svgWrapperHeight > 0 ? svgWrapperHeight : height;\n const hasLegend = showLegend || hasLegendChild;\n const isWaitingForMeasurement = hasLegend ? svgWrapperHeight === 0 : !chartHeight;\n const [selectedIndex, setSelectedIndex] = useState(undefined);\n const [isNavigating, setIsNavigating] = useState(false);\n const totalPoints = Math.max(0, ...data.map(series => series.data?.length || 0)) * data.length;\n\n // Use the keyboard navigation hook\n const {\n tooltipRef,\n onChartFocus,\n onChartBlur,\n onChartKeyDown\n } = useKeyboardNavigation({\n selectedIndex,\n setSelectedIndex,\n isNavigating,\n setIsNavigating,\n chartRef,\n totalPoints\n });\n const {\n getElementStyles,\n isSeriesVisible\n } = useGlobalChartsContext();\n const providerTheme = useGlobalChartsTheme();\n\n // Add visibility information to series when using interactive legends\n const seriesWithVisibility = useMemo(() => {\n if (!chartId || !legendInteractive) {\n return dataWithVisibleZeros.map((series, index) => ({\n series,\n index,\n isVisible: true\n }));\n }\n return dataWithVisibleZeros.map((series, index) => ({\n series,\n index,\n isVisible: isSeriesVisible(chartId, series.label)\n }));\n }, [dataWithVisibleZeros, chartId, isSeriesVisible, legendInteractive]);\n\n // Check if all series are hidden\n const allSeriesHidden = useMemo(() => {\n return seriesWithVisibility.every(({\n isVisible\n }) => !isVisible);\n }, [seriesWithVisibility]);\n const getBarBackground = useCallback(index => () => withPatterns ? `url(#${getPatternId(chartId, index)})` : getElementStyles({\n data: dataSorted[index],\n index\n }).color, [withPatterns, getElementStyles, dataSorted, chartId]);\n const renderDefaultTooltip = useCallback(({\n tooltipData\n }) => {\n const nearestDatum = tooltipData?.nearestDatum?.datum;\n if (!nearestDatum) return null;\n return /*#__PURE__*/_jsxs(\"div\", {\n className: styles['bar-chart__tooltip'],\n children: [/*#__PURE__*/_jsx(\"div\", {\n className: styles['bar-chart__tooltip-header'],\n children: tooltipData?.nearestDatum?.key\n }), /*#__PURE__*/_jsxs(\"div\", {\n className: styles['bar-chart__tooltip-row'],\n children: [/*#__PURE__*/_jsxs(\"span\", {\n className: styles['bar-chart__tooltip-label'],\n children: [chartOptions.tooltip.labelFormatter(nearestDatum.label || (nearestDatum.date ? nearestDatum.date.getTime() : 0), 0, []), \":\"]\n }), /*#__PURE__*/_jsx(\"span\", {\n className: styles['bar-chart__tooltip-value'],\n children: formatNumber(nearestDatum.value)\n })]\n })]\n });\n }, [chartOptions.tooltip]);\n const renderPattern = useCallback((index, color) => {\n const patternType = index % 4;\n const id = getPatternId(chartId, index);\n const commonProps = {\n id,\n stroke: 'white',\n strokeWidth: 1,\n background: color\n };\n switch (patternType) {\n case 0:\n default:\n return /*#__PURE__*/_jsx(PatternLines, {\n ...commonProps,\n width: 5,\n height: 5,\n orientation: ['diagonal']\n }, id);\n case 1:\n return /*#__PURE__*/_jsx(PatternCircles, {\n ...commonProps,\n width: 6,\n height: 6,\n fill: \"white\"\n }, id);\n case 2:\n return /*#__PURE__*/_jsx(PatternWaves, {\n ...commonProps,\n width: 4,\n height: 4\n }, id);\n case 3:\n return /*#__PURE__*/_jsx(PatternHexagons, {\n ...commonProps,\n size: 8,\n height: 3\n }, id);\n }\n }, [chartId]);\n const createPatternBorderStyle = useCallback((index, color) => {\n const patternId = getPatternId(chartId, index);\n return `\n\t\t\t.visx-bar[fill=\"url(#${patternId})\"] {\n\t\t\t\tstroke: ${color};\n\t\t\t\tstroke-width: 1;\n\t\t\t\t}\n\t\t\t`;\n }, [chartId]);\n const createKeyboardHighlightStyle = useCallback(() => {\n if (selectedIndex === undefined) return '';\n\n // Calculate which bar should be highlighted based on selectedIndex\n // Pattern: [series1[0], series2[0], series3[0], series1[1], series2[1], series3[1], ...]\n const maxDataPoints = Math.max(...data.map(s => s.data.length));\n const dataPointIndex = Math.floor(selectedIndex / data.length);\n const seriesIndex = selectedIndex % data.length;\n\n // Only highlight if we're within valid bounds\n if (dataPointIndex >= maxDataPoints || seriesIndex >= data.length) {\n return '';\n }\n const seriesData = data[seriesIndex];\n if (dataPointIndex >= seriesData.data.length) {\n return '';\n }\n\n // Based on the DOM structure analysis:\n // - All bars are in a single .visx-bar-group\n // - Bars are ordered as: [series1[0], series1[1], series2[0], series2[1], ...]\n // - So we need to calculate the actual bar index in the DOM\n const actualBarIndex = seriesIndex * maxDataPoints + dataPointIndex;\n\n // Use a CSS class selector instead of ID since useId() generates invalid CSS ID characters\n const generatedStyles = `\n\t\t\t.bar-chart[data-chart-id=\"bar-chart-${chartId}\"] .visx-bar-group .visx-bar:nth-child(${actualBarIndex + 1}) {\n\t\t\t\tstroke: #005fcc;\n\t\t\t\tstroke-width: 2px;\n\t\t\t}\n\t\t`;\n return generatedStyles;\n }, [selectedIndex, data, chartId]);\n\n // Validate data first\n const error = validateData(dataSorted);\n const isDataValid = !error;\n\n // Memoize metadata to prevent unnecessary re-registration\n const chartMetadata = useMemo(() => ({\n orientation,\n withPatterns\n }), [orientation, withPatterns]);\n\n // Register chart with context only if data is valid\n useChartRegistration({\n chartId,\n legendItems,\n chartType: 'bar',\n isDataValid,\n metadata: chartMetadata\n });\n const prefersReducedMotion = usePrefersReducedMotion();\n if (error) {\n return /*#__PURE__*/_jsx(\"div\", {\n className: clsx('bar-chart', styles['bar-chart']),\n children: error\n });\n }\n const gridVisibility = gridVisibilityProp ?? chartOptions.gridVisibility;\n const highlightedBarStyle = createKeyboardHighlightStyle();\n const legendPosition = legend.position ?? 'bottom';\n const legendElement = showLegend && /*#__PURE__*/_jsx(Legend, {\n orientation: legend.orientation ?? 'horizontal',\n position: legendPosition,\n alignment: legend.alignment ?? 'center',\n labelStyles: legend.labelStyles,\n itemClassName: legend.itemClassName,\n itemStyles: legend.itemStyles,\n shapeStyles: legend.shapeStyles,\n className: styles['bar-chart__legend'],\n shape: legend.shape ?? 'rect',\n chartId: chartId,\n interactive: legendInteractive\n });\n return /*#__PURE__*/_jsx(SingleChartContext.Provider, {\n value: {\n chartId,\n chartWidth: width,\n chartHeight\n },\n children: /*#__PURE__*/_jsxs(Stack, {\n direction: \"column\",\n gap: gap,\n className: clsx('bar-chart', styles['bar-chart'], {\n [styles[`bar-chart--animated${horizontal ? '-horizontal' : ''}`]]: animation && !prefersReducedMotion\n }, className),\n style: {\n width,\n height,\n visibility: isWaitingForMeasurement ? 'hidden' : 'visible'\n },\n \"data-chart-id\": `bar-chart-${chartId}`,\n children: [legendPosition === 'top' && legendElement, renderLegendSlot(legendChildren, 'top'), /*#__PURE__*/_jsx(\"div\", {\n className: styles['bar-chart__svg-wrapper'],\n ref: svgWrapperRef,\n role: \"grid\",\n \"aria-label\": __('Bar chart', 'jetpack-charts'),\n tabIndex: 0,\n onKeyDown: onChartKeyDown,\n onFocus: onChartFocus,\n onBlur: onChartBlur,\n children: !isWaitingForMeasurement && /*#__PURE__*/_jsx(\"div\", {\n ref: chartRef,\n children: /*#__PURE__*/_jsxs(XYChart, {\n theme: theme,\n width: width,\n height: chartHeight,\n margin: {\n ...defaultMargin,\n ...margin\n },\n xScale: chartOptions.xScale,\n yScale: chartOptions.yScale,\n horizontal: horizontal,\n pointerEventsDataKey: \"nearest\",\n children: [/*#__PURE__*/_jsx(Grid, {\n columns: gridVisibility.includes('y'),\n rows: gridVisibility.includes('x'),\n numTicks: 4\n }), withPatterns && /*#__PURE__*/_jsxs(_Fragment, {\n children: [/*#__PURE__*/_jsx(\"defs\", {\n children: dataSorted.map((seriesData, index) => renderPattern(index, getElementStyles({\n data: seriesData,\n index\n }).color))\n }), /*#__PURE__*/_jsx(\"style\", {\n children: dataSorted.map((seriesData, index) => createPatternBorderStyle(index, getElementStyles({\n data: seriesData,\n index\n }).color))\n })]\n }), highlightedBarStyle && /*#__PURE__*/_jsx(\"style\", {\n children: highlightedBarStyle\n }), allSeriesHidden ? /*#__PURE__*/_jsx(\"text\", {\n x: width / 2,\n y: chartHeight / 2,\n textAnchor: \"middle\",\n fill: providerTheme.gridStyles?.stroke || '#ccc',\n fontSize: \"14\",\n fontFamily: \"-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif\",\n children: __('All series are hidden. Click legend items to show data.', 'jetpack-charts')\n }) : null, /*#__PURE__*/_jsx(BarGroup, {\n padding: chartOptions.barGroup.padding,\n children: seriesWithVisibility.map(({\n series: seriesData,\n index,\n isVisible\n }) => {\n // Skip rendering invisible series\n if (!isVisible) {\n return null;\n }\n return /*#__PURE__*/_jsx(BarSeries, {\n dataKey: seriesData?.label,\n data: seriesData.data,\n yAccessor: chartOptions.accessors.yAccessor,\n xAccessor: chartOptions.accessors.xAccessor,\n colorAccessor: getBarBackground(index)\n }, seriesData?.label);\n })\n }), /*#__PURE__*/_jsx(Axis, {\n ...chartOptions.axis.x\n }), /*#__PURE__*/_jsx(Axis, {\n ...chartOptions.axis.y\n }), withTooltips && /*#__PURE__*/_jsx(AccessibleTooltip, {\n detectBounds: true,\n snapTooltipToDatumX: true,\n snapTooltipToDatumY: true,\n renderTooltip: renderTooltip || renderDefaultTooltip,\n selectedIndex: selectedIndex,\n tooltipRef: tooltipRef,\n keyboardFocusedClassName: styles['bar-chart__tooltip--keyboard-focused'],\n series: data,\n mode: \"individual\"\n })]\n })\n })\n }), legendPosition === 'bottom' && legendElement, renderLegendSlot(legendChildren, 'bottom'), nonLegendChildren]\n })\n });\n};\nconst BarChartWithProvider = props => {\n const existingContext = useContext(GlobalChartsContext);\n\n // If we're already in a GlobalChartsProvider context, don't create a new one\n if (existingContext) {\n return /*#__PURE__*/_jsx(BarChartInternal, {\n ...props\n });\n }\n\n // Otherwise, create our own GlobalChartsProvider\n return /*#__PURE__*/_jsx(GlobalChartsProvider, {\n children: /*#__PURE__*/_jsx(BarChartInternal, {\n ...props\n })\n });\n};\nBarChartWithProvider.displayName = 'BarChart';\n\n// Create BarChart with composition API\nconst BarChart = attachSubComponents(BarChartWithProvider, {\n Legend: Legend\n});\n\n// Create responsive BarChart with composition API\nconst BarChartResponsive = attachSubComponents(withResponsive(BarChartWithProvider), {\n Legend: Legend\n});\nexport { BarChartResponsive as default, BarChart as BarChartUnresponsive };","import 'css-chunk:src/charts/bar-chart/bar-chart.module.scss';export default {\n \"bar-chart__svg-wrapper\": \"a8ccharts-9CsqC0\",\n \"bar-chart\": \"a8ccharts-3gflnB\",\n \"bar-chart--animated\": \"a8ccharts-98W-yu\",\n \"rise\": \"a8ccharts-z6AsiQ\",\n \"bar-chart--animated-horizontal\": \"a8ccharts-HFA3FF\",\n \"stretch\": \"a8ccharts-DQp37O\"\n};","import { formatNumberCompact } from '@automattic/number-formatters';\nimport { useMemo } from 'react';\nimport { TruncatedXTickComponent, TruncatedYTickComponent } from './truncated-tick-component';\nimport type { EnhancedDataPoint } from '../../../hooks/use-zero-value-display';\nimport type { DataPointDate, BaseChartProps, SeriesData } from '../../../types';\nimport type { TickFormatter } from '@visx/axis';\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\n/**\n * Get the group padding of a scale.\n *\n * @param scale - The scale to get the group padding of.\n * @return The group padding of the scale.\n */\nconst getGroupPadding = ( scale: Record< string, unknown > ): number => {\n\treturn typeof scale.paddingInner === 'number' ? ( scale.paddingInner as number ) : 0;\n};\n\n/**\n * Returns the merged options for the bar chart, including axis and scale configuration based on the orientation.\n *\n * @param data - The data to be displayed in the chart.\n * @param horizontal - Whether the chart is horizontal or vertical.\n * @param options - The options for the chart.\n * @return The merged options for the chart.\n */\nexport function useBarChartOptions(\n\tdata: SeriesData[],\n\thorizontal: boolean,\n\toptions: BaseChartProps[ 'options' ] = {}\n) {\n\tconst defaultOptions = useMemo( () => {\n\t\tconst bandScale = {\n\t\t\ttype: 'band' as const,\n\t\t\tpadding: 0.2,\n\t\t\tpaddingInner: 0.1,\n\t\t};\n\t\tconst linearScale = {\n\t\t\ttype: 'linear' as const,\n\t\t\tnice: true,\n\t\t\tzero: false,\n\t\t};\n\n\t\tconst labelFormatter = data?.[ 0 ]?.data?.[ 0 ]?.label\n\t\t\t? ( label: string ) => label\n\t\t\t: formatDateTick;\n\t\tconst valueFormatter = formatNumberCompact as TickFormatter< unknown >;\n\n\t\tconst labelAccessor = ( d: DataPointDate ) => d?.label || d?.date;\n\t\tconst valueAccessor = ( d: DataPointDate | EnhancedDataPoint ) => {\n\t\t\t// Use visualValue for bar rendering if available (for zero values), otherwise use value\n\t\t\tconst enhancedPoint = d as EnhancedDataPoint;\n\t\t\treturn enhancedPoint?.visualValue !== undefined ? enhancedPoint.visualValue : d?.value;\n\t\t};\n\n\t\treturn {\n\t\t\tvertical: {\n\t\t\t\txTickFormat: labelFormatter,\n\t\t\t\tyTickFormat: valueFormatter,\n\t\t\t\ttooltipLabelFormatter: labelFormatter,\n\t\t\t\txAccessor: labelAccessor,\n\t\t\t\tyAccessor: valueAccessor,\n\t\t\t\tgridVisibility: 'x',\n\t\t\t\txScale: bandScale,\n\t\t\t\tyScale: linearScale,\n\t\t\t},\n\t\t\thorizontal: {\n\t\t\t\txTickFormat: valueFormatter,\n\t\t\t\tyTickFormat: labelFormatter,\n\t\t\t\ttooltipLabelFormatter: labelFormatter,\n\t\t\t\txAccessor: valueAccessor,\n\t\t\t\tyAccessor: labelAccessor,\n\t\t\t\tgridVisibility: 'y',\n\t\t\t\txScale: linearScale,\n\t\t\t\tyScale: bandScale,\n\t\t\t},\n\t\t};\n\t}, [ data ] );\n\n\treturn useMemo( () => {\n\t\tconst orientationKey = horizontal ? 'horizontal' : 'vertical';\n\t\tconst {\n\t\t\txTickFormat,\n\t\t\tyTickFormat,\n\t\t\ttooltipLabelFormatter: defaultTooltipLabelFormatter,\n\t\t\txAccessor,\n\t\t\tyAccessor,\n\t\t\tgridVisibility,\n\t\t\txScale: baseXScale,\n\t\t\tyScale: baseYScale,\n\t\t} = defaultOptions[ orientationKey ];\n\n\t\tconst xScale = { ...baseXScale, ...( options.xScale || {} ) };\n\t\tconst yScale = { ...baseYScale, ...( options.yScale || {} ) };\n\t\tconst providedToolTipLabelFormatter = horizontal\n\t\t\t? options.axis?.y?.tickFormat\n\t\t\t: options.axis?.x?.tickFormat;\n\n\t\tconst { labelOverflow: xLabelOverflow, ...xAxisOptions } = options.axis?.x || {};\n\t\tconst { labelOverflow: yLabelOverflow, ...yAxisOptions } = options.axis?.y || {};\n\n\t\treturn {\n\t\t\tgridVisibility,\n\t\t\txScale,\n\t\t\tyScale,\n\t\t\taccessors: {\n\t\t\t\txAccessor,\n\t\t\t\tyAccessor,\n\t\t\t},\n\t\t\taxis: {\n\t\t\t\tx: {\n\t\t\t\t\torientation: 'bottom' as const,\n\t\t\t\t\tnumTicks: 4,\n\t\t\t\t\ttickFormat: xTickFormat,\n\t\t\t\t\t...( xLabelOverflow === 'ellipsis' ? { tickComponent: TruncatedXTickComponent } : {} ),\n\t\t\t\t\t...xAxisOptions,\n\t\t\t\t},\n\t\t\t\ty: {\n\t\t\t\t\torientation: 'left' as const,\n\t\t\t\t\tnumTicks: 4,\n\t\t\t\t\ttickFormat: yTickFormat,\n\t\t\t\t\t...( yLabelOverflow === 'ellipsis' ? { tickComponent: TruncatedYTickComponent } : {} ),\n\t\t\t\t\t...yAxisOptions,\n\t\t\t\t},\n\t\t\t},\n\t\t\tbarGroup: {\n\t\t\t\tpadding: getGroupPadding( horizontal ? yScale : xScale ),\n\t\t\t},\n\t\t\ttooltip: {\n\t\t\t\tlabelFormatter: providedToolTipLabelFormatter || defaultTooltipLabelFormatter,\n\t\t\t},\n\t\t};\n\t}, [ defaultOptions, options, horizontal ] );\n}\n","import { DataContext } from '@visx/xychart';\nimport { useContext } from 'react';\nimport { isSafari } from '../../../utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n/**\n * Get the bandwidth of a scale\n *\n * @param scale - The scale to get the bandwidth of\n * @return The bandwidth of the scale\n */\nconst getScaleBandwidth = scale => {\n return scale && 'bandwidth' in scale ? scale.bandwidth() ?? 0 : 0;\n};\n/**\n * Minimum width in pixels for tick labels when scale bandwidth is very small.\n * Prevents labels from collapsing to unreadable widths on dense charts.\n *\n * Trade-off: When bandwidth is less than this minimum (e.g., many bars in a narrow chart),\n * adjacent labels may overlap since each label uses this minimum width regardless of\n * available space. This prioritizes label readability over preventing overlap.\n *\n * For very dense charts where overlap occurs, consider:\n * - Using `numTicks` option to reduce the number of displayed labels\n * - Using `tickFormat` to abbreviate label text\n * - Increasing chart width or reducing data points\n */\nconst MIN_TICK_LABEL_WIDTH = 20;\n\n/**\n * A tick component that renders labels with text truncation (ellipsis) when they exceed\n * the available bandwidth. Shows the full text on hover via native title attribute.\n *\n * Uses foreignObject to embed HTML within SVG, enabling CSS text-overflow: ellipsis.\n * Inherits text styles from tickLabelProps passed by visx Axis component.\n *\n * Note: A minimum label width (MIN_TICK_LABEL_WIDTH) is enforced to keep labels readable.\n * On very dense charts where bandwidth < 20px, this may cause label overlap.\n * See MIN_TICK_LABEL_WIDTH documentation for mitigation strategies.\n *\n * @param props - The props for the truncated tick component\n * @param props.x - The x position of the tick\n * @param props.y - The y position of the tick\n * @param props.formattedValue - The formatted value of the tick\n * @param props.axis - The axis this tick belongs to\n * @param props.textAnchor - The text anchor of the tick\n * @param props.fill - The fill color of the tick\n * @param props.dy - The dy offset of the tick\n *\n * @return The truncated tick component\n */\nexport const TruncatedTickComponent = ({\n x,\n y,\n formattedValue,\n axis,\n textAnchor,\n fill,\n dy,\n ...textProps\n}) => {\n // Get max width of the tick label\n const {\n xScale,\n yScale\n } = useContext(DataContext) || {};\n const scale = axis === 'x' ? xScale : yScale;\n const bandwidth = getScaleBandwidth(scale);\n const maxWidth = Math.max(bandwidth, MIN_TICK_LABEL_WIDTH);\n\n // Map SVG textAnchor to CSS textAlign\n let textAlign = 'center';\n if (textAnchor === 'start') {\n textAlign = 'left';\n } else if (textAnchor === 'end') {\n textAlign = 'right';\n } else if (textAnchor === 'middle') {\n textAlign = 'center';\n }\n\n // Calculate x offset based on text alignment\n let xOffset = 0;\n if (textAlign === 'center') {\n xOffset = -maxWidth / 2;\n } else if (textAlign === 'right') {\n xOffset = -maxWidth;\n }\n\n // Extract compatible style properties from SVG text props\n const {\n fontSize,\n fontFamily,\n fontWeight,\n fontStyle,\n letterSpacing,\n opacity\n } = textProps;\n const textStyles = {\n /**\n * SVG <text> elements are vertically aligned to the baseline by default, but HTML <div> elements inside <foreignObject>\n * are positioned relative to the top-left corner. To visually align the tick label like SVG text,\n * we shift the div up by 100% of its height and adjust by twice the SVG dy value (from visx) to approximate original placement.\n */\n transform: `translateY(calc(-100% + ${dy ?? '0'} * 2))`,\n // Safari doesn't work well with foreignObject positioning. Use position: fixed as a workaround.\n ...(isSafari() ? {\n position: 'fixed'\n } : {}),\n // Apply compatible SVG text styles\n fontSize,\n fontFamily,\n fontWeight,\n fontStyle,\n letterSpacing,\n opacity,\n // Convert svg text styles to CSS styles for the div\n color: fill ?? 'inherit',\n textAlign,\n // Ensure text is truncated with ellipsis, remains on one line, and shows the full value in a tooltip on hover.\n // The surrounding div uses CSS to handle overflow, and the 'title' attribute is set for accessibility.\n width: maxWidth,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n cursor: 'default',\n pointerEvents: 'auto'\n };\n return /*#__PURE__*/_jsx(\"foreignObject\", {\n x: x + xOffset,\n y: y,\n width: maxWidth,\n height: 0,\n overflow: \"visible\",\n children: /*#__PURE__*/_jsx(\"div\", {\n style: textStyles,\n title: formattedValue,\n children: formattedValue\n })\n });\n};\n\n/**\n * Factory function to create a truncated tick component for a specific axis.\n * Returns a component that can be passed to visx's tickComponent prop.\n *\n * @param axis - The axis this tick component is for ('x' or 'y')\n * @return A tick component function compatible with visx's TickRendererProps\n */\nconst createTruncatedTickComponent = axis => props => {\n return /*#__PURE__*/_jsx(TruncatedTickComponent, {\n ...props,\n axis: axis\n });\n};\n\n/**\n * Pre-created tick components for x and y axes.\n * These functions are created once at module initialization and reused,\n * avoiding repeated factory calls when configuring axes.\n */\nexport const TruncatedXTickComponent = createTruncatedTickComponent('x');\nexport const TruncatedYTickComponent = createTruncatedTickComponent('y');"],"mappings":"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","names":["useContext","useMemo","_jsx","useMemo","useContext"]}
@@ -1,120 +0,0 @@
1
- "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
2
-
3
- var _chunkASLARV7Lcjs = require('./chunk-ASLARV7L.cjs');
4
-
5
-
6
-
7
-
8
- var _chunkWYK7EL5Rcjs = require('./chunk-WYK7EL5R.cjs');
9
-
10
-
11
-
12
-
13
- var _chunkMXGLYWVPcjs = require('./chunk-MXGLYWVP.cjs');
14
-
15
- // src/charts/geo-chart/geo-chart.tsx
16
- var _i18n = require('@wordpress/i18n');
17
- var _clsx = require('clsx'); var _clsx2 = _interopRequireDefault(_clsx);
18
- var _react = require('react');
19
- var _reactgooglecharts = require('react-google-charts');
20
-
21
- // src/charts/geo-chart/geo-chart.module.scss
22
- var geo_chart_module_default = {
23
- "container": "a8ccharts-JvcqOz"
24
- };
25
-
26
- // src/charts/geo-chart/geo-chart.tsx
27
- var _jsxruntime = require('react/jsx-runtime');
28
- var DEFAULT_FEATURE_FILL_COLOR = "#ffffff";
29
- var DEFAULT_BACKGROUND_COLOR = "#ffffff";
30
- var GeoChartInternal = ({
31
- className,
32
- data,
33
- width,
34
- height,
35
- region = "world",
36
- resolution = "countries",
37
- renderPlaceholder
38
- }) => {
39
- const {
40
- getElementStyles,
41
- theme: {
42
- geoChart: {
43
- featureFillColor
44
- },
45
- backgroundColor
46
- }
47
- } = _chunkWYK7EL5Rcjs.useGlobalChartsContext.call(void 0, );
48
- const loadingPlaceholder = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", {
49
- className: _clsx2.default.call(void 0, "geo-chart", geo_chart_module_default.container, className),
50
- style: {
51
- width,
52
- height
53
- },
54
- children: renderPlaceholder ? renderPlaceholder() : _i18n.__.call(void 0, "Loading map", "jetpack-charts")
55
- });
56
- const fullColorHex = getElementStyles({
57
- index: 0
58
- }).color;
59
- const lightColorHex = _chunkMXGLYWVPcjs.lightenHexColor.call(void 0, fullColorHex, 0.8);
60
- const backgroundColorHex = _chunkMXGLYWVPcjs.normalizeColorToHex.call(void 0, backgroundColor, null, _chunkMXGLYWVPcjs.resolveCssVariable) || DEFAULT_BACKGROUND_COLOR;
61
- const defaultFillColorHex = _chunkMXGLYWVPcjs.normalizeColorToHex.call(void 0, featureFillColor, null, _chunkMXGLYWVPcjs.resolveCssVariable) || DEFAULT_FEATURE_FILL_COLOR;
62
- const hasHtmlTooltips = _react.useMemo.call(void 0, () => data.length > 0 && data[0].some((col) => typeof col === "object" && col !== null && "role" in col && col.role === "tooltip" && "p" in col && typeof col.p === "object" && col.p !== null && "html" in col.p && col.p.html === true), [data]);
63
- const options = _react.useMemo.call(void 0, () => ({
64
- ...region !== "world" && {
65
- region
66
- },
67
- ...resolution !== "countries" && {
68
- resolution
69
- },
70
- colorAxis: {
71
- colors: [lightColorHex, fullColorHex]
72
- },
73
- backgroundColor: backgroundColorHex,
74
- datalessRegionColor: defaultFillColorHex,
75
- defaultColor: defaultFillColorHex,
76
- tooltip: {
77
- trigger: "focus",
78
- isHtml: hasHtmlTooltips
79
- },
80
- legend: "none",
81
- keepAspectRatio: true
82
- }), [region, resolution, lightColorHex, fullColorHex, backgroundColorHex, defaultFillColorHex, hasHtmlTooltips]);
83
- return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", {
84
- className: _clsx2.default.call(void 0, "geo-chart", geo_chart_module_default.container, className),
85
- style: {
86
- width,
87
- height,
88
- backgroundColor
89
- },
90
- children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactgooglecharts.Chart, {
91
- chartType: "GeoChart",
92
- width,
93
- height,
94
- data,
95
- options,
96
- loader: loadingPlaceholder
97
- })
98
- });
99
- };
100
- var GeoChartWithProvider = (props) => {
101
- const existingContext = _react.useContext.call(void 0, _chunkWYK7EL5Rcjs.GlobalChartsContext);
102
- if (existingContext) {
103
- return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, GeoChartInternal, {
104
- ...props
105
- });
106
- }
107
- return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkWYK7EL5Rcjs.GlobalChartsProvider, {
108
- children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, GeoChartInternal, {
109
- ...props
110
- })
111
- });
112
- };
113
- GeoChartWithProvider.displayName = "GeoChart";
114
- var GeoChartResponsive = _chunkASLARV7Lcjs.withResponsive.call(void 0, GeoChartWithProvider);
115
-
116
-
117
-
118
-
119
- exports.GeoChartWithProvider = GeoChartWithProvider; exports.GeoChartResponsive = GeoChartResponsive;
120
- //# sourceMappingURL=chunk-BBAUQOW6.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["/home/runner/work/jetpack/jetpack/projects/js-packages/charts/dist/chunk-BBAUQOW6.cjs","../src/charts/geo-chart/geo-chart.tsx","../src/charts/geo-chart/geo-chart.module.scss"],"names":[],"mappings":"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","file":"/home/runner/work/jetpack/jetpack/projects/js-packages/charts/dist/chunk-BBAUQOW6.cjs","sourcesContent":[null,"/**\n * External dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport clsx from 'clsx';\nimport { useContext, useMemo } from 'react';\nimport { Chart } from 'react-google-charts';\n/**\n * Internal dependencies\n */\nimport { GlobalChartsContext, GlobalChartsProvider, useGlobalChartsContext } from '../../providers';\nimport { lightenHexColor, normalizeColorToHex } from '../../utils/color-utils';\nimport { resolveCssVariable } from '../../utils/resolve-css-var';\nimport { withResponsive } from '../private/with-responsive';\nimport styles from './geo-chart.module.scss';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst DEFAULT_FEATURE_FILL_COLOR = '#ffffff';\nconst DEFAULT_BACKGROUND_COLOR = '#ffffff';\n\n/**\n * Renders a geographical chart using Google Charts GeoChart to visualize data.\n *\n * Supports the full Google Charts data format including custom tooltips, formatted values,\n * and multiple data columns for maximum flexibility.\n *\n * Locations can be identified by full name (e.g., 'United States', 'California') or codes\n * (e.g., 'US', 'US-CA'). Full names are recommended for better readability in tooltips.\n *\n * @param props - The props for the GeoChart component\n * @param props.data - Data in Google Charts format (array of arrays with headers)\n * @param props.width - Width of the chart in pixels\n * @param props.height - Height of the chart in pixels\n * @param props.region - Region to display ('world', 'US', or ISO 3166-1 alpha-2 code)\n * @param props.resolution - Resolution level ('countries', 'provinces', or 'metros')\n * @param props.className - Additional CSS class name for the chart container\n * @param props.renderPlaceholder - Optional render function for the loading placeholder\n * @return A React component displaying an interactive map with data visualization\n */\nconst GeoChartInternal = ({\n className,\n data,\n width,\n height,\n region = 'world',\n resolution = 'countries',\n renderPlaceholder\n}) => {\n const {\n getElementStyles,\n theme: {\n geoChart: {\n featureFillColor\n },\n backgroundColor\n }\n } = useGlobalChartsContext();\n\n // Render loading placeholder\n const loadingPlaceholder = /*#__PURE__*/_jsx(\"div\", {\n className: clsx('geo-chart', styles.container, className),\n style: {\n width,\n height\n },\n children: renderPlaceholder ? renderPlaceholder() : __('Loading map', 'jetpack-charts')\n });\n\n // Google charts doesn't accept CSS variables, so we need to convert them to hex colors\n const fullColorHex = getElementStyles({\n index: 0\n }).color;\n const lightColorHex = lightenHexColor(fullColorHex, 0.8);\n // Use normalizeColorToHex to ensure HSL/RGB values from CSS variables are converted to hex\n const backgroundColorHex = normalizeColorToHex(backgroundColor, null, resolveCssVariable) || DEFAULT_BACKGROUND_COLOR;\n const defaultFillColorHex = normalizeColorToHex(featureFillColor, null, resolveCssVariable) || DEFAULT_FEATURE_FILL_COLOR;\n\n // Check if data has HTML tooltips (column with role: 'tooltip' and p.html: true)\n const hasHtmlTooltips = useMemo(() => data.length > 0 && data[0].some(col => typeof col === 'object' && col !== null && 'role' in col && col.role === 'tooltip' && 'p' in col && typeof col.p === 'object' && col.p !== null && 'html' in col.p && col.p.html === true), [data]);\n const options = useMemo(() => ({\n ...(region !== 'world' && {\n region\n }),\n ...(resolution !== 'countries' && {\n resolution\n }),\n colorAxis: {\n colors: [lightColorHex, fullColorHex]\n },\n backgroundColor: backgroundColorHex,\n datalessRegionColor: defaultFillColorHex,\n defaultColor: defaultFillColorHex,\n tooltip: {\n trigger: 'focus',\n isHtml: hasHtmlTooltips\n },\n legend: 'none',\n keepAspectRatio: true\n }), [region, resolution, lightColorHex, fullColorHex, backgroundColorHex, defaultFillColorHex, hasHtmlTooltips]);\n return /*#__PURE__*/_jsx(\"div\", {\n className: clsx('geo-chart', styles.container, className),\n style: {\n width,\n height,\n backgroundColor\n },\n children: /*#__PURE__*/_jsx(Chart, {\n chartType: \"GeoChart\",\n width: width,\n height: height,\n data: data,\n options: options,\n loader: loadingPlaceholder\n })\n });\n};\nconst GeoChartWithProvider = props => {\n const existingContext = useContext(GlobalChartsContext);\n\n // If we're already in a GlobalChartsProvider context, don't create a new one\n if (existingContext) {\n return /*#__PURE__*/_jsx(GeoChartInternal, {\n ...props\n });\n }\n\n // Otherwise, create our own GlobalChartsProvider\n return /*#__PURE__*/_jsx(GlobalChartsProvider, {\n children: /*#__PURE__*/_jsx(GeoChartInternal, {\n ...props\n })\n });\n};\nGeoChartWithProvider.displayName = 'GeoChart';\nconst GeoChartResponsive = withResponsive(GeoChartWithProvider);\nexport { GeoChartResponsive as default, GeoChartWithProvider as GeoChartUnresponsive };","import 'css-chunk:src/charts/geo-chart/geo-chart.module.scss';export default {\n \"container\": \"a8ccharts-JvcqOz\"\n};"]}
@@ -1,194 +0,0 @@
1
- // src/components/tooltip/base-tooltip.tsx
2
- import { formatNumber } from "@automattic/number-formatters";
3
-
4
- // src/components/tooltip/base-tooltip.module.scss
5
- var base_tooltip_module_default = {
6
- "tooltip": "a8ccharts-OfX6nd"
7
- };
8
-
9
- // src/components/tooltip/base-tooltip.tsx
10
- import { Fragment as _Fragment, jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
11
- var DefaultTooltipContent = ({
12
- data
13
- }) => /* @__PURE__ */ _jsxs(_Fragment, {
14
- children: [data?.label, ": ", data?.valueDisplay || formatNumber(data?.value)]
15
- });
16
- var BaseTooltip = ({
17
- data,
18
- top,
19
- left,
20
- component: Component = DefaultTooltipContent,
21
- children,
22
- className,
23
- style,
24
- renderContainer = true
25
- }) => {
26
- const content = children || data && /* @__PURE__ */ _jsx(Component, {
27
- data,
28
- className
29
- });
30
- if (!renderContainer) {
31
- return content;
32
- }
33
- return /* @__PURE__ */ _jsx("div", {
34
- className: base_tooltip_module_default.tooltip,
35
- style: {
36
- top,
37
- left,
38
- ...style
39
- },
40
- role: "tooltip",
41
- children: content
42
- });
43
- };
44
-
45
- // src/components/tooltip/accessible-tooltip.tsx
46
- import { Tooltip, TooltipContext } from "@visx/xychart";
47
- import { useContext, useEffect, useCallback, useMemo } from "react";
48
- import { jsx as _jsx2 } from "react/jsx-runtime";
49
- var AccessibleTooltip = ({
50
- renderTooltip,
51
- selectedIndex,
52
- tooltipRef,
53
- keyboardFocusedClassName,
54
- series = [],
55
- mode = "group",
56
- ...props
57
- }) => {
58
- const tooltipContext = useContext(TooltipContext);
59
- const tooltipData = useMemo(() => {
60
- if (mode !== "individual") return [];
61
- if (series.length === 0) return [];
62
- const maxDataPoints = Math.max(...series.map((s) => s.data.length));
63
- const flattened = [];
64
- for (let dataPointIndex = 0; dataPointIndex < maxDataPoints; dataPointIndex++) {
65
- for (let seriesIndex = 0; seriesIndex < series.length; seriesIndex++) {
66
- const seriesData = series[seriesIndex];
67
- if (dataPointIndex < seriesData.data.length) {
68
- flattened.push({
69
- datum: seriesData.data[dataPointIndex],
70
- seriesLabel: seriesData.label,
71
- seriesIndex,
72
- dataPointIndex
73
- });
74
- }
75
- }
76
- }
77
- return flattened;
78
- }, [series, mode]);
79
- useEffect(() => {
80
- if (selectedIndex === void 0) {
81
- tooltipContext?.hideTooltip();
82
- return;
83
- }
84
- if (mode === "group") {
85
- series.forEach((s, index) => {
86
- if (selectedIndex < s.data.length) {
87
- const datum = s.data[selectedIndex];
88
- tooltipContext?.showTooltip({
89
- datum,
90
- key: s.label,
91
- index
92
- });
93
- }
94
- });
95
- } else if (mode === "individual") {
96
- if (selectedIndex < tooltipData.length) {
97
- const tooltipItem = tooltipData[selectedIndex];
98
- tooltipContext?.showTooltip({
99
- datum: tooltipItem.datum,
100
- key: tooltipItem.seriesLabel,
101
- index: tooltipItem.seriesIndex
102
- });
103
- }
104
- }
105
- }, [selectedIndex, tooltipData, series]);
106
- const focusableRenderTooltip = useMemo(() => {
107
- if (!renderTooltip) return void 0;
108
- return (params) => {
109
- const tooltipContent = renderTooltip(params);
110
- if (selectedIndex !== void 0) {
111
- return /* @__PURE__ */ _jsx2("div", {
112
- ref: tooltipRef,
113
- tabIndex: -1,
114
- role: "tooltip",
115
- "aria-atomic": "true",
116
- className: keyboardFocusedClassName,
117
- children: tooltipContent
118
- }, `chart-tooltip-${selectedIndex}`);
119
- }
120
- return /* @__PURE__ */ _jsx2("div", {
121
- role: "tooltip",
122
- "aria-live": "polite",
123
- children: tooltipContent
124
- });
125
- };
126
- }, [renderTooltip, selectedIndex, tooltipRef, keyboardFocusedClassName]);
127
- return /* @__PURE__ */ _jsx2(Tooltip, {
128
- ...props,
129
- renderTooltip: focusableRenderTooltip
130
- });
131
- };
132
- var useKeyboardNavigation = ({
133
- selectedIndex,
134
- setSelectedIndex,
135
- isNavigating,
136
- setIsNavigating,
137
- chartRef,
138
- totalPoints
139
- }) => {
140
- const tooltipRef = useCallback((element) => {
141
- if (element && selectedIndex !== void 0) {
142
- element.focus();
143
- }
144
- }, [selectedIndex]);
145
- const onChartFocus = useCallback(() => {
146
- if (!isNavigating && selectedIndex !== void 0) {
147
- setSelectedIndex(0);
148
- }
149
- }, [isNavigating, selectedIndex, setSelectedIndex]);
150
- const onChartBlur = useCallback(() => {
151
- setIsNavigating(false);
152
- }, [setIsNavigating]);
153
- const onChartKeyDown = useCallback((event) => {
154
- if (totalPoints === 0) return;
155
- if (event.key === "Tab") {
156
- chartRef.current?.focus();
157
- setSelectedIndex(void 0);
158
- setIsNavigating(false);
159
- return;
160
- }
161
- const currentSelectedIndex = selectedIndex === void 0 ? -1 : selectedIndex;
162
- if (currentSelectedIndex + 1 >= totalPoints && ["ArrowRight"].includes(event.key)) {
163
- chartRef.current?.focus();
164
- setSelectedIndex(void 0);
165
- setIsNavigating(false);
166
- return;
167
- }
168
- event.preventDefault();
169
- if (["ArrowRight"].includes(event.key)) {
170
- setIsNavigating(true);
171
- setSelectedIndex((currentSelectedIndex + 1) % totalPoints);
172
- } else if (["ArrowLeft"].includes(event.key)) {
173
- setIsNavigating(true);
174
- setSelectedIndex((currentSelectedIndex - 1 + totalPoints) % totalPoints);
175
- } else if (event.key === "Escape") {
176
- setSelectedIndex(void 0);
177
- setIsNavigating(false);
178
- chartRef.current?.focus();
179
- }
180
- }, [totalPoints, selectedIndex, setSelectedIndex, setIsNavigating, chartRef]);
181
- return {
182
- tooltipRef,
183
- onChartFocus,
184
- onChartBlur,
185
- onChartKeyDown
186
- };
187
- };
188
-
189
- export {
190
- BaseTooltip,
191
- AccessibleTooltip,
192
- useKeyboardNavigation
193
- };
194
- //# sourceMappingURL=chunk-BPYKWMI7.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/tooltip/base-tooltip.tsx","../src/components/tooltip/base-tooltip.module.scss","../src/components/tooltip/accessible-tooltip.tsx"],"sourcesContent":["import { formatNumber } from '@automattic/number-formatters';\nimport styles from './base-tooltip.module.scss';\nimport { Fragment as _Fragment, jsxs as _jsxs, jsx as _jsx } from \"react/jsx-runtime\";\nconst DefaultTooltipContent = ({\n data\n}) => /*#__PURE__*/_jsxs(_Fragment, {\n children: [data?.label, \": \", data?.valueDisplay || formatNumber(data?.value)]\n});\nexport const BaseTooltip = ({\n data,\n top,\n left,\n component: Component = DefaultTooltipContent,\n children,\n className,\n style,\n renderContainer = true\n}) => {\n const content = children || data && /*#__PURE__*/_jsx(Component, {\n data: data,\n className: className\n });\n if (!renderContainer) {\n return content;\n }\n return /*#__PURE__*/_jsx(\"div\", {\n className: styles.tooltip,\n style: {\n top,\n left,\n ...style\n },\n role: \"tooltip\",\n children: content\n });\n};","import 'css-chunk:src/components/tooltip/base-tooltip.module.scss';export default {\n \"tooltip\": \"a8ccharts-OfX6nd\"\n};","import { Tooltip, TooltipContext } from '@visx/xychart';\nimport { useContext, useEffect, useCallback, useMemo } from 'react';\n\n// Type for flattened tooltip data used in individual mode\n\n// Enhanced tooltip with keyboard navigation and accessibility\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const AccessibleTooltip = ({\n renderTooltip,\n selectedIndex,\n tooltipRef,\n keyboardFocusedClassName,\n series = [],\n mode = 'group',\n ...props\n}) => {\n const tooltipContext = useContext(TooltipContext);\n const tooltipData = useMemo(() => {\n if (mode !== 'individual') return [];\n if (series.length === 0) return [];\n const maxDataPoints = Math.max(...series.map(s => s.data.length));\n const flattened = [];\n\n // Pattern: [series1[0], series2[0], series3[0], series1[1], series2[1], series3[1], ...]\n for (let dataPointIndex = 0; dataPointIndex < maxDataPoints; dataPointIndex++) {\n for (let seriesIndex = 0; seriesIndex < series.length; seriesIndex++) {\n const seriesData = series[seriesIndex];\n if (dataPointIndex < seriesData.data.length) {\n flattened.push({\n datum: seriesData.data[dataPointIndex],\n seriesLabel: seriesData.label,\n seriesIndex,\n dataPointIndex\n });\n }\n }\n }\n return flattened;\n }, [series, mode]);\n\n // Handle tooltip highlighting for keyboard navigation\n useEffect(() => {\n if (selectedIndex === undefined) {\n tooltipContext?.hideTooltip();\n return;\n }\n if (mode === 'group') {\n // Show all series at the selected data point index in single tooltip.\n series.forEach((s, index) => {\n if (selectedIndex < s.data.length) {\n const datum = s.data[selectedIndex];\n tooltipContext?.showTooltip({\n datum,\n key: s.label,\n index\n });\n }\n });\n } else if (mode === 'individual') {\n // Show individual tooltips for each datapoint from each series.\n if (selectedIndex < tooltipData.length) {\n const tooltipItem = tooltipData[selectedIndex];\n tooltipContext?.showTooltip({\n datum: tooltipItem.datum,\n key: tooltipItem.seriesLabel,\n index: tooltipItem.seriesIndex\n });\n }\n }\n\n // Don't include tooltipContext in the dependency array to avoid loop.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedIndex, tooltipData, series]);\n\n // Create a focusable renderTooltip that includes accessibility features\n const focusableRenderTooltip = useMemo(() => {\n if (!renderTooltip) return undefined;\n return params => {\n const tooltipContent = renderTooltip(params);\n if (selectedIndex !== undefined) {\n return /*#__PURE__*/_jsx(\"div\", {\n ref: tooltipRef,\n tabIndex: -1,\n role: \"tooltip\",\n \"aria-atomic\": \"true\",\n className: keyboardFocusedClassName,\n children: tooltipContent\n }, `chart-tooltip-${selectedIndex}`);\n }\n return /*#__PURE__*/_jsx(\"div\", {\n role: \"tooltip\",\n \"aria-live\": \"polite\",\n children: tooltipContent\n });\n };\n }, [renderTooltip, selectedIndex, tooltipRef, keyboardFocusedClassName]);\n return /*#__PURE__*/_jsx(Tooltip, {\n ...props,\n renderTooltip: focusableRenderTooltip\n });\n};\n\n// Keyboard navigation hook for charts\n\nexport const useKeyboardNavigation = ({\n selectedIndex,\n setSelectedIndex,\n isNavigating,\n setIsNavigating,\n chartRef,\n totalPoints\n}) => {\n // Focus the tooltip as soon as it is rendered\n const tooltipRef = useCallback(element => {\n if (element && selectedIndex !== undefined) {\n element.focus();\n }\n }, [selectedIndex]);\n\n // On each focus of chart, reset the selectedIndex to 0, if keyboard navigation is not already active\n const onChartFocus = useCallback(() => {\n if (!isNavigating && selectedIndex !== undefined) {\n setSelectedIndex(0);\n }\n }, [isNavigating, selectedIndex, setSelectedIndex]);\n\n // On each blur of chart, keyboard navigation should restart from first tooltip\n const onChartBlur = useCallback(() => {\n setIsNavigating(false);\n }, [setIsNavigating]);\n const onChartKeyDown = useCallback(event => {\n if (totalPoints === 0) return;\n\n // Keep focus on the chart if tab is pressed\n if (event.key === 'Tab') {\n chartRef.current?.focus();\n setSelectedIndex(undefined);\n setIsNavigating(false);\n return;\n }\n const currentSelectedIndex = selectedIndex === undefined ? -1 : selectedIndex;\n if (currentSelectedIndex + 1 >= totalPoints && ['ArrowRight'].includes(event.key)) {\n chartRef.current?.focus();\n setSelectedIndex(undefined);\n setIsNavigating(false);\n return;\n }\n event.preventDefault();\n if (['ArrowRight'].includes(event.key)) {\n setIsNavigating(true);\n setSelectedIndex((currentSelectedIndex + 1) % totalPoints);\n } else if (['ArrowLeft'].includes(event.key)) {\n setIsNavigating(true);\n setSelectedIndex((currentSelectedIndex - 1 + totalPoints) % totalPoints);\n } else if (event.key === 'Escape') {\n setSelectedIndex(undefined);\n setIsNavigating(false);\n chartRef.current?.focus();\n }\n }, [totalPoints, selectedIndex, setSelectedIndex, setIsNavigating, chartRef]);\n return {\n tooltipRef,\n onChartFocus,\n onChartBlur,\n onChartKeyDown\n };\n};\n\n// Re-export the base Tooltip for backwards compatibility\nexport { Tooltip };"],"mappings":";AAAA,SAAS,oBAAoB;;;ACAsC,IAAO,8BAAQ;AAAA,EAChF,WAAW;AACb;;;ADAA,SAAS,YAAY,WAAW,QAAQ,OAAO,OAAO,YAAY;AAClE,IAAM,wBAAwB,CAAC;AAAA,EAC7B;AACF,MAAmB,sBAAM,WAAW;AAAA,EAClC,UAAU,CAAC,MAAM,OAAO,MAAM,MAAM,gBAAgB,aAAa,MAAM,KAAK,CAAC;AAC/E,CAAC;AACM,IAAM,cAAc,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW,YAAY;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA,kBAAkB;AACpB,MAAM;AACJ,QAAM,UAAU,YAAY,QAAqB,qBAAK,WAAW;AAAA,IAC/D;AAAA,IACA;AAAA,EACF,CAAC;AACD,MAAI,CAAC,iBAAiB;AACpB,WAAO;AAAA,EACT;AACA,SAAoB,qBAAK,OAAO;AAAA,IAC9B,WAAW,4BAAO;AAAA,IAClB,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL;AAAA,IACA,MAAM;AAAA,IACN,UAAU;AAAA,EACZ,CAAC;AACH;;;AEnCA,SAAS,SAAS,sBAAsB;AACxC,SAAS,YAAY,WAAW,aAAa,eAAe;AAK5D,SAAS,OAAOA,aAAY;AACrB,IAAM,oBAAoB,CAAC;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS,CAAC;AAAA,EACV,OAAO;AAAA,EACP,GAAG;AACL,MAAM;AACJ,QAAM,iBAAiB,WAAW,cAAc;AAChD,QAAM,cAAc,QAAQ,MAAM;AAChC,QAAI,SAAS,aAAc,QAAO,CAAC;AACnC,QAAI,OAAO,WAAW,EAAG,QAAO,CAAC;AACjC,UAAM,gBAAgB,KAAK,IAAI,GAAG,OAAO,IAAI,OAAK,EAAE,KAAK,MAAM,CAAC;AAChE,UAAM,YAAY,CAAC;AAGnB,aAAS,iBAAiB,GAAG,iBAAiB,eAAe,kBAAkB;AAC7E,eAAS,cAAc,GAAG,cAAc,OAAO,QAAQ,eAAe;AACpE,cAAM,aAAa,OAAO,WAAW;AACrC,YAAI,iBAAiB,WAAW,KAAK,QAAQ;AAC3C,oBAAU,KAAK;AAAA,YACb,OAAO,WAAW,KAAK,cAAc;AAAA,YACrC,aAAa,WAAW;AAAA,YACxB;AAAA,YACA;AAAA,UACF,CAAC;AAAA,QACH;AAAA,MACF;AAAA,IACF;AACA,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,IAAI,CAAC;AAGjB,YAAU,MAAM;AACd,QAAI,kBAAkB,QAAW;AAC/B,sBAAgB,YAAY;AAC5B;AAAA,IACF;AACA,QAAI,SAAS,SAAS;AAEpB,aAAO,QAAQ,CAAC,GAAG,UAAU;AAC3B,YAAI,gBAAgB,EAAE,KAAK,QAAQ;AACjC,gBAAM,QAAQ,EAAE,KAAK,aAAa;AAClC,0BAAgB,YAAY;AAAA,YAC1B;AAAA,YACA,KAAK,EAAE;AAAA,YACP;AAAA,UACF,CAAC;AAAA,QACH;AAAA,MACF,CAAC;AAAA,IACH,WAAW,SAAS,cAAc;AAEhC,UAAI,gBAAgB,YAAY,QAAQ;AACtC,cAAM,cAAc,YAAY,aAAa;AAC7C,wBAAgB,YAAY;AAAA,UAC1B,OAAO,YAAY;AAAA,UACnB,KAAK,YAAY;AAAA,UACjB,OAAO,YAAY;AAAA,QACrB,CAAC;AAAA,MACH;AAAA,IACF;AAAA,EAIF,GAAG,CAAC,eAAe,aAAa,MAAM,CAAC;AAGvC,QAAM,yBAAyB,QAAQ,MAAM;AAC3C,QAAI,CAAC,cAAe,QAAO;AAC3B,WAAO,YAAU;AACf,YAAM,iBAAiB,cAAc,MAAM;AAC3C,UAAI,kBAAkB,QAAW;AAC/B,eAAoB,gBAAAA,MAAK,OAAO;AAAA,UAC9B,KAAK;AAAA,UACL,UAAU;AAAA,UACV,MAAM;AAAA,UACN,eAAe;AAAA,UACf,WAAW;AAAA,UACX,UAAU;AAAA,QACZ,GAAG,iBAAiB,aAAa,EAAE;AAAA,MACrC;AACA,aAAoB,gBAAAA,MAAK,OAAO;AAAA,QAC9B,MAAM;AAAA,QACN,aAAa;AAAA,QACb,UAAU;AAAA,MACZ,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,eAAe,eAAe,YAAY,wBAAwB,CAAC;AACvE,SAAoB,gBAAAA,MAAK,SAAS;AAAA,IAChC,GAAG;AAAA,IACH,eAAe;AAAA,EACjB,CAAC;AACH;AAIO,IAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AAEJ,QAAM,aAAa,YAAY,aAAW;AACxC,QAAI,WAAW,kBAAkB,QAAW;AAC1C,cAAQ,MAAM;AAAA,IAChB;AAAA,EACF,GAAG,CAAC,aAAa,CAAC;AAGlB,QAAM,eAAe,YAAY,MAAM;AACrC,QAAI,CAAC,gBAAgB,kBAAkB,QAAW;AAChD,uBAAiB,CAAC;AAAA,IACpB;AAAA,EACF,GAAG,CAAC,cAAc,eAAe,gBAAgB,CAAC;AAGlD,QAAM,cAAc,YAAY,MAAM;AACpC,oBAAgB,KAAK;AAAA,EACvB,GAAG,CAAC,eAAe,CAAC;AACpB,QAAM,iBAAiB,YAAY,WAAS;AAC1C,QAAI,gBAAgB,EAAG;AAGvB,QAAI,MAAM,QAAQ,OAAO;AACvB,eAAS,SAAS,MAAM;AACxB,uBAAiB,MAAS;AAC1B,sBAAgB,KAAK;AACrB;AAAA,IACF;AACA,UAAM,uBAAuB,kBAAkB,SAAY,KAAK;AAChE,QAAI,uBAAuB,KAAK,eAAe,CAAC,YAAY,EAAE,SAAS,MAAM,GAAG,GAAG;AACjF,eAAS,SAAS,MAAM;AACxB,uBAAiB,MAAS;AAC1B,sBAAgB,KAAK;AACrB;AAAA,IACF;AACA,UAAM,eAAe;AACrB,QAAI,CAAC,YAAY,EAAE,SAAS,MAAM,GAAG,GAAG;AACtC,sBAAgB,IAAI;AACpB,wBAAkB,uBAAuB,KAAK,WAAW;AAAA,IAC3D,WAAW,CAAC,WAAW,EAAE,SAAS,MAAM,GAAG,GAAG;AAC5C,sBAAgB,IAAI;AACpB,wBAAkB,uBAAuB,IAAI,eAAe,WAAW;AAAA,IACzE,WAAW,MAAM,QAAQ,UAAU;AACjC,uBAAiB,MAAS;AAC1B,sBAAgB,KAAK;AACrB,eAAS,SAAS,MAAM;AAAA,IAC1B;AAAA,EACF,GAAG,CAAC,aAAa,eAAe,kBAAkB,iBAAiB,QAAQ,CAAC;AAC5E,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":["_jsx"]}