Select

Select dropdowns are appropriate when you are allowing the user to choose between many options. If there are only a few options to choose from, prefer the RadioButton component.
Source code
import { Select } from "rfui";

#Basic

<Select>
  <option value="foo">foo</option>
  <option value="bar">bar</option>
  <option value="baz">baz</option>
</Select>

#Controlled

See Controlled & Uncontrolled Components and Select Input. Passing checked and onChange work because of ...rest.
<Select value={value} onChange={onChange}>
  <option value="foo">foo</option>
  <option value="bar">bar</option>
  <option value="baz">baz</option>
</Select>

#Size

Set size to either "sm", "md" or "lg". Defaults to "md".
<Stack class="w-fit gap-5">
  <Select size="sm">
    <option value="foo">foo</option>
    <option value="bar">bar</option>
    <option value="baz">baz</option>
  </Select>
  <Select size="md">
    <option value="foo">foo</option>
    <option value="bar">bar</option>
    <option value="baz">baz</option>
  </Select>
  <Select size="lg">
    <option value="foo">foo</option>
    <option value="bar">bar</option>
    <option value="baz">baz</option>
  </Select>
</Stack>

#Rounded

Set rounded to either "square", "sm", or "lg". Defaults to the value of the CSS variable --default-roundedness. See "Default roundedness".
<Stack class="w-fit gap-5">
  <Select rounded="square">
    <option value="foo">foo</option>
    <option value="bar">bar</option>
    <option value="baz">baz</option>
  </Select>
  <Select rounded="sm">
    <option value="foo">foo</option>
    <option value="bar">bar</option>
    <option value="baz">baz</option>
  </Select>
  <Select rounded="lg">
    <option value="foo">foo</option>
    <option value="bar">bar</option>
    <option value="baz">baz</option>
  </Select>
</Stack>

#Disabled

Set disabled to either true or false. Defaults to false.
<Select disabled>
  <option value="foo">foo</option>
  <option value="bar">bar</option>
  <option value="baz">baz</option>
</Select>

#Invalid

Set invalid to either true or false. Defaults to false.
<Select invalid>
  <option value="foo">foo</option>
  <option value="bar">bar</option>
  <option value="baz">baz</option>
</Select>

#Props

PropRequiredDefaultType and notes
size-"md"
"sm" | "md" | "lg"
rounded--
"square" | "sm" | "lg" | "full"
Defaults to the value of the CSS variable --default-roundedness. See "Default roundedness".
disabled-false
boolean
invalid-false
boolean
...rest--
Omit<ComponentProps<"select">, "size">
See the docs for rest parameters. For Select, you could pass anything you normally would pass to <select> because the return value looks something like this:
<select
  class={className}
  {...restWithoutClass}
>
  {children}
</select>