@micromag/core 0.3.17 → 0.3.20

package/assets/css/styles.css

@@ -5,7 +5,6 @@
 
 .micromag-core-menus-breadcrumb-container .micromag-core-menus-breadcrumb-arrow+.micromag-core-menus-breadcrumb-arrow:before{content:">"}
 
-
 .micromag-core-menus-tabs-container{display:inline-block;position:relative}
 .micromag-core-modals-container{position:static}.micromag-core-modals-modals.micromag-core-modals-hasModals{position:fixed;z-index:1000;top:0;right:0;bottom:0;left:0;background-color:rgba(28,28,28,.2)}
 .micromag-core-modals-modal-container{position:absolute;top:0;left:0;width:100%;height:100%;display:-webkit-flex;display:-ms-flexbox;display:flex;overflow-y:auto}.micromag-core-modals-modal-container.micromag-core-modals-modal-center>.micromag-core-modals-modal-inner{margin:auto}.micromag-core-modals-modal-container.micromag-core-modals-modal-top>.micromag-core-modals-modal-inner{margin:0 auto;padding:1.75rem 0}

package/es/components.js

@@ -1011,7 +1011,7 @@ var Breadcrumb = function Breadcrumb(_ref) {
 Breadcrumb.propTypes = propTypes$A;
 Breadcrumb.defaultProps = defaultProps$A;
 
-var _excluded$3 = ["id", "type", "className", "label", "children", "onClick", "active"];
+var _excluded$3 = ["type", "className", "label", "children", "onClick", "active"];
 var propTypes$z = {
   items: PropTypes.menuItems,
   children: PropTypes$1.node,
@@ -1045,20 +1045,36 @@ var Dropdown = function Dropdown(_ref) {
       onClickItem = _ref.onClickItem,
       onClickOutside = _ref.onClickOutside;
   var refContainer = useRef(null);
+
+  var _useState = useState(visible),
+      _useState2 = _slicedToArray(_useState, 2),
+      enabled = _useState2[0],
+      setEnabled = _useState2[1];
+
   var onDocumentClick = useCallback(function (e) {
     if (refContainer.current && !refContainer.current.contains(e.currentTarget) && onClickOutside !== null) {
       onClickOutside(e);
     }
   }, [refContainer.current, onClickOutside]);
-  useDocumentEvent('click', onDocumentClick, visible);
+  useDocumentEvent('click', onDocumentClick, enabled); // Delay the outside click detection
+
+  useEffect(function () {
+    var id = setTimeout(function () {
+      setEnabled(visible);
+    }, 100);
+    return function () {
+      clearTimeout(id);
+    };
+  }, [visible, setEnabled]);
+  console.log('visible', visible); // eslint-disable-line
+
   return /*#__PURE__*/React.createElement("div", {
     className: classNames(['dropdown-menu', (_ref2 = {}, _defineProperty(_ref2, "dropdown-menu-".concat(align), align !== null), _defineProperty(_ref2, "show", visible), _defineProperty(_ref2, className, className !== null), _ref2)]),
     ref: refContainer
   }, children !== null ? children : items.map(function (it, index) {
     var _ref3;
 
-    it.id;
-        var _it$type = it.type,
+    var _it$type = it.type,
         type = _it$type === void 0 ? 'link' : _it$type,
         _it$className = it.className,
         customClassName = _it$className === void 0 ? null : _it$className,
@@ -3495,7 +3511,11 @@ var Screen = function Screen(_ref) {
       onEnableInteraction = _ref.onEnableInteraction,
       onDisableInteraction = _ref.onDisableInteraction,
       getMediaRef = _ref.getMediaRef;
-  var type = screen.type;
+
+  var _ref2 = screen || {},
+      _ref2$type = _ref2.type,
+      type = _ref2$type === void 0 ? null : _ref2$type;
+
   var CustomScreenComponent = components !== null ? getComponentFromName(type, components) || null : null;
   var ContextScreenComponent = useScreenComponent(type);
   var ScreenComponent = CustomScreenComponent || ContextScreenComponent;

package/lib/components.js

@@ -1034,7 +1034,7 @@ var Breadcrumb = function Breadcrumb(_ref) {
 Breadcrumb.propTypes = propTypes$A;
 Breadcrumb.defaultProps = defaultProps$A;
 
-var _excluded$3 = ["id", "type", "className", "label", "children", "onClick", "active"];
+var _excluded$3 = ["type", "className", "label", "children", "onClick", "active"];
 var propTypes$z = {
   items: core.PropTypes.menuItems,
   children: PropTypes__default["default"].node,
@@ -1068,20 +1068,36 @@ var Dropdown = function Dropdown(_ref) {
       onClickItem = _ref.onClickItem,
       onClickOutside = _ref.onClickOutside;
   var refContainer = React.useRef(null);
+
+  var _useState = React.useState(visible),
+      _useState2 = _slicedToArray__default["default"](_useState, 2),
+      enabled = _useState2[0],
+      setEnabled = _useState2[1];
+
   var onDocumentClick = React.useCallback(function (e) {
     if (refContainer.current && !refContainer.current.contains(e.currentTarget) && onClickOutside !== null) {
       onClickOutside(e);
     }
   }, [refContainer.current, onClickOutside]);
-  hooks.useDocumentEvent('click', onDocumentClick, visible);
+  hooks.useDocumentEvent('click', onDocumentClick, enabled); // Delay the outside click detection
+
+  React.useEffect(function () {
+    var id = setTimeout(function () {
+      setEnabled(visible);
+    }, 100);
+    return function () {
+      clearTimeout(id);
+    };
+  }, [visible, setEnabled]);
+  console.log('visible', visible); // eslint-disable-line
+
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classNames__default["default"](['dropdown-menu', (_ref2 = {}, _defineProperty__default["default"](_ref2, "dropdown-menu-".concat(align), align !== null), _defineProperty__default["default"](_ref2, "show", visible), _defineProperty__default["default"](_ref2, className, className !== null), _ref2)]),
     ref: refContainer
   }, children !== null ? children : items.map(function (it, index) {
     var _ref3;
 
-    it.id;
-        var _it$type = it.type,
+    var _it$type = it.type,
         type = _it$type === void 0 ? 'link' : _it$type,
         _it$className = it.className,
         customClassName = _it$className === void 0 ? null : _it$className,
@@ -3518,7 +3534,11 @@ var Screen = function Screen(_ref) {
       onEnableInteraction = _ref.onEnableInteraction,
       onDisableInteraction = _ref.onDisableInteraction,
       getMediaRef = _ref.getMediaRef;
-  var type = screen.type;
+
+  var _ref2 = screen || {},
+      _ref2$type = _ref2.type,
+      type = _ref2$type === void 0 ? null : _ref2$type;
+
   var CustomScreenComponent = components !== null ? utils.getComponentFromName(type, components) || null : null;
   var ContextScreenComponent = contexts.useScreenComponent(type);
   var ScreenComponent = CustomScreenComponent || ContextScreenComponent;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/core",
-    "version": "0.3.17",
+    "version": "0.3.20",
     "description": "",
     "keywords": [
         "javascript"
@@ -132,5 +132,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "7cde59c640f44a8cf78de6c62e6396e9bbf5119d"
+    "gitHead": "b7cde2045021ba116088cada89ff492e95634fee"
 }