@birdycom/omniaui-react 0.12.5 → 0.12.6

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as react from 'react';
-import { RefObject, SyntheticEvent, HTMLAttributes, DetailsHTMLAttributes, ReactNode, InputHTMLAttributes, DialogHTMLAttributes, AnchorHTMLAttributes, ButtonHTMLAttributes, FormHTMLAttributes, LiHTMLAttributes, FieldsetHTMLAttributes, SVGProps, SelectHTMLAttributes, TableHTMLAttributes, TdHTMLAttributes, TextareaHTMLAttributes, ProgressHTMLAttributes, CSSProperties } from 'react';
+import { RefObject, SyntheticEvent, HTMLAttributes, DetailsHTMLAttributes, ReactNode, InputHTMLAttributes, DialogHTMLAttributes, AnchorHTMLAttributes, ButtonHTMLAttributes, FormHTMLAttributes, LiHTMLAttributes, FieldsetHTMLAttributes, SVGProps, SelectHTMLAttributes, ImgHTMLAttributes, TableHTMLAttributes, TdHTMLAttributes, TextareaHTMLAttributes, ProgressHTMLAttributes, CSSProperties } from 'react';
 
 /** Merge several refs into one callback ref. */
 declare function useMergedRef<T>(...refs: Array<React.Ref<T> | undefined>): (node: T | null) => void;
@@ -213,6 +213,25 @@ declare const Avatar: react.ForwardRefExoticComponent<AvatarProps & react.RefAtt
 /** `<div class="oc-avatar-group">` */
 declare const AvatarGroup: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
 
+interface AvatarPickerProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "onInvalid"> {
+    initials: string;
+    label?: string;
+    hint?: string;
+    /** Rounded square and contain-fit (a company logo). */
+    logo?: boolean;
+    /** Name of the file input (sent with the form). */
+    name?: string;
+    accept?: string;
+    /** Refuse larger files (KB); the reason shows under the buttons. */
+    maxKb?: number;
+    inputProps?: InputHTMLAttributes<HTMLInputElement>;
+    onChange?: (file: File | null) => void;
+    /** A refused file (wrong type for accept, or larger than maxKb) and the reason. */
+    onInvalid?: (file: File, reason: string) => void;
+}
+/** Avatar or logo picker with a preview, Upload and Remove, and drag and drop (`.oc-avatar-picker`). */
+declare const AvatarPicker: react.ForwardRefExoticComponent<AvatarPickerProps & react.RefAttributes<HTMLDivElement>>;
+
 /** `<a class="oc-back-link">Back to Products</a>` */
 declare const BackLink: react.ForwardRefExoticComponent<AnchorHTMLAttributes<HTMLAnchorElement> & react.RefAttributes<HTMLAnchorElement>>;
 
@@ -223,6 +242,16 @@ interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
 /** `<span class="oc-badge oc-badge--{variant}">` */
 declare const Badge: react.ForwardRefExoticComponent<BadgeProps & react.RefAttributes<HTMLSpanElement>>;
 
+interface BarcodeProps extends HTMLAttributes<HTMLElement> {
+    value: string;
+    format?: "auto" | "EAN13" | "EAN8" | "UPC" | "CODE128";
+    /** Digits under the bars. Default true. */
+    digits?: boolean;
+    size?: "md" | "hero" | "compact";
+}
+/** EAN-13, EAN-8, UPC-A or Code 128 as SVG (`figure.oc-barcode`); shows the reason when the value cannot be encoded. */
+declare const Barcode: react.ForwardRefExoticComponent<BarcodeProps & react.RefAttributes<HTMLElement>>;
+
 interface BarcodeInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "value" | "defaultValue" | "onChange" | "children"> {
     value?: string;
     defaultValue?: string;
@@ -244,9 +273,13 @@ interface BreadcrumbItemData {
     label: ReactNode;
     /** Omit (or put last) to mark the current page. */
     href?: string;
+    /** Shown before the label: an `<iconify-icon icon="mdi:…" />`, an `<Icon d=… />` or any node. */
+    icon?: ReactNode;
 }
 interface BreadcrumbProps extends HTMLAttributes<HTMLElement> {
     items?: BreadcrumbItemData[];
+    /** `"slash"` (default) or `"chevron"` (›) between the items. */
+    separator?: "slash" | "chevron";
 }
 /** `<nav class="oc-breadcrumb">` with links and a final `aria-current="page"` item. */
 declare const Breadcrumb: react.ForwardRefExoticComponent<BreadcrumbProps & react.RefAttributes<HTMLElement>>;
@@ -282,7 +315,7 @@ interface BusyOverlayProps extends Omit<DialogHTMLAttributes<HTMLDialogElement>,
 /** `dialog.oc-busy-overlay[closedby=none]`. Controlled with `open` / `onOpenChange`, or uncontrolled. */
 declare const BusyOverlay: react.ForwardRefExoticComponent<BusyOverlayProps & react.RefAttributes<HTMLDialogElement>>;
 
-type ButtonVariant = "default" | "secondary" | "outline" | "ghost" | "link" | "destructive" | "success" | "gradient" | "glass";
+type ButtonVariant = "default" | "secondary" | "outline" | "ghost" | "link" | "destructive" | "success" | "gradient" | "glass" | "soft-primary" | "soft-success" | "soft-warning" | "soft-destructive" | "soft-info" | "plain";
 type ButtonSize = "xs" | "sm" | "md" | "lg";
 interface ButtonStyleProps {
     /** Visual variant (`default` = primary). */
@@ -296,15 +329,19 @@ interface ButtonStyleProps {
     /** Inside running text (with variant="link"): no padding or height, the size of the text around it. */
     inline?: boolean;
 }
+interface LoadingProp {
+    /** Busy: a spinner replaces the leading icon and the button cannot be clicked (`aria-busy`). */
+    loading?: boolean;
+}
 /** The class string of a button; reuse it on your own elements (router links etc.). */
 declare function buttonClass({ variant, size, icon, pill, inline, className }: ButtonStyleProps & {
     className?: string;
 }): string;
-interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, ButtonStyleProps {
+interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, ButtonStyleProps, LoadingProp {
 }
 /** `<button class="oc-btn oc-btn--{variant} oc-btn--{size}">` */
 declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
-interface ButtonLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement>, ButtonStyleProps {
+interface ButtonLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement>, ButtonStyleProps, LoadingProp {
 }
 /** An anchor styled as a button. */
 declare const ButtonLink: react.ForwardRefExoticComponent<ButtonLinkProps & react.RefAttributes<HTMLAnchorElement>>;
@@ -471,27 +508,6 @@ interface ColorSelectProps extends Omit<FieldsetHTMLAttributes<HTMLFieldSetEleme
 /** `.oc-color-select`: radio swatches; the color is passed through the --oc-swatch variable. */
 declare const ColorSelect: react.ForwardRefExoticComponent<ColorSelectProps & react.RefAttributes<HTMLFieldSetElement>>;
 
-interface ColumnMenuColumn {
-    label: ReactNode;
-    /** Visible at the start (default true). */
-    visible?: boolean;
-    /** Always visible; the checkbox is disabled. */
-    locked?: boolean;
-}
-interface ColumnMenuProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
-    /** One entry per table column, in column order (max 10). */
-    columns: ColumnMenuColumn[];
-    /** The table (`.oc-table`) the menu controls. */
-    children: ReactNode;
-    triggerLabel?: ReactNode;
-    title?: ReactNode;
-    resetLabel?: ReactNode;
-    /** Called with the column number (1-based) and its new visibility. */
-    onColumnToggle?: (column: number, visible: boolean) => void;
-}
-/** `.oc-column-menu-scope` with a `.oc-column-menu[popover]` column checklist. */
-declare const ColumnMenu: react.ForwardRefExoticComponent<ColumnMenuProps & react.RefAttributes<HTMLDivElement>>;
-
 interface CommandItemData {
     id: string;
     label: string;
@@ -612,15 +628,43 @@ interface DataTableColumn {
     hideable?: boolean;
     /** Start hidden until the user checks it in the Columns menu. */
     defaultHidden?: boolean;
+    /** Cut long text with an ellipsis at this width (e.g. "12rem"); the full text goes in the title. */
+    truncate?: string;
+    /** Sort the table on this column when it starts. */
+    defaultSort?: "ascending" | "descending";
 }
 interface DataTableRow {
     key: string;
     status?: "active" | "deleted" | "archived";
-    cells: Record<string, string>;
-    /** Sort and export value when it differs from the visible text. */
+    /** Text or any node per column: a <DataTableName>, a badge, a count button … */
+    cells: Record<string, ReactNode>;
+    /** Sort, filter, search and export value when it differs from the visible content (needed for nodes). */
     values?: Record<string, string>;
     href?: string;
 }
+/** Tabs above the toolbar that filter one column (All / Customers / Companies …). */
+interface DataTableTabs {
+    column: string;
+    label?: string;
+    /** tone colors the count like the type badge in the table. */
+    items: {
+        value: string;
+        label: string;
+        icon?: ReactNode;
+        count?: number;
+        tone?: "success" | "info" | "warning";
+    }[];
+}
+/** A select in the filter row that filters one column; "" is the "all" option. */
+interface DataTableColumnFilter {
+    column: string;
+    label: string;
+    icon?: ReactNode;
+    options: {
+        value: string;
+        label: string;
+    }[];
+}
 interface DataTableProps {
     id?: string;
     title?: string;
@@ -629,17 +673,59 @@ interface DataTableProps {
     pageSize?: number;
     searchPlaceholder?: string;
     selectable?: boolean;
+    /** Grip column to drag rows. The drag itself is OmniaUI Pro (data-table-pro.js). Default false. */
     draggable?: boolean;
-    /** Trash and archive pills. Default true. */
+    /** Handles to drag a column width. The resize itself is OmniaUI Pro (data-table-pro.js). Default false. */
+    resizable?: boolean;
+    /** Column chooser in the actions header (show or hide columns). Needs the OmniaUI Pro CSS. Default false. */
+    columnMenu?: boolean;
+    /** Trash pills (active / including trash / trash only). Default true. */
     filters?: boolean;
+    /** Also an "Archive only" pill. Default true. */
+    archive?: boolean;
+    tabs?: DataTableTabs;
+    columnFilters?: DataTableColumnFilter[];
+    /** The buttons in the actions column of a row. Default: one soft edit button. */
+    rowActions?: (row: DataTableRow) => ReactNode;
+    /** Footer count, e.g. "Showing {from}–{to} of {total} customers". */
+    summary?: string;
+    /** Offer "Import CSV" in the settings (fires oc-datatable-import with the file). Default false. */
+    importable?: boolean;
+    /** "bordered" = version 2: tinted header, lines between the columns, sort chevrons always visible. */
+    variant?: "default" | "bordered";
+    /** Striped rows. Default true. */
+    striped?: boolean;
     /** Demo mode: trash, restore, duplicate and delete change the rows in the page. */
     live?: boolean;
     /** Page actions on the right of the toolbar (New article, …). */
     actions?: ReactNode;
     onBulk?: (action: string, keys: string[]) => void;
 }
-/** Korrekt / OmniaDesk list table. The script in @birdycom/omniaui/data-table.js does the work. */
-declare function DataTable({ id, title, columns, rows, pageSize, searchPlaceholder, selectable, draggable, filters, live, actions, onBulk, }: DataTableProps): react.JSX.Element;
+interface DataTableNameProps {
+    name: string;
+    /** Initials in the avatar; default: the first letters of the name. */
+    initials?: string;
+    /** Image in the avatar instead of initials. */
+    avatar?: string;
+    /** A badge after the name (type, status …). */
+    badge?: ReactNode;
+    /** Muted second line (VAT number, e-mail …). */
+    sub?: ReactNode;
+}
+/** Name cell: avatar, name with a badge and a muted second line. */
+declare function DataTableName({ name, initials, avatar, badge, sub }: DataTableNameProps): react.JSX.Element;
+/** List table for business apps. The script in @birdycom/omniaui/data-table.js does the work. */
+declare function DataTable({ id, title, columns, rows, pageSize, searchPlaceholder, selectable, draggable, resizable, columnMenu, filters, archive, tabs, columnFilters, rowActions, summary, importable, variant, striped, live, actions, onBulk, }: DataTableProps): react.JSX.Element;
+
+interface DateFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size"> {
+    /** Show the ISO week at the end. Default true. */
+    week?: boolean;
+    /** Week label template: {week} and {year}. Default "Week {week}". */
+    weekLabel?: string;
+    size?: "md" | "sm";
+}
+/** Native date input with a calendar icon zone and the ISO week (`.oc-date-field`). */
+declare const DateField: react.ForwardRefExoticComponent<DateFieldProps & react.RefAttributes<HTMLInputElement>>;
 
 interface DecimalInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "value" | "defaultValue" | "type"> {
     /** The number; null = empty. */
@@ -756,7 +842,7 @@ interface EmojiPickerProps extends Omit<HTMLAttributes<HTMLDivElement>, "onSelec
     onSelect?: (emoji: string) => void;
     /** Always-visible panel without trigger / popover. */
     inline?: boolean;
-    /** Trigger content (default 🙂) and its accessible name. */
+    /** Trigger content (default: a smiley webicon) and its accessible name. */
     trigger?: ReactNode;
     triggerLabel?: string;
 }
@@ -869,11 +955,44 @@ declare const FieldGroup: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDiv
     row?: boolean;
 } & react.RefAttributes<HTMLDivElement>>;
 
+interface FormSectionProps extends Omit<DetailsHTMLAttributes<HTMLDetailsElement>, "title"> {
+    title: ReactNode;
+    hint?: ReactNode;
+    /** Webicon or SVG in the tinted square. */
+    icon?: ReactNode;
+    /** Right side of the header: a badge (Complete, 1 error) … */
+    status?: ReactNode;
+}
+/** `<details class="oc-form-section">`: icon, title, hint, status; children are the fields (responsive grid). */
+declare const FormSection: react.ForwardRefExoticComponent<FormSectionProps & react.RefAttributes<HTMLDetailsElement>>;
+
+interface GalleryImage {
+    src: string;
+    alt: string;
+    /** Thumbnail image; default the same src. */
+    thumb?: string;
+    /** Short name of the thumbnail (its radio label); default the alt. */
+    thumbAlt?: string;
+}
+interface GalleryProps extends HTMLAttributes<HTMLDivElement> {
+    images: GalleryImage[];
+    /** Name of the photos (thumbnail group legend). */
+    label?: string;
+    badge?: ReactNode;
+    side?: boolean;
+    /** Radio name; default generated. */
+    name?: string;
+}
+/** Product photos with thumbnails (`.oc-gallery`), CSS only (radios + :has, up to 8). */
+declare const Gallery: react.ForwardRefExoticComponent<GalleryProps & react.RefAttributes<HTMLDivElement>>;
+
 interface GlassProps extends HTMLAttributes<HTMLElement> {
     /** More opaque, for text-heavy content. */
     strong?: boolean;
     /** Desktop window where the OS draws the blur: no own blur, no drop shadow. */
     flat?: boolean;
+    /** Liquid glass: clear tint, strong blur and saturation, specular rim. */
+    liquid?: boolean;
     as?: "div" | "section" | "aside" | "article" | "main";
 }
 /** `.oc-glass`: see-through sheet with a light top edge; .oc-card inside becomes a glass panel. */
@@ -884,6 +1003,24 @@ interface GlassPanelProps extends HTMLAttributes<HTMLDivElement> {
 /** `.oc-glass-panel`: a lighter layer inside a glass sheet. */
 declare const GlassPanel: react.ForwardRefExoticComponent<GlassPanelProps & react.RefAttributes<HTMLDivElement>>;
 
+interface GlassBarItem {
+    label: string;
+    /** An <Icon>, an <iconify-icon> or an inline SVG. */
+    icon?: ReactNode;
+    href?: string;
+    current?: boolean;
+    onClick?: () => void;
+}
+interface GlassBarProps extends HTMLAttributes<HTMLElement> {
+    items: GlassBarItem[];
+    /** Icons only (the label becomes the accessible name). */
+    icons?: boolean;
+    /** Accessible name of the bar. */
+    label?: string;
+}
+/** `.oc-glass-bar`: a floating liquid glass menu bar; the current item sits in a raised bubble. */
+declare const GlassBar: react.ForwardRefExoticComponent<GlassBarProps & react.RefAttributes<HTMLElement>>;
+
 type GreetingTimeOfDay = "morning" | "afternoon" | "evening";
 /** Pick the time-of-day modifier for a date. */
 declare function greetingTimeOfDay(date?: Date): GreetingTimeOfDay;
@@ -997,6 +1134,23 @@ interface LauncherCardProps extends Omit<AnchorHTMLAttributes<HTMLElement>, "tit
 /** `.oc-launcher`: an `<a>` (with `href`), a `<button>` (with `onClick`), or a `<span>` when disabled. */
 declare const LauncherCard: react.ForwardRefExoticComponent<LauncherCardProps & react.RefAttributes<HTMLElement>>;
 
+interface LazyImageProps extends HTMLAttributes<HTMLElement> {
+    src: string;
+    alt: string;
+    width?: number;
+    height?: number;
+    /** Aspect ratio of the box, e.g. "16 / 10" (default) or "1". */
+    ratio?: string;
+    /** URL of a tiny copy, shown blurred until the photo is there (instead of the shimmer). */
+    preview?: string;
+    caption?: ReactNode;
+    /** "lazy" (default) or "eager" for images in the first screen. */
+    loading?: "lazy" | "eager";
+    imgProps?: ImgHTMLAttributes<HTMLImageElement>;
+}
+/** `.oc-lazy`: an image that keeps its place, shows a placeholder and fades in once loaded. */
+declare const LazyImage: react.ForwardRefExoticComponent<LazyImageProps & react.RefAttributes<HTMLElement>>;
+
 interface LightboxImage {
     /** Image URL. Leave empty to show placeholder art (`.oc-media-art`). */
     src?: string;
@@ -1196,7 +1350,7 @@ interface MessageData {
     text?: ReactNode;
     attachments?: MessageAttachment[];
     actions?: MessageAction[];
-    /** aria-label of the row, e.g. "Lisa Verbeke, 09:12". */
+    /** aria-label of the row, e.g. "Customer 1, 09:12". */
     label?: string;
     id?: string;
 }
@@ -1288,6 +1442,20 @@ interface MessageThreadProps extends Omit<HTMLAttributes<HTMLElement>, "title">
 /** `section.oc-message-thread`: header, scrolling messages (newest at the bottom), composer and sending overlay. */
 declare const MessageThread: react.ForwardRefExoticComponent<MessageThreadProps & react.RefAttributes<HTMLElement>>;
 
+interface MeterRowProps extends HTMLAttributes<HTMLDivElement> {
+    label: ReactNode;
+    /** 0–100. */
+    percent: number;
+    /** The amount as text after the percentage ("31k / 50k tokens"). */
+    value?: ReactNode;
+    /** When it resets ("Resets in 2 h"). */
+    reset?: ReactNode;
+    /** Color; default from the percentage: warn from 75, critical from 90. */
+    level?: "ok" | "warn" | "critical";
+}
+/** Usage line: label, percentage and amount, a colored bar and the reset line (`.oc-meter-row`). */
+declare const MeterRow: react.ForwardRefExoticComponent<MeterRowProps & react.RefAttributes<HTMLDivElement>>;
+
 type ModalSize = "sm" | "md" | "lg" | "xl" | "full";
 interface ModalProps extends Omit<DialogHTMLAttributes<HTMLDialogElement>, "title" | "open" | "onClose">, DialogState {
     /** Heading (`oc-modal-title`). */
@@ -1308,6 +1476,22 @@ declare const Modal: react.ForwardRefExoticComponent<ModalProps & react.RefAttri
 /** A button that closes the surrounding Modal / AlertDialog / Sheet. */
 declare const ModalClose: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
 
+interface NameCardProps extends Omit<DetailsHTMLAttributes<HTMLDetailsElement>, "title"> {
+    name: string;
+    /** Amount on the right (already formatted, e.g. "€ 1.940,00"). */
+    amount?: ReactNode;
+    /** Quiet extra after the name ("6 articles"). */
+    meta?: ReactNode;
+    /** Buttons on the right (e.g. a soft destructive delete). */
+    actions?: ReactNode;
+    /** Show the rename pencil; onRename gets the new name. */
+    onRename?: (name: string) => void;
+    /** Amount in the primary color (a total). */
+    total?: boolean;
+}
+/** `<details class="oc-name-card">`: name, rename pencil, amount and actions in the header; children are the content. */
+declare const NameCard: react.ForwardRefExoticComponent<NameCardProps & react.RefAttributes<HTMLDetailsElement>>;
+
 interface NavmenuProps extends HTMLAttributes<HTMLUListElement> {
     /** `aria-label` of the wrapping <nav>. */
     label?: string;
@@ -1471,6 +1655,28 @@ interface PopoverProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
 /** Trigger + `<div class="oc-popover" popover>` floating panel. */
 declare const Popover: react.ForwardRefExoticComponent<PopoverProps & react.RefAttributes<HTMLDivElement>>;
 
+/** Format an amount with Intl (locale and currency), or pass a string through. */
+declare function formatPrice(amount: number | string, currency?: string, locale?: string): string;
+interface PriceProps extends HTMLAttributes<HTMLDivElement> {
+    amount: number | string;
+    /** Old price (struck through). */
+    old?: number | string;
+    /** Discount badge text ("-20%"). */
+    discount?: ReactNode;
+    /** Quiet note: "excl. VAT". */
+    note?: ReactNode;
+    /** The other amount: "€ 180,29 incl. VAT". */
+    alt?: ReactNode;
+    currency?: string;
+    locale?: string;
+    size?: "sm" | "md" | "lg";
+    sale?: boolean;
+    inline?: boolean;
+    end?: boolean;
+}
+/** A price with old price, discount, VAT note and the other amount (`.oc-price`). */
+declare const Price: react.ForwardRefExoticComponent<PriceProps & react.RefAttributes<HTMLDivElement>>;
+
 interface PriceCardFeature {
     label: ReactNode;
     /** Shown with a cross and muted text. */
@@ -1574,6 +1780,46 @@ declare function ProseLead({ className, ...rest }: HTMLAttributes<HTMLParagraphE
 /** `.oc-prose`: typography for long-form text written without classes. */
 declare const Prose: react.ForwardRefExoticComponent<ProseProps & react.RefAttributes<HTMLElement>>;
 
+interface QuantityProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size" | "value" | "defaultValue" | "onChange" | "min" | "max" | "step"> {
+    value?: number;
+    defaultValue?: number;
+    onChange?: (value: number) => void;
+    min?: number;
+    max?: number;
+    step?: number;
+    size?: "sm" | "md";
+    /** Accessible name of the field (also used for the buttons). Default "Quantity". */
+    label?: string;
+}
+/** Minus, number and plus in one frame (`.oc-quantity`). */
+declare const Quantity: react.ForwardRefExoticComponent<QuantityProps & react.RefAttributes<HTMLInputElement>>;
+
+interface RatingProps extends HTMLAttributes<HTMLSpanElement> {
+    /** The score, e.g. 4.5. */
+    value: number;
+    /** Number of stars. Default 5. */
+    max?: number;
+    size?: "sm" | "md" | "lg";
+    /** Accessible text; default "4.5 out of 5". */
+    label?: string;
+}
+/** Stars of a score (`.oc-rating`), halves and decimals included. */
+declare const Rating: react.ForwardRefExoticComponent<RatingProps & react.RefAttributes<HTMLSpanElement>>;
+interface RatingInputProps extends Omit<HTMLAttributes<HTMLFieldSetElement>, "onChange" | "defaultValue"> {
+    /** Radio name (form value 1–5). Default: a generated name. */
+    name?: string;
+    value?: number;
+    defaultValue?: number;
+    onChange?: (value: number) => void;
+    legend?: string;
+    /** Text per star; default "1 star", "2 stars" … */
+    starLabel?: (n: number) => string;
+    size?: "sm" | "md" | "lg";
+    disabled?: boolean;
+}
+/** Five radio buttons drawn as stars (`.oc-rating-input`), CSS hover preview. */
+declare const RatingInput: react.ForwardRefExoticComponent<RatingInputProps & react.RefAttributes<HTMLFieldSetElement>>;
+
 interface RecoveryCodesProps extends Omit<HTMLAttributes<HTMLDivElement>, "title" | "onCopy"> {
     codes: string[];
     title?: ReactNode;
@@ -1588,6 +1834,17 @@ interface RecoveryCodesProps extends Omit<HTMLAttributes<HTMLDivElement>, "title
 /** `.oc-recovery-codes`: warning panel with a code grid, "Copy all" and "Download .txt". */
 declare const RecoveryCodes: react.ForwardRefExoticComponent<RecoveryCodesProps & react.RefAttributes<HTMLDivElement>>;
 
+type RibbonCorner = "top-start" | "top-end" | "bottom-start" | "bottom-end";
+interface RibbonProps extends HTMLAttributes<HTMLSpanElement> {
+    /** Corner of the parent box (default top-end). */
+    corner?: RibbonCorner;
+    tone?: "primary" | "success" | "warning" | "destructive" | "muted";
+    size?: "sm" | "md" | "lg";
+    children: ReactNode;
+}
+/** Diagonal band across a corner of its parent (`.oc-ribbon`): Paid, New, Sale. */
+declare const Ribbon: react.ForwardRefExoticComponent<RibbonProps & react.RefAttributes<HTMLSpanElement>>;
+
 interface SegmentedOption {
     value: string;
     label: ReactNode;
@@ -1729,6 +1986,22 @@ interface SortableRowProps extends HTMLAttributes<HTMLTableRowElement> {
 /** `tr.oc-sortable-row[draggable]` with a `button.oc-sortable-row-grip` in the first cell. */
 declare const SortableRow: react.ForwardRefExoticComponent<SortableRowProps & react.RefAttributes<HTMLTableRowElement>>;
 
+interface SpecGroup {
+    title: ReactNode;
+    icon?: ReactNode;
+    rows: {
+        label: ReactNode;
+        value: ReactNode;
+        note?: ReactNode;
+    }[];
+}
+interface SpecListProps extends HTMLAttributes<HTMLDivElement> {
+    groups: SpecGroup[];
+    stack?: boolean;
+}
+/** Technical specifications in named groups (`.oc-spec-list`). */
+declare const SpecList: react.ForwardRefExoticComponent<SpecListProps & react.RefAttributes<HTMLDivElement>>;
+
 interface StackCardProps extends Omit<HTMLAttributes<HTMLElement>, "title"> {
     title: ReactNode;
     /** Link of the title; it covers the whole card. */
@@ -1811,6 +2084,17 @@ interface StepperProps extends Omit<HTMLAttributes<HTMLOListElement>, "onChange"
 /** `<ol class="oc-stepper">`: done, active and upcoming steps. */
 declare const Stepper: react.ForwardRefExoticComponent<StepperProps & react.RefAttributes<HTMLOListElement>>;
 
+interface StockProps extends HTMLAttributes<HTMLSpanElement> {
+    level?: "ok" | "low" | "out" | "order";
+    badge?: boolean;
+    /** The text; default per level ("In stock", "Low stock", "Out of stock", "On order"). */
+    children?: ReactNode;
+    /** A quiet extra after the text. */
+    note?: ReactNode;
+}
+/** Stock status with a colored dot (`.oc-stock`). */
+declare const Stock: react.ForwardRefExoticComponent<StockProps & react.RefAttributes<HTMLSpanElement>>;
+
 interface SwitchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "role"> {
     /** Class for the wrapping label (`className` goes to the input). */
     labelClassName?: string;
@@ -2595,8 +2879,12 @@ declare const BlockProductGrid: react.ForwardRefExoticComponent<BlockProductGrid
 
 interface ProfileHeaderTab {
     label: ReactNode;
-    href: string;
+    /** A link per tab (a route in your app); leave out and give content for tabs on the page itself. */
+    href?: string;
+    /** The open tab (aria-current for links, checked for tabs with content). */
     current?: boolean;
+    /** Panel content: with content the tabs switch on the page itself (radios + panels, CSS only). */
+    content?: ReactNode;
 }
 interface BlockProfileHeaderProps extends HTMLAttributes<HTMLElement> {
     name: ReactNode;
@@ -2613,7 +2901,7 @@ interface BlockProfileHeaderProps extends HTMLAttributes<HTMLElement> {
     /** Heading level of the name (h1 on a profile page, h2 inside a page). */
     headingLevel?: 1 | 2;
 }
-/** `.oc-block-profile`: banner, overhanging avatar, name, meta, actions and link tabs. */
+/** `.oc-block-profile`: banner, overhanging avatar, name, meta, actions and tabs (links, or panels on the page). */
 declare const BlockProfileHeader: react.ForwardRefExoticComponent<BlockProfileHeaderProps & react.RefAttributes<HTMLElement>>;
 
 interface ShowcaseProject {
@@ -2772,4 +3060,4 @@ interface BlockWizardDialogProps extends Omit<DialogHTMLAttributes<HTMLDialogEle
 /** `dialog.oc-modal` wizard: stepper rail on the left, step content and Back / Next footer. */
 declare const BlockWizardDialog: react.ForwardRefExoticComponent<BlockWizardDialogProps & react.RefAttributes<HTMLDialogElement>>;
 
-export { Accordion, AccordionAccent, AccordionAccentMeta, type AccordionAccentPreset, type AccordionAccentProps, type AccordionAccentTone, AccordionItem, type AccordionItemProps, AffixInput, type AffixInputProps, type AffixInputVariant, Alert, AlertDialog, type AlertDialogProps, type AlertDialogType, type AlertProps, type AlertVariant, AlphaTabs, type AlphaTabsProps, type AppHeaderNavItem, Attachment, type AttachmentFile, AttachmentImage, type AttachmentImageProps, AttachmentList, type AttachmentListProps, type AttachmentProps, AttachmentThumb, type AttachmentThumbProps, type AttachmentType, Avatar, AvatarGroup, type AvatarProps, type AvatarSize, BackLink, Badge, type BadgeProps, type BadgeVariant, BarcodeInput, type BarcodeInputProps, BlockAboutTimeline, type BlockAboutTimelineProps, BlockAppHeader, type BlockAppHeaderProps, BlockAppShell, type BlockAppShellProps, BlockAuth, type BlockAuthProps, BlockAuthSplit, type BlockAuthSplitProps, BlockContactGrid, type BlockContactGridProps, BlockCta, type BlockCtaProps, BlockDataTable, type BlockDataTableProps, BlockDataTableSpacer, BlockFaq, type BlockFaqProps, BlockFeatures, type BlockFeaturesProps, BlockFooter, type BlockFooterProps, BlockFormPage, BlockFormPageGrid, type BlockFormPageProps, BlockHero, BlockHeroCode, type BlockHeroCodeProps, BlockHeroOrbit, type BlockHeroOrbitProps, type BlockHeroProps, BlockHeroSplit, type BlockHeroSplitProps, BlockModuleHeader, type BlockModuleHeaderProps, BlockPageHero, type BlockPageHeroProps, BlockPortfolioGrid, type BlockPortfolioGridProps, BlockPricing, type BlockPricingProps, BlockProcess, type BlockProcessProps, BlockProductGrid, type BlockProductGridProps, BlockProfileHeader, type BlockProfileHeaderProps, BlockShowcase, type BlockShowcaseProps, BlockSiteFooter, type BlockSiteFooterProps, BlockSiteHeader, type BlockSiteHeaderProps, BlockSpotlight, type BlockSpotlightProps, BlockStats, BlockStatsCounter, type BlockStatsCounterProps, type BlockStatsProps, BlockTeamList, type BlockTeamListProps, BlockTwoFactor, type BlockTwoFactorProps, BlockWizardDialog, type BlockWizardDialogProps, Breadcrumb, type BreadcrumbItemData, type BreadcrumbProps, BrowserFrame, type BrowserFrameProps, BusyOverlay, type BusyOverlayProps, Button, ButtonLink, type ButtonLinkProps, type ButtonProps, type ButtonSize, type ButtonVariant, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ChartLine, type ChartLineProps, type ChartLineSeries, ChatComposer, type ChatComposerProps, Checkbox, type CheckboxProps, Checklist, ChecklistItem, type ChecklistItemProps, type ChecklistProps, ChipFilter, type ChipFilterOption, type ChipFilterProps, Collapsible, type CollapsibleProps, ColorField, type ColorFieldProps, ColorSelect, type ColorSelectOption, type ColorSelectProps, ColumnMenu, type ColumnMenuColumn, type ColumnMenuProps, Command, type CommandGroupData, type CommandItemData, type CommandProps, ConfirmDialog, type ConfirmDialogProps, type ConsentChoice, type ContactGridCard, type ContactGridLine, type CookieCategory, CookieConsent, type CookieConsentProps, CopyField, type CopyFieldProps, Counter, type CounterProps, type CounterStat, DataTable, type DataTableColumn, type DataTableProps, type DataTableRow, DecimalInput, type DecimalInputProps, type DefinitionItem, DefinitionList, type DefinitionListProps, DialogContext, type DialogState, DocViewer, type DocViewerItem, type DocViewerProps, Dropdown, DropdownItem, DropdownLabel, type DropdownProps, DropdownSeparator, Dropzone, type DropzoneProps, type EmojiGroup, EmojiPicker, type EmojiPickerProps, EmptyState, type EmptyStateProps, EntityCard, type EntityCardProps, FactList, type FactListProps, type FactListRow, type FaqItem, type Feature, FieldGroup, FilterCounts, type FilterCountsOption, type FilterCountsProps, FilterPill, FilterPills, FlipCard, type FlipCardProps, type FooterColumn, type FooterLink, FormField, type FormFieldProps, Glass, GlassPanel, type GlassPanelProps, type GlassProps, Greeting, type GreetingProps, type GreetingTimeOfDay, Heading, type HeadingProps, type HeroOrbitMark, type HeroTile, Icon, type IconProps, ImageZoom, type ImageZoomProps, Input, InputGroup, type InputGroupProps, type InputProps, LanguageSelect, type LanguageSelectOption, type LanguageSelectProps, LauncherCard, type LauncherCardProps, Lightbox, type LightboxImage, type LightboxProps, LinkArrow, type LinkArrowDirection, type LinkArrowProps, LinkRow, type LinkRowLink, type LinkRowProps, ListToolbar, type ListToolbarProps, type ListToolbarView, LiveFrame, type LiveFrameProps, Marquee, type MarqueeProps, MediaCard, type MediaCardProps, MediaRow, MediaRowList, type MediaRowListProps, type MediaRowProps, MediaThumb, type MediaThumbProps, Message, type MessageAction, type MessageAttachment, MessageAttachments, type MessageData, MessageDivider, type MessageDividerProps, MessageList, type MessageListItem, type MessageListProps, type MessageProps, MessageThread, type MessageThreadProps, Modal, ModalClose, type ModalProps, type ModalSize, Navmenu, NavmenuDropdown, type NavmenuDropdownProps, NavmenuItem, NavmenuLink, type NavmenuLinkProps, type NavmenuProps, NextTeaser, type NextTeaserProps, NumberInput, type NumberInputProps, OtpInput, type OtpInputProps, PageHeader, type PageHeaderProps, Pagination, type PaginationProps, PasswordInput, type PasswordInputProps, PasswordRequirements, type PasswordRequirementsProps, type PasswordRule, type PhoneCountry, PhoneInput, type PhoneInputProps, Popover, type PopoverProps, type PortfolioGridProject, PriceCard, type PriceCardFeature, type PriceCardPrice, type PriceCardProps, type PricingPlan, type ProcessStep, type Product, ProductMark, type ProductMarkAccent, type ProductMarkProps, type ProductMarkSize, type ProfileHeaderTab, Progress, type ProgressProps, ProjectCard, type ProjectCardProps, Prose, ProseLead, type ProseProps, RecoveryCodes, type RecoveryCodesProps, Segmented, type SegmentedOption, type SegmentedProps, Select, type SelectOption, type SelectProps, SeverityCard, type SeverityCardProps, type SeverityLevel, Sheet, type SheetProps, type SheetSide, type ShowcaseProject, Sidebar, SidebarCollapsible, type SidebarCollapsibleProps, SidebarGroup, type SidebarGroupProps, SidebarMenu, SidebarMenuButton, type SidebarMenuButtonProps, SidebarMenuItem, type SidebarProps, SidebarSeparator, type SiteFooterColumn, type SiteHeaderLink, Skeleton, type SkeletonProps, SortableRow, type SortableRowProps, type SpotlightModule, StackCard, type StackCardProps, StackList, type StackListItem, type StackListProps, type Stat, StatCard, StatCardGrid, type StatCardProps, Status, StatusDot, type StatusDotProps, type StatusProps, type StatusTone, Stepper, type StepperProps, type StepperStep, Switch, type SwitchProps, type TabItem, Table, TableActionIcon, type TableActionTone, TableActions, TableActionsMenu, type TableActionsMenuProps, TableCompact, type TableCompactColumn, type TableCompactProps, TableEmpty, type TableProps, TableRowAction, TableSort, type TableSortProps, Tabs, type TabsProps, TagInput, type TagInputProps, type TeamMember, TerminalLog, type TerminalLogLevel, type TerminalLogLine, type TerminalLogProps, Textarea, type TextareaProps, type ThemeMode, ThemeSwitch, type ThemeSwitchProps, type ThreadMenuItem, type ThreadParticipant, TimeInput, type TimeInputProps, Timeline, type TimelineEntry, type TimelineProps, Titlebar, TitlebarBody, TitlebarButton, type TitlebarButtonProps, type TitlebarProps, TitlebarWindow, Toast, ToastContainer, type ToastOptions, type ToastProps, ToastProvider, type ToastProviderProps, type ToastVariant, ToggleField, type ToggleFieldProps, Tooltip, type TooltipProps, TopProgress, type TopProgressProps, type TopProgressTone, Tree, type TreeItem, type TreeProps, UpgradeBanner, type UpgradeBannerProps, type UpgradeBannerUsage, User, type UserProps, VersionBanner, type VersionBannerProps, Watermark, type WatermarkProps, type WatermarkTone, type WatermarkVariant, type WizardStep, attachmentMeta, attrs, buttonClass, callAll, chartLinePath, closeMenuOf, cx, defaultPasswordRules, formatDecimal, formatPhoneNational, formatTime24h, greetingTimeOfDay, handleMenuKeyDown, menuItems, mod, niceMax, parseDecimal, progressLevel, useControllable, useDialog, useDialogContext, useMenuAutofocus, useMergedRef, useToast };
+export { Accordion, AccordionAccent, AccordionAccentMeta, type AccordionAccentPreset, type AccordionAccentProps, type AccordionAccentTone, AccordionItem, type AccordionItemProps, AffixInput, type AffixInputProps, type AffixInputVariant, Alert, AlertDialog, type AlertDialogProps, type AlertDialogType, type AlertProps, type AlertVariant, AlphaTabs, type AlphaTabsProps, type AppHeaderNavItem, Attachment, type AttachmentFile, AttachmentImage, type AttachmentImageProps, AttachmentList, type AttachmentListProps, type AttachmentProps, AttachmentThumb, type AttachmentThumbProps, type AttachmentType, Avatar, AvatarGroup, AvatarPicker, type AvatarPickerProps, type AvatarProps, type AvatarSize, BackLink, Badge, type BadgeProps, type BadgeVariant, Barcode, BarcodeInput, type BarcodeInputProps, type BarcodeProps, BlockAboutTimeline, type BlockAboutTimelineProps, BlockAppHeader, type BlockAppHeaderProps, BlockAppShell, type BlockAppShellProps, BlockAuth, type BlockAuthProps, BlockAuthSplit, type BlockAuthSplitProps, BlockContactGrid, type BlockContactGridProps, BlockCta, type BlockCtaProps, BlockDataTable, type BlockDataTableProps, BlockDataTableSpacer, BlockFaq, type BlockFaqProps, BlockFeatures, type BlockFeaturesProps, BlockFooter, type BlockFooterProps, BlockFormPage, BlockFormPageGrid, type BlockFormPageProps, BlockHero, BlockHeroCode, type BlockHeroCodeProps, BlockHeroOrbit, type BlockHeroOrbitProps, type BlockHeroProps, BlockHeroSplit, type BlockHeroSplitProps, BlockModuleHeader, type BlockModuleHeaderProps, BlockPageHero, type BlockPageHeroProps, BlockPortfolioGrid, type BlockPortfolioGridProps, BlockPricing, type BlockPricingProps, BlockProcess, type BlockProcessProps, BlockProductGrid, type BlockProductGridProps, BlockProfileHeader, type BlockProfileHeaderProps, BlockShowcase, type BlockShowcaseProps, BlockSiteFooter, type BlockSiteFooterProps, BlockSiteHeader, type BlockSiteHeaderProps, BlockSpotlight, type BlockSpotlightProps, BlockStats, BlockStatsCounter, type BlockStatsCounterProps, type BlockStatsProps, BlockTeamList, type BlockTeamListProps, BlockTwoFactor, type BlockTwoFactorProps, BlockWizardDialog, type BlockWizardDialogProps, Breadcrumb, type BreadcrumbItemData, type BreadcrumbProps, BrowserFrame, type BrowserFrameProps, BusyOverlay, type BusyOverlayProps, Button, ButtonLink, type ButtonLinkProps, type ButtonProps, type ButtonSize, type ButtonVariant, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ChartLine, type ChartLineProps, type ChartLineSeries, ChatComposer, type ChatComposerProps, Checkbox, type CheckboxProps, Checklist, ChecklistItem, type ChecklistItemProps, type ChecklistProps, ChipFilter, type ChipFilterOption, type ChipFilterProps, Collapsible, type CollapsibleProps, ColorField, type ColorFieldProps, ColorSelect, type ColorSelectOption, type ColorSelectProps, Command, type CommandGroupData, type CommandItemData, type CommandProps, ConfirmDialog, type ConfirmDialogProps, type ConsentChoice, type ContactGridCard, type ContactGridLine, type CookieCategory, CookieConsent, type CookieConsentProps, CopyField, type CopyFieldProps, Counter, type CounterProps, type CounterStat, DataTable, type DataTableColumn, type DataTableColumnFilter, DataTableName, type DataTableNameProps, type DataTableProps, type DataTableRow, type DataTableTabs, DateField, type DateFieldProps, DecimalInput, type DecimalInputProps, type DefinitionItem, DefinitionList, type DefinitionListProps, DialogContext, type DialogState, DocViewer, type DocViewerItem, type DocViewerProps, Dropdown, DropdownItem, DropdownLabel, type DropdownProps, DropdownSeparator, Dropzone, type DropzoneProps, type EmojiGroup, EmojiPicker, type EmojiPickerProps, EmptyState, type EmptyStateProps, EntityCard, type EntityCardProps, FactList, type FactListProps, type FactListRow, type FaqItem, type Feature, FieldGroup, FilterCounts, type FilterCountsOption, type FilterCountsProps, FilterPill, FilterPills, FlipCard, type FlipCardProps, type FooterColumn, type FooterLink, FormField, type FormFieldProps, FormSection, type FormSectionProps, Gallery, type GalleryImage, type GalleryProps, Glass, GlassBar, type GlassBarItem, type GlassBarProps, GlassPanel, type GlassPanelProps, type GlassProps, Greeting, type GreetingProps, type GreetingTimeOfDay, Heading, type HeadingProps, type HeroOrbitMark, type HeroTile, Icon, type IconProps, ImageZoom, type ImageZoomProps, Input, InputGroup, type InputGroupProps, type InputProps, LanguageSelect, type LanguageSelectOption, type LanguageSelectProps, LauncherCard, type LauncherCardProps, LazyImage, type LazyImageProps, Lightbox, type LightboxImage, type LightboxProps, LinkArrow, type LinkArrowDirection, type LinkArrowProps, LinkRow, type LinkRowLink, type LinkRowProps, ListToolbar, type ListToolbarProps, type ListToolbarView, LiveFrame, type LiveFrameProps, Marquee, type MarqueeProps, MediaCard, type MediaCardProps, MediaRow, MediaRowList, type MediaRowListProps, type MediaRowProps, MediaThumb, type MediaThumbProps, Message, type MessageAction, type MessageAttachment, MessageAttachments, type MessageData, MessageDivider, type MessageDividerProps, MessageList, type MessageListItem, type MessageListProps, type MessageProps, MessageThread, type MessageThreadProps, MeterRow, type MeterRowProps, Modal, ModalClose, type ModalProps, type ModalSize, NameCard, type NameCardProps, Navmenu, NavmenuDropdown, type NavmenuDropdownProps, NavmenuItem, NavmenuLink, type NavmenuLinkProps, type NavmenuProps, NextTeaser, type NextTeaserProps, NumberInput, type NumberInputProps, OtpInput, type OtpInputProps, PageHeader, type PageHeaderProps, Pagination, type PaginationProps, PasswordInput, type PasswordInputProps, PasswordRequirements, type PasswordRequirementsProps, type PasswordRule, type PhoneCountry, PhoneInput, type PhoneInputProps, Popover, type PopoverProps, type PortfolioGridProject, Price, PriceCard, type PriceCardFeature, type PriceCardPrice, type PriceCardProps, type PriceProps, type PricingPlan, type ProcessStep, type Product, ProductMark, type ProductMarkAccent, type ProductMarkProps, type ProductMarkSize, type ProfileHeaderTab, Progress, type ProgressProps, ProjectCard, type ProjectCardProps, Prose, ProseLead, type ProseProps, Quantity, type QuantityProps, Rating, RatingInput, type RatingInputProps, type RatingProps, RecoveryCodes, type RecoveryCodesProps, Ribbon, type RibbonCorner, type RibbonProps, Segmented, type SegmentedOption, type SegmentedProps, Select, type SelectOption, type SelectProps, SeverityCard, type SeverityCardProps, type SeverityLevel, Sheet, type SheetProps, type SheetSide, type ShowcaseProject, Sidebar, SidebarCollapsible, type SidebarCollapsibleProps, SidebarGroup, type SidebarGroupProps, SidebarMenu, SidebarMenuButton, type SidebarMenuButtonProps, SidebarMenuItem, type SidebarProps, SidebarSeparator, type SiteFooterColumn, type SiteHeaderLink, Skeleton, type SkeletonProps, SortableRow, type SortableRowProps, type SpecGroup, SpecList, type SpecListProps, type SpotlightModule, StackCard, type StackCardProps, StackList, type StackListItem, type StackListProps, type Stat, StatCard, StatCardGrid, type StatCardProps, Status, StatusDot, type StatusDotProps, type StatusProps, type StatusTone, Stepper, type StepperProps, type StepperStep, Stock, type StockProps, Switch, type SwitchProps, type TabItem, Table, TableActionIcon, type TableActionTone, TableActions, TableActionsMenu, type TableActionsMenuProps, TableCompact, type TableCompactColumn, type TableCompactProps, TableEmpty, type TableProps, TableRowAction, TableSort, type TableSortProps, Tabs, type TabsProps, TagInput, type TagInputProps, type TeamMember, TerminalLog, type TerminalLogLevel, type TerminalLogLine, type TerminalLogProps, Textarea, type TextareaProps, type ThemeMode, ThemeSwitch, type ThemeSwitchProps, type ThreadMenuItem, type ThreadParticipant, TimeInput, type TimeInputProps, Timeline, type TimelineEntry, type TimelineProps, Titlebar, TitlebarBody, TitlebarButton, type TitlebarButtonProps, type TitlebarProps, TitlebarWindow, Toast, ToastContainer, type ToastOptions, type ToastProps, ToastProvider, type ToastProviderProps, type ToastVariant, ToggleField, type ToggleFieldProps, Tooltip, type TooltipProps, TopProgress, type TopProgressProps, type TopProgressTone, Tree, type TreeItem, type TreeProps, UpgradeBanner, type UpgradeBannerProps, type UpgradeBannerUsage, User, type UserProps, VersionBanner, type VersionBannerProps, Watermark, type WatermarkProps, type WatermarkTone, type WatermarkVariant, type WizardStep, attachmentMeta, attrs, buttonClass, callAll, chartLinePath, closeMenuOf, cx, defaultPasswordRules, formatDecimal, formatPhoneNational, formatPrice, formatTime24h, greetingTimeOfDay, handleMenuKeyDown, menuItems, mod, niceMax, parseDecimal, progressLevel, useControllable, useDialog, useDialogContext, useMenuAutofocus, useMergedRef, useToast };