@@ -5,14 +5,18 @@ Object.defineProperty(exports, "__esModule", {
5
5
} ) ;
6
6
exports . SetDefault = SetDefault ;
7
7
exports . Loading = Loading ;
8
+ exports . ShowLoading = ShowLoading ;
9
+ exports . HideLoading = HideLoading ;
8
10
exports . Progress = Progress ;
9
11
10
12
var _react = _interopRequireWildcard ( require ( "react" ) ) ;
11
13
12
- var _reactDom = require ( "react-dom" ) ;
14
+ var _client = _interopRequireDefault ( require ( "react-dom/client" ) ) ;
13
15
14
16
require ( "./index.css" ) ;
15
17
18
+ function _interopRequireDefault ( obj ) { return obj && obj . __esModule ? obj : { "default" : obj } ; }
19
+
16
20
function _getRequireWildcardCache ( ) { if ( typeof WeakMap !== "function" ) return null ; var cache = new WeakMap ( ) ; _getRequireWildcardCache = function _getRequireWildcardCache ( ) { return cache ; } ; return cache ; }
17
21
18
22
function _interopRequireWildcard ( obj ) { if ( obj && obj . __esModule ) { return obj ; } var cache = _getRequireWildcardCache ( ) ; if ( cache && cache . has ( obj ) ) { return cache . get ( obj ) ; } var newObj = { } ; if ( obj != null ) { var hasPropertyDescriptor = Object . defineProperty && Object . getOwnPropertyDescriptor ; for ( var key in obj ) { if ( Object . prototype . hasOwnProperty . call ( obj , key ) ) { var desc = hasPropertyDescriptor ? Object . getOwnPropertyDescriptor ( obj , key ) : null ; if ( desc && ( desc . get || desc . set ) ) { Object . defineProperty ( newObj , key , desc ) ; } else { newObj [ key ] = obj [ key ] ; } } } } newObj [ "default" ] = obj ; if ( cache ) { cache . set ( obj , newObj ) ; } return newObj ; }
@@ -23,23 +27,13 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
23
27
24
28
function _defineProperty ( obj , key , value ) { if ( key in obj ) { Object . defineProperty ( obj , key , { value : value , enumerable : true , configurable : true , writable : true } ) ; } else { obj [ key ] = value ; } return obj ; }
25
29
26
- function _typeof ( obj ) { if ( typeof Symbol === "function" && typeof Symbol . iterator === "symbol" ) { _typeof = function _typeof ( obj ) { return typeof obj ; } ; } else { _typeof = function _typeof ( obj ) { return obj && typeof Symbol === "function" && obj . constructor === Symbol && obj !== Symbol . prototype ? "symbol" : typeof obj ; } ; } return _typeof ( obj ) ; }
27
-
28
- function _classCallCheck ( instance , Constructor ) { if ( ! ( instance instanceof Constructor ) ) { throw new TypeError ( "Cannot call a class as a function" ) ; } }
29
-
30
- function _defineProperties ( target , props ) { for ( var i = 0 ; i < props . length ; i ++ ) { var descriptor = props [ i ] ; descriptor . enumerable = descriptor . enumerable || false ; descriptor . configurable = true ; if ( "value" in descriptor ) descriptor . writable = true ; Object . defineProperty ( target , descriptor . key , descriptor ) ; } }
31
-
32
- function _createClass ( Constructor , protoProps , staticProps ) { if ( protoProps ) _defineProperties ( Constructor . prototype , protoProps ) ; if ( staticProps ) _defineProperties ( Constructor , staticProps ) ; return Constructor ; }
33
-
34
- function _possibleConstructorReturn ( self , call ) { if ( call && ( _typeof ( call ) === "object" || typeof call === "function" ) ) { return call ; } return _assertThisInitialized ( self ) ; }
30
+ function _slicedToArray ( arr , i ) { return _arrayWithHoles ( arr ) || _iterableToArrayLimit ( arr , i ) || _nonIterableRest ( ) ; }
35
31
36
- function _assertThisInitialized ( self ) { if ( self === void 0 ) { throw new ReferenceError ( "this hasn't been initialised - super() hasn't been called" ) ; } return self ; }
32
+ function _nonIterableRest ( ) { throw new TypeError ( "Invalid attempt to destructure non-iterable instance" ) ; }
37
33
38
- function _getPrototypeOf ( o ) { _getPrototypeOf = Object . setPrototypeOf ? Object . getPrototypeOf : function _getPrototypeOf ( o ) { return o . __proto__ || Object . getPrototypeOf ( o ) ; } ; return _getPrototypeOf ( o ) ; }
34
+ function _iterableToArrayLimit ( arr , i ) { if ( ! ( Symbol . iterator in Object ( arr ) || Object . prototype . toString . call ( arr ) === "[object Arguments]" ) ) { return ; } var _arr = [ ] ; var _n = true ; var _d = false ; var _e = undefined ; try { for ( var _i = arr [ Symbol . iterator ] ( ) , _s ; ! ( _n = ( _s = _i . next ( ) ) . done ) ; _n = true ) { _arr . push ( _s . value ) ; if ( i && _arr . length === i ) break ; } } catch ( err ) { _d = true ; _e = err ; } finally { try { if ( ! _n && _i [ " return" ] != null ) _i [ "return" ] ( ) ; } finally { if ( _d ) throw _e ; } } return _arr ; }
39
35
40
- function _inherits ( subClass , superClass ) { if ( typeof superClass !== "function" && superClass !== null ) { throw new TypeError ( "Super expression must either be null or a function" ) ; } subClass . prototype = Object . create ( superClass && superClass . prototype , { constructor : { value : subClass , writable : true , configurable : true } } ) ; if ( superClass ) _setPrototypeOf ( subClass , superClass ) ; }
41
-
42
- function _setPrototypeOf ( o , p ) { _setPrototypeOf = Object . setPrototypeOf || function _setPrototypeOf ( o , p ) { o . __proto__ = p ; return o ; } ; return _setPrototypeOf ( o , p ) ; }
36
+ function _arrayWithHoles ( arr ) { if ( Array . isArray ( arr ) ) return arr ; }
43
37
44
38
var defaultProps = {
45
39
title : "Page Loading" ,
@@ -54,6 +48,7 @@ var defaultProps = {
54
48
} ;
55
49
var Props = defaultProps ;
56
50
var Element = {
51
+ root : null ,
57
52
Create : function Create ( props ) {
58
53
var div = document . getElementById ( 'loading-ui' ) ;
59
54
@@ -63,101 +58,71 @@ var Element = {
63
58
document . body . appendChild ( div ) ;
64
59
}
65
60
66
- ( 0 , _reactDom . render ) ( _react [ "default" ] . createElement ( LoadingComponent , props ) , div ) ;
61
+ Element . root = _client [ "default" ] . createRoot ( div ) ;
62
+ Element . root . render ( _react [ "default" ] . createElement ( LoadingComponent , props ) ) ;
67
63
} ,
68
64
Remove : function Remove ( ) {
69
65
var div = document . getElementById ( 'loading-ui' ) ;
70
- ( 0 , _reactDom . unmountComponentAtNode ) ( div ) ;
66
+ Element . root . unmount ( ) ;
71
67
div . parentNode . removeChild ( div ) ;
72
68
}
73
69
} ;
74
70
75
- var LoadingComponent =
76
- /*#__PURE__*/
77
- function ( _Component ) {
78
- _inherits ( LoadingComponent , _Component ) ;
79
-
80
- function LoadingComponent ( props ) {
81
- var _this ;
82
-
83
- _classCallCheck ( this , LoadingComponent ) ;
84
-
85
- _this = _possibleConstructorReturn ( this , _getPrototypeOf ( LoadingComponent ) . call ( this , props ) ) ;
86
- _this . state = {
87
- width : "0%"
88
- } ;
89
- return _this ;
90
- }
91
-
92
- _createClass ( LoadingComponent , [ {
93
- key : "componentDidMount" ,
94
- value : function componentDidMount ( ) {
95
- var _this2 = this ;
96
-
97
- setTimeout ( function ( ) {
98
- var percentage = Math . random ( ) * 30 + 10 ;
99
-
100
- _this2 . TopBarProgress ( percentage ) ;
101
- } , 100 ) ;
71
+ var LoadingComponent = function LoadingComponent ( _ref ) {
72
+ var theme = _ref . theme ,
73
+ title = _ref . title ,
74
+ text = _ref . text ,
75
+ progress = _ref . progress ,
76
+ progressValue = _ref . progressValue ,
77
+ topBar = _ref . topBar ,
78
+ topBarColor = _ref . topBarColor ;
79
+
80
+ var _useState = ( 0 , _react . useState ) ( "0%" ) ,
81
+ _useState2 = _slicedToArray ( _useState , 2 ) ,
82
+ width = _useState2 [ 0 ] ,
83
+ setWidth = _useState2 [ 1 ] ;
84
+
85
+ var TopBarProgress = ( 0 , _react . useCallback ) ( function ( percentage ) {
86
+ setWidth ( "" . concat ( percentage , "%" ) ) ;
87
+ setTimeout ( function ( ) {
88
+ var per = Math . random ( ) * ( ( 100 - percentage ) / 2 ) + percentage ;
89
+ TopBarProgress ( per ) ;
90
+ } , 500 ) ;
91
+ } , [ ] ) ;
92
+ ( 0 , _react . useEffect ) ( function ( ) {
93
+ setTimeout ( function ( ) {
94
+ var percentage = Math . random ( ) * 30 + 10 ;
95
+ TopBarProgress ( percentage ) ;
96
+ } , 100 ) ;
97
+ } , [ TopBarProgress ] ) ;
98
+ return _react [ "default" ] . createElement ( "div" , {
99
+ className : "loading-ui-overlay " . concat ( theme , " " ) . concat ( topBar && 'topbar' )
100
+ } , topBar ? _react [ "default" ] . createElement ( "div" , {
101
+ className : "loading-ui-topbar" ,
102
+ id : "loading-ui-topbar" ,
103
+ style : {
104
+ width : width ,
105
+ backgroundColor : topBarColor
102
106
}
103
- } , {
104
- key : "TopBarProgress" ,
105
- value : function TopBarProgress ( percentage ) {
106
- var _this3 = this ;
107
-
108
- this . setState ( {
109
- width : "" . concat ( percentage , "%" )
110
- } , function ( ) {
111
- setTimeout ( function ( ) {
112
- var per = Math . random ( ) * ( ( 100 - percentage ) / 2 ) + percentage ;
113
-
114
- _this3 . TopBarProgress ( per ) ;
115
- } , 500 ) ;
116
- } ) ;
107
+ } ) : _react [ "default" ] . createElement ( "div" , {
108
+ className : "loading-ui-wrapper"
109
+ } , _react [ "default" ] . createElement ( "div" , {
110
+ className : "loading-ui-body"
111
+ } , _react [ "default" ] . createElement ( "h4" , {
112
+ className : "loading-ui-title"
113
+ } , title ) , _react [ "default" ] . createElement ( "p" , {
114
+ className : "loading-ui-text"
115
+ } , text ) , progress ? _react [ "default" ] . createElement ( "div" , {
116
+ className : "loading-ui-progress"
117
+ } , _react [ "default" ] . createElement ( "div" , {
118
+ className : "loading-ui-progress-bar" ,
119
+ style : {
120
+ width : progressValue + "%"
117
121
}
118
- } , {
119
- key : "render" ,
120
- value : function render ( ) {
121
- var _this$props = this . props ,
122
- theme = _this$props . theme ,
123
- title = _this$props . title ,
124
- text = _this$props . text ,
125
- progress = _this$props . progress ,
126
- progressValue = _this$props . progressValue ,
127
- topBar = _this$props . topBar ,
128
- topBarColor = _this$props . topBarColor ;
129
- return _react [ "default" ] . createElement ( "div" , {
130
- className : "loading-ui-overlay " . concat ( theme , " " ) . concat ( topBar && 'topbar' )
131
- } , topBar ? _react [ "default" ] . createElement ( "div" , {
132
- className : "loading-ui-topbar" ,
133
- id : "loading-ui-topbar" ,
134
- style : {
135
- width : this . state . width ,
136
- backgroundColor : topBarColor
137
- }
138
- } ) : _react [ "default" ] . createElement ( "div" , {
139
- className : "loading-ui-wrapper"
140
- } , _react [ "default" ] . createElement ( "div" , {
141
- className : "loading-ui-body"
142
- } , _react [ "default" ] . createElement ( "h4" , {
143
- className : "loading-ui-title"
144
- } , title ) , _react [ "default" ] . createElement ( "p" , {
145
- className : "loading-ui-text"
146
- } , text ) , progress ? _react [ "default" ] . createElement ( "div" , {
147
- className : "loading-ui-progress"
148
- } , _react [ "default" ] . createElement ( "div" , {
149
- className : "loading-ui-progress-bar" ,
150
- style : {
151
- width : progressValue + "%"
152
- }
153
- } ) ) : _react [ "default" ] . createElement ( "div" , {
154
- className : "loading-ui-spinner"
155
- } ) ) ) ) ;
156
- }
157
- } ] ) ;
158
-
159
- return LoadingComponent ;
160
- } ( _react . Component ) ;
122
+ } ) ) : _react [ "default" ] . createElement ( "div" , {
123
+ className : "loading-ui-spinner"
124
+ } ) ) ) ) ;
125
+ } ;
161
126
162
127
LoadingComponent . defaultProps = defaultProps ;
163
128
/**
@@ -201,6 +166,29 @@ function Loading(props) {
201
166
Element . Remove ( ) ;
202
167
}
203
168
}
169
+ /**
170
+ * @param {object } props
171
+ * @param {string } [props.title]
172
+ * @param {string } [props.text]
173
+ * @param {bool } [props.progress]
174
+ * @param {boolean } [props.progressedClose]
175
+ * @param {string } [props.theme]
176
+ * @param {bool } [props.topBar]
177
+ * @param {string } [props.topBarColor]
178
+ */
179
+
180
+
181
+ function ShowLoading ( props ) {
182
+ if ( ! document . getElementById ( 'loading-ui' ) ) {
183
+ Loading ( props ) ;
184
+ }
185
+ }
186
+
187
+ function HideLoading ( ) {
188
+ if ( document . getElementById ( 'loading-ui' ) ) {
189
+ Loading ( ) ;
190
+ }
191
+ }
204
192
/**
205
193
* @param {number } progress
206
194
*/
@@ -211,7 +199,7 @@ function Progress(progress) {
211
199
212
200
if ( div && progress < 100 ) {
213
201
Props . progressValue = progress ;
214
- ( 0 , _reactDom . render ) ( _react [ "default" ] . createElement ( LoadingComponent , Props ) , div ) ;
202
+ Element . root . render ( _react [ "default" ] . createElement ( LoadingComponent , Props ) ) ;
215
203
} else if ( progress >= 100 && Props . progressedClose && div ) {
216
204
Element . Remove ( ) ;
217
205
}
0 commit comments