react-alp-loading-bar 4.0.6 → 4.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +19 -0
- package/README.md +3 -0
- package/dist/index-browser.es.js +2 -22
- package/dist/index-browser.es.js.map +1 -1
- package/dist/index-browsermodern.es.js +2 -14
- package/dist/index-browsermodern.es.js.map +1 -1
- package/dist/index-node14.mjs +2 -14
- package/dist/index-node14.mjs.map +1 -1
- package/package.json +13 -17
- package/rollup.config.mjs +0 -5
- package/tsconfig.eslint.json +0 -7
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,25 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [4.1.1](https://github.com/christophehurpeau/alp/compare/react-alp-loading-bar@4.1.0...react-alp-loading-bar@4.1.1) (2022-10-19)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package react-alp-loading-bar
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
# [4.1.0](https://github.com/christophehurpeau/alp/compare/react-alp-loading-bar@4.0.6...react-alp-loading-bar@4.1.0) (2022-10-16)
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
### Features
|
|
18
|
+
|
|
19
|
+
* update to react 18 ([6ac42b8](https://github.com/christophehurpeau/alp/commit/6ac42b84b80bf76853773f3b93819666684327d1))
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
|
|
6
25
|
## [4.0.6](https://github.com/christophehurpeau/alp/compare/react-alp-loading-bar@4.0.5...react-alp-loading-bar@4.0.6) (2022-10-13)
|
|
7
26
|
|
|
8
27
|
**Note:** Version bump only for package react-alp-loading-bar
|
package/README.md
CHANGED
|
@@ -8,6 +8,9 @@
|
|
|
8
8
|
|
|
9
9
|
<p align="center">
|
|
10
10
|
<a href="https://npmjs.org/package/react-alp-loading-bar"><img src="https://img.shields.io/npm/v/react-alp-loading-bar.svg?style=flat-square"></a>
|
|
11
|
+
<a href="https://npmjs.org/package/react-alp-loading-bar"><img src="https://img.shields.io/npm/dw/react-alp-loading-bar.svg?style=flat-square"></a>
|
|
12
|
+
<a href="https://npmjs.org/package/react-alp-loading-bar"><img src="https://img.shields.io/node/v/react-alp-loading-bar.svg?style=flat-square"></a>
|
|
13
|
+
<a href="https://npmjs.org/package/react-alp-loading-bar"><img src="https://img.shields.io/npm/types/react-alp-loading-bar.svg?style=flat-square"></a>
|
|
11
14
|
</p>
|
|
12
15
|
|
|
13
16
|
## Install
|
package/dist/index-browser.es.js
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import _inheritsLoose from '@babel/runtime/helpers/esm/inheritsLoose';
|
|
2
2
|
import { PureComponent } from 'react';
|
|
3
3
|
import ReactAlpContext from 'react-alp-context';
|
|
4
|
-
import { jsx } from 'react/jsx-runtime
|
|
4
|
+
import { jsx } from 'react/jsx-runtime';
|
|
5
5
|
|
|
6
6
|
var random = function random() {
|
|
7
7
|
return Math.ceil(Math.random() * 100) / 100;
|
|
8
8
|
};
|
|
9
|
+
|
|
9
10
|
/**
|
|
10
11
|
* around:
|
|
11
12
|
* at 100ms 20%
|
|
@@ -13,23 +14,17 @@ var random = function random() {
|
|
|
13
14
|
* at 2s 60%
|
|
14
15
|
* at 3s 80%
|
|
15
16
|
*/
|
|
16
|
-
|
|
17
|
-
|
|
18
17
|
var calculatePercent = function calculatePercent(percent) {
|
|
19
18
|
if (percent < 60) return percent + random() * 10 + 5;
|
|
20
19
|
if (percent < 70) return percent + random() * 10 + 3;else if (percent < 80) return percent + random() + 5;else if (percent < 90) return percent + random() + 1;else if (percent < 95) return percent + 0.1;else return percent;
|
|
21
20
|
};
|
|
22
|
-
|
|
23
21
|
var LoadingBar = /*#__PURE__*/function (_PureComponent) {
|
|
24
22
|
_inheritsLoose(LoadingBar, _PureComponent);
|
|
25
|
-
|
|
26
23
|
function LoadingBar() {
|
|
27
24
|
var _this, _len, args, _key;
|
|
28
|
-
|
|
29
25
|
for (_len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
30
26
|
args[_key] = arguments[_key];
|
|
31
27
|
}
|
|
32
|
-
|
|
33
28
|
_this = _PureComponent.call.apply(_PureComponent, [this].concat(args)) || this;
|
|
34
29
|
_this.state = {
|
|
35
30
|
loading: true,
|
|
@@ -38,14 +33,10 @@ var LoadingBar = /*#__PURE__*/function (_PureComponent) {
|
|
|
38
33
|
};
|
|
39
34
|
return _this;
|
|
40
35
|
}
|
|
41
|
-
|
|
42
36
|
var _proto = LoadingBar.prototype;
|
|
43
|
-
|
|
44
37
|
_proto.componentDidMount = function componentDidMount() {
|
|
45
38
|
var _this2 = this;
|
|
46
|
-
|
|
47
39
|
var websocket = this.getWebsocket();
|
|
48
|
-
|
|
49
40
|
if (websocket.isConnected()) {
|
|
50
41
|
this.setState(function (prevState) {
|
|
51
42
|
return {
|
|
@@ -55,7 +46,6 @@ var LoadingBar = /*#__PURE__*/function (_PureComponent) {
|
|
|
55
46
|
};
|
|
56
47
|
});
|
|
57
48
|
}
|
|
58
|
-
|
|
59
49
|
websocket.on('connect', function () {
|
|
60
50
|
_this2.setState({
|
|
61
51
|
loading: false
|
|
@@ -69,7 +59,6 @@ var LoadingBar = /*#__PURE__*/function (_PureComponent) {
|
|
|
69
59
|
});
|
|
70
60
|
});
|
|
71
61
|
};
|
|
72
|
-
|
|
73
62
|
_proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {
|
|
74
63
|
if (this.state.loading !== prevState.loading) {
|
|
75
64
|
if (this.state.loading) {
|
|
@@ -79,22 +68,18 @@ var LoadingBar = /*#__PURE__*/function (_PureComponent) {
|
|
|
79
68
|
}
|
|
80
69
|
}
|
|
81
70
|
};
|
|
82
|
-
|
|
83
71
|
_proto.componentWillUnmount = function componentWillUnmount() {
|
|
84
72
|
if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);
|
|
85
73
|
if (this.resetTimeout) clearTimeout(this.resetTimeout);
|
|
86
74
|
if (this.first20Timeout) clearTimeout(this.first20Timeout);
|
|
87
75
|
if (this.progressTimer) clearInterval(this.progressTimer);
|
|
88
76
|
};
|
|
89
|
-
|
|
90
77
|
_proto.getWebsocket = function getWebsocket() {
|
|
91
78
|
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return
|
|
92
79
|
return this.context.app.websocket;
|
|
93
80
|
};
|
|
94
|
-
|
|
95
81
|
_proto.showBar = function showBar() {
|
|
96
82
|
var _this3 = this;
|
|
97
|
-
|
|
98
83
|
if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);
|
|
99
84
|
if (this.resetTimeout) clearTimeout(this.resetTimeout);
|
|
100
85
|
this.first20Timeout = setTimeout(function () {
|
|
@@ -111,10 +96,8 @@ var LoadingBar = /*#__PURE__*/function (_PureComponent) {
|
|
|
111
96
|
});
|
|
112
97
|
}, 500);
|
|
113
98
|
};
|
|
114
|
-
|
|
115
99
|
_proto.hideBar = function hideBar() {
|
|
116
100
|
var _this4 = this;
|
|
117
|
-
|
|
118
101
|
if (this.first20Timeout) clearTimeout(this.first20Timeout);
|
|
119
102
|
if (this.progressTimer) clearInterval(this.progressTimer);
|
|
120
103
|
this.fadeOffTimeout = setTimeout(function () {
|
|
@@ -129,7 +112,6 @@ var LoadingBar = /*#__PURE__*/function (_PureComponent) {
|
|
|
129
112
|
});
|
|
130
113
|
}, 1000);
|
|
131
114
|
};
|
|
132
|
-
|
|
133
115
|
_proto.render = function render() {
|
|
134
116
|
var LoadingBarComponent = this.props.LoadingBarComponent;
|
|
135
117
|
return /*#__PURE__*/jsx("div", {
|
|
@@ -147,10 +129,8 @@ var LoadingBar = /*#__PURE__*/function (_PureComponent) {
|
|
|
147
129
|
})
|
|
148
130
|
});
|
|
149
131
|
};
|
|
150
|
-
|
|
151
132
|
return LoadingBar;
|
|
152
133
|
}(PureComponent);
|
|
153
|
-
|
|
154
134
|
LoadingBar.contextType = ReactAlpContext;
|
|
155
135
|
|
|
156
136
|
export { LoadingBar as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index-browser.es.js","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { PureComponent } from 'react';\nimport ReactAlpContext from 'react-alp-context';\n\n/*\nExample with antd:\nimport { Progress } from 'antd';\n\nconst LoadingBarComponent = ({ progress }) => (\n <Progress\n type=\"line\"\n status=\"active\"\n percent={progress}\n showInfo={false}\n />\n);\n*/\n\n/* number between 0 and 1 */\nconst random = (): number => Math.ceil(Math.random() * 100) / 100;\n\n/**\n * around:\n * at 100ms 20%\n * at 1s 40%\n * at 2s 60%\n * at 3s 80%\n */\nconst calculatePercent = (percent: number): number => {\n if (percent < 60) return percent + random() * 10 + 5;\n if (percent < 70) return percent + random() * 10 + 3;\n else if (percent < 80) return percent + random() + 5;\n else if (percent < 90) return percent + random() + 1;\n else if (percent < 95) return percent + 0.1;\n else return percent;\n};\n\ninterface LoadingBarProps {\n LoadingBarComponent: React.ComponentType<{ progress: number }>;\n}\n\ninterface LoadingBarState {\n loading: boolean;\n hidden: boolean;\n progress: number;\n}\n\ninterface WebsocketInterface {\n isConnected: () => boolean;\n on: (event: 'connect' | 'disconnect', callback: () => unknown) => void;\n}\n\nexport default class LoadingBar extends PureComponent<\n LoadingBarProps,\n LoadingBarState\n> {\n static contextType = ReactAlpContext;\n\n state = {\n loading: true,\n hidden: true,\n progress: 1,\n };\n\n fadeOffTimeout?: ReturnType<typeof setTimeout>;\n\n resetTimeout?: ReturnType<typeof setTimeout>;\n\n first20Timeout?: ReturnType<typeof setTimeout>;\n\n progressTimer?: ReturnType<typeof setTimeout>;\n\n componentDidMount(): void {\n const websocket = this.getWebsocket();\n if (websocket.isConnected()) {\n this.setState((prevState) => ({\n loading: false,\n progress: 100,\n hidden: prevState.hidden || prevState.progress === 100,\n }));\n }\n websocket.on('connect', () => {\n this.setState({ loading: false });\n });\n websocket.on('disconnect', () => {\n this.setState({ loading: true, progress: 1, hidden: false });\n });\n }\n\n componentDidUpdate(\n prevProps: LoadingBarProps,\n prevState: LoadingBarState,\n ): void {\n if (this.state.loading !== prevState.loading) {\n if (this.state.loading) {\n this.showBar();\n } else {\n this.hideBar();\n }\n }\n }\n\n componentWillUnmount(): void {\n if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);\n if (this.resetTimeout) clearTimeout(this.resetTimeout);\n if (this.first20Timeout) clearTimeout(this.first20Timeout);\n if (this.progressTimer) clearInterval(this.progressTimer);\n }\n\n getWebsocket(): WebsocketInterface {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return\n return (this.context as any).app.websocket;\n }\n\n private showBar(): void {\n if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);\n if (this.resetTimeout) clearTimeout(this.resetTimeout);\n\n this.first20Timeout = setTimeout(() => {\n this.setState({ progress: 20 });\n }, 100);\n\n this.progressTimer = setInterval(() => {\n this.setState((prevState) => {\n const newValue = calculatePercent(prevState.progress);\n return { progress: newValue };\n });\n }, 500);\n }\n\n private hideBar(): void {\n if (this.first20Timeout) clearTimeout(this.first20Timeout);\n if (this.progressTimer) clearInterval(this.progressTimer);\n\n this.fadeOffTimeout = setTimeout(() => {\n this.setState({\n progress: 100,\n });\n }, 500);\n\n this.resetTimeout = setTimeout(() => {\n this.setState({\n hidden: true,\n progress: 1,\n });\n }, 1000);\n }\n\n render(): ReactElement {\n const LoadingBarComponent = this.props.LoadingBarComponent;\n\n return (\n <div\n hidden={this.state.hidden}\n style={{\n position: 'fixed',\n top: 0,\n left: 0,\n right: 0,\n zIndex: 4,\n pointerEvents: 'none',\n }}\n >\n <LoadingBarComponent progress={this.state.progress} />\n </div>\n );\n }\n}\n"],"names":["random","Math","ceil","calculatePercent","percent","LoadingBar","state","loading","hidden","progress","componentDidMount","websocket","getWebsocket","isConnected","setState","prevState","on","componentDidUpdate","prevProps","showBar","hideBar","componentWillUnmount","fadeOffTimeout","clearTimeout","resetTimeout","first20Timeout","progressTimer","clearInterval","context","app","setTimeout","setInterval","newValue","render","LoadingBarComponent","props","_jsx","position","top","left","right","zIndex","pointerEvents","PureComponent","contextType","ReactAlpContext"],"mappings":";;;;;AAmBA,IAAMA,MAAM,GAAG,SAATA,
|
|
1
|
+
{"version":3,"file":"index-browser.es.js","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { PureComponent } from 'react';\nimport ReactAlpContext from 'react-alp-context';\n\n/*\nExample with antd:\nimport { Progress } from 'antd';\n\nconst LoadingBarComponent = ({ progress }) => (\n <Progress\n type=\"line\"\n status=\"active\"\n percent={progress}\n showInfo={false}\n />\n);\n*/\n\n/* number between 0 and 1 */\nconst random = (): number => Math.ceil(Math.random() * 100) / 100;\n\n/**\n * around:\n * at 100ms 20%\n * at 1s 40%\n * at 2s 60%\n * at 3s 80%\n */\nconst calculatePercent = (percent: number): number => {\n if (percent < 60) return percent + random() * 10 + 5;\n if (percent < 70) return percent + random() * 10 + 3;\n else if (percent < 80) return percent + random() + 5;\n else if (percent < 90) return percent + random() + 1;\n else if (percent < 95) return percent + 0.1;\n else return percent;\n};\n\ninterface LoadingBarProps {\n LoadingBarComponent: React.ComponentType<{ progress: number }>;\n}\n\ninterface LoadingBarState {\n loading: boolean;\n hidden: boolean;\n progress: number;\n}\n\ninterface WebsocketInterface {\n isConnected: () => boolean;\n on: (event: 'connect' | 'disconnect', callback: () => unknown) => void;\n}\n\nexport default class LoadingBar extends PureComponent<\n LoadingBarProps,\n LoadingBarState\n> {\n static contextType = ReactAlpContext;\n\n state = {\n loading: true,\n hidden: true,\n progress: 1,\n };\n\n fadeOffTimeout?: ReturnType<typeof setTimeout>;\n\n resetTimeout?: ReturnType<typeof setTimeout>;\n\n first20Timeout?: ReturnType<typeof setTimeout>;\n\n progressTimer?: ReturnType<typeof setTimeout>;\n\n componentDidMount(): void {\n const websocket = this.getWebsocket();\n if (websocket.isConnected()) {\n this.setState((prevState) => ({\n loading: false,\n progress: 100,\n hidden: prevState.hidden || prevState.progress === 100,\n }));\n }\n websocket.on('connect', () => {\n this.setState({ loading: false });\n });\n websocket.on('disconnect', () => {\n this.setState({ loading: true, progress: 1, hidden: false });\n });\n }\n\n componentDidUpdate(\n prevProps: LoadingBarProps,\n prevState: LoadingBarState,\n ): void {\n if (this.state.loading !== prevState.loading) {\n if (this.state.loading) {\n this.showBar();\n } else {\n this.hideBar();\n }\n }\n }\n\n componentWillUnmount(): void {\n if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);\n if (this.resetTimeout) clearTimeout(this.resetTimeout);\n if (this.first20Timeout) clearTimeout(this.first20Timeout);\n if (this.progressTimer) clearInterval(this.progressTimer);\n }\n\n getWebsocket(): WebsocketInterface {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return\n return (this.context as any).app.websocket;\n }\n\n private showBar(): void {\n if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);\n if (this.resetTimeout) clearTimeout(this.resetTimeout);\n\n this.first20Timeout = setTimeout(() => {\n this.setState({ progress: 20 });\n }, 100);\n\n this.progressTimer = setInterval(() => {\n this.setState((prevState) => {\n const newValue = calculatePercent(prevState.progress);\n return { progress: newValue };\n });\n }, 500);\n }\n\n private hideBar(): void {\n if (this.first20Timeout) clearTimeout(this.first20Timeout);\n if (this.progressTimer) clearInterval(this.progressTimer);\n\n this.fadeOffTimeout = setTimeout(() => {\n this.setState({\n progress: 100,\n });\n }, 500);\n\n this.resetTimeout = setTimeout(() => {\n this.setState({\n hidden: true,\n progress: 1,\n });\n }, 1000);\n }\n\n render(): ReactElement {\n const LoadingBarComponent = this.props.LoadingBarComponent;\n\n return (\n <div\n hidden={this.state.hidden}\n style={{\n position: 'fixed',\n top: 0,\n left: 0,\n right: 0,\n zIndex: 4,\n pointerEvents: 'none',\n }}\n >\n <LoadingBarComponent progress={this.state.progress} />\n </div>\n );\n }\n}\n"],"names":["random","Math","ceil","calculatePercent","percent","LoadingBar","state","loading","hidden","progress","componentDidMount","websocket","getWebsocket","isConnected","setState","prevState","on","componentDidUpdate","prevProps","showBar","hideBar","componentWillUnmount","fadeOffTimeout","clearTimeout","resetTimeout","first20Timeout","progressTimer","clearInterval","context","app","setTimeout","setInterval","newValue","render","LoadingBarComponent","props","_jsx","position","top","left","right","zIndex","pointerEvents","PureComponent","contextType","ReactAlpContext"],"mappings":"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"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { PureComponent } from 'react';
|
|
2
2
|
import ReactAlpContext from 'react-alp-context';
|
|
3
|
-
import { jsx } from 'react/jsx-runtime
|
|
3
|
+
import { jsx } from 'react/jsx-runtime';
|
|
4
4
|
|
|
5
5
|
const random = () => Math.ceil(Math.random() * 100) / 100;
|
|
6
|
+
|
|
6
7
|
/**
|
|
7
8
|
* around:
|
|
8
9
|
* at 100ms 20%
|
|
@@ -10,13 +11,10 @@ const random = () => Math.ceil(Math.random() * 100) / 100;
|
|
|
10
11
|
* at 2s 60%
|
|
11
12
|
* at 3s 80%
|
|
12
13
|
*/
|
|
13
|
-
|
|
14
|
-
|
|
15
14
|
const calculatePercent = percent => {
|
|
16
15
|
if (percent < 60) return percent + random() * 10 + 5;
|
|
17
16
|
if (percent < 70) return percent + random() * 10 + 3;else if (percent < 80) return percent + random() + 5;else if (percent < 90) return percent + random() + 1;else if (percent < 95) return percent + 0.1;else return percent;
|
|
18
17
|
};
|
|
19
|
-
|
|
20
18
|
class LoadingBar extends PureComponent {
|
|
21
19
|
static contextType = ReactAlpContext;
|
|
22
20
|
state = {
|
|
@@ -24,10 +22,8 @@ class LoadingBar extends PureComponent {
|
|
|
24
22
|
hidden: true,
|
|
25
23
|
progress: 1
|
|
26
24
|
};
|
|
27
|
-
|
|
28
25
|
componentDidMount() {
|
|
29
26
|
const websocket = this.getWebsocket();
|
|
30
|
-
|
|
31
27
|
if (websocket.isConnected()) {
|
|
32
28
|
this.setState(prevState => ({
|
|
33
29
|
loading: false,
|
|
@@ -35,7 +31,6 @@ class LoadingBar extends PureComponent {
|
|
|
35
31
|
hidden: prevState.hidden || prevState.progress === 100
|
|
36
32
|
}));
|
|
37
33
|
}
|
|
38
|
-
|
|
39
34
|
websocket.on('connect', () => {
|
|
40
35
|
this.setState({
|
|
41
36
|
loading: false
|
|
@@ -49,7 +44,6 @@ class LoadingBar extends PureComponent {
|
|
|
49
44
|
});
|
|
50
45
|
});
|
|
51
46
|
}
|
|
52
|
-
|
|
53
47
|
componentDidUpdate(prevProps, prevState) {
|
|
54
48
|
if (this.state.loading !== prevState.loading) {
|
|
55
49
|
if (this.state.loading) {
|
|
@@ -59,19 +53,16 @@ class LoadingBar extends PureComponent {
|
|
|
59
53
|
}
|
|
60
54
|
}
|
|
61
55
|
}
|
|
62
|
-
|
|
63
56
|
componentWillUnmount() {
|
|
64
57
|
if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);
|
|
65
58
|
if (this.resetTimeout) clearTimeout(this.resetTimeout);
|
|
66
59
|
if (this.first20Timeout) clearTimeout(this.first20Timeout);
|
|
67
60
|
if (this.progressTimer) clearInterval(this.progressTimer);
|
|
68
61
|
}
|
|
69
|
-
|
|
70
62
|
getWebsocket() {
|
|
71
63
|
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return
|
|
72
64
|
return this.context.app.websocket;
|
|
73
65
|
}
|
|
74
|
-
|
|
75
66
|
showBar() {
|
|
76
67
|
if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);
|
|
77
68
|
if (this.resetTimeout) clearTimeout(this.resetTimeout);
|
|
@@ -89,7 +80,6 @@ class LoadingBar extends PureComponent {
|
|
|
89
80
|
});
|
|
90
81
|
}, 500);
|
|
91
82
|
}
|
|
92
|
-
|
|
93
83
|
hideBar() {
|
|
94
84
|
if (this.first20Timeout) clearTimeout(this.first20Timeout);
|
|
95
85
|
if (this.progressTimer) clearInterval(this.progressTimer);
|
|
@@ -105,7 +95,6 @@ class LoadingBar extends PureComponent {
|
|
|
105
95
|
});
|
|
106
96
|
}, 1000);
|
|
107
97
|
}
|
|
108
|
-
|
|
109
98
|
render() {
|
|
110
99
|
const LoadingBarComponent = this.props.LoadingBarComponent;
|
|
111
100
|
return /*#__PURE__*/jsx("div", {
|
|
@@ -123,7 +112,6 @@ class LoadingBar extends PureComponent {
|
|
|
123
112
|
})
|
|
124
113
|
});
|
|
125
114
|
}
|
|
126
|
-
|
|
127
115
|
}
|
|
128
116
|
|
|
129
117
|
export { LoadingBar as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index-browsermodern.es.js","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { PureComponent } from 'react';\nimport ReactAlpContext from 'react-alp-context';\n\n/*\nExample with antd:\nimport { Progress } from 'antd';\n\nconst LoadingBarComponent = ({ progress }) => (\n <Progress\n type=\"line\"\n status=\"active\"\n percent={progress}\n showInfo={false}\n />\n);\n*/\n\n/* number between 0 and 1 */\nconst random = (): number => Math.ceil(Math.random() * 100) / 100;\n\n/**\n * around:\n * at 100ms 20%\n * at 1s 40%\n * at 2s 60%\n * at 3s 80%\n */\nconst calculatePercent = (percent: number): number => {\n if (percent < 60) return percent + random() * 10 + 5;\n if (percent < 70) return percent + random() * 10 + 3;\n else if (percent < 80) return percent + random() + 5;\n else if (percent < 90) return percent + random() + 1;\n else if (percent < 95) return percent + 0.1;\n else return percent;\n};\n\ninterface LoadingBarProps {\n LoadingBarComponent: React.ComponentType<{ progress: number }>;\n}\n\ninterface LoadingBarState {\n loading: boolean;\n hidden: boolean;\n progress: number;\n}\n\ninterface WebsocketInterface {\n isConnected: () => boolean;\n on: (event: 'connect' | 'disconnect', callback: () => unknown) => void;\n}\n\nexport default class LoadingBar extends PureComponent<\n LoadingBarProps,\n LoadingBarState\n> {\n static contextType = ReactAlpContext;\n\n state = {\n loading: true,\n hidden: true,\n progress: 1,\n };\n\n fadeOffTimeout?: ReturnType<typeof setTimeout>;\n\n resetTimeout?: ReturnType<typeof setTimeout>;\n\n first20Timeout?: ReturnType<typeof setTimeout>;\n\n progressTimer?: ReturnType<typeof setTimeout>;\n\n componentDidMount(): void {\n const websocket = this.getWebsocket();\n if (websocket.isConnected()) {\n this.setState((prevState) => ({\n loading: false,\n progress: 100,\n hidden: prevState.hidden || prevState.progress === 100,\n }));\n }\n websocket.on('connect', () => {\n this.setState({ loading: false });\n });\n websocket.on('disconnect', () => {\n this.setState({ loading: true, progress: 1, hidden: false });\n });\n }\n\n componentDidUpdate(\n prevProps: LoadingBarProps,\n prevState: LoadingBarState,\n ): void {\n if (this.state.loading !== prevState.loading) {\n if (this.state.loading) {\n this.showBar();\n } else {\n this.hideBar();\n }\n }\n }\n\n componentWillUnmount(): void {\n if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);\n if (this.resetTimeout) clearTimeout(this.resetTimeout);\n if (this.first20Timeout) clearTimeout(this.first20Timeout);\n if (this.progressTimer) clearInterval(this.progressTimer);\n }\n\n getWebsocket(): WebsocketInterface {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return\n return (this.context as any).app.websocket;\n }\n\n private showBar(): void {\n if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);\n if (this.resetTimeout) clearTimeout(this.resetTimeout);\n\n this.first20Timeout = setTimeout(() => {\n this.setState({ progress: 20 });\n }, 100);\n\n this.progressTimer = setInterval(() => {\n this.setState((prevState) => {\n const newValue = calculatePercent(prevState.progress);\n return { progress: newValue };\n });\n }, 500);\n }\n\n private hideBar(): void {\n if (this.first20Timeout) clearTimeout(this.first20Timeout);\n if (this.progressTimer) clearInterval(this.progressTimer);\n\n this.fadeOffTimeout = setTimeout(() => {\n this.setState({\n progress: 100,\n });\n }, 500);\n\n this.resetTimeout = setTimeout(() => {\n this.setState({\n hidden: true,\n progress: 1,\n });\n }, 1000);\n }\n\n render(): ReactElement {\n const LoadingBarComponent = this.props.LoadingBarComponent;\n\n return (\n <div\n hidden={this.state.hidden}\n style={{\n position: 'fixed',\n top: 0,\n left: 0,\n right: 0,\n zIndex: 4,\n pointerEvents: 'none',\n }}\n >\n <LoadingBarComponent progress={this.state.progress} />\n </div>\n );\n }\n}\n"],"names":["random","Math","ceil","calculatePercent","percent","LoadingBar","PureComponent","contextType","ReactAlpContext","state","loading","hidden","progress","componentDidMount","websocket","getWebsocket","isConnected","setState","prevState","on","componentDidUpdate","prevProps","showBar","hideBar","componentWillUnmount","fadeOffTimeout","clearTimeout","resetTimeout","first20Timeout","progressTimer","clearInterval","context","app","setTimeout","setInterval","newValue","render","LoadingBarComponent","props","_jsx","position","top","left","right","zIndex","pointerEvents"],"mappings":";;;;AAmBA,MAAMA,MAAM,GAAG,MAAcC,IAAI,CAACC,
|
|
1
|
+
{"version":3,"file":"index-browsermodern.es.js","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { PureComponent } from 'react';\nimport ReactAlpContext from 'react-alp-context';\n\n/*\nExample with antd:\nimport { Progress } from 'antd';\n\nconst LoadingBarComponent = ({ progress }) => (\n <Progress\n type=\"line\"\n status=\"active\"\n percent={progress}\n showInfo={false}\n />\n);\n*/\n\n/* number between 0 and 1 */\nconst random = (): number => Math.ceil(Math.random() * 100) / 100;\n\n/**\n * around:\n * at 100ms 20%\n * at 1s 40%\n * at 2s 60%\n * at 3s 80%\n */\nconst calculatePercent = (percent: number): number => {\n if (percent < 60) return percent + random() * 10 + 5;\n if (percent < 70) return percent + random() * 10 + 3;\n else if (percent < 80) return percent + random() + 5;\n else if (percent < 90) return percent + random() + 1;\n else if (percent < 95) return percent + 0.1;\n else return percent;\n};\n\ninterface LoadingBarProps {\n LoadingBarComponent: React.ComponentType<{ progress: number }>;\n}\n\ninterface LoadingBarState {\n loading: boolean;\n hidden: boolean;\n progress: number;\n}\n\ninterface WebsocketInterface {\n isConnected: () => boolean;\n on: (event: 'connect' | 'disconnect', callback: () => unknown) => void;\n}\n\nexport default class LoadingBar extends PureComponent<\n LoadingBarProps,\n LoadingBarState\n> {\n static contextType = ReactAlpContext;\n\n state = {\n loading: true,\n hidden: true,\n progress: 1,\n };\n\n fadeOffTimeout?: ReturnType<typeof setTimeout>;\n\n resetTimeout?: ReturnType<typeof setTimeout>;\n\n first20Timeout?: ReturnType<typeof setTimeout>;\n\n progressTimer?: ReturnType<typeof setTimeout>;\n\n componentDidMount(): void {\n const websocket = this.getWebsocket();\n if (websocket.isConnected()) {\n this.setState((prevState) => ({\n loading: false,\n progress: 100,\n hidden: prevState.hidden || prevState.progress === 100,\n }));\n }\n websocket.on('connect', () => {\n this.setState({ loading: false });\n });\n websocket.on('disconnect', () => {\n this.setState({ loading: true, progress: 1, hidden: false });\n });\n }\n\n componentDidUpdate(\n prevProps: LoadingBarProps,\n prevState: LoadingBarState,\n ): void {\n if (this.state.loading !== prevState.loading) {\n if (this.state.loading) {\n this.showBar();\n } else {\n this.hideBar();\n }\n }\n }\n\n componentWillUnmount(): void {\n if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);\n if (this.resetTimeout) clearTimeout(this.resetTimeout);\n if (this.first20Timeout) clearTimeout(this.first20Timeout);\n if (this.progressTimer) clearInterval(this.progressTimer);\n }\n\n getWebsocket(): WebsocketInterface {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return\n return (this.context as any).app.websocket;\n }\n\n private showBar(): void {\n if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);\n if (this.resetTimeout) clearTimeout(this.resetTimeout);\n\n this.first20Timeout = setTimeout(() => {\n this.setState({ progress: 20 });\n }, 100);\n\n this.progressTimer = setInterval(() => {\n this.setState((prevState) => {\n const newValue = calculatePercent(prevState.progress);\n return { progress: newValue };\n });\n }, 500);\n }\n\n private hideBar(): void {\n if (this.first20Timeout) clearTimeout(this.first20Timeout);\n if (this.progressTimer) clearInterval(this.progressTimer);\n\n this.fadeOffTimeout = setTimeout(() => {\n this.setState({\n progress: 100,\n });\n }, 500);\n\n this.resetTimeout = setTimeout(() => {\n this.setState({\n hidden: true,\n progress: 1,\n });\n }, 1000);\n }\n\n render(): ReactElement {\n const LoadingBarComponent = this.props.LoadingBarComponent;\n\n return (\n <div\n hidden={this.state.hidden}\n style={{\n position: 'fixed',\n top: 0,\n left: 0,\n right: 0,\n zIndex: 4,\n pointerEvents: 'none',\n }}\n >\n <LoadingBarComponent progress={this.state.progress} />\n </div>\n );\n }\n}\n"],"names":["random","Math","ceil","calculatePercent","percent","LoadingBar","PureComponent","contextType","ReactAlpContext","state","loading","hidden","progress","componentDidMount","websocket","getWebsocket","isConnected","setState","prevState","on","componentDidUpdate","prevProps","showBar","hideBar","componentWillUnmount","fadeOffTimeout","clearTimeout","resetTimeout","first20Timeout","progressTimer","clearInterval","context","app","setTimeout","setInterval","newValue","render","LoadingBarComponent","props","_jsx","position","top","left","right","zIndex","pointerEvents"],"mappings":"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"}
|
package/dist/index-node14.mjs
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { PureComponent } from 'react';
|
|
2
2
|
import ReactAlpContext from 'react-alp-context';
|
|
3
|
-
import { jsx } from 'react/jsx-runtime
|
|
3
|
+
import { jsx } from 'react/jsx-runtime';
|
|
4
4
|
|
|
5
5
|
const random = () => Math.ceil(Math.random() * 100) / 100;
|
|
6
|
+
|
|
6
7
|
/**
|
|
7
8
|
* around:
|
|
8
9
|
* at 100ms 20%
|
|
@@ -10,13 +11,10 @@ const random = () => Math.ceil(Math.random() * 100) / 100;
|
|
|
10
11
|
* at 2s 60%
|
|
11
12
|
* at 3s 80%
|
|
12
13
|
*/
|
|
13
|
-
|
|
14
|
-
|
|
15
14
|
const calculatePercent = percent => {
|
|
16
15
|
if (percent < 60) return percent + random() * 10 + 5;
|
|
17
16
|
if (percent < 70) return percent + random() * 10 + 3;else if (percent < 80) return percent + random() + 5;else if (percent < 90) return percent + random() + 1;else if (percent < 95) return percent + 0.1;else return percent;
|
|
18
17
|
};
|
|
19
|
-
|
|
20
18
|
class LoadingBar extends PureComponent {
|
|
21
19
|
static contextType = ReactAlpContext;
|
|
22
20
|
state = {
|
|
@@ -24,10 +22,8 @@ class LoadingBar extends PureComponent {
|
|
|
24
22
|
hidden: true,
|
|
25
23
|
progress: 1
|
|
26
24
|
};
|
|
27
|
-
|
|
28
25
|
componentDidMount() {
|
|
29
26
|
const websocket = this.getWebsocket();
|
|
30
|
-
|
|
31
27
|
if (websocket.isConnected()) {
|
|
32
28
|
this.setState(prevState => ({
|
|
33
29
|
loading: false,
|
|
@@ -35,7 +31,6 @@ class LoadingBar extends PureComponent {
|
|
|
35
31
|
hidden: prevState.hidden || prevState.progress === 100
|
|
36
32
|
}));
|
|
37
33
|
}
|
|
38
|
-
|
|
39
34
|
websocket.on('connect', () => {
|
|
40
35
|
this.setState({
|
|
41
36
|
loading: false
|
|
@@ -49,7 +44,6 @@ class LoadingBar extends PureComponent {
|
|
|
49
44
|
});
|
|
50
45
|
});
|
|
51
46
|
}
|
|
52
|
-
|
|
53
47
|
componentDidUpdate(prevProps, prevState) {
|
|
54
48
|
if (this.state.loading !== prevState.loading) {
|
|
55
49
|
if (this.state.loading) {
|
|
@@ -59,19 +53,16 @@ class LoadingBar extends PureComponent {
|
|
|
59
53
|
}
|
|
60
54
|
}
|
|
61
55
|
}
|
|
62
|
-
|
|
63
56
|
componentWillUnmount() {
|
|
64
57
|
if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);
|
|
65
58
|
if (this.resetTimeout) clearTimeout(this.resetTimeout);
|
|
66
59
|
if (this.first20Timeout) clearTimeout(this.first20Timeout);
|
|
67
60
|
if (this.progressTimer) clearInterval(this.progressTimer);
|
|
68
61
|
}
|
|
69
|
-
|
|
70
62
|
getWebsocket() {
|
|
71
63
|
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return
|
|
72
64
|
return this.context.app.websocket;
|
|
73
65
|
}
|
|
74
|
-
|
|
75
66
|
showBar() {
|
|
76
67
|
if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);
|
|
77
68
|
if (this.resetTimeout) clearTimeout(this.resetTimeout);
|
|
@@ -89,7 +80,6 @@ class LoadingBar extends PureComponent {
|
|
|
89
80
|
});
|
|
90
81
|
}, 500);
|
|
91
82
|
}
|
|
92
|
-
|
|
93
83
|
hideBar() {
|
|
94
84
|
if (this.first20Timeout) clearTimeout(this.first20Timeout);
|
|
95
85
|
if (this.progressTimer) clearInterval(this.progressTimer);
|
|
@@ -105,7 +95,6 @@ class LoadingBar extends PureComponent {
|
|
|
105
95
|
});
|
|
106
96
|
}, 1000);
|
|
107
97
|
}
|
|
108
|
-
|
|
109
98
|
render() {
|
|
110
99
|
const LoadingBarComponent = this.props.LoadingBarComponent;
|
|
111
100
|
return /*#__PURE__*/jsx("div", {
|
|
@@ -123,7 +112,6 @@ class LoadingBar extends PureComponent {
|
|
|
123
112
|
})
|
|
124
113
|
});
|
|
125
114
|
}
|
|
126
|
-
|
|
127
115
|
}
|
|
128
116
|
|
|
129
117
|
export { LoadingBar as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index-node14.mjs","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { PureComponent } from 'react';\nimport ReactAlpContext from 'react-alp-context';\n\n/*\nExample with antd:\nimport { Progress } from 'antd';\n\nconst LoadingBarComponent = ({ progress }) => (\n <Progress\n type=\"line\"\n status=\"active\"\n percent={progress}\n showInfo={false}\n />\n);\n*/\n\n/* number between 0 and 1 */\nconst random = (): number => Math.ceil(Math.random() * 100) / 100;\n\n/**\n * around:\n * at 100ms 20%\n * at 1s 40%\n * at 2s 60%\n * at 3s 80%\n */\nconst calculatePercent = (percent: number): number => {\n if (percent < 60) return percent + random() * 10 + 5;\n if (percent < 70) return percent + random() * 10 + 3;\n else if (percent < 80) return percent + random() + 5;\n else if (percent < 90) return percent + random() + 1;\n else if (percent < 95) return percent + 0.1;\n else return percent;\n};\n\ninterface LoadingBarProps {\n LoadingBarComponent: React.ComponentType<{ progress: number }>;\n}\n\ninterface LoadingBarState {\n loading: boolean;\n hidden: boolean;\n progress: number;\n}\n\ninterface WebsocketInterface {\n isConnected: () => boolean;\n on: (event: 'connect' | 'disconnect', callback: () => unknown) => void;\n}\n\nexport default class LoadingBar extends PureComponent<\n LoadingBarProps,\n LoadingBarState\n> {\n static contextType = ReactAlpContext;\n\n state = {\n loading: true,\n hidden: true,\n progress: 1,\n };\n\n fadeOffTimeout?: ReturnType<typeof setTimeout>;\n\n resetTimeout?: ReturnType<typeof setTimeout>;\n\n first20Timeout?: ReturnType<typeof setTimeout>;\n\n progressTimer?: ReturnType<typeof setTimeout>;\n\n componentDidMount(): void {\n const websocket = this.getWebsocket();\n if (websocket.isConnected()) {\n this.setState((prevState) => ({\n loading: false,\n progress: 100,\n hidden: prevState.hidden || prevState.progress === 100,\n }));\n }\n websocket.on('connect', () => {\n this.setState({ loading: false });\n });\n websocket.on('disconnect', () => {\n this.setState({ loading: true, progress: 1, hidden: false });\n });\n }\n\n componentDidUpdate(\n prevProps: LoadingBarProps,\n prevState: LoadingBarState,\n ): void {\n if (this.state.loading !== prevState.loading) {\n if (this.state.loading) {\n this.showBar();\n } else {\n this.hideBar();\n }\n }\n }\n\n componentWillUnmount(): void {\n if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);\n if (this.resetTimeout) clearTimeout(this.resetTimeout);\n if (this.first20Timeout) clearTimeout(this.first20Timeout);\n if (this.progressTimer) clearInterval(this.progressTimer);\n }\n\n getWebsocket(): WebsocketInterface {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return\n return (this.context as any).app.websocket;\n }\n\n private showBar(): void {\n if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);\n if (this.resetTimeout) clearTimeout(this.resetTimeout);\n\n this.first20Timeout = setTimeout(() => {\n this.setState({ progress: 20 });\n }, 100);\n\n this.progressTimer = setInterval(() => {\n this.setState((prevState) => {\n const newValue = calculatePercent(prevState.progress);\n return { progress: newValue };\n });\n }, 500);\n }\n\n private hideBar(): void {\n if (this.first20Timeout) clearTimeout(this.first20Timeout);\n if (this.progressTimer) clearInterval(this.progressTimer);\n\n this.fadeOffTimeout = setTimeout(() => {\n this.setState({\n progress: 100,\n });\n }, 500);\n\n this.resetTimeout = setTimeout(() => {\n this.setState({\n hidden: true,\n progress: 1,\n });\n }, 1000);\n }\n\n render(): ReactElement {\n const LoadingBarComponent = this.props.LoadingBarComponent;\n\n return (\n <div\n hidden={this.state.hidden}\n style={{\n position: 'fixed',\n top: 0,\n left: 0,\n right: 0,\n zIndex: 4,\n pointerEvents: 'none',\n }}\n >\n <LoadingBarComponent progress={this.state.progress} />\n </div>\n );\n }\n}\n"],"names":["random","Math","ceil","calculatePercent","percent","LoadingBar","PureComponent","contextType","ReactAlpContext","state","loading","hidden","progress","componentDidMount","websocket","getWebsocket","isConnected","setState","prevState","on","componentDidUpdate","prevProps","showBar","hideBar","componentWillUnmount","fadeOffTimeout","clearTimeout","resetTimeout","first20Timeout","progressTimer","clearInterval","context","app","setTimeout","setInterval","newValue","render","LoadingBarComponent","props","_jsx","position","top","left","right","zIndex","pointerEvents"],"mappings":";;;;AAmBA,MAAMA,MAAM,GAAG,MAAcC,IAAI,CAACC,
|
|
1
|
+
{"version":3,"file":"index-node14.mjs","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { PureComponent } from 'react';\nimport ReactAlpContext from 'react-alp-context';\n\n/*\nExample with antd:\nimport { Progress } from 'antd';\n\nconst LoadingBarComponent = ({ progress }) => (\n <Progress\n type=\"line\"\n status=\"active\"\n percent={progress}\n showInfo={false}\n />\n);\n*/\n\n/* number between 0 and 1 */\nconst random = (): number => Math.ceil(Math.random() * 100) / 100;\n\n/**\n * around:\n * at 100ms 20%\n * at 1s 40%\n * at 2s 60%\n * at 3s 80%\n */\nconst calculatePercent = (percent: number): number => {\n if (percent < 60) return percent + random() * 10 + 5;\n if (percent < 70) return percent + random() * 10 + 3;\n else if (percent < 80) return percent + random() + 5;\n else if (percent < 90) return percent + random() + 1;\n else if (percent < 95) return percent + 0.1;\n else return percent;\n};\n\ninterface LoadingBarProps {\n LoadingBarComponent: React.ComponentType<{ progress: number }>;\n}\n\ninterface LoadingBarState {\n loading: boolean;\n hidden: boolean;\n progress: number;\n}\n\ninterface WebsocketInterface {\n isConnected: () => boolean;\n on: (event: 'connect' | 'disconnect', callback: () => unknown) => void;\n}\n\nexport default class LoadingBar extends PureComponent<\n LoadingBarProps,\n LoadingBarState\n> {\n static contextType = ReactAlpContext;\n\n state = {\n loading: true,\n hidden: true,\n progress: 1,\n };\n\n fadeOffTimeout?: ReturnType<typeof setTimeout>;\n\n resetTimeout?: ReturnType<typeof setTimeout>;\n\n first20Timeout?: ReturnType<typeof setTimeout>;\n\n progressTimer?: ReturnType<typeof setTimeout>;\n\n componentDidMount(): void {\n const websocket = this.getWebsocket();\n if (websocket.isConnected()) {\n this.setState((prevState) => ({\n loading: false,\n progress: 100,\n hidden: prevState.hidden || prevState.progress === 100,\n }));\n }\n websocket.on('connect', () => {\n this.setState({ loading: false });\n });\n websocket.on('disconnect', () => {\n this.setState({ loading: true, progress: 1, hidden: false });\n });\n }\n\n componentDidUpdate(\n prevProps: LoadingBarProps,\n prevState: LoadingBarState,\n ): void {\n if (this.state.loading !== prevState.loading) {\n if (this.state.loading) {\n this.showBar();\n } else {\n this.hideBar();\n }\n }\n }\n\n componentWillUnmount(): void {\n if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);\n if (this.resetTimeout) clearTimeout(this.resetTimeout);\n if (this.first20Timeout) clearTimeout(this.first20Timeout);\n if (this.progressTimer) clearInterval(this.progressTimer);\n }\n\n getWebsocket(): WebsocketInterface {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return\n return (this.context as any).app.websocket;\n }\n\n private showBar(): void {\n if (this.fadeOffTimeout) clearTimeout(this.fadeOffTimeout);\n if (this.resetTimeout) clearTimeout(this.resetTimeout);\n\n this.first20Timeout = setTimeout(() => {\n this.setState({ progress: 20 });\n }, 100);\n\n this.progressTimer = setInterval(() => {\n this.setState((prevState) => {\n const newValue = calculatePercent(prevState.progress);\n return { progress: newValue };\n });\n }, 500);\n }\n\n private hideBar(): void {\n if (this.first20Timeout) clearTimeout(this.first20Timeout);\n if (this.progressTimer) clearInterval(this.progressTimer);\n\n this.fadeOffTimeout = setTimeout(() => {\n this.setState({\n progress: 100,\n });\n }, 500);\n\n this.resetTimeout = setTimeout(() => {\n this.setState({\n hidden: true,\n progress: 1,\n });\n }, 1000);\n }\n\n render(): ReactElement {\n const LoadingBarComponent = this.props.LoadingBarComponent;\n\n return (\n <div\n hidden={this.state.hidden}\n style={{\n position: 'fixed',\n top: 0,\n left: 0,\n right: 0,\n zIndex: 4,\n pointerEvents: 'none',\n }}\n >\n <LoadingBarComponent progress={this.state.progress} />\n </div>\n );\n }\n}\n"],"names":["random","Math","ceil","calculatePercent","percent","LoadingBar","PureComponent","contextType","ReactAlpContext","state","loading","hidden","progress","componentDidMount","websocket","getWebsocket","isConnected","setState","prevState","on","componentDidUpdate","prevProps","showBar","hideBar","componentWillUnmount","fadeOffTimeout","clearTimeout","resetTimeout","first20Timeout","progressTimer","clearInterval","context","app","setTimeout","setInterval","newValue","render","LoadingBarComponent","props","_jsx","position","top","left","right","zIndex","pointerEvents"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-alp-loading-bar",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.1.1",
|
|
4
4
|
"description": "loading bar",
|
|
5
5
|
"keywords": [],
|
|
6
6
|
"author": "Christophe Hurpeau <christophe@hurpeau.com> (https://christophe.hurpeau.com)",
|
|
@@ -47,16 +47,12 @@
|
|
|
47
47
|
"build": "yarn clean:build && rollup --config rollup.config.mjs && yarn run build:definitions",
|
|
48
48
|
"build:definitions": "tsc -p tsconfig.build.json",
|
|
49
49
|
"clean": "yarn clean:build",
|
|
50
|
-
"clean:build": "
|
|
50
|
+
"clean:build": "pob-babel-clean-out dist",
|
|
51
51
|
"lint": "yarn run lint:eslint",
|
|
52
52
|
"lint:eslint": "cd ../.. && yarn run eslint --report-unused-disable-directives --resolve-plugins-relative-to . --quiet packages/react-alp-loading-bar",
|
|
53
53
|
"watch": "yarn clean:build && rollup --config rollup.config.mjs --watch"
|
|
54
54
|
},
|
|
55
|
-
"prettier":
|
|
56
|
-
"trailingComma": "all",
|
|
57
|
-
"singleQuote": true,
|
|
58
|
-
"arrowParens": "always"
|
|
59
|
-
},
|
|
55
|
+
"prettier": "@pob/root/prettier-config",
|
|
60
56
|
"pob": {
|
|
61
57
|
"babelEnvs": [
|
|
62
58
|
{
|
|
@@ -86,21 +82,21 @@
|
|
|
86
82
|
"jsx": true
|
|
87
83
|
},
|
|
88
84
|
"peerDependencies": {
|
|
89
|
-
"react": "^
|
|
85
|
+
"react": "^18.1.0"
|
|
90
86
|
},
|
|
91
87
|
"dependencies": {
|
|
92
|
-
"@babel/runtime": "^7.
|
|
88
|
+
"@babel/runtime": "^7.19.0",
|
|
93
89
|
"alp-types": "3.1.0",
|
|
94
|
-
"react-alp-context": "4.
|
|
90
|
+
"react-alp-context": "4.1.1"
|
|
95
91
|
},
|
|
96
92
|
"devDependencies": {
|
|
97
|
-
"@babel/core": "7.
|
|
98
|
-
"@babel/preset-env": "7.
|
|
99
|
-
"@babel/preset-react": "7.
|
|
93
|
+
"@babel/core": "7.19.3",
|
|
94
|
+
"@babel/preset-env": "7.19.4",
|
|
95
|
+
"@babel/preset-react": "7.18.6",
|
|
100
96
|
"babel-preset-modern-browsers": "15.0.2",
|
|
101
|
-
"pob-babel": "
|
|
102
|
-
"react": "
|
|
103
|
-
"typescript": "4.
|
|
97
|
+
"pob-babel": "34.2.0",
|
|
98
|
+
"react": "18.1.0",
|
|
99
|
+
"typescript": "4.8.4"
|
|
104
100
|
},
|
|
105
|
-
"gitHead": "
|
|
101
|
+
"gitHead": "37573847487da0689917f2667f5c810f0136eab7"
|
|
106
102
|
}
|
package/rollup.config.mjs
DELETED