azalea/inkclip
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Pass aria-labelledby to the correct component in sliders

Browse Source
This commit is contained in:
daylily
2025-04-03 02:34:03 -04:00
parent 5a51339bfe
commit 932ba0b259
1 changed files with 2 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/components/ui/slider/slider.svelte
+2
View File
@@ -7,6 +7,7 @@
value = $bindable(), value = $bindable(),
orientation = 'horizontal', orientation = 'horizontal',
class: className, class: className,
'aria-labelledby': ariaLabelledby,
...restProps ...restProps
}: WithoutChildrenOrChild<SliderPrimitive.RootProps> = $props() }: WithoutChildrenOrChild<SliderPrimitive.RootProps> = $props()
</script> </script>
@@ -38,6 +39,7 @@ get along, so we shut typescript up by casting `value` to `never`.
<SliderPrimitive.Thumb <SliderPrimitive.Thumb
index={thumb} index={thumb}
class="border-primary bg-background ring-offset-background focus-visible:ring-ring block size-5 rounded-full border-2 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50" class="border-primary bg-background ring-offset-background focus-visible:ring-ring block size-5 rounded-full border-2 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50"
aria-labelledby={ariaLabelledby}
/> />
{/each} {/each}
{/snippet} {/snippet}