@dr.pogodin/react-utils 1.23.13 → 1.24.0
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/build/development/server/renderer.js +17 -12
- package/build/development/server/renderer.js.map +1 -1
- package/build/development/shared/utils/index.js +6 -25
- package/build/development/shared/utils/index.js.map +1 -1
- package/build/development/shared/utils/splitComponent.js +197 -14
- package/build/development/shared/utils/splitComponent.js.map +1 -1
- package/build/development/web.bundle.js +7 -27
- package/build/production/server/renderer.js +8 -4
- package/build/production/server/renderer.js.map +1 -1
- package/build/production/shared/utils/index.js +1 -1
- package/build/production/shared/utils/index.js.map +1 -1
- package/build/production/shared/utils/splitComponent.js +45 -7
- package/build/production/shared/utils/splitComponent.js.map +1 -1
- package/build/production/web.bundle.js +1 -1
- package/build/production/web.bundle.js.map +1 -1
- package/package.json +6 -6
- package/build/development/shared/components/CodeSplit/index.js +0 -115
- package/build/development/shared/components/CodeSplit/index.js.map +0 -1
- package/build/development/shared/utils/Barrier.js +0 -23
- package/build/development/shared/utils/Barrier.js.map +0 -1
- package/build/production/shared/components/CodeSplit/index.js +0 -10
- package/build/production/shared/components/CodeSplit/index.js.map +0 -1
- package/build/production/shared/utils/Barrier.js +0 -7
- package/build/production/shared/utils/Barrier.js.map +0 -1
package/package.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"version": "1.
|
|
2
|
+
"version": "1.24.0",
|
|
3
3
|
"bin": {
|
|
4
4
|
"react-utils-build": "bin/build.js",
|
|
5
5
|
"react-utils-setup": "bin/setup.js"
|
|
@@ -62,9 +62,9 @@
|
|
|
62
62
|
"babel-jest": "^29.5.0",
|
|
63
63
|
"babel-loader": "^9.1.2",
|
|
64
64
|
"babel-plugin-module-resolver": "^5.0.0",
|
|
65
|
-
"core-js": "^3.
|
|
65
|
+
"core-js": "^3.31.0",
|
|
66
66
|
"css-loader": "^6.8.1",
|
|
67
|
-
"css-minimizer-webpack-plugin": "^5.0.
|
|
67
|
+
"css-minimizer-webpack-plugin": "^5.0.1",
|
|
68
68
|
"eslint": "^8.42.0",
|
|
69
69
|
"eslint-config-airbnb": "^19.0.4",
|
|
70
70
|
"eslint-import-resolver-babel-module": "^5.3.2",
|
|
@@ -81,15 +81,15 @@
|
|
|
81
81
|
"mockdate": "^3.0.5",
|
|
82
82
|
"nodelist-foreach-polyfill": "^1.2.0",
|
|
83
83
|
"postcss": "^8.4.24",
|
|
84
|
-
"postcss-loader": "^7.3.
|
|
84
|
+
"postcss-loader": "^7.3.3",
|
|
85
85
|
"postcss-scss": "^4.0.6",
|
|
86
86
|
"pretty": "^2.0.0",
|
|
87
87
|
"react-refresh": "^0.14.0",
|
|
88
88
|
"react-test-renderer": "^18.2.0",
|
|
89
89
|
"regenerator-runtime": "^0.13.11",
|
|
90
90
|
"resolve-url-loader": "^5.0.0",
|
|
91
|
-
"sass": "^1.63.
|
|
92
|
-
"sass-loader": "^13.3.
|
|
91
|
+
"sass": "^1.63.3",
|
|
92
|
+
"sass-loader": "^13.3.2",
|
|
93
93
|
"sitemap": "^7.1.1",
|
|
94
94
|
"stylelint": "^15.7.0",
|
|
95
95
|
"stylelint-config-standard-scss": "^9.0.0",
|
|
@@ -1,115 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = CodeSplit;
|
|
8
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
|
-
var _react = require("react");
|
|
10
|
-
var _reactGlobalState = require("@dr.pogodin/react-global-state");
|
|
11
|
-
var _Barrier = require("../../utils/Barrier");
|
|
12
|
-
var _isomorphy = require("../../utils/isomorphy");
|
|
13
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
14
|
-
/* eslint-disable react/jsx-props-no-spreading */
|
|
15
|
-
/* global document */
|
|
16
|
-
|
|
17
|
-
let chunkGroups;
|
|
18
|
-
let styleSheetUsageCounters;
|
|
19
|
-
if (_isomorphy.IS_CLIENT_SIDE) {
|
|
20
|
-
// eslint-disable-next-line global-require
|
|
21
|
-
chunkGroups = require("../../../client/getInj").default().CHUNK_GROUPS || {};
|
|
22
|
-
styleSheetUsageCounters = {};
|
|
23
|
-
}
|
|
24
|
-
function CodeSplit({
|
|
25
|
-
children,
|
|
26
|
-
chunkName,
|
|
27
|
-
getComponent,
|
|
28
|
-
placeholder,
|
|
29
|
-
...props
|
|
30
|
-
}) {
|
|
31
|
-
const {
|
|
32
|
-
current: heap
|
|
33
|
-
} = (0, _react.useRef)({
|
|
34
|
-
mounted: false,
|
|
35
|
-
pendingStyles: []
|
|
36
|
-
});
|
|
37
|
-
const {
|
|
38
|
-
publicPath
|
|
39
|
-
} = (0, _isomorphy.getBuildInfo)();
|
|
40
|
-
|
|
41
|
-
// TODO: Not sure whether it is fine for the inner React.lazy() mechanics
|
|
42
|
-
// if we dynamically create the lazy component inside a render of another
|
|
43
|
-
// component, or does it expect we only create it once on outside of any
|
|
44
|
-
// component.
|
|
45
|
-
const LazyComponent = /*#__PURE__*/(0, _react.lazy)(async () => {
|
|
46
|
-
const res = await getComponent();
|
|
47
|
-
if (heap.pendingStyles.length) await Promise.all(heap.pendingStyles);
|
|
48
|
-
return res.default ? res : {
|
|
49
|
-
default: res
|
|
50
|
-
};
|
|
51
|
-
});
|
|
52
|
-
if (_isomorphy.IS_SERVER_SIDE) {
|
|
53
|
-
const {
|
|
54
|
-
chunks
|
|
55
|
-
} = (0, _reactGlobalState.getGlobalState)().ssrContext;
|
|
56
|
-
if (chunks.includes(chunkName)) {
|
|
57
|
-
throw Error(`Chunk name clash for "${chunkName}"`);
|
|
58
|
-
} else chunks.push(chunkName);
|
|
59
|
-
} else if (!heap.mounted) {
|
|
60
|
-
heap.mounted = true;
|
|
61
|
-
chunkGroups[chunkName].forEach(asset => {
|
|
62
|
-
if (!asset.endsWith('.css')) return;
|
|
63
|
-
const path = `${publicPath}/${asset}`;
|
|
64
|
-
let link = document.querySelector(`link[href="${path}"]`);
|
|
65
|
-
if (!link) {
|
|
66
|
-
link = document.createElement('link');
|
|
67
|
-
link.setAttribute('href', path);
|
|
68
|
-
link.setAttribute('rel', 'stylesheet');
|
|
69
|
-
const barrier = (0, _Barrier.newBarrier)();
|
|
70
|
-
link.onload = barrier.resolve;
|
|
71
|
-
|
|
72
|
-
// Even if the style load failed, still allow to mount the component,
|
|
73
|
-
// abeit with broken styling.
|
|
74
|
-
link.onerror = barrier.resolve;
|
|
75
|
-
heap.pendingStyles.push(barrier);
|
|
76
|
-
const head = document.querySelector('head');
|
|
77
|
-
head.appendChild(link);
|
|
78
|
-
}
|
|
79
|
-
const count = styleSheetUsageCounters[path] || 0;
|
|
80
|
-
styleSheetUsageCounters[path] = count + 1;
|
|
81
|
-
});
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
// This effectively fires only once, just before the component unmounts.
|
|
85
|
-
(0, _react.useEffect)(() => () => {
|
|
86
|
-
heap.mounted = false;
|
|
87
|
-
chunkGroups[chunkName].forEach(item => {
|
|
88
|
-
if (!item.endsWith('.css')) return;
|
|
89
|
-
const path = `${publicPath}/${item}`;
|
|
90
|
-
if (--styleSheetUsageCounters[path] <= 0) {
|
|
91
|
-
const link = document.querySelector(`link[href="${path}"]`);
|
|
92
|
-
const head = document.querySelector('head');
|
|
93
|
-
head.removeChild(link);
|
|
94
|
-
}
|
|
95
|
-
});
|
|
96
|
-
}, [chunkName, heap, publicPath]);
|
|
97
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Suspense, {
|
|
98
|
-
fallback: placeholder,
|
|
99
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(LazyComponent, {
|
|
100
|
-
...props,
|
|
101
|
-
children: children
|
|
102
|
-
})
|
|
103
|
-
});
|
|
104
|
-
}
|
|
105
|
-
CodeSplit.propTypes = {
|
|
106
|
-
children: _propTypes.default.node,
|
|
107
|
-
chunkName: _propTypes.default.string.isRequired,
|
|
108
|
-
getComponent: _propTypes.default.func.isRequired,
|
|
109
|
-
placeholder: _propTypes.default.node
|
|
110
|
-
};
|
|
111
|
-
CodeSplit.defaultProps = {
|
|
112
|
-
children: undefined,
|
|
113
|
-
placeholder: undefined
|
|
114
|
-
};
|
|
115
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_react","_reactGlobalState","_Barrier","_isomorphy","_jsxRuntime","chunkGroups","styleSheetUsageCounters","IS_CLIENT_SIDE","default","CHUNK_GROUPS","CodeSplit","children","chunkName","getComponent","placeholder","props","current","heap","useRef","mounted","pendingStyles","publicPath","getBuildInfo","LazyComponent","lazy","res","length","Promise","all","IS_SERVER_SIDE","chunks","getGlobalState","ssrContext","includes","Error","push","forEach","asset","endsWith","path","link","document","querySelector","createElement","setAttribute","barrier","newBarrier","onload","resolve","onerror","head","appendChild","count","useEffect","item","removeChild","jsx","Suspense","fallback","propTypes","PT","node","string","isRequired","func","defaultProps","undefined"],"sources":["../../../../../src/shared/components/CodeSplit/index.jsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\n/* global document */\n\nimport PT from 'prop-types';\n\nimport {\n lazy,\n Suspense,\n useEffect,\n useRef,\n} from 'react';\n\nimport { getGlobalState } from '@dr.pogodin/react-global-state';\nimport { newBarrier } from 'utils/Barrier';\n\nimport {\n IS_CLIENT_SIDE,\n IS_SERVER_SIDE,\n getBuildInfo,\n} from 'utils/isomorphy';\n\nlet chunkGroups;\nlet styleSheetUsageCounters;\nif (IS_CLIENT_SIDE) {\n // eslint-disable-next-line global-require\n chunkGroups = require('client/getInj').default().CHUNK_GROUPS || {};\n styleSheetUsageCounters = {};\n}\n\nexport default function CodeSplit({\n children,\n chunkName,\n getComponent,\n placeholder,\n ...props\n}) {\n const { current: heap } = useRef({\n mounted: false,\n pendingStyles: [],\n });\n const { publicPath } = getBuildInfo();\n\n // TODO: Not sure whether it is fine for the inner React.lazy() mechanics\n // if we dynamically create the lazy component inside a render of another\n // component, or does it expect we only create it once on outside of any\n // component.\n const LazyComponent = lazy(async () => {\n const res = await getComponent();\n if (heap.pendingStyles.length) await Promise.all(heap.pendingStyles);\n return res.default ? res : { default: res };\n });\n\n if (IS_SERVER_SIDE) {\n const { chunks } = getGlobalState().ssrContext;\n if (chunks.includes(chunkName)) {\n throw Error(`Chunk name clash for \"${chunkName}\"`);\n } else chunks.push(chunkName);\n } else if (!heap.mounted) {\n heap.mounted = true;\n\n chunkGroups[chunkName].forEach((asset) => {\n if (!asset.endsWith('.css')) return;\n const path = `${publicPath}/${asset}`;\n let link = document.querySelector(`link[href=\"${path}\"]`);\n if (!link) {\n link = document.createElement('link');\n link.setAttribute('href', path);\n link.setAttribute('rel', 'stylesheet');\n\n const barrier = newBarrier();\n link.onload = barrier.resolve;\n\n // Even if the style load failed, still allow to mount the component,\n // abeit with broken styling.\n link.onerror = barrier.resolve;\n\n heap.pendingStyles.push(barrier);\n\n const head = document.querySelector('head');\n head.appendChild(link);\n }\n\n const count = styleSheetUsageCounters[path] || 0;\n styleSheetUsageCounters[path] = count + 1;\n });\n }\n\n // This effectively fires only once, just before the component unmounts.\n useEffect(() => () => {\n heap.mounted = false;\n chunkGroups[chunkName].forEach((item) => {\n if (!item.endsWith('.css')) return;\n const path = `${publicPath}/${item}`;\n if (--styleSheetUsageCounters[path] <= 0) {\n const link = document.querySelector(`link[href=\"${path}\"]`);\n const head = document.querySelector('head');\n head.removeChild(link);\n }\n });\n }, [chunkName, heap, publicPath]);\n\n return (\n <Suspense fallback={placeholder}>\n <LazyComponent {...props}>\n {children}\n </LazyComponent>\n </Suspense>\n );\n}\n\nCodeSplit.propTypes = {\n children: PT.node,\n chunkName: PT.string.isRequired,\n getComponent: PT.func.isRequired,\n placeholder: PT.node,\n};\n\nCodeSplit.defaultProps = {\n children: undefined,\n placeholder: undefined,\n};\n"],"mappings":"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"}
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
Object.defineProperty(exports, "Barrier", {
|
|
7
|
-
enumerable: true,
|
|
8
|
-
get: function () {
|
|
9
|
-
return _jsUtils.Barrier;
|
|
10
|
-
}
|
|
11
|
-
});
|
|
12
|
-
exports.newBarrier = newBarrier;
|
|
13
|
-
var _jsUtils = require("@dr.pogodin/js-utils");
|
|
14
|
-
/**
|
|
15
|
-
* Creates a new Barrier.
|
|
16
|
-
* @deprecated Prefer using `Barrier` class construction directly,
|
|
17
|
-
* i.e. `new Barrier(executor)` instead of `newBarrier(executor)`.
|
|
18
|
-
* @returns {Barrier}
|
|
19
|
-
*/
|
|
20
|
-
function newBarrier(executor) {
|
|
21
|
-
return new _jsUtils.Barrier(executor);
|
|
22
|
-
}
|
|
23
|
-
//# sourceMappingURL=Barrier.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Barrier.js","names":["_jsUtils","require","newBarrier","executor","Barrier"],"sources":["../../../../src/shared/utils/Barrier.js"],"sourcesContent":["import { Barrier } from '@dr.pogodin/js-utils';\n\nexport { Barrier };\n\n/**\n * Creates a new Barrier.\n * @deprecated Prefer using `Barrier` class construction directly,\n * i.e. `new Barrier(executor)` instead of `newBarrier(executor)`.\n * @returns {Barrier}\n */\nexport function newBarrier(executor) {\n return new Barrier(executor);\n}\n"],"mappings":";;;;;;;;;;;;AAAA,IAAAA,QAAA,GAAAC,OAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,UAAUA,CAACC,QAAQ,EAAE;EACnC,OAAO,IAAIC,gBAAO,CAACD,QAAQ,CAAC;AAC9B"}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=CodeSplit;var _propTypes=_interopRequireDefault(require("prop-types"));var _react=require("react");var _reactGlobalState=require("@dr.pogodin/react-global-state");var _Barrier=require("../../utils/Barrier");var _isomorphy=require("../../utils/isomorphy");var _jsxRuntime=require("react/jsx-runtime");/* eslint-disable react/jsx-props-no-spreading */ /* global document */let chunkGroups;let styleSheetUsageCounters;if(_isomorphy.IS_CLIENT_SIDE){// eslint-disable-next-line global-require
|
|
2
|
-
chunkGroups=require("../../../client/getInj").default().CHUNK_GROUPS||{};styleSheetUsageCounters={}}function CodeSplit({children,chunkName,getComponent,placeholder,...props}){const{current:heap}=(0,_react.useRef)({mounted:false,pendingStyles:[]});const{publicPath}=(0,_isomorphy.getBuildInfo)();// TODO: Not sure whether it is fine for the inner React.lazy() mechanics
|
|
3
|
-
// if we dynamically create the lazy component inside a render of another
|
|
4
|
-
// component, or does it expect we only create it once on outside of any
|
|
5
|
-
// component.
|
|
6
|
-
const LazyComponent=/*#__PURE__*/(0,_react.lazy)(async()=>{const res=await getComponent();if(heap.pendingStyles.length)await Promise.all(heap.pendingStyles);return res.default?res:{default:res}});if(_isomorphy.IS_SERVER_SIDE){const{chunks}=(0,_reactGlobalState.getGlobalState)().ssrContext;if(chunks.includes(chunkName)){throw Error(`Chunk name clash for "${chunkName}"`)}else chunks.push(chunkName)}else if(!heap.mounted){heap.mounted=true;chunkGroups[chunkName].forEach(asset=>{if(!asset.endsWith(".css"))return;const path=`${publicPath}/${asset}`;let link=document.querySelector(`link[href="${path}"]`);if(!link){link=document.createElement("link");link.setAttribute("href",path);link.setAttribute("rel","stylesheet");const barrier=(0,_Barrier.newBarrier)();link.onload=barrier.resolve;// Even if the style load failed, still allow to mount the component,
|
|
7
|
-
// abeit with broken styling.
|
|
8
|
-
link.onerror=barrier.resolve;heap.pendingStyles.push(barrier);const head=document.querySelector("head");head.appendChild(link)}const count=styleSheetUsageCounters[path]||0;styleSheetUsageCounters[path]=count+1})}// This effectively fires only once, just before the component unmounts.
|
|
9
|
-
(0,_react.useEffect)(()=>()=>{heap.mounted=false;chunkGroups[chunkName].forEach(item=>{if(!item.endsWith(".css"))return;const path=`${publicPath}/${item}`;if(--styleSheetUsageCounters[path]<=0){const link=document.querySelector(`link[href="${path}"]`);const head=document.querySelector("head");head.removeChild(link)}})},[chunkName,heap,publicPath]);return/*#__PURE__*/(0,_jsxRuntime.jsx)(_react.Suspense,{fallback:placeholder,children:/*#__PURE__*/(0,_jsxRuntime.jsx)(LazyComponent,{...props,children:children})})}CodeSplit.propTypes={children:_propTypes.default.node,chunkName:_propTypes.default.string.isRequired,getComponent:_propTypes.default.func.isRequired,placeholder:_propTypes.default.node};CodeSplit.defaultProps={children:undefined,placeholder:undefined};
|
|
10
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_propTypes","_interopRequireDefault","require","_react","_reactGlobalState","_Barrier","_isomorphy","_jsxRuntime","chunkGroups","styleSheetUsageCounters","IS_CLIENT_SIDE","default","CHUNK_GROUPS","CodeSplit","children","chunkName","getComponent","placeholder","props","current","heap","useRef","mounted","pendingStyles","publicPath","getBuildInfo","LazyComponent","lazy","res","length","Promise","all","IS_SERVER_SIDE","chunks","getGlobalState","ssrContext","includes","Error","push","forEach","asset","endsWith","path","link","document","querySelector","createElement","setAttribute","barrier","newBarrier","onload","resolve","onerror","head","appendChild","count","useEffect","item","removeChild","jsx","Suspense","fallback","propTypes","PT","node","string","isRequired","func","defaultProps","undefined"],"sources":["../../../../../src/shared/components/CodeSplit/index.jsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\n/* global document */\n\nimport PT from 'prop-types';\n\nimport {\n lazy,\n Suspense,\n useEffect,\n useRef,\n} from 'react';\n\nimport { getGlobalState } from '@dr.pogodin/react-global-state';\nimport { newBarrier } from 'utils/Barrier';\n\nimport {\n IS_CLIENT_SIDE,\n IS_SERVER_SIDE,\n getBuildInfo,\n} from 'utils/isomorphy';\n\nlet chunkGroups;\nlet styleSheetUsageCounters;\nif (IS_CLIENT_SIDE) {\n // eslint-disable-next-line global-require\n chunkGroups = require('client/getInj').default().CHUNK_GROUPS || {};\n styleSheetUsageCounters = {};\n}\n\nexport default function CodeSplit({\n children,\n chunkName,\n getComponent,\n placeholder,\n ...props\n}) {\n const { current: heap } = useRef({\n mounted: false,\n pendingStyles: [],\n });\n const { publicPath } = getBuildInfo();\n\n // TODO: Not sure whether it is fine for the inner React.lazy() mechanics\n // if we dynamically create the lazy component inside a render of another\n // component, or does it expect we only create it once on outside of any\n // component.\n const LazyComponent = lazy(async () => {\n const res = await getComponent();\n if (heap.pendingStyles.length) await Promise.all(heap.pendingStyles);\n return res.default ? res : { default: res };\n });\n\n if (IS_SERVER_SIDE) {\n const { chunks } = getGlobalState().ssrContext;\n if (chunks.includes(chunkName)) {\n throw Error(`Chunk name clash for \"${chunkName}\"`);\n } else chunks.push(chunkName);\n } else if (!heap.mounted) {\n heap.mounted = true;\n\n chunkGroups[chunkName].forEach((asset) => {\n if (!asset.endsWith('.css')) return;\n const path = `${publicPath}/${asset}`;\n let link = document.querySelector(`link[href=\"${path}\"]`);\n if (!link) {\n link = document.createElement('link');\n link.setAttribute('href', path);\n link.setAttribute('rel', 'stylesheet');\n\n const barrier = newBarrier();\n link.onload = barrier.resolve;\n\n // Even if the style load failed, still allow to mount the component,\n // abeit with broken styling.\n link.onerror = barrier.resolve;\n\n heap.pendingStyles.push(barrier);\n\n const head = document.querySelector('head');\n head.appendChild(link);\n }\n\n const count = styleSheetUsageCounters[path] || 0;\n styleSheetUsageCounters[path] = count + 1;\n });\n }\n\n // This effectively fires only once, just before the component unmounts.\n useEffect(() => () => {\n heap.mounted = false;\n chunkGroups[chunkName].forEach((item) => {\n if (!item.endsWith('.css')) return;\n const path = `${publicPath}/${item}`;\n if (--styleSheetUsageCounters[path] <= 0) {\n const link = document.querySelector(`link[href=\"${path}\"]`);\n const head = document.querySelector('head');\n head.removeChild(link);\n }\n });\n }, [chunkName, heap, publicPath]);\n\n return (\n <Suspense fallback={placeholder}>\n <LazyComponent {...props}>\n {children}\n </LazyComponent>\n </Suspense>\n );\n}\n\nCodeSplit.propTypes = {\n children: PT.node,\n chunkName: PT.string.isRequired,\n getComponent: PT.func.isRequired,\n placeholder: PT.node,\n};\n\nCodeSplit.defaultProps = {\n children: undefined,\n placeholder: undefined,\n};\n"],"mappings":"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"}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:true});Object.defineProperty(exports,"Barrier",{enumerable:true,get:function(){return _jsUtils.Barrier}});exports.newBarrier=newBarrier;var _jsUtils=require("@dr.pogodin/js-utils");/**
|
|
2
|
-
* Creates a new Barrier.
|
|
3
|
-
* @deprecated Prefer using `Barrier` class construction directly,
|
|
4
|
-
* i.e. `new Barrier(executor)` instead of `newBarrier(executor)`.
|
|
5
|
-
* @returns {Barrier}
|
|
6
|
-
*/function newBarrier(executor){return new _jsUtils.Barrier(executor)}
|
|
7
|
-
//# sourceMappingURL=Barrier.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Barrier.js","names":["_jsUtils","require","newBarrier","executor","Barrier"],"sources":["../../../../src/shared/utils/Barrier.js"],"sourcesContent":["import { Barrier } from '@dr.pogodin/js-utils';\n\nexport { Barrier };\n\n/**\n * Creates a new Barrier.\n * @deprecated Prefer using `Barrier` class construction directly,\n * i.e. `new Barrier(executor)` instead of `newBarrier(executor)`.\n * @returns {Barrier}\n */\nexport function newBarrier(executor) {\n return new Barrier(executor);\n}\n"],"mappings":"uMAAA,IAAAA,QAAA,CAAAC,OAAA,yBAIA;AACA;AACA;AACA;AACA;AACA,GACO,QAAS,CAAAC,UAAUA,CAACC,QAAQ,CAAE,CACnC,MAAO,IAAI,CAAAC,gBAAO,CAACD,QAAQ,CAC7B"}
|