@k2b/ui 0.28.0 → 0.29.0

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

@@ -21,5 +21,6 @@ export declare function ContextMenu(props: ContextMenuProps): JSX.Element;
 export declare function ContextMenuBase(props: ContextMenuProps & {
     openAt?: (open: (x: number, y: number) => void) => void;
     title?: string;
+    closeWith?: (close: () => void) => void;
 }): JSX.Element;
 export default ContextMenu;

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

@@ -0,0 +1,29 @@
+import { type JSX } from "solid-js";
+import { type DragPayload } from "./drag-and-drop";
+export type { DragPayload } from "./drag-and-drop";
+export { activeDrag } from "./drag-and-drop";
+export type DragSourceProps<Type extends string = string> = {
+    /** Read when the drag starts, so a selection can decide what is dragged. */
+    payload: DragPayload<Type>;
+    disabled?: boolean;
+    class?: string;
+    children: JSX.Element;
+};
+export type DropTargetProps<Type extends string = string> = {
+    /** The payload types this target takes. */
+    accept: readonly Type[];
+    /** Names the target in announcements and in the keyboard path, such as "Archive". */
+    label: string;
+    onDrop: (payload: DragPayload<Type>) => void;
+    /** The target takes nothing now, for example without access; it refuses every drop. */
+    disabled?: boolean;
+    class?: string;
+    children: JSX.Element;
+};
+export declare function DragSource<Type extends string = string>(props: DragSourceProps<Type>): JSX.Element;
+export declare function DropTarget<Type extends string = string>(props: DropTargetProps<Type>): JSX.Element;
+/**
+ * Starts the optional keyboard pick-up sequence from a menu entry. Focus returns to `origin` afterwards, or to its
+ * nearest focusable ancestor, such as the group of a `GestureMenu`.
+ */
+export declare function useKeyboardDrag(): (payload: DragPayload, origin: HTMLElement) => void;

package/dist/types/actions/drag-and-drop-messages.d.ts

@@ -0,0 +1,35 @@
+declare const dragAndDropMessages: import("@k2b/stdlib").Catalog<{
+    pickedUp: ({ label }: {
+        label: string;
+    }) => string;
+    pickedUpKeyboard: ({ label, count }: {
+        label: string;
+        count: number;
+    }) => string;
+    choice: ({ target, index, count }: {
+        target: string;
+        index: number;
+        count: number;
+    }) => string;
+    over: ({ target }: {
+        target: string;
+    }) => string;
+    refused: ({ target, label }: {
+        target: string;
+        label: string;
+    }) => string;
+    dropped: ({ label, target }: {
+        label: string;
+        target: string;
+    }) => string;
+    cancelled: ({ label }: {
+        label: string;
+    }) => string;
+    noTarget: ({ label }: {
+        label: string;
+    }) => string;
+}>;
+export type DragAndDropMessages = ReturnType<(typeof dragAndDropMessages)["resolve"]>["t"];
+export declare const useDragAndDropMessages: () => (() => DragAndDropMessages);
+export declare const checkDragAndDropMessages: () => import("@k2b/stdlib").CatalogIssue[];
+export {};

package/dist/types/actions/drag-and-drop.d.ts

@@ -0,0 +1,36 @@
+import type { DragAndDropMessages } from "./drag-and-drop-messages";
+export type DragPayload<Type extends string = string> = {
+    /** What is dragged, such as "mail.message"; targets accept by this. */
+    type: Type;
+    /** Opaque to @k2b/ui: the application's reference, such as an ID or a ref string. */
+    value: string;
+    /** Names the item in the preview and in announcements. */
+    label: string;
+    /** Tabler class for the preview, such as "ti ti-mail". */
+    icon?: string;
+    /** More than one item is dragged: shown as a count on the preview. */
+    count?: number;
+};
+/** Reactive payload of the drag in progress, or undefined. */
+export declare const activeDrag: () => DragPayload | undefined;
+/** Internal hand-over to the gesture menu that owns this press. */
+export declare const onPointerDragStart: (listener: (pointerId: number) => void) => (() => void);
+type Target = {
+    element: HTMLElement;
+    accept: readonly string[];
+    label: string;
+    messages: DragAndDropMessages;
+    disabled?: boolean;
+    drop: (payload: DragPayload) => void;
+};
+export declare const registerDropTarget: (element: HTMLElement, initial: Omit<Target, "element">) => {
+    update(next: Omit<Target, "element">): void;
+    dispose(): void;
+};
+export declare const bindDragSource: (source: HTMLElement, read: () => {
+    payload: DragPayload;
+    disabled?: boolean;
+    messages: DragAndDropMessages;
+}) => (() => void);
+export declare const startKeyboardDrag: (input: DragPayload, origin: HTMLElement, messages: DragAndDropMessages) => (() => void);
+export {};

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

@@ -6,6 +6,8 @@ export type { CopyButtonProps, CopyButtonValue } from "./CopyButton";
 export { CopyButton } from "./CopyButton";
 export type { DisclosureProps } from "./Disclosure";
 export { Disclosure } from "./Disclosure";
+export type { DragPayload, DragSourceProps, DropTargetProps } from "./DragAndDrop";
+export { activeDrag, DragSource, DropTarget, useKeyboardDrag } from "./DragAndDrop";
 export type { DropdownAction, DropdownActionBase, DropdownChoice, DropdownItemProps, DropdownPosition, DropdownProps, DropdownSection, DropdownTriggerProps, } from "./Dropdown";
 export { Dropdown, DropdownItem, dropdownPosition } from "./Dropdown";
 export type { FilterChipOption, FilterChipProps, FilterChipSection } from "./FilterChip";

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

@@ -6,9 +6,14 @@ export type ChatCommandContext = {
     focus: () => void;
     openModelSelection: () => Promise<string | null>;
 };
-/** An action can cancel and restore its token, or report a short completion message. */
+/**
+ * An action can cancel and restore its token, report a short completion message, or hand back a reference chosen in a
+ * dialog: `mention` takes the token's place exactly as a `mention` row does, and Ctrl/⌘+Z brings the token back.
+ */
 export type ChatCommandResult = void | "cancelled" | {
     done: string;
+} | {
+    mention: ChatAttachment;
 };
 /** A fixed place in the slash list. Sections keep the given order, also while searching. */
 export type ChatCommandSection = {
@@ -59,6 +64,11 @@ export type ChatCommand = {
     action?: (context: ChatCommandContext) => ChatCommandResult | Promise<ChatCommandResult>;
     /** Selecting a reference inserts its display name and retains its opaque payload. */
     mention?: ChatAttachment;
+    /**
+     * Opens the composer's own file selection, as "Attach files" in the add menu does, within the key or click that chose
+     * the row, so the device's file dialog can still open. The token leaves; choosing nothing brings it back.
+     */
+    attachFiles?: boolean;
     label?: string;
     disabled?: boolean;
 };
@@ -104,6 +114,14 @@ export type ChatComposerProps = {
     commandSections?: readonly ChatCommandSection[];
     commandScopes?: readonly ChatCommandScope[];
     searchCommands?: (query: string, signal: AbortSignal, search: ChatCommandSearch) => Promise<readonly ChatCommand[]>;
+    /**
+     * The last row for typed text or a scope, built at once from the query, such as "Search Cloud for “q3”". It is no
+     * match: unscoped it follows "Nothing found for …"; in a scope it ends the scope's rows. Not called for the overview.
+     */
+    commandFallback?: (search: {
+        query: string;
+        scope?: string;
+    }) => ChatCommand | undefined;
     mentions?: readonly ChatMention[];
     onMentionsChange?: (mentions: readonly ChatMention[]) => void;
     /** Shared surface above the editor; suggestions temporarily replace this content. */

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

@@ -0,0 +1,133 @@
+import { type JSX } from "solid-js";
+import type { ChatDecisionAnswer, ChatDecisionReason, ChatDecisionState, ChatOutcomeLine, ChatPreviewHeaderRow } from "./types";
+export type ChatDecisionProps = {
+    /** `open` shows the question; every other state shows `outcome` in its place. */
+    state: ChatDecisionState;
+    /** The question as one sentence, usually with `ReferenceChip`s. */
+    sentence: JSX.Element;
+    /** Why this question is asked, in the platform's words. */
+    reason: ChatDecisionReason;
+    /** The thing itself, usually `Chat.Preview`. */
+    preview?: JSX.Element;
+    /** The main answer, named by verb and target ("Send to Lea"). `danger` for deletions, `primary` for requests. */
+    confirm: ChatDecisionAnswer & {
+        variant?: "ai" | "primary" | "danger";
+    };
+    /** The other answer ("Don't send"). */
+    decline: ChatDecisionAnswer;
+    /** An optional quiet third answer after the buttons, such as "Yes, and don't ask again in this chat". */
+    remember?: ChatDecisionAnswer;
+    /** Turns `confirm` and `remember` off; this reason replaces `reason` in the same place. */
+    unavailable?: ChatDecisionReason;
+    /** The result line shown in every state but `open`, usually `Chat.Outcome`. */
+    outcome?: JSX.Element;
+    /** Receives a rejected promise from an answer's `onSelect`. */
+    onAnswerError?: (error: unknown) => void;
+    anchorId?: string | number;
+    class?: string;
+};
+/**
+ * A question the person answers in the conversation: one sentence, why it is asked, the thing itself, and two answers.
+ * An answer collapses it at once to its outcome line, which takes the focus and is announced.
+ */
+export declare function ChatDecision(props: ChatDecisionProps): JSX.Element;
+export type ChatOutcomeProps = {
+    /**
+     * Every line one flow can show, such as running and done. All of them share one cell, so the line is as high as
+     * the longest and switching between them moves nothing.
+     */
+    lines: Readonly<Record<string, ChatOutcomeLine>>;
+    /** The key of the visible line. */
+    current: string;
+    /** Receives an error thrown or rejected by a line's `action`. */
+    onActionError?: (error: unknown) => void;
+    anchorId?: string | number;
+    class?: string;
+};
+/**
+ * One line that says what happened: running, done, off, waiting, warning, or error. Changes are announced through a
+ * polite live region; the line itself can take the focus.
+ */
+export declare function ChatOutcome(props: ChatOutcomeProps): JSX.Element;
+export type ChatPreviewProps = {
+    children: JSX.Element;
+    class?: string;
+};
+/** The thing a question is about, as calm text on the sentence's edge: no surface, no column. */
+declare function ChatPreviewRoot(props: ChatPreviewProps): JSX.Element;
+export type ChatPreviewHeaderProps = {
+    /** One row per field, such as From, To, Cc, and Bcc; the label stands right before its value. */
+    rows: readonly ChatPreviewHeaderRow[];
+    /** A last line, such as when the message goes out. */
+    note?: JSX.Element;
+};
+declare function ChatPreviewHeader(props: ChatPreviewHeaderProps): JSX.Element;
+export type ChatPreviewTitleProps = {
+    children: JSX.Element;
+    meta?: JSX.Element;
+};
+/** The thing's name in the text's own face, with optional quiet facts after it. */
+declare function ChatPreviewTitle(props: ChatPreviewTitleProps): JSX.Element;
+/** A rule or instruction as one sentence, such as what a routine does; chips and marks may stand inside. */
+declare function ChatPreviewSentence(props: {
+    children: JSX.Element;
+}): JSX.Element;
+/** The first lines of a longer text. It keeps its line breaks, shows about three lines, and fades out. */
+declare function ChatPreviewExcerpt(props: {
+    children: JSX.Element;
+}): JSX.Element;
+export type ChatPreviewReadMoreProps = {
+    href: string;
+    children: JSX.Element;
+    /** Tooltip, such as "Opens exactly this version of the draft". */
+    title?: string;
+};
+/** Opens the whole thing at exactly the version the question shows. */
+declare function ChatPreviewReadMore(props: ChatPreviewReadMoreProps): JSX.Element;
+/** A list of lines with a name, such as "What the routine may do". */
+declare function ChatPreviewLines(props: {
+    label?: string;
+    children: JSX.Element;
+}): JSX.Element;
+export type ChatPreviewLineProps = {
+    /** Icon class; the text after it starts 1.5rem from the edge. */
+    icon: string;
+    /** Icon colour, such as the PDF colour of an attachment. */
+    accent?: string;
+    /** `muted` for limits and notes, `warning` for an application's own warning. */
+    tone?: "default" | "muted" | "warning";
+    /** Marks the whole line as new or removed. */
+    mark?: "added" | "removed";
+    /** Quiet facts after the text, such as a file size. */
+    meta?: JSX.Element;
+    children: JSX.Element;
+};
+/** One line led by an icon: a consequence, a right, an attachment, or a warning. */
+declare function ChatPreviewLine(props: ChatPreviewLineProps): JSX.Element;
+export type ChatPreviewPeopleProps = {
+    /** The first few people; their avatars overlap at the start of the line. */
+    people: readonly {
+        name: string;
+        src?: string | null;
+    }[];
+    /** The names as text, such as "Lea Berg, Tom Weber and 3 others". */
+    children: JSX.Element;
+};
+declare function ChatPreviewPeople(props: ChatPreviewPeopleProps): JSX.Element;
+export declare const ChatPreview: typeof ChatPreviewRoot & {
+    Header: typeof ChatPreviewHeader;
+    Title: typeof ChatPreviewTitle;
+    Sentence: typeof ChatPreviewSentence;
+    Excerpt: typeof ChatPreviewExcerpt;
+    ReadMore: typeof ChatPreviewReadMore;
+    Lines: typeof ChatPreviewLines;
+    Line: typeof ChatPreviewLine;
+    People: typeof ChatPreviewPeople;
+};
+export type ChatMarkProps = {
+    change: "added" | "removed";
+    children: JSX.Element;
+};
+/** Marks new or removed words; screen readers hear "new:" or "removed:" first. */
+export declare function ChatMark(props: ChatMarkProps): JSX.Element;
+export {};

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

@@ -15,7 +15,8 @@ export type ChatMessageProps = {
     class?: string;
 };
 export type ChatActivityProps = {
-    label: string;
+    /** The step as text, or as a sentence with `ReferenceChip`s. */
+    label: JSX.Element;
     /** Spelled-out name for an expandable row whose visible text abbreviates, such as durations. */
     ariaLabel?: string;
     description?: string;
@@ -27,6 +28,8 @@ export type ChatActivityProps = {
     tone?: ChatActivityTone;
     /** Marks the activity as running with the shared accent sweep. */
     busy?: boolean;
+    /** Lets label and description wrap instead of ending in an ellipsis, for a system line whose whole sentence matters. */
+    wrap?: boolean;
     trailing?: JSX.Element;
     /** Controlled disclosure state. Omit to keep native details behavior. */
     open?: boolean;

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

@@ -20,7 +20,8 @@ export type ChatActivityItem = {
     kind: "activity";
     /** Unique within the timeline. A record with a known id updates its row in place instead of replacing it. */
     id: string;
-    label: string;
+    /** The step as text, or as a sentence with `ReferenceChip`s. */
+    label: JSX.Element;
     description?: string;
     icon?: string;
     leading?: JSX.Element;

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

@@ -1,5 +1,8 @@
 export declare const chatMessages: import("@k2b/stdlib").Catalog<{
     commandFailed: string;
+    commandDraftChanged: string;
+    markAdded: string;
+    markRemoved: string;
     commandSelected: string;
     attachments: string;
     assistant: string;

package/dist/types/chat/command-search.d.ts

@@ -30,11 +30,14 @@ export declare function chatCommandListModel(input: {
     searchResultsFresh: boolean;
     searchSettled: boolean;
     searching: boolean;
+    /** The composer's `commandFallback` row for this query, if any. */
+    fallback?: ChatCommand;
 }): {
     scope?: ChatCommandScope;
     groups: Group[];
     rows: ChatCommandRow[];
     empty: boolean;
+    fallback?: ChatCommandRow;
 };
 /** Use the composer ranking rules to filter consumer-owned server rows. */
 export declare const matchesChatCommand: (command: ChatCommand, query: string) => boolean;

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

@@ -3,15 +3,17 @@ import { ChatContextPanel, ChatContextPopup } from "./ChatContextPopup";
 import { ChatTasks } from "./ChatTasks";
 export type { ChatTask, ChatTasksProps } from "./ChatTasks";
 import { ChatComposer } from "./ChatComposer";
+import { ChatDecision, ChatMark, ChatOutcome } from "./ChatDecision";
 import { ChatActivity, ChatContextUsage, ChatMessage } from "./ChatPrimitives";
 import { ChatRoot } from "./ChatRoot";
 import { ChatTimeline } from "./ChatTimeline";
 export type { ChatCommand, ChatCommandContext, ChatCommandResult, ChatCommandScope, ChatCommandSearch, ChatCommandSection, ChatComposerProps, ChatFileSelection, ChatPasteHandler, } from "./ChatComposer";
+export type { ChatDecisionProps, ChatMarkProps, ChatOutcomeProps, ChatPreviewHeaderProps, ChatPreviewLineProps, ChatPreviewPeopleProps, ChatPreviewProps, ChatPreviewReadMoreProps, ChatPreviewTitleProps, } from "./ChatDecision";
 export type { ChatActivityProps, ChatContextUsageProps, ChatMessageProps } from "./ChatPrimitives";
 export { formatChatTokens } from "./ChatPrimitives";
 export type { ChatRootProps } from "./ChatRoot";
 export type { ChatActivityItem, ChatMessageItem, ChatTimelineItem, ChatTimelineProps } from "./ChatTimeline";
-export type { ChatAction, ChatActivityTone, ChatAttachment, ChatComposerEmoji, ChatComposerMicrophone, ChatComposerState, ChatContextUsageData, ChatDictationState, ChatMention, ChatMessageStatus, ChatModelOption, ChatRole, ChatSubmitInput, ChatSubmitIntent, ChatUsage, } from "./types";
+export type { ChatAction, ChatActivityTone, ChatAttachment, ChatComposerEmoji, ChatComposerMicrophone, ChatComposerState, ChatContextUsageData, ChatDecisionAnswer, ChatDecisionReason, ChatDecisionState, ChatDictationState, ChatMention, ChatMessageStatus, ChatModelOption, ChatOutcomeLine, ChatOutcomeTone, ChatPreviewHeaderRow, ChatPreviewPerson, ChatRole, ChatSubmitInput, ChatSubmitIntent, ChatUsage, } from "./types";
 /**
  * Portable, controlled chat surface. Applications own storage, streaming,
  * authorization, rich message rendering, and domain actions.
@@ -25,6 +27,26 @@ export declare const Chat: typeof ChatRoot & {
     ContextUsage: typeof ChatContextUsage;
     ContextPopup: typeof ChatContextPopup;
     ContextPanel: typeof ChatContextPanel;
+    Decision: typeof ChatDecision;
+    Outcome: typeof ChatOutcome;
+    Preview: ((props: import("./ChatDecision").ChatPreviewProps) => import("solid-js").JSX.Element) & {
+        Header: (props: import("./ChatDecision").ChatPreviewHeaderProps) => import("solid-js").JSX.Element;
+        Title: (props: import("./ChatDecision").ChatPreviewTitleProps) => import("solid-js").JSX.Element;
+        Sentence: (props: {
+            children: import("solid-js").JSX.Element;
+        }) => import("solid-js").JSX.Element;
+        Excerpt: (props: {
+            children: import("solid-js").JSX.Element;
+        }) => import("solid-js").JSX.Element;
+        ReadMore: (props: import("./ChatDecision").ChatPreviewReadMoreProps) => import("solid-js").JSX.Element;
+        Lines: (props: {
+            label?: string;
+            children: import("solid-js").JSX.Element;
+        }) => import("solid-js").JSX.Element;
+        Line: (props: import("./ChatDecision").ChatPreviewLineProps) => import("solid-js").JSX.Element;
+        People: (props: import("./ChatDecision").ChatPreviewPeopleProps) => import("solid-js").JSX.Element;
+    };
+    Mark: typeof ChatMark;
 };
 export { matchesChatCommand } from "./command-search";
 export { reconcileChatMentions } from "./composer-document";

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

@@ -1,7 +1,60 @@
+import type { JSX } from "solid-js";
 import type { EmojiSkinTone } from "../inputs/emoji/emoji-index";
 export type ChatRole = "user" | "assistant" | "system" | "tool";
 export type ChatMessageStatus = "pending" | "streaming" | "complete" | "error";
-export type ChatActivityTone = "neutral" | "ai" | "success" | "danger";
+/** `warning` marks a partial result or an outcome that is not yet known. */
+export type ChatActivityTone = "neutral" | "ai" | "success" | "warning" | "danger";
+/** `open` asks; `sending` while the answer is on its way; `decided` once answered; `expired` when it ran out. */
+export type ChatDecisionState = "open" | "sending" | "decided" | "expired";
+/** One answer of a question. Set the question's state in `onSelect` before awaiting anything, so it collapses at once. */
+export type ChatDecisionAnswer = {
+    label: string;
+    /** Icon class, for example `ti ti-send`. */
+    icon?: string;
+    onSelect: () => void | Promise<void>;
+};
+/** Why a question is asked, or why its main answer is off. */
+export type ChatDecisionReason = {
+    text: JSX.Element;
+    /** Icon class; the text after it starts 1.5rem from the edge. */
+    icon?: string;
+    /** `danger` for deletions, `warning` for outside content and limits. */
+    tone?: "neutral" | "danger" | "warning";
+};
+export type ChatOutcomeTone = "running" | "done" | "off" | "waiting" | "warning" | "error";
+/** One text of an outcome flow. */
+export type ChatOutcomeLine = {
+    tone: ChatOutcomeTone;
+    /** What happened, as one sentence, usually with `ReferenceChip`s. */
+    text: JSX.Element;
+    /** A quiet second sentence, such as "You declined." */
+    detail?: JSX.Element;
+    /** A formatted time after the text. */
+    time?: string;
+    /** Replaces the tone's icon, for example `ti ti-clock-x` for an expired question. */
+    icon?: string;
+    /** One text link after the line, such as "Ask again". */
+    action?: {
+        label: string;
+        onSelect: () => void | Promise<void>;
+    };
+    /** Small buttons under the line. Shown while this line is current; otherwise hidden but still reserving their row. */
+    actions?: JSX.Element;
+};
+/** A person in a preview header: the name in the text colour, then the address the message really uses. */
+export type ChatPreviewPerson = {
+    name?: string;
+    address?: string;
+};
+/** One header row, such as "To Lea Berg lea.berg@example.com". */
+export type ChatPreviewHeaderRow = {
+    label: string;
+    people?: readonly ChatPreviewPerson[];
+    /** Further content after the people, such as "and 2 more". */
+    value?: JSX.Element;
+    /** Draws the label stronger, for recipients others cannot see. */
+    emphasis?: boolean;
+};
 type ChatActionBase = {
     id: string;
     label: string;

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

@@ -25,9 +25,9 @@ import { type StateTimelineChartOptions, type StateTimelineDomain } from "./char
  * **Why so thin.** The props are a discriminated union over each
  * stdlib chart function — `kind: "line"` brings in exactly the params
  * `charts.line` expects, `kind: "bar"` brings in `charts.bar`'s, etc.
- * Options stay aligned with stdlib without renaming. Shared interactive
- * layers add bounded pan / zoom controls to maps and state timelines, plus
- * renderer-owned inspection, tooltips and optional selection for all chart kinds.
+ * Options stay aligned with stdlib without renaming. Every chart provides
+ * renderer-owned inspection, tooltips and optional selection by default.
+ * `interactive` adds bounded pan / zoom and reset controls to maps and state timelines.
  * If stdlib gains a new option, it's automatically available at every
  * callsite.
  *
@@ -75,10 +75,16 @@ export type ChartProps = {
         class?: string;
         style?: JSX.CSSProperties | string;
         labels?: ChartLabels;
+        /**
+         * Navigation for maps and state timelines: pan, zoom and reset controls.
+         * Arrows pan; Alt+arrows inspect. Every chart shows tooltips and keyboard
+         * inspection without this prop.
+         */
         interactive?: boolean;
         onSelect?: (selection: ChartSelection) => void;
         /** Controlled highlight; indices belong to this exact input snapshot. */
         selected?: ChartDatumRef | null;
+        /** Customize the always-on tooltip with a title and labeled text rows. */
         tooltip?: ChartTooltipFormatter;
         /** Optional shared X cursor for line charts. */
         cursor?: ChartCursor;

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

@@ -0,0 +1,27 @@
+import type { JSX } from "solid-js";
+/** The colour family a file's icon tile uses. `other` covers code, text, and unknown files. */
+export type FileType = "folder" | "pdf" | "image" | "sheet" | "document" | "slides" | "video" | "audio" | "archive" | "other";
+export type FileTypeIconProps = {
+    /** The file or folder name; its extension picks the glyph and the type colour. */
+    name: string;
+    mediaType?: string;
+    folder?: boolean;
+    /** Shows an open folder, for example the folder a list is showing. */
+    open?: boolean;
+    /** A Tabler icon class that replaces the glyph the name picks; the type colour still follows the name. */
+    icon?: string;
+    /** `sm` for tree rows, `md` for list rows, `lg` for grid previews. Defaults to `md`. */
+    size?: "sm" | "md" | "lg";
+    class?: string;
+};
+/** Resolve the colour family for a file or folder from its name and media type. */
+export declare const fileTypeOf: (file: {
+    name: string;
+    mediaType?: string;
+    folder?: boolean;
+}) => FileType;
+/**
+ * A file or folder glyph in a soft chip of its type colour. Folders take the app accent hook
+ * `--k2b-app-workspace-active`; code, text, and unknown files a neutral ink. The box size is fixed per `size`.
+ */
+export declare function FileTypeIcon(props: FileTypeIconProps): JSX.Element;

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

@@ -0,0 +1,49 @@
+import { type JSX } from "solid-js";
+/** The visible length of a chip; longer titles are cut in the middle. */
+export declare const REFERENCE_CHIP_MAX_CHARACTERS = 40;
+/**
+ * Shortens `text` to at most `max` visible characters by cutting its middle, so the start and an ending such as
+ * ".pdf" stay readable. Counts user-perceived characters, so an emoji is never split.
+ * @example truncateMiddle("Quarterly report for the operations team 2026.pdf", 24) // "Quarterly re…m 2026.pdf"
+ */
+export declare const truncateMiddle: (text: string, max?: number) => string;
+type ReferenceChipCommon = {
+    class?: string;
+};
+/** A thing or a place: an icon in its application colour and its title, a link while it exists. */
+export type ReferenceChipObjectProps = ReferenceChipCommon & {
+    kind: "object" | "place";
+    title: string;
+    /** Destination of the chip. Omit it, or set `gone`, when there is nothing to open. */
+    href?: string;
+    /** Icon class, for example `ti ti-mail`. */
+    icon?: string;
+    /** Icon colour, usually the owning application's accent. Sets `--k2b-reference-icon`. */
+    accent?: string;
+    /** The thing no longer exists: struck through and never a link. */
+    gone?: boolean;
+};
+/** A person: avatar and display name. The address belongs in the preview, never in the chip. */
+export type ReferenceChipPersonProps = ReferenceChipCommon & {
+    kind: "person";
+    name: string;
+    /** Avatar image; initials on a tint from the name otherwise. */
+    src?: string | null;
+    href?: string;
+};
+/** A date or time the host already formatted for the reader. */
+export type ReferenceChipTimeProps = ReferenceChipCommon & {
+    kind: "time";
+    label: string;
+    /** Machine-readable value for `<time datetime>`. */
+    dateTime?: string;
+};
+export type ReferenceChipProps = ReferenceChipObjectProps | ReferenceChipPersonProps | ReferenceChipTimeProps;
+/**
+ * A typed reference inside a sentence: a thing, a place, a person, or a time, in the calm `.k2b-reference` pill.
+ * A chip shows at most 40 characters and cuts longer titles in the middle; the full title stays its accessible name
+ * and tooltip.
+ * @example <ReferenceChip kind="object" title="Maintenance window" icon="ti ti-mail" accent="var(--app-mail)" href="/mail/…" />
+ */
+export declare function ReferenceChip(props: ReferenceChipProps): JSX.Element;
+export default ReferenceChip;

package/dist/types/content/calendar-pointer.d.ts

@@ -22,6 +22,12 @@ type CalendarPointerSessionOptions<T> = {
     /** Called on every move once the gesture is active, such as to move a token with the pointer. */
     onMove?: (clientX: number, clientY: number) => void;
 };
+/**
+ * Runs `open` once the browser has handled the pointer release that ends a drag. The browser light-dismisses an
+ * `auto` popover that opens while it dispatches that `pointerup`, as the HTML popover rules ask and Chromium 156
+ * does, so a popover that a drag opens must open after the release.
+ */
+export declare const afterPointerRelease: (open: () => void) => void;
 /**
  * Owns one pointer gesture from threshold crossing through commit or cancel.
  * Views provide geometry through `resolve`; this helper owns global cleanup,

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

@@ -25,6 +25,7 @@ export { DocCode, DocConceptGrid, DocInlineCode, DocLead, DocNote, DocPage, DocR
 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 { type FileType, FileTypeIcon, type FileTypeIconProps, fileTypeOf } from "./FileTypeIcon";
 export { canPreviewFile, default as FileView, type FileViewContent, type FileViewFile, type FileViewPreviewKind, type FileViewProps, type FileViewRenderer, type FileViewRendererProps, formatFileViewSize, getFileViewPreviewKind, } from "./FileView";
 export type { KbdProps } from "./Kbd";
 export { Kbd } from "./Kbd";
@@ -45,6 +46,8 @@ export { default as PdfPreview } from "./PdfPreview";
 export type { RangeOption, RangePickerProps } from "./RangePicker";
 export { default as RangePicker } from "./RangePicker";
 export { ReactionBar, type ReactionBarItem, type ReactionBarProps } from "./ReactionBar";
+export type { ReferenceChipObjectProps, ReferenceChipPersonProps, ReferenceChipProps, ReferenceChipTimeProps, } from "./ReferenceChip";
+export { REFERENCE_CHIP_MAX_CHARACTERS, ReferenceChip, truncateMiddle } from "./ReferenceChip";
 export type { StepsProps } from "./Steps";
 export { Steps } from "./Steps";
 export type { StructuredDataPreviewMode, StructuredDataPreviewProps, StructuredDataValue } from "./StructuredDataPreview";

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

@@ -123,9 +123,11 @@ export type AppWorkspaceSidebarProps = {
     /**
      * Below 48rem (768 px) the sidebar is hidden and the host's mobile
      * navigation takes over; from 48 to 64rem it is an overlay that a button in
-     * the workspace's head opens. `"stacked"` keeps it as a block above the
-     * content below 64rem instead, for overviews whose sidebar is the primary
-     * object list.
+     * the workspace's head opens. `"stacked"` is for overviews whose sidebar is
+     * the primary object list: below 64rem its items become one row of chips
+     * above the content, and "All" at the end of the row opens the complete
+     * sidebar in a sheet (a centered dialog from 48rem). From 64rem it is the
+     * regular sidebar column; the element is a `nav` landmark either way.
      */
     mobile?: "hidden" | "stacked";
     resizable?: boolean;

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

@@ -0,0 +1,9 @@
+import { type ResizeSeparatorOptions } from "./resize-separator";
+export type ResizeSeparatorProps = Omit<ResizeSeparatorOptions, "value"> & {
+    label: string;
+    orientation: "vertical" | "horizontal";
+    value: number;
+    controls?: string;
+    class?: string;
+};
+export default function ResizeSeparator(props: ResizeSeparatorProps): import("solid-js").JSX.Element;

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

@@ -15,6 +15,13 @@ export type TabBarProps = {
     label: string;
     /** Up to five destinations; further items are not rendered. Put the rest behind a "More" destination. */
     items: readonly TabBarItem[];
+    /**
+     * `bar` (the default) is flat on the page canvas and pads the bottom safe area. `floating` is a rounded bar that the
+     * host places above the content, away from the safe areas; its open item is a raised chip. The host may paint it
+     * with `--k2b-tab-bar-background`, color its items with `--k2b-tab-bar-color`, and color the open item with
+     * `--k2b-tab-bar-selected-background` and `--k2b-tab-bar-selected-color`.
+     */
+    variant?: "bar" | "floating";
     class?: string;
 };
 /**