Class: Host

The Host component is used to encapsulate the content of a web app.

Dependencies: the system uses functions of the monsterjs library

You can create this control either by specifying the HTML tagdirectly in the HTML or using Javascript via thedocument.createElement('monster-host');` method.

<monster-host></monster-host>

Or you can create this CustomControl directly in Javascript:

import '@schukai/component-state/source/host.mjs';
document.createElement('monster-host');

The Body should have a class "hidden" to ensure that the styles are applied correctly.

body.hidden {
   visibility: hidden;
}

Constructor

new Host()

A simple host component

Copyright: schukai GmbH

Fires:

Monster.Components.Host.Host#event:monster-host-connected
Monster.Components.Host.Host#event:monster-host-disconnected

Members

defaults

To set the options via the html tag the attribute data-monster-options must be used.

Properties

Name Type Description

templates

Object

Template definitions

Properties

Name	Type	Description
`main`	string	Main template

features

Object

Feature definitions

See: https://monsterjs.org/en/doc/#configurate-a-monster-control The individual configuration values can be found in the table.

focusManager

See: Monster.DOM.FocusManager

locale

resourceManager

See: Monster.DOM.ResourceManager

translations

(static) instanceSymbol

This method is called by the instanceof operator.

Methods

assembleMethodSymbol() → {Monster.Components.Host.Host}

Returns:

Type:: Monster.Components.Host.Host

closeOverlay() → {Host}

Throws:

There is no overlay element defined.
Type Error

Returns:

Type:: Host

getConfig(key) → {Promise}

Parameters:

Name	Type	Description
`key`

Returns:

Type:: Promise

onReady() → {Promise}

The Promise is resolved when the element is connected to the DOM and all resources are available.

The Promise is resolved when the element is connected to the DOM and all resources are available. If the element is not connected to the DOM, the Promise is rejected.

Returns:

Type:: Promise

openOverlay() → {Host}

Throws:

There is no overlay element defined.
Type Error

Returns:

Type:: Host

pushNotification(message)

Parameters:

Name	Type	Description
`message`	string \| Message

setConfig(key, value) → {Promise}

Parameters:

Name	Type	Description
`key`	string
`value`	*

Returns:

Type:: Promise

toggleOverlay() → {Monster.Components.Host.Host}

Throws:

There is no overlay element defined.
Type Error

Returns:

Type:: Monster.Components.Host.Host

(static) getCSSStyleSheet() → {Array.<CSSStyleSheet>}

Returns:

Type:: Array.<CSSStyleSheet>

(static) getTag() → {string}

Returns:

Type:: string

Events

event:monster-host-connected

This event is fired during the host connection process.

This event is fired during the host connection process. The event is fired on the host element.

Type:

object

event:monster-host-disconnected

This event is fired during the host disconnection process.

This event is fired during the host disconnection process. The event is fired on the host element.

Type:

object