noph-ui 0.21.7 → 0.21.9

package/dist/autocomplete/AutoComplete.svelte

@@ -136,7 +136,7 @@
 	bind:element={menuElement}
 >
 	{#if useVirtualList}
-		<VirtualList height="250px" itemHeight={56} items={displayOptions}>
+		<VirtualList height="250px" itemHeight={48} items={displayOptions}>
 			{#snippet row(option)}
 				{@render item(option)}
 			{/snippet}

package/dist/list/Item.svelte

@@ -151,9 +151,10 @@
 		text-align: start;
 		overflow: hidden;
 		width: 100%;
-		padding: 0.75rem 1rem;
-		min-height: 3.5rem;
-		gap: 1rem;
+		padding-block: 0.75rem;
+		padding-inline: 1rem;
+		min-height: 3rem;
+		gap: 0.75rem;
 		text-decoration: none;
 		-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 		color: var(--np-item-label-text-color, var(--np-color-on-surface));

package/dist/radio/Radio.svelte

@@ -15,7 +15,7 @@
 </script>
 
 <label {style} class={['np-host', attributes.class]} bind:this={element}>
-	<div class="np-container" aria-hidden="true">
+	<div class="np-container">
 		{#if !attributes.disabled}
 			<Ripple forElement={inputEl} class="np-radio-ripple" />
 		{/if}

package/dist/select/Check.svelte

@@ -27,6 +27,7 @@
 		position: relative;
 		vertical-align: top;
 		width: 18px;
+		padding: 3px;
 		-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 		cursor: pointer;
 	}

package/dist/select/Select.svelte

@@ -336,37 +336,64 @@
 </div>
 
 {#snippet item(option: SelectOption)}
-	<Item
-		onclick={(event) => {
-			handleOptionSelect(event, option)
-			field?.focus()
-		}}
-		disabled={option.disabled}
-		onkeydown={(event) => {
-			if (event.key === 'ArrowDown') {
-				;(event.currentTarget?.nextElementSibling as HTMLElement)?.focus()
-				event.preventDefault()
-			}
-			if (event.key === 'ArrowUp') {
-				;(event.currentTarget?.previousElementSibling as HTMLElement)?.focus()
-				event.preventDefault()
-			}
-			if (event.key === 'Enter') {
+	{#if Array.isArray(value) && multiple}
+		<Item
+			onclick={(event) => {
 				handleOptionSelect(event, option)
-			}
-			if (event.key === 'Tab') {
-				menuElement?.hidePopover()
-			}
-		}}
-		variant="button"
-		selected={Array.isArray(value) ? value.includes(option.value) : value === option.value}
-		>{option.label}
-		{#snippet start()}
-			{#if Array.isArray(value) && multiple}
+				field?.focus()
+			}}
+			disabled={option.disabled}
+			onkeydown={(event) => {
+				if (event.key === 'ArrowDown') {
+					;(event.currentTarget?.nextElementSibling as HTMLElement)?.focus()
+					event.preventDefault()
+				}
+				if (event.key === 'ArrowUp') {
+					;(event.currentTarget?.previousElementSibling as HTMLElement)?.focus()
+					event.preventDefault()
+				}
+				if (event.key === 'Enter') {
+					handleOptionSelect(event, option)
+				}
+				if (event.key === 'Tab') {
+					menuElement?.hidePopover()
+				}
+			}}
+			variant="button"
+			selected={Array.isArray(value) ? value.includes(option.value) : value === option.value}
+			>{option.label}
+			{#snippet start()}
 				<Check disabled={option.disabled} checked={value.includes(option.value)} />
-			{/if}
-		{/snippet}
-	</Item>
+			{/snippet}
+		</Item>
+	{:else}
+		<Item
+			onclick={(event) => {
+				handleOptionSelect(event, option)
+				field?.focus()
+			}}
+			disabled={option.disabled}
+			onkeydown={(event) => {
+				if (event.key === 'ArrowDown') {
+					;(event.currentTarget?.nextElementSibling as HTMLElement)?.focus()
+					event.preventDefault()
+				}
+				if (event.key === 'ArrowUp') {
+					;(event.currentTarget?.previousElementSibling as HTMLElement)?.focus()
+					event.preventDefault()
+				}
+				if (event.key === 'Enter') {
+					handleOptionSelect(event, option)
+				}
+				if (event.key === 'Tab') {
+					menuElement?.hidePopover()
+				}
+			}}
+			variant="button"
+			selected={Array.isArray(value) ? value.includes(option.value) : value === option.value}
+			>{option.label}
+		</Item>
+	{/if}
 {/snippet}
 
 <Menu
@@ -391,7 +418,7 @@
 	bind:element={menuElement}
 >
 	{#if useVirtualList}
-		<VirtualList height="250px" itemHeight={56} items={options}>
+		<VirtualList height="250px" itemHeight={48} items={options}>
 			{#snippet row(option)}
 				{@render item(option)}
 			{/snippet}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "noph-ui",
-  "version": "0.21.7",
+  "version": "0.21.9",
   "license": "MIT",
   "homepage": "https://noph.dev",
   "repository": {