@splunk/react-ui 4.12.1 → 4.14.0

package/Modal.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 114);
+/******/ 	return __webpack_require__(__webpack_require__.s = 119);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -101,14 +101,14 @@ module.exports = require("prop-types");
 
 /***/ }),
 
-/***/ 10:
+/***/ 11:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/ui-utils/id");
 
 /***/ }),
 
-/***/ 114:
+/***/ 119:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -133,17 +133,17 @@ var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_pr
 var external_lodash_ = __webpack_require__(4);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/ModalLayer"
-var ModalLayer_ = __webpack_require__(77);
+var ModalLayer_ = __webpack_require__(79);
 var ModalLayer_default = /*#__PURE__*/__webpack_require__.n(ModalLayer_);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/focus"
-var focus_ = __webpack_require__(26);
+var focus_ = __webpack_require__(28);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/id"
-var id_ = __webpack_require__(10);
+var id_ = __webpack_require__(11);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/ScrollContainerContext"
-var ScrollContainerContext_ = __webpack_require__(37);
+var ScrollContainerContext_ = __webpack_require__(39);
 
 // EXTERNAL MODULE: external "styled-components"
 var external_styled_components_ = __webpack_require__(3);
@@ -231,6 +231,10 @@ function Body(_ref) {
 
 Body.propTypes = propTypes;
 /* harmony default export */ var Modal_Body = (Body);
+// EXTERNAL MODULE: external "@splunk/react-ui/Divider"
+var Divider_ = __webpack_require__(83);
+var Divider_default = /*#__PURE__*/__webpack_require__.n(Divider_);
+
 // CONCATENATED MODULE: ./src/Modal/FooterStyles.ts
 
 
@@ -238,17 +242,21 @@ Body.propTypes = propTypes;
 var FooterStyles_StyledBox = external_styled_components_default()(Box_default.a).withConfig({
   displayName: "FooterStyles__StyledBox",
   componentId: "yszcmv-0"
-})(["flex:0 0 auto;text-align:right;padding:", ";", " & > button{min-width:80px;}"], Object(themes_["pick"])({
+})(["flex:0 0 auto;text-align:right;padding:", ";background-color:", ";& > button{min-width:80px;}"], Object(themes_["pick"])({
   enterprise: themes_["variables"].spacing,
   prisma: {
     comfortable: '24px',
     compact: '18px 24px'
   }
 }), Object(themes_["pick"])({
-  enterprise: Object(external_styled_components_["css"])(["background-color:", ";border-top:1px solid ", ";"], themes_["variables"].backgroundColor, themes_["variables"].borderColor),
-  prisma: Object(external_styled_components_["css"])(["background-color:", ";"], themes_["variables"].backgroundColorDialog)
+  enterprise: themes_["variables"].backgroundColor,
+  prisma: themes_["variables"].backgroundColorDialog
 }));
 
+// CONCATENATED MODULE: ./src/Modal/ModalContext.tsx
+
+var ModalContext = /*#__PURE__*/Object(external_react_["createContext"])({});
+/* harmony default export */ var Modal_ModalContext = (ModalContext);
 // CONCATENATED MODULE: ./src/Modal/Footer.tsx
 function Footer_extends() { Footer_extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return Footer_extends.apply(this, arguments); }
 
@@ -259,6 +267,8 @@ function Footer_objectWithoutPropertiesLoose(source, excluded) { if (source == n
 
 
 
+
+
 var Footer_propTypes = {
   children: external_prop_types_default.a.node
 };
@@ -271,15 +281,21 @@ function Footer(_ref) {
       otherProps = Footer_objectWithoutProperties(_ref, ["children"]);
 
   // @docs-props-type FooterPropsBase
-  return /*#__PURE__*/external_react_default.a.createElement(FooterStyles_StyledBox, Footer_extends({
+  var _useContext = Object(external_react_["useContext"])(Modal_ModalContext),
+      dividerContext = _useContext.divider;
+
+  var hasDivider = dividerContext === 'both' || dividerContext === 'footer';
+  return /*#__PURE__*/external_react_default.a.createElement(external_react_default.a.Fragment, null, hasDivider && /*#__PURE__*/external_react_default.a.createElement(Divider_default.a, {
+    "aria-hidden": true
+  }), /*#__PURE__*/external_react_default.a.createElement(FooterStyles_StyledBox, Footer_extends({
     "data-test": "footer"
-  }, otherProps), children);
+  }, otherProps), children));
 }
 
 Footer.propTypes = Footer_propTypes;
 /* harmony default export */ var Modal_Footer = (Footer);
 // EXTERNAL MODULE: external "@splunk/react-ui/CloseButton"
-var CloseButton_ = __webpack_require__(67);
+var CloseButton_ = __webpack_require__(69);
 var CloseButton_default = /*#__PURE__*/__webpack_require__.n(CloseButton_);
 
 // CONCATENATED MODULE: ./src/Modal/HeaderStyles.ts
@@ -289,9 +305,7 @@ var CloseButton_default = /*#__PURE__*/__webpack_require__.n(CloseButton_);
 var HeaderStyles_StyledBox = external_styled_components_default()(Box_default.a).withConfig({
   displayName: "HeaderStyles__StyledBox",
   componentId: "sc-1y722ut-0"
-})(["flex:0 0 auto;display:flex;", " position:relative;min-height:", ";background-color:", ";padding:", ";align-items:center;padding-right:", ";"], Object(themes_["pick"])({
-  enterprise: Object(external_styled_components_["css"])(["border-bottom:1px solid ", ";"], themes_["variables"].borderColor)
-}), Object(themes_["pick"])({
+})(["", ";flex:0 0 auto;position:relative;min-height:", ";background-color:", ";padding:", ";align-items:center;padding-right:", ";"], themes_["mixins"].reset('flex'), Object(themes_["pick"])({
   enterprise: '30px',
   prisma: {
     comfortable: '60px',
@@ -323,7 +337,7 @@ var StyledTitleWrapper = external_styled_components_default.a.div.withConfig({
 var StyledIcon = external_styled_components_default.a.div.withConfig({
   displayName: "HeaderStyles__StyledIcon",
   componentId: "sc-1y722ut-2"
-})(["display:inline-flex;align-items:center;justify-content:center;margin-right:", ";", " width:", ";height:", ";flex-shrink:0;"], themes_["variables"].spacingLarge, Object(themes_["pick"])({
+})(["", ";align-items:center;justify-content:center;margin-right:", ";", " width:", ";height:", ";flex-shrink:0;"], themes_["mixins"].reset('inline-flex'), themes_["variables"].spacingLarge, Object(themes_["pick"])({
   prisma: Object(external_styled_components_["css"])(["background-color:", ";"], themes_["variables"].transparent)
 }), Object(themes_["pick"])({
   comfortable: '40px',
@@ -372,10 +386,6 @@ var StyledClose = external_styled_components_default.a.div.withConfig({
   componentId: "sc-1y722ut-6"
 })(["", ";position:absolute;right:0;top:0;transform:rotate(90deg) translate(-50%,-50%);"], themes_["mixins"].reset('block'));
 
-// CONCATENATED MODULE: ./src/Modal/ModalContext.tsx
-
-var ModalContext = /*#__PURE__*/Object(external_react_["createContext"])({});
-/* harmony default export */ var Modal_ModalContext = (ModalContext);
 // CONCATENATED MODULE: ./src/Modal/Header.tsx
 function Header_extends() { Header_extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return Header_extends.apply(this, arguments); }
 
@@ -388,6 +398,7 @@ function Header_objectWithoutPropertiesLoose(source, excluded) { if (source == n
 
 
 
+
 var Header_propTypes = {
   children: external_prop_types_default.a.node,
   icon: external_prop_types_default.a.node,
@@ -409,9 +420,11 @@ function Header(_ref) {
 
   // @docs-props-type StepPropsBase
   var _useContext = Object(external_react_["useContext"])(Modal_ModalContext),
-      titleIdContext = _useContext.titleId;
+      titleIdContext = _useContext.titleId,
+      dividerContext = _useContext.divider;
 
-  return /*#__PURE__*/external_react_default.a.createElement(HeaderStyles_StyledBox, Header_extends({
+  var hasDivider = dividerContext === 'both' || dividerContext === 'header';
+  return /*#__PURE__*/external_react_default.a.createElement(external_react_default.a.Fragment, null, /*#__PURE__*/external_react_default.a.createElement(HeaderStyles_StyledBox, Header_extends({
     $close: !!onRequestClose,
     "data-test": "header"
   }, otherProps), icon && /*#__PURE__*/external_react_default.a.createElement(StyledIcon, null, icon), title ? /*#__PURE__*/external_react_default.a.createElement(StyledTitleWrapper, null, title && /*#__PURE__*/external_react_default.a.createElement(StyledTitle, {
@@ -422,13 +435,15 @@ function Header(_ref) {
   }, subtitle)) : children, onRequestClose && /*#__PURE__*/external_react_default.a.createElement(StyledButtonsWrapper, null, onRequestClose && /*#__PURE__*/external_react_default.a.createElement(StyledClose, null, /*#__PURE__*/external_react_default.a.createElement(CloseButton_default.a, {
     onClick: onRequestClose,
     "data-test": "close"
-  }))));
+  })))), hasDivider && /*#__PURE__*/external_react_default.a.createElement(Divider_default.a, {
+    "aria-hidden": true
+  }));
 }
 
 Header.propTypes = Header_propTypes;
 /* harmony default export */ var Modal_Header = (Header);
 // EXTERNAL MODULE: external "react-spring"
-var external_react_spring_ = __webpack_require__(18);
+var external_react_spring_ = __webpack_require__(21);
 
 // CONCATENATED MODULE: ./src/Modal/ModalStyles.ts
 
@@ -502,11 +517,13 @@ var Modal_propTypes = {
   children: external_prop_types_default.a.node,
   initialFocus: external_prop_types_default.a.oneOfType([external_prop_types_default.a.object, external_prop_types_default.a.oneOf(['first', 'container'])]),
   onRequestClose: external_prop_types_default.a.func,
-  open: external_prop_types_default.a.bool
+  open: external_prop_types_default.a.bool,
+  divider: external_prop_types_default.a.oneOf(['header', 'footer', 'both', 'none'])
 };
 var defaultProps = {
   initialFocus: 'first',
-  open: false
+  open: false,
+  divider: 'both'
 };
 
 var Modal_Modal = /*#__PURE__*/function (_Component) {
@@ -609,7 +626,8 @@ var Modal_Modal = /*#__PURE__*/function (_Component) {
     _defineProperty(_assertThisInitialized(_this), "renderModal", function (interpolatedStyle) {
       var _this$props3 = _this.props,
           style = _this$props3.style,
-          children = _this$props3.children;
+          children = _this$props3.children,
+          divider = _this$props3.divider;
       var top = interpolatedStyle.top,
           opacity = interpolatedStyle.opacity;
       var clonedChildren = external_react_["Children"].toArray(children).filter(external_react_["isValidElement"]);
@@ -627,7 +645,8 @@ var Modal_Modal = /*#__PURE__*/function (_Component) {
         "aria-labelledby": _this.headerTitleId
       }, Object(external_lodash_["omit"])(_this.props, [].concat(_toConsumableArray(Object(external_lodash_["keys"])(Modal.propTypes)), ['style']))), /*#__PURE__*/external_react_default.a.createElement(Modal_ModalContext.Provider, {
         value: {
-          titleId: _this.headerTitleId
+          titleId: _this.headerTitleId,
+          divider: divider
         }
       }, clonedChildren));
     });
@@ -688,21 +707,21 @@ _defineProperty(Modal_Modal, "Footer", Modal_Footer);
 
 /***/ }),
 
-/***/ 18:
+/***/ 2:
 /***/ (function(module, exports) {
 
-module.exports = require("react-spring");
+module.exports = require("react");
 
 /***/ }),
 
-/***/ 2:
+/***/ 21:
 /***/ (function(module, exports) {
 
-module.exports = require("react");
+module.exports = require("react-spring");
 
 /***/ }),
 
-/***/ 26:
+/***/ 28:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/ui-utils/focus");
@@ -716,7 +735,7 @@ module.exports = require("styled-components");
 
 /***/ }),
 
-/***/ 37:
+/***/ 39:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/ScrollContainerContext");
@@ -730,14 +749,14 @@ module.exports = require("lodash");
 
 /***/ }),
 
-/***/ 67:
+/***/ 69:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/CloseButton");
 
 /***/ }),
 
-/***/ 77:
+/***/ 79:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/ModalLayer");
@@ -749,6 +768,13 @@ module.exports = require("@splunk/react-ui/ModalLayer");
 
 module.exports = require("@splunk/react-ui/Box");
 
+/***/ }),
+
+/***/ 83:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/react-ui/Divider");
+
 /***/ })
 
 /******/ });

package/ModalLayer.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 161);
+/******/ 	return __webpack_require__(__webpack_require__.s = 168);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -101,7 +101,7 @@ module.exports = require("prop-types");
 
 /***/ }),
 
-/***/ 161:
+/***/ 168:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -120,10 +120,10 @@ var external_prop_types_ = __webpack_require__(1);
 var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Animation"
-var Animation_ = __webpack_require__(31);
+var Animation_ = __webpack_require__(34);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Layer"
-var Layer_ = __webpack_require__(57);
+var Layer_ = __webpack_require__(60);
 var Layer_default = /*#__PURE__*/__webpack_require__.n(Layer_);
 
 // EXTERNAL MODULE: external "styled-components"
@@ -131,7 +131,7 @@ var external_styled_components_ = __webpack_require__(3);
 var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
 
 // EXTERNAL MODULE: external "react-spring"
-var external_react_spring_ = __webpack_require__(18);
+var external_react_spring_ = __webpack_require__(21);
 
 // EXTERNAL MODULE: external "@splunk/themes"
 var themes_ = __webpack_require__(0);
@@ -310,17 +310,17 @@ _defineProperty(ModalLayer_ModalLayer, "getDerivedStateFromProps", function (pro
 
 /***/ }),
 
-/***/ 18:
+/***/ 2:
 /***/ (function(module, exports) {
 
-module.exports = require("react-spring");
+module.exports = require("react");
 
 /***/ }),
 
-/***/ 2:
+/***/ 21:
 /***/ (function(module, exports) {
 
-module.exports = require("react");
+module.exports = require("react-spring");
 
 /***/ }),
 
@@ -331,14 +331,14 @@ module.exports = require("styled-components");
 
 /***/ }),
 
-/***/ 31:
+/***/ 34:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/Animation");
 
 /***/ }),
 
-/***/ 57:
+/***/ 60:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/Layer");

package/Monogram.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 162);
+/******/ 	return __webpack_require__(__webpack_require__.s = 169);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -108,7 +108,7 @@ module.exports = require("@splunk/react-ui/Clickable");
 
 /***/ }),
 
-/***/ 162:
+/***/ 169:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";