@automattic/charts 0.48.0 → 0.49.0

package/CHANGELOG.md

@@ -5,9 +5,14 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [0.49.0] - 2025-11-19
+### Added
+- Add animation in circular shaped charts. [#45870]
+- Add usePrefersReducedMotion hook for accecibility. [#45955]
+
 ## [0.48.0] - 2025-11-18
 ### Changed
-- Remove inline styles from containers to allow consumer overrides [#45953]
+- Remove inline styles from containers to allow consumer overrides. [#45953]
 
 ## [0.47.0] - 2025-11-17
 ### Added
@@ -558,6 +563,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Fixed lints following ESLint rule changes for TS [#40584]
 - Fixing a bug in Chart storybook data. [#40640]
 
+[0.49.0]: https://github.com/Automattic/charts/compare/v0.48.0...v0.49.0
 [0.48.0]: https://github.com/Automattic/charts/compare/v0.47.0...v0.48.0
 [0.47.0]: https://github.com/Automattic/charts/compare/v0.46.3...v0.47.0
 [0.46.3]: https://github.com/Automattic/charts/compare/v0.46.2...v0.46.3

package/dist/{chunk-BQPCOFAP.cjs → chunk-2QROLLIB.cjs}

@@ -7,7 +7,7 @@ var _chunkFX2PTUFCcjs = require('./chunk-FX2PTUFC.cjs');
 
 
 
-var _chunkPNSMPZ3Ecjs = require('./chunk-PNSMPZ3E.cjs');
+var _chunkQTQG3XNMcjs = require('./chunk-QTQG3XNM.cjs');
 
 
 
@@ -17,7 +17,8 @@ var _chunkPNSMPZ3Ecjs = require('./chunk-PNSMPZ3E.cjs');
 
 
 
-var _chunkLSGYIUQXcjs = require('./chunk-LSGYIUQX.cjs');
+
+var _chunkMNZD6UDQcjs = require('./chunk-MNZD6UDQ.cjs');
 
 
 
@@ -4213,8 +4214,8 @@ function useLeaderboardLegendItems({
   withOverlayLabel = false,
   legendLabels
 }) {
-  const { leaderboardChart: leaderboardChartSettings } = _chunkLSGYIUQXcjs.useGlobalChartsTheme.call(void 0, );
-  const { getElementStyles } = _chunkLSGYIUQXcjs.useGlobalChartsContext.call(void 0, );
+  const { leaderboardChart: leaderboardChartSettings } = _chunkMNZD6UDQcjs.useGlobalChartsTheme.call(void 0, );
+  const { getElementStyles } = _chunkMNZD6UDQcjs.useGlobalChartsContext.call(void 0, );
   return _react.useMemo.call(void 0, () => {
     if (!data || data.length === 0) {
       return [];
@@ -4263,7 +4264,7 @@ var leaderboard_chart_module_default = {
   "is-overlay": "a8ccharts-Fqdi5w",
   "label": "a8ccharts-7ZUu0T",
   "bar": "a8ccharts-CnJvgl",
-  "bar__animated": "a8ccharts-qPpCM2",
+  "bar--animated": "a8ccharts-VmRKPb",
   "stretch": "a8ccharts-VlC0fg",
   "valueContainer": "a8ccharts-ZlLh4R",
   "overlayLabel": "a8ccharts-pRqShB",
@@ -4273,13 +4274,13 @@ var leaderboard_chart_module_default = {
 // src/components/leaderboard-chart/leaderboard-chart.tsx
 
 var defaultValueFormatter = (value) => {
-  return _chunkLSGYIUQXcjs.formatMetricValue.call(void 0, value, "number", {
+  return _chunkMNZD6UDQcjs.formatMetricValue.call(void 0, value, "number", {
     useMultipliers: true,
     decimals: 1
   });
 };
 var defaultDeltaFormatter = (value) => {
-  return _chunkLSGYIUQXcjs.formatMetricValue.call(void 0, value / 100, "average", {
+  return _chunkMNZD6UDQcjs.formatMetricValue.call(void 0, value / 100, "average", {
     decimals: 0,
     signDisplay: "exceptZero"
   });
@@ -4306,7 +4307,7 @@ var BarWithLabel = ({
         "div",
         {
           className: _clsx2.default.call(void 0, leaderboard_chart_module_default.bar, {
-            [leaderboard_chart_module_default.bar__animated]: animation
+            [leaderboard_chart_module_default["bar--animated"]]: animation
           }),
           style: {
             width: entry.currentShare + "%",
@@ -4318,7 +4319,7 @@ var BarWithLabel = ({
         "div",
         {
           className: _clsx2.default.call(void 0, leaderboard_chart_module_default.bar, {
-            [leaderboard_chart_module_default.bar__animated]: animation
+            [leaderboard_chart_module_default["bar--animated"]]: animation
           }),
           style: {
             width: entry.previousShare + "%",
@@ -4353,8 +4354,8 @@ var LeaderboardChartInternal = ({
   style,
   children
 }) => {
-  const chartId = _chunkLSGYIUQXcjs.useChartId.call(void 0, providedChartId);
-  const { leaderboardChart: leaderboardChartSettings } = _chunkLSGYIUQXcjs.useGlobalChartsTheme.call(void 0, );
+  const chartId = _chunkMNZD6UDQcjs.useChartId.call(void 0, providedChartId);
+  const { leaderboardChart: leaderboardChartSettings } = _chunkMNZD6UDQcjs.useGlobalChartsTheme.call(void 0, );
   const { otherChildren } = _chunk3Z526IL2cjs.useChartChildren.call(void 0, children, "LeaderboardChart");
   const {
     labelSpacing,
@@ -4364,7 +4365,7 @@ var LeaderboardChartInternal = ({
     secondaryColor: settingsSecondaryColor,
     deltaColors
   } = leaderboardChartSettings;
-  const { getElementStyles, isSeriesVisible } = _chunkLSGYIUQXcjs.useGlobalChartsContext.call(void 0, );
+  const { getElementStyles, isSeriesVisible } = _chunkMNZD6UDQcjs.useGlobalChartsContext.call(void 0, );
   const { color: resolvedPrimaryColor } = getElementStyles({
     index: 0,
     overrideColor: primaryColor || settingsPrimaryColor
@@ -4414,16 +4415,17 @@ var LeaderboardChartInternal = ({
     }),
     [withComparison, withOverlayLabel]
   );
-  _chunkLSGYIUQXcjs.useChartRegistration.call(void 0, {
+  _chunkMNZD6UDQcjs.useChartRegistration.call(void 0, {
     chartId,
     legendItems,
     chartType: "leaderboard",
     isDataValid,
     metadata: chartMetadata
   });
+  const prefersReducedMotion = _chunkMNZD6UDQcjs.usePrefersReducedMotion.call(void 0, );
   if (!data || data.length === 0) {
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkPNSMPZ3Ecjs.SingleChartContext.Provider,
+      _chunkQTQG3XNMcjs.SingleChartContext.Provider,
       {
         value: {
           chartId,
@@ -4450,7 +4452,7 @@ var LeaderboardChartInternal = ({
     );
   }
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _chunkPNSMPZ3Ecjs.SingleChartContext.Provider,
+    _chunkQTQG3XNMcjs.SingleChartContext.Provider,
     {
       value: {
         chartId,
@@ -4486,7 +4488,7 @@ var LeaderboardChartInternal = ({
                     secondaryColor: resolvedSecondaryColor,
                     isPrimaryVisible,
                     isComparisonVisible,
-                    animation: animation && !loading
+                    animation: animation && !loading && !prefersReducedMotion
                   }
                 ) }),
                 /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
@@ -4504,7 +4506,7 @@ var LeaderboardChartInternal = ({
               ] }, entry.id);
             }) }),
             showLegend && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _chunkPNSMPZ3Ecjs.Legend,
+              _chunkQTQG3XNMcjs.Legend,
               {
                 orientation: legendOrientation,
                 position: legendPosition,
@@ -4524,20 +4526,20 @@ var LeaderboardChartInternal = ({
   );
 };
 var LeaderboardChartWithProvider = (props) => {
-  const existingContext = _react.useContext.call(void 0, _chunkLSGYIUQXcjs.GlobalChartsContext);
+  const existingContext = _react.useContext.call(void 0, _chunkMNZD6UDQcjs.GlobalChartsContext);
   if (existingContext) {
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LeaderboardChartInternal, { ...props });
   }
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLSGYIUQXcjs.GlobalChartsProvider, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LeaderboardChartInternal, { ...props }) });
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkMNZD6UDQcjs.GlobalChartsProvider, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LeaderboardChartInternal, { ...props }) });
 };
 LeaderboardChartWithProvider.displayName = "LeaderboardChart";
-var LeaderboardChart = _chunkLSGYIUQXcjs.attachSubComponents.call(void 0, LeaderboardChartWithProvider, {
-  Legend: _chunkPNSMPZ3Ecjs.Legend
+var LeaderboardChart = _chunkMNZD6UDQcjs.attachSubComponents.call(void 0, LeaderboardChartWithProvider, {
+  Legend: _chunkQTQG3XNMcjs.Legend
 });
-var LeaderboardChartResponsive = _chunkLSGYIUQXcjs.attachSubComponents.call(void 0, 
+var LeaderboardChartResponsive = _chunkMNZD6UDQcjs.attachSubComponents.call(void 0, 
   _chunkFX2PTUFCcjs.withResponsive.call(void 0, LeaderboardChartWithProvider),
   {
-    Legend: _chunkPNSMPZ3Ecjs.Legend
+    Legend: _chunkQTQG3XNMcjs.Legend
   }
 );
 
@@ -4576,4 +4578,4 @@ is-plain-object/dist/is-plain-object.mjs:
    * Released under the MIT License.
    *)
 */
-//# sourceMappingURL=chunk-BQPCOFAP.cjs.map
+//# sourceMappingURL=chunk-2QROLLIB.cjs.map