Runtime
The core syntax parsing and runtime engine of Master CSS.
Interfaces
RuntimeCSS
The Runtime
extends the MasterCSS
and only works in the browser environment.
import { RuntimeCSS } from '@master/css-runtime' const runtimeCSS = new RuntimeCSS(config)
runtime.root
Observe the root element.
Type | Document ShadowRoot |
---|---|
Default | document |
runtimeCSS.root
runtime.host
Observe the root's host element, usually this.root.host
or document.documentElement
.
Type | Element |
---|---|
Default | auto ( Read Only ) |
runtimeCSS.host
runtime.container
Container for inserting style <style>
.
Type | HTMLElement ShadowRoot |
---|---|
Default | auto ( Read Only ) |
runtimeCSS.host
runtime.observing
Observation state. true
after .observe()
; false
after .disconnect()
.
Type | boolean |
---|---|
Default | auto ( Read Only ) |
runtimeCSS.observing
runtime.observe()
Observe the class
attribute changes of this.root
and all descendant elements.
Argument | Type | Default |
---|---|---|
return | this | - |
runtimeCSS.observe()
runtime.disconnect()
Cancel the previous .observe()
of this.root
.
Argument | Type | Default |
---|---|---|
options? | MutationObserverInit | { subtree: true, childList: true } |
return | this | - |
runtimeCSS.disconnect()
runtime.refresh()
Refresh the Master Runtime CSS with the configuration.
Argument | Type | Default |
---|---|---|
config? | this.customConfig | |
return | this | - |
css.refresh(config)
runtime.reset()
Clear all rules and styles and reset to initial.
Argument | Type | Default |
---|---|---|
return | this | - |
css.reset()
runtime.destroy()
Destroy and remove the current instance from globalThis.runtimeCSSs
.
Argument | Type | Default |
---|---|---|
return | this | - |
css.reset()
globalThis.runtimeCSS
Record the registered root document
Runtime CSS instance; the field will be recorded only after executing css.observe()
.
Type | RuntimeCSS |
---|
globalThis.runtimeCSSs
All objects instantiated via new RuntimeCSS()
.
Type | RuntimeCSS[] |
---|---|
Default | [] |
globalThis.RuntimeCSS
Type | typeof RuntimeCSS |
---|---|
Default | RuntimeCSS |
initCSSRuntime()
Initializes the Master CSS runtime rendering engine.
Argument | Type | Default |
---|---|---|
config? | undefined | |
return | MasterCSS | - |
import { initCSSRuntime } from '@master/css-runtime' const css = initCSSRuntime()
Equivalent to:
import { RuntimeCSS } from '@master/css-runtime' const runtimeCSS = new RuntimeCSS().observe()