@splunk/react-page 6.3.0 → 6.3.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 +5 -0
- package/lib/index.js +166 -240
- package/package.json +12 -14
package/CHANGELOG.md
CHANGED
package/lib/index.js
CHANGED
|
@@ -1,193 +1,80 @@
|
|
|
1
|
-
|
|
2
|
-
/******/
|
|
3
|
-
/******/ // The
|
|
4
|
-
/******/ var
|
|
5
|
-
/******/
|
|
6
|
-
|
|
7
|
-
/******/
|
|
8
|
-
/******/
|
|
9
|
-
/******/ //
|
|
10
|
-
/******/
|
|
11
|
-
/******/
|
|
12
|
-
/******/
|
|
13
|
-
/******/
|
|
14
|
-
/******/
|
|
15
|
-
/******/
|
|
16
|
-
/******/
|
|
17
|
-
/******/
|
|
1
|
+
/******/ (() => { // webpackBootstrap
|
|
2
|
+
/******/ "use strict";
|
|
3
|
+
/******/ // The require scope
|
|
4
|
+
/******/ var __webpack_require__ = {};
|
|
5
|
+
/******/
|
|
6
|
+
/************************************************************************/
|
|
7
|
+
/******/ /* webpack/runtime/compat get default export */
|
|
8
|
+
/******/ (() => {
|
|
9
|
+
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
|
10
|
+
/******/ __webpack_require__.n = (module) => {
|
|
11
|
+
/******/ var getter = module && module.__esModule ?
|
|
12
|
+
/******/ () => (module['default']) :
|
|
13
|
+
/******/ () => (module);
|
|
14
|
+
/******/ __webpack_require__.d(getter, { a: getter });
|
|
15
|
+
/******/ return getter;
|
|
16
|
+
/******/ };
|
|
17
|
+
/******/ })();
|
|
18
|
+
/******/
|
|
19
|
+
/******/ /* webpack/runtime/define property getters */
|
|
20
|
+
/******/ (() => {
|
|
21
|
+
/******/ // define getter functions for harmony exports
|
|
22
|
+
/******/ __webpack_require__.d = (exports, definition) => {
|
|
23
|
+
/******/ for(var key in definition) {
|
|
24
|
+
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
|
|
25
|
+
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
|
|
26
|
+
/******/ }
|
|
27
|
+
/******/ }
|
|
18
28
|
/******/ };
|
|
19
|
-
/******/
|
|
20
|
-
/******/
|
|
21
|
-
/******/
|
|
22
|
-
/******/
|
|
23
|
-
/******/
|
|
24
|
-
/******/
|
|
25
|
-
/******/
|
|
26
|
-
/******/
|
|
27
|
-
/******/
|
|
28
|
-
/******/
|
|
29
|
-
/******/
|
|
30
|
-
/******/
|
|
31
|
-
/******/
|
|
32
|
-
/******/
|
|
33
|
-
/******/
|
|
34
|
-
/******/
|
|
35
|
-
/******/
|
|
36
|
-
/******/
|
|
37
|
-
/******/ // define getter function for harmony exports
|
|
38
|
-
/******/ __webpack_require__.d = function(exports, name, getter) {
|
|
39
|
-
/******/ if(!__webpack_require__.o(exports, name)) {
|
|
40
|
-
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
|
|
41
|
-
/******/ }
|
|
42
|
-
/******/ };
|
|
43
|
-
/******/
|
|
44
|
-
/******/ // define __esModule on exports
|
|
45
|
-
/******/ __webpack_require__.r = function(exports) {
|
|
46
|
-
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
|
|
47
|
-
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
48
|
-
/******/ }
|
|
49
|
-
/******/ Object.defineProperty(exports, '__esModule', { value: true });
|
|
50
|
-
/******/ };
|
|
51
|
-
/******/
|
|
52
|
-
/******/ // create a fake namespace object
|
|
53
|
-
/******/ // mode & 1: value is a module id, require it
|
|
54
|
-
/******/ // mode & 2: merge all properties of value into the ns
|
|
55
|
-
/******/ // mode & 4: return value when already ns object
|
|
56
|
-
/******/ // mode & 8|1: behave like require
|
|
57
|
-
/******/ __webpack_require__.t = function(value, mode) {
|
|
58
|
-
/******/ if(mode & 1) value = __webpack_require__(value);
|
|
59
|
-
/******/ if(mode & 8) return value;
|
|
60
|
-
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
|
|
61
|
-
/******/ var ns = Object.create(null);
|
|
62
|
-
/******/ __webpack_require__.r(ns);
|
|
63
|
-
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
|
|
64
|
-
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
|
|
65
|
-
/******/ return ns;
|
|
66
|
-
/******/ };
|
|
67
|
-
/******/
|
|
68
|
-
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
|
69
|
-
/******/ __webpack_require__.n = function(module) {
|
|
70
|
-
/******/ var getter = module && module.__esModule ?
|
|
71
|
-
/******/ function getDefault() { return module['default']; } :
|
|
72
|
-
/******/ function getModuleExports() { return module; };
|
|
73
|
-
/******/ __webpack_require__.d(getter, 'a', getter);
|
|
74
|
-
/******/ return getter;
|
|
75
|
-
/******/ };
|
|
76
|
-
/******/
|
|
77
|
-
/******/ // Object.prototype.hasOwnProperty.call
|
|
78
|
-
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
|
|
79
|
-
/******/
|
|
80
|
-
/******/ // __webpack_public_path__
|
|
81
|
-
/******/ __webpack_require__.p = "";
|
|
82
|
-
/******/
|
|
83
|
-
/******/
|
|
84
|
-
/******/ // Load entry module and return exports
|
|
85
|
-
/******/ return __webpack_require__(__webpack_require__.s = 11);
|
|
86
|
-
/******/ })
|
|
29
|
+
/******/ })();
|
|
30
|
+
/******/
|
|
31
|
+
/******/ /* webpack/runtime/hasOwnProperty shorthand */
|
|
32
|
+
/******/ (() => {
|
|
33
|
+
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
|
|
34
|
+
/******/ })();
|
|
35
|
+
/******/
|
|
36
|
+
/******/ /* webpack/runtime/make namespace object */
|
|
37
|
+
/******/ (() => {
|
|
38
|
+
/******/ // define __esModule on exports
|
|
39
|
+
/******/ __webpack_require__.r = (exports) => {
|
|
40
|
+
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
|
|
41
|
+
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
42
|
+
/******/ }
|
|
43
|
+
/******/ Object.defineProperty(exports, '__esModule', { value: true });
|
|
44
|
+
/******/ };
|
|
45
|
+
/******/ })();
|
|
46
|
+
/******/
|
|
87
47
|
/************************************************************************/
|
|
88
|
-
|
|
89
|
-
/* 0 */
|
|
90
|
-
/***/ (function(module, exports) {
|
|
91
|
-
|
|
92
|
-
module.exports = require("react");
|
|
93
|
-
|
|
94
|
-
/***/ }),
|
|
95
|
-
/* 1 */
|
|
96
|
-
/***/ (function(module, exports) {
|
|
97
|
-
|
|
98
|
-
module.exports = require("@splunk/themes");
|
|
99
|
-
|
|
100
|
-
/***/ }),
|
|
101
|
-
/* 2 */
|
|
102
|
-
/***/ (function(module, exports) {
|
|
103
|
-
|
|
104
|
-
module.exports = require("styled-components");
|
|
105
|
-
|
|
106
|
-
/***/ }),
|
|
107
|
-
/* 3 */
|
|
108
|
-
/***/ (function(module, exports) {
|
|
109
|
-
|
|
110
|
-
module.exports = require("prop-types");
|
|
111
|
-
|
|
112
|
-
/***/ }),
|
|
113
|
-
/* 4 */
|
|
114
|
-
/***/ (function(module, exports) {
|
|
115
|
-
|
|
116
|
-
module.exports = require("@splunk/themes/SplunkThemeProvider");
|
|
117
|
-
|
|
118
|
-
/***/ }),
|
|
119
|
-
/* 5 */
|
|
120
|
-
/***/ (function(module, exports) {
|
|
121
|
-
|
|
122
|
-
module.exports = require("react-dom");
|
|
123
|
-
|
|
124
|
-
/***/ }),
|
|
125
|
-
/* 6 */
|
|
126
|
-
/***/ (function(module, exports) {
|
|
127
|
-
|
|
128
|
-
module.exports = require("scriptjs");
|
|
129
|
-
|
|
130
|
-
/***/ }),
|
|
131
|
-
/* 7 */
|
|
132
|
-
/***/ (function(module, exports) {
|
|
133
|
-
|
|
134
|
-
module.exports = require("@splunk/react-ui/Layer");
|
|
135
|
-
|
|
136
|
-
/***/ }),
|
|
137
|
-
/* 8 */
|
|
138
|
-
/***/ (function(module, exports) {
|
|
139
|
-
|
|
140
|
-
module.exports = require("@splunk/splunk-utils/url");
|
|
141
|
-
|
|
142
|
-
/***/ }),
|
|
143
|
-
/* 9 */
|
|
144
|
-
/***/ (function(module, exports) {
|
|
145
|
-
|
|
146
|
-
module.exports = require("@splunk/react-ui/ScreenReaderContent");
|
|
147
|
-
|
|
148
|
-
/***/ }),
|
|
149
|
-
/* 10 */
|
|
150
|
-
/***/ (function(module, exports) {
|
|
151
|
-
|
|
152
|
-
module.exports = require("@splunk/ui-utils/i18n");
|
|
153
|
-
|
|
154
|
-
/***/ }),
|
|
155
|
-
/* 11 */
|
|
156
|
-
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
157
|
-
|
|
158
|
-
"use strict";
|
|
48
|
+
var __webpack_exports__ = {};
|
|
159
49
|
// ESM COMPAT FLAG
|
|
160
50
|
__webpack_require__.r(__webpack_exports__);
|
|
161
51
|
|
|
162
|
-
//
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
var
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
var
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
var SplunkThemeProvider_default = /*#__PURE__*/__webpack_require__.n(
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
var
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
var themes_ = __webpack_require__(1);
|
|
189
|
-
|
|
190
|
-
// CONCATENATED MODULE: ./src/LoadingStyles.js
|
|
52
|
+
// EXPORTS
|
|
53
|
+
__webpack_require__.d(__webpack_exports__, {
|
|
54
|
+
"default": () => (/* binding */ src)
|
|
55
|
+
});
|
|
56
|
+
|
|
57
|
+
;// CONCATENATED MODULE: external "react-dom"
|
|
58
|
+
const external_react_dom_namespaceObject = require("react-dom");
|
|
59
|
+
;// CONCATENATED MODULE: external "react"
|
|
60
|
+
const external_react_namespaceObject = require("react");
|
|
61
|
+
var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_namespaceObject);
|
|
62
|
+
;// CONCATENATED MODULE: external "scriptjs"
|
|
63
|
+
const external_scriptjs_namespaceObject = require("scriptjs");
|
|
64
|
+
var external_scriptjs_default = /*#__PURE__*/__webpack_require__.n(external_scriptjs_namespaceObject);
|
|
65
|
+
;// CONCATENATED MODULE: external "@splunk/react-ui/Layer"
|
|
66
|
+
const Layer_namespaceObject = require("@splunk/react-ui/Layer");
|
|
67
|
+
;// CONCATENATED MODULE: external "@splunk/splunk-utils/url"
|
|
68
|
+
const url_namespaceObject = require("@splunk/splunk-utils/url");
|
|
69
|
+
;// CONCATENATED MODULE: external "@splunk/themes/SplunkThemeProvider"
|
|
70
|
+
const SplunkThemeProvider_namespaceObject = require("@splunk/themes/SplunkThemeProvider");
|
|
71
|
+
var SplunkThemeProvider_default = /*#__PURE__*/__webpack_require__.n(SplunkThemeProvider_namespaceObject);
|
|
72
|
+
;// CONCATENATED MODULE: external "styled-components"
|
|
73
|
+
const external_styled_components_namespaceObject = require("styled-components");
|
|
74
|
+
var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_namespaceObject);
|
|
75
|
+
;// CONCATENATED MODULE: external "@splunk/themes"
|
|
76
|
+
const themes_namespaceObject = require("@splunk/themes");
|
|
77
|
+
;// CONCATENATED MODULE: ./src/LoadingStyles.js
|
|
191
78
|
function _templateObject6() {
|
|
192
79
|
var data = _taggedTemplateLiteral(["\n animation-name: ", ";\n animation-duration: 1.4s;\n animation-iteration-count: infinite;\n animation-fill-mode: both;\n background-color: ", ";\n width: 10px;\n height: 10px;\n border-radius: 5px;\n display: inline-block;\n margin-right: ", ";\n\n &:nth-child(2) {\n animation-delay: 0.2s;\n }\n\n &:nth-child(3) {\n animation-delay: 0.4s;\n }\n"]);
|
|
193
80
|
|
|
@@ -254,45 +141,42 @@ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(
|
|
|
254
141
|
|
|
255
142
|
var APPBAR_HEIGHT = 45;
|
|
256
143
|
var SPLUNKBAR_HEIGHT = 34;
|
|
257
|
-
var blink =
|
|
258
|
-
var Main = external_styled_components_default.
|
|
259
|
-
var SplunkBar = external_styled_components_default.
|
|
260
|
-
prisma:
|
|
261
|
-
enterprise:
|
|
144
|
+
var blink = (0,external_styled_components_namespaceObject.keyframes)(_templateObject());
|
|
145
|
+
var Main = external_styled_components_default().div(_templateObject2(), themes_namespaceObject.variables.backgroundColorPage);
|
|
146
|
+
var SplunkBar = external_styled_components_default().div(_templateObject3(), (0,themes_namespaceObject.pick)({
|
|
147
|
+
prisma: themes_namespaceObject.variables.backgroundColorSection,
|
|
148
|
+
enterprise: themes_namespaceObject.variables.gray20
|
|
262
149
|
}), SPLUNKBAR_HEIGHT);
|
|
263
|
-
var AppBar = external_styled_components_default.
|
|
264
|
-
prisma:
|
|
265
|
-
enterprise:
|
|
150
|
+
var AppBar = external_styled_components_default().div(_templateObject4(), (0,themes_namespaceObject.pick)({
|
|
151
|
+
prisma: themes_namespaceObject.variables.backgroundColorPopup,
|
|
152
|
+
enterprise: themes_namespaceObject.variables.gray30
|
|
266
153
|
}), APPBAR_HEIGHT);
|
|
267
|
-
var AppBody = external_styled_components_default.
|
|
268
|
-
var Dot = external_styled_components_default.
|
|
269
|
-
prisma:
|
|
270
|
-
enterprise:
|
|
154
|
+
var AppBody = external_styled_components_default().div(_templateObject5(), themes_namespaceObject.variables.contentColorInverted);
|
|
155
|
+
var Dot = external_styled_components_default().div(_templateObject6(), blink, themes_namespaceObject.variables.neutral500, (0,themes_namespaceObject.pick)({
|
|
156
|
+
prisma: themes_namespaceObject.variables.spacingMedium,
|
|
157
|
+
enterprise: themes_namespaceObject.variables.spacingHalf
|
|
271
158
|
}));
|
|
272
159
|
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
var
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
var i18n_ = __webpack_require__(10);
|
|
283
|
-
|
|
284
|
-
// CONCATENATED MODULE: ./src/Loading.jsx
|
|
160
|
+
;// CONCATENATED MODULE: external "prop-types"
|
|
161
|
+
const external_prop_types_namespaceObject = require("prop-types");
|
|
162
|
+
var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_namespaceObject);
|
|
163
|
+
;// CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
|
|
164
|
+
const ScreenReaderContent_namespaceObject = require("@splunk/react-ui/ScreenReaderContent");
|
|
165
|
+
var ScreenReaderContent_default = /*#__PURE__*/__webpack_require__.n(ScreenReaderContent_namespaceObject);
|
|
166
|
+
;// CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
|
|
167
|
+
const i18n_namespaceObject = require("@splunk/ui-utils/i18n");
|
|
168
|
+
;// CONCATENATED MODULE: ./src/Loading.jsx
|
|
285
169
|
|
|
286
170
|
|
|
287
171
|
|
|
288
172
|
|
|
289
173
|
|
|
290
174
|
var propTypes = {
|
|
291
|
-
hideAppBar: external_prop_types_default.
|
|
292
|
-
hideChrome: external_prop_types_default.
|
|
293
|
-
hideSplunkBar: external_prop_types_default.
|
|
294
|
-
AppBarFallback: external_prop_types_default.
|
|
295
|
-
SplunkBarFallback: external_prop_types_default.
|
|
175
|
+
hideAppBar: (external_prop_types_default()).bool,
|
|
176
|
+
hideChrome: (external_prop_types_default()).bool,
|
|
177
|
+
hideSplunkBar: (external_prop_types_default()).bool,
|
|
178
|
+
AppBarFallback: (external_prop_types_default()).elementType,
|
|
179
|
+
SplunkBarFallback: (external_prop_types_default()).elementType
|
|
296
180
|
};
|
|
297
181
|
var defaultProps = {
|
|
298
182
|
hideAppBar: false,
|
|
@@ -308,13 +192,13 @@ function Loading(_ref) {
|
|
|
308
192
|
hideSplunkBar = _ref.hideSplunkBar,
|
|
309
193
|
SplunkBarFallback = _ref.SplunkBarFallback,
|
|
310
194
|
AppBarFallback = _ref.AppBarFallback;
|
|
311
|
-
return /*#__PURE__*/external_react_default.
|
|
195
|
+
return /*#__PURE__*/external_react_default().createElement(Main, null, !hideChrome && !hideSplunkBar && /*#__PURE__*/external_react_default().createElement(SplunkBarFallback, null), !hideChrome && !hideAppBar && /*#__PURE__*/external_react_default().createElement(AppBarFallback, null), /*#__PURE__*/external_react_default().createElement(AppBody, null, /*#__PURE__*/external_react_default().createElement(Dot, null), /*#__PURE__*/external_react_default().createElement(Dot, null), /*#__PURE__*/external_react_default().createElement(Dot, null), /*#__PURE__*/external_react_default().createElement((ScreenReaderContent_default()), null, (0,i18n_namespaceObject._)('Loading'))));
|
|
312
196
|
}
|
|
313
197
|
|
|
314
198
|
Loading.propTypes = propTypes;
|
|
315
199
|
Loading.defaultProps = defaultProps;
|
|
316
|
-
/* harmony default export */
|
|
317
|
-
|
|
200
|
+
/* harmony default export */ const src_Loading = (Loading);
|
|
201
|
+
;// CONCATENATED MODULE: ./src/baseLayout.jsx
|
|
318
202
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
319
203
|
|
|
320
204
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
@@ -344,7 +228,7 @@ function getLayoutApi(theme, callback) {
|
|
|
344
228
|
loader = _ref$loader === void 0 ? 'scriptjs' : _ref$loader;
|
|
345
229
|
|
|
346
230
|
var themedLayout = theme === 'dark' ? DARK_LAYOUT : LIGHT_LAYOUT;
|
|
347
|
-
var url =
|
|
231
|
+
var url = (0,url_namespaceObject.createStaticURL)(themedLayout);
|
|
348
232
|
|
|
349
233
|
if (loader === 'scriptjs') {
|
|
350
234
|
external_scriptjs_default()(url, function () {
|
|
@@ -361,6 +245,34 @@ function getLayoutApi(theme, callback) {
|
|
|
361
245
|
throw new Error('Invalid options.loader configuration: must be "scriptjs" or "requirejs".');
|
|
362
246
|
}
|
|
363
247
|
}
|
|
248
|
+
/**
|
|
249
|
+
* Computes the background css of the header container during lazy loading
|
|
250
|
+
*
|
|
251
|
+
* @param {HTMLDivElement} headerContainer
|
|
252
|
+
* @param {object} [options]
|
|
253
|
+
* @private
|
|
254
|
+
*/
|
|
255
|
+
|
|
256
|
+
|
|
257
|
+
function getHeaderBackground(headerContainer) {
|
|
258
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
259
|
+
var hideSplunkBar = options.hideSplunkBar,
|
|
260
|
+
hideAppBar = options.hideAppBar,
|
|
261
|
+
headerHeight = options.headerHeight;
|
|
262
|
+
var firstFallback = headerContainer.children[0];
|
|
263
|
+
var firstFallbackColor = firstFallback && getComputedStyle(firstFallback).backgroundColor;
|
|
264
|
+
|
|
265
|
+
if (!(hideSplunkBar || hideAppBar)) {
|
|
266
|
+
// compute background color to be same as both fallback components
|
|
267
|
+
var firstFallbackHeight = firstFallback === null || firstFallback === void 0 ? void 0 : firstFallback.offsetHeight;
|
|
268
|
+
var secondFallback = headerContainer.children[1];
|
|
269
|
+
var secondFallbackColor = secondFallback && getComputedStyle(secondFallback).backgroundColor;
|
|
270
|
+
var heightRatio = Math.round(firstFallbackHeight / headerHeight * 100);
|
|
271
|
+
return "linear-gradient(\n ".concat(firstFallbackColor, " 0%,\n ").concat(firstFallbackColor, " ").concat(heightRatio, "%,\n ").concat(secondFallbackColor, " ").concat(heightRatio, "%,\n ").concat(secondFallbackColor, " 100%\n )");
|
|
272
|
+
}
|
|
273
|
+
|
|
274
|
+
return firstFallbackColor;
|
|
275
|
+
}
|
|
364
276
|
/**
|
|
365
277
|
* renders body element and attaches it to container node in DOM
|
|
366
278
|
*
|
|
@@ -376,7 +288,7 @@ function getLayoutApi(theme, callback) {
|
|
|
376
288
|
function renderBody(element, render, container) {
|
|
377
289
|
var useGlobalLayerStack = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
|
|
378
290
|
var splunkTheme = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
|
|
379
|
-
var wrappedElement = useGlobalLayerStack ? /*#__PURE__*/external_react_default.
|
|
291
|
+
var wrappedElement = useGlobalLayerStack ? /*#__PURE__*/external_react_default().createElement(Layer_namespaceObject.LayerStackGlobalProvider, null, /*#__PURE__*/external_react_default().createElement((SplunkThemeProvider_default()), splunkTheme, element)) : /*#__PURE__*/external_react_default().createElement((SplunkThemeProvider_default()), splunkTheme, element);
|
|
380
292
|
return render(wrappedElement, container);
|
|
381
293
|
}
|
|
382
294
|
/**
|
|
@@ -446,16 +358,27 @@ function layout(element, render) {
|
|
|
446
358
|
|
|
447
359
|
if (lazyLoadLayout) {
|
|
448
360
|
// render the React app immediately without waiting for layout API
|
|
449
|
-
|
|
450
|
-
|
|
361
|
+
if (!hideChrome) {
|
|
362
|
+
document.body.appendChild(headerContainer);
|
|
363
|
+
headerRoot = render( /*#__PURE__*/external_react_default().createElement((external_react_default()).Fragment, null, !hideSplunkBar && /*#__PURE__*/external_react_default().createElement(SplunkBarFallback, null), !hideAppBar && /*#__PURE__*/external_react_default().createElement(AppBarFallback, null)), headerContainer); // explicitly set height and background of header container to avoid layout and color shift when fallback gets replaced
|
|
364
|
+
|
|
365
|
+
var headerHeight = headerContainer.offsetHeight;
|
|
366
|
+
var headerBackground = getHeaderBackground(headerContainer, {
|
|
367
|
+
hideSplunkBar: hideSplunkBar,
|
|
368
|
+
hideAppBar: hideAppBar,
|
|
369
|
+
headerHeight: headerHeight,
|
|
370
|
+
AppBarFallback: AppBarFallback,
|
|
371
|
+
SplunkBarFallback: SplunkBarFallback
|
|
372
|
+
});
|
|
373
|
+
headerContainer.style.height = "".concat(headerHeight, "px");
|
|
374
|
+
headerContainer.style.background = "".concat(headerBackground);
|
|
375
|
+
}
|
|
451
376
|
|
|
452
|
-
var headerHeight = headerContainer.offsetHeight;
|
|
453
|
-
headerContainer.style.cssText = "height: ".concat(headerHeight, "px");
|
|
454
377
|
document.body.appendChild(bodyContainer);
|
|
455
378
|
bodyRoot = renderBody(element, render, bodyContainer, useGlobalLayerStack, splunkTheme);
|
|
456
379
|
} else {
|
|
457
380
|
document.body.appendChild(bodyContainer);
|
|
458
|
-
bodyRoot = render( /*#__PURE__*/external_react_default.
|
|
381
|
+
bodyRoot = render( /*#__PURE__*/external_react_default().createElement((SplunkThemeProvider_default()), splunkTheme, /*#__PURE__*/external_react_default().createElement(src_Loading, layoutAPIOptions)), bodyContainer);
|
|
459
382
|
}
|
|
460
383
|
|
|
461
384
|
getLayoutApi(theme, function (layoutApi) {
|
|
@@ -492,12 +415,15 @@ function layout(element, render) {
|
|
|
492
415
|
}
|
|
493
416
|
|
|
494
417
|
if (lazyLoadLayout) {
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
418
|
+
if (!hideChrome) {
|
|
419
|
+
// replace placeholder nav bar with real nav bar
|
|
420
|
+
headerRoot.unmount(headerContainer);
|
|
421
|
+
var header = document.querySelector(HEADER_SELECTOR);
|
|
422
|
+
var containerHeight = (!hideChrome && !hideSplunkBar ? SPLUNKBAR_HEIGHT : 0) + (!hideChrome && !hideAppBar ? APPBAR_HEIGHT : 0);
|
|
423
|
+
headerContainer.style.height = "".concat(containerHeight, "px");
|
|
424
|
+
headerContainer.appendChild(header);
|
|
425
|
+
}
|
|
426
|
+
|
|
501
427
|
containerEl.appendChild(bodyContainer);
|
|
502
428
|
onLayoutComplete === null || onLayoutComplete === void 0 ? void 0 : onLayoutComplete();
|
|
503
429
|
} else {
|
|
@@ -513,16 +439,16 @@ function layout(element, render) {
|
|
|
513
439
|
});
|
|
514
440
|
}
|
|
515
441
|
|
|
516
|
-
/* harmony default export */
|
|
517
|
-
|
|
442
|
+
/* harmony default export */ const baseLayout = (layout);
|
|
443
|
+
;// CONCATENATED MODULE: ./src/index.jsx
|
|
518
444
|
|
|
519
445
|
|
|
520
446
|
|
|
521
|
-
var
|
|
522
|
-
|
|
447
|
+
var renderShim = function renderShim(elementToRender, container) {
|
|
448
|
+
(0,external_react_dom_namespaceObject.render)(elementToRender, container);
|
|
523
449
|
return {
|
|
524
450
|
unmount: function unmount() {
|
|
525
|
-
return
|
|
451
|
+
return (0,external_react_dom_namespaceObject.unmountComponentAtNode)(container);
|
|
526
452
|
}
|
|
527
453
|
};
|
|
528
454
|
};
|
|
@@ -553,10 +479,10 @@ var src_renderShim = function renderShim(elementToRender, container) {
|
|
|
553
479
|
|
|
554
480
|
|
|
555
481
|
function src_layout(element, options) {
|
|
556
|
-
baseLayout(element,
|
|
482
|
+
baseLayout(element, renderShim, options);
|
|
557
483
|
}
|
|
558
484
|
|
|
559
|
-
/* harmony default export */
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
485
|
+
/* harmony default export */ const src = (src_layout);
|
|
486
|
+
module.exports = __webpack_exports__;
|
|
487
|
+
/******/ })()
|
|
488
|
+
;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@splunk/react-page",
|
|
3
|
-
"version": "6.3.
|
|
3
|
+
"version": "6.3.1",
|
|
4
4
|
"description": "Load React components into the latest layout from Splunk Enterprise",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -8,8 +8,8 @@
|
|
|
8
8
|
"scripts": {
|
|
9
9
|
"build": "cross-env NODE_ENV=production webpack",
|
|
10
10
|
"docs": "NODE_ENV=production webpack --config docs.gen.webpack.config.js",
|
|
11
|
-
"docs:publish": "
|
|
12
|
-
"docs:publish:external": "
|
|
11
|
+
"docs:publish": "eval $(splunk-docs-package docs) && artifact-ci publish generic $DOCS_GEN_OUTPUT_NAME $DOCS_GEN_REMOTE_PATH",
|
|
12
|
+
"docs:publish:external": "eval $(splunk-docs-package docs-external --suffix=public) && artifact-ci publish generic $DOCS_GEN_OUTPUT_NAME $DOCS_GEN_REMOTE_PATH",
|
|
13
13
|
"docs:start": "webpack serve --config docs.gen.webpack.config.js",
|
|
14
14
|
"eslint": "eslint src --ext \".js,.jsx\"",
|
|
15
15
|
"eslint:fix": "eslint src --ext \".js, .jsx\" --fix",
|
|
@@ -22,9 +22,9 @@
|
|
|
22
22
|
"test:cypress:ci": "node src/tests/run-cypress-tests.js"
|
|
23
23
|
},
|
|
24
24
|
"dependencies": {
|
|
25
|
-
"@splunk/react-ui": "^4.
|
|
25
|
+
"@splunk/react-ui": "^4.21.0",
|
|
26
26
|
"@splunk/splunk-utils": "^2.3.4",
|
|
27
|
-
"@splunk/themes": "^0.16.
|
|
27
|
+
"@splunk/themes": "^0.16.2",
|
|
28
28
|
"@splunk/ui-utils": "^1.6.0",
|
|
29
29
|
"prop-types": "^15.6.2",
|
|
30
30
|
"scriptjs": "^2.5.8"
|
|
@@ -32,19 +32,18 @@
|
|
|
32
32
|
"devDependencies": {
|
|
33
33
|
"@babel/core": "^7.2.0",
|
|
34
34
|
"@splunk/babel-preset": "^4.0.0",
|
|
35
|
-
"@splunk/cicd-tools": "^0.5.0",
|
|
36
35
|
"@splunk/eslint-config": "^4.0.0",
|
|
37
36
|
"@splunk/stylelint-config": "^4.0.0",
|
|
38
|
-
"@splunk/webpack-configs": "^
|
|
37
|
+
"@splunk/webpack-configs": "^7.0.0",
|
|
39
38
|
"babel-eslint": "^10.1.0",
|
|
40
|
-
"babel-loader": "^8.0
|
|
39
|
+
"babel-loader": "^8.3.0",
|
|
41
40
|
"babel-plugin-transform-imports": "^2.0.0",
|
|
42
41
|
"cross-env": "^6.0.3",
|
|
43
42
|
"cypress": "^12.17.1",
|
|
44
43
|
"eslint": "^7.14.0",
|
|
45
44
|
"eslint-config-airbnb": "^18.2.1",
|
|
46
45
|
"eslint-config-prettier": "^6.15.0",
|
|
47
|
-
"eslint-import-resolver-webpack": "^0.13.
|
|
46
|
+
"eslint-import-resolver-webpack": "^0.13.4",
|
|
48
47
|
"eslint-plugin-import": "^2.22.1",
|
|
49
48
|
"eslint-plugin-jsx-a11y": "^6.4.1",
|
|
50
49
|
"eslint-plugin-react": "^7.21.5",
|
|
@@ -52,13 +51,12 @@
|
|
|
52
51
|
"execa": "^4.0.0",
|
|
53
52
|
"react": "^16.12.0",
|
|
54
53
|
"react-dom": "^16.12.0",
|
|
55
|
-
"style-loader": "^0.23.1",
|
|
56
54
|
"styled-components": "^5.3.10",
|
|
57
55
|
"stylelint": "^13.0.0",
|
|
58
|
-
"webpack": "^
|
|
59
|
-
"webpack-cli": "^
|
|
60
|
-
"webpack-dev-server": "^4.
|
|
61
|
-
"webpack-merge": "^
|
|
56
|
+
"webpack": "^5.88.2",
|
|
57
|
+
"webpack-cli": "^5.1.4",
|
|
58
|
+
"webpack-dev-server": "^4.15.1",
|
|
59
|
+
"webpack-merge": "^5.9.0"
|
|
62
60
|
},
|
|
63
61
|
"peerDependencies": {
|
|
64
62
|
"react": "^16.8",
|