native-select - examples

Examples are the tab where the component is shown doing a job, not demonstrating a prop. The API tab already lists the props.

Phone22remthe floor, the narrowest this promises to work at

tanstacktanstack add https://adamjurek.com/r/tanstack/native-select.json

shadcnpnpm dlx shadcn@latest add https://adamjurek.com/r/shadcn/native-select.json

Press Compare. The frames are real viewports, so a layout that breaks at 320 breaks here too rather than in somebody's hands.

In a page

import { NativeSelect } from "@sushindustries/ui";

export function ShippingForm() {
	return (
		<form className="flex flex-col gap-4">
			<label className="field">
				<span className="label">Country</span>
				<NativeSelect name="country" required defaultValue="">
					<option value="" disabled>
						Choose one
					</option>
					<option value="pl">Poland</option>
					<option value="de">Germany</option>
				</NativeSelect>
			</label>
			<label className="field">
				<span className="label">Size</span>
				<NativeSelect name="size" defaultValue="m">
					<option value="s">S</option>
					<option value="m">M</option>
					<option value="l">L</option>
				</NativeSelect>
			</label>
		</form>
	);
}

tsx