<template>
<Button
:type="type"
:color="color"
:disabled="disabled"
:test-id="testId"
:icon="icon"
@click="onClick"
@custom="onCustom"
>
Login
</Button>
</template>
<template>
<Button v-bind="button">Login</Button>
</template>
<script setup lang="ts">
const button = {
type: 'submit',
color: 'blue',
disabled: false,
testId: 'login-button',
icon: 'arrow-right',
}
</script>
<template>
<Button v-on="buttonEventHandlers">Login</Button>
</template>
<script setup lang="ts">
const buttonEventHandlers = {
onClick: () => console.log('Click'),
onCustom: () => console.log('Custom Event'),
}
</script>