feat: add rest parameter to ToggletipLabel (#18601)

Author: adamalston

packages/react/src/components/Toggletip/__tests__/ToggletipLabel-test.js

@@ -1,13 +1,46 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2025
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { ToggletipLabel } from '..';
+
 describe('ToggletipLabel', () => {
   describe('Component API', () => {
-    it.todo('should support custom elements with the `as` prop');
-    it.todo('should support a custom class name with the `className` prop');
+    it('should support custom elements with the `as` prop', () => {
+      render(
+        <ToggletipLabel as="div" data-testid="toggletip-label">
+          Label Text
+        </ToggletipLabel>
+      );
+
+      const label = screen.getByTestId('toggletip-label');
+
+      expect(label.tagName).toBe('DIV');
+    });
+
+    it('should support a custom class name with the `className` prop', () => {
+      const { container } = render(
+        <ToggletipLabel className="custom-class">Label Text</ToggletipLabel>
+      );
+
+      expect(container.firstChild).toHaveClass('custom-class');
+    });
+
+    it('should forward extra props to the underlying element', () => {
+      render(
+        <ToggletipLabel as="p" data-custom="123">
+          Label Text
+        </ToggletipLabel>
+      );
+
+      const label = screen.getByText('Label Text');
+
+      expect(label).toHaveAttribute('data-custom', '123');
+    });
   });
 });

packages/react/src/components/Toggletip/index.tsx

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2025
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -28,7 +28,7 @@ type ToggletipLabelProps<E extends ElementType> = {
   as?: E;
   children?: ReactNode;
   className?: string;
-};
+} & Omit<React.ComponentPropsWithoutRef<E>, 'as' | 'children' | 'className'>;
 
 /**
  * Used to render the label for a Toggletip
@@ -37,12 +37,15 @@ export function ToggletipLabel<E extends ElementType>({
   as: BaseComponent = 'span' as E,
   children,
   className: customClassName,
+  ...rest
 }: ToggletipLabelProps<E>) {
   const prefix = usePrefix();
   const className = cx(`${prefix}--toggletip-label`, customClassName);
   const BaseComponentAsAny = BaseComponent as any;
   return (
-    <BaseComponentAsAny className={className}>{children}</BaseComponentAsAny>
+    <BaseComponentAsAny className={className} {...rest}>
+      {children}
+    </BaseComponentAsAny>
   );
 }