docs: wt-table-actions-docs [WTEL-3960]

webitel · Nov 27, 2023 · f797fc7 · f797fc7
1 parent 21dfa8b
commit f797fc7
Show file tree

Hide file tree

Showing 4 changed files with 43 additions and 24 deletions.
diff --git a/docs/pages/webitel-ui/components/wt-table-actions/Readme.md b/docs/pages/webitel-ui/components/wt-table-actions/Readme.md
@@ -0,0 +1,20 @@
+<script setup>
+import Docs from './wt-table-actions-docs.vue';
+import ExampleTableActions from './examples/example-table-actions.vue';
+</script>
+
+# WtTableActions
+
+## Props
+::: raw
+<Docs />
+:::
+
+## Example Table Actions
+::: raw
+<ExampleTableActions />
+:::
+
+::: details Code
+<<< ./examples/example-table-actions.vue
+:::
diff --git a/docs/pages/webitel-ui/components/wt-table-actions/examples/example-table-actions.vue b/docs/pages/webitel-ui/components/wt-table-actions/examples/example-table-actions.vue
@@ -0,0 +1,14 @@
+<script setup>
+const callAlert = (arg) => alert(arg);
+</script>
+
+<template>
+  <wt-table-actions
+    :icons="['import', 'export', 'filter-reset', 'column-select', 'refresh', 'settings']"
+    @input="callAlert"
+  />
+</template>
+
+<style scoped lang="scss">
+
+</style>
diff --git a/docs/pages/webitel-ui/components/wt-table-actions/wt-table-actions-docs.vue b/docs/pages/webitel-ui/components/wt-table-actions/wt-table-actions-docs.vue
@@ -1,26 +1,11 @@
 <template>
-  <section>
-    <h2>Table Actions</h2>
-    <article>
-      <div class="example-wrapper">
-        <wt-table-actions
-          :icons="['import', 'export', 'filter-reset', 'column-select', 'refresh', 'settings']"
-        />
-        <pre><code class="language-html">
-          &lt;wt-table-actions
-            :icons="['import', 'export', 'filter-reset', 'column-select', 'refresh', 'settings']"
-          &gt;&lt;/wt-table-actions&gt;
-        </code></pre>
-      </div>
-    </article>
-    <component-props
-      :properties="properties"
-    />
-    <component-events
-      :events="events"
-    />
-    <component-slots />
-  </section>
+  <component-props
+    :properties="properties"
+  />
+  <component-events
+    :events="events"
+  />
+  <component-slots />
 </template>
 
 <script>
@@ -35,7 +20,7 @@ export default {
         code: '<wt-table-actions :icons="[]"></wt-table-actions>',
         type: 'Array',
         options: ['import', 'export', 'filter-reset', 'column-select', 'refresh', 'settings'],
-        default: "['refresh']",
+        default: '[\'refresh\']',
       },
     ],
     events: [

diff --git a/src/components/wt-tooltip/wt-tooltip.vue b/src/components/wt-tooltip/wt-tooltip.vue
@@ -129,7 +129,7 @@ onMounted(() => {
     @extend %typo-body-2;
     padding: var(--spacing-2xs) var(--spacing-xs);
     color: var(--wt-tooltip-text-color);
-    background: var(--wt-tooltip-background-color-color);
+    background: var(--wt-tooltip-background-color);
     border-radius: var(--border-radius);
     box-shadow: var(--elevation-10);
     z-index: 1000;