Switch
Switches (COMPONENT_SPEC §24; Compose Switch) on a native <input type="checkbox" role="switch">: a 52 × 32dp track in a 48dp-high target. Pressing snaps the handle to 28dp; releasing springs it to its place on the fast spatial spring, which overshoots under the expressive motion scheme, so a click grows the handle and then springs it across. Track and handle colors change without animating, as in Compose. Space toggles (Enter does not), with no JavaScript.
Static (m3e-css)
<label class="m3e-switch"> around the .m3e-switch__input, the __track with its __handle (optional .m3e-icon.m3e-switch__icons and the __state circle) and an optional __label, before or after the switch. The whole label toggles and shows the handle's hover and press. The ripple needs @kyralabs/m3e-elements/ripple.js (this section uses attachAutoRipple).
Element
There is no <m3e-switch>: the native checkbox already toggles on Space, submits with its form and exposes role="switch", and the press snap and spring are CSS (:active and transitions), so the plain markup above is the element-layer API. Load @kyralabs/m3e-elements/ripple.js for the press ripple.
React
<Switch isSelected defaultSelected onChange isDisabled isReadOnly checkedIcon uncheckedIcon labelPosition name value aria-label> (React Aria useSwitch); the same DOM as the static markup.