@jfrader/ui 0.5.1 → 0.6.0

package/dist/types/components/link-unfurl/link-unfurl.d.ts

@@ -0,0 +1,94 @@
+import { type ComponentPropsWithoutRef, type ComponentPropsWithRef, type ReactNode } from 'react';
+import { type Interpolation, type Theme } from '../../styling/css';
+import { type SxProps } from '../../styling/sx';
+export type LinkUnfurlPreviewStatus = 'pending' | 'ready' | 'none' | 'error';
+export interface LinkUnfurlPreview {
+    /** The detected link this record belongs to (from `onPreviewRequest`'s context). */
+    linkId: string;
+    /** The request this record answers; records for any other request id are ignored. */
+    requestId: string;
+    url: string;
+    status: LinkUnfurlPreviewStatus;
+    site?: string;
+    title?: string;
+    description?: ReactNode;
+    /** Informative image; `alt` describes it, or pass `''` when the image adds nothing. */
+    image?: {
+        src: string;
+        alt: string;
+    };
+    /** Decorative site icon URL. */
+    favicon?: string;
+    /** Shown instead of `labels.noPreview` when the status is `error`. */
+    error?: string;
+}
+export interface LinkUnfurlPreviewRequestContext {
+    linkId: string;
+    requestId: string;
+    signal: AbortSignal;
+}
+export interface LinkUnfurlSuggestion {
+    url: string;
+    label: string;
+}
+export interface LinkUnfurlMessage {
+    text: string;
+    previews: LinkUnfurlPreview[];
+}
+export interface LinkUnfurlLabels {
+    send: string;
+    expand: string;
+    collapse: string;
+    remove: string;
+    retry: string;
+    pending: string;
+    noPreview: string;
+    sent: string;
+    error: string;
+    /** Keyboard description read with the field. */
+    hint: string;
+}
+interface SlotStyle {
+    className?: string;
+    css?: Interpolation<Theme>;
+}
+type PartProps<E extends 'div' | 'a' | 'img' | 'p' | 'button'> = Omit<ComponentPropsWithoutRef<E>, 'children' | 'id' | 'className' | 'dangerouslySetInnerHTML'> & SlotStyle;
+export interface LinkUnfurlSlotProps {
+    field?: Omit<ComponentPropsWithRef<'textarea'>, 'children' | 'id' | 'value' | 'defaultValue' | 'readOnly' | 'className' | 'dangerouslySetInnerHTML'> & SlotStyle;
+    lane?: PartProps<'div'>;
+    /** Handlers that the item's layout animation owns are not accepted. */
+    chip?: Omit<PartProps<'div'>, 'onAnimationStart' | 'onDrag' | 'onDragStart' | 'onDragEnd'>;
+    card?: Omit<PartProps<'div'>, 'hidden' | 'inert'>;
+    title?: Omit<PartProps<'a'>, 'href'>;
+    image?: Omit<PartProps<'img'>, 'src' | 'alt'>;
+    controls?: PartProps<'div'>;
+    send?: Omit<PartProps<'button'>, 'type' | 'disabled'>;
+    status?: Omit<PartProps<'div'>, 'role' | 'aria-live' | 'aria-atomic'>;
+    error?: Omit<PartProps<'p'>, 'role'>;
+}
+export interface LinkUnfurlProps extends Omit<ComponentPropsWithRef<'div'>, 'children' | 'defaultValue' | 'onChange'>, SxProps {
+    /** Visible label of the message field. */
+    label: string;
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (text: string) => void;
+    previews?: LinkUnfurlPreview[];
+    onPreviewRequest?: (url: string, context: LinkUnfurlPreviewRequestContext) => void;
+    expanded?: string[];
+    defaultExpanded?: string[];
+    onExpandedChange?: (ids: string[]) => void;
+    suggestions?: LinkUnfurlSuggestion[];
+    /** Enables sending; a returned promise keeps the composer pending until it settles. */
+    onSend?: (message: LinkUnfurlMessage) => void | Promise<unknown>;
+    labels?: Partial<LinkUnfurlLabels>;
+    /** Locale for the joined status announcements. */
+    locale?: Intl.LocalesArgument;
+    /** `'none'` commits every change without animation, on top of the user's reduced-motion setting. */
+    motion?: 'auto' | 'none';
+    slotProps?: LinkUnfurlSlotProps;
+}
+export declare function LinkUnfurl({ ref, label, value: valueProp, defaultValue, onValueChange, previews, onPreviewRequest, expanded: expandedProp, defaultExpanded, onExpandedChange, suggestions, onSend, labels: labelsProp, locale, motion: motionMode, slotProps, className, sx, ...rest }: LinkUnfurlProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare namespace LinkUnfurl {
+    var displayName: string;
+}
+export {};

package/dist/types/components/locale-switcher/index.d.ts

@@ -0,0 +1,2 @@
+export { LocaleSwitcher } from './locale-switcher';
+export type { LocaleSwitcherLinkProps, LocaleSwitcherOption, LocaleSwitcherProps, LocaleSwitcherSize, LocaleSwitcherSlotProps, LocaleSwitcherVariant, } from './locale-switcher';

package/dist/types/components/locale-switcher/locale-switcher.d.ts

@@ -0,0 +1,58 @@
+import { type ComponentPropsWithoutRef, 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';
+export type LocaleSwitcherVariant = 'menu' | 'swap' | 'inline';
+export type LocaleSwitcherSize = 'sm' | 'md' | 'lg';
+/** Props an option's `render` callback spreads onto the link it returns. */
+export interface LocaleSwitcherLinkProps extends Omit<ComponentPropsWithRef<'a'>, 'href' | 'children'> {
+    href: string;
+    children: ReactNode;
+    'data-ui': string;
+}
+export interface LocaleSwitcherOption {
+    value: string;
+    /** The language's native name ("Español", "English"). */
+    label: ReactNode;
+    /** BCP 47 tag of the label and of the linked page; rendered as `lang` and `hreflang`. */
+    lang?: string;
+    href: string;
+    /** Replaces the native <a> (e.g. with a router link). Spread ALL supplied props onto it. */
+    render?: (props: LocaleSwitcherLinkProps) => ReactNode;
+}
+type SlotStyle = {
+    className?: string;
+    css?: Interpolation<Theme>;
+};
+export interface LocaleSwitcherSlotProps {
+    /** Menu variant's trigger button. */
+    trigger?: Omit<ComponentPropsWithoutRef<'button'>, 'children' | 'className' | 'aria-labelledby'> & SlotStyle;
+    /** Menu variant's popup. */
+    content?: Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'className'> & SlotStyle;
+    /** Every option element (menu items, the swap link, inline links and the current label). */
+    option?: SlotStyle;
+}
+export interface LocaleSwitcherProps extends Omit<ComponentPropsWithRef<'nav'>, 'children'>, SxProps {
+    options: readonly LocaleSwitcherOption[];
+    /** The current option's value. */
+    value: string;
+    variant?: LocaleSwitcherVariant;
+    size?: LocaleSwitcherSize;
+    /** Menu: names the trigger's action ("Change language"); read before the current label. */
+    triggerLabel?: string;
+    /** Inline: accessible name of the navigation landmark. */
+    label?: string;
+    /** Menu: decorative icon before the current label; `null` removes it. */
+    icon?: ReactNode;
+    /** Menu open state. */
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    placement?: Placement;
+    slotProps?: LocaleSwitcherSlotProps;
+}
+export declare function LocaleSwitcher({ ref, options, value, variant, size, triggerLabel, label, icon, open, defaultOpen, onOpenChange, placement, slotProps, className, sx, ...rest }: LocaleSwitcherProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare namespace LocaleSwitcher {
+    var displayName: string;
+}
+export {};

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

@@ -1,4 +1,4 @@
-import { type ComponentPropsWithRef, type CSSProperties, type HTMLProps, type MutableRefObject, type ReactNode } from 'react';
+import { type ComponentPropsWithRef, type CSSProperties, type HTMLAttributes, type HTMLProps, type MutableRefObject, type ReactNode, type RefCallback } from 'react';
 import { type Placement, type UseInteractionsReturn } from '@floating-ui/react';
 import { type Interpolation, type SerializedStyles, type Theme } from '../../styling/css';
 import { type SxProps } from '../../styling/sx';
@@ -54,12 +54,21 @@ export interface MenuPartIdentity {
     marker: string;
     styles?: Interpolation<Theme>;
 }
-/** Item behavior a family may change: the part name in usage errors, the item role and whether
- * selection closes the menu. */
+/** Props a menu item's `render` callback spreads onto the element it returns. */
+export interface MenuItemRenderProps extends HTMLAttributes<HTMLElement> {
+    ref: RefCallback<HTMLElement> | null;
+    'data-ui': string;
+}
+/** Item behavior a family may change: the part name in usage errors, the item role, whether
+ * selection closes the menu, `busy` (an item that stays focusable and navigable but ignores
+ * activation, exposed as aria-busy and aria-disabled) and `render`, which replaces the native
+ * button (e.g. with an <a href>). */
 export interface MenuItemPartBehavior {
     part?: string;
-    itemRole?: 'menuitem' | 'menuitemcheckbox';
+    itemRole?: 'menuitem' | 'menuitemcheckbox' | 'menuitemradio';
     closeOnSelect?: boolean;
+    busy?: boolean;
+    render?: (props: MenuItemRenderProps) => ReactNode;
 }
 export declare function useMenuContext(family: string, part: string): MenuContextValue;
 /**
@@ -67,12 +76,18 @@ export declare function useMenuContext(family: string, part: string): MenuContex
  * `preventDefault()` vetoes the internal request (open, toggle, navigation).
  */
 export declare function consumerHandlersFirst(props: HTMLProps<Element>, getProps: (userProps: HTMLProps<Element>) => Record<string, unknown>): Record<string, unknown>;
+export declare const joinIds: (...ids: Array<string | undefined>) => string | undefined;
 /** Own styles of a menu item, for families that layer their own item styles on top. */
 export declare const menuItemStyles: SerializedStyles[];
 /** Own styles of a menu separator. */
 export declare const menuSeparatorStyles: SerializedStyles;
 /** Command tones for families whose items carry one (SplitButton, ContextMenu). */
 export declare const menuItemToneStyles: Record<MenuItemTone, SerializedStyles>;
+/**
+ * Returns focus to a closed overlay's trigger, unless the trigger left the document or became
+ * inert (its owner is being removed) or something else already holds focus.
+ */
+export declare function restoreTriggerFocus(trigger: HTMLElement | null): void;
 /** The shared menu controller (state, positioning, navigation, dismissal, focus return). */
 export declare function MenuController(props: MenuControllerProps): import("@emotion/react/jsx-runtime").JSX.Element;
 declare function MenuRoot(props: MenuProps): import("@emotion/react/jsx-runtime").JSX.Element;
@@ -81,8 +96,17 @@ declare function MenuTrigger(props: MenuTriggerProps): import("@emotion/react/js
 export declare function MenuContentPart({ family, marker, styles, ref, style, children, className, sx, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, defaultLabelledBy, ...rest }: MenuContentProps & MenuPartIdentity & {
     defaultLabelledBy?: string;
 }): import("@emotion/react/jsx-runtime").JSX.Element | null;
+/**
+ * The menu's item collection: items rendered inside register with its list navigation and
+ * typeahead, and layers opened inside nest under the menu. Families that build their own surface
+ * around the menu element (UserMenu) render it inside the element carrying the floating props.
+ */
+export declare function MenuCollection({ family, children }: {
+    family: string;
+    children?: ReactNode;
+}): import("@emotion/react/jsx-runtime").JSX.Element;
 declare function MenuContent(props: MenuContentProps): import("@emotion/react/jsx-runtime").JSX.Element;
-export declare function MenuItemPart({ family, marker, styles, ref, onSelect, disabled, part, itemRole, closeOnSelect, onClick, className, sx, ...rest }: MenuItemProps & MenuPartIdentity & MenuItemPartBehavior): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare function MenuItemPart({ family, marker, styles, ref, onSelect, disabled, part, itemRole, closeOnSelect, busy, render, onClick, onKeyDown, className, sx, ...rest }: MenuItemProps & MenuPartIdentity & MenuItemPartBehavior): import("@emotion/react/jsx-runtime").JSX.Element;
 declare function MenuItem(props: MenuItemProps): import("@emotion/react/jsx-runtime").JSX.Element;
 export declare function MenuSeparatorPart({ marker, styles, ref, className, sx, ...props }: MenuSeparatorProps & Omit<MenuPartIdentity, 'family'>): import("@emotion/react/jsx-runtime").JSX.Element;
 declare function MenuSeparator(props: MenuSeparatorProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/types/components/next/emotion-registry.d.ts

@@ -0,0 +1,16 @@
+import { type ReactNode } from 'react';
+export interface EmotionRegistryProps {
+    /** Emotion cache key: the class name prefix and the `data-emotion` attribute value. */
+    cacheKey?: string;
+    children?: ReactNode;
+}
+/**
+ * Emotion SSR registry for the App Router: one shared cache and a flush that only
+ * sends the styles inserted since the last pass, so the server and client trees
+ * match on hydration. Without it, Emotion inserts <style> nodes inline during SSR
+ * and the hydration diff mismatches.
+ */
+export declare function EmotionRegistry({ cacheKey, children }: EmotionRegistryProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare namespace EmotionRegistry {
+    var displayName: string;
+}

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

@@ -0,0 +1,2 @@
+export { EmotionRegistry } from './emotion-registry';
+export type { EmotionRegistryProps } from './emotion-registry';

package/dist/types/components/next/registry.d.ts

@@ -0,0 +1,21 @@
+import { type EmotionCache } from '@emotion/cache';
+export interface PendingStyle {
+    name: string;
+    isGlobal: boolean;
+}
+export interface CollectedStyles {
+    globals: {
+        name: string;
+        styles: string;
+    }[];
+    names: string[];
+    styles: string;
+}
+export interface EmotionRegistryCache {
+    cache: EmotionCache;
+    /** Returns the styles inserted since the previous call and forgets them. */
+    flush: () => PendingStyle[];
+}
+export declare function createEmotionRegistry(key: string): EmotionRegistryCache;
+/** Splits flushed styles into one payload per global and one shared payload for scoped rules. */
+export declare function collectStyles(pending: readonly PendingStyle[], inserted: EmotionCache['inserted']): CollectedStyles;

package/dist/types/components/now-playing/index.d.ts

@@ -0,0 +1 @@
+export { NowPlaying, NowPlayingLevels, type NowPlayingProps, type NowPlayingTrack, type NowPlayingLabels, type NowPlayingSlotProps, type NowPlayingLevelsProps, } from './now-playing';

package/dist/types/components/now-playing/now-playing.d.ts

@@ -0,0 +1,88 @@
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
+import { type Interpolation, type Theme } from '../../styling/css';
+import { type SxProps } from '../../styling/sx';
+import { type ButtonProps } from '../button';
+import { type SliderProps } from '../slider';
+export interface NowPlayingTrack {
+    id: string;
+    title: string;
+    artist: string;
+    duration: number | null;
+    artwork?: string;
+    artworkAlt?: string;
+}
+type Part<T extends 'div' | 'span' | 'img'> = ComponentPropsWithRef<T> & {
+    css?: Interpolation<Theme>;
+};
+export interface NowPlayingSlotProps {
+    mini?: Part<'div'>;
+    full?: Part<'div'>;
+    artwork?: Part<'img'>;
+    title?: Part<'span'>;
+    artist?: Part<'span'>;
+    expand?: Omit<ButtonProps, 'sx' | 'render'>;
+    collapse?: Omit<ButtonProps, 'sx' | 'render'>;
+    seek?: Omit<Extract<SliderProps, {
+        type?: 'single';
+    }>, 'sx' | 'type' | 'value' | 'defaultValue' | 'onValueChange' | 'label' | 'dir' | 'min' | 'max' | 'step' | 'largeStep' | 'locale' | 'formatValue' | 'formatOptions' | 'showValue'>;
+    waveform?: Part<'div'>;
+    controls?: Part<'div'>;
+    status?: Part<'span'>;
+    error?: Part<'div'>;
+}
+export interface NowPlayingLabels {
+    play: string;
+    pause: string;
+    previous: string;
+    next: string;
+    expand: string;
+    collapse: string;
+    seek: string;
+    empty: string;
+    unavailable: string;
+    busy: string;
+    playing: string;
+    paused: string;
+    position: (elapsed: string, duration: string) => string;
+}
+export interface NowPlayingProps extends Omit<ComponentPropsWithRef<'section'>, 'defaultValue' | 'children' | 'onChange'>, SxProps {
+    tracks: readonly NowPlayingTrack[];
+    value?: number;
+    defaultValue?: number;
+    onValueChange?: (index: number) => void;
+    playing?: boolean;
+    defaultPlaying?: boolean;
+    onPlayingChange?: (playing: boolean) => void;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    position?: number;
+    defaultPosition?: number;
+    onPositionChange?: (seconds: number) => void;
+    busy?: boolean;
+    error?: ReactNode;
+    waveform?: readonly number[];
+    label?: string;
+    labels?: Partial<NowPlayingLabels>;
+    locale?: Intl.LocalesArgument;
+    /**
+     * Seconds per arrow step. Slider requires the duration to be a whole number of steps, so a
+     * step that does not divide it is rounded to the nearest one that does (180s with 7 → 180/26).
+     * Defaults to the largest step of at most one second that divides the duration.
+     */
+    seekStep?: number;
+    seekLargeStep?: number;
+    slotProps?: NowPlayingSlotProps;
+}
+export interface NowPlayingLevelsProps extends ComponentPropsWithRef<'span'>, SxProps {
+    playing?: boolean;
+}
+export declare function NowPlayingLevels({ ref, playing: playingProp, className, sx, ...rest }: NowPlayingLevelsProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare namespace NowPlayingLevels {
+    var displayName: string;
+}
+declare function NowPlayingRoot({ ref, tracks, value, defaultValue, onValueChange, playing, defaultPlaying, onPlayingChange, open, defaultOpen, onOpenChange, position, defaultPosition, onPositionChange, busy, error, waveform, label, labels: labelsProp, locale, seekStep, seekLargeStep, slotProps, className, sx, onKeyDown, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, ...rest }: NowPlayingProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const NowPlaying: typeof NowPlayingRoot & {
+    Levels: typeof NowPlayingLevels;
+};
+export {};

package/dist/types/components/photo-grid/index.d.ts

@@ -0,0 +1,2 @@
+export { PhotoGrid } from './photo-grid';
+export type { PhotoGridProps, PhotoGridPhoto, PhotoGridLabels, PhotoGridSlotProps } from './photo-grid';

package/dist/types/components/photo-grid/photo-grid.d.ts

@@ -0,0 +1,82 @@
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
+import { type Interpolation, type Theme } from '../../styling/css';
+import { type SxProps } from '../../styling/sx';
+export interface PhotoGridPhoto {
+    id: string;
+    src: string;
+    srcSet?: string;
+    sizes?: string;
+    alt: string;
+    width: number;
+    height: number;
+    title: string;
+    detail?: ReactNode;
+}
+type Slot<Tag extends keyof React.JSX.IntrinsicElements> = Omit<ComponentPropsWithRef<Tag>, 'children'> & {
+    css?: Interpolation<Theme>;
+};
+type ActionSlot = Omit<Slot<'button'>, 'type' | 'disabled' | 'aria-pressed'>;
+export interface PhotoGridSlotProps {
+    header?: Slot<'header'>;
+    title?: Slot<'h2'>;
+    density?: Slot<'div'>;
+    list?: Slot<'ul'>;
+    item?: Slot<'li'>;
+    photo?: ActionSlot;
+    favorite?: ActionSlot;
+    viewer?: Omit<Slot<'dialog'>, 'open'>;
+    stage?: Slot<'div'>;
+    filmstrip?: Omit<Slot<'input'>, 'type' | 'value' | 'defaultValue' | 'min' | 'max' | 'step' | 'disabled'>;
+    controls?: Slot<'div'>;
+    status?: Slot<'div'>;
+}
+export interface PhotoGridLabels {
+    larger: string;
+    smaller: string;
+    density: string;
+    empty: string;
+    unavailable: string;
+    imageUnavailable: string;
+    close: string;
+    previous: string;
+    next: string;
+    filmstrip: string;
+    zoomIn: string;
+    zoomOut: string;
+    resetZoom: string;
+    panLeft: string;
+    panRight: string;
+    panUp: string;
+    panDown: string;
+    favorite: (title: string, favorite: boolean) => string;
+    openPhoto: (title: string, alt: string, favorite: boolean) => string;
+    position: (position: string, total: string, title: string) => string;
+    columns: (columns: string) => string;
+}
+export interface PhotoGridProps extends Omit<ComponentPropsWithRef<'div'>, 'children' | 'defaultValue'>, SxProps {
+    photos: readonly PhotoGridPhoto[];
+    title: string;
+    /** Preferred columns. Narrow containers reduce effective columns without changing this axis. */
+    densitySteps?: readonly number[];
+    density?: number;
+    defaultDensity?: number;
+    onDensityChange?: (columns: number) => void;
+    favorites?: readonly string[];
+    defaultFavorites?: readonly string[];
+    onFavoritesChange?: (ids: string[]) => void;
+    onFavoriteChange?: (id: string, favorite: boolean) => void;
+    value?: string | null;
+    defaultValue?: string | null;
+    onValueChange?: (id: string | null) => void;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    labels?: Partial<PhotoGridLabels>;
+    locale?: Intl.LocalesArgument;
+    slotProps?: PhotoGridSlotProps;
+}
+export declare function PhotoGrid({ ref, photos, title, densitySteps, density: densityProp, defaultDensity, onDensityChange, favorites: favoritesProp, defaultFavorites, onFavoritesChange, onFavoriteChange, value: valueProp, defaultValue, onValueChange, open: openProp, defaultOpen, onOpenChange, labels: labelOverrides, locale, slotProps, className, sx, onKeyDown, ...rest }: PhotoGridProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare namespace PhotoGrid {
+    var displayName: string;
+}
+export {};

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

@@ -0,0 +1,2 @@
+export { SheetStack, useSheetStack } from './sheet-stack';
+export type { SheetStackActions, SheetStackBackProps, SheetStackCloseProps, SheetStackContentProps, SheetStackDescriptionProps, SheetStackFooterProps, SheetStackHeadingLevel, SheetStackProps, SheetStackTitleProps, SheetStackTriggerProps, SheetStackVariant, } from './sheet-stack';

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

@@ -0,0 +1,78 @@
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
+import { type SxProps } from '../../styling/sx';
+export type SheetStackVariant = 'auto' | 'sheet' | 'dialog';
+export type SheetStackHeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
+export interface SheetStackProps {
+    /** Open sheet keys, bottom first. */
+    value?: readonly string[];
+    defaultValue?: readonly string[];
+    onValueChange?: (value: string[]) => void;
+    /** `auto` lays out as a sheet below `breakpoint` and as a centered dialog at or above it. */
+    variant?: SheetStackVariant;
+    /** Layer inline size in CSS px where `auto` switches to the dialog layout. */
+    breakpoint?: number;
+    /** Draws the layer inside the nearest positioned ancestor; modality stays document-wide. */
+    contained?: boolean;
+    children: ReactNode;
+}
+export interface SheetStackTriggerProps extends ComponentPropsWithRef<'button'>, SxProps {
+    /** Key of the sheet this trigger pushes. */
+    value: string;
+}
+export interface SheetStackContentProps extends Omit<ComponentPropsWithRef<'div'>, 'onCancel'>, SxProps {
+    /** Stable key, unique within the stack. */
+    value: string;
+    /** False refuses Escape, backdrop and drag dismissal; Back and Close still work. */
+    dismissible?: boolean;
+    /** Dismissal request (Escape, backdrop, drag) on this sheet while on top; `preventDefault()` vetoes it. */
+    onCancel?: (event: Event) => void;
+    /** Set false to keep structured content out of the sheet's accessible description. */
+    withDescription?: boolean;
+}
+export interface SheetStackTitleProps extends ComponentPropsWithRef<'h2'>, SxProps {
+    level?: SheetStackHeadingLevel;
+}
+export interface SheetStackDescriptionProps extends ComponentPropsWithRef<'p'>, SxProps {
+}
+export interface SheetStackFooterProps extends ComponentPropsWithRef<'div'>, SxProps {
+}
+export interface SheetStackBackProps extends Omit<ComponentPropsWithRef<'button'>, 'aria-label'>, SxProps {
+    /** Localized accessible name, e.g. "Back to Settings". */
+    label: string;
+}
+export interface SheetStackCloseProps extends Omit<ComponentPropsWithRef<'button'>, 'aria-label'>, SxProps {
+    /** Localized accessible name, e.g. "Close all". */
+    label: string;
+}
+export interface SheetStackActions {
+    /** The open keys, bottom first. */
+    value: readonly string[];
+    /** Opens `key` on top; an open key truncates the stack back to it. */
+    push: (key: string) => void;
+    /** Closes the top sheet. */
+    pop: () => void;
+    /** Truncates the stack back to the open `key`. */
+    popTo: (key: string) => void;
+    /** Closes every sheet. */
+    close: () => void;
+}
+/** The stack's state and actions; throws outside `<SheetStack>`. */
+export declare function useSheetStack(): SheetStackActions;
+declare function SheetStackRoot({ value: valueProp, defaultValue, onValueChange, variant, breakpoint, contained, children, }: SheetStackProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function SheetStackTrigger({ ref, value, onClick, className, sx, ...rest }: SheetStackTriggerProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function SheetStackContent({ ref, value, className, sx, ...props }: SheetStackContentProps): import("react").ReactPortal | null;
+declare function SheetStackTitle({ ref, level, className, sx, children, ...props }: SheetStackTitleProps): import("@emotion/react/jsx-runtime").JSX.Element | null;
+declare function SheetStackDescription({ ref, className, sx, children, ...props }: SheetStackDescriptionProps): import("@emotion/react/jsx-runtime").JSX.Element | null;
+declare function SheetStackFooter({ ref, className, sx, ...props }: SheetStackFooterProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function SheetStackBack({ ref, label, onClick, className, sx, children, ...rest }: SheetStackBackProps): import("@emotion/react/jsx-runtime").JSX.Element;
+declare function SheetStackClose({ ref, label, onClick, className, sx, children, ...rest }: SheetStackCloseProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const SheetStack: typeof SheetStackRoot & {
+    Trigger: typeof SheetStackTrigger;
+    Content: typeof SheetStackContent;
+    Title: typeof SheetStackTitle;
+    Description: typeof SheetStackDescription;
+    Footer: typeof SheetStackFooter;
+    Back: typeof SheetStackBack;
+    Close: typeof SheetStackClose;
+};
+export {};

package/dist/types/components/shortcut-recorder/index.d.ts

@@ -0,0 +1,2 @@
+export { ShortcutRecorder, normalizeShortcut, matchesShortcut, formatShortcut, useShortcutPlatform, usePressedShortcutKeys, defaultShortcutMessages, } from './shortcut-recorder';
+export type { ShortcutRecorderProps, ShortcutKeysProps, ShortcutListProps, ShortcutPlatform, ShortcutBinding, ShortcutListGroup, ShortcutMessages, KeyboardEventLike, } from './shortcut-recorder';

package/dist/types/components/shortcut-recorder/shortcut-recorder.d.ts

@@ -0,0 +1,117 @@
+import { type ComponentPropsWithRef, type ReactNode } from 'react';
+import { type SxProps } from '../../styling/sx';
+import { type FieldPartProps } from '../field/field-anatomy';
+export type ShortcutPlatform = 'mac' | 'other';
+export interface ShortcutBinding {
+    shortcut: string;
+    label: string;
+}
+export interface ShortcutListGroup {
+    label: string;
+    items: readonly {
+        label: string;
+        shortcut: string;
+        keywords?: string;
+    }[];
+}
+export interface ShortcutMessages {
+    placeholder: string;
+    recording: string;
+    canceled: string;
+    cleared: string;
+    noShortcut: string;
+    clearLabel: string;
+    cancelLabel: string;
+    confirmLabel: string;
+    reset: (spoken: string) => string;
+    set: (spoken: string) => string;
+    requireModifier: (platform: ShortcutPlatform) => string;
+    conflict: (spoken: string, binding: ShortcutBinding, reserved: boolean) => string;
+    listLabel: string;
+    searchLabel: string;
+    searchPlaceholder: string;
+    empty: string;
+    results: (count: number) => string;
+    keyName: (id: string, platform: ShortcutPlatform) => {
+        label: string;
+        spoken: string;
+    };
+}
+export interface KeyboardEventLike {
+    code: string;
+    key: string;
+    ctrlKey: boolean;
+    altKey: boolean;
+    shiftKey: boolean;
+    metaKey: boolean;
+    repeat?: boolean;
+    isComposing?: boolean;
+    getModifierState?: (key: string) => boolean;
+}
+export declare function normalizeShortcut(shortcut: string, platform: ShortcutPlatform): string | null;
+export declare function matchesShortcut(event: KeyboardEventLike, shortcut: string, platform: ShortcutPlatform): boolean;
+export declare const defaultShortcutMessages: ShortcutMessages;
+export declare function formatShortcut(shortcut: string, platform: ShortcutPlatform, messages?: ShortcutMessages): {
+    text: string;
+    spoken: string;
+};
+export declare function useShortcutPlatform(override?: ShortcutPlatform): ShortcutPlatform;
+export declare function usePressedShortcutKeys(enabled?: boolean): ReadonlySet<string>;
+export interface ShortcutKeysProps extends ComponentPropsWithRef<'span'>, SxProps {
+    shortcut: string;
+    platform?: ShortcutPlatform;
+    pressed?: ReadonlySet<string>;
+    size?: 'sm' | 'md';
+    messages?: ShortcutMessages;
+    locale?: Intl.LocalesArgument;
+    slotProps?: {
+        key?: FieldPartProps;
+    };
+}
+declare function ShortcutKeys({ shortcut, platform: platformProp, pressed, size, messages, locale: _locale, slotProps, className, sx, ...rest }: ShortcutKeysProps): import("@emotion/react/jsx-runtime").JSX.Element;
+type RecorderSlot = 'root' | 'label' | 'control' | 'recorder' | 'actions' | 'reset' | 'clear' | 'message' | 'confirm' | 'cancel' | 'description' | 'error' | 'status' | 'key';
+export interface ShortcutRecorderProps extends Omit<ComponentPropsWithRef<'button'>, 'value' | 'defaultValue'>, SxProps {
+    value?: string | null;
+    defaultValue?: string | null;
+    onValueChange?: (value: string | null, details: {
+        replaced?: ShortcutBinding;
+    }) => void;
+    recording?: boolean;
+    defaultRecording?: boolean;
+    onRecordingChange?: (recording: boolean) => void;
+    resetValue?: string | null;
+    bindings?: readonly ShortcutBinding[];
+    reservedBindings?: readonly ShortcutBinding[];
+    warnReserved?: boolean;
+    requireModifier?: boolean;
+    platform?: ShortcutPlatform;
+    label?: ReactNode;
+    description?: ReactNode;
+    error?: ReactNode;
+    hideLabel?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+    locale?: Intl.LocalesArgument;
+    messages?: ShortcutMessages;
+    readOnly?: boolean;
+    slotProps?: Partial<Record<RecorderSlot, FieldPartProps>>;
+}
+declare function ShortcutRecorderRoot({ ref, value, defaultValue, onValueChange, recording, defaultRecording, onRecordingChange, resetValue, bindings, reservedBindings, warnReserved, requireModifier, platform: platformProp, label, description, error, hideLabel, size, locale, messages, readOnly, disabled, name, dir, slotProps, className, sx, onClick, onKeyDown, onKeyUp, onBlur, onFocus, 'aria-labelledby': labelledBy, 'aria-describedby': describedBy, 'aria-invalid': invalid, id, children: _children, ...rest }: ShortcutRecorderProps): import("@emotion/react/jsx-runtime").JSX.Element;
+type ListSlot = 'root' | 'search' | 'groups' | 'group' | 'heading' | 'item' | 'keys' | 'empty' | 'status';
+export interface ShortcutListProps extends ComponentPropsWithRef<'section'>, SxProps {
+    groups: readonly ShortcutListGroup[];
+    searchable?: boolean;
+    highlightPressed?: boolean;
+    platform?: ShortcutPlatform;
+    locale?: Intl.LocalesArgument;
+    messages?: ShortcutMessages;
+    inputValue?: string;
+    defaultInputValue?: string;
+    onInputChange?: (value: string) => void;
+    slotProps?: Partial<Record<ListSlot, FieldPartProps>>;
+}
+declare function ShortcutList({ groups, searchable, highlightPressed, platform, locale, messages, inputValue, defaultInputValue, onInputChange, slotProps, className, sx, ref, ...rest }: ShortcutListProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const ShortcutRecorder: typeof ShortcutRecorderRoot & {
+    Keys: typeof ShortcutKeys;
+    List: typeof ShortcutList;
+};
+export {};

package/dist/types/components/stretch-refresh/index.d.ts

@@ -0,0 +1 @@
+export { StretchRefresh, type StretchRefreshProps, type StretchRefreshSlotProps, type StretchRefreshLabels, } from './stretch-refresh';