@luminati-io/uikit 3.0.13 → 3.0.14

package/dist/umd/uikit.development.js

@@ -26402,7 +26402,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! prop-types */ "prop-types");
 /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_2__);
-/* harmony import */ var _box__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./box */ "./src/layout/box.js");
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
+/* harmony import */ var _box__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./box */ "./src/layout/box.js");
 // LICENSE_CODE ZON
 
 
@@ -26415,6 +26416,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 
 
+
 var Flex = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().forwardRef(function (props, ref) {
   var inline = props.inline,
     align_items = props.align_items,
@@ -26457,7 +26459,7 @@ Flex.propTypes = {
   row_gap: (prop_types__WEBPACK_IMPORTED_MODULE_2___default().string),
   column_gap: (prop_types__WEBPACK_IMPORTED_MODULE_2___default().string)
 };
-var StyledFlex = styled_components__WEBPACK_IMPORTED_MODULE_1___default()(_box__WEBPACK_IMPORTED_MODULE_3__["default"]).withConfig({
+var StyledFlex = styled_components__WEBPACK_IMPORTED_MODULE_1___default()(_box__WEBPACK_IMPORTED_MODULE_4__["default"]).withConfig({
   displayName: "StyledFlex",
   componentId: "sc-2aqm31-0"
 })(["display:", ";align-items:", ";align-content:", ";justify-items:", ";justify-content:", ";flex-wrap:", ";flex-direction:", ";gap:", ";row-gap:", ";column-gap:", ";"], function (props) {
@@ -26474,13 +26476,7 @@ var StyledFlex = styled_components__WEBPACK_IMPORTED_MODULE_1___default()(_box__
   return props.$flexWrap;
 }, function (props) {
   return props.$flexDirection;
-}, function (props) {
-  return props.$gap;
-}, function (props) {
-  return props.$rowGap;
-}, function (props) {
-  return props.$columnGap;
-});
+}, (0,_utils__WEBPACK_IMPORTED_MODULE_3__.fromTheme)('gap'), (0,_utils__WEBPACK_IMPORTED_MODULE_3__.fromTheme)('rowGap'), (0,_utils__WEBPACK_IMPORTED_MODULE_3__.fromTheme)('columnGap'));
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Flex);
 
 /***/ }),
@@ -27469,12 +27465,14 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _layout__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../layout */ "./src/layout/index.js");
 /* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../theme */ "./src/theme.js");
 /* harmony import */ var _hoc__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../hoc */ "./src/hoc/index.js");
-/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../constants */ "./src/constants.js");
+/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../hooks */ "./src/hooks/index.js");
+/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../constants */ "./src/constants.js");
 // LICENSE_CODE ZON
 
 
 /*jslint react:true*/
-var _excluded = ["show", "zIndex"];
+var _excluded = ["show", "zIndex", "onOutsideClick"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 _extends.apply(this, arguments); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
@@ -27489,13 +27487,15 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 
 
+
 var withBackdrop = function withBackdrop(Comp) {
   var WithBackdrop = function WithBackdrop(props) {
-    // XXX davidg: support close on outside-click
     var show = props.show,
       _props$zIndex = props.zIndex,
-      zIndex = _props$zIndex === void 0 ? _constants__WEBPACK_IMPORTED_MODULE_5__.Z_INDEX.backdrop : _props$zIndex,
+      zIndex = _props$zIndex === void 0 ? _constants__WEBPACK_IMPORTED_MODULE_6__.Z_INDEX.backdrop : _props$zIndex,
+      onOutsideClick = props.onOutsideClick,
       restProps = _objectWithoutProperties(props, _excluded);
+    var popperElement = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
     var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false),
       _useState2 = _slicedToArray(_useState, 2),
       visible = _useState2[0],
@@ -27523,6 +27523,13 @@ var withBackdrop = function withBackdrop(Comp) {
         return clearTimeout(tid);
       };
     }, [show]);
+    var hideAndStopEvt = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function (evt) {
+      if (!visible) return;
+      evt.stopPropagation();
+      evt.preventDefault();
+      if (onOutsideClick) onOutsideClick();
+    }, [visible, onOutsideClick]);
+    (0,_hooks__WEBPACK_IMPORTED_MODULE_5__.useOutsideClick)(popperElement.current, hideAndStopEvt);
     if (!mount) return null;
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(PopupContainer, {
       zIndex: zIndex
@@ -27531,7 +27538,9 @@ var withBackdrop = function withBackdrop(Comp) {
     }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(CompContainer, {
       show: visible,
       zIndex: zIndex + 1
-    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Comp, restProps)));
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Comp, _extends({
+      ref: popperElement
+    }, restProps))));
   };
   WithBackdrop.displayName = "WithBackdrop(".concat((0,_hoc__WEBPACK_IMPORTED_MODULE_4__.getDisplayName)(Comp), ")");
   return WithBackdrop;
@@ -27924,7 +27933,7 @@ var TabContainer = styled_components__WEBPACK_IMPORTED_MODULE_2___default().butt
     return (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.css)(["width:200px;height:40px;padding:0 12px;justify-content:space-between;gap:4px;border-radius:0 4px 4px 0;border-left:1px solid transparent;color:", ";&[aria-selected=true]{color:", ";background:", ";border-left-color:", ";}&:hover{color:", ";border-left-color:", ";}&[aria-disabled=true]{color:", ";background:0 none;border-left-color:transparent;}"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_11_50, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_11_50, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.blue_3, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.blue_11, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_11_50, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_8, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_9);
   }
   // main
-  return (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.css)(["width:fit-content;height:36px;padding:0;justify-content:center;gap:4px;color:", ";box-shadow:0px -2px 0px 0px ", " inset;&[aria-selected=true]{color:", ";box-shadow:0px -2px 0px 0px ", " inset;}&:hover{color:", ";box-shadow:0px -1px 0px 0px ", " inset;}&[aria-disabled=true]{color:", ";box-shadow:0px -1px 0px 0px ", " inset;}"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.blue_11, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.blue_11, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_11_50, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_8, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_11_50, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_6, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_9, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_6);
+  return (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.css)(["width:fit-content;height:36px;padding:0;justify-content:center;gap:4px;color:", ";box-shadow:0px -1px 0px 0px ", " inset;&[aria-selected=true]{color:", ";box-shadow:0px -2px 0px 0px ", " inset;}&:hover{color:", ";box-shadow:0px -2px 0px 0px ", " inset;}&[aria-disabled=true]{color:", ";box-shadow:0px -1px 0px 0px ", " inset;}"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_11_50, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_6, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.blue_11, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.blue_11, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_11_50, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_8, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_9, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_6);
 });
 var Left = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "Left",
@@ -31607,8 +31616,10 @@ function fromTheme(propName, defaultValue) {
     var _ref, _props$propName;
     var value = (_ref = (_props$propName = props[propName]) !== null && _props$propName !== void 0 ? _props$propName : props["$".concat(propName)]) !== null && _ref !== void 0 ? _ref : defaultValue;
     if (value != null) {
-      var _theme$spacing$value;
-      if (propName.indexOf('padding') == 0 || propName.indexOf('margin') == 0) return (_theme$spacing$value = _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing[value]) !== null && _theme$spacing$value !== void 0 ? _theme$spacing$value : value;
+      if (propName.indexOf('padding') == 0 || propName.indexOf('margin') == 0 || ['gap', 'rowGap', 'columnGap'].includes(propName)) {
+        var _theme$spacing$value;
+        return (_theme$spacing$value = _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing[value]) !== null && _theme$spacing$value !== void 0 ? _theme$spacing$value : value;
+      }
       if (['font_family', 'font_weight', 'font_size', 'line_height', 'letter_spacing', 'color', 'box_shadow'].includes(propName)) {
         return _theme__WEBPACK_IMPORTED_MODULE_3__["default"][propName][value];
       }