@carto/ps-react-ui 4.14.1 → 4.16.0

package/dist/types/legend/components/legend-sortable/sortable-entity.d.ts

@@ -0,0 +1,27 @@
+import { CSSProperties, ReactElement, ReactNode } from 'react';
+import { SortableKind } from './sortable-ids';
+/** What `SortableEntity` hands to its render callback. */
+export interface SortableEntityRenderProps {
+    /** Attach to the entity's existing root element. */
+    rootRef: (el: HTMLElement | null) => void;
+    /** Sort transform/transition for the root (inline, per-frame values). */
+    rootStyle: CSSProperties;
+    /** The original is dimmed in place while its overlay clone is dragged. */
+    dragging: boolean;
+    /** The drag handle — absolutely positioned, place anywhere in the header. */
+    handle: ReactNode;
+}
+export interface SortableEntityProps {
+    kind: SortableKind;
+    id: string;
+    render: (sortable: SortableEntityRenderProps) => ReactElement;
+}
+/**
+ * Sortable shell for a legend group/row. Render-prop (instead of a wrapper
+ * element) so the entity keeps its own root — sibling CSS like the `& + &`
+ * dividers keeps working. Hosts `useSortable` and builds the drag handle
+ * (keyboard-activatable, labelled `labels.reorder`).
+ *
+ * @experimental This API is new and may change in a future release.
+ */
+export declare function SortableEntity({ kind, id, render }: SortableEntityProps): ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;

package/dist/types/legend/components/legend-sortable/sortable-ids.d.ts

@@ -0,0 +1,6 @@
+export type SortableKind = 'group' | 'layer';
+export declare const toSortableId: (kind: SortableKind, id: string) => string;
+export declare function parseSortableId(sortableId: string): {
+    kind: SortableKind;
+    id: string;
+} | null;

package/dist/types/legend/components/legend-sortable/styles.d.ts

@@ -0,0 +1,54 @@
+import { Theme } from '@mui/material';
+export declare const styles: {
+    handleSlot: {
+        position: "absolute";
+        zIndex: number;
+        display: "flex";
+        alignItems: "center";
+        justifyContent: "center";
+        height: number;
+    };
+    handleSlotLayer: {
+        right: number;
+    };
+    handleSlotGroup: {
+        right: number;
+    };
+    handle: {
+        padding: string;
+        cursor: "grab";
+        touchAction: "none";
+        color: "text.secondary";
+        '& .MuiSvgIcon-root': {
+            fontSize: number;
+        };
+        '&:active': {
+            cursor: "grabbing";
+        };
+        '&:hover': {
+            backgroundColor: "transparent";
+        };
+    };
+    overlay: {
+        display: "flex";
+        alignItems: "center";
+        gap: number;
+        padding: ({ spacing }: Theme) => string;
+        backgroundColor: "background.paper";
+        borderRadius: number;
+        boxShadow: number;
+        height: string;
+        maxWidth: string;
+        overflow: "hidden";
+    };
+    overlayIcon: {
+        display: "flex";
+        color: "text.secondary";
+    };
+    overlayLabel: {
+        minWidth: number;
+        overflow: "hidden";
+        textOverflow: "ellipsis";
+        whiteSpace: "nowrap";
+    };
+};

package/dist/types/legend/components/legend-visible-layers/legend-visible-layers.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Panel checklist of visible layers — each entry hides its layer; the menu
+ * closes when nothing remains to list.
+ *
+ * @experimental This API is new and may change in a future release.
+ */
+export declare function LegendVisibleLayers(): import("react/jsx-runtime").JSX.Element;

package/dist/types/legend/components/legend-visible-layers/styles.d.ts

@@ -0,0 +1,48 @@
+import { Theme } from '@mui/material';
+export declare const styles: {
+    triggerWrap: {
+        display: "inline-flex";
+    };
+    paper: {
+        width: number;
+        maxHeight: number;
+        paddingBottom: number;
+    };
+    stickyHeader: {
+        position: "sticky";
+        top: number;
+        zIndex: number;
+        backgroundColor: "background.paper";
+        padding: number;
+        marginBlockEnd: number;
+        lineHeight: string;
+        borderBottom: string;
+        borderColor: "divider";
+    };
+    groupCaption: {
+        display: "block";
+        padding: ({ spacing }: Theme) => string;
+    };
+    item: {
+        minHeight: number;
+        display: "flex";
+        alignItems: "center";
+        justifyContent: "space-between";
+        gap: number;
+        padding: ({ spacing }: Theme) => string;
+    };
+    itemName: {
+        minWidth: number;
+        overflow: "hidden";
+        textOverflow: "ellipsis";
+        whiteSpace: "nowrap";
+    };
+    eye: {
+        fontSize: number;
+        color: "action.active";
+        flexShrink: number;
+    };
+    divider: {
+        marginY: number;
+    };
+};

package/dist/types/legend/components/run-async-menu-action.d.ts

@@ -0,0 +1,7 @@
+import { LegendMenuController } from './contexts';
+/**
+ * Run an async menu action with busy gating. Uses `isBusy()` (ref-backed) so a
+ * second click before React re-renders cannot fire the handler twice. Keeps
+ * the menu open while pending, then clears busy and closes when it settles.
+ */
+export declare function runAsyncMenuAction(menu: LegendMenuController, action: () => void | Promise<void>): Promise<void>;

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

@@ -5,6 +5,12 @@ import { LegendActions } from './components/legend-actions/legend-actions';
 import { LegendVisibilityToggle } from './components/legend-visibility-toggle/legend-visibility-toggle';
 import { LegendRowMenu } from './components/legend-row-menu/legend-row-menu';
 import { LegendZoomTo } from './components/legend-row-menu/legend-zoom-to';
+import { LegendShowOnlyLayer, LegendShowAllLayers } from './components/legend-row-menu/legend-row-menu-items';
+import { LegendGroupMenu } from './components/legend-group-menu/legend-group-menu';
+import { LegendShowOnlyGroup, LegendShowAllGroups, LegendCollapseAllGroups, LegendZoomToGroup } from './components/legend-group-menu/legend-group-menu-items';
+import { LegendPanelMenu } from './components/legend-panel-menu/legend-panel-menu';
+import { LegendVisibleLayers } from './components/legend-visible-layers/legend-visible-layers';
+import { LegendSortable } from './components/legend-sortable/legend-sortable';
 import { LegendConfigSelect } from './components/legend-config-select/legend-config-select';
 import { LegendItem } from './components/legend-item/legend-item';
 import { LegendItemUI } from './components/legend-item/legend-item-ui';
@@ -22,31 +28,58 @@ import { LegendIconUI } from './components/legend-icon/legend-icon-ui';
  * children — `<Legend.Actions>` renders in the sticky header (hover-fade),
  * everything else in the collapsible body.
  *
+ * Collapse is the title row itself (whole header minus the actions), with an
+ * informative chevron that touch devices don't show. The ⋮ menus are
+ * extensible shells: compose the built-in items and append your own
+ * `MenuItem`s. The built-in items are **self-contained** — their effect is
+ * implemented inside the component through the store's primitive setters, so
+ * they mount with zero wiring; only `ZoomTo`/`ZoomToGroup` take an `onZoomTo`
+ * handler (zooming is the map's concern). Pass an async handler to keep the
+ * menu open with in-item loading feedback until it settles.
+ *
  * ```tsx
  * import { Legend } from '@carto/ps-react-ui/legend'
  *
  * <Legend.Provider id='map-legend' layers={layers} groups={groups}>
+ *   // Panel-wide actions (Show all groups / Collapse all) live once here,
+ *   // not repeated per group.
+ *   <Legend.PanelMenu>
+ *     <Legend.ShowAllGroups />
+ *     <Legend.CollapseAllGroups />
+ *   </Legend.PanelMenu>
+ *
  *   <Legend.Group groupId='demographics'>
  *     <Legend.Actions>
  *       <Legend.VisibilityToggle />          // tri-state group eye
+ *       <Legend.GroupMenu>                   // ⋮ (rightmost)
+ *         <Legend.ShowOnlyGroup />
+ *         <Legend.ShowAllLayers />           // this group's members
+ *         <Legend.ZoomToGroup onZoomTo={zoomToGroup} />
+ *       </Legend.GroupMenu>
  *     </Legend.Actions>
  *     <Legend.Row layerId='income'>
- *       // Actions read L→R: options · opacity · visibility
+ *       // Actions read L→R: eye · ⋮ options
  *       <Legend.Actions>
+ *         <Legend.VisibilityToggle />        // layer eye
  *         <Legend.RowMenu>
+ *           <Legend.ShowOnlyLayer />
+ *           <Legend.Opacity.Item />
  *           <Legend.ZoomTo onZoomTo={zoomTo} />
  *         </Legend.RowMenu>
- *         <Legend.Opacity.Trigger />
- *         <Legend.VisibilityToggle />        // layer eye
  *       </Legend.Actions>
+ *       <Legend.Opacity.Inline />            // bar between header and body
  *       <Legend.ConfigSelect />
  *       <Legend.Item />
- *       <Legend.Opacity.Popover />           // anchors to the row header
  *     </Legend.Row>
  *   </Legend.Group>
  * </Legend.Provider>
  * ```
  *
+ * `Legend.ShowAllLayers` is composed at whichever site it targets: directly
+ * in a `Legend.GroupMenu` for that group's members (as above), or in an
+ * ungrouped row's `Legend.RowMenu` for the loose-layer bucket — it resolves
+ * its own scope from context either way.
+ *
  * @experimental This API is new and may change in a future release.
  */
 export declare const Legend: {
@@ -54,12 +87,22 @@ export declare const Legend: {
     readonly Group: typeof LegendGroup;
     readonly Row: typeof LegendRow;
     readonly Actions: typeof LegendActions;
+    readonly Sortable: typeof LegendSortable;
     readonly VisibilityToggle: typeof LegendVisibilityToggle;
     readonly RowMenu: typeof LegendRowMenu;
     readonly ZoomTo: typeof LegendZoomTo;
+    readonly ShowOnlyLayer: typeof LegendShowOnlyLayer;
+    readonly ShowAllLayers: typeof LegendShowAllLayers;
+    readonly GroupMenu: typeof LegendGroupMenu;
+    readonly ShowOnlyGroup: typeof LegendShowOnlyGroup;
+    readonly ShowAllGroups: typeof LegendShowAllGroups;
+    readonly CollapseAllGroups: typeof LegendCollapseAllGroups;
+    readonly ZoomToGroup: typeof LegendZoomToGroup;
+    readonly PanelMenu: typeof LegendPanelMenu;
+    readonly VisibleLayers: typeof LegendVisibleLayers;
     readonly Opacity: {
-        Trigger: () => import("react/jsx-runtime").JSX.Element | null;
-        Popover: () => import("react/jsx-runtime").JSX.Element | null;
+        Item: () => import("react/jsx-runtime").JSX.Element | null;
+        Inline: () => import("react/jsx-runtime").JSX.Element | null;
     };
     readonly ConfigSelect: typeof LegendConfigSelect;
     readonly Item: typeof LegendItem;
@@ -75,9 +118,13 @@ export type { LegendProviderProps, LegendLabels } from './provider';
 export type { LegendGroupProps } from './components/legend-group/legend-group';
 export type { LegendRowProps } from './components/legend-row/legend-row';
 export type { LegendActionsProps } from './components/legend-actions/legend-actions';
+export type { LegendSortableProps } from './components/legend-sortable/legend-sortable';
 export type { LegendVisibilityToggleProps } from './components/legend-visibility-toggle/legend-visibility-toggle';
 export type { LegendRowMenuProps } from './components/legend-row-menu/legend-row-menu';
 export type { LegendZoomToProps } from './components/legend-row-menu/legend-zoom-to';
+export type { LegendGroupMenuProps } from './components/legend-group-menu/legend-group-menu';
+export type { LegendZoomToGroupProps } from './components/legend-group-menu/legend-group-menu-items';
+export type { LegendPanelMenuProps } from './components/legend-panel-menu/legend-panel-menu';
 export type { LegendRowContextValue } from './components/contexts';
 export type { LegendItemUIProps } from './components/legend-item/legend-item-ui';
 export type { LegendSwatchProps } from './components/legend-swatch/legend-swatch';

package/dist/types/legend/provider/labels.d.ts

@@ -10,12 +10,33 @@ export interface LegendLabels {
     showLayer: string;
     layerOptions: string;
     zoomTo: string;
+    /** In-flight label for Zoom to layer / Zoom to group. */
+    loading: string;
+    showOnlyLayer: string;
+    showAllLayers: string;
     hideGroup: string;
     showGroup: string;
     expandGroup: string;
     collapseGroup: string;
+    groupOptions: string;
+    showOnlyGroup: string;
+    showAllGroups: string;
+    collapseAllGroups: string;
+    expandAllGroups: string;
+    zoomToGroup: string;
+    panelOptions: string;
+    /** Sticky header of the visible-layers summary; the count is appended. */
+    enabledLayers: string;
+    /** Tooltip of the visible-layers summary trigger. */
+    toggleEnabledLayers: string;
+    /** Tooltip shared by the ⋮ menu triggers (row, group and panel). */
+    moreOptions: string;
+    /** Drag handle of sortable groups/rows (aria + tooltip). */
+    reorder: string;
     opacity: string;
     attribute: string;
+    /** Generic close affordance (e.g. the inline opacity bar's ✕). */
+    close: string;
     radiusRangeBy: string;
     colorBasedOn: string;
     colorGradient: string;

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

@@ -2,4 +2,4 @@ export type { LegendPosition, LegendOrientation, LegendSwatchShape, LegendFillPa
 export { LegendContext, useLegendId } from './legend-context';
 export { createLegendStore, getLegendStore, hasLegendStore, deleteLegendStore, clearAllLegendStores, setLegendStoreEntry, registerLegendStore, unregisterLegendStore, useLegendStore, useLegendShallow, } from './legend-store-registry';
 export type { LegendVisibility } from './selectors';
-export { selectOrderedGroups, selectLayersByGroup, selectOrderedLayers, selectGroupVisibility, } from './selectors';
+export { selectOrderedGroups, selectLayersByGroup, selectOrderedLayers, selectGroupVisibility, selectLayerCollapsible, selectAllGroupsCollapsed, selectVisibleLayersGrouped, selectHasGroups, } from './selectors';

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

@@ -18,6 +18,37 @@ export declare function selectLayersByGroup(state: LegendState, groupId: string
  * @experimental This API is new and may change in a future release.
  */
 export declare function selectOrderedLayers(state: LegendState): LegendLayer[];
+/**
+ * `true` when every group is collapsed (`false` with no groups) — drives the
+ * "Collapse all groups" / "Expand all groups" menu label flip.
+ *
+ * @experimental This API is new and may change in a future release.
+ */
+export declare function selectAllGroupsCollapsed(state: LegendState): boolean;
+/**
+ * Whether the legend has groups — gates panel-level group actions.
+ *
+ * @experimental This API is new and may change in a future release.
+ */
+export declare function selectHasGroups(state: LegendState): boolean;
+/**
+ * Visible layers grouped for the enabled-layers menu.
+ *
+ * @experimental This API is new and may change in a future release.
+ */
+export declare function selectVisibleLayersGrouped(state: LegendState): {
+    group?: LegendGroup;
+    layers: LegendLayer[];
+}[];
+/**
+ * Whether a layer has any collapsible body — something the row's `Collapse`
+ * can actually fold. A layer with no variables, sections, or helper note
+ * renders an empty body, so there is nothing to collapse. Gates the row's
+ * title-area collapse affordance (chevron + click).
+ *
+ * @experimental This API is new and may change in a future release.
+ */
+export declare function selectLayerCollapsible(state: LegendState, layerId: string): boolean;
 /**
  * Tri-state visibility — derived for groups from their member layers, and the
  * state contract of a controlled `Legend.VisibilityToggle` for any custom

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

@@ -230,6 +230,12 @@ export interface LegendState {
      * section's `options`.
      */
     setSectionValue: (id: string, sectionId: string, value: string) => void;
+    /**
+     * Move a layer to `toIndex` **within its sibling bucket** (its group, or
+     * the ungrouped bucket). `toIndex` is clamped; orders stay dense. No-op
+     * for unknown ids or when the position doesn't change.
+     */
+    moveLayer: (id: string, toIndex: number) => void;
     /**
      * Show/hide **all member layers** of a group (the group itself has no stored
      * visibility — it is derived from its members). Each member keeps its own
@@ -239,6 +245,11 @@ export interface LegendState {
      */
     setGroupVisibility: (id: string, visible: boolean) => void;
     setGroupCollapsed: (id: string, collapsed: boolean) => void;
+    /**
+     * Move a group to `toIndex` within the group list. `toIndex` is clamped;
+     * orders stay dense. No-op for unknown ids or an unchanged position.
+     */
+    moveGroup: (id: string, toIndex: number) => void;
     /**
      * Add a layer, or update it if `input.id` already exists. Interactive state
      * (visible/opacity/collapsed/order and section actives) is preserved unless

package/dist/types/widgets-v2/markdown/markdown-content.d.ts

@@ -18,6 +18,12 @@ export interface MarkdownContentProps {
      * Defaults to `false` so caption slots stay text-only by default.
      */
     allowImages?: boolean;
+    /**
+     * When `true`, enables GitHub Flavored Markdown (tables, strikethrough,
+     * task lists, autolinks) via `remark-gfm`. Defaults to `false` so existing
+     * consumers keep CommonMark-only parsing.
+     */
+    gfm?: boolean;
 }
 /**
  * Low-level Markdown rendering primitive. Wraps `react-markdown` with two
@@ -31,4 +37,4 @@ export interface MarkdownContentProps {
  * tree. `safeUrlTransform` is always applied as a second layer for markdown
  * links/images on the `allowHtml=false` path.
  */
-export declare function MarkdownContent({ content, components, allowHtml, allowImages, }: MarkdownContentProps): import("react/jsx-runtime").JSX.Element;
+export declare function MarkdownContent({ content, components, allowHtml, allowImages, gfm, }: MarkdownContentProps): import("react/jsx-runtime").JSX.Element;

package/dist/widgets-v2/markdown.js

@@ -1,7 +1,8 @@
-import { M as E, a as O, b as S } from "../markdown-BD1jcknS.js";
+import { M as E, a as O } from "../markdown-DdqANCiN.js";
+import { MarkdownContent as j } from "../markdown-content-Dk2DSgbf.js";
 import { jsx as i } from "react/jsx-runtime";
-import { c as s } from "react/compiler-runtime";
-import { Box as c, Skeleton as p } from "@mui/material";
+import { c } from "react/compiler-runtime";
+import { Box as p, Skeleton as s } from "@mui/material";
 import "react";
 import "@mui/icons-material";
 import "../lasso-tool-YLFRgb-S.js";
@@ -22,15 +23,15 @@ const m = {
   })
 };
 function y(o) {
-  const e = s(2), {
+  const e = c(2), {
     lines: r
   } = o, n = r === void 0 ? 5 : r;
   let t;
   if (e[0] !== n) {
     const l = ["100%", "95%", "90%", "85%", "70%"];
-    t = /* @__PURE__ */ i(c, { sx: m.root, children: Array.from({
+    t = /* @__PURE__ */ i(p, { sx: m.root, children: Array.from({
       length: n
-    }).map((k, a) => /* @__PURE__ */ i(p, { variant: "rectangular", sx: m.line(l[a % l.length] ?? "85%") }, `line-${a}`)) }), e[0] = n, e[1] = t;
+    }).map((k, a) => /* @__PURE__ */ i(s, { variant: "rectangular", sx: m.line(l[a % l.length] ?? "85%") }, `line-${a}`)) }), e[0] = n, e[1] = t;
   } else
     t = e[1];
   return t;
@@ -60,9 +61,9 @@ function I(o) {
 }
 export {
   E as Markdown,
-  O as MarkdownContent,
+  j as MarkdownContent,
   y as MarkdownSkeleton,
-  S as MarkdownUI,
+  O as MarkdownUI,
   I as createMarkdownDownloadConfig
 };
 //# sourceMappingURL=markdown.js.map

package/dist/widgets-v2/markdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"markdown.js","sources":["../../src/widgets-v2/markdown/skeleton.tsx","../../src/widgets-v2/markdown/download.tsx"],"sourcesContent":["import { Box, Skeleton } from '@mui/material'\nimport type { SxProps, Theme } from '@mui/material'\n\nconst styles = {\n  root: {\n    display: 'flex',\n    flexDirection: 'column',\n    gap: 1,\n    py: 1,\n  },\n  line: (width: string): SxProps<Theme> => ({ width, height: 18 }),\n} as const\n\nexport interface MarkdownSkeletonProps {\n  lines?: number\n}\n\nexport function MarkdownSkeleton({ lines = 5 }: MarkdownSkeletonProps) {\n  // Vary widths to mimic prose.\n  const widths = ['100%', '95%', '90%', '85%', '70%']\n  return (\n    <Box sx={styles.root}>\n      {Array.from({ length: lines }).map((_, i) => (\n        <Skeleton\n          key={`line-${i}`}\n          variant='rectangular'\n          sx={styles.line(widths[i % widths.length] ?? '85%')}\n        />\n      ))}\n    </Box>\n  )\n}\n","import {\n  DOWNLOAD_ITEM_IDS,\n  MarkdownIcon,\n  buildPngDownloadItem,\n  toCsvString,\n  triggerLinkDownload,\n  type DownloadItem,\n} from '../actions/download'\nimport type { MarkdownWidgetData } from './types'\n\n/**\n * Download menu items for the Markdown widget. Always includes a `.md`\n * item that saves the markdown source verbatim. When `getCaptureEl` is\n * supplied, prepends a PNG item that rasterises the captured element via\n * `html2canvas`.\n */\nexport function createMarkdownDownloadConfig(args: {\n  filename: string\n  getData: () => MarkdownWidgetData\n  getCaptureEl?: () => HTMLElement | null\n  pngPixelRatio?: number\n  pngBackgroundColor?: string | null\n}): DownloadItem[] {\n  const items: DownloadItem[] = []\n  if (args.getCaptureEl) {\n    items.push(\n      buildPngDownloadItem({\n        filename: args.filename,\n        getCaptureEl: args.getCaptureEl,\n        pixelRatio: args.pngPixelRatio,\n        backgroundColor: args.pngBackgroundColor,\n      }),\n    )\n  }\n  items.push({\n    id: DOWNLOAD_ITEM_IDS.markdown,\n    label: 'Markdown',\n    icon: <MarkdownIcon fontSize='small' />,\n    resolve: () => {\n      const data = args.getData()\n      const blob = new Blob([data.content ?? ''], {\n        type: 'text/markdown;charset=utf-8;',\n      })\n      const url = URL.createObjectURL(blob)\n      return Promise.resolve({\n        url,\n        filename: `${args.filename}.md`,\n        revoke: () => URL.revokeObjectURL(url),\n      })\n    },\n  })\n  return items\n}\n\n// Re-export pure helpers consumers may want when building a custom Download item.\nexport { toCsvString, triggerLinkDownload }\n"],"names":["styles","root","display","flexDirection","gap","py","line","width","height","MarkdownSkeleton","t0","$","_c","lines","t1","undefined","t2","widths","Box","Array","from","length","map","_","i","jsx","Skeleton","createMarkdownDownloadConfig","args","items","getCaptureEl","push","buildPngDownloadItem","filename","pixelRatio","pngPixelRatio","backgroundColor","pngBackgroundColor","id","DOWNLOAD_ITEM_IDS","markdown","label","icon","MarkdownIcon","resolve","data","getData","blob","Blob","content","type","url","URL","createObjectURL","Promise","revoke","revokeObjectURL"],"mappings":";;;;;;;;;;;AAGA,MAAMA,IAAS;AAAA,EACbC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,KAAK;AAAA,IACLC,IAAI;AAAA,EAAA;AAAA,EAENC,MAAMA,CAACC,OAAmC;AAAA,IAAEA,OAAAA;AAAAA,IAAOC,QAAQ;AAAA,EAAA;AAC7D;AAMO,SAAAC,EAAAC,GAAA;AAAA,QAAAC,IAAAC,EAAA,CAAA,GAA0B;AAAA,IAAAC,OAAAC;AAAAA,EAAAA,IAAAJ,GAAEG,IAAAC,MAAAC,SAAA,IAAAD;AAAS,MAAAE;AAAA,MAAAL,SAAAE,GAAA;AAE1C,UAAAI,IAAe,CAAC,QAAQ,OAAO,OAAO,OAAO,KAAK;AAEhDD,IAAAA,sBAACE,GAAA,EAAQ,IAAAlB,EAAMC,MACZkB,gBAAKC,KAAM;AAAA,MAAAC,QAAUR;AAAAA,IAAAA,CAAO,EAACS,IAAK,CAAAC,GAAAC,MACjC,gBAAAC,EAACC,GAAA,EAES,SAAA,eACJ,IAAA1B,EAAMM,KAAMW,EAAOO,IAAIP,EAAMI,MAAO,KAAxB,KAAkC,KAF7C,QAAQG,CAAC,EAEqC,CAEtD,EAAA,CACH,GAAMb,OAAAE,GAAAF,OAAAK;AAAAA,EAAA;AAAAA,IAAAA,IAAAL,EAAA,CAAA;AAAA,SARNK;AAQM;ACbH,SAASW,EAA6BC,GAM1B;AACjB,QAAMC,IAAwB,CAAA;AAC9B,SAAID,EAAKE,gBACPD,EAAME,KACJC,EAAqB;AAAA,IACnBC,UAAUL,EAAKK;AAAAA,IACfH,cAAcF,EAAKE;AAAAA,IACnBI,YAAYN,EAAKO;AAAAA,IACjBC,iBAAiBR,EAAKS;AAAAA,EAAAA,CACvB,CACH,GAEFR,EAAME,KAAK;AAAA,IACTO,IAAIC,EAAkBC;AAAAA,IACtBC,OAAO;AAAA,IACPC,MAAM,gBAAAjB,EAACkB,GAAA,EAAa,UAAS,QAAA,CAAO;AAAA,IACpCC,SAASA,MAAM;AACb,YAAMC,IAAOjB,EAAKkB,QAAAA,GACZC,IAAO,IAAIC,KAAK,CAACH,EAAKI,WAAW,EAAE,GAAG;AAAA,QAC1CC,MAAM;AAAA,MAAA,CACP,GACKC,IAAMC,IAAIC,gBAAgBN,CAAI;AACpC,aAAOO,QAAQV,QAAQ;AAAA,QACrBO,KAAAA;AAAAA,QACAlB,UAAU,GAAGL,EAAKK,QAAQ;AAAA,QAC1BsB,QAAQA,MAAMH,IAAII,gBAAgBL,CAAG;AAAA,MAAA,CACtC;AAAA,IACH;AAAA,EAAA,CACD,GACMtB;AACT;"}
+{"version":3,"file":"markdown.js","sources":["../../src/widgets-v2/markdown/skeleton.tsx","../../src/widgets-v2/markdown/download.tsx"],"sourcesContent":["import { Box, Skeleton } from '@mui/material'\nimport type { SxProps, Theme } from '@mui/material'\n\nconst styles = {\n  root: {\n    display: 'flex',\n    flexDirection: 'column',\n    gap: 1,\n    py: 1,\n  },\n  line: (width: string): SxProps<Theme> => ({ width, height: 18 }),\n} as const\n\nexport interface MarkdownSkeletonProps {\n  lines?: number\n}\n\nexport function MarkdownSkeleton({ lines = 5 }: MarkdownSkeletonProps) {\n  // Vary widths to mimic prose.\n  const widths = ['100%', '95%', '90%', '85%', '70%']\n  return (\n    <Box sx={styles.root}>\n      {Array.from({ length: lines }).map((_, i) => (\n        <Skeleton\n          key={`line-${i}`}\n          variant='rectangular'\n          sx={styles.line(widths[i % widths.length] ?? '85%')}\n        />\n      ))}\n    </Box>\n  )\n}\n","import {\n  DOWNLOAD_ITEM_IDS,\n  MarkdownIcon,\n  buildPngDownloadItem,\n  toCsvString,\n  triggerLinkDownload,\n  type DownloadItem,\n} from '../actions/download'\nimport type { MarkdownWidgetData } from './types'\n\n/**\n * Download menu items for the Markdown widget. Always includes a `.md`\n * item that saves the markdown source verbatim. When `getCaptureEl` is\n * supplied, prepends a PNG item that rasterises the captured element via\n * `html2canvas`.\n */\nexport function createMarkdownDownloadConfig(args: {\n  filename: string\n  getData: () => MarkdownWidgetData\n  getCaptureEl?: () => HTMLElement | null\n  pngPixelRatio?: number\n  pngBackgroundColor?: string | null\n}): DownloadItem[] {\n  const items: DownloadItem[] = []\n  if (args.getCaptureEl) {\n    items.push(\n      buildPngDownloadItem({\n        filename: args.filename,\n        getCaptureEl: args.getCaptureEl,\n        pixelRatio: args.pngPixelRatio,\n        backgroundColor: args.pngBackgroundColor,\n      }),\n    )\n  }\n  items.push({\n    id: DOWNLOAD_ITEM_IDS.markdown,\n    label: 'Markdown',\n    icon: <MarkdownIcon fontSize='small' />,\n    resolve: () => {\n      const data = args.getData()\n      const blob = new Blob([data.content ?? ''], {\n        type: 'text/markdown;charset=utf-8;',\n      })\n      const url = URL.createObjectURL(blob)\n      return Promise.resolve({\n        url,\n        filename: `${args.filename}.md`,\n        revoke: () => URL.revokeObjectURL(url),\n      })\n    },\n  })\n  return items\n}\n\n// Re-export pure helpers consumers may want when building a custom Download item.\nexport { toCsvString, triggerLinkDownload }\n"],"names":["styles","root","display","flexDirection","gap","py","line","width","height","MarkdownSkeleton","t0","$","_c","lines","t1","undefined","t2","widths","Box","Array","from","length","map","_","i","jsx","Skeleton","createMarkdownDownloadConfig","args","items","getCaptureEl","push","buildPngDownloadItem","filename","pixelRatio","pngPixelRatio","backgroundColor","pngBackgroundColor","id","DOWNLOAD_ITEM_IDS","markdown","label","icon","MarkdownIcon","resolve","data","getData","blob","Blob","content","type","url","URL","createObjectURL","Promise","revoke","revokeObjectURL"],"mappings":";;;;;;;;;;;;AAGA,MAAMA,IAAS;AAAA,EACbC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,KAAK;AAAA,IACLC,IAAI;AAAA,EAAA;AAAA,EAENC,MAAMA,CAACC,OAAmC;AAAA,IAAEA,OAAAA;AAAAA,IAAOC,QAAQ;AAAA,EAAA;AAC7D;AAMO,SAAAC,EAAAC,GAAA;AAAA,QAAAC,IAAAC,EAAA,CAAA,GAA0B;AAAA,IAAAC,OAAAC;AAAAA,EAAAA,IAAAJ,GAAEG,IAAAC,MAAAC,SAAA,IAAAD;AAAS,MAAAE;AAAA,MAAAL,SAAAE,GAAA;AAE1C,UAAAI,IAAe,CAAC,QAAQ,OAAO,OAAO,OAAO,KAAK;AAEhDD,IAAAA,sBAACE,GAAA,EAAQ,IAAAlB,EAAMC,MACZkB,gBAAKC,KAAM;AAAA,MAAAC,QAAUR;AAAAA,IAAAA,CAAO,EAACS,IAAK,CAAAC,GAAAC,MACjC,gBAAAC,EAACC,GAAA,EAES,SAAA,eACJ,IAAA1B,EAAMM,KAAMW,EAAOO,IAAIP,EAAMI,MAAO,KAAxB,KAAkC,KAF7C,QAAQG,CAAC,EAEqC,CAEtD,EAAA,CACH,GAAMb,OAAAE,GAAAF,OAAAK;AAAAA,EAAA;AAAAA,IAAAA,IAAAL,EAAA,CAAA;AAAA,SARNK;AAQM;ACbH,SAASW,EAA6BC,GAM1B;AACjB,QAAMC,IAAwB,CAAA;AAC9B,SAAID,EAAKE,gBACPD,EAAME,KACJC,EAAqB;AAAA,IACnBC,UAAUL,EAAKK;AAAAA,IACfH,cAAcF,EAAKE;AAAAA,IACnBI,YAAYN,EAAKO;AAAAA,IACjBC,iBAAiBR,EAAKS;AAAAA,EAAAA,CACvB,CACH,GAEFR,EAAME,KAAK;AAAA,IACTO,IAAIC,EAAkBC;AAAAA,IACtBC,OAAO;AAAA,IACPC,MAAM,gBAAAjB,EAACkB,GAAA,EAAa,UAAS,QAAA,CAAO;AAAA,IACpCC,SAASA,MAAM;AACb,YAAMC,IAAOjB,EAAKkB,QAAAA,GACZC,IAAO,IAAIC,KAAK,CAACH,EAAKI,WAAW,EAAE,GAAG;AAAA,QAC1CC,MAAM;AAAA,MAAA,CACP,GACKC,IAAMC,IAAIC,gBAAgBN,CAAI;AACpC,aAAOO,QAAQV,QAAQ;AAAA,QACrBO,KAAAA;AAAAA,QACAlB,UAAU,GAAGL,EAAKK,QAAQ;AAAA,QAC1BsB,QAAQA,MAAMH,IAAII,gBAAgBL,CAAG;AAAA,MAAA,CACtC;AAAA,IACH;AAAA,EAAA,CACD,GACMtB;AACT;"}

package/dist/widgets-v2.js

@@ -14,11 +14,12 @@ import "./cjs-D4KH3azB.js";
 import { T as Xe } from "./tooltip-BDnrRKrp.js";
 import "@carto/ps-utils";
 import { o as Ze, a as Ke, E as Ye } from "./echart-Bdvbfx9s.js";
-import { D as Wn } from "./echart-Bdvbfx9s.js";
-import { a as Je, b as Qe, M as et } from "./markdown-BD1jcknS.js";
-import { C as tt, L as nt, F as ot, j as rt, R as it, B as lt, Z as st, m as at, n as ct, l as dt, k as ft } from "./change-column-CiVAjOUB.js";
+import { D as $n } from "./echart-Bdvbfx9s.js";
+import { MarkdownContent as Je } from "./markdown-content-Dk2DSgbf.js";
+import { C as Qe, L as et, F as tt, j as nt, R as ot, B as rt, Z as it, m as lt, n as st, l as at, k as ct } from "./change-column-CiVAjOUB.js";
 import "html2canvas";
-import { a as pt, F as mt } from "./formula-DuC0NQLH.js";
+import { a as dt, F as ft } from "./formula-DuC0NQLH.js";
+import { a as pt, M as mt } from "./markdown-DdqANCiN.js";
 import "react-markdown";
 import { b as ut, a as gt } from "./spread-4MYPOntd.js";
 import { a as ht, R as yt } from "./range-l4fNHLEg.js";
@@ -902,7 +903,7 @@ function ye(t) {
 function tn(t) {
   return !t;
 }
-const In = {
+const Ln = {
   // Composition shell
   Provider: wt,
   Wrapper: kt,
@@ -919,25 +920,25 @@ const In = {
   Echart: Ye,
   EchartUI: Ke,
   // Actions
-  Searcher: ft,
-  SearcherToggle: dt,
-  StackToggle: ct,
-  ShowAllToggle: at,
-  ZoomToggle: st,
-  BrushToggle: lt,
-  RelativeData: it,
-  Download: rt,
-  FullScreen: ot,
-  LockSelection: nt,
-  ChangeColumn: tt,
+  Searcher: ct,
+  SearcherToggle: at,
+  StackToggle: st,
+  ShowAllToggle: lt,
+  ZoomToggle: it,
+  BrushToggle: rt,
+  RelativeData: ot,
+  Download: nt,
+  FullScreen: tt,
+  LockSelection: et,
+  ChangeColumn: Qe,
   // Widget primitives (renderer bridges + pure UI). Pre-composed widget
   // modules (Bar, FormulaWidget, TableWidget, etc.) are application-level
   // compositions of these primitives and live outside the library —
   // see `apps/storybook/stories/modules/widgets/` for canonical examples.
-  Formula: mt,
-  FormulaUI: pt,
-  Markdown: et,
-  MarkdownUI: Qe,
+  Formula: ft,
+  FormulaUI: dt,
+  Markdown: mt,
+  MarkdownUI: pt,
   Spread: gt,
   SpreadUI: ut,
   Range: yt,
@@ -948,12 +949,12 @@ const In = {
   TableUI: vt
 };
 export {
-  Wn as DEFAULT_INIT_OPTS,
+  $n as DEFAULT_INIT_OPTS,
   Kt as DEFAULT_NOTE_LABELS,
   Nt as DEFAULT_SELECTION_SUMMARY_LABELS,
   Dt as DEFAULT_STATE_LABELS,
   zt as DEFAULT_TOOLBOX_LABELS,
   Tt as DEFAULT_WRAPPER_LABELS,
-  In as Widget
+  Ln as Widget
 };
 //# sourceMappingURL=widgets-v2.js.map