@nulogy/components 8.4.2 → 8.4.3

package/dist/main.js

@@ -16948,55 +16948,30 @@
     })));
   };
 
-  var getMenuMargin = function getMenuMargin(placement, showArrow) {
-    var direction = String(placement).split("-")[0];
-
-    switch (direction) {
-      case "top":
-        return {
-          marginBottom: showArrow ? "4px" : null
-        };
-
-      case "right":
-        return {
-          marginLeft: showArrow ? "8px" : null,
-          marginTop: showArrow ? null : "-8px"
-        };
-
-      case "left":
-        return {
-          marginRight: showArrow ? "8px" : null,
-          marginTop: showArrow ? null : "-8px"
-        };
+  function _extends$1() { _extends$1 = 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 _extends$1.apply(this, arguments); }
+  var propType = PropTypes__default['default'].oneOfType([PropTypes__default['default'].number, PropTypes__default['default'].string, PropTypes__default['default'].array, PropTypes__default['default'].object]);
+  var createPropTypes = function createPropTypes(props) {
+    return props.reduce(function (acc, name) {
+      var _extends2;
 
-      case "bottom":
-      default:
-        return {
-          marginTop: showArrow ? "4px" : null
-        };
-    }
+      return _extends$1({}, acc, (_extends2 = {}, _extends2[name] = propType, _extends2));
+    }, {});
+  };
+  var propTypes = {
+    space: createPropTypes(space.propNames),
+    color: createPropTypes(color.propNames),
+    layout: createPropTypes(layout.propNames),
+    typography: createPropTypes(typography.propNames),
+    flexbox: createPropTypes(flexbox.propNames),
+    border: createPropTypes(border.propNames),
+    background: createPropTypes(background.propNames),
+    position: createPropTypes(position.propNames),
+    grid: createPropTypes(grid.propNames),
+    shadow: createPropTypes(shadow.propNames),
+    buttonStyle: createPropTypes(buttonStyle.propNames),
+    textStyle: createPropTypes(textStyle.propNames),
+    colorStyle: createPropTypes(colorStyle.propNames)
   };
-
-  var DropdownMenuContainer = styled__default['default'](Box).withConfig({
-    displayName: "DropdownMenuContainer",
-    componentId: "sc-12o3dvc-0"
-  })(color, function (_ref) {
-    var dataPlacement = _ref.dataPlacement,
-        _ref$showArrow = _ref.showArrow,
-        showArrow = _ref$showArrow === void 0 ? true : _ref$showArrow,
-        _ref$backgroundColor = _ref.backgroundColor,
-        backgroundColor = _ref$backgroundColor === void 0 ? "white" : _ref$backgroundColor,
-        theme = _ref.theme;
-    return Object.assign({
-      borderRadius: theme.radii.medium,
-      backgroundColor: theme.colors[backgroundColor],
-      borderTop: "1px solid  " + theme.colors[backgroundColor],
-      borderBottom: "1px solid " + theme.colors[backgroundColor],
-      boxShadow: theme.shadows.medium,
-      padding: "7px 0",
-      zIndex: "100"
-    }, getMenuMargin(dataPlacement, showArrow));
-  });
 
   /**!
    * @fileOverview Kickass library to create and place poppers near their reference elements.
@@ -17407,7 +17382,7 @@
     return obj;
   };
 
-  var _extends$1 = Object.assign || function (target) {
+  var _extends = Object.assign || function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
 
@@ -17429,7 +17404,7 @@
    * @returns {Object} ClientRect like output
    */
   function getClientRect(offsets) {
-    return _extends$1({}, offsets, {
+    return _extends({}, offsets, {
       right: offsets.left + offsets.width,
       bottom: offsets.top + offsets.height
     });
@@ -17717,7 +17692,7 @@
     };
 
     var sortedAreas = Object.keys(rects).map(function (key) {
-      return _extends$1({
+      return _extends({
         key: key
       }, rects[key], {
         area: getArea(rects[key])
@@ -18359,9 +18334,9 @@
     };
 
     // Update `data` attributes, styles and arrowStyles
-    data.attributes = _extends$1({}, attributes, data.attributes);
-    data.styles = _extends$1({}, styles, data.styles);
-    data.arrowStyles = _extends$1({}, data.offsets.arrow, data.arrowStyles);
+    data.attributes = _extends({}, attributes, data.attributes);
+    data.styles = _extends({}, styles, data.styles);
+    data.arrowStyles = _extends({}, data.offsets.arrow, data.arrowStyles);
 
     return data;
   }
@@ -18641,7 +18616,7 @@
 
         // this object contains `position`, we want to preserve it along with
         // any additional property we may add in the future
-        data.offsets.popper = _extends$1({}, data.offsets.popper, getPopperOffsets(data.instance.popper, data.offsets.reference, data.placement));
+        data.offsets.popper = _extends({}, data.offsets.popper, getPopperOffsets(data.instance.popper, data.offsets.reference, data.placement));
 
         data = runModifiers(data.instance.modifiers, data, 'flip');
       }
@@ -18915,7 +18890,7 @@
 
     order.forEach(function (placement) {
       var side = ['left', 'top'].indexOf(placement) !== -1 ? 'primary' : 'secondary';
-      popper = _extends$1({}, popper, check[side](placement));
+      popper = _extends({}, popper, check[side](placement));
     });
 
     data.offsets.popper = popper;
@@ -18950,7 +18925,7 @@
         end: defineProperty({}, side, reference[side] + reference[measurement] - popper[measurement])
       };
 
-      data.offsets.popper = _extends$1({}, popper, shiftOffsets[shiftvariation]);
+      data.offsets.popper = _extends({}, popper, shiftOffsets[shiftvariation]);
     }
 
     return data;
@@ -19482,7 +19457,7 @@
       this.update = debounce$1(this.update.bind(this));
 
       // with {} we create a new object with the options inside it
-      this.options = _extends$1({}, Popper.Defaults, options);
+      this.options = _extends({}, Popper.Defaults, options);
 
       // init state
       this.state = {
@@ -19497,13 +19472,13 @@
 
       // Deep merge modifiers options
       this.options.modifiers = {};
-      Object.keys(_extends$1({}, Popper.Defaults.modifiers, options.modifiers)).forEach(function (name) {
-        _this.options.modifiers[name] = _extends$1({}, Popper.Defaults.modifiers[name] || {}, options.modifiers ? options.modifiers[name] : {});
+      Object.keys(_extends({}, Popper.Defaults.modifiers, options.modifiers)).forEach(function (name) {
+        _this.options.modifiers[name] = _extends({}, Popper.Defaults.modifiers[name] || {}, options.modifiers ? options.modifiers[name] : {});
       });
 
       // Refactoring modifiers' list (Object => Array)
       this.modifiers = Object.keys(this.options.modifiers).map(function (name) {
-        return _extends$1({
+        return _extends({
           name: name
         }, _this.options.modifiers[name]);
       })
@@ -20039,7 +20014,7 @@
     };
 
     var onClickEventHandlers = openOnClick ? {
-      onMouseDown: function onMouseDown() {
+      onClick: function onClick() {
         if (isOpen) {
           closePopUp(false);
         } else {
@@ -20150,31 +20125,6 @@
     closeAriaLabel: undefined
   };
 
-  function _extends() { _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 _extends.apply(this, arguments); }
-  var propType = PropTypes__default['default'].oneOfType([PropTypes__default['default'].number, PropTypes__default['default'].string, PropTypes__default['default'].array, PropTypes__default['default'].object]);
-  var createPropTypes = function createPropTypes(props) {
-    return props.reduce(function (acc, name) {
-      var _extends2;
-
-      return _extends({}, acc, (_extends2 = {}, _extends2[name] = propType, _extends2));
-    }, {});
-  };
-  var propTypes = {
-    space: createPropTypes(space.propNames),
-    color: createPropTypes(color.propNames),
-    layout: createPropTypes(layout.propNames),
-    typography: createPropTypes(typography.propNames),
-    flexbox: createPropTypes(flexbox.propNames),
-    border: createPropTypes(border.propNames),
-    background: createPropTypes(background.propNames),
-    position: createPropTypes(position.propNames),
-    grid: createPropTypes(grid.propNames),
-    shadow: createPropTypes(shadow.propNames),
-    buttonStyle: createPropTypes(buttonStyle.propNames),
-    textStyle: createPropTypes(textStyle.propNames),
-    colorStyle: createPropTypes(colorStyle.propNames)
-  };
-
   var getSubset = function getSubset(o, propObj) {
     var fields = Object.keys(propObj);
     return pick.apply(void 0, [o].concat(fields));
@@ -20201,6 +20151,56 @@
     }, {});
   };
 
+  var getMenuMargin = function getMenuMargin(placement, showArrow) {
+    var direction = String(placement).split("-")[0];
+
+    switch (direction) {
+      case "top":
+        return {
+          marginBottom: showArrow ? "4px" : null
+        };
+
+      case "right":
+        return {
+          marginLeft: showArrow ? "8px" : null,
+          marginTop: showArrow ? null : "-8px"
+        };
+
+      case "left":
+        return {
+          marginRight: showArrow ? "8px" : null,
+          marginTop: showArrow ? null : "-8px"
+        };
+
+      case "bottom":
+      default:
+        return {
+          marginTop: showArrow ? "4px" : null
+        };
+    }
+  };
+
+  var DropdownMenuContainer = styled__default['default'](Box).withConfig({
+    displayName: "DropdownMenuContainer",
+    componentId: "sc-12o3dvc-0"
+  })(color, function (_ref) {
+    var dataPlacement = _ref.dataPlacement,
+        _ref$showArrow = _ref.showArrow,
+        showArrow = _ref$showArrow === void 0 ? true : _ref$showArrow,
+        _ref$backgroundColor = _ref.backgroundColor,
+        backgroundColor = _ref$backgroundColor === void 0 ? "white" : _ref$backgroundColor,
+        theme = _ref.theme;
+    return Object.assign({
+      borderRadius: theme.radii.medium,
+      backgroundColor: theme.colors[backgroundColor],
+      borderTop: "1px solid  " + theme.colors[backgroundColor],
+      borderBottom: "1px solid " + theme.colors[backgroundColor],
+      boxShadow: theme.shadows.medium,
+      padding: "7px 0",
+      zIndex: "100"
+    }, getMenuMargin(dataPlacement, showArrow));
+  });
+
   var DEFAULT_POPPER_MODIFIERS = {
     preventOverflow: {
       enabled: true,

package/dist/main.module.js

@@ -16922,55 +16922,30 @@ var Branding = function Branding(_a) {
   })));
 };
 
-var getMenuMargin = function getMenuMargin(placement, showArrow) {
-  var direction = String(placement).split("-")[0];
-
-  switch (direction) {
-    case "top":
-      return {
-        marginBottom: showArrow ? "4px" : null
-      };
-
-    case "right":
-      return {
-        marginLeft: showArrow ? "8px" : null,
-        marginTop: showArrow ? null : "-8px"
-      };
-
-    case "left":
-      return {
-        marginRight: showArrow ? "8px" : null,
-        marginTop: showArrow ? null : "-8px"
-      };
+function _extends$1() { _extends$1 = 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 _extends$1.apply(this, arguments); }
+var propType = PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.array, PropTypes.object]);
+var createPropTypes = function createPropTypes(props) {
+  return props.reduce(function (acc, name) {
+    var _extends2;
 
-    case "bottom":
-    default:
-      return {
-        marginTop: showArrow ? "4px" : null
-      };
-  }
+    return _extends$1({}, acc, (_extends2 = {}, _extends2[name] = propType, _extends2));
+  }, {});
+};
+var propTypes = {
+  space: createPropTypes(space.propNames),
+  color: createPropTypes(color.propNames),
+  layout: createPropTypes(layout.propNames),
+  typography: createPropTypes(typography.propNames),
+  flexbox: createPropTypes(flexbox.propNames),
+  border: createPropTypes(border.propNames),
+  background: createPropTypes(background.propNames),
+  position: createPropTypes(position.propNames),
+  grid: createPropTypes(grid.propNames),
+  shadow: createPropTypes(shadow.propNames),
+  buttonStyle: createPropTypes(buttonStyle.propNames),
+  textStyle: createPropTypes(textStyle.propNames),
+  colorStyle: createPropTypes(colorStyle.propNames)
 };
-
-var DropdownMenuContainer = styled(Box).withConfig({
-  displayName: "DropdownMenuContainer",
-  componentId: "sc-12o3dvc-0"
-})(color, function (_ref) {
-  var dataPlacement = _ref.dataPlacement,
-      _ref$showArrow = _ref.showArrow,
-      showArrow = _ref$showArrow === void 0 ? true : _ref$showArrow,
-      _ref$backgroundColor = _ref.backgroundColor,
-      backgroundColor = _ref$backgroundColor === void 0 ? "white" : _ref$backgroundColor,
-      theme = _ref.theme;
-  return Object.assign({
-    borderRadius: theme.radii.medium,
-    backgroundColor: theme.colors[backgroundColor],
-    borderTop: "1px solid  " + theme.colors[backgroundColor],
-    borderBottom: "1px solid " + theme.colors[backgroundColor],
-    boxShadow: theme.shadows.medium,
-    padding: "7px 0",
-    zIndex: "100"
-  }, getMenuMargin(dataPlacement, showArrow));
-});
 
 /**!
  * @fileOverview Kickass library to create and place poppers near their reference elements.
@@ -17381,7 +17356,7 @@ var defineProperty = function (obj, key, value) {
   return obj;
 };
 
-var _extends$1 = Object.assign || function (target) {
+var _extends = Object.assign || function (target) {
   for (var i = 1; i < arguments.length; i++) {
     var source = arguments[i];
 
@@ -17403,7 +17378,7 @@ var _extends$1 = Object.assign || function (target) {
  * @returns {Object} ClientRect like output
  */
 function getClientRect(offsets) {
-  return _extends$1({}, offsets, {
+  return _extends({}, offsets, {
     right: offsets.left + offsets.width,
     bottom: offsets.top + offsets.height
   });
@@ -17691,7 +17666,7 @@ function computeAutoPlacement(placement, refRect, popper, reference, boundariesE
   };
 
   var sortedAreas = Object.keys(rects).map(function (key) {
-    return _extends$1({
+    return _extends({
       key: key
     }, rects[key], {
       area: getArea(rects[key])
@@ -18333,9 +18308,9 @@ function computeStyle(data, options) {
   };
 
   // Update `data` attributes, styles and arrowStyles
-  data.attributes = _extends$1({}, attributes, data.attributes);
-  data.styles = _extends$1({}, styles, data.styles);
-  data.arrowStyles = _extends$1({}, data.offsets.arrow, data.arrowStyles);
+  data.attributes = _extends({}, attributes, data.attributes);
+  data.styles = _extends({}, styles, data.styles);
+  data.arrowStyles = _extends({}, data.offsets.arrow, data.arrowStyles);
 
   return data;
 }
@@ -18615,7 +18590,7 @@ function flip(data, options) {
 
       // this object contains `position`, we want to preserve it along with
       // any additional property we may add in the future
-      data.offsets.popper = _extends$1({}, data.offsets.popper, getPopperOffsets(data.instance.popper, data.offsets.reference, data.placement));
+      data.offsets.popper = _extends({}, data.offsets.popper, getPopperOffsets(data.instance.popper, data.offsets.reference, data.placement));
 
       data = runModifiers(data.instance.modifiers, data, 'flip');
     }
@@ -18889,7 +18864,7 @@ function preventOverflow(data, options) {
 
   order.forEach(function (placement) {
     var side = ['left', 'top'].indexOf(placement) !== -1 ? 'primary' : 'secondary';
-    popper = _extends$1({}, popper, check[side](placement));
+    popper = _extends({}, popper, check[side](placement));
   });
 
   data.offsets.popper = popper;
@@ -18924,7 +18899,7 @@ function shift(data) {
       end: defineProperty({}, side, reference[side] + reference[measurement] - popper[measurement])
     };
 
-    data.offsets.popper = _extends$1({}, popper, shiftOffsets[shiftvariation]);
+    data.offsets.popper = _extends({}, popper, shiftOffsets[shiftvariation]);
   }
 
   return data;
@@ -19456,7 +19431,7 @@ var Popper$3 = function () {
     this.update = debounce$1(this.update.bind(this));
 
     // with {} we create a new object with the options inside it
-    this.options = _extends$1({}, Popper.Defaults, options);
+    this.options = _extends({}, Popper.Defaults, options);
 
     // init state
     this.state = {
@@ -19471,13 +19446,13 @@ var Popper$3 = function () {
 
     // Deep merge modifiers options
     this.options.modifiers = {};
-    Object.keys(_extends$1({}, Popper.Defaults.modifiers, options.modifiers)).forEach(function (name) {
-      _this.options.modifiers[name] = _extends$1({}, Popper.Defaults.modifiers[name] || {}, options.modifiers ? options.modifiers[name] : {});
+    Object.keys(_extends({}, Popper.Defaults.modifiers, options.modifiers)).forEach(function (name) {
+      _this.options.modifiers[name] = _extends({}, Popper.Defaults.modifiers[name] || {}, options.modifiers ? options.modifiers[name] : {});
     });
 
     // Refactoring modifiers' list (Object => Array)
     this.modifiers = Object.keys(this.options.modifiers).map(function (name) {
-      return _extends$1({
+      return _extends({
         name: name
       }, _this.options.modifiers[name]);
     })
@@ -20013,7 +19988,7 @@ var Popper$1 = /*#__PURE__*/React__default.forwardRef(function (_ref, popperRef)
   };
 
   var onClickEventHandlers = openOnClick ? {
-    onMouseDown: function onMouseDown() {
+    onClick: function onClick() {
       if (isOpen) {
         closePopUp(false);
       } else {
@@ -20124,31 +20099,6 @@ Popper$1.defaultProps = {
   closeAriaLabel: undefined
 };
 
-function _extends() { _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 _extends.apply(this, arguments); }
-var propType = PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.array, PropTypes.object]);
-var createPropTypes = function createPropTypes(props) {
-  return props.reduce(function (acc, name) {
-    var _extends2;
-
-    return _extends({}, acc, (_extends2 = {}, _extends2[name] = propType, _extends2));
-  }, {});
-};
-var propTypes = {
-  space: createPropTypes(space.propNames),
-  color: createPropTypes(color.propNames),
-  layout: createPropTypes(layout.propNames),
-  typography: createPropTypes(typography.propNames),
-  flexbox: createPropTypes(flexbox.propNames),
-  border: createPropTypes(border.propNames),
-  background: createPropTypes(background.propNames),
-  position: createPropTypes(position.propNames),
-  grid: createPropTypes(grid.propNames),
-  shadow: createPropTypes(shadow.propNames),
-  buttonStyle: createPropTypes(buttonStyle.propNames),
-  textStyle: createPropTypes(textStyle.propNames),
-  colorStyle: createPropTypes(colorStyle.propNames)
-};
-
 var getSubset = function getSubset(o, propObj) {
   var fields = Object.keys(propObj);
   return pick.apply(void 0, [o].concat(fields));
@@ -20175,6 +20125,56 @@ var pick = function pick(o) {
   }, {});
 };
 
+var getMenuMargin = function getMenuMargin(placement, showArrow) {
+  var direction = String(placement).split("-")[0];
+
+  switch (direction) {
+    case "top":
+      return {
+        marginBottom: showArrow ? "4px" : null
+      };
+
+    case "right":
+      return {
+        marginLeft: showArrow ? "8px" : null,
+        marginTop: showArrow ? null : "-8px"
+      };
+
+    case "left":
+      return {
+        marginRight: showArrow ? "8px" : null,
+        marginTop: showArrow ? null : "-8px"
+      };
+
+    case "bottom":
+    default:
+      return {
+        marginTop: showArrow ? "4px" : null
+      };
+  }
+};
+
+var DropdownMenuContainer = styled(Box).withConfig({
+  displayName: "DropdownMenuContainer",
+  componentId: "sc-12o3dvc-0"
+})(color, function (_ref) {
+  var dataPlacement = _ref.dataPlacement,
+      _ref$showArrow = _ref.showArrow,
+      showArrow = _ref$showArrow === void 0 ? true : _ref$showArrow,
+      _ref$backgroundColor = _ref.backgroundColor,
+      backgroundColor = _ref$backgroundColor === void 0 ? "white" : _ref$backgroundColor,
+      theme = _ref.theme;
+  return Object.assign({
+    borderRadius: theme.radii.medium,
+    backgroundColor: theme.colors[backgroundColor],
+    borderTop: "1px solid  " + theme.colors[backgroundColor],
+    borderBottom: "1px solid " + theme.colors[backgroundColor],
+    boxShadow: theme.shadows.medium,
+    padding: "7px 0",
+    zIndex: "100"
+  }, getMenuMargin(dataPlacement, showArrow));
+});
+
 var DEFAULT_POPPER_MODIFIERS = {
   preventOverflow: {
     enabled: true,

package/dist/src/DropdownMenu/DropdownMenu.d.ts

@@ -1,4 +1,5 @@
 import React from "react";
+import { StyledProps } from "../StyledProps";
 declare type DropdownMenuProps = {
     className?: string;
     id?: string;
@@ -13,6 +14,6 @@ declare type DropdownMenuProps = {
     boundariesElement?: string;
     openAriaLabel?: string;
     closeAriaLabel?: string;
-};
+} & StyledProps;
 declare const DropdownMenu: React.FC<DropdownMenuProps>;
 export default DropdownMenu;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nulogy/components",
-  "version": "8.4.2",
+  "version": "8.4.3",
   "description": "Component library for the Nulogy Design System - http://nulogy.design",
   "private": false,
   "publishConfig": {