@micromag/core 0.3.111 → 0.3.117

package/lib/components.js

@@ -20,7 +20,6 @@ var hooks = require('@micromag/core/hooks');
 var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var get = require('lodash/get');
 var ReactDOM = require('react-dom');
-var react = require('@uppy/react');
 var isArray = require('lodash/isArray');
 var faAngleDown = require('@fortawesome/free-solid-svg-icons/faAngleDown');
 var faAngleUp = require('@fortawesome/free-solid-svg-icons/faAngleUp');
@@ -49,6 +48,24 @@ var web = require('@react-spring/web');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
+function _interopNamespace(e) {
+    if (e && e.__esModule) return e;
+    var n = Object.create(null);
+    if (e) {
+        Object.keys(e).forEach(function (k) {
+            if (k !== 'default') {
+                var d = Object.getOwnPropertyDescriptor(e, k);
+                Object.defineProperty(n, k, d.get ? d : {
+                    enumerable: true,
+                    get: function () { return e[k]; }
+                });
+            }
+        });
+    }
+    n["default"] = e;
+    return Object.freeze(n);
+}
+
 var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
 var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
 var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
@@ -69,13 +86,13 @@ var isNumber__default = /*#__PURE__*/_interopDefaultLegacy(isNumber);
 var styles$v = {"container":"micromag-core-buttons-button-container","asLink":"micromag-core-buttons-button-asLink","withoutStyle":"micromag-core-buttons-button-withoutStyle","icon":"micromag-core-buttons-button-icon","withIcon":"micromag-core-buttons-button-withIcon","label":"micromag-core-buttons-button-label","right":"micromag-core-buttons-button-right","withIconColumns":"micromag-core-buttons-button-withIconColumns","linkDisabled":"micromag-core-buttons-button-linkDisabled"};
 
 /* eslint-disable react/jsx-props-no-spreading */
-var propTypes$K = {
+var propTypes$L = {
   children: core.PropTypes.label.isRequired,
   isHtml: PropTypes__default["default"].bool,
   values: PropTypes__default["default"].object // eslint-disable-line react/forbid-prop-types
 
 };
-var defaultProps$K = {
+var defaultProps$L = {
   isHtml: false,
   values: {}
 };
@@ -90,11 +107,11 @@ var Label = function Label(_ref) {
   }, children)) : children;
 };
 
-Label.propTypes = propTypes$K;
-Label.defaultProps = defaultProps$K;
+Label.propTypes = propTypes$L;
+Label.defaultProps = defaultProps$L;
 
 var _excluded$a = ["type", "theme", "size", "href", "external", "direct", "target", "label", "children", "focusable", "active", "icon", "iconPosition", "disabled", "loading", "disableOnLoading", "small", "big", "withShadow", "withoutStyle", "withoutTheme", "asLink", "outline", "onClick", "className", "iconClassName", "labelClassName", "refButton"];
-var propTypes$J = {
+var propTypes$K = {
   type: PropTypes__default["default"].string,
   theme: core.PropTypes.buttonTheme,
   size: core.PropTypes.buttonSize,
@@ -127,7 +144,7 @@ var propTypes$J = {
 
   })])
 };
-var defaultProps$J = {
+var defaultProps$K = {
   type: 'button',
   theme: null,
   size: null,
@@ -243,13 +260,13 @@ var Button$1 = function Button(_ref) {
   }), content);
 };
 
-Button$1.propTypes = propTypes$J;
-Button$1.defaultProps = defaultProps$J;
+Button$1.propTypes = propTypes$K;
+Button$1.defaultProps = defaultProps$K;
 
 var styles$u = {};
 
 var _excluded$9 = ["className", "onClick", "theme"];
-var propTypes$I = {
+var propTypes$J = {
   buttons: core.PropTypes.buttons,
   size: core.PropTypes.buttonSize,
   theme: core.PropTypes.buttonTheme,
@@ -258,7 +275,7 @@ var propTypes$I = {
   className: PropTypes__default["default"].string,
   buttonClassName: PropTypes__default["default"].string
 };
-var defaultProps$I = {
+var defaultProps$J = {
   buttons: [],
   size: null,
   theme: undefined,
@@ -308,14 +325,14 @@ var Buttons = function Buttons(_ref) {
   }));
 };
 
-Buttons.propTypes = propTypes$I;
-Buttons.defaultProps = defaultProps$I;
+Buttons.propTypes = propTypes$J;
+Buttons.defaultProps = defaultProps$J;
 
 var _excluded$8 = ["className"];
-var propTypes$H = {
+var propTypes$I = {
   className: PropTypes__default["default"].string
 };
-var defaultProps$H = {
+var defaultProps$I = {
   className: null
 };
 
@@ -333,14 +350,14 @@ var BackButton = function BackButton(_ref) {
   }, props));
 };
 
-BackButton.propTypes = propTypes$H;
-BackButton.defaultProps = defaultProps$H;
+BackButton.propTypes = propTypes$I;
+BackButton.defaultProps = defaultProps$I;
 
 var styles$t = {"actions":"micromag-core-forms-form-actions","left":"micromag-core-forms-form-left","right":"micromag-core-forms-form-right"};
 
 var _excluded$7 = ["type"],
     _excluded2 = ["component", "id", "settings"];
-var propTypes$G = {
+var propTypes$H = {
   name: PropTypes__default["default"].string,
   // .isRequired,
   value: core.PropTypes.component,
@@ -354,7 +371,7 @@ var propTypes$G = {
   fieldContext: PropTypes__default["default"].any // eslint-disable-line react/forbid-prop-types
 
 };
-var defaultProps$G = {
+var defaultProps$H = {
   name: null,
   form: null,
   formComponents: {},
@@ -441,10 +458,10 @@ var FieldForm = function FieldForm(_ref) {
   }, formProps))) : null;
 };
 
-FieldForm.propTypes = propTypes$G;
-FieldForm.defaultProps = defaultProps$G;
+FieldForm.propTypes = propTypes$H;
+FieldForm.defaultProps = defaultProps$H;
 
-var propTypes$F = {
+var propTypes$G = {
   action: PropTypes__default["default"].string.isRequired,
   method: PropTypes__default["default"].string,
   fields: core.PropTypes.formFields,
@@ -471,7 +488,7 @@ var propTypes$F = {
   actionsClassName: PropTypes__default["default"].string,
   cancelClassName: PropTypes__default["default"].string
 };
-var defaultProps$F = {
+var defaultProps$G = {
   method: 'POST',
   fields: [],
   initialValue: null,
@@ -685,13 +702,13 @@ var Form = function Form(_ref) {
   })) : null) : null);
 };
 
-Form.propTypes = propTypes$F;
-Form.defaultProps = defaultProps$F;
+Form.propTypes = propTypes$G;
+Form.defaultProps = defaultProps$G;
 
 var styles$s = {"withoutStyle":"micromag-core-partials-link-withoutStyle"};
 
 var _excluded$6 = ["href", "external", "children", "target", "rel", "className", "withoutStyle"];
-var propTypes$E = {
+var propTypes$F = {
   href: PropTypes__default["default"].string,
   external: PropTypes__default["default"].bool,
   target: PropTypes__default["default"].string,
@@ -700,7 +717,7 @@ var propTypes$E = {
   withoutStyle: PropTypes__default["default"].bool,
   className: PropTypes__default["default"].string
 };
-var defaultProps$E = {
+var defaultProps$F = {
   href: '',
   external: false,
   target: '_blank',
@@ -731,11 +748,11 @@ var Link = function Link(_ref) {
   }, props), /*#__PURE__*/React__default["default"].createElement(Label, null, children));
 };
 
-Link.propTypes = propTypes$E;
-Link.defaultProps = defaultProps$E;
+Link.propTypes = propTypes$F;
+Link.defaultProps = defaultProps$F;
 
 var _excluded$5 = ["label", "className"];
-var propTypes$D = {
+var propTypes$E = {
   href: PropTypes__default["default"].string,
   header: PropTypes__default["default"].node,
   image: PropTypes__default["default"].node,
@@ -764,7 +781,7 @@ var propTypes$D = {
   onClickBody: PropTypes__default["default"].func,
   onClickFooter: PropTypes__default["default"].func
 };
-var defaultProps$D = {
+var defaultProps$E = {
   href: null,
   header: null,
   image: null,
@@ -885,15 +902,15 @@ var Card = function Card(_ref) {
   }, cardInner);
 };
 
-Card.propTypes = propTypes$D;
-Card.defaultProps = defaultProps$D;
+Card.propTypes = propTypes$E;
+Card.defaultProps = defaultProps$E;
 
-var propTypes$C = {
+var propTypes$D = {
   animated: PropTypes__default["default"].bool,
   color: PropTypes__default["default"].string,
   className: PropTypes__default["default"].string
 };
-var defaultProps$C = {
+var defaultProps$D = {
   animated: true,
   color: 'currentColor',
   className: null
@@ -958,19 +975,19 @@ var Spinner = function Spinner(_ref) {
   }) : null))));
 };
 
-Spinner.propTypes = propTypes$C;
-Spinner.defaultProps = defaultProps$C;
+Spinner.propTypes = propTypes$D;
+Spinner.defaultProps = defaultProps$D;
 
 var styles$r = {};
 
 var _excluded$4 = ["description", "loading", "children", "className"];
-var propTypes$B = {
+var propTypes$C = {
   description: PropTypes__default["default"].node,
   loading: PropTypes__default["default"].bool,
   children: PropTypes__default["default"].node,
   className: PropTypes__default["default"].string
 };
-var defaultProps$B = {
+var defaultProps$C = {
   description: null,
   loading: false,
   children: null,
@@ -989,12 +1006,12 @@ var FormPanel = function FormPanel(_ref) {
   }, props), description, loading ? /*#__PURE__*/React__default["default"].createElement(Spinner, null) : children);
 };
 
-FormPanel.propTypes = propTypes$B;
-FormPanel.defaultProps = defaultProps$B;
+FormPanel.propTypes = propTypes$C;
+FormPanel.defaultProps = defaultProps$C;
 
 var styles$q = {"container":"micromag-core-menus-breadcrumb-container","arrow":"micromag-core-menus-breadcrumb-arrow"};
 
-var propTypes$A = {
+var propTypes$B = {
   items: core.PropTypes.menuItems,
   theme: core.PropTypes.bootstrapThemes,
   separator: PropTypes__default["default"].oneOf([null, 'arrow']),
@@ -1002,7 +1019,7 @@ var propTypes$A = {
   noWrap: PropTypes__default["default"].bool,
   className: PropTypes__default["default"].string
 };
-var defaultProps$A = {
+var defaultProps$B = {
   items: [],
   theme: null,
   separator: null,
@@ -1052,11 +1069,11 @@ var Breadcrumb = function Breadcrumb(_ref) {
   })));
 };
 
-Breadcrumb.propTypes = propTypes$A;
-Breadcrumb.defaultProps = defaultProps$A;
+Breadcrumb.propTypes = propTypes$B;
+Breadcrumb.defaultProps = defaultProps$B;
 
 var _excluded$3 = ["type", "className", "label", "children", "onClick", "active"];
-var propTypes$z = {
+var propTypes$A = {
   items: core.PropTypes.menuItems,
   children: PropTypes__default["default"].node,
   visible: PropTypes__default["default"].bool,
@@ -1066,7 +1083,7 @@ var propTypes$z = {
   onClickItem: PropTypes__default["default"].func,
   onClickOutside: PropTypes__default["default"].func
 };
-var defaultProps$z = {
+var defaultProps$A = {
   items: [],
   children: null,
   visible: false,
@@ -1164,11 +1181,11 @@ var Dropdown = function Dropdown(_ref) {
   }));
 };
 
-Dropdown.propTypes = propTypes$z;
-Dropdown.defaultProps = defaultProps$z;
+Dropdown.propTypes = propTypes$A;
+Dropdown.defaultProps = defaultProps$A;
 
 var _excluded$2 = ["id", "className", "linkClassName", "href", "label", "external", "items", "dropdown", "active", "onClick"];
-var propTypes$y = {
+var propTypes$z = {
   items: core.PropTypes.menuItems,
   tagName: PropTypes__default["default"].string,
   itemTagName: PropTypes__default["default"].string,
@@ -1187,7 +1204,7 @@ var propTypes$y = {
   dropdownLinkClassName: PropTypes__default["default"].string,
   dropdownAlign: core.PropTypes.dropdownAlign
 };
-var defaultProps$y = {
+var defaultProps$z = {
   items: [],
   tagName: 'ul',
   itemTagName: 'li',
@@ -1311,12 +1328,12 @@ var Menu = function Menu(_ref) {
   }));
 };
 
-Menu.propTypes = propTypes$y;
-Menu.defaultProps = defaultProps$y;
+Menu.propTypes = propTypes$z;
+Menu.defaultProps = defaultProps$z;
 
 var styles$p = {"collapse":"micromag-core-menus-navbar-collapse"};
 
-var propTypes$x = {
+var propTypes$y = {
   brand: PropTypes__default["default"].node,
   brandLink: PropTypes__default["default"].string,
   breadcrumbs: PropTypes__default["default"].node,
@@ -1332,7 +1349,7 @@ var propTypes$x = {
   breadCrumbsClassName: PropTypes__default["default"].string,
   collapseClassName: PropTypes__default["default"].string
 };
-var defaultProps$x = {
+var defaultProps$y = {
   brand: null,
   brandLink: null,
   breadcrumbs: null,
@@ -1408,8 +1425,8 @@ var Navbar = function Navbar(_ref) {
   }, children) : children));
 };
 
-Navbar.propTypes = propTypes$x;
-Navbar.defaultProps = defaultProps$x;
+Navbar.propTypes = propTypes$y;
+Navbar.defaultProps = defaultProps$y;
 
 var styles$o = {};
 
@@ -1429,7 +1446,7 @@ var messages = reactIntl.defineMessages({
     }]
   }
 });
-var propTypes$w = {
+var propTypes$x = {
   page: PropTypes__default["default"].number,
   total: PropTypes__default["default"].number,
   url: PropTypes__default["default"].string,
@@ -1440,7 +1457,7 @@ var propTypes$w = {
   linkClassName: PropTypes__default["default"].string,
   onClickPage: PropTypes__default["default"].func
 };
-var defaultProps$w = {
+var defaultProps$x = {
   page: 1,
   total: 1,
   url: null,
@@ -1514,12 +1531,12 @@ var PaginationMenu = function PaginationMenu(_ref) {
   }, /*#__PURE__*/React__default["default"].createElement(Label, null, messages.next))) : null));
 };
 
-PaginationMenu.propTypes = propTypes$w;
-PaginationMenu.defaultProps = defaultProps$w;
+PaginationMenu.propTypes = propTypes$x;
+PaginationMenu.defaultProps = defaultProps$x;
 
 var styles$n = {"container":"micromag-core-menus-tabs-container"};
 
-var propTypes$v = {
+var propTypes$w = {
   items: core.PropTypes.menuItems,
   size: core.PropTypes.buttonSize,
   theme: core.PropTypes.buttonTheme,
@@ -1528,7 +1545,7 @@ var propTypes$v = {
   className: PropTypes__default["default"].string,
   onClickItem: PropTypes__default["default"].func
 };
-var defaultProps$v = {
+var defaultProps$w = {
   items: [],
   size: null,
   theme: 'secondary',
@@ -1559,17 +1576,17 @@ var TabsMenu = function TabsMenu(_ref) {
   }));
 };
 
-TabsMenu.propTypes = propTypes$v;
-TabsMenu.defaultProps = defaultProps$v;
+TabsMenu.propTypes = propTypes$w;
+TabsMenu.defaultProps = defaultProps$w;
 
 var styles$m = {"container":"micromag-core-modals-container","modals":"micromag-core-modals-modals","hasModals":"micromag-core-modals-hasModals"};
 
-var propTypes$u = {
+var propTypes$v = {
   modals: core.PropTypes.modals.isRequired,
   setModalsContainer: PropTypes__default["default"].func.isRequired,
   className: PropTypes__default["default"].string
 };
-var defaultProps$u = {
+var defaultProps$v = {
   className: null
 };
 
@@ -1589,12 +1606,12 @@ var ModalsContainer = function ModalsContainer(_ref) {
   }));
 };
 
-ModalsContainer.propTypes = propTypes$u;
-ModalsContainer.defaultProps = defaultProps$u;
+ModalsContainer.propTypes = propTypes$v;
+ModalsContainer.defaultProps = defaultProps$v;
 var Modals = contexts.withModals(ModalsContainer);
 
 /* eslint-disable react/no-array-index-key, react/jsx-props-no-spreading */
-var propTypes$t = {
+var propTypes$u = {
   id: PropTypes__default["default"].string,
   data: PropTypes__default["default"].object,
   // eslint-disable-line react/forbid-prop-types
@@ -1604,7 +1621,7 @@ var propTypes$t = {
   unregister: PropTypes__default["default"].func,
   children: PropTypes__default["default"].node
 };
-var defaultProps$t = {
+var defaultProps$u = {
   id: null,
   data: null,
   container: null,
@@ -1637,17 +1654,17 @@ var ElementPortal = function ElementPortal(_ref) {
   return container !== null ? /*#__PURE__*/ReactDOM__default["default"].createPortal(children, container) : null;
 };
 
-ElementPortal.propTypes = propTypes$t;
-ElementPortal.defaultProps = defaultProps$t;
+ElementPortal.propTypes = propTypes$u;
+ElementPortal.defaultProps = defaultProps$u;
 
 /* eslint-disable react/no-array-index-key, react/jsx-props-no-spreading */
-var propTypes$s = {
+var propTypes$t = {
   id: PropTypes__default["default"].string,
   data: PropTypes__default["default"].object,
   // eslint-disable-line react/forbid-prop-types
   children: PropTypes__default["default"].node
 };
-var defaultProps$s = {
+var defaultProps$t = {
   id: null,
   data: null,
   children: null
@@ -1674,18 +1691,18 @@ var ModalPortal = function ModalPortal(_ref) {
   }, children);
 };
 
-ModalPortal.propTypes = propTypes$s;
-ModalPortal.defaultProps = defaultProps$s;
+ModalPortal.propTypes = propTypes$t;
+ModalPortal.defaultProps = defaultProps$t;
 
 var styles$l = {"container":"micromag-core-modals-modal-container","center":"micromag-core-modals-modal-center","inner":"micromag-core-modals-modal-inner","top":"micromag-core-modals-modal-top"};
 
-var propTypes$r = {
+var propTypes$s = {
   id: PropTypes__default["default"].string,
   title: PropTypes__default["default"].string,
   position: PropTypes__default["default"].oneOf(['center', 'top']),
   children: PropTypes__default["default"].node
 };
-var defaultProps$r = {
+var defaultProps$s = {
   id: null,
   title: null,
   position: 'center',
@@ -1715,12 +1732,12 @@ var Modal = function Modal(_ref) {
   }, children)));
 };
 
-Modal.propTypes = propTypes$r;
-Modal.defaultProps = defaultProps$r;
+Modal.propTypes = propTypes$s;
+Modal.defaultProps = defaultProps$s;
 
 var styles$k = {"container":"micromag-core-modals-dialog-container"};
 
-var propTypes$q = {
+var propTypes$r = {
   title: core.PropTypes.label,
   header: PropTypes__default["default"].node,
   children: PropTypes__default["default"].node,
@@ -1730,7 +1747,7 @@ var propTypes$q = {
   onClickClose: PropTypes__default["default"].func,
   className: PropTypes__default["default"].string
 };
-var defaultProps$q = {
+var defaultProps$r = {
   title: null,
   header: null,
   children: null,
@@ -1778,18 +1795,26 @@ var ModalDialog = function ModalDialog(_ref) {
   }) : null) : null));
 };
 
-ModalDialog.propTypes = propTypes$q;
-ModalDialog.defaultProps = defaultProps$q;
+ModalDialog.propTypes = propTypes$r;
+ModalDialog.defaultProps = defaultProps$r;
 
 // import classNames from 'classnames';
-var propTypes$p = {
+var DashboardModal = /*#__PURE__*/React__default["default"].lazy(function () {
+  return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('@uppy/react')); }).then(function (_ref) {
+    var Component = _ref.DashboardModal;
+    return {
+      "default": Component
+    };
+  });
+});
+var propTypes$q = {
   type: PropTypes__default["default"].oneOfType([core.PropTypes.mediaTypes, PropTypes__default["default"].array]),
   opened: PropTypes__default["default"].bool,
   sources: PropTypes__default["default"].arrayOf(PropTypes__default["default"].string),
   onUploaded: PropTypes__default["default"].func,
   onRequestClose: PropTypes__default["default"].func
 };
-var defaultProps$p = {
+var defaultProps$q = {
   type: null,
   opened: false,
   sources: ['webcam', 'facebook', 'instagram', 'dropbox', 'google-drive'],
@@ -1797,12 +1822,12 @@ var defaultProps$p = {
   onRequestClose: null
 };
 
-var UploadModal = function UploadModal(_ref) {
-  var type = _ref.type,
-      opened = _ref.opened,
-      sources = _ref.sources,
-      onUploaded = _ref.onUploaded,
-      onRequestClose = _ref.onRequestClose;
+var UploadModal = function UploadModal(_ref2) {
+  var type = _ref2.type,
+      opened = _ref2.opened,
+      sources = _ref2.sources,
+      onUploaded = _ref2.onUploaded,
+      onRequestClose = _ref2.onRequestClose;
   var onUppyComplete = React.useCallback(function (response) {
     if (onUploaded !== null) {
       onUploaded(response);
@@ -1829,26 +1854,28 @@ var UploadModal = function UploadModal(_ref) {
       uppy.reset();
     }
   }, [uppy, opened]);
-  return uppy !== null ? /*#__PURE__*/React__default["default"].createElement(react.DashboardModal, {
+  return uppy !== null ? /*#__PURE__*/React__default["default"].createElement(React.Suspense, {
+    fallback: /*#__PURE__*/React__default["default"].createElement("div", null)
+  }, /*#__PURE__*/React__default["default"].createElement(DashboardModal, {
     uppy: uppy,
     open: opened,
     closeAfterFinish: true,
     onRequestClose: onRequestClose,
     plugins: sources
-  }) : null;
+  })) : null;
 };
 
-UploadModal.propTypes = propTypes$p;
-UploadModal.defaultProps = defaultProps$p;
+UploadModal.propTypes = propTypes$q;
+UploadModal.defaultProps = defaultProps$q;
 
 var styles$j = {"container":"micromag-core-panels-container"};
 
-var propTypes$o = {
+var propTypes$p = {
   panels: core.PropTypes.panels,
   setPanelsContainer: PropTypes__default["default"].func,
   className: PropTypes__default["default"].string
 };
-var defaultProps$o = {
+var defaultProps$p = {
   panels: [],
   setPanelsContainer: null,
   className: null
@@ -1870,18 +1897,18 @@ var PanelsContainer = function PanelsContainer(_ref) {
   }));
 };
 
-PanelsContainer.propTypes = propTypes$o;
-PanelsContainer.defaultProps = defaultProps$o;
+PanelsContainer.propTypes = propTypes$p;
+PanelsContainer.defaultProps = defaultProps$p;
 var Panels = contexts.withPanels(PanelsContainer);
 
 /* eslint-disable react/no-array-index-key, react/jsx-props-no-spreading */
-var propTypes$n = {
+var propTypes$o = {
   id: PropTypes__default["default"].string,
   data: PropTypes__default["default"].object,
   // eslint-disable-line react/forbid-prop-types
   children: PropTypes__default["default"].node
 };
-var defaultProps$n = {
+var defaultProps$o = {
   id: null,
   data: null,
   children: null
@@ -1914,18 +1941,18 @@ var PanelPortal = function PanelPortal(_ref) {
   }, children);
 };
 
-PanelPortal.propTypes = propTypes$n;
-PanelPortal.defaultProps = defaultProps$n;
+PanelPortal.propTypes = propTypes$o;
+PanelPortal.defaultProps = defaultProps$o;
 
 var styles$i = {"container":"micromag-core-panels-panel-container"};
 
 /* eslint-disable react/no-array-index-key, react/jsx-props-no-spreading */
-var propTypes$m = {
+var propTypes$n = {
   id: PropTypes__default["default"].string,
   title: PropTypes__default["default"].string,
   children: PropTypes__default["default"].node
 };
-var defaultProps$m = {
+var defaultProps$n = {
   id: null,
   title: null,
   children: null
@@ -1951,12 +1978,12 @@ var Panel = function Panel(_ref) {
   }, children));
 };
 
-Panel.propTypes = propTypes$m;
-Panel.defaultProps = defaultProps$m;
+Panel.propTypes = propTypes$n;
+Panel.defaultProps = defaultProps$n;
 
 var styles$h = {"container":"micromag-core-partials-collapsable-panel-container","top":"micromag-core-partials-collapsable-panel-top","button":"micromag-core-partials-collapsable-panel-button","label":"micromag-core-partials-collapsable-panel-label","content":"micromag-core-partials-collapsable-panel-content","isOpened":"micromag-core-partials-collapsable-panel-isOpened"};
 
-var propTypes$l = {
+var propTypes$m = {
   title: PropTypes__default["default"].node,
   children: PropTypes__default["default"].node,
   className: PropTypes__default["default"].string,
@@ -1965,7 +1992,7 @@ var propTypes$l = {
   openedClassName: PropTypes__default["default"].string,
   buttonClassName: PropTypes__default["default"].string
 };
-var defaultProps$l = {
+var defaultProps$m = {
   title: null,
   children: null,
   className: null,
@@ -2013,8 +2040,62 @@ var CollapsablePanel = function CollapsablePanel(_ref) {
   }, children));
 };
 
-CollapsablePanel.propTypes = propTypes$l;
-CollapsablePanel.defaultProps = defaultProps$l;
+CollapsablePanel.propTypes = propTypes$m;
+CollapsablePanel.defaultProps = defaultProps$m;
+
+var propTypes$l = {
+  stroke: PropTypes__default["default"].string,
+  border: PropTypes__default["default"].string,
+  fill: PropTypes__default["default"].string,
+  className: PropTypes__default["default"].string
+};
+var defaultProps$l = {
+  stroke: 'currentColor',
+  border: 'rgba(0,0,0,0.67)',
+  fill: '#fff',
+  className: null
+};
+
+var Close = function Close(_ref) {
+  var stroke = _ref.stroke,
+      border = _ref.border,
+      fill = _ref.fill,
+      className = _ref.className;
+  return /*#__PURE__*/React__default["default"].createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "42.9",
+    height: "42.9",
+    viewBox: "0 0 42.9 42.9",
+    className: className
+  }, /*#__PURE__*/React__default["default"].createElement("g", {
+    transform: "translate(-352.531 -47.531)"
+  }, border ? /*#__PURE__*/React__default["default"].createElement("path", {
+    fill: border,
+    d: "M374,47.5c11.9,0,21.5,9.6,21.5,21.5s-9.6,21.5-21.5,21.5s-21.5-9.6-21.5-21.5c0,0,0,0,0,0 C352.5,57.1,362.1,47.5,374,47.5z"
+  }) : null, /*#__PURE__*/React__default["default"].createElement("path", {
+    fill: fill,
+    d: "M374,50c10.5,0,19,8.5,19,19s-8.5,19-19,19s-19-8.5-19-19S363.5,50,374,50z"
+  }), /*#__PURE__*/React__default["default"].createElement("g", {
+    transform: "translate(366.893 61.893)"
+  }, /*#__PURE__*/React__default["default"].createElement("g", {
+    transform: "translate(0 0)"
+  }, /*#__PURE__*/React__default["default"].createElement("path", {
+    fill: fill,
+    stroke: stroke,
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    d: "M14.2,0.3L0,13.9"
+  }), /*#__PURE__*/React__default["default"].createElement("path", {
+    fill: fill,
+    stroke: stroke,
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    d: "M0.3,0l13.7,14.2"
+  })))));
+};
+
+Close.propTypes = propTypes$l;
+Close.defaultProps = defaultProps$l;
 
 /* eslint-disable react/jsx-props-no-spreading */
 var propTypes$k = {
@@ -4308,6 +4389,7 @@ exports.Breadcrumb = Breadcrumb;
 exports.Button = Button$1;
 exports.Buttons = Buttons;
 exports.Card = Card;
+exports.Close = Close;
 exports.CollapsablePanel = CollapsablePanel;
 exports.Date = Date$1;
 exports.Detector = Detector;