@zebra-fed/zeta-web
    Preparing search index...

    Class ZetaDroppable

    Zeta Droppable is a container that can be opened and closed and can be attached to an anchor which will determine it's position.

    https://www.figma.com/file/JesXQFLaPJLc1BdBM4sisI/🦓-ZDS---Components?node-id=22391-10146

    https://zeta-ds.web.app/web/storybook/?path=/docs/dropdown--docs

    Hierarchy

    • ContourableInterface<this> & LitElement<this>
      • ZetaDroppable
    Index

    Other

    constructor alignment? anchor? direction? matchParentWidth open rounded slottedElements styles

    rendering

    render

    updates

    updated

    Other

    • Returns ZetaDroppable

    alignment?: "start" | "end" | "center"

    The alignment of the droppable relative to the anchor

    anchor?: HTMLElement

    The anchor element to position the droppable

    direction?: "left" | "right" | "top" | "bottom" = "bottom"

    The direction of the droppable relative to the anchor

    matchParentWidth: boolean = false

    Controls whether the droppable is fit to the width of the anchor

    open: boolean = false

    Controls the open state of the droppable.

    rounded: boolean
    slottedElements: HTMLElement[]
    styles: CSSResultGroup[] = ...

    rendering

    • 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> | typeof nothing

    updates

    • Invoked whenever the element is updated. Implement to perform post-updating tasks via DOM APIs, for example, focusing an element.

      Setting properties inside this method will trigger the element to update again after this update cycle completes.

      Returns void

    Settings

    Member Visibility

    On This Page

    Other
    rendering
    updates