@arbidocs/blocks 0.3.185 → 0.4.0

package/dist/settings/AccountDialogs.d.ts

@@ -0,0 +1,89 @@
+import { type ReactNode } from 'react';
+/** Every fixed string of the active-sessions dialog. */
+export interface ActiveSessionsDialogLabels {
+    title: string;
+    description: string;
+    noSessions: string;
+    thisDevice: string;
+    agent: string;
+    endSession: string;
+}
+export declare const DEFAULT_ACTIVE_SESSIONS_DIALOG_LABELS: ActiveSessionsDialogLabels;
+/** Every fixed string of the delete-account dialog. */
+export interface DeleteAccountDialogLabels {
+    warningTitle: string;
+    /** Sentence start, before the emphasised part (keep the trailing space). */
+    warningBefore: string;
+    /** Emphasised (bold) part of the warning. */
+    warningEmphasis: string;
+    /** Sentence end, after the emphasised part. */
+    warningAfter: string;
+    blockersHeading: string;
+    cancel: string;
+    continue: string;
+    confirmTitle: string;
+    confirmDescription: string;
+    yourEmail: string;
+    back: string;
+    deleting: string;
+    deleteAccount: string;
+}
+export declare const DEFAULT_DELETE_ACCOUNT_DIALOG_LABELS: DeleteAccountDialogLabels;
+export interface ActiveSessionView {
+    id: string;
+    /** Display name, e.g. "Browser session". */
+    name: string;
+    /** The session of this device: badged, and cannot be ended here. */
+    isCurrent: boolean;
+    isAgent: boolean;
+    /** Secondary line, e.g. "10.0.0.1 · expires in 2h · 3 workspaces". */
+    detail: string;
+    isTerminating: boolean;
+    /** Avatar glyph (monitor / bot). */
+    icon?: ReactNode;
+}
+export interface ActiveSessionsDialogProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    isLoading: boolean;
+    sessions: ActiveSessionView[];
+    onTerminate: (id: string) => void;
+    labels?: Partial<ActiveSessionsDialogLabels>;
+    /** Dialog test id (default `active-sessions-dialog`). */
+    testId?: string;
+    /**
+     * Part ids; defaults are the current ids. `sessionItem` is a prefix (`<prefix>-<session id>`);
+     * `terminateSession` is a prefix (`<prefix>-<session id>-button`).
+     */
+    testIds?: Partial<Record<'list' | 'sessionItem' | 'terminateSession', string>>;
+}
+/**
+ * Every session signed in to the account (this device, other devices, agents). Any but the current
+ * one can be ended; ending the current one belongs to the Logout flow.
+ */
+export declare function ActiveSessionsDialog({ open, onOpenChange, isLoading, sessions, onTerminate, labels, testId, testIds, }: ActiveSessionsDialogProps): import("react").JSX.Element;
+export interface DeleteAccountBlocker {
+    key: string;
+    content: ReactNode;
+}
+export interface DeleteAccountDialogProps {
+    open: boolean;
+    onClose: () => void;
+    step: 'warning' | 'confirm';
+    /** Reasons the account cannot be deleted yet; Continue is disabled while any exist. */
+    blockers: DeleteAccountBlocker[];
+    onContinue: () => void;
+    onBack: () => void;
+    userEmail: string;
+    confirmEmail: string;
+    onConfirmEmailChange: (email: string) => void;
+    isDeleting: boolean;
+    onSubmit: () => void;
+    labels?: Partial<DeleteAccountDialogLabels>;
+    /** Dialog test id (default `delete-account-dialog`). */
+    testId?: string;
+    /** Part ids; defaults are the current ids. */
+    testIds?: Partial<Record<'cancel' | 'continue' | 'emailInput' | 'back' | 'submit', string>>;
+}
+/** Two-step account deletion: a warning (with blockers), then type-your-email to confirm. */
+export declare function DeleteAccountDialog({ open, onClose, step, blockers, onContinue, onBack, userEmail, confirmEmail, onConfirmEmailChange, isDeleting, onSubmit, labels, testId, testIds, }: DeleteAccountDialogProps): import("react").JSX.Element;

package/dist/settings/AvatarPicker.d.ts

@@ -0,0 +1,25 @@
+/** Every fixed string of the avatar picker. */
+export interface AvatarPickerLabels {
+    uploadingPicture: string;
+    changeProfilePicture: string;
+    change: string;
+}
+export declare const DEFAULT_AVATAR_PICKER_LABELS: AvatarPickerLabels;
+export interface AvatarPickerProps {
+    labels?: Partial<AvatarPickerLabels>;
+    /** Image URL / data URL; the initials show when absent. */
+    pictureUrl?: string | null;
+    initials: string;
+    /** Background class of the initials fallback (a stable per-user colour). */
+    fallbackClassName?: string;
+    isUploading?: boolean;
+    disabled?: boolean;
+    /** A file was chosen; the host validates, crops and uploads it. */
+    onFileChosen: (file: File) => void;
+    testId?: string;
+}
+/**
+ * Profile picture with a change affordance. A permanent camera mark says the picture is tappable on
+ * touch screens; the overlay (revealed on hover/focus) is the actual control.
+ */
+export declare function AvatarPicker({ pictureUrl, initials, fallbackClassName, isUploading, disabled, onFileChosen, testId, labels, }: AvatarPickerProps): import("react").JSX.Element;

package/dist/settings/Billing.d.ts

@@ -0,0 +1,113 @@
+import { type ReactNode, type Ref } from 'react';
+/** Every fixed string of the receipts dialog. */
+export interface InvoicesDialogLabels {
+    title: (projectName: string) => string;
+    description: (projectName: string) => string;
+    noReceipts: string;
+    paid: string;
+}
+export declare const DEFAULT_INVOICES_DIALOG_LABELS: InvoicesDialogLabels;
+/** Every fixed string of the daily-cap field. */
+export interface DailyCapFieldLabels {
+    noLimit: string;
+    ariaLabel: string;
+    unit: string;
+    save: string;
+}
+export declare const DEFAULT_DAILY_CAP_FIELD_LABELS: DailyCapFieldLabels;
+/** Every fixed string of the member project row. */
+export interface MemberProjectRowLabels {
+    noDailyLimit: string;
+}
+export declare const DEFAULT_MEMBER_PROJECT_ROW_LABELS: MemberProjectRowLabels;
+/** Every fixed string of the inline name editor. */
+export interface InlineNameEditorLabels {
+    saveName: string;
+    cancelRename: string;
+}
+export declare const DEFAULT_INLINE_NAME_EDITOR_LABELS: InlineNameEditorLabels;
+/** Every fixed string of the project card. */
+export interface ProjectCardViewLabels {
+    collapseProject: string;
+    expandProject: string;
+}
+export declare const DEFAULT_PROJECT_CARD_VIEW_LABELS: ProjectCardViewLabels;
+export interface InvoiceRowView {
+    key: string;
+    date: string;
+    /** Formatted amount, e.g. "$50.00". */
+    amount: string;
+    status: string;
+    isPaid: boolean;
+    /** Receipt (paid) or invoice (unpaid) link; omitted when none exists. */
+    href?: string;
+    linkLabel?: string;
+}
+export interface InvoicesDialogProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    projectName: string;
+    isLoading: boolean;
+    invoices: InvoiceRowView[];
+    labels?: Partial<InvoicesDialogLabels>;
+}
+/** Receipts of a project: date, amount, status and a link to each. */
+export declare function InvoicesDialog({ open, onOpenChange, projectName, isLoading, invoices, labels, }: InvoicesDialogProps): import("react").JSX.Element;
+export interface DailyCapFieldProps {
+    value: string;
+    onChange: (value: string) => void;
+    onSave: () => void;
+    canSave: boolean;
+    isSaving?: boolean;
+    labels?: Partial<DailyCapFieldLabels>;
+}
+/** Per-collaborator daily credit cap input; Enter or Save commits, empty means no limit. */
+export declare function DailyCapField({ value, onChange, onSave, canSave, isSaving, labels, }: DailyCapFieldProps): import("react").JSX.Element;
+export interface MemberProjectRowProps {
+    icon: ReactNode;
+    name: string;
+    /** Owner avatar. */
+    owner?: ReactNode;
+    /** The caller's daily allowance in this project; `null` means no limit. */
+    allowance: {
+        text: string;
+        pct: number;
+    } | null;
+    labels?: Partial<MemberProjectRowLabels>;
+}
+/** Slim row for a project the user belongs to but does not own. */
+export declare function MemberProjectRow({ icon, name, owner, allowance, labels }: MemberProjectRowProps): import("react").JSX.Element;
+export interface InlineNameEditorProps {
+    value: string;
+    onChange: (value: string) => void;
+    onSave: () => void;
+    onCancel: () => void;
+    labels?: Partial<InlineNameEditorLabels>;
+}
+/** In-row rename: input with confirm and cancel buttons (Enter saves, Escape cancels). */
+export declare function InlineNameEditor({ value, onChange, onSave, onCancel, labels, }: InlineNameEditorProps): import("react").JSX.Element;
+export interface ProjectCardViewProps {
+    expanded: boolean;
+    onToggleExpanded: () => void;
+    /** Ref to the header row (for scroll-into-view). */
+    rowRef?: Ref<HTMLDivElement>;
+    /** Project icon, tinted by billing state. */
+    icon: ReactNode;
+    /** Name + owner, or the inline editor. */
+    identity: ReactNode;
+    /** Rename / delete buttons. */
+    actions?: ReactNode;
+    /** Plan badge. */
+    badge?: ReactNode;
+    /** Upgrade / change plan / invoices buttons. */
+    buttons?: ReactNode;
+    /** Inline quota summary. */
+    summary?: ReactNode;
+    /** Shown when expanded. */
+    children?: ReactNode;
+    /** Dialogs owned by the card (rendered after the content). */
+    overlays?: ReactNode;
+    labels?: Partial<ProjectCardViewLabels>;
+}
+/** Collapsible project card: header row of slots, expandable detail underneath. */
+export declare function ProjectCardView({ expanded, onToggleExpanded, rowRef, icon, identity, actions, badge, buttons, summary, children, overlays, labels, }: ProjectCardViewProps): import("react").JSX.Element;

package/dist/settings/ConfigSwitcherBar.d.ts

@@ -0,0 +1,46 @@
+/** What a saved configuration is, relative to the conversation: its origin, last used, or factory. */
+export type ConfigOptionMarker = 'default' | 'original' | 'last-used';
+export interface ConfigOption {
+    value: string;
+    title: string;
+    subtitle?: string;
+    marker?: ConfigOptionMarker;
+}
+/** Every fixed string of the bar. */
+export interface ConfigSwitcherBarLabels {
+    placeholder: string;
+    save: string;
+    saving: string;
+    delete: string;
+}
+export declare const DEFAULT_CONFIG_SWITCHER_BAR_LABELS: ConfigSwitcherBarLabels;
+export interface ConfigSwitcherBarProps {
+    options: ConfigOption[];
+    /** Value of the selected option (`unsaved` is added by the bar while `hasUnsavedChanges`). */
+    value: string;
+    onSelect: (value: string) => void;
+    /** Offers the transient "Unsaved Changes" entry on top. */
+    hasUnsavedChanges: boolean;
+    unsavedTitle?: string;
+    unsavedSubtitle?: string;
+    /** Show the name input and the save button. */
+    showNameField: boolean;
+    name: string;
+    onNameChange: (name: string) => void;
+    namePlaceholder: string;
+    /** `Save` for new, `Rename` for a loaded configuration. */
+    saveLabel: string;
+    onSave: () => void;
+    isSaving: boolean;
+    /** Show the delete button (an existing configuration is loaded). */
+    canDelete: boolean;
+    onDelete: () => void;
+    isDeleting: boolean;
+    nameTestId?: string;
+    saveTestId?: string;
+    deleteTestId?: string;
+    labels?: Partial<ConfigSwitcherBarLabels>;
+    className?: string;
+}
+/** Footer bar to pick, name, save and delete a saved configuration. */
+export declare function ConfigSwitcherBar({ options, value, onSelect, hasUnsavedChanges, unsavedTitle, unsavedSubtitle, showNameField, name, onNameChange, namePlaceholder, saveLabel, onSave, isSaving, canDelete, onDelete, isDeleting, nameTestId, saveTestId, deleteTestId, labels, className, }: ConfigSwitcherBarProps): import("react").JSX.Element;

package/dist/settings/ConfirmDialog.d.ts

@@ -0,0 +1,28 @@
+/** Every fixed string of the confirm dialog. `confirmText` / `cancelText` props win. */
+export interface ConfirmDialogLabels {
+    confirm: string;
+    cancel: string;
+    pleaseWait: string;
+}
+export declare const DEFAULT_CONFIRM_DIALOG_LABELS: ConfirmDialogLabels;
+export interface ConfirmDialogProps {
+    labels?: Partial<ConfirmDialogLabels>;
+    isOpen: boolean;
+    onClose: () => void;
+    onConfirm: () => void;
+    title: string;
+    description: string;
+    confirmText?: string;
+    cancelText?: string;
+    variant?: 'destructive' | 'default';
+    isLoading?: boolean;
+    /** Dialog test id (default `confirmation-modal`). */
+    testId?: string;
+    /** Button ids; defaults are the current ids. */
+    testIds?: Partial<Record<'cancel' | 'confirm', string>>;
+}
+/**
+ * Declarative yes/no confirmation with a loading state. An `alertdialog`: initial focus is on
+ * Cancel (the safe action) and clicking outside does not dismiss it; Escape and Cancel do.
+ */
+export declare function ConfirmDialog({ isOpen, onClose, onConfirm, title, description, confirmText, cancelText, variant, isLoading, labels, testId, testIds, }: ConfirmDialogProps): import("react").JSX.Element;

package/dist/settings/ConnectionCard.d.ts

@@ -0,0 +1,58 @@
+/**
+ * - `available`: not connected, the user can connect.
+ * - `connected`: connected.
+ * - `host`: provided by the host account, no personal login.
+ */
+export type ConnectionCardStatus = 'available' | 'connected' | 'organisation';
+/** Every fixed string of a connection card. */
+export interface ConnectionCardLabels {
+    connectedAs: (identity: string) => string;
+    justConnected: string;
+    connected: string;
+    disconnect: string;
+    connect: string;
+    organisationAccount: string;
+    readOnlyLead: string;
+    readOnlyBody: string;
+}
+export declare const DEFAULT_CONNECTION_CARD_LABELS: ConnectionCardLabels;
+export interface ConnectionCardView {
+    /** Stable key (vendor key); drives the test ids. */
+    id: string;
+    title: string;
+    description?: string;
+    iconUrl?: string | null;
+    iconAlt?: string;
+    status: ConnectionCardStatus;
+    /** Right after the OAuth return: shows "Just connected" until the list catches up. */
+    justConnected?: boolean;
+    /** "Connected as {identity}". */
+    identity?: string | null;
+    /** Amber warning line, e.g. a stale token scheme. */
+    warning?: string;
+    /** Muted note line, e.g. "Enabled for your organisation". */
+    note?: string;
+    /** Show the read-only reassurance (mailbox / file connectors). */
+    showReadOnlyNotice?: boolean;
+    isDisconnecting?: boolean;
+}
+export interface ConnectionCardProps {
+    connection: ConnectionCardView;
+    onConnect: (id: string) => void;
+    onDisconnect: (id: string) => void;
+    labels?: Partial<ConnectionCardLabels>;
+}
+/** One external app: icon, name, description, status and a Connect / Disconnect action. */
+export declare function ConnectionCard({ connection, onConnect, onDisconnect, labels, }: ConnectionCardProps): import("react").JSX.Element;
+/** Centred "nothing here yet" placeholder inside a settings card. */
+export declare function ConnectionsEmpty({ message }: {
+    message: string;
+}): import("react").JSX.Element;
+/** Inline loading line. */
+export declare function ConnectionsLoading({ message }: {
+    message: string;
+}): import("react").JSX.Element;
+/** Inline destructive error line. */
+export declare function ConnectionsError({ message }: {
+    message: string;
+}): import("react").JSX.Element;

package/dist/settings/ConversationSettingsParts.d.ts

@@ -0,0 +1,53 @@
+import { type ReactNode } from 'react';
+/** Longest title that can be saved. */
+export declare const CONVERSATION_TITLE_MAX = 50;
+/** Every fixed string of the conversation title section. */
+export interface ConversationTitleSectionLabels {
+    title: string;
+    placeholder: string;
+    share: string;
+    shared: string;
+    /** Tooltip on the share button for non-owners. */
+    ownerOnlyShare: string;
+    characters: (count: number, max: number) => string;
+    saving: string;
+    ownerOnlyEdit: string;
+}
+export declare const DEFAULT_CONVERSATION_TITLE_SECTION_LABELS: ConversationTitleSectionLabels;
+export interface ConversationTitleSectionProps {
+    title: string;
+    onTitleChange: (title: string) => void;
+    /** Blur with a valid title: the host saves it. */
+    onTitleCommit: () => void;
+    isOwner: boolean;
+    isShared: boolean;
+    isSharing: boolean;
+    isSavingTitle: boolean;
+    /** The share button was pressed (the host confirms, then shares). */
+    onShare: () => void;
+    inputTestId?: string;
+    shareTestId?: string;
+    labels?: Partial<ConversationTitleSectionLabels>;
+}
+/** Title input with a share button and a character counter; read-only for non-owners. */
+export declare function ConversationTitleSection({ title, onTitleChange, onTitleCommit, isOwner, isShared, isSharing, isSavingTitle, onShare, inputTestId, shareTestId, labels, }: ConversationTitleSectionProps): import("react").JSX.Element;
+/** Every fixed string of the model selection section. */
+export interface ModelSelectionSectionLabels {
+    title: string;
+    description: string;
+    useDefaults: string;
+    auto: string;
+    default: string;
+    lastUsed: string;
+    deepThinking: string;
+}
+export declare const DEFAULT_MODEL_SELECTION_SECTION_LABELS: ModelSelectionSectionLabels;
+export interface ModelSelectionSectionProps {
+    /** The model picker (its logic stays in the host). */
+    selector: ReactNode;
+    onUseDefaults: () => void;
+    defaultsTestId?: string;
+    labels?: Partial<ModelSelectionSectionLabels>;
+}
+/** Model picker next to a "Use defaults" button, with the legend of the picker's icons. */
+export declare function ModelSelectionSection({ selector, onUseDefaults, defaultsTestId, labels, }: ModelSelectionSectionProps): import("react").JSX.Element;

package/dist/settings/DocumentPicker.d.ts

@@ -0,0 +1,57 @@
+/** A document the picker can offer. `pages`/`tokens` are null for images and unparsed files. */
+export interface PickerDocument {
+    id: string;
+    title: string;
+    fileName?: string | null;
+    pages?: number | null;
+    tokens?: number | null;
+}
+/** A heading with its documents, already sorted. A group without heading is unlabeled. */
+export interface PickerGroup {
+    id: string;
+    heading?: string;
+    docs: PickerDocument[];
+}
+/** Every fixed string of the document picker. */
+export interface DocumentPickerLabels {
+    placeholder: string;
+    searchDocuments: string;
+    noDocuments: string;
+    selectedAsSource: string;
+    selectAsSource: string;
+    largeDocument: string;
+    tooLong: string;
+    pages: (n: number) => string;
+    tokens: (n: number) => string;
+}
+export declare const DEFAULT_DOCUMENT_PICKER_LABELS: DocumentPickerLabels;
+export interface DocumentPickerProps {
+    groups: PickerGroup[];
+    /** The picked document (single mode). */
+    value: string;
+    onValueChange: (id: string) => void;
+    /** The picked document's details, shown under the picker (pages, tokens, size warnings). */
+    selected?: PickerDocument;
+    /**
+     * Ids already chosen. Supplying this switches to MULTI mode: the search box is inline, the
+     * list stays open on select and ticks what is in.
+     */
+    selectedIds?: string[];
+    /**
+     * Splits each row in two: a click OPENS the document (this callback) and a leading checkbox
+     * selects it as a source via `onValueChange`. Requires `selectedIds`.
+     */
+    onOpenDocument?: (id: string) => void;
+    /** The document open in the viewer: its row is inverted (multi mode). */
+    viewingId?: string | null;
+    /** While true the list is shut (a neighbouring popup must not overlay it). */
+    forceClosed?: boolean;
+    /** Extra classes of the results list, e.g. a taller `max-h-*` when the picker is the surface. */
+    listClassName?: string;
+    labels?: Partial<DocumentPickerLabels>;
+}
+/**
+ * Searchable document picker. Single mode is a button that opens a searchable list; multi mode
+ * puts the search inline. After a pick it shows page/token counts with size warnings.
+ */
+export declare function DocumentPicker({ groups, value, onValueChange, selected, selectedIds, onOpenDocument, viewingId, forceClosed, listClassName, labels, }: DocumentPickerProps): import("react").JSX.Element;

package/dist/settings/EmailWorkspaceDialogView.d.ts

@@ -0,0 +1,60 @@
+import { type ReactNode } from 'react';
+/** Every fixed string of the email-this-workspace dialog. */
+export interface EmailWorkspaceDialogLabels {
+    title: string;
+    description: string;
+    compose: string;
+    paHintBefore: string;
+    paHintAfter: string;
+    checking: string;
+    noAssistant: string;
+    authorizedExpires: (ttl: string) => string;
+    end: string;
+    authorizePrompt: (ttl?: string) => string;
+    authorize: string;
+    authorizing: string;
+    advanced: string;
+    alreadyGranted: string;
+    standingWarning: string;
+    grant: string;
+    granting: string;
+}
+export declare const DEFAULT_EMAIL_WORKSPACE_DIALOG_LABELS: EmailWorkspaceDialogLabels;
+/** Where the member's Assistant stands for this workspace. */
+export type EmailAssistantAccess = {
+    kind: 'loading';
+} | {
+    kind: 'none';
+} | {
+    kind: 'session';
+    expiresIn: string;
+    isEnding: boolean;
+    onEnd: () => void;
+} | {
+    kind: 'idle';
+    defaultTtl?: string;
+    isAuthorizing: boolean;
+    onAuthorize: () => void;
+};
+export interface EmailWorkspaceDialogViewProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    /** Reply address of the workspace. */
+    email: string;
+    mailtoHref: string;
+    /** Deployment domain shown in the general-questions hint. */
+    paDomain: string;
+    /** Copy-to-clipboard control, rendered beside the address. */
+    copyButton: ReactNode;
+    /** Members only: the Assistant authorize / standing-access panel. Omit for non-members. */
+    access?: EmailAssistantAccess;
+    /** Standing access (Advanced tier). Only offered once an Assistant exists. */
+    standing?: {
+        alreadyGranted: boolean;
+        isGranting: boolean;
+        onGrant: () => void;
+    };
+    labels?: Partial<EmailWorkspaceDialogLabels>;
+}
+/** Presentation of the "Email this workspace" dialog: address, compose, Assistant access. */
+export declare function EmailWorkspaceDialogView({ open, onOpenChange, email, mailtoHref, paDomain, copyButton, access, standing, labels, }: EmailWorkspaceDialogViewProps): import("react").JSX.Element;

package/dist/settings/ErrorDialog.d.ts

@@ -0,0 +1,36 @@
+import type { ReactNode } from 'react';
+/** Every fixed string of the crash dialog. */
+export interface ErrorDialogLabels {
+    title: string;
+    srDescription: string;
+    reportHint: string;
+    refreshHint: string;
+    hideDetails: string;
+    viewDetails: string;
+    toggleDetailsAria: string;
+    copyAria: string;
+    copy: string;
+    copied: string;
+    refreshSession: string;
+    logout: string;
+}
+export declare const DEFAULT_ERROR_DIALOG_LABELS: ErrorDialogLabels;
+/** Developer-only error report: collapsible text and a copy button. */
+export interface ErrorDialogDetails {
+    text: string;
+    isShown: boolean;
+    isCopied: boolean;
+    onToggle: () => void;
+    onCopy: () => void;
+}
+export interface ErrorDialogViewProps {
+    /** Present only for developers; hides the report entirely otherwise. */
+    details?: ErrorDialogDetails;
+    /** "Report error" control (it owns its own submit flow). */
+    report: ReactNode;
+    onRefresh: () => void;
+    onLogout: () => void;
+    labels?: Partial<ErrorDialogLabels>;
+}
+/** Non-dismissible crash dialog: explanation, optional report, report / refresh / logout. */
+export declare function ErrorDialogView({ details, report, onRefresh, onLogout, labels, }: ErrorDialogViewProps): import("react").JSX.Element;

package/dist/settings/FloatingPanel.d.ts

@@ -0,0 +1,32 @@
+import type { MouseEventHandler, ReactNode } from 'react';
+/** Where a panel is placed: pinned beside the page, full width, floating, or its own window. */
+export type FloatingPanelMode = 'docked' | 'main' | 'overlay' | 'popout';
+export interface FloatingPanelControls {
+    /** The mode switcher + close button, for children that render their own header. */
+    modeSwitcher: ReactNode;
+}
+export interface FloatingPanelProps {
+    /** Stable id of the panel (also the id of its single header tab). */
+    panelId: string;
+    mode: FloatingPanelMode;
+    title: string;
+    subtitle?: string;
+    headerIcon?: ReactNode;
+    headerActions?: ReactNode;
+    /** Label of the docked/main header tab (defaults to the title). */
+    tabLabel?: ReactNode;
+    /** Mode switcher + close button, supplied by the host so it owns window management. */
+    modeSwitcher: ReactNode;
+    /** Content, or a render function for children that embed `modeSwitcher` in their own header. */
+    children: ReactNode | ((controls: FloatingPanelControls) => ReactNode);
+    /** Sticky footer (e.g. Cancel / Apply). */
+    footer?: ReactNode;
+    /** Click anywhere on the panel (the host tracks which panel is focused). */
+    onPanelClick?: MouseEventHandler<HTMLDivElement>;
+    className?: string;
+}
+/**
+ * Presentational frame of a floating panel: header (title / tab + mode switcher), scrolling
+ * body and optional footer. Placement and window management live in the host.
+ */
+export declare function FloatingPanel({ panelId, mode, title, subtitle, headerIcon, headerActions, tabLabel, modeSwitcher, children, footer, onPanelClick, className, }: FloatingPanelProps): import("react").JSX.Element;

package/dist/settings/JsonTree.d.ts

@@ -0,0 +1,24 @@
+/** Display hint for one field (the host derives it from its schema). */
+export interface JsonTreeHint {
+    displayName?: string;
+    description?: string;
+    /** `id` hints show the full value next to a long id. */
+    formatType?: string;
+}
+export interface JsonTreeProps<H extends JsonTreeHint = JsonTreeHint> {
+    data: unknown;
+    name?: string;
+    defaultExpanded?: boolean;
+    level?: number;
+    /** Names of the ancestors, passed to `resolveHint`. */
+    path?: string[];
+    /** Schema-aware hint for a field; omit for a plain tree. */
+    resolveHint?: (path: string[], name: string) => H | null;
+    /** Formats a primitive according to its hint. */
+    formatValue?: (value: unknown, hint: H | null) => string;
+}
+/**
+ * Recursive JSON tree with collapse/expand, copy buttons (hover, keyboard focus and touch) and
+ * optional schema-aware names/formatting. Like a console object inspector.
+ */
+export declare function JsonTree<H extends JsonTreeHint = JsonTreeHint>({ data, name, defaultExpanded, level, path, resolveHint, formatValue, }: JsonTreeProps<H>): import("react").JSX.Element;