@enonic/ui 1.5.0 → 1.7.0

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

@@ -22,16 +22,14 @@ export type ContextMenuPortalProps = {
  * The component that pops out when the context menu is open.
  *
  * @remarks
- * **Focus-visible behavior**: Since context menus are always opened via pointer
- * (right-click), focus rings are hidden initially to avoid visual noise. Once the
- * user presses a navigation key (ArrowUp, ArrowDown, Home, End), focus rings appear
- * and remain visible until the menu closes. This provides a clean experience for
- * pointer users while maintaining accessibility for keyboard users.
+ * **Focus-visible behavior**: Keyboard openings show focus rings immediately.
+ * Pointer openings hide them until the user presses a navigation key
+ * (ArrowUp, ArrowDown, Home, End). Rings then remain visible until the menu closes.
  */
 export type ContextMenuContentProps = {
     forceMount?: boolean;
     loop?: boolean;
-    onEscapeKeyDown?: (event: KeyboardEvent) => void;
+    onEscapeKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;
     onPointerDownOutside?: (event: PointerEvent) => void;
     onInteractOutside?: (event: Event) => void;
     className?: string;
@@ -80,7 +78,7 @@ export type ContextMenuSubTriggerProps = {
 export type ContextMenuSubContentProps = {
     forceMount?: boolean;
     loop?: boolean;
-    onEscapeKeyDown?: (event: KeyboardEvent) => void;
+    onEscapeKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;
     onPointerDownOutside?: (event: PointerEvent) => void;
     onInteractOutside?: (event: Event) => void;
     /**
@@ -100,42 +98,85 @@ export declare const ContextMenu: {
         ({ open: controlledOpen, defaultOpen, onOpenChange, children, }: ContextMenuRootProps): ReactElement;
         displayName: string;
     };
-    Trigger: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<ContextMenuTriggerProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
+    Trigger: import('react').ForwardRefExoticComponent<{
+        asChild?: boolean;
+        disabled?: boolean;
+        className?: string;
+        children: ReactNode;
+    } & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "children" | "className"> & import('react').RefAttributes<HTMLDivElement>>;
     Portal: {
         ({ container, forceMount, children }: ContextMenuPortalProps): ReactElement | null;
         displayName: string;
     };
-    Content: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<ContextMenuContentProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
-    Item: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<MenuItemOwnProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
-    Label: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<MenuPrimitiveLabelProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
-    Separator: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<MenuPrimitiveSeparatorProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
-    RadioGroup: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<MenuRadioGroupOwnProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
-    RadioItem: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<MenuRadioItemOwnProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
-    ItemIndicator: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<MenuPrimitiveItemIndicatorProps> & {
-        ref?: import('preact').Ref<HTMLSpanElement> | undefined;
-    }>;
+    Content: import('react').ForwardRefExoticComponent<{
+        forceMount?: boolean;
+        loop?: boolean;
+        onEscapeKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;
+        onPointerDownOutside?: (event: PointerEvent) => void;
+        onInteractOutside?: (event: Event) => void;
+        className?: string;
+        children?: ReactNode;
+    } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+    Item: import('react').ForwardRefExoticComponent<{
+        id?: string;
+        asChild?: boolean;
+        disabled?: boolean;
+        onSelect?: (event: Event) => void;
+        className?: string;
+        children: ReactNode;
+    } & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "onSelect"> & import('react').RefAttributes<HTMLDivElement>>;
+    Label: import('react').ForwardRefExoticComponent<{
+        className?: string;
+        children: ReactNode;
+    } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+    Separator: import('react').ForwardRefExoticComponent<{
+        className?: string;
+    } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+    RadioGroup: import('react').ForwardRefExoticComponent<{
+        value?: string;
+        defaultValue?: string;
+        onValueChange?: (value: string) => void;
+        closeOnSelect?: boolean;
+        className?: string;
+        children?: ReactNode;
+    } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+    RadioItem: import('react').ForwardRefExoticComponent<{
+        id?: string;
+        value: string;
+        asChild?: boolean;
+        disabled?: boolean;
+        onSelect?: (event: Event) => void;
+        className?: string;
+        children: ReactNode;
+    } & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "onSelect"> & import('react').RefAttributes<HTMLDivElement>>;
+    ItemIndicator: import('react').ForwardRefExoticComponent<{
+        forceMount?: boolean;
+        className?: string;
+        children?: ReactNode;
+    } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import('react').RefAttributes<HTMLSpanElement>>;
     Sub: {
         ({ open: controlledOpen, defaultOpen, onOpenChange, children, }: ContextMenuSubProps): ReactElement;
         displayName: string;
     };
-    SubTrigger: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<ContextMenuSubTriggerProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
-    SubContent: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<ContextMenuSubContentProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
+    SubTrigger: import('react').ForwardRefExoticComponent<{
+        id?: string;
+        disabled?: boolean;
+        className?: string;
+        children: ReactNode;
+    } & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "children" | "id"> & import('react').RefAttributes<HTMLDivElement>>;
+    SubContent: import('react').ForwardRefExoticComponent<{
+        forceMount?: boolean;
+        loop?: boolean;
+        onEscapeKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;
+        onPointerDownOutside?: (event: PointerEvent) => void;
+        onInteractOutside?: (event: Event) => void;
+        /**
+         * Submenus open sideways only — the safe-area hover triangle assumes a
+         * horizontal approach, so top/bottom are not offered here.
+         * @default 'right'
+         */
+        side?: "left" | "right";
+        className?: string;
+        children?: ReactNode;
+    } & Omit<FloatingProps, "side"> & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
 };

package/dist/types/components/date-picker/date-picker.d.ts

@@ -28,7 +28,7 @@ export type DatePickerHeaderProps = {
 } & Omit<ComponentPropsWithoutRef<'div'>, 'className' | 'children'>;
 export type DatePickerContentProps = {
     /** Optional reference to an anchor element for positioning (defaults to trigger) */
-    anchorRef?: RefObject<HTMLElement>;
+    anchorRef?: RefObject<HTMLElement | null>;
     forceMount?: boolean;
     className?: string;
     children?: ReactNode;
@@ -56,7 +56,7 @@ export type DatePickerRootProps = {
     open?: boolean;
     defaultOpen?: boolean;
     onOpenChange?: (open: boolean) => void;
-    focusOnCloseRef?: RefObject<HTMLElement>;
+    focusOnCloseRef?: RefObject<HTMLElement | null>;
     month?: Date;
     defaultMonth?: Date;
     onMonthChange?: (month: Date) => void;
@@ -83,26 +83,34 @@ export declare const DatePicker: {
         ({ value: controlledValue, defaultValue, onValueChange, open: controlledOpen, defaultOpen, onOpenChange, focusOnCloseRef, month: controlledMonth, defaultMonth, onMonthChange, minYear, maxYear, weekStartsOn, showOutsideDays, showNavigation, monthFormat, name, form, locale, native, closeOnSelect, nativeInputProps, className, children, onKeyDown, ...props }: DatePickerRootProps): ReactElement;
         displayName: string;
     };
-    Trigger: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DatePickerTriggerProps> & {
-        ref?: import('preact').Ref<HTMLButtonElement> | undefined;
-    }>;
+    Trigger: import('react').ForwardRefExoticComponent<{
+        asChild?: boolean;
+        className?: string;
+        children?: ReactNode;
+    } & Omit<Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children" | "className"> & import('react').RefAttributes<HTMLButtonElement>>;
     Portal: {
         ({ container, forceMount, children }: DatePickerPortalProps): ReactElement | null;
         displayName: string;
     };
-    Content: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DatePickerContentProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
+    Content: import('react').ForwardRefExoticComponent<{
+        /** Optional reference to an anchor element for positioning (defaults to trigger) */
+        anchorRef?: RefObject<HTMLElement | null>;
+        forceMount?: boolean;
+        className?: string;
+        children?: ReactNode;
+    } & FloatingProps & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "children" | "className"> & import('react').RefAttributes<HTMLDivElement>>;
     Header: {
         ({ showNavigation: showNavigationProp, className, ...props }: DatePickerHeaderProps): ReactElement;
         displayName: string;
     };
-    MonthSelect: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DatePickerMonthSelectProps> & {
-        ref?: import('preact').Ref<HTMLButtonElement> | undefined;
-    }>;
-    YearSelect: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DatePickerYearSelectProps> & {
-        ref?: import('preact').Ref<HTMLButtonElement> | undefined;
-    }>;
+    MonthSelect: import('react').ForwardRefExoticComponent<{
+        className?: string;
+        contentClassName?: string;
+    } & Omit<Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children" | "className"> & import('react').RefAttributes<HTMLButtonElement>>;
+    YearSelect: import('react').ForwardRefExoticComponent<{
+        className?: string;
+        contentClassName?: string;
+    } & Omit<Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children" | "className"> & import('react').RefAttributes<HTMLButtonElement>>;
     Weekdays: {
         ({ className, ...props }: DatePickerWeekdaysProps): ReactElement;
         displayName: string;
@@ -111,13 +119,18 @@ export declare const DatePicker: {
         ({ className, onKeyDown, onFocus, onBlur, tabIndex, ...props }: DatePickerGridProps): ReactElement;
         displayName: string;
     };
-    Day: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DatePickerDayProps> & {
-        ref?: import('preact').Ref<HTMLButtonElement> | undefined;
-    }>;
-    NativeInput: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DatePickerNativeInputProps> & {
-        ref?: import('preact').Ref<HTMLInputElement> | undefined;
-    }>;
-    HiddenInput: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DatePickerHiddenInputProps> & {
-        ref?: import('preact').Ref<HTMLInputElement> | undefined;
-    }>;
+    Day: import('react').ForwardRefExoticComponent<{
+        date: Date;
+        outside?: boolean;
+        disabled?: boolean;
+        active?: boolean;
+        selected?: boolean;
+        className?: string;
+    } & Omit<Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children" | "className" | "type"> & import('react').RefAttributes<HTMLButtonElement>>;
+    NativeInput: import('react').ForwardRefExoticComponent<{
+        className?: string;
+    } & Omit<Omit<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "value" | "defaultValue" | "className" | "type"> & import('react').RefAttributes<HTMLInputElement>>;
+    HiddenInput: import('react').ForwardRefExoticComponent<{
+        className?: string;
+    } & Omit<Omit<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "value" | "defaultValue" | "className" | "onChange" | "type"> & import('react').RefAttributes<HTMLInputElement>>;
 };

package/dist/types/components/dialog/dialog-actions.d.ts

@@ -1,3 +1,9 @@
+export declare const DIALOG_SHORTCUT_BOUNDARY_ATTRIBUTE = "data-dialog-shortcuts";
+export declare const DIALOG_SHORTCUT_BOUNDARY_VALUE = "block";
+/** An open popup whose Enter commits a pending choice keeps the chord. */
+export declare const dialogShortcutBoundaryProps: (open: boolean) => {
+    [DIALOG_SHORTCUT_BOUNDARY_ATTRIBUTE]: typeof DIALOG_SHORTCUT_BOUNDARY_VALUE | undefined;
+};
 export type DialogShortcutType = 'primary' | 'secondary';
 export type DialogActionRegistration = {
     element: HTMLButtonElement | null;
@@ -11,8 +17,17 @@ export type DialogActionScope = {
     getActionBoundaries: () => Element[];
     focusContent: () => void;
 };
-export declare const DialogActionContext: import('preact').Context<DialogActionScope | undefined>;
+export declare const DialogActionContext: import('react').Context<DialogActionScope | undefined>;
 export declare const getDialogShortcutKeys: (shortcut: DialogShortcutType, targetDocument?: Document | undefined) => string;
+/**
+ * Whether the topmost dialog owns this Enter chord, including inactive or missing actions.
+ * Open widgets can keep local Enter behavior with a `data-dialog-shortcuts="block"` boundary.
+ * Widget handlers return before local side effects or event cancellation when this is true,
+ * leaving the bubbling event and native activation cancellation to the dialog dispatcher.
+ */
+export declare const isDialogShortcutEvent: (keyEvent: KeyboardEvent | {
+    nativeEvent: KeyboardEvent;
+}) => boolean;
 /** One bubbling listener per document, shared by all open dialog content scopes. */
 export declare const activateDialogScope: (document: Document, scope: DialogActionScope) => (() => void);
 export declare const registerDialogAction: (scope: DialogActionScope, shortcut: DialogShortcutType, action: DialogActionRegistration) => (() => void);

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

@@ -1,4 +1,5 @@
 import { ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react';
+import { IconButtonProps } from '../icon-button/icon-button';
 import { StepperDotsProps } from '../stepper';
 import { DialogShortcutType } from './dialog-actions';
 export type DialogRootProps = {
@@ -39,9 +40,10 @@ export type DialogHeaderProps = {
     className?: string;
     children?: ReactNode;
 } & ComponentPropsWithoutRef<'header'>;
-declare const DialogHeader: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DialogHeaderProps> & {
-    ref?: import('preact').Ref<HTMLElement> | undefined;
-}>;
+declare const DialogHeader: import('react').ForwardRefExoticComponent<{
+    className?: string;
+    children?: ReactNode;
+} & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import('react').RefAttributes<HTMLElement>>;
 export type DialogCloseProps = {
     asChild?: boolean;
 } & ComponentPropsWithoutRef<'button'>;
@@ -114,51 +116,86 @@ export declare const Dialog: {
         ({ open: controlledOpen, defaultOpen, onOpenChange, step, defaultStep, onStepChange, children, }: DialogRootProps): ReactElement;
         displayName: string;
     };
-    Trigger: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DialogTriggerProps> & {
-        ref?: import('preact').Ref<HTMLButtonElement> | undefined;
-    }>;
+    Trigger: import('react').ForwardRefExoticComponent<{
+        asChild?: boolean;
+        children: ReactNode;
+    } & Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
     Portal: {
         ({ children, container, forceMount }: DialogPortalProps): ReactElement | null;
         displayName: string;
     };
-    Overlay: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DialogOverlayProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
-    Content: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DialogContentProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
-    Header: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DialogHeaderProps> & {
-        ref?: import('preact').Ref<HTMLElement> | undefined;
-    }>;
-    Close: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DialogCloseProps> & {
-        ref?: import('preact').Ref<HTMLButtonElement> | undefined;
-    }>;
-    Shortcut: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DialogShortcutProps> & {
-        ref?: import('preact').Ref<HTMLButtonElement> | undefined;
-    }>;
-    Title: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DialogTitleProps> & {
-        ref?: import('preact').Ref<HTMLHeadingElement> | undefined;
-    }>;
-    Description: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DialogDescriptionProps> & {
-        ref?: import('preact').Ref<HTMLParagraphElement> | undefined;
-    }>;
-    Body: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DialogBodyProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
-    Footer: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DialogFooterProps> & {
-        ref?: import('preact').Ref<HTMLElement> | undefined;
-    }>;
-    DefaultClose: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<Partial<ComponentPropsWithoutRef<import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<import('../icon-button/icon-button').IconButtonProps> & {
-        ref?: import('preact').Ref<HTMLButtonElement> | undefined;
-    }>>>> & {
-        ref?: import('preact').Ref<HTMLButtonElement> | undefined;
-    }>;
-    DefaultHeader: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DialogDefaultHeaderProps> & {
-        ref?: import('preact').Ref<HTMLElement> | undefined;
-    }>;
-    StepHeader: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<DialogStepHeaderProps> & {
-        ref?: import('preact').Ref<HTMLElement> | undefined;
-    }>;
+    Overlay: import('react').ForwardRefExoticComponent<{
+        className?: string;
+        forceMount?: boolean;
+    } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+    Content: import('react').ForwardRefExoticComponent<{
+        className?: string;
+        children?: ReactNode;
+        /** When false, the dialog is non-modal: no focus trap, no `aria-modal`, no scroll lock, and outside clicks pass through without dismissing it. Defaults to true. */
+        modal?: boolean;
+        forceMount?: boolean;
+        onEscapeKeyDown?: (event: KeyboardEvent) => void;
+        onPointerDownOutside?: (event: PointerEvent) => void;
+        onInteractOutside?: (event: Event) => void;
+        onOpenAutoFocus?: (event: Event) => void;
+        onCloseAutoFocus?: (event: Event) => void;
+    } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+    Header: import('react').ForwardRefExoticComponent<{
+        className?: string;
+        children?: ReactNode;
+    } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import('react').RefAttributes<HTMLElement>>;
+    Close: import('react').ForwardRefExoticComponent<{
+        asChild?: boolean;
+    } & Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
+    Shortcut: import('react').ForwardRefExoticComponent<{
+        /** Register as primary (default) or secondary for this dialog. */
+        shortcut?: DialogShortcutType;
+        /** Compose with a child that forwards its ref to a native button. Defaults to false. */
+        asChild?: boolean;
+        /** Toggle shortcut registration without unmounting or disabling the button. Defaults to true. */
+        shortcutEnabled?: boolean;
+        /** Suppress shortcut activation while the action is pending. */
+        pending?: boolean;
+    } & Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
+    Title: import('react').ForwardRefExoticComponent<{
+        id?: string;
+        asChild?: boolean;
+    } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & import('react').RefAttributes<HTMLHeadingElement>>;
+    Description: import('react').ForwardRefExoticComponent<{
+        id?: string;
+        asChild?: boolean;
+    } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & import('react').RefAttributes<HTMLParagraphElement>>;
+    Body: import('react').ForwardRefExoticComponent<{
+        className?: string;
+        children?: ReactNode;
+    } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+    Footer: import('react').ForwardRefExoticComponent<{
+        className?: string;
+        children?: ReactNode;
+    } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import('react').RefAttributes<HTMLElement>>;
+    DefaultClose: import('react').ForwardRefExoticComponent<Partial<IconButtonProps> & import('react').RefAttributes<HTMLButtonElement>>;
+    DefaultHeader: import('react').ForwardRefExoticComponent<{
+        title: string;
+        titleId?: string;
+        description?: ReactNode;
+        descriptionId?: string;
+        withClose?: boolean;
+    } & Omit<{
+        className?: string;
+        children?: ReactNode;
+    } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import('react').RefAttributes<HTMLElement>, "ref"> & import('react').RefAttributes<HTMLElement>>;
+    StepHeader: import('react').ForwardRefExoticComponent<{
+        step: string;
+        title: string;
+        titleId?: string;
+        description?: ReactNode;
+        descriptionId?: string;
+        helper?: string;
+        withClose?: boolean;
+    } & Omit<{
+        className?: string;
+        children?: ReactNode;
+    } & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import('react').RefAttributes<HTMLElement>, "ref"> & import('react').RefAttributes<HTMLElement>>;
     StepContent: {
         ({ step, locked, children }: DialogStepContentProps): ReactElement;
         displayName: string;

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

@@ -71,18 +71,108 @@ export type GridListActionProps = {
      */
     children: ReactElement;
 };
-export declare const GridList: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<GridListProps> & {
-    ref?: import('preact').Ref<HTMLDivElement> | undefined;
-}> & {
-    Root: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<GridListProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
-    Row: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<GridListRowProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
-    Cell: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<GridListCellProps> & {
-        ref?: import('preact').Ref<HTMLDivElement> | undefined;
-    }>;
+export declare const GridList: import('react').ForwardRefExoticComponent<{
+    baseId?: string;
+    /**
+     * Controlled active cell (use `undefined` for no active cell, omit for uncontrolled)
+     */
+    activeCell?: ActiveCell;
+    /**
+     * Default active cell (uncontrolled mode)
+     */
+    defaultActiveCell?: ActiveCell;
+    /**
+     * Callback when active cell changes
+     */
+    onActiveCellChange?: (cell: ActiveCell | undefined) => void;
+    /**
+     * Whether the entire grid is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Whether to loop navigation at boundaries
+     * @default false
+     */
+    loop?: boolean;
+    /**
+     * Accessible label for the grid
+     */
+    label?: string;
+    /**
+     * ID of element that labels this grid (alternative to label)
+     */
+    labelledBy?: string;
+    /**
+     * ID of element that describes this grid (for additional context)
+     */
+    describedBy?: string;
+    className?: string;
+    children?: ReactNode;
+} & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "role"> & import('react').RefAttributes<HTMLDivElement>> & {
+    Root: import('react').ForwardRefExoticComponent<{
+        baseId?: string;
+        /**
+         * Controlled active cell (use `undefined` for no active cell, omit for uncontrolled)
+         */
+        activeCell?: ActiveCell;
+        /**
+         * Default active cell (uncontrolled mode)
+         */
+        defaultActiveCell?: ActiveCell;
+        /**
+         * Callback when active cell changes
+         */
+        onActiveCellChange?: (cell: ActiveCell | undefined) => void;
+        /**
+         * Whether the entire grid is disabled
+         */
+        disabled?: boolean;
+        /**
+         * Whether to loop navigation at boundaries
+         * @default false
+         */
+        loop?: boolean;
+        /**
+         * Accessible label for the grid
+         */
+        label?: string;
+        /**
+         * ID of element that labels this grid (alternative to label)
+         */
+        labelledBy?: string;
+        /**
+         * ID of element that describes this grid (for additional context)
+         */
+        describedBy?: string;
+        className?: string;
+        children?: ReactNode;
+    } & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "role"> & import('react').RefAttributes<HTMLDivElement>>;
+    Row: import('react').ForwardRefExoticComponent<{
+        /**
+         * Unique identifier for this row
+         */
+        id: string;
+        /**
+         * Whether this row is disabled
+         */
+        disabled?: boolean;
+        className?: string;
+        children?: ReactNode;
+    } & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "id" | "role"> & import('react').RefAttributes<HTMLDivElement>>;
+    Cell: import('react').ForwardRefExoticComponent<{
+        /**
+         * Whether this cell is disabled
+         */
+        disabled?: boolean;
+        /**
+         * Whether this cell participates in keyboard navigation.
+         * Set to false for cells with static content (labels, badges).
+         * @default true
+         */
+        interactive?: boolean;
+        className?: string;
+        children?: ReactNode;
+    } & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "role"> & import('react').RefAttributes<HTMLDivElement>>;
     Action: {
         ({ children }: GridListActionProps): ReactElement;
         displayName: string;

package/dist/types/components/icon-button/icon-button.d.ts

@@ -1,5 +1,5 @@
 import { VariantProps } from 'class-variance-authority';
-import { ComponentPropsWithoutRef } from 'react';
+import { ComponentPropsWithoutRef, ForwardRefExoticComponent, RefAttributes } from 'react';
 import { ButtonIconProps, ButtonVariantsProps } from '../button';
 import { LucideIcon } from '../../types';
 export type IconButtonVariantsProps = VariantProps<typeof iconButtonVariants> & ButtonVariantsProps & ButtonIconProps;
@@ -12,10 +12,11 @@ declare const iconButtonVariants: (props?: ({
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type IconButtonProps = {
     icon: LucideIcon;
+    /** Explicit accessible action name; title and label are not naming fallbacks. */
+    'aria-label': string;
     iconClassName?: string;
     disabled?: boolean;
-} & IconButtonVariantsProps & ComponentPropsWithoutRef<'button'>;
-export declare const IconButton: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<IconButtonProps> & {
-    ref?: import('preact').Ref<HTMLButtonElement> | undefined;
-}>;
+    label?: never;
+} & IconButtonVariantsProps & Omit<ComponentPropsWithoutRef<'button'>, 'aria-label'>;
+export declare const IconButton: ForwardRefExoticComponent<IconButtonProps & RefAttributes<HTMLButtonElement>>;
 export {};

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

@@ -27,10 +27,32 @@ export type InputProps = {
     highlightRef?: Ref<HTMLDivElement>;
     className?: string;
 } & ComponentPropsWithoutRef<'input'>;
-export declare const Input: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<InputProps> & {
-    ref?: Ref<HTMLInputElement> | undefined;
-}> & {
-    Addon: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<InputAddonProps> & {
-        ref?: Ref<HTMLDivElement> | undefined;
-    }>;
+export declare const Input: import('react').ForwardRefExoticComponent<{
+    label?: string;
+    description?: ReactNode;
+    error?: string;
+    startAddon?: string | ReactNode;
+    endAddon?: string | ReactNode;
+    disabled?: boolean;
+    readOnly?: boolean;
+    /**
+     * Indicates an in-flight async operation on the field. Forces read-only behavior,
+     * shows a progress cursor and an animated shimmer overlay, and suppresses the error display.
+     * Takes priority over `error`.
+     */
+    processing?: boolean;
+    /**
+     * Applies a one-shot attention-blink ring around the field (not the label/error). Pair with
+     * `useBlinkAttention` for the trigger logic.
+     */
+    highlight?: boolean;
+    /**
+     * Ref to the field's container element — the one that wears the blink ring. Pass the same ref
+     * to `useBlinkAttention` so the hook can restart the CSS animation directly via the DOM. When
+     * provided, `highlight` becomes optional; the hook drives the class on its own.
+     */
+    highlightRef?: Ref<HTMLDivElement>;
+    className?: string;
+} & Omit<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & import('react').RefAttributes<HTMLInputElement>> & {
+    Addon: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
 };

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

@@ -7,6 +7,10 @@ export type LinkProps = {
     leftIcon?: LucideIcon | boolean;
     rightIcon?: LucideIcon | boolean;
 } & ComponentPropsWithoutRef<'a'>;
-export declare const Link: import('preact').FunctionalComponent<import('preact/compat').PropsWithoutRef<LinkProps> & {
-    ref?: import('preact').Ref<HTMLAnchorElement> | undefined;
-}>;
+export declare const Link: import('react').ForwardRefExoticComponent<{
+    href: string;
+    external?: boolean | "auto";
+    newTab?: boolean;
+    leftIcon?: LucideIcon | boolean;
+    rightIcon?: LucideIcon | boolean;
+} & Omit<import('react').DetailedHTMLProps<import('react').AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & import('react').RefAttributes<HTMLAnchorElement>>;