fix(ktooltip, klabel): remove tooltip slot wrapper (#1785)

* fix(ktooltip, klabel): remove tooltip slot wrapper * docs(tooltip): small tweak * docs(tooltip): minor fix
Kong · Oct 20, 2023 · cd55f54 · cd55f54
1 parent a8c6558
commit cd55f54
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 5 deletions.
diff --git a/docs/components/tooltip.md b/docs/components/tooltip.md
@@ -3,12 +3,12 @@
 **KTooltip** is a tooltip component that is used when you need a simple label to be displayed when hovering over an element. KTooltip has a single slot that takes in the element that you want the tooltip to trigger over. At least the label prop must be passed in for the tooltip to display anything. For example a button:
 
 <KTooltip label="Video Games">
-  <KButton>🎮</KButton>
+  <KButton>What is your hobby?</KButton>
 </KTooltip>
 
 ```html
 <KTooltip label="Video Games">
-  <KButton>🎮</KButton>
+  <KButton>What is your hobby?</KButton>
 </KTooltip>
 ```
 

diff --git a/src/components/KLabel/KLabel.vue b/src/components/KLabel/KLabel.vue
@@ -13,6 +13,7 @@
       <InfoIcon
         class="tooltip-trigger-icon"
         :color="`var(--kui-color-text-neutral, ${KUI_COLOR_TEXT_NEUTRAL})`"
+        tabindex="0"
       />
       <template #content>
         <slot name="tooltip">{{ info }}</slot>

diff --git a/src/components/KTooltip/KTooltip.vue b/src/components/KTooltip/KTooltip.vue
@@ -11,9 +11,7 @@
     trigger="hover"
     width="auto"
   >
-    <div :tabindex="$slots.default ? '0' : '-1'">
-      <slot />
-    </div>
+    <slot />
 
     <template
       v-if="showTooltip"