A real HTML select beneath a Minecraft closed-control surface.
Preview
Example source could not be loaded: native-select-example. Reload this page to retry.Usage
Import NativeSelect, NativeSelectOption and NativeSelectOptGroup from @/components/ui/native-select. Use native value/defaultValue and onChange(event); read event.target.value. The accessible name belongs on the real select.
Composition
Use optgroups for related options and name/required for form submission. The ref points to the HTMLSelectElement. wrapperProps targets the surrounding div; native numeric size is excluded and only the wrapper's size="default" is supported. Use Select when a composed popup is needed.
API and accessibility
The closed-control decoration is inert and aria-hidden. The OS popup and multiple listbox are platform UI outside Minecraft pixel claims. Scale defaults to 2; native form and keyboard behavior remain intact.
See the underlying API for shared semantics.
Disabled
Example source could not be loaded: native-select-disabled-example. Reload this page to retry.Installation
Component source
This is the component implementation. Its supporting styles, helpers and resources are also required. See complete manual installation.
"use client";
import * as React from "react";
import {
isMinecraftRefCallback,
isMinecraftRefCleanup,
minecraftClasses as cn,
minecraftStyle,
} from "./minecraft-render";
import { playMinecraftClick } from "./minecraft-sound";
import { Select, SelectTrigger } from "./select";