41 lines
926 B
Markdown
41 lines
926 B
Markdown
<script setup>
|
|
import { computed, ref } from 'vue'
|
|
|
|
import Pills from '~/components/ui/Pills.vue';
|
|
import Layout from '~/components/ui/Layout.vue';
|
|
import Input from '~/components/ui/Input.vue';
|
|
|
|
const nullModel = ref({
|
|
current: [],
|
|
others: []
|
|
});
|
|
|
|
const staticModel = ref({
|
|
current: ["#Noise", "#FieldRecording", "#Experiment"]
|
|
});
|
|
|
|
const interactiveModel = ref({
|
|
current: ["#Noise", "#FieldRecording", "#Experiment"],
|
|
others: ["#Melody", "#Rhythm"]
|
|
});
|
|
</script>
|
|
|
|
# Pills
|
|
|
|
<Layout class="preview" style="padding:16px">
|
|
<Pills v-model="staticModel" label="Tags" />
|
|
</Layout>
|
|
|
|
Select a set of pills from presets, and add and remove custom ones
|
|
|
|
<Layout class="preview" style="padding:16px">
|
|
<Pills v-model="interactiveModel" label="Tags" />
|
|
<Input label="Label" placeholder="Placeholder"></Input>
|
|
</Layout>
|
|
|
|
## No pills
|
|
|
|
<Layout class="preview" style="padding:16px">
|
|
<Pills v-model="nullModel" />
|
|
</Layout>
|