@navikt/ds-react/cjs/overlays/floating/Floating.d.ts

React components from the Norwegian Labour and Welfare Administration.

import { FlipOptions } from "@floating-ui/react-dom";
import React, { HTMLAttributes } from "react";
import { AsChildProps } from "../../util/types";
import { type Align, type Measurable, type Side } from "./Floating.utils";
/**
 * Floating Root
 */
type FloatingContextValue = {
    anchor: Measurable | null;
    onAnchorChange: (anchor: Measurable | null) => void;
};
export declare const FloatingProvider: React.ForwardRefExoticComponent<FloatingContextValue & {
    children: React.ReactNode;
} & React.RefAttributes<unknown>>, useFloatingContext: <S extends boolean = true>(strict?: S) => S extends true ? FloatingContextValue : FloatingContextValue | undefined;
interface FloatingProps {
    children: React.ReactNode;
}
interface FloatingComponent extends React.FC<FloatingProps> {
    Anchor: typeof FloatingAnchor;
    Content: typeof FloatingContent;
}
declare const Floating: FloatingComponent;
/**
 * Floating Anchor
 */
type FloatingAnchorProps = HTMLAttributes<HTMLDivElement> & AsChildProps & {
    virtualRef?: React.RefObject<Measurable>;
};
/**
 * `FloatingAnchor` provides an anchor for a Floating instance.
 * Allows anchoring to non-DOM nodes like a cursor position when used with `virtualRef`.
 */
declare const FloatingAnchor: React.ForwardRefExoticComponent<FloatingAnchorProps & React.RefAttributes<HTMLDivElement>>;
type Boundary = Element | null;
interface FloatingContentProps extends HTMLAttributes<HTMLDivElement> {
    side?: Side;
    sideOffset?: number;
    align?: Align;
    alignOffset?: number;
    avoidCollisions?: boolean;
    collisionBoundary?: Boundary | Boundary[];
    collisionPadding?: number | Partial<Record<Side, number>>;
    hideWhenDetached?: boolean;
    updatePositionStrategy?: "optimized" | "always";
    fallbackPlacements?: FlipOptions["fallbackPlacements"];
    onPlaced?: () => void;
    /**
     * @default true
     */
    enabled?: boolean;
    /**
     * Only use this option if your floating element is conditionally rendered, not hidden with CSS.
     * @default true
     */
    autoUpdateWhileMounted?: boolean;
    arrow?: {
        className?: string;
        padding?: number;
        width: number;
        height: number;
    };
}
declare const FloatingContent: React.ForwardRefExoticComponent<FloatingContentProps & React.RefAttributes<HTMLDivElement>>;
export { Floating };