Class FlowyDiagram

FlowyDiagram a webcomponent containing a canvas to manage diagram drawing

Tag

<flowy-diagram>

Hierarchy

  • HTMLElement
  • LitElement
    • FlowyDiagram

Constructors

Properties - Other

ATTRIBUTE_NODE CDATA_SECTION_NODE COMMENT_NODE DOCUMENT_FRAGMENT_NODE DOCUMENT_NODE DOCUMENT_POSITION_CONTAINED_BY DOCUMENT_POSITION_CONTAINS DOCUMENT_POSITION_DISCONNECTED DOCUMENT_POSITION_FOLLOWING DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC DOCUMENT_POSITION_PRECEDING DOCUMENT_TYPE_NODE ELEMENT_NODE ENTITY_NODE ENTITY_REFERENCE_NODE NOTATION_NODE PROCESSING_INSTRUCTION_NODE TEXT_NODE accessKey accessKeyLabel ariaAtomic ariaAutoComplete ariaBusy ariaChecked ariaColCount ariaColIndex ariaColIndexText ariaColSpan ariaCurrent ariaDisabled ariaExpanded ariaHasPopup ariaHidden ariaInvalid ariaKeyShortcuts ariaLabel ariaLevel ariaLive ariaModal ariaMultiLine ariaMultiSelectable ariaOrientation ariaPlaceholder ariaPosInSet ariaPressed ariaReadOnly ariaRequired ariaRoleDescription ariaRowCount ariaRowIndex ariaRowIndexText ariaRowSpan ariaSelected ariaSetSize ariaSort ariaValueMax ariaValueMin ariaValueNow ariaValueText assignedSlot attributes autocapitalize autofocus baseURI childElementCount childNodes children classList className clientHeight clientLeft clientTop clientWidth contentEditable dataset deleteUnlinkBlockOnDrag dir draggable enterKeyHint firstChild firstElementChild hidden id inert innerHTML innerText inputMode isConnected isContentEditable lang lastChild lastElementChild localName namespaceURI nextElementSibling nextSibling nodeName nodeType nodeValue nonce? offsetHeight offsetLeft offsetParent offsetTop offsetWidth onabort onanimationcancel onanimationend onanimationiteration onanimationstart onauxclick onbeforeinput onblur oncancel oncanplay oncanplaythrough onchange onclick onclose oncontextmenu oncopy oncuechange oncut ondblclick ondrag ondragend ondragenter ondragleave ondragover ondragstart ondrop ondurationchange onemptied onended onerror onfocus onformdata onfullscreenchange onfullscreenerror ongotpointercapture oninput oninvalid onkeydown onkeypress onkeyup onload onloadeddata onloadedmetadata onloadstart onlostpointercapture onmousedown onmouseenter onmouseleave onmousemove onmouseout onmouseover onmouseup onpaste onpause onplay onplaying onpointercancel onpointerdown onpointerenter onpointerleave onpointermove onpointerout onpointerover onpointerup onprogress onratechange onreset onresize onscroll onsecuritypolicyviolation onseeked onseeking onselect onselectionchange onselectstart onslotchange onstalled onsubmit onsuspend ontimeupdate ontoggle ontouchcancel? ontouchend? ontouchmove? ontouchstart? ontransitioncancel ontransitionend ontransitionrun ontransitionstart onvolumechange onwaiting onwebkitanimationend onwebkitanimationiteration onwebkitanimationstart onwebkittransitionend onwheel outerHTML outerText output ownerDocument parentElement parentNode part prefix previousElementSibling previousSibling role scrollHeight scrollLeft scrollTop scrollWidth shadowRoot slot spacing_x spacing_y spellcheck style tabIndex tagName textContent title translate _$litElement$ _initializers?

Properties - dev-mode

Properties - properties

Properties - rendering

Properties - styles

Properties - updates

Accessors - attributes

Accessors - updates

Methods - Other

Methods - attributes

Methods - controllers

Methods - lifecycle

Methods - properties

Methods - updates

Constructors

  • Returns FlowyDiagram

Properties - Other

ATTRIBUTE_NODE: number
CDATA_SECTION_NODE: number

node is a CDATASection node.

COMMENT_NODE: number

node is a Comment node.

DOCUMENT_FRAGMENT_NODE: number

node is a DocumentFragment node.

DOCUMENT_NODE: number

node is a document.

DOCUMENT_POSITION_CONTAINED_BY: number

Set when other is a descendant of node.

DOCUMENT_POSITION_CONTAINS: number

Set when other is an ancestor of node.

DOCUMENT_POSITION_DISCONNECTED: number

Set when node and other are not in the same tree.

DOCUMENT_POSITION_FOLLOWING: number

Set when other is following node.

DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC: number
DOCUMENT_POSITION_PRECEDING: number

Set when other is preceding node.

DOCUMENT_TYPE_NODE: number

node is a doctype.

ELEMENT_NODE: number

node is an element.

ENTITY_NODE: number
ENTITY_REFERENCE_NODE: number
NOTATION_NODE: number
PROCESSING_INSTRUCTION_NODE: number

node is a ProcessingInstruction node.

TEXT_NODE: number

node is a Text node.

accessKey: string
accessKeyLabel: string
ariaAtomic: null | string
ariaAutoComplete: null | string
ariaBusy: null | string
ariaChecked: null | string
ariaColCount: null | string
ariaColIndex: null | string
ariaColIndexText: null | string
ariaColSpan: null | string
ariaCurrent: null | string
ariaDisabled: null | string
ariaExpanded: null | string
ariaHasPopup: null | string
ariaHidden: null | string
ariaInvalid: null | string
ariaKeyShortcuts: null | string
ariaLabel: null | string
ariaLevel: null | string
ariaLive: null | string
ariaModal: null | string
ariaMultiLine: null | string
ariaMultiSelectable: null | string
ariaOrientation: null | string
ariaPlaceholder: null | string
ariaPosInSet: null | string
ariaPressed: null | string
ariaReadOnly: null | string
ariaRequired: null | string
ariaRoleDescription: null | string
ariaRowCount: null | string
ariaRowIndex: null | string
ariaRowIndexText: null | string
ariaRowSpan: null | string
ariaSelected: null | string
ariaSetSize: null | string
ariaSort: null | string
ariaValueMax: null | string
ariaValueMin: null | string
ariaValueNow: null | string
ariaValueText: null | string
assignedSlot: null | HTMLSlotElement
attributes: NamedNodeMap
autocapitalize: string
autofocus: boolean
baseURI: string

Returns node's node document's document base URL.

childElementCount: number
childNodes: NodeListOf<ChildNode>

Returns the children.

children: HTMLCollection

Returns the child elements.

classList: DOMTokenList

Allows for manipulation of element's class content attribute as a set of whitespace-separated tokens through a DOMTokenList object.

className: string

Returns the value of element's class content attribute. Can be set to change it.

clientHeight: number
clientLeft: number
clientTop: number
clientWidth: number
contentEditable: string
dataset: DOMStringMap
deleteUnlinkBlockOnDrag: boolean = false
dir: string
draggable: boolean
enterKeyHint: string
firstChild: null | ChildNode

Returns the first child.

firstElementChild: null | Element

Returns the first child that is an element, and null otherwise.

hidden: boolean
id: string

Returns the value of element's id content attribute. Can be set to change it.

inert: boolean
innerHTML: string
innerText: string
inputMode: string
isConnected: boolean

Returns true if node is connected and false otherwise.

isContentEditable: boolean
lang: string
lastChild: null | ChildNode

Returns the last child.

lastElementChild: null | Element

Returns the last child that is an element, and null otherwise.

localName: string

Returns the local name.

namespaceURI: null | string

Returns the namespace.

nextElementSibling: null | Element

Returns the first following sibling that is an element, and null otherwise.

nextSibling: null | ChildNode

Returns the next sibling.

nodeName: string

Returns a string appropriate for the type of node.

nodeType: number

Returns the type of node.

nodeValue: null | string
nonce?: string
offsetHeight: number
offsetLeft: number
offsetParent: null | Element
offsetTop: number
offsetWidth: number
onabort: null | ((this: GlobalEventHandlers, ev: UIEvent) => any)

Fires when the user aborts the download.

Param

The event.

onanimationcancel: null | ((this: GlobalEventHandlers, ev: AnimationEvent) => any)
onanimationend: null | ((this: GlobalEventHandlers, ev: AnimationEvent) => any)
onanimationiteration: null | ((this: GlobalEventHandlers, ev: AnimationEvent) => any)
onanimationstart: null | ((this: GlobalEventHandlers, ev: AnimationEvent) => any)
onauxclick: null | ((this: GlobalEventHandlers, ev: MouseEvent) => any)
onbeforeinput: null | ((this: GlobalEventHandlers, ev: InputEvent) => any)
onblur: null | ((this: GlobalEventHandlers, ev: FocusEvent) => any)

Fires when the object loses the input focus.

Param

The focus event.

oncancel: null | ((this: GlobalEventHandlers, ev: Event) => any)
oncanplay: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when playback is possible, but would require further buffering.

Param

The event.

oncanplaythrough: null | ((this: GlobalEventHandlers, ev: Event) => any)
onchange: null | ((this: GlobalEventHandlers, ev: Event) => any)

Fires when the contents of the object or selection have changed.

Param

The event.

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

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

Param

The mouse event.

onclose: null | ((this: GlobalEventHandlers, ev: Event) => any)
oncontextmenu: null | ((this: GlobalEventHandlers, ev: MouseEvent) => any)

Fires when the user clicks the right mouse button in the client area, opening the context menu.

Param

The mouse event.

oncopy: null | ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any)
oncuechange: null | ((this: GlobalEventHandlers, ev: Event) => any)
oncut: null | ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any)
ondblclick: null | ((this: GlobalEventHandlers, ev: MouseEvent) => any)

Fires when the user double-clicks the object.

Param

The mouse event.

ondrag: null | ((this: GlobalEventHandlers, ev: DragEvent) => any)

Fires on the source object continuously during a drag operation.

Param

The event.

ondragend: null | ((this: GlobalEventHandlers, ev: DragEvent) => any)

Fires on the source object when the user releases the mouse at the close of a drag operation.

Param

The event.

ondragenter: null | ((this: GlobalEventHandlers, ev: DragEvent) => any)

Fires on the target element when the user drags the object to a valid drop target.

Param

The drag event.

ondragleave: null | ((this: GlobalEventHandlers, ev: DragEvent) => any)

Fires on the target object when the user moves the mouse out of a valid drop target during a drag operation.

Param

The drag event.

ondragover: null | ((this: GlobalEventHandlers, ev: DragEvent) => any)

Fires on the target element continuously while the user drags the object over a valid drop target.

Param

The event.

ondragstart: null | ((this: GlobalEventHandlers, ev: DragEvent) => any)

Fires on the source object when the user starts to drag a text selection or selected object.

Param

The event.

ondrop: null | ((this: GlobalEventHandlers, ev: DragEvent) => any)
ondurationchange: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when the duration attribute is updated.

Param

The event.

onemptied: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when the media element is reset to its initial state.

Param

The event.

onended: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when the end of playback is reached.

Param

The event

onerror: OnErrorEventHandler

Fires when an error occurs during object loading.

Param

The event.

onfocus: null | ((this: GlobalEventHandlers, ev: FocusEvent) => any)

Fires when the object receives focus.

Param

The event.

onformdata: null | ((this: GlobalEventHandlers, ev: FormDataEvent) => any)
onfullscreenchange: null | ((this: Element, ev: Event) => any)
onfullscreenerror: null | ((this: Element, ev: Event) => any)
ongotpointercapture: null | ((this: GlobalEventHandlers, ev: PointerEvent) => any)
oninput: null | ((this: GlobalEventHandlers, ev: Event) => any)
oninvalid: null | ((this: GlobalEventHandlers, ev: Event) => any)
onkeydown: null | ((this: GlobalEventHandlers, ev: KeyboardEvent) => any)

Fires when the user presses a key.

Param

The keyboard event

onkeypress: null | ((this: GlobalEventHandlers, ev: KeyboardEvent) => any)

Fires when the user presses an alphanumeric key.

Param

The event.

Deprecated

onkeyup: null | ((this: GlobalEventHandlers, ev: KeyboardEvent) => any)

Fires when the user releases a key.

Param

The keyboard event

onload: null | ((this: GlobalEventHandlers, ev: Event) => any)

Fires immediately after the browser loads the object.

Param

The event.

onloadeddata: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when media data is loaded at the current playback position.

Param

The event.

onloadedmetadata: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when the duration and dimensions of the media have been determined.

Param

The event.

onloadstart: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when Internet Explorer begins looking for media data.

Param

The event.

onlostpointercapture: null | ((this: GlobalEventHandlers, ev: PointerEvent) => any)
onmousedown: null | ((this: GlobalEventHandlers, ev: MouseEvent) => any)

Fires when the user clicks the object with either mouse button.

Param

The mouse event.

onmouseenter: null | ((this: GlobalEventHandlers, ev: MouseEvent) => any)
onmouseleave: null | ((this: GlobalEventHandlers, ev: MouseEvent) => any)
onmousemove: null | ((this: GlobalEventHandlers, ev: MouseEvent) => any)

Fires when the user moves the mouse over the object.

Param

The mouse event.

onmouseout: null | ((this: GlobalEventHandlers, ev: MouseEvent) => any)

Fires when the user moves the mouse pointer outside the boundaries of the object.

Param

The mouse event.

onmouseover: null | ((this: GlobalEventHandlers, ev: MouseEvent) => any)

Fires when the user moves the mouse pointer into the object.

Param

The mouse event.

onmouseup: null | ((this: GlobalEventHandlers, ev: MouseEvent) => any)

Fires when the user releases a mouse button while the mouse is over the object.

Param

The mouse event.

onpaste: null | ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any)
onpause: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when playback is paused.

Param

The event.

onplay: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when the play method is requested.

Param

The event.

onplaying: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when the audio or video has started playing.

Param

The event.

onpointercancel: null | ((this: GlobalEventHandlers, ev: PointerEvent) => any)
onpointerdown: null | ((this: GlobalEventHandlers, ev: PointerEvent) => any)
onpointerenter: null | ((this: GlobalEventHandlers, ev: PointerEvent) => any)
onpointerleave: null | ((this: GlobalEventHandlers, ev: PointerEvent) => any)
onpointermove: null | ((this: GlobalEventHandlers, ev: PointerEvent) => any)
onpointerout: null | ((this: GlobalEventHandlers, ev: PointerEvent) => any)
onpointerover: null | ((this: GlobalEventHandlers, ev: PointerEvent) => any)
onpointerup: null | ((this: GlobalEventHandlers, ev: PointerEvent) => any)
onprogress: null | ((this: GlobalEventHandlers, ev: ProgressEvent<EventTarget>) => any)

Occurs to indicate progress while downloading media data.

Param

The event.

onratechange: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when the playback rate is increased or decreased.

Param

The event.

onreset: null | ((this: GlobalEventHandlers, ev: Event) => any)

Fires when the user resets a form.

Param

The event.

onresize: null | ((this: GlobalEventHandlers, ev: UIEvent) => any)
onscroll: null | ((this: GlobalEventHandlers, ev: Event) => any)

Fires when the user repositions the scroll box in the scroll bar on the object.

Param

The event.

onsecuritypolicyviolation: null | ((this: GlobalEventHandlers, ev: SecurityPolicyViolationEvent) => any)
onseeked: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when the seek operation ends.

Param

The event.

onseeking: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when the current playback position is moved.

Param

The event.

onselect: null | ((this: GlobalEventHandlers, ev: Event) => any)

Fires when the current selection changes.

Param

The event.

onselectionchange: null | ((this: GlobalEventHandlers, ev: Event) => any)
onselectstart: null | ((this: GlobalEventHandlers, ev: Event) => any)
onslotchange: null | ((this: GlobalEventHandlers, ev: Event) => any)
onstalled: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when the download has stopped.

Param

The event.

onsubmit: null | ((this: GlobalEventHandlers, ev: SubmitEvent) => any)
onsuspend: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs if the load operation has been intentionally halted.

Param

The event.

ontimeupdate: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs to indicate the current playback position.

Param

The event.

ontoggle: null | ((this: GlobalEventHandlers, ev: Event) => any)
ontouchcancel?: null | ((this: GlobalEventHandlers, ev: TouchEvent) => any)
ontouchend?: null | ((this: GlobalEventHandlers, ev: TouchEvent) => any)
ontouchmove?: null | ((this: GlobalEventHandlers, ev: TouchEvent) => any)
ontouchstart?: null | ((this: GlobalEventHandlers, ev: TouchEvent) => any)
ontransitioncancel: null | ((this: GlobalEventHandlers, ev: TransitionEvent) => any)
ontransitionend: null | ((this: GlobalEventHandlers, ev: TransitionEvent) => any)
ontransitionrun: null | ((this: GlobalEventHandlers, ev: TransitionEvent) => any)
ontransitionstart: null | ((this: GlobalEventHandlers, ev: TransitionEvent) => any)
onvolumechange: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when the volume is changed, or playback is muted or unmuted.

Param

The event.

onwaiting: null | ((this: GlobalEventHandlers, ev: Event) => any)

Occurs when playback stops because the next frame of a video resource is not available.

Param

The event.

onwebkitanimationend: null | ((this: GlobalEventHandlers, ev: Event) => any)

Deprecated

This is a legacy alias of onanimationend.

onwebkitanimationiteration: null | ((this: GlobalEventHandlers, ev: Event) => any)

Deprecated

This is a legacy alias of onanimationiteration.

onwebkitanimationstart: null | ((this: GlobalEventHandlers, ev: Event) => any)

Deprecated

This is a legacy alias of onanimationstart.

onwebkittransitionend: null | ((this: GlobalEventHandlers, ev: Event) => any)

Deprecated

This is a legacy alias of ontransitionend.

onwheel: null | ((this: GlobalEventHandlers, ev: WheelEvent) => any)
outerHTML: string
outerText: string
output: (() => undefined | Output)

Type declaration

    • (): undefined | Output
    • traverse the diagram and generate a JSON representation

      Returns undefined | Output

ownerDocument: Document
parentElement: null | HTMLElement

Returns the parent element.

parentNode: null | ParentNode

Returns the parent.

part: DOMTokenList
prefix: null | string

Returns the namespace prefix.

previousElementSibling: null | Element

Returns the first preceding sibling that is an element, and null otherwise.

previousSibling: null | ChildNode

Returns the previous sibling.

role: null | string
scrollHeight: number
scrollLeft: number
scrollTop: number
scrollWidth: number
shadowRoot: null | ShadowRoot

Returns element's shadow root, if any, and if shadow root's mode is "open", and null otherwise.

slot: string

Returns the value of element's slot content attribute. Can be set to change it.

spacing_x: number = 20
spacing_y: number = 80
spellcheck: boolean
style: CSSStyleDeclaration
tabIndex: number
tagName: string

Returns the HTML-uppercased qualified name.

textContent: null | string
title: string
translate: boolean
_$litElement$: boolean
_initializers?: Initializer[]

Properties - dev-mode

disableWarning?: ((warningKind: WarningKind) => void)

Type declaration

    • (warningKind: WarningKind): void
    • Disable the given warning category for this class.

      This method only exists in development builds, so it should be accessed with a guard like:

      // Disable for all ReactiveElement subclasses
      ReactiveElement.disableWarning?.('migration');

      // Disable for only MyElement and subclasses
      MyElement.disableWarning?.('migration');

      Nocollapse

      Parameters

      • warningKind: WarningKind

      Returns void

enableWarning?: ((warningKind: WarningKind) => void)

Type declaration

    • (warningKind: WarningKind): void
    • Enable the given warning category for this class.

      This method only exists in development builds, so it should be accessed with a guard like:

      // Enable for all ReactiveElement subclasses
      ReactiveElement.enableWarning?.('migration');

      // Enable for only MyElement and subclasses
      MyElement.enableWarning?.('migration');

      Nocollapse

      Parameters

      • warningKind: WarningKind

      Returns void

enabledWarnings?: WarningKind[]

Read or set all the enabled warning categories for this class.

This property is only used in development builds.

Nocollapse

Properties - properties

elementProperties: PropertyDeclarationMap

Memoized list of all element properties, including any superclass properties. Created lazily on user subclasses when finalizing the class.

Nocollapse

properties: PropertyDeclarations

User-supplied object that maps property names to PropertyDeclaration objects containing options for configuring reactive properties. When a reactive property is set the element will update and render.

By default properties are public fields, and as such, they should be considered as primarily settable by element users, either via attribute or the property itself.

Generally, properties that are changed by the element should be private or protected fields and should use the state: true option. Properties marked as state do not reflect from the corresponding attribute

However, sometimes element code does need to set a public property. This should typically only be done in response to user interaction, and an event should be fired informing the user; for example, a checkbox sets its checked property when clicked and fires a changed event. Mutating public properties should typically not be done for non-primitive (object or array) properties. In other cases when an element needs to manage state, a private property set with the state: true option should be used. When needed, state properties can be initialized via public properties to facilitate complex interactions.

Nocollapse

Properties - rendering

renderOptions: RenderOptions
renderRoot: HTMLElement | ShadowRoot

Node or ShadowRoot into which element DOM should be rendered. Defaults to an open shadowRoot.

shadowRootOptions: ShadowRootInit

Options used when calling attachShadow. Set this property to customize the options for the shadowRoot; for example, to create a closed shadowRoot: {mode: 'closed'}.

Note, these options are used in createRenderRoot. If this method is customized, options should be respected if possible.

Nocollapse

Properties - styles

elementStyles: CSSResultOrNative[]

Memoized list of all element styles. Created lazily on user subclasses when finalizing the class.

Nocollapse

styles?: CSSResultGroup

Array of styles to apply to the element. The styles should be defined using the css tag function, via constructible stylesheets, or imported from native CSS module scripts.

Note on Content Security Policy:

Element styles are implemented with <style> tags when the browser doesn't support adopted StyleSheets. To use such <style> tags with the style-src CSP directive, the style-src value must either include 'unsafe-inline' or nonce-<base64-value> with <base64-value> replaced be a server-generated nonce.

To provide a nonce to use on generated <style> elements, set window.litNonce to a server-generated nonce in your page's HTML, before loading application code:

<script>
// Generated and unique per request:
window.litNonce = 'a1b2c3d4';
</script>

Nocollapse

Properties - updates

hasUpdated: boolean

Is set to true after the first update. The element code cannot assume that renderRoot exists before the element hasUpdated.

isUpdatePending: boolean

True if there is a pending update as a result of calling requestUpdate(). Should only be read.

Accessors - attributes

  • get observedAttributes(): string[]
  • Returns a list of attributes corresponding to the registered properties.

    Nocollapse

    Returns string[]

Accessors - updates

  • get updateComplete(): Promise<boolean>
  • Returns a Promise that resolves when the element has completed updating. The Promise value is a boolean that is true if the element completed the update without triggering another update. The Promise result is false if a property was set inside updated(). If the Promise is rejected, an exception was thrown during the update.

    To await additional asynchronous work, override the getUpdateComplete method. For example, it is sometimes useful to await a rendered element before fulfilling this Promise. To do this, first await super.getUpdateComplete(), then any subsequent state.

    Returns

    A promise of a boolean that resolves to true if the update completed without triggering another update.

    Returns Promise<boolean>

Methods - Other

  • event raised when start dragging template over diagram

    Parameters

    • type: "templateGrabbed"

      'templateGrabbed'

    • listener: ((ev: CustomEvent<HTMLElement>) => void)

      (ev: CustomEvent) => void

        • (ev: CustomEvent<HTMLElement>): void
        • Parameters

          • ev: CustomEvent<HTMLElement>

          Returns void

    • Optional capture: boolean

    Returns void

  • event raised when start dragging template over diagram

    Parameters

    • type: "templateReleased"

      'templateReleased'

    • listener: ((ev: CustomEvent<HTMLElement>) => void)

      (ev: CustomEvent) => void

        • (ev: CustomEvent<HTMLElement>): void
        • Parameters

          • ev: CustomEvent<HTMLElement>

          Returns void

    • Optional capture: boolean

    Returns void

  • event raised when a diagram's block is selected

    Parameters

    • type: "blockSelected"

      'blockSelected'

    • listener: ((ev: CustomEvent<HTMLElement>) => void)

      (ev: CustomEvent) => void

        • (ev: CustomEvent<HTMLElement>): void
        • Parameters

          • ev: CustomEvent<HTMLElement>

          Returns void

    • Optional capture: boolean

    Returns void

  • event raised when a block's sheet is closeds

    Parameters

    • type: "sheetClosed"

      'sheetClosed'

    • listener: ((ev: CustomEvent<HTMLElement>) => void)

      (ev: CustomEvent) => void

        • (ev: CustomEvent<HTMLElement>): void
        • Parameters

          • ev: CustomEvent<HTMLElement>

          Returns void

    • Optional capture: boolean

    Returns void

  • event raised when a block is dropped from template.

    it is a cancellable event, a call to "preventDefault()" cancel dropping block

    Parameters

    • type: "snapping"

      'snapping'

    • listener: ((ev: CustomEvent<{
          parent?: HTMLElement;
          target: HTMLElement;
      }>) => void)
        • (ev: CustomEvent<{
              parent?: HTMLElement;
              target: HTMLElement;
          }>): void
        • Parameters

          • ev: CustomEvent<{
                parent?: HTMLElement;
                target: HTMLElement;
            }>

          Returns void

    • Optional capture: boolean

    Returns void

  • event raised when a block is dropped after moving over diagram.

    it is a cancellable event. A call to "preventDefault()" cancel dropping block

    Parameters

    • type: "moving"

      'moving'

    • listener: ((ev: CustomEvent<{
          source: HTMLElement;
          target: number;
      }>) => void)
        • (ev: CustomEvent<{
              source: HTMLElement;
              target: number;
          }>): void
        • Parameters

          • ev: CustomEvent<{
                source: HTMLElement;
                target: number;
            }>

          Returns void

    • Optional capture: boolean

    Returns void

  • Parameters

    • type: string
    • listener: EventListener | EventListenerObject
    • Optional useCapture: boolean

    Returns void

  • Inserts nodes just after node, while replacing strings in nodes with equivalent Text nodes.

    Throws a "HierarchyRequestError" DOMException if the constraints of the node tree are violated.

    Parameters

    • Rest ...nodes: (string | Node)[]

    Returns void

  • Parameters

    • keyframes: null | Keyframe[] | PropertyIndexedKeyframes
    • Optional options: number | KeyframeAnimationOptions

    Returns Animation

  • Inserts nodes after the last child of node, while replacing strings in nodes with equivalent Text nodes.

    Throws a "HierarchyRequestError" DOMException if the constraints of the node tree are violated.

    Parameters

    • Rest ...nodes: (string | Node)[]

    Returns void

  • Type Parameters

    • T extends Node

    Parameters

    • node: T

    Returns T

  • Returns ElementInternals

  • Creates a shadow root for element and returns it.

    Parameters

    • init: ShadowRootInit

    Returns ShadowRoot

  • Inserts nodes just before node, while replacing strings in nodes with equivalent Text nodes.

    Throws a "HierarchyRequestError" DOMException if the constraints of the node tree are violated.

    Parameters

    • Rest ...nodes: (string | Node)[]

    Returns void

  • Returns void

  • Returns void

  • Returns a copy of node. If deep is true, the copy also includes the node's descendants.

    Parameters

    • Optional deep: boolean

    Returns Node

  • Returns the first (starting at element) inclusive ancestor that matches selectors, and null otherwise.

    Type Parameters

    • K extends keyof HTMLElementTagNameMap

    Parameters

    • selector: K

    Returns null | HTMLElementTagNameMap[K]

  • Type Parameters

    • K extends keyof SVGElementTagNameMap

    Parameters

    • selector: K

    Returns null | SVGElementTagNameMap[K]

  • Type Parameters

    • E extends Element = Element

    Parameters

    • selectors: string

    Returns null | E

  • Returns a bitmask indicating the position of other relative to node.

    Parameters

    • other: Node

    Returns number

  • Returns true if other is an inclusive descendant of node, and false otherwise.

    Parameters

    • other: null | Node

    Returns boolean

  • Dispatches a synthetic event event to target and returns true if either event's cancelable attribute value is false or its preventDefault() method was not invoked, and false otherwise.

    Parameters

    • event: Event

    Returns boolean

  • Parameters

    • Optional options: FocusOptions

    Returns void

  • Parameters

    • Optional options: GetAnimationsOptions

    Returns Animation[]

  • Returns element's first attribute whose qualified name is qualifiedName, and null if there is no such attribute otherwise.

    Parameters

    • qualifiedName: string

    Returns null | string

  • Returns element's attribute whose namespace is namespace and local name is localName, and null if there is no such attribute otherwise.

    Parameters

    • namespace: null | string
    • localName: string

    Returns null | string

  • Returns the qualified names of all element's attributes. Can contain duplicates.

    Returns string[]

  • Parameters

    • qualifiedName: string

    Returns null | Attr

  • Parameters

    • namespace: null | string
    • localName: string

    Returns null | Attr

  • Returns DOMRect

  • Returns DOMRectList

  • Returns a HTMLCollection of the elements in the object on which the method was invoked (a document or an element) that have all the classes given by classNames. The classNames argument is interpreted as a space-separated list of classes.

    Parameters

    • classNames: string

    Returns HTMLCollectionOf<Element>

  • Type Parameters

    • K extends keyof HTMLElementTagNameMap

    Parameters

    • qualifiedName: K

    Returns HTMLCollectionOf<HTMLElementTagNameMap[K]>

  • Type Parameters

    • K extends keyof SVGElementTagNameMap

    Parameters

    • qualifiedName: K

    Returns HTMLCollectionOf<SVGElementTagNameMap[K]>

  • Parameters

    • qualifiedName: string

    Returns HTMLCollectionOf<Element>

  • Parameters

    • namespaceURI: "http://www.w3.org/1999/xhtml"
    • localName: string

    Returns HTMLCollectionOf<HTMLElement>

  • Parameters

    • namespaceURI: "http://www.w3.org/2000/svg"
    • localName: string

    Returns HTMLCollectionOf<SVGElement>

  • Parameters

    • namespace: null | string
    • localName: string

    Returns HTMLCollectionOf<Element>

  • Returns node's root.

    Parameters

    • Optional options: GetRootNodeOptions

    Returns Node

  • Returns true if element has an attribute whose qualified name is qualifiedName, and false otherwise.

    Parameters

    • qualifiedName: string

    Returns boolean

  • Returns true if element has an attribute whose namespace is namespace and local name is localName.

    Parameters

    • namespace: null | string
    • localName: string

    Returns boolean

  • Returns true if element has attributes, and false otherwise.

    Returns boolean

  • Returns whether node has children.

    Returns boolean

  • Parameters

    • pointerId: number

    Returns boolean

  • Parameters

    • where: InsertPosition
    • element: Element

    Returns null | Element

  • Parameters

    • position: InsertPosition
    • text: string

    Returns void

  • Parameters

    • where: InsertPosition
    • data: string

    Returns void

  • Type Parameters

    • T extends Node

    Parameters

    • node: T
    • child: null | Node

    Returns T

  • Parameters

    • namespace: null | string

    Returns boolean

  • Returns whether node and otherNode have the same properties.

    Parameters

    • otherNode: null | Node

    Returns boolean

  • Parameters

    • otherNode: null | Node

    Returns boolean

  • Parameters

    • prefix: null | string

    Returns null | string

  • Parameters

    • namespace: null | string

    Returns null | string

  • Returns true if matching selectors against element's root yields element, and false otherwise.

    Parameters

    • selectors: string

    Returns boolean

  • Removes empty exclusive Text nodes and concatenates the data of remaining contiguous exclusive Text nodes into the first of their nodes.

    Returns void

  • Inserts nodes before the first child of node, while replacing strings in nodes with equivalent Text nodes.

    Throws a "HierarchyRequestError" DOMException if the constraints of the node tree are violated.

    Parameters

    • Rest ...nodes: (string | Node)[]

    Returns void

  • Returns the first element that is a descendant of node that matches selectors.

    Type Parameters

    • K extends keyof HTMLElementTagNameMap

    Parameters

    • selectors: K

    Returns null | HTMLElementTagNameMap[K]

  • Type Parameters

    • K extends keyof SVGElementTagNameMap

    Parameters

    • selectors: K

    Returns null | SVGElementTagNameMap[K]

  • Type Parameters

    • E extends Element = Element

    Parameters

    • selectors: string

    Returns null | E

  • Returns all element descendants of node that match selectors.

    Type Parameters

    • K extends keyof HTMLElementTagNameMap

    Parameters

    • selectors: K

    Returns NodeListOf<HTMLElementTagNameMap[K]>

  • Type Parameters

    • K extends keyof SVGElementTagNameMap

    Parameters

    • selectors: K

    Returns NodeListOf<SVGElementTagNameMap[K]>

  • Type Parameters

    • E extends Element = Element

    Parameters

    • selectors: string

    Returns NodeListOf<E>

  • Parameters

    • pointerId: number

    Returns void

  • Removes node.

    Returns void

  • Removes element's first attribute whose qualified name is qualifiedName.

    Parameters

    • qualifiedName: string

    Returns void

  • Removes element's attribute whose namespace is namespace and local name is localName.

    Parameters

    • namespace: null | string
    • localName: string

    Returns void

  • Parameters

    • attr: Attr

    Returns Attr

  • Type Parameters

    • T extends Node

    Parameters

    • child: T

    Returns T

  • Type Parameters

    • K extends keyof HTMLElementEventMap

    Parameters

    • type: K
    • listener: ((this: HTMLElement, ev: HTMLElementEventMap[K]) => any)
        • (this: HTMLElement, ev: HTMLElementEventMap[K]): any
        • Parameters

          • this: HTMLElement
          • ev: HTMLElementEventMap[K]

          Returns any

    • Optional options: boolean | EventListenerOptions

    Returns void

  • Parameters

    • type: string
    • listener: EventListenerOrEventListenerObject
    • Optional options: boolean | EventListenerOptions

    Returns void

  • Type Parameters

    • T extends Node

    Parameters

    • node: Node
    • child: T

    Returns T

  • Replace all children of node with nodes, while replacing strings in nodes with equivalent Text nodes.

    Throws a "HierarchyRequestError" DOMException if the constraints of the node tree are violated.

    Parameters

    • Rest ...nodes: (string | Node)[]

    Returns void

  • Replaces node with nodes, while replacing strings in nodes with equivalent Text nodes.

    Throws a "HierarchyRequestError" DOMException if the constraints of the node tree are violated.

    Parameters

    • Rest ...nodes: (string | Node)[]

    Returns void

  • Displays element fullscreen and resolves promise when done.

    When supplied, options's navigationUI member indicates whether showing navigation UI while in fullscreen is preferred or not. If set to "show", navigation simplicity is preferred over screen space, and if set to "hide", more screen space is preferred. User agents are always free to honor user preference over the application's. The default value "auto" indicates no application preference.

    Parameters

    • Optional options: FullscreenOptions

    Returns Promise<void>

  • Returns void

  • Parameters

    • Optional options: ScrollToOptions

    Returns void

  • Parameters

    • x: number
    • y: number

    Returns void

  • Parameters

    • Optional options: ScrollToOptions

    Returns void

  • Parameters

    • x: number
    • y: number

    Returns void

  • Parameters

    • Optional arg: boolean | ScrollIntoViewOptions

    Returns void

  • Parameters

    • Optional options: ScrollToOptions

    Returns void

  • Parameters

    • x: number
    • y: number

    Returns void

  • Sets the value of element's first attribute whose qualified name is qualifiedName to value.

    Parameters

    • qualifiedName: string
    • value: string

    Returns void

  • Sets the value of element's attribute whose namespace is namespace and local name is localName to value.

    Parameters

    • namespace: null | string
    • qualifiedName: string
    • value: string

    Returns void

  • Parameters

    • attr: Attr

    Returns null | Attr

  • Parameters

    • attr: Attr

    Returns null | Attr

  • Parameters

    • pointerId: number

    Returns void

  • If force is not given, "toggles" qualifiedName, removing it if it is present and adding it if it is not present. If force is true, adds qualifiedName. If force is false, removes qualifiedName.

    Returns true if qualifiedName is now present, and false otherwise.

    Parameters

    • qualifiedName: string
    • Optional force: boolean

    Returns boolean

  • Deprecated

    This is a legacy alias of matches.

    Parameters

    • selectors: string

    Returns boolean

  • Adds an initializer function to the class that is called during instance construction.

    This is useful for code that runs against a ReactiveElement subclass, such as a decorator, that needs to do work for each instance, such as setting up a ReactiveController.

    const myDecorator = (target: typeof ReactiveElement, key: string) => {
    target.addInitializer((instance: ReactiveElement) => {
    // This is run during construction of the element
    new MyController(instance);
    });
    }

    Decorating a field will then cause each instance to run an initializer that adds a controller:

    class MyElement extends LitElement {
    @myDecorator foo;
    }

    Initializers are stored per-constructor. Adding an initializer to a subclass does not add it to a superclass. Since initializers are run in constructors, initializers will run in order of the class hierarchy, starting with superclasses and progressing to the instance's class.

    Nocollapse

    Parameters

    • initializer: Initializer

    Returns void

Methods - attributes

  • Synchronizes property values when attributes change.

    Specifically, when an attribute is set, the corresponding property is set. You should rarely need to implement this callback. If this method is overridden, super.attributeChangedCallback(name, _old, value) must be called.

    See using the lifecycle callbacks on MDN for more information about the attributeChangedCallback.

    Parameters

    • name: string
    • _old: null | string
    • value: null | string

    Returns void

Methods - controllers

  • Registers a ReactiveController to participate in the element's reactive update cycle. The element automatically calls into any registered controllers during its lifecycle callbacks.

    If the element is connected when addController() is called, the controller's hostConnected() callback will be immediately called.

    Parameters

    • controller: ReactiveController

    Returns void

  • Removes a ReactiveController from the element.

    Parameters

    • controller: ReactiveController

    Returns void

Methods - lifecycle

  • Invoked when the component is removed from the document's DOM.

    This callback is the main signal to the element that it may no longer be used. disconnectedCallback() should ensure that nothing is holding a reference to the element (such as event listeners added to nodes external to the element), so that it is free to be garbage collected.

    disconnectedCallback() {
    super.disconnectedCallback();
    window.removeEventListener('keydown', this._handleKeydown);
    }

    An element may be re-connected after being disconnected.

    Returns void

Methods - properties

  • Creates a property accessor on the element prototype if one does not exist and stores a PropertyDeclaration for the property with the given options. The property setter calls the property's hasChanged property option or uses a strict identity check to determine whether or not to request an update.

    This method may be overridden to customize properties; however, when doing so, it's important to call super.createProperty to ensure the property is setup correctly. This method calls getPropertyDescriptor internally to get a descriptor to install. To customize what properties do when they are get or set, override getPropertyDescriptor. To customize the options for a property, implement createProperty like this:

    static createProperty(name, options) {
    options = Object.assign(options, {myOption: true});
    super.createProperty(name, options);
    }

    Nocollapse

    Parameters

    • name: PropertyKey
    • Optional options: PropertyDeclaration<unknown, unknown>

    Returns void

  • Returns the property options associated with the given property. These options are defined with a PropertyDeclaration via the properties object or the @property decorator and are registered in createProperty(...).

    Note, this method should be considered "final" and not overridden. To customize the options for a given property, override createProperty.

    Nocollapse

    Final

    Parameters

    • name: PropertyKey

    Returns PropertyDeclaration<unknown, unknown>

Methods - updates

  • Requests an update which is processed asynchronously. This should be called when an element should update based on some state not triggered by setting a reactive property. In this case, pass no arguments. It should also be called when manually implementing a property setter. In this case, pass the property name and oldValue to ensure that any configured property options are honored.

    Parameters

    • Optional name: PropertyKey

      name of requesting property

    • Optional oldValue: unknown

      old value of requesting property

    • Optional options: PropertyDeclaration<unknown, unknown>

      property options to use instead of the previously configured options

    Returns void

Generated using TypeDoc