Skip to content

Commit

Permalink
feat: support react v19
Browse files Browse the repository at this point in the history
This also removes some of the prop-type checks as react v19 does not support it anymore
  • Loading branch information
renovate[bot] authored Dec 18, 2024
1 parent 153f508 commit 363086b
Show file tree
Hide file tree
Showing 8 changed files with 61 additions and 63 deletions.
6 changes: 3 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@
"react-component"
],
"peerDependencies": {
"react": "^18.0.0"
"react": "^18.0.0 || ^19.0.0"
},
"devDependencies": {
"@babel/cli": "7.26.4",
Expand Down Expand Up @@ -79,8 +79,8 @@
"mini-css-extract-plugin": "2.9.2",
"prettier": "3.4.2",
"prism-react-renderer": "2.4.1",
"react": "18.3.1",
"react-dom": "18.3.1",
"react": "19.0.0",
"react-dom": "19.0.0",
"react-live": "4.1.8",
"react-modal": "3.16.3",
"webpack": "5.97.1",
Expand Down
75 changes: 35 additions & 40 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 3 additions & 3 deletions src/components/Tab.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import PropTypes from 'prop-types';
import React, { useEffect, useRef } from 'react';
import cx from 'clsx';

Expand All @@ -12,6 +11,8 @@ const defaultProps = {
selectedClassName: `${DEFAULT_CLASS}--selected`,
};

/*
Left for TS migration
const propTypes = {
children: PropTypes.oneOfType([
PropTypes.array,
Expand All @@ -31,7 +32,7 @@ const propTypes = {
selectedClassName: PropTypes.string,
tabIndex: PropTypes.string,
tabRef: PropTypes.func, // private
};
};*/

const Tab = (props) => {
let nodeRef = useRef();
Expand Down Expand Up @@ -82,7 +83,6 @@ const Tab = (props) => {
);
};

Tab.propTypes = propTypes;
Tab.tabsRole = 'Tab';

export default Tab;
7 changes: 4 additions & 3 deletions src/components/TabList.js
Original file line number Diff line number Diff line change
@@ -1,18 +1,20 @@
import PropTypes from 'prop-types';
import React from 'react';
import cx from 'clsx';

const defaultProps = {
className: 'react-tabs__tab-list',
};

/*
Left for TS migration
const propTypes = {
children: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
className: PropTypes.oneOfType([
PropTypes.string,
PropTypes.array,
PropTypes.object,
]),
};
};*/
const TabList = (props) => {
const { children, className, ...attributes } = {
...defaultProps,
Expand All @@ -27,6 +29,5 @@ const TabList = (props) => {
};

TabList.tabsRole = 'TabList';
TabList.propTypes = propTypes;

export default TabList;
6 changes: 4 additions & 2 deletions src/components/TabPanel.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import PropTypes from 'prop-types';
import React from 'react';
import cx from 'clsx';

Expand All @@ -8,6 +7,9 @@ const defaultProps = {
forceRender: false,
selectedClassName: `${DEFAULT_CLASS}--selected`,
};

/*
Left for TS migration
const propTypes = {
children: PropTypes.node,
className: PropTypes.oneOfType([
Expand All @@ -20,6 +22,7 @@ const propTypes = {
selected: PropTypes.bool, // private
selectedClassName: PropTypes.string,
};
*/
const TabPanel = (props) => {
const {
children,
Expand Down Expand Up @@ -50,6 +53,5 @@ const TabPanel = (props) => {
};

TabPanel.tabsRole = 'TabPanel';
TabPanel.propTypes = propTypes;

export default TabPanel;
12 changes: 7 additions & 5 deletions src/components/Tabs.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import PropTypes from 'prop-types';
import { checkPropTypes } from 'prop-types';
import React, { useEffect, useState } from 'react';
import {
childrenPropType,
Expand All @@ -12,6 +12,10 @@ const MODE_CONTROLLED = 0;
const MODE_UNCONTROLLED = 1;
const propTypes = {
children: childrenPropType,
onSelect: onSelectPropType,
selectedIndex: selectedIndexPropType,
/*
Left for TS migration
className: PropTypes.oneOfType([
PropTypes.string,
PropTypes.array,
Expand All @@ -27,10 +31,8 @@ const propTypes = {
environment: PropTypes.object,
focusTabOnClick: PropTypes.bool,
forceRenderTabPanel: PropTypes.bool,
onSelect: onSelectPropType,
selectedIndex: selectedIndexPropType,
selectedTabClassName: PropTypes.string,
selectedTabPanelClassName: PropTypes.string,
selectedTabPanelClassName: PropTypes.string,*/
};
const defaultProps = {
defaultFocus: false,
Expand Down Expand Up @@ -68,6 +70,7 @@ For more information about controlled and uncontrolled mode of react-tabs see ht
* It is initialized from the prop defaultFocus, and after the first render it is reset back to false. Later it can become true again when using keys to navigate the tabs.
*/
const Tabs = (props) => {
checkPropTypes(propTypes, props, 'prop', 'Tabs');
const {
children,
defaultFocus,
Expand Down Expand Up @@ -136,7 +139,6 @@ const Tabs = (props) => {
return <UncontrolledTabs {...subProps}>{children}</UncontrolledTabs>;
};

Tabs.propTypes = propTypes;
Tabs.tabsRole = 'Tabs';

export default Tabs;
9 changes: 5 additions & 4 deletions src/components/UncontrolledTabs.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import PropTypes from 'prop-types';
import { checkPropTypes } from 'prop-types';
import React, { cloneElement, useRef, useId } from 'react';
import cx from 'clsx';
import { childrenPropType } from '../helpers/propTypes';
Expand Down Expand Up @@ -49,6 +49,8 @@ const defaultProps = {

const propTypes = {
children: childrenPropType,
/*
Left for TS migration
direction: PropTypes.oneOf(['rtl', 'ltr']),
className: PropTypes.oneOfType([
PropTypes.string,
Expand All @@ -65,10 +67,11 @@ const propTypes = {
selectedIndex: PropTypes.number.isRequired,
selectedTabClassName: PropTypes.string,
selectedTabPanelClassName: PropTypes.string,
environment: PropTypes.object,
environment: PropTypes.object,*/
};

const UncontrolledTabs = (props) => {
checkPropTypes(propTypes, props, 'prop', 'UncontrolledTabs');
let tabNodes = useRef([]);
let tabIds = useRef([]);
const ref = useRef();
Expand Down Expand Up @@ -404,6 +407,4 @@ const UncontrolledTabs = (props) => {
);
};

UncontrolledTabs.propTypes = propTypes;

export default UncontrolledTabs;
3 changes: 0 additions & 3 deletions src/components/__tests__/Tabs-errors-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,10 +21,7 @@ describe('<Tabs />', () => {
function assertPropTypeWarning(message, nth = 1) {
expect(consoleErrorMock).toHaveBeenNthCalledWith(
nth,
expect.anything(),
expect.anything(),
expect.stringMatching(message),
expect.anything(),
);
}

Expand Down

0 comments on commit 363086b

Please sign in to comment.