mirror of
https://github.com/YunoHost/yunohost-portal.git
synced 2024-09-03 20:06:23 +02:00
52 lines
1,002 B
Vue
52 lines
1,002 B
Vue
<script setup lang="ts">
|
|
const props = withDefaults(
|
|
defineProps<{
|
|
type?: 'button' | 'submit' | 'reset'
|
|
text?: string
|
|
variant?: string
|
|
icon?: string
|
|
iconSize?: string
|
|
iconOnly?: boolean
|
|
iconClass?: string
|
|
block?: boolean
|
|
}>(),
|
|
{
|
|
type: 'button',
|
|
text: undefined,
|
|
variant: 'primary',
|
|
icon: undefined,
|
|
iconSize: '1.5em',
|
|
iconClass: '',
|
|
iconOnly: false,
|
|
block: false,
|
|
},
|
|
)
|
|
|
|
const variantClass = computed(() => {
|
|
return {
|
|
primary: 'btn-primary',
|
|
success: 'btn-success',
|
|
info: 'btn-info',
|
|
error: 'btn-error',
|
|
}[props.variant]
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<button
|
|
class="btn"
|
|
:class="[variantClass, { 'btn-block': block }]"
|
|
:type="type"
|
|
>
|
|
<slot name="default">
|
|
<Icon
|
|
v-if="icon"
|
|
:name="icon"
|
|
:size="iconSize"
|
|
:class="iconClass"
|
|
aria-hidden="true"
|
|
/>
|
|
<span :class="{ 'sr-only': iconOnly }">{{ text }}</span>
|
|
</slot>
|
|
</button>
|
|
</template>
|