Skip to content

Little

[LitComponent]{#LitComponent data-4search="ui/little.js:LitComponent;section"}

An interface extending LitElement with reactive render() and updated() methods.

Methods:

render() : A this-bound Wrapper around LitElement.render() with JS Signal tracking. updated (changedProps) : A this-bound Wrapper around LitElement.updated() with JS Signal tracking. request_update() : A this-bound wrapper around LitElement.requestUpdate(). weak_this() : A new WeakRef to this. createRenderRoot() : In addition to calling LitElement.createRenderRoot() this will call adopt_component_styles().

LitComponent class

class [LitComponent]{#LitComponent data-4search="ui/little.js:LitComponent;class"} : …

[**`mkstate`**]{#mkstate data-4search="ui/little.js:mkstate;func"}  `(`*str_olist*`)`
:   Install reactive Signal.State for all props

Constants

[JsExtract]{#JsExtract data-4search="ui/little.js:JsExtract;export"} : API to mark template strings for extraction and fetch extracted assets. - JsExtract.css`body { font-weight:bold; }` \ Mark CSS text inside a Javascript file for extration by jsextract.js. - node jsextract.js inputfile.js \ Extract JsExtract.css`` strings into inputfile.jscss. - await JsExtract.fetch_css ('/path/to/inputfile.js'); \ Use the browser fetch() API to retrieve the extracted string as text/css from '/path/to/inputfile.css'. - JsExtract.fetch_css (import.meta); \ Variant of the above that utilizes import.meta.url. - JsExtract.css_url (import.meta); \ Variant of the above that just provides the stylesheet URL.

Functions

[lit_update_all]{#lit_update_all data-4search="ui/little.js:lit_update_all;func"} (root) : Call requestUpdate() on all LitElements

[css_url]{#css_url data-4search="ui/little.js:css_url;func"} (base_url) : Construct the stylesheet URL from a base URL (enforcing .css extension).

[fetch_css]{#fetch_css data-4search="ui/little.js:fetch_css;func"} (base_url) : Fetch (extracted) asset from a base URL (enforcing .css extension) as "text/css"

[adopt_component_styles]{#adopt_component_styles data-4search="ui/little.js:adopt_component_styles;func"} (element) : Ensure that element has all stylesheets with [data-4litcomponent] applied to it