@automattic/charts 0.44.0 → 0.46.0

package/CHANGELOG.md

@@ -5,6 +5,18 @@ 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.46.0] - 2025-10-28
+### Added
+- Charts: Add interactive legend support to LeaderboardChart [#45581]
+
+### Changed
+- Update package dependencies. [#45652]
+
+## [0.45.0] - 2025-10-27
+### Added
+- Add interactive legend support to BarChart. [#45561]
+- Add interactive legend to pie charts. [#45580]
+
 ## [0.44.0] - 2025-10-21
 ### Changed
 - Improve legends toggling. [#45545]
@@ -523,6 +535,8 @@ 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.46.0]: https://github.com/Automattic/charts/compare/v0.45.0...v0.46.0
+[0.45.0]: https://github.com/Automattic/charts/compare/v0.44.0...v0.45.0
 [0.44.0]: https://github.com/Automattic/charts/compare/v0.43.0...v0.44.0
 [0.43.0]: https://github.com/Automattic/charts/compare/v0.42.0...v0.43.0
 [0.42.0]: https://github.com/Automattic/charts/compare/v0.41.1...v0.42.0

package/dist/{chunk-2HB55BRH.js → chunk-4H3J2HCD.js}

@@ -7,7 +7,7 @@ import {
 import {
   Legend,
   SingleChartContext
-} from "./chunk-Q2LDRQN7.js";
+} from "./chunk-PFT2X4OW.js";
 import {
   GlobalChartsContext,
   GlobalChartsProvider,
@@ -17,7 +17,7 @@ import {
   useChartRegistration,
   useGlobalChartsContext,
   useGlobalChartsTheme
-} from "./chunk-3O6FHD2T.js";
+} from "./chunk-A3PGOCJO.js";
 import {
   __commonJS,
   __export,
@@ -630,21 +630,23 @@ function paramCase(input, options) {
   return dotCase(input, __assign2({ delimiter: "-" }, options));
 }
 
-// ../../../node_modules/.pnpm/@wordpress+hooks@4.32.0/node_modules/@wordpress/hooks/build-module/validateNamespace.js
+// ../../../node_modules/.pnpm/@wordpress+hooks@4.33.0/node_modules/@wordpress/hooks/build-module/validateNamespace.js
 function validateNamespace(namespace) {
   if ("string" !== typeof namespace || "" === namespace) {
     console.error("The namespace must be a non-empty string.");
     return false;
   }
   if (!/^[a-zA-Z][a-zA-Z0-9_.\-\/]*$/.test(namespace)) {
-    console.error("The namespace can only contain numbers, letters, dashes, periods, underscores and slashes.");
+    console.error(
+      "The namespace can only contain numbers, letters, dashes, periods, underscores and slashes."
+    );
     return false;
   }
   return true;
 }
 var validateNamespace_default = validateNamespace;
 
-// ../../../node_modules/.pnpm/@wordpress+hooks@4.32.0/node_modules/@wordpress/hooks/build-module/validateHookName.js
+// ../../../node_modules/.pnpm/@wordpress+hooks@4.33.0/node_modules/@wordpress/hooks/build-module/validateHookName.js
 function validateHookName(hookName) {
   if ("string" !== typeof hookName || "" === hookName) {
     console.error("The hook name must be a non-empty string.");
@@ -655,14 +657,16 @@ function validateHookName(hookName) {
     return false;
   }
   if (!/^[a-zA-Z][a-zA-Z0-9_.-]*$/.test(hookName)) {
-    console.error("The hook name can only contain numbers, letters, dashes, periods and underscores.");
+    console.error(
+      "The hook name can only contain numbers, letters, dashes, periods and underscores."
+    );
     return false;
   }
   return true;
 }
 var validateHookName_default = validateHookName;
 
-// ../../../node_modules/.pnpm/@wordpress+hooks@4.32.0/node_modules/@wordpress/hooks/build-module/createAddHook.js
+// ../../../node_modules/.pnpm/@wordpress+hooks@4.33.0/node_modules/@wordpress/hooks/build-module/createAddHook.js
 function createAddHook(hooks, storeKey) {
   return function addHook(hookName, namespace, callback, priority = 10) {
     const hooksStore = hooks[storeKey];
@@ -677,14 +681,12 @@ function createAddHook(hooks, storeKey) {
       return;
     }
     if ("number" !== typeof priority) {
-      console.error("If specified, the hook priority must be a number.");
+      console.error(
+        "If specified, the hook priority must be a number."
+      );
       return;
     }
-    const handler = {
-      callback,
-      priority,
-      namespace
-    };
+    const handler = { callback, priority, namespace };
     if (hooksStore[hookName]) {
       const handlers = hooksStore[hookName].handlers;
       let i2;
@@ -710,13 +712,19 @@ function createAddHook(hooks, storeKey) {
       };
     }
     if (hookName !== "hookAdded") {
-      hooks.doAction("hookAdded", hookName, namespace, callback, priority);
+      hooks.doAction(
+        "hookAdded",
+        hookName,
+        namespace,
+        callback,
+        priority
+      );
     }
   };
 }
 var createAddHook_default = createAddHook;
 
-// ../../../node_modules/.pnpm/@wordpress+hooks@4.32.0/node_modules/@wordpress/hooks/build-module/createRemoveHook.js
+// ../../../node_modules/.pnpm/@wordpress+hooks@4.33.0/node_modules/@wordpress/hooks/build-module/createRemoveHook.js
 function createRemoveHook(hooks, storeKey, removeAll = false) {
   return function removeHook(hookName, namespace) {
     const hooksStore = hooks[storeKey];
@@ -758,19 +766,21 @@ function createRemoveHook(hooks, storeKey, removeAll = false) {
 }
 var createRemoveHook_default = createRemoveHook;
 
-// ../../../node_modules/.pnpm/@wordpress+hooks@4.32.0/node_modules/@wordpress/hooks/build-module/createHasHook.js
+// ../../../node_modules/.pnpm/@wordpress+hooks@4.33.0/node_modules/@wordpress/hooks/build-module/createHasHook.js
 function createHasHook(hooks, storeKey) {
   return function hasHook(hookName, namespace) {
     const hooksStore = hooks[storeKey];
     if ("undefined" !== typeof namespace) {
-      return hookName in hooksStore && hooksStore[hookName].handlers.some((hook) => hook.namespace === namespace);
+      return hookName in hooksStore && hooksStore[hookName].handlers.some(
+        (hook) => hook.namespace === namespace
+      );
     }
     return hookName in hooksStore;
   };
 }
 var createHasHook_default = createHasHook;
 
-// ../../../node_modules/.pnpm/@wordpress+hooks@4.32.0/node_modules/@wordpress/hooks/build-module/createRunHook.js
+// ../../../node_modules/.pnpm/@wordpress+hooks@4.33.0/node_modules/@wordpress/hooks/build-module/createRunHook.js
 function createRunHook(hooks, storeKey, returnFirstArg, async) {
   return function runHook(hookName, ...args) {
     const hooksStore = hooks[storeKey];
@@ -833,30 +843,31 @@ function createRunHook(hooks, storeKey, returnFirstArg, async) {
 }
 var createRunHook_default = createRunHook;
 
-// ../../../node_modules/.pnpm/@wordpress+hooks@4.32.0/node_modules/@wordpress/hooks/build-module/createCurrentHook.js
+// ../../../node_modules/.pnpm/@wordpress+hooks@4.33.0/node_modules/@wordpress/hooks/build-module/createCurrentHook.js
 function createCurrentHook(hooks, storeKey) {
   return function currentHook() {
-    var _currentArray$at$name;
     const hooksStore = hooks[storeKey];
     const currentArray = Array.from(hooksStore.__current);
-    return (_currentArray$at$name = currentArray.at(-1)?.name) !== null && _currentArray$at$name !== void 0 ? _currentArray$at$name : null;
+    return currentArray.at(-1)?.name ?? null;
   };
 }
 var createCurrentHook_default = createCurrentHook;
 
-// ../../../node_modules/.pnpm/@wordpress+hooks@4.32.0/node_modules/@wordpress/hooks/build-module/createDoingHook.js
+// ../../../node_modules/.pnpm/@wordpress+hooks@4.33.0/node_modules/@wordpress/hooks/build-module/createDoingHook.js
 function createDoingHook(hooks, storeKey) {
   return function doingHook(hookName) {
     const hooksStore = hooks[storeKey];
     if ("undefined" === typeof hookName) {
       return hooksStore.__current.size > 0;
     }
-    return Array.from(hooksStore.__current).some((hook) => hook.name === hookName);
+    return Array.from(hooksStore.__current).some(
+      (hook) => hook.name === hookName
+    );
   };
 }
 var createDoingHook_default = createDoingHook;
 
-// ../../../node_modules/.pnpm/@wordpress+hooks@4.32.0/node_modules/@wordpress/hooks/build-module/createDidHook.js
+// ../../../node_modules/.pnpm/@wordpress+hooks@4.33.0/node_modules/@wordpress/hooks/build-module/createDidHook.js
 function createDidHook(hooks, storeKey) {
   return function didHook(hookName) {
     const hooksStore = hooks[storeKey];
@@ -868,8 +879,28 @@ function createDidHook(hooks, storeKey) {
 }
 var createDidHook_default = createDidHook;
 
-// ../../../node_modules/.pnpm/@wordpress+hooks@4.32.0/node_modules/@wordpress/hooks/build-module/createHooks.js
+// ../../../node_modules/.pnpm/@wordpress+hooks@4.33.0/node_modules/@wordpress/hooks/build-module/createHooks.js
 var _Hooks = class {
+  actions;
+  filters;
+  addAction;
+  addFilter;
+  removeAction;
+  removeFilter;
+  hasAction;
+  hasFilter;
+  removeAllActions;
+  removeAllFilters;
+  doAction;
+  doActionAsync;
+  applyFilters;
+  applyFiltersAsync;
+  currentAction;
+  currentFilter;
+  doingAction;
+  doingFilter;
+  didAction;
+  didFilter;
   constructor() {
     this.actions = /* @__PURE__ */ Object.create(null);
     this.actions.__current = /* @__PURE__ */ new Set();
@@ -900,7 +931,7 @@ function createHooks() {
 }
 var createHooks_default = createHooks;
 
-// ../../../node_modules/.pnpm/@wordpress+hooks@4.32.0/node_modules/@wordpress/hooks/build-module/index.js
+// ../../../node_modules/.pnpm/@wordpress+hooks@4.33.0/node_modules/@wordpress/hooks/build-module/index.js
 var defaultHooks = createHooks_default();
 var {
   addAction,
@@ -925,17 +956,10 @@ var {
   filters
 } = defaultHooks;
 
-// ../../../node_modules/.pnpm/@wordpress+deprecated@4.32.0/node_modules/@wordpress/deprecated/build-module/index.js
+// ../../../node_modules/.pnpm/@wordpress+deprecated@4.33.0/node_modules/@wordpress/deprecated/build-module/index.js
 var logged = /* @__PURE__ */ Object.create(null);
 function deprecated(feature, options = {}) {
-  const {
-    since,
-    version,
-    alternative,
-    plugin,
-    link,
-    hint
-  } = options;
+  const { since, version, alternative, plugin, link, hint } = options;
   const pluginMessage = plugin ? ` from ${plugin}` : "";
   const sinceMessage = since ? ` since version ${since}` : "";
   const versionMessage = version ? ` and will be removed${pluginMessage} in version ${version}` : "";
@@ -955,10 +979,10 @@ function deprecated(feature, options = {}) {
 import deepmerge from "deepmerge";
 import fastDeepEqual from "fast-deep-equal/es6";
 
-// ../../../node_modules/.pnpm/@wordpress+warning@3.32.0/node_modules/@wordpress/warning/build-module/utils.js
+// ../../../node_modules/.pnpm/@wordpress+warning@3.33.0/node_modules/@wordpress/warning/build-module/utils.js
 var logged2 = /* @__PURE__ */ new Set();
 
-// ../../../node_modules/.pnpm/@wordpress+warning@3.32.0/node_modules/@wordpress/warning/build-module/index.js
+// ../../../node_modules/.pnpm/@wordpress+warning@3.33.0/node_modules/@wordpress/warning/build-module/index.js
 function isDev() {
   return globalThis.SCRIPT_DEBUG === true;
 }
@@ -4233,7 +4257,9 @@ var BarWithLabel = ({
   withComparison,
   withOverlayLabel,
   primaryColor,
-  secondaryColor
+  secondaryColor,
+  isPrimaryVisible = true,
+  isComparisonVisible = true
 }) => /* @__PURE__ */ jsxs(
   "div",
   {
@@ -4242,7 +4268,7 @@ var BarWithLabel = ({
     }),
     children: [
       /* @__PURE__ */ jsx3(BarLabel, { label: entry.label }),
-      /* @__PURE__ */ jsx3(
+      isPrimaryVisible && /* @__PURE__ */ jsx3(
         "div",
         {
           className: leaderboard_chart_module_default.bar,
@@ -4252,7 +4278,7 @@ var BarWithLabel = ({
           }
         }
       ),
-      withComparison && !withOverlayLabel && /* @__PURE__ */ jsx3(
+      withComparison && !withOverlayLabel && isComparisonVisible && /* @__PURE__ */ jsx3(
         "div",
         {
           className: leaderboard_chart_module_default.bar,
@@ -4283,6 +4309,7 @@ var LeaderboardChartInternal = ({
   legendShapeWidth = 8,
   legendShapeHeight = 8,
   legendLabels,
+  legendInteractive = false,
   className,
   style,
   children
@@ -4298,7 +4325,7 @@ var LeaderboardChartInternal = ({
     secondaryColor: settingsSecondaryColor,
     deltaColors
   } = leaderboardChartSettings;
-  const { getElementStyles } = useGlobalChartsContext();
+  const { getElementStyles, isSeriesVisible } = useGlobalChartsContext();
   const { color: resolvedPrimaryColor } = getElementStyles({
     index: 0,
     overrideColor: primaryColor || settingsPrimaryColor
@@ -4315,6 +4342,31 @@ var LeaderboardChartInternal = ({
     withOverlayLabel,
     legendLabels
   });
+  const isPrimaryVisible = useMemo3(() => {
+    if (!chartId || !legendInteractive || legendItems.length === 0) {
+      return true;
+    }
+    return isSeriesVisible(chartId, legendItems[0].label);
+  }, [chartId, legendInteractive, legendItems, isSeriesVisible]);
+  const isComparisonVisible = useMemo3(() => {
+    if (!chartId || !legendInteractive || legendItems.length < 2) {
+      return true;
+    }
+    return isSeriesVisible(chartId, legendItems[1].label);
+  }, [chartId, legendInteractive, legendItems, isSeriesVisible]);
+  const allSeriesHidden = useMemo3(() => {
+    if (!legendInteractive) return false;
+    if (withComparison && !withOverlayLabel) {
+      return !isPrimaryVisible && !isComparisonVisible;
+    }
+    return !isPrimaryVisible;
+  }, [
+    legendInteractive,
+    isPrimaryVisible,
+    isComparisonVisible,
+    withComparison,
+    withOverlayLabel
+  ]);
   const isDataValid = Boolean(data && data.length > 0);
   const chartMetadata = useMemo3(
     () => ({
@@ -4374,7 +4426,7 @@ var LeaderboardChartInternal = ({
             gap: showLegend ? "16px" : "0"
           },
           children: [
-            /* @__PURE__ */ jsx3(component_default6, { templateColumns: "minmax(0, 1fr) auto", rowGap, columnGap, children: data.map((entry) => {
+            allSeriesHidden ? /* @__PURE__ */ jsx3("div", { className: leaderboard_chart_module_default.emptyState, children: __2("All series are hidden. Click legend items to show data.", "jetpack-charts") }) : /* @__PURE__ */ jsx3(component_default6, { templateColumns: "minmax(0, 1fr) auto", rowGap, columnGap, children: data.map((entry) => {
               const colorIndex = Math.sign(entry.delta) + 1;
               const deltaColor = deltaColors[colorIndex];
               return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -4385,7 +4437,9 @@ var LeaderboardChartInternal = ({
                     withComparison,
                     withOverlayLabel,
                     primaryColor: resolvedPrimaryColor,
-                    secondaryColor: resolvedSecondaryColor
+                    secondaryColor: resolvedSecondaryColor,
+                    isPrimaryVisible,
+                    isComparisonVisible
                   }
                 ) }),
                 /* @__PURE__ */ jsxs(
@@ -4395,8 +4449,8 @@ var LeaderboardChartInternal = ({
                       [leaderboard_chart_module_default.overlayLabel]: withOverlayLabel
                     }),
                     children: [
-                      /* @__PURE__ */ jsx3(component_default4, { children: valueFormatter(entry.currentValue) }),
-                      withComparison && /* @__PURE__ */ jsx3(component_default4, { style: { color: deltaColor }, children: deltaFormatter(entry.delta) })
+                      isPrimaryVisible && /* @__PURE__ */ jsx3(component_default4, { children: valueFormatter(entry.currentValue) }),
+                      withComparison && isComparisonVisible && /* @__PURE__ */ jsx3(component_default4, { style: { color: deltaColor }, children: deltaFormatter(entry.delta) })
                     ]
                   }
                 )
@@ -4411,7 +4465,8 @@ var LeaderboardChartInternal = ({
                 shape: legendShape,
                 shapeWidth: legendShapeWidth,
                 shapeHeight: legendShapeHeight,
-                chartId
+                chartId,
+                interactive: legendInteractive
               }
             ),
             otherChildren
@@ -4474,4 +4529,4 @@ is-plain-object/dist/is-plain-object.mjs:
    * Released under the MIT License.
    *)
 */
-//# sourceMappingURL=chunk-2HB55BRH.js.map
+//# sourceMappingURL=chunk-4H3J2HCD.js.map