Class ZetaButtonGroupItem

Button which is used by button groups.

Slot

  • Button label content.

Slot

icon - Icon to display on leading side of button. Full list of icons can be found at https://zeta-icons.web.app/

Figma

https://www.figma.com/design/JesXQFLaPJLc1BdBM4sisI/🦓-ZDS---Components?node-id=229-45&node-type=canvas&m=dev

Storybook

https://zeta-ds.web.app/web/storybook/index.html?path=/docs/button-group--docs

Hierarchy

  • ContourableInterface<this> & LitElement<this> & InteractiveInterface<this>
    • ZetaButtonGroupItem

Other

constructor disabled icon? name? onclick rounded showDropdown? size shadowRootOptions styles blur focus

rendering

render

Other

constructor

  • new ZetaButtonGroupItem(): ZetaButtonGroupItem

  • Returns ZetaButtonGroupItem

disabled

disabled: boolean

Optionalicon

icon?: Node[]

Optionalname

name?: string

Name for the button, used if the button is in a form.

onclick

onclick: null | ((this: GlobalEventHandlers, ev: MouseEvent) => unknown) = null

Fires when the user clicks the left mouse button on the object

Param: ev

The mouse event.

MDN Reference

rounded

rounded: boolean

OptionalshowDropdown

showDropdown?: boolean = false

Whether to show the dropdown icon.

size

size: "medium" | "large" = "medium"

Size of button.

StaticshadowRootOptions

shadowRootOptions: ShadowRootInit = ...

Staticstyles

styles: CSSResultGroup[] = ...

blur

focus

rendering

Protectedrender

  • render(): TemplateResult<1>

  • Invoked on each update to perform rendering tasks. This method may return any value renderable by lit-html's ChildPart - typically a TemplateResult. Setting properties inside this method will not trigger the element to update.

    Returns TemplateResult<1>

Settings

Member Visibility

On This Page

Other
rendering