@carto/ps-react-ui 5.2.0 → 5.4.0

package/dist/types/legend/stores/types.d.ts

@@ -72,7 +72,8 @@ export interface LegendRampVariable {
      * Ordered low→high stops. Discrete ramps **require `colors.length + 1`**
      * stops — the boundaries between color steps, including both outer edges —
      * and each label is centered on its boundary line (keep labels short, e.g.
-     * `20K`; there is no collision handling). A discrete ramp with any other
+     * `20K`; there is no collision handling; pass `''` to hide one — each step's
+     * tooltip still shows its full range). A discrete ramp with any other
      * stop count is incoherent and renders an inline error instead of the bar.
      * Continuous ramps show only the first/last endpoints.
      */
@@ -86,7 +87,8 @@ export interface LegendRampVariable {
      */
     avg?: number;
     /**
-     * Formats `avg` for its tooltip. Default `String(avg)` — pass e.g.
+     * Formats `avg` and, on discrete ramps, the stop values shown in each
+     * step's range tooltip. Default `String(value)` — pass e.g.
      * `(v) => formatNumber(v, 'es-ES')` or `(v) => `${v}%``. Use a stable
      * reference (same contract as the other variable fields).
      */

package/dist/types/widgets-v2/actions/searcher/filter.d.ts

@@ -1,6 +1,7 @@
 /**
  * Filters a 2D series of `{name, ...}` records by case-insensitive substring on
- * the `name` field. Keeps the dataset shape (one inner array per series).
+ * the label the user sees: `labelFormatter(name)` when a formatter is given,
+ * `name` otherwise. Keeps the dataset shape (one inner array per series).
  * Used by the Searcher action's data transform.
  */
-export declare function filterBySearchText(input: unknown, search: string): unknown;
+export declare function filterBySearchText(input: unknown, search: string, labelFormatter?: (value: string | number) => string | number): unknown;

package/dist/types/widgets-v2/category/category-ui.d.ts

@@ -51,8 +51,16 @@ export interface CategoryUIProps {
      * overflow row stays a static summary.
      */
     onShowAll?: () => void;
-    /** Manual override for the bar-width denominator. */
+    /**
+     * Manual override for the top of the bar scale. With signed data it is a
+     * magnitude: the scale stays symmetric around the centred zero.
+     */
     maxOverride?: number;
+    /**
+     * Manual override for the bottom of the bar scale, the negative mirror of
+     * `maxOverride`. Ignored unless negative.
+     */
+    minOverride?: number;
     /**
      * Visual density of the bar primitive. `'small'` (default) keeps the
      * historical 4px-tall pill; `'medium'` switches to a 12px-tall track
@@ -93,4 +101,4 @@ export interface CategoryUIProps {
  * Returns `null` when there's nothing to render — `Widget.State` is the
  * empty-state authority in the canonical compositor.
  */
-export declare function CategoryUI({ data, selection, onSelectionChange, formatter, labelFormatter, series, maxItems, labels, onShowAll, maxOverride, size, stacked, hiddenSeries: hiddenSeriesProp, onHiddenSeriesChange, }: CategoryUIProps): import('react').JSX.Element | null;
+export declare function CategoryUI({ data, selection, onSelectionChange, formatter, labelFormatter, series, maxItems, labels, onShowAll, maxOverride, minOverride, size, stacked, hiddenSeries: hiddenSeriesProp, onHiddenSeriesChange, }: CategoryUIProps): import('react').JSX.Element | null;

package/dist/types/widgets-v2/category/category.d.ts

@@ -32,6 +32,12 @@ export interface CategoryProps {
      * regardless of the data.
      */
     maxOverride?: number;
+    /**
+     * Bottom of the bar scale for negative values, the mirror of
+     * `maxOverride`. Auto-filled from `rawData` the same way, so the zero
+     * does not move when the Searcher hides every negative row.
+     */
+    minOverride?: number;
     /**
      * Visual density of the bar primitive. `'small'` (default) keeps the
      * historical 4px-tall pill; `'medium'` switches to a 12px-tall track
@@ -52,4 +58,4 @@ export interface CategoryProps {
  * `onSelectionChange` follow the destination-owned principle: the
  * consumer keeps the list in their own store and passes it through.
  */
-export declare function Category({ selection, onSelectionChange, series, maxItems, labels, onShowAll, maxOverride, size, stacked, }: CategoryProps): import('react').JSX.Element;
+export declare function Category({ selection, onSelectionChange, series, maxItems, labels, onShowAll, maxOverride, minOverride, size, stacked, }: CategoryProps): import('react').JSX.Element;

package/dist/types/widgets-v2/category/components/category-bar-stacked.d.ts

@@ -10,6 +10,13 @@ export interface CategoryBarStackedProps {
      * so cross-row comparison is preserved.
      */
     maxValue: number;
+    /**
+     * Where the zero sits, as a percentage of the track. `0` (default) is the
+     * positive-only layout. Positive segments stack rightwards from it and
+     * negative ones leftwards, both scaled by `maxValue` against the full
+     * track width.
+     */
+    zeroPct?: number;
     /** Visual density. Forwarded to the track styling; segments inherit height. */
     size?: CategorySize;
 }
@@ -25,4 +32,4 @@ export interface CategoryBarStackedProps {
  * via the `colors` prop. Each segment carries `data-bar-fill='true'` so the
  * existing row-hover brightening selector still fires on every segment.
  */
-export declare function CategoryBarStacked({ values, colors, maxValue, size, }: CategoryBarStackedProps): import('react').JSX.Element;
+export declare function CategoryBarStacked({ values, colors, maxValue, zeroPct, size, }: CategoryBarStackedProps): import('react').JSX.Element;

package/dist/types/widgets-v2/category/components/category-bar.d.ts

@@ -1,9 +1,17 @@
+import { ReactNode } from 'react';
 import { CategorySize } from '../types.js';
 export interface CategoryBarProps {
     /** Numeric value driving the fill width. */
     value: number;
-    /** Denominator for the percentage fill. `0` → empty bar (no division by zero). */
+    /** Upper end of the domain. `maxValue === minValue` → empty bar (no division by zero). */
     maxValue: number;
+    /**
+     * Lower end of the domain. `0` (default) keeps the positive-only bar
+     * anchored at the left edge; a negative value moves the zero to
+     * `-minValue / (maxValue - minValue)` and bars grow from there in either
+     * direction, keeping the fill `color` whatever the sign.
+     */
+    minValue?: number;
     /** Fill color. Honors any CSS color or MUI theme token. */
     color: string;
     /**
@@ -13,6 +21,11 @@ export interface CategoryBarProps {
      * size-invariant.
      */
     size?: CategorySize;
+    /**
+     * Draw the zero tick when the domain is signed. `false` when the parent
+     * draws its own zero line (multi-series rows span it across every bar).
+     */
+    zeroTick?: boolean;
 }
 /**
  * Single horizontal bar (track + proportional fill). Pure presentation.
@@ -20,4 +33,13 @@ export interface CategoryBarProps {
  * both — bars stay vivid regardless of selection state (per the v2
  * "row-bg + row-dim, never muted bar" rule).
  */
-export declare function CategoryBar({ value, maxValue, color, size, }: CategoryBarProps): import('react').JSX.Element;
+export declare function CategoryBar({ value, maxValue, minValue, color, size, zeroTick, }: CategoryBarProps): import('react').JSX.Element;
+/**
+ * Wraps a bar track and, when `zeroPct` is set, marks the zero with a tick
+ * that overhangs the track. Positive-only, negative-only and all-zero bars
+ * pass `undefined` and get no tick.
+ */
+export declare function ZeroTickWrap({ zeroPct, children, }: {
+    zeroPct: number | undefined;
+    children: ReactNode;
+}): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | import('react').JSX.Element | null | undefined;

package/dist/types/widgets-v2/category/components/category-row-multi.d.ts

@@ -10,6 +10,8 @@ export interface CategoryRowMultiProps {
     colors: readonly string[];
     /** Shared max across all series + rows (or `maxOverride`). */
     maxValue: number;
+    /** Lower end of the shared domain (`0` for positive-only data). */
+    minValue?: number;
     formatter: (n: number) => string;
     selected: boolean;
     onToggle: (name: CategoryKey) => void;
@@ -28,4 +30,4 @@ export interface CategoryRowMultiProps {
  * rows receive their real palette colors. Computed upstream by
  * `CategoryUI`. The row itself has no bg tint, no opacity rule.
  */
-export declare function CategoryRowMulti({ name, displayName, values, colors, maxValue, formatter, selected, onToggle, size, }: CategoryRowMultiProps): import('react').JSX.Element;
+export declare function CategoryRowMulti({ name, displayName, values, colors, maxValue, minValue, formatter, selected, onToggle, size, }: CategoryRowMultiProps): import('react').JSX.Element;

package/dist/types/widgets-v2/category/components/category-row-single.d.ts

@@ -6,6 +6,8 @@ export interface CategoryRowSingleProps {
     displayName?: string | number;
     value: number;
     maxValue: number;
+    /** Lower end of the shared domain (`0` for positive-only data). */
+    minValue?: number;
     color: string;
     formatter: (n: number) => string;
     selected: boolean;
@@ -25,4 +27,4 @@ export interface CategoryRowSingleProps {
  * when a selection exists and this row isn't in it). The row itself
  * has no bg tint, no opacity rule.
  */
-export declare function CategoryRowSingle({ name, displayName, value, maxValue, color, formatter, selected, onToggle, size, }: CategoryRowSingleProps): import('react').JSX.Element;
+export declare function CategoryRowSingle({ name, displayName, value, maxValue, minValue, color, formatter, selected, onToggle, size, }: CategoryRowSingleProps): import('react').JSX.Element;

package/dist/types/widgets-v2/category/components/category-row-stacked.d.ts

@@ -20,6 +20,11 @@ export interface CategoryRowStackedProps {
     onToggle: (name: CategoryKey) => void;
     /** Bar visual density. Forwarded to the inner {@link CategoryBarStacked}. */
     size?: CategorySize;
+    /**
+     * Where the list's zero sits (% of the track), shared by every row so the
+     * zero lines up: `0` positive-only, `50` signed, `100` negative-only.
+     */
+    zeroPct?: number;
 }
 /**
  * Stacked-mode category row: label + total share a header line; a single
@@ -34,10 +39,14 @@ export interface CategoryRowStackedProps {
  * total relative to other rows. The total numeric value is still shown in
  * the header so the per-row magnitude isn't lost.
  *
+ * Signed data diverges from `zeroPct`: positives stack rightwards and
+ * negatives leftwards, and whichever side is longer reaches its edge of the
+ * track. The header total is the signed sum.
+ *
  * Visual selection / dim signal lives entirely in the segment colors
  * (`colors` prop) — every series in a dimmed row receives
  * `theme.palette.action.disabled`. The bar visually collapses to a single
  * grey shape when dimmed, but the breakdown text stays at full color so the
  * per-series values remain legible.
  */
-export declare function CategoryRowStacked({ name, displayName, values, colors, seriesNames, formatter, selected, onToggle, size, }: CategoryRowStackedProps): import('react').JSX.Element;
+export declare function CategoryRowStacked({ name, displayName, values, colors, seriesNames, formatter, selected, onToggle, size, zeroPct, }: CategoryRowStackedProps): import('react').JSX.Element;

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

@@ -8,15 +8,38 @@ export declare const styles: {
         width: string;
     };
     list: {
+        position: string;
         display: string;
-        flexDirection: string;
+        gridTemplateColumns: string;
         gap: number;
         py: number;
     };
+    listMulti: {
+        gridTemplateColumns: string;
+    };
+    barWrap: {
+        position: string;
+    };
+    multiZeroArea: {
+        position: string;
+        inset: number;
+        gridColumn: string;
+        pointerEvents: string;
+    };
+    zeroTick: {
+        position: string;
+        top: number;
+        bottom: number;
+        width: string;
+        transform: string;
+        bgcolor: string;
+        pointerEvents: string;
+    };
     listScroll: {
         pr: number;
     };
     rowSingle: {
+        gridColumn: string;
         display: string;
         flexDirection: string;
         gap: number;
@@ -39,9 +62,11 @@ export declare const styles: {
         gap: number;
     };
     rowMulti: {
+        position: string;
+        gridColumn: string;
         display: string;
-        flexDirection: string;
-        gap: number;
+        gridTemplateColumns: string;
+        rowGap: number;
         cursor: string;
         userSelect: string;
         transition: string;
@@ -62,6 +87,7 @@ export declare const styles: {
         fontWeight: string;
     };
     multiName: {
+        gridColumn: string;
         overflow: string;
         whiteSpace: string;
         textOverflow: string;
@@ -73,19 +99,19 @@ export declare const styles: {
         fontVariantNumeric: string;
         minWidth: number;
         textAlign: string;
+        alignSelf: string;
     };
     bar: Record<CategorySize, SxProps<Theme>>;
     barFill: Record<CategorySize, SxProps<Theme>>;
     stackedSegment: Record<CategorySize, SxProps<Theme>>;
     multiBarRow: {
         display: string;
-        alignItems: string;
-        gap: number;
     };
     multiBarContainer: {
-        flex: number;
+        alignSelf: string;
     };
     rowStacked: {
+        gridColumn: string;
         display: string;
         flexDirection: string;
         gap: number;
@@ -160,6 +186,7 @@ export declare const styles: {
         fontWeight: string;
     };
     otherRow: {
+        gridColumn: string;
         display: string;
         alignItems: string;
         gap: number;

package/dist/types/widgets-v2/wrapper/style.d.ts

@@ -40,14 +40,43 @@ export declare const styles: {
         height: ({ spacing }: Theme) => string;
         zIndex: number;
     };
+    header: {
+        display: "flex";
+        alignItems: "center";
+        gap: ({ spacing }: Theme) => string;
+        minHeight: ({ spacing }: Theme) => string;
+        paddingInlineEnd: ({ spacing }: Theme) => string;
+    };
     summary: {
+        flex: number;
+        minWidth: number;
         minHeight: ({ spacing }: Theme) => string;
+        paddingInlineEnd: number;
         '& .MuiAccordionSummary-content': {
-            gap: ({ spacing }: Theme) => string;
-            paddingInlineEnd: ({ spacing }: Theme) => string;
             alignItems: "center";
+            minWidth: number;
+            marginInlineEnd: number;
+            paddingInlineEnd: number;
         };
     };
+    headerNoIcon: {
+        paddingInlineEnd: ({ spacing }: Theme) => string;
+    };
+    expandIcon: {
+        display: "flex";
+        marginInlineStart: ({ spacing }: Theme) => string;
+        color: "text.secondary";
+        cursor: "pointer";
+        '& svg': {
+            width: number;
+            height: number;
+            color: "inherit";
+        };
+        transition: ({ transitions }: Theme) => string;
+    };
+    expanded: {
+        transform: "rotate(180deg)";
+    };
     summaryDisabled: {
         '&, &:hover:not(.Mui-disabled)': {
             cursor: "default";

package/dist/types/widgets-v2/wrapper/widget-actions.d.ts

@@ -11,8 +11,8 @@ export interface ActionsProps {
  * pointer devices), and stay full-opacity when a descendant is marked with
  * `.active` — typically applied by toggled actions.
  *
- * The container also stops click propagation so interacting with an action
- * doesn't toggle the wrapper's collapse.
+ * The container also stops click propagation, so a click on an action never
+ * reaches handlers further up the widget.
  */
 export declare function Actions({ sx, children }: ActionsProps): import('react').JSX.Element;
 export interface OptionsProps {

package/dist/types/widgets-v2/wrapper/widget-wrapper.d.ts

@@ -30,8 +30,8 @@ export interface WrapperProps {
     variant?: 'outlined' | 'elevation';
     labels?: Partial<WrapperLabels>;
     /**
-     * Icon shown at the right edge of the summary row. Accordion rotates it
-     * 180° automatically when the wrapper expands. Default: `ExpandMoreIcon`.
+     * Icon shown at the right edge of the header row, rotated 180° while the
+     * wrapper is expanded. Default: `ExpandMoreIcon`.
      */
     expandIcon?: ComponentType<SvgIconProps>;
     iconProps?: SvgIconProps;

package/dist/widgets-v2/actions.js

@@ -1,4 +1,4 @@
-import { C as e, E as t, S as n, T as r, _ as i, a, b as o, c as s, d as c, f as l, g as u, h as d, i as f, l as p, m, n as h, o as g, p as _, r as v, s as y, t as b, u as x, v as S, w as C, x as w, y as T } from "../actions-CF8RNKd6.js";
+import { C as e, E as t, S as n, T as r, _ as i, a, b as o, c as s, d as c, f as l, g as u, h as d, i as f, l as p, m, n as h, o as g, p as _, r as v, s as y, t as b, u as x, v as S, w as C, x as w, y as T } from "../actions-Dhlz_adK.js";
 import { a as E, i as D, n as O, r as k, t as A } from "../zoom-toggle-IsF8BnAp.js";
 import { a as j, c as M, d as N, f as P, i as F, l as I, n as L, o as R, r as z, s as B, t as V, u as H } from "../download-DGgFOaXj.js";
 export { l as BrushToggle, F as CSVIcon, b as ChangeColumn, _ as DEFAULT_BRUSH_TOGGLE_LABELS, h as DEFAULT_CHANGE_COLUMN_LABELS, M as DEFAULT_DOWNLOAD_LABELS, y as DEFAULT_FULLSCREEN_LABELS, f as DEFAULT_LOCK_SELECTION_LABELS, p as DEFAULT_RELATIVE_DATA_LABELS, r as DEFAULT_SEARCHER_LABELS, S as DEFAULT_SHOW_ALL_LABELS, o as DEFAULT_STACK_TOGGLE_LABELS, O as DEFAULT_ZOOM_TOGGLE_LABELS, z as DOWNLOAD_ITEM_IDS, B as Download, g as FullScreen, v as LockSelection, j as MarkdownIcon, R as PNGIcon, s as RelativeData, d as SHOW_ALL_ID, n as Searcher, e as SearcherToggle, u as ShowAllToggle, T as StackToggle, k as ZOOM_LAYOUT, A as ZoomToggle, m as addBrush, w as addStack, D as addZoom, V as buildCsvDownloadItem, L as buildPngDownloadItem, E as createAddZoom, x as createPercentFormatter, I as downloadDOMToPNG, H as downloadToCSV, a as filterByLockedItems, t as filterBySearchText, C as setSearcherText, i as setShowAll, N as toCsvString, c as toRelativeData, P as triggerLinkDownload };

package/dist/widgets-v2/category.js

@@ -1,2 +1,2 @@
-import { a as e, c as t, i as n, l as r, n as i, o as a, r as o, s, t as c } from "../category-D01ruG-l.js";
+import { a as e, c as t, i as n, l as r, n as i, o as a, r as o, s, t as c } from "../category-C6myUFUJ.js";
 export { o as Category, r as CategoryBar, e as CategoryLegend, s as CategoryRowMulti, a as CategoryRowOther, t as CategoryRowSingle, i as CategorySkeleton, n as CategoryUI, c as createCategoryDownloadConfig };