@leta-io/components 0.4.0 → 0.5.0

package/dist/index.d.ts

@@ -116,6 +116,19 @@ interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>
     copiedLabel?: string;
     /** How long (ms) to show the copied state before resetting. Default 2000. */
     copiedDuration?: number;
+    /**
+     * Icon-only state indicator: a **count badge** on the button's top-right corner
+     * (Desktop Badges `Coral Red (Alt)`, 20 tall) — e.g. a filter's number of selected
+     * values. 0 / undefined shows nothing. Doc 3 §9.3; Library `11268:53244`.
+     * Put the state in `aria-label` too ("Filter, 3 applied") — the badge is decorative.
+     */
+    badgeCount?: number;
+    /**
+     * Icon-only state indicator: a **dot** (`Icon/Circle-Large`, 10px,
+     * `--icons-primary-status-indicator`) on the top-right corner — e.g. a sort that
+     * isn't the surface's default. Doc 3 §9.3. Ignored while `badgeCount` shows.
+     */
+    dot?: boolean;
 }
 declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
 
@@ -244,6 +257,21 @@ interface ChipProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>,
     trailingIcon?: IconName;
     /** When true the chip renders in the Active (selected) state. Caller-controlled. */
     active?: boolean;
+    /**
+     * Makes the trailing ✕ its **own** button that removes the chip — the Selected
+     * Filter Control's chips (Doc 3 §9.2). The label stays the `onClick` target (it
+     * opens what the chip names); without an `onClick` the label is plain text.
+     * `trailingIcon` defaults to `Cancel` in this form.
+     */
+    onRemove?: () => void;
+    /** Screen-reader label for the ✕ — "Remove Driver filter". Required with `onRemove`. */
+    removeLabel?: string;
+    /**
+     * A count chip at zero (Doc 3 §12, "Zero counts — muted, not hidden"): it stays
+     * in place with a muted label and icons, isn't clickable, and leaves the tab
+     * order. No Figma variant exists; the muting reuses the disabled text/icon tokens.
+     */
+    disabled?: boolean;
 }
 /**
  * Desktop Chip — a compact, pill-shaped element that represents a specific
@@ -1200,9 +1228,20 @@ interface SelectionControlProps extends Omit<React.HTMLAttributes<HTMLDivElement
  */
 declare const SelectionControl: React.ForwardRefExoticComponent<SelectionControlProps & React.RefAttributes<HTMLDivElement>>;
 
+/** One keycap: text (`'Ctrl'`, `'Esc'`, `'K'`) or a glyph (`{ icon: 'Enter' }`). */
+type ShortcutKey = string | {
+    icon: IconName;
+    label: string;
+};
 interface ShortcutProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'children'> {
-    /** Keys in the combination, in order (e.g. `['Ctrl', 'K']`). Each renders as its own keycap. */
-    keys: string[];
+    /**
+     * Keys in the combination, in order (e.g. `['Ctrl', 'K']`). Each renders as its
+     * own keycap. A keycap can hold a 16px glyph instead of text — `{ icon: 'Up-Arrow',
+     * label: 'Up arrow' }` — as the Search Overlay footer's ↑ ↓ ↵ keys do (the
+     * Figma keycaps sit in a `Container` SLOT, 2026-10-21). `label` names the glyph
+     * for assistive tech.
+     */
+    keys: ShortcutKey[];
     /** Muted styling for when the parent option's key binding is unavailable. */
     disabled?: boolean;
 }
@@ -1222,6 +1261,19 @@ interface ShortcutProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'chi
  * as a semantic `<kbd>` keycap.
  */
 declare const Shortcut: React.ForwardRefExoticComponent<ShortcutProps & React.RefAttributes<HTMLSpanElement>>;
+interface ShortcutHintProps extends React.HTMLAttributes<HTMLSpanElement> {
+    /** The keys, as for {@link Shortcut}. */
+    keys: ShortcutKey[];
+    /** What the keys do, lower case after the keys: "to close", "to select". */
+    action: string;
+}
+/**
+ * Shortcut Hint — a Shortcut followed by what it does ("Esc to close"), 4px apart,
+ * in Body/S/Regular. The unit the Search Overlay footer (Footer Frame
+ * `Search Overlay`, `11334:57381`) is built from: its Close / Navigate /
+ * Switch Type / Open frames.
+ */
+declare const ShortcutHint: React.ForwardRefExoticComponent<ShortcutHintProps & React.RefAttributes<HTMLSpanElement>>;
 
 interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
     /** Block width — a number is treated as px, any other value is passed through as CSS (e.g. `'100%'`). Default `'100%'`. */
@@ -1501,7 +1553,7 @@ interface BreadcrumbsProps extends React.HTMLAttributes<HTMLElement> {
  */
 declare const Breadcrumbs: React.ForwardRefExoticComponent<BreadcrumbsProps & React.RefAttributes<HTMLElement>>;
 
-type FooterFrameVariant = 'default' | 'tertiary-action' | 'data-summary' | 'preference' | 'validation' | 'card';
+type FooterFrameVariant = 'default' | 'tertiary-action' | 'data-summary' | 'preference' | 'validation' | 'card' | 'search-overlay';
 interface FooterFrameProps extends React.HTMLAttributes<HTMLDivElement> {
     /** Which footer treatment. Drives height / padding / background. Default `default`. */
     variant?: FooterFrameVariant;
@@ -1562,6 +1614,10 @@ interface FooterFrameProps extends React.HTMLAttributes<HTMLDivElement> {
  * - **preference** — a persistent preference control (e.g. a Selection Control).
  * - **validation** — a validation/error Notification Banner.
  * - **card** — compact (40px, no padding, transparent) for Card surfaces.
+ * - **search-overlay** — the Search Overlay's keyboard-hint footer (`11334:57381`,
+ *   2026-10-21): 52px, padding 16; `leading` and `children` each lay out their
+ *   items 16px apart (e.g. "Esc to close" · "↑↓ to select" | "Tab to switch
+ *   filter" · "↵ to open").
  */
 declare const FooterFrame: React.ForwardRefExoticComponent<FooterFrameProps & React.RefAttributes<HTMLDivElement>>;
 
@@ -1615,6 +1671,12 @@ interface ModalHeadersProps extends Omit<React.HTMLAttributes<HTMLDivElement>, '
     title?: string;
     /** Close-button handler. The close button is always rendered. */
     onClose?: () => void;
+    /**
+     * Replaces the close button with another action in the same slot — the
+     * Notifications panel's "Mark all as read" (Playground `2475:153697`, where the
+     * header's Desktop Button instance is swapped). Omit for the standard close.
+     */
+    trailingAction?: React.ReactNode;
     /** When true, renders a Breadcrumbs component above the title. */
     showBreadcrumb?: boolean;
     /** Content to render in the breadcrumb slot (typically a `<Breadcrumbs>` element). */
@@ -1696,6 +1758,16 @@ interface ModalShellProps extends React.HTMLAttributes<HTMLDivElement> {
      * within itself and returns focus to the trigger on unmount.
      */
     onEscape?: () => void;
+    /**
+     * Whether the header casts the body's top **Scroll Edge** shadow. Default true.
+     *
+     * Pass false when the body's content has its **own sticky header** — the content
+     * then disappears beneath that sticky row, not beneath this header, so the shadow
+     * belongs to the sticky row (the order drawer's Activity tab: its All / Comments /
+     * Events chips stick under the tabs and cast the edge themselves, 2026-10-17).
+     * The footer's edge is unaffected.
+     */
+    headerScrollEdge?: boolean;
 }
 /**
  * Internal shell shared by the modal templates. Mirrors the Figma modal root
@@ -2005,6 +2077,12 @@ interface NotificationBannerProps extends Omit<React.HTMLAttributes<HTMLDivEleme
     description: React.ReactNode;
     /** Override the leading icon (defaults to the icon derived from `type`). */
     icon?: IconName;
+    /**
+     * Draw the leading icon's outlined glyph. The Library's icon slots default to
+     * filled glyphs; an instance that swaps in an `-Outline` icon (the Comment
+     * Field's "Info-Outline" and "Message-Disabled-Outline", `1691:120714`) sets this.
+     */
+    iconOutlined?: boolean;
     onDismiss?: () => void;
     children?: React.ReactNode;
     showContentButtons?: boolean;
@@ -2146,73 +2224,75 @@ type OptionCardState = 'idle' | 'hover' | 'pressed' | 'active' | 'focus';
  */
 declare const OptionCard: React.ForwardRefExoticComponent<OptionCardProps & React.RefAttributes<HTMLLabelElement>>;
 
-interface ConfigurationCardRowProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {
-    /** Row title (Label/M/SemiBold). */
+/** Figma `State`: one row, or several with a demarcator between each. */
+type ConfigurationCardState = 'single' | 'stacked';
+interface ConfigurationCardProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Figma `State`. Default `single`. */
+    state?: ConfigurationCardState;
+    /** The rows. In `stacked`, each child is one row and gets a demarcator above it (except the first). */
+    children?: React.ReactNode;
+}
+declare const ConfigurationCard: React.ForwardRefExoticComponent<ConfigurationCardProps & React.RefAttributes<HTMLDivElement>>;
+
+interface ConfigurationContainerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title' | 'children'> {
+    /** Section heading title (Body/L/SemiBold). */
     title: string;
-    /** Row description (Body/M/Regular). */
+    /** Section heading description (Body/M/Regular). */
     description?: string;
-    /** Trailing action — e.g. a `<Button>` ("Dispatch"). */
-    trailing?: React.ReactNode;
-}
-declare const ConfigurationCardRow: React.ForwardRefExoticComponent<ConfigurationCardRowProps & React.RefAttributes<HTMLDivElement>>;
-type ConfigurationCardVariant = 'toggle' | 'control';
-interface ConfigurationCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title' | 'onToggle'> {
     /**
-     * Which card shape:
-     * - `toggle` (default) — the standard settings card: a Toggle in the header
-     *   switches the setting on/off and reveals the body.
-     * - `control` — the same card **minus the switch**, for a setting that isn't
-     *   on/off (durations, a derived read-only value, a link out to another
-     *   module). Its body is always visible, and the header's trailing slot takes
-     *   whatever {@link ConfigurationCardProps.control} supplies — or nothing.
+     * The feature's switch — Figma `State=Enabled` (on: Content shown) /
+     * `State=Disabled` (off: Content hidden, only the heading and banner remain).
      */
-    variant?: ConfigurationCardVariant;
+    enabled: boolean;
+    /** Fired when the switch is flipped. */
+    onEnabledChange?: (enabled: boolean) => void;
     /**
-     * Header trailing content for the `control` variant — an inline input, a
-     * read-only value, or a link-out Button. Ignored by the `toggle` variant,
-     * whose trailing slot is the Toggle.
+     * **Locked** — the feature depends on another setting that is off. An instance
+     * override in Figma (Returns `2829:197695`): the container dims to 60% and its
+     * switch is disabled, while `enabled` and the Content stay as they are, so the
+     * saved value survives until the setting it depends on is switched back on.
+     * Explain why with a banner above the locked group.
      */
-    control?: React.ReactNode;
-    /** Section title (Label/M/SemiBold). */
-    title: string;
-    /** Section description (Body/M/Regular). */
-    description?: string;
-    /** Whether the section is enabled. Controls the header Toggle + body/footer visibility. */
-    enabled?: boolean;
-    /** Fires when the header Toggle is flipped. */
-    onToggle?: (enabled: boolean) => void;
+    locked?: boolean;
     /**
-     * Render the whole card as unavailable: the header Toggle goes to its disabled
-     * state and the card dims to 60% opacity.
-     *
-     * For a setting gated by a **master switch** elsewhere in the section — the
-     * dependency stays visible so the admin can see what they'd get, rather than
-     * the options appearing out of nowhere once the master is flipped on. Distinct
-     * from `enabled`, which is this card's own on/off; a disabled card keeps
-     * whatever `enabled` value it had, so turning the master back on restores it.
+     * The **Content** slot (`Content#11279:215`) — Configuration Cards (Single /
+     * Stacked) or item-entry cards, stacked 16px apart. Shown only while `enabled`;
+     * it stays mounted while hidden (values survive) and is `inert`.
      */
-    disabled?: boolean;
+    children?: React.ReactNode;
     /**
-     * Body content — typically one or more `<ConfigurationCardRow>`. Revealed when
-     * enabled and hidden (but kept mounted, so entered values survive) when not.
+     * The optional **Notification Banner** (`Show Notification Banner`) — a Subtle
+     * Info or Warning banner stating the consequence of the current state. Always
+     * the last part of the container, in either state.
      */
-    children?: React.ReactNode;
-    /** Show the footer region when enabled. Default true. */
-    showFooter?: boolean;
-    /** Validation / helper message shown in the footer's subtle Notification Banner. */
-    footerMessage?: string;
-    /** Notification Banner type for the footer message. Default "info". */
-    footerMessageType?: NotificationBannerType;
-    /** Secondary action label. */
-    cancelLabel?: string;
-    /** Secondary action handler. */
-    onCancel?: () => void;
-    /** Primary action label. */
-    submitLabel?: string;
-    /** Primary action handler. */
-    onSubmit?: () => void;
+    banner?: React.ReactNode;
+    /** Accessible name for the switch. Defaults to `title`. */
+    switchLabel?: string;
 }
-declare const ConfigurationCard: React.ForwardRefExoticComponent<ConfigurationCardProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * **Configuration Container** (`11279:54918`, Organisms) — a card that holds one
+ * configurable feature: a section heading with a switch that turns the feature on
+ * or off, and the settings that apply while it is on.
+ *
+ * **Anatomy (from the Library):** a `card-idle` card (fill and 80% stroke), radius
+ * 16, padding 20, gap 20, Neutral Drop Shadow 1 —
+ * 1. **Section heading** — `Content Primitives / Section Heading`, no visual
+ *    anchor; title, description and a trailing **switch** (the Toggle atom; the
+ *    Library's `Selection Control / Switch` carries no label, so the heading names it).
+ * 2. **Content** (slot) — shown only while Enabled.
+ * 3. **Notification banner** — optional, last.
+ *
+ * **Motion** (ruled 2026-10-16): switching on grows the container with the shared
+ * Accordion Behaviour height animation while each Content child fades in, settling
+ * from 8px up, in a 60ms stagger; switching off fades the children first (120ms),
+ * then collapses — content leaves before its container. CSS transitions, so a
+ * quick double-toggle retargets rather than restarting. Reduced motion: instant.
+ *
+ * **When to use:** Settings pages — one container per feature, stacked 24px apart.
+ * **When not to use:** read-only information (Content Card); a single setting with
+ * no on/off (a Configuration Card on its own).
+ */
+declare const ConfigurationContainer: React.ForwardRefExoticComponent<ConfigurationContainerProps & React.RefAttributes<HTMLDivElement>>;
 
 interface ContentCardProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
@@ -2509,10 +2589,13 @@ interface TooltipProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title
      */
     width?: number;
     /**
-     * `standard` only — **hug the content** up to this width, px, instead of a
-     * fixed width. Short copy ("Broadcasted (18).") gets a snug panel; longer copy
-     * wraps once it reaches the cap. Takes precedence over `width`. The group-filter
-     * tag tooltip uses 232 (Playground spec `2784:408287`, ruled 2026-10-09).
+     * **Hug the content** up to this width, px.
+     * - `standard`: instead of a fixed width. Short copy ("Broadcasted (18).") gets a
+     *   snug panel; longer copy wraps once it reaches the cap. Takes precedence over
+     *   `width`. The group-filter tag tooltip uses 232 (`2784:408287`, 2026-10-09).
+     * - `small`: lifts the default 163px text cap, so a state label stays on **one
+     *   line** as the Figma Small Tooltip draws it ("Sort: Trip Distance (Shortest
+     *   first)", "Delayed deliveries: 20" — `2884:463401`, 2026-10-17).
      */
     maxWidth?: number;
     step?: number;
@@ -2713,8 +2796,35 @@ interface TruncatedTextProps {
  * truncated address reveals itself, and only the line you hover.
  */
 declare function TruncatedText({ text, className, color, tipLabel, ariaLabel, variant, style, }: TruncatedTextProps): React.ReactElement;
+/**
+ * Head/tail abbreviation for a long identifier: first 8 characters, an ellipsis,
+ * then the last 5 — e.g. `07hxh-qq...gygaf`. Both ends carry signal in these ids
+ * (the head is what a dispatcher scans, the tail is what disambiguates a run of
+ * similar ones), which is why it isn't a plain head-truncation.
+ */
+declare function abbreviateId(id: string): string;
+interface TruncatedIdTextProps {
+    /** The full identifier (e.g. an Order ID). */
+    id: string;
+    /** Typography class, e.g. `text-label-m-semibold`. */
+    className?: string;
+    /** Text colour. */
+    color?: string;
+    /** Wrapper style — e.g. `{ maxWidth: 120 }` to cap where the id starts truncating. */
+    style?: React.CSSProperties;
+}
+/**
+ * An identifier that truncates with an ellipsis and, **only when it was cut
+ * off**, shows the dark Small tooltip with its {@link abbreviateId} form
+ * ("tgext-5t...4p1m7"). The table's Order ID cell uses it — on a wide monitor the
+ * full 29-character value is longer than the Small tooltip is designed to carry,
+ * and the head+tail is what identifies the order — and so does every other place
+ * an Order ID is clipped (the Add Orders card caps it at 120px, 2026-10-16), so
+ * the same id reads the same way everywhere. The accessible name is the whole id.
+ */
+declare function TruncatedIdText({ id, className, color, style }: TruncatedIdTextProps): React.ReactElement;
 
-type EmptyStateType = 'no-results' | 'no-reviews' | 'no-broadcast-logs' | 'image-upload' | 'file-upload' | 'no-suspensions' | 'no-items' | 'no-orders' | 'no-network' | 'new-update' | 'no-data' | 'no-trips' | 'no-drivers' | 'no-products' | 'error' | 'comments' | 'notifications' | 'calendar';
+type EmptyStateType = 'no-results' | 'no-reviews' | 'no-broadcast-logs' | 'image-upload' | 'file-upload' | 'no-suspensions' | 'no-items' | 'no-orders' | 'no-network' | 'new-update' | 'no-data' | 'no-trips' | 'no-drivers' | 'no-products' | 'error' | 'comments' | 'notifications' | 'calendar' | 'recording';
 type EmptyStateSize = 'mobile' | 'desktop';
 interface EmptyStateProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {
     /** Preset scenario — sets the illustration + default copy. Default `no-orders`. */
@@ -3161,6 +3271,12 @@ interface MobileSearchInputProps extends Omit<React.InputHTMLAttributes<HTMLInpu
 declare const MobileSearchInput: React.ForwardRefExoticComponent<MobileSearchInputProps & React.RefAttributes<HTMLInputElement>>;
 
 type MapSearchState = 'idle' | 'no-history' | 'active-history' | 'empty-results' | 'active-results';
+interface MapSearchResultGroup {
+    /** Group heading, e.g. "Orders" (Body/S/Medium). */
+    title: string;
+    /** The group's rows — `DesktopMenuOptions type="dropdown-advanced"`, 4px apart. */
+    children: React.ReactNode;
+}
 interface MapSearchInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> {
     /** Panel state. `idle` = field only; the rest attach a results panel. Default `active-results`. */
     state?: MapSearchState;
@@ -3170,41 +3286,54 @@ interface MapSearchInputProps extends Omit<React.InputHTMLAttributes<HTMLInputEl
     icon?: IconName;
     /** Notified when the clear (×) is clicked. Optional — the field clears itself. */
     onClear?: () => void;
+    /** Fired on Escape anywhere in the open card — the footer's "Esc to close". */
+    onClose?: () => void;
     /** `active-history` header title. Default "Recent Searches". */
     recentTitle?: string;
     /** `active-history` "Clear All" handler. */
     onClearHistory?: () => void;
-    /** Filter chip labels in the results Top Section. Default three "Filter"s. */
+    /** Filter chip labels in the `active-results` Top Section. Default three "Filter"s. */
     filters?: string[];
     /** Index of the active filter chip. Default 0. */
     activeFilter?: number;
-    /** Results count shown in the Top Section heading ("Results (N)"). Default 5. */
-    resultsCount?: number;
-    /** Empty-results copy below the no-results illustration. */
+    /** Fired with a chip's index when it is clicked. */
+    onFilterChange?: (index: number) => void;
+    /** `active-results`: the result groups, split by 1px demarcators. Ignored when `children` is passed. */
+    groups?: MapSearchResultGroup[];
+    /** `empty-results` heading. Default "No matching results". */
+    noResultsTitle?: string;
+    /** `empty-results` copy. Default "All results will be displayed here." */
     noResultsText?: string;
-    /** "No recent searches" copy. */
+    /** `no-history` heading. Default "Search Leta". */
+    noHistoryTitle?: string;
+    /** `no-history` copy. Default "Find orders, trips, recipients and drivers by ID, name or plate number." */
     noHistoryText?: string;
-    /** Menu-options list — defaults to a `<Placeholder>` standing in for Desktop Menu Options `1531:5056`. */
+    /**
+     * The keyboard-hint footer (Footer Frame `Search Overlay`). Default true. Its
+     * hints follow the state: Esc always; ↑↓ / ↵ once there are rows; Tab once
+     * there are filters to switch.
+     */
+    showFooter?: boolean;
+    /** Replaces the panel body (the recent-search list or the result groups). */
     children?: React.ReactNode;
     disabled?: boolean;
 }
 /**
- * Overlay search — the `Search Input` type of Data Entry `38:42`, **Overlay** variant
- * (renamed from "Web Map", 2026-10-06; the component keeps its name so imports don't
- * break). Use it when search is **overlaid on top of a screen**: map interfaces with
- * search, and the global search reachable from the Top Bar on any screen. Closed it is
- * a 350px field; open, a 480px card on `--surface-neutral-search-field` with the
- * results attached.
- * The `state` prop drives the panel (Figma states):
+ * Overlay search — the `Search Input` type of Data Entry `38:42`, **Overlay** variant.
+ * Use it when search is **overlaid on top of a screen**: the global search reachable
+ * from the Top Bar on any screen, and map interfaces with search. Closed it is a
+ * 350px field; open, a 620px card (2026-10-21; was 480) with the field on
+ * `--surface-neutral-search-field`, a body, and a keyboard-hint footer.
+ * The `state` prop drives the body (Figma states):
  * - `idle` — field only.
- * - `no-history` — "No recent searches" helper.
- * - `active-history` — "Recent Searches" header + Clear All + a recent-search list.
- * - `empty-results` — filter chips + "Results (0)" + a no-results `<EmptyState>`.
- * - `active-results` — filter chips + "Results (N)" + a results list.
- * The list slots default to `DesktopMenuOptions` rows; pass your own via `children`.
- *
- * The field shows a trailing clear (×) — always while the panel is open, and as soon
- * as the closed (idle) field has text. Clicking it clears the field and fires `onClear`.
+ * - `no-history` — a centred "Search Leta" prompt naming what can be searched.
+ * - `active-history` — "Recent Searches" + Clear All over the recent-search rows.
+ * - `empty-results` — a text-only Empty State ("No matching results").
+ * - `active-results` — filter chips under the field; grouped result rows that scroll.
+ *
+ * The footer advertises the keys a consumer is expected to support; the component
+ * handles **Esc** itself (`onClose`). Arrow-key row selection, Tab between filters
+ * and Enter to open belong to the consumer, which owns the rows.
  */
 declare const MapSearchInput: React.ForwardRefExoticComponent<MapSearchInputProps & React.RefAttributes<HTMLInputElement>>;
 
@@ -3283,7 +3412,7 @@ interface FileUploadCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>,
 /**
  * A single row of the File Upload queue — the "File Upload Cards" sub-instance of
  * Data Entry `38:42` (`Property 1 = Uploading | Uploaded`). A `--surface-neutral-
- * bg-muted` card with a leading status glyph, filename + size, a trailing Ghost
+ * bg-subtle` card with a leading status glyph, filename + size, a trailing Ghost
  * Icon-Only remove button, and (when uploading) a `DesktopProgressIndicator`.
  */
 declare const FileUploadCard: React.ForwardRefExoticComponent<FileUploadCardProps & React.RefAttributes<HTMLDivElement>>;
@@ -3342,7 +3471,7 @@ declare const Placeholder: React.ForwardRefExoticComponent<PlaceholderProps & Re
  * - `combobox` — a selectable option in a single-select list. The chosen option
  *   gets a light highlight and a trailing checkmark.
  * - `dropdown-basic` — a standard menu command. Can show a trailing chevron (to
- *   open a submenu), a keyboard shortcut, or a small badge.
+ *   open a submenu), a keyboard shortcut, a small badge or a Plain button.
  * - `dropdown-advanced` — a richer two-line item (title + description) for results
  *   or entities that need extra detail.
  * - `dropdown-destructive` — a dangerous command such as Delete, shown in red.
@@ -3384,15 +3513,21 @@ interface DesktopMenuOptionsProps extends Omit<React.HTMLAttributes<HTMLDivEleme
     leadingIcon?: IconName;
     /** Show the leading icon. */
     showLeadingIcon?: boolean;
-    /** dropdown-basic: trailing keyboard shortcut keys. */
-    shortcut?: string[];
+    /** dropdown-basic: trailing keyboard shortcut keys (text or glyph keycaps). */
+    shortcut?: ShortcutKey[];
+    /**
+     * dropdown-basic: a trailing **Plain button** (Medium, no icon), e.g. "Edit" —
+     * the Figma row's hidden `Desktop Button` (2026-10-21). Sits after the badge,
+     * before the chevron. Stop the click propagating if the row is also selectable.
+     */
+    trailingAction?: React.ReactNode;
     /** Trailing badge (dropdown-basic / sidebar / side-tab). */
     badge?: React.ReactNode;
     /**
      * Show the trailing chevron (dropdown-basic / dropdown-advanced → right;
-     * sidebar-main / side-tab → down). Default per type — `dropdown-advanced`
-     * defaults to `true`, so pass `false` for a row whose trailing content Figma
-     * switches off.
+     * sidebar-main / side-tab → down). Default per type — `dropdown-basic` shows
+     * it; `dropdown-advanced` does not (its Figma Trailing Content is empty by
+     * default since 2026-10-21), so pass `true` for a row that opens something further.
      */
     showChevron?: boolean;
     /** dropdown-advanced: subtext beneath the title. */
@@ -3561,6 +3696,8 @@ interface DesktopDropdownsProps extends Omit<React.HTMLAttributes<HTMLDivElement
      * selections across opens).
      */
     initialGroupSelections?: string[][];
+    /** Which rail dimension shows first (`filter-group`) — a Selected Filter Control chip opens its own. Default 0. */
+    initialGroupIndex?: number;
     /**
      * Fires with the full current per-group selection (index-aligned with
      * `groups`) whenever any checkbox toggles. These are a live/draft preview —
@@ -3570,7 +3707,12 @@ interface DesktopDropdownsProps extends Omit<React.HTMLAttributes<HTMLDivElement
     onGroupSelectionChange?: (selected: string[][]) => void;
     /** "Show Results" clicked (`filter-group`) — the host should commit the last selection reported via `onGroupSelectionChange` and typically close the panel. */
     onApply?: () => void;
-    /** "Reset" clicked (`filter-group`) — clears every dimension's selection (both here and on the host's applied filter). */
+    /**
+     * "Clear all" clicked (`filter-group`) — clears the selection in **every**
+     * dimension, not just the one in view. Like any change in the panel it is a
+     * draft: nothing applies until Show Results (Doc 3 §9.1), so the host should
+     * clear its draft here, not its applied filter.
+     */
     onReset?: () => void;
     /** Disable "Show Results" (`filter-group`) — e.g. the host's live preview count is 0. */
     showResultsDisabled?: boolean;
@@ -3598,16 +3740,12 @@ interface DesktopDropdownsProps extends Omit<React.HTMLAttributes<HTMLDivElement
     /** User Menu avatar photo URL. When set, shown in place of the monogram. */
     userAvatarSrc?: string;
     /**
-     * Sort fields + per-field direction labels (Figma `1050:209224`). The selected
-     * field's `ascLabel`/`descLabel` drive the two direction rows — e.g. a date field
-     * reads "Oldest to Newest / Newest to Oldest" while a numeric field reads
-     * "Low to High / High to Low". Defaults to Created / Duration / Last Updated.
+     * Sort fields + per-field direction phrases (Figma `1050:209224`; Doc 3 §9.4).
+     * The selected field's `ascLabel`/`descLabel` are the two direction rows — a date
+     * reads "Newest first / Oldest first", a distance "Nearest first / Farthest
+     * first". Defaults to the Deliveries fields ({@link DEFAULT_SORT_OPTIONS}).
      */
-    sortOptions?: Array<{
-        label: string;
-        ascLabel?: string;
-        descLabel?: string;
-    }>;
+    sortOptions?: SortOption[];
     /**
      * Initially-selected sort field index (`sort` variant). Default 0.
      *
@@ -3630,6 +3768,25 @@ interface DesktopDropdownsProps extends Omit<React.HTMLAttributes<HTMLDivElement
     /** Override the panel body entirely. */
     children?: React.ReactNode;
 }
+/**
+ * A sort field and its **direction phrases** (Doc 3 §9.4): a "{X} first" pair
+ * chosen by what the field measures — never "Low to High", "Ascending" or arrows.
+ * The menu lists the pair in the table's order, so `descFirst` puts the
+ * descending phrase on top (dates: "Newest first" before "Oldest first").
+ */
+interface SortOption {
+    label: string;
+    /** The ascending phrase — "Oldest first", "Nearest first", "Lowest first". */
+    ascLabel: string;
+    /** The descending phrase — "Newest first", "Farthest first", "Highest first". */
+    descLabel: string;
+    /** List the descending phrase first (Doc 3 §9.4's pair order). */
+    descFirst?: boolean;
+}
+/** The Deliveries table's sort fields (Figma `1050:209224`) with their Doc 3 §9.4 phrases. */
+declare const DEFAULT_SORT_OPTIONS: SortOption[];
+/** "Sort: {Field} ({Direction phrase})" — the labelled sort button and the icon-only sort tooltip (Doc 3 §9.3). */
+declare function sortLabelFor(option: SortOption | undefined, direction: 'asc' | 'desc'): string;
 /**
  * Desktop Dropdowns — a ready-made floating panel that appears when you open a
  * menu, select, filter, or picker. It's the white rounded card with a soft shadow
@@ -4383,77 +4540,162 @@ declare const LAST_UPDATED_COLUMN: TableColumn;
  */
 declare const CREATED_BY_COLUMN: TableColumn;
 
-interface BulkActionsToolbarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
+/** Where the toolbar sits. `page` is fixed to the viewport; the `contained-*`
+ * placements are absolute inside a positioned surface (modal, expanded map). */
+type FloatingToolbarPlacement = 'page' | 'contained-top' | 'contained-bottom';
+interface FloatingToolbarCommonProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
+    /**
+     * Controls presence with the enter/exit motion (opacity + an 8px rise,
+     * instant under reduced motion). The toolbar stays mounted through its exit and
+     * renders nothing once it has left. Omit to manage mounting yourself.
+     */
+    open?: boolean;
+    /**
+     * Apply the real placement (Figma descriptions):
+     * - Actions on a page — fixed, centred, 80px above the viewport's bottom edge;
+     * - Context on a page — fixed, centred, 24px above the bottom edge;
+     * - `contained-top` / `contained-bottom` — absolute, centred, 16px from that edge
+     *   of the nearest positioned ancestor.
+     * Omit to place it yourself.
+     */
+    placement?: FloatingToolbarPlacement;
+}
+interface FloatingToolbarActionsProps extends FloatingToolbarCommonProps {
+    /** Actions Toolbar (`7973:17061`) — batch actions for selected table rows. */
+    variant?: 'actions';
     /** Leading selection-count label. Default "10 selected". */
     selectionLabel?: string;
-    /** Fired when the selection button is clicked (typically clears the selection). */
+    /** Fired when the selection control is clicked (opens selection-scope options). */
     onSelectionClick?: () => void;
     /**
-     * Structured weight/volume metadata shown between the selection and actions.
-     * Each item renders its `value` in SemiBold and `unit` in Regular, separated
-     * by a Regular " · ". Omit for the common case (no summary). Used only for
-     * weight/size metadata — never for displaying a selection count.
+     * Totals for the selection, value then unit ("800 kg · 980 cases"). Values
+     * render SemiBold, units Regular. Never a selection count.
      */
     summaryItems?: Array<{
         value: string;
         unit: string;
     }>;
     /**
-     * The action buttons (Center group). Default = two Ghost "Action" + one
-     * Ghost-Error "Action" (all leading ↗). Pass your own row-level action Buttons.
-     *
-     * **Use outlined icons by default.** When composing actions, pass `iconOutlined`
-     * to each `Button` so its glyph renders as the outlined library variant (the
-     * filled variant is only a fallback when no outline exists, e.g. `Proceed`).
-     * This keeps the toolbar visually correct across every screen it is dropped into.
+     * The action buttons. Ghost leading-icon buttons with `iconOutlined`; Ghost
+     * Error for destructive actions, placed last. Default = two Ghost "Action" + one
+     * Ghost Error "Action".
      */
     actions?: React.ReactNode;
     /** Show the overflow "More" (⋯) button after the actions. Default true. */
     showOverflow?: boolean;
-    /** Fired when the overflow (More) button is clicked. */
     onOverflowClick?: () => void;
-    /** Fired when the close (✕) button is clicked. */
+    /** The dismiss ✕ — clears the selection. */
     onClose?: () => void;
+}
+interface FloatingToolbarContextProps extends FloatingToolbarCommonProps {
+    /** Context Toolbar (`11285:55268`) — a short, task-relevant message with up to two actions. */
+    variant: 'context';
+    /** The message — concise, direct, specific to the current context. Required. */
+    message: React.ReactNode;
+    /** Optional leading icon (18px, `Icons/secondary/default`). Default `Info`; `null` hides it. */
+    leadingIcon?: IconName | null;
+    /** Draw the leading icon's outlined glyph. Default false (Figma swaps filled glyphs). */
+    leadingIconOutlined?: boolean;
     /**
-     * Apply the real placement — `position: fixed`, centered, 80px from the
-     * viewport bottom (per the Figma annotation). Default false (consumer owns
-     * placement, like Toast).
+     * The primary action — a Primary / Small button (a split button works too).
+     * The divider shows only when there is an action or a dismiss.
      */
-    fixed?: boolean;
+    action?: React.ReactNode;
+    /** Label for the optional dismiss action (Plain / Small, no underline). Default "Close". */
+    dismissLabel?: string;
+    /** Shows the dismiss action and fires when it is pressed. */
+    onDismiss?: () => void;
+}
+type FloatingToolbarProps = FloatingToolbarActionsProps | FloatingToolbarContextProps;
+/**
+ * **Floating Toolbar** (`11285:55267`) — a compact toolbar that floats above the
+ * page in the **inverse theme**: the Dark Theme on a light page, the Light Theme
+ * on a dark one, so it stands out on a busy surface. Everything inside follows the
+ * toolbar's theme, not the page's.
+ *
+ * - **`variant="actions"`** — the Actions Toolbar: appears when table rows are
+ *   selected and offers the actions that apply to the whole selection ("10
+ *   selected ⌄" · summary | actions + More | ✕). Hugs its content up to 800px.
+ *   Replaces `BulkActionsToolbar` (removed in 0.5.0).
+ * - **`variant="context"`** — the Context Toolbar: a brief, task-relevant message
+ *   with up to two actions (an optional dismiss + a primary action). Max 512px,
+ *   fills narrower surfaces. On a page it sits 24px above the viewport's bottom;
+ *   in a modal or other contained surface, 16px from its top or bottom.
+ *
+ * **How the inverse theme is drawn.** The shadow belongs to the page it falls on,
+ * so an outer layer casts `--shadow-neutral-2` in the *surrounding* theme, and an
+ * inner layer carries `data-theme` (the inverse) with the surface, border and
+ * content. Tooltips portal to `<body>` and so read the page's theme.
+ *
+ * **When to use:** batch actions on selected rows (actions); a status, guidance or
+ * a next step that mustn't interrupt the task (context) — e.g. "You have unsaved
+ * changes." on Settings, or an order's state on its expanded map.
+ * **When not to use:** a long explanation or several actions (Notification Banner);
+ * transient confirmation of something that just happened (Toast); a single row's
+ * actions (the row's Actions cell).
+ */
+declare const FloatingToolbar: React.ForwardRefExoticComponent<FloatingToolbarProps & React.RefAttributes<HTMLDivElement>>;
+
+/** One filter narrowing the table, as a chip. */
+interface SelectedFilterChip {
+    /** Stable key — the dimension ("Depot") or "sla". */
+    id: string;
+    /** "Driver: Michael Muriuki" · "Depot: Arc Kitisuru, +2" · "Delayed". */
+    label: string;
+    /** The dimension's icon (Depot `Depot`, Recipient `User`, Driver `Motorcycle`, Created By `Open-Box`), or the SLA icon. */
+    icon?: IconName;
+    /** Leading icon colour — the SLA chip draws its icon in its SLA colour. */
+    iconColor?: string;
+    /** Clicking the label opens this dimension's filter. Omit for a chip with nothing to open (the SLA chip). */
+    onOpen?: () => void;
+    /** The ✕ — removes this filter entirely. */
+    onRemove: () => void;
+    /** The ✕'s screen-reader label — "Remove Driver filter". */
+    removeLabel: string;
+}
+interface SelectedFilterControlProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
+    /** The chips, in display order: the SLA chip first, then attribute filters in the filter rail's order. */
+    chips: SelectedFilterChip[];
+    /** Clear Filters — removes every filter the row covers (set-aside ones included). Never touches date, search, statuses or sort. */
+    onClearAll: () => void;
 }
 /**
- * Bulk Actions Toolbar — the floating action bar that appears when rows are
- * selected in a table. A centered white pill grouping the selection control (+
- * optional summary), the available bulk actions (with a "More" overflow), and a
- * close control, separated by vertical dividers. Per the design it is fixed to
- * the viewport 80px from the bottom, centered, capped at 800px, in a single
- * non-wrapping row — pass `fixed` to apply that placement, or place it yourself.
- *
- * The selection control is a Ghost button with a **trailing `Chevron-Down`**
- * ("10 selected ⌄") — a dropdown affordance for selection-scope options — not a
- * leading checkbox.
- *
- * **Icon convention — outlined by default.** Every icon-bearing Button in this
- * toolbar (the default actions, and any `actions` you supply) should pass
- * `iconOutlined` so glyphs render as the outlined library variant; the filled
- * variant is only a fallback for glyphs with no outline (e.g. `Proceed`, `More`,
- * `Cancel`). This guarantees the toolbar renders correctly on every screen.
- *
- * **When to use:** acting on a multi-row selection in a `Table`.
- * **When not to use:** a single row's actions (the row's `actions` cell); page-level
- * primary actions (Table Data Control CTAs); transient feedback (Toast).
+ * **Selected Filter Control** — Library Table Data Control › `Type=Selected Filter
+ * Control` (`11262:51088`); Doc 3 §9.2.
+ *
+ * A one-line row between a table's group buttons and the table: a chip per filter
+ * narrowing the table, and **Clear Filters** pinned right. (The leading "Filtered
+ * by:" label was removed from the Library on 2026-10-18 — the chips start the row;
+ * assistive tech still hears the group as "Applied filters".) It
+ * shows only what has no other home — attribute filters and the SLA shortcut; the
+ * status selection, date, search and sort each show their own state.
+ *
+ * - **No chips → renders nothing** (it takes no space).
+ * - **One line.** Overflowing chips scroll sideways; the edge they disappear under
+ *   fades (Scroll Edges, via `useScrollEdges`), and Clear Filters never scrolls.
+ * - **A chip's label opens its dimension** (`onOpen`); its **✕ removes** it, with
+ *   its own screen-reader label.
+ *
+ * Layout per the Library: row height 28, the leading group fills, a 64px gap to the
+ * trailing Plain / Medium / leading-✕ "Clear Filters" button. Tables only — modals
+ * keep their own pill row and show state on their icon buttons (Doc 3 §9.3).
  */
-declare const BulkActionsToolbar: React.ForwardRefExoticComponent<BulkActionsToolbarProps & React.RefAttributes<HTMLDivElement>>;
+declare const SelectedFilterControl: React.ForwardRefExoticComponent<SelectedFilterControlProps & React.RefAttributes<HTMLDivElement>>;
 
 /**
- * - `search-create` — search + filter buttons (Created / Filter / Sort By) on the
- *   left, primary CTAs (Add Order / Import-Export) on the right.
- * - `search-column` — the same search + filters, with a data count + an
- *   Auto-refresh switch + Columns control on the right.
+ * The Library's six `Type`s (`7575:36637`, 2026-10-15):
+ * - `search-create` — search, the Created pill, an icon-only Filter and a
+ *   **labelled Sort** on the left; Create Order / Import-Export on the right.
+ * - `search-column` — the same left side, with a data count + an Auto-refresh
+ *   switch + Columns control on the right.
  * - `filters-column` — a Top Filter Section on the left, data count +
  *   Auto-refresh switch + Columns on the right.
+ * - `selected-filters` — the Selected Filter Control row (Doc 3 §9.2).
+ * - `search-compact` — Search + Column Control (Compact-Default / Compact-Active):
+ *   for modals and drawers, never tables. Search fills; Filter and Sort stay
+ *   icon-only and carry their state as a count badge and a dot (Doc 3 §9.3).
  */
-type TableDataControlVariant = 'search-create' | 'search-column' | 'filters-column';
+type TableDataControlVariant = 'search-create' | 'search-column' | 'filters-column' | 'selected-filters' | 'search-compact';
 interface TableDataControlProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
     /** Which toolbar layout to render. Default `search-create`. */
     variant?: TableDataControlVariant;
@@ -4469,22 +4711,36 @@ interface TableDataControlProps extends Omit<React.HTMLAttributes<HTMLDivElement
      */
     showColumnControl?: boolean;
     /**
-     * Number of active filter rules currently applied. When > 0, a Coral Red (Alt)
-     * count badge is overlaid at the top-right corner of the Filter icon button.
-     * Filter and Sort are always icon-only buttons in both base and active states.
-     * Mirrors the Figma `search-create` / `search-column` variants and their
-     * "Active Filter" counterparts (Figma nodes `10697:60514` / `10697:60683`).
-     * Default 0 (no active filters).
+     * **`search-compact` only:** the total number of selected filter values across
+     * every dimension (two depots + one recipient = 3) — drawn as the Filter button's
+     * Coral Red (Alt) count badge and named in its label ("Filter, 3 applied").
+     * Doc 3 §9.3. The table variants **never** badge (the Library removed the Active
+     * variants, 2026-10-15): a table shows its filters in the Selected Filter Control.
      */
     filterCount?: number;
+    /**
+     * The current sort in Doc 3 §9.3's syntax — "Sort: Created (Newest first)".
+     * Table variants render it as the **labelled** Sort button (leading Sort icon);
+     * `search-compact` uses it as the icon-only Sort button's tooltip.
+     * Default "Sort: Created (Newest first)" on the table variants, "Sort" compact.
+     */
+    sortLabel?: string;
+    /** `search-compact`: the sort isn't the surface's default — draws the Sort button's dot. */
+    sortChanged?: boolean;
+    /** `search-compact`: show the Filter button (a modal with no filter hides it). Default true. */
+    showFilter?: boolean;
+    /** `selected-filters`: the chips (Doc 3 §9.2). With none, the row renders nothing. */
+    selectedFilters?: SelectedFilterChip[];
+    /** `selected-filters`: Clear Filters. */
+    onClearFilters?: () => void;
     /** Left section for the search variants — overrides the default search + filter buttons. */
     searchSection?: React.ReactNode;
     /** Left section for `filters-column` — overrides the default Top Filter Section. */
     filters?: React.ReactNode;
-    /** Right section for `search-create` — overrides the default Add Order + Import/Export. */
+    /** Right section for `search-create` — overrides the default Create Order + Import/Export. */
     ctas?: React.ReactNode;
     /**
-     * Show the Primary "Add Order" button in the default `search-create` CTAs.
+     * Show the Primary "Create Order" button (labelled "Add Order" before 2026-10-14) in the default `search-create` CTAs.
      * Default true; set `false` for the Empty State toolbar, where the primary
      * Add Order CTA lives beside the illustration instead (per Figma
      * `4368:154614`). Ignored when `ctas` is overridden.
@@ -4503,8 +4759,9 @@ interface TableDataControlProps extends Omit<React.HTMLAttributes<HTMLDivElement
     /** Label for the Created date-filter button. Default "Created: Today". */
     createdLabel?: string;
     onCreatedClick?: () => void;
-    onFilterClick?: () => void;
-    onSortClick?: () => void;
+    /** Receives the click so a host can anchor its dropdown on the button. */
+    onFilterClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    onSortClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
     onAddOrderClick?: () => void;
     onImportExportClick?: () => void;
     onColumnsClick?: () => void;
@@ -4559,7 +4816,7 @@ interface TableContainerProps extends Omit<React.HTMLAttributes<HTMLDivElement>,
      * **Centred automatically** (see `empty`) — pass the bare Empty State.
      */
     noResults?: React.ReactNode;
-    /** Fired by the default Empty State's Add Order CTA. */
+    /** Fired by the default Empty State's Create Order CTA (labelled "Add Order" before 2026-10-14). */
     onAddOrder?: () => void;
     /**
      * Fill the available height of a flex-column parent (`flex: 1`): the table
@@ -4816,17 +5073,20 @@ interface AlertDialogProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 't
     /**
      * Footer leading slot — content pinned far left, opposite the actions.
      *
-     * Its one use so far is a **"Don't show this again" checkbox** (Figma
-     * `1892:370929`, Change Driver): an opt-out belongs beside the actions it
-     * silences, but it is not itself an action, so it sits apart rather than joining
-     * the Close / Confirm pair. Switches the footer to `tertiary-action`, which is
-     * the variant that has a leading region.
+     * Content pinned far left, opposite the Close / Confirm pair, for something
+     * that isn't itself an action (e.g. an opt-out checkbox). Switches the footer to
+     * `tertiary-action`, which is the variant that has a leading region.
      */
     footerLeading?: React.ReactNode;
     /** Cancel/dismiss action label. Default "Close". */
     cancelLabel?: string;
     /** Confirm action label. Default "Confirm". */
     confirmLabel?: string;
+    /**
+     * Leading icon on the confirm button, e.g. `Check` for Change Driver
+     * (Figma `1892:370929`: Primary / Leading Icon). Default none.
+     */
+    confirmIconLeft?: IconName;
     /**
      * Style the confirm button as destructive (`Button variant="destructive"`,
      * red) instead of the default primary. Doc 3 §5: "primary styled to the
@@ -5032,6 +5292,22 @@ interface ScrollEdges {
  */
 declare function useScrollEdges(containerRef: React.RefObject<HTMLElement | null>): ScrollEdges;
 
+type SurroundingTheme = 'light' | 'dark';
+/**
+ * The theme an element sits in — the nearest `data-theme` above it, falling back
+ * to `<html>` and then to light. Re-reads whenever any `data-theme` attribute in
+ * the document changes, so a theme switch (or a Storybook decorator flipping its
+ * container) reaches components that are already mounted.
+ *
+ * Exists for **inverse surfaces** (Floating Toolbar, 2026-10-18): a surface that
+ * must stand out against the page renders the *other* theme — Dark Theme on a
+ * light page, Light Theme on a dark one. It reads the surroundings from its own
+ * parent, never from itself, so its own `data-theme` can't feed back into it.
+ */
+declare function useSurroundingTheme(ref: React.RefObject<HTMLElement | null>): SurroundingTheme;
+/** The opposite theme — what an inverse surface renders. */
+declare function inverseTheme(theme: SurroundingTheme): SurroundingTheme;
+
 /**
  * Arrow-key navigation for a menu, applied to the container that holds its rows.
  *
@@ -5170,4 +5446,4 @@ interface ExtraLargeModalProps extends Omit<React.HTMLAttributes<HTMLDivElement>
  */
 declare const ExtraLargeModal: React.ForwardRefExoticComponent<ExtraLargeModalProps & React.RefAttributes<HTMLDivElement>>;
 
-export { ALL_ORDER_COLUMNS, AVATAR_PHOTOS, AccordionChevron, AccordionContent, AccordionHeader, type AccordionHeaderProps, AlertDialog, type AlertDialogProps, type AlertDialogVariant, Avatar, type AvatarProps, type AvatarSize, type AvatarTone, BROADCASTED_ORDER_COLUMNS, Badge, type BadgeColor, type BadgeProps, type BreadcrumbCrumb, Breadcrumbs, type BreadcrumbsProps, type BreadcrumbsType, BulkActionsToolbar, type BulkActionsToolbarProps, Button, type ButtonPlatform, type ButtonProps, type ButtonSize, type ButtonVariant, CANCELLED_ORDER_COLUMNS, CARET_SIDE, CREATED_BY_COLUMN, Calendar, type CalendarProps, type CaretAlign, type CaretSide, CarouselPagination, type CarouselPaginationProps, Cell, type CellProps, type CellState, type CellType, Checkbox, type CheckboxProps, Chip, type ChipProps, CollapsedSidebarLogo, type CollapsedSidebarLogoProps, ConfigurationCard, type ConfigurationCardProps, ConfigurationCardRow, type ConfigurationCardRowProps, type ConfigurationCardVariant, ContentCard, type ContentCardProps, ContentPrimitives, type ContentPrimitivesProps, type ContentPrimitivesType, DIALOG_OVERLAY_DEFAULT_TIER, DOORSTEP_DELIVERY_IMAGE, type DataRowCell, DataRows, type DataRowsProps, type DataRowsState, type DataRowsVariant, DateTimePicker, type DateTimePickerProps, type DateTimePickerType, type DesktopDropdownVariant, DesktopDropdowns, type DesktopDropdownsProps, type DesktopMenuOptionState, type DesktopMenuOptionType, DesktopMenuOptions, type DesktopMenuOptionsProps, DesktopMetricCard, type DesktopMetricCardProps, DesktopProgressIndicator, type DesktopProgressIndicatorProps, type DesktopProgressIndicatorVariant, DesktopSegmentControl, type DesktopSegmentControlItem, type DesktopSegmentControlProps, type DesktopSegmentControlVariant, DialogOverlay, type DialogOverlayHelpers, type DialogOverlayProps, DurationLabel, type DurationLabelProps, type DurationLabelStatus, type DurationLabelVariant, EmptyState, type EmptyStateProps, type EmptyStateSize, type EmptyStateType, ExtraLargeModal, type ExtraLargeModalProps, FeaturedIcon, type FeaturedIconColor, type FeaturedIconProps, type FeaturedIconSize, FileUpload, FileUploadCard, type FileUploadCardProps, type FileUploadCardStatus, type FileUploadProps, type FilterGroupDimension, Flag, type FlagProps, FooterFrame, type FooterFrameProps, type FooterFrameVariant, FormDemarcator, GroupedInput, type GroupedInputProps, type GroupedInputVariant, HoverTip, type HoverTipProps, InputField, type InputFieldProps, type InputFieldVariant, InputGroup, type InputGroupProps, InputSection, type InputSectionProps, LAST_UPDATED_COLUMN, LargeModal, type LargeModalProps, type LargeModalVariant, LeadingInputFieldElement, type LeadingInputFieldElementProps, type LeadingInputFieldElementVariant, LetaLogo, type LetaLogoProps, ListGroup, type ListGroupProps, type ListItemData, ListSection, type ListSectionProps, LoadingOverlay, type LoadingOverlayProps, MAP_ROUTE_DRIVEN, MAP_ROUTE_PLANNED, MapIcon, type MapIconProps, type MapIconVariant, MapLegend, type MapLegendEntry, type MapLegendProps, MapSearchInput, type MapSearchInputProps, MapView, type MapViewProps, MapZoomControl, type MapZoomControlProps, MenuDivider, MenuFlyout, type MenuFlyoutProps, MenuPanel, type MenuPanelProps, type MetricCardState, type MetricVariance, MobileBadge, type MobileBadgeColor, type MobileBadgeProps, type MobileBadgeVariant, MobileChip, type MobileChipProps, MobileDropdown, type MobileDropdownOption, type MobileDropdownProps, MobileFeaturedIcon, type MobileFeaturedIconColor, type MobileFeaturedIconProps, type MobileFeaturedIconSize, type MobileFeaturedIconVariant, MobileFileUpload, type MobileFileUploadImage, type MobileFileUploadProps, MobileMapSearchInput, type MobileMapSearchInputProps, type MobileMenuOptionState, type MobileMenuOptionType, MobileMenuOptions, type MobileMenuOptionsProps, MobileNavTab, type MobileNavTabProps, MobileSearchInput, type MobileSearchInputProps, MobileSegment, type MobileSegmentProps, ModalDialog, type ModalDialogProps, type ModalDialogVariant, ModalHeaders, type ModalHeadersProps, type ModalHeadersVariant, ModalShell, type ModalShellProps, NotificationBanner, type NotificationBannerProps, type NotificationBannerType, type NotificationBannerVariant, ORDER_TABLE_COLUMNS, ORDER_TABLE_COLUMNS_FINISHED, OptionCard, type OptionCardProps, type OptionCardState, Page, type PageProps, PageTab, type PageTabProps, PageTabsControl, type PageTabsControlItem, type PageTabsControlProps, type PageTabsControlVariant, type PageVariant, Pagination, type PaginationProps, type PaginationVariant, Placeholder, type PlaceholderProps, Popover, type PopoverPlacement, type PopoverProps, ProgressTracker, type ProgressTrackerProps, RadioButton, type RadioButtonProps, SCHEDULED_ORDER_COLUMNS, SIGNATURE_IMAGE, type ScrollEdges, SearchInput, type SearchInputProps, SegmentSwitcherTab, type SegmentSwitcherTabProps, Select, type SelectProps, SelectionControl, type SelectionControlProps, type SelectionControlVariant, Shortcut, type ShortcutProps, SideBar, type SideBarGroup, type SideBarItem, type SideBarProps, type SideBarVariant, Sidetab, type SidetabItem, type SidetabProps, Skeleton, type SkeletonProps, StackedCards, type StackedCardsProps, Stepper, StepperInput, type StepperInputProps, type StepperProps, type StepperVariant, Table, type TableColumn, type TableColumnRole, TableContainer, type TableContainerProps, type TableContainerVariant, TableDataControl, type TableDataControlProps, type TableDataControlVariant, type TableProps, type TableRow, TableSection, type TableSectionProps, Tag, type TagProps, TextArea, type TextAreaBasicProps, type TextAreaProps, type TextAreaRichProps, type TextAreaVariant, Title, type TitleProps, type TitleVariant, Toast, type ToastProps, type ToastType, Toggle, ToggleButton, type ToggleButtonProps, type ToggleProps, Tooltip, type TooltipPlatform, type TooltipPosition, type TooltipPositionInput, type TooltipProps, type TooltipRect, type TooltipSide, type TooltipVariant, TopBar, type TopBarProps, type TopBarVariant, TopFilter, type TopFilterProps, TopFilterSection, type TopFilterSectionItem, type TopFilterSectionProps, TrailingInputFieldElement, type TrailingInputFieldElementProps, type TrailingInputFieldElementVariant, TruncatedText, type TruncatedTextProps, UNASSIGNED_ORDER_COLUMNS, UserMenu, type UserMenuProps, type UserMenuState, ViewSwitcherTab, type ViewSwitcherTabProps, WizardTab, type WizardTabProps, animateScrollTop, computeTooltipPosition, downloadFile, htmlToPlainText, sanitizeRichText, useAccordion, useEscapeLayer, useRovingFocus, useScrollEdges, useScrollShadow };
+export { ALL_ORDER_COLUMNS, AVATAR_PHOTOS, AccordionChevron, AccordionContent, AccordionHeader, type AccordionHeaderProps, AlertDialog, type AlertDialogProps, type AlertDialogVariant, Avatar, type AvatarProps, type AvatarSize, type AvatarTone, BROADCASTED_ORDER_COLUMNS, Badge, type BadgeColor, type BadgeProps, type BreadcrumbCrumb, Breadcrumbs, type BreadcrumbsProps, type BreadcrumbsType, Button, type ButtonPlatform, type ButtonProps, type ButtonSize, type ButtonVariant, CANCELLED_ORDER_COLUMNS, CARET_SIDE, CREATED_BY_COLUMN, Calendar, type CalendarProps, type CaretAlign, type CaretSide, CarouselPagination, type CarouselPaginationProps, Cell, type CellProps, type CellState, type CellType, Checkbox, type CheckboxProps, Chip, type ChipProps, CollapsedSidebarLogo, type CollapsedSidebarLogoProps, ConfigurationCard, type ConfigurationCardProps, type ConfigurationCardState, ConfigurationContainer, type ConfigurationContainerProps, ContentCard, type ContentCardProps, ContentPrimitives, type ContentPrimitivesProps, type ContentPrimitivesType, DEFAULT_SORT_OPTIONS, DIALOG_OVERLAY_DEFAULT_TIER, DOORSTEP_DELIVERY_IMAGE, type DataRowCell, DataRows, type DataRowsProps, type DataRowsState, type DataRowsVariant, DateTimePicker, type DateTimePickerProps, type DateTimePickerType, type DesktopDropdownVariant, DesktopDropdowns, type DesktopDropdownsProps, type DesktopMenuOptionState, type DesktopMenuOptionType, DesktopMenuOptions, type DesktopMenuOptionsProps, DesktopMetricCard, type DesktopMetricCardProps, DesktopProgressIndicator, type DesktopProgressIndicatorProps, type DesktopProgressIndicatorVariant, DesktopSegmentControl, type DesktopSegmentControlItem, type DesktopSegmentControlProps, type DesktopSegmentControlVariant, DialogOverlay, type DialogOverlayHelpers, type DialogOverlayProps, DurationLabel, type DurationLabelProps, type DurationLabelStatus, type DurationLabelVariant, EmptyState, type EmptyStateProps, type EmptyStateSize, type EmptyStateType, ExtraLargeModal, type ExtraLargeModalProps, FeaturedIcon, type FeaturedIconColor, type FeaturedIconProps, type FeaturedIconSize, FileUpload, FileUploadCard, type FileUploadCardProps, type FileUploadCardStatus, type FileUploadProps, type FilterGroupDimension, Flag, type FlagProps, FloatingToolbar, type FloatingToolbarActionsProps, type FloatingToolbarContextProps, type FloatingToolbarPlacement, type FloatingToolbarProps, FooterFrame, type FooterFrameProps, type FooterFrameVariant, FormDemarcator, GroupedInput, type GroupedInputProps, type GroupedInputVariant, HoverTip, type HoverTipProps, InputField, type InputFieldProps, type InputFieldVariant, InputGroup, type InputGroupProps, InputSection, type InputSectionProps, LAST_UPDATED_COLUMN, LargeModal, type LargeModalProps, type LargeModalVariant, LeadingInputFieldElement, type LeadingInputFieldElementProps, type LeadingInputFieldElementVariant, LetaLogo, type LetaLogoProps, ListGroup, type ListGroupProps, type ListItemData, ListSection, type ListSectionProps, LoadingOverlay, type LoadingOverlayProps, MAP_ROUTE_DRIVEN, MAP_ROUTE_PLANNED, MapIcon, type MapIconProps, type MapIconVariant, MapLegend, type MapLegendEntry, type MapLegendProps, MapSearchInput, type MapSearchInputProps, type MapSearchResultGroup, type MapSearchState, MapView, type MapViewProps, MapZoomControl, type MapZoomControlProps, MenuDivider, MenuFlyout, type MenuFlyoutProps, MenuPanel, type MenuPanelProps, type MetricCardState, type MetricVariance, MobileBadge, type MobileBadgeColor, type MobileBadgeProps, type MobileBadgeVariant, MobileChip, type MobileChipProps, MobileDropdown, type MobileDropdownOption, type MobileDropdownProps, MobileFeaturedIcon, type MobileFeaturedIconColor, type MobileFeaturedIconProps, type MobileFeaturedIconSize, type MobileFeaturedIconVariant, MobileFileUpload, type MobileFileUploadImage, type MobileFileUploadProps, MobileMapSearchInput, type MobileMapSearchInputProps, type MobileMenuOptionState, type MobileMenuOptionType, MobileMenuOptions, type MobileMenuOptionsProps, MobileNavTab, type MobileNavTabProps, MobileSearchInput, type MobileSearchInputProps, MobileSegment, type MobileSegmentProps, ModalDialog, type ModalDialogProps, type ModalDialogVariant, ModalHeaders, type ModalHeadersProps, type ModalHeadersVariant, ModalShell, type ModalShellProps, NotificationBanner, type NotificationBannerProps, type NotificationBannerType, type NotificationBannerVariant, ORDER_TABLE_COLUMNS, ORDER_TABLE_COLUMNS_FINISHED, OptionCard, type OptionCardProps, type OptionCardState, Page, type PageProps, PageTab, type PageTabProps, PageTabsControl, type PageTabsControlItem, type PageTabsControlProps, type PageTabsControlVariant, type PageVariant, Pagination, type PaginationProps, type PaginationVariant, Placeholder, type PlaceholderProps, Popover, type PopoverPlacement, type PopoverProps, ProgressTracker, type ProgressTrackerProps, RadioButton, type RadioButtonProps, SCHEDULED_ORDER_COLUMNS, SIGNATURE_IMAGE, type ScrollEdges, SearchInput, type SearchInputProps, SegmentSwitcherTab, type SegmentSwitcherTabProps, Select, type SelectProps, type SelectedFilterChip, SelectedFilterControl, type SelectedFilterControlProps, SelectionControl, type SelectionControlProps, type SelectionControlVariant, Shortcut, ShortcutHint, type ShortcutHintProps, type ShortcutKey, type ShortcutProps, SideBar, type SideBarGroup, type SideBarItem, type SideBarProps, type SideBarVariant, Sidetab, type SidetabItem, type SidetabProps, Skeleton, type SkeletonProps, type SortOption, StackedCards, type StackedCardsProps, Stepper, StepperInput, type StepperInputProps, type StepperProps, type StepperVariant, type SurroundingTheme, Table, type TableColumn, type TableColumnRole, TableContainer, type TableContainerProps, type TableContainerVariant, TableDataControl, type TableDataControlProps, type TableDataControlVariant, type TableProps, type TableRow, TableSection, type TableSectionProps, Tag, type TagProps, TextArea, type TextAreaBasicProps, type TextAreaProps, type TextAreaRichProps, type TextAreaVariant, Title, type TitleProps, type TitleVariant, Toast, type ToastProps, type ToastType, Toggle, ToggleButton, type ToggleButtonProps, type ToggleProps, Tooltip, type TooltipPlatform, type TooltipPosition, type TooltipPositionInput, type TooltipProps, type TooltipRect, type TooltipSide, type TooltipVariant, TopBar, type TopBarProps, type TopBarVariant, TopFilter, type TopFilterProps, TopFilterSection, type TopFilterSectionItem, type TopFilterSectionProps, TrailingInputFieldElement, type TrailingInputFieldElementProps, type TrailingInputFieldElementVariant, TruncatedIdText, type TruncatedIdTextProps, TruncatedText, type TruncatedTextProps, UNASSIGNED_ORDER_COLUMNS, UserMenu, type UserMenuProps, type UserMenuState, ViewSwitcherTab, type ViewSwitcherTabProps, WizardTab, type WizardTabProps, abbreviateId, animateScrollTop, computeTooltipPosition, downloadFile, htmlToPlainText, inverseTheme, sanitizeRichText, sortLabelFor, useAccordion, useEscapeLayer, useRovingFocus, useScrollEdges, useScrollShadow, useSurroundingTheme };