bugfix: input chip select aria (#2445)

Co-authored-by: Mahmoud-zino <[email protected]>
Co-authored-by: Chris Simmons <[email protected]>

Author: 3 people

.changeset/real-cougars-invent.md

@@ -0,0 +1,5 @@
+---
+"@skeletonlabs/skeleton": patch
+---
+
+bugfix: added `label` prop to provide aria-label on inputChip.

packages/skeleton/src/lib/components/InputChip/InputChip.svelte

@@ -86,6 +86,10 @@
 	/** Provide arbitrary classes to style the input field region. */
 	export let regionInput: CssClasses = '';
 
+	// Props (A11y)
+	/** Provide the ARIA label for the select input. */
+	export let label = 'Chips select';
+
 	// Props (transition)
 	/**
 	 * Enable/Disable transitions
@@ -241,7 +245,7 @@
 <div class="input-chip {classesBase}" class:opacity-50={$$restProps.disabled}>
 	<!-- NOTE: Don't use `hidden` as it prevents `required` from operating -->
 	<div class="h-0 overflow-hidden">
-		<select bind:this={selectElement} bind:value {name} multiple {required} tabindex="-1">
+		<select bind:this={selectElement} bind:value {name} multiple {required} aria-label={label} tabindex="-1">
 			<!-- NOTE: options are required! -->
 			{#each value as option}<option value={option}>{option}</option>{/each}
 		</select>