# Select: Right to left

> The trigger, list and check follow the reading direction.

Example: https://hextaui.com/docs/select/examples/rtl
Component docs: https://hextaui.com/docs/select.md

## Add this example

```bash
npx shadcn@latest add https://hextaui.com/r/select-rtl.json
```

This adds `components/examples/select/rtl.tsx` with the Select component and the HextaUI theme tokens.

## Source

```tsx title="components/examples/select/rtl.tsx"
import {
  Select,
  SelectContent,
  SelectItem,
  SelectTrigger,
  SelectValue,
} from "@/components/ui/select"

const cities = [
  { value: "cairo", label: "القاهرة" },
  { value: "riyadh", label: "الرياض" },
  { value: "dubai", label: "دبي" },
]

export function SelectRtl() {
  return (
    <div dir="rtl">
      <Select items={cities} defaultValue="riyadh">
        <SelectTrigger aria-label="المدينة" className="w-44">
          <SelectValue />
        </SelectTrigger>
        <SelectContent>
          {cities.map((city) => (
            <SelectItem key={city.value} value={city.value}>
              {city.label}
            </SelectItem>
          ))}
        </SelectContent>
      </Select>
    </div>
  )
}
```

## Props in this example

### Select

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `defaultValue` | `Value \| Value[] \| null` | – |  |
| `items` | `Record<string, ReactNode> \| { value, label }[]` | – | Lets SelectValue show labels. |

### SelectItem

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `value` | `Value` | – |  |

## More Select examples

- [Sizes](https://hextaui.com/docs/select/examples/sizes.md)
- [Groups and long lists](https://hextaui.com/docs/select/examples/groups.md)
- [With icons](https://hextaui.com/docs/select/examples/icons.md)
- [Multiple](https://hextaui.com/docs/select/examples/multiple.md)
- [In a form](https://hextaui.com/docs/select/examples/field.md)
- [Disabled and invalid](https://hextaui.com/docs/select/examples/states.md)
- [Below the trigger](https://hextaui.com/docs/select/examples/dropdown.md)