react-alp-loading-bar 4.0.0 → 4.0.4

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 CHANGED
@@ -3,6 +3,41 @@
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.0.4](https://github.com/christophehurpeau/alp/compare/react-alp-loading-bar@4.0.3...react-alp-loading-bar@4.0.4) (2022-02-20)
7
+
8
+ **Note:** Version bump only for package react-alp-loading-bar
9
+
10
+
11
+
12
+
13
+
14
+ ## [4.0.3](https://github.com/christophehurpeau/alp/compare/react-alp-loading-bar@4.0.2...react-alp-loading-bar@4.0.3) (2022-02-13)
15
+
16
+
17
+ ### Bug Fixes
18
+
19
+ * dont override react/react-in-jsx-scope ([5d21c9e](https://github.com/christophehurpeau/alp/commit/5d21c9ece092cd3397d1794211dae17cea6649f8))
20
+
21
+
22
+
23
+
24
+
25
+ ## [4.0.2](https://github.com/christophehurpeau/alp/compare/react-alp-loading-bar@4.0.1...react-alp-loading-bar@4.0.2) (2022-02-06)
26
+
27
+ **Note:** Version bump only for package react-alp-loading-bar
28
+
29
+
30
+
31
+
32
+
33
+ ## [4.0.1](https://github.com/christophehurpeau/alp/compare/react-alp-loading-bar@4.0.0...react-alp-loading-bar@4.0.1) (2022-01-15)
34
+
35
+ **Note:** Version bump only for package react-alp-loading-bar
36
+
37
+
38
+
39
+
40
+
6
41
  # [4.0.0](https://github.com/christophehurpeau/alp/compare/react-alp-loading-bar@3.1.3...react-alp-loading-bar@4.0.0) (2022-01-02)
7
42
 
8
43
 
@@ -1,22 +1,7 @@
1
1
  import _inheritsLoose from '@babel/runtime/helpers/esm/inheritsLoose';
2
- import React, { PureComponent } from 'react';
2
+ import { PureComponent } from 'react';
3
3
  import ReactAlpContext from 'react-alp-context';
4
-
5
- /*
6
- Example with antd:
7
- import { Progress } from 'antd';
8
-
9
- const LoadingBarComponent = ({ progress }) => (
10
- <Progress
11
- type="line"
12
- status="active"
13
- percent={progress}
14
- showInfo={false}
15
- />
16
- );
17
- */
18
-
19
- /* number between 0 and 1 */
4
+ import { jsx } from 'react/jsx-runtime.js';
20
5
 
21
6
  var random = function random() {
22
7
  return Math.ceil(Math.random() * 100) / 100;
@@ -147,7 +132,7 @@ var LoadingBar = /*#__PURE__*/function (_PureComponent) {
147
132
 
148
133
  _proto.render = function render() {
149
134
  var LoadingBarComponent = this.props.LoadingBarComponent;
150
- return /*#__PURE__*/React.createElement("div", {
135
+ return /*#__PURE__*/jsx("div", {
151
136
  hidden: this.state.hidden,
152
137
  style: {
153
138
  position: 'fixed',
@@ -156,10 +141,11 @@ var LoadingBar = /*#__PURE__*/function (_PureComponent) {
156
141
  right: 0,
157
142
  zIndex: 4,
158
143
  pointerEvents: 'none'
159
- }
160
- }, /*#__PURE__*/React.createElement(LoadingBarComponent, {
161
- progress: this.state.progress
162
- }));
144
+ },
145
+ children: /*#__PURE__*/jsx(LoadingBarComponent, {
146
+ progress: this.state.progress
147
+ })
148
+ });
163
149
  };
164
150
 
165
151
  return LoadingBar;
@@ -1 +1 @@
1
- {"version":3,"file":"index-browser.es.js","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport React, { 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.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","position","top","left","right","zIndex","pointerEvents","PureComponent","contextType","ReactAlpContext"],"mappings":"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"}
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.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,21 +1,6 @@
1
- import React, { PureComponent } from 'react';
1
+ import { PureComponent } from 'react';
2
2
  import ReactAlpContext from 'react-alp-context';
3
-
4
- /*
5
- Example with antd:
6
- import { Progress } from 'antd';
7
-
8
- const LoadingBarComponent = ({ progress }) => (
9
- <Progress
10
- type="line"
11
- status="active"
12
- percent={progress}
13
- showInfo={false}
14
- />
15
- );
16
- */
17
-
18
- /* number between 0 and 1 */
3
+ import { jsx } from 'react/jsx-runtime.js';
19
4
 
20
5
  const random = () => Math.ceil(Math.random() * 100) / 100;
21
6
  /**
@@ -123,7 +108,7 @@ class LoadingBar extends PureComponent {
123
108
 
124
109
  render() {
125
110
  const LoadingBarComponent = this.props.LoadingBarComponent;
126
- return /*#__PURE__*/React.createElement("div", {
111
+ return /*#__PURE__*/jsx("div", {
127
112
  hidden: this.state.hidden,
128
113
  style: {
129
114
  position: 'fixed',
@@ -132,10 +117,11 @@ class LoadingBar extends PureComponent {
132
117
  right: 0,
133
118
  zIndex: 4,
134
119
  pointerEvents: 'none'
135
- }
136
- }, /*#__PURE__*/React.createElement(LoadingBarComponent, {
137
- progress: this.state.progress
138
- }));
120
+ },
121
+ children: /*#__PURE__*/jsx(LoadingBarComponent, {
122
+ progress: this.state.progress
123
+ })
124
+ });
139
125
  }
140
126
 
141
127
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index-browsermodern.es.js","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport React, { 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.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","position","top","left","right","zIndex","pointerEvents"],"mappings":"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"}
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.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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"}
@@ -1,21 +1,6 @@
1
- import React, { PureComponent } from 'react';
1
+ import { PureComponent } from 'react';
2
2
  import ReactAlpContext from 'react-alp-context';
3
-
4
- /*
5
- Example with antd:
6
- import { Progress } from 'antd';
7
-
8
- const LoadingBarComponent = ({ progress }) => (
9
- <Progress
10
- type="line"
11
- status="active"
12
- percent={progress}
13
- showInfo={false}
14
- />
15
- );
16
- */
17
-
18
- /* number between 0 and 1 */
3
+ import { jsx } from 'react/jsx-runtime.js';
19
4
 
20
5
  const random = () => Math.ceil(Math.random() * 100) / 100;
21
6
  /**
@@ -123,7 +108,7 @@ class LoadingBar extends PureComponent {
123
108
 
124
109
  render() {
125
110
  const LoadingBarComponent = this.props.LoadingBarComponent;
126
- return /*#__PURE__*/React.createElement("div", {
111
+ return /*#__PURE__*/jsx("div", {
127
112
  hidden: this.state.hidden,
128
113
  style: {
129
114
  position: 'fixed',
@@ -132,10 +117,11 @@ class LoadingBar extends PureComponent {
132
117
  right: 0,
133
118
  zIndex: 4,
134
119
  pointerEvents: 'none'
135
- }
136
- }, /*#__PURE__*/React.createElement(LoadingBarComponent, {
137
- progress: this.state.progress
138
- }));
120
+ },
121
+ children: /*#__PURE__*/jsx(LoadingBarComponent, {
122
+ progress: this.state.progress
123
+ })
124
+ });
139
125
  }
140
126
 
141
127
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index-node14.mjs","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport React, { 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.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","position","top","left","right","zIndex","pointerEvents"],"mappings":"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"}
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.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.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import type { ReactElement } from 'react';
2
- import React, { PureComponent } from 'react';
2
+ import { PureComponent } from 'react';
3
3
  interface LoadingBarProps {
4
4
  LoadingBarComponent: React.ComponentType<{
5
5
  progress: number;
@@ -15,7 +15,7 @@ interface WebsocketInterface {
15
15
  on: (event: 'connect' | 'disconnect', callback: () => unknown) => void;
16
16
  }
17
17
  export default class LoadingBar extends PureComponent<LoadingBarProps, LoadingBarState> {
18
- static contextType: React.Context<import("alp-types").Context>;
18
+ static contextType: import("react").Context<import("../../alp-types/lib").Context>;
19
19
  state: {
20
20
  loading: boolean;
21
21
  hidden: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAoC7C,UAAU,eAAe;IACvB,mBAAmB,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CAChE;AAED,UAAU,eAAe;IACvB,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,kBAAkB;IAC1B,WAAW,EAAE,MAAM,OAAO,CAAC;IAC3B,EAAE,EAAE,CAAC,KAAK,EAAE,SAAS,GAAG,YAAY,EAAE,QAAQ,EAAE,MAAM,OAAO,KAAK,IAAI,CAAC;CACxE;AAED,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,aAAa,CACnD,eAAe,EACf,eAAe,CAChB;IACC,MAAM,CAAC,WAAW,6CAAmB;IAErC,KAAK;;;;MAIH;IAEF,cAAc,CAAC,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;IAE/C,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;IAE7C,cAAc,CAAC,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;IAE/C,aAAa,CAAC,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;IAE9C,iBAAiB,IAAI,IAAI;IAiBzB,kBAAkB,CAChB,SAAS,EAAE,eAAe,EAC1B,SAAS,EAAE,eAAe,GACzB,IAAI;IAUP,oBAAoB,IAAI,IAAI;IAO5B,YAAY,IAAI,kBAAkB;IAKlC,OAAO,CAAC,OAAO;IAgBf,OAAO,CAAC,OAAO;IAkBf,MAAM,IAAI,YAAY;CAmBvB"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAoCtC,UAAU,eAAe;IACvB,mBAAmB,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CAChE;AAED,UAAU,eAAe;IACvB,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,kBAAkB;IAC1B,WAAW,EAAE,MAAM,OAAO,CAAC;IAC3B,EAAE,EAAE,CAAC,KAAK,EAAE,SAAS,GAAG,YAAY,EAAE,QAAQ,EAAE,MAAM,OAAO,KAAK,IAAI,CAAC;CACxE;AAED,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,aAAa,CACnD,eAAe,EACf,eAAe,CAChB;IACC,MAAM,CAAC,WAAW,iEAAmB;IAErC,KAAK;;;;MAIH;IAEF,cAAc,CAAC,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;IAE/C,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;IAE7C,cAAc,CAAC,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;IAE/C,aAAa,CAAC,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;IAE9C,iBAAiB,IAAI,IAAI;IAiBzB,kBAAkB,CAChB,SAAS,EAAE,eAAe,EAC1B,SAAS,EAAE,eAAe,GACzB,IAAI;IAUP,oBAAoB,IAAI,IAAI;IAO5B,YAAY,IAAI,kBAAkB;IAKlC,OAAO,CAAC,OAAO;IAgBf,OAAO,CAAC,OAAO;IAkBf,MAAM,IAAI,YAAY;CAmBvB"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-alp-loading-bar",
3
- "version": "4.0.0",
3
+ "version": "4.0.4",
4
4
  "description": "loading bar",
5
5
  "keywords": [],
6
6
  "author": "Christophe Hurpeau <christophe@hurpeau.com> (https://christophe.hurpeau.com)",
@@ -44,12 +44,13 @@
44
44
  "module:modern-browsers": "./dist/index-browsermodern.es.js",
45
45
  "sideEffects": false,
46
46
  "scripts": {
47
- "build": "pob-build && yarn run build:definitions",
47
+ "build": "yarn clean:build && rollup --config rollup.config.mjs && yarn run build:definitions",
48
48
  "build:definitions": "tsc -p tsconfig.build.json",
49
- "clean": "rm -Rf dist",
49
+ "clean": "yarn clean:build",
50
+ "clean:build": "rm -Rf dist",
50
51
  "lint": "yarn run lint:eslint",
51
52
  "lint:eslint": "cd ../.. && yarn run eslint --report-unused-disable-directives --resolve-plugins-relative-to . --quiet packages/react-alp-loading-bar",
52
- "watch": "pob-watch"
53
+ "watch": "yarn clean:build && rollup --config rollup.config.mjs --watch"
53
54
  },
54
55
  "prettier": {
55
56
  "trailingComma": "all",
@@ -88,18 +89,18 @@
88
89
  "react": "^17.0.2"
89
90
  },
90
91
  "dependencies": {
91
- "@babel/runtime": "^7.16.7",
92
- "alp-types": "^3.0.0",
93
- "react-alp-context": "4.0.0"
92
+ "@babel/runtime": "^7.17.2",
93
+ "alp-types": "3.1.0",
94
+ "react-alp-context": "4.0.4"
94
95
  },
95
96
  "devDependencies": {
96
- "@babel/core": "7.16.7",
97
- "@babel/preset-env": "7.16.7",
97
+ "@babel/core": "7.17.5",
98
+ "@babel/preset-env": "7.16.11",
98
99
  "@babel/preset-react": "7.16.7",
99
100
  "babel-preset-modern-browsers": "15.0.2",
100
- "pob-babel": "29.6.1",
101
+ "pob-babel": "32.2.0",
101
102
  "react": "17.0.2",
102
- "typescript": "4.5.4"
103
+ "typescript": "4.5.5"
103
104
  },
104
- "gitHead": "854189ce2307f42363e81bcf7862c5f1deced54a"
105
+ "gitHead": "5743ca423201457801590e12f607b1a60f7fa51a"
105
106
  }
package/rollup.config.mjs CHANGED
@@ -1,3 +1,5 @@
1
1
  import createRollupConfig from 'pob-babel/createRollupConfig.js';
2
2
 
3
- export default createRollupConfig({});
3
+ export default createRollupConfig({
4
+ cwd: new URL('.', import.meta.url).pathname,
5
+ });
@@ -2,7 +2,7 @@
2
2
  "root": true,
3
3
  "parser": "@typescript-eslint/parser",
4
4
  "parserOptions": {
5
- "project": "packages/react-alp-loading-bar/tsconfig.json"
5
+ "project": "packages/react-alp-loading-bar/tsconfig.eslint.json"
6
6
  },
7
7
  "plugins": ["@typescript-eslint"],
8
8
  "extends": [
package/src/index.tsx CHANGED
@@ -1,5 +1,5 @@
1
1
  import type { ReactElement } from 'react';
2
- import React, { PureComponent } from 'react';
2
+ import { PureComponent } from 'react';
3
3
  import ReactAlpContext from 'react-alp-context';
4
4
 
5
5
  /*
@@ -0,0 +1,7 @@
1
+ {
2
+ "extends": "./tsconfig.json",
3
+
4
+ "compilerOptions": {
5
+ "noEmit": true
6
+ }
7
+ }