Class IgcDropdownComponent

Represents a DropDown component.

element

igc-dropdown

fires

igcChange - Emitted when the selected item changes.

fires

igcOpening - Emitted just before the dropdown is open.

fires

igcOpened - Emitted after the dropdown is open.

fires

igcClosing - Emitter just before the dropdown is closed.

fires

igcClosed - Emitted after closing the dropdown.

slot

target - Renders the dropdown's target element.

slot
  • Renders the dropdown list items.
csspart

base - The dropdown list wrapper.

csspart

list - The dropdown list.

Hierarchy

  • SizableInterface<this> & EventEmitterInterface<IgcDropdownEventMap, this> & LitElement<this>
    • IgcDropdownComponent

Implements

  • IgcToggleComponent

Index

Constructors

Properties

distance: number = 0

The distance from the target element.

flip: boolean = false

Whether the component should be flipped to the opposite side of the target once it's about to overflow the visible area. When true, once enough space is detected on its preferred side, it will flip back.

keepOpenOnOutsideClick: boolean = false

Whether the component should be kept open on clicking outside of it.

keepOpenOnSelect: boolean = false

Whether the dropdown should be kept open on selection.

open: boolean = false

Sets the open state of the component.

placement: IgcPlacement = 'bottom-start'

The preferred placement of the component around the target element.

positionStrategy: "fixed" | "absolute" = 'absolute'

Sets the component's positioning strategy.

sameWidth: boolean = false

Whether the dropdown's width should be the same as the target's one.

scrollStrategy: "block" | "close" | "scroll" = 'scroll'

Determines the behavior of the component during scrolling the container.

size: "small" | "medium" | "large"

Determines the size of the component.

styles: CSSResult = styles
tagName: "igc-dropdown" = 'igc-dropdown'

Methods

  • clearSelection(): void
  • emitEvent<K, D>(type: K, eventInitDict?: CustomEventInit<D>): boolean
  • firstUpdated(): Promise<void>
  • hide(): void
  • show(target?: HTMLElement): void
  • toggle(target?: HTMLElement): void