fix(ktooltip): make tooltip trigger focusable [KHCP-8987]

Kong · Oct 17, 2023 · 2be1998 · 2be1998
1 parent bd345ea
commit 2be1998
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/src/components/KLabel/KLabel.vue b/src/components/KLabel/KLabel.vue
@@ -84,10 +84,12 @@ $kLabelSpacingX: var(--kui-space-40, $kui-space-40);
   }
 
   .label-tooltip {
+    margin-left: $kLabelSpacingX;
+
     .tooltip-trigger-icon {
+      cursor: pointer;
       /* stylelint-disable-next-line @kong/design-tokens/use-proper-token */
       height: var(--kui-icon-size-30, $kui-icon-size-30) !important;
-      margin-left: $kLabelSpacingX;
       /* stylelint-disable-next-line @kong/design-tokens/use-proper-token */
       width: var(--kui-icon-size-30, $kui-icon-size-30) !important;
     }

diff --git a/src/components/KTooltip/KTooltip.vue b/src/components/KTooltip/KTooltip.vue
@@ -11,7 +11,9 @@
     trigger="hover"
     width="auto"
   >
-    <slot />
+    <div tabindex="0">
+      <slot />
+    </div>
 
     <template #content>
       <div role="tooltip">