@navikt/ds-react/cjs/overlays/dismissablelayer/DismissableLayer.d.ts

React components from the Norwegian Labour and Welfare Administration.

import React from "react";
import type { AsChild } from "../../utils/types/AsChild";
import { CustomFocusEvent, CustomPointerEvent } from "./util/dispatchCustomEvent";
interface DismissableLayerBaseProps extends React.HTMLAttributes<HTMLDivElement> {
    /**
     * When `true`, hover/focus/click interactions will be disabled on elements outside
     * the `DismissableLayer`. Users will need to click twice on outside elements to
     * interact with them: once to close the `DismissableLayer`, and again to trigger the element.
     */
    disableOutsidePointerEvents?: boolean;
    /**
     * Event handler called when the escape key is down.
     * Can be prevented.
     */
    onEscapeKeyDown?: (event: KeyboardEvent) => void;
    /**
     * Event handler called when the a `pointerdown` event happens outside of the `DismissableLayer`.
     * Can be prevented.
     */
    onPointerDownOutside?: (event: CustomPointerEvent) => void;
    /**
     * Event handler called when the a `pointerup` event happens outside of the `DismissableLayer`.
     * Can be prevented.
     */
    onPointerUpOutside?: (event: CustomPointerEvent) => void;
    /**
     * Enables listening for `pointerup` outside the `DismissableLayer`.
     * In most cases `pointerdown` is sufficient, but in some cases (like modal, drawer)
     * we want to mimic native OS behaviour and only close on `pointerup`.
     * @default false
     */
    enablePointerUpOutside?: boolean;
    /**
     * Event handler called when the focus moves outside of the `DismissableLayer`.
     * Can be prevented.
     */
    onFocusOutside?: (event: CustomFocusEvent) => void;
    /**
     * Event handler called when an interaction happens outside the `DismissableLayer`.
     * Specifically, when a `pointerdown` event happens outside or focus moves outside of it.
     * Can be prevented.
     */
    onInteractOutside?: (event: CustomPointerEvent | CustomFocusEvent) => void;
    /**
     * Handler called when the `DismissableLayer` should be dismissed
     */
    onDismiss?: (event: Event) => void;
    /**
     * Stops `onDismiss` from beeing called when interacting with the `safeZone` elements.
     * - anchor: The element that should be considered safe to interact with.
     */
    safeZone?: {
        anchor?: Element | null;
    };
    /**
     * @default true
     */
    enabled?: boolean;
}
type DismissableLayerProps = DismissableLayerBaseProps & AsChild;
declare const DismissableLayer: React.ForwardRefExoticComponent<DismissableLayerProps & React.RefAttributes<HTMLDivElement>>;
export { DismissableLayer, type DismissableLayerProps };