Select
We never choose anything at all. Things happen. Or not.
Example
Basic
Show Code
vue
<script lang="ts" setup>
import { RCheckbox, RSelect } from 'roughness'
</script>
<template>
<RSelect placeholder="Test engineer rank">
<RCheckbox value="" label="Stable" />
<RCheckbox value="beta" />
<RCheckbox value="dev" />
<RCheckbox value="canary" />
</RSelect>
</template>
Multiple
Show Code
vue
<script lang="ts" setup>
import { RCheckbox, RSelect } from 'roughness'
</script>
<template>
<RSelect multiple placeholder="Exodia">
<RCheckbox value="Right Arm" />
<RCheckbox value="Left Arm" />
<RCheckbox value="Right Leg" />
<RCheckbox value="Left Leg" />
</RSelect>
</template>
State
Show Code
vue
<script lang="ts" setup>
import { RCheckbox, RSelect, RSpace } from 'roughness'
</script>
<template>
<RSpace>
<RSelect :model-value="[1]" multiple disabled>
<RCheckbox :value="1" label="Basic User Info" />
</RSelect>
<RSelect loading placeholder="Arsenal" />
</RSpace>
</template>
Clearable
Show Code
vue
<script lang="ts" setup>
import { RCheckbox, RSelect } from 'roughness'
</script>
<template>
<RSelect clearable placeholder="Blue time">
<RCheckbox value="Spring" />
<RCheckbox value="Summer" />
<RCheckbox value="Autumn" />
<RCheckbox value="Winter" />
</RSelect>
</template>
Tree
See Checkbox Tree.