@jfrader/ui 0.3.0 → 0.5.0

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

@@ -0,0 +1,76 @@
+import { type ComponentPropsWithRef, type CSSProperties, type ReactNode, type Ref } from 'react';
+import { type Interpolation, type Theme } from '../../styling/css';
+import { type SxProps } from '../../styling/sx';
+export type SortDirection = 'asc' | 'desc';
+export interface SortState {
+    columnId: string;
+    direction: SortDirection;
+}
+export interface DataColumn<T> {
+    id: string;
+    header: ReactNode;
+    accessor?: (row: T) => string | number | Date | null | undefined;
+    cell?: (row: T) => ReactNode;
+    sortable?: boolean;
+    sortLabel?: string;
+    compare?: (a: T, b: T) => number;
+    numeric?: boolean;
+    width?: CSSProperties['width'];
+}
+export interface DataTableMessages {
+    empty: string;
+    missing: string;
+    clear: string;
+    scrollLabel: string;
+    sortButton: (header: string, direction: SortDirection | null) => string;
+    sortStatus: (header: string, direction: SortDirection) => string;
+    selectRow: (rowLabel: string) => string;
+    selectAll: string;
+    selectionStatus: (visibleSelected: number, totalSelected: number, visibleRows: number, formatted: {
+        visibleSelected: string;
+        totalSelected: string;
+        visibleRows: string;
+    }) => string;
+}
+export interface DataTablePartProps {
+    className?: string;
+    css?: Interpolation<Theme>;
+}
+export type DataTableSlotProps = Partial<Record<'scroller' | 'table' | 'caption' | 'headerCell' | 'sortButton' | 'row' | 'cell' | 'footer' | 'status', DataTablePartProps>>;
+export type SortableDataTableProps<T> = Omit<ComponentPropsWithRef<'div'>, 'children' | 'defaultValue' | 'onChange'> & SxProps & {
+    rows: readonly T[];
+    columns: readonly DataColumn<T>[];
+    getRowId: (row: T) => string;
+    caption: ReactNode;
+    captionHidden?: boolean;
+    defaultValue?: SortState | null;
+    onValueChange?: (sort: SortState | null) => void;
+    selectedKeys?: readonly string[];
+    defaultSelectedKeys?: readonly string[];
+    onSelectionChange?: (keys: readonly string[]) => void;
+    locale?: Intl.LocalesArgument;
+    dateFormatOptions?: Intl.DateTimeFormatOptions;
+    timeZone?: string;
+    messages?: Partial<DataTableMessages>;
+    empty?: ReactNode;
+    loading?: boolean;
+    size?: 'sm' | 'md';
+    tableRef?: Ref<HTMLTableElement>;
+    slotProps?: DataTableSlotProps;
+} & ({
+    sortMode: 'manual';
+    value: SortState | null;
+} | {
+    sortMode?: 'client';
+    value?: SortState | null;
+}) & ({
+    selectable: true;
+    getRowLabel: (row: T) => string;
+} | {
+    selectable?: false;
+    getRowLabel?: (row: T) => string;
+});
+export declare function SortableDataTable<T>({ ref, rows, columns, getRowId, caption, captionHidden, value, defaultValue, onValueChange, sortMode, selectable, getRowLabel, selectedKeys, defaultSelectedKeys, onSelectionChange, locale, dateFormatOptions, timeZone, messages: messageOverrides, empty, loading, size, tableRef, slotProps, className, sx, ...rest }: SortableDataTableProps<T>): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare namespace SortableDataTable {
+    var displayName: string;
+}

package/dist/types/components/split-button/index.d.ts

@@ -0,0 +1,2 @@
+export { SplitButton } from './split-button';
+export type { SplitButtonActionProps, SplitButtonContentProps, SplitButtonItemProps, SplitButtonItemTone, SplitButtonProps, SplitButtonSeparatorProps, SplitButtonTriggerProps, } from './split-button';

package/dist/types/components/split-button/split-button.d.ts

@@ -0,0 +1,55 @@
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
+import { type Placement } from '@floating-ui/react';
+import { type SxProps } from '../../styling/sx';
+import { type ButtonProps, type ButtonSize, type ButtonTone, type ButtonVariant } from '../button';
+import { type MenuContentProps, type MenuItemProps, type MenuSeparatorProps } from '../menu/menu';
+export type SplitButtonItemTone = 'neutral' | 'danger';
+export interface SplitButtonProps extends Omit<ComponentPropsWithRef<'div'>, 'role'>, SxProps {
+    /** Appearance of the Action; the Trigger uses the matching subdued fill. */
+    variant?: ButtonVariant;
+    tone?: ButtonTone;
+    size?: ButtonSize;
+    /** Disables Action, Trigger and items, and asks once for an open menu to close. */
+    disabled?: boolean;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Menu placement relative to the Trigger; `start`/`end` follow the group's direction. */
+    placement?: Placement;
+    children?: ReactNode;
+}
+export interface SplitButtonActionProps extends Omit<ButtonProps, 'render'> {
+    /**
+     * Labels the Action may show. They share one grid cell so the Action keeps the width of the
+     * longest one while its label changes; a label swap fades in.
+     */
+    reserveLabels?: readonly string[];
+}
+type SplitButtonTriggerBaseProps = Omit<ButtonProps, 'render' | 'variant' | 'tone' | 'size' | 'loading' | 'startIcon' | 'endIcon' | 'aria-haspopup' | 'aria-expanded' | 'aria-controls'>;
+/** The Trigger has no visible text: it needs a localized `aria-label` or `aria-labelledby`. */
+export type SplitButtonTriggerProps = SplitButtonTriggerBaseProps & ({
+    'aria-label': string;
+} | {
+    'aria-labelledby': string;
+});
+export interface SplitButtonContentProps extends Omit<MenuContentProps, 'role'> {
+}
+export interface SplitButtonItemProps extends MenuItemProps {
+    tone?: SplitButtonItemTone;
+}
+export interface SplitButtonSeparatorProps extends MenuSeparatorProps {
+}
+declare function SplitButtonRoot({ ref, variant, tone, size, disabled, open: openProp, defaultOpen, onOpenChange, placement, className, sx, children, ...rest }: SplitButtonProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function SplitButtonAction({ ref, variant, tone, size, disabled, reserveLabels, children, className, sx, ...rest }: SplitButtonActionProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function SplitButtonTrigger({ ref, disabled, children, className, sx, ...rest }: SplitButtonTriggerProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function SplitButtonContent({ dir, 'aria-labelledby': ariaLabelledBy, ...props }: SplitButtonContentProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function SplitButtonItem({ tone, disabled, ...props }: SplitButtonItemProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function SplitButtonSeparator(props: SplitButtonSeparatorProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const SplitButton: typeof SplitButtonRoot & {
+    Action: typeof SplitButtonAction;
+    Trigger: typeof SplitButtonTrigger;
+    Content: typeof SplitButtonContent;
+    Item: typeof SplitButtonItem;
+    Separator: typeof SplitButtonSeparator;
+};
+export {};

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

@@ -0,0 +1,2 @@
+export { Stepper } from './stepper';
+export type { StepperBaseProps, StepperDetails, StepperHeadSlotProps, StepperInteractiveProps, StepperOrientation, StepperPartProps, StepperProps, StepperSize, StepperSlotProps, StepperStaticProps, StepperStatus, StepperStep, } from './stepper';

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

@@ -0,0 +1,85 @@
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
+import { type Interpolation, type Theme } from '../../styling/css';
+import { type SxProps } from '../../styling/sx';
+export type StepperOrientation = 'horizontal' | 'vertical';
+export type StepperSize = 'sm' | 'md';
+export type StepperDetails = 'all' | 'current';
+export type StepperStatus = 'complete' | 'current' | 'upcoming' | 'error';
+export interface StepperStep {
+    /** Stable unique identity. */
+    id: string;
+    /** Visible label; the default accessible name starts with it. */
+    label: string;
+    /** Secondary text. `0` renders; `false`/`null`/`undefined` render nothing. */
+    description?: ReactNode;
+    /** Error text; when renderable the step's status is `error` and the text is always shown. */
+    error?: ReactNode;
+    /** A disabled completed step cannot be selected or focused. */
+    disabled?: boolean;
+    /** Decorative marker content replacing the numeral/check/error glyph. */
+    icon?: ReactNode;
+}
+export interface StepperPartProps {
+    className?: string;
+    css?: Interpolation<Theme>;
+}
+/**
+ * Native button props for interactive step heads; static heads only use `className`/`css`.
+ * Step names come from `getStepLabel`, so the slot takes no `aria-label`/`aria-labelledby`.
+ */
+export type StepperHeadSlotProps = Omit<ComponentPropsWithRef<'button'>, 'children' | 'ref' | 'type' | 'disabled' | 'tabIndex' | 'aria-current' | 'aria-disabled' | 'aria-label' | 'aria-labelledby'> & StepperPartProps;
+export interface StepperSlotProps {
+    root?: StepperPartProps;
+    list?: StepperPartProps;
+    item?: StepperPartProps;
+    head?: StepperHeadSlotProps;
+    marker?: StepperPartProps;
+    label?: StepperPartProps;
+    description?: StepperPartProps;
+    connector?: StepperPartProps;
+    caption?: StepperPartProps;
+}
+export interface StepperBaseProps extends SxProps {
+    steps: readonly StepperStep[];
+    /** Controlled current index, `0..steps.length` (`steps.length` = all complete). */
+    value?: number;
+    /** Uncontrolled initial current index. */
+    defaultValue?: number;
+    /** Requested index after a completed step is activated (interactive mode). */
+    onValueChange?: (index: number) => void;
+    orientation?: StepperOrientation;
+    /** Which descriptions show; errors always show. */
+    details?: StepperDetails;
+    /** Markers only, with the current step in a caption. Error steps keep their label and text. */
+    compact?: boolean;
+    /** Horizontal steppers fold to compact below a 30rem container width. */
+    responsive?: boolean;
+    /** Marker and text scale; interactive targets stay at least 32px. */
+    size?: StepperSize;
+    /** Accessible name of the group/navigation when no `aria-label`/`aria-labelledby` is given. */
+    label?: string;
+    /** Caption shown once every step is complete. */
+    completeLabel?: ReactNode;
+    /** Locale for the default numerals and counts. */
+    locale?: Intl.LocalesArgument;
+    /** Full accessible name of a step; translate the wording here. */
+    getStepLabel?: (step: StepperStep, index: number, count: number, status: StepperStatus) => string;
+    /** Live summary of an accepted change; `step` is null when every step is complete. */
+    getChangeLabel?: (step: StepperStep | null, index: number, count: number) => string;
+    /** Announces accepted value changes in a polite live region. */
+    announceChanges?: boolean;
+    slotProps?: StepperSlotProps;
+}
+export type StepperStaticProps = StepperBaseProps & {
+    /** Static indicator: a labelled group without controls. */
+    interactive?: false;
+} & Omit<ComponentPropsWithRef<'div'>, keyof StepperBaseProps | 'children'>;
+export type StepperInteractiveProps = StepperBaseProps & {
+    /** Navigation: completed steps are buttons that request `onValueChange`. */
+    interactive: true;
+} & Omit<ComponentPropsWithRef<'nav'>, keyof StepperBaseProps | 'children'>;
+export type StepperProps = StepperStaticProps | StepperInteractiveProps;
+export declare function Stepper(props: StepperProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare namespace Stepper {
+    var displayName: string;
+}

package/dist/types/components/swipe-actions/index.d.ts

@@ -0,0 +1,2 @@
+export { SwipeActions } from './swipe-actions';
+export type { SwipeAction, SwipeActionsProps, SwipeActionsRowProps, SwipeActionsSide, SwipeActionsValue, } from './swipe-actions';

package/dist/types/components/swipe-actions/swipe-actions.d.ts

@@ -0,0 +1,44 @@
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
+import { type Interpolation, type Theme } from '../../styling/css';
+import { type SxProps } from '../../styling/sx';
+export type SwipeActionsSide = 'leading' | 'trailing';
+export type SwipeActionsValue = {
+    id: string;
+    side: SwipeActionsSide;
+} | null;
+export interface SwipeAction {
+    id: string;
+    label: string;
+    icon?: ReactNode;
+    tone?: 'neutral' | 'accent' | 'danger';
+    disabled?: boolean;
+    onSelect: () => void;
+    /** Caller intent that this command keeps its row. Every command closes the rail and the row
+     * never deletes data itself, so this is metadata for the caller's `onSelect`. */
+    keepRow?: boolean;
+}
+type Slot = {
+    className?: string;
+    css?: Interpolation<Theme>;
+};
+export interface SwipeActionsProps extends Omit<ComponentPropsWithRef<'ul'>, 'value' | 'defaultValue'>, SxProps {
+    value?: SwipeActionsValue;
+    defaultValue?: SwipeActionsValue;
+    onValueChange?: (value: SwipeActionsValue) => void;
+}
+export interface SwipeActionsRowProps extends ComponentPropsWithRef<'li'>, SxProps {
+    id: string;
+    label: string;
+    actionsLabel: string;
+    leading?: readonly SwipeAction[];
+    trailing?: readonly SwipeAction[];
+    fullSwipe?: boolean;
+    disabled?: boolean;
+    slotProps?: Partial<Record<'content' | 'body' | 'action' | 'actionIcon' | 'actionLabel' | 'trigger' | 'menu' | 'menuItem', Slot>>;
+}
+declare function SwipeActionsRoot({ ref, className, sx, value: valueProp, defaultValue, onValueChange, children, onKeyDown, ...props }: SwipeActionsProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function SwipeActionsRow({ id, label, actionsLabel, leading, trailing, fullSwipe, disabled, ref, className, sx, children, slotProps, onPointerDown, onPointerMove, onPointerUp, onPointerCancel, onLostPointerCapture, onClickCapture, ...props }: SwipeActionsRowProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const SwipeActions: typeof SwipeActionsRoot & {
+    Row: typeof SwipeActionsRow;
+};
+export {};

package/dist/types/components/tag-input/index.d.ts

@@ -0,0 +1,2 @@
+export { TagInput } from './tag-input';
+export type { TagInputMessages, TagInputPartProps, TagInputProps, TagInputSeparator, TagInputSize, TagInputSlotProps, } from './tag-input';

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

@@ -0,0 +1,66 @@
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
+import type { SxProps } from '../../styling/sx';
+import { type FieldPartProps, type FieldSlotProps } from '../field/field-anatomy';
+export type TagInputSize = 'sm' | 'md' | 'lg';
+export type TagInputSeparator = 'Enter' | ',';
+export interface TagInputMessages {
+    /** Accessible name of the token list. */
+    listLabel: string;
+    /** Accessible name of a token's remove button. */
+    remove: (token: string) => string;
+    added: (token: string) => string;
+    removed: (token: string) => string;
+    picked: (token: string) => string;
+    /** Receives the committed token the draft matched. */
+    duplicate: (token: string) => string;
+    /** Receives `maxTokens`. */
+    limit: (count: number) => string;
+    /** Validation message while `required` and no token is committed. */
+    required: string;
+}
+export interface TagInputPartProps extends FieldPartProps {
+}
+export interface TagInputSlotProps extends FieldSlotProps<TagInputPartProps> {
+    list?: TagInputPartProps;
+    token?: TagInputPartProps;
+    remove?: TagInputPartProps;
+    input?: TagInputPartProps;
+    status?: TagInputPartProps;
+}
+export interface TagInputProps extends Omit<ComponentPropsWithRef<'input'>, 'size' | 'value' | 'defaultValue' | 'type' | 'children'>, SxProps {
+    /**
+     * Committed tokens in order. Entries must be unique, nonempty and already normalized; the
+     * component renders them as given and never rewrites a provided list.
+     */
+    value?: readonly string[];
+    defaultValue?: readonly string[];
+    onValueChange?: (value: string[]) => void;
+    /** Draft text in the input, independent from the committed tokens. */
+    inputValue?: string;
+    defaultInputValue?: string;
+    onInputChange?: (value: string) => void;
+    label?: ReactNode;
+    description?: ReactNode;
+    error?: ReactNode;
+    size?: TagInputSize;
+    /** Keys that commit the draft. Without `','`, commas are ordinary token text. */
+    separators?: readonly TagInputSeparator[];
+    /** Commit the draft when focus leaves the whole field. */
+    commitOnBlur?: boolean;
+    /** Turns the draft into a token before comparison. Defaults to trimming whitespace. */
+    normalize?: (draft: string) => string;
+    /** Returns a rejection message, or `null` to accept the token. */
+    validateToken?: (token: string) => string | null;
+    /** Additions stop at this count; an initial or controlled list longer than it is kept. */
+    maxTokens?: number;
+    /** Locale for duplicate comparison and default number formatting. */
+    locale?: Intl.LocalesArgument;
+    messages?: Partial<TagInputMessages>;
+    /** Replaces the remove glyph; rendered decoratively inside each remove button. */
+    removeIcon?: ReactNode;
+    slotProps?: TagInputSlotProps;
+}
+export declare function TagInput({ ref, value, defaultValue, onValueChange, inputValue, defaultInputValue, onInputChange, label, description, error, size, separators, commitOnBlur, normalize, validateToken, maxTokens, locale, messages: messagesProp, removeIcon, slotProps, className, sx, dir, name, form, disabled, readOnly, required, onChange, onKeyDown, onBlur, onCompositionStart, onCompositionEnd, id: idProp, 'aria-labelledby': ariaLabelledByProp, 'aria-describedby': ariaDescribedByProp, 'aria-invalid': ariaInvalidProp, ...rest }: TagInputProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare namespace TagInput {
+    var displayName: string;
+}

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

@@ -1,11 +1,17 @@
-import type { ComponentPropsWithRef, ReactNode } from 'react';
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
 import { type SxProps } from '../../styling/sx';
-export type ThemeName = 'dark' | 'light';
+import { type ThemeName } from '../../styling/theme-scope';
+export type { ThemeName };
 export interface ThemeRootProps extends ComponentPropsWithRef<'div'>, SxProps {
     theme?: ThemeName;
+    /**
+     * 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.
+     */
+    portalContainer?: HTMLElement | null;
     children?: ReactNode;
 }
-export declare function ThemeRoot({ ref, theme, className, sx, ...rest }: ThemeRootProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare function ThemeRoot({ ref, theme, portalContainer, className, sx, ...rest }: ThemeRootProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export declare namespace ThemeRoot {
     var displayName: string;
 }

package/dist/types/components/time-picker/index.d.ts

@@ -0,0 +1,2 @@
+export { TimePicker } from './time-picker';
+export type { TimePickerProps, TimePickerSize, TimePickerSlotProps, TimePickerMinuteStep, TimePickerHourCycle, } from './time-picker';

package/dist/types/components/time-picker/time-picker.d.ts

@@ -0,0 +1,48 @@
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
+import { type Interpolation, type Theme } from '../../styling/css';
+import { type SxProps } from '../../styling/sx';
+export type TimePickerSize = 'sm' | 'md' | 'lg';
+export type TimePickerMinuteStep = 1 | 5 | 10 | 15 | 30;
+export type TimePickerHourCycle = 'h12' | 'h23';
+type Slot<Tag extends 'div' | 'span' | 'label' | 'button'> = Omit<ComponentPropsWithRef<Tag>, 'children'> & {
+    css?: Interpolation<Theme>;
+};
+export interface TimePickerSlotProps {
+    root?: Slot<'div'>;
+    label?: Slot<'label'>;
+    control?: Slot<'button'>;
+    content?: Slot<'div'>;
+    option?: Slot<'div'>;
+    description?: Slot<'span'>;
+    error?: Slot<'span'>;
+    icon?: Slot<'span'>;
+}
+export interface TimePickerProps extends Omit<ComponentPropsWithRef<'button'>, 'value' | 'defaultValue' | 'onChange' | 'size' | 'children'>, SxProps {
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (time: string) => void;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    minuteStep?: TimePickerMinuteStep;
+    min?: string;
+    max?: string;
+    /** Supply a locale for deterministic server rendering. */
+    locale?: string;
+    hourCycle?: TimePickerHourCycle;
+    label?: ReactNode;
+    description?: ReactNode;
+    error?: ReactNode;
+    placeholder?: ReactNode;
+    size?: TimePickerSize;
+    readOnly?: boolean;
+    /** Semantic only: the hidden form field does not enforce native required validation. */
+    required?: boolean;
+    icon?: ReactNode;
+    slotProps?: TimePickerSlotProps;
+}
+export declare function TimePicker({ ref, value: valueProp, defaultValue, onValueChange, open: openProp, defaultOpen, onOpenChange, minuteStep, min, max, locale, hourCycle, label, description, error, placeholder, size, disabled, readOnly, required, name, icon, slotProps, className, sx, dir, id: idProp, onClick, onKeyDown, onBlur, ...rest }: TimePickerProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare namespace TimePicker {
+    var displayName: string;
+}
+export {};

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

@@ -0,0 +1,2 @@
+export { Timeline } from './timeline';
+export type { TimelineEvent, TimelineHeadingLevel, TimelineLabels, TimelinePartProps, TimelineProps, TimelineSize, TimelineSlotProps, TimelineTone, } from './timeline';

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

@@ -0,0 +1,66 @@
+import { type ComponentPropsWithRef, type CSSProperties, type ReactNode } from 'react';
+import { type Interpolation, type Theme } from '../../styling/css';
+import { type SxProps } from '../../styling/sx';
+export type TimelineTone = 'neutral' | 'success' | 'danger';
+export type TimelineSize = 'sm' | 'md';
+export type TimelineHeadingLevel = 2 | 3 | 4 | 5 | 6;
+export interface TimelineEvent {
+    /** Unique, stable identity across updates. */
+    id: string;
+    /** Epoch ms, a Date, or an ISO date-time with `Z` or an explicit offset. */
+    at: string | number | Date;
+    /** Who acted; shown as text next to the title. */
+    actor?: string;
+    /** Literal outcome ("Deploy failed"), so tone is never the only cue. */
+    title: ReactNode;
+    meta?: ReactNode;
+    /** Content (including 0; not false, null or '') makes the title a disclosure button for this panel. */
+    detail?: ReactNode;
+    /** Actor portrait URL; takes precedence over `icon`. */
+    avatar?: string;
+    icon?: ReactNode;
+    tone?: TimelineTone;
+}
+export interface TimelineLabels {
+    /** Region name when neither `aria-label` nor `aria-labelledby` is given. */
+    region: string;
+    empty: string;
+    /** Heading of the trailing group for events whose date cannot be read. */
+    invalidTime: string;
+    /** Announced when events with new ids arrive. */
+    newEvents: (count: number) => string;
+    /** Event count shown beside each day heading. */
+    dayCount: (count: number) => string;
+}
+export interface TimelinePartProps {
+    className?: string;
+    css?: Interpolation<Theme>;
+}
+export type TimelineSlotProps = Partial<Record<'scroller' | 'group' | 'heading' | 'list' | 'item' | 'marker' | 'trigger' | 'time' | 'detail' | 'status', TimelinePartProps>>;
+export interface TimelineProps extends Omit<ComponentPropsWithRef<'div'>, 'defaultValue' | 'onChange' | 'children'>, SxProps {
+    /** Caller-owned events in any order; the component sorts a copy. */
+    events: readonly TimelineEvent[];
+    /** Reference instant in epoch ms. Pass the same value on server and client. */
+    now: number;
+    /** Ids of events whose detail is open (controlled). */
+    value?: readonly string[];
+    defaultValue?: readonly string[];
+    /** Requested open ids after a disclosure interaction. */
+    onValueChange?: (ids: string[]) => void;
+    /** Formatting locale; pass one explicitly for matching server and client output. */
+    locale?: Intl.LocalesArgument;
+    /** IANA zone used for day grouping and every displayed date. */
+    timeZone?: string;
+    headingLevel?: TimelineHeadingLevel;
+    /** Bounds the timeline in its own scroller; without it the timeline grows in page flow. */
+    maxHeight?: CSSProperties['maxHeight'];
+    /** Scroll to an event newer than any shown before. Never moves focus. */
+    scrollToNew?: boolean;
+    size?: TimelineSize;
+    labels?: Partial<TimelineLabels>;
+    slotProps?: TimelineSlotProps;
+}
+export declare function Timeline({ ref, events, now, value, defaultValue, onValueChange, locale, timeZone, headingLevel, maxHeight, scrollToNew, size, labels: labelProps, slotProps, className, sx, onKeyDown, onFocus, onBlur, 'aria-label': ariaLabelProp, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, ...rest }: TimelineProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare namespace Timeline {
+    var displayName: string;
+}

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

@@ -1,6 +1,6 @@
-import { type ComponentPropsWithRef, type MouseEvent, type ReactNode } from 'react';
+import { type ComponentPropsWithRef, type MouseEvent, type ReactNode, type CSSProperties } from 'react';
 import { type SxProps } from '../../styling/sx';
-export type ToastTone = 'neutral' | 'success' | 'danger';
+export type ToastTone = 'neutral' | 'success' | 'danger' | 'info' | 'warning';
 export interface ToastAction {
     label: string;
     /** Runs on click; the toast then dismisses unless the handler calls `event.preventDefault()`. */
@@ -13,6 +13,8 @@ export interface ToastOptions {
     /** Milliseconds before auto-dismiss; `null` persists until dismissed. Defaults to the provider's. */
     duration?: number | null;
     action?: ToastAction;
+    /** Decorative spinner; an omitted duration persists while loading. */
+    loading?: boolean;
 }
 export interface ToastProviderProps {
     children?: ReactNode;
@@ -28,10 +30,43 @@ export interface ToastViewportProps extends ComponentPropsWithRef<'div'>, SxProp
 export interface ToastApi {
     toast: (options: ToastOptions) => string;
     dismiss: (id: string) => void;
+    /**
+     * Patches an open toast in place; only a changed duration restarts the countdown.
+     * Unknown or closing ids are ignored.
+     */
+    update: (id: string, patch: Partial<ToastOptions>) => void;
 }
+type ToastState = 'open' | 'closing';
+interface ToastRecord {
+    id: string;
+    options: ToastOptions;
+    state: ToastState;
+}
+interface ToastQueueContextValue {
+    toasts: ToastRecord[];
+    dismiss: (id: string) => void;
+    remove: (id: string) => void;
+    registerRoot: (id: string, root: HTMLDivElement | null) => void;
+    dismissLabel: string;
+    registerRenderer: () => () => void;
+}
+export declare const TOAST_VIEWPORT_INLINE_SIZE = "min(380px, calc(100vw - 32px))";
+export declare function useToastQueueContext(part: string): ToastQueueContextValue;
 export declare function useToast(): ToastApi;
 declare function ToastProvider({ children, max, duration, dismissLabel, }: ToastProviderProps): import("@emotion/react/jsx-runtime").JSX.Element;
 declare function ToastViewport({ ref, className, sx, ...props }: ToastViewportProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare function ToastPortal({ children, contained }: {
+    children: ReactNode;
+    contained?: boolean;
+}): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare function ToastItem({ record, exposed, paused, style, className, escapeDismiss, }: {
+    record: ToastRecord;
+    exposed?: boolean;
+    paused?: boolean;
+    style?: CSSProperties;
+    className?: string;
+    escapeDismiss?: boolean;
+}): import("@emotion/react/jsx-runtime").JSX.Element;
 declare function ToastRoot(props: ToastProviderProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export declare const Toast: typeof ToastRoot & {
     Provider: typeof ToastProvider;

package/dist/types/components/toast-stack/index.d.ts

@@ -0,0 +1,2 @@
+export { ToastStack } from './toast-stack';
+export type { ToastStackProps, ToastStackPosition, ToastStackVariant } from './toast-stack';

package/dist/types/components/toast-stack/toast-stack.d.ts

@@ -0,0 +1,28 @@
+import { type ComponentPropsWithRef } from 'react';
+import { type Interpolation, type Theme } from '../../styling/css';
+import { type SxProps } from '../../styling/sx';
+export type ToastStackVariant = 'stacked' | 'list';
+export type ToastStackPosition = 'bottom-start' | 'bottom-center' | 'bottom-end';
+type PartStyle = {
+    className?: string;
+    css?: Interpolation<Theme>;
+};
+export interface ToastStackProps extends Omit<ComponentPropsWithRef<'div'>, 'children'>, SxProps {
+    variant?: ToastStackVariant;
+    position?: ToastStackPosition;
+    contained?: boolean;
+    maxVisible?: number;
+    label?: string;
+    hotkey?: boolean;
+    expandLabel?: string;
+    collapseLabel?: string;
+    slotProps?: {
+        list?: PartStyle;
+        toggle?: PartStyle;
+    };
+}
+export declare function ToastStack(props: ToastStackProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare namespace ToastStack {
+    var displayName: string;
+}
+export {};

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

@@ -16,7 +16,7 @@ export interface TooltipTriggerProps extends ComponentPropsWithRef<'button'>, Sx
 }
 export interface TooltipContentProps extends ComponentPropsWithRef<'div'>, SxProps {
 }
-declare function TooltipRoot({ open: openProp, defaultOpen, onOpenChange, placement, openDelay, closeDelay, children, }: TooltipProps): import("@emotion/react/jsx-runtime").JSX.Element;
+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;
 export declare const Tooltip: typeof TooltipRoot & {

package/dist/types/components/tree-view/index.d.ts

@@ -0,0 +1 @@
+export { TreeView, type TreeNode, type TreeViewMessages, type TreeViewPartProps, type TreeViewProps, type TreeViewSlotProps, } from './tree-view';

package/dist/types/components/tree-view/tree-view.d.ts

@@ -0,0 +1,47 @@
+import { type ComponentPropsWithRef, type ReactNode, type Ref } from 'react';
+import { type Interpolation, type Theme } from '../../styling/css';
+import { type SxProps } from '../../styling/sx';
+export interface TreeNode {
+    id: string;
+    label: string;
+    children?: readonly TreeNode[];
+    hasChildren?: boolean;
+    icon?: ReactNode;
+    disabled?: boolean;
+}
+export interface TreeViewMessages {
+    loading: (label: string) => string;
+    error: (label: string) => string;
+    empty: string;
+}
+export interface TreeViewPartProps {
+    className?: string;
+    css?: Interpolation<Theme>;
+}
+export type TreeViewSlotProps = Partial<Record<'tree' | 'row' | 'label' | 'icon' | 'disclosure' | 'group' | 'status', TreeViewPartProps>>;
+export interface TreeViewProps extends Omit<ComponentPropsWithRef<'div'>, 'children' | 'defaultValue' | 'onChange'>, SxProps {
+    nodes: readonly TreeNode[];
+    value?: string | null;
+    defaultValue?: string | null;
+    onValueChange?: (id: string | null) => void;
+    open?: readonly string[];
+    defaultOpen?: readonly string[];
+    onOpenChange?: (ids: readonly string[]) => void;
+    loadChildren?: (node: TreeNode, options: {
+        signal: AbortSignal;
+    }) => Promise<readonly TreeNode[]>;
+    onLoadError?: (error: unknown, node: TreeNode) => void;
+    label?: string;
+    messages?: Partial<TreeViewMessages>;
+    empty?: ReactNode;
+    treeRef?: Ref<HTMLUListElement>;
+    locale?: Intl.LocalesArgument;
+    slotProps?: TreeViewSlotProps;
+}
+/** Single-select APG tree with real roving focus. Right opens/enters and Left closes/parents,
+ * including RTL. Up/Down clamp; Home/End jump; Enter/Space select; typeahead resets after 500ms.
+ * Lazy results are cached per instance; remount with a new key to replace the dataset cache. */
+export declare function TreeView({ nodes, value, defaultValue, onValueChange, open, defaultOpen, onOpenChange, loadChildren, onLoadError, label, messages: messageProps, empty, treeRef, locale, slotProps, ref, className, sx, onKeyDown, onClick, onBlur, 'aria-label': ariaLabel, 'aria-labelledby': labelledBy, 'aria-describedby': describedBy, ...rest }: TreeViewProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare namespace TreeView {
+    var displayName: string;
+}