Avenra
Liquid GlassAPI Reference
Liquid GlassAPI Reference

createLiquidSwitch

Toggle switch with spring-animated thumb.

createLiquidSwitch

Creates a glass-styled toggle switch. The switch thumb moves with spring physics for a tactile feel.

Basic Usage

import { createLiquidSwitch } from '@avenra/liquid-glass';

const toggle = createLiquidSwitch('#my-switch', {
  checked: true
});

toggle.on('change', ({ checked }) => {
  console.log('Switch is now:', checked);
});

Props / Options

Extends LiquidGlassOptions plus:

PropTypeDefaultDescription
checkedbooleanfalseInitial checked state

Return Value — LiquidSwitchHandle

MemberTypeDescription
elementElementThe switch container element
checkedboolean (get/set)Current checked state
toggle()() => thisToggle state and emit 'change'
destroy()() => voidClean up the component
on('change', cb){ checked: boolean, element: Element }Fired on state change
on('destroy', cb)undefinedFired on destruction

On this page