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

Hierarchy

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

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"
    | "bottom"
    | "top" = "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 typeof nothing | TemplateResult<1>

updates

  • Invoked when the element is first updated. Implement to perform one time work on the element after update.

    firstUpdated() {
    this.renderRoot.getElementById('my-text-area').focus();
    }

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

    Returns void

  • 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