fix tabs ref proptype (#2158)

* fix tabs ref proptype * ref shape
patternfly · Jun 5, 2019 · e28c44d · e28c44d
1 parent 1cbc01f
commit e28c44d
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 20 deletions.
diff --git a/packages/patternfly-4/react-core/src/components/Tabs/Tab.d.ts b/packages/patternfly-4/react-core/src/components/Tabs/Tab.d.ts
@@ -8,7 +8,7 @@ export interface TabProps extends Omit<HTMLProps<HTMLDivElement>, 'id'> {
   eventKey: number;
   id?: string;
   tabContentId?: string | number;
-  tabContentRef?: HTMLElement;
+  tabContentRef?: any;
   title: string;
 }
 

diff --git a/packages/patternfly-4/react-core/src/components/Tabs/Tab.js b/packages/patternfly-4/react-core/src/components/Tabs/Tab.js
@@ -16,33 +16,31 @@ const propTypes = {
   /** child id for case in which a TabContent section is defined outside of a Tabs component */
   tabContentId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
   /** child reference for case in which a TabContent section is defined outside of a Tabs component */
-  tabContentRef: PropTypes.node,
-  forwardRef: PropTypes.node // purposefully not documented
+  tabContentRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any }), PropTypes.string])
 };
 
 const defaultProps = {
   children: null,
   className: '',
   href: null,
   tabContentId: null,
-  tabContentRef: null,
-  forwardRef: undefined
+  tabContentRef: null
 };
 
 const withForwardedRef = Component => {
   class TabContainer extends React.Component {
     render() {
-      const { tabContentRef, ...rest } = this.props; // eslint-disable-line react/prop-types
-      return <Component ref={tabContentRef} {...rest} />;
+      const { forwardRef, ...rest } = this.props; // eslint-disable-line react/prop-types
+      return <Component ref={forwardRef} {...rest} />;
     }
   }
   return React.forwardRef((props, tabContentRef) => <TabContainer {...props} forwardRef={tabContentRef} />);
 };
 
 class Tab extends React.Component {
   render() {
-    // destructuring to prevent console warnings for applying eventKey, forwardRef, and tabContentId to a DOM element and remove title from the DOM element
-    const { children, eventKey, tabContentId, tabContentRef, forwardRef, title, ...props } = this.props;
+    // destructuring to prevent console warnings for applying eventKey, and tabContentId to a DOM element and remove title from the DOM element
+    const { children, eventKey, tabContentId, tabContentRef, title, ...props } = this.props;
     const Component = props.href ? 'a' : 'button';
     return (
       <Component {...props} ref={tabContentRef}>

diff --git a/packages/patternfly-4/react-core/src/components/Tabs/TabContent.d.ts b/packages/patternfly-4/react-core/src/components/Tabs/TabContent.d.ts
@@ -1,11 +1,14 @@
 import { FunctionComponent, HTMLProps } from 'react';
 
 export interface TabContentProps extends HTMLProps<HTMLDivElement> {
-  'aria-label'?: string;
   children?: any;
+  child?: React.ReactNode;
   className?: string;
+  activeKey?: number;
   eventKey?: number;
+  innerRef?: any;
   id: string;
+  'aria-label'?: string;
 }
 
 declare const TabContent: FunctionComponent<TabContentProps>;

diff --git a/packages/patternfly-4/react-core/src/components/Tabs/TabContent.js b/packages/patternfly-4/react-core/src/components/Tabs/TabContent.js
@@ -14,7 +14,7 @@ const propTypes = {
   /** uniquely identifies the controlling Tab if used outside Tabs component */
   eventKey: PropTypes.number,
   /** Callback for the section ref */
-  innerRef: PropTypes.func,
+  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any }), PropTypes.string]),
   /** id passed from parent to identify the content section */
   id: PropTypes.string.isRequired,
   /** title of controlling Tab if used outside Tabs component */

diff --git a/packages/patternfly-4/react-core/src/components/Tabs/__snapshots__/Tabs.test.js.snap b/packages/patternfly-4/react-core/src/components/Tabs/__snapshots__/Tabs.test.js.snap
@@ -79,7 +79,6 @@ exports[`should call handleScrollButtons tabs with scrolls 1`] = `
               aria-controls="pf-tab-section-0-tab1"
               className="pf-c-tabs__button"
               eventKey={0}
-              forwardRef={[Function]}
               href={null}
               id="tab1"
               onClick={[Function]}
@@ -125,7 +124,6 @@ exports[`should call handleScrollButtons tabs with scrolls 1`] = `
               aria-controls="pf-tab-section-1-tab2"
               className="pf-c-tabs__button"
               eventKey={1}
-              forwardRef={[Function]}
               href={null}
               id="tab2"
               onClick={[Function]}
@@ -171,7 +169,6 @@ exports[`should call handleScrollButtons tabs with scrolls 1`] = `
               aria-controls="pf-tab-section-2-tab3"
               className="pf-c-tabs__button"
               eventKey={2}
-              forwardRef={[Function]}
               href={null}
               id="tab3"
               onClick={[Function]}
@@ -443,7 +440,6 @@ exports[`should call scrollLeft tabs with scrolls 1`] = `
               aria-controls="pf-tab-section-0-tab1"
               className="pf-c-tabs__button"
               eventKey={0}
-              forwardRef={[Function]}
               href={null}
               id="tab1"
               onClick={[Function]}
@@ -489,7 +485,6 @@ exports[`should call scrollLeft tabs with scrolls 1`] = `
               aria-controls="pf-tab-section-1-tab2"
               className="pf-c-tabs__button"
               eventKey={1}
-              forwardRef={[Function]}
               href={null}
               id="tab2"
               onClick={[Function]}
@@ -535,7 +530,6 @@ exports[`should call scrollLeft tabs with scrolls 1`] = `
               aria-controls="pf-tab-section-2-tab3"
               className="pf-c-tabs__button"
               eventKey={2}
-              forwardRef={[Function]}
               href={null}
               id="tab3"
               onClick={[Function]}
@@ -807,7 +801,6 @@ exports[`should call scrollRight tabs with scrolls 1`] = `
               aria-controls="pf-tab-section-0-tab1"
               className="pf-c-tabs__button"
               eventKey={0}
-              forwardRef={[Function]}
               href={null}
               id="tab1"
               onClick={[Function]}
@@ -853,7 +846,6 @@ exports[`should call scrollRight tabs with scrolls 1`] = `
               aria-controls="pf-tab-section-1-tab2"
               className="pf-c-tabs__button"
               eventKey={1}
-              forwardRef={[Function]}
               href={null}
               id="tab2"
               onClick={[Function]}
@@ -899,7 +891,6 @@ exports[`should call scrollRight tabs with scrolls 1`] = `
               aria-controls="pf-tab-section-2-tab3"
               className="pf-c-tabs__button"
               eventKey={2}
-              forwardRef={[Function]}
               href={null}
               id="tab3"
               onClick={[Function]}