From 48c21f6f2525debb279afa6adbd7d82ef366374a Mon Sep 17 00:00:00 2001
From: Johnpaul <polymenjohn1@gmail.com>
Date: Tue, 25 Nov 2025 01:42:39 +0100
Subject: [PATCH] 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
---
 .../vueNodes/widgets/components/WidgetButton.vue     | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/renderer/extensions/vueNodes/widgets/components/WidgetButton.vue b/src/renderer/extensions/vueNodes/widgets/components/WidgetButton.vue
index d2a160282..99e916cfd 100644
--- a/src/renderer/extensions/vueNodes/widgets/components/WidgetButton.vue
+++ b/src/renderer/extensions/vueNodes/widgets/components/WidgetButton.vue
@@ -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>