A custom HTML element which allows for arbitrary assignment of a set of string tags. This element may be used directly or subclassed to impose additional validation or functionality.

Hierarchy (View Summary)

Constructors

Properties

_value: Set<any>
_internals: ElementInternals

Attached ElementInternals which provides form handling functionality.

_primaryInput: HTMLElement

The primary input (if any). Used to determine what element should receive focus when an associated label is clicked on.

formAssociated: boolean = true

Declare that this custom element provides form element functionality.

observedAttributes: string[] = ...

Attributes requiring change notifications

tagName: string = "string-tags"

Accessors

  • get abortSignal(): AbortSignal

    An AbortSignal that can be passed to event listeners registered in subclasses. The signal will ensure that the listener is removed when the element is disconnected from the DOM. Not available in the constructor.

    Returns AbortSignal

  • get disabled(): boolean

    Is this element disabled?

    Returns boolean

  • get editable(): boolean

    Is this field editable? The field can be neither disabled nor readonly.

    Returns boolean

  • get form(): HTMLFormElement

    The form this element belongs to.

    Returns HTMLFormElement

  • get name(): string

    The input element name.

    Returns string

Methods

  • Internal

    Apply key attributes on the containing custom HTML element to input elements contained within it.

    Parameters

    • input: HTMLElement

    Returns void

  • Protected

    A method provided for subclasses to perform tear-down workflows as an alternative to overriding disconnectedCallback.

    Returns void

  • Protected

    Initialize innerText or an initial value attribute of the element as a comma-separated list of currently assigned string tags.

    Parameters

    • Optionalvalues: string[]

      An array of initial values.

    Returns void

  • Protected

    Special handling when the custom element is clicked. This should be implemented to transfer focus to an appropriate internal element.

    Parameters

    • event: PointerEvent

    Returns void

  • Protected

    Subclasses may impose more strict validation on what tags are allowed.

    Parameters

    • tag: string

      A candidate tag

    Returns void

    An error if the candidate tag is not allowed

  • Render the tagged string as an HTML element.

    Parameters

    • tag: string

      The raw tag value

    • Optionallabel: string

      An optional tag label

    • Optionaleditable: boolean = true

      Is the tag editable?

    Returns HTMLDivElement

    A rendered HTML element for the tag