SelectButton pt demo completed

pull/3938/head
Bahadır Sofuoğlu 2023-05-08 15:32:33 +03:00
parent 5920b444a8
commit a360a2d3cd
1 changed files with 32 additions and 4 deletions

View File

@ -6,7 +6,9 @@
:options="options" :options="options"
aria-labelledby="basic" aria-labelledby="basic"
:pt="{ :pt="{
button: { class: 'bg-primary ' } label: ({ state }) => ({
class: state.focusedIndex === 1 ? 'text-blue-300' : undefined
})
}" }"
/> />
</div> </div>
@ -21,11 +23,28 @@ export default {
options: ['Off', 'On'], options: ['Off', 'On'],
code: { code: {
basic: ` basic: `
<SelectButton v-model="value" :options="options" aria-labelledby="basic" />`, <SelectButton
v-model="value"
:options="options"
aria-labelledby="basic"
:pt="{
label: ({ state }) => ({
class: state.focusedIndex === 1 ? 'text-blue-300' : undefined
})
}"/>`,
options: ` options: `
<template> <template>
<div class="card flex justify-content-center"> <div class="card flex justify-content-center">
<SelectButton v-model="value" :options="options" aria-labelledby="basic" /> <SelectButton
v-model="value"
:options="options"
aria-labelledby="basic"
:pt="{
label: ({ state }) => ({
class: state.focusedIndex === 1 ? 'text-blue-300' : undefined
})
}"
/>
</div> </div>
</template> </template>
@ -42,7 +61,16 @@ export default {
composition: ` composition: `
<template> <template>
<div class="card flex justify-content-center"> <div class="card flex justify-content-center">
<SelectButton v-model="value" :options="options" aria-labelledby="basic" /> <SelectButton
v-model="value"
:options="options"
aria-labelledby="basic"
:pt="{
label: ({ state }) => ({
class: state.focusedIndex === 1 ? 'text-blue-300' : undefined
})
}"
/>
</div> </div>
</template> </template>