Address interface/a11y feedback

Author: wise-king-sullyman

packages/react-core/src/components/Compass/CompassNavContent.tsx

@@ -3,6 +3,10 @@ import { css } from '@patternfly/react-styles';
 export interface CompassNavContentProps extends React.HTMLProps<HTMLDivElement> {
   /** Content of the nav content wrapper. */
   children: React.ReactNode;
+  /** Additional classes added to the nav content. */
+  className?: string;
+  /** Accessible label for the nav content. */
+  'aria-label'?: string;
 }
 
 export const CompassNavContent: React.FunctionComponent<CompassNavContentProps> = ({

packages/react-core/src/components/Compass/CompassNavHome.tsx

@@ -43,6 +43,10 @@ export interface CompassNavHomeProps extends Omit<React.HTMLProps<HTMLDivElement
   tooltipContent?: React.ReactNode;
   /** Click handler for the home button. */
   onClick?: React.MouseEventHandler<HTMLButtonElement>;
+  /** Additional classes added to the nav home wrapper. */
+  className?: string;
+  /** Accessible label for the nav home. */
+  'aria-label'?: string;
 }
 
 export const CompassNavHome: React.FunctionComponent<CompassNavHomeProps> = ({
@@ -56,7 +60,7 @@ export const CompassNavHome: React.FunctionComponent<CompassNavHomeProps> = ({
 
   return (
     <div className={css(styles.compassNav + '-home', className)} {...props}>
-      <Tooltip content={tooltipContent} triggerRef={buttonRef}>
+      <Tooltip content={tooltipContent} position="left" aria="none" aria-live="off" triggerRef={buttonRef}>
         <Button
           isCircle
           variant="plain"

packages/react-core/src/components/Compass/CompassNavMain.tsx

@@ -4,6 +4,8 @@ import { css } from '@patternfly/react-styles';
 export interface CompassNavMainProps extends React.HTMLProps<HTMLDivElement> {
   /** Content of the nav main section (typically tabs). */
   children: React.ReactNode;
+  /** Additional classes added to the nav main section. */
+  className?: string;
 }
 
 export const CompassNavMain: React.FunctionComponent<CompassNavMainProps> = ({

packages/react-core/src/components/Compass/CompassNavSearch.tsx

@@ -36,6 +36,10 @@ export interface CompassNavSearchProps extends Omit<React.HTMLProps<HTMLDivEleme
   tooltipContent?: React.ReactNode;
   /** Click handler for the search button. */
   onClick?: React.MouseEventHandler<HTMLButtonElement>;
+  /** Additional classes added to the nav search wrapper. */
+  className?: string;
+  /** Accessible label for the nav search. */
+  'aria-label'?: string;
 }
 
 export const CompassNavSearch: React.FunctionComponent<CompassNavSearchProps> = ({
@@ -49,7 +53,7 @@ export const CompassNavSearch: React.FunctionComponent<CompassNavSearchProps> =
 
   return (
     <div className={css(styles.compassNav + '-search', className)} {...props}>
-      <Tooltip content={tooltipContent} triggerRef={buttonRef}>
+      <Tooltip content={tooltipContent} aria="none" aria-live="off" triggerRef={buttonRef}>
         <Button
           isCircle
           variant="plain"