@jfrader/ui 0.5.0 → 0.6.0

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

@@ -18,7 +18,7 @@ export interface TabsPanelProps extends ComponentPropsWithRef<'div'>, SxProps {
 }
 declare function TabsRoot({ ref, value: valueProp, defaultValue, onValueChange, orientation, activation, className, sx, ...rest }: TabsProps): import("@emotion/react/jsx-runtime").JSX.Element;
 declare function TabsList({ ref, onKeyDown, className, sx, ...rest }: TabsListProps): import("@emotion/react/jsx-runtime").JSX.Element;
-declare function TabsTab({ ref, value, disabled, onClick, onFocus, className, sx, ...rest }: TabsTabProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function TabsTab({ ref, value, disabled, onClick, onFocus, onPointerDown, className, sx, ...rest }: TabsTabProps): import("@emotion/react/jsx-runtime").JSX.Element;
 declare function TabsPanel({ ref, value, tabIndex, 'aria-labelledby': ariaLabelledByProp, className, sx, ...rest }: TabsPanelProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export declare const Tabs: typeof TabsRoot & {
     List: typeof TabsList;

package/dist/types/components/text-field/text-field.d.ts

@@ -12,7 +12,7 @@ export interface TextFieldProps extends Omit<ComponentPropsWithRef<'input'>, 'si
     onValueChange?: (value: string) => void;
     slotProps?: FieldSlotProps<TextFieldPartProps>;
 }
-export declare function TextField({ ref, label, description, error, size, onChange, onValueChange, slotProps, className, sx, required, id: idProp, 'aria-describedby': ariaDescribedByProp, 'aria-invalid': ariaInvalidProp, ...rest }: TextFieldProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare function TextField({ ref, label, description, error, size, onChange, onValueChange, slotProps, className, sx, required, id: idProp, dir, 'aria-describedby': ariaDescribedByProp, 'aria-invalid': ariaInvalidProp, ...rest }: TextFieldProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export declare namespace TextField {
     var displayName: string;
 }

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

@@ -15,7 +15,7 @@ export interface TextareaProps extends ComponentPropsWithRef<'textarea'>, SxProp
     onValueChange?: (value: string) => void;
     slotProps?: FieldSlotProps<TextareaPartProps>;
 }
-export declare function Textarea({ ref, label, description, error, size, resize, autoResize, rows, onChange, onValueChange, slotProps, className, sx, required, id: idProp, 'aria-describedby': ariaDescribedByProp, 'aria-invalid': ariaInvalidProp, ...rest }: TextareaProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare function Textarea({ ref, label, description, error, size, resize, autoResize, rows, onChange, onValueChange, slotProps, className, sx, dir, required, id: idProp, 'aria-describedby': ariaDescribedByProp, 'aria-invalid': ariaInvalidProp, ...rest }: TextareaProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export declare namespace Textarea {
     var displayName: string;
 }

package/dist/types/components/theme-root/index.d.ts

@@ -1,2 +1,3 @@
 export { ThemeRoot } from './theme-root';
 export type { ThemeName, ThemeRootProps } from './theme-root';
+export { createTheme, themeTokenStyle, type CreateThemeOptions, type ThemeTokens } from '../../styling/create-theme';

package/dist/types/components/theme-root/theme-root.d.ts

@@ -1,9 +1,17 @@
 import { type ComponentPropsWithRef, type ReactNode } from 'react';
+import { type ThemeTokens } from '../../styling/create-theme';
 import { type SxProps } from '../../styling/sx';
 import { type ThemeName } from '../../styling/theme-scope';
 export type { ThemeName };
 export interface ThemeRootProps extends ComponentPropsWithRef<'div'>, SxProps {
+    /** The named palette the scope wears; `tokens` are declared over it. */
     theme?: ThemeName;
+    /**
+     * Token overrides for this scope (`createTheme()` builds them from an accent), declared as inline
+     * custom properties on the root. Omitted: a root naming the enclosing root's theme keeps that
+     * root's tokens; a root naming another theme drops them.
+     */
+    tokens?: ThemeTokens;
     /**
      * Where overlays inside this root portal to. Omitted: the enclosing ThemeRoot's container, else
      * the default (`body`). `null`: overlays wait until the host element is set.
@@ -11,7 +19,7 @@ export interface ThemeRootProps extends ComponentPropsWithRef<'div'>, SxProps {
     portalContainer?: HTMLElement | null;
     children?: ReactNode;
 }
-export declare function ThemeRoot({ ref, theme, portalContainer, className, sx, ...rest }: ThemeRootProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare function ThemeRoot({ ref, theme, tokens, portalContainer, className, style, sx, ...rest }: ThemeRootProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export declare namespace ThemeRoot {
     var displayName: string;
 }

package/dist/types/components/theme-switch/index.d.ts

@@ -0,0 +1 @@
+export { ThemeSwitch, type ThemeSwitchProps, type ThemeSwitchValue, type ThemeSwitchTransition, type ThemeSwitchChangeDetails, } from './theme-switch';

package/dist/types/components/theme-switch/theme-switch.d.ts

@@ -0,0 +1,33 @@
+import { type ReactNode } from 'react';
+import { type SwitchPartProps, type SwitchProps } from '../switch';
+export type ThemeSwitchValue = 'light' | 'dark';
+export type ThemeSwitchTransition = 'reveal' | 'eclipse' | 'split' | 'rise';
+export interface ThemeSwitchChangeDetails {
+    transition: ThemeSwitchTransition;
+    trigger: HTMLInputElement;
+    reducedMotion: boolean;
+}
+export interface ThemeSwitchProps extends Omit<SwitchProps, 'value' | 'defaultValue' | 'checked' | 'defaultChecked' | 'onCheckedChange' | 'children' | 'slotProps'> {
+    value?: ThemeSwitchValue;
+    defaultValue?: ThemeSwitchValue;
+    onValueChange?: (next: ThemeSwitchValue, details: ThemeSwitchChangeDetails) => void;
+    label: ReactNode;
+    iconOnly?: boolean;
+    lightIcon?: ReactNode;
+    darkIcon?: ReactNode;
+    transition?: ThemeSwitchTransition;
+    loading?: boolean;
+    slotProps?: SwitchProps['slotProps'] & {
+        iconFrame?: SwitchPartProps;
+        lightIcon?: SwitchPartProps;
+        darkIcon?: SwitchPartProps;
+    };
+}
+/** Composes Switch: Space toggles dark appearance; the accessible name stays stable.
+ * The consumer applies the requested theme. The ref reaches Switch's native input.
+ * The decorative icon frame is a hidden label for the input, so clicking the glyph toggles too.
+ */
+export declare function ThemeSwitch({ value: valueProp, defaultValue, onValueChange, label, iconOnly, lightIcon, darkIcon, transition, loading, className, sx, slotProps, onChange, onClick, dir, id: idProp, ...rest }: ThemeSwitchProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare namespace ThemeSwitch {
+    var displayName: string;
+}

package/dist/types/components/thread/thread-core.d.ts

@@ -0,0 +1,96 @@
+export interface ThreadAuthor {
+    /** Stable identity: ownership, reactions and mention candidates compare it. */
+    id: string;
+    name: string;
+    /** Portrait URL; initials are shown without it. */
+    avatar?: string;
+}
+export interface ThreadReaction {
+    emoji: string;
+    /** Ids of the people who reacted. */
+    users: readonly string[];
+}
+/** Epoch ms, a Date, or an ISO date-time with `Z` or an explicit offset. */
+export type ThreadTimestamp = Date | string | number;
+export interface ThreadMessage {
+    /** Unique, stable identity across updates. */
+    id: string;
+    author: ThreadAuthor;
+    /** Plain text, rendered as escaped text with its line breaks. */
+    body: string;
+    createdAt: ThreadTimestamp;
+    edited?: boolean;
+    deleted?: boolean;
+    reactions?: readonly ThreadReaction[];
+}
+export interface ThreadComment extends ThreadMessage {
+    replies?: readonly ThreadComment[];
+}
+export interface ThreadEntry {
+    comment: ThreadComment;
+    parentId: string | null;
+    /** Reply edges below a root comment; roots are 0. */
+    depth: number;
+}
+export interface ThreadIndex {
+    entries: ReadonlyMap<string, ThreadEntry>;
+    /** Ids in reading (depth-first) order. */
+    order: readonly string[];
+    duplicates: readonly string[];
+    /** True when a comment appears among its own replies; the repeat is skipped. */
+    cyclic: boolean;
+}
+export interface ThreadFormatters {
+    relative: Intl.RelativeTimeFormat;
+    full: Intl.DateTimeFormat;
+    number: Intl.NumberFormat;
+    plural: Intl.PluralRules;
+    /** Joins names ("Ada and Grace"). */
+    people: Intl.ListFormat;
+    /** Joins short facts ("4 comments, 2 people"). */
+    facts: Intl.ListFormat;
+}
+export declare const DEFAULT_TIME_ZONE = "UTC";
+export declare const validEpoch: (epoch: number) => boolean;
+export declare function toEpoch(value: ThreadTimestamp): number | null;
+/** Signed relative text ("5 minutes ago", "in 2 days", "now") from the caller-owned clock. */
+export declare function relativeTime(epoch: number, now: number, format: Intl.RelativeTimeFormat): string;
+/** Formatters for the requested locale and zone; unusable values fall back and are reported. */
+export declare function resolveFormatters(owner: string, locale: Intl.LocalesArgument, timeZone: string): {
+    formatters: ThreadFormatters;
+    problems: string[];
+};
+/** "1 reply" / "3 replies" through the locale's plural rules and digits. */
+export declare const formatCount: (format: ThreadFormatters, count: number, one: string, other: string) => string;
+/** Every comment by id with its parent and depth; repeated ids keep their first occurrence. */
+export declare function indexThread(roots: readonly ThreadComment[]): ThreadIndex;
+/**
+ * Replaces (or, for `null`, removes) the first comment with `id`, copying only the path to it.
+ * Returns the same array when nothing changed, so callers can skip no-op events.
+ */
+export declare function updateComment(comments: readonly ThreadComment[], id: string, update: (comment: ThreadComment) => ThreadComment | null, path?: ReadonlySet<ThreadComment>): readonly ThreadComment[];
+/**
+ * The comment a reply to `parentId` attaches to: the parent itself while the reply stays within
+ * `maxDepth` reply edges, otherwise its ancestor at depth `maxDepth - 1`; `null` adds a root
+ * comment (always for `maxDepth` 0). `undefined` when the parent is unknown.
+ */
+export declare function resolveReplyParent(index: ThreadIndex, parentId: string | null, maxDepth: number): string | null | undefined;
+export declare function appendComment(comments: readonly ThreadComment[], parentId: string | null, comment: ThreadComment): readonly ThreadComment[];
+/** New body for a live comment; unchanged or deleted comments are left alone. */
+export declare function editComment(comments: readonly ThreadComment[], id: string, body: string): readonly ThreadComment[];
+/**
+ * A leaf disappears; a comment with replies becomes a tombstone that keeps its id, author, time
+ * and replies but drops its body and reactions.
+ */
+export declare function deleteComment(comments: readonly ThreadComment[], id: string): readonly ThreadComment[];
+/** Adds or removes `userId` from the `emoji` reaction; empty reactions are dropped. */
+export declare function toggleReaction(reactions: readonly ThreadReaction[], emoji: string, userId: string): {
+    reactions: ThreadReaction[];
+    added: boolean;
+};
+export declare function reactToComment(comments: readonly ThreadComment[], id: string, emoji: string, userId: string): {
+    comments: readonly ThreadComment[];
+    added: boolean;
+};
+/** First occurrence of each value, keyed by `key`. */
+export declare function uniqueBy<T>(items: readonly T[], key: (item: T) => string): T[];

package/dist/types/components/thread/thread-parts.d.ts

@@ -0,0 +1,119 @@
+import { type KeyboardEvent, type ReactNode } from 'react';
+import { type Interpolation, type SerializedStyles, type Theme } from '../../styling/css';
+import { type ButtonProps } from '../button';
+import { type TextareaProps } from '../textarea';
+import { type ThreadAuthor, type ThreadFormatters, type ThreadReaction } from './thread-core';
+export type ThreadSize = 'sm' | 'md';
+export interface ThreadPartProps {
+    className?: string;
+    css?: Interpolation<Theme>;
+}
+/** Textarea props a consumer may add; the thread owns value, change and mention wiring. */
+export type ThreadTextareaProps = Omit<TextareaProps, 'value' | 'defaultValue' | 'onValueChange' | 'label' | 'children'>;
+/** Button props a consumer may add to a submit button; the thread owns its label and state. */
+export type ThreadButtonProps = Omit<ButtonProps, 'children' | 'loading' | 'type' | 'render'>;
+export declare const isComposing: (event: KeyboardEvent<HTMLElement>) => boolean;
+export interface ThreadTimeProps {
+    epoch: number | null;
+    /** Caller-owned clock; `null` shows the full date instead of a relative one. */
+    now: number | null;
+    formatters: ThreadFormatters;
+    invalidLabel: string;
+    id: string;
+    /** Id of the hidden full date, for the message's `aria-describedby`. */
+    fullId: string;
+    ui: string;
+    part?: ThreadPartProps;
+}
+export declare function ThreadTime({ epoch, now, formatters, invalidLabel, id, fullId, ui: owner, part }: ThreadTimeProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export interface ThreadMessageViewProps {
+    ui: string;
+    author: ThreadAuthor;
+    /** Replaces the author/time name, e.g. for a deleted message. */
+    label?: string;
+    epoch: number | null;
+    now: number | null;
+    formatters: ThreadFormatters;
+    invalidTimeLabel: string;
+    /** Text after the time, e.g. "(edited)". */
+    meta?: ReactNode;
+    size: ThreadSize;
+    baseId: string;
+    messageId: string;
+    /** Body, editor and footer rows. */
+    children: ReactNode;
+    slots?: {
+        article?: ThreadPartProps;
+        time?: ThreadPartProps;
+    };
+}
+export declare function ThreadMessageView({ ui: owner, author, label, epoch, now, formatters, invalidTimeLabel, meta, size, baseId, messageId, children, slots, }: ThreadMessageViewProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export interface ThreadReactionLabels {
+    addReaction: string;
+    closeReactions: string;
+    reactions: string;
+    reactWith: (emoji: string) => string;
+    reactionCount: (emoji: string, count: number, mine: boolean) => string;
+}
+export interface ThreadReactionsProps {
+    ui: string;
+    reactions: readonly ThreadReaction[];
+    /** Emoji offered by the picker; empty hides the picker. */
+    offered: readonly string[];
+    currentUserId: string;
+    formatters: ThreadFormatters;
+    labels: ThreadReactionLabels;
+    /** Mutations hidden: chips render as text. */
+    readOnly: boolean;
+    disabled: boolean;
+    pickerOpen: boolean;
+    onPickerOpenChange: (open: boolean) => void;
+    onToggle: (emoji: string) => void;
+    pickerId: string;
+    part?: ThreadPartProps;
+    overlay?: boolean;
+    counts?: ReadonlyMap<string, number>;
+}
+/**
+ * Picker keyboard: Left/Right (mirrored in RTL) wrap across the emoji, Home/End jump; Escape and
+ * a chosen emoji close it and return focus to the add button. Pressing outside leaves it open.
+ */
+export declare function ThreadReactions({ ui: owner, reactions, offered, currentUserId, formatters, labels, readOnly, disabled, pickerOpen, onPickerOpenChange, onToggle, pickerId, part, overlay, counts, }: ThreadReactionsProps): import("@emotion/react/jsx-runtime").JSX.Element | null;
+export interface ThreadComposerProps {
+    ui: string;
+    draft: string;
+    onDraftChange: (draft: string) => void;
+    /** Called with the trimmed text for a non-empty, non-pending submit. */
+    onSubmit: (text: string, container: HTMLElement) => void;
+    /** The cancel button, and Escape (with no suggestions open) unless `cancelOnEscape` is false. */
+    onCancel?: (container: HTMLElement) => void;
+    cancelOnEscape?: boolean;
+    /** Shows the cancel button. */
+    cancelable: boolean;
+    label: string;
+    placeholder?: string;
+    submitLabel: string;
+    cancelLabel: string;
+    mentionsLabel: string;
+    people: readonly ThreadAuthor[];
+    locale: Intl.LocalesArgument;
+    disabled: boolean;
+    /** A submit is waiting for its parent to accept it; further submits are ignored. */
+    pending: boolean;
+    /** Focus the field on mount; only set when a user action opened this composer. */
+    autoFocus?: boolean;
+    size: ThreadSize;
+    /** Decorative portrait shown at inline-start. */
+    author?: ThreadAuthor;
+    textareaProps?: ThreadTextareaProps;
+    submitProps?: ThreadButtonProps;
+    part?: ThreadPartProps;
+    /** Distinguishes composers inside one thread (`data-composer`). */
+    kind: string;
+    submitOnEnter?: boolean;
+    allowEmpty?: boolean;
+    lockWhilePending?: boolean;
+}
+/** Per-size layout variables read by the parts; the owning root applies them. */
+export declare const threadSizeStyles: Record<ThreadSize, SerializedStyles>;
+export declare function ThreadComposer({ ui: owner, draft, onDraftChange, onSubmit, onCancel, cancelOnEscape, cancelable, label, placeholder, submitLabel, cancelLabel, mentionsLabel, people, locale, disabled, pending, autoFocus, size, author, textareaProps, submitProps, part, kind, submitOnEnter, allowEmpty, lockWhilePending, }: ThreadComposerProps): import("@emotion/react/jsx-runtime").JSX.Element;

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

@@ -1,5 +1,5 @@
 import { type ComponentPropsWithRef, type ReactNode } from 'react';
-import { type Placement } from '@floating-ui/react';
+import { type FloatingRootContext, type Placement, type UseInteractionsReturn } from '@floating-ui/react';
 import { type SxProps } from '../../styling/sx';
 export interface TooltipProps {
     open?: boolean;
@@ -16,9 +16,16 @@ export interface TooltipTriggerProps extends ComponentPropsWithRef<'button'>, Sx
 }
 export interface TooltipContentProps extends ComponentPropsWithRef<'div'>, SxProps {
 }
+export declare const tooltipContentStyle: import("@emotion/react").SerializedStyles;
+/** The tooltip interaction chain, shared with parts whose operative element cannot be a Tooltip.Trigger. */
+export declare function useTooltipInteractions(context: FloatingRootContext, { enabled, openDelay, closeDelay, }?: {
+    enabled?: boolean;
+    openDelay?: number;
+    closeDelay?: number;
+}): UseInteractionsReturn;
 declare function TooltipRoot(props: TooltipProps): import("@emotion/react/jsx-runtime").JSX.Element;
 declare function TooltipTrigger({ ref, 'aria-describedby': ariaDescribedByProp, className, sx, ...rest }: TooltipTriggerProps): import("@emotion/react/jsx-runtime").JSX.Element;
-declare function TooltipContent({ ref, style, className, sx, ...rest }: TooltipContentProps): import("@emotion/react/jsx-runtime").JSX.Element | null;
+declare function TooltipContent(props: TooltipContentProps): import("@emotion/react/jsx-runtime").JSX.Element | null;
 export declare const Tooltip: typeof TooltipRoot & {
     Trigger: typeof TooltipTrigger;
     Content: typeof TooltipContent;

package/dist/types/components/usage-meter/usage-meter.d.ts

@@ -1,7 +1,8 @@
 import { type ComponentPropsWithRef, type ComponentPropsWithoutRef, type ReactNode } from 'react';
 import { type Interpolation, type Theme } from '../../styling/css';
 import { type SxProps } from '../../styling/sx';
-export type UsageMeterState = 'normal' | 'near-limit' | 'over-limit' | 'unavailable';
+import { type UsageMeterState, type UsageMeterSummary } from './usage-model';
+export type { UsageMeterState, UsageMeterSummary } from './usage-model';
 export type UsageMeterSize = 'sm' | 'md' | 'lg';
 export type UsageMeterSelection = {
     kind: 'segment';
@@ -20,17 +21,6 @@ export type UsageMeterItem = UsageMeterSelection & {
     label: string;
     value: number;
 };
-export interface UsageMeterSummary {
-    total: number;
-    limit: number;
-    free: number;
-    over: number;
-    ratio: number;
-    state: UsageMeterState;
-    formattedTotal: string;
-    formattedLimit: string;
-    formattedPercent: string;
-}
 export interface UsageMeterLabels {
     free: string;
     near: string;

package/dist/types/components/usage-meter/usage-model.d.ts

@@ -0,0 +1,30 @@
+export type UsageMeterState = 'normal' | 'near-limit' | 'over-limit' | 'unavailable';
+export interface UsageMeterSummary {
+    total: number;
+    limit: number;
+    free: number;
+    over: number;
+    ratio: number;
+    state: UsageMeterState;
+    formattedTotal: string;
+    formattedLimit: string;
+    formattedPercent: string;
+}
+export declare const DEFAULT_WARN_AT = 0.9;
+export interface UsageFormats {
+    amount: Intl.NumberFormat;
+    percent: Intl.NumberFormat;
+    index: Intl.NumberFormat;
+}
+export declare function createUsageFormats(locale: Intl.LocalesArgument, numberFormatOptions?: Intl.NumberFormatOptions): UsageFormats;
+interface SummarizeOptions {
+    warnAt?: number;
+    formats: UsageFormats;
+    /** Text for amounts that cannot be computed. */
+    unavailable: string;
+    /** Formats amounts instead of `formats.amount` (consumer unit formatters). */
+    formatAmount?: (amount: number) => string;
+}
+/** Summarizes `total` against `limit`; nonpositive or nonfinite limits are `unavailable`. */
+export declare function summarizeUsage(total: number, limit: number, { warnAt, formats, unavailable, formatAmount }: SummarizeOptions): UsageMeterSummary;
+export {};

package/dist/types/components/user-menu/index.d.ts

@@ -0,0 +1,2 @@
+export { UserMenu } from './user-menu';
+export type { UserMenuContentProps, UserMenuGroupSlotProps, UserMenuIdentityProps, UserMenuItemProps, UserMenuItemTone, UserMenuPartProps, UserMenuProps, UserMenuSeparatorProps, UserMenuSignOutProps, UserMenuStatus, UserMenuStatusGroupProps, UserMenuTheme, UserMenuThemeGroupProps, UserMenuTriggerProps, UserMenuUser, UserMenuVariant, } from './user-menu';

package/dist/types/components/user-menu/user-menu.d.ts

@@ -0,0 +1,119 @@
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
+import { type Placement } from '@floating-ui/react';
+import { type Interpolation, type Theme } from '../../styling/css';
+import { type SxProps } from '../../styling/sx';
+import { type AvatarStatus } from '../avatar';
+import { type MenuItemTone } from '../menu/menu';
+declare const THEME_OPTIONS: readonly ['light', 'dark', 'system'];
+declare const STATUS_OPTIONS: readonly ['available', 'busy', 'away'];
+export type UserMenuTheme = (typeof THEME_OPTIONS)[number];
+export type UserMenuStatus = (typeof STATUS_OPTIONS)[number];
+export type UserMenuVariant = 'adaptive' | 'menu' | 'sheet';
+export type UserMenuItemTone = MenuItemTone;
+export interface UserMenuUser {
+    name: string;
+    email: string;
+    /** Plan or role label shown next to the email; `0` renders. */
+    plan?: ReactNode;
+    avatarSrc?: string;
+}
+export interface UserMenuPartProps {
+    className?: string;
+    css?: Interpolation<Theme>;
+}
+export interface UserMenuProps {
+    user: UserMenuUser;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Desktop placement next to the Trigger; flips when there is no room. */
+    placement?: Placement;
+    /** Viewport width in px below which `variant="adaptive"` content becomes a sheet. */
+    compactBreakpoint?: number;
+    children?: ReactNode;
+}
+export interface UserMenuTriggerProps extends Omit<ComponentPropsWithRef<'button'>, 'children'>, SxProps {
+    /** Translated name of the button, e.g. "Account menu, Ada Lovelace". */
+    'aria-label': string;
+    /** Shows the user's name next to the avatar outside compact viewports. */
+    showName?: boolean;
+    status?: AvatarStatus;
+    /** Translated status word, exposed as the Trigger's description. */
+    statusLabel?: string;
+}
+interface UserMenuContentBaseProps extends ComponentPropsWithRef<'div'>, SxProps {
+    slotProps?: {
+        menu?: UserMenuPartProps;
+        handle?: UserMenuPartProps;
+        close?: UserMenuPartProps;
+    };
+}
+export type UserMenuContentProps = UserMenuContentBaseProps & ({
+    variant: 'menu';
+    closeLabel?: string;
+} | {
+    variant?: 'adaptive' | 'sheet';
+    /** Translated name of the sheet's Close button. */
+    closeLabel: string;
+});
+export interface UserMenuIdentityProps extends ComponentPropsWithRef<'div'>, SxProps {
+}
+export interface UserMenuItemProps extends Omit<ComponentPropsWithRef<'button'>, 'onSelect'>, SxProps {
+    /** Called once when the item is activated. The menu then closes unless a click handler called
+     * `event.preventDefault()`. */
+    onSelect?: () => void;
+    disabled?: boolean;
+    tone?: UserMenuItemTone;
+    /** Decorative icon before the label. */
+    icon?: ReactNode;
+    /** Shortcut hint keys, shown as decoration only; no shortcut is registered. */
+    keys?: readonly string[];
+}
+export interface UserMenuGroupSlotProps {
+    label?: UserMenuPartProps;
+    option?: UserMenuPartProps;
+}
+interface ChoiceGroupProps<V extends string> extends Omit<ComponentPropsWithRef<'div'>, 'defaultValue'>, SxProps {
+    value?: V;
+    defaultValue?: V;
+    onValueChange?: (value: V) => void;
+    /** Translated group name and option labels. */
+    labels: {
+        group: string;
+    } & Record<V, string>;
+    slotProps?: UserMenuGroupSlotProps;
+}
+export type UserMenuThemeGroupProps = ChoiceGroupProps<UserMenuTheme>;
+export type UserMenuStatusGroupProps = ChoiceGroupProps<UserMenuStatus>;
+export interface UserMenuSignOutProps extends Omit<UserMenuItemProps, 'onSelect' | 'disabled'> {
+    /** Signs the user out. A returned promise keeps the item busy until it settles. */
+    onSignOut: () => void | PromiseLike<unknown>;
+    /** Translated label shown while the action is pending. */
+    pendingLabel: string;
+    /** Translated message announced when the action fails. */
+    errorMessage: string;
+    /** Receives the failure (a rejection or a synchronous throw). */
+    onSignOutError?: (error: unknown) => void;
+}
+export interface UserMenuSeparatorProps extends ComponentPropsWithRef<'div'>, SxProps {
+}
+declare function UserMenuRoot({ user, open, defaultOpen, onOpenChange, placement, compactBreakpoint, children, }: UserMenuProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function UserMenuTrigger({ ref, showName, status, statusLabel, 'aria-describedby': ariaDescribedBy, className, sx, ...rest }: UserMenuTriggerProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function UserMenuContent({ variant, id, ...props }: UserMenuContentProps): import("@emotion/react/jsx-runtime").JSX.Element | null;
+declare function UserMenuIdentity({ ref, className, sx, ...rest }: UserMenuIdentityProps): import("react").ReactPortal | null;
+declare function UserMenuItem({ tone, icon, keys, children, ...props }: UserMenuItemProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function UserMenuThemeGroup(props: UserMenuThemeGroupProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function UserMenuStatusGroup(props: UserMenuStatusGroupProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function UserMenuSignOut({ onSignOut, pendingLabel, errorMessage, onSignOutError, tone, icon, keys, children, ...props }: UserMenuSignOutProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function UserMenuSeparator(props: UserMenuSeparatorProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const UserMenu: typeof UserMenuRoot & {
+    Trigger: typeof UserMenuTrigger;
+    Content: typeof UserMenuContent;
+    Identity: typeof UserMenuIdentity;
+    Item: typeof UserMenuItem;
+    ThemeGroup: typeof UserMenuThemeGroup;
+    StatusGroup: typeof UserMenuStatusGroup;
+    SignOut: typeof UserMenuSignOut;
+    Separator: typeof UserMenuSeparator;
+};
+export {};

package/dist/types/index.d.ts

@@ -1,21 +1,27 @@
 export * from './components/accordion';
+export * from './components/activity-rings';
 export * from './components/alert';
 export * from './components/announcement-bar';
 export * from './components/avatar';
 export * from './components/avatar-group';
 export * from './components/badge';
+export * from './components/billing-toggle';
 export * from './components/bottom-sheet';
 export * from './components/breadcrumbs';
 export * from './components/button';
+export * from './components/button-group';
 export * from './components/calendar';
 export * from './components/card';
 export * from './components/carousel';
+export * from './components/chat-thread';
 export * from './components/checkbox';
 export * from './components/chip-group';
 export * from './components/code-block';
 export * from './components/command-palette';
 export * from './components/combobox';
+export * from './components/comment-thread';
 export * from './components/container';
+export * from './components/context-menu';
 export * from './components/copy-button';
 export * from './components/countdown';
 export * from './components/date-picker';
@@ -25,6 +31,7 @@ export * from './components/divider';
 export * from './components/drawer';
 export * from './components/empty-state';
 export * from './components/expandable-card';
+export * from './components/expanding-search';
 export * from './components/file-dropzone';
 export * from './components/filter-toolbar';
 export * from './components/flex';
@@ -34,13 +41,19 @@ export * from './components/inline-edit';
 export * from './components/hover-card';
 export * from './components/json-viewer';
 export * from './components/kbd';
+export * from './components/keycap-keyboard';
+export * from './components/lightbox-gallery';
+export * from './components/link-unfurl';
+export * from './components/locale-switcher';
 export * from './components/mention-input';
 export * from './components/menu';
 export * from './components/metric-card';
 export * from './components/multi-select';
 export * from './components/navigation';
+export * from './components/now-playing';
 export * from './components/pagination';
 export * from './components/password-field';
+export * from './components/photo-grid';
 export * from './components/pill';
 export * from './components/popover';
 export * from './components/progress';
@@ -51,6 +64,8 @@ export * from './components/scroll-area';
 export * from './components/search-field';
 export * from './components/segmented-control';
 export * from './components/select';
+export * from './components/sheet-stack';
+export * from './components/shortcut-recorder';
 export * from './components/signature-pad';
 export * from './components/skeleton';
 export * from './components/slider';
@@ -59,6 +74,7 @@ export * from './components/spinner';
 export * from './components/split-button';
 export * from './components/stack';
 export * from './components/stepper';
+export * from './components/stretch-refresh';
 export * from './components/swipe-actions';
 export * from './components/switch';
 export * from './components/tabs';
@@ -67,6 +83,7 @@ export * from './components/text-field';
 export * from './components/textarea';
 export { ThemeProvider, useTheme, type ThemeProviderProps } from './components/theme-provider/theme-provider';
 export * from './components/theme-root';
+export * from './components/theme-switch';
 export * from './components/time-picker';
 export * from './components/timeline';
 export * from './components/toast';
@@ -75,6 +92,7 @@ export * from './components/toggle-group';
 export * from './components/tooltip';
 export * from './components/tree-view';
 export * from './components/usage-meter';
+export * from './components/user-menu';
 export { styled } from './styling/styled';
 export type { SxProps } from './styling/sx';
 export { theme, type JfraderTheme } from './styling/theme';

package/dist/types/overlay/exit-motion.d.ts

@@ -0,0 +1,24 @@
+import type { NativeDialogTransition } from './use-native-dialog';
+/**
+ * Settles once the finite animations and transitions running on `element` (and, with `subtree`,
+ * its descendants and pseudo-elements such as `::backdrop`) have finished or been canceled.
+ * Infinite animations (spinners) never hold the exit.
+ */
+export declare function exitMotionFinished(element: Element, { subtree }?: {
+    subtree?: boolean | undefined;
+}): Promise<unknown>;
+/**
+ * Native dialog transition for styled motion: `useNativeDialog` renders `data-state="closing"`
+ * before the exit runs, so the exit only waits for the transitions that state started.
+ */
+export declare const styledDialogTransition: NativeDialogTransition;
+/**
+ * Presence for a floating surface that unmounts when closed: it stays mounted while `closing`
+ * so its exit transition (styled through `data-state="closing"`) can run. Attach `ref` to the
+ * surface; reopening during the exit keeps the same mount.
+ */
+export declare function useExitPresence<T extends Element>(open: boolean): {
+    ref: import("react").RefObject<T | null>;
+    present: boolean;
+    closing: boolean;
+};