@logicplanes/kaeso-ui 0.4.2 → 0.4.3

package/dist/types/components/agent-avatar/agent-avatar.d.ts

@@ -0,0 +1,94 @@
+export declare const KAESO_AGENT_AVATAR_VARIANTS: {
+    readonly size: {
+        readonly 20: {
+            readonly classes: "size-20 rounded-avatar";
+            readonly glyph: "size-14";
+            readonly stroke: 2.25;
+            readonly description: "20px";
+        };
+        readonly 24: {
+            readonly classes: "size-24 rounded-avatar";
+            readonly glyph: "size-16";
+            readonly stroke: 2;
+            readonly description: "24px: rows and lists (default)";
+        };
+        readonly 28: {
+            readonly classes: "size-28 rounded-org";
+            readonly glyph: "size-18";
+            readonly stroke: 2;
+            readonly description: "28px";
+        };
+        readonly 32: {
+            readonly classes: "size-32 rounded-org";
+            readonly glyph: "size-20";
+            readonly stroke: 1.75;
+            readonly description: "32px";
+        };
+        readonly 40: {
+            readonly classes: "size-40 rounded-org";
+            readonly glyph: "size-28";
+            readonly stroke: 1.5;
+            readonly description: "40px: an agent's own page, menus";
+        };
+    };
+};
+export declare const KAESO_AGENT_AVATAR_DEFAULT_VARIANTS: {
+    readonly size: 24;
+};
+export declare const KAESO_AGENT_ATTRIBUTION_VARIANTS: {
+    readonly size: {
+        readonly 20: {
+            readonly classes: "size-10 right-0 bottom-0 rounded-cell";
+            readonly glyph: "size-8";
+            readonly stroke: 3;
+            readonly description: "20px person, 10px agent badge";
+        };
+        readonly 24: {
+            readonly classes: "size-12 right-0 bottom-0 rounded-cell";
+            readonly glyph: "size-10";
+            readonly stroke: 2.75;
+            readonly description: "24px person, 12px agent badge (default)";
+        };
+        readonly 28: {
+            readonly classes: "size-14 right-0 bottom-0 rounded-cell";
+            readonly glyph: "size-10";
+            readonly stroke: 2.5;
+            readonly description: "28px person, 14px agent badge";
+        };
+        readonly 32: {
+            readonly classes: "size-16 right-0 bottom-0 rounded-cell";
+            readonly glyph: "size-12";
+            readonly stroke: 2.25;
+            readonly description: "32px person, 16px agent badge";
+        };
+        readonly 40: {
+            readonly classes: "size-20 right-0 bottom-0 rounded-avatar";
+            readonly glyph: "size-14";
+            readonly stroke: 2;
+            readonly description: "40px person, 20px agent badge";
+        };
+    };
+};
+export declare const KAESO_AGENT_ATTRIBUTION_DEFAULT_VARIANTS: {
+    readonly size: 24;
+};
+type AvatarSize = keyof typeof KAESO_AGENT_AVATAR_VARIANTS.size;
+export interface AgentAvatarProps {
+    name: string;
+    size?: AvatarSize | undefined;
+    decorative?: boolean | undefined;
+    className?: string | undefined;
+}
+export declare const AgentAvatar: import("react").ForwardRefExoticComponent<AgentAvatarProps & import("react").RefAttributes<HTMLSpanElement>>;
+export interface AgentAttributionProps {
+    name: string;
+    src?: string | undefined;
+    agent: {
+        name: string;
+        model: string;
+    };
+    size?: AvatarSize | undefined;
+    className?: string | undefined;
+}
+export declare const AgentAttribution: import("react").ForwardRefExoticComponent<AgentAttributionProps & import("react").RefAttributes<HTMLSpanElement>>;
+export {};

package/dist/types/components/agent-avatar/docs.d.ts

@@ -0,0 +1,19 @@
+export declare const docs: {
+    AgentAvatar: {
+        description: string;
+        props: {
+            decorative: string;
+            name: string;
+            size: string;
+        };
+    };
+    AgentAttribution: {
+        description: string;
+        props: {
+            agent: string;
+            name: string;
+            size: string;
+            src: string;
+        };
+    };
+};

package/dist/types/components/agent-avatar/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./agent-avatar.js";
+export { AGENT_MODELS, agentModel, type AgentModel } from "./models.js";
+export { modelName, useModelName } from "./model-name.js";

package/dist/types/components/agent-avatar/model-name.d.ts

@@ -0,0 +1,9 @@
+import { type UiText } from "../../i18n/context.js";
+/**
+ * The display name of a model family from the API, such as `deepseek` → "DeepSeek". Product names are never
+ * translated; `unknown` and ids the library doesn't know are "Unknown", translated through `t` (English without it).
+ * In a component, prefer `useModelName()`, which translates into the page's language.
+ */
+export declare function modelName(model: string, t?: UiText): string;
+/** `modelName` in the language of the nearest `LocaleProvider`. */
+export declare function useModelName(): (model: string) => string;

package/dist/types/components/agent-avatar/models.d.ts

@@ -0,0 +1,4 @@
+export declare const AGENT_MODELS: readonly ["claude", "gpt", "gemini", "gemma", "grok", "llama", "mistral", "deepseek", "qwen", "kimi", "glm", "minimax", "command", "nova", "phi", "granite", "jamba", "ernie", "hunyuan", "doubao", "yi", "nemotron", "olmo", "sonar", "reka", "unknown"];
+export type AgentModel = (typeof AGENT_MODELS)[number];
+/** The model family an API string names, or `unknown` for anything the library doesn't know. */
+export declare function agentModel(model: string): AgentModel;

package/dist/types/components/app-frame/app-frame.d.ts

@@ -30,12 +30,6 @@ export interface AppFrameProps {
     className?: string | undefined;
 }
 export declare const PEEK_DELAY = 750;
-declare function MenuButton({ className }: {
-    className?: string | undefined;
-}): import("react").JSX.Element;
-declare namespace MenuButton {
-    var displayName: string;
-}
 export declare const KAESO_APP_FRAME_BODY_VARIANTS: {
     readonly padding: {
         readonly none: {
@@ -64,8 +58,9 @@ export interface SettingsPageProps extends Omit<HTMLAttributes<HTMLDivElement>,
     actions?: ReactNode | undefined;
 }
 export declare const AppFrame: import("react").ForwardRefExoticComponent<AppFrameProps & import("react").RefAttributes<HTMLDivElement>> & {
-    MenuButton: typeof MenuButton;
+    MenuButton: import("react").ForwardRefExoticComponent<{
+        className?: string | undefined;
+    } & import("react").RefAttributes<HTMLButtonElement>>;
     Body: import("react").ForwardRefExoticComponent<AppFrameBodyProps & import("react").RefAttributes<HTMLDivElement>>;
     Settings: import("react").ForwardRefExoticComponent<SettingsPageProps & import("react").RefAttributes<HTMLDivElement>>;
 };
-export {};

package/dist/types/components/app-frame/nav-sheet.d.ts

@@ -1,11 +1,9 @@
 import { type ReactNode, type RefObject } from "react";
-export declare function NavSheet({ open, onOpenChange, peek, returnFocus, children, }: {
+export interface NavSheetProps {
     open: boolean;
     onOpenChange: (open: boolean) => void;
     peek?: boolean | undefined;
     returnFocus?: RefObject<HTMLElement | null> | undefined;
     children: ReactNode;
-}): import("react").JSX.Element;
-export declare namespace NavSheet {
-    var displayName: string;
 }
+export declare const NavSheet: import("react").ForwardRefExoticComponent<NavSheetProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/calendar/calendar.d.ts

@@ -26,7 +26,4 @@ export interface CalendarProps {
     disabled?: ((date: Date) => boolean) | undefined;
     className?: string | undefined;
 }
-export declare function Calendar({ mode, selected, onSelect, month, defaultMonth, onMonthChange, numberOfMonths, weekStartsOn, disabled, className, }: CalendarProps): import("react").JSX.Element;
-export declare namespace Calendar {
-    var displayName: string;
-}
+export declare const Calendar: import("react").ForwardRefExoticComponent<CalendarProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/charts/core.d.ts

@@ -34,7 +34,7 @@ export interface TableData {
     columns: string[];
     rows: (string | number)[][];
 }
-export declare function ChartFrame({ label, height, children, table, legend, state, className, toggle, }: {
+export interface ChartFrameProps {
     label: string;
     height: number;
     children: ReactNode;
@@ -43,21 +43,20 @@ export declare function ChartFrame({ label, height, children, table, legend, sta
     state?: ChartState | undefined;
     className?: string | undefined;
     toggle?: boolean | undefined;
-}): React.JSX.Element;
+}
+export declare const ChartFrame: React.ForwardRefExoticComponent<ChartFrameProps & React.RefAttributes<HTMLElement>>;
 export interface LegendItem {
     id: string;
     label: ReactNode;
     color: string;
     value?: ReactNode | undefined;
 }
-export declare function Swatch({ color, shape, off }: {
+export interface SwatchProps {
     color: string;
     shape?: "square" | "line" | undefined;
     off?: boolean | undefined;
-}): React.JSX.Element;
-export declare namespace Swatch {
-    var displayName: string;
 }
+export declare const Swatch: React.ForwardRefExoticComponent<SwatchProps & React.RefAttributes<HTMLSpanElement>>;
 export declare const tickLabel: (format: (v: number) => string) => (v: number) => string;
 export declare function readableTicks(scale: {
     ticks: (count: number) => number[];
@@ -80,16 +79,14 @@ export declare function axisLabelIndexes(labels: string[], step: number, edges?:
     start: number;
     end: number;
 }, dates?: readonly AxisDate[] | undefined): number[];
-export declare function Legend({ items, hidden, onToggle, onHover, shape, }: {
+export interface LegendProps {
     items: LegendItem[];
     hidden?: Set<string> | undefined;
     onToggle?: ((id: string) => void) | undefined;
     onHover?: ((id: string | null) => void) | undefined;
     shape?: "square" | "line" | undefined;
-}): React.JSX.Element;
-export declare namespace Legend {
-    var displayName: string;
 }
+export declare const Legend: React.ForwardRefExoticComponent<LegendProps & React.RefAttributes<HTMLUListElement>>;
 export interface TooltipRow {
     id: string;
     label: ReactNode;
@@ -97,7 +94,7 @@ export interface TooltipRow {
     value: ReactNode;
     share?: ReactNode | undefined;
 }
-export declare function ChartTooltip({ x, xLeft, y, width, heading, rows, visible, }: {
+export interface ChartTooltipProps {
     x: number;
     xLeft?: number | undefined;
     y: number;
@@ -105,10 +102,8 @@ export declare function ChartTooltip({ x, xLeft, y, width, heading, rows, visibl
     heading: ReactNode;
     rows: TooltipRow[];
     visible: boolean;
-}): React.JSX.Element;
-export declare namespace ChartTooltip {
-    var displayName: string;
 }
+export declare const ChartTooltip: React.ForwardRefExoticComponent<ChartTooltipProps & React.RefAttributes<HTMLDivElement>>;
 export declare const AXIS: {
     grid: {
         stroke: string;
@@ -155,12 +150,10 @@ export declare function useChartKeys(count: number, options?: {
         onKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;
     };
 };
-export declare function ChartLive({ children }: {
+export interface ChartLiveProps {
     children?: ReactNode | undefined;
-}): React.JSX.Element;
-export declare namespace ChartLive {
-    var displayName: string;
 }
+export declare const ChartLive: React.ForwardRefExoticComponent<ChartLiveProps & React.RefAttributes<HTMLDivElement>>;
 export declare const liveLine: (heading: ReactNode, rows: {
     label: ReactNode;
     value: ReactNode;

package/dist/types/components/checkbox/checkbox.d.ts

@@ -33,6 +33,8 @@ export interface CheckboxProps {
 export declare const CheckboxBox: import("react").ForwardRefExoticComponent<CheckboxProps & {
     parent?: boolean | undefined;
 } & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const KAESO_CHECKBOX_GROUP_VARIANTS: {};
+export declare const KAESO_CHECKBOX_GROUP_DEFAULT_VARIANTS: {};
 export interface CheckboxGroupProps {
     value?: string[] | undefined;
     defaultValue?: string[] | undefined;

package/dist/types/components/combobox/combobox.d.ts

@@ -33,10 +33,11 @@ export interface ComboboxOption {
     leading?: ReactNode | undefined;
     disabled?: boolean | undefined;
 }
-export declare function Highlight({ text, query }: {
+export interface HighlightProps {
     text: string;
     query: string;
-}): import("react").JSX.Element;
+}
+export declare const Highlight: import("react").ForwardRefExoticComponent<HighlightProps & import("react").RefAttributes<HTMLSpanElement>>;
 interface BaseProps extends FieldWrapProps {
     options: ComboboxOption[];
     placeholder?: string | undefined;
@@ -69,6 +70,29 @@ export interface MultiComboboxProps extends BaseProps {
 }
 export type ComboboxProps = SingleComboboxProps | MultiComboboxProps;
 export declare const Combobox: import("react").ForwardRefExoticComponent<ComboboxProps & import("react").RefAttributes<HTMLInputElement>>;
+export declare const KAESO_AUTOCOMPLETE_VARIANTS: {
+    readonly size: {
+        readonly sm: {
+            readonly classes: "h-32 px-12 gap-6 text-body";
+            readonly description: "32px";
+        };
+        readonly md: {
+            readonly classes: "h-36 px-16 gap-8 text-body";
+            readonly description: "36px (default)";
+        };
+        readonly lg: {
+            readonly classes: "h-40 px-18 gap-8 text-body";
+            readonly description: "40px";
+        };
+        readonly xl: {
+            readonly classes: "h-48 px-22 gap-8 text-body-lg";
+            readonly description: "48px";
+        };
+    };
+};
+export declare const KAESO_AUTOCOMPLETE_DEFAULT_VARIANTS: {
+    readonly size: "md";
+};
 export interface AutocompleteProps extends FieldWrapProps {
     suggestions: string[];
     value?: string | undefined;

package/dist/types/components/command-list/picker-popover.d.ts

@@ -28,10 +28,7 @@ export interface PickerPopoverProps {
     align?: "start" | "end" | undefined;
     children: ReactNode;
 }
-export declare function PickerPopover({ trigger, title, open, onOpenChange, width, align, children }: PickerPopoverProps): import("react").JSX.Element;
-export declare namespace PickerPopover {
-    var displayName: string;
-}
+export declare const PickerPopover: import("react").ForwardRefExoticComponent<PickerPopoverProps & import("react").RefAttributes<HTMLDivElement>>;
 export interface PickerTriggerProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children"> {
     appearance?: keyof typeof KAESO_SELECT_VARIANTS.appearance | undefined;
     size?: keyof typeof KAESO_SELECT_VARIANTS.size | undefined;

package/dist/types/components/command-palette/command-palette.d.ts

@@ -40,7 +40,4 @@ export interface CommandPaletteProps {
     query?: string | undefined;
     counts?: boolean | undefined;
 }
-export declare function CommandPalette(props: CommandPaletteProps): import("react").JSX.Element;
-export declare namespace CommandPalette {
-    var displayName: string;
-}
+export declare const CommandPalette: import("react").ForwardRefExoticComponent<CommandPaletteProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/data-table/data-table.d.ts

@@ -40,6 +40,7 @@ export interface DataTableProps<T> {
     onRowClick?: ((row: T) => void) | undefined;
     rowMenu?: ((row: T) => ReactNode) | undefined;
     selectable?: boolean | undefined;
+    canSelectRow?: ((row: T) => boolean) | undefined;
     selection?: RowSelectionState | undefined;
     onSelectionChange?: ((selection: RowSelectionState) => void) | undefined;
     sorting?: SortingState | undefined;
@@ -74,7 +75,7 @@ export declare function fitColumns(columns: FitColumn[], width: number, reserve?
     tight: boolean;
     overflow: boolean;
 };
-declare function DataTableInner<T>({ data, columns: userColumns, getRowId, density, onRowClick, rowMenu, selectable, selection, onSelectionChange, sorting: sortingProp, onSortingChange, manualSorting, loading, error, onRetry, empty, hasMore, loadingMore, onLoadMore, stickyFirstColumn, virtualizeAbove, className, activeRowId, freshRowIds, onHiddenColumnsChange, "aria-label": ariaLabel, }: DataTableProps<T>, ref: React.Ref<HTMLDivElement>): React.JSX.Element;
+declare function DataTableInner<T>({ data, columns: userColumns, getRowId, density, onRowClick, rowMenu, selectable, canSelectRow, selection, onSelectionChange, sorting: sortingProp, onSortingChange, manualSorting, loading, error, onRetry, empty, hasMore, loadingMore, onLoadMore, stickyFirstColumn, virtualizeAbove, className, activeRowId, freshRowIds, onHiddenColumnsChange, "aria-label": ariaLabel, }: DataTableProps<T>, ref: React.Ref<HTMLDivElement>): React.JSX.Element;
 export declare const DataTable: <T>(p: DataTableProps<T> & {
     ref?: React.Ref<HTMLDivElement> | undefined;
 }) => ReturnType<typeof DataTableInner>;

package/dist/types/components/data-table/docs.d.ts

@@ -24,6 +24,7 @@ export declare const docs: {
             ref: string;
             rowMenu: string;
             selectable: string;
+            canSelectRow: string;
             selection: string;
             sorting: string;
             stickyFirstColumn: string;

package/dist/types/components/dialog/dialog.d.ts

@@ -40,7 +40,9 @@ export interface DialogProps {
     size?: keyof typeof KAESO_DIALOG_VARIANTS.size | undefined;
     anchor?: keyof typeof KAESO_DIALOG_VARIANTS.anchor | undefined;
     children?: ReactNode | undefined;
+    toolbar?: ReactNode | undefined;
     footer?: ReactNode | undefined;
+    footerStart?: ReactNode | undefined;
     onSubmit?: (() => void) | undefined;
     hideClose?: boolean | undefined;
     headerStart?: ReactNode | undefined;
@@ -93,10 +95,7 @@ export interface AlertDialogProps {
     loading?: boolean | undefined;
     inline?: boolean | undefined;
 }
-export declare function AlertDialog(props: AlertDialogProps): import("react").JSX.Element;
-export declare namespace AlertDialog {
-    var displayName: string;
-}
+export declare const AlertDialog: import("react").ForwardRefExoticComponent<AlertDialogProps & import("react").RefAttributes<HTMLDivElement>>;
 export declare const KAESO_LAYER_DIALOG_VARIANTS: {
     readonly size: {
         readonly sm: {
@@ -130,16 +129,15 @@ export declare const KAESO_LAYER_DIALOG_DEFAULT_VARIANTS: {
 export interface DialogLayer {
     title: ReactNode;
     description?: ReactNode | undefined;
+    toolbar?: ReactNode | undefined;
     content: ReactNode;
     footer?: ReactNode | undefined;
+    footerStart?: ReactNode | undefined;
 }
-export interface LayerDialogProps extends Omit<DialogProps, "title" | "description" | "children" | "footer" | "headerStart"> {
+export interface LayerDialogProps extends Omit<DialogProps, "title" | "description" | "children" | "toolbar" | "footer" | "footerStart" | "headerStart"> {
     layers: DialogLayer[];
     layer?: number | undefined;
     onLayerChange?: ((layer: number) => void) | undefined;
 }
-export declare function LayerDialog({ layers, layer, onLayerChange, ...props }: LayerDialogProps): import("react").JSX.Element | null;
-export declare namespace LayerDialog {
-    var displayName: string;
-}
+export declare const LayerDialog: import("react").ForwardRefExoticComponent<LayerDialogProps & import("react").RefAttributes<HTMLDivElement>>;
 export {};

package/dist/types/components/dialog/docs.d.ts

@@ -26,6 +26,8 @@ export declare const docs: {
             defaultOpen: string;
             description: string;
             footer: string;
+            footerStart: string;
+            toolbar: string;
             headerStart: string;
             hideClose: string;
             inline: string;

package/dist/types/components/dialog/scope.d.ts

@@ -1,4 +1,6 @@
 import { type ReactNode } from "react";
+export declare const KAESO_DIALOG_SCOPE_VARIANTS: {};
+export declare const KAESO_DIALOG_SCOPE_DEFAULT_VARIANTS: {};
 export interface DialogScopeProps {
     open: boolean;
     children: ReactNode;

package/dist/types/components/dialog/step-dialog.d.ts

@@ -1,11 +1,43 @@
 import { type ReactNode } from "react";
 import { KAESO_DIALOG_VARIANTS } from "./dialog.js";
+export declare const KAESO_STEP_DIALOG_VARIANTS: {
+    readonly size: {
+        readonly sm: {
+            readonly classes: "w-440";
+            readonly description: "440px: most tasks in a few steps (default)";
+        };
+        readonly md: {
+            readonly classes: "w-560";
+            readonly description: "560px: steps with longer forms";
+        };
+        readonly lg: {
+            readonly classes: "w-720";
+            readonly description: "720px: steps with two columns or previews";
+        };
+    };
+    readonly tone: {
+        readonly default: {
+            readonly classes: "";
+            readonly description: "The last step's button is primary (default)";
+        };
+        readonly danger: {
+            readonly classes: "";
+            readonly description: "The last step's button is a danger button, for a task that ends in deletion";
+        };
+    };
+};
+export declare const KAESO_STEP_DIALOG_DEFAULT_VARIANTS: {
+    readonly size: "sm";
+    readonly tone: "default";
+};
 export interface DialogStep {
     id: string;
     title: ReactNode;
     description?: ReactNode | undefined;
     content: ReactNode;
     blockedReason?: string | undefined;
+    continueLabel?: string | undefined;
+    onContinue?: (() => Promise<boolean> | boolean) | undefined;
 }
 export interface StepDialogResult {
     title: ReactNode;
@@ -22,13 +54,14 @@ export interface StepDialogProps {
     submitLabel: string;
     onSubmit: () => void;
     submitting?: boolean | undefined;
-    tone?: "default" | "danger" | undefined;
-    size?: keyof typeof KAESO_DIALOG_VARIANTS.size | undefined;
+    tone?: keyof typeof KAESO_STEP_DIALOG_VARIANTS.tone | undefined;
+    size?: keyof typeof KAESO_STEP_DIALOG_VARIANTS.size | undefined;
     inline?: boolean | undefined;
     defaultStep?: number | undefined;
     result?: StepDialogResult | undefined;
 }
-export declare function StepDialog({ open, onOpenChange, title, steps, submitLabel, onSubmit, submitting, tone, size, inline, defaultStep, result, }: StepDialogProps): import("react").JSX.Element;
-export declare namespace StepDialog {
-    var displayName: string;
+export interface StepDialogControls {
+    advance: () => void;
 }
+export declare function useStepDialog(): StepDialogControls | null;
+export declare const StepDialog: import("react").ForwardRefExoticComponent<StepDialogProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/display-options/display-options.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from "react";
+import { type ReactNode } from "react";
 import { type SegmentedOption } from "../segmented/segmented.js";
 import { type SelectOption } from "../select/select.js";
 import type { IconData } from "../icon/icon.js";
@@ -50,7 +50,4 @@ export interface DisplayOptionsProps {
     inline?: boolean | undefined;
     footer?: ReactNode | undefined;
 }
-export declare function DisplayOptions({ trigger, inline, ...props }: DisplayOptionsProps): import("react").JSX.Element;
-export declare namespace DisplayOptions {
-    var displayName: string;
-}
+export declare const DisplayOptions: import("react").ForwardRefExoticComponent<DisplayOptionsProps & import("react").RefAttributes<HTMLElement>>;

package/dist/types/components/input/input.d.ts

@@ -37,6 +37,29 @@ export interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>,
     className?: string | undefined;
 }
 export declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLInputElement>>;
+export declare const KAESO_SEARCH_INPUT_VARIANTS: {
+    readonly size: {
+        readonly sm: {
+            readonly classes: "h-32";
+            readonly description: "32px: toolbars (default)";
+        };
+        readonly md: {
+            readonly classes: "h-36";
+            readonly description: "36px: a search at the top of a page or dialog";
+        };
+        readonly lg: {
+            readonly classes: "h-40";
+            readonly description: "40px";
+        };
+        readonly xl: {
+            readonly classes: "h-48";
+            readonly description: "48px";
+        };
+    };
+};
+export declare const KAESO_SEARCH_INPUT_DEFAULT_VARIANTS: {
+    readonly size: "sm";
+};
 export interface SearchInputProps extends Omit<InputProps, "leadingIcon" | "type" | "prefix" | "suffix"> {
     shortcut?: string[] | undefined;
     onClear?: (() => void) | undefined;

package/dist/types/components/kaeso/client-button.d.ts

@@ -0,0 +1,17 @@
+export declare const KAESO_CLIENT_BUTTON_VARIANTS: {};
+export declare const KAESO_CLIENT_BUTTON_DEFAULT_VARIANTS: {};
+/** The marks of the agent clients Kaeso connects to, on a 24px grid, drawn in the text colour. */
+export declare const CLIENT_MARKS: {
+    readonly claude: "m4.7144 15.9555 4.7174-2.6471.079-.2307-.079-.1275h-.2307l-.7893-.0486-2.6956-.0729-2.3375-.0971-2.2646-.1214-.5707-.1215-.5343-.7042.0546-.3522.4797-.3218.686.0608 1.5179.1032 2.2767.1578 1.6514.0972 2.4468.255h.3886l.0546-.1579-.1336-.0971-.1032-.0972L6.973 9.8356l-2.55-1.6879-1.3356-.9714-.7225-.4918-.3643-.4614-.1578-1.0078.6557-.7225.8803.0607.2246.0607.8925.686 1.9064 1.4754 2.4893 1.8336.3643.3035.1457-.1032.0182-.0728-.164-.2733-1.3539-2.4467-1.445-2.4893-.6435-1.032-.17-.6194c-.0607-.255-.1032-.4674-.1032-.7285L6.287.1335 6.6997 0l.9957.1336.419.3642.6192 1.4147 1.0018 2.2282 1.5543 3.0296.4553.8985.2429.8318.091.255h.1579v-.1457l.1275-1.706.2368-2.0947.2307-2.6957.0789-.7589.3764-.9107.7468-.4918.5828.2793.4797.686-.0668.4433-.2853 1.8517-.5586 2.9021-.3643 1.9429h.2125l.2429-.2429.9835-1.3053 1.6514-2.0643.7286-.8196.85-.9046.5464-.4311h1.0321l.759 1.1293-.34 1.1657-1.0625 1.3478-.8804 1.1414-1.2628 1.7-.7893 1.36.0729.1093.1882-.0183 2.8535-.607 1.5421-.2794 1.8396-.3157.8318.3886.091.3946-.3278.8075-1.967.4857-2.3072.4614-3.4364.8136-.0425.0304.0486.0607 1.5482.1457.6618.0364h1.621l3.0175.2247.7892.522.4736.6376-.079.4857-1.2142.6193-1.6393-.3886-3.825-.9107-1.3113-.3279h-.1822v.1093l1.0929 1.0686 2.0035 1.8092 2.5075 2.3314.1275.5768-.3218.4554-.34-.0486-2.2039-1.6575-.85-.7468-1.9246-1.621h-.1275v.17l.4432.6496 2.3436 3.5214.1214 1.0807-.17.3521-.6071.2125-.6679-.1214-1.3721-1.9246L14.38 17.959l-1.1414-1.9428-.1397.079-.674 7.2552-.3156.3703-.7286.2793-.6071-.4614-.3218-.7468.3218-1.4753.3886-1.9246.3157-1.53.2853-1.9004.17-.6314-.0121-.0425-.1397.0182-1.4328 1.9672-2.1796 2.9446-1.7243 1.8456-.4128.164-.7164-.3704.0667-.6618.4008-.5889 2.386-3.0357 1.4389-1.882.929-1.0868-.0062-.1579h-.0546l-6.3385 4.1164-1.1293.1457-.4857-.4554.0608-.7467.2307-.2429 1.9064-1.3114Z";
+    readonly cursor: "M11.503.131 1.891 5.678a.84.84 0 0 0-.42.726v11.188c0 .3.162.575.42.724l9.609 5.55a1 1 0 0 0 .998 0l9.61-5.55a.84.84 0 0 0 .42-.724V6.404a.84.84 0 0 0-.42-.726L12.497.131a1.01 1.01 0 0 0-.996 0M2.657 6.338h18.55c.263 0 .43.287.297.515L12.23 22.918c-.062.107-.229.064-.229-.06V12.335a.59.59 0 0 0-.295-.51l-9.11-5.257c-.109-.063-.064-.23.061-.23";
+    readonly "github-copilot": "M23.922 16.997C23.061 18.492 18.063 22.02 12 22.02 5.937 22.02.939 18.492.078 16.997A.641.641 0 0 1 0 16.741v-2.869a.883.883 0 0 1 .053-.22c.372-.935 1.347-2.292 2.605-2.656.167-.429.414-1.055.644-1.517a10.098 10.098 0 0 1-.052-1.086c0-1.331.282-2.499 1.132-3.368.397-.406.89-.717 1.474-.952C7.255 2.937 9.248 1.98 11.978 1.98c2.731 0 4.767.957 6.166 2.093.584.235 1.077.546 1.474.952.85.869 1.132 2.037 1.132 3.368 0 .368-.014.733-.052 1.086.23.462.477 1.088.644 1.517 1.258.364 2.233 1.721 2.605 2.656a.841.841 0 0 1 .053.22v2.869a.641.641 0 0 1-.078.256Zm-11.75-5.992h-.344a4.359 4.359 0 0 1-.355.508c-.77.947-1.918 1.492-3.508 1.492-1.725 0-2.989-.359-3.782-1.259a2.137 2.137 0 0 1-.085-.104L4 11.746v6.585c1.435.779 4.514 2.179 8 2.179 3.486 0 6.565-1.4 8-2.179v-6.585l-.098-.104s-.033.045-.085.104c-.793.9-2.057 1.259-3.782 1.259-1.59 0-2.738-.545-3.508-1.492a4.359 4.359 0 0 1-.355-.508Zm2.328 3.25c.549 0 1 .451 1 1v2c0 .549-.451 1-1 1-.549 0-1-.451-1-1v-2c0-.549.451-1 1-1Zm-5 0c.549 0 1 .451 1 1v2c0 .549-.451 1-1 1-.549 0-1-.451-1-1v-2c0-.549.451-1 1-1Zm3.313-6.185c.136 1.057.403 1.913.878 2.497.442.544 1.134.938 2.344.938 1.573 0 2.292-.337 2.657-.751.384-.435.558-1.15.558-2.361 0-1.14-.243-1.847-.705-2.319-.477-.488-1.319-.862-2.824-1.025-1.487-.161-2.192.138-2.533.529-.269.307-.437.808-.438 1.578v.021c0 .265.021.562.063.893Zm-1.626 0c.042-.331.063-.628.063-.894v-.02c-.001-.77-.169-1.271-.438-1.578-.341-.391-1.046-.69-2.533-.529-1.505.163-2.347.537-2.824 1.025-.462.472-.705 1.179-.705 2.319 0 1.211.175 1.926.558 2.361.365.414 1.084.751 2.657.751 1.21 0 1.902-.394 2.344-.938.475-.584.742-1.44.878-2.497Z";
+};
+export type ClientMark = keyof typeof CLIENT_MARKS;
+export interface ClientButtonProps {
+    client: ClientMark;
+    "aria-label": string;
+    onClick?: (() => void) | undefined;
+    className?: string | undefined;
+}
+/** An agent client's mark on a raised tile, as a button that opens how to connect it. Its tooltip is its label. */
+export declare const ClientButton: import("react").ForwardRefExoticComponent<ClientButtonProps & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/types/components/kaeso/docs.d.ts

@@ -1,4 +1,12 @@
 export declare const docs: {
+    ClientButton: {
+        description: string;
+        props: {
+            "aria-label": string;
+            client: string;
+            onClick: string;
+        };
+    };
     ConversationView: {
         description: string;
         props: {
@@ -17,6 +25,15 @@ export declare const docs: {
             sources: string;
         };
     };
+    GrantSummary: {
+        description: string;
+        props: {
+            action: string;
+            "aria-label": string;
+            footer: string;
+            items: string;
+        };
+    };
     EnvironmentSnippet: {
         description: string;
         props: {
@@ -101,6 +118,7 @@ export declare const docs: {
             autoFocus: string;
             disabled: string;
             onValueChange: string;
+            onChoose: string;
             placeholder: string;
             providers: string;
             size: string;

package/dist/types/components/kaeso/grant-summary.d.ts

@@ -0,0 +1,12 @@
+import { type ReactNode } from "react";
+export declare const KAESO_GRANT_SUMMARY_VARIANTS: {};
+export declare const KAESO_GRANT_SUMMARY_DEFAULT_VARIANTS: {};
+export interface GrantSummaryProps {
+    items: readonly ReactNode[];
+    footer?: ReactNode | undefined;
+    action?: ReactNode | undefined;
+    "aria-label": string;
+    className?: string | undefined;
+}
+/** What an agent or a key may do, one short line per item after a check mark, on a group surface, with an optional note and action below. */
+export declare const GrantSummary: import("react").ForwardRefExoticComponent<GrantSummaryProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/kaeso/identity.d.ts

@@ -54,6 +54,8 @@ export interface KeyDisplayProps {
     className?: string | undefined;
     stateBadge?: boolean | undefined;
 }
+export declare const KAESO_KEY_DISPLAY_VARIANTS: {};
+export declare const KAESO_KEY_DISPLAY_DEFAULT_VARIANTS: {};
 export declare const KeyDisplay: import("react").ForwardRefExoticComponent<KeyDisplayProps & import("react").RefAttributes<HTMLSpanElement>>;
 export declare const StatusCode: import("react").ForwardRefExoticComponent<{
     code: number;

package/dist/types/components/kaeso/index.d.ts

@@ -7,3 +7,5 @@ export * from "./rights-logic.js";
 export * from "./role-picker.js";
 export * from "./effective-access.js";
 export * from "./provider-picker.js";
+export * from "./grant-summary.js";
+export * from "./client-button.js";