fix(RadioGroup): forward all events including child components

N00nDay · Oct 15, 2022 · a2b2c89 · a2b2c89
1 parent 7df25db
commit a2b2c89
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 4 deletions.
diff --git a/src/lib/components/radio/Description.svelte b/src/lib/components/radio/Description.svelte
@@ -4,6 +4,11 @@
 	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,
@@ -23,6 +28,10 @@
 	$: finalClass = twMerge(defaultClass, $$props.class);
 </script>
 
-<span id={id ? `${id}-description` : undefined} class={finalClass} style={$$props.style}
-	><slot /></span
+<span
+	id={id ? `${id}-description` : undefined}
+	class={finalClass}
+	use:useActions={use}
+	use:forwardEvents
+	{...exclude($$props, ['use', 'class', 'id'])}><slot /></span
 >
diff --git a/src/lib/components/radio/GroupLabel.svelte b/src/lib/components/radio/GroupLabel.svelte
@@ -3,6 +3,11 @@
 	import { useContext } from '../../utils/useContext';
 	import { getContext } from 'svelte';
 	import { twMerge } from 'tailwind-merge';
+	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,
@@ -17,4 +22,10 @@
 	$: finalClass = twMerge(defaultClass, $$props.class);
 </script>
 
-<legend for={name} class={finalClass} style={$$props.style}><slot /></legend>
+<legend
+	for={name}
+	class={finalClass}
+	use:useActions={use}
+	use:forwardEvents
+	{...exclude($$props, ['use', 'class', 'for'])}><slot /></legend
+>
diff --git a/src/lib/components/radio/Label.svelte b/src/lib/components/radio/Label.svelte
@@ -4,6 +4,11 @@
 	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,
@@ -23,4 +28,10 @@
 	$: finalClass = twMerge(defaultClass, $$props.class);
 </script>
 
-<label for={id ? id : undefined} class={finalClass} style={$$props.style}><slot /></label>
+<label
+	for={id ? id : undefined}
+	class={finalClass}
+	use:useActions={use}
+	use:forwardEvents
+	{...exclude($$props, ['use', 'class', 'for'])}><slot /></label
+>