Refactor to useOpenClosed

Fixes #6
This commit is contained in:
Ryan Gossiaux
2021-12-18 21:36:09 -08:00
parent 4a6edb4e1c
commit 9e45d92929
11 changed files with 23 additions and 27 deletions

View File

@@ -44,7 +44,7 @@
<script lang="ts">
import { useId } from "$lib/hooks/use-id";
import { match } from "$lib/utils/match";
import { State } from "$lib/internal/open-closed";
import { State, useOpenClosedProvider } from "$lib/internal/open-closed";
export let defaultOpen = false;
let buttonId = `headlessui-disclosure-button-${useId()}`;
let panelId = `headlessui-disclosure-panel-${useId()}`;
@@ -94,7 +94,7 @@
});
let openClosedState: Writable<State> | undefined = writable();
setContext("OpenClosed", openClosedState);
useOpenClosedProvider(openClosedState);
$: $openClosedState = match(disclosureState, {
[DisclosureStates.Open]: State.Open,

View File

@@ -9,11 +9,10 @@
<script lang="ts">
import { useDisclosureContext, DisclosureStates } from "./Disclosure.svelte";
import type { Writable } from "svelte/store";
import { State } from "$lib/internal/open-closed";
import { State, useOpenClosed } from "$lib/internal/open-closed";
const api = useDisclosureContext("DisclosureButton");
$: id = $api?.panelId;
let openClosedState: Writable<State> | undefined = getContext("OpenClosed");
let openClosedState = useOpenClosed();
setContext(DISCLOSURE_PANEL_CONTEXT_NAME, id);