@navikt/ds-react/esm/dialog/popup/DialogPopupInternal.d.ts

React components from the Norwegian Labour and Welfare Administration.

import React from "react";
interface DialogPopupInternalProps extends React.HTMLAttributes<HTMLDivElement> {
    /**
     * Determines if the dialog enters a modal state when open.
     * - `true`: user interaction is limited to just the dialog: focus is trapped, document page scroll is locked, and pointer interactions on outside elements are disabled.
     * - `'trap-focus'`: focus is trapped inside the dialog, but document page scroll is not locked and pointer interactions outside of it remain enabled.
     * @default true
     */
    modal?: true | "trap-focus";
    /**
     * Determines if the dialog should close on outside clicks.
     * @default true
     */
    closeOnOutsideClick?: boolean;
    /**
     * Will try to focus the given element on mount.
     *
     * If not provided, Dialog will focus the popup itself.
     */
    initialFocusTo?: React.RefObject<HTMLElement | null> | (() => HTMLElement | null | undefined);
    /**
     * Will try to focus the given element on unmount.
     *
     * If not provided, Dialog will try to focus the `Dialog.Trigger` element
     * or the last focused element before the dialog opened.
     */
    returnFocusTo?: React.RefObject<HTMLElement | null> | (() => HTMLElement | null | undefined);
    /**
     * The position of the dialog relative to the viewport.
     * @default "center"
     */
    position?: "center" | "bottom" | "left" | "right" | "fullscreen";
    /**
     * CSS `width`
     *
     * Has no effect when `position` is set to `fullscreen`.
     *
     * @default "medium"
     */
    width?: (string & {}) | "small" | "medium" | "large";
    /**
     * CSS `height`
     *
     * Has no effect when `position` is set to `fullscreen`, `left` or `right`.
     */
    height?: (string & {}) | "small" | "medium" | "large";
    /**
     * Adds a backdrop behind the dialog popup.
     * @default true if `modal={true}`, else `false`
     */
    withBackdrop?: boolean;
    /**
     * ARIA role for the dialog popup.
     * @default "dialog"
     */
    role?: "dialog" | "alertdialog";
}
declare const DialogPopupInternal: React.ForwardRefExoticComponent<DialogPopupInternalProps & React.RefAttributes<HTMLDivElement>>;
export { DialogPopupInternal };
export type { DialogPopupInternalProps };