# Segmented Switch
URL: https://pro.rv-grid.com/api/segmented-switch/
Source: src/content/docs/api/segmented-switch.md
### `SegmentedSwitch`

```ts
export function SegmentedSwitch<T extends SegmentedSwitchValue = SegmentedSwitchValue>(;
```

---

### `SegmentedSwitchRenderable`

```ts
export type SegmentedSwitchRenderable = any;
```

---

### `SegmentedSwitchValue`

```ts
export type SegmentedSwitchValue = string | number;
```

---

### `SegmentedSwitchOption`

```ts
export type SegmentedSwitchOption<T extends SegmentedSwitchValue = SegmentedSwitchValue> = {
  value: T;
  label: SegmentedSwitchRenderable;
  count?: number | string;
  title?: string;
  ariaLabel?: string;
  disabled?: boolean;
  className?: string;
  testId?: string;
};
```

---

### `SegmentedSwitchRole`

```ts
export type SegmentedSwitchRole = 'tablist' | 'radiogroup' | 'group';
```

---

### `SegmentedSwitchProps`

```ts
export type SegmentedSwitchProps<T extends SegmentedSwitchValue = SegmentedSwitchValue> = {
  value: T;
  options: SegmentedSwitchOption<T>[];
  onChange: (value: T, option: SegmentedSwitchOption<T>) => void;
  ariaLabel?: string;
  className?: string;
  itemClassName?: string;
  countClassName?: string;
  activeClassName?: string;
  disabled?: boolean;
  role?: SegmentedSwitchRole;
  testId?: string;
  renderOption?: (option: SegmentedSwitchOption<T>, state: { active: boolean; disabled: boolean }) => SegmentedSwitchRenderable;
  renderCount?: (option: SegmentedSwitchOption<T>, state: { active: boolean; disabled: boolean }) => SegmentedSwitchRenderable;
};
```
