diff --git a/rollup.config.js b/rollup.config.js
index b3fc336..64c326a 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -44,7 +44,7 @@ export default {
compilerOptions: {
// enable run-time checks when not in production
dev: !production
- }
+ },
}),
// we'll extract any component CSS out into
// a separate file - better for performance
diff --git a/src/FilterItem.svelte b/src/FilterItem.svelte
index dcc53a9..b603df8 100644
--- a/src/FilterItem.svelte
+++ b/src/FilterItem.svelte
@@ -1,74 +1,80 @@
{#if item != null}
-
+
{item}
{#each Object.entries(children) as [toplevel, subchildren], i}
{#if subchildren}
-
+
{:else}
-
+
{/if}
{/each}
diff --git a/src/TriStateCheckbox.svelte b/src/TriStateCheckbox.svelte
index b47bd7f..002d29a 100644
--- a/src/TriStateCheckbox.svelte
+++ b/src/TriStateCheckbox.svelte
@@ -3,31 +3,35 @@
export let state;
export let value;
- import { createTriState, UNCHECKED, CHECKED, WEIRD } from './stores';
+ import { UNCHECKED, CHECKED, WEIRD } from './stores';
+ import { createEventDispatcher } from 'svelte';
+
+ const dispatch = createEventDispatcher();
let node;
+ let checkedValue = false;
- state.subscribe(val => {
- if (!node) return;
+ $: {
+ if (node) {
+ if (state === CHECKED) {
+ checkedValue = true;
+ } else if (state === UNCHECKED) {
+ checkedValue = false;
+ }
- if (val === CHECKED) {
- checkedValue = true;
- } else if (val === UNCHECKED) {
- checkedValue = false;
- }
+ node.indeterminate = state === WEIRD;
- node.indeterminate = val === WEIRD;
- });
-
- function handleClick(evt) {
- if (evt.target.checked) {
- state.setChecked();
- } else if (!evt.target.checked) {
- state.setUnchecked();
}
}
- let checkedValue = false;
+ function handleClick(evt) {
+ if (evt.target.checked) {
+ state = CHECKED;
+ } else if (!evt.target.checked) {
+ state = UNCHECKED;
+ }
+ dispatch('change', { value: state });
+ }
diff --git a/src/stores.js b/src/stores.js
index 43ba7fa..05db473 100644
--- a/src/stores.js
+++ b/src/stores.js
@@ -16,3 +16,31 @@ export function createTriState(initialValue) {
}
}
+export function createTriStates(initialValue, length) {
+ const { subscribe, update, set } = writable(Array.from({length}, e => initialValue));
+
+ const setAt = (index, newValue) => {
+ update(array => [...array.slice(0, index), newValue, ...array.slice(index + 1)]);
+ };
+
+ return {
+ subscribe,
+ set,
+ setAt,
+ length,
+ storeAt: index => {
+ const set = value => setAt(index, value);
+ return {
+ subscribe: fun => subscribe(subvalues => fun(subvalues[index])),
+ set,
+ setUnchecked: () => set(UNCHECKED),
+ setWeird: () => set(WEIRD),
+ setChecked: () => set(CHECKED)
+ };
+ },
+ updateAll: fun => {
+ update(array => array.map(fun));
+ }
+ }
+}
+