feat(TooltipPrimitive): add ariaLabel, ariaLabelledby props

kiwicom · Nov 11, 2024 · 6b3bf9d · 6b3bf9d
1 parent 6c33de5
commit 6b3bf9d
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 1 deletion.
diff --git a/packages/orbit-components/src/primitives/TooltipPrimitive/TooltipPrimitive.stories.tsx b/packages/orbit-components/src/primitives/TooltipPrimitive/TooltipPrimitive.stories.tsx
@@ -27,12 +27,23 @@ const meta: Meta<typeof TooltipPrimitive> = {
 
   parameters: {
     controls: {
-      exclude: ["onShow", "enabled", "tabIndex", "renderInPortal", "size", "stopPropagation"],
+      exclude: [
+        "onShow",
+        "enabled",
+        "tabIndex",
+        "renderInPortal",
+        "size",
+        "stopPropagation",
+        "ariaLabel",
+        "ariaLabelledby",
+      ],
     },
   },
 
   args: {
     onShow: action("onShow"),
+    ariaLabel: "Tooltip label",
+    ariaLabelledby: "Tooltip labelledby",
   },
 };
 
@@ -59,6 +70,8 @@ export const Default: Story = {
         "size",
         "stopPropagation",
         "block",
+        "ariaLabel",
+        "ariaLabelledby",
       ],
     },
   },
@@ -162,6 +175,8 @@ export const WithImageInside: Story = {
         "renderInPortal",
         "stopPropagation",
         "block",
+        "ariaLabel",
+        "ariaLabelledby",
       ],
     },
   },

diff --git a/packages/orbit-components/src/primitives/TooltipPrimitive/index.tsx b/packages/orbit-components/src/primitives/TooltipPrimitive/index.tsx
@@ -52,6 +52,8 @@ const TooltipPrimitive = ({
   placement,
   noFlip,
   offset,
+  ariaLabel,
+  ariaLabelledby,
 }: Props) => {
   const [shown, setShown] = React.useState(false);
   const [referenceElement, setReferenceElement] = React.useState<HTMLSpanElement | null>(null);
@@ -133,6 +135,8 @@ const TooltipPrimitive = ({
         enabled={enabled}
         removeUnderlinedText={removeUnderlinedText}
         block={block}
+        aria-label={ariaLabel}
+        aria-labelledby={ariaLabelledby}
       >
         {children}
       </TooltipWrapper>

diff --git a/packages/orbit-components/src/primitives/TooltipPrimitive/types.d.ts b/packages/orbit-components/src/primitives/TooltipPrimitive/types.d.ts
@@ -25,4 +25,6 @@ export interface Props extends Common.Globals {
   readonly placement?: Placement;
   readonly noFlip?: boolean;
   readonly offset?: [number, number];
+  readonly ariaLabel?: string;
+  readonly ariaLabelledby?: string;
 }