@leabankab/component-library 5.6.1

package/dist/components/dev-panel/dev-panel.d.ts

@@ -0,0 +1,61 @@
+import { SxProps, Theme } from '@mui/material';
+import { ReactNode } from 'react';
+/** Reads the enclosing `DevPanelSection` heading id, if any. */
+export declare function useDevPanelSectionLabelId(): string | undefined;
+export type DevPanelProps = {
+    /** Panel title shown in the header. Defaults to `"Dev controls"`. */
+    title?: ReactNode;
+    /** Optional pill beside the title, e.g. `"MOCK"` or `"live"`. */
+    badge?: ReactNode;
+    /** Show the small status dot before the title. Defaults to `true`. */
+    showStatusDot?: boolean;
+    /** Render the minimise control. Defaults to `true`. */
+    minimisable?: boolean;
+    /** Controlled minimised state. Omit for uncontrolled. */
+    minimised?: boolean;
+    /** Initial minimised state when uncontrolled. Defaults to `false`. */
+    defaultMinimised?: boolean;
+    /** Called whenever the minimised state changes. */
+    onMinimisedChange?: (minimised: boolean) => void;
+    /** Accessible name for the minimise button. Defaults to a translated label. */
+    minimiseLabel?: string;
+    /** Accessible name for the restore button. Defaults to a translated label. */
+    expandLabel?: string;
+    /** Section content: compose the `DevPanel*` sub-components here. */
+    children?: ReactNode;
+    sx?: SxProps<Theme>;
+};
+/**
+ * The root of the reusable dev panel: a self-contained, content-only card that
+ * form apps compose from the `DevPanel*` sub-components. It owns the chrome
+ * (title, optional badge, minimise control) and layout; every section is fully
+ * controlled by the consumer via `value` + `onChange`/callback props.
+ *
+ * It renders only the panel — placement (fixed corner, drawer, …) is left to the
+ * consuming app.
+ *
+ * ```tsx
+ * <DevPanel badge="MOCK">
+ *   <DevPanelCountry value={country} onChange={setCountry} options={countries} />
+ *   <DevPanelStatus value={status} onChange={setStatus} options={statuses} />
+ *   <DevPanelPayload value={payload} />
+ *   <DevPanelFooter onReseed={reseed} onCopyUrl={() => {}} url={url} />
+ * </DevPanel>
+ * ```
+ */
+export declare function DevPanel({ title, badge, showStatusDot, minimisable, minimised, defaultMinimised, onMinimisedChange, minimiseLabel, expandLabel, children, sx, }: DevPanelProps): import("react").JSX.Element;
+export type DevPanelSectionProps = {
+    /** The uppercase section heading (e.g. `"Country"`). */
+    label: ReactNode;
+    /** Optional trailing meta shown on the heading row (e.g. a `6 / 10` count). */
+    meta?: ReactNode;
+    children?: ReactNode;
+    sx?: SxProps<Theme>;
+};
+/**
+ * A labelled section wrapper. Renders the uppercase heading and exposes its
+ * generated id through context so a nested interactive group can reference it
+ * via `aria-labelledby`. Used internally by every `DevPanel*` section; exported
+ * so consumers can build bespoke sections with the same look and wiring.
+ */
+export declare function DevPanelSection({ label, meta, children, sx, }: DevPanelSectionProps): import("react").JSX.Element;

package/dist/components/dev-panel/index.d.ts

@@ -0,0 +1,9 @@
+export * from './dev-panel';
+export * from './dev-panel-country';
+export * from './dev-panel-variant';
+export * from './dev-panel-step-state';
+export * from './dev-panel-steps';
+export * from './dev-panel-status';
+export * from './dev-panel-flow';
+export * from './dev-panel-payload';
+export * from './dev-panel-footer';

package/dist/components/dev-panel/json-highlight.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Returns `true` when `value` should be syntax-highlighted as JSON: any non-null
+ * non-string value (objects, arrays, numbers, booleans), or a string that parses
+ * cleanly as JSON. Plain prose strings return `false` so they render verbatim.
+ */
+export declare function looksLikeJson(value: unknown): boolean;
+/**
+ * Renders a serialised JSON string as coloured spans. Output is built from React
+ * nodes (never `dangerouslySetInnerHTML`), so a string value such as `"<img>"`
+ * is shown as text and can never inject markup. Colours come from the theme's
+ * `payloadTokenColors` and are applied inline to keep the many spans cheap.
+ */
+export declare function JsonHighlight({ code }: {
+    code: string;
+}): import("react").JSX.Element;

package/dist/components/dev-panel/segmented-control.d.ts

@@ -0,0 +1,38 @@
+import { ReactNode } from 'react';
+/** A single option in a segmented single-select. */
+export type SegmentedOption<T extends string> = {
+    /** The value reported to `onChange` when this option is selected. */
+    value: T;
+    /** Visible label. */
+    label: ReactNode;
+    /** Optional leading icon (mark decorative icons `aria-hidden`). */
+    icon?: ReactNode;
+    disabled?: boolean;
+};
+/**
+ * Requires an accessible name for the `radiogroup`. When rendered inside a
+ * `DevPanelSection` the group is labelled by the section heading automatically,
+ * so a name is only required when used standalone.
+ */
+type SegmentedAccessibleName = {
+    "aria-label"?: string;
+    "aria-labelledby"?: string;
+};
+export type SegmentedRadioGroupProps<T extends string> = {
+    /** The selected value (fully controlled). */
+    value: T;
+    /** Called with the newly selected value. */
+    onChange: (value: T) => void;
+    options: SegmentedOption<T>[];
+    /**
+     * `"pill"` (default) — options fill the beige track, selected flips to a white
+     * pill. `"chip"` — options hug their content and carry a small leading dot.
+     */
+    variant?: "pill" | "chip";
+} & SegmentedAccessibleName;
+/**
+ * An accessible single-select segmented control built on the roving-radiogroup
+ * pattern. Internal to `DevPanel`; Country / Variant / Step state compose it.
+ */
+export declare function SegmentedRadioGroup<T extends string>({ value, onChange, options, variant, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, }: SegmentedRadioGroupProps<T>): import("react").JSX.Element;
+export {};

package/dist/components/dev-panel/use-copy.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Writes text to the clipboard and tracks a short-lived `copied` flag so the
+ * caller can announce success (via a `role="status"` live region) and flip an
+ * icon. The flag auto-resets after ~2s; the pending timer is cleared on unmount.
+ */
+export declare function useCopy(): {
+    copied: boolean;
+    copy: (text: string) => Promise<void>;
+};

package/dist/components/dev-panel/use-dev-panel-labels.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Translated accessible names and status words used across the `DevPanel`
+ * sub-components (copy buttons, the minimise control, and the per-step status
+ * announced to assistive tech). Every string is overridable per-instance via a
+ * matching prop, so consumers can localise or reword without forking.
+ */
+export declare const useDevPanelLabels: () => Record<"step" | "copy" | "copied" | "copyJson" | "close" | "minimise" | "expand" | "statusCompleted" | "statusCurrent" | "statusUpcoming" | "needsAttention", string>;

package/dist/components/dev-panel/use-roving-radio.d.ts

@@ -0,0 +1,34 @@
+import { KeyboardEvent, Ref } from 'react';
+type RovingRadioItemProps = {
+    ref: Ref<HTMLElement>;
+    role: "radio";
+    "aria-checked": boolean;
+    "aria-disabled": true | undefined;
+    tabIndex: 0 | -1;
+    onClick: () => void;
+    onKeyDown: (event: KeyboardEvent<HTMLElement>) => void;
+};
+type UseRovingRadioOptions<T> = {
+    /** All selectable values, in DOM order. */
+    values: readonly T[];
+    /** The currently selected value (or `undefined` when nothing is selected). */
+    selected: T | undefined;
+    /** Called with the value to select on click / keyboard activation. */
+    onSelect: (value: T) => void;
+    /** Optional per-value disabled predicate; disabled items are skipped. */
+    isDisabled?: (value: T, index: number) => boolean;
+};
+/**
+ * Wires the WAI-ARIA radiogroup keyboard pattern for a set of custom option
+ * elements: a single roving `tabIndex`, arrow / Home / End navigation that moves
+ * focus *and* selection (activation follows focus), and Space / Enter to
+ * (re)select the focused item. Disabled items are skipped.
+ *
+ * The consuming component owns the markup and styling; it just spreads
+ * `getItemProps(index)` onto each option and renders the group with
+ * `role="radiogroup"`.
+ */
+export declare function useRovingRadio<T>({ values, selected, onSelect, isDisabled, }: UseRovingRadioOptions<T>): {
+    getItemProps: (index: number) => RovingRadioItemProps;
+};
+export {};

package/dist/components/feedback/alert.d.ts

@@ -0,0 +1,27 @@
+import { AlertProps as MuiAlertProps, AlertColor } from '@mui/material';
+export type AlertSize = "sm" | "lg";
+export type AlertProps = Omit<MuiAlertProps, "severity"> & {
+    /** Semantic meaning — picks the icon and how screen readers announce it. */
+    severity?: AlertColor;
+    /** `"lg"` (default) or `"sm"` for tighter padding and smaller text. */
+    size?: AlertSize;
+};
+/**
+ * Alert wraps MUI's `Alert` with Lea Bank's status colours and border radius
+ * (applied via the theme). The ARIA `role` is derived from `severity`:
+ * `error` / `warning` announce assertively (`role="alert"`) while `info` /
+ * `success` announce politely (`role="status"`). Pass an explicit `role` to
+ * override.
+ *
+ * Status icons come from Lucide via `iconMapping` (`alertIcons` in this file).
+ * With `onClose`, the dismiss button's accessible name is translated — override
+ * it per-instance with MUI's `closeText`.
+ *
+ * ```tsx
+ * <Alert color="purple" size="sm">
+ *   Lånet forutsetter at du løser skulder for totalt 80 000 kr.
+ * </Alert>
+ * ```
+ */
+export declare function Alert({ color, severity, role, size, iconMapping, ...rest }: AlertProps): import("react").JSX.Element;
+export { AlertTitle } from '@mui/material';

package/dist/components/feedback/dialog.d.ts

@@ -0,0 +1,22 @@
+import { DialogProps as MuiDialogProps } from '@mui/material';
+import { ReactNode } from 'react';
+export type DialogProps = MuiDialogProps;
+export declare function Dialog({ slots, slotProps, transitionDuration, ...rest }: DialogProps): import("react").JSX.Element;
+type DialogCloseReason = "backdropClick" | "escapeKeyDown" | "closeButtonClick";
+export type SimpleDialogProps = Omit<MuiDialogProps, "title" | "onClose"> & {
+    /** Heading, wired to the dialog via `aria-labelledby`. */
+    title: ReactNode;
+    /** Optional supporting text, wired via `aria-describedby` when present. */
+    description?: ReactNode;
+    /** Body content rendered below the title / description. */
+    children?: ReactNode;
+    /**
+     * Called when the user dismisses the dialog. `reason` is `"backdropClick"`,
+     * `"escapeKeyDown"`, or `"closeButtonClick"` (the header X).
+     */
+    onClose?: (event: object, reason: DialogCloseReason) => void;
+    /** Accessible name for the close button. Defaults to a translated "Close". */
+    closeLabel?: string;
+};
+export declare function SimpleDialog({ title, description, children, onClose, closeLabel, "aria-labelledby": ariaLabelledby, "aria-describedby": ariaDescribedby, ...rest }: SimpleDialogProps): import("react").JSX.Element;
+export {};

package/dist/components/feedback/drawer.d.ts

@@ -0,0 +1,22 @@
+import { DrawerProps as MuiDrawerProps } from '@mui/material';
+import { ReactNode } from 'react';
+export type DrawerProps = MuiDrawerProps;
+export declare function Drawer({ transitionDuration, ...rest }: DrawerProps): import("react").JSX.Element;
+type DrawerCloseReason = "backdropClick" | "escapeKeyDown" | "closeButtonClick";
+export type SimpleDrawerProps = Omit<MuiDrawerProps, "title" | "onClose"> & {
+    /** Heading, wired to the drawer via `aria-labelledby`. */
+    title: ReactNode;
+    /** Optional supporting text, wired via `aria-describedby` when present. */
+    description?: ReactNode;
+    /** Body content rendered below the title / description. */
+    children?: ReactNode;
+    /**
+     * Called when the user dismisses the drawer. `reason` is `"backdropClick"`,
+     * `"escapeKeyDown"`, or `"closeButtonClick"` (the header X).
+     */
+    onClose?: (event: object, reason: DrawerCloseReason) => void;
+    /** Accessible name for the close button. Defaults to a translated "Close". */
+    closeLabel?: string;
+};
+export declare function SimpleDrawer({ title, description, children, onClose, closeLabel, slotProps, "aria-labelledby": ariaLabelledby, "aria-describedby": ariaDescribedby, ...rest }: SimpleDrawerProps): import("react").JSX.Element;
+export {};

package/dist/components/feedback/index.d.ts

@@ -0,0 +1,3 @@
+export * from './alert';
+export * from './dialog';
+export * from './drawer';

package/dist/components/feedback/use-close-label.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Translated accessible name for the close (X) button shared by the feedback
+ * overlays (`SimpleDialog`, `SimpleDrawer`). Consumers can override per-instance
+ * via a `closeLabel` prop.
+ */
+export declare const useCloseLabel: () => Record<"close", string>;

package/dist/components/form/autocomplete.d.ts

@@ -0,0 +1,71 @@
+import { AutocompleteProps as MuiAutocompleteProps } from '@mui/material';
+import { ReactNode } from 'react';
+import { SelectOption } from './select';
+type AutocompleteOption = SelectOption | string;
+/** MUI props we forward untouched (free-solo so both modes type-check). */
+type ForwardedMuiProps = Omit<MuiAutocompleteProps<AutocompleteOption, false, false, true>, "ref" | "renderInput" | "renderValue" | "options" | "value" | "defaultValue" | "onChange" | "onInputChange" | "inputValue" | "freeSolo" | "multiple" | "getOptionLabel" | "getOptionDisabled" | "isOptionEqualToValue" | "filterOptions">;
+type AutocompleteBaseProps = ForwardedMuiProps & {
+    /** Floating label. Rendered as an `InputLabel` and linked automatically. */
+    label?: ReactNode;
+    /** Helper / error text shown below the control and linked via `aria-describedby`. */
+    helperText?: ReactNode;
+    /** Searchable options. Ignored in `email` mode, where suggestions are derived from the input. */
+    options?: SelectOption[];
+    /** Puts the control in an error state. */
+    error?: boolean;
+    /** Marks the control as required. */
+    required?: boolean;
+    /** Placeholder shown in the text input. */
+    placeholder?: string;
+};
+type AutocompleteSingleProps = {
+    /** Enable selecting multiple values. Omit (or `false`) for single-select. */
+    multiple?: false;
+    /** Selected value (controlled). */
+    value?: string;
+    /** Initial value (uncontrolled). */
+    defaultValue?: string;
+    /** Called with the next string value. */
+    onChange?: (value: string) => void;
+    /**
+     * Email mode: lets the user type freely and, once they type `@`, suggests
+     * completions from common providers (gmail, outlook, …).
+     */
+    email?: boolean;
+    /** Domains offered in `email` mode. @default COMMON_EMAIL_DOMAINS */
+    domains?: readonly string[];
+    /** Maximum number of email suggestions to show. @default 6 */
+    maxSuggestions?: number;
+};
+type AutocompleteMultipleProps = {
+    /** Enable selecting multiple values, rendered as removable chips. */
+    multiple: true;
+    /** Currently selected values (controlled). */
+    value?: string[];
+    /** Initially selected values (uncontrolled). */
+    defaultValue?: string[];
+    /** Called with the next array of selected values. */
+    onChange?: (value: string[]) => void;
+    /** Minimum number of values that must stay selected. @default 1 */
+    min?: number;
+    /** Maximum number of values that can be selected. Unlimited when omitted. */
+    max?: number;
+};
+export type AutocompleteProps = AutocompleteBaseProps & (AutocompleteSingleProps | AutocompleteMultipleProps);
+/**
+ * Searchable select built on MUI's `Autocomplete`.
+ *
+ * Works two ways:
+ * - **Standalone (all-in-one):** pass `label` / `helperText` and `options` and
+ *   it renders its own `FormControl`, label and helper text, generating and
+ *   wiring all ids for you.
+ * - **Composed:** drop it inside a `FormControl` next to `InputLabel` /
+ *   `FormHelperText` and it picks up the shared ids from context.
+ *
+ * Pass `multiple` to select several values at once, shown as removable chips and
+ * bounded by `min` (default 1) and `max`. Pass `email` (single mode only) to
+ * turn it into an email field that suggests common domains once the user types
+ * `@` — the same autocomplete behaviour, driven by free text.
+ */
+export declare const Autocomplete: import('react').ForwardRefExoticComponent<AutocompleteProps & import('react').RefAttributes<HTMLDivElement>>;
+export {};

package/dist/components/form/checkbox.d.ts

@@ -0,0 +1,12 @@
+import { CheckboxProps as MuiCheckboxProps } from '@mui/material';
+export type CheckboxProps = Omit<MuiCheckboxProps, "color" | "size">;
+/**
+ * Checkbox built on MUI's `Checkbox`, styled by the global theme
+ * (`checkbox.theme.tsx`). Kept composite — pair it with `FormControlLabel` for a
+ * label instead of forwarding label / typography props:
+ *
+ * ```tsx
+ * <FormControlLabel control={<Checkbox />} label="Label" />
+ * ```
+ */
+export declare const Checkbox: import('react').ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;

package/dist/components/form/datepicker/calendar-header.d.ts

@@ -0,0 +1,12 @@
+import { PickersCalendarHeaderProps } from '@mui/x-date-pickers/PickersCalendarHeader';
+import { CalendarHeaderLabels } from './use-calendar-header-labels';
+/**
+ * Replaces MUI's default calendar header for the day picker with the Lea Bank
+ * layout: a previous / next month chevron on each side and a centered, clickable
+ * month-year label (with a caret) that switches to the year view. The chevrons
+ * are muted at the `minDate` / `maxDate` bounds. Month navigation is only shown
+ * while the day grid is visible; in the year view only the label remains.
+ */
+export declare function CalendarHeader({ currentMonth, onMonthChange, onViewChange, view, minDate, maxDate, disabled, labels, }: PickersCalendarHeaderProps & {
+    labels?: CalendarHeaderLabels;
+}): import("react").JSX.Element;

package/dist/components/form/datepicker/datepicker.d.ts

@@ -0,0 +1,99 @@
+import { DatePickerProps as MuiDatePickerProps } from '@mui/x-date-pickers/DatePicker';
+import { Locale } from 'date-fns';
+import { ReactNode } from 'react';
+import { MonthYearOrder } from './view-toggle';
+import { ViewToggleLabels } from './use-view-toggle-labels';
+import { CalendarHeaderLabels } from './use-calendar-header-labels';
+export { type ViewToggleLabels, type CalendarHeaderLabels };
+export type DatePickerProps = MuiDatePickerProps & {
+    /** Helper / error text shown below the control and linked via `aria-describedby`. */
+    helperText?: ReactNode;
+    /** Puts the control in an error state and styles the helper text accordingly. */
+    error?: boolean;
+    /** Marks the control as required. */
+    required?: boolean;
+    /**
+     * `date-fns` locale used by the internal `LocalizationProvider`. Defaults to
+     * the `LeaProvider` language (`no`->`nb`, `se`->`sv`, `fi`->`fi`, `es`->`es`);
+     * set this to override.
+     */
+    adapterLocale?: Locale;
+    /** Small uppercase context label shown above the drawer title on mobile. */
+    eyebrow?: ReactNode;
+    /** Drawer heading on mobile. Defaults from `views` ("Velg dato" or "Velg måned og år"). */
+    title?: ReactNode;
+    /** Order of month and year in the month/year picker. Default: "month-year" */
+    monthYearOrder?: MonthYearOrder;
+    /**
+     * Override the month/year toggle's translated labels (`month`, `year`,
+     * `selectView`) per-instance. Only used by the month/year picker
+     * (`views={["year", "month"]}`).
+     */
+    viewToggleLabels?: ViewToggleLabels;
+    /**
+     * Override the day calendar header's translated labels (`previousMonth`,
+     * `nextMonth`, `switchToYearView`, `switchToDayView`) per-instance. Only
+     * used by the day picker (default `views`).
+     */
+    calendarHeaderLabels?: CalendarHeaderLabels;
+};
+/**
+ * DatePicker built on MUI's responsive `DatePicker` (`@mui/x-date-pickers`),
+ * styled to the Lea Bank design.
+ *
+ * Two calendar designs, chosen by `views`:
+ * - **Day picker** (default): MUI's `DateCalendar` day grid with a centered Lea
+ *   Bank header (prev/next month chevrons either side of a clickable month-year
+ *   label that switches to the year list) and lowercase Monday-first weekdays.
+ * - **Month/year picker** (`views={["year", "month"]}`): a Måned / År segmented
+ *   toggle above the month / year grids. Control the order via `monthYearOrder`:
+ *   "month-year" (default) or "year-month" (for Sweden and other locales).
+ *   Opens on the first view and drills through to the second.
+ *
+ * - **Desktop:** a compact popover ("dropdown").
+ * - **Mobile:** a bottom `Drawer` with an `eyebrow` + `title` header. The switch
+ *   happens at `theme.breakpoints.up("sm")` by default; override with
+ *   `desktopModeMediaQuery`.
+ *
+ * Selecting a value commits immediately (`closeOnSelect`) in both modes.
+ * Configure which views are shown via `views` (e.g. `views={["year", "month"]}`).
+ * The trigger is the picker's accessible field,
+ * themed to match the library's other inputs (see `date-picker.theme.ts`), and a
+ * `LocalizationProvider` + `AdapterDateFns` are bundled in (locale follows the
+ * `LeaProvider` language, defaulting to Norwegian `nb`; set `adapterLocale` to
+ * override). MUI X's own texts (the open-picker button, month navigation,
+ * action bar) come from its bundled locale pack for that language — override
+ * them per-instance with `localeText`.
+ */
+export declare const DatePicker: import('react').ForwardRefExoticComponent<MuiDatePickerProps & {
+    /** Helper / error text shown below the control and linked via `aria-describedby`. */
+    helperText?: ReactNode;
+    /** Puts the control in an error state and styles the helper text accordingly. */
+    error?: boolean;
+    /** Marks the control as required. */
+    required?: boolean;
+    /**
+     * `date-fns` locale used by the internal `LocalizationProvider`. Defaults to
+     * the `LeaProvider` language (`no`->`nb`, `se`->`sv`, `fi`->`fi`, `es`->`es`);
+     * set this to override.
+     */
+    adapterLocale?: Locale;
+    /** Small uppercase context label shown above the drawer title on mobile. */
+    eyebrow?: ReactNode;
+    /** Drawer heading on mobile. Defaults from `views` ("Velg dato" or "Velg måned og år"). */
+    title?: ReactNode;
+    /** Order of month and year in the month/year picker. Default: "month-year" */
+    monthYearOrder?: MonthYearOrder;
+    /**
+     * Override the month/year toggle's translated labels (`month`, `year`,
+     * `selectView`) per-instance. Only used by the month/year picker
+     * (`views={["year", "month"]}`).
+     */
+    viewToggleLabels?: ViewToggleLabels;
+    /**
+     * Override the day calendar header's translated labels (`previousMonth`,
+     * `nextMonth`, `switchToYearView`, `switchToDayView`) per-instance. Only
+     * used by the day picker (default `views`).
+     */
+    calendarHeaderLabels?: CalendarHeaderLabels;
+} & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/form/datepicker/drawer-toolbar.d.ts

@@ -0,0 +1,17 @@
+import { ReactNode } from 'react';
+export type DrawerToolbarProps = {
+    /** Small uppercase context label shown above the title. */
+    eyebrow?: ReactNode;
+    /** Drawer heading. */
+    title?: ReactNode;
+    /** id set on the title so the drawer dialog can reference it via `aria-labelledby`. */
+    titleId?: string;
+    /** Set by MUI's layout; when true the toolbar must not render. */
+    hidden?: boolean;
+};
+/**
+ * Replaces the default `DatePickerToolbar`. Renders the Lea Bank drawer header:
+ * an optional purple uppercase eyebrow and a large title. Both are supplied by
+ * `DatePicker` through `slotProps.toolbar`.
+ */
+export declare function DrawerToolbar({ eyebrow, title, titleId, hidden }: DrawerToolbarProps): import("react").JSX.Element | null;

package/dist/components/form/datepicker/index.d.ts

@@ -0,0 +1 @@
+export * from './datepicker';

package/dist/components/form/datepicker/use-calendar-header-labels.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Translated labels for `CalendarHeader`: the prev/next month button names and
+ * the month-year label's "switch to year/day view" suffix. Consumers can
+ * override any of these per-instance via `DatePicker`'s `calendarHeaderLabels`
+ * prop.
+ */
+export declare const useCalendarHeaderLabels: () => Record<"previousMonth" | "nextMonth" | "switchToYearView" | "switchToDayView", string>;
+export type CalendarHeaderLabels = Partial<ReturnType<typeof useCalendarHeaderLabels>>;

package/dist/components/form/datepicker/use-datepicker-title-labels.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Translated default titles for `DatePicker`'s mobile drawer header, used when
+ * the `title` prop is omitted.
+ */
+export declare const useDatePickerTitleLabels: () => Record<"selectDate" | "selectMonthYear", string>;

package/dist/components/form/datepicker/use-view-toggle-labels.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Translated labels for `ViewToggle`: the month/year segment labels and the
+ * `role="group"` accessible name. Consumers can override any of these
+ * per-instance via `DatePicker`'s `viewToggleLabels` prop.
+ */
+export declare const useViewToggleLabels: () => Record<"month" | "year" | "selectView", string>;
+export type ViewToggleLabels = Partial<ReturnType<typeof useViewToggleLabels>>;

package/dist/components/form/datepicker/view-renderers.d.ts

@@ -0,0 +1,10 @@
+import { DatePickerProps } from '@mui/x-date-pickers/DatePicker';
+import { MonthYearOrder } from './view-toggle';
+import { ViewToggleLabels } from './use-view-toggle-labels';
+/**
+ * Factory function that creates `viewRenderers` for the month/year-only picker.
+ * The day view is intentionally absent (that mode uses MUI's standard `DateCalendar`);
+ * these only drive the `views={["year", "month"]}` configuration with the Måned / År toggle
+ * and a month to year drill. Supports configurable order via `monthYearOrder`.
+ */
+export declare const createDateViewRenderers: (order?: MonthYearOrder, labels?: ViewToggleLabels) => DatePickerProps["viewRenderers"];

package/dist/components/form/datepicker/view-toggle.d.ts

@@ -0,0 +1,21 @@
+import { ViewToggleLabels } from './use-view-toggle-labels';
+export type ToggleView = "month" | "year";
+export type MonthYearOrder = "month-year" | "year-month";
+export type ViewToggleProps = {
+    /** The currently active view. */
+    currentView: ToggleView;
+    /** Called with the view the user switched to. */
+    onViewChange: (view: ToggleView) => void;
+    /** Order of month and year segments. Default: "month-year" */
+    order?: MonthYearOrder;
+    /** Override the built-in translated labels per-instance. */
+    labels?: ViewToggleLabels;
+};
+/**
+ * Segmented control for the month/year-only picker. Shows two pill segments,
+ * month first then year, with the active segment raised on a white pill. Used as
+ * the header of the month/year `viewRenderers`; switching segments changes the
+ * picker view. Each segment is a toggle button exposing `aria-pressed`, grouped
+ * under a labelled `role="group"`.
+ */
+export declare function ViewToggle({ currentView, onViewChange, order, labels, }: ViewToggleProps): import("react").JSX.Element;

package/dist/components/form/email-input.d.ts

@@ -0,0 +1,35 @@
+import { FocusEventHandler, ReactNode } from 'react';
+export type EmailInputProps = {
+    /** Current value (controlled). */
+    value?: string;
+    /** Initial value (uncontrolled). */
+    defaultValue?: string;
+    /** Called with the next string value. */
+    onChange?: (value: string) => void;
+    /** Domains offered once the user types `@`. Defaults to common providers. */
+    domains?: readonly string[];
+    /** Maximum number of suggestions to show. @default 6 */
+    maxSuggestions?: number;
+    /** Floating label. Rendered as an `InputLabel` and linked automatically. */
+    label?: ReactNode;
+    /** Helper / error text shown below the control and linked via `aria-describedby`. */
+    helperText?: ReactNode;
+    /** Placeholder shown in the text input. */
+    placeholder?: string;
+    /** Puts the control in an error state. */
+    error?: boolean;
+    /** Marks the control as required. */
+    required?: boolean;
+    /** Disables the control. */
+    disabled?: boolean;
+    /** Blur handler (e.g. for react-hook-form touched state). */
+    onBlur?: FocusEventHandler<HTMLDivElement>;
+};
+/**
+ * Email text field that suggests common domains in a dropdown once the user
+ * types `@`. Works controlled (`value` + `onChange`) or uncontrolled
+ * (`defaultValue`), standalone (`label` / `helperText`) or inside a
+ * `FormControl`.
+ *
+ */
+export declare const EmailInput: import('react').ForwardRefExoticComponent<EmailInputProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/form/fields/autocomplete-field.d.ts

@@ -0,0 +1,17 @@
+import { FieldValues } from 'react-hook-form';
+import { AutocompleteProps } from '../autocomplete';
+import { BaseFieldProps } from './field-types';
+/**
+ * Distributes `Omit` across the `AutocompleteProps` union so the single- and
+ * multiple-select props (e.g. `email`, `min`, `max`) survive rather than
+ * collapsing to the keys common to both branches.
+ */
+type DistributiveOmit<T, K extends PropertyKey> = T extends unknown ? Omit<T, K> : never;
+export type AutocompleteFieldProps<T extends FieldValues> = BaseFieldProps<T> & DistributiveOmit<AutocompleteProps, "name" | "value" | "defaultValue" | "onChange" | "error">;
+/**
+ * `Autocomplete` connected to react-hook-form via `Controller`. Reads `control`
+ * from the nearest `FormProvider` when the prop is omitted. Supports both
+ * single (`string`) and `multiple` (`string[]`) selection.
+ */
+export declare const AutocompleteField: <T extends FieldValues>({ name, control, rules, disabled, label, helperText, ...rest }: AutocompleteFieldProps<T>) => import("react").JSX.Element;
+export {};

package/dist/components/form/fields/boolean-radio-field.d.ts

@@ -0,0 +1,3 @@
+import { FieldValues } from 'react-hook-form';
+import { RadioCardFieldProps } from './radio-card-field';
+export declare const BooleanRadioCardField: <T extends FieldValues>(props: Omit<RadioCardFieldProps<T>, "format" | "parse">) => import("react").JSX.Element;

package/dist/components/form/fields/checkbox-field.d.ts

@@ -0,0 +1,12 @@
+import { ReactNode } from 'react';
+import { FieldValues } from 'react-hook-form';
+import { BaseFieldProps } from './field-types';
+export type CheckboxFieldProps<T extends FieldValues> = BaseFieldProps<T> & {
+    label: ReactNode;
+};
+/**
+ * `Checkbox` connected to react-hook-form via `Controller`, composed with
+ * `FormControlLabel`. Reads `control` from the nearest `FormProvider` when the
+ * prop is omitted.
+ */
+export declare const CheckboxField: <T extends FieldValues>({ name, control, rules, disabled, label, }: CheckboxFieldProps<T>) => import("react").JSX.Element;

package/dist/components/form/fields/datepicker-field.d.ts

@@ -0,0 +1,9 @@
+import { FieldValues } from 'react-hook-form';
+import { DatePickerProps } from '../datepicker';
+import { BaseFieldProps } from './field-types';
+export type DatePickerFieldProps<T extends FieldValues> = BaseFieldProps<T> & Omit<DatePickerProps, "name" | "value" | "defaultValue" | "error" | "onChange">;
+/**
+ * `DatePicker` connected to react-hook-form via `Controller`. Reads `control`
+ * from the nearest `FormProvider` when the prop is omitted.
+ */
+export declare const DatePickerField: <T extends FieldValues>({ name, control, rules, disabled, helperText, ...rest }: DatePickerFieldProps<T>) => import("react").JSX.Element;