@pollinations/ui 0.1.0-alpha.0 → 0.1.0-alpha.10

package/dist/index.d.ts

@@ -1,59 +1,167 @@
-import * as react from 'react';
-import { FC, ComponentPropsWithoutRef, ReactNode, ButtonHTMLAttributes, PropsWithChildren, CSSProperties } from 'react';
-export { B as Button, a as ButtonProps } from './Button-DQAZzvyQ.js';
-export { C as Chip } from './Chip-C5impfYd.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { Dialog as Dialog$1 } from '@ark-ui/react/dialog';
-import { T as ThemeName } from './theme-VMRlhqST.js';
-export { t as themes } from './theme-VMRlhqST.js';
+import * as react from 'react';
+import { ReactNode, CSSProperties, FC, ComponentPropsWithoutRef, RefObject, ButtonHTMLAttributes, PropsWithChildren, ComponentType, ElementType } from 'react';
+import { S as ScrollAreaProps, D as DialogProps } from './Dialog-D3Nqt8cE.js';
+export { a as Dialog, b as DialogBody, c as DialogBodyProps, d as DialogDescription, e as DialogFooter, f as DialogFooterProps, g as DialogHeader, h as DialogHeaderProps, i as DialogTitle, j as ScrollArea } from './Dialog-D3Nqt8cE.js';
+import { B as ButtonProps, a as ButtonAppearance } from './Button-BGqClaBr.js';
+export { b as Button } from './Button-BGqClaBr.js';
+import { I as IconProps } from './types-CCy9JNu9.js';
+export { C as Chip } from './Chip-v-ADv6cz.js';
 export { Field } from '@ark-ui/react/field';
+import '@ark-ui/react/dialog';
 
-/** Class merge for apps consuming the unprefixed Tailwind bridge in app.css. */
-declare function cn(...inputs: (string | undefined | null | false)[]): string;
-
-type RejectReason = "type" | "size" | "count";
-type RejectedFile = {
-    file: File;
-    reason: RejectReason;
+type DropdownProps = {
+    /** Trigger element; receives the current open state (e.g. to rotate a chevron). */
+    trigger: (open: boolean) => ReactNode;
+    /** Panel content. As a function, receives `close` to dismiss after a selection. */
+    children: ReactNode | ((close: () => void) => ReactNode);
+    /** Panel placement relative to the trigger. */
+    align?: "start" | "end";
+    side?: "top" | "bottom";
+    /** Controlled open state. Omit to let the Dropdown manage its own. */
+    open?: boolean;
+    /** Render inside the parent dialog so its focus and accessibility scope includes the menu. */
+    portalled?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Appended after the surface (widths, padding, max-height…). */
+    className?: string;
+    /** Theme variables for portaled content that cannot inherit from its trigger. */
+    panelStyle?: CSSProperties;
 };
+declare const Dropdown: FC<DropdownProps>;
 
-type PeriodGranularity = "day" | "week" | "month";
-type PeriodSelection = {
-    granularity: PeriodGranularity;
-    period: string;
+type AccountIdentityProps = {
+    name: string;
+    avatarUrl?: string | null;
+    secondaryContent?: ReactNode;
+    /** Optional dashboard destination, owned by the caller. Opens in a new tab. */
+    dashboardHref?: string;
+    className?: string;
+};
+type AccountIdentityLinkProps = Pick<AccountIdentityProps, "name" | "avatarUrl" | "className"> & {
+    /** External profile the whole pill opens in a new tab. */
+    href: string;
+};
+declare function AccountIdentity({ name, avatarUrl, secondaryContent, dashboardHref, className, }: AccountIdentityProps): react_jsx_runtime.JSX.Element;
+/** Someone else's identity as a one-line pill link, e.g. an app's developer. */
+declare function AccountIdentityLink({ name, avatarUrl, href, className, }: AccountIdentityLinkProps): react_jsx_runtime.JSX.Element;
+type AccountMenuProps = AccountIdentityProps & {
+    /** The caller owns navigation, permissions and sign-out behavior. */
+    children: DropdownProps["children"];
+    menuClassName?: string;
+    side?: "top" | "bottom";
+    menuLabel?: string;
 };
-declare function currentPeriod(): PeriodSelection;
-declare function getPeriodBucketKeys(selection: PeriodSelection): string[];
-declare function periodBucketKeyToDate(bucketKey: string, granularity: PeriodGranularity): Date;
-
 /**
- * Locks page scroll while enabled and restores the original overflow values on
- * cleanup.
+ * With `dashboardHref` the avatar is a link and the name/chevron open the
+ * menu; without one the whole pill is the trigger.
  */
-declare function useScrollLock(enabled?: boolean): void;
+declare function AccountMenu({ name, avatarUrl, dashboardHref, secondaryContent, children, className, menuClassName, side, menuLabel, }: AccountMenuProps): react_jsx_runtime.JSX.Element;
 
-type AlertIntent = "info" | "success" | "warning" | "danger";
-type AlertProps = ComponentPropsWithoutRef<"div"> & {
+type AlertIntent = "info" | "advisory" | "warning" | "danger";
+type AlertProps = Omit<ComponentPropsWithoutRef<"div">, "title"> & {
     intent?: AlertIntent;
     title?: ReactNode;
 };
 declare const Alert: FC<AlertProps>;
 
-type ButtonGroupProps = ComponentPropsWithoutRef<"div"> & {
-    wrap?: boolean;
+type AppBrandProps = {
+    appName: string;
+    href?: string;
+    size?: "md" | "sm";
+    className?: string;
 };
-declare const ButtonGroup: FC<ButtonGroupProps>;
+/** Lotus mark + app name: the one brand every internal app shows. */
+declare function AppBrand({ appName, href, size, className, }: AppBrandProps): react_jsx_runtime.JSX.Element;
 
-type ChevronIconProps = {
-    /** Rotate 180° when expanded/open. */
-    expanded?: boolean;
+type ScrollTargetRef = RefObject<HTMLElement | null>;
+type AppHeaderProps = {
+    children?: ReactNode;
+    navLabel: string;
+    /** Shows the lotus + this name instead of the pollinations.ai wordmark. */
+    appName?: string;
+    autoHide?: boolean;
+    scrollTargetRef?: ScrollTargetRef;
+    brandHref?: string;
+    brandLabel?: string;
     className?: string;
+    innerClassName?: string;
+    navClassName?: string;
+};
+declare function AppHeader({ children, navLabel, appName, autoHide, scrollTargetRef, brandHref, brandLabel, className, innerClassName, navClassName, }: AppHeaderProps): react_jsx_runtime.JSX.Element;
+
+type CalloutProps = {
+    title: ReactNode;
+    body: ReactNode;
+    children: ReactNode;
+    tone?: "theme" | "dark";
+    className?: string;
+};
+/** Prominent closing panel with a title, supporting copy, and actions. */
+declare function Callout({ title, body, children, tone, className, }: CalloutProps): react_jsx_runtime.JSX.Element;
+
+type ChatConversationProps = Omit<ScrollAreaProps, "children" | "className"> & {
+    children: ReactNode;
+    className?: string;
+    viewportClassName?: string;
+    showScrollButton?: boolean;
+    onScrollToBottom?: () => void;
+    scrollButtonLabel?: string;
 };
 /**
- * Canonical chevron used for collapsibles, dropdown triggers, and select pills
- * across the app. One icon everywhere.
+ * Scrollable chat transcript with an optional jump-to-latest control.
+ * Message data and streaming remain the consumer's responsibility.
  */
-declare const ChevronIcon: FC<ChevronIconProps>;
+declare const ChatConversation: react.ForwardRefExoticComponent<Omit<ScrollAreaProps, "className" | "children"> & {
+    children: ReactNode;
+    className?: string;
+    viewportClassName?: string;
+    showScrollButton?: boolean;
+    onScrollToBottom?: () => void;
+    scrollButtonLabel?: string;
+} & react.RefAttributes<HTMLDivElement>>;
+type ChatConversationContentProps = ComponentPropsWithoutRef<"div">;
+declare function ChatConversationContent({ className, ...props }: ChatConversationContentProps): react_jsx_runtime.JSX.Element;
+
+type ChatMessageRole = "user" | "assistant" | "system";
+type ChatMessageProps = ComponentPropsWithoutRef<"article"> & {
+    from: ChatMessageRole;
+};
+/** Protocol-neutral message surface inspired by AI Elements' Message suite. */
+declare function ChatMessage({ from, className, children, ...props }: ChatMessageProps): react_jsx_runtime.JSX.Element;
+type ChatMessageHeaderProps = ComponentPropsWithoutRef<"header"> & {
+    from: ChatMessageRole;
+    label?: ReactNode;
+    icon?: ReactNode;
+};
+declare function ChatMessageHeader({ from, label, icon, className, ...props }: ChatMessageHeaderProps): react_jsx_runtime.JSX.Element;
+type ChatMessageContentProps = ComponentPropsWithoutRef<"div">;
+declare function ChatMessageContent({ className, ...props }: ChatMessageContentProps): react_jsx_runtime.JSX.Element;
+type ChatMessageActionsProps = ComponentPropsWithoutRef<"footer">;
+declare function ChatMessageActions({ className, ...props }: ChatMessageActionsProps): react_jsx_runtime.JSX.Element;
+
+type ChatPromptInputProps = ComponentPropsWithoutRef<"fieldset">;
+/**
+ * Composable prompt shell. Put attachments or controls before the textarea and
+ * actions in ChatPromptInputFooter; submission stays owned by the parent form.
+ */
+declare function ChatPromptInput({ className, ...props }: ChatPromptInputProps): react_jsx_runtime.JSX.Element;
+declare const ChatPromptTextarea: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & {
+    error?: boolean;
+} & react.RefAttributes<HTMLTextAreaElement>>;
+type ChatPromptInputFooterProps = ComponentPropsWithoutRef<"div"> & {
+    start?: ReactNode;
+    end?: ReactNode;
+};
+declare function ChatPromptInputFooter({ start, end, children, className, ...props }: ChatPromptInputFooterProps): react_jsx_runtime.JSX.Element;
+
+type CodeBlockOwnProps = {
+    code: string;
+    codeClassName?: string;
+    language?: string;
+};
+type CodeBlockProps = CodeBlockOwnProps & Omit<ComponentPropsWithoutRef<"div">, keyof CodeBlockOwnProps | "children">;
+declare const CodeBlock: FC<CodeBlockProps>;
 
 type CollapsibleProps = {
     /** Header content (label, hint, etc). */
@@ -62,8 +170,11 @@ type CollapsibleProps = {
     onToggle: () => void;
     children: ReactNode;
     disabled?: boolean;
-    /** Outer wrapper classes — base bg, border, etc. */
+    /** Outer wrapper classes — border, rounding, etc. Keep it bg-free if the
+     *  expanded panel should stay transparent; put any fill on the trigger. */
     wrapperClassName?: string;
+    /** Trigger/header base classes (e.g. a selected background). */
+    triggerClassName?: string;
     /** Trigger hover classes. Defaults to `polli:hover:bg-theme-bg-active`. */
     hoverClassName?: string;
     /** Trigger focus classes. */
@@ -74,7 +185,7 @@ type CollapsibleProps = {
     ariaLabel?: string;
 };
 /**
- * Collapsible row primitive. One chevron, one hover/rounded behaviour for
+ * Collapsible row composition. One chevron, one hover/rounded behaviour for
  * every collapsible in the UI. Use this for any "click to reveal nested
  * content" UI — nested settings, grouped controls, optional details.
  *
@@ -83,78 +194,164 @@ type CollapsibleProps = {
  */
 declare const Collapsible: FC<CollapsibleProps>;
 
+type ConfirmIntent = "danger" | "info" | "neutral" | "commit";
+type ConfirmationDialogProps = {
+    open: boolean;
+    title: ReactNode;
+    /** Short explanation rendered as body text. */
+    description?: ReactNode;
+    /** Extra body content below the description (alerts, inputs). */
+    children?: ReactNode;
+    confirmLabel: ReactNode;
+    /** Confirm button recipe; also picks the default confirm icon. */
+    intent?: ConfirmIntent;
+    /** Override the confirm icon when the action is not a plain delete/confirm. */
+    confirmIcon?: ReactNode;
+    confirmDisabled?: boolean;
+    cancelDisabled?: boolean;
+    onConfirm: () => void;
+    onCancel: () => void;
+    size?: DialogProps["size"];
+};
+/** One floating Cancel + confirm action for every yes/no dialog. */
+declare function ConfirmationDialog({ open, title, description, children, confirmLabel, intent, confirmIcon, confirmDisabled, cancelDisabled, onConfirm, onCancel, size, }: ConfirmationDialogProps): react_jsx_runtime.JSX.Element;
+
+type ContentHeaderProps = {
+    eyebrow: ReactNode;
+    title: ReactNode;
+    subtitle?: ReactNode;
+    action?: ReactNode;
+    variant?: "page" | "section";
+    className?: string;
+};
+/** Shared page/section heading rhythm with an optional trailing action. */
+declare function ContentHeader({ eyebrow, title, subtitle, action, variant, className, }: ContentHeaderProps): react_jsx_runtime.JSX.Element;
+
 type CopyValue = string | (() => string | Promise<string>);
 type CopyButtonProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children" | "className" | "onClick" | "type" | "value"> & {
     value: CopyValue;
     children: ReactNode | ((copied: boolean) => ReactNode);
     copiedTimeoutMs?: number;
     tooltip?: ReactNode;
+    tooltipAlign?: "start" | "center";
+    tooltipClampToViewport?: boolean;
+    tooltipMaxWidth?: number;
     copiedTooltip?: ReactNode;
     tooltipClassName?: string;
     className?: string | ((copied: boolean) => string);
+    variant?: "plain" | "button";
+    /** Button intent, used with `variant="button"`. */
+    intent?: ButtonProps<"button">["intent"];
     onCopied?: () => void;
     onCopyError?: (error: unknown) => void;
 };
-declare function CopyButton({ value, children, copiedTimeoutMs, tooltip, copiedTooltip, tooltipClassName, className, onCopied, onCopyError, ...buttonProps }: CopyButtonProps): react_jsx_runtime.JSX.Element;
+declare function CopyButton({ value, children, copiedTimeoutMs, tooltip, tooltipAlign, tooltipClampToViewport, tooltipMaxWidth, copiedTooltip, tooltipClassName, className, variant, intent, onCopied, onCopyError, ...buttonProps }: CopyButtonProps): react_jsx_runtime.JSX.Element;
 
-declare const sizeClasses: {
-    readonly sm: "polli:max-w-md";
-    readonly md: "polli:max-w-xl";
-    readonly lg: "polli:max-w-2xl";
+type CopyFieldProps = Pick<CopyButtonProps, "value" | "onCopied" | "onCopyError" | "copiedTimeoutMs"> & {
+    /** Accessible name, e.g. "Copy secret key". */
+    label: string;
+    /** What to show; defaults to a string value or the label for lazy values. */
+    display?: ReactNode;
+    className?: string;
 };
-type DialogProps = {
-    open: boolean;
-    onOpenChange?: (open: boolean) => void;
-    trigger?: ReactNode;
-    triggerAsChild?: boolean;
-    triggerClassName?: string;
-    title?: ReactNode;
-    titleClassName?: string;
-    ariaLabel?: string;
-    labelledBy?: string;
-    theme?: ThemeName;
-    size?: keyof typeof sizeClasses;
-    showBackdrop?: boolean;
-    backdropClassName?: string;
-    positionerClassName?: string;
-    contentClassName?: string;
-    children: ReactNode;
+/**
+ * A value the user copies but never edits: looks like a field, behaves like a
+ * button. The whole surface copies on click; the end icon confirms.
+ */
+declare function CopyField({ value, label, display, className, ...copy }: CopyFieldProps): react_jsx_runtime.JSX.Element;
+
+type InputProps = React.ComponentPropsWithoutRef<"input"> & {
+    error?: boolean;
+    hideNumberSteppers?: boolean;
 };
-declare const Dialog: FC<DialogProps>;
-declare const DialogTitle: react.ForwardRefExoticComponent<Dialog$1.TitleProps & react.RefAttributes<HTMLHeadingElement>>;
+declare const Input: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
+    error?: boolean;
+    hideNumberSteppers?: boolean;
+} & react.RefAttributes<HTMLInputElement>>;
 
-type DropdownProps = {
-    theme: ThemeName;
-    /** Trigger element; receives the current open state (e.g. to rotate a chevron). */
-    trigger: (open: boolean) => ReactNode;
-    /** Panel content. As a function, receives `close` to dismiss after a selection. */
-    children: ReactNode | ((close: () => void) => ReactNode);
-    /** Panel placement relative to the trigger. */
+type EditableComboboxProps = Omit<InputProps, "onChange" | "value"> & {
+    value: string;
+    options: string[];
+    onChange: (value: string) => void;
+    emptyMessage?: string;
     align?: "start" | "end";
-    /** Controlled open state. Omit to let the Dropdown manage its own. */
     open?: boolean;
     onOpenChange?: (open: boolean) => void;
-    /** Appended after the surface (widths, padding, max-height…). */
-    className?: string;
+    /** Controlled filter inputs can keep incomplete selections open. */
+    closeOnSelect?: boolean;
+    /**
+     * Content rendered inside the input shell before the text field. Enables
+     * the wrapped shell layout and replaces the standalone chevron trigger.
+     */
+    startContent?: ReactNode;
+    /** Optional class for the suggestions panel. */
+    contentClassName?: string;
 };
-declare const Dropdown: FC<DropdownProps>;
+type EditableComboboxTokenProps = Omit<ComponentPropsWithoutRef<"button">, "children" | "type"> & {
+    label: string;
+    value: string;
+    highlighted?: boolean;
+};
+/** Interactive filter token intended for an EditableCombobox startContent slot. */
+declare function EditableComboboxToken({ label, value, highlighted, className, ...buttonProps }: EditableComboboxTokenProps): react_jsx_runtime.JSX.Element;
+declare function EditableCombobox({ value, options, onChange, emptyMessage, align, open, onOpenChange, closeOnSelect, startContent, contentClassName, className, disabled, name, placeholder, required, ...inputProps }: EditableComboboxProps): react_jsx_runtime.JSX.Element;
 
-type BaseDropdownItemProps = {
-    className?: string;
+type EmptyStateProps = {
+    children: ReactNode;
 };
-type DropdownItemProps<T extends React.ElementType = "button"> = PropsWithChildren<BaseDropdownItemProps> & {
-    as?: T;
-} & Omit<React.ComponentPropsWithoutRef<T>, keyof BaseDropdownItemProps | "as">;
-declare function DropdownItem<T extends React.ElementType = "button">({ as, className, children, ...rest }: DropdownItemProps<T>): react_jsx_runtime.JSX.Element;
+/**
+ * Where content would be but isn't: nothing yet, nothing matching, or a feed
+ * that couldn't load. A dashed outline marks the empty slot; the note says
+ * why.
+ */
+declare function EmptyState({ children }: EmptyStateProps): react_jsx_runtime.JSX.Element;
 
-type ExternalLinkButtonProps = {
-    theme: ThemeName;
-    href: string;
+type ExternalLinkButtonBaseProps = {
     size?: "sm" | "md" | "lg";
+    appearance?: ButtonAppearance;
+    intent?: ButtonProps["intent"];
+    /** Set false for another Pollinations property that should behave as product navigation. */
+    external?: boolean;
+    showIcon?: boolean;
+    /** Leading icon, rendered before the label. */
+    icon?: ReactNode;
     className?: string;
     children: ReactNode;
 };
-declare const ExternalLinkButton: FC<ExternalLinkButtonProps>;
+type ExternalLinkButtonAnchorProps = ExternalLinkButtonBaseProps & {
+    href: string;
+} & Omit<ComponentPropsWithoutRef<"a">, "children" | "className" | "href">;
+type ExternalLinkButtonNativeButtonProps = ExternalLinkButtonBaseProps & Omit<ComponentPropsWithoutRef<"button">, "children" | "className">;
+type ExternalLinkButtonProps = ExternalLinkButtonAnchorProps | ExternalLinkButtonNativeButtonProps;
+/** Primary flow actions such as checkout or authorization. Use InlineLink for navigation. */
+declare function ExternalLinkButton(props: ExternalLinkButtonProps): react_jsx_runtime.JSX.Element;
+
+type FieldStackProps = {
+    /** Omit for a self-describing control; label the input itself. */
+    label?: ReactNode;
+    children: ReactNode;
+    helper?: ReactNode;
+    action?: ReactNode;
+    error?: ReactNode;
+    alignLabelRow?: boolean;
+    /**
+     * `inline` puts the label in a fixed column to the left of the control
+     * (6.5rem, 5.5rem on phones), for dense settings panels whose rows
+     * should line up.
+     */
+    orientation?: "stacked" | "inline";
+    className?: string;
+    labelClassName?: string;
+    helperClassName?: string;
+    errorClassName?: string;
+};
+declare function FieldStack({ label, children, helper, action, error, alignLabelRow, orientation, className, labelClassName, helperClassName, errorClassName, }: FieldStackProps): react_jsx_runtime.JSX.Element;
+
+type RejectReason = "type" | "size" | "count";
+type RejectedFile = {
+    file: File;
+    reason: RejectReason;
+};
 
 type FileUploadProps = {
     value: File[];
@@ -163,106 +360,69 @@ type FileUploadProps = {
     maxFiles?: number;
     maxSizeBytes?: number;
     accept?: string;
+    icon?: ReactNode;
+    label?: ReactNode;
+    previewIcon?: ReactNode;
     /** Fully locks the field: no add, no remove, drops ignored. */
     disabled?: boolean;
-    /** Optional cascade override; defaults to the inherited `[data-theme]`. */
-    theme?: ThemeName;
     className?: string;
 };
-declare function FileUpload({ value, onChange, onReject, maxFiles, maxSizeBytes, accept, disabled, theme, className, }: FileUploadProps): react_jsx_runtime.JSX.Element;
-
-/** IconButton only supports `danger` (delete icons). */
-type IconButtonIntent = "danger";
-type IconButtonProps = {
-    intent?: IconButtonIntent;
-    title?: string;
-    onClick: () => void;
-    children: ReactNode;
-    className?: string;
-};
-declare const IconButton: FC<IconButtonProps>;
+declare function FileUpload({ value, onChange, onReject, maxFiles, maxSizeBytes, accept, icon, label, previewIcon, disabled, className, }: FileUploadProps): react_jsx_runtime.JSX.Element;
 
 type InfoTipProps = {
     text?: ReactNode;
     content?: ReactNode;
     label?: string;
+    /** Also opens on tap, for help that matters on phones. */
+    tapEnabled?: boolean;
 };
 /**
  * Small "i" badge that opens a tooltip on hover, click, or focus.
  *
- * Both the badge and the popup follow the page theme: badge reads
- * `bg-theme-bg-active`; popup uses the universal recipe via `<Tooltip>`
- * (`bg-theme-bg-pale` + `border-theme-border` + `text-theme-text-strong`,
- * viewport-clamped). Cursor on the badge is `cursor-help`.
+ * Quiet neutral badge and shared, viewport-clamped tooltip popup.
+ * The help cursor indicates that more information is available.
  */
 declare const InfoTip: FC<InfoTipProps>;
 
-type BaseInlineLinkProps = {
-    /** Override the cascade theme for this link's subtree. */
-    theme?: ThemeName;
-    /** Set explicitly for non-http external links, or false for custom routing components. */
-    external?: boolean;
-    showIcon?: boolean;
+type KeyChipProps = {
+    /** The visible start of the key, e.g. "sk_0ysBCkH". */
+    prefix: string;
+    /** The full key, when known: the chip then copies it on click. */
+    value?: string | null;
+    /** Accessible name for the copy action. */
+    label?: string;
     className?: string;
 };
-type InlineLinkProps<T extends React.ElementType = "a"> = PropsWithChildren<BaseInlineLinkProps> & {
-    as?: T;
-} & Omit<React.ComponentPropsWithoutRef<T>, keyof BaseInlineLinkProps | "as">;
-declare function InlineLink<T extends React.ElementType = "a">({ as, theme, external, showIcon, className, children, ...linkProps }: InlineLinkProps<T>): react_jsx_runtime.JSX.Element;
-
-type InputProps = React.ComponentPropsWithoutRef<"input"> & {
-    error?: boolean;
-    hideNumberSteppers?: boolean;
-};
-declare const Input: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
-    error?: boolean;
-    hideNumberSteppers?: boolean;
-} & react.RefAttributes<HTMLInputElement>>;
-
-/** Icons inherit color via currentColor and size via className or SVG props. */
-type IconProps = ComponentPropsWithoutRef<"svg">;
-
-declare function AppIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function BeakerIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function BookIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function CheckIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function ClipboardIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function ClockIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function DiscordIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function DownloadIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function ExternalLinkIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function GenApiIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function GitHubIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function ImageIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function LockIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function MailIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function McpIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function MenuIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function TerminalIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function TokensIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function TrendUpIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function WalletIcon(props: IconProps): react_jsx_runtime.JSX.Element;
-declare function XIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+/**
+ * One badge for every key: prefix and ellipsis, nothing else. A secret key
+ * only ever shows its prefix; a key whose value is known copies on click and
+ * carries the clipboard icon.
+ */
+declare function KeyChip({ prefix, value, label, className, }: KeyChipProps): react_jsx_runtime.JSX.Element;
 
 type BaseLinkCardProps = {
-    /** Override the cascade theme for this card's subtree. */
-    theme?: ThemeName;
     external?: boolean;
     showIcon?: boolean;
+    /** Card fill (a colour or token var); hover lifts it halfway to white. */
+    tint?: string;
     className?: string;
     surfaceClassName?: string;
 };
 type LinkCardProps<T extends React.ElementType = "a"> = PropsWithChildren<BaseLinkCardProps> & {
     as?: T;
 } & Omit<React.ComponentPropsWithoutRef<T>, keyof BaseLinkCardProps | "as">;
-declare function LinkCard<T extends React.ElementType = "a">({ as, theme, external, showIcon, className, surfaceClassName, children, ...linkProps }: LinkCardProps<T>): react_jsx_runtime.JSX.Element;
+declare function LinkCard<T extends React.ElementType = "a">({ as, external, showIcon, tint, className, surfaceClassName, children, ...linkProps }: LinkCardProps<T>): react_jsx_runtime.JSX.Element;
 
-type MarkdownProps = {
-    children: string;
-    className?: string;
+type MediaPlaceholderProps = ComponentPropsWithoutRef<"div"> & {
+    icon?: ReactNode;
+    label?: ReactNode;
+    detail?: ReactNode;
+    /** Work is running: the icon disc breathes (still under reduced motion). */
+    busy?: boolean;
+    /** Fill colour (a token var), e.g. a modality tint; replaces the dashed outline. */
+    tint?: string;
 };
-/** Compact markdown for cards and snippets. Use Prose for document-style content. */
-declare function Markdown({ children, className }: MarkdownProps): react_jsx_runtime.JSX.Element;
+declare const MediaPlaceholder: FC<MediaPlaceholderProps>;
 
 type MultiSelectOption = {
     value: string;
@@ -275,65 +435,66 @@ type MultiSelectProps = {
     placeholder: string;
     disabled?: boolean;
     disabledText?: string;
+    disabledTooltip?: string;
     align?: "start" | "end";
     label?: string;
-    theme: ThemeName;
+    /** Accessible name when the visible label is supplied by the caller. */
+    ariaLabel?: string;
+    /** Fill the available width, allowing the trigger label to truncate. */
+    fullWidth?: boolean;
 };
 declare const MultiSelect: FC<MultiSelectProps>;
 
 type BaseNavItemProps = {
-    /** Section color via the `[data-theme]` cascade — tints the dot + active fill. */
-    theme?: ThemeName;
-    /** Current/selected item — fills with the section color + sets `aria-current`. */
+    /** Current/selected item — fills with the accent + sets `aria-current`. */
     active?: boolean;
+    /** Optional leading icon. */
+    icon?: ComponentType<{
+        className?: string;
+    }>;
     className?: string;
 };
 type NavItemProps<T extends React.ElementType = "button"> = PropsWithChildren<BaseNavItemProps> & {
     as?: T;
 } & Omit<React.ComponentPropsWithoutRef<T>, keyof BaseNavItemProps | "as">;
 /**
- * Minimal nav item — a themed pill with a persistent section-color dot, neutral
- * when inactive and filled with the section color when active. Polymorphic:
- * `<NavItem>` (button) for in-page nav, `<NavItem as={Link} active={…}>` for
- * routed nav. Mirrors enter's sidebar item so both apps share one design.
+ * Minimal nav item — a pill that's neutral when inactive and filled with the
+ * accent when active, with an optional leading icon. Polymorphic: `<NavItem>`
+ * (button) for in-page nav, `<NavItem as={Link} active={…}>` for routed nav.
+ * Shared by the enter dashboard rail and apps so both use one design.
  */
-declare function NavItem<T extends React.ElementType = "button">({ as, theme, active, className, children, ...rest }: NavItemProps<T>): react_jsx_runtime.JSX.Element;
+declare function NavItem<T extends React.ElementType = "button">({ as, active, icon: Icon, className, children, ...rest }: NavItemProps<T>): react_jsx_runtime.JSX.Element;
+
+type PeriodGranularity = "day" | "week" | "month";
+type PeriodSelection = {
+    granularity: PeriodGranularity;
+    period: string;
+};
+type PeriodWindow = {
+    start: Date;
+    end: Date;
+};
+declare function periodFromDate(granularity: PeriodGranularity, date?: Date): PeriodSelection;
+declare function currentPeriod(): PeriodSelection;
+declare function periodToWindow(selection: PeriodSelection): PeriodWindow;
+declare function getPeriodBucketKeys(selection: PeriodSelection): string[];
+declare function periodBucketKeyToDate(bucketKey: string, granularity: PeriodGranularity): Date;
+declare function isPeriodSelectable(selection: PeriodSelection, minDate?: Date, maxDate?: Date): boolean;
 
 type PeriodPickerProps = {
     value: PeriodSelection;
     onChange: (value: PeriodSelection) => void;
-    theme: ThemeName;
     minDate?: Date;
     maxDate?: Date;
+    /** Custom trigger for a calendar with a fixed granularity. */
+    trigger?: (open: boolean) => ReactNode;
+    /** Optional controls above the calendar grid. */
+    header?: ReactNode;
 };
 declare const PeriodPicker: FC<PeriodPickerProps>;
 
-type ProseProps = {
-    children: string;
-    className?: string;
-};
-declare function Prose({ children, className }: ProseProps): react_jsx_runtime.JSX.Element;
-
-type ScrollAxis = "y" | "x";
-type ScrollAreaOwnProps = {
-    /** Override the ambient cascade theme for this scroller's thumb. */
-    theme?: ThemeName;
-    /** Scroll direction. Default `y`. */
-    axis?: ScrollAxis;
-    className?: string;
-};
-type ScrollAreaProps = PropsWithChildren<ScrollAreaOwnProps & Omit<ComponentPropsWithoutRef<"div">, keyof ScrollAreaOwnProps>>;
-/**
- * Themed auto-hide scroll container. Thumb color follows the nearest
- * `[data-theme="..."]` ancestor; pass `theme` to override locally.
- */
-declare const ScrollArea: react.ForwardRefExoticComponent<ScrollAreaOwnProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof ScrollAreaOwnProps> & {
-    children?: react.ReactNode | undefined;
-} & react.RefAttributes<HTMLDivElement>>;
-
 type SectionProps = {
     title: string;
-    theme: ThemeName;
     id?: string;
     framed?: boolean;
     intro?: ReactNode;
@@ -346,20 +507,123 @@ type SectionProps = {
 };
 declare const Section: FC<SectionProps>;
 
-type SliderProps = Omit<React.ComponentPropsWithoutRef<"input">, "type"> & {
-    /** Fill percentage from 0-100. Falls back to value/min/max when omitted. */
-    progress?: number;
+declare function AppIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function AccountIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function ArrowRightIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function BeakerIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function BotIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function BookIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function BugIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function CheckIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function ClipboardIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function ClockIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function DiscordIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function InstagramIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function XSocialIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function LinkedInIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function DownloadIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function ExpandIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function PlayIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function PauseIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function CloudUploadIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function ExternalLinkIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function GenApiIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function GitBranchIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function GitPullRequestIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function GraduationCapIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function SparklesIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function GitHubIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function ImageIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function CubeIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function AudioIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function LockIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function LogInIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function LogOutIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function MailIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function McpIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function MenuIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function NewspaperIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function PlusIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function TerminalIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function ToolIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function TargetIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function TokensIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function UsageIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function WarningIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function TrendUpIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function EarningsIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function WalletIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+/** A paper receipt: what a price includes. */
+declare function ReceiptIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function MoonIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function SunIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function XIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function TrashIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function ChatIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function RobotIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function EyeIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function EyeOffIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function VideoIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function MicIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function SpeakerIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function MegaphoneIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function ReasoningIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function RocketIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function SearchIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function SignOutIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function PowerIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function SparkleIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function StarIcon({ filled, ...props }: IconProps & {
+    filled?: boolean;
+}): react_jsx_runtime.JSX.Element;
+declare function CodeIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function DatabaseIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function CardIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function SproutIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function PencilIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function KeyIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function GlobeIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function ArrowLeftIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+declare function RefreshIcon(props: IconProps): react_jsx_runtime.JSX.Element;
+
+declare const networks: {
+    readonly discord: {
+        readonly Icon: typeof DiscordIcon;
+        readonly className: "polli:bg-social-discord polli:text-social-discord-text polli:hover:brightness-110";
+    };
+    readonly github: {
+        readonly Icon: typeof GitHubIcon;
+        readonly className: "polli:border polli:border-social-github-border polli:bg-social-github polli:text-social-github-text polli:hover:bg-social-github-hover";
+    };
 };
-declare const Slider: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "type"> & {
-    /** Fill percentage from 0-100. Falls back to value/min/max when omitted. */
-    progress?: number;
-} & react.RefAttributes<HTMLInputElement>>;
+type BaseSocialCountProps = {
+    network: keyof typeof networks;
+    /** Off when the network icon already sits next to the pill. */
+    showIcon?: boolean;
+    className?: string;
+};
+type SocialCountProps<T extends ElementType = "a"> = PropsWithChildren<BaseSocialCountProps> & {
+    as?: T;
+} & Omit<React.ComponentPropsWithoutRef<T>, keyof BaseSocialCountProps | "as">;
+/**
+ * A live community count (Discord online, GitHub stars) in the network's own
+ * colours, at the colour-mode toggle's 28px height so the header has one
+ * small-pill size. A link by default; `as="span"` inside another link.
+ */
+declare function SocialCount<T extends ElementType = "a">({ as, network, showIcon, className, children, ...rest }: SocialCountProps<T>): react_jsx_runtime.JSX.Element;
 
+/**
+ * - `stat` — large numeric value (default)
+ * - `fact` — small wrapping prose value (labeled fact tile)
+ * - `display` — a headline number in the heading face, value first with a
+ *   quiet label under it (website stats such as live request counts)
+ */
+type StatCardVariant = "stat" | "fact" | "display";
 type StatCardProps = {
     label: ReactNode;
     value: ReactNode;
     detail?: ReactNode;
-    theme?: ThemeName;
+    variant?: StatCardVariant;
     className?: string;
     labelClassName?: string;
     valueClassName?: string;
@@ -367,65 +631,338 @@ type StatCardProps = {
 };
 declare const StatCard: FC<StatCardProps>;
 
+type ToolCallStatus = "pending" | "running" | "approval-requested" | "approval-responded" | "complete" | "error" | "denied";
+interface ToolCallDetailsProps {
+    name: string;
+    input?: unknown;
+    output?: unknown;
+    error?: unknown;
+    status?: ToolCallStatus;
+    defaultOpen?: boolean;
+    className?: string;
+}
+/** Framework-neutral disclosure for server- or client-executed tool calls. */
+declare function ToolCallDetails({ name, input, output, error, status, defaultOpen, className, }: ToolCallDetailsProps): react_jsx_runtime.JSX.Element;
+
+/** Class merge for apps consuming the unprefixed Tailwind bridge in app.css. */
+declare function cn(...inputs: (string | undefined | null | false)[]): string;
+
+/**
+ * Locks page scroll while enabled and restores the original overflow values on
+ * cleanup.
+ */
+declare function useScrollLock(enabled?: boolean): void;
+
+type BrandMarkProps = {
+    variant?: "mark" | "lockup";
+    className?: string;
+};
+/** The lotus (or lotus + wordmark) painted in currentColor; size it with className. */
+declare function BrandMark({ variant, className }: BrandMarkProps): react_jsx_runtime.JSX.Element;
+
+type ButtonGroupProps = ComponentPropsWithoutRef<"div">;
+declare const ButtonGroup: FC<ButtonGroupProps>;
+
+type ChevronIconProps = {
+    /** Rotate 180° when expanded/open. */
+    expanded?: boolean;
+    className?: string;
+};
+/**
+ * Canonical chevron used for collapsibles, dropdown triggers, and select pills
+ * across the app. One icon everywhere.
+ */
+declare const ChevronIcon: FC<ChevronIconProps>;
+
+/**
+ * Light/dark colour mode. The chosen mode is reflected as `class="dark"` on
+ * <html>, which flips the design-system tokens (see styles/tokens.css: `.dark`
+ * + `.dark [data-theme]`). One shared module-level store backs every
+ * `useColorMode()` consumer, so duplicate toggles never desync and changes
+ * propagate across tabs.
+ *
+ * The chosen mode is persisted to localStorage (per-origin), which also powers
+ * the cross-tab `storage` sync below. Read priority: localStorage → system
+ * preference. Choosing the mode the system already uses clears the stored
+ * choice, so later visits follow the system again.
+ *
+ * Host apps should set the initial class pre-paint (a tiny inline script in the
+ * document head, reading the same key) to avoid a flash of light before React
+ * mounts; this store is the source of truth after hydration.
+ *
+ * Side-effect-free on import: the <html> sync and the cross-tab listener are
+ * attached lazily on first subscribe, so importing this module (e.g. via the
+ * package barrel) never mutates the DOM on its own.
+ */
+type ColorMode = "light" | "dark";
+/**
+ * Set the color mode programmatically. Updates the shared store (so every
+ * `useColorMode()` consumer re-renders), flips the `.dark` class, and persists
+ * to localStorage, or clears it when the mode matches the system.
+ */
+declare function setColorMode(mode: ColorMode): void;
+declare function useColorMode(): {
+    mode: ColorMode;
+    isDark: boolean;
+    toggle: () => void;
+};
+/**
+ * Sliding sun/moon switch: `Switch` as a two-way choice, so the track stays
+ * neutral and the thumb carries the active mode's icon. Self-contained —
+ * wires itself to `useColorMode`.
+ */
+declare const ColorModeToggle: FC;
+
+type DrawerProps = {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    ariaLabel: string;
+    children: ReactNode;
+    side?: "left" | "right";
+    contentClassName?: string;
+};
+/** Accessible side drawer for mobile navigation and compact tools. */
+declare const Drawer: FC<DrawerProps>;
+
+type BaseDropdownItemProps = {
+    className?: string;
+};
+type DropdownItemProps<T extends React.ElementType = "button"> = PropsWithChildren<BaseDropdownItemProps> & {
+    as?: T;
+} & Omit<React.ComponentPropsWithoutRef<T>, keyof BaseDropdownItemProps | "as">;
+declare function DropdownItem<T extends React.ElementType = "button">({ as, className, children, ...rest }: DropdownItemProps<T>): react_jsx_runtime.JSX.Element;
+
+declare const sizeClasses: {
+    readonly page: "polli:text-sm polli:tracking-widest polli:text-theme-text-soft";
+    readonly card: "polli:text-xs polli:tracking-wider polli:text-theme-text-soft";
+    readonly chrome: "polli:text-micro polli:tracking-widest polli:text-theme-text-muted";
+};
+type EyebrowOwnProps<T extends ElementType> = {
+    as?: T;
+    size?: keyof typeof sizeClasses;
+    className?: string;
+    children: ReactNode;
+};
+type EyebrowProps<T extends ElementType = "span"> = EyebrowOwnProps<T> & Omit<ComponentPropsWithoutRef<T>, keyof EyebrowOwnProps<T>>;
+/** Uppercase pixel label for page, card, and chrome metadata. */
+declare function Eyebrow<T extends ElementType = "span">({ as, size, className, children, ...rest }: EyebrowProps<T>): react_jsx_runtime.JSX.Element;
+
+/** `danger` (delete, red) and `info` (edit/links, blue). */
+type IconButtonIntent = "danger" | "info";
+type IconButtonVariant = "tile" | "ghost";
+type IconButtonProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children" | "className" | "title"> & {
+    intent?: IconButtonIntent;
+    variant?: IconButtonVariant;
+    pressed?: boolean;
+    title?: string;
+    tooltip?: ReactNode;
+    tooltipAlign?: "start" | "center";
+    tooltipClampToViewport?: boolean;
+    children: ReactNode;
+    className?: string;
+    size?: "sm" | "md";
+    /** Renders a link with the same look, e.g. a social icon. */
+    href?: string;
+    target?: string;
+    rel?: string;
+};
+declare const IconButton: react.ForwardRefExoticComponent<Omit<ButtonHTMLAttributes<HTMLButtonElement>, "className" | "children" | "title"> & {
+    intent?: IconButtonIntent;
+    variant?: IconButtonVariant;
+    pressed?: boolean;
+    title?: string;
+    tooltip?: ReactNode;
+    tooltipAlign?: "start" | "center";
+    tooltipClampToViewport?: boolean;
+    children: ReactNode;
+    className?: string;
+    size?: "sm" | "md";
+    /** Renders a link with the same look, e.g. a social icon. */
+    href?: string;
+    target?: string;
+    rel?: string;
+} & react.RefAttributes<HTMLButtonElement>>;
+
+declare const toneClasses: {
+    readonly neutral: "polli:bg-theme-bg-subtle polli:text-theme-text-strong";
+    readonly paid: "polli-wallet-chip-paid";
+    readonly tier: "polli-wallet-chip-tier";
+};
+type IconTileProps = {
+    icon: ComponentType<IconProps>;
+    tone?: keyof typeof toneClasses;
+};
+/** A 44px rounded square holding one icon, leading a feature or info row. */
+declare function IconTile({ icon: Icon, tone }: IconTileProps): react_jsx_runtime.JSX.Element;
+
+type BaseInlineLinkProps = {
+    /** Set explicitly for non-http external links, or false for custom routing components. */
+    external?: boolean;
+    showIcon?: boolean;
+    /** Inline text inherits its size; footers use 13px and standalone links 14px. */
+    size?: "inherit" | "footer" | "sm";
+    /** Accent for prominent links; quiet for secondary navigation. */
+    tone?: "accent" | "quiet";
+    className?: string;
+};
+type InlineLinkProps<T extends React.ElementType = "a"> = PropsWithChildren<BaseInlineLinkProps> & {
+    as?: T;
+} & Omit<React.ComponentPropsWithoutRef<T>, keyof BaseInlineLinkProps | "as">;
+/** Shared text-link rule: surrounding font, selectable ink, persistent underline,
+ * visible keyboard focus, and an external arrow only when leaving the app.
+ * Navigation and button-shaped actions use their own primitives.
+ */
+declare function InlineLink<T extends React.ElementType = "a">({ as, external, showIcon, size, tone, className, children, ...linkProps }: InlineLinkProps<T>): react_jsx_runtime.JSX.Element;
+
+/**
+ * A small green "live" marker for numbers that update in real time. A slow
+ * 2.4s ping says "now" without pulling the eye; under reduced motion only
+ * the still dot remains. Decorative: the number's own text carries meaning.
+ */
+declare function LiveDot({ className }: {
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+
+/** Compact status for both initial loading and background updates. */
+declare function LoadingStatus({ children }: {
+    children: ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
+declare const shapeClasses: {
+    readonly card: "polli:rounded-card";
+    readonly text: "polli:rounded-md";
+    readonly media: "";
+};
+type SkeletonProps = {
+    shape?: keyof typeof shapeClasses;
+    /** Size only (height, width, aspect ratio); the shape sets the corners. */
+    className?: string;
+};
+/**
+ * A quiet pulsing block that holds the place of content still loading, at
+ * the size of what replaces it. Decorative: mark the loading region with
+ * aria-busy. Still under reduced motion.
+ */
+declare function Skeleton({ shape, className }: SkeletonProps): react_jsx_runtime.JSX.Element;
+
+type SliderProps = Omit<React.ComponentPropsWithoutRef<"input">, "type"> & {
+    /** Fill percentage from 0-100. Falls back to value/min/max when omitted. */
+    progress?: number;
+};
+declare const Slider: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "type"> & {
+    /** Fill percentage from 0-100. Falls back to value/min/max when omitted. */
+    progress?: number;
+} & react.RefAttributes<HTMLInputElement>>;
+
+type StableLabelProps = {
+    text: string;
+    /** Every text this label can show; the widest sets its size. */
+    options: readonly string[];
+    /** `end` aligns to the end from sm up and to the start on phones. */
+    align?: "center" | "end";
+    /** Drawn before the text in every option, so it stays beside it. */
+    prefix?: ReactNode;
+};
+/**
+ * Text that changes without moving anything: every option is stacked in one
+ * grid cell, the unused ones invisible, so the widest sets the size.
+ */
+declare function StableLabel({ text, options, align, prefix, }: StableLabelProps): react_jsx_runtime.JSX.Element;
+
 type SurfaceVariant = "panel" | "card" | "card-themed";
 type SurfaceOwnProps = {
-    /** Override the cascade theme for this surface's subtree. */
-    theme?: ThemeName;
     /**
-     * Visual role.
-     * - `panel` — outer container: bordered, semi-transparent theme bg
-     * - `card` — borderless white inner (default)
-     * - `card-themed` — borderless theme-tinted inner (deeper than panel)
+     * Depth role — flat: each level is one tint step, never a shadow or border.
+     * - `panel` — Level 1 block: sections and page groups
+     * - `card` — Level 2 card inside a block (default)
+     * - `card-themed` — Level 2 card carrying the accent tint
      */
     variant?: SurfaceVariant;
     className?: string;
 };
-type SurfaceProps = PropsWithChildren<SurfaceOwnProps & Omit<ComponentPropsWithoutRef<"div">, keyof SurfaceOwnProps | "color">>;
-declare const Surface: FC<SurfaceProps>;
+/**
+ * Polymorphic like Button, TabButton and LinkCard, so a card that is itself a
+ * link renders one element instead of an anchor wrapping a div. Defaults to
+ * <div>, so existing call sites are unchanged.
+ */
+type SurfaceProps<T extends ElementType = "div"> = SurfaceOwnProps & {
+    as?: T;
+} & Omit<ComponentPropsWithoutRef<T>, keyof SurfaceOwnProps | "as" | "color">;
+declare function Surface<T extends ElementType = "div">({ as, variant, className, children, ...rest }: SurfaceProps<T>): react_jsx_runtime.JSX.Element;
 
 type SwitchStatus = "off" | "on" | "invalid";
+type SwitchSize = "sm" | "md" | "lg";
 type SwitchProps = {
     checked: boolean;
     onChange: (next: boolean) => void;
-    /** Visual status. Drives track colour only. Defaults to `checked ? "on" : "off"`. */
+    /** Track colour. Defaults to `checked ? "on" : "off"`. */
     status?: SwitchStatus;
     /** Accessible label (aria-label). Not rendered visibly. */
     ariaLabel?: string;
     disabled?: boolean;
+    /** Same heights as `Button` sm / md / lg, so a switch lines up with one. */
+    size?: SwitchSize;
+    /**
+     * A two-way choice (light/dark) rather than on/off: the thumb carries the
+     * current side's icon, the other sits faint on the empty side, and the
+     * track looks the same in both positions.
+     */
+    icons?: {
+        off: ReactNode;
+        on: ReactNode;
+    };
     className?: string;
 };
 /**
- * Binary toggle primitive. Universal palette — does NOT follow the page
- * theme. Three states: off (white), on (soft green), invalid (soft red,
- * for "enabled but needs attention").
- *
- * `checked` drives thumb position; `status` drives track colour. So
- * `checked={true} status="invalid"` renders thumb-right with a red track.
+ * Binary toggle, in `Button`'s sizes: grey off, green on. `checked` moves the thumb;
+ * `status` colours it, so `checked status="invalid"` is thumb-right in red.
+ * With `icons` it is a two-way choice with a solid thumb on both sides.
  */
 declare const Switch: FC<SwitchProps>;
 
-type TabButtonProps = {
-    active: boolean;
-    onClick: () => void;
+type TabButtonOwnProps = {
+    /** `mixed`: a group toggle where only some of its items are selected. */
+    active: boolean | "mixed";
+    /** Omit when rendering as a link (`as`) and navigation carries the change. */
+    onClick?: () => void;
     children: ReactNode;
-    /** Optional cascade override; defaults to inherited [data-theme]. */
-    theme?: ThemeName;
-    size?: "md" | "sm";
-    variant?: "default" | "ghost";
+    /** Leading icon, sized to the label like Button's. */
+    icon?: ReactNode;
+    size?: "lg" | "md" | "sm" | "xs";
+    variant?: "soft" | "ghost";
+    /**
+     * `amber` and `green` fill the selected pill with the wallet's pale paid
+     * and Quest Pollen chip colours, which read at the same strength together.
+     * `brand` is site navigation: bold labels, the brand accent for the
+     * current page and a lighter preview of it on hover.
+     */
+    intent?: "neutral" | "amber" | "green" | "brand";
+    /** Muted secondary text after the label, e.g. a model's creator. */
+    detail?: ReactNode;
     ariaLabel?: string;
     disabled?: boolean;
     className?: string;
 };
-declare const TabButton: FC<TabButtonProps>;
+/**
+ * Polymorphic like Button, so a tab that navigates can render a real anchor
+ * instead of a click handler — middle-click, right-click and crawlers all
+ * depend on that. Defaults to <button>, so existing call sites are unchanged.
+ */
+type TabButtonProps<T extends ElementType = "button"> = TabButtonOwnProps & {
+    as?: T;
+} & Omit<ComponentPropsWithoutRef<T>, keyof TabButtonOwnProps | "as">;
+declare function TabButton<T extends ElementType = "button">({ as, active, onClick, children, icon, size, variant, intent, detail, ariaLabel, disabled, className, ...rest }: TabButtonProps<T>): react_jsx_runtime.JSX.Element;
 
 type Align = "left" | "center" | "right";
-type RowIntent = "default" | "success" | "warning" | "danger";
+type RowIntent = "default" | "warning" | "danger";
 type SortDirection = "asc" | "desc";
 type TableProps = ComponentPropsWithoutRef<"table">;
 declare const Table: FC<TableProps>;
 type TableHeadProps = ComponentPropsWithoutRef<"thead">;
 declare const TableHead: FC<TableHeadProps>;
-type TableBodyProps = ComponentPropsWithoutRef<"tbody">;
+type TableBodyProps = ComponentPropsWithoutRef<"tbody"> & {
+    divider?: "themed" | "neutral";
+};
 declare const TableBody: FC<TableBodyProps>;
 type TableRowProps = ComponentPropsWithoutRef<"tr"> & {
     intent?: RowIntent;
@@ -446,6 +983,16 @@ type TableCellProps = ComponentPropsWithoutRef<"td"> & {
 };
 declare const TableCell: FC<TableCellProps>;
 
+type TableDisclosureButtonProps = {
+    children: ReactNode;
+    disabled?: boolean;
+    expanded: boolean;
+    onClick: () => void;
+    className?: string;
+};
+/** Compact disclosure trigger for expandable table rows. */
+declare const TableDisclosureButton: FC<TableDisclosureButtonProps>;
+
 type TextareaProps = React.ComponentPropsWithoutRef<"textarea"> & {
     error?: boolean;
 };
@@ -456,10 +1003,15 @@ declare const Textarea: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLP
 type TooltipProps = {
     children: ReactNode;
     content: ReactNode;
+    align?: "start" | "center";
     ariaLabel?: string;
+    clampToViewport?: boolean;
     className?: string;
+    maxWidth?: number;
     onClick?: () => void;
+    stopClickPropagation?: boolean;
     style?: CSSProperties;
+    tapEnabled?: boolean;
     triggerAs?: "button" | "span";
     /**
      * When true, the inner cursor wrapper uses display:contents so the
@@ -470,4 +1022,25 @@ type TooltipProps = {
 };
 declare const Tooltip: FC<TooltipProps>;
 
-export { Alert, type AlertProps, AppIcon, BeakerIcon, BookIcon, ButtonGroup, type ButtonGroupProps, CheckIcon, ChevronIcon, ClipboardIcon, ClockIcon, Collapsible, type CollapsibleProps, CopyButton, type CopyButtonProps, Dialog, type DialogProps, DialogTitle, DiscordIcon, DownloadIcon, Dropdown, DropdownItem, type DropdownItemProps, type DropdownProps, ExternalLinkButton, type ExternalLinkButtonProps, ExternalLinkIcon, FileUpload, type FileUploadProps, GenApiIcon, GitHubIcon, IconButton, type IconProps, ImageIcon, InfoTip, InlineLink, type InlineLinkProps, Input, type InputProps, LinkCard, type LinkCardProps, LockIcon, MailIcon, Markdown, type MarkdownProps, McpIcon, MenuIcon, MultiSelect, type MultiSelectProps, NavItem, type NavItemProps, type PeriodGranularity, PeriodPicker, type PeriodPickerProps, type PeriodSelection, Prose, type ProseProps, type RejectReason, type RejectedFile, ScrollArea, type ScrollAreaProps, Section, type SectionProps, Slider, type SliderProps, StatCard, type StatCardProps, Surface, Switch, type SwitchProps, type SwitchStatus, TabButton, type TabButtonProps, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableHead, type TableHeadProps, TableHeaderCell, type TableHeaderCellProps, type TableProps, TableRow, type TableRowProps, TerminalIcon, Textarea, type TextareaProps, ThemeName, TokensIcon, Tooltip, TrendUpIcon, WalletIcon, XIcon, cn, currentPeriod, getPeriodBucketKeys, periodBucketKeyToDate, useScrollLock };
+type HeadingSize = "display" | "title" | "section" | "subsection" | "card";
+type TextSize = "body" | "sm" | "xs" | "micro";
+type TextTone = "base" | "strong" | "soft" | "muted";
+type TextWeight = "normal" | "medium" | "semibold" | "bold";
+type HeadingOwnProps<T extends ElementType> = PropsWithChildren<{
+    as?: T;
+    size?: HeadingSize;
+    className?: string;
+}>;
+type HeadingProps<T extends ElementType = "h2"> = HeadingOwnProps<T> & Omit<ComponentPropsWithoutRef<T>, keyof HeadingOwnProps<T>>;
+declare function Heading<T extends ElementType = "h2">({ as, size, className, children, ...rest }: HeadingProps<T>): react_jsx_runtime.JSX.Element;
+type TextOwnProps<T extends ElementType> = PropsWithChildren<{
+    as?: T;
+    size?: TextSize;
+    tone?: TextTone;
+    weight?: TextWeight;
+    className?: string;
+}>;
+type TextProps<T extends ElementType = "p"> = TextOwnProps<T> & Omit<ComponentPropsWithoutRef<T>, keyof TextOwnProps<T>>;
+declare function Text<T extends ElementType = "p">({ as, size, tone, weight, className, children, ...rest }: TextProps<T>): react_jsx_runtime.JSX.Element;
+
+export { AccountIcon, AccountIdentity, AccountIdentityLink, type AccountIdentityLinkProps, type AccountIdentityProps, AccountMenu, type AccountMenuProps, Alert, type AlertProps, AppBrand, type AppBrandProps, AppHeader, type AppHeaderProps, AppIcon, ArrowLeftIcon, ArrowRightIcon, AudioIcon, BeakerIcon, BookIcon, BotIcon, BrandMark, type BrandMarkProps, BugIcon, ButtonAppearance, ButtonGroup, type ButtonGroupProps, ButtonProps, Callout, type CalloutProps, CardIcon, ChatConversation, ChatConversationContent, type ChatConversationContentProps, type ChatConversationProps, ChatIcon, ChatMessage, ChatMessageActions, type ChatMessageActionsProps, ChatMessageContent, type ChatMessageContentProps, ChatMessageHeader, type ChatMessageHeaderProps, type ChatMessageProps, type ChatMessageRole, ChatPromptInput, ChatPromptInputFooter, type ChatPromptInputFooterProps, type ChatPromptInputProps, ChatPromptTextarea, CheckIcon, ChevronIcon, ClipboardIcon, ClockIcon, CloudUploadIcon, CodeBlock, type CodeBlockProps, CodeIcon, Collapsible, type CollapsibleProps, ColorModeToggle, ConfirmationDialog, type ConfirmationDialogProps, ContentHeader, type ContentHeaderProps, CopyButton, type CopyButtonProps, CopyField, type CopyFieldProps, CubeIcon, DatabaseIcon, DialogProps, DiscordIcon, DownloadIcon, Drawer, type DrawerProps, Dropdown, DropdownItem, type DropdownItemProps, type DropdownProps, EarningsIcon, EditableCombobox, type EditableComboboxProps, EditableComboboxToken, type EditableComboboxTokenProps, EmptyState, type EmptyStateProps, ExpandIcon, ExternalLinkButton, type ExternalLinkButtonProps, ExternalLinkIcon, EyeIcon, EyeOffIcon, Eyebrow, type EyebrowProps, FieldStack, type FieldStackProps, FileUpload, type FileUploadProps, GenApiIcon, GitBranchIcon, GitHubIcon, GitPullRequestIcon, GlobeIcon, GraduationCapIcon, Heading, type HeadingProps, IconButton, type IconButtonIntent, type IconButtonProps, type IconButtonVariant, IconProps, IconTile, type IconTileProps, ImageIcon, InfoTip, InlineLink, type InlineLinkProps, Input, type InputProps, InstagramIcon, KeyChip, type KeyChipProps, KeyIcon, LinkCard, type LinkCardProps, LinkedInIcon, LiveDot, LoadingStatus, LockIcon, LogInIcon, LogOutIcon, MailIcon, McpIcon, MediaPlaceholder, type MediaPlaceholderProps, MegaphoneIcon, MenuIcon, MicIcon, MoonIcon, MultiSelect, type MultiSelectProps, NavItem, type NavItemProps, NewspaperIcon, PauseIcon, PencilIcon, type PeriodGranularity, PeriodPicker, type PeriodPickerProps, type PeriodSelection, PlayIcon, PlusIcon, PowerIcon, ReasoningIcon, ReceiptIcon, RefreshIcon, RobotIcon, RocketIcon, ScrollAreaProps, SearchIcon, Section, type SectionProps, SignOutIcon, Skeleton, type SkeletonProps, Slider, type SliderProps, SocialCount, type SocialCountProps, SparkleIcon, SparklesIcon, SpeakerIcon, SproutIcon, StableLabel, type StableLabelProps, StarIcon, StatCard, type StatCardProps, SunIcon, Surface, type SurfaceProps, Switch, type SwitchProps, type SwitchSize, type SwitchStatus, TabButton, type TabButtonProps, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableDisclosureButton, type TableDisclosureButtonProps, TableHead, type TableHeadProps, TableHeaderCell, type TableHeaderCellProps, type TableProps, TableRow, type TableRowProps, TargetIcon, TerminalIcon, Text, type TextProps, Textarea, type TextareaProps, TokensIcon, ToolCallDetails, type ToolCallDetailsProps, type ToolCallStatus, ToolIcon, Tooltip, TrashIcon, TrendUpIcon, UsageIcon, VideoIcon, WalletIcon, WarningIcon, XIcon, XSocialIcon, cn, currentPeriod, getPeriodBucketKeys, isPeriodSelectable, periodBucketKeyToDate, periodFromDate, periodToWindow, setColorMode, useColorMode, useScrollLock };