Remove defaultProps from Fn components

ericgio · Oct 19, 2023 · 3f1cab1 · 3f1cab1
1 parent 5748950
commit 3f1cab1
Show file tree

Hide file tree

Showing 6 changed files with 14 additions and 41 deletions.
diff --git a/src/components/ClearButton/ClearButton.tsx b/src/components/ClearButton/ClearButton.tsx
@@ -14,13 +14,9 @@ const propTypes = {
   size: sizeType,
 };
 
-const defaultProps = {
-  label: 'Clear',
-};
-
 export interface ClearButtonProps
   extends Omit<HTMLProps<HTMLButtonElement>, 'size'> {
-  label: string;
+  label?: string;
   size?: Size;
 }
 
@@ -31,7 +27,7 @@ export interface ClearButtonProps
  */
 const ClearButton = ({
   className,
-  label,
+  label = 'Clear',
   onClick,
   onKeyDown,
   size,
@@ -70,6 +66,5 @@ const ClearButton = ({
 );
 
 ClearButton.propTypes = propTypes;
-ClearButton.defaultProps = defaultProps;
 
 export default ClearButton;
diff --git a/src/components/Highlighter/Highlighter.tsx b/src/components/Highlighter/Highlighter.tsx
@@ -9,10 +9,6 @@ const propTypes = {
   search: PropTypes.string.isRequired,
 };
 
-const defaultProps = {
-  highlightClassName: 'rbt-highlight-text',
-};
-
 export interface HighlighterProps {
   children: string;
   highlightClassName?: string;
@@ -27,7 +23,7 @@ export interface HighlighterProps {
  */
 const Highlighter = ({
   children,
-  highlightClassName,
+  highlightClassName = 'rbt-highlight-text',
   search,
 }: HighlighterProps) => {
   if (!search || !children) {
@@ -71,6 +67,5 @@ const Highlighter = ({
 };
 
 Highlighter.propTypes = propTypes;
-Highlighter.defaultProps = defaultProps;
 
 export default Highlighter;
diff --git a/src/components/Loader/Loader.tsx b/src/components/Loader/Loader.tsx
@@ -5,21 +5,16 @@ const propTypes = {
   label: PropTypes.string,
 };
 
-const defaultProps = {
-  label: 'Loading...',
-};
-
 export interface LoaderProps {
   label?: string;
 }
 
-const Loader = ({ label }: LoaderProps) => (
+const Loader = ({ label = 'Loading...' }: LoaderProps) => (
   <div className="rbt-loader spinner-border spinner-border-sm" role="status">
     <span className="sr-only visually-hidden">{label}</span>
   </div>
 );
 
 Loader.propTypes = propTypes;
-Loader.defaultProps = defaultProps;
 
 export default Loader;
diff --git a/src/components/Menu/Menu.tsx b/src/components/Menu/Menu.tsx
@@ -33,10 +33,6 @@ const propTypes = {
   maxHeight: PropTypes.string,
 };
 
-const defaultProps = {
-  'aria-label': 'menu-options',
-};
-
 export interface MenuProps extends HTMLProps<HTMLDivElement> {
   emptyLabel?: ReactNode;
   innerRef?: Ref<HTMLDivElement>;
@@ -66,6 +62,7 @@ const Menu = ({
     /* eslint-disable jsx-a11y/interactive-supports-focus */
     <div
       {...props}
+      aria-label={props['aria-label'] || 'menu-options'}
       className={cx('rbt-menu', 'dropdown-menu', 'show', props.className)}
       onMouseDown={
         // Prevent input from blurring when clicking on the menu scrollbar.
@@ -86,7 +83,6 @@ const Menu = ({
 };
 
 Menu.propTypes = propTypes;
-Menu.defaultProps = defaultProps;
 Menu.Divider = MenuDivider;
 Menu.Header = MenuHeader;
 

diff --git a/src/components/Typeahead/Typeahead.tsx b/src/components/Typeahead/Typeahead.tsx
@@ -117,10 +117,6 @@ const propTypes = {
   size: sizeType,
 };
 
-const defaultProps = {
-  isLoading: false,
-};
-
 const defaultRenderMenu = (
   results: Option[],
   menuProps: RenderMenuProps,
@@ -162,7 +158,6 @@ function getOverlayProps(props: TypeaheadComponentProps) {
 
 class TypeaheadComponent extends React.Component<TypeaheadComponentProps> {
   static propTypes = propTypes;
-  static defaultProps = defaultProps;
 
   _referenceElement: HTMLElement | null = null;
 
@@ -297,7 +292,7 @@ class TypeaheadComponent extends React.Component<TypeaheadComponentProps> {
   };
 
   _renderAux = ({ onClear, selected }: TypeaheadManagerChildProps) => {
-    const { clearButton, disabled, isLoading, size } = this.props;
+    const { clearButton, disabled, isLoading = 'false', size } = this.props;
 
     let content;
 

diff --git a/src/components/TypeaheadMenu/TypeaheadMenu.tsx b/src/components/TypeaheadMenu/TypeaheadMenu.tsx
@@ -19,7 +19,7 @@ export interface TypeaheadMenuProps extends MenuProps {
   newSelectionPrefix?: ReactNode;
   options: Option[];
   paginationText?: ReactNode;
-  renderMenuItemChildren: RenderMenuItemChildren;
+  renderMenuItemChildren?: RenderMenuItemChildren;
   text: string;
 }
 
@@ -39,23 +39,21 @@ const propTypes = {
   renderMenuItemChildren: PropTypes.func,
 };
 
-const defaultProps = {
-  newSelectionPrefix: 'New selection: ',
-  paginationText: 'Display additional results...',
-  renderMenuItemChildren: (option: Option, props: TypeaheadMenuProps) => (
+function renderMenuItemChildrenFn(option: Option, props: TypeaheadMenuProps) {
+  return (
     <Highlighter search={props.text}>
       {getOptionLabel(option, props.labelKey)}
     </Highlighter>
-  ),
-};
+  );
+}
 
 const TypeaheadMenu = (props: TypeaheadMenuProps) => {
   const {
     labelKey,
-    newSelectionPrefix,
+    newSelectionPrefix = 'New selection: ',
     options,
-    paginationText,
-    renderMenuItemChildren,
+    paginationText = 'Display additional results...',
+    renderMenuItemChildren = renderMenuItemChildrenFn,
     text,
     ...menuProps
   } = props;
@@ -122,6 +120,5 @@ const TypeaheadMenu = (props: TypeaheadMenuProps) => {
 };
 
 TypeaheadMenu.propTypes = propTypes;
-TypeaheadMenu.defaultProps = defaultProps;
 
 export default TypeaheadMenu;