fix(Radio): fixed naming of existing context and removed needless con…

…text
N00nDay · Dec 30, 2022 · ec7f458 · ec7f458
1 parent 269dd64
commit ec7f458
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 73 deletions.
diff --git a/src/lib/components/radio/Description.svelte b/src/lib/components/radio/Description.svelte
@@ -1,28 +1,13 @@
 <script lang="ts">
 	import { twMerge } from 'tailwind-merge';
 	import { getContext } from 'svelte';
-	import { useContext } from '$lib/utils/useContext';
-	import { RADIO_GROUP_RADIO_CONTEXT_ID } from './Radio.svelte';
-	import { RADIO_GROUP_CONTEXT_ID } from './RadioGroup.svelte';
 	import { get_current_component } from 'svelte/internal';
 	import { forwardEventsBuilder, useActions, type ActionArray } from '../../actions';
 	export let use: ActionArray = [];
 	import { exclude } from '../../utils/exclude';
 	const forwardEvents = forwardEventsBuilder(get_current_component());
 
-	useContext({
-		context_id: RADIO_GROUP_CONTEXT_ID,
-		parent: 'RadioGroup',
-		component: 'RadioGroup.Radio.Description'
-	});
-
-	useContext({
-		context_id: RADIO_GROUP_RADIO_CONTEXT_ID,
-		parent: 'RadioGroup.Radio',
-		component: 'RadioGroup.Radio.Description'
-	});
-
-	const { id }: { id: string } = getContext(RADIO_GROUP_RADIO_CONTEXT_ID);
+	const id: string = getContext('radio-id');
 
 	const defaultClass = 'text-light-secondary-content dark:text-dark-secondary-content';
 	$: finalClass = twMerge(defaultClass, $$props.class);

diff --git a/src/lib/components/radio/GroupLabel.svelte b/src/lib/components/radio/GroupLabel.svelte
@@ -1,6 +1,4 @@
 <script lang="ts">
-	import { RADIO_GROUP_CONTEXT_ID } from './RadioGroup.svelte';
-	import { useContext } from '../../utils/useContext';
 	import { getContext } from 'svelte';
 	import { twMerge } from 'tailwind-merge';
 	import { get_current_component } from 'svelte/internal';
@@ -9,13 +7,7 @@
 	import { exclude } from '../../utils/exclude';
 	const forwardEvents = forwardEventsBuilder(get_current_component());
 
-	useContext({
-		context_id: RADIO_GROUP_CONTEXT_ID,
-		parent: 'RadioGroup',
-		component: 'RadioGroup.Label'
-	});
-
-	const { name }: { name: string } = getContext(RADIO_GROUP_CONTEXT_ID);
+	const name: string = getContext('radio-name');
 
 	const defaultClass =
 		'text-light-secondary-content dark:text-dark-secondary-content font-medium text-sm';

diff --git a/src/lib/components/radio/Label.svelte b/src/lib/components/radio/Label.svelte
@@ -1,28 +1,13 @@
 <script lang="ts">
 	import { twMerge } from 'tailwind-merge';
 	import { getContext } from 'svelte';
-	import { useContext } from '$lib/utils/useContext';
-	import { RADIO_GROUP_RADIO_CONTEXT_ID } from './Radio.svelte';
-	import { RADIO_GROUP_CONTEXT_ID } from './RadioGroup.svelte';
 	import { get_current_component } from 'svelte/internal';
 	import { forwardEventsBuilder, useActions, type ActionArray } from '../../actions';
 	export let use: ActionArray = [];
 	import { exclude } from '../../utils/exclude';
 	const forwardEvents = forwardEventsBuilder(get_current_component());
 
-	useContext({
-		context_id: RADIO_GROUP_CONTEXT_ID,
-		parent: 'RadioGroup',
-		component: 'RadioGroup.Radio.Label'
-	});
-
-	useContext({
-		context_id: RADIO_GROUP_RADIO_CONTEXT_ID,
-		parent: 'RadioGroup.Radio',
-		component: 'RadioGroup.Radio.Label'
-	});
-
-	const { id }: { id: string } = getContext(RADIO_GROUP_RADIO_CONTEXT_ID);
+	const id: string = getContext('radio-name');
 
 	const defaultClass = 'font-medium cursor-pointer text-light-content dark:text-dark-content';
 	$: finalClass = twMerge(defaultClass, $$props.class);

diff --git a/src/lib/components/radio/Radio.svelte b/src/lib/components/radio/Radio.svelte
@@ -1,35 +1,17 @@
-<script lang="ts" context="module">
-	export const RADIO_GROUP_RADIO_CONTEXT_ID = 'radio-group-radio-context-id';
-</script>
-
 <script lang="ts">
-	import { RADIO_GROUP_CONTEXT_ID } from './RadioGroup.svelte';
 	import { getContext, setContext } from 'svelte';
-	import { useContext } from '../../utils/useContext';
 	import HoverBackground from '../HoverBackground.svelte';
 	import type { Writable } from 'svelte/store';
 	import { twMerge } from 'tailwind-merge';
 
 	export let id: string | undefined = undefined;
 	export let value: string;
 
-	useContext({
-		context_id: RADIO_GROUP_CONTEXT_ID,
-		parent: 'RadioGroup',
-		component: 'RadioGroup.Radio'
-	});
-
-	setContext(RADIO_GROUP_RADIO_CONTEXT_ID, {
-		radio: true,
-		id
-	});
+	setContext('radio-id', id);
 
-	const {
-		name,
-		type,
-		selected
-	}: { name: string; type: 'default' | 'pill'; selected: Writable<string | undefined> } =
-		getContext(RADIO_GROUP_CONTEXT_ID);
+	const name: string = getContext('radio-name');
+	const type: 'default' | 'pill' = getContext('radio-type');
+	const selected: Writable<string | undefined> = getContext('radio-selected');
 
 	function handleClick() {
 		$selected = value;

diff --git a/src/lib/components/radio/RadioGroup.svelte b/src/lib/components/radio/RadioGroup.svelte
@@ -1,7 +1,3 @@
-<script lang="ts" context="module">
-	export const RADIO_GROUP_CONTEXT_ID = 'radio-group-context-id';
-</script>
-
 <script lang="ts">
 	import { twMerge } from 'tailwind-merge';
 	import { setContext } from 'svelte';
@@ -13,12 +9,9 @@
 
 	let selectedRadio = writable(selected);
 
-	setContext(RADIO_GROUP_CONTEXT_ID, {
-		radioGroup: true,
-		name,
-		type,
-		selected: selectedRadio
-	});
+	setContext('radio-name', name);
+	setContext('radio-type', type);
+	setContext('radio-selected', selectedRadio);
 
 	let defaultClass = 'mt-1 grid-cols-4 gap-2';
 	if (type === 'default') {