@nulogy/components 8.4.7 → 8.6.0

package/dist/main.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('styled-components'), require('@babel/runtime/helpers/typeof'), require('@babel/runtime/helpers/classCallCheck'), require('@babel/runtime/helpers/createClass'), require('@babel/runtime/helpers/defineProperty'), require('object-assign'), require('@nulogy/icons'), require('@babel/runtime/helpers/extends'), require('@babel/runtime/helpers/assertThisInitialized'), require('@babel/runtime/helpers/inheritsLoose'), require('prop-types'), require('react-fast-compare'), require('warning'), require('@babel/runtime/helpers/slicedToArray'), require('@babel/runtime/helpers/objectWithoutPropertiesLoose'), require('deep-equal'), require('create-react-context'), require('react-resize-detector'), require('react-windowed-select'), require('regenerator-runtime'), require('react-dom'), require('exenv'), require('smoothscroll-polyfill'), require('classnames'), require('@babel/runtime/helpers/toConsumableArray'), require('react-input-autosize'), require('@babel/runtime/helpers/taggedTemplateLiteral')) :
-  typeof define === 'function' && define.amd ? define(['exports', 'react', 'styled-components', '@babel/runtime/helpers/typeof', '@babel/runtime/helpers/classCallCheck', '@babel/runtime/helpers/createClass', '@babel/runtime/helpers/defineProperty', 'object-assign', '@nulogy/icons', '@babel/runtime/helpers/extends', '@babel/runtime/helpers/assertThisInitialized', '@babel/runtime/helpers/inheritsLoose', 'prop-types', 'react-fast-compare', 'warning', '@babel/runtime/helpers/slicedToArray', '@babel/runtime/helpers/objectWithoutPropertiesLoose', 'deep-equal', 'create-react-context', 'react-resize-detector', 'react-windowed-select', 'regenerator-runtime', 'react-dom', 'exenv', 'smoothscroll-polyfill', 'classnames', '@babel/runtime/helpers/toConsumableArray', 'react-input-autosize', '@babel/runtime/helpers/taggedTemplateLiteral'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.NDSComponents = {}, global.React, global.styled, global.typeof, global.classCallCheck, global.createClass, global.defineProperty, global.assign, global.icons, global.extends, global.assertThisInitialized, global.inheritsLoose, global.PropTypes, global.isEqual, global.warning, global.slicedToArray, global.objectWithoutPropertiesLoose, global.deepEqual, global.createReactContext, global.ReactResizeDetector, global.components, global.regeneratorRuntime, global.reactDom, global.exenv, global.smoothscroll, global.t, null, global.AutosizeInput));
-}(this, (function (exports, React, styled, _typeof$1, _classCallCheck$1, _createClass$1, _defineProperty$1, assign$1, icons, _extends$4, _assertThisInitialized$2, _inheritsLoose$2, PropTypes, isEqual$2, warning$1, _slicedToArray$1, _objectWithoutPropertiesLoose$2, deepEqual, createContext, ReactResizeDetector, WindowedSelect, regeneratorRuntime, reactDom, exenv, smoothscroll, t, toConsumableArray, AutosizeInput) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('styled-components'), require('@babel/runtime/helpers/typeof'), require('@babel/runtime/helpers/classCallCheck'), require('@babel/runtime/helpers/createClass'), require('@babel/runtime/helpers/defineProperty'), require('object-assign'), require('@nulogy/icons'), require('@babel/runtime/helpers/extends'), require('@babel/runtime/helpers/assertThisInitialized'), require('@babel/runtime/helpers/inheritsLoose'), require('prop-types'), require('react-fast-compare'), require('warning'), require('@babel/runtime/helpers/slicedToArray'), require('@babel/runtime/helpers/objectWithoutPropertiesLoose'), require('deep-equal'), require('create-react-context'), require('react-resize-detector'), require('react-windowed-select'), require('react-dom'), require('exenv'), require('smoothscroll-polyfill'), require('classnames'), require('@babel/runtime/helpers/toConsumableArray'), require('react-input-autosize'), require('@babel/runtime/helpers/taggedTemplateLiteral')) :
+  typeof define === 'function' && define.amd ? define(['exports', 'react', 'styled-components', '@babel/runtime/helpers/typeof', '@babel/runtime/helpers/classCallCheck', '@babel/runtime/helpers/createClass', '@babel/runtime/helpers/defineProperty', 'object-assign', '@nulogy/icons', '@babel/runtime/helpers/extends', '@babel/runtime/helpers/assertThisInitialized', '@babel/runtime/helpers/inheritsLoose', 'prop-types', 'react-fast-compare', 'warning', '@babel/runtime/helpers/slicedToArray', '@babel/runtime/helpers/objectWithoutPropertiesLoose', 'deep-equal', 'create-react-context', 'react-resize-detector', 'react-windowed-select', 'react-dom', 'exenv', 'smoothscroll-polyfill', 'classnames', '@babel/runtime/helpers/toConsumableArray', 'react-input-autosize', '@babel/runtime/helpers/taggedTemplateLiteral'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.NDSComponents = {}, global.React, global.styled, global.typeof, global.classCallCheck, global.createClass, global.defineProperty, global.assign, global.icons, global.extends, global.assertThisInitialized, global.inheritsLoose, global.PropTypes, global.isEqual, global.warning, global.slicedToArray, global.objectWithoutPropertiesLoose, global.deepEqual, global.createReactContext, global.ReactResizeDetector, global.components, global.reactDom, global.exenv, global.smoothscroll, global.t, null, global.AutosizeInput));
+}(this, (function (exports, React, styled, _typeof$1, _classCallCheck$1, _createClass$1, _defineProperty$1, assign$1, icons, _extends$4, _assertThisInitialized$2, _inheritsLoose$2, PropTypes, isEqual$2, warning$1, _slicedToArray$1, _objectWithoutPropertiesLoose$2, deepEqual, createContext, ReactResizeDetector, WindowedSelect, reactDom, exenv, smoothscroll, t, toConsumableArray, AutosizeInput) { 'use strict';
 
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -47,7 +47,6 @@
   var createContext__default = /*#__PURE__*/_interopDefaultLegacy(createContext);
   var ReactResizeDetector__default = /*#__PURE__*/_interopDefaultLegacy(ReactResizeDetector);
   var WindowedSelect__default = /*#__PURE__*/_interopDefaultLegacy(WindowedSelect);
-  var regeneratorRuntime__default = /*#__PURE__*/_interopDefaultLegacy(regeneratorRuntime);
   var reactDom__default = /*#__PURE__*/_interopDefaultLegacy(reactDom);
   var exenv__default = /*#__PURE__*/_interopDefaultLegacy(exenv);
   var smoothscroll__default = /*#__PURE__*/_interopDefaultLegacy(smoothscroll);
@@ -11751,16 +11750,6 @@
                   t[p[i]] = s[p[i]];
           }
       return t;
-  }
-
-  function __awaiter(thisArg, _arguments, P, generator) {
-      function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-      return new (P || (P = Promise))(function (resolve, reject) {
-          function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-          function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-          function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-          step((generator = generator.apply(thisArg, _arguments || [])).next());
-      });
   }
 
   var prefix = "random-id-";
@@ -20242,7 +20231,9 @@
         hideDelay = _a$hideDelay === void 0 ? "200" : _a$hideDelay,
         openAriaLabel = _a.openAriaLabel,
         closeAriaLabel = _a.closeAriaLabel,
-        props = __rest(_a, ["trigger", "children", "showArrow", "disabled", "defaultOpen", "backgroundColor", "placement", "className", "id", "boundariesElement", "showDelay", "hideDelay", "openAriaLabel", "closeAriaLabel"]);
+        _a$openOnHover = _a.openOnHover,
+        openOnHover = _a$openOnHover === void 0 ? false : _a$openOnHover,
+        props = __rest(_a, ["trigger", "children", "showArrow", "disabled", "defaultOpen", "backgroundColor", "placement", "className", "id", "boundariesElement", "showDelay", "hideDelay", "openAriaLabel", "closeAriaLabel", "openOnHover"]);
 
     var spaceProps = getSubset(props, propTypes.space);
     var restProps = omitSubset(props, propTypes.space);
@@ -20262,9 +20253,9 @@
       popperPlacement: placement,
       defaultOpen: defaultOpen,
       showArrow: showArrow,
-      openOnClick: true,
+      openOnClick: !openOnHover,
       ref: ref,
-      openOnHover: false,
+      openOnHover: openOnHover,
       modifiers: modifiers,
       backgroundColor: backgroundColor,
       borderColor: backgroundColor,
@@ -23006,8 +22997,6 @@
     }), /*#__PURE__*/React__default['default'].createElement(WindowedSelect.components.Option, Object.assign({}, props)));
   };
 
-  var regenerator = regeneratorRuntime__default['default'];
-
   var getBorderColor = function getBorderColor(_ref) {
     var errored = _ref.errored,
         disabled = _ref.disabled,
@@ -23221,20 +23210,6 @@
     };
   };
 
-  var extractValuesFromCsvString = function extractValuesFromCsvString(csv) {
-    var quoteRegEx = /(["'])(?:(?=(\\?))\2.)*?\1/gim;
-    var matchedValues = csv.match(quoteRegEx) || [];
-    var quotedValues = matchedValues.map(function (str) {
-      return str.replace(/(["',])/g, "");
-    });
-    var values = Array.from(new Set(csv.replace(quoteRegEx, "").split(",").map(function (value) {
-      return value.trim();
-    }).filter(function (str) {
-      return str.length > 0;
-    }).concat(quotedValues)));
-    return values;
-  };
-
   var SelectControl = function SelectControl(props) {
     // eslint-disable-next-line react/prop-types
     var isFocused = props.isFocused;
@@ -23347,62 +23322,6 @@
     var handleChange = React__default['default'].useCallback(function (option) {
       onChange && onChange(extractValue(option, multiselect));
     }, [multiselect, onChange]);
-    var handlePaste = React__default['default'].useCallback(function (e) {
-      return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee() {
-        var options, currentRef, currentValue, clipboardData, values, notExistingOptions, pastedOptions, newValue;
-        return regenerator.wrap(function _callee$(_context) {
-          while (1) {
-            switch (_context.prev = _context.next) {
-              case 0:
-                e.preventDefault();
-                options = optionsRef.current;
-                currentRef = reactSelectRef.current;
-                currentValue = currentRef.state.value || [];
-                clipboardData = e.clipboardData.getData("text/plain") || "";
-                values = extractValuesFromCsvString(clipboardData);
-                notExistingOptions = [];
-                pastedOptions = values.map(function (pastedOption) {
-                  var existingOption = options.find(function (option) {
-                    return option.label === pastedOption || option.value === pastedOption;
-                  });
-
-                  if (existingOption) {
-                    return existingOption;
-                  }
-
-                  notExistingOptions.push(pastedOption);
-                  return null;
-                }).filter(Boolean).filter(function (pastedOption) {
-                  return (// ignoring already selected options
-                    currentValue.findIndex(function (option) {
-                      return pastedOption.value === option.value;
-                    }) === -1
-                  );
-                });
-                newValue = [].concat(currentValue, pastedOptions);
-                currentRef.setState(function (prevState) {
-                  return Object.assign(Object.assign({}, prevState), {
-                    value: newValue,
-                    inputValue: notExistingOptions.join(", ")
-                  });
-                });
-                handleChange(newValue);
-
-              case 11:
-              case "end":
-                return _context.stop();
-            }
-          }
-        }, _callee);
-      }));
-    }, []);
-
-    var _SelectInput = React__default['default'].useCallback(function (inputProps) {
-      return /*#__PURE__*/React__default['default'].createElement(SelectInput, Object.assign({}, inputProps, multiselect ? {
-        onPaste: handlePaste
-      } : {}));
-    }, [multiselect]);
-
     React__default['default'].useEffect(function () {
       if (ref) {
         // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -23443,7 +23362,7 @@
         DropdownIndicator: SelectDropdownIndicator,
         SelectContainer: SelectContainer$1,
         Menu: SelectMenu,
-        Input: _SelectInput
+        Input: SelectInput
       }, components),
       "aria-label": ariaLabel,
       options: options,

package/dist/main.module.js

@@ -19,7 +19,6 @@ import deepEqual from 'deep-equal';
 import createContext$1 from 'create-react-context';
 import ReactResizeDetector from 'react-resize-detector';
 import WindowedSelect, { components as components$1 } from 'react-windowed-select';
-import regeneratorRuntime from 'regenerator-runtime';
 import reactDom, { findDOMNode, createPortal } from 'react-dom';
 import exenv from 'exenv';
 import smoothscroll from 'smoothscroll-polyfill';
@@ -11725,16 +11724,6 @@ function __rest(s, e) {
                 t[p[i]] = s[p[i]];
         }
     return t;
-}
-
-function __awaiter(thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
 }
 
 var prefix = "random-id-";
@@ -20216,7 +20205,9 @@ var DropdownMenu = /*#__PURE__*/React__default.forwardRef(function (_a, ref) {
       hideDelay = _a$hideDelay === void 0 ? "200" : _a$hideDelay,
       openAriaLabel = _a.openAriaLabel,
       closeAriaLabel = _a.closeAriaLabel,
-      props = __rest(_a, ["trigger", "children", "showArrow", "disabled", "defaultOpen", "backgroundColor", "placement", "className", "id", "boundariesElement", "showDelay", "hideDelay", "openAriaLabel", "closeAriaLabel"]);
+      _a$openOnHover = _a.openOnHover,
+      openOnHover = _a$openOnHover === void 0 ? false : _a$openOnHover,
+      props = __rest(_a, ["trigger", "children", "showArrow", "disabled", "defaultOpen", "backgroundColor", "placement", "className", "id", "boundariesElement", "showDelay", "hideDelay", "openAriaLabel", "closeAriaLabel", "openOnHover"]);
 
   var spaceProps = getSubset(props, propTypes.space);
   var restProps = omitSubset(props, propTypes.space);
@@ -20236,9 +20227,9 @@ var DropdownMenu = /*#__PURE__*/React__default.forwardRef(function (_a, ref) {
     popperPlacement: placement,
     defaultOpen: defaultOpen,
     showArrow: showArrow,
-    openOnClick: true,
+    openOnClick: !openOnHover,
     ref: ref,
-    openOnHover: false,
+    openOnHover: openOnHover,
     modifiers: modifiers,
     backgroundColor: backgroundColor,
     borderColor: backgroundColor,
@@ -22980,8 +22971,6 @@ var SelectOption = function SelectOption(props) {
   }), /*#__PURE__*/React__default.createElement(components$1.Option, Object.assign({}, props)));
 };
 
-var regenerator = regeneratorRuntime;
-
 var getBorderColor = function getBorderColor(_ref) {
   var errored = _ref.errored,
       disabled = _ref.disabled,
@@ -23195,20 +23184,6 @@ var customStyles = function customStyles(_ref4) {
   };
 };
 
-var extractValuesFromCsvString = function extractValuesFromCsvString(csv) {
-  var quoteRegEx = /(["'])(?:(?=(\\?))\2.)*?\1/gim;
-  var matchedValues = csv.match(quoteRegEx) || [];
-  var quotedValues = matchedValues.map(function (str) {
-    return str.replace(/(["',])/g, "");
-  });
-  var values = Array.from(new Set(csv.replace(quoteRegEx, "").split(",").map(function (value) {
-    return value.trim();
-  }).filter(function (str) {
-    return str.length > 0;
-  }).concat(quotedValues)));
-  return values;
-};
-
 var SelectControl = function SelectControl(props) {
   // eslint-disable-next-line react/prop-types
   var isFocused = props.isFocused;
@@ -23321,62 +23296,6 @@ var ReactSelect = /*#__PURE__*/React__default.forwardRef(function (_a, ref) {
   var handleChange = React__default.useCallback(function (option) {
     onChange && onChange(extractValue(option, multiselect));
   }, [multiselect, onChange]);
-  var handlePaste = React__default.useCallback(function (e) {
-    return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee() {
-      var options, currentRef, currentValue, clipboardData, values, notExistingOptions, pastedOptions, newValue;
-      return regenerator.wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              e.preventDefault();
-              options = optionsRef.current;
-              currentRef = reactSelectRef.current;
-              currentValue = currentRef.state.value || [];
-              clipboardData = e.clipboardData.getData("text/plain") || "";
-              values = extractValuesFromCsvString(clipboardData);
-              notExistingOptions = [];
-              pastedOptions = values.map(function (pastedOption) {
-                var existingOption = options.find(function (option) {
-                  return option.label === pastedOption || option.value === pastedOption;
-                });
-
-                if (existingOption) {
-                  return existingOption;
-                }
-
-                notExistingOptions.push(pastedOption);
-                return null;
-              }).filter(Boolean).filter(function (pastedOption) {
-                return (// ignoring already selected options
-                  currentValue.findIndex(function (option) {
-                    return pastedOption.value === option.value;
-                  }) === -1
-                );
-              });
-              newValue = [].concat(currentValue, pastedOptions);
-              currentRef.setState(function (prevState) {
-                return Object.assign(Object.assign({}, prevState), {
-                  value: newValue,
-                  inputValue: notExistingOptions.join(", ")
-                });
-              });
-              handleChange(newValue);
-
-            case 11:
-            case "end":
-              return _context.stop();
-          }
-        }
-      }, _callee);
-    }));
-  }, []);
-
-  var _SelectInput = React__default.useCallback(function (inputProps) {
-    return /*#__PURE__*/React__default.createElement(SelectInput, Object.assign({}, inputProps, multiselect ? {
-      onPaste: handlePaste
-    } : {}));
-  }, [multiselect]);
-
   React__default.useEffect(function () {
     if (ref) {
       // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -23417,7 +23336,7 @@ var ReactSelect = /*#__PURE__*/React__default.forwardRef(function (_a, ref) {
       DropdownIndicator: SelectDropdownIndicator,
       SelectContainer: SelectContainer$1,
       Menu: SelectMenu,
-      Input: _SelectInput
+      Input: SelectInput
     }, components),
     "aria-label": ariaLabel,
     options: options,

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

@@ -14,6 +14,7 @@ declare type DropdownMenuProps = {
     boundariesElement?: string;
     openAriaLabel?: string;
     closeAriaLabel?: string;
+    openOnHover?: boolean;
 } & StyledProps;
 declare const DropdownMenu: React.FC<DropdownMenuProps>;
 export default DropdownMenu;

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

@@ -35,6 +35,12 @@ export declare const SetToDefaultOpen: {
         name: string;
     };
 };
+export declare const WithSubmenu: {
+    (): JSX.Element;
+    story: {
+        name: string;
+    };
+};
 export declare const WithVisitedLinks: () => JSX.Element;
 export declare const SetToDisabled: {
     (): JSX.Element;

package/dist/src/Select/Select.story.d.ts

@@ -108,5 +108,3 @@ export declare const UsingRefToControlFocus: {
     };
 };
 export declare const WithCustomProps: () => JSX.Element;
-export declare const PasteCsvValueInSelect: (props: any) => JSX.Element;
-export declare const AddNewOptionOnInputChange: (props: any) => JSX.Element;

package/package.json

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

package/dist/src/Select/selectHelpers.d.ts

@@ -1 +0,0 @@
-export declare const extractValuesFromCsvString: (csv: string) => string[];

package/dist/src/Select/selectHelpers.spec.d.ts

@@ -1 +0,0 @@
-export {};