@leabankab/component-library 7.2.0 → 8.0.0

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

@@ -0,0 +1,329 @@
+import { ComponentPropsWithRef, ReactNode, SyntheticEvent } from 'react';
+import { ColorRoles } from '../color-roles';
+export type AlertSeverity = ColorRoles<"success" | "info" | "warning" | "error">;
+export type AlertColor = AlertSeverity | ColorRoles<"primary" | "neutral">;
+export type AlertVariant = "standard" | "filled" | "outlined";
+export type AlertSize = "sm" | "lg";
+export type AlertProps = Omit<ComponentPropsWithRef<"div">, "color"> & {
+    /**
+     * Semantic meaning — picks the icon and how screen readers announce it.
+     * @default "success", or "info" with a brand `color`
+     */
+    severity?: AlertSeverity;
+    /**
+     * Colour scheme. Defaults to the colour of `severity`. `"primary"` (the
+     * brand purple) and `"neutral"` (grey) carry no status meaning.
+     */
+    color?: AlertColor;
+    /**
+     * `"standard"` is a tinted fill, `"filled"` a solid one, `"outlined"` a
+     * border only.
+     * @default "standard"
+     */
+    variant?: AlertVariant;
+    /**
+     * `"sm"` for tighter padding and smaller text.
+     * @default "lg"
+     */
+    size?: AlertSize;
+    /** Replaces the severity icon. Pass `false` to hide it. */
+    icon?: ReactNode | false;
+    /** Content for the end of the alert, e.g. a button. Replaces the close button. */
+    action?: ReactNode;
+    /** Renders a close button that calls this when pressed. */
+    onClose?: (event: SyntheticEvent) => void;
+    /** Accessible name of the close button. Defaults to a translated "Close". */
+    closeLabel?: string;
+};
+/**
+ * Resolves the props shared by `Alert` and `GlobalAlert` into the root's
+ * attributes and its inner markup. Internal — not exported from the package.
+ */
+export declare function resolveAlert({ severity, color, variant, size, icon, action, onClose, closeLabel, role, children, ...rest }: AlertProps): {
+    rootProps: {
+        role: import('react').AriaRole;
+        "data-color": AlertColor;
+        "data-variant": AlertVariant;
+        "data-size": AlertSize;
+        className?: string | undefined | undefined;
+        slot?: string | undefined | undefined;
+        style?: import('react').CSSProperties | undefined;
+        title?: string | undefined | undefined;
+        onAnimationStart?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
+        onDragStart?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onDragEnd?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onDrag?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        ref?: import('react').Ref<HTMLDivElement> | undefined;
+        key?: import('react').Key | null | undefined;
+        defaultChecked?: boolean | undefined | undefined;
+        defaultValue?: string | number | readonly string[] | undefined;
+        suppressContentEditableWarning?: boolean | undefined | undefined;
+        suppressHydrationWarning?: boolean | undefined | undefined;
+        accessKey?: string | undefined | undefined;
+        autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
+        autoFocus?: boolean | undefined | undefined;
+        contentEditable?: "inherit" | (boolean | "true" | "false") | "plaintext-only" | undefined;
+        contextMenu?: string | undefined | undefined;
+        dir?: string | undefined | undefined;
+        draggable?: (boolean | "true" | "false") | undefined;
+        enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
+        hidden?: boolean | undefined | undefined;
+        id?: string | undefined | undefined;
+        lang?: string | undefined | undefined;
+        nonce?: string | undefined | undefined;
+        spellCheck?: (boolean | "true" | "false") | undefined;
+        tabIndex?: number | undefined | undefined;
+        translate?: "yes" | "no" | undefined | undefined;
+        radioGroup?: string | undefined | undefined;
+        about?: string | undefined | undefined;
+        content?: string | undefined | undefined;
+        datatype?: string | undefined | undefined;
+        inlist?: any;
+        prefix?: string | undefined | undefined;
+        property?: string | undefined | undefined;
+        rel?: string | undefined | undefined;
+        resource?: string | undefined | undefined;
+        rev?: string | undefined | undefined;
+        typeof?: string | undefined | undefined;
+        vocab?: string | undefined | undefined;
+        autoCorrect?: string | undefined | undefined;
+        autoSave?: string | undefined | undefined;
+        itemProp?: string | undefined | undefined;
+        itemScope?: boolean | undefined | undefined;
+        itemType?: string | undefined | undefined;
+        itemID?: string | undefined | undefined;
+        itemRef?: string | undefined | undefined;
+        results?: number | undefined | undefined;
+        security?: string | undefined | undefined;
+        unselectable?: "on" | "off" | undefined | undefined;
+        popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
+        popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
+        popoverTarget?: string | undefined | undefined;
+        inert?: boolean | undefined | undefined;
+        inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
+        is?: string | undefined | undefined;
+        exportparts?: string | undefined | undefined;
+        part?: string | undefined | undefined;
+        "aria-activedescendant"?: string | undefined | undefined;
+        "aria-atomic"?: (boolean | "true" | "false") | undefined;
+        "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
+        "aria-braillelabel"?: string | undefined | undefined;
+        "aria-brailleroledescription"?: string | undefined | undefined;
+        "aria-busy"?: (boolean | "true" | "false") | undefined;
+        "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
+        "aria-colcount"?: number | undefined | undefined;
+        "aria-colindex"?: number | undefined | undefined;
+        "aria-colindextext"?: string | undefined | undefined;
+        "aria-colspan"?: number | undefined | undefined;
+        "aria-controls"?: string | undefined | undefined;
+        "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
+        "aria-describedby"?: string | undefined | undefined;
+        "aria-description"?: string | undefined | undefined;
+        "aria-details"?: string | undefined | undefined;
+        "aria-disabled"?: (boolean | "true" | "false") | undefined;
+        "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
+        "aria-errormessage"?: string | undefined | undefined;
+        "aria-expanded"?: (boolean | "true" | "false") | undefined;
+        "aria-flowto"?: string | undefined | undefined;
+        "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+        "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
+        "aria-hidden"?: (boolean | "true" | "false") | undefined;
+        "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
+        "aria-keyshortcuts"?: string | undefined | undefined;
+        "aria-label"?: string | undefined | undefined;
+        "aria-labelledby"?: string | undefined | undefined;
+        "aria-level"?: number | undefined | undefined;
+        "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
+        "aria-modal"?: (boolean | "true" | "false") | undefined;
+        "aria-multiline"?: (boolean | "true" | "false") | undefined;
+        "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+        "aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
+        "aria-owns"?: string | undefined | undefined;
+        "aria-placeholder"?: string | undefined | undefined;
+        "aria-posinset"?: number | undefined | undefined;
+        "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
+        "aria-readonly"?: (boolean | "true" | "false") | undefined;
+        "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
+        "aria-required"?: (boolean | "true" | "false") | undefined;
+        "aria-roledescription"?: string | undefined | undefined;
+        "aria-rowcount"?: number | undefined | undefined;
+        "aria-rowindex"?: number | undefined | undefined;
+        "aria-rowindextext"?: string | undefined | undefined;
+        "aria-rowspan"?: number | undefined | undefined;
+        "aria-selected"?: (boolean | "true" | "false") | undefined;
+        "aria-setsize"?: number | undefined | undefined;
+        "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
+        "aria-valuemax"?: number | undefined | undefined;
+        "aria-valuemin"?: number | undefined | undefined;
+        "aria-valuenow"?: number | undefined | undefined;
+        "aria-valuetext"?: string | undefined | undefined;
+        dangerouslySetInnerHTML?: {
+            __html: string | TrustedHTML;
+        } | undefined | undefined;
+        onCopy?: import('react').ClipboardEventHandler<HTMLDivElement> | undefined;
+        onCopyCapture?: import('react').ClipboardEventHandler<HTMLDivElement> | undefined;
+        onCut?: import('react').ClipboardEventHandler<HTMLDivElement> | undefined;
+        onCutCapture?: import('react').ClipboardEventHandler<HTMLDivElement> | undefined;
+        onPaste?: import('react').ClipboardEventHandler<HTMLDivElement> | undefined;
+        onPasteCapture?: import('react').ClipboardEventHandler<HTMLDivElement> | undefined;
+        onCompositionEnd?: import('react').CompositionEventHandler<HTMLDivElement> | undefined;
+        onCompositionEndCapture?: import('react').CompositionEventHandler<HTMLDivElement> | undefined;
+        onCompositionStart?: import('react').CompositionEventHandler<HTMLDivElement> | undefined;
+        onCompositionStartCapture?: import('react').CompositionEventHandler<HTMLDivElement> | undefined;
+        onCompositionUpdate?: import('react').CompositionEventHandler<HTMLDivElement> | undefined;
+        onCompositionUpdateCapture?: import('react').CompositionEventHandler<HTMLDivElement> | undefined;
+        onFocus?: import('react').FocusEventHandler<HTMLDivElement> | undefined;
+        onFocusCapture?: import('react').FocusEventHandler<HTMLDivElement> | undefined;
+        onBlur?: import('react').FocusEventHandler<HTMLDivElement> | undefined;
+        onBlurCapture?: import('react').FocusEventHandler<HTMLDivElement> | undefined;
+        onChange?: import('react').ChangeEventHandler<HTMLDivElement, Element> | undefined;
+        onChangeCapture?: import('react').ChangeEventHandler<HTMLDivElement, Element> | undefined;
+        onBeforeInput?: import('react').InputEventHandler<HTMLDivElement> | undefined;
+        onBeforeInputCapture?: import('react').InputEventHandler<HTMLDivElement> | undefined;
+        onInput?: import('react').InputEventHandler<HTMLDivElement> | undefined;
+        onInputCapture?: import('react').InputEventHandler<HTMLDivElement> | undefined;
+        onReset?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onResetCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onSubmit?: import('react').SubmitEventHandler<HTMLDivElement> | undefined;
+        onSubmitCapture?: import('react').SubmitEventHandler<HTMLDivElement> | undefined;
+        onInvalid?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onInvalidCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onLoad?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onLoadCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onError?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onErrorCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onKeyDown?: import('react').KeyboardEventHandler<HTMLDivElement> | undefined;
+        onKeyDownCapture?: import('react').KeyboardEventHandler<HTMLDivElement> | undefined;
+        onKeyPress?: import('react').KeyboardEventHandler<HTMLDivElement> | undefined;
+        onKeyPressCapture?: import('react').KeyboardEventHandler<HTMLDivElement> | undefined;
+        onKeyUp?: import('react').KeyboardEventHandler<HTMLDivElement> | undefined;
+        onKeyUpCapture?: import('react').KeyboardEventHandler<HTMLDivElement> | undefined;
+        onAbort?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onAbortCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onCanPlay?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onCanPlayCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onCanPlayThrough?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onCanPlayThroughCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onDurationChange?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onDurationChangeCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onEmptied?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onEmptiedCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onEncrypted?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onEncryptedCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onEnded?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onEndedCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onLoadedData?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onLoadedDataCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onLoadedMetadata?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onLoadedMetadataCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onLoadStart?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onLoadStartCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onPause?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onPauseCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onPlay?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onPlayCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onPlaying?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onPlayingCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onProgress?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onProgressCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onRateChange?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onRateChangeCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onSeeked?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onSeekedCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onSeeking?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onSeekingCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onStalled?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onStalledCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onSuspend?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onSuspendCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onTimeUpdate?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onTimeUpdateCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onVolumeChange?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onVolumeChangeCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onWaiting?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onWaitingCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onAuxClick?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onAuxClickCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onClick?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onClickCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onContextMenu?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onContextMenuCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onDoubleClick?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onDoubleClickCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onDragCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onDragEndCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onDragEnter?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onDragEnterCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onDragExit?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onDragExitCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onDragLeave?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onDragLeaveCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onDragOver?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onDragOverCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onDragStartCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onDrop?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onDropCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
+        onMouseDown?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseDownCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseEnter?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseLeave?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseMove?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseMoveCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseOut?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseOutCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseOver?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseOverCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseUp?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseUpCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
+        onSelect?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onSelectCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
+        onTouchCancel?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
+        onTouchCancelCapture?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
+        onTouchEnd?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
+        onTouchEndCapture?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
+        onTouchMove?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
+        onTouchMoveCapture?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
+        onTouchStart?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
+        onTouchStartCapture?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
+        onPointerDown?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerDownCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerMove?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerMoveCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerUp?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerUpCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerCancel?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerCancelCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerEnter?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerLeave?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerOver?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerOverCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerOut?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerOutCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onGotPointerCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onGotPointerCaptureCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onLostPointerCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onLostPointerCaptureCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
+        onScroll?: import('react').UIEventHandler<HTMLDivElement> | undefined;
+        onScrollCapture?: import('react').UIEventHandler<HTMLDivElement> | undefined;
+        onScrollEnd?: import('react').UIEventHandler<HTMLDivElement> | undefined;
+        onScrollEndCapture?: import('react').UIEventHandler<HTMLDivElement> | undefined;
+        onWheel?: import('react').WheelEventHandler<HTMLDivElement> | undefined;
+        onWheelCapture?: import('react').WheelEventHandler<HTMLDivElement> | undefined;
+        onAnimationStartCapture?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
+        onAnimationEnd?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
+        onAnimationEndCapture?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
+        onAnimationIteration?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
+        onAnimationIterationCapture?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
+        onToggle?: import('react').ToggleEventHandler<HTMLDivElement> | undefined;
+        onBeforeToggle?: import('react').ToggleEventHandler<HTMLDivElement> | undefined;
+        onTransitionCancel?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionCancelCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionEnd?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionEndCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionRun?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionRunCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionStart?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionStartCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
+    };
+    content: import("react").JSX.Element;
+};

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

@@ -1,27 +1,22 @@
-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;
-};
+import { ComponentPropsWithRef } from 'react';
+import { AlertProps } from './alert-parts';
+export type { AlertColor, AlertProps, AlertSeverity, AlertSize, AlertVariant, } from './alert-parts';
 /**
- * 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.
+ * A message with Lea Bank's status colours. 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`.
+ * With `onClose`, a close button is rendered with a translated accessible
+ * name — override it per-instance with `closeLabel`.
  *
  * ```tsx
- * <Alert color="purple" size="sm">
+ * <Alert color="primary" 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';
+export declare function Alert({ className, ...props }: AlertProps): import("react").JSX.Element;
+export type AlertTitleProps = ComponentPropsWithRef<"div">;
+/** A heading above the alert's message. */
+export declare function AlertTitle({ className, ...rest }: AlertTitleProps): import("react").JSX.Element;

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

@@ -0,0 +1,24 @@
+import { AlertProps } from './alert-parts';
+export type GlobalAlertProps = AlertProps & {
+    /**
+     * Lets the content span the full width instead of stopping at the `lg`
+     * breakpoint. The side padding stays.
+     * @default false
+     */
+    fluid?: boolean;
+};
+/**
+ * An `Alert` that spans the whole page width, for messages about the whole
+ * page or session. Place it directly above or below `AppHeader`. It takes the
+ * same props and styling as `Alert`, without the rounded corners, and its
+ * content follows the `Container` breakpoints and side padding.
+ *
+ * ```tsx
+ * <AppHeader />
+ * <GlobalAlert severity="warning" onClose={dismiss}>
+ *   <AlertTitle>Planned maintenance</AlertTitle>
+ *   Online banking is unavailable tonight from 22:00 to 23:00.
+ * </GlobalAlert>
+ * ```
+ */
+export declare function GlobalAlert({ fluid, className, ...props }: GlobalAlertProps): import("react").JSX.Element;

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

@@ -1,5 +1,6 @@
 export * from './alert';
 export * as Dialog from './dialog';
 export * as Drawer from './drawer';
+export * from './global-alert';
 export * from './simple-dialog';
 export * from './simple-drawer';

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

@@ -33,7 +33,7 @@ export type SimpleDialogProps = Omit<Dialog.RootProps, "children"> & {
  *   title="Update your details"
  *   description="Keep your contact information up to date."
  * >
- *   <TextField label="Phone" />
+ *   <Input label="Phone" />
  * </SimpleDialog>
  * ```
  */

package/dist/components/form/amount-slider.d.ts

@@ -0,0 +1,68 @@
+import { ComponentPropsWithRef, ReactNode } from 'react';
+export type AmountSliderProps = Omit<ComponentPropsWithRef<"div">, "children" | "defaultValue" | "onChange"> & {
+    /**
+     * The question above the amount, e.g. "Hur mycket vill du låna?". It labels
+     * the amount field and names the slider, so it is required.
+     */
+    label: ReactNode;
+    /** The lowest amount that can be chosen. */
+    min: number;
+    /** The highest amount that can be chosen. */
+    max: number;
+    /**
+     * How far the slider, and the arrow keys in the amount field, move the
+     * amount. A typed amount is kept as typed, also between two steps.
+     * @default 1
+     */
+    step?: number;
+    /** The amount. Use with `onValueChange` to control the component. */
+    value?: number;
+    /**
+     * The amount when first rendered, for uncontrolled use.
+     * @default min
+     */
+    defaultValue?: number;
+    /**
+     * Called with the new amount when the slider moves, and when an amount
+     * within `min` and `max` is typed.
+     */
+    onValueChange?: (value: number) => void;
+    /** How the amount, `min` and `max` are written, e.g. as a currency. */
+    format?: Intl.NumberFormatOptions;
+    /** The locale the amount is written and typed in. Defaults to the runtime locale. */
+    locale?: Intl.LocalesArgument;
+    /** Submits the amount under this name when inside a form. */
+    name?: string;
+    /** Disables both the amount field and the slider. */
+    disabled?: boolean;
+    /** Helper / error text shown below the slider and linked via `aria-describedby`. */
+    helperText?: ReactNode;
+    /** Puts the amount field, the slider and the helper text into the error state. */
+    error?: boolean;
+};
+/**
+ * An amount chosen by dragging a slider or by typing it, for questions like
+ * "how much do you want to borrow?". The amount field and the slider share one
+ * value: moving the slider rewrites the amount, and typing moves the thumb.
+ *
+ * The `label` is a real `<label>` for the amount field and also names the
+ * slider, and the helper text describes both. A typed amount outside `min`
+ * and `max` is brought back into range when the field loses focus, and an
+ * emptied field goes back to the last amount.
+ *
+ * Use `Slider` instead when the value does not need to be typed.
+ *
+ * ```tsx
+ * <AmountSlider
+ *   label="Hur mycket vill du låna?"
+ *   min={20000}
+ *   max={600000}
+ *   step={5000}
+ *   defaultValue={200000}
+ *   locale="sv-SE"
+ *   format={{ style: "currency", currency: "SEK", maximumFractionDigits: 0 }}
+ *   onValueChange={(amount) => setAmount(amount)}
+ * />
+ * ```
+ */
+export declare function AmountSlider({ label, min, max, step, value: valueProp, defaultValue, onValueChange, format, locale, name, disabled, helperText, error, className, ...rest }: AmountSliderProps): import("react").JSX.Element;

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

@@ -1,71 +1,68 @@
-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;
+import { ReactElement, ReactNode } from 'react';
+import { ComboFieldBaseProps } from './combo-field';
+import { SelectOption } from './select-field';
+type AutocompleteBaseProps<Value extends string> = ComboFieldBaseProps & {
+    /** The choices. Typing filters them by their label. */
+    options: readonly SelectOption<Value>[];
+    /** Shown in the list when nothing matches. Translated by default. */
+    noOptionsText?: ReactNode;
     /**
-     * Email mode: lets the user type freely and, once they type `@`, suggests
-     * completions from common providers (gmail, outlook, …).
+     * Whether the options are on their way. While there are none to show, the
+     * list says so instead of "no options".
      */
-    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;
+    loading?: boolean;
 };
-type AutocompleteMultipleProps = {
-    /** Enable selecting multiple values, rendered as removable chips. */
+type SingleValueProps<Value extends string> = {
+    /** Choose several values, shown as chips. */
+    multiple?: false;
+    /** The chosen value (controlled). `""` means nothing is chosen. */
+    value?: Value | "";
+    /** The chosen value when first rendered, for uncontrolled use. */
+    defaultValue?: Value | "";
+    /** Called with the chosen value, or `""` when the control is emptied. */
+    onValueChange?: (value: Value | "") => void;
+};
+type MultipleValueProps<Value extends string> = {
+    /** Choose several values, shown as 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 */
+    /** The chosen values (controlled). */
+    value?: Value[];
+    /** The chosen values when first rendered, for uncontrolled use. */
+    defaultValue?: Value[];
+    /** Called with the next array of chosen values. */
+    onValueChange?: (value: Value[]) => void;
+    /** Fewest values that must stay chosen. @default 1 */
     min?: number;
-    /** Maximum number of values that can be selected. Unlimited when omitted. */
+    /** Most values that can be chosen. Unlimited when omitted. */
     max?: number;
 };
-export type AutocompleteProps = AutocompleteBaseProps & (AutocompleteSingleProps | AutocompleteMultipleProps);
+type AutocompleteSingleProps<Value extends string = string> = AutocompleteBaseProps<Value> & SingleValueProps<Value>;
+type AutocompleteMultipleProps<Value extends string = string> = AutocompleteBaseProps<Value> & MultipleValueProps<Value>;
+export type AutocompleteProps<Value extends string = string> = AutocompleteSingleProps<Value> | AutocompleteMultipleProps<Value>;
 /**
- * Searchable select built on MUI's `Autocomplete`.
+ * A select to search in, on Base UI's `Combobox`, in the same box as `Input`.
+ * Typing filters the options. The label, the helper text and the ids that
+ * link them to the input are all rendered and wired for you.
+ *
+ * ```tsx
+ * <Autocomplete
+ *   label="Land"
+ *   options={[
+ *     { value: "no", label: "Norge" },
+ *     { value: "se", label: "Sverige" },
+ *   ]}
+ *   value={country}
+ *   onValueChange={setCountry}
+ * />
+ * ```
  *
- * 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.
+ * Values are strings, typed from the options as in `Select`, and `""` means
+ * nothing is chosen. Pass `multiple` to choose several: they show as chips
+ * inside the field, bounded by `min` (default 1) and `max`.
  *
- * 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.
+ * For an email address with suggested domains, use `EmailInput`.
  */
-export declare const Autocomplete: import('react').ForwardRefExoticComponent<AutocompleteProps & import('react').RefAttributes<HTMLDivElement>>;
+export declare function Autocomplete<Value extends string = string>(props: AutocompleteMultipleProps<Value>): ReactElement;
+export declare function Autocomplete<Value extends string = string>(props: AutocompleteSingleProps<Value>): ReactElement;
+export declare function Autocomplete<Value extends string = string>(props: AutocompleteProps<Value>): ReactElement;
 export {};

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

@@ -0,0 +1,11 @@
+/** The tick. It is drawn in by a transition when its box becomes checked. */
+export declare const checkboxTick: import("react").JSX.Element;
+/**
+ * Internal. The checkbox box as a picture only, for places where something
+ * else is the control: `MultiSelect` shows it inside each option, and the
+ * option is what gets picked. It looks exactly like `Checkbox`, which uses
+ * the same class on the real control.
+ */
+export declare const CheckboxBox: ({ checked }: {
+    checked: boolean;
+}) => import("react").JSX.Element;