@carto/ps-react-ui 5.0.0-widgets.9 → 5.1.0

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

@@ -1,8 +1,8 @@
 import { ReactNode, Ref } from 'react';
 import { TableProps as MuiTableProps } from '@mui/material';
-import { BaseWidgetState, WidgetsStoreProps } from '../stores/types';
-import { WrapperState } from '../wrapper/types';
-import { DownloadItem } from '../actions/download/types';
+import { BaseWidgetState, WidgetsStoreProps } from '../stores/types.js';
+import { WrapperState } from '../wrapper/types.js';
+import { DownloadItem } from '../actions/download/types.js';
 /**
  * Table UI component props
  */
@@ -25,7 +25,7 @@ export interface TableColumn {
     /** Enable sorting for this column */
     sortable?: boolean;
     /** Custom cell value formatter */
-    formatter?: (value: unknown) => ReactNode;
+    formatter?: (value: unknown, row: TableRow) => ReactNode;
 }
 /**
  * Table row data - extends Record for flexible data
@@ -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/types/widgets/timeseries/config.d.ts

@@ -1,5 +1,9 @@
-import { TimeseriesConfig, TimeseriesWidgetConfig, TimeseriesWidgetData } from './types';
-import { DownloadItem } from '../actions';
-import { ConfigProps } from '../root/types';
-export declare function timeseriesDownloadConfig({ refUI, }: ConfigProps): DownloadItem<TimeseriesWidgetData>[];
+import { TimeseriesConfig, TimeseriesWidgetConfig } from './types.js';
+export declare const timeseriesDownloadConfig: ({ refUI }: import('../loader/index.js').ConfigProps) => import('../actions/index.js').DownloadItem<import('../echart/index.js').EchartWidgetData>[];
+/**
+ * Generates ECharts configuration for line and area chart widgets over time, with smooth curves, rotated axis labels, and CARTO qualitative color palette.
+ *
+ * @param props - Timeseries configuration including data and theme.
+ * @returns Widget config with ECharts option object.
+ */
 export declare function timeseriesConfig(props: TimeseriesConfig): TimeseriesWidgetConfig;

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

@@ -1,3 +1,3 @@
-export type { TimeseriesWidgetData, TimeseriesWidgetState, TimeseriesWidgetConfig, TimeseriesConfig, } from './types';
-export { timeseriesConfig, timeseriesDownloadConfig } from './config';
-export { TimeseriesSkeleton } from './skeleton';
+export type { TimeseriesWidgetData, TimeseriesWidgetState, TimeseriesWidgetConfig, TimeseriesConfig, } from './types.js';
+export { timeseriesConfig, timeseriesDownloadConfig } from './config.js';
+export { TimeseriesSkeleton } from './skeleton.js';

package/dist/types/widgets/timeseries/skeleton.d.ts

@@ -1 +1 @@
-export declare function TimeseriesSkeleton(): import("react/jsx-runtime").JSX.Element;
+export declare function TimeseriesSkeleton(): import('react').JSX.Element;

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

@@ -1,6 +1,6 @@
-import { EchartWidgetData, EchartWidgetState } from '../echart';
-import { EchartWidgetOptionProps, EchartWidgetProps } from '../echart/types';
-import { ConfigProps } from '../root';
+import { EchartWidgetData, EchartWidgetState } from '../echart/index.js';
+import { EchartWidgetOptionProps, EchartWidgetProps } from '../echart/types.js';
+import { ConfigProps } from '../loader/index.js';
 export type TimeseriesWidgetData = EchartWidgetData;
 export type TimeseriesWidgetState = EchartWidgetState;
 export type TimeseriesWidgetConfig = EchartWidgetProps & {

package/dist/types/widgets/toolbar-actions/index.d.ts

@@ -1,2 +1,2 @@
-export type { ToolbarAction, ToolbarActionsLabels, ToolbarActionsProps, } from './types';
-export { ToolbarActions } from './toolbar-actions';
+export type { ToolbarAction, ToolbarActionsLabels, ToolbarActionsProps, } from './types.js';
+export { ToolbarActions } from './toolbar-actions.js';

package/dist/types/widgets/toolbar-actions/toolbar-actions.d.ts

@@ -1,8 +1,17 @@
 import { JSX } from 'react';
-import { ToolbarActionsProps } from './types';
+import { ToolbarActionsProps } from './types.js';
 /**
  * A floating toolbar component that displays action buttons.
- * Shows a trigger button when there are 3+ actions, which expands
- * to reveal all actions with a close button.
+ * Shows a trigger button when there are more visible actions than the visibleCount,
+ * which expands to reveal all actions with a close button.
+ * When visibleCount is undefined, all actions are shown without overflow.
+ *
+ * Children with the `data-toolbar-hidden` attribute are ignored when counting
+ * visible actions but are included in the preview. This is useful for elements
+ * like Dividers that should appear between actions but not count toward the limit.
+ *
+ * Example: With visibleCount=2 and children [Action1, Divider, Action2, Divider, Action3]:
+ * - Preview shows: Action1, Divider, Action2 (2 visible actions + divider)
+ * - Hidden: Divider, Action3
  */
-export declare function ToolbarActions({ children: _children, full, direction, labels, sx, IconButtonProps, TooltipProps, }: ToolbarActionsProps): JSX.Element | null;
+export declare function ToolbarActions({ children: _children, visibleCount, direction, labels, sx, IconButtonProps, TooltipProps, }: ToolbarActionsProps): JSX.Element | null;

package/dist/types/widgets/toolbar-actions/types.d.ts

@@ -28,12 +28,19 @@ export interface ToolbarActionsLabels {
  * Props for the ToolbarActions component
  */
 export interface ToolbarActionsProps {
-    /** Array of React elements (typically IconButtons) to display in the toolbar */
+    /**
+     * Array of React elements (typically IconButtons) to display in the toolbar.
+     * Elements with `data-toolbar-hidden` attribute are ignored when counting visible
+     * actions and excluded from the collapsed preview (e.g., Dividers).
+     */
     children: ReactNode[] | ReactNode;
     /** Direction in which the toolbar expands */
     direction?: 'left' | 'right';
-    /** Whether the toolbar is in full mode */
-    full?: boolean;
+    /**
+     * Number of visible actions to show in collapsed mode.
+     * When undefined, shows all actions without overflow.
+     */
+    visibleCount?: number;
     /** Custom labels for UI elements */
     labels?: ToolbarActionsLabels;
     /** Custom styles for the root container */

package/dist/types/widgets/{_shared → utils}/chart-config/config-factory.d.ts

@@ -1,4 +1,4 @@
-import { EchartOptionsProps, EchartWidgetData } from '../../echart';
+import { EchartOptionsProps, EchartWidgetData } from '../../echart/index.js';
 /**
  * Base configuration interface for chart widgets
  */

package/dist/types/widgets/utils/chart-config/download-config.d.ts

@@ -0,0 +1,3 @@
+import { DownloadItem } from '../../actions/index.js';
+import { ConfigProps } from '../../loader/types.js';
+export declare function createChartDownloadConfig<TData>(csvModifier: (data: TData) => string[][]): ({ refUI }: ConfigProps) => DownloadItem<TData>[];

package/dist/types/widgets/utils/chart-config/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Shared utilities for chart widget configuration
+ */
+export { defaultFormatter, defaultLabelFormatter } from '../formatter.js';
+export { createChartWidgetConfig } from './config-factory.js';
+export type { ChartWidgetBaseConfig, CreateChartWidgetConfigParams, } from './config-factory.js';
+export { flattenObjectArrayToCSV, scatterplotDataToCSV } from './csv-modifiers.js';
+export { buildLegendConfig, buildGridConfig, buildAxisLabelStyle, createTooltipPositioner, createAxisLabelFormatter, createTooltipFormatter, applyXAxisFormatter, applyYAxisFormatter, niceNum, buildSeriesLabelConfig, buildHistogramSeriesLabelConfig, } from './option-builders.js';
+export { createChartDownloadConfig } from './download-config.js';

package/dist/types/widgets/utils/chart-config/option-builders.d.ts

@@ -0,0 +1,142 @@
+import { Theme } from '@mui/material';
+import { LegendComponentOption } from 'echarts';
+import { CallbackDataParams, TopLevelFormatterParams } from 'echarts/types/dist/shared';
+/**
+ * Shared EChart configuration builders for chart widgets
+ */
+/**
+ * Rounds a value up to the nearest "nice" number.
+ * A nice number is a multiple of 10^floor(log10(value)).
+ *
+ * Examples: 547 → 600, 200 → 200, 1200 → 2000, 18 → 20, 5 → 5, -547 → -500
+ */
+export declare function niceNum(value: number): number;
+/**
+ * Builds standard legend configuration for chart widgets
+ *
+ * @param params - Legend configuration parameters
+ * @param params.hasLegend - Whether to show the legend
+ * @param params.labelFormatter - Optional formatter for legend item names
+ * @returns Legend configuration object
+ */
+export declare function buildLegendConfig({ hasLegend, labelFormatter, }: {
+    hasLegend: boolean;
+    labelFormatter?: (value: string | number) => string | number;
+}): LegendComponentOption;
+/**
+ * Builds standard grid configuration with legend-aware spacing
+ *
+ * @param hasLegend - Whether the chart has a legend
+ * @param theme - MUI theme for spacing
+ * @param additionalConfig - Additional grid configuration to merge
+ * @returns Grid configuration object
+ */
+export declare function buildGridConfig(hasLegend: boolean, theme: Theme): {
+    bottom?: number | undefined;
+};
+/**
+ * Builds the shared axis-label text style for chart widgets, matching the
+ * design's "Overline (Delicate)" token (Inter, 10px) in the secondary text
+ * colour (`rgba(44,48,50,0.6)`). Spread into an ECharts `axisLabel` for both
+ * x and y axes so every chart's labels stay consistent.
+ *
+ * Note: the token's `letterSpacing` and `textTransform: uppercase` are not
+ * representable in ECharts canvas text, so only font size/family/colour are
+ * applied.
+ *
+ * @param theme - MUI theme providing the typography token and palette
+ * @returns `{ fontSize, fontFamily, color }` for an ECharts `axisLabel`
+ */
+export declare function buildAxisLabelStyle(theme: Theme): {
+    fontSize: string | number | undefined;
+    fontFamily: string | undefined;
+    color: string;
+};
+/**
+ * Creates a tooltip position calculator that handles overflow
+ * Used by bar, histogram, and scatterplot widgets
+ *
+ * @param theme - MUI theme for spacing
+ * @returns Tooltip position function
+ */
+export declare function createTooltipPositioner(theme: Theme): (point: [number, number], _params: unknown, _dom: unknown, _rect: unknown, size: {
+    contentSize: [number, number];
+    viewSize: [number, number];
+}) => Record<string, number>;
+/**
+ * Creates an axis label formatter for ECharts
+ * Used to format numeric axis labels with a widget formatter
+ *
+ * @param formatter - Optional formatter function from widget config
+ * @returns Axis label formatter function or undefined
+ */
+export declare function createAxisLabelFormatter(formatter?: (value: number) => string): ((value: number) => string) | undefined;
+/**
+ * Applies labelFormatter to xAxis configuration
+ * Applies to any xAxis regardless of axis type (category, value, etc.)
+ *
+ * @param xAxis - Existing xAxis configuration
+ * @param labelFormatter - Optional labelFormatter function from widget config
+ * @returns Updated xAxis configuration
+ */
+export declare function applyXAxisFormatter(xAxis: unknown, formatter?: (value: string | number) => string | number): {
+    axisLabel: {
+        formatter: ((value: string | number) => string) | undefined;
+    };
+    type?: string;
+};
+/**
+ * Applies formatter to yAxis configuration
+ * Only applies to single axis objects (not arrays) with type 'value'
+ *
+ * @param yAxis - Existing yAxis configuration
+ * @param formatter - Optional formatter function from widget config
+ * @returns Updated yAxis configuration or undefined if no changes needed
+ */
+export declare function applyYAxisFormatter(yAxis: unknown, formatter?: (value: number) => string): {
+    axisLabel: {
+        formatter: ((value: number) => string) | undefined;
+    };
+    type?: string;
+};
+/**
+ * Creates a tooltip formatter for ECharts
+ * Formats numeric values in tooltip using widget formatter
+ * Handles both axis trigger (array) and item trigger (object) modes
+ *
+ * @param formatter - Optional formatter function from widget config
+ * @returns Tooltip formatter function or undefined
+ */
+export declare function createTooltipFormatter(callback: (item: CallbackDataParams, items: CallbackDataParams[]) => {
+    name: string;
+    seriesName: string;
+    marker: string;
+    value: string | number;
+}): (params: TopLevelFormatterParams) => string;
+/**
+ * Builds a series `label` config that applies formatter to the data value
+ * extracted from a dataset row using ECharts encode/dimensionNames.
+ *
+ * Does not set `show` — labels remain hidden by default per ECharts defaults.
+ *
+ * @param formatter - Optional numeric value formatter
+ * @param encodeKey - The encode dimension key to extract ('y' for vertical charts, 'x' for horizontal)
+ */
+export declare function buildSeriesLabelConfig(formatter?: (value: number) => string, encodeKey?: string): {
+    label: {
+        formatter: (params: CallbackDataParams) => string;
+    };
+} | object;
+/**
+ * Builds a series `label` config that applies formatter to a raw numeric value.
+ * Used by histogram where series data is number[] (not datasets).
+ *
+ * Does not set `show` — labels remain hidden by default per ECharts defaults.
+ *
+ * @param formatter - Optional numeric value formatter
+ */
+export declare function buildHistogramSeriesLabelConfig(formatter?: (value: number) => string): {
+    label: {
+        formatter: (params: CallbackDataParams) => string;
+    };
+} | object;

package/dist/types/widgets/utils/formatter.d.ts

@@ -0,0 +1,2 @@
+export declare const defaultFormatter: (value: number) => string;
+export declare const defaultLabelFormatter: (value: string | number) => string | number;

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

@@ -0,0 +1,7 @@
+export { defaultFormatter, defaultLabelFormatter } from './formatter.js';
+export { createChartWidgetConfig } from './chart-config/index.js';
+export type { ChartWidgetBaseConfig, CreateChartWidgetConfigParams, } from './chart-config/index.js';
+export { flattenObjectArrayToCSV, scatterplotDataToCSV } from './chart-config/index.js';
+export { buildLegendConfig, buildGridConfig, createTooltipPositioner, createAxisLabelFormatter, createTooltipFormatter, applyXAxisFormatter, applyYAxisFormatter, niceNum, } from './chart-config/index.js';
+export { baseSkeletonStyles } from './skeleton/index.js';
+export { createChartDownloadConfig } from './chart-config/index.js';

package/dist/types/widgets/utils/skeleton/index.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Shared skeleton styles for chart widgets
+ */
+export { baseSkeletonStyles } from './styles.js';

package/dist/types/widgets/wrapper/components/actions.d.ts

@@ -1,2 +1,5 @@
-import { WrapperActionsProps } from '../types';
-export declare function Actions({ actions }: WrapperActionsProps): import("react/jsx-runtime").JSX.Element;
+import { WrapperActionsProps } from '../types.js';
+/**
+ * Renders action buttons in the widget wrapper header. Each action click event is stopped from propagating to the accordion.
+ */
+export declare function Actions({ actions }: WrapperActionsProps): import('react').JSX.Element;

package/dist/types/widgets/wrapper/components/options.d.ts

@@ -1,2 +1,5 @@
-import { WrapperOptionsProps } from '../types';
-export declare function Options({ labels, options }: WrapperOptionsProps): import("react/jsx-runtime").JSX.Element;
+import { WrapperOptionsProps } from '../types.js';
+/**
+ * Renders a dropdown options menu in the widget wrapper header, triggered by a vertical ellipsis icon button.
+ */
+export declare function Options({ labels, options, }: WrapperOptionsProps): import('react').JSX.Element;

package/dist/types/widgets/wrapper/components/title.d.ts

@@ -1,6 +1,9 @@
 import { ReactNode } from 'react';
-import { WrapperOptionsProps } from '../types';
+import { WrapperOptionsProps } from '../types.js';
+/**
+ * Renders the widget title text inside the wrapper header with smart tooltip support for truncated titles.
+ */
 export declare function Title({ label, children, }: {
     children: ReactNode;
     label?: NonNullable<WrapperOptionsProps['labels']>['title'];
-}): import("react/jsx-runtime").JSX.Element;
+}): import('react').JSX.Element;

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

@@ -1,6 +1,6 @@
-export { Actions } from './components/actions';
-export { Options } from './components/options';
-export { Title } from './components/title';
-export { WidgetWrapper } from './wrapper';
-export { WrapperUI } from './wrapper-ui';
-export type { WrapperActionsProps, WrapperOption, WrapperOptionsProps, WrapperProps, WrapperState, WrapperUIProps, } from './types';
+export { Actions } from './components/actions.js';
+export { Options } from './components/options.js';
+export { Title } from './components/title.js';
+export { WidgetWrapper } from './wrapper.js';
+export { WrapperUI } from './wrapper-ui.js';
+export type { WrapperActionsProps, WrapperOption, WrapperOptionsProps, WrapperProps, WrapperState, WrapperUIProps, } from './types.js';

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

@@ -1,6 +1,6 @@
 import { ReactNode, SyntheticEvent } from 'react';
 import { SxProps, Theme } from '@mui/material';
-import { BaseWidgetState } from '../stores/types';
+import { BaseWidgetState } from '../stores/types.js';
 export interface WrapperProps extends Pick<WrapperUIProps, 'sx' | 'actions' | 'options' | 'labels' | 'children' | 'onChangeCollapsed'>, Pick<WrapperState, 'disabled' | 'title'> {
     id: WrapperState['id'];
     defaultCollapsed?: boolean;

package/dist/types/widgets/wrapper/wrapper-ui.d.ts

@@ -1,2 +1,16 @@
-import { WrapperUIProps } from './types';
-export declare function WrapperUI({ children, id, actions, sx, labels, options, onChangeCollapsed, }: WrapperUIProps): import("react/jsx-runtime").JSX.Element;
+import { WrapperUIProps } from './types.js';
+/**
+ * Presentational wrapper component that renders the widget accordion UI with title, actions, options menu, and loading indicator. For uncontrolled usage without automatic widget store synchronization, use this instead of WidgetWrapper.
+ *
+ * @example
+ * ```tsx
+ * <WrapperUI
+ *   id="my-widget"
+ *   actions={[<Download key="download" id="my-widget" />]}
+ *   onChangeCollapsed={(e, collapsed) => console.log(collapsed)}
+ * >
+ *   <div>Content</div>
+ * </WrapperUI>
+ * ```
+ */
+export declare function WrapperUI({ children, id, actions, sx, labels, options, onChangeCollapsed, }: WrapperUIProps): import('react').JSX.Element;

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

@@ -1,2 +1,16 @@
-import { WrapperProps } from './types';
-export declare function WidgetWrapper({ id, title, defaultCollapsed, disabled, sx, actions, options, labels, children, onChangeCollapsed, }: WrapperProps): import("react/jsx-runtime").JSX.Element;
+import { WrapperProps } from './types.js';
+/**
+ * Container component providing a collapsible header with title, action buttons, and options menu for widgets. Syncs collapse, disabled, and title state with the widget store.
+ *
+ * @example
+ * ```tsx
+ * <WidgetWrapper
+ *   id="my-widget"
+ *   title="Sales Overview"
+ *   actions={[<Download key="download" id="my-widget" items={downloads} />]}
+ * >
+ *   {children}
+ * </WidgetWrapper>
+ * ```
+ */
+export declare function WidgetWrapper({ id, title, defaultCollapsed, disabled, sx, actions, options, labels, children, onChangeCollapsed, }: WrapperProps): import('react').JSX.Element;

package/dist/types/widgets-v2/actions/brush-toggle/brush-toggle.d.ts

@@ -0,0 +1,56 @@
+import { ComponentType } from 'react';
+import { SvgIconProps } from '@mui/material';
+import { BrushToggleLabels } from './labels.js';
+export interface BrushToggleProps {
+    initialEnabled?: boolean;
+    /**
+     * ECharts brush type. `'lineX'` (default) selects a range on the
+     * x-axis — appropriate for bar / histogram / timeseries. `'rect'`
+     * selects a 2-D rectangle — use for scatterplot. Other ECharts
+     * brush types (`'lineY'`, `'polygon'`) are also accepted.
+     */
+    brushType?: 'lineX' | 'lineY' | 'rect' | 'polygon';
+    /**
+     * `'multiple'` (default) lets the user draw additional brushes on
+     * top of existing ones. `'single'` replaces the previous brush on
+     * each new draw.
+     */
+    brushMode?: 'multiple' | 'single';
+    /**
+     * Optional view of the consumer-owned selection. When provided and
+     * the array is empty (`[]`), any brush rectangles currently drawn on
+     * the chart are wiped — keeps the UI in sync when the parent clears
+     * the selection externally (e.g. via `Widget.SelectionSummary`'s
+     * `onClear`). Pass the same array that drives `useChartSelection` /
+     * the option factory's `selection` input.
+     *
+     * Leave `undefined` to opt out — the sync effect becomes a no-op.
+     */
+    selection?: readonly unknown[] | null;
+    labels?: Partial<BrushToggleLabels>;
+    icon?: ComponentType<SvgIconProps>;
+    iconProps?: SvgIconProps;
+}
+/**
+ * Toggle ECharts' brush selection mode. Two-part wiring:
+ *
+ *   1. The config transform (`addBrush`) installs the `brush`
+ *      component on the option so brushed items get the
+ *      `outOfBrush` dim treatment.
+ *   2. ECharts only enters "brush cursor" mode when something
+ *      dispatches `takeGlobalCursor({ key: 'brush', ... })`. This
+ *      component drives that dispatch via {@link useEchartInstance},
+ *      reacting when the chart instance becomes available (the
+ *      `BrushToggle` mounts before `Widget.Echart` in tree order, so
+ *      on first mount the chart isn't ready yet).
+ *
+ *   3. ECharts clears the global cursor on every `setOption`, so we
+ *      re-dispatch on each `'finished'` event — required for
+ *      `brushMode: 'multiple'` to keep working across selection-driven
+ *      re-renders, RelativeData toggles, etc.
+ *
+ * Selection events (`brushSelected` / `brushEnd`) flow through the
+ * existing `useChartSelection` wiring at the consumer level — no extra
+ * plumbing here.
+ */
+export declare function BrushToggle({ initialEnabled, brushType, brushMode, selection, labels, icon: Icon, iconProps, }: BrushToggleProps): import('react').JSX.Element;

package/dist/types/widgets-v2/actions/brush-toggle/index.d.ts

@@ -0,0 +1,3 @@
+export { BrushToggle, type BrushToggleProps } from './brush-toggle.js';
+export { addBrush } from './transforms.js';
+export { DEFAULT_BRUSH_TOGGLE_LABELS, type BrushToggleLabels } from './labels.js';

package/dist/types/widgets-v2/actions/brush-toggle/labels.d.ts

@@ -0,0 +1,5 @@
+export interface BrushToggleLabels {
+    on: string;
+    off: string;
+}
+export declare const DEFAULT_BRUSH_TOGGLE_LABELS: BrushToggleLabels;

package/dist/types/widgets-v2/actions/brush-toggle/style.d.ts

@@ -0,0 +1,12 @@
+import { Theme } from '@mui/material';
+export declare const styles: {
+    toggle: {
+        p: number;
+        '& .MuiSvgIcon-root': {
+            fontSize: number;
+        };
+    };
+    toggleActive: {
+        background: (theme: Theme) => string;
+    };
+};

package/dist/types/widgets-v2/actions/brush-toggle/transforms.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Brush config transform: enables ECharts' brush component on the option
+ * object. Module-level constant — identity stable across renders.
+ *
+ * Pairs with `replaceMergeKeys: ['brush']` so the pipeline replaces (not
+ * merges) the brush config on every config-pipeline run. v1 needed a
+ * mousemove re-dispatch hack to keep the brush state across data updates;
+ * v2 keeps brush state continuous via `notMerge: false` + dynamic
+ * replaceMerge in the EchartUI layer (D6) — no hack required.
+ */
+export declare const addBrush: (option: unknown) => unknown;

package/dist/types/widgets-v2/actions/change-column/change-column-icon.d.ts

@@ -0,0 +1,2 @@
+import { SvgIconProps } from '@mui/material';
+export declare function ChangeColumnIcon(props: SvgIconProps): import('react').JSX.Element;

package/dist/types/widgets-v2/actions/change-column/change-column.d.ts

@@ -0,0 +1,29 @@
+import { ComponentType, ReactNode } from 'react';
+import { SvgIconProps } from '@mui/material';
+import { ChangeColumnLabels } from './labels.js';
+export interface ChangeColumnItem {
+    id: string;
+    label: ReactNode;
+}
+export interface ChangeColumnProps {
+    /**
+     * Master list of columns (id + label) in their default order. The current
+     * effective order is derived by combining this list with the widget's
+     * `columnOrder` extension state.
+     */
+    columns: readonly ChangeColumnItem[];
+    labels?: Partial<ChangeColumnLabels>;
+    icon?: ComponentType<SvgIconProps>;
+    iconProps?: SvgIconProps;
+    dragHandleIcon?: ComponentType<SvgIconProps>;
+}
+/**
+ * Action that lets users reorder columns via drag-and-drop. The new order is
+ * persisted on the widget store as `columnOrder` (an array of ids) on the
+ * {@link ChangeColumnWidgetState} extension. `<Table>` (and other column-aware
+ * bridges) merge that order with their own `columns` prop via
+ * `resolveColumns()` from the table primitives.
+ *
+ * Returns `null` when there are fewer than two columns to reorder.
+ */
+export declare function ChangeColumn({ columns, labels, icon: Icon, iconProps, dragHandleIcon, }: ChangeColumnProps): import('react').JSX.Element | null;

package/dist/types/widgets-v2/actions/change-column/index.d.ts

@@ -0,0 +1,3 @@
+export { ChangeColumn, type ChangeColumnProps, type ChangeColumnItem, } from './change-column.js';
+export { DEFAULT_CHANGE_COLUMN_LABELS, type ChangeColumnLabels } from './labels.js';
+export type { ChangeColumnWidgetState } from './types.js';

package/dist/types/widgets-v2/actions/change-column/labels.d.ts

@@ -0,0 +1,6 @@
+export interface ChangeColumnLabels {
+    trigger: string;
+    title?: string;
+    reset: string;
+}
+export declare const DEFAULT_CHANGE_COLUMN_LABELS: ChangeColumnLabels;

package/dist/types/widgets-v2/actions/change-column/sortable-column-item.d.ts

@@ -0,0 +1,14 @@
+import { ComponentType, ReactNode } from 'react';
+import { SvgIconProps } from '@mui/material';
+export interface SortableColumnItemProps {
+    id: string;
+    label: ReactNode;
+    dragHandleIcon?: ComponentType<SvgIconProps>;
+}
+/**
+ * Draggable menu item used inside ChangeColumn's `<DndContext>`. Wraps a
+ * MUI `<MenuItem>` so it inherits keyboard / theming behavior, and exposes
+ * the dnd-kit listeners on the whole row so the user can grab anywhere on
+ * the row to reorder.
+ */
+export declare function SortableColumnItem({ id, label, dragHandleIcon: HandleIcon, }: SortableColumnItemProps): import('react').JSX.Element;

package/dist/types/widgets-v2/actions/change-column/style.d.ts

@@ -0,0 +1,59 @@
+import { Theme } from '@mui/material';
+export declare const styles: {
+    toggle: {
+        p: number;
+        '& .MuiSvgIcon-root': {
+            fontSize: number;
+        };
+    };
+    toggleActive: {
+        background: (theme: Theme) => string;
+    };
+    menuPaper: {
+        overflow: "hidden";
+    };
+    header: {
+        color: "text.secondary";
+        backgroundColor: "transparent";
+        typography: string;
+        px: number;
+        py: number;
+    };
+    item: {
+        position: "relative";
+        cursor: "grab";
+        px: number;
+        touchAction: "none";
+        '&:hover .change-column-drag-handle': {
+            opacity: number;
+        };
+        '&:focus-visible': {
+            outline: string;
+            outlineColor: "primary.main";
+            outlineOffset: number;
+        };
+        '&:focus-visible .change-column-drag-handle': {
+            opacity: number;
+        };
+    };
+    itemDragging: {
+        opacity: number;
+        cursor: "grabbing";
+    };
+    dragHandle: {
+        position: "absolute";
+        left: number;
+        top: string;
+        transform: "translateY(-50%)";
+        color: "text.secondary";
+        fontSize: number;
+        opacity: number;
+        transition: "opacity 0.1s";
+        '@media (hover: none)': {
+            opacity: number;
+        };
+    };
+    dragHandleVisible: {
+        opacity: number;
+    };
+};

package/dist/types/widgets-v2/actions/change-column/types.d.ts

@@ -0,0 +1,10 @@
+import { WidgetState } from '../../stores/index.js';
+/**
+ * State extension owned by the ChangeColumn action. Stored on the per-widget
+ * Zustand store; read by `<Table>` (and any other column-aware bridge) to
+ * resolve the effective column order.
+ */
+export interface ChangeColumnWidgetState extends WidgetState {
+    /** Ordered list of column ids. Empty / unset means "use props order". */
+    columnOrder?: readonly string[];
+}