Prevent tooltip from rendering with empty label

.changeset/three-eels-clap.md

@@ -0,0 +1,5 @@
+---
+'@strapi/design-system': patch
+---
+
+Prevent tooltip from rendering when the label property is not passed

packages/design-system/src/components/Tooltip/Tooltip.test.tsx

@@ -0,0 +1,46 @@
+import { render as renderHarness } from '@test/utils';
+
+import { Button } from '../Button';
+
+import { Tooltip, type TooltipProps } from './Tooltip';
+
+const render = (props: Partial<TooltipProps> = {}) =>
+  renderHarness(
+    <Tooltip {...props}>
+      <Button>My button</Button>
+    </Tooltip>,
+  );
+
+describe('Tooltip', () => {
+  it('should render and be accessible with a label', async () => {
+    const { user, getByRole, findByRole } = render({
+      label: 'My tooltip',
+    });
+
+    await user.hover(getByRole('button'));
+
+    expect(await findByRole('tooltip', { name: 'My tooltip' })).toBeInTheDocument();
+  });
+
+  it('should render the label and not the description if both are provided', async () => {
+    const { user, getByRole, findByRole, queryByRole } = render({
+      label: 'My tooltip label',
+      description: 'My tooltip description',
+    });
+
+    await user.hover(getByRole('button'));
+
+    expect(await findByRole('tooltip', { name: 'My tooltip label' })).toBeInTheDocument();
+    expect(queryByRole('tooltip', { name: 'My tooltip description' })).not.toBeInTheDocument();
+  });
+
+  it('should not render when the label is empty', async () => {
+    const { user, getByRole, queryByRole } = render({
+      label: '',
+    });
+
+    await user.hover(getByRole('button'));
+
+    expect(queryByRole('tooltip', { name: 'My tooltip' })).not.toBeInTheDocument();
+  });
+});

packages/design-system/src/components/Tooltip/Tooltip.tsx

@@ -46,6 +46,8 @@ const TooltipImpl = React.forwardRef<TooltipElement, TooltipProps>(
     },
     forwardedRef,
   ) => {
+    if (!label && !description) return children;
+
     return (
       <Tooltip.Root
         defaultOpen={defaultOpen}