@scattered-light/loomiere-base-ui 0.6.0 → 0.7.0

package/dist/index-ChJXlxzq.d.ts

@@ -0,0 +1,809 @@
+import * as React from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as _base_ui_react from '@base-ui/react';
+import { NumberFieldRoot } from '@base-ui/react/number-field';
+
+type NumberFieldLabelProps = Omit<React.ComponentProps<'label'>, 'htmlFor'> & {
+    htmlFor: string;
+};
+/** The field label. Number field has no label part; this is the same text as {@link Field.Label}. */
+declare function NumberFieldLabel({ className, htmlFor, ...props }: NumberFieldLabelProps): react_jsx_runtime.JSX.Element;
+/**
+ * Base UI [Number Field](https://base-ui.com/react/components/number-field) with design-system classes.
+ * The input is Input, and the label is Field's label. Only the steppers are drawn here.
+ */
+declare const NumberField: {
+    Root: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_react.NumberFieldRootProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Group: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_react.NumberFieldGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Input: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_react.NumberFieldInputProps, "ref"> & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
+    Increment: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_react.NumberFieldIncrementProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+    Decrement: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_react.NumberFieldDecrementProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+    ScrubArea: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_react.NumberFieldScrubAreaProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+    ScrubAreaCursor: React.ForwardRefExoticComponent<Omit<_base_ui_react.NumberFieldScrubAreaCursorProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+    Label: typeof NumberFieldLabel;
+};
+
+type BadgeProps = React.ComponentProps<'span'> & {
+    /** How loud the badge is. The brand's roles decide what each level looks like. Default is subtle. */
+    emphasis?: 'bold' | 'standard' | 'subtle' | 'quiet';
+    /** Paint the level in a status palette (info, success, warning, error). */
+    status?: 'info' | 'success' | 'warning' | 'error';
+    /** Paint the level in another palette instead of the level's own color (e.g. "secondary", "error"). */
+    palette?: string;
+    /** Type tier. Default is condense. */
+    size?: 'minimize' | 'condense' | 'base';
+    /** A leading dot in the label color. */
+    dot?: boolean;
+};
+/**
+ * A status or count label. Not a Base UI part and not interactive, so this is a span
+ * and does not take Base UI's `render` prop. Wrap it when it needs to be another element.
+ * A number on its own needs an accessible name: `aria-label` (for example "3 unread") or visually hidden text.
+ */
+declare const Badge: React.ForwardRefExoticComponent<Omit<BadgeProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+
+/** Past this many codes, the picker is a combobox so people can type a code or a name. */
+declare const CURRENCY_SEARCH_THRESHOLD = 12;
+/**
+ * The affix when there are two or more currencies. Shows the code, not the symbol:
+ * `$` is shared by USD, CAD, AUD, MXN and others. A start-side picker is before the
+ * input in tab order; an end-side picker is after it, because that is the visual order.
+ */
+declare function CurrencySelect(): react_jsx_runtime.JSX.Element;
+
+/**
+ * Money amounts as integers in minor units (cents, yen, fils).
+ *
+ * Integers avoid `0.1 + 0.2`, match what payment APIs send, and compare safely.
+ * Conversion goes through a fixed-point string and rounds half away from zero
+ * (the same halfExpand rule `Intl` uses). Never `Math.round(major * 100)`:
+ * `1.005 * 100` is `100.49999…`.
+ *
+ * Values must stay inside `Number.MAX_SAFE_INTEGER` minor units. The field's default
+ * maximum is lower: `MAX_MINOR_UNITS` (`10^15 - 1`). A major amount with more than
+ * 15 significant digits is not exact as a float, and Number field counts in floats.
+ */
+type CurrencyCode = string;
+type MoneyDisplay = 'narrowSymbol' | 'symbol' | 'code' | 'none';
+/**
+ * Largest minor-unit integer whose major form has at most 15 significant digits,
+ * for every currency. `Number.MAX_SAFE_INTEGER` is about 9e15 (16 digits) and is
+ * not exact once it is divided into dollars and cents.
+ */
+declare const MAX_MINOR_UNITS: number;
+/**
+ * Well-formed ISO 4217 code that `Intl` knows.
+ * `supportedValuesOf('currency')` is the list where it exists. Some engines omit a real
+ * code from that list and still format it (CLF is 4 digits). Those still count. A code
+ * the engine does not know falls back to the code itself and 2 digits, and does not.
+ */
+declare function isValidCurrency(code: string): boolean;
+/**
+ * Fraction digits for a currency. `override` is for prices `Intl` gets wrong for the
+ * business (whole dollars, fuel, cash versus accounting). Cached per code.
+ */
+declare function getCurrencyDigits(currency: CurrencyCode, override?: number): number;
+/** Round a non-negative decimal string to `digits` places, half away from zero. */
+declare function roundHalfExpand(unsigned: string, digits: number): string;
+/** Major units (12.5) to minor units (1250). */
+declare function toMinorUnits(major: number, currency: CurrencyCode, override?: number): number;
+/** Minor units to an exact major-unit decimal string (`"1234.50"`). */
+declare function toDecimalString(minor: number, currency: CurrencyCode, override?: number): string;
+/** Exact decimal string (`"1234.50"` or `"1234.5"`) to minor units. */
+declare function parseDecimalString(decimal: string, currency: CurrencyCode, override?: number): number;
+/** Minor units to major units for `NumberField`, which counts in major units. */
+declare function fromMinorUnits(minor: number, currency: CurrencyCode, override?: number): number;
+/** Show an amount the same way the field does, for tables and summaries. */
+declare function formatMoney(minor: number, currency: CurrencyCode, options?: {
+    locale?: string;
+    display?: MoneyDisplay;
+    fractionDigits?: number;
+}): string;
+/** Which side of the number the currency sits on, from the locale rather than a prop. */
+declare function affixSide(locale: string, currency: CurrencyCode): 'start' | 'end';
+/** The affix text: `$`, `US$`, `USD`, or nothing. */
+declare function currencySymbol(locale: string, currency: CurrencyCode, display: MoneyDisplay): string;
+/** Spoken currency name ("US dollar"), for the accessible description. */
+declare function currencyName(locale: string, currency: CurrencyCode): string;
+interface NormalizedPaste {
+    /** Text to hand to the number parser. `null` means the paste is not an amount (`1e5`, or a negative when negatives are off). */
+    text: string | null;
+    /** A different currency the picker includes and the paste names. Otherwise `null` (don't guess). */
+    currency: CurrencyCode | null;
+}
+/**
+ * Strip currency symbols, ISO codes, and spaces that are not the locale's group separator
+ * so the number field can parse `$1,234.56`, `USD 1234.56`, and `1 234,56 €`.
+ * `(12.00)` is negative only when negatives are allowed. Otherwise the paste is rejected,
+ * so a refund is not quietly stored as a charge.
+ * A run of letters sitting against a currency mark (`R$`, `CA$`) is stripped. The
+ * field's own symbols and ISO codes are stripped too.
+ */
+declare function normalizePaste(raw: string, locale: string, currency: CurrencyCode, options?: {
+    allowNegative?: boolean;
+    currencies?: CurrencyCode[];
+}): NormalizedPaste;
+/** True when extra typed fraction digits would change the amount once rounded. */
+declare function roundingChangesValue(raw: string, locale: string, digits: number): boolean;
+
+type NumberFieldRootProps = React.ComponentProps<typeof NumberField.Root>;
+interface MoneyFieldSteps {
+    /** Arrow keys and the stepper buttons, in minor units. Default: one major unit. */
+    step?: number;
+    /** Alt+Arrow, in minor units. Default: one minor unit. */
+    small?: number;
+    /** Shift+Arrow, in minor units. Default: 100 major units. */
+    large?: number;
+}
+interface MoneyChangeDetails {
+    currency: CurrencyCode;
+    /** The same amount as an exact major-unit decimal (`"1234.50"`), or null when the field is empty. */
+    decimal: string | null;
+    reason: NumberFieldRoot.ChangeEventReason;
+}
+interface MoneyFieldRootProps extends Omit<NumberFieldRootProps, 'value' | 'defaultValue' | 'onValueChange' | 'onValueCommitted' | 'format' | 'min' | 'max' | 'step' | 'smallStep' | 'largeStep' | 'name'> {
+    /** Minor units: cents for USD, yen for JPY, fils for KWD. Empty is `null`, not `0`. */
+    value?: number | null;
+    defaultValue?: number | null;
+    onValueChange?: (value: number | null, details: MoneyChangeDetails) => void;
+    onValueCommitted?: (value: number | null, details: {
+        currency: CurrencyCode;
+        decimal: string | null;
+    }) => void;
+    /** Fixed or controlled currency. Required unless `currencies` is set. */
+    currency?: CurrencyCode;
+    defaultCurrency?: CurrencyCode;
+    /** Two or more codes show the picker. The first is the default when `currency` is omitted. */
+    currencies?: CurrencyCode[];
+    onCurrencyChange?: (currency: CurrencyCode) => void;
+    /** Document language by default. Decides separators, numerals, and which side the symbol sits on. */
+    locale?: string;
+    /** Override the currency's fraction digits (whole dollars, fuel prices, cash versus accounting). */
+    fractionDigits?: number;
+    /** `always` keeps `12.00`. `auto` drops decimals on a whole amount, for a price tag like `$1,200`. */
+    trailingZeros?: 'always' | 'auto';
+    /** Off by default, which also sets the default minimum to 0. On for refunds and balances. */
+    allowNegative?: boolean;
+    /** Minor units, same as `value`. */
+    min?: number;
+    /**
+     * Minor units. The default is `MAX_MINOR_UNITS` (`10^15 - 1`): the largest minor
+     * value whose major form has at most 15 significant digits. Past that, Number
+     * field's float is not exact.
+     */
+    max?: number;
+    steps?: MoneyFieldSteps;
+    /** Stepper buttons. Off by default; arrow keys still step. */
+    steppers?: boolean;
+    symbolDisplay?: MoneyDisplay;
+    /** `end` lines the amount up with other amounts, in a ledger or a table. */
+    align?: 'start' | 'end';
+    /**
+     * Submits the major-unit decimal string (`"1234.50"`). `minor` submits the integer instead.
+     * This name is not passed to Number field. A parent `Field.Root` name still names Number
+     * field's hidden input, because that input is the field's control.
+     */
+    name?: string;
+    submitAs?: 'decimal' | 'minor';
+    /** Submits the currency code when the picker is showing. */
+    currencyName?: string;
+    /** Accessible name of the picker. Default "Currency". */
+    currencyLabel?: string;
+    /** `true` always filters. `auto` (default) filters once there are more than 12 codes. `false` never does. */
+    searchable?: boolean | 'auto';
+    size?: 'xs' | 'sm' | 'md' | 'lg';
+    placeholder?: string;
+}
+/**
+ * Holds the money: currency, fraction digits, and the minor-unit value.
+ * Everything else is passed through to NumberField, so a new Number Field prop works here too.
+ */
+declare const MoneyFieldRoot: React.ForwardRefExoticComponent<Omit<MoneyFieldRootProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const MoneyFieldGroup: React.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.NumberFieldGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const MoneyFieldInput: React.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.NumberFieldInputProps, "ref"> & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
+/** The currency symbol, or the picker. Clicking a fixed symbol focuses the amount. */
+declare const MoneyFieldAffix: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+type MoneyFieldProps = MoneyFieldRootProps;
+/**
+ * An amount of money, in one currency or a currency the person picks.
+ * Put it in Field for the label, description, and error, the same way as NumberField.
+ * The value is an integer in minor units.
+ */
+declare const MoneyField: React.ForwardRefExoticComponent<Omit<MoneyFieldRootProps, "ref"> & React.RefAttributes<HTMLDivElement>> & {
+    Root: React.ForwardRefExoticComponent<Omit<MoneyFieldRootProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Group: React.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.NumberFieldGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Input: React.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.NumberFieldInputProps, "ref"> & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
+    Affix: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+    CurrencySelect: typeof CurrencySelect;
+    Increment: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_react.NumberFieldIncrementProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+    Decrement: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_react.NumberFieldDecrementProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+    Error: React.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.FieldErrorProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+};
+
+/**
+ * Calendar dates as ISO strings (`YYYY-MM-DD`), never `Date` objects.
+ *
+ * A `Date` at local midnight becomes the day before when something reads it in UTC,
+ * and adding 24 hours skips or repeats a day when daylight saving changes. Every
+ * calculation here uses UTC date parts, so the calendar day stays put in
+ * `America/New_York` and `Australia/Sydney`. "Today" is the only local read:
+ * the year, month and day of the clock the user is on, then stored as an ISO date.
+ */
+type DateValue = string;
+type DateRange = {
+    start: DateValue | null;
+    end: DateValue | null;
+};
+type PresetValue = DateValue | DateRange;
+type Preset = {
+    id: string;
+    label: string;
+    hint?: string;
+    /** A fixed value, or a function of today's ISO date. Week-based presets close over `weekStartsOn`. */
+    value: PresetValue | ((today: DateValue) => PresetValue);
+};
+declare function parseDate(value: string): {
+    y: number;
+    m: number;
+    d: number;
+} | null;
+/** Days in a month. February respects leap years (2028 has 29). */
+declare function daysInMonth(year: number, month: number): number;
+/**
+ * The user's local calendar day, as an ISO date.
+ * This is the one read that uses the clock's time zone. Everything else stays on UTC date parts.
+ */
+declare function todayDate(now?: Date): DateValue;
+declare function addDays(value: DateValue, days: number): DateValue;
+/** Moves by calendar months and clamps the day (Jan 31 + 1 month is Feb 28, or Feb 29 in a leap year). */
+declare function addMonths(value: DateValue, months: number): DateValue;
+/** `weekStartsOn` is 0 (Sunday) through 6 (Saturday), matching `Date#getDay`. */
+declare function startOfWeek(value: DateValue, weekStartsOn: number): DateValue;
+declare function endOfWeek(value: DateValue, weekStartsOn: number): DateValue;
+/**
+ * ISO week number. Week 1 is the week that contains the year's first Thursday,
+ * so late December can be week 1 of the next year and early January week 52 or 53.
+ */
+declare function isoWeek(value: DateValue): number;
+declare function clampDate(value: DateValue, min?: DateValue | null, max?: DateValue | null): DateValue;
+/** Inclusive length: the same day is 1, Oct 1 through Oct 24 is 24. */
+declare function inclusiveDays(start: DateValue, end: DateValue): number;
+declare function orderRange(a: DateValue, b: DateValue): {
+    start: DateValue;
+    end: DateValue;
+};
+/**
+ * Why `day` cannot end a range that started on `start`, or null when it can.
+ * Length is inclusive. The wording is the day's accessible description.
+ */
+declare function lengthBlockReason(start: DateValue, day: DateValue, minLength?: number, maxLength?: number): string | null;
+/**
+ * First day of the week for a locale. `Intl.Locale#getWeekInfo` uses 1 (Monday)
+ * through 7 (Sunday); we store Sunday as 0. Without that API, Monday, except the
+ * Sunday-first regions above.
+ */
+declare function defaultWeekStartsOn(locale: string): number;
+type GridCell = {
+    date: DateValue;
+    outside: boolean;
+};
+/** Six weeks, starting on `weekStartsOn`, so the grid doesn't jump when the month changes. */
+declare function monthCells(month: DateValue, weekStartsOn: number): GridCell[];
+declare function formatDay(value: DateValue, locale: string): string;
+declare function formatFull(value: DateValue, locale: string): string;
+/** One date: today. Mix with other presets: `[today, last7Days]`. */
+declare const today: Preset;
+declare const yesterday: Preset;
+declare const tomorrow: Preset;
+/** Week presets take the week's first day (0 Sunday … 6 Saturday). Default is Monday. */
+declare function thisWeek(weekStartsOn?: number): Preset;
+declare function lastWeek(weekStartsOn?: number): Preset;
+declare function nextWeek(weekStartsOn?: number): Preset;
+declare const last7Days: Preset;
+declare const last30Days: Preset;
+declare const thisMonth: Preset;
+declare const lastMonth: Preset;
+declare const nextMonth: Preset;
+declare const thisQuarter: Preset;
+declare const yearToDate: Preset;
+/** The built-in quick selections, in order. Week presets use `weekStartsOn`. */
+declare function builtinPresets(weekStartsOn: number): Preset[];
+declare function defaultPresets(mode: 'single' | 'range', weekStartsOn: number): Preset[];
+declare function resolvePreset(preset: Preset, todayValue: DateValue): PresetValue;
+/** A one-day range and the same ISO date count as the same selection. */
+declare function sameSelection(a: PresetValue | null, b: PresetValue | null): boolean;
+declare function presetInBounds(value: PresetValue, min?: DateValue | null, max?: DateValue | null, isDateDisabled?: (date: DateValue) => boolean): boolean;
+/**
+ * The next focused date for an arrow key on the day grid.
+ * Left and Right swap in RTL. Returns null when the key isn't a grid key.
+ */
+declare function moveFocusDate(date: DateValue, key: string, opts: {
+    weekStartsOn: number;
+    rtl: boolean;
+    shift: boolean;
+}): DateValue | null;
+
+type CalendarMode = 'single' | 'range';
+type CalendarProps = {
+    mode?: CalendarMode;
+    value?: DateValue | null | DateRange;
+    defaultValue?: DateValue | null | DateRange;
+    onValueChange?: (value: DateValue | null | DateRange) => void;
+    /** The first visible month. Any day in the month is accepted. */
+    month?: DateValue;
+    defaultMonth?: DateValue;
+    onMonthChange?: (month: DateValue) => void;
+    /** Months side by side. `auto` is resolved by the picker; Calendar itself wants a number. */
+    months?: 1 | 2 | 3;
+    min?: DateValue;
+    max?: DateValue;
+    isDateDisabled?: (date: DateValue) => boolean;
+    minLength?: number;
+    maxLength?: number;
+    weekStartsOn?: number;
+    locale?: string;
+    showOutsideDays?: boolean;
+    showWeekNumbers?: boolean;
+    /** Move focus into the grid (the popup does this when it opens). */
+    focusSelected?: boolean;
+    /**
+     * Set while the month or year chooser is open, so Escape can return to the days
+     * instead of closing the popup. Cleared on the day view.
+     */
+    chooserBackRef?: React.MutableRefObject<(() => void) | null>;
+    onAnnounce?: (message: string) => void;
+    className?: string;
+};
+/**
+ * The month grid on its own: no popup, no presets. Pages that keep a calendar
+ * open use this. DatePicker composes it.
+ */
+declare const Calendar: React.ForwardRefExoticComponent<CalendarProps & React.RefAttributes<HTMLDivElement>>;
+
+type PopupKind = 'auto' | 'popover' | 'drawer';
+type Shared = {
+    min?: DateValue;
+    max?: DateValue;
+    isDateDisabled?: (date: DateValue) => boolean;
+    minLength?: number;
+    maxLength?: number;
+    /** `false` hides them, `true` uses the default list for the mode, or pass your own. */
+    presets?: boolean | Preset[];
+    /** `auto` is 2 months for a range and 1 for a single date, dropping when the panel is narrow. */
+    months?: 1 | 2 | 3 | 'auto';
+    weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    locale?: string;
+    showOutsideDays?: boolean;
+    showWeekNumbers?: boolean;
+    /** `apply` keeps a draft until Apply. `immediate` writes the value as soon as a day is picked. */
+    commit?: 'apply' | 'immediate';
+    clearable?: boolean;
+    placeholder?: string;
+    name?: string;
+    nameStart?: string;
+    nameEnd?: string;
+    required?: boolean;
+    disabled?: boolean;
+    readOnly?: boolean;
+    formatValue?: (value: DateValue | DateRange | null, locale: string) => string;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    popup?: PopupKind;
+    /** The month to open on when there is no value yet. Any day in the month is accepted. */
+    defaultMonth?: DateValue;
+    /**
+     * Accessible name of the field and the dialog when there is no `Field.Label`.
+     * The value is described, not part of the name.
+     */
+    label?: string;
+    id?: string;
+    className?: string;
+};
+type DatePickerProps = Shared & ({
+    mode?: 'single';
+    value?: DateValue | null;
+    defaultValue?: DateValue | null;
+    onValueChange?: (value: DateValue | null) => void;
+} | {
+    mode: 'range';
+    value?: DateRange;
+    defaultValue?: DateRange;
+    onValueChange?: (value: DateRange) => void;
+});
+/**
+ * A field that opens a calendar. Single date or a period is chosen by the
+ * developer (`mode`); the person using it cannot switch. Not a Base UI part:
+ * the popup is Popover or Drawer, the trigger is styled like a field.
+ *
+ * A range is a start click, then an end click. An end before the start swaps.
+ * Clicking the start again makes a one-day range. Hover or focus previews the
+ * band; that preview is not announced as selected.
+ *
+ * `commit="immediate"` (the default for one date) writes as soon as the day is
+ * picked and closes. For a range it writes `{ start, end: null }` on the first
+ * click and leaves the popup open, then writes the finished range and closes
+ * on the second click. `commit="apply"` (the default for a range) keeps a draft
+ * until Apply or Cancel.
+ *
+ * Escape on a half-picked range clears the start and stays open; a second
+ * Escape closes. Escape in the month or year chooser returns to the days.
+ * Clicking outside, or any other close, throws the draft away and shows the
+ * committed value again. In immediate mode the half range is already committed,
+ * so that close keeps it.
+ *
+ * `readOnly` stays in the tab order and announces the value. It does not open.
+ * Direction is read when the popup opens. A dir change while it is open is not picked up.
+ */
+declare const DatePicker: React.ForwardRefExoticComponent<DatePickerProps & React.RefAttributes<HTMLElement>>;
+
+type DatePresetsProps = {
+    presets: Preset[];
+    /** The committed or draft selection. A matching preset is checked. */
+    value: PresetValue | null;
+    onSelect: (preset: Preset, value: PresetValue) => void;
+    min?: DateValue;
+    max?: DateValue;
+    isDateDisabled?: (date: DateValue) => boolean;
+    locale?: string;
+    /** `row` is the scrolling chip row; `column` is the side list. */
+    layout?: 'column' | 'row';
+    /**
+     * Apply mode checks a preset as the arrows land on it.
+     * Immediate mode only moves focus; Enter, Space, or a click selects, so a range doesn't close on the first arrow.
+     */
+    selectOnNavigate?: boolean;
+    label?: string;
+    className?: string;
+};
+/**
+ * Quick selections. A radio group: arrows move, the current value checks the
+ * preset it equals, and none are checked when the value is custom.
+ */
+declare function DatePresets({ presets, value, onSelect, min, max, isDateDisabled, locale, layout, selectOnNavigate, label, className, }: DatePresetsProps): react_jsx_runtime.JSX.Element;
+
+/** Why the detail closed. Escape is the key; Back is the page-mode button. */
+type ListDetailCloseReason = 'close-button' | 'escape' | 'back';
+type ListDetailLayout = 'split' | 'drawer' | 'page';
+interface ListDetailRootProps extends Omit<React.ComponentProps<'div'>, 'onChange'> {
+    open: boolean;
+    onOpenChange?: (open: boolean, reason: ListDetailCloseReason) => void;
+    /** What the narrow layout is. Wide layouts are always a splitter. */
+    narrow?: 'drawer' | 'page';
+    /** Override the `--sl-list-detail-split-min-width` token. Compared to this element's width, not the window. */
+    splitMinWidth?: number;
+    /** Remember the splitter position. */
+    storageKey?: string;
+    defaultDetailSize?: string;
+    minDetailSize?: string;
+    maxDetailSize?: string;
+    /** Accessible name of the separator. */
+    handleLabel?: string;
+    /** Accessible name of the list, when the list has no heading of its own. */
+    listLabel?: string;
+}
+interface ListDetailDetailProps extends Omit<React.ComponentProps<'section'>, 'title'> {
+    title: React.ReactNode;
+    actions?: React.ReactNode;
+    closeDisabled?: boolean;
+    /** Accessible name of the icon-only Close button. */
+    closeLabel?: string;
+    /** Visible label of the page-mode Back button. */
+    backLabel?: string;
+    /** Defaults to 2. Drawer titles use the same level. */
+    headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;
+}
+interface ListDetailValue {
+    layout: ListDetailLayout;
+    close: () => void;
+}
+declare function useListDetail(): ListDetailValue;
+/**
+ * A list and the detail of the selected item. Wide: a Splitter. Narrow: a Drawer,
+ * or the detail replaces the list. The app owns the selection.
+ *
+ * The list stays in the splitter's first panel the whole time, so opening, closing,
+ * and crossing the width never reparents it and never resets its scroll. The detail
+ * portals into a div this component created with createElement. React does not
+ * reconcile that div, so moving it between the split panel, the drawer, and the
+ * page is safe.
+ */
+declare const ListDetailRoot: React.ForwardRefExoticComponent<Omit<ListDetailRootProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const ListDetailList: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const ListDetailDetail: React.ForwardRefExoticComponent<Omit<ListDetailDetailProps, "ref"> & React.RefAttributes<HTMLElement>>;
+declare const ListDetail: {
+    Root: React.ForwardRefExoticComponent<Omit<ListDetailRootProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    List: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Detail: React.ForwardRefExoticComponent<Omit<ListDetailDetailProps, "ref"> & React.RefAttributes<HTMLElement>>;
+};
+
+/**
+ * Splitter layout math, with no DOM. Sizes are a number (percent of the root) or a
+ * "NNNpx" / "NN%" string. One panel is the filler: the only one without a size, or the
+ * last panel when every panel has one. The filler takes what the others leave.
+ * Px and percent mix. A drag, a key, or a smaller root never pushes a panel past its
+ * min or max. Collapsing remembers the size to restore. A collapse that happened
+ * because the root was too small is marked, and it opens again when the room returns.
+ * A collapse the person chose stays collapsed. Pass the handles' total size to
+ * measure so the panels share what's left after the bars.
+ */
+interface Size {
+    unit: 'px' | 'percent';
+    value: number;
+}
+type SizeInput = number | string;
+interface PanelSpec {
+    id: string;
+    /** Omitted on the filler. A number is a percent of the root. */
+    defaultSize?: SizeInput;
+    minSize?: SizeInput;
+    maxSize?: SizeInput;
+    collapsible?: boolean;
+    /** Defaults to 0. */
+    collapsedSize?: SizeInput;
+    defaultCollapsed?: boolean;
+    /**
+     * Take the collapsed size for this render and hide the panel. Not a choice, and
+     * not stored. List detail uses it while the detail is closed or in a drawer.
+     */
+    suspended?: boolean;
+}
+/** One panel after the defaults are resolved. `size` is the size the person chose. */
+interface RuntimePanel {
+    id: string;
+    fill: boolean;
+    size: Size;
+    defaultSize: Size;
+    min: Size;
+    max: Size | null;
+    collapsible: boolean;
+    collapsedSize: Size;
+    collapsed: boolean;
+    /** The size to put back on Enter. Set when the panel collapses. */
+    restore: Size | null;
+    /**
+     * True when settle collapsed this panel because the root was too small.
+     * Never written to storage. A collapse from Enter or a button leaves it false.
+     */
+    autoCollapsed: boolean;
+    /** See PanelSpec.suspended. */
+    suspended: boolean;
+}
+interface StoredPanel {
+    size: string;
+    collapsed: boolean;
+}
+type StoredLayout = Record<string, StoredPanel>;
+type SplitterKey = 'ArrowLeft' | 'ArrowRight' | 'ArrowUp' | 'ArrowDown' | 'Home' | 'End' | 'Enter';
+interface KeyOptions {
+    orientation: 'horizontal' | 'vertical';
+    shift?: boolean;
+    rtl?: boolean;
+    /** Percent of the root. */
+    step: number;
+    largeStep: number;
+}
+declare function parseSize(input: SizeInput | null | undefined): Size | null;
+declare function serializeSize(size: Size): string;
+/** Build the runtime panels. The filler is the only panel without a size, or the last one. */
+declare function createPanels(specs: PanelSpec[]): RuntimePanel[];
+/**
+ * New min, max, or collapsible props. Keep the size the person chose when it still
+ * fits. A size outside the new range takes the new default. A panel that can no
+ * longer collapse opens.
+ */
+declare function syncPanels(current: RuntimePanel[], specs: PanelSpec[]): RuntimePanel[];
+/**
+ * Pixel width (or height) of each panel. `root` is the splitter's content box.
+ * `handles` is the total size of the bars, which are flex items too: the panels
+ * share what's left, or the filler and the values would be short by that many pixels.
+ */
+declare function measure(panels: RuntimePanel[], root: number, handles?: number): number[];
+/** Collapse panels from the end when even their minimums no longer fit. */
+declare function settle(panels: RuntimePanel[], root: number): RuntimePanel[];
+declare function handleTarget(panels: RuntimePanel[], handleIndex: number): number;
+/**
+ * Move the handle by `deltaPx` toward the end of the axis. The sized neighbor
+ * changes; the filler absorbs it. Stops at min and max on both.
+ */
+declare function resizeByDelta(panels: RuntimePanel[], root: number, handleIndex: number, deltaPx: number): RuntimePanel[];
+declare function toggleCollapsed(panels: RuntimePanel[], handleIndex: number): RuntimePanel[] | null;
+declare function resetToDefault(panels: RuntimePanel[], handleIndex: number): RuntimePanel[];
+/** `null` when the key does not apply, or the panel cannot collapse. */
+declare function applyKey(panels: RuntimePanel[], root: number, handleIndex: number, key: SplitterKey, options: KeyOptions): RuntimePanel[] | null;
+/**
+ * Read a stored layout. Corrupt JSON, a bad size, or a size outside min/max returns
+ * null so the caller keeps the defaults. The filler's entry is ignored.
+ *
+ * `partial: 'reject'` (the controlled `layout` prop) returns null when a panel is
+ * missing, and warns in development. `'ignore'` (a stored layout from an older
+ * panel list) skips an extra or missing id and keeps that panel's default.
+ */
+declare function applyStored(raw: string | null, panels: RuntimePanel[], partial?: 'reject' | 'ignore'): RuntimePanel[] | null;
+declare function layoutOf(panels: RuntimePanel[]): StoredLayout;
+declare function sizeText(panel: RuntimePanel): string;
+/**
+ * The size to paint before the root has been measured (the server, and the first
+ * client paint). Where the size, min, and max share a unit, clamp with CSS so a
+ * declared 240px still respects its min. Mixed units wait for the measured pixels.
+ */
+declare function cssSize(panel: RuntimePanel): string;
+/** Percent of the root, 0–100, for aria-valuenow / min / max. */
+declare function ariaPercents(panel: RuntimePanel, pixels: number, root: number): {
+    now: number;
+    min: number;
+    max: number;
+};
+declare function valueText(panel: RuntimePanel, pixels: number): string;
+
+interface SplitterRootProps extends Omit<React.ComponentProps<'div'>, 'onChange'> {
+    /** `horizontal` puts panels in a row and the handle is a vertical bar. */
+    orientation?: 'horizontal' | 'vertical';
+    /** Remember sizes and collapsed state. Read after mount so the server and client match. */
+    storageKey?: string;
+    /** Controlled sizes. Keys are panel ids. A missing panel warns in development and is ignored. */
+    layout?: StoredLayout;
+    /** Fires when a drag or a key press ends, not while the pointer is moving. */
+    onLayoutChange?: (layout: StoredLayout) => void;
+}
+interface SplitterPanelProps extends React.ComponentProps<'div'> {
+    /**
+     * The panel's key in storage and in `layout`. The DOM id is this, prefixed with
+     * the splitter's useId, so two splitters can both have a panel called `main`.
+     */
+    id: string;
+    /** A number is a percent of the root. `'240px'` and `'30%'` are sizes too. Omit on the filler. */
+    defaultSize?: number | string;
+    minSize?: number | string;
+    maxSize?: number | string;
+    collapsible?: boolean;
+    /** Defaults to 0. A collapsed panel at 0 is `hidden`, so its contents leave the tab order. */
+    collapsedSize?: number | string;
+    defaultCollapsed?: boolean;
+    /** Hide the panel at its collapsed size for this render. Not stored. */
+    suspended?: boolean;
+}
+type SplitterHandleProps = Omit<React.ComponentProps<'div'>, 'aria-label'> & {
+    /** Required: the separator's accessible name, for example "Resize navigation". */
+    'aria-label': string;
+    disabled?: boolean;
+    /** A small grip in the middle of the line. Off unless set. */
+    grip?: boolean;
+    /** Injected by Root from the handle's place between panels. */
+    index?: number;
+};
+declare const SplitterRoot: React.ForwardRefExoticComponent<Omit<SplitterRootProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SplitterPanel: React.ForwardRefExoticComponent<Omit<SplitterPanelProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SplitterHandle: React.ForwardRefExoticComponent<Omit<SplitterHandleProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const Splitter: {
+    Root: React.ForwardRefExoticComponent<Omit<SplitterRootProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Panel: React.ForwardRefExoticComponent<Omit<SplitterPanelProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Handle: React.ForwardRefExoticComponent<Omit<SplitterHandleProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+};
+
+type EmptyStateKind = 'start' | 'no-results' | 'error' | 'done' | 'no-access' | 'unselected';
+type EmptyStateSize = 'compact' | 'standard' | 'spacious';
+type EmptyStateRootProps = React.ComponentProps<'div'> & {
+    kind?: EmptyStateKind;
+    size?: EmptyStateSize;
+    /** true announces; false stays silent; omitted uses the kind's default. */
+    announce?: boolean;
+};
+type EmptyStateMediaProps = React.ComponentProps<'div'> & {
+    /** Overrides the root kind. error and done tint the circle. Other kinds stay neutral. */
+    kind?: EmptyStateKind;
+    /** An illustration the app owns. Not tinted. */
+    custom?: boolean;
+};
+type EmptyStateTitleProps = React.ComponentProps<'h2'> & {
+    /** Overrides the root size. Compact is a paragraph unless headingLevel is set. */
+    size?: EmptyStateSize;
+    /** 2–6. Compact is a paragraph unless this is set. */
+    headingLevel?: 2 | 3 | 4 | 5 | 6;
+};
+type EmptyStateProps = Omit<React.ComponentProps<'div'>, 'title'> & {
+    /** What is empty. Required. */
+    title: React.ReactNode;
+    kind?: EmptyStateKind;
+    size?: EmptyStateSize;
+    /**
+     * A Material Symbols name, or a node. Omit it for the kind's icon.
+     * null hides the media.
+     */
+    icon?: React.ReactNode;
+    /** Replaces the media slot. Not tinted. An image or illustration the app owns. */
+    media?: React.ReactNode;
+    description?: React.ReactNode;
+    /** First action is the main one. The app picks each button's emphasis. */
+    actions?: React.ReactNode;
+    headingLevel?: EmptyStateTitleProps['headingLevel'];
+    announce?: boolean;
+};
+/**
+ * The block a screen, pane, table, list or popup shows when it has nothing to show.
+ * One component for every situation: the kind picks the icon, the media tone and whether
+ * it is announced. The app writes the copy and decides when to show it.
+ */
+declare const EmptyState: React.ForwardRefExoticComponent<Omit<EmptyStateProps, "ref"> & React.RefAttributes<HTMLDivElement>> & {
+    Root: React.ForwardRefExoticComponent<Omit<EmptyStateRootProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Media: React.ForwardRefExoticComponent<Omit<EmptyStateMediaProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Title: React.ForwardRefExoticComponent<Omit<EmptyStateTitleProps, "ref"> & React.RefAttributes<HTMLElement>>;
+    Description: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+    Actions: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+};
+
+interface EditableListApi<T> {
+    update: (patch: Partial<T>) => void;
+    remove: () => void;
+    index: number;
+}
+interface EditableListRootProps<T> {
+    value?: T[];
+    defaultValue?: T[];
+    onValueChange?: (value: T[]) => void;
+    getRowId: (row: T) => string;
+    createRow: () => T;
+    minRows?: number;
+    maxRows?: number;
+    label: string;
+    /** Singular name for a row: "Allocation". Used in remove labels and the stacked title. */
+    itemLabel?: string;
+    /** When set, each primitive field also submits as name[index].field. Do not combine this with fields the app names itself. */
+    name?: string;
+    /** Which keys submit. By default, id and non-primitives are skipped. */
+    fields?: (keyof T)[];
+    locale?: string;
+    rowError?: (row: T) => string | null;
+    children: React.ReactNode;
+    className?: string;
+}
+/**
+ * Repeating form rows. Move up, Move down, To top and To bottom are not here yet:
+ * nothing in Dryden is user-ordered. Those buttons would sit in the row, before any drag handle.
+ */
+declare function EditableListRoot<T extends object>({ value, defaultValue, onValueChange, getRowId, createRow, minRows, maxRows, label, itemLabel, name, fields, locale, rowError, children, className, }: EditableListRootProps<T>): react_jsx_runtime.JSX.Element;
+declare function EditableListHeader({ columns }: {
+    columns: string[];
+}): react_jsx_runtime.JSX.Element;
+declare function EditableListRows<T>({ children }: {
+    children: (row: T, index: number, api: EditableListApi<T>) => React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function EditableListRow({ children }: {
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+/** The id and aria-labelledby for the field in this cell. Put them on the input. A Select or MoneyField takes the same id on its own input. */
+declare function useEditableListField(column: string): {
+    id: string;
+    'aria-labelledby': string;
+};
+declare function EditableListCell({ column, align, children }: {
+    column: string;
+    align?: 'end';
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function EditableListRemoveButton(): react_jsx_runtime.JSX.Element;
+declare function EditableListAddButton({ children }: {
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function EditableListError({ children }: {
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function EditableListBalance<T extends object>({ control, currency, sum }: {
+    control: number | string;
+    currency: string;
+    sum: (rows: T[]) => Array<number | string | null | undefined>;
+}): react_jsx_runtime.JSX.Element;
+declare const EditableList: {
+    useField: typeof useEditableListField;
+    Root: typeof EditableListRoot;
+    Header: typeof EditableListHeader;
+    Rows: typeof EditableListRows;
+    Row: typeof EditableListRow;
+    Cell: typeof EditableListCell;
+    RemoveButton: typeof EditableListRemoveButton;
+    AddButton: typeof EditableListAddButton;
+    Error: typeof EditableListError;
+    Balance: typeof EditableListBalance;
+};
+
+export { nextMonth as $, addMonths as A, Badge as B, Calendar as C, DatePicker as D, EditableList as E, builtinPresets as F, clampDate as G, daysInMonth as H, defaultPresets as I, defaultWeekStartsOn as J, endOfWeek as K, ListDetail as L, MoneyField as M, NumberField as N, formatMoney as O, type Preset as P, fromMinorUnits as Q, getCurrencyDigits as R, Splitter as S, inclusiveDays as T, isValidCurrency as U, isoWeek as V, last30Days as W, last7Days as X, lastMonth as Y, lastWeek as Z, lengthBlockReason as _, type BadgeProps as a, roundingChangesValue as a$, nextWeek as a0, orderRange as a1, parseDecimalString as a2, resolvePreset as a3, startOfWeek as a4, thisMonth as a5, thisQuarter as a6, thisWeek as a7, toDecimalString as a8, toMinorUnits as a9, type SplitterKey as aA, SplitterPanel as aB, SplitterRoot as aC, type StoredLayout as aD, type StoredPanel as aE, affixSide as aF, applyKey as aG, applyStored as aH, ariaPercents as aI, createPanels as aJ, cssSize as aK, currencyName as aL, currencySymbol as aM, formatDay as aN, formatFull as aO, handleTarget as aP, layoutOf as aQ, measure as aR, monthCells as aS, moveFocusDate as aT, normalizePaste as aU, parseDate as aV, parseSize as aW, presetInBounds as aX, resetToDefault as aY, resizeByDelta as aZ, roundHalfExpand as a_, today as aa, todayDate as ab, tomorrow as ac, useListDetail as ad, yearToDate as ae, yesterday as af, CURRENCY_SEARCH_THRESHOLD as ag, CurrencySelect as ah, type KeyOptions as ai, ListDetailDetail as aj, ListDetailList as ak, ListDetailRoot as al, MAX_MINOR_UNITS as am, type MoneyChangeDetails as an, type MoneyDisplay as ao, MoneyFieldAffix as ap, MoneyFieldGroup as aq, MoneyFieldInput as ar, MoneyFieldRoot as as, type MoneyFieldSteps as at, type NormalizedPaste as au, type PanelSpec as av, type RuntimePanel as aw, type Size as ax, type SizeInput as ay, SplitterHandle as az, type CalendarProps as b, sameSelection as b0, serializeSize as b1, settle as b2, sizeText as b3, syncPanels as b4, toggleCollapsed as b5, valueText as b6, type CurrencyCode as c, type DatePickerProps as d, DatePresets as e, type DatePresetsProps as f, type DateRange as g, type DateValue as h, type EditableListApi as i, type EditableListRootProps as j, EmptyState as k, type EmptyStateKind as l, type EmptyStateProps as m, type ListDetailCloseReason as n, type ListDetailDetailProps as o, type ListDetailLayout as p, type ListDetailRootProps as q, type ListDetailValue as r, type MoneyFieldProps as s, type MoneyFieldRootProps as t, type NumberFieldLabelProps as u, type PresetValue as v, type SplitterHandleProps as w, type SplitterPanelProps as x, type SplitterRootProps as y, addDays as z };