Tile UI · SolidJS

CSR · SSR · SSG

NativeSelect

A styled native SolidJS select with SSR-safe initial values and reset behavior.

Selected: solid

import { createSignal } from 'solid-js';
import { Button, NativeSelect, NativeSelectOptGroup, NativeSelectOption } from '@tile-ui/solid';

export default function NativeSelectDemo() {
	const [value, setValue] = createSignal('solid');
	return (

Use NativeSelect when native option behavior and form reset semantics are preferred.

Registry install

pnpm dlx shadcn@latest add @tile-ui/native-select

Package usage

import { NativeSelect, NativeSelectOption } from '@tile-ui/solid';

<NativeSelect defaultValue="a">
	<NativeSelectOption value="a">Option A</NativeSelectOption>
	<NativeSelectOption value="b">Option B</NativeSelectOption>
</NativeSelect>

Highlights

  • Two sizes
  • Option and optgroup
  • Custom chevron

Registry dependencies

Item Purpose
native-select Component source and module styles
core Framework-agnostic logic helpers
utils Shared utility helpers
styles Shared SCSS tokens and globals

API reference

NativeSelect

Prop Type Default
size 'sm' | 'default'
value string
defaultValue string
onValueChange (value: string) => void

NativeSelectOption

No custom props.

NativeSelectOptGroup

No custom props.