From ea76b3d9d9bdace9c86c4827dab33d1be06b7cb4 Mon Sep 17 00:00:00 2001
From: nicolethoen <nthoen@redhat.com>
Date: Sat, 15 Nov 2025 00:12:09 -0500
Subject: [PATCH] fix(Compass): get props tables rendering correctly

---
 packages/react-core/src/components/Compass/Compass.tsx      | 2 +-
 .../react-core/src/components/Compass/CompassContent.tsx    | 2 +-
 .../react-core/src/components/Compass/CompassHeader.tsx     | 6 +++++-
 packages/react-core/src/components/Compass/CompassHero.tsx  | 6 +++++-
 .../react-core/src/components/Compass/CompassMainHeader.tsx | 2 +-
 .../src/components/Compass/CompassMainHeaderContent.tsx     | 2 +-
 .../src/components/Compass/CompassMainHeaderTitle.tsx       | 2 +-
 .../src/components/Compass/CompassMainHeaderToolbar.tsx     | 2 +-
 .../react-core/src/components/Compass/CompassMessageBar.tsx | 2 +-
 packages/react-core/src/components/Compass/CompassPanel.tsx | 2 +-
 10 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/packages/react-core/src/components/Compass/Compass.tsx b/packages/react-core/src/components/Compass/Compass.tsx
index 14b94635691..4594a4a19e5 100644
--- a/packages/react-core/src/components/Compass/Compass.tsx
+++ b/packages/react-core/src/components/Compass/Compass.tsx
@@ -52,7 +52,7 @@ export const Compass: React.FunctionComponent<CompassProps> = ({
   backgroundSrcLight,
   backgroundSrcDark,
   ...props
-}) => {
+}: CompassProps) => {
   const hasDrawer = drawerContent !== undefined;
 
   const backgroundImageStyles: { [key: string]: string } = {};
diff --git a/packages/react-core/src/components/Compass/CompassContent.tsx b/packages/react-core/src/components/Compass/CompassContent.tsx
index cfd9a74219d..e91c8668348 100644
--- a/packages/react-core/src/components/Compass/CompassContent.tsx
+++ b/packages/react-core/src/components/Compass/CompassContent.tsx
@@ -19,7 +19,7 @@ export const CompassContent: React.FunctionComponent<CompassContentProps> = ({
   drawerProps,
   drawerContent,
   ...props
-}) => {
+}: CompassContentProps) => {
   const hasDrawer = drawerContent !== undefined;
 
   const compassContent = (
diff --git a/packages/react-core/src/components/Compass/CompassHeader.tsx b/packages/react-core/src/components/Compass/CompassHeader.tsx
index 0d2896c2982..7de33925245 100644
--- a/packages/react-core/src/components/Compass/CompassHeader.tsx
+++ b/packages/react-core/src/components/Compass/CompassHeader.tsx
@@ -10,7 +10,11 @@ export interface CompassHeaderProps {
   profile?: React.ReactNode;
 }
 
-export const CompassHeader: React.FunctionComponent<CompassHeaderProps> = ({ logo, nav, profile }) => (
+export const CompassHeader: React.FunctionComponent<CompassHeaderProps> = ({
+  logo,
+  nav,
+  profile
+}: CompassHeaderProps) => (
   <>
     <div className={css(`${styles.compass}__logo`)}>{logo}</div>
     <div className={css(styles.compassNav)}>{nav}</div>
diff --git a/packages/react-core/src/components/Compass/CompassHero.tsx b/packages/react-core/src/components/Compass/CompassHero.tsx
index 6b28eb4af7f..ce57d73ccfe 100644
--- a/packages/react-core/src/components/Compass/CompassHero.tsx
+++ b/packages/react-core/src/components/Compass/CompassHero.tsx
@@ -9,7 +9,11 @@ export interface CompassHeroProps extends Omit<React.HTMLProps<HTMLDivElement>,
   className?: string;
 }
 
-export const CompassHero: React.FunctionComponent<CompassHeroProps> = ({ className, children, ...props }) => (
+export const CompassHero: React.FunctionComponent<CompassHeroProps> = ({
+  className,
+  children,
+  ...props
+}: CompassHeroProps) => (
   <div className={css(`${styles.compass}__hero`, className)} {...props}>
     {children}
   </div>
diff --git a/packages/react-core/src/components/Compass/CompassMainHeader.tsx b/packages/react-core/src/components/Compass/CompassMainHeader.tsx
index f62d0d0be6f..05407f7c93f 100644
--- a/packages/react-core/src/components/Compass/CompassMainHeader.tsx
+++ b/packages/react-core/src/components/Compass/CompassMainHeader.tsx
@@ -31,7 +31,7 @@ export const CompassMainHeader: React.FunctionComponent<CompassMainHeaderProps>
   children,
   compassPanelProps,
   ...props
-}) => {
+}: CompassMainHeaderProps) => {
   const _content =
     title !== undefined || toolbar !== undefined ? (
       <CompassPanel {...compassPanelProps}>
diff --git a/packages/react-core/src/components/Compass/CompassMainHeaderContent.tsx b/packages/react-core/src/components/Compass/CompassMainHeaderContent.tsx
index cebe3baba23..e8d5d49b682 100644
--- a/packages/react-core/src/components/Compass/CompassMainHeaderContent.tsx
+++ b/packages/react-core/src/components/Compass/CompassMainHeaderContent.tsx
@@ -16,7 +16,7 @@ export const CompassMainHeaderContent: React.FunctionComponent<CompassMainHeader
   children,
   className,
   ...props
-}) => (
+}: CompassMainHeaderContentProps) => (
   <div className={css(styles.compassMainHeaderContent, className)} {...props}>
     {children}
   </div>
diff --git a/packages/react-core/src/components/Compass/CompassMainHeaderTitle.tsx b/packages/react-core/src/components/Compass/CompassMainHeaderTitle.tsx
index f1a628c0ae7..d1fd6aab006 100644
--- a/packages/react-core/src/components/Compass/CompassMainHeaderTitle.tsx
+++ b/packages/react-core/src/components/Compass/CompassMainHeaderTitle.tsx
@@ -16,7 +16,7 @@ export const CompassMainHeaderTitle: React.FunctionComponent<CompassMainHeaderTi
   children,
   className,
   ...props
-}) => (
+}: CompassMainHeaderTitleProps) => (
   <div className={css(`${styles.compass}__main-header-title`, className)} {...props}>
     {children}
   </div>
diff --git a/packages/react-core/src/components/Compass/CompassMainHeaderToolbar.tsx b/packages/react-core/src/components/Compass/CompassMainHeaderToolbar.tsx
index 9dd986ef159..ef7f852a844 100644
--- a/packages/react-core/src/components/Compass/CompassMainHeaderToolbar.tsx
+++ b/packages/react-core/src/components/Compass/CompassMainHeaderToolbar.tsx
@@ -16,7 +16,7 @@ export const CompassMainHeaderToolbar: React.FunctionComponent<CompassMainHeader
   children,
   className,
   ...props
-}) => (
+}: CompassMainHeaderToolbarProps) => (
   <div className={css(`${styles.compass}__main-header-toolbar`, className)} {...props}>
     {children}
   </div>
diff --git a/packages/react-core/src/components/Compass/CompassMessageBar.tsx b/packages/react-core/src/components/Compass/CompassMessageBar.tsx
index 257a9b422dc..f38b8a8529b 100644
--- a/packages/react-core/src/components/Compass/CompassMessageBar.tsx
+++ b/packages/react-core/src/components/Compass/CompassMessageBar.tsx
@@ -12,7 +12,7 @@ export const CompassMessageBar: React.FunctionComponent<CompassMessageBarProps>
   children,
   className,
   ...props
-}) => (
+}: CompassMessageBarProps) => (
   <div className={css(styles.compassMessageBar, className)} {...props}>
     {children}
   </div>
diff --git a/packages/react-core/src/components/Compass/CompassPanel.tsx b/packages/react-core/src/components/Compass/CompassPanel.tsx
index bb62112f237..d7b77843e77 100644
--- a/packages/react-core/src/components/Compass/CompassPanel.tsx
+++ b/packages/react-core/src/components/Compass/CompassPanel.tsx
@@ -30,7 +30,7 @@ export const CompassPanel: React.FunctionComponent<CompassPanelProps> = ({
   isFullHeight,
   isScrollable,
   ...props
-}) => (
+}: CompassPanelProps) => (
   <div
     className={css(
       styles.compassPanel,