Improve a few more types, including StateDefinition["foo"] usage
Fixes #5
This commit is contained in:
@@ -12,7 +12,7 @@
|
|||||||
export type StateDefinition = {
|
export type StateDefinition = {
|
||||||
// State
|
// State
|
||||||
listboxState: ListboxStates;
|
listboxState: ListboxStates;
|
||||||
value: any;
|
value: unknown;
|
||||||
orientation: "vertical" | "horizontal";
|
orientation: "vertical" | "horizontal";
|
||||||
|
|
||||||
labelRef: Writable<HTMLLabelElement | null>;
|
labelRef: Writable<HTMLLabelElement | null>;
|
||||||
@@ -63,18 +63,17 @@
|
|||||||
import { State, useOpenClosedProvider } from "$lib/internal/open-closed";
|
import { State, useOpenClosedProvider } from "$lib/internal/open-closed";
|
||||||
export let disabled = false;
|
export let disabled = false;
|
||||||
export let horizontal = false;
|
export let horizontal = false;
|
||||||
export let value: any;
|
export let value: StateDefinition["value"];
|
||||||
$: orientation = (horizontal ? "horizontal" : "vertical") as
|
$: orientation = (
|
||||||
| "horizontal"
|
horizontal ? "horizontal" : "vertical"
|
||||||
| "vertical";
|
) as StateDefinition["orientation"];
|
||||||
|
|
||||||
const dispatch = createEventDispatcher();
|
const dispatch = createEventDispatcher();
|
||||||
|
|
||||||
let listboxState = ListboxStates.Closed;
|
let listboxState: StateDefinition["listboxState"] = ListboxStates.Closed;
|
||||||
let labelRef: StateDefinition["labelRef"] = writable(null);
|
let labelRef: StateDefinition["labelRef"] = writable(null);
|
||||||
let buttonRef: StateDefinition["buttonRef"] = writable(null);
|
let buttonRef: StateDefinition["buttonRef"] = writable(null);
|
||||||
let optionsRef: StateDefinition["optionsRef"] = writable(null);
|
let optionsRef: StateDefinition["optionsRef"] = writable(null);
|
||||||
|
|
||||||
let options: StateDefinition["options"] = [];
|
let options: StateDefinition["options"] = [];
|
||||||
let searchQuery: StateDefinition["searchQuery"] = "";
|
let searchQuery: StateDefinition["searchQuery"] = "";
|
||||||
let activeOptionIndex: StateDefinition["activeOptionIndex"] = null;
|
let activeOptionIndex: StateDefinition["activeOptionIndex"] = null;
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
import { ListboxStates, useListboxContext } from "./Listbox.svelte";
|
import { ListboxStates, useListboxContext } from "./Listbox.svelte";
|
||||||
import { useId } from "$lib/hooks/use-id";
|
import { useId } from "$lib/hooks/use-id";
|
||||||
import { Focus } from "$lib/utils/calculate-active-index";
|
import { Focus } from "$lib/utils/calculate-active-index";
|
||||||
export let value: any;
|
export let value: unknown;
|
||||||
export let disabled = false;
|
export let disabled = false;
|
||||||
let api = useListboxContext("ListboxOption");
|
let api = useListboxContext("ListboxOption");
|
||||||
let id = `headlessui-listbox-option-${useId()}`;
|
let id = `headlessui-listbox-option-${useId()}`;
|
||||||
|
|||||||
@@ -53,12 +53,12 @@
|
|||||||
import { getContext, setContext, onMount } from "svelte";
|
import { getContext, setContext, onMount } from "svelte";
|
||||||
import { writable, Writable } from "svelte/store";
|
import { writable, Writable } from "svelte/store";
|
||||||
import { ActionArray, useActions } from "$lib/hooks/use-actions";
|
import { ActionArray, useActions } from "$lib/hooks/use-actions";
|
||||||
|
|
||||||
export let use: ActionArray = [];
|
export let use: ActionArray = [];
|
||||||
|
|
||||||
const buttonId = `headlessui-popover-button-${useId()}`;
|
const buttonId = `headlessui-popover-button-${useId()}`;
|
||||||
const panelId = `headlessui-popover-panel-${useId()}`;
|
const panelId = `headlessui-popover-panel-${useId()}`;
|
||||||
|
let popoverState: StateDefinition["popoverState"] = PopoverStates.Closed;
|
||||||
let popoverState: PopoverStates = PopoverStates.Closed;
|
|
||||||
|
|
||||||
let panel: StateDefinition["panel"] = writable(null);
|
let panel: StateDefinition["panel"] = writable(null);
|
||||||
let button: StateDefinition["button"] = writable(null);
|
let button: StateDefinition["button"] = writable(null);
|
||||||
|
|
||||||
|
|||||||
@@ -47,7 +47,7 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { treeWalker } from "$lib/hooks/use-tree-walker";
|
import { treeWalker } from "$lib/hooks/use-tree-walker";
|
||||||
export let disabled = false;
|
export let disabled = false;
|
||||||
export let value: any;
|
export let value: StateDefinition["value"];
|
||||||
let radioGroupRef: HTMLElement | null = null;
|
let radioGroupRef: HTMLElement | null = null;
|
||||||
let options: StateDefinition["options"] = [];
|
let options: StateDefinition["options"] = [];
|
||||||
|
|
||||||
|
|||||||
@@ -11,7 +11,7 @@
|
|||||||
Active = 1 << 1,
|
Active = 1 << 1,
|
||||||
}
|
}
|
||||||
|
|
||||||
export let value: any;
|
export let value: unknown;
|
||||||
export let disabled: boolean = false;
|
export let disabled: boolean = false;
|
||||||
let api = useRadioGroupContext("RadioGroupOption");
|
let api = useRadioGroupContext("RadioGroupOption");
|
||||||
let id = `headlessui-radiogroup-option-${useId()}`;
|
let id = `headlessui-radiogroup-option-${useId()}`;
|
||||||
|
|||||||
@@ -15,9 +15,9 @@
|
|||||||
import { getContext, setContext } from "svelte";
|
import { getContext, setContext } from "svelte";
|
||||||
import { Writable, writable } from "svelte/store";
|
import { Writable, writable } from "svelte/store";
|
||||||
|
|
||||||
let switchStore: Writable<HTMLButtonElement | null> = writable(null);
|
let switchStore: StateDefinition["switchStore"] = writable(null);
|
||||||
|
|
||||||
let api: Writable<StateDefinition | undefined> = writable({
|
let api: Writable<StateDefinition> = writable({
|
||||||
switchStore,
|
switchStore,
|
||||||
});
|
});
|
||||||
setContext(SWITCH_CONTEXT_NAME, api);
|
setContext(SWITCH_CONTEXT_NAME, api);
|
||||||
|
|||||||
Reference in New Issue
Block a user