Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | 1x 1x | <script setup lang="ts">
withDefaults(defineProps<{
variant?: "primary" | "secondary" | "text" | "destructive";
type?: "button" | "submit" | "reset";
disabled?: boolean;
loading?: boolean;
block?: boolean;
}>(), {
variant: "primary",
type: "button",
disabled: false,
loading: false,
block: false,
});
</script>
<template>
<button
class="pj-button"
:class="[
`pj-button--${variant}`,
{
'pj-button--block': block,
'pj-button--loading': loading,
},
]"
:type="type"
:disabled="disabled || loading"
:aria-busy="loading ? 'true' : undefined"
>
<span v-if="loading" class="pj-button__spinner" aria-hidden="true" />
<span class="pj-button__label"><slot /></span>
</button>
</template>
|