svelte-indeterminate-checkbox v1.0.9

Svelte Indeterminable Checkbox

Simple checkbox component with "indeterminate" status support.

Installation

You can install this package with npm or yarn

npm install svelte-indeterminate-checkbox

yarn add svelte-indeterminate-checkbox

Usage

<script>
import Checkbox from 'svelte-indeterminate-checkbox';

let checkboxStatus = 'x';

function handleClick(e) {
    switch (checkboxStatus) {
        case 'v':
            checkboxStatus = '-';
        break;
        case '-':
            checkboxStatus = 'x';
            break;
        case 'x':
            checkboxStatus = 'v';
    }
}
</script>

<Checkbox id="myCheckbox" name="myCheckbox" status={checkboxStatus} on:click={handleClick} />

Props

Events

Note: Should not call e.preventDefault() inside the click handler because it will prevent the checkbox to change its value, this relates to the browser implementation and HTML Spec, (learn more)https://stackoverflow.com/questions/30426523/why-does-preventdefault-on-checkbox-click-event-returns-true-for-the-checked-att