feat: enhance WidgetButton component with icon support

Updated button widget to support icon display and improved styling to match design system.

- Add icon rendering using widget.options.iconClass
- Update styling to use semantic tokens
- Use widget.label for display instead of widget.name
- Apply consistent button styling with design system tokens
This commit is contained in:
Johnpaul
2025-11-25 01:42:39 +01:00
parent a455c7be4c
commit 48c21f6f25

View File

@@ -1,14 +1,16 @@
<template>
<div class="flex flex-col gap-1">
<label v-if="widget.name" class="text-secondary text-sm">{{
widget.name
}}</label>
<Button
class="text-text-secondary w-full border-0 bg-component-node-widget-background p-2"
v-bind="filteredProps"
:aria-label="widget.name || widget.label"
:aria-label="widget.label"
size="small"
:text="true"
@click="handleClick"
/>
>
{{ widget.label }}
<i v-if="widget.options?.iconClass" :class="widget.options.iconClass"></i>
</Button>
</div>
</template>