Start sharing components as a team!Share components as a team!Join Bit to build your applications faster.Get Started Free

wired-toggle

v1.0.0arrow_drop_down
v1.0.0
v0.9.2
STATUS
Passing
DOWNLOADS
12
LICENSE
MIT
VISIBILITY
Public
PUBLISHED
6 months ago
SIZE
12 KB
Hand-drawn sketchy toggle button / switch.
1 contributor
Use wired-toggle in your project ?
Copied
npm i @bit/wiredjs.wired-elements.wired-toggle
Set Bit as a scoped registryLearn more
npm config set '@bit:registry' https://node.bit.dev
Component Example
React
React
Vue
Angular
Add dependency... help_outline
Just
import
any of the 1 million components
and packages in Bit or NPM to the example.
import Button from '@bit/grommet.grommet.button';
import Lodash from 'lodash';
revert changes
reload
toggle layout
maximize
modifieddraft
chevron_left
chevron_right

wired toggle

wired-toggle

Hand-drawn sketchy toggle button / switch.

For demo and view the complete set of wired-elememts: wiredjs.com

Usage

Add wired-toggle to your project:

npm i wired-toggle

Import wired-toggle definition into your HTML page:

<script type="module" src="wired-toggle/lib/wired-toggle.js"></script>

Or into your module script:

import { WiredToggle } from "wired-toggle"

Use it in your web page:

<wired-toggle></wired-toggle>
<wired-toggle checked></wired-toggle>

Properties

checked - Checked state (boolean).

disabled - disables the toggle button. Default value is false.

Custom CSS Variables

–wired-toggle-off-color Color of the knob when in off (false) position. Default value is gray.

–wired-toggle-on-color Color of the knob when in on (true) position. Default value is rgb(63, 81, 181).

Events

change event fired when state of the toggle is changed by the user.

License

MIT License © Preet Shihn