Liquid GlassAPI Reference
Liquid GlassAPI Reference
init
Automatically initialize Liquid Glass components from the DOM.
init
Scans the DOM for data-liquid-* attributes and automatically wires up the corresponding components.
Basic Usage
import { init } from '@avenra/liquid-glass';
// Scan the entire document
init();
// Or scan a specific sub-tree
init({ root: document.getElementById('my-app') });Options
| Prop | Type | Default | Description |
|---|---|---|---|
root | Element | Document | document | The root element to scan for data attributes |
Return Value
Returns an Array of all created handles (mixed types). Additionally, each initialized element will have a ._liquidGlassHandle property set, allowing you to access the handle directly from the element.
Supported Data-Attributes
| Attribute | Component |
|---|---|
data-liquid-button | Button |
data-liquid-switch | Switch |
data-liquid-slider | Slider |
data-liquid-glass | Core Glass Effect |
data-liquid-cursor | Cursor |
data-liquid-input | Input |
data-liquid-dial | Dial |
data-liquid-progress | Progress Bar |
See the Data-Attribute API guide for more details on mapping properties.