orcs-design-system 3.1.33 → 3.1.36

package/es/components/ActionsMenu/index.js

@@ -250,9 +250,9 @@ export var ActionsMenuBody = function ActionsMenuBody(_ref) {
     },
     onBlur: function onBlur(e) {
       setTimeout(function () {
-        var _document$getElementB;
+        var _wrapperRef$current, _document$getElementB;
         var focusedElement = document.activeElement;
-        var isChild = wrapperRef.current.contains(focusedElement);
+        var isChild = (_wrapperRef$current = wrapperRef.current) === null || _wrapperRef$current === void 0 ? void 0 : _wrapperRef$current.contains(focusedElement);
         var isModalChild = (_document$getElementB = document.getElementById("modal-overlay")) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.contains(focusedElement);
         var isModalAndTabbed = isTabbed && isModalChild;
         if (isChild || isModalAndTabbed) return;

package/es/components/Modal/index.js

@@ -145,6 +145,7 @@ var Modal = function Modal(_ref) {
       });
     };
   }, [visible, onClose, overlayID]);
+  if (!visible) return null;
   var component = /*#__PURE__*/React.createElement(Overlay, _extends({
     alignItems: "center",
     justifyContent: "center",
@@ -196,12 +197,9 @@ var Modal = function Modal(_ref) {
     headerContent: headerContent,
     overflow: overflow
   }, children), footerContent && /*#__PURE__*/React.createElement(FooterContent, null, footerContent)))));
-  var wrapper = visible && /*#__PURE__*/ReactDOM.createPortal(theme ? /*#__PURE__*/React.createElement(ThemeProvider, {
+  return /*#__PURE__*/ReactDOM.createPortal(theme ? /*#__PURE__*/React.createElement(ThemeProvider, {
     theme: theme
   }, component) : component, document.body);
-  return theme ? /*#__PURE__*/React.createElement(ThemeProvider, {
-    theme: theme
-  }, wrapper) : wrapper;
 };
 Modal.propTypes = {
   /** Specifies the children of the Modal */
@@ -245,164 +243,4 @@ Modal.defaultProps = {
   overlayID: "modal-overlay",
   modalID: "modal-container"
 };
-Modal.__docgenInfo = {
-  "description": "",
-  "methods": [],
-  "displayName": "Modal",
-  "props": {
-    "width": {
-      "defaultValue": {
-        "value": "\"350px\"",
-        "computed": false
-      },
-      "description": "Specifies the width of the Modal",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "height": {
-      "defaultValue": {
-        "value": "\"auto\"",
-        "computed": false
-      },
-      "description": "Specifies the height of the Modal",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "maxHeight": {
-      "defaultValue": {
-        "value": "\"90vh\"",
-        "computed": false
-      },
-      "description": "Specifies the max height of the Modal",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "maxWidth": {
-      "defaultValue": {
-        "value": "\"90vw\"",
-        "computed": false
-      },
-      "description": "Specifies the max width of the Modal",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "overlayID": {
-      "defaultValue": {
-        "value": "\"modal-overlay\"",
-        "computed": false
-      },
-      "description": "Specifies the id of the overlay element for targeting",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "modalID": {
-      "defaultValue": {
-        "value": "\"modal-container\"",
-        "computed": false
-      },
-      "description": "Specifies the id of the modal element for targeting",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "children": {
-      "description": "Specifies the children of the Modal",
-      "type": {
-        "name": "union",
-        "value": [{
-          "name": "element"
-        }, {
-          "name": "string"
-        }, {
-          "name": "node"
-        }]
-      },
-      "required": false
-    },
-    "headerContent": {
-      "description": "Specifies content for the header of the modal",
-      "type": {
-        "name": "union",
-        "value": [{
-          "name": "element"
-        }, {
-          "name": "node"
-        }]
-      },
-      "required": false
-    },
-    "footerContent": {
-      "description": "Specifies content for the header of the modal",
-      "type": {
-        "name": "union",
-        "value": [{
-          "name": "element"
-        }, {
-          "name": "node"
-        }]
-      },
-      "required": false
-    },
-    "minWidth": {
-      "description": "Specifies the min width of the Modal",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "minHeight": {
-      "description": "Specifies the min height of the Modal",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "visible": {
-      "description": "Specifies the visibility of the Modal",
-      "type": {
-        "name": "bool"
-      },
-      "required": false
-    },
-    "onClose": {
-      "description": "Specifies the function to run on clicking X icon. Ensure that this function will close Modal through the `visible` prop",
-      "type": {
-        "name": "func"
-      },
-      "required": false
-    },
-    "overflow": {
-      "description": "Specifies whether the Modal overflow is visible or not, default is `hidden`. If height is not enough, vertical scrollbar will be displayed (`overflow-y: auto`)",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "theme": {
-      "description": "Sets the theme for the Modal",
-      "type": {
-        "name": "object"
-      },
-      "required": false
-    },
-    "ariaLabel": {
-      "description": "Specifies the aria-label for the modal. Set this if headerContent is not defined as a string.",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    }
-  }
-};
 export default Modal;

package/es/components/Select/index.js

@@ -6,7 +6,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import React, { forwardRef } from "react";
 import PropTypes from "prop-types";
 import styled, { ThemeProvider, useTheme } from "styled-components";
-import { default as ReactSelect } from "react-select";
+import { default as ReactSelect, components } from "react-select";
 import AsyncSelect from "react-select/async";
 import CreatableSelect from "react-select/creatable";
 import { space, layout, compose } from "styled-system";
@@ -45,6 +45,20 @@ var Label = styled("label").withConfig({
     mb: "xs"
   });
 });
+var MultiValueRemove = function MultiValueRemove(props) {
+  var innerProps = props.innerProps,
+    data = props.data;
+  return /*#__PURE__*/React.createElement(components.MultiValueRemove, _objectSpread(_objectSpread({}, props), {}, {
+    innerProps: _objectSpread(_objectSpread({}, innerProps), {}, {
+      "aria-label": "Remove ".concat(data.label)
+    })
+  }));
+};
+var SELECT_TYPES = {
+  creatable: CreatableSelect,
+  async: AsyncSelect,
+  "default": ReactSelect
+};
 
 /**
  *
@@ -63,6 +77,7 @@ var Label = styled("label").withConfig({
  *
  */
 var Select = /*#__PURE__*/forwardRef(function (props, ref) {
+  var _SELECT_TYPES$props$s;
   var theme = useTheme();
   var inputRef = useInputFocus(ref, props.focus);
   var _props$updateStyles = props.updateStyles,
@@ -350,6 +365,10 @@ var Select = /*#__PURE__*/forwardRef(function (props, ref) {
       });
     }
   });
+  var components = _objectSpread({
+    MultiValueRemove: MultiValueRemove
+  }, (props === null || props === void 0 ? void 0 : props.components) || {});
+  var SelectComponent = (_SELECT_TYPES$props$s = SELECT_TYPES[props === null || props === void 0 ? void 0 : props.selectType]) !== null && _SELECT_TYPES$props$s !== void 0 ? _SELECT_TYPES$props$s : SELECT_TYPES["default"];
   var component = /*#__PURE__*/React.createElement(Wrapper, _extends({
     inverted: props.inverted,
     "data-testid": props["data-testid"]
@@ -361,7 +380,7 @@ var Select = /*#__PURE__*/forwardRef(function (props, ref) {
   }, props.label, props.mandatory && /*#__PURE__*/React.createElement(Small, {
     color: "danger",
     ml: "xs"
-  }, "*")), props.selectType === "creatable" ? /*#__PURE__*/React.createElement(CreatableSelect, _extends({
+  }, "*")), /*#__PURE__*/React.createElement(SelectComponent, _extends({
     ref: inputRef,
     styles: customStyles,
     theme: theme,
@@ -371,27 +390,9 @@ var Select = /*#__PURE__*/forwardRef(function (props, ref) {
     classNamePrefix: props.classNamePrefix,
     onChange: props.onChange,
     "aria-label": props.ariaLabel
-  }, props)) : props.selectType === "async" ? /*#__PURE__*/React.createElement(AsyncSelect, _extends({
-    ref: inputRef,
-    styles: customStyles,
-    theme: theme,
-    inputId: props.inputId,
-    inverted: props.inverted,
-    isMulti: props.isMulti,
-    classNamePrefix: props.classNamePrefix,
-    onChange: props.onChange,
-    "aria-label": props.ariaLabel
-  }, props)) : /*#__PURE__*/React.createElement(ReactSelect, _extends({
-    ref: inputRef,
-    styles: customStyles,
-    theme: theme,
-    inputId: props.inputId,
-    inverted: props.inverted,
-    isMulti: props.isMulti,
-    classNamePrefix: props.classNamePrefix,
-    onChange: props.onChange,
-    "aria-label": props.ariaLabel
-  }, props)));
+  }, props, {
+    components: components
+  })));
   return props.theme ? /*#__PURE__*/React.createElement(ThemeProvider, {
     theme: props.theme
   }, component) : component;
@@ -452,7 +453,9 @@ Select.propTypes = {
   /** Shows asterisk to denote a mandatory field */
   mandatory: PropTypes.bool,
   /** Focus on input */
-  focus: PropTypes.bool
+  focus: PropTypes.bool,
+  /** Allows overrides of react-select components */
+  components: PropTypes.object
 };
 Select.defaultProps = {
   selectType: "default"
@@ -624,6 +627,13 @@ Select.__docgenInfo = {
         "name": "bool"
       },
       "required": false
+    },
+    "components": {
+      "description": "Allows overrides of react-select components",
+      "type": {
+        "name": "object"
+      },
+      "required": false
     }
   }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "orcs-design-system",
-  "version": "3.1.33",
+  "version": "3.1.36",
   "engines": {
     "node": "18.17.1"
   },