Merge pull request #29205 from backstage/canon-fix-button-typing

Canon - Fix Button types

.changeset/chubby-kids-hear.md

@@ -0,0 +1,5 @@
+---
+'@backstage/canon': patch
+---
+
+Fix Button types that was preventing the use of native attributes like onClick.

packages/canon/report.api.md

@@ -142,22 +142,12 @@ export const buttonPropDefs: {
 };
 
 // @public
-export interface ButtonProps {
-  // (undocumented)
+export interface ButtonProps
+  extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'> {
   children: React.ReactNode;
-  // (undocumented)
-  className?: string;
-  // (undocumented)
-  disabled?: boolean;
-  // (undocumented)
   iconEnd?: IconNames;
-  // (undocumented)
   iconStart?: IconNames;
-  // (undocumented)
   size?: ButtonOwnProps['size'];
-  // (undocumented)
-  style?: React.CSSProperties;
-  // (undocumented)
   variant?: ButtonOwnProps['variant'];
 }
 

packages/canon/src/components/Button/types.ts

@@ -21,13 +21,32 @@ import type { ButtonOwnProps } from './Button.props';
  *
  * @public
  */
-export interface ButtonProps {
+export interface ButtonProps
+  extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'> {
+  /**
+   * The size of the button
+   * @defaultValue 'medium'
+   */
   size?: ButtonOwnProps['size'];
+
+  /**
+   * The visual variant of the button
+   * @defaultValue 'primary'
+   */
   variant?: ButtonOwnProps['variant'];
+
+  /**
+   * The content of the button
+   */
   children: React.ReactNode;
-  className?: string;
-  disabled?: boolean;
+
+  /**
+   * Optional icon to display at the start of the button
+   */
   iconStart?: IconNames;
+
+  /**
+   * Optional icon to display at the end of the button
+   */
   iconEnd?: IconNames;
-  style?: React.CSSProperties;
 }