@carto/ps-react-ui 4.3.7 → 4.3.8

package/dist/widgets/loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"loader.js","sources":["../../src/widgets/loader/loader.tsx","../../src/widgets/loader/utils.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport type { WidgetLoaderProps } from './types'\nimport { useWidgetStore } from '../stores/widget-store'\nimport type { WrapperState } from '../wrapper'\n\nexport function WidgetLoader<T extends object = Record<string, unknown>>(\n  props: WidgetLoaderProps<T>,\n) {\n  const setWidget = useWidgetStore((state) => state.setWidget)\n  const executeToolPipeline = useWidgetStore(\n    (state) => state.executeToolPipeline,\n  )\n  const executeConfigPipeline = useWidgetStore(\n    (state) => state.executeConfigPipeline,\n  )\n\n  // Split into 3 effects for metadata and 1 for data pipeline:\n  // Each property that can be modified independently gets its own effect to avoid\n  // accidentally resetting other properties.\n  //\n  // - Effect 1: Type (can be modified by tools that change visualization type)\n  // - Effect 2: Loading/Error states (change during fetch lifecycle)\n  // - Effect 3: Config (can be modified by tools that change widget configuration)\n  // - Effect 4: Data pipeline execution (transforms data through registered tools)\n  // - Effect 5: Re-execute pipeline when tool state changes\n\n  // Effect 1: Type updates\n  useEffect(() => {\n    setWidget<WrapperState>(props.id, {\n      type: props.type,\n    })\n  }, [props.id, props.type, setWidget])\n\n  // Effect 2: Loading and error states\n  useEffect(() => {\n    setWidget<WrapperState>(props.id, {\n      isLoading: props.isLoading ?? false,\n      isFetching: props.isFetching ?? false,\n      error: props.error,\n    })\n  }, [props.id, props.isLoading, props.isFetching, props.error, setWidget])\n\n  // Effect 3: Config updates — run through config pipeline\n  useEffect(() => {\n    if (props.config) {\n      void executeConfigPipeline(props.id, props.config)\n    }\n  }, [props.id, props.config, executeConfigPipeline])\n\n  // Effect 4: Execute tool pipeline when props.data changes\n  useEffect(() => {\n    void executeToolPipeline(props.id, props.data)\n  }, [props.id, props.data, executeToolPipeline])\n\n  // Effect 5: Re-execute pipelines when tool state changes (enabled/config)\n  useEffect(() => {\n    let prevTools = useWidgetStore.getState().widgets[props.id]?.registeredTools\n\n    const unsubscribe = useWidgetStore.subscribe((state) => {\n      const currentTools = state.widgets[props.id]?.registeredTools\n\n      // Only re-execute if tools array changed\n      if (currentTools !== prevTools) {\n        prevTools = currentTools\n        void executeToolPipeline(props.id, props.data)\n        if (props.config) {\n          void executeConfigPipeline(props.id, props.config)\n        }\n      }\n    })\n\n    return unsubscribe\n  }, [\n    props.id,\n    props.data,\n    props.config,\n    executeToolPipeline,\n    executeConfigPipeline,\n  ])\n\n  return props.children\n}\n","import deepmerge from 'deepmerge'\n\n/**\n * Config can be either an object or a function that receives baseConfig and data\n * and returns a partial config to be merged with the base.\n */\nexport type ConfigOrFn<TConfig, TData = unknown> =\n  | Partial<TConfig>\n  | ((baseConfig: TConfig, data: TData) => Partial<TConfig>)\n\n/**\n * Resolves a config that may be either an object or a function.\n * If it's a function, calls it with baseConfig and data.\n * If it's an object (or undefined), returns it as-is.\n */\nexport function resolveConfig<TConfig, TData>(\n  config: ConfigOrFn<TConfig, TData> | undefined,\n  baseConfig: TConfig,\n  data: TData,\n): Partial<TConfig> | undefined {\n  if (typeof config === 'function') {\n    return config(baseConfig, data)\n  }\n  return config\n}\n\nexport function mergeWidgetConfig<T>(\n  ...options: [Partial<T> | undefined, Partial<T> | undefined]\n): T {\n  return deepmerge(options[0] ?? {}, options[1] ?? {}, {\n    arrayMerge(_, source) {\n      return source as T[keyof T][]\n    },\n  })\n}\n"],"names":["WidgetLoader","props","$","_c","setWidget","useWidgetStore","_temp","executeToolPipeline","_temp2","executeConfigPipeline","_temp3","t0","t1","id","type","useEffect","t2","t3","error","isFetching","isLoading","t4","t5","config","t6","t7","data","t8","t9","prevTools","getState","widgets","registeredTools","subscribe","state_2","currentTools","state","children","state_1","state_0","resolveConfig","baseConfig","mergeWidgetConfig","options","deepmerge","arrayMerge","_","source"],"mappings":"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"}
+{"version":3,"file":"loader.js","sources":["../../src/widgets/loader/loader.tsx","../../src/widgets/loader/utils.ts"],"sourcesContent":["import { useEffect, useRef, useSyncExternalStore } from 'react'\nimport type { WidgetLoaderProps } from './types'\nimport { useWidgetStore } from '../stores/widget-store'\nimport type { WrapperState } from '../wrapper'\n\nexport function WidgetLoader<T extends object = Record<string, unknown>>(\n  props: WidgetLoaderProps<T>,\n) {\n  const setWidget = useWidgetStore((state) => state.setWidget)\n  const executeToolPipeline = useWidgetStore(\n    (state) => state.executeToolPipeline,\n  )\n  const executeConfigPipeline = useWidgetStore(\n    (state) => state.executeConfigPipeline,\n  )\n\n  const registeredTools = useSyncExternalStore(\n    useWidgetStore.subscribe,\n    () => useWidgetStore.getState().widgets[props.id]?.registeredTools,\n  )\n\n  const dataRef = useRef(props.data)\n  const configRef = useRef(props.config)\n  const isMountedRef = useRef(false)\n\n  useEffect(() => {\n    dataRef.current = props.data\n    configRef.current = props.config\n  })\n\n  // Split into 3 effects for metadata and 1 for data pipeline:\n  // Each property that can be modified independently gets its own effect to avoid\n  // accidentally resetting other properties.\n  //\n  // - Effect 1: Type (can be modified by tools that change visualization type)\n  // - Effect 2: Loading/Error states (change during fetch lifecycle)\n  // - Effect 3: Config (can be modified by tools that change widget configuration)\n  // - Effect 4: Data pipeline execution (transforms data through registered tools)\n  // - Effect 5: Re-execute pipeline when tool state changes\n\n  // Effect 1: Type updates\n  useEffect(() => {\n    setWidget<WrapperState>(props.id, {\n      type: props.type,\n    })\n  }, [props.id, props.type, setWidget])\n\n  // Effect 2: Loading and error states\n  useEffect(() => {\n    setWidget<WrapperState>(props.id, {\n      isLoading: props.isLoading ?? false,\n      isFetching: props.isFetching ?? false,\n      error: props.error,\n    })\n  }, [props.id, props.isLoading, props.isFetching, props.error, setWidget])\n\n  // Effect 3: Config updates — run through config pipeline\n  useEffect(() => {\n    if (props.config) {\n      void executeConfigPipeline(props.id, props.config)\n    }\n  }, [props.id, props.config, executeConfigPipeline])\n\n  // Effect 4: Execute tool pipeline when props.data changes\n  useEffect(() => {\n    void executeToolPipeline(props.id, props.data)\n  }, [props.id, props.data, executeToolPipeline])\n\n  // Effect 5: Re-execute pipelines when registered tools change\n  useEffect(() => {\n    if (!isMountedRef.current) {\n      isMountedRef.current = true\n      return\n    }\n\n    void executeToolPipeline(props.id, dataRef.current)\n    if (configRef.current) {\n      void executeConfigPipeline(props.id, configRef.current)\n    }\n  }, [registeredTools, props.id, executeToolPipeline, executeConfigPipeline])\n\n  return props.children\n}\n","import deepmerge from 'deepmerge'\n\n/**\n * Config can be either an object or a function that receives baseConfig and data\n * and returns a partial config to be merged with the base.\n */\nexport type ConfigOrFn<TConfig, TData = unknown> =\n  | Partial<TConfig>\n  | ((baseConfig: TConfig, data: TData) => Partial<TConfig>)\n\n/**\n * Resolves a config that may be either an object or a function.\n * If it's a function, calls it with baseConfig and data.\n * If it's an object (or undefined), returns it as-is.\n */\nexport function resolveConfig<TConfig, TData>(\n  config: ConfigOrFn<TConfig, TData> | undefined,\n  baseConfig: TConfig,\n  data: TData,\n): Partial<TConfig> | undefined {\n  if (typeof config === 'function') {\n    return config(baseConfig, data)\n  }\n  return config\n}\n\nexport function mergeWidgetConfig<T>(\n  ...options: [Partial<T> | undefined, Partial<T> | undefined]\n): T {\n  return deepmerge(options[0] ?? {}, options[1] ?? {}, {\n    arrayMerge(_, source) {\n      return source as T[keyof T][]\n    },\n  })\n}\n"],"names":["WidgetLoader","props","$","_c","setWidget","useWidgetStore","_temp","executeToolPipeline","_temp2","executeConfigPipeline","_temp3","t0","id","getState","widgets","registeredTools","useSyncExternalStore","subscribe","dataRef","useRef","data","configRef","config","isMountedRef","t1","current","useEffect","t2","t3","type","t4","t5","error","isFetching","isLoading","t6","t7","t8","t9","t10","t11","children","state_1","state","state_0","resolveConfig","baseConfig","mergeWidgetConfig","options","deepmerge","arrayMerge","_","source"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@carto/ps-react-ui",
-  "version": "4.3.7",
+  "version": "4.3.8",
   "description": "CARTO's Professional Service React Material library",
   "type": "module",
   "devDependencies": {
@@ -15,8 +15,8 @@
     "html2canvas": "1.4.1",
     "react-markdown": "10.1.0",
     "zustand": "5.0.11",
-    "@carto/ps-utils": "2.0.1",
-    "@carto/ps-common-types": "1.0.0"
+    "@carto/ps-common-types": "1.0.0",
+    "@carto/ps-utils": "2.0.1"
   },
   "peerDependencies": {
     "@dnd-kit/core": "^6.0.0",

package/src/widgets/actions/change-column/change-column.test.tsx

@@ -1,6 +1,6 @@
 import { describe, test, expect, beforeEach, vi } from 'vitest'
-import { render, screen, fireEvent } from '@testing-library/react'
-import { ChangeColumn } from './change-column'
+import { render, screen, fireEvent, cleanup } from '@testing-library/react'
+import { ChangeColumn, CHANGE_COLUMN_TOOL_ID } from './change-column'
 import { useWidgetStore } from '../../stores/widget-store'
 import type { TableColumn } from '../../table/types'
 
@@ -160,4 +160,131 @@ describe('ChangeColumn', () => {
       expect(item.getAttribute('tabindex')).toBe('0')
     })
   })
+
+  describe('config tool registration', () => {
+    test('registers config tool on mount', () => {
+      useWidgetStore.getState().setWidget(widgetId, {
+        columns: mockColumns,
+      })
+
+      render(<ChangeColumn id={widgetId} />)
+
+      const widget = useWidgetStore.getState().getWidget(widgetId)
+      const tool = widget?.registeredTools?.find(
+        (t) => t.id === CHANGE_COLUMN_TOOL_ID,
+      )
+
+      expect(tool).toBeDefined()
+      expect(tool?.type).toBe('config')
+      expect(tool?.order).toBe(100)
+      expect(tool?.enabled).toBe(true)
+    })
+
+    test('unregisters config tool on unmount', () => {
+      useWidgetStore.getState().setWidget(widgetId, {
+        columns: mockColumns,
+      })
+
+      render(<ChangeColumn id={widgetId} />)
+
+      // Verify tool is registered
+      let widget = useWidgetStore.getState().getWidget(widgetId)
+      expect(
+        widget?.registeredTools?.find((t) => t.id === CHANGE_COLUMN_TOOL_ID),
+      ).toBeDefined()
+
+      // Unmount
+      cleanup()
+
+      // Verify tool is unregistered
+      widget = useWidgetStore.getState().getWidget(widgetId)
+      expect(
+        widget?.registeredTools?.find((t) => t.id === CHANGE_COLUMN_TOOL_ID),
+      ).toBeUndefined()
+    })
+
+    test('config tool returns currentConfig unchanged when columns match widget state', () => {
+      useWidgetStore.getState().setWidget(widgetId, {
+        columns: mockColumns,
+      })
+
+      render(<ChangeColumn id={widgetId} />)
+
+      const widget = useWidgetStore.getState().getWidget(widgetId)
+      const tool = widget?.registeredTools?.find(
+        (t) => t.id === CHANGE_COLUMN_TOOL_ID,
+      )
+
+      // When config columns match widget columns, fn returns the same reference
+      const input = { columns: mockColumns }
+      const result = tool?.fn(input, tool.config)
+      expect(result).toBe(input)
+    })
+
+    test('column order persists when config pipeline re-runs with original config', async () => {
+      useWidgetStore.getState().setWidget(widgetId, {
+        columns: mockColumns,
+      })
+
+      render(<ChangeColumn id={widgetId} />)
+
+      // Simulate a drag that reorders columns via setWidget
+      const reorderedColumns: TableColumn[] = [
+        { id: 'population', label: 'Population' },
+        { id: 'name', label: 'Name' },
+        { id: 'country', label: 'Country' },
+      ]
+      useWidgetStore.getState().setWidget(widgetId, {
+        columns: reorderedColumns,
+      })
+
+      // Simulate config pipeline re-running with original column order
+      const originalConfig = { columns: mockColumns }
+      await useWidgetStore
+        .getState()
+        .executeConfigPipeline(widgetId, originalConfig)
+
+      // Verify the columns are in the reordered order
+      const widget = useWidgetStore.getState().getWidget(widgetId)
+      const resultColumns = (widget as unknown as Record<string, unknown>)
+        ?.columns as TableColumn[] | undefined
+      expect(resultColumns?.map((c) => c.id)).toEqual([
+        'population',
+        'name',
+        'country',
+      ])
+    })
+
+    test('new columns appended at the end when not in widget order', async () => {
+      useWidgetStore.getState().setWidget(widgetId, {
+        columns: mockColumns,
+      })
+
+      render(<ChangeColumn id={widgetId} />)
+
+      // Simulate widget columns having only a partial order (e.g., user dragged 2 of 3)
+      const partialOrder: TableColumn[] = [
+        { id: 'country', label: 'Country' },
+        { id: 'name', label: 'Name' },
+      ]
+      useWidgetStore.getState().setWidget(widgetId, {
+        columns: partialOrder,
+      })
+
+      // Config pipeline runs with all columns (includes 'population' not in widget order)
+      const originalConfig = { columns: mockColumns }
+      await useWidgetStore
+        .getState()
+        .executeConfigPipeline(widgetId, originalConfig)
+
+      const widget = useWidgetStore.getState().getWidget(widgetId)
+      const resultColumns = (widget as unknown as Record<string, unknown>)
+        ?.columns as TableColumn[] | undefined
+      expect(resultColumns?.map((c) => c.id)).toEqual([
+        'country',
+        'name',
+        'population',
+      ])
+    })
+  })
 })

package/src/widgets/actions/change-column/change-column.tsx

@@ -14,16 +14,24 @@ import {
   verticalListSortingStrategy,
 } from '@dnd-kit/sortable'
 import { IconButton, Menu, SvgIcon } from '@mui/material'
-import { useCallback, useMemo, useState, type MouseEvent } from 'react'
+import {
+  useCallback,
+  useEffect,
+  useMemo,
+  useState,
+  type MouseEvent,
+} from 'react'
 import { useWidgetStore } from '../../stores/widget-store'
 import type { ChangeColumnProps } from './types'
 import { actionButtonStyles } from '../shared/styles'
 import { Tooltip } from '../../../components'
-import type { TableWidgetState } from '../../table/types'
+import type { TableColumn, TableWidgetState } from '../../table/types'
 import { ChangeColumnIcon } from './change-column-icon'
 import { SortableColumnItem } from './sortable-column-item'
 import { useShallow } from 'zustand/shallow'
 
+export const CHANGE_COLUMN_TOOL_ID = 'change-column'
+
 /**
  * Widget action to reorder columns in a table widget via drag-and-drop.
  *
@@ -31,6 +39,9 @@ import { useShallow } from 'zustand/shallow'
  * drag and drop columns to reorder them. All columns are displayed and
  * can be reordered.
  *
+ * Registers as a config pipeline tool so that column order is automatically
+ * re-applied when the base config is updated (e.g., by WidgetLoader).
+ *
  * Returns null if there are fewer than 2 columns.
  *
  * @example
@@ -47,10 +58,64 @@ export function ChangeColumn({
 }: ChangeColumnProps) {
   const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)
   const setWidget = useWidgetStore((state) => state.setWidget)
+  const registerTool = useWidgetStore((state) => state.registerTool)
+  const unregisterTool = useWidgetStore((state) => state.unregisterTool)
   const columns = useWidgetStore(
     useShallow((state) => state.getWidget<TableWidgetState>(id)?.columns),
   )
 
+  /**
+   * Config tool function that reorders columns to match the current widget state.
+   * Reads desired order from the widget store (set by handleDragEnd via setWidget).
+   * Preserves referential identity when the order already matches to prevent
+   * re-render loops in the config pipeline.
+   */
+  const reorderFn = useCallback(
+    (currentConfig: unknown): unknown => {
+      const widgetState = useWidgetStore
+        .getState()
+        .getWidget<TableWidgetState>(id)
+      const currentColumns = widgetState?.columns
+      if (!currentColumns || currentColumns.length === 0) return currentConfig
+
+      const config = currentConfig as Record<string, unknown>
+      const configColumns = config.columns as TableColumn[] | undefined
+      if (!configColumns || configColumns.length === 0) return currentConfig
+
+      // Check if config columns are already in the same order as widget columns
+      const alreadyMatches =
+        configColumns.length === currentColumns.length &&
+        configColumns.every((col, i) => col.id === currentColumns[i]?.id)
+      if (alreadyMatches) return currentConfig
+
+      // Reorder config columns to match widget column order
+      const columnMap = new Map(configColumns.map((col) => [col.id, col]))
+      const reordered: TableColumn[] = []
+
+      for (const widgetCol of currentColumns) {
+        const col = columnMap.get(widgetCol.id)
+        if (col) {
+          reordered.push(col)
+          columnMap.delete(widgetCol.id)
+        }
+      }
+
+      // Append any new columns not in the widget order
+      for (const col of columnMap.values()) {
+        reordered.push(col)
+      }
+
+      // If result matches current widget columns, reuse the same array reference
+      // to prevent downstream subscribers from detecting a change
+      const matchesWidget =
+        reordered.length === currentColumns.length &&
+        reordered.every((col, i) => col.id === currentColumns[i]?.id)
+
+      return { ...config, columns: matchesWidget ? currentColumns : reordered }
+    },
+    [id],
+  )
+
   const sensors = useSensors(
     useSensor(PointerSensor),
     useSensor(KeyboardSensor, {
@@ -63,6 +128,18 @@ export function ChangeColumn({
     [columns],
   )
 
+  // Register config tool on mount
+  useEffect(() => {
+    registerTool(id, {
+      id: CHANGE_COLUMN_TOOL_ID,
+      type: 'config',
+      order: 100,
+      enabled: true,
+      fn: reorderFn,
+    })
+    return () => unregisterTool(id, CHANGE_COLUMN_TOOL_ID)
+  }, [id, registerTool, unregisterTool, reorderFn])
+
   const handleToggle = useCallback((event: MouseEvent<HTMLElement>) => {
     event.stopPropagation()
     setAnchorEl(event.currentTarget)

package/src/widgets/actions/fullscreen/fullscreen.tsx

@@ -22,6 +22,7 @@ export function FullScreen({
   Icon,
   IconButtonProps,
   DialogContentProps: { sx, ...DialogContentProps } = {},
+  DialogProps,
 }: FullScreenProps) {
   const isFullScreen = useWidgetStore(
     useShallow((state) => state.getWidget<FullScreenState>(id)?.isFullScreen),
@@ -48,7 +49,9 @@ export function FullScreen({
       <Dialog
         maxWidth={false}
         open={!!isFullScreen}
+        keepMounted
         aria-labelledby={labels?.ariaLabel ?? `fullscreen-dialog-title-${id}`}
+        {...DialogProps}
         onClose={() => updateFullScreenConfig({ isFullScreen: false })}
       >
         <DialogTitle

package/src/widgets/actions/fullscreen/types.ts

@@ -1,4 +1,8 @@
-import type { DialogContentProps, IconButtonProps } from '@mui/material'
+import type {
+  DialogContentProps,
+  IconButtonProps,
+  DialogProps,
+} from '@mui/material'
 import type { ReactNode } from 'react'
 import type { BaseWidgetState } from '../../../widgets/stores/types'
 
@@ -22,6 +26,7 @@ export interface FullScreenProps {
   }
   children: ReactNode
   DialogContentProps?: DialogContentProps
+  DialogProps?: DialogProps
   IconButtonProps?: IconButtonProps
   Icon?: ReactNode
 }

package/src/widgets/actions/index.ts

@@ -24,7 +24,7 @@ export type {
 
 /* Stack Toggle Widget */
 export { StackToggle, STACK_TOGGLE_TOOL_ID } from './stack-toggle/stack-toggle'
-export type { StackToggleProps } from './stack-toggle/types'
+export type { StackToggleProps, StackToggleState } from './stack-toggle/types'
 
 /* Searcher Toggle Widget */
 export { Searcher, SEARCHER_TOOL_ID } from './searcher/searcher'
@@ -37,7 +37,10 @@ export type {
 } from './searcher/types'
 
 /* Change Column Widget */
-export { ChangeColumn } from './change-column/change-column'
+export {
+  ChangeColumn,
+  CHANGE_COLUMN_TOOL_ID,
+} from './change-column/change-column'
 export type { ChangeColumnProps } from './change-column/types'
 
 /* Lock Selection Widget */
@@ -45,4 +48,7 @@ export {
   LockSelection,
   LOCK_SELECTION_TOOL_ID,
 } from './lock-selection/lock-selection'
-export type { LockSelectionProps } from './lock-selection/types'
+export type {
+  LockSelectionProps,
+  LockSelectionState,
+} from './lock-selection/types'

package/src/widgets/actions/lock-selection/lock-selection.tsx

@@ -1,7 +1,7 @@
 import { IconButton } from '@mui/material'
 import { CheckBoxOutlined } from '@mui/icons-material'
-import { useCallback, useEffect } from 'react'
-import type { LockSelectionProps } from './types'
+import { useCallback, useEffect, useMemo } from 'react'
+import type { LockSelectionProps, LockSelectionState } from './types'
 import { actionButtonStyles } from '../shared/styles'
 import { Tooltip } from '../../../components'
 import { useWidgetStore } from '../../stores/widget-store'
@@ -34,60 +34,61 @@ export function LockSelection({
   Icon,
   IconButtonProps,
 }: LockSelectionProps) {
-  const getWidget = useWidgetStore((state) => state.getWidget)
+  const setWidget = useWidgetStore((state) => state.setWidget)
   const registerTool = useWidgetStore((state) => state.registerTool)
   const unregisterTool = useWidgetStore((state) => state.unregisterTool)
   const setToolEnabled = useWidgetStore((state) => state.setToolEnabled)
   const updateToolConfig = useWidgetStore((state) => state.updateToolConfig)
 
-  const lockTool = useWidgetStore(
-    useShallow((state) => {
-      const tools = state.getWidget(id)?.registeredTools ?? []
-      return tools.find((tool) => tool.id === LOCK_SELECTION_TOOL_ID)
-    }),
+  const storeIsLocked = useWidgetStore(
+    useShallow((state) => state.getWidget<LockSelectionState>(id)?.isLocked),
   )
 
-  const isLocked = lockTool?.enabled ?? false
+  const isLocked = storeIsLocked ?? false
+  const lockedItems = useMemo(
+    () => (isLocked ? selectedItems : []),
+    [isLocked, selectedItems],
+  )
 
   // Register tool on mount
   useEffect(() => {
-    const existingTool = getWidget(id)?.registeredTools?.find(
-      (tool) => tool.id === LOCK_SELECTION_TOOL_ID,
-    )
-
-    const initialEnabled = existingTool?.enabled ?? false
-    const initialLockedItems =
-      (existingTool?.config?.lockedItems as string[]) ?? []
-
     registerTool(id, {
       id: LOCK_SELECTION_TOOL_ID,
       order,
-      enabled: initialEnabled,
+      enabled: isLocked,
       fn: (data, config) => {
         const items = (config?.lockedItems as string[]) || []
         if (items.length === 0) return data
 
         return filterDataByLockedItems(data as EchartWidgetData, items)
       },
-      config: { lockedItems: initialLockedItems },
+      config: { lockedItems },
     })
 
     return () => unregisterTool(id, LOCK_SELECTION_TOOL_ID)
-  }, [id, order, registerTool, unregisterTool, getWidget])
+  }, [id, order, registerTool, unregisterTool, isLocked, lockedItems])
+
+  // Update enabled flag and config when they change
+  useEffect(() => {
+    setToolEnabled(id, LOCK_SELECTION_TOOL_ID, isLocked)
+    updateToolConfig(id, LOCK_SELECTION_TOOL_ID, { lockedItems })
+  }, [id, isLocked, lockedItems, setToolEnabled, updateToolConfig])
 
   const handleToggle = useCallback(() => {
     if (isLocked) {
       // Unlock: clear locked items and disable tool
-      setToolEnabled(id, LOCK_SELECTION_TOOL_ID, false)
-      updateToolConfig(id, LOCK_SELECTION_TOOL_ID, { lockedItems: [] })
+      setWidget(id, {
+        isLocked: false,
+        lockedItems: [],
+      })
     } else {
       // Lock: save selected items and enable tool
-      setToolEnabled(id, LOCK_SELECTION_TOOL_ID, true)
-      updateToolConfig(id, LOCK_SELECTION_TOOL_ID, {
+      setWidget(id, {
+        isLocked: true,
         lockedItems: selectedItems,
       })
     }
-  }, [id, isLocked, selectedItems, setToolEnabled, updateToolConfig])
+  }, [id, isLocked, selectedItems, setWidget])
 
   // Don't render if no selections
   if (selectedItems.length === 0) {

package/src/widgets/actions/lock-selection/types.ts

@@ -1,5 +1,14 @@
 import type { IconButtonProps } from '@mui/material'
 import type { ReactNode } from 'react'
+import type { BaseWidgetState } from '../../stores/types'
+
+/**
+ * Widget state extension for lock selection functionality.
+ * Extends the base widget state with lock-specific properties.
+ */
+export type LockSelectionState<T = object> = BaseWidgetState<
+  T & LockSelectionStateProps
+>
 
 export interface LockSelectionProps {
   /** Widget ID to store lock selection state */
@@ -22,3 +31,11 @@ export interface LockSelectionProps {
   /** Custom icon to display */
   Icon?: ReactNode
 }
+
+/**
+ * Lock selection specific state properties.
+ */
+export interface LockSelectionStateProps {
+  /** Whether the selection is currently locked */
+  isLocked?: boolean
+}

package/src/widgets/actions/relative-data/relative-data.tsx

@@ -2,12 +2,11 @@ import { IconButton } from '@mui/material'
 import { PercentOutlined } from '@mui/icons-material'
 import { useCallback, useEffect, useRef } from 'react'
 import { useWidgetStore } from '../../stores/widget-store'
-import type { RelativeDataProps } from './types'
+import type { RelativeDataProps, RelativeDataState } from './types'
 import { actionButtonStyles } from '../shared/styles'
 import { Tooltip } from '../../../components'
 import { calculateTotal, toRelativeData } from './utils'
 import type { EchartWidgetData } from '../../../widgets/echart'
-import { useShallow } from 'zustand/shallow'
 
 export const RELATIVE_DATA_TOOL_ID = 'relative-data'
 
@@ -44,27 +43,26 @@ export function RelativeData({
   const unregisterTool = useWidgetStore((state) => state.unregisterTool)
   const setToolEnabled = useWidgetStore((state) => state.setToolEnabled)
 
-  const relativeTool = useWidgetStore(
-    useShallow((state) => {
-      const tools = state.getWidget(id)?.registeredTools ?? []
-      return tools.find((tool) => tool.id === RELATIVE_DATA_TOOL_ID)
-    }),
+  const storeIsRelative = useWidgetStore(
+    (state) => state.getWidget<RelativeDataState>(id)?.isRelative,
   )
 
-  const isRelative = relativeTool?.enabled ?? defaultIsRelative
+  const isRelative = storeIsRelative ?? defaultIsRelative
 
-  // Register tool on mount
+  // Initialize store with default value on mount
   useEffect(() => {
-    const existingTool = getWidget(id)?.registeredTools?.find(
-      (tool) => tool.id === RELATIVE_DATA_TOOL_ID,
-    )
-
-    const initialEnabled = existingTool?.enabled ?? defaultIsRelative
+    const currentValue = getWidget<RelativeDataState>(id)?.isRelative
+    if (currentValue === undefined) {
+      setWidget(id, { isRelative: defaultIsRelative })
+    }
+  }, [defaultIsRelative, getWidget, id, setWidget])
 
+  // Register tool on mount
+  useEffect(() => {
     registerTool(id, {
       id: RELATIVE_DATA_TOOL_ID,
       order,
-      enabled: initialEnabled,
+      enabled: isRelative,
       fn: (data) => {
         const echartData = data as EchartWidgetData
         const total = calculateTotal(echartData)
@@ -73,7 +71,12 @@ export function RelativeData({
     })
 
     return () => unregisterTool(id, RELATIVE_DATA_TOOL_ID)
-  }, [id, order, registerTool, unregisterTool, defaultIsRelative, getWidget])
+  }, [id, order, registerTool, unregisterTool, isRelative])
+
+  // Update enabled flag when toggle changes
+  useEffect(() => {
+    setToolEnabled(id, RELATIVE_DATA_TOOL_ID, isRelative)
+  }, [id, isRelative, setToolEnabled])
 
   const handleToggle = useCallback(() => {
     const newIsRelative = !isRelative
@@ -93,8 +96,8 @@ export function RelativeData({
       max = 100
     }
 
-    setToolEnabled(id, RELATIVE_DATA_TOOL_ID, newIsRelative)
     setWidget(id, {
+      isRelative: newIsRelative,
       max,
       formatter: newIsRelative
         ? (value: number) => {
@@ -107,7 +110,7 @@ export function RelativeData({
           }
         : originalFormatter.current,
     })
-  }, [isRelative, setWidget, setToolEnabled, id, getWidget])
+  }, [isRelative, setWidget, id, getWidget])
 
   const tooltipLabel = isRelative
     ? (labels?.absolute ?? 'Show absolute values')

package/src/widgets/actions/relative-data/types.ts

@@ -1,5 +1,6 @@
 import type { IconButtonProps } from '@mui/material'
 import type { ReactNode } from 'react'
+import type { BaseWidgetState } from '../../../widgets/stores'
 
 export interface RelativeDataProps {
   /** Widget ID to update data in the widget store */
@@ -22,3 +23,9 @@ export interface RelativeDataProps {
   /** Custom icon to display */
   Icon?: ReactNode
 }
+
+export type RelativeDataState<T = unknown> = BaseWidgetState<
+  T & {
+    isRelative?: boolean
+  }
+>