Interface Props

Props for the Popover component.

interface Props {
    anchorEl:
        | undefined
        | null
        | Element
        | PopoverVirtualElement
        | () => null | Element | PopoverVirtualElement;
    backgroundColor?:
        | "primary"
        | "blue5"
        | "white"
        | "textFaded"
        | "navigation"
        | "navigationTop"
        | "navigationSide"
        | "background"
        | "drawer"
        | "cards"
        | "cardDivider"
        | "cardSectionSeparator"
        | "fieldsOnCard"
        | "fieldsFloating"
        | "buttonSecondary"
        | "iconsDisabled"
        | "red"
        | "orange"
        | "greenDark"
        | "greenLight"
        | "text"
        | "redDark"
        | "orangeDark"
        | "greenDark2"
        | "blueDark"
        | "lineColor"
        | "iconButtonBg";
    children: ReactNode;
    onClose: (event: {}, reason: "backdropClick" | "escapeKeyDown") => void;
}

Hierarchy

  • Omit<MUIPopoverProps, "open">
    • Props

Properties

anchorEl backgroundColor? children onClose

Properties

anchorEl

anchorEl:
    | undefined
    | null
    | Element
    | PopoverVirtualElement
    | () => null | Element | PopoverVirtualElement

An HTML element, or a function that returns one. This is the element that the popover will be anchored to.

OptionalbackgroundColor

backgroundColor?:
    | "primary"
    | "blue5"
    | "white"
    | "textFaded"
    | "navigation"
    | "navigationTop"
    | "navigationSide"
    | "background"
    | "drawer"
    | "cards"
    | "cardDivider"
    | "cardSectionSeparator"
    | "fieldsOnCard"
    | "fieldsFloating"
    | "buttonSecondary"
    | "iconsDisabled"
    | "red"
    | "orange"
    | "greenDark"
    | "greenLight"
    | "text"
    | "redDark"
    | "orangeDark"
    | "greenDark2"
    | "blueDark"
    | "lineColor"
    | "iconButtonBg"

The background color of the popover content. Values can be 'primary' | 'failure' | 'warning' | 'success' | 'lightGray' | 'darkGray' | 'text', or any valid CSS color string (e.g., hex, rgb, etc). Defaults to 'cards'.

children

children: ReactNode

The content of the popover.

onClose

onClose: (event: {}, reason: "backdropClick" | "escapeKeyDown") => void

Callback fired when the component requests to be closed.

Type declaration

    • (event: {}, reason: "backdropClick" | "escapeKeyDown"): void

    • Parameters

      • event: {}

        The event source of the callback.

      • reason: "backdropClick" | "escapeKeyDown"

        Can be: "backdropClick", "escapeKeyDown".

      Returns void

Settings

Member Visibility

On This Page

Properties