@pollinations/ui 0.1.0-alpha.3 → 0.1.0-alpha.4

package/dist/index.d.cts

@@ -1,10 +1,10 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 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-yXzIFrDg.cjs';
-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-yXzIFrDg.cjs';
-import { B as ButtonProps, a as ButtonAppearance } from './Button-CO3Dpbkj.cjs';
-export { b as Button } from './Button-CO3Dpbkj.cjs';
+import { S as ScrollAreaProps, D as DialogProps } from './Dialog-D3Nqt8cE.cjs';
+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.cjs';
+import { B as ButtonProps, a as ButtonAppearance } from './Button-ByKwRtdw.cjs';
+export { b as Button } from './Button-ByKwRtdw.cjs';
 export { C as Chip } from './Chip-v-ADv6cz.cjs';
 export { Field } from '@ark-ui/react/field';
 import '@ark-ui/react/dialog';
@@ -37,7 +37,13 @@ type AccountIdentityProps = {
     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"];
@@ -58,10 +64,21 @@ type AlertProps = Omit<ComponentPropsWithoutRef<"div">, "title"> & {
 };
 declare const Alert: FC<AlertProps>;
 
+type AppBrandProps = {
+    appName: string;
+    href?: string;
+    size?: "md" | "sm";
+    className?: string;
+};
+/** 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 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;
@@ -70,7 +87,7 @@ type AppHeaderProps = {
     innerClassName?: string;
     navClassName?: string;
 };
-declare function AppHeader({ children, navLabel, autoHide, scrollTargetRef, brandHref, brandLabel, className, innerClassName, navClassName, }: AppHeaderProps): react_jsx_runtime.JSX.Element;
+declare function AppHeader({ children, navLabel, appName, autoHide, scrollTargetRef, brandHref, brandLabel, className, innerClassName, navClassName, }: AppHeaderProps): react_jsx_runtime.JSX.Element;
 
 type CalloutProps = {
     title: ReactNode;
@@ -506,6 +523,13 @@ declare function cn(...inputs: (string | undefined | null | false)[]): string;
  */
 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>;
 
@@ -529,7 +553,8 @@ declare const ChevronIcon: FC<ChevronIconProps>;
  *
  * The chosen mode is persisted to localStorage (per-origin), which also powers
  * the cross-tab `storage` sync below. Read priority: localStorage → system
- * preference.
+ * 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
@@ -543,7 +568,7 @@ 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.
+ * to localStorage, or clears it when the mode matches the system.
  */
 declare function setColorMode(mode: ColorMode): void;
 declare function useColorMode(): {
@@ -552,11 +577,9 @@ declare function useColorMode(): {
     toggle: () => void;
 };
 /**
- * Sliding sun/moon switch. Light/dark is a two-state choice, not an on/off
- * affordance, so this uses `Switch`'s shape but its own palette. The thumb
- * carries the active mode's icon tinted with the accent (`text-soft`); the
- * mode you'd switch to sits ghosted (faint neutral) on the
- * empty side. Self-contained — wires itself to `useColorMode`.
+ * 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;
 
@@ -690,6 +713,8 @@ 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;
@@ -721,6 +746,11 @@ 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;
 
+/** Compact status for both initial loading and background updates. */
+declare function LoadingStatus({ children }: {
+    children: ReactNode;
+}): 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;
@@ -733,10 +763,10 @@ declare const Slider: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHT
 type SurfaceVariant = "panel" | "card" | "card-themed";
 type SurfaceOwnProps = {
     /**
-     * Depth role (all opaque, elevation via shadow not borders):
-     * - `panel` — Level 1 container: themed bg, container shadow
-     * - `card` — Level 2 well: neutral surface, well shadow (default)
-     * - `card-themed` — themed well: theme-tinted, well shadow
+     * 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;
@@ -752,34 +782,50 @@ type SurfaceProps<T extends ElementType = "div"> = SurfaceOwnProps & {
 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. Light thumb in both modes; track states: off (grey), on (green),
- * invalid (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 TabButtonOwnProps = {
-    active: boolean;
+    /** `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;
     size?: "lg" | "md" | "sm" | "xs";
     variant?: "soft" | "ghost";
-    intent?: "neutral";
+    /**
+     * `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.
+     */
+    intent?: "neutral" | "amber" | "green";
+    /** Muted secondary text after the label, e.g. a model's creator. */
+    detail?: ReactNode;
     ariaLabel?: string;
     disabled?: boolean;
     className?: string;
@@ -792,7 +838,7 @@ type TabButtonOwnProps = {
 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, size, variant, intent, ariaLabel, disabled, className, ...rest }: TabButtonProps<T>): react_jsx_runtime.JSX.Element;
+declare function TabButton<T extends ElementType = "button">({ as, active, onClick, children, size, variant, intent, detail, ariaLabel, disabled, className, ...rest }: TabButtonProps<T>): react_jsx_runtime.JSX.Element;
 
 type Align = "left" | "center" | "right";
 type RowIntent = "default" | "warning" | "danger";
@@ -884,4 +930,4 @@ type TextOwnProps<T extends ElementType> = PropsWithChildren<{
 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, type AccountIdentityProps, AccountMenu, type AccountMenuProps, Alert, type AlertProps, AppHeader, type AppHeaderProps, AppIcon, ArrowLeftIcon, ArrowRightIcon, AudioIcon, BeakerIcon, BookIcon, BotIcon, 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, 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, type IconProps, ImageIcon, InfoTip, InlineLink, type InlineLinkProps, Input, type InputProps, InstagramIcon, KeyChip, type KeyChipProps, KeyIcon, LinkCard, type LinkCardProps, LinkedInIcon, 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, RefreshIcon, RobotIcon, RocketIcon, ScrollAreaProps, SearchIcon, Section, type SectionProps, SignOutIcon, Slider, type SliderProps, SparkleIcon, SparklesIcon, SpeakerIcon, SproutIcon, StarIcon, StatCard, type StatCardProps, SunIcon, Surface, type SurfaceProps, Switch, type SwitchProps, 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 };
+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, 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, type IconProps, ImageIcon, InfoTip, InlineLink, type InlineLinkProps, Input, type InputProps, InstagramIcon, KeyChip, type KeyChipProps, KeyIcon, LinkCard, type LinkCardProps, LinkedInIcon, 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, Slider, type SliderProps, SparkleIcon, SparklesIcon, SpeakerIcon, SproutIcon, 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 };

package/dist/index.d.ts

@@ -1,10 +1,10 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 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-yXzIFrDg.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-yXzIFrDg.js';
-import { B as ButtonProps, a as ButtonAppearance } from './Button-CO3Dpbkj.js';
-export { b as Button } from './Button-CO3Dpbkj.js';
+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-ByKwRtdw.js';
+export { b as Button } from './Button-ByKwRtdw.js';
 export { C as Chip } from './Chip-v-ADv6cz.js';
 export { Field } from '@ark-ui/react/field';
 import '@ark-ui/react/dialog';
@@ -37,7 +37,13 @@ type AccountIdentityProps = {
     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"];
@@ -58,10 +64,21 @@ type AlertProps = Omit<ComponentPropsWithoutRef<"div">, "title"> & {
 };
 declare const Alert: FC<AlertProps>;
 
+type AppBrandProps = {
+    appName: string;
+    href?: string;
+    size?: "md" | "sm";
+    className?: string;
+};
+/** 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 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;
@@ -70,7 +87,7 @@ type AppHeaderProps = {
     innerClassName?: string;
     navClassName?: string;
 };
-declare function AppHeader({ children, navLabel, autoHide, scrollTargetRef, brandHref, brandLabel, className, innerClassName, navClassName, }: AppHeaderProps): react_jsx_runtime.JSX.Element;
+declare function AppHeader({ children, navLabel, appName, autoHide, scrollTargetRef, brandHref, brandLabel, className, innerClassName, navClassName, }: AppHeaderProps): react_jsx_runtime.JSX.Element;
 
 type CalloutProps = {
     title: ReactNode;
@@ -506,6 +523,13 @@ declare function cn(...inputs: (string | undefined | null | false)[]): string;
  */
 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>;
 
@@ -529,7 +553,8 @@ declare const ChevronIcon: FC<ChevronIconProps>;
  *
  * The chosen mode is persisted to localStorage (per-origin), which also powers
  * the cross-tab `storage` sync below. Read priority: localStorage → system
- * preference.
+ * 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
@@ -543,7 +568,7 @@ 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.
+ * to localStorage, or clears it when the mode matches the system.
  */
 declare function setColorMode(mode: ColorMode): void;
 declare function useColorMode(): {
@@ -552,11 +577,9 @@ declare function useColorMode(): {
     toggle: () => void;
 };
 /**
- * Sliding sun/moon switch. Light/dark is a two-state choice, not an on/off
- * affordance, so this uses `Switch`'s shape but its own palette. The thumb
- * carries the active mode's icon tinted with the accent (`text-soft`); the
- * mode you'd switch to sits ghosted (faint neutral) on the
- * empty side. Self-contained — wires itself to `useColorMode`.
+ * 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;
 
@@ -690,6 +713,8 @@ 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;
@@ -721,6 +746,11 @@ 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;
 
+/** Compact status for both initial loading and background updates. */
+declare function LoadingStatus({ children }: {
+    children: ReactNode;
+}): 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;
@@ -733,10 +763,10 @@ declare const Slider: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHT
 type SurfaceVariant = "panel" | "card" | "card-themed";
 type SurfaceOwnProps = {
     /**
-     * Depth role (all opaque, elevation via shadow not borders):
-     * - `panel` — Level 1 container: themed bg, container shadow
-     * - `card` — Level 2 well: neutral surface, well shadow (default)
-     * - `card-themed` — themed well: theme-tinted, well shadow
+     * 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;
@@ -752,34 +782,50 @@ type SurfaceProps<T extends ElementType = "div"> = SurfaceOwnProps & {
 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. Light thumb in both modes; track states: off (grey), on (green),
- * invalid (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 TabButtonOwnProps = {
-    active: boolean;
+    /** `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;
     size?: "lg" | "md" | "sm" | "xs";
     variant?: "soft" | "ghost";
-    intent?: "neutral";
+    /**
+     * `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.
+     */
+    intent?: "neutral" | "amber" | "green";
+    /** Muted secondary text after the label, e.g. a model's creator. */
+    detail?: ReactNode;
     ariaLabel?: string;
     disabled?: boolean;
     className?: string;
@@ -792,7 +838,7 @@ type TabButtonOwnProps = {
 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, size, variant, intent, ariaLabel, disabled, className, ...rest }: TabButtonProps<T>): react_jsx_runtime.JSX.Element;
+declare function TabButton<T extends ElementType = "button">({ as, active, onClick, children, size, variant, intent, detail, ariaLabel, disabled, className, ...rest }: TabButtonProps<T>): react_jsx_runtime.JSX.Element;
 
 type Align = "left" | "center" | "right";
 type RowIntent = "default" | "warning" | "danger";
@@ -884,4 +930,4 @@ type TextOwnProps<T extends ElementType> = PropsWithChildren<{
 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, type AccountIdentityProps, AccountMenu, type AccountMenuProps, Alert, type AlertProps, AppHeader, type AppHeaderProps, AppIcon, ArrowLeftIcon, ArrowRightIcon, AudioIcon, BeakerIcon, BookIcon, BotIcon, 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, 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, type IconProps, ImageIcon, InfoTip, InlineLink, type InlineLinkProps, Input, type InputProps, InstagramIcon, KeyChip, type KeyChipProps, KeyIcon, LinkCard, type LinkCardProps, LinkedInIcon, 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, RefreshIcon, RobotIcon, RocketIcon, ScrollAreaProps, SearchIcon, Section, type SectionProps, SignOutIcon, Slider, type SliderProps, SparkleIcon, SparklesIcon, SpeakerIcon, SproutIcon, StarIcon, StatCard, type StatCardProps, SunIcon, Surface, type SurfaceProps, Switch, type SwitchProps, 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 };
+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, 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, type IconProps, ImageIcon, InfoTip, InlineLink, type InlineLinkProps, Input, type InputProps, InstagramIcon, KeyChip, type KeyChipProps, KeyIcon, LinkCard, type LinkCardProps, LinkedInIcon, 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, Slider, type SliderProps, SparkleIcon, SparklesIcon, SpeakerIcon, SproutIcon, 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 };