@splunk/react-page 5.0.0 → 5.2.1

package/CHANGELOG.md

@@ -1,6 +1,29 @@
 Change Log
 ============
 
+5.2.1 - April 5, 2022
+----------
+API Changes:
+* Pinned `styled-components@5.1.1` to avoid breaking changes introduced in `styled-components@5.2.0`.
+
+  **`@splunk/react-page` is incompatible with styled-components version(s) `^5.2.0`**.
+
+  `styled-components@5.2.0` changed how selectors like `& + &` are compiled; [styled-components PR#3236](https://github.com/styled-components/styled-components/pull/3236).
+  This breaks styles that worked in previous versions of styled-components; [styled-components issue #3265](https://github.com/styled-components/styled-components/issues/3265).
+  
+  **Until noted otherwise in a future release of `@splunk/react-page` do not use `styled-components@^5.2.0` with` @splunk/react-page`**.
+
+5.2.0 - February 23, 2022
+----------
+Notes:
+* Remove IE browser testing from functional tests.
+
+5.1.0 - September 8, 2021
+----------
+New Features:
+* The loading screen now inherits the Splunk Enterprise theme. If one is not provided, it can be set with `loadingThemeOverride`.
+
+
 5.0.0 - February 4, 2021
 ----------
 API Changes:

package/lib/index.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 10);
+/******/ 	return __webpack_require__(__webpack_require__.s = 12);
 /******/ })
 /************************************************************************/
 /******/ ([
@@ -95,58 +95,70 @@ module.exports = require("react");
 /* 1 */
 /***/ (function(module, exports) {
 
-module.exports = require("styled-components");
+module.exports = require("@splunk/themes");
 
 /***/ }),
 /* 2 */
 /***/ (function(module, exports) {
 
-module.exports = require("react-dom");
+module.exports = require("styled-components");
 
 /***/ }),
 /* 3 */
 /***/ (function(module, exports) {
 
-module.exports = require("prop-types");
+module.exports = require("react-dom");
 
 /***/ }),
 /* 4 */
 /***/ (function(module, exports) {
 
-module.exports = require("scriptjs");
+module.exports = require("prop-types");
 
 /***/ }),
 /* 5 */
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/Layer");
+module.exports = require("@splunk/splunk-utils/themes");
 
 /***/ }),
 /* 6 */
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/splunk-utils/url");
+module.exports = require("scriptjs");
 
 /***/ }),
 /* 7 */
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/ScreenReaderContent");
+module.exports = require("@splunk/react-ui/Layer");
 
 /***/ }),
 /* 8 */
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/ui-utils/i18n");
+module.exports = require("@splunk/splunk-utils/url");
 
 /***/ }),
 /* 9 */
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/themes/getTheme");
+module.exports = require("@splunk/themes/SplunkThemeProvider");
 
 /***/ }),
 /* 10 */
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/react-ui/ScreenReaderContent");
+
+/***/ }),
+/* 11 */
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/ui-utils/i18n");
+
+/***/ }),
+/* 12 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -158,36 +170,42 @@ var external_react_ = __webpack_require__(0);
 var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
 
 // EXTERNAL MODULE: external "react-dom"
-var external_react_dom_ = __webpack_require__(2);
+var external_react_dom_ = __webpack_require__(3);
 
 // EXTERNAL MODULE: external "scriptjs"
-var external_scriptjs_ = __webpack_require__(4);
+var external_scriptjs_ = __webpack_require__(6);
 var external_scriptjs_default = /*#__PURE__*/__webpack_require__.n(external_scriptjs_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Layer"
-var Layer_ = __webpack_require__(5);
+var Layer_ = __webpack_require__(7);
 
 // EXTERNAL MODULE: external "@splunk/splunk-utils/url"
-var url_ = __webpack_require__(6);
+var url_ = __webpack_require__(8);
+
+// EXTERNAL MODULE: external "@splunk/themes/SplunkThemeProvider"
+var SplunkThemeProvider_ = __webpack_require__(9);
+var SplunkThemeProvider_default = /*#__PURE__*/__webpack_require__.n(SplunkThemeProvider_);
+
+// EXTERNAL MODULE: external "@splunk/splunk-utils/themes"
+var themes_ = __webpack_require__(5);
 
 // EXTERNAL MODULE: external "prop-types"
-var external_prop_types_ = __webpack_require__(3);
+var external_prop_types_ = __webpack_require__(4);
 var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/ScreenReaderContent"
-var ScreenReaderContent_ = __webpack_require__(7);
+var ScreenReaderContent_ = __webpack_require__(10);
 var ScreenReaderContent_default = /*#__PURE__*/__webpack_require__.n(ScreenReaderContent_);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/i18n"
-var i18n_ = __webpack_require__(8);
+var i18n_ = __webpack_require__(11);
 
 // EXTERNAL MODULE: external "styled-components"
-var external_styled_components_ = __webpack_require__(1);
+var external_styled_components_ = __webpack_require__(2);
 var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
 
-// EXTERNAL MODULE: external "@splunk/themes/getTheme"
-var getTheme_ = __webpack_require__(9);
-var getTheme_default = /*#__PURE__*/__webpack_require__.n(getTheme_);
+// EXTERNAL MODULE: external "@splunk/themes"
+var external_splunk_themes_ = __webpack_require__(1);
 
 // CONCATENATED MODULE: ./src/LoadingStyles.js
 function _templateObject6() {
@@ -254,16 +272,21 @@ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(
 
 
 
-var theme = getTheme_default()({
-  family: 'enterprise',
-  colorScheme: 'light'
-});
 var blink = Object(external_styled_components_["keyframes"])(_templateObject());
-var Main = external_styled_components_default.a.div(_templateObject2(), theme.gray96);
-var SplunkBar = external_styled_components_default.a.div(_templateObject3(), theme.gray20);
-var AppBar = external_styled_components_default.a.div(_templateObject4(), theme.gray30);
-var AppBody = external_styled_components_default.a.div(_templateObject5(), theme.gray20);
-var Dot = external_styled_components_default.a.div(_templateObject6(), blink, theme.gray60, theme.spacingHalf);
+var Main = external_styled_components_default.a.div(_templateObject2(), external_splunk_themes_["variables"].backgroundColorPage);
+var SplunkBar = external_styled_components_default.a.div(_templateObject3(), Object(external_splunk_themes_["pick"])({
+  prisma: external_splunk_themes_["variables"].backgroundColorSection,
+  enterprise: external_splunk_themes_["variables"].gray20
+}));
+var AppBar = external_styled_components_default.a.div(_templateObject4(), Object(external_splunk_themes_["pick"])({
+  prisma: external_splunk_themes_["variables"].backgroundColorPopup,
+  enterprise: external_splunk_themes_["variables"].gray30
+}));
+var AppBody = external_styled_components_default.a.div(_templateObject5(), external_splunk_themes_["variables"].contentColorInverted);
+var Dot = external_styled_components_default.a.div(_templateObject6(), blink, external_splunk_themes_["variables"].neutral500, Object(external_splunk_themes_["pick"])({
+  prisma: external_splunk_themes_["variables"].spacingMedium,
+  enterprise: external_splunk_themes_["variables"].spacingHalf
+}));
 
 // CONCATENATED MODULE: ./src/Loading.jsx
 
@@ -303,6 +326,8 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 
 
+
+
 /**
  * Loads the layout from the server, using requirejs if available on the window and scriptjs if not.
  *
@@ -337,6 +362,8 @@ function getLayoutApi(callback) {
  * @param {Boolean} [options.hideSplunkBar = false] - Hides the Splunk bar.
  * @param {string} [options.layout = 'scrolling'] - Set to `fixed` to fix all navigation bars
  * to the edge of the page.
+ * @param {string} [options.loadingThemeOverride] - Allows the theme provided by Splunk Enterprise to the loading screen
+ * to be overridden with `enterprise` or `enterpriseDark`.
  * @param {Boolean} [options.useGlobalLayerStack = true] - Wraps elements in @splunk/react-ui's LayerStackGlobalProvider.
  */
 
@@ -346,17 +373,19 @@ function layout(element) {
 
   var _ref$useGlobalLayerSt = _ref.useGlobalLayerStack,
       useGlobalLayerStack = _ref$useGlobalLayerSt === void 0 ? true : _ref$useGlobalLayerSt,
+      loadingThemeOverride = _ref.loadingThemeOverride,
       pageTitle = _ref.pageTitle,
-      layoutAPIOptions = _objectWithoutProperties(_ref, ["useGlobalLayerStack", "pageTitle"]);
+      layoutAPIOptions = _objectWithoutProperties(_ref, ["useGlobalLayerStack", "loadingThemeOverride", "pageTitle"]);
 
   var loadingContainer = document.createElement('div');
+  var loadingTheme = Object(themes_["getThemeOptions"])(loadingThemeOverride || Object(themes_["defaultTheme"])());
 
   if (pageTitle) {
     document.title = pageTitle;
   }
 
   document.body.appendChild(loadingContainer);
-  Object(external_react_dom_["render"])( /*#__PURE__*/external_react_default.a.createElement(src_Loading, layoutAPIOptions), loadingContainer);
+  Object(external_react_dom_["render"])( /*#__PURE__*/external_react_default.a.createElement(SplunkThemeProvider_default.a, loadingTheme, /*#__PURE__*/external_react_default.a.createElement(src_Loading, layoutAPIOptions)), loadingContainer);
   getLayoutApi(function (layoutApi) {
     var containerEl;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@splunk/react-page",
-  "version": "5.0.0",
+  "version": "5.2.1",
   "description": "Load React components into the latest layout from Splunk Enterprise",
   "main": "lib/index.js",
   "license": "Apache-2.0",
@@ -17,13 +17,15 @@
     "test:functional:prepare": "node src/tests/helpers/prepare_environment.js 8.0.3",
     "test:functional": "yarn run test:functional:prepare && splunk-wdio-functional-test-runner functional.local.conf.js",
     "test:functional:ci": "yarn run test:functional:prepare && splunk-wdio-functional-test-runner functional.ci.conf.js",
-    "test:functional:cloud": "yarn run test:functional:prepare && splunk-wdio-functional-test-runner functional.cloud.conf.js"
+    "test:functional:cloud": "yarn run test:functional:prepare && splunk-wdio-functional-test-runner functional.cloud.conf.js",
+    "test:cypress": "echo TODO: SUI-3442",
+    "test:cypress:ci": "echo TODO: SUI-3442"
   },
   "dependencies": {
-    "@splunk/react-ui": "^4.0.0",
-    "@splunk/splunk-utils": "^2.0.0",
-    "@splunk/themes": "^0.7.0",
-    "@splunk/ui-utils": "^1.2.1",
+    "@splunk/react-ui": "^4.6.0",
+    "@splunk/splunk-utils": "^2.1.0",
+    "@splunk/themes": "^0.10.1",
+    "@splunk/ui-utils": "^1.4.0",
     "prop-types": "^15.6.2",
     "scriptjs": "^2.5.8"
   },
@@ -49,7 +51,7 @@
     "react": "^16.12.0",
     "react-dom": "^16.12.0",
     "style-loader": "^0.23.1",
-    "styled-components": "^5.1.1",
+    "styled-components": "5.1.1",
     "stylelint": "^13.0.0",
     "webpack": "^4.16.2",
     "webpack-cli": "^3.1.0",
@@ -58,7 +60,7 @@
   "peerDependencies": {
     "react": "^16.8",
     "react-dom": "^16.8",
-    "styled-components": "^5.1"
+    "styled-components": "5.1.1"
   },
   "engines": {
     "node": ">=6"