@k2b/ui 0.2.0 → 0.4.0

package/dist/types/content/chart-explorer.d.ts

@@ -0,0 +1,48 @@
+import { type Accessor } from "solid-js";
+import type { ChartSnapshot } from "./chart-snapshot";
+/** Omitted visibleKeys means no series filter; [] explicitly hides every series. */
+export type ChartExplorerRequest = {
+    step?: string;
+    visibleKeys?: readonly string[];
+    referenceStep?: string;
+};
+export type ChartExplorerRow = {
+    key: string;
+};
+export type ChartExplorerData<T extends ChartExplorerRow = ChartExplorerRow> = {
+    chart: ChartSnapshot;
+    rows: readonly T[];
+};
+export type ChartExplorerCharts = Readonly<Record<string, ChartExplorerData>>;
+export type ChartExplorerSnapshot<C extends ChartExplorerCharts> = {
+    request: ChartExplorerRequest;
+    charts: C;
+};
+export type ChartExplorerOptions<C extends ChartExplorerCharts> = {
+    /** Authoritative initial/replacement data. Replacements cancel pending work. */
+    snapshot: Accessor<ChartExplorerSnapshot<C>>;
+    load: (request: ChartExplorerRequest, signal: AbortSignal) => ChartExplorerSnapshot<NoInfer<C>> | Promise<ChartExplorerSnapshot<NoInfer<C>>>;
+    /** Optional controlled filters. Changes trigger loading; setRequest emits onRequestChange. */
+    request?: Accessor<ChartExplorerRequest>;
+    onRequestChange?: (request: ChartExplorerRequest) => void;
+    selectedKey?: Accessor<string | null>;
+    onSelectedKeyChange?: (key: string | null) => void;
+};
+export type ChartExplorerController<C extends ChartExplorerCharts> = ReturnType<typeof createChartExplorer<C>>;
+export declare const sameExplorerRequest: (a: ChartExplorerRequest, b: ChartExplorerRequest) => boolean;
+export declare function validateChartExplorerData(data: ChartExplorerData): void;
+/** One owner for one or many charts. Source/HTTP/aggregation remain caller-owned. */
+export declare function createChartExplorer<C extends ChartExplorerCharts>(options: ChartExplorerOptions<C>): {
+    snapshot: Accessor<ChartExplorerSnapshot<C>>;
+    desired: Accessor<ChartExplorerRequest>;
+    loading: Accessor<boolean>;
+    error: Accessor<Error | null>;
+    selectedKey: () => string | null;
+    select: (key: string | null) => void;
+    setRequest: (next: ChartExplorerRequest) => void;
+    /** Force a fresh read of the desired filters, even when nothing changed. */
+    refresh: () => Promise<void>;
+    retry: () => Promise<void>;
+    pinReference(): void;
+    clearReference(): void;
+};

package/dist/types/content/chart-inspection.d.ts

@@ -0,0 +1,40 @@
+import type { ChartDatum } from "@k2b/stdlib";
+import type { ChartKind } from "./Chart";
+import type { ChartCursor } from "./chart-cursor";
+export type ChartDatumRef = Pick<ChartDatum, "role" | "index" | "seriesIndex">;
+export declare const sameChartDatum: (a: ChartDatumRef, b: ChartDatumRef) => boolean;
+export type ChartSelection = {
+    kind: ChartKind;
+    datum: ChartDatum;
+};
+export type ChartTooltip = {
+    title?: string;
+    rows: readonly {
+        label: string;
+        value: string;
+    }[];
+};
+export type ChartTooltipFormatter = (selection: ChartSelection) => ChartTooltip;
+export declare function isChartDatum(value: unknown): value is ChartDatum;
+/** Enhances existing SVG nodes. Pointer/focus changes never rebuild the chart. */
+export declare function createChartInspection(options: {
+    container: () => HTMLDivElement | undefined;
+    cursor?: () => ChartCursor | undefined;
+    tooltip: () => HTMLSpanElement | undefined;
+    anchor: () => HTMLSpanElement | undefined;
+    kind: () => ChartKind;
+    enabled: () => boolean;
+    format: ChartTooltipFormatter;
+    select: (selection: ChartSelection) => void;
+}): {
+    selectDatum: (selected: ChartDatumRef | null | undefined) => void;
+    selectData: (selected: readonly ChartDatumRef[]) => void;
+    move: (event: PointerEvent) => void;
+    down: (event: PointerEvent) => void;
+    click: (event: MouseEvent) => void;
+    focus: (event: FocusEvent) => void;
+    key: (event: KeyboardEvent) => boolean;
+    close: () => void;
+    invalidate: () => void;
+    leave: () => void;
+};

package/dist/types/content/chart-line-gaps.d.ts

@@ -0,0 +1,5 @@
+/** Adapt trusted stdlib line geometry without changing series, indices or inspection. */
+export declare function lineGapsSvg(svg: string, maxGap: number, options: {
+    smooth?: boolean;
+    step?: "before" | "after" | "middle";
+}): string;

package/dist/types/content/chart-map-viewport.d.ts

@@ -1,5 +1,5 @@
 import type { MapViewport } from "@k2b/stdlib";
 export declare const DEFAULT_MAP_VIEWPORT: MapViewport;
 export declare const normalizeMapViewport: (viewport: MapViewport | undefined) => MapViewport;
-export declare const zoomMapViewport: (viewport: MapViewport, delta: number) => MapViewport;
+export declare const zoomMapViewport: (viewport: MapViewport, delta: number, focus?: Pick<MapViewport, "latitude" | "longitude">) => MapViewport;
 export declare const panMapViewport: (viewport: MapViewport, deltaX: number, deltaY: number, width: number, height: number) => MapViewport;

package/dist/types/content/chart-snapshot.d.ts

@@ -0,0 +1,26 @@
+import { type ChartDatum } from "@k2b/stdlib";
+import { type ChartKind, type ChartRenderOptions } from "./Chart";
+import { type ChartSelection, type ChartTooltip, type ChartTooltipFormatter } from "./chart-inspection";
+/** Trusted output of prepareChartSnapshot; never accept arbitrary user SVG. */
+export type ChartSnapshot = {
+    kind: ChartKind;
+    svg: string;
+    width: number;
+    height: number;
+    stretch: boolean;
+    marks: readonly {
+        key: string;
+        rowKey: string;
+        datum: ChartDatum;
+        tooltip: ChartTooltip;
+        reference?: boolean;
+    }[];
+};
+/** Pure SVG preparation for server or browser. Transfer only this output across SSR boundaries. */
+export declare function prepareChartSnapshot(options: ChartRenderOptions, inspection: {
+    key: (selection: ChartSelection) => string;
+    /** Defaults to the mark key for one-to-one charts. */
+    rowKey?: (selection: ChartSelection) => string;
+    tooltip: ChartTooltipFormatter;
+    reference?: (selection: ChartSelection) => boolean;
+}): ChartSnapshot;

package/dist/types/content/chart-svg.d.ts

@@ -0,0 +1,21 @@
+import type { MapViewport } from "@k2b/stdlib";
+/** Give maps a CSS-sized viewport while retaining the renderer's projection.
+ * The outer SVG uses pixels for headers/legend; the nested geographic viewport
+ * keeps one fitted scale across zoom levels and clips only at the plot edges.
+ */
+export declare function responsiveMapSvg(svg: string, width: number, height: number, viewport: MapViewport): string;
+/** Adapt our generated SVGs to a CSS-sized box without rebuilding their geometry.
+ * Only stdlib and the local timeline renderer supply this markup; this is not a
+ * parser for arbitrary SVG. The viewBox remains the interaction coordinate space.
+ */
+export declare function responsiveChartSvg(svg: string): string;
+/** Add initial controlled selection to our own renderer metadata during SSR. */
+export declare function selectedChartSvg(svg: string, selected: {
+    role: string;
+    index: number;
+    seriesIndex?: number;
+} | readonly {
+    role: string;
+    index: number;
+    seriesIndex?: number;
+}[] | null | undefined): string;

package/dist/types/content/collection-selection.d.ts

@@ -0,0 +1,24 @@
+export type SelectionModifiers = {
+    shiftKey?: boolean;
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+};
+export type CollectionSelection = ReturnType<typeof createCollectionSelection>;
+/** One selection and focus model shared by alternate presentations of a collection. */
+export declare function createCollectionSelection(options: {
+    ids: () => readonly string[];
+    initial?: readonly string[];
+    onChange?: (ids: readonly string[]) => void;
+}): {
+    selected: import("solid-js").Accessor<ReadonlySet<string>>;
+    focused: import("solid-js").Accessor<string | null>;
+    select: (id: string, modifiers?: SelectionModifiers) => void;
+    toggle: (id: string) => void;
+    replace: (ids: readonly string[]) => void;
+    focus: (id: string) => void;
+    keyDown: (event: KeyboardEvent, id: string, columns?: number) => boolean;
+    clear: () => void;
+    all: () => void;
+    markFocused: (id: string) => string;
+    register: (id: string, element: HTMLElement) => void;
+};

package/dist/types/content/delimited-preferences.d.ts

@@ -0,0 +1,11 @@
+export type DelimitedPreferences = {
+    encoding: string;
+    delimiter: string;
+    view: "table" | "raw";
+};
+/** Persist presentation choices only, never file contents. Ignore stale or corrupt storage. */
+export declare const readDelimitedPreferences: (stored: string | null) => DelimitedPreferences;
+export declare const decodeDelimitedContent: (content: {
+    encoding: "utf8" | "base64";
+    content: string;
+}, encoding: string) => string;

package/dist/types/content/file-tree.d.ts

@@ -10,6 +10,8 @@
 export type FileTreeEntry = {
     /** Canonical identity, e.g. "/input/report.csv". */
     path: string;
+    /** Optional presentation label; path remains the identity and rename target. */
+    displayName?: string;
     /** Folders are usually implicit from paths — explicit entries model empty dirs. */
     kind?: "file" | "folder";
     size?: number;

package/dist/types/content/file-view-preview.d.ts

@@ -15,8 +15,11 @@ export declare const canPreviewFile: (file: FileViewFile) => boolean;
 export type DelimitedTextPreview = {
     rows: string[][];
     truncated: boolean;
+    totalRows: number;
+    columnsTruncated: boolean;
 };
-export declare const parseDelimitedText: (input: string, delimiter: "," | "\t", limits?: {
+export declare const parseDelimitedText: (input: string, delimiter: string, limits?: {
     rows?: number;
     columns?: number;
+    offset?: number;
 }) => DelimitedTextPreview;

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

@@ -1,22 +1,36 @@
 export type { CalendarAttendee, CalendarDayBadge, CalendarEvent, CalendarEventColor, CalendarEventRenderContext, CalendarEventTimeChange, CalendarLabels, CalendarProps, CalendarRecurrence, CalendarResource, CalendarView, } from "./Calendar";
 export { default as Calendar } from "./Calendar";
-export type { ChartKind, ChartLabels, ChartProps } from "./Chart";
+export type { ChartKind, ChartLabels, ChartProps, ChartRenderOptions } from "./Chart";
 export { default as Chart } from "./Chart";
+export type { ChartExplorerColumn, ChartExplorerProps } from "./ChartExplorer";
+export { ChartExplorer } from "./ChartExplorer";
+export type { ChartExplorerControlsProps } from "./ChartExplorerControls";
+export { ChartExplorerControls } from "./ChartExplorerControls";
+export { ChartFilterControls, type ChartFilterControlsProps } from "./ChartFilterControls";
+export { ChartSnapshotView } from "./ChartSnapshotView";
 export type { CodeDisplayLanguage, CodeDisplayProps } from "./CodeDisplay";
 export { default as CodeDisplay } from "./CodeDisplay";
+export { type ChartCursor, createChartCursor } from "./chart-cursor";
+export type { ChartExplorerCharts, ChartExplorerController, ChartExplorerData, ChartExplorerOptions, ChartExplorerRequest, ChartExplorerRow, ChartExplorerSnapshot, } from "./chart-explorer";
+export { createChartExplorer } from "./chart-explorer";
+export type { ChartDatumRef, ChartSelection, ChartTooltip, ChartTooltipFormatter } from "./chart-inspection";
+export type { ChartSnapshot } from "./chart-snapshot";
+export { prepareChartSnapshot } from "./chart-snapshot";
 export type { StateTimelineChartOptions, StateTimelineDomain, StateTimelineInterval, StateTimelineRow, StateTimelineState, } from "./chart-state-timeline";
+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";
 export type { DocCodeHighlighter, DocCodeProps, DocConcept, DocNoteVariant, DocRow } from "./Docs";
 export { DocCode, DocConceptGrid, DocInlineCode, DocLead, DocNote, DocPage, DocRows, DocSection } from "./Docs";
 export { FileBrowserPanel, type FileBrowserPanelProps, type FileSource, openFileBrowser } from "./FileBrowser";
+export { FileGrid, type FileGridProps } from "./FileGrid";
 export { default as FileTree, type FileTreeActions, type FileTreeEntry, type FileTreeProps } from "./FileTree";
 export { canPreviewFile, default as FileView, type FileViewContent, type FileViewFile, type FileViewPreviewKind, type FileViewProps, type FileViewRenderer, type FileViewRendererProps, formatFileViewSize, getFileViewPreviewKind, } from "./FileView";
 export type { LightboxImage } from "./Lightbox";
 export { default as Lightbox } from "./Lightbox";
 export type { LogTableEntry } from "./LogEntriesTable";
 export { default as LogEntriesTable } from "./LogEntriesTable";
-export { default as MarkdownView, renderSafeMarkdown, type MarkdownRenderOptions, type MarkdownViewProps } from "./MarkdownView";
+export { default as MarkdownView, type MarkdownRenderOptions, type MarkdownViewProps, renderSafeMarkdown } from "./MarkdownView";
 export { Pagination, type PaginationProps } from "./Pagination";
 export type { PdfPreviewProps, PdfPreviewRequest } from "./PdfPreview";
 export { default as PdfPreview } from "./PdfPreview";

package/dist/types/feedback/InlineGuidance.d.ts

@@ -3,6 +3,7 @@ import type { IntentTone } from "../semantics";
 export type InlineGuidanceProps = Omit<JSX.HTMLAttributes<HTMLDivElement>, "children" | "class"> & {
     children: JSX.Element;
     tone?: IntentTone;
+    loading?: boolean;
     icon?: string | false;
     class?: string;
 };

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

@@ -1,6 +1,8 @@
 import type { JSX } from "solid-js";
 export type DialogClose<T> = (result?: T) => void;
 export type OpenDialogOptions = {
+    /** Close only this dialog when its owning operation is cancelled. */
+    signal?: AbortSignal;
     panelClassName?: string;
     contentClassName?: string;
     initialFocus?: "first-input" | "none" | ((dialog: HTMLDialogElement) => HTMLElement | null);
@@ -9,8 +11,17 @@ export type OpenDialogOptions = {
 };
 export type DialogRender<T> = (close: DialogClose<T>, context: {
     dialog: HTMLDialogElement;
+    /** Switch this entry between a modal and a modeless window without remounting. */
+    setModal: (modal: boolean) => void;
+    /** Set viewport coordinates, or restore the panel stylesheet position with null. */
+    setPosition: (position: {
+        x: number;
+        y: number;
+    } | null) => void;
     /** Route Escape/backdrop through the same guarded handler as Cancel and X. */
     setDismissHandler: (handler: () => void | Promise<void>) => void;
+    /** Request dismissal through this entry's cancellation policy and guard. */
+    requestDismiss: () => Promise<void>;
 }) => JSX.Element;
 export type DialogCore = {
     open: <T>(view: DialogRender<T>, options?: OpenDialogOptions) => Promise<T | undefined>;

package/dist/types/feedback/prompts.d.ts

@@ -1,6 +1,7 @@
 import { type JSX } from "solid-js";
 import { type OpenDialogOptions } from "./dialog-core";
 export interface DialogOptions {
+    signal?: AbortSignal;
     title?: string;
     ariaLabel?: string;
     icon?: string;
@@ -124,6 +125,7 @@ type InferFormValues<T extends Record<string, FieldSchema>> = {
 };
 type PromptFormValue = string | number | boolean | string[] | undefined;
 type PromptFormOptions<T extends Record<string, FieldSchema>> = {
+    signal?: AbortSignal;
     title?: string;
     ariaLabel?: string;
     icon?: string;

package/dist/types/feedback/toast.d.ts

@@ -1,14 +1,20 @@
 export type ToastVariant = "default" | "success" | "error";
 export type ToastAction = {
     label: string;
+} & ({
     href: string;
-};
+} | {
+    onClick: () => void;
+});
 export type ToastOptions = {
     variant?: ToastVariant;
     duration?: number;
     iconClass?: string;
     title?: string;
     action?: ToastAction | null;
+    /** Fraction from 0 to 1, or an indeterminate activity indicator. null removes it. */
+    progress?: number | "indeterminate" | null;
+    dismissLabel?: string;
 };
 export type ToastHandle = {
     dismiss: () => void;

package/dist/types/inputs/markdown/MarkdownEditor.d.ts

@@ -13,11 +13,15 @@ export type MarkdownEditorProps = ValueFieldProps<string> & {
     abbreviations?: Record<string, string>;
     completions?: readonly Completion[];
     showStats?: boolean;
-    variant?: "default" | "paper";
+    variant?: "default" | "paper" | "embedded";
     fill?: boolean;
+    /** Groups save and close at the end of the toolbar. The caller owns navigation and unsaved-change confirmation. */
+    onClose?: () => void;
     onSave?: () => void;
     saveDisabled?: boolean;
     saving?: boolean;
+    /** Shows a successful-save check. The caller clears it after a brief delay or the next edit. */
+    saved?: boolean;
     toolbarTrailing?: JSX.Element;
 };
 export declare function MarkdownEditor(props: MarkdownEditorProps): JSX.Element;

package/dist/types/intl/Format.d.ts

@@ -51,6 +51,14 @@ export type FormatRelativeTimeProps = TimeElementProps & LocaleProp & FallbackPr
     /** IANA timezone used to select calendar-relative labels. Defaults to `"UTC"`. */
     timeZone?: string;
 };
+export type FormatRelativeDateProps = TimeElementProps & LocaleProp & FallbackProp & {
+    /** A Gregorian calendar date in strict YYYY-MM-DD format, never timezone-shifted. */
+    value: string | null | undefined;
+    /** Calendar date, Date, or ISO timestamp with an explicit offset. Defaults to now. */
+    base?: Date | string;
+    /** Zone used to read the base instant as a calendar day. Defaults to UTC. */
+    timeZone?: string;
+};
 export type FormatDurationProps = TimeElementProps & LocaleProp & FallbackProp & {
     from: Date | string | null | undefined;
     to: Date | string | null | undefined;
@@ -78,6 +86,7 @@ export declare const Format: {
     readonly Time: (props: FormatDateProps) => JSX.Element;
     readonly DateTime: (props: FormatDateProps) => JSX.Element;
     readonly RelativeTime: (props: FormatRelativeTimeProps) => JSX.Element;
+    readonly RelativeDate: (props: FormatRelativeDateProps) => JSX.Element;
     readonly Duration: (props: FormatDurationProps) => JSX.Element;
     readonly DurationMs: (props: FormatDurationMsProps) => JSX.Element;
 };

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

@@ -1,4 +1,4 @@
-export type { FormatBytesProps, FormatCurrencyProps, FormatDateProps, FormatDateTimeProps, FormatDurationMsProps, FormatDurationProps, FormatNumberProps, FormatPercentProps, FormatRelativeTimeProps, FormatTimeProps, } from "./Format";
+export type { FormatBytesProps, FormatCurrencyProps, FormatDateProps, FormatDateTimeProps, FormatDurationMsProps, FormatDurationProps, FormatNumberProps, FormatPercentProps, FormatRelativeDateProps, FormatRelativeTimeProps, FormatTimeProps, } from "./Format";
 export { Format } from "./Format";
 export type { LocaleProviderProps } from "./locale";
 export { LocaleProvider, useLocale } from "./locale";

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

@@ -1,4 +1,19 @@
 declare const uiMessages: import("@k2b/stdlib").Catalog<{
+    chartView: string;
+    chartDiagram: string;
+    chartData: string;
+    chartSeries: string;
+    chartOnly: string;
+    chartShowAll: string;
+    chartShowing: string;
+    chartSelectedDatum: string;
+    chartReference: string;
+    chartCurrent: string;
+    chartPinReference: string;
+    chartRemoveComparison: string;
+    chartPreviousData: string;
+    chartCopyData: string;
+    chartCopyFailed: string;
     actions: string;
     add: string;
     addTag: string;
@@ -152,6 +167,7 @@ declare const uiMessages: import("@k2b/stdlib").Catalog<{
     commands: string;
     dropFilesToAttach: string;
     conversation: string;
+    jumpToLatest: string;
     conversationMessages: ({ label }: {
         label: string;
     }) => string;
@@ -213,6 +229,10 @@ declare const uiMessages: import("@k2b/stdlib").Catalog<{
     filterActions: string;
     info: string;
     interactiveLineChart: string;
+    interactiveChart: string;
+    chartFields: ({ key }: {
+        key: string;
+    }) => string;
     interactiveMap: string;
     interactiveTimeline: string;
     ok: string;
@@ -355,12 +375,22 @@ declare const uiMessages: import("@k2b/stdlib").Catalog<{
     markdownFormatting: string;
     numberedListShortcut: string;
     quote: string;
+    csvSettings: string;
+    csvEncoding: string;
+    csvSeparator: string;
+    csvDefaultSeparator: string;
+    csvComma: string;
+    csvSemicolon: string;
+    csvTab: string;
+    csvView: string;
+    csvRaw: string;
     delimitedFileEmpty: string;
     edit: string;
     emptyFile: string;
     failedLoadFile: string;
     noInlinePreview: string;
-    previewLimited: string;
+    previewMoreLines: (n: number) => string;
+    previewColumnsLimited: string;
     textEditor: string;
     audioUnsupported: string;
     videoUnsupported: string;

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

@@ -1,9 +1,12 @@
 import { type LinkNavigateEvent, type NavigationScrollMode } from "@k2b/ssr/nav";
 import { type JSX } from "solid-js";
 import { type AppWorkspaceLayoutState } from "./app-workspace-state";
+import type { ScrollAreaProps } from "./ScrollArea";
 export type AppWorkspaceProps = {
     children: JSX.Element;
     class?: string;
+    /** A host with its own mobile chrome can use the full canvas below 1024px. */
+    mobileSurface?: "contained" | "flush";
     resizable?: boolean;
     /**
      * Restores a persisted layout when the workspace mounts. Persistence itself
@@ -33,6 +36,7 @@ export type AppWorkspaceMainProps = {
     class?: string;
     mobilePane?: string;
     scroll?: boolean;
+    scrollFade?: boolean;
     scrollPreserveKey?: string | false;
     "aria-busy"?: boolean | "true" | "false";
 };
@@ -48,6 +52,7 @@ export type AppWorkspaceMainPaneProps = {
     maxSize?: number;
     class?: string;
     scroll?: boolean;
+    scrollFade?: boolean;
     children: JSX.Element;
 };
 export type AppWorkspaceDetailWidth = "sm" | "md" | "lg" | "xl";
@@ -75,6 +80,7 @@ export type AppWorkspaceBottomDrawerProps = {
     resizable?: boolean;
 };
 export type AppWorkspaceSidebarProps = {
+    label?: string;
     children: JSX.Element;
     class?: string;
     resizable?: boolean;
@@ -84,32 +90,46 @@ export type AppWorkspaceSidebarProps = {
     minSize?: number;
     maxSize?: number;
 };
-export type AppWorkspaceSidebarMobileTriggerProps = {
-    label: string;
-};
-export type AppWorkspaceSidebarMobileProps = {
-    children: JSX.Element;
-};
-export type AppWorkspaceSidebarMobileItemsProps = {
-    children: JSX.Element;
-    scrollPreserveKey?: string | false;
-};
 export type AppWorkspaceSidebarVisibility = "always" | "expanded" | "collapsed";
 export type AppWorkspaceSidebarAccessoryVisibility = "always" | "hover";
-export type AppWorkspaceSidebarBodyProps = {
+type AppWorkspaceSidebarContentProps = {
     children: JSX.Element;
     class?: string;
     scrollPreserveKey?: string | false;
     sidebarMode?: AppWorkspaceSidebarVisibility;
 };
-export type AppWorkspaceSidebarSectionProps = AppWorkspaceSidebarBodyProps & {
+export type AppWorkspaceSidebarBodyProps = AppWorkspaceSidebarContentProps & {
+    scrollFade?: boolean;
+};
+export type AppWorkspaceSidebarSectionProps = AppWorkspaceSidebarContentProps & {
     title?: string;
+    icon?: string;
+    count?: number;
+    collapsible?: boolean;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
     actions?: JSX.Element;
 };
 export type AppWorkspaceSidebarItemTone = "default" | "success" | "danger";
 export type AppWorkspaceSidebarIconActionTone = "default" | "success" | "danger";
 export type AppWorkspaceSidebarItemProps = {
     children: JSX.Element;
+    /** Card rows add a quiet context header above the main label. */
+    variant?: "row" | "card";
+    context?: JSX.Element;
+    contextMeta?: JSX.Element;
+    /** Passive second line; keep controls in actions or preview. */
+    description?: JSX.Element;
+    /** Interactive details, also reachable through a dedicated button. */
+    preview?: {
+        label: string;
+        content: JSX.Element | ((close: () => void) => JSX.Element);
+        trigger?: "action" | "row";
+        align?: "center" | "end";
+        viewportSize?: ScrollAreaProps["viewportSize"];
+        onOpenChange?: (open: boolean) => void;
+    };
     href?: string;
     /** Document navigation by default; opt into enhanced navigation only when the owning island applies the target state. */
     navigation?: "enhanced" | "document";
@@ -135,7 +155,7 @@ export type AppWorkspaceSidebarItemProps = {
     data?: Record<string, string | number | boolean | null | undefined>;
     sidebarMode?: AppWorkspaceSidebarVisibility;
 };
-export type AppWorkspaceSidebarIconGridProps = AppWorkspaceSidebarBodyProps & {
+export type AppWorkspaceSidebarIconGridProps = AppWorkspaceSidebarContentProps & {
     title?: string;
     columns?: 2 | 3;
 };
@@ -170,6 +190,7 @@ export type AppWorkspaceSidebarItemMetaProps = {
 export type AppWorkspaceSidebarItemActionProps = {
     icon?: string;
     label: string;
+    disabled?: boolean;
     /** Hide the action on fine pointers until the row is hovered or keyboard-focused. */
     visibility?: AppWorkspaceSidebarAccessoryVisibility;
     href?: string;
@@ -230,16 +251,12 @@ type AppWorkspaceComponent = ((props: AppWorkspaceProps) => JSX.Element) & {
     Detail: (props: AppWorkspaceDetailProps) => JSX.Element;
     BottomDrawer: (props: AppWorkspaceBottomDrawerProps) => JSX.Element;
     Sidebar: (props: AppWorkspaceSidebarProps) => JSX.Element;
-    SidebarMobileTrigger: (props: AppWorkspaceSidebarMobileTriggerProps) => JSX.Element;
-    SidebarMobile: (props: AppWorkspaceSidebarMobileProps) => JSX.Element;
-    SidebarMobileItems: (props: AppWorkspaceSidebarMobileItemsProps) => JSX.Element;
-    SidebarMobileBody: (props: AppWorkspaceSidebarBodyProps) => JSX.Element;
     SidebarDesktop: (props: {
         children: JSX.Element;
     }) => JSX.Element;
     SidebarSection: (props: AppWorkspaceSidebarSectionProps) => JSX.Element;
     SidebarBody: (props: AppWorkspaceSidebarBodyProps) => JSX.Element;
-    SidebarFooter: (props: AppWorkspaceSidebarBodyProps) => JSX.Element;
+    SidebarFooter: (props: AppWorkspaceSidebarContentProps) => JSX.Element;
     SidebarItem: (props: AppWorkspaceSidebarItemProps) => JSX.Element;
     SidebarItemIcon: (props: AppWorkspaceSidebarItemIconProps) => JSX.Element;
     SidebarItemLabel: (props: AppWorkspaceSidebarItemLabelProps) => JSX.Element;

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

@@ -0,0 +1,23 @@
+import { type JSX } from "solid-js";
+export declare const bottomSheetOptions: {
+    panelClassName: string;
+    contentClassName: string;
+};
+export type BottomSheetProps = {
+    children: JSX.Element;
+    /** Pass dialogCore's render context requestDismiss, never the completion callback. */
+    onDismiss: () => void | Promise<void>;
+    dismissDisabled?: boolean;
+    dismissLabel?: string;
+    handle?: boolean;
+};
+declare function BottomSheetRoot(props: BottomSheetProps): JSX.Element;
+/** Bottom-edge presentation; dialogCore continues to own all modal state. */
+declare const BottomSheet: typeof BottomSheetRoot & {
+    Header: (props: import("./PanelDialog").PanelDialogHeaderProps) => JSX.Element;
+    Body: (props: import("./PanelDialog").PanelDialogBodyProps) => JSX.Element;
+    Footer: (props: import("./PanelDialog").PanelDialogFooterProps) => JSX.Element;
+    Section: (props: import("./PanelDialog").PanelDialogSectionProps) => JSX.Element;
+    Tabs: <T extends string>(props: import("./PanelDialog").PanelDialogTabsProps<T>) => JSX.Element;
+};
+export default BottomSheet;

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

@@ -21,6 +21,7 @@ export type DetailPanelHeaderProps = DetailPanelHeaderBaseProps & ({
     icon?: string;
 });
 export type DetailPanelBodyProps = {
+    scrollFade?: boolean;
     children: JSX.Element;
     scrollPreserveKey?: string;
     class?: string;

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

@@ -0,0 +1,8 @@
+import type { NavigationController } from "./navigation-model";
+export type NavigationProps = {
+    navigation: NavigationController;
+    label: string;
+    /** A host can finish dismissing its menu before the selected operation runs. */
+    beforeSelect?: () => boolean | void | Promise<boolean | void>;
+};
+export default function Navigation(props: NavigationProps): import("solid-js").JSX.Element;

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

@@ -16,6 +16,7 @@ export type PanelDialogHeaderProps = {
 export type PanelDialogBodyProps = {
     children: JSX.Element;
     scrollPreserveKey?: string;
+    scrollFade?: boolean;
 };
 export type PanelDialogFooterProps = {
     children: JSX.Element;
@@ -26,7 +27,19 @@ export type PanelDialogSectionProps = {
     icon?: string;
     actions?: JSX.Element;
     children: JSX.Element;
-};
+} & ({
+    hideable?: false;
+    open?: never;
+    defaultOpen?: never;
+    onOpenChange?: never;
+    disabled?: never;
+} | {
+    hideable: true;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    disabled?: boolean;
+});
 export type PanelDialogTabOption<T extends string = string> = {
     value: T;
     label: JSX.Element;