@k2b/ui 0.31.0 → 0.33.0

package/dist/types/actions/Dropdown.d.ts

@@ -44,6 +44,13 @@ export type DropdownAction = (DropdownActionBase & {
     href?: never;
     external?: never;
 });
+/** A second, smaller action at the end of a row, such as "Only" beside a checkbox; it keeps the menu open. */
+export type DropdownSecondaryAction = {
+    label: string;
+    /** Accessible name when the visible label alone does not say what it acts on, such as "Only Team Logistik". */
+    ariaLabel?: string;
+    action: () => void;
+};
 /** Declarative radio or checkbox row for compact action menus. */
 export type DropdownChoice = DropdownActionBase & {
     action: () => void;
@@ -52,6 +59,11 @@ export type DropdownChoice = DropdownActionBase & {
     href?: string;
     closeOnSelect?: boolean;
     color?: string;
+    /**
+     * A second action at the end of the row. It shows while the row is hovered or focused, always on a touch screen,
+     * and keeps its place when hidden, so the row never changes width. Right and Left move between the two.
+     */
+    secondary?: DropdownSecondaryAction;
 };
 export type DropdownSection = {
     sectionLabel?: string;
@@ -60,6 +72,8 @@ export type DropdownSection = {
      * `sectionLabel`: the label names the choice above the row and for screen readers.
      */
     layout?: "row";
+    /** A quiet action at the end of the section label, such as "All"; it needs a `sectionLabel` and keeps the menu open. */
+    labelAction?: DropdownSecondaryAction;
     items: readonly (DropdownAction | DropdownChoice)[];
 };
 export type DropdownItem = DropdownAction | DropdownChoice | DropdownSection;

package/dist/types/actions/FilterChip.d.ts

@@ -5,6 +5,8 @@ export type FilterChipOption = {
     label: string;
     icon?: string;
     color?: string;
+    /** Quiet trailing information about the option, such as a short note or a loading or warning icon with its own label. */
+    trailing?: JSX.Element;
 };
 export type FilterChipSection = {
     label?: string;
@@ -15,6 +17,8 @@ export type FilterChipSection = {
      * chosen option again keeps it; give the row a value in `defaultValue` so Reset keeps a choice too.
      */
     layout?: "row";
+    /** A labelled `multiple` section offers "All" or, once all its options are chosen, "None" beside its label. */
+    toggleAll?: boolean;
 };
 export type FilterChipProps = {
     label: string;
@@ -33,6 +37,13 @@ export type FilterChipProps = {
      * chips of `AppWorkspace.Head`; pass only the filter's name as `label`. The chip then grows with its value.
      */
     showValue?: boolean;
+    /**
+     * Each option of a `multiple` section offers "Only" at the end of its row: it chooses that option alone among the
+     * `multiple` sections and keeps the choices of single-select sections.
+     */
+    only?: boolean;
+    /** The trigger shows the colors of the first four chosen options before its label, as a quiet hint of what is in view. */
+    swatches?: boolean;
     disabled?: boolean;
     class?: string;
 };

package/dist/types/actions/filter-messages.d.ts

@@ -2,6 +2,18 @@ declare const filterMessages: import("@k2b/stdlib").Catalog<{
     filterActions: string;
     filters: string;
     reset: string;
+    all: string;
+    none: string;
+    allOf: ({ label }: {
+        label: string;
+    }) => string;
+    noneOf: ({ label }: {
+        label: string;
+    }) => string;
+    only: string;
+    onlyOption: ({ label }: {
+        label: string;
+    }) => string;
 }>;
 export type FilterMessages = ReturnType<(typeof filterMessages)["resolve"]>["t"];
 /** Resolved from the inherited render locale. */

package/dist/types/actions/menu-rows.d.ts

@@ -1,5 +1,10 @@
 /**
- * Left and Right cycle through the segments of a row section; Up and Down leave it like any item. Returns whether
- * the key moved focus.
+ * Left and Right cycle through the segments of a row section, or between a row and its secondary action; Up and Down
+ * leave it like any item. Returns whether the key moved focus.
  */
 export declare const focusRowSegment: (items: HTMLElement[], key: string) => boolean;
+/**
+ * Moves Up, Down, Home, or End through the rows; a row's secondary action is no stop of its own there, so Down from
+ * it goes to the next row. Returns whether the key moved focus.
+ */
+export declare const focusMenuRow: (items: HTMLElement[], key: string) => boolean;

package/dist/types/chat/ChatComposer.d.ts

@@ -133,6 +133,14 @@ export type ChatPasteHandler = (event: ClipboardEvent & {
     currentTarget: HTMLTextAreaElement;
     target: Element;
 }) => void;
+export type ChatComposerReply = {
+    /** Name of the answered message's author. */
+    author: string;
+    /** Plain text of the answered message; it shows at most two lines. */
+    text: string;
+    onCancel: () => void;
+    onSelect?: () => void;
+};
 export type ChatComposerProps = {
     value: string;
     onValueChange: (value: string) => void;
@@ -216,5 +224,10 @@ export type ChatComposerProps = {
     microphone?: ChatComposerMicrophone;
     /** One line above the field. The conversation variant always keeps its height; the default shows it only with content. */
     hint?: JSX.Element;
+    /**
+     * The message this draft answers, shown above the field on the same quiet tint as a quote in a message, with a
+     * button that cancels the reply. `onSelect` makes the quote a button, for example to jump to the original.
+     */
+    reply?: ChatComposerReply;
 };
 export declare function ChatComposer(props: ChatComposerProps): JSX.Element;

package/dist/types/chat/chat-messages.d.ts

@@ -28,6 +28,7 @@ export declare const chatMessages: import("@k2b/stdlib").Catalog<{
     messageSent: string;
     messageNotSent: string;
     messageRetry: string;
+    messageDiscard: string;
     messageShowMore: string;
     messageShowLess: string;
     messageReplyTo: string;
@@ -75,6 +76,12 @@ export declare const chatMessages: import("@k2b/stdlib").Catalog<{
     couldNotLoadEarlierMessages: string;
     couldNotPostMessage: string;
     messageActions: string;
+    cancelReply: string;
+    replyingTo: string;
+    messageMenu: ({ author, time }: {
+        author: string;
+        time: string;
+    }) => string;
     messageComposer: string;
     messageInput: string;
     model: string;

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

@@ -7,7 +7,7 @@ import { ChatDecision, ChatMark, ChatOutcome } from "./ChatDecision";
 import { ChatActivity, ChatActivityToggle, ChatContextUsage, ChatMessage } from "./ChatPrimitives";
 import { ChatRoot } from "./ChatRoot";
 import { ChatTimeline } from "./ChatTimeline";
-export type { ChatCommand, ChatCommandContext, ChatCommandDraft, ChatCommandOpenResult, ChatCommandResult, ChatCommandScope, ChatCommandSearch, ChatCommandSection, ChatComposerProps, ChatFileSelection, ChatPasteHandler, } from "./ChatComposer";
+export type { ChatCommand, ChatCommandContext, ChatCommandDraft, ChatCommandOpenResult, ChatCommandResult, ChatCommandScope, ChatCommandSearch, ChatCommandSection, ChatComposerProps, ChatComposerReply, ChatFileSelection, ChatPasteHandler, } from "./ChatComposer";
 export type { ChatDecisionProps, ChatMarkProps, ChatOutcomeProps, ChatPreviewExcerptProps, ChatPreviewHeaderProps, ChatPreviewLineProps, ChatPreviewPeopleProps, ChatPreviewProps, ChatPreviewReadMoreProps, ChatPreviewShowAllProps, ChatPreviewTitleProps, } from "./ChatDecision";
 export type { ChatActivityProps, ChatActivityToggleProps, ChatContextUsageProps, ChatMessageProps } from "./ChatPrimitives";
 export { formatChatTokens } from "./ChatPrimitives";

package/dist/types/content/Calendar.d.ts

@@ -129,12 +129,19 @@ export type CalendarController = {
 export type CalendarCustomView<V extends string = string> = {
     value: V;
     label: string;
+    /** Days the previous and next buttons and keys move, such as 14 for a two-week list. Defaults to one day. */
+    days?: number;
 };
 export type CalendarProps<V extends string = never> = {
     date: Date | string;
     events: CalendarEvent[];
     view?: CalendarView | V;
     views?: CalendarView[];
+    /**
+     * `false` leaves the view switcher out of the toolbar, for a host that shows the views elsewhere, such as tabs in
+     * its page head. The view commands stay.
+     */
+    viewSwitcher?: boolean;
     /** Views after the built-in ones. While one is active, `children` is the body and the header pages by day. */
     customViews?: CalendarCustomView<V>[];
     /** The body of the active custom view. */

package/dist/types/content/Chart.d.ts

@@ -92,14 +92,16 @@ export type ChartProps = {
         /** Target when zooming in from the world view. Defaults to Europe (50, 10). */
         zoomFocus?: Pick<MapViewport, "latitude" | "longitude">;
     } : {}) & (K extends "line" ? {
-        maxGap?: number;
+        /** Largest connected X distance; positive, finite, without area/errorBand fills. */ maxGap?: number;
+        /** Wrap the legend above the plot inside the caller's total chart height. Requires legend=true. */
+        legendPlacement?: "top-start";
     } : {}) & (K extends "stateTimeline" ? StateTimelineChartOptions : Omit<Parameters<(typeof charts)[K]>[0], "width" | "height" | "inspect">);
 }[ChartKind];
 /** Pure renderer options: component layout, events and inspection are configured elsewhere. */
 export type ChartRenderOptions = {
     [K in ChartKind]: Omit<Extract<ChartProps, {
         kind: K;
-    }>, "class" | "style" | "labels" | "interactive" | "onSelect" | "selected" | "tooltip" | "cursor">;
+    }>, "class" | "style" | "labels" | "interactive" | "onSelect" | "selected" | "tooltip" | "cursor" | "legendPlacement">;
 }[ChartKind];
 /** Keep the fixed 28-unit bar-gauge rows inside the shared SSR/browser coordinate space. */
 export declare const chartRenderHeight: (props: ChartRenderOptions) => number;

package/dist/types/content/ChartExplorer.d.ts

@@ -10,7 +10,6 @@ export type ChartExplorerColumn<T> = {
     render?: (row: T) => JSX.Element;
     /**
      * Explicit comparable value. Omit to leave the column unsortable.
-     * Returning a number also exempts the cell from spreadsheet formula guarding on copy.
      */
     sortValue?: (row: T) => string | number | null;
     align?: "left" | "center" | "right";

package/dist/types/content/MessageRow.d.ts

@@ -1,4 +1,5 @@
 import { type JSX } from "solid-js";
+import { type GestureKind } from "../actions/GestureMenu";
 import { type ReactionBarItem } from "./ReactionBar";
 export type MessageRowAuthor = {
     /** Display name, shown at the start of a group and read before every message. */
@@ -11,12 +12,26 @@ export type MessageRowAuthor = {
 export type MessageRowStatus = "pending" | "sent" | "failed";
 export type MessageRowAction = {
     id: string;
-    /** Accessible name and tooltip. */
+    /** Visible name of the menu entry. */
     label: string;
     /** Icon class, for example `ti ti-arrow-back-up`. */
     icon: string;
+    /** One quiet sentence below the label that says what the entry does. */
+    description?: string;
     onSelect: () => void;
     disabled?: boolean;
+    variant?: "danger";
+    /** A touch gesture that runs the entry too. Give each gesture to at most one entry. */
+    gesture?: GestureKind;
+    /**
+     * Alt+click (Option+click on Apple devices) on the message runs the entry directly, and the entry shows that
+     * shortcut. Give it to at most one entry.
+     */
+    altClick?: boolean;
+    /** A key the application handles for the focused message, such as "r"; the entry shows it at its end. */
+    shortcut?: string;
+    /** In the phone sheet, runs while the tap still counts as the person's gesture, as clipboard writes require. */
+    immediate?: boolean;
 };
 export type MessageRowQuote = {
     /** Name of the quoted message's author. */
@@ -67,6 +82,16 @@ export type MessageRowFile = MessageRowAttachmentTarget & {
     icon?: string;
 };
 export type MessageRowAttachment = MessageRowMedia | MessageRowFile;
+/** Where a message belongs, shown as a small chip under it, for example its thread in a timeline of several. */
+export type MessageRowOrigin = {
+    label: string;
+    /** Icon class, for example `ti ti-hash`. */
+    icon?: string;
+    /** Opens where the message belongs. Without it, the chip is not a control. */
+    onSelect?: () => void;
+    /** Accessible name of the control when it must say more than the label, such as "Open thread Updates". */
+    selectLabel?: string;
+};
 export type MessageRowProgress = {
     /** What is happening, for example "Writing" or "Searching the files". */
     status: string;
@@ -96,7 +121,12 @@ export type MessageRowProps = {
     receipt?: string;
     /** Called by "Retry" while `status` is `"failed"`. */
     onRetry?: () => void;
-    /** Shown as a toolbar over the message while it is hovered or focused. It never moves the layout. */
+    /** Called by "Discard" next to "Retry" while `status` is `"failed"`, so both answers to a failure sit where it shows. */
+    onDiscard?: () => void;
+    /**
+     * The message's menu. A quiet "…" beside the bubble opens it while the message is hovered or focused, also from the
+     * keyboard; right-click and a long press open the same menu. Showing "…" never moves the layout.
+     */
     actions?: readonly MessageRowAction[];
     /** The message this one answers, shown above it. */
     quote?: MessageRowQuote;
@@ -124,6 +154,8 @@ export type MessageRowProps = {
     onAddReaction?: (anchor: HTMLElement) => void;
     /** A bar of fixed height that opens the replies to this message. */
     thread?: MessageRowThread;
+    /** A chip of fixed height under the message that names where it belongs. */
+    origin?: MessageRowOrigin;
     /** The message is still being written, by a person or an automated author alike: a status line with "Stop". */
     progress?: MessageRowProgress;
     class?: string;
@@ -138,6 +170,29 @@ export type MessageSystemRowProps = {
     icon?: string;
     class?: string;
 };
+export type MessageEventRowProps = {
+    /** What changed, for example "Mara set the status to “In review”". */
+    children: JSX.Element;
+    /** Icon class of the kind of change; a dot by default. */
+    icon?: string;
+    /** Where the change belongs, such as its thread, where several threads mix. */
+    origin?: MessageRowOrigin;
+    /** Visible time, formatted by the caller. */
+    time?: string;
+    dateTime?: string | Date;
+    class?: string;
+};
+export type MessageEventGroupProps = {
+    /** What the closed group stands for, for example "4 changes to Invitation and Light test". */
+    label: string;
+    expanded: boolean;
+    onToggle: () => void;
+    /** Visible time or range, formatted by the caller, for example "09:50–09:58". */
+    time?: string;
+    /** The first event's time. */
+    dateTime?: string | Date;
+    class?: string;
+};
 export type MessageGroupEntry = {
     /** Stable identity of the author. */
     author: string;
@@ -156,6 +211,13 @@ export declare const startsMessageGroup: (entry: MessageGroupEntry, previous?: M
  * as `VirtualFeed` keeps its positions.
  */
 export declare function MessageRow(props: MessageRowProps): JSX.Element;
+/**
+ * A quiet line for a change to something the conversation is about, such as a task's new status: no bubble, aligned
+ * with the messages' text, with its time at the end. It is no message: it never counts as unread.
+ */
+export declare function MessageEventRow(props: MessageEventRowProps): JSX.Element;
+/** Several event lines in a row as one line that opens them, such as "4 changes to Invitation and Light test". */
+export declare function MessageEventGroup(props: MessageEventGroupProps): JSX.Element;
 /** A quiet, centered line for something that happened in the conversation, such as a person joining. */
 export declare function MessageSystemRow(props: MessageSystemRowProps): JSX.Element;
 export {};

package/dist/types/content/code-highlight.d.ts

@@ -6,9 +6,11 @@
  * in token spans, so the returned strings are safe to inject with
  * `innerHTML`.
  */
-export type CodeDisplayLanguage = "ts" | "tsx" | "js" | "jsx" | "script" | "markdown" | "md" | "text";
+export type CodeDisplayLanguage = "ts" | "tsx" | "js" | "jsx" | "script" | "markdown" | "md" | "text" | "sql";
 export declare const escapeCodeHtml: (s: string) => string;
 export declare const highlightCode: (code: string) => string;
 export declare const highlightMarkdownDisplay: (code: string) => string;
 export declare const highlightCodeDisplayLines: (code: string, language?: CodeDisplayLanguage) => string[];
 export declare const highlightCodeDisplay: (code: string, language?: CodeDisplayLanguage) => string;
+/** Display-only, tolerant of incomplete SQL while typing. Source is always escaped. */
+export declare const highlightSql: (code: string) => string;

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

@@ -17,6 +17,7 @@ export type { ChartDatumRef, ChartSelection, ChartTooltip, ChartTooltipFormatter
 export type { ChartSnapshot } from "./chart-snapshot";
 export { prepareChartSnapshot } from "./chart-snapshot";
 export type { StateTimelineChartOptions, StateTimelineDomain, StateTimelineInterval, StateTimelineRow, StateTimelineState, } from "./chart-state-timeline";
+export { highlightSql } from "./code-highlight";
 export { type CollectionSelection, createCollectionSelection, type SelectionModifiers } from "./collection-selection";
 export type { DataTableColumn, DataTableControlsProps, DataTableFooter, DataTableHeaderProps, DataTablePanelFooterProps, DataTablePanelProps, DataTableProps, DataTableRenderCell, DataTableRenderHeader, DataTableSort, } from "./DataTable";
 export { default as DataTable } from "./DataTable";
@@ -39,8 +40,8 @@ export { MapAttribution } from "./MapAttribution";
 export { MapView } from "./MapView";
 export { MapViewFrame } from "./MapViewFrame";
 export { default as MarkdownView, type MarkdownRenderOptions, type MarkdownViewProps, renderSafeMarkdown } from "./MarkdownView";
-export type { MessageGroupEntry, MessageRowAction, MessageRowAttachment, MessageRowAuthor, MessageRowFile, MessageRowMedia, MessageRowProgress, MessageRowProps, MessageRowQuote, MessageRowReaction, MessageRowStatus, MessageRowThread, MessageSystemRowProps, } from "./MessageRow";
-export { MessageRow, MessageSystemRow, startsMessageGroup } from "./MessageRow";
+export type { MessageEventGroupProps, MessageEventRowProps, MessageGroupEntry, MessageRowAction, MessageRowAttachment, MessageRowAuthor, MessageRowFile, MessageRowMedia, MessageRowOrigin, MessageRowProgress, MessageRowProps, MessageRowQuote, MessageRowReaction, MessageRowStatus, MessageRowThread, MessageSystemRowProps, } from "./MessageRow";
+export { MessageEventGroup, MessageEventRow, MessageRow, MessageSystemRow, startsMessageGroup } from "./MessageRow";
 export { type MapPaletteColors, type MapTheme, mapPalette } from "./map-palette";
 export { type MapStyleOptions, mapAttribution, mapStyle } from "./map-style";
 export type { MapViewArea, MapViewFit, MapViewFrameProps, MapViewLine, MapViewLineTone, MapViewMarker, MapViewOwnLocation, MapViewPoint, MapViewProps, MapViewStyle, MapViewStyleSource, MapViewTone, } from "./map-view-types";

package/dist/types/content/map-view-live.d.ts

@@ -1,2 +1,2 @@
 import { Map, type MapOptions } from "maplibre-gl";
-export declare function createMap(options: MapOptions): Map;
+export declare function createMap(options: MapOptions, onResourceError: () => void): Map;

package/dist/types/content/map-view-types.d.ts

@@ -58,4 +58,6 @@ export type MapViewProps = Omit<MapViewFrameProps, "attribution"> & {
     notice?: JSX.Element;
     empty?: JSX.Element;
     onLocate?: () => void;
+    /** Observe rendering and resource failures without receiving provider responses or URLs. */
+    onStateChange?: (state: "static" | "loading" | "ready" | "error" | "no-webgl" | "empty") => void;
 };

package/dist/types/feedback/dialog-core.d.ts

@@ -8,6 +8,9 @@ export type OpenDialogOptions = {
     initialFocus?: "first-input" | "none" | ((dialog: HTMLDialogElement) => HTMLElement | null);
     cancelBehavior?: "resolve-undefined" | "ignore";
     ariaLabel?: string;
+    ariaDescribedBy?: string;
+    /** Use for a consequential confirmation that requires a response. Defaults to dialog. */
+    role?: "dialog" | "alertdialog";
     /**
      * Add a same-URL history entry while the dialog is open, so the browser's or the phone's Back closes the dialog
      * instead of leaving the page. Normally closing the dialog removes the entry again; the returned promise settles after that.

package/dist/types/inputs/AutocompleteEditor.d.ts

@@ -14,7 +14,12 @@ export type AutocompleteEditorProps = ValueFieldProps<string> & {
     name?: string;
     maxLength?: number;
     textareaRef?: (element: HTMLTextAreaElement) => void;
-    variant?: "default" | "paper";
+    variant?: "default" | "paper" | "embedded";
+    readOnly?: boolean;
+    /** Number logical lines; disables soft wrapping to keep the gutter aligned. */
+    lineNumbers?: boolean;
+    /** One-based line to mark in the gutter, for example a parser error. */
+    markedLine?: number;
 };
 export declare function AutocompleteEditor(props: AutocompleteEditorProps): JSX.Element;
 export type { Completion, SuggestContext, Suggestion } from "./completion";

package/dist/types/inputs/RichSelect.d.ts

@@ -0,0 +1,93 @@
+import { type JSX } from "solid-js";
+import type { ValueFieldProps } from "./field-contract";
+import type { ChoiceAppearance } from "./Select";
+/** One option: a name plus at most one short line. */
+export type RichSelectItem = {
+    value: string;
+    /** Wraps; never truncated. */
+    label: string;
+    /** At most one short line that says what the choice changes. */
+    description?: string;
+    /** Icon class shown before the name. */
+    icon?: string;
+    /** Color dot shown before the name, such as a space color. Replaces `icon`. */
+    color?: string;
+    /** Creates a fresh visual for each render location. Replaces `icon` and `color`. */
+    visual?: () => JSX.Element;
+    /** Makes the row unavailable. The reason replaces `description`; the arrow keys still reach the row. */
+    disabledReason?: string;
+    /** Section id. Headings show only from eight options; keep each section's items together. */
+    section?: string;
+    /** Extra search terms that are not shown. */
+    keywords?: readonly string[];
+};
+export type RichSelectSection = {
+    id: string;
+    label: string;
+};
+export type RichSelectStatus = "ready" | "loading" | "error";
+export type RichSelectFooter = {
+    label: string;
+    icon?: string;
+    onActivate: () => void;
+} | {
+    label: string;
+    icon?: string;
+    create: {
+        placeholder: string;
+        onCreate: (name: string) => void;
+    };
+};
+export type RichSelectFact = {
+    icon: string;
+    text: JSX.Element;
+    tone?: "default" | "warning";
+};
+export type RichSelectProps = ValueFieldProps<string | null> & {
+    items: readonly RichSelectItem[];
+    /** Labels for the `section` ids of the items. */
+    sections?: readonly RichSelectSection[];
+    /** Names the list: the heading of a list without preview, the phone sheet title, and the listbox label. */
+    title?: string;
+    placeholder?: string;
+    /** Replaces the selected item's name in the trigger, such as "Name · address". */
+    triggerLabel?: string;
+    /** Icon class for the trigger while no item with its own visual is selected. */
+    icon?: string;
+    tone?: "default" | "warning";
+    /** Custom content inside the shared trigger button, which keeps the combobox semantics. */
+    renderTrigger?: (selected: RichSelectItem | undefined) => JSX.Element;
+    /**
+     * The body of the preview beside the list, for options whose consequences differ.
+     * Without it the picker shows only the list. Keep it to at most three facts.
+     */
+    renderPreview?: (item: RichSelectItem) => JSX.Element;
+    searchPlaceholder?: string;
+    status?: RichSelectStatus;
+    onRetry?: () => void;
+    /** Shown when the list is ready and has no items. */
+    empty?: JSX.Element;
+    footer?: RichSelectFooter;
+    appearance?: ChoiceAppearance;
+    placement?: "bottom-start" | "top-start";
+    /** CSS lengths for the desktop popover. */
+    size?: {
+        width?: string;
+        height?: string;
+    };
+    name?: string;
+};
+/** Search and section headings appear from this many options. */
+export declare const RICH_SELECT_SEARCH_FROM = 8;
+/** Up to three short facts for a preview, each with an icon; warnings in the warning tone. */
+export declare function RichSelectFacts(props: {
+    facts: readonly RichSelectFact[];
+}): JSX.Element;
+/**
+ * A dropdown whose rows explain each choice: a name plus one short line, an
+ * unavailable row with its reason, and an optional preview of what a choice
+ * changes. Desktop opens a popover beside the trigger; a phone opens a bottom
+ * sheet whose info buttons show the preview as a second level.
+ */
+export declare function RichSelect(props: RichSelectProps): JSX.Element;
+export default RichSelect;

package/dist/types/inputs/TextInput.d.ts

@@ -5,9 +5,12 @@ export type TextInputProps = Omit<JSX.InputHTMLAttributes<HTMLInputElement>, "on
     minLength?: number;
     maxLength?: number;
     type?: "text" | "search" | "email" | "url" | "tel";
-    variant?: "default" | "ai";
-    icon?: string;
+    variant?: "default" | "ai" | "compact";
+    /** Set false for a plain field without a leading icon. */
+    icon?: string | false;
     activeIcon?: string;
+    /** ID of a consumer-owned visible error; caller owns its announcement. Native controls only. */
+    externalErrorId?: string;
     prefix?: JSX.Element;
     suffix?: JSX.Element;
     clearable?: boolean;

package/dist/types/inputs/choice.d.ts

@@ -10,8 +10,19 @@ export type ChoiceOption<T extends string = string> = {
     groups?: readonly string[];
 };
 export type ChoiceOptionsLoader<T extends string = string> = (query: string, signal: AbortSignal) => Promise<readonly ChoiceOption<T>[]>;
-export declare const filterChoiceOptions: <T extends string>(options: readonly ChoiceOption<T>[], query: string) => readonly ChoiceOption<T>[];
-export declare const nextEnabledChoiceIndex: <T extends string>(options: readonly ChoiceOption<T>[], current: number, direction: 1 | -1) => number;
+/** Matches label, description, value, and optional extra keywords. */
+export declare const filterChoiceOptions: <O extends Pick<ChoiceOption<string>, "label" | "description" | "value"> & {
+    keywords?: readonly string[];
+}>(options: readonly O[], query: string) => readonly O[];
+/**
+ * Moves through the options and wraps at the ends, skipping `disabled` ones. A
+ * RichSelect row that cannot be chosen carries a `disabledReason` instead, so
+ * the arrow keys still reach it and its reason can be read.
+ */
+export declare const nextEnabledChoiceIndex: <O extends {
+    label: string;
+    disabled?: boolean;
+}>(options: readonly O[], current: number, direction: 1 | -1) => number;
 /**
  * Counts the leading pills that fit into `available` pixels and measures the
  * whole row. When not all of them fit, the rest collapse into a summary pill
@@ -32,8 +43,17 @@ export declare function createChoiceLoader<T extends string>(loader: () => Choic
     retry: () => void;
     cancel: () => void;
 };
-export declare const placeChoicePopover: (trigger: HTMLElement, popover: HTMLElement) => void;
-export declare function createChoicePopover(disabled: () => boolean): {
+export type ChoicePopoverPlacement = {
+    /**
+     * `trigger` (default) gives the popover the trigger's width; `own` keeps the
+     * width its stylesheet sets, such as a RichSelect with a preview.
+     */
+    width?: "trigger" | "own";
+    /** The side tried first. The popover flips when the other side has more room. */
+    side?: "below" | "above";
+};
+export declare const placeChoicePopover: (trigger: HTMLElement, popover: HTMLElement, placement?: ChoicePopoverPlacement) => void;
+export declare function createChoicePopover(disabled: () => boolean, placement?: () => ChoicePopoverPlacement): {
     open: () => boolean;
     setTrigger: Setter<HTMLElement | undefined>;
     setPopover: Setter<HTMLElement | undefined>;

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

@@ -37,6 +37,8 @@ export type { NumberInputProps } from "./NumberInput";
 export { NumberInput } from "./NumberInput";
 export type { QrScannerError, QrScannerProps } from "./QrScanner";
 export { QrScanner } from "./QrScanner";
+export type { RichSelectFact, RichSelectFooter, RichSelectItem, RichSelectProps, RichSelectSection, RichSelectStatus, } from "./RichSelect";
+export { RichSelect, RichSelectFacts } from "./RichSelect";
 export type { ChoiceAppearance, SelectGridSize, SelectGroup, SelectOption, SelectProps, SelectSourceOption, SelectView } from "./Select";
 export { Select } from "./Select";
 export type { SelectChipOption, SelectChipProps } from "./SelectChip";

package/dist/types/inputs/rich-select-messages.d.ts

@@ -0,0 +1,21 @@
+declare const richSelectMessages: import("@k2b/stdlib").Catalog<{
+    back: string;
+    choose: string;
+    chooseOption: string;
+    close: string;
+    couldNotLoad: string;
+    create: string;
+    detailsFor: ({ name }: {
+        name: string;
+    }) => string;
+    loading: string;
+    noOptions: string;
+    noResults: string;
+    retry: string;
+    search: string;
+}>;
+export type RichSelectMessages = ReturnType<(typeof richSelectMessages)["resolve"]>["t"];
+/** Resolved from the inherited render locale. */
+export declare const useRichSelectMessages: () => (() => RichSelectMessages);
+export declare const checkRichSelectMessages: () => import("@k2b/stdlib").CatalogIssue[];
+export {};

package/dist/types/intl/shortcut-messages.d.ts

@@ -26,6 +26,8 @@ export declare const resolveShortcutMessages: (locale?: string) => {
     pageup: string;
     pagedown: string;
     spaceLabel: string;
+    click: string;
+    clickLabel: string;
     deleteLabel: string;
     homeLabel: string;
     endLabel: string;

package/dist/types/layout/AppWorkspace.d.ts

@@ -6,6 +6,8 @@ import type { ScrollAreaProps } from "./ScrollArea";
 import { type AppWorkspaceSidebarSwitcherProps } from "./SidebarSwitcher";
 export type { AppWorkspaceWidthShare } from "./app-workspace-width";
 export type AppWorkspaceHeadProps = {
+    /** Below 48rem, show this head only with this active Main region. Unsplit Mains keep their head. */
+    mobilePane?: string;
     /** View tabs, usually a ViewTabs. */
     views?: JSX.Element;
     /** Filter chips, usually FilterChip elements. */
@@ -89,6 +91,8 @@ export type AppWorkspaceMainPaneProps = {
     href?: string;
     /** Quiet one-line text below the level title. */
     description?: JSX.Element;
+    /** Levels mode: a small mark before the level title, such as the colour dot of the object's container. */
+    lead?: JSX.Element;
     /** Controls at the end of the level head. */
     actions?: JSX.Element;
     surface?: "default" | "navigation";
@@ -107,6 +111,10 @@ export type AppWorkspaceDetailWidth = "sm" | "md" | "lg" | "xl";
 export type AppWorkspaceDetailProps = {
     children: JSX.Element;
     open: boolean;
+    /** Keeps the shared head control reachable while closed; set the app's existing open state synchronously. */
+    onOpen?: () => void;
+    /** Whether the current object may show details. False disables reopening and hides the panel. */
+    available?: boolean;
     /**
      * Whether choosing an item in Main opens this Detail as the drawer while it waits.
      * Set false when Main itself shows the chosen item, such as a reader beside a list:
@@ -124,6 +132,7 @@ export type AppWorkspaceDetailProps = {
     maxWidth?: number;
     /**
      * Closes the column with Escape, or the phone sheet with a downward drag.
+     * With onOpen, the shared head control also closes the column or phone sheet.
      * Server-rendered panels mark their close control with
      * `data-workspace-detail-close` instead; those gestures click it.
      * Escape and a rightward touch swipe park an open waiting drawer without

package/dist/types/layout/DetailPanel.d.ts

@@ -2,6 +2,8 @@ import { type JSX } from "solid-js";
 import { type ButtonLinkProps, type ButtonProps } from "../actions/Button";
 import { type DropdownItem } from "../actions/Dropdown";
 export type DetailPanelProps = {
+    /** Plain sections share their host surface, as in AppWorkspace.Detail. */
+    surface?: "default" | "plain";
     children: JSX.Element;
     class?: string;
 };