@carto/ps-react-ui 4.4.3 → 4.5.1

package/dist/{download-config-Dqu78h2a.js → download-config-DemuQ3Jm.js}

@@ -1,18 +1,17 @@
 import "react/jsx-runtime";
 import "react/compiler-runtime";
 import "@mui/material";
-import "./widget-store-CzDt8oSK.js";
-import "@mui/icons-material";
+import "./widget-store-CIrb9RKP.js";
 import "zustand/shallow";
+import "@mui/icons-material";
 import "react";
-import "react-markdown";
 import { d as n, a as s } from "./exports-Cr43OCul.js";
 import "./lasso-tool-BYbxrJ-7.js";
 import "./cjs-D4KH3azB.js";
 import "@dnd-kit/core";
 import "@dnd-kit/sortable";
 import "@dnd-kit/utilities";
-function T(r) {
+function E(r) {
   const o = [];
   if (r.length > 0 && (r[0]?.length ?? 0) > 0) {
     const i = r?.[0]?.[0] ?? {}, t = Object.keys(i);
@@ -25,7 +24,7 @@ function T(r) {
     });
   }), o;
 }
-function b(r) {
+function T(r) {
   const o = [];
   return o.push(["x", "y"]), r.forEach((i) => {
     i.forEach((t) => {
@@ -33,7 +32,7 @@ function b(r) {
     });
   }), o;
 }
-function j(r) {
+function b(r) {
   return function({
     refUI: o
   }) {
@@ -50,8 +49,8 @@ function j(r) {
   };
 }
 export {
-  j as c,
-  T as f,
-  b as s
+  b as c,
+  E as f,
+  T as s
 };
-//# sourceMappingURL=download-config-Dqu78h2a.js.map
+//# sourceMappingURL=download-config-DemuQ3Jm.js.map

package/dist/{download-config-Dqu78h2a.js.map → download-config-DemuQ3Jm.js.map}

@@ -1 +1 @@
-{"version":3,"file":"download-config-Dqu78h2a.js","sources":["../src/widgets/utils/chart-config/csv-modifiers.ts","../src/widgets/utils/chart-config/download-config.ts"],"sourcesContent":["/**\n * Shared CSV export modifiers for chart widgets\n */\n\n/**\n * Flattens object array data into CSV-ready rows.\n * Used by bar, pie, histogram, and timeseries widgets.\n *\n * @param data - Array of series, where each series is an array of data objects\n * @returns CSV rows with headers and values\n */\nexport function flattenObjectArrayToCSV<T extends Record<string, unknown>>(\n  data: T[][],\n): string[][] {\n  const rows: string[][] = []\n\n  // Add headers from first data point if available\n  if (data.length > 0 && (data[0]?.length ?? 0) > 0) {\n    const firstDataPoint = data?.[0]?.[0] ?? {}\n    const headers = Object.keys(firstDataPoint)\n    rows.push(headers)\n  }\n\n  // Add data rows from all series\n  data.forEach((series) => {\n    series.forEach((dataPoint) => {\n      const values = Object.values(dataPoint).map((v) => String(v))\n      rows.push(values)\n    })\n  })\n\n  return rows\n}\n\n/**\n * Creates CSV rows for scatterplot data.\n * Scatterplot uses array format [x, y] instead of objects.\n *\n * @param data - Array of series, where each series is an array of [x, y] tuples\n * @returns CSV rows with ['x', 'y'] headers\n */\nexport function scatterplotDataToCSV(data: number[][][]): string[][] {\n  const rows: string[][] = []\n\n  // Add headers\n  rows.push(['x', 'y'])\n\n  // Add data rows from all series\n  data.forEach((series) => {\n    series.forEach((dataPoint) => {\n      rows.push([String(dataPoint[0]), String(dataPoint[1])])\n    })\n  })\n\n  return rows\n}\n","import { downloadToCSV, downloadToPNG, type DownloadItem } from '../../actions'\nimport type { ConfigProps } from '../../loader/types'\n\nexport function createChartDownloadConfig<TData>(\n  csvModifier: (data: TData) => string[][],\n) {\n  return function ({ refUI }: ConfigProps): DownloadItem<TData>[] {\n    return [\n      {\n        ...downloadToPNG,\n        modifier: () => downloadToPNG.modifier(refUI),\n      },\n      {\n        ...downloadToCSV,\n        modifier: async (data) => {\n          const rows = csvModifier(data)\n          return downloadToCSV.modifier(rows)\n        },\n      },\n    ]\n  }\n}\n"],"names":["flattenObjectArrayToCSV","data","rows","length","firstDataPoint","headers","Object","keys","push","forEach","series","dataPoint","values","map","v","String","scatterplotDataToCSV","createChartDownloadConfig","csvModifier","refUI","downloadToPNG","modifier","downloadToCSV"],"mappings":";;;;;;;;;;;;;;AAWO,SAASA,EACdC,GACY;AACZ,QAAMC,IAAmB,CAAA;AAGzB,MAAID,EAAKE,SAAS,MAAMF,EAAK,CAAC,GAAGE,UAAU,KAAK,GAAG;AACjD,UAAMC,IAAiBH,IAAO,CAAC,IAAI,CAAC,KAAK,CAAA,GACnCI,IAAUC,OAAOC,KAAKH,CAAc;AAC1CF,IAAAA,EAAKM,KAAKH,CAAO;AAAA,EACnB;AAGAJ,SAAAA,EAAKQ,QAASC,CAAAA,MAAW;AACvBA,IAAAA,EAAOD,QAASE,CAAAA,MAAc;AAC5B,YAAMC,IAASN,OAAOM,OAAOD,CAAS,EAAEE,IAAKC,CAAAA,MAAMC,OAAOD,CAAC,CAAC;AAC5DZ,MAAAA,EAAKM,KAAKI,CAAM;AAAA,IAClB,CAAC;AAAA,EACH,CAAC,GAEMV;AACT;AASO,SAASc,EAAqBf,GAAgC;AACnE,QAAMC,IAAmB,CAAA;AAGzBA,SAAAA,EAAKM,KAAK,CAAC,KAAK,GAAG,CAAC,GAGpBP,EAAKQ,QAASC,CAAAA,MAAW;AACvBA,IAAAA,EAAOD,QAASE,CAAAA,MAAc;AAC5BT,MAAAA,EAAKM,KAAK,CAACO,OAAOJ,EAAU,CAAC,CAAC,GAAGI,OAAOJ,EAAU,CAAC,CAAC,CAAC,CAAC;AAAA,IACxD,CAAC;AAAA,EACH,CAAC,GAEMT;AACT;ACpDO,SAASe,EACdC,GACA;AACA,SAAO,SAAU;AAAA,IAAEC,OAAAA;AAAAA,EAAAA,GAA6C;AAC9D,WAAO,CACL;AAAA,MACE,GAAGC;AAAAA,MACHC,UAAUA,MAAMD,EAAcC,SAASF,CAAK;AAAA,IAAA,GAE9C;AAAA,MACE,GAAGG;AAAAA,MACHD,UAAU,OAAOpB,MAAS;AACxB,cAAMC,IAAOgB,EAAYjB,CAAI;AAC7B,eAAOqB,EAAcD,SAASnB,CAAI;AAAA,MACpC;AAAA,IAAA,CACD;AAAA,EAEL;AACF;"}
+{"version":3,"file":"download-config-DemuQ3Jm.js","sources":["../src/widgets/utils/chart-config/csv-modifiers.ts","../src/widgets/utils/chart-config/download-config.ts"],"sourcesContent":["/**\n * Shared CSV export modifiers for chart widgets\n */\n\n/**\n * Flattens object array data into CSV-ready rows.\n * Used by bar, pie, histogram, and timeseries widgets.\n *\n * @param data - Array of series, where each series is an array of data objects\n * @returns CSV rows with headers and values\n */\nexport function flattenObjectArrayToCSV<T extends Record<string, unknown>>(\n  data: T[][],\n): string[][] {\n  const rows: string[][] = []\n\n  // Add headers from first data point if available\n  if (data.length > 0 && (data[0]?.length ?? 0) > 0) {\n    const firstDataPoint = data?.[0]?.[0] ?? {}\n    const headers = Object.keys(firstDataPoint)\n    rows.push(headers)\n  }\n\n  // Add data rows from all series\n  data.forEach((series) => {\n    series.forEach((dataPoint) => {\n      const values = Object.values(dataPoint).map((v) => String(v))\n      rows.push(values)\n    })\n  })\n\n  return rows\n}\n\n/**\n * Creates CSV rows for scatterplot data.\n * Scatterplot uses array format [x, y] instead of objects.\n *\n * @param data - Array of series, where each series is an array of [x, y] tuples\n * @returns CSV rows with ['x', 'y'] headers\n */\nexport function scatterplotDataToCSV(data: number[][][]): string[][] {\n  const rows: string[][] = []\n\n  // Add headers\n  rows.push(['x', 'y'])\n\n  // Add data rows from all series\n  data.forEach((series) => {\n    series.forEach((dataPoint) => {\n      rows.push([String(dataPoint[0]), String(dataPoint[1])])\n    })\n  })\n\n  return rows\n}\n","import { downloadToCSV, downloadToPNG, type DownloadItem } from '../../actions'\nimport type { ConfigProps } from '../../loader/types'\n\nexport function createChartDownloadConfig<TData>(\n  csvModifier: (data: TData) => string[][],\n) {\n  return function ({ refUI }: ConfigProps): DownloadItem<TData>[] {\n    return [\n      {\n        ...downloadToPNG,\n        modifier: () => downloadToPNG.modifier(refUI),\n      },\n      {\n        ...downloadToCSV,\n        modifier: async (data) => {\n          const rows = csvModifier(data)\n          return downloadToCSV.modifier(rows)\n        },\n      },\n    ]\n  }\n}\n"],"names":["flattenObjectArrayToCSV","data","rows","length","firstDataPoint","headers","Object","keys","push","forEach","series","dataPoint","values","map","v","String","scatterplotDataToCSV","createChartDownloadConfig","csvModifier","refUI","downloadToPNG","modifier","downloadToCSV"],"mappings":";;;;;;;;;;;;;AAWO,SAASA,EACdC,GACY;AACZ,QAAMC,IAAmB,CAAA;AAGzB,MAAID,EAAKE,SAAS,MAAMF,EAAK,CAAC,GAAGE,UAAU,KAAK,GAAG;AACjD,UAAMC,IAAiBH,IAAO,CAAC,IAAI,CAAC,KAAK,CAAA,GACnCI,IAAUC,OAAOC,KAAKH,CAAc;AAC1CF,IAAAA,EAAKM,KAAKH,CAAO;AAAA,EACnB;AAGAJ,SAAAA,EAAKQ,QAASC,CAAAA,MAAW;AACvBA,IAAAA,EAAOD,QAASE,CAAAA,MAAc;AAC5B,YAAMC,IAASN,OAAOM,OAAOD,CAAS,EAAEE,IAAKC,CAAAA,MAAMC,OAAOD,CAAC,CAAC;AAC5DZ,MAAAA,EAAKM,KAAKI,CAAM;AAAA,IAClB,CAAC;AAAA,EACH,CAAC,GAEMV;AACT;AASO,SAASc,EAAqBf,GAAgC;AACnE,QAAMC,IAAmB,CAAA;AAGzBA,SAAAA,EAAKM,KAAK,CAAC,KAAK,GAAG,CAAC,GAGpBP,EAAKQ,QAASC,CAAAA,MAAW;AACvBA,IAAAA,EAAOD,QAASE,CAAAA,MAAc;AAC5BT,MAAAA,EAAKM,KAAK,CAACO,OAAOJ,EAAU,CAAC,CAAC,GAAGI,OAAOJ,EAAU,CAAC,CAAC,CAAC,CAAC;AAAA,IACxD,CAAC;AAAA,EACH,CAAC,GAEMT;AACT;ACpDO,SAASe,EACdC,GACA;AACA,SAAO,SAAU;AAAA,IAAEC,OAAAA;AAAAA,EAAAA,GAA6C;AAC9D,WAAO,CACL;AAAA,MACE,GAAGC;AAAAA,MACHC,UAAUA,MAAMD,EAAcC,SAASF,CAAK;AAAA,IAAA,GAE9C;AAAA,MACE,GAAGG;AAAAA,MACHD,UAAU,OAAOpB,MAAS;AACxB,cAAMC,IAAOgB,EAAYjB,CAAI;AAC7B,eAAOqB,EAAcD,SAASnB,CAAI;AAAA,MACpC;AAAA,IAAA,CACD;AAAA,EAEL;AACF;"}

package/dist/error-Cj8eUMrl.js

@@ -0,0 +1,40 @@
+import { jsx as m, jsxs as u } from "react/jsx-runtime";
+import { c as h } from "react/compiler-runtime";
+import { AlertTitle as p, Alert as x } from "@mui/material";
+import { u as A } from "./use-widget-selector-DqRmWQ1K.js";
+function E(t) {
+  const r = h(5), {
+    id: l,
+    children: c,
+    title: d,
+    description: g
+  } = t, {
+    isLoading: a,
+    isFetching: f,
+    error: o
+  } = A(l, F);
+  if (a || f)
+    return c;
+  if (o) {
+    const n = d ?? o.title ?? "Error", s = g ?? o.message ?? "An error occurred while loading the widget. Please try again.";
+    let e;
+    r[0] !== n ? (e = /* @__PURE__ */ m(p, { children: n }), r[0] = n, r[1] = e) : e = r[1];
+    let i;
+    return r[2] !== s || r[3] !== e ? (i = /* @__PURE__ */ u(x, { severity: "error", children: [
+      e,
+      s
+    ] }), r[2] = s, r[3] = e, r[4] = i) : i = r[4], i;
+  }
+  return c;
+}
+function F(t) {
+  return {
+    isLoading: t?.isLoading,
+    isFetching: t?.isFetching,
+    error: t?.error
+  };
+}
+export {
+  E as W
+};
+//# sourceMappingURL=error-Cj8eUMrl.js.map

package/dist/error-Cj8eUMrl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"error-Cj8eUMrl.js","sources":["../src/widgets/error/error.tsx"],"sourcesContent":["import { Alert, AlertTitle } from '@mui/material'\nimport { useWidgetSelector } from '../stores/use-widget-selector'\nimport type { WidgetErrorProps } from './types'\n\n/**\n * Displays an error alert when a widget encounters an error during data loading. Reads error state from the widget store and hides errors during loading/fetching to prevent flashing.\n *\n * @example\n * ```tsx\n * <WidgetError id=\"my-widget\">\n *   <WidgetContent />\n * </WidgetError>\n * ```\n */\nexport function WidgetError({\n  id,\n  children,\n  title: titleProp,\n  description,\n}: WidgetErrorProps) {\n  // Single consolidated subscription instead of 3 separate ones.\n  const { isLoading, isFetching, error } = useWidgetSelector(id, (w) => ({\n    isLoading: w?.isLoading,\n    isFetching: w?.isFetching,\n    error: w?.error,\n  }))\n\n  // Don't show error during loading/fetching states\n  if (isLoading || isFetching) {\n    return children\n  }\n\n  // Show error UI if error exists\n  if (error) {\n    const errorTitle = titleProp ?? error.title ?? 'Error'\n    const errorMessage =\n      description ??\n      error.message ??\n      'An error occurred while loading the widget. Please try again.'\n\n    return (\n      <Alert severity='error'>\n        <AlertTitle>{errorTitle}</AlertTitle>\n        {errorMessage}\n      </Alert>\n    )\n  }\n\n  // No error, render children\n  return children\n}\n"],"names":["WidgetError","t0","$","_c","id","children","title","titleProp","description","isLoading","isFetching","error","useWidgetSelector","_temp","errorTitle","errorMessage","message","t1","AlertTitle","t2","jsxs","Alert","w"],"mappings":";;;;AAcO,SAAAA,EAAAC,GAAA;AAAA,QAAAC,IAAAC,EAAA,CAAA,GAAqB;AAAA,IAAAC,IAAAA;AAAAA,IAAAC,UAAAA;AAAAA,IAAAC,OAAAC;AAAAA,IAAAC,aAAAA;AAAAA,EAAAA,IAAAP,GAO1B;AAAA,IAAAQ,WAAAA;AAAAA,IAAAC,YAAAA;AAAAA,IAAAC,OAAAA;AAAAA,EAAAA,IAAyCC,EAAkBR,GAAIS,CAI7D;AAGF,MAAIJ,KAAAC;AAAuB,WAClBL;AAIT,MAAIM,GAAK;AACP,UAAAG,IAAmBP,KAAaI,EAAKL,SAAlB,SACnBS,IACEP,KACAG,EAAKK,WADL;AAE+D,QAAAC;AAAA,IAAAf,SAAAY,KAI7DG,sBAACC,kBAAuB,GAAahB,OAAAY,GAAAZ,OAAAe,KAAAA,IAAAf,EAAA,CAAA;AAAA,QAAAiB;AAAA,WAAAjB,EAAA,CAAA,MAAAa,KAAAb,SAAAe,KADvCE,IAAA,gBAAAC,EAACC,GAAA,EAAe,UAAA,SACdJ,UAAAA;AAAAA,MAAAA;AAAAA,MACCF;AAAAA,IAAAA,GACH,GAAQb,OAAAa,GAAAb,OAAAe,GAAAf,OAAAiB,KAAAA,IAAAjB,EAAA,CAAA,GAHRiB;AAAAA,EAGQ;AAEX,SAGMd;AAAQ;AAnCV,SAAAQ,EAAAS,GAAA;AAAA,SAOkE;AAAA,IAAAb,WAC1Da,GAACb;AAAAA,IAAWC,YACXY,GAACZ;AAAAA,IAAYC,OAClBW,GAACX;AAAAA,EAAAA;AACT;"}

package/dist/no-data-DkIt7Qt1.js

@@ -0,0 +1,61 @@
+import { jsx as f, jsxs as x } from "react/jsx-runtime";
+import { c as v } from "react/compiler-runtime";
+import { Typography as p, Box as b } from "@mui/material";
+import { u as j } from "./use-widget-selector-DqRmWQ1K.js";
+const A = {
+  root: {
+    display: "flex",
+    flexDirection: "column",
+    gap: 1,
+    // 8px
+    paddingTop: 1,
+    // 8px
+    paddingBottom: 2,
+    // 16px
+    paddingX: 2,
+    // 16px
+    width: "100%",
+    minHeight: "100%"
+  }
+};
+function B(e) {
+  const t = v(7), {
+    id: u,
+    children: a,
+    title: l,
+    description: c,
+    isEmpty: d
+  } = e, n = l === void 0 ? "No data available" : l, s = c === void 0 ? "There are no results for the combination of filters applied to your data. Try tweaking your filters, or zoom and pan the map to adjust filters" : c, y = d === void 0 ? E : d, {
+    isLoading: g,
+    isFetching: m,
+    data: h
+  } = j(u, T);
+  if (g || m)
+    return a;
+  if (y(h)) {
+    let r;
+    t[0] !== n ? (r = /* @__PURE__ */ f(p, { variant: "body2", color: "text.primary", children: n }), t[0] = n, t[1] = r) : r = t[1];
+    let i;
+    t[2] !== s ? (i = /* @__PURE__ */ f(p, { variant: "caption", color: "text.secondary", children: s }), t[2] = s, t[3] = i) : i = t[3];
+    let o;
+    return t[4] !== r || t[5] !== i ? (o = /* @__PURE__ */ x(b, { sx: A.root, children: [
+      r,
+      i
+    ] }), t[4] = r, t[5] = i, t[6] = o) : o = t[6], o;
+  }
+  return a;
+}
+function T(e) {
+  return {
+    isLoading: e?.isLoading,
+    isFetching: e?.isFetching,
+    data: e?.data
+  };
+}
+function E(e) {
+  return e == null ? !0 : Array.isArray(e) ? !!(e.length === 0 || e.every((t) => Array.isArray(t) && t.length === 0)) : typeof e == "object" ? Object.keys(e).length === 0 : !1;
+}
+export {
+  B as W
+};
+//# sourceMappingURL=no-data-DkIt7Qt1.js.map

package/dist/no-data-DkIt7Qt1.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"no-data-DkIt7Qt1.js","sources":["../src/widgets/no-data/style.ts","../src/widgets/no-data/no-data.tsx"],"sourcesContent":["import type { SxProps, Theme } from '@mui/material'\n\n/**\n * Styles for NoData component matching Figma design specifications\n * Design reference: node 5781-11028\n */\nexport const styles: Record<string, SxProps<Theme>> = {\n  root: {\n    display: 'flex',\n    flexDirection: 'column',\n    gap: 1, // 8px\n    paddingTop: 1, // 8px\n    paddingBottom: 2, // 16px\n    paddingX: 2, // 16px\n    width: '100%',\n    minHeight: '100%',\n  },\n}\n","import { Box, Typography } from '@mui/material'\nimport { useWidgetSelector } from '../stores/use-widget-selector'\nimport type { WidgetNoDataProps } from './types'\nimport { styles } from './style'\n\n/**\n * NoData wrapper component that displays empty state UI when widget has no data\n *\n * Integrates with widget store to check loading/fetching state and data availability.\n * Works in conjunction with SkeletonLoader for complete loading/empty state handling.\n *\n * @example Basic usage\n * ```tsx\n * <NoData id=\"my-widget\">\n *   <WidgetContent id=\"my-widget\" />\n * </NoData>\n * ```\n *\n * @example With SkeletonLoader\n * ```tsx\n * <SkeletonLoader id=\"my-widget\" Skeleton={MySkeleton}>\n *   <NoData id=\"my-widget\">\n *     <WidgetContent id=\"my-widget\" />\n *   </NoData>\n * </SkeletonLoader>\n * ```\n *\n * @example With custom messages\n * ```tsx\n * <NoData\n *   id=\"my-widget\"\n *   title=\"No results found\"\n *   description=\"Try adjusting your filters\"\n * >\n *   <WidgetContent id=\"my-widget\" />\n * </NoData>\n * ```\n */\nexport function WidgetNoData({\n  id,\n  children,\n  title = 'No data available',\n  description = 'There are no results for the combination of filters applied to your data. Try tweaking your filters, or zoom and pan the map to adjust filters',\n  isEmpty = defaultIsEmpty,\n}: WidgetNoDataProps) {\n  // Single consolidated subscription instead of 3 separate ones.\n  const { isLoading, isFetching, data } = useWidgetSelector(id, (w) => ({\n    isLoading: w?.isLoading,\n    isFetching: w?.isFetching,\n    data: w?.data,\n  }))\n\n  // If loading or fetching, show children\n  // SkeletonLoader handles loading state, this allows proper composition\n  if (isLoading || isFetching) {\n    return children\n  }\n\n  // Check if data is empty\n  if (isEmpty(data)) {\n    return (\n      <Box sx={styles.root}>\n        <Typography variant='body2' color='text.primary'>\n          {title}\n        </Typography>\n        <Typography variant='caption' color='text.secondary'>\n          {description}\n        </Typography>\n      </Box>\n    )\n  }\n\n  // Data exists, render children\n  return children\n}\n\n/**\n * Default function to determine if data is empty\n * Handles various data structures commonly used in widgets\n */\nfunction defaultIsEmpty(data: unknown): boolean {\n  // Null or undefined\n  if (data == null) {\n    return true\n  }\n\n  // Arrays (most common case)\n  if (Array.isArray(data)) {\n    // Empty array\n    if (data.length === 0) {\n      return true\n    }\n\n    // Array of arrays (CategoryWidget pattern: [[],[]])\n    // Check if all inner arrays are empty\n    if (data.every((item) => Array.isArray(item) && item.length === 0)) {\n      return true\n    }\n\n    return false\n  }\n\n  // Objects\n  if (typeof data === 'object') {\n    return Object.keys(data).length === 0\n  }\n\n  // Primitives (numbers, strings, booleans) are considered valid data\n  return false\n}\n"],"names":["styles","root","display","flexDirection","gap","paddingTop","paddingBottom","paddingX","width","minHeight","WidgetNoData","t0","$","_c","id","children","title","t1","description","t2","isEmpty","t3","undefined","defaultIsEmpty","isLoading","isFetching","data","useWidgetSelector","_temp","t4","Typography","t5","t6","Box","w","Array","isArray","length","every","item","Object","keys"],"mappings":";;;;AAMO,MAAMA,IAAyC;AAAA,EACpDC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,KAAK;AAAA;AAAA,IACLC,YAAY;AAAA;AAAA,IACZC,eAAe;AAAA;AAAA,IACfC,UAAU;AAAA;AAAA,IACVC,OAAO;AAAA,IACPC,WAAW;AAAA,EAAA;AAEf;ACqBO,SAAAC,EAAAC,GAAA;AAAA,QAAAC,IAAAC,EAAA,CAAA,GAAsB;AAAA,IAAAC,IAAAA;AAAAA,IAAAC,UAAAA;AAAAA,IAAAC,OAAAC;AAAAA,IAAAC,aAAAC;AAAAA,IAAAC,SAAAC;AAAAA,EAAAA,IAAAV,GAG3BK,IAAAC,MAAAK,SAAA,sBAAAL,GACAC,IAAAC,MAAAG,SAAA,mJAAAH,GACAC,IAAAC,MAAAC,SAAAC,IAAAF,GAGA;AAAA,IAAAG,WAAAA;AAAAA,IAAAC,YAAAA;AAAAA,IAAAC,MAAAA;AAAAA,EAAAA,IAAwCC,EAAkBb,GAAIc,CAI5D;AAIF,MAAIJ,KAAAC;AAAuB,WAClBV;AAIT,MAAIK,EAAQM,CAAI,GAAC;AAAA,QAAAG;AAAA,IAAAjB,SAAAI,KAGXa,sBAACC,GAAA,EAAmB,SAAA,SAAc,OAAA,gBAC/Bd,UAAAA,GACH,GAAaJ,OAAAI,GAAAJ,OAAAiB,KAAAA,IAAAjB,EAAA,CAAA;AAAA,QAAAmB;AAAA,IAAAnB,SAAAM,KACba,sBAACD,GAAA,EAAmB,SAAA,WAAgB,OAAA,kBACjCZ,UAAAA,GACH,GAAaN,OAAAM,GAAAN,OAAAmB,KAAAA,IAAAnB,EAAA,CAAA;AAAA,QAAAoB;AAAA,WAAApB,EAAA,CAAA,MAAAiB,KAAAjB,SAAAmB,KANfC,sBAACC,GAAA,EAAQ,IAAAjC,EAAMC,MACb4B,UAAAA;AAAAA,MAAAA;AAAAA,MAGAE;AAAAA,IAAAA,GAGF,GAAMnB,OAAAiB,GAAAjB,OAAAmB,GAAAnB,OAAAoB,KAAAA,IAAApB,EAAA,CAAA,GAPNoB;AAAAA,EAOM;AAET,SAGMjB;AAAQ;AAnCV,SAAAa,EAAAM,GAAA;AAAA,SAQiE;AAAA,IAAAV,WACzDU,GAACV;AAAAA,IAAWC,YACXS,GAACT;AAAAA,IAAYC,MACnBQ,GAACR;AAAAA,EAAAA;AACR;AA8BH,SAASH,EAAeG,GAAwB;AAE9C,SAAIA,KAAQ,OACH,KAILS,MAAMC,QAAQV,CAAI,IAEhBA,GAAAA,EAAKW,WAAW,KAMhBX,EAAKY,MAAOC,CAAAA,MAASJ,MAAMC,QAAQG,CAAI,KAAKA,EAAKF,WAAW,CAAC,KAQ/D,OAAOX,KAAS,WACXc,OAAOC,KAAKf,CAAI,EAAEW,WAAW,IAI/B;AACT;"}

package/dist/row-D4VOhcNI.js

@@ -0,0 +1,34 @@
+import { jsx as a } from "react/jsx-runtime";
+import { c as n } from "react/compiler-runtime";
+import { Box as c } from "@mui/material";
+import { u as l } from "./use-widget-selector-DqRmWQ1K.js";
+const s = {
+  item: {
+    '&[data-disabled="true"]': {
+      color: (t) => t.palette.text.disabled
+    }
+  },
+  row: {
+    display: "flex",
+    alignItems: "center",
+    gap: (t) => t.spacing(1),
+    "& + &": {
+      marginTop: (t) => t.spacing(1)
+    }
+  }
+};
+function h(t) {
+  const e = n(3), o = l(t.id, d);
+  let i;
+  return e[0] !== o || e[1] !== t ? (i = o?.map((m, r) => /* @__PURE__ */ a(c, { sx: s.row, children: typeof t.children == "function" ? t.children({
+    index: r
+  }) : t.children }, `row-${r}`)), e[0] = o, e[1] = t, e[2] = i) : i = e[2], i;
+}
+function d(t) {
+  return t?.data;
+}
+export {
+  h as R,
+  s
+};
+//# sourceMappingURL=row-D4VOhcNI.js.map

package/dist/row-D4VOhcNI.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"row-D4VOhcNI.js","sources":["../src/widgets/formula/style.ts","../src/widgets/formula/components/row.tsx"],"sourcesContent":["import type { SxProps, Theme } from '@mui/material'\n\nexport const styles = {\n  root: {\n    display: 'flex',\n    flexDirection: 'column',\n    gap: (theme: Theme) => theme.spacing(2),\n  },\n  item: {\n    '&[data-disabled=\"true\"]': {\n      color: (theme: Theme) => theme.palette.text.disabled,\n    },\n  },\n  row: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: (theme: Theme) => theme.spacing(1),\n\n    '& + &': {\n      marginTop: (theme: Theme) => theme.spacing(1),\n    },\n  },\n} satisfies Record<string, SxProps<Theme>>\n","import { Box } from '@mui/material'\nimport { styles } from '../style'\nimport type { FormulaWidgetState, RowProps } from '../types'\nimport { useWidgetSelector } from '../../stores/use-widget-selector'\n\n/**\n * Iterates over the widget's data items and renders a row for each one using render props.\n */\nexport function Row(props: RowProps) {\n  const data = useWidgetSelector(\n    props.id,\n    (w) => (w as FormulaWidgetState | undefined)?.data,\n  )\n\n  return data?.map((_, index) => {\n    return (\n      <Box sx={styles.row} key={`row-${index}`}>\n        {typeof props.children === 'function'\n          ? props.children({ index })\n          : props.children}\n      </Box>\n    )\n  })\n}\n"],"names":["styles","item","color","theme","palette","text","disabled","row","display","alignItems","gap","spacing","marginTop","Row","props","$","_c","data","useWidgetSelector","id","_temp","t0","map","_","index","jsx","Box","children","w"],"mappings":";;;;AAEO,MAAMA,IAAS;AAAA,EAMpBC,MAAM;AAAA,IACJ,2BAA2B;AAAA,MACzBC,OAAOA,CAACC,MAAiBA,EAAMC,QAAQC,KAAKC;AAAAA,IAAAA;AAAAA,EAC9C;AAAA,EAEFC,KAAK;AAAA,IACHC,SAAS;AAAA,IACTC,YAAY;AAAA,IACZC,KAAKA,CAACP,MAAiBA,EAAMQ,QAAQ,CAAC;AAAA,IAEtC,SAAS;AAAA,MACPC,WAAWA,CAACT,MAAiBA,EAAMQ,QAAQ,CAAC;AAAA,IAAA;AAAA,EAC9C;AAEJ;ACdO,SAAAE,EAAAC,GAAA;AAAA,QAAAC,IAAAC,EAAA,CAAA,GACLC,IAAaC,EACXJ,EAAKK,IACLC,CACF;AAAC,MAAAC;AAAA,SAAAN,EAAA,CAAA,MAAAE,KAAAF,SAAAD,KAEMO,IAAAJ,GAAIK,IAAM,CAAAC,GAAAC,MAEb,gBAAAC,EAACC,GAAA,EAAQ,IAAA1B,EAAMO,KACZ,UAAA,OAAOO,EAAKa,YAAc,aACvBb,EAAKa,SAAU;AAAA,IAAAH,OAAAA;AAAAA,EAAAA,CACF,IAAbV,EAAKa,YAHe,OAAOH,CAAK,EAItC,CAEH,GAACT,OAAAE,GAAAF,OAAAD,GAAAC,OAAAM,KAAAA,IAAAN,EAAA,CAAA,GARKM;AAQL;AAdG,SAAAD,EAAAQ,GAAA;AAAA,SAGKA,GAA0CX;AAAA;"}

package/dist/series-Bola3CmD.js

@@ -0,0 +1,90 @@
+import { jsx as m } from "react/jsx-runtime";
+import { c as h } from "react/compiler-runtime";
+import { u as p } from "./use-widget-selector-DqRmWQ1K.js";
+import { Typography as g, Avatar as b } from "@mui/material";
+import { s as P } from "./row-D4VOhcNI.js";
+function y(t) {
+  const e = h(4);
+  let l;
+  return e[0] !== t.TypographyProps || e[1] !== t.children || e[2] !== t.disabled ? (l = /* @__PURE__ */ m(g, { sx: P.item, variant: "h5", fontWeight: "medium", "data-disabled": t.disabled, color: "default", ...t.TypographyProps, children: t.children }), e[0] = t.TypographyProps, e[1] = t.children, e[2] = t.disabled, e[3] = l) : l = e[3], l;
+}
+function A(t) {
+  const e = h(9);
+  let l, r, n;
+  e[0] !== t ? ({
+    id: l,
+    index: n,
+    ...r
+  } = t, e[0] = t, e[1] = l, e[2] = r, e[3] = n) : (l = e[1], r = e[2], n = e[3]);
+  const f = n === void 0 ? 0 : n;
+  let a;
+  e[4] !== f ? (a = (s) => s?.data?.[f]?.prefix, e[4] = f, e[5] = a) : a = e[5];
+  const o = p(l, a);
+  if (!o)
+    return null;
+  let i;
+  return e[6] !== o || e[7] !== r ? (i = /* @__PURE__ */ m(y, { ...r, children: o }), e[6] = o, e[7] = r, e[8] = i) : i = e[8], i;
+}
+function C(t) {
+  const e = h(10);
+  let l, r, n;
+  e[0] !== t ? ({
+    id: l,
+    index: n,
+    ...r
+  } = t, e[0] = t, e[1] = l, e[2] = r, e[3] = n) : (l = e[1], r = e[2], n = e[3]);
+  const f = n === void 0 ? 0 : n;
+  let a;
+  e[4] !== f ? (a = (c) => c?.data?.[f]?.suffix, e[4] = f, e[5] = a) : a = e[5];
+  const o = p(l, a);
+  if (!o)
+    return null;
+  let i;
+  e[6] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (i = {
+    color: S
+  }, e[6] = i) : i = e[6];
+  let s;
+  return e[7] !== r || e[8] !== o ? (s = /* @__PURE__ */ m(y, { TypographyProps: i, ...r, children: o }), e[7] = r, e[8] = o, e[9] = s) : s = e[9], s;
+}
+function S(t) {
+  return t.palette.text.secondary;
+}
+function I(t) {
+  const e = h(12), {
+    id: l,
+    index: r
+  } = t, n = r === void 0 ? 0 : r;
+  let f;
+  e[0] !== n ? (f = (x) => x?.series?.[n], e[0] = n, e[1] = f) : f = e[1];
+  const a = p(l, f);
+  if (!a)
+    return null;
+  const {
+    name: o,
+    color: i
+  } = a;
+  let s;
+  e[2] !== i ? (s = i && {
+    color: (x) => x.palette.getContrastText(i)
+  }, e[2] = i, e[3] = s) : s = e[3];
+  let c;
+  e[4] !== i || e[5] !== s ? (c = {
+    bgcolor: i,
+    width: 32,
+    height: 32,
+    fontSize: "0.875rem",
+    fontWeight: "medium",
+    ...s
+  }, e[4] = i, e[5] = s, e[6] = c) : c = e[6];
+  let d;
+  e[7] !== o ? (d = o.charAt(0).toUpperCase(), e[7] = o, e[8] = d) : d = e[8];
+  let u;
+  return e[9] !== c || e[10] !== d ? (u = /* @__PURE__ */ m(b, { sx: c, children: d }), e[9] = c, e[10] = d, e[11] = u) : u = e[11], u;
+}
+export {
+  y as I,
+  A as P,
+  I as S,
+  C as a
+};
+//# sourceMappingURL=series-Bola3CmD.js.map

package/dist/series-Bola3CmD.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"series-Bola3CmD.js","sources":["../src/widgets/formula/components/item.tsx","../src/widgets/formula/components/prefix.tsx","../src/widgets/formula/components/suffix.tsx","../src/widgets/formula/components/series.tsx"],"sourcesContent":["import { Typography } from '@mui/material'\nimport type { ItemProps } from '../types'\nimport { styles } from '../style'\n\n/**\n * Base typography wrapper used by formula sub-components (Value, Prefix, Suffix) to render styled text.\n */\nexport function Item(props: ItemProps) {\n  return (\n    <Typography\n      sx={styles.item}\n      variant='h5'\n      fontWeight='medium'\n      data-disabled={props.disabled}\n      color='default'\n      {...props.TypographyProps}\n    >\n      {props.children}\n    </Typography>\n  )\n}\n","import { type FormulaWidgetState, type ValueProps } from '../types'\nimport { Item } from './item'\nimport { useWidgetSelector } from '../../stores/use-widget-selector'\n\n/**\n * Renders the prefix content (e.g., currency symbol) before a formula value, if defined in the data item.\n */\nexport function Prefix({ id, index = 0, ...props }: ValueProps) {\n  const prefix = useWidgetSelector(\n    id,\n    (w) => (w as FormulaWidgetState | undefined)?.data?.[index]?.prefix,\n  )\n\n  if (!prefix) {\n    return null\n  }\n\n  return <Item {...props}>{prefix}</Item>\n}\n","import { type FormulaWidgetState, type ValueProps } from '../types'\nimport { Item } from './item'\nimport type { Theme } from '@mui/material'\nimport { useWidgetSelector } from '../../stores/use-widget-selector'\n\n/**\n * Renders the suffix content (e.g., unit label) after a formula value, if defined in the data item.\n */\nexport function Suffix({ id, index = 0, ...props }: ValueProps) {\n  const suffix = useWidgetSelector(\n    id,\n    (w) => (w as FormulaWidgetState | undefined)?.data?.[index]?.suffix,\n  )\n\n  if (!suffix) {\n    return null\n  }\n\n  return (\n    <Item\n      TypographyProps={{\n        color: (theme: Theme) => theme.palette.text.secondary,\n      }}\n      {...props}\n    >\n      {suffix}\n    </Item>\n  )\n}\n","import { Avatar } from '@mui/material'\nimport type { FormulaWidgetState, ValueProps } from '../types'\nimport { useWidgetSelector } from '../../stores/use-widget-selector'\n\n/**\n * Renders a colored avatar badge showing the first letter of the series name for multi-value formula widgets.\n */\nexport function Series({ id, index = 0 }: Pick<ValueProps, 'id' | 'index'>) {\n  const serie = useWidgetSelector(\n    id,\n    (w) => (w as FormulaWidgetState | undefined)?.series?.[index],\n  )\n  if (!serie) {\n    return null\n  }\n\n  const { name, color } = serie\n\n  return (\n    <Avatar\n      sx={{\n        bgcolor: color,\n        width: 32,\n        height: 32,\n        fontSize: '0.875rem',\n        fontWeight: 'medium',\n        ...(color && {\n          color: (theme) => theme.palette.getContrastText(color),\n        }),\n      }}\n    >\n      {name.charAt(0).toUpperCase()}\n    </Avatar>\n  )\n}\n"],"names":["Item","props","$","_c","t0","TypographyProps","children","disabled","Typography","styles","item","Prefix","id","t1","index","undefined","t2","w","data","prefix","useWidgetSelector","t3","jsx","Suffix","suffix","Symbol","for","color","_temp","t4","theme","palette","text","secondary","Series","series","serie","name","getContrastText","bgcolor","width","height","fontSize","fontWeight","t5","charAt","toUpperCase","t6","Avatar"],"mappings":"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"}

package/dist/types/widgets/category/style.d.ts

@@ -4,6 +4,7 @@ export declare const styles: {
         display: "flex";
         flexDirection: "column";
         position: "relative";
+        width: string;
     };
     list: {
         display: "flex";

package/dist/types/widgets/echart/shared-resize-observer.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Shared ResizeObserver singleton for all ECharts instances.
+ *
+ * Instead of creating 100+ individual ResizeObserver instances (one per chart),
+ * this module provides a single shared observer that efficiently handles resize
+ * callbacks for all registered elements.
+ */
+type ResizeCallback = () => void;
+export declare function observeResize(element: Element, callback: ResizeCallback): () => void;
+/** Reset the shared observer (for testing only). */
+export declare function resetSharedResizeObserver(): void;
+export {};

package/dist/types/widgets/stores/index.d.ts

@@ -1,2 +1,3 @@
-export { useWidgetStore } from './widget-store';
+export { useWidgetStore, widgetStoreActions } from './widget-store';
+export { useWidgetSelector } from './use-widget-selector';
 export type { BaseWidgetState, ToolType, WidgetsStoreProps, WidgetState, WidgetStore, WidgetStoreActions, WidgetStoreState, } from './types';

package/dist/types/widgets/stores/use-widget-selector.d.ts

@@ -0,0 +1,35 @@
+import { WidgetState } from './types';
+/**
+ * Scoped selector hook for reading a single widget's state from the store.
+ *
+ * Consolidates multiple `useWidgetStore(useShallow(...))` calls into a single
+ * subscription per component. The selector receives only this widget's state
+ * (or undefined if not yet registered), and uses shallow comparison to avoid
+ * re-renders when unrelated properties change.
+ *
+ * @param widgetId - The widget ID to subscribe to.
+ * @param selector - A function that extracts the needed properties from the widget state.
+ *   Must be a stable reference (inline arrow is fine due to useCallback wrapping).
+ *
+ * @example
+ * ```tsx
+ * // Before: 4 separate subscriptions
+ * const title = useWidgetStore(useShallow((s) => s.getWidget(id)?.title))
+ * const collapsed = useWidgetStore(useShallow((s) => s.getWidget(id)?.collapsed))
+ * const disabled = useWidgetStore(useShallow((s) => s.getWidget(id)?.disabled))
+ * const isFetching = useWidgetStore(useShallow((s) => s.getWidget(id)?.isFetching))
+ *
+ * // After: 1 subscription
+ * const { title, collapsed, disabled, isFetching } = useWidgetSelector(id, (w) => ({
+ *   title: w?.title, collapsed: w?.collapsed, disabled: w?.disabled, isFetching: w?.isFetching,
+ * }))
+ *
+ * // With extra dependencies (e.g., index prop):
+ * const value = useWidgetSelector(
+ *   id,
+ *   (w) => (w as MyState | undefined)?.data?.[index]?.value,
+ *   [index],
+ * )
+ * ```
+ */
+export declare function useWidgetSelector<T>(widgetId: string, selector: (widget: WidgetState | undefined) => T): T;

package/dist/types/widgets/stores/widget-store-performance.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/widgets/stores/widget-store.d.ts

@@ -1,39 +1,61 @@
-import { WidgetStore } from './types';
+import { WidgetStore, WidgetStoreActions } from './types';
 /**
  * Zustand store for managing widget state across the application.
  *
- * This store provides centralized state management for all widget UI components
+ * Provides centralized state management for all widget UI components, including
+ * data/config transformation pipelines via registered tools.
  *
- * @example
+ * **Performance optimizations:**
+ * - `registerTool` skips the store update when structural properties (order, enabled,
+ *   type, disables) haven't changed — only `fn` and `config` are updated via direct
+ *   mutation, avoiding a new `registeredTools` array reference and WidgetLoader
+ *   pipeline cascades.
+ * - `setToolEnabled` skips the store update when the enabled state is already the
+ *   requested value.
+ * - `executeToolPipeline` / `executeConfigPipeline` skip the final `set()` when
+ *   the transformed data/config is referentially identical to what's already in the store.
+ * - Both pipelines support cancellation — newer executions for the same widget
+ *   automatically cancel in-progress ones.
+ *
+ * @example Reading widget state (prefer useWidgetSelector for performance)
  * ```tsx
- * // Import the store
- * import { useWidgetStore } from '@carto/ps-react-ui/widgets'
- *
- * // Use in a component
- * function MyWidget() {
- *   const setWidget = useWidgetStore((state) => state.setWidget)
- *   const widget = useWidgetStore((state) => state.widgets['my-widget'])
- *
- *   useEffect(() => {
- *     setWidget({
- *       id: 'my-widget',
- *       type: 'formula',
- *       title: 'Total Sales',
- *       isLoading: false,
- *       visible: true,
- *       data: { value: 1000, prefix: '$' }
- *     })
- *   }, [setWidget])
- *
- *   return <div>{widget?.data?.value}</div>
+ * import { useWidgetSelector } from '@carto/ps-react-ui/widgets'
+ *
+ * function MyWidget({ id }: { id: string }) {
+ *   const { title, data } = useWidgetSelector(id, (w) => ({
+ *     title: w?.title,
+ *     data: w?.data,
+ *   }))
+ *   return <div>{title}: {JSON.stringify(data)}</div>
  * }
  * ```
  *
- * @example
+ * @example Writing widget state
  * ```tsx
- * // Get widgets by type
- * const getWidgetsByType = useWidgetStore((state) => state.getWidgetsByType)
- * const formulaWidgets = getWidgetsByType('formula')
+ * import { widgetStoreActions } from '@carto/ps-react-ui/widgets'
+ *
+ * const { setWidget } = widgetStoreActions
+ * setWidget('my-widget', { type: 'formula', isLoading: false, data: { value: 1000 } })
  * ```
  */
 export declare const useWidgetStore: import('node_modules/zustand/esm/react.mjs').UseBoundStore<import('node_modules/zustand/esm/vanilla.mjs').StoreApi<WidgetStore>>;
+/**
+ * Stable references to store actions, accessible without creating a subscription.
+ *
+ * Use this instead of `useWidgetStore((state) => state.setWidget)` to avoid
+ * unnecessary subscriber evaluations. Actions are stable functions that never
+ * change, so subscribing to them wastes cycles on every store update.
+ *
+ * @example
+ * ```tsx
+ * import { widgetStoreActions } from '@carto/ps-react-ui/widgets'
+ *
+ * const { setWidget, registerTool } = widgetStoreActions
+ *
+ * useEffect(() => {
+ *   registerTool(id, { id: 'my-tool', order: 10, enabled: true, fn: (d) => d })
+ *   return () => widgetStoreActions.unregisterTool(id, 'my-tool')
+ * }, [id])
+ * ```
+ */
+export declare const widgetStoreActions: WidgetStoreActions;

package/dist/types/widgets/table/types.d.ts

@@ -75,7 +75,7 @@ export interface TableWidgetConfig {
     /** Enable row selection with checkboxes */
     selectable?: boolean;
     /** Currently selected row IDs */
-    selected: (string | number)[];
+    selected?: (string | number)[];
     /** Pagination and sort mode: local (client-side) or remote (server-side) */
     mode: Mode;
     /** Pagination configuration */

package/dist/use-widget-ref-BFazQvJK.js

@@ -0,0 +1,22 @@
+import { c as l } from "react/compiler-runtime";
+import { useRef as c, useEffect as i } from "react";
+import { w as m } from "./widget-store-CIrb9RKP.js";
+function R(t) {
+  const e = l(4), n = c(null), s = c(null);
+  let o, r;
+  e[0] !== t ? (o = () => {
+    n.current && m.setWidget(t, {
+      refUI: n,
+      instance: s
+    });
+  }, r = [t], e[0] = t, e[1] = o, e[2] = r) : (o = e[1], r = e[2]), i(o, r);
+  let f;
+  return e[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (f = {
+    ref: n,
+    instance: s
+  }, e[3] = f) : f = e[3], f;
+}
+export {
+  R as u
+};
+//# sourceMappingURL=use-widget-ref-BFazQvJK.js.map

package/dist/use-widget-ref-BFazQvJK.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-widget-ref-BFazQvJK.js","sources":["../src/hooks/use-widget-ref.ts"],"sourcesContent":["import { useEffect, useRef } from 'react'\nimport { widgetStoreActions } from '../widgets/stores/widget-store'\n\n/**\n * Registers a DOM element ref and an ECharts instance ref with the widget store.\n * This allows other parts of the application (e.g., screenshot export) to access the widget's DOM element.\n *\n * @param widgetId - The widget ID to register the refs under.\n * @returns An object with `ref` (DOM element) and `instance` (ECharts instance) refs.\n *\n * @example\n * ```tsx\n * function MyWidget({ id }: { id: string }) {\n *   const { ref } = useWidgetRef<HTMLDivElement>(id)\n *\n *   return <div ref={ref}>Widget content</div>\n * }\n * ```\n */\nexport function useWidgetRef<T extends HTMLElement = HTMLElement>(\n  widgetId: string,\n) {\n  const ref = useRef<T | null>(null)\n  const instance = useRef<echarts.ECharts | null>(null)\n\n  useEffect(() => {\n    if (ref.current) {\n      widgetStoreActions.setWidget(widgetId, { refUI: ref, instance: instance })\n    }\n  }, [widgetId])\n\n  return { ref, instance }\n}\n"],"names":["useWidgetRef","widgetId","$","_c","ref","useRef","instance","t0","t1","current","widgetStoreActions","setWidget","refUI","useEffect","t2","Symbol","for"],"mappings":";;;AAmBO,SAAAA,EAAAC,GAAA;AAAA,QAAAC,IAAAC,EAAA,CAAA,GAGLC,IAAYC,EAAiB,IAAI,GACjCC,IAAiBD,EAA+B,IAAI;AAAC,MAAAE,GAAAC;AAAA,EAAAN,SAAAD,KAE3CM,IAAAA,MAAA;AACR,IAAIH,EAAGK,WACLC,EAAkBC,UAAWV,GAAU;AAAA,MAAAW,OAASR;AAAAA,MAAGE,UAAAA;AAAAA,IAAAA,CAAsB;AAAA,EAC1E,GACAE,IAAA,CAACP,CAAQ,GAACC,OAAAD,GAAAC,OAAAK,GAAAL,OAAAM,MAAAD,IAAAL,EAAA,CAAA,GAAAM,IAAAN,EAAA,CAAA,IAJbW,EAAUN,GAIPC,CAAU;AAAC,MAAAM;AAAA,SAAAZ,EAAA,CAAA,MAAAa,uBAAAC,IAAA,2BAAA,KAEPF,IAAA;AAAA,IAAAV,KAAAA;AAAAA,IAAAE,UAAAA;AAAAA,EAAAA,GAAiBJ,OAAAY,KAAAA,IAAAZ,EAAA,CAAA,GAAjBY;AAAiB;"}

package/dist/use-widget-selector-DqRmWQ1K.js

@@ -0,0 +1,12 @@
+import { c as i } from "react/compiler-runtime";
+import { u as m } from "./widget-store-CIrb9RKP.js";
+import { useShallow as s } from "zustand/shallow";
+function a(r, e) {
+  const o = i(3);
+  let t;
+  return o[0] !== e || o[1] !== r ? (t = (u) => e(u.widgets[r]), o[0] = e, o[1] = r, o[2] = t) : t = o[2], m(s(t));
+}
+export {
+  a as u
+};
+//# sourceMappingURL=use-widget-selector-DqRmWQ1K.js.map

package/dist/use-widget-selector-DqRmWQ1K.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-widget-selector-DqRmWQ1K.js","sources":["../src/widgets/stores/use-widget-selector.ts"],"sourcesContent":["import { useWidgetStore } from './widget-store'\nimport type { WidgetState } from './types'\nimport { useShallow } from 'zustand/shallow'\n\n/**\n * Scoped selector hook for reading a single widget's state from the store.\n *\n * Consolidates multiple `useWidgetStore(useShallow(...))` calls into a single\n * subscription per component. The selector receives only this widget's state\n * (or undefined if not yet registered), and uses shallow comparison to avoid\n * re-renders when unrelated properties change.\n *\n * @param widgetId - The widget ID to subscribe to.\n * @param selector - A function that extracts the needed properties from the widget state.\n *   Must be a stable reference (inline arrow is fine due to useCallback wrapping).\n *\n * @example\n * ```tsx\n * // Before: 4 separate subscriptions\n * const title = useWidgetStore(useShallow((s) => s.getWidget(id)?.title))\n * const collapsed = useWidgetStore(useShallow((s) => s.getWidget(id)?.collapsed))\n * const disabled = useWidgetStore(useShallow((s) => s.getWidget(id)?.disabled))\n * const isFetching = useWidgetStore(useShallow((s) => s.getWidget(id)?.isFetching))\n *\n * // After: 1 subscription\n * const { title, collapsed, disabled, isFetching } = useWidgetSelector(id, (w) => ({\n *   title: w?.title, collapsed: w?.collapsed, disabled: w?.disabled, isFetching: w?.isFetching,\n * }))\n *\n * // With extra dependencies (e.g., index prop):\n * const value = useWidgetSelector(\n *   id,\n *   (w) => (w as MyState | undefined)?.data?.[index]?.value,\n *   [index],\n * )\n * ```\n */\nexport function useWidgetSelector<T>(\n  widgetId: string,\n  selector: (widget: WidgetState | undefined) => T,\n): T {\n  return useWidgetStore(\n    useShallow((state: { widgets: Record<string, WidgetState> }) =>\n      selector(state.widgets[widgetId]),\n    ),\n  )\n}\n"],"names":["useWidgetSelector","widgetId","selector","$","_c","t0","state","widgets","useWidgetStore","useShallow"],"mappings":";;;AAqCO,SAAAA,EAAAC,GAAAC,GAAA;AAAA,QAAAC,IAAAC,EAAA,CAAA;AAAA,MAAAC;AAAA,SAAAF,EAAA,CAAA,MAAAD,KAAAC,SAAAF,KAKQI,IAAAC,CAAAA,MACTJ,EAASI,EAAKC,QAASN,CAAQ,CAAC,GAACE,OAAAD,GAAAC,OAAAF,GAAAE,OAAAE,KAAAA,IAAAF,EAAA,CAAA,GAF9BK,EACLC,EAAWJ,CAEX,CACF;AAAC;"}