Intro
Dropdown er en generisk menykomponent som åpnes i en popover ved klikk.
Egnet til å:
- Bruker-meny i header
- Liste med handlinger for en tabellrad
Eksempler
Props
Dropdown
- onSelect? ((element: MouseEvent<Element, MouseEvent>) => void)
- closeOnSelect?boolean
- Handler that is called when an item is selected.
- Whether the Menu closes when a selection is made.
Dropdown.Toggle
- as? React.ElementType
- children ReactNode
- className? string
- ref? Ref<HTMLButtonElement>
- OverridableComponent-api
- Button content
- Dropdown.Toggle extends HTMLButtonElement
Dropdown.Menu
- children ReactNode
- onClose? (() => void)
- strategy?"fixed" | "absolute"
- placement? "top" | "bottom" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end"
- className? string
- ref? Ref<HTMLDivElement>
- Dropdown content
- onClose callback
- Popover positionion strategy
- Dropdown.Menu extends HTMLDivElement
Dropdown.Menu.Item
- children ReactNode
- className? string
- ref? Ref<HTMLButtonElement>
- Menu item content
- Dropdown.Menu.Item extends HTMLButtonElement
Dropdown.Menu.List
- children ReactNode
- className? string
- ref? Ref<HTMLUListElement>
- Menu list content
- Dropdown.Menu.List extends HTMLUListElement
Dropdown.Menu.List.Item
- children ReactNode
- className? string
- ref? Ref<HTMLButtonElement>
- Menu item content
- Dropdown.Menu.List.Item extends HTMLButtonElement
Dropdown.Menu.GroupedList.Heading
- children ReactNode
- className? string
- ref? Ref<HTMLElement>
- Heading
- Dropdown.Menu.GroupedList.Heading extends HTMLElement
Dropdown.Menu.GroupedList.Item
- as? React.ElementType
- children ReactNode
- className? string
- ref? Ref<HTMLButtonElement>
- OverridableComponent-api
- Menu item content
- Dropdown.Menu.GroupedList.Item extends HTMLButtonElement