fix: migration table action buttons (#621)

* fix: migration table action buttons

* fix: "packageManager": "pnpm@9.15.9"

* fix: import table action buttom, update storybook subdep

Author: robsongajunior

apps/storybook/package.json

@@ -14,7 +14,9 @@
     "@aziontech/icons": "workspace:*",
     "@aziontech/theme": "workspace:*",
     "@aziontech/webkit": "workspace:*",
+    "@storybook/manager-api": "^8.6.14",
     "@tailwindcss/typography": "^0.5.10",
+    "@whitespace/storybook-addon-html": "^7.0.0",
     "primeflex": "^3.3.1",
     "primevue": "3.35.0",
     "tailwindcss": "^3.3.3",

packages/webkit/src/core/list-data-table/components/list-data-table-column-selector/list-data-table-column-selector.vue

@@ -1,9 +1,10 @@
 <script setup>
-  import PrimeButton from 'primevue/button'
   import Listbox from 'primevue/listbox'
   import OverlayPanel from 'primevue/overlaypanel'
   import { computed, ref } from 'vue'
 
+  import IconButton from '../../../../components/actions/icon-button/icon-button.vue'
+
   const props = defineProps({
     columns: {
       type: Array,
@@ -51,12 +52,13 @@
     class="flex justify-end"
     data-testid="data-table-actions-column-header"
   >
-    <PrimeButton
-      outlined
-      icon="ai ai-column"
-      @click="toggleColumnSelector"
+    <IconButton
       v-tooltip.top="{ value: 'Available Columns', showDelay: 200 }"
+      kind="outlined"
+      icon="ai ai-column"
+      size="small"
       data-testid="data-table-actions-column-header-toggle-columns"
+      @click="toggleColumnSelector"
     />
     <OverlayPanel
       ref="columnSelectorPanel"

packages/webkit/src/core/list-data-table/components/list-data-table-export/list-data-table-export.vue

@@ -1,5 +1,5 @@
 <script setup>
-  import PrimeButton from 'primevue/button'
+  import IconButton from '../../../../components/actions/icon-button/icon-button.vue'
 
   defineProps({
     label: {
@@ -36,18 +36,15 @@
 </script>
 
 <template>
-  <PrimeButton
-    @click="handleExport"
-    outlined
-    :class="buttonClass"
+  <IconButton
+    v-tooltip.bottom="{ value: tooltipText, showDelay: 200 }"
+    kind="outlined"
     icon="pi pi-download"
+    size="small"
+    :class="buttonClass"
     :data-testid="testId"
-    v-tooltip.bottom="{ value: tooltipText, showDelay: 200 }"
     :disabled="disabled"
     :loading="loading"
-  >
-    <template v-if="label">
-      {{ label }}
-    </template>
-  </PrimeButton>
+    @click="handleExport"
+  />
 </template>