Skip to content

Commit e4b9867

Browse files
committed
feat!: Remove UMD build and drop support for older browsers
BREAKING CHANGE: The UMD build has been removed. BREAKING CHANGE: Older browsers are not supported anymore. In particulare Internet Explorer, the default browser on Android < 5.0 and iOS Safari < 12.2 BREAKING CHANGE: src folder is not included anymore in the package to reduce package size.
1 parent ed49912 commit e4b9867

File tree

7 files changed

+48
-246
lines changed

7 files changed

+48
-246
lines changed

.babelrc.js

+1
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ const options = {
2323
[
2424
'@babel/env',
2525
{
26+
bugfixes: true,
2627
loose: true,
2728
modules,
2829
targets,

.browserslistrc

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
> 0.3%
2+
last 2 versions
3+
Firefox ESR
4+
not dead
5+
not Android <5
6+
maintained node versions

.gitignore

-1
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,5 @@ coverage/
33
node_modules/
44
npm-debug.log
55
lib/
6-
dist/
76
esm/
87
yarn-error.log

README.md

+6-31
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@ An accessible and easy tab component for ReactJS.
44

55
https://reactcommunity.org/react-tabs/
66

7-
> Version 5 of `react-tabs` needs react version 18 or newer
8-
>
7+
> Version 5 or newer of `react-tabs` needs react version 18 or newer
8+
>
99
> Version 4 of `react-tabs` needs react version 16.8 or newer
1010
1111
<ins><blockquote class="rich-diff-level-zero"> <p class="rich-diff-level-one">react-tabs was tested on real mobile devices and browsers with<br>
@@ -25,17 +25,6 @@ or
2525
npm install --save react-tabs
2626
```
2727

28-
You can also use react-tabs directly as UMD build in an HTML document by adding
29-
30-
```html
31-
<script src="https://unpkg.com/react-tabs/dist/react-tabs.development.js" />
32-
<!-- or -->
33-
<script src="https://unpkg.com/react-tabs/dist/react-tabs.production.min.js" />
34-
```
35-
36-
For example usages of the UMD builds have a look at the [`old_examples/umd`](./old_examples/umd/) folder.
37-
The development UMD build also needs the package `prop-types` being loaded besides `react`.
38-
3928
## Basic Example
4029

4130
```js
@@ -331,23 +320,6 @@ When using LESS you can easily import the default styles
331320
@import '../../path/to/node_modules/react-tabs/style/react-tabs.less';
332321
```
333322

334-
### UMD
335-
336-
When using the UMD version of react-tabs you can easily use the default styles by adding
337-
338-
```html
339-
<html>
340-
<head>
341-
...
342-
<link
343-
rel="stylesheet"
344-
href="https://unpkg.com/react-tabs/style/react-tabs.css"
345-
/>
346-
</head>
347-
...
348-
</html>
349-
```
350-
351323
### Custom Style
352324

353325
You can also always just simply copy the default style to your own css/scss/less and modify it to your own needs. The changelog will always tell you when classes change and we also consider changes that break the styling as semver major.
@@ -374,7 +346,10 @@ import { Tabs, TabList, Tab, TabPanel } from 'react-tabs';
374346
import type { ReactTabsFunctionComponent, TabProps } from 'react-tabs';
375347

376348
// All custom elements should pass through other props
377-
const CustomTab: ReactTabsFunctionComponent<TabProps> = ({ children, ...otherProps }) => (
349+
const CustomTab: ReactTabsFunctionComponent<TabProps> = ({
350+
children,
351+
...otherProps
352+
}) => (
378353
<Tab {...otherProps}>
379354
<h1>{children}</h1>
380355
</Tab>

package.json

+1-13
Original file line numberDiff line numberDiff line change
@@ -7,10 +7,9 @@
77
"typings": "index.d.ts",
88
"scripts": {
99
"clean:commonjs": "rimraf lib",
10-
"clean:umd": "rimraf dist",
10+
"clean:esm": "rimraf esm",
1111
"build:commonjs": "cross-env BABEL_OUTPUT=commonjs babel src/ --out-dir lib/ --ignore **/__tests__,**/__mocks__",
1212
"build:esm": "babel src/ --out-dir esm/ --ignore **/__tests__,**/__mocks__",
13-
"build:umd": "rollup -c",
1413
"build": "npm-run-all clean:* --parallel build:*",
1514
"format": "eslint src --fix --report-unused-disable-directives",
1615
"lint": "eslint src --report-unused-disable-directives",
@@ -33,13 +32,9 @@
3332
"url": "https://github.com/reactjs/react-tabs/issues"
3433
},
3534
"files": [
36-
"dist",
3735
"esm",
3836
"lib",
3937
"style",
40-
"src/*.js",
41-
"src/components/*.js",
42-
"src/helpers/*.js",
4338
"index.d.ts"
4439
],
4540
"homepage": "https://github.com/reactjs/react-tabs",
@@ -89,13 +84,6 @@
8984
"react-modal": "3.16.1",
9085
"react-test-renderer": "18.2.0",
9186
"rimraf": "3.0.2",
92-
"rollup": "2.79.1",
93-
"rollup-plugin-babel": "4.4.0",
94-
"rollup-plugin-commonjs": "10.1.0",
95-
"rollup-plugin-ignore": "1.0.10",
96-
"rollup-plugin-node-resolve": "5.2.0",
97-
"rollup-plugin-replace": "2.2.0",
98-
"rollup-plugin-terser": "7.0.2",
9987
"webpack": "5.75.0",
10088
"webpack-cli": "5.0.0",
10189
"webpack-dev-server": "4.11.1"

rollup.config.js

-55
This file was deleted.

0 commit comments

Comments
 (0)