From 70910c05b0ef4d4a7a694bc6eecbca1d8fc92368 Mon Sep 17 00:00:00 2001
From: Ryan Gossiaux <ryan.gossiaux@gmail.com>
Date: Sat, 18 Dec 2021 23:18:45 -0800
Subject: [PATCH] Standardize context naming

Fixes #7
---
 src/lib/components/description/DescriptionProvider.svelte | 2 +-
 src/lib/components/dialog/Dialog.svelte                   | 2 +-
 src/lib/components/disclosure/Disclosure.svelte           | 2 +-
 src/lib/components/disclosure/DisclosurePanel.svelte      | 2 +-
 src/lib/components/label/LabelProvider.svelte             | 2 +-
 src/lib/components/listbox/Listbox.svelte                 | 2 +-
 src/lib/components/menu/Menu.svelte                       | 2 +-
 src/lib/components/popover/Popover.svelte                 | 2 +-
 src/lib/components/popover/PopoverGroup.svelte            | 2 +-
 src/lib/components/popover/PopoverPanel.svelte            | 2 +-
 src/lib/components/radio-group/RadioGroup.svelte          | 2 +-
 src/lib/components/switch/SwitchGroup.svelte              | 2 +-
 src/lib/components/tabs/TabGroup.svelte                   | 2 +-
 src/lib/components/transitions/TransitionRoot.svelte      | 4 ++--
 src/lib/internal/StackContextProvider.svelte              | 6 ++++--
 src/lib/internal/open-closed.ts                           | 2 +-
 16 files changed, 20 insertions(+), 18 deletions(-)

diff --git a/src/lib/components/description/DescriptionProvider.svelte b/src/lib/components/description/DescriptionProvider.svelte
index 9d4881d..3339223 100644
--- a/src/lib/components/description/DescriptionProvider.svelte
+++ b/src/lib/components/description/DescriptionProvider.svelte
@@ -6,7 +6,7 @@
     descriptionIds?: string;
   }
 
-  const DESCRIPTION_CONTEXT_NAME = "DescriptionContext";
+  const DESCRIPTION_CONTEXT_NAME = "headlessui-description-context";
   export function useDescriptionContext():
     | Writable<DescriptionContext>
     | undefined {
diff --git a/src/lib/components/dialog/Dialog.svelte b/src/lib/components/dialog/Dialog.svelte
index 520f85f..1a4f6e8 100644
--- a/src/lib/components/dialog/Dialog.svelte
+++ b/src/lib/components/dialog/Dialog.svelte
@@ -22,7 +22,7 @@
     close(): void;
   }
 
-  const DIALOG_CONTEXT_NAME = "DialogContext";
+  const DIALOG_CONTEXT_NAME = "headlessui-dialog-context";
 
   export function useDialogContext(
     component: string
diff --git a/src/lib/components/disclosure/Disclosure.svelte b/src/lib/components/disclosure/Disclosure.svelte
index ef35c60..135c48f 100644
--- a/src/lib/components/disclosure/Disclosure.svelte
+++ b/src/lib/components/disclosure/Disclosure.svelte
@@ -22,7 +22,7 @@
     close(focusableElement: HTMLElement | HTMLElement | null): void;
   }
 
-  let DISCLOSURE_CONTEXT_NAME = "DisclosureContext";
+  let DISCLOSURE_CONTEXT_NAME = "headlessui-disclosure-context";
 
   export function useDisclosureContext(
     component: string
diff --git a/src/lib/components/disclosure/DisclosurePanel.svelte b/src/lib/components/disclosure/DisclosurePanel.svelte
index 5ef7458..adec6b5 100644
--- a/src/lib/components/disclosure/DisclosurePanel.svelte
+++ b/src/lib/components/disclosure/DisclosurePanel.svelte
@@ -1,6 +1,6 @@
 <script lang="ts" context="module">
   import { getContext, setContext } from "svelte";
-  let DISCLOSURE_PANEL_CONTEXT_NAME = "DisclosurePanelContext";
+  let DISCLOSURE_PANEL_CONTEXT_NAME = "headlessui-disclosure-panel-context";
 
   export function usePanelContext(): string | undefined {
     return getContext(DISCLOSURE_PANEL_CONTEXT_NAME);
diff --git a/src/lib/components/label/LabelProvider.svelte b/src/lib/components/label/LabelProvider.svelte
index 1b91721..988ddfd 100644
--- a/src/lib/components/label/LabelProvider.svelte
+++ b/src/lib/components/label/LabelProvider.svelte
@@ -6,7 +6,7 @@
     labelIds?: string;
   }
 
-  const LABEL_CONTEXT_NAME = "LabelContext";
+  const LABEL_CONTEXT_NAME = "headlessui-label-context";
   export function useLabelContext(): Writable<LabelContext> | undefined {
     return getContext(LABEL_CONTEXT_NAME);
   }
diff --git a/src/lib/components/listbox/Listbox.svelte b/src/lib/components/listbox/Listbox.svelte
index 2c7053b..5b5c3cd 100644
--- a/src/lib/components/listbox/Listbox.svelte
+++ b/src/lib/components/listbox/Listbox.svelte
@@ -35,7 +35,7 @@
     select(value: unknown): void;
   };
 
-  const LISTBOX_CONTEXT_NAME = "ListboxContext";
+  const LISTBOX_CONTEXT_NAME = "headlessui-listbox-context";
   export function useListboxContext(
     component: string
   ): Writable<StateDefinition> {
diff --git a/src/lib/components/menu/Menu.svelte b/src/lib/components/menu/Menu.svelte
index 2c0a9de..26ed780 100644
--- a/src/lib/components/menu/Menu.svelte
+++ b/src/lib/components/menu/Menu.svelte
@@ -32,7 +32,7 @@
     unregisterItem(id: string): void;
   };
 
-  const MENU_CONTEXT_NAME = "MenuContext";
+  const MENU_CONTEXT_NAME = "headlessui-menu-context";
 
   export function useMenuContext(
     componentName: string
diff --git a/src/lib/components/popover/Popover.svelte b/src/lib/components/popover/Popover.svelte
index b72d22a..30476c9 100644
--- a/src/lib/components/popover/Popover.svelte
+++ b/src/lib/components/popover/Popover.svelte
@@ -25,7 +25,7 @@
     close(): void;
   }
 
-  const POPOVER_CONTEXT_NAME = "PopoverContext";
+  const POPOVER_CONTEXT_NAME = "headlessui-popover-context";
   export function usePopoverContext(
     component: string
   ): Writable<StateDefinition> {
diff --git a/src/lib/components/popover/PopoverGroup.svelte b/src/lib/components/popover/PopoverGroup.svelte
index a8f94a0..642c677 100644
--- a/src/lib/components/popover/PopoverGroup.svelte
+++ b/src/lib/components/popover/PopoverGroup.svelte
@@ -6,7 +6,7 @@
     closeOthers(buttonId: string): void;
   }
 
-  const POPOVER_GROUP_CONTEXT_NAME = "PopoverGroupContext";
+  const POPOVER_GROUP_CONTEXT_NAME = "headlessui-popover-group-context";
   export function usePopoverGroupContext(): PopoverGroupContext | undefined {
     return getContext(POPOVER_GROUP_CONTEXT_NAME);
   }
diff --git a/src/lib/components/popover/PopoverPanel.svelte b/src/lib/components/popover/PopoverPanel.svelte
index 2f1fc09..8b48da2 100644
--- a/src/lib/components/popover/PopoverPanel.svelte
+++ b/src/lib/components/popover/PopoverPanel.svelte
@@ -1,7 +1,7 @@
 <script lang="ts" context="module">
   export type PopoverPanelContext = string | null;
 
-  const POPOVER_PANEL_CONTEXT_NAME = "PopoverPanelContext";
+  const POPOVER_PANEL_CONTEXT_NAME = "headlessui-popover-panel-context";
   export function usePopoverPanelContext():
     | StateDefinition["panelId"]
     | undefined {
diff --git a/src/lib/components/radio-group/RadioGroup.svelte b/src/lib/components/radio-group/RadioGroup.svelte
index 4932d50..f5614e1 100644
--- a/src/lib/components/radio-group/RadioGroup.svelte
+++ b/src/lib/components/radio-group/RadioGroup.svelte
@@ -26,7 +26,7 @@
     unregisterOption(id: Option["id"]): void;
   }
 
-  const RADIO_GROUP_CONTEXT_NAME = "RadioGroupContext";
+  const RADIO_GROUP_CONTEXT_NAME = "headlessui-radio-group-context";
   export function useRadioGroupContext(
     component: string
   ): Writable<StateDefinition> {
diff --git a/src/lib/components/switch/SwitchGroup.svelte b/src/lib/components/switch/SwitchGroup.svelte
index 65e41e2..e91e3f4 100644
--- a/src/lib/components/switch/SwitchGroup.svelte
+++ b/src/lib/components/switch/SwitchGroup.svelte
@@ -3,7 +3,7 @@
     switchStore: Writable<HTMLButtonElement | null>;
   }
 
-  const SWITCH_CONTEXT_NAME = "SwitchContext";
+  const SWITCH_CONTEXT_NAME = "headlessui-switch-context";
   export function useSwitchContext(): Writable<StateDefinition> | undefined {
     return getContext(SWITCH_CONTEXT_NAME);
   }
diff --git a/src/lib/components/tabs/TabGroup.svelte b/src/lib/components/tabs/TabGroup.svelte
index d833928..f79707a 100644
--- a/src/lib/components/tabs/TabGroup.svelte
+++ b/src/lib/components/tabs/TabGroup.svelte
@@ -25,7 +25,7 @@
     unregisterPanel(panel: string): void;
   };
 
-  const TABS_CONTEXT_NAME = "TabsContext";
+  const TABS_CONTEXT_NAME = "headlessui-tabs-context";
 
   export function useTabsContext(component: string): Writable<StateDefinition> {
     let context: Writable<StateDefinition> | undefined =
diff --git a/src/lib/components/transitions/TransitionRoot.svelte b/src/lib/components/transitions/TransitionRoot.svelte
index be1277e..4da5500 100644
--- a/src/lib/components/transitions/TransitionRoot.svelte
+++ b/src/lib/components/transitions/TransitionRoot.svelte
@@ -17,8 +17,8 @@
     appear: boolean;
   }
 
-  const TRANSITION_CONTEXT_NAME = "TransitionContext";
-  export const NESTING_CONTEXT_NAME = "NestingContext";
+  const TRANSITION_CONTEXT_NAME = "headlessui-transition-context";
+  export const NESTING_CONTEXT_NAME = "headlessui-nesting-context";
   export function hasTransitionContext() {
     return getContext(TRANSITION_CONTEXT_NAME) !== undefined;
   }
diff --git a/src/lib/internal/StackContextProvider.svelte b/src/lib/internal/StackContextProvider.svelte
index 145687d..82dbaa1 100644
--- a/src/lib/internal/StackContextProvider.svelte
+++ b/src/lib/internal/StackContextProvider.svelte
@@ -3,6 +3,8 @@
     Add,
     Remove,
   }
+
+  const STACK_CONTEXT_NAME = "headlessui-stack-context";
 </script>
 
 <script lang="ts">
@@ -14,9 +16,9 @@
   export let element: HTMLElement | null;
 
   let parentUpdateStore: Writable<OnUpdate> | undefined =
-    getContext("StackContext");
+    getContext(STACK_CONTEXT_NAME);
   let notifyStore: Writable<OnUpdate> = writable(() => {});
-  setContext("StackContext", notifyStore);
+  setContext(STACK_CONTEXT_NAME, notifyStore);
 
   $: notifyStore.set((...args: Parameters<OnUpdate>) => {
     // Notify our layer
diff --git a/src/lib/internal/open-closed.ts b/src/lib/internal/open-closed.ts
index f038d8a..25cf781 100644
--- a/src/lib/internal/open-closed.ts
+++ b/src/lib/internal/open-closed.ts
@@ -6,7 +6,7 @@ export enum State {
   Closed,
 }
 
-const OPEN_CLOSED_CONTEXT_NAME = "OpenClosed";
+const OPEN_CLOSED_CONTEXT_NAME = "headlessui-open-closed-context";
 export function hasOpenClosed() {
   return useOpenClosed() !== undefined;
 }