Web Component Knobs
npm install x-knobWeb Component Knobs
npm i x-knob | pnpm add x-knob | yarn add x-knob |
Try it live `` import { render } from 'minimal-view' import { Knob } from 'x-knob' render(#
web
#
example/web.tsx view sourcetsx
/* @jsxImportSource minimal-view /, document.body)
min={0}
max={1}
step={0.001}
value={0.5}
theme="zen"
/>
min={0}
max={1}
step={0.001}
value={0.5}
theme="cowbell"
/>
min={0}
max={1}
step={0.001}
value={0.5}
theme="zen"
/>
min={0}
max={1}
step={0.001}
value={0.5}
theme="zen"
/>
// customElements.define('x-knob', KnobElement)
// document.body.innerHTML = /html/
//
//
// // const knobs = document.querySelectorAll('x-knob') as NodeListOf
// // let i = 0
// // const ivl = setInterval(() => {
// // const knob = knobs[i++ % knobs.length]
// // knob.targetValue! += (knob.normal > 0.5 ? -1 : knob.normal === 0.5 ? (Math.random() - 0.5) 2 : 1) Math.random()
// // * knob.scale
// // * 0.95
// // if (i >= knobs.length) clearInterval(ivl)
// // }, 60)
``
All contributions are welcome!