# Option (/docs/products/dash-dots/reference/components/option)

Goes inside a `Select`.

**Children:** Nothing

## Example

`Option` is used inside `Select`:

![The Select component](/assets/images/dash-dots/components/select.webp)

```xml title="view.dml"
<Select label="Delivery" placeholder="Choose how" value="{{ delivery }}" onChange="setDelivery">
  <Option value="pickup" label="Pick up in store" />
  <Option value="courier" label="Courier" />
  <Option value="post" label="Post" />
</Select>
```

```ts title="controller.ts"
export default definePage({
  initialState: { delivery: 'pickup' },
  mutations: {
    setDelivery: (_state, event: ValueEvent) => ({ delivery: event.detail.value }),
  },
});
```

## Props

| Prop       | Type      | What it is                                                                |
| ---------- | --------- | ------------------------------------------------------------------------- |
| `value`    | `string`  | What the `Select`'s `onChange` sends when the person chooses this option. |
| `label`    | `string`  | What the person sees.                                                     |
| `disabled` | `boolean` | Dims it, and the person can't use it.                                     |

## Events

None.