zds-pickers 3.9.2 → 3.9.3

package/dist/pickers/MappingPicker.js

@@ -3,6 +3,8 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _zdsMappings = require("zds-mappings");
 var _Select = _interopRequireDefault(require("./Select"));var _excluded = ["allowClearing"];function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") {return { "default": obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj["default"] = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
 
+var longer = function longer(s) {return "".concat(s, " #### ### ######## #####");};
+
 var MappingPicker = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {var allowClearing = _ref.allowClearing,rest = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
   var stockMappings = (0, _zdsMappings.getStockNames)();
   var userMappings = (0, _zdsMappings.getUserMappingNames)();
@@ -11,7 +13,7 @@ var MappingPicker = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {va
     var result = allowClearing ?
     [{
       value: 'No Mapping',
-      label: /*#__PURE__*/_react["default"].createElement("span", { className: "zds-mappings-clear-mapping" }, "No Mapping")
+      label: /*#__PURE__*/_react["default"].createElement("span", { className: "zds-mappings-clear-mapping" }, longer('No Mapping'))
     }] :
     [];
 
@@ -20,14 +22,20 @@ var MappingPicker = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {va
 
     {
       label: allowClearing ? /*#__PURE__*/_react["default"].createElement("hr", null) : '',
-      options: userMappings.map(function (label) {return { value: label, label: /*#__PURE__*/_react["default"].createElement("span", { className: "zds-mappings-user-mapping" }, label) };})
+      options: userMappings.map(function (label) {return {
+          value: label,
+          label: /*#__PURE__*/_react["default"].createElement("span", { className: "zds-mappings-user-mapping" }, longer(label))
+        };})
     },
 
     {
       label: userMappings.length ? /*#__PURE__*/
       _react["default"].createElement("hr", null) :
       allowClearing ? /*#__PURE__*/_react["default"].createElement("hr", null) : '',
-      options: stockMappings.map(function (label) {return { label: label, value: label };})
+      options: stockMappings.map(function (label) {return {
+          label: longer(label),
+          value: label
+        };})
     }]);
 
   }, [allowClearing, stockMappings, userMappings]);

package/dist/pickers/Select.js

@@ -1,6 +1,7 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");var _typeof = require("@babel/runtime/helpers/typeof");Object.defineProperty(exports, "__esModule", { value: true });exports["default"] = void 0;var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _reactSelect = _interopRequireWildcard(require("react-select"));var _excluded = ["children"],_excluded2 = ["children"],_excluded3 = ["components", "disabled", "label", "onChange", "options", "shrinkLabel", "value"];function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") {return { "default": obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj["default"] = obj;if (cache) {cache.set(obj, newObj);}return newObj;}function ownKeys(object, enumerableOnly) {var keys = Object.keys(object);if (Object.getOwnPropertySymbols) {var symbols = Object.getOwnPropertySymbols(object);enumerableOnly && (symbols = symbols.filter(function (sym) {return Object.getOwnPropertyDescriptor(object, sym).enumerable;})), keys.push.apply(keys, symbols);}return keys;}function _objectSpread(target) {for (var i = 1; i < arguments.length; i++) {var source = null != arguments[i] ? arguments[i] : {};i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {(0, _defineProperty2["default"])(target, key, source[key]);}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));});}return target;}
+var _reactSelect = _interopRequireWildcard(require("react-select"));
+var _utils = require("../utils");var _excluded = ["children"],_excluded2 = ["children"],_excluded3 = ["components", "disabled", "label", "onChange", "options", "preserveMenuWidth", "shrinkLabel", "value"];function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") {return { "default": obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj["default"] = obj;if (cache) {cache.set(obj, newObj);}return newObj;}function ownKeys(object, enumerableOnly) {var keys = Object.keys(object);if (Object.getOwnPropertySymbols) {var symbols = Object.getOwnPropertySymbols(object);enumerableOnly && (symbols = symbols.filter(function (sym) {return Object.getOwnPropertyDescriptor(object, sym).enumerable;})), keys.push.apply(keys, symbols);}return keys;}function _objectSpread(target) {for (var i = 1; i < arguments.length; i++) {var source = null != arguments[i] ? arguments[i] : {};i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {(0, _defineProperty2["default"])(target, key, source[key]);}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));});}return target;}
 
 var IndicatorsContainer = _reactSelect.components.IndicatorsContainer,Placeholder = _reactSelect.components.Placeholder,ValueContainer = _reactSelect.components.ValueContainer;
 
@@ -57,7 +58,8 @@ var Select = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
 
 
 
-    props.components,disabled = props.disabled,label = props.label,onChange = props.onChange,options = props.options,shrinkLabel = props.shrinkLabel,value = props.value,rest = (0, _objectWithoutProperties2["default"])(props, _excluded3);
+
+    props.components,disabled = props.disabled,label = props.label,onChange = props.onChange,options = props.options,preserveMenuWidth = props.preserveMenuWidth,shrinkLabel = props.shrinkLabel,value = props.value,rest = (0, _objectWithoutProperties2["default"])(props, _excluded3);
 
   var handleChange = (0, _react.useCallback)(function (option) {
     onChange(option.value);
@@ -69,6 +71,40 @@ var Select = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
 
   var selectedOption = flatOptionsList.find(function (option) {return value === option.value;}) || undefined;
 
+  var styles = (0, _react.useMemo)(function () {
+    var base = preserveMenuWidth ?
+    {
+      menu: (0, _utils.omit)('width'),
+      menuList: (0, _utils.set)('overflowX', 'hidden'),
+      option: (0, _utils.set)('whiteSpace', 'nowrap')
+    } :
+    {};
+
+    return shrinkLabel ? _objectSpread(_objectSpread({},
+
+    base), {}, {
+      container: function container(provided /* , state */) {return _objectSpread(_objectSpread({},
+        provided), {}, {
+          marginTop: 10 });},
+
+      placeholder: function placeholder(provided, state) {return _objectSpread(_objectSpread({},
+        provided), {}, {
+          position: 'absolute',
+          left: state.hasValue || state.selectProps.inputValue ? -2 : '4%',
+          top: state.hasValue || state.selectProps.inputValue ? -12 : '50%',
+          transition: 'top 0.1s, font-size 0.1s, color 0.1s',
+          fontSize: (state.hasValue || state.selectProps.inputValue) && 13 });},
+
+      valueContainer: function valueContainer(provided /* , state */) {return _objectSpread(_objectSpread({},
+        provided), {}, {
+          overflow: 'visible' });} }) : _objectSpread({},
+
+
+
+    base);
+
+  }, [preserveMenuWidth, shrinkLabel]);
+
   return shrinkLabel ? /*#__PURE__*/
 
   _react["default"].createElement("div", { className: "zds-pickers__container" }, /*#__PURE__*/
@@ -85,24 +121,7 @@ var Select = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     options: options,
     placeholder: label,
     ref: ref,
-    styles: {
-      container: function container(provided /* , state */) {return _objectSpread(_objectSpread({},
-        provided), {}, {
-          marginTop: 10 });},
-
-      valueContainer: function valueContainer(provided /* , state */) {return _objectSpread(_objectSpread({},
-        provided), {}, {
-          overflow: 'visible' });},
-
-      placeholder: function placeholder(provided, state) {return _objectSpread(_objectSpread({},
-        provided), {}, {
-          position: 'absolute',
-          left: state.hasValue || state.selectProps.inputValue ? -2 : '4%',
-          top: state.hasValue || state.selectProps.inputValue ? -12 : '50%',
-          transition: 'top 0.1s, font-size 0.1s, color 0.1s',
-          fontSize: (state.hasValue || state.selectProps.inputValue) && 13 });}
-
-    },
+    styles: styles,
     value: selectedOption }))) : /*#__PURE__*/
 
 
@@ -121,6 +140,7 @@ var Select = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     onChange: handleChange,
     options: options,
     ref: ref,
+    styles: styles,
     value: selectedOption })));
 
 
@@ -133,6 +153,7 @@ Select.propTypes = {
   label: _propTypes["default"].string,
   onChange: _propTypes["default"].func.isRequired,
   options: _propTypes["default"].arrayOf(_propTypes["default"].object),
+  preserveMenuWidth: _propTypes["default"].bool,
   shrinkLabel: _propTypes["default"].bool,
   value: _propTypes["default"].any // PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
 };
@@ -142,6 +163,7 @@ Select.defaultProps = {
   disabled: false,
   label: undefined,
   options: [],
+  preserveMenuWidth: false,
   shrinkLabel: false,
   value: undefined
 };var _default =

package/dist/utils.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports, "__esModule", { value: true });exports.memoize = exports.findObj = exports.assertRange = exports.arraySequence = void 0; // this just creates and fills a zero-indexed array array; 0, 1, 2, 3, etc
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports, "__esModule", { value: true });exports.set = exports.pick = exports.omit = exports.memoize = exports.flatten = exports.findObj = exports.assertRange = exports.arraySequence = void 0;var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));function ownKeys(object, enumerableOnly) {var keys = Object.keys(object);if (Object.getOwnPropertySymbols) {var symbols = Object.getOwnPropertySymbols(object);enumerableOnly && (symbols = symbols.filter(function (sym) {return Object.getOwnPropertyDescriptor(object, sym).enumerable;})), keys.push.apply(keys, symbols);}return keys;}function _objectSpread(target) {for (var i = 1; i < arguments.length; i++) {var source = null != arguments[i] ? arguments[i] : {};i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {(0, _defineProperty2["default"])(target, key, source[key]);}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));});}return target;} // this just creates and fills a zero-indexed array array; 0, 1, 2, 3, etc
 var arraySequence = function arraySequence(numberOfElements) {return Array.from(Array(numberOfElements).keys());};exports.arraySequence = arraySequence;
 
 var assertRange = function assertRange(value) {var max = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 127;var min = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
@@ -12,6 +12,8 @@ var assertRange = function assertRange(value) {var max = arguments.length > 1 &&
 
 var findObj = function findObj(key, value) {return function (arr) {return arr === null || arr === void 0 ? void 0 : arr.find(function (item) {return (item === null || item === void 0 ? void 0 : item[key]) === value;});};};exports.findObj = findObj;
 
+var flatten = function flatten() {var arr = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];return arr.reduce(function (a, b) {return a.concat(b);}, []);};exports.flatten = flatten;
+
 var memoize = function memoize(functionParam) {
   var cacheMap = new Map();
 
@@ -22,4 +24,20 @@ var memoize = function memoize(functionParam) {
     cacheMap.set(key, resultSet);
     return resultSet;
   };
-};exports.memoize = memoize;
+};exports.memoize = memoize;
+
+var omit = function omit() {for (var _len = arguments.length, keys = new Array(_len), _key = 0; _key < _len; _key++) {keys[_key] = arguments[_key];}return function (obj) {return Object.entries(obj).
+    filter(function (_ref) {var _ref2 = (0, _slicedToArray2["default"])(_ref, 1),key = _ref2[0];return !flatten([].concat(keys)).
+      map(String).
+      includes(key);}).
+    reduce(function (_obj, _ref3) {var _ref4 = (0, _slicedToArray2["default"])(_ref3, 2),key = _ref4[0],val = _ref4[1];return Object.assign(_obj, (0, _defineProperty2["default"])({}, key, val));}, {});};};exports.omit = omit;
+
+var pick = function pick() {for (var _len2 = arguments.length, keys = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {keys[_key2] = arguments[_key2];}return function (obj) {return Object.entries(obj).
+    filter(function (_ref5) {var _ref6 = (0, _slicedToArray2["default"])(_ref5, 1),key = _ref6[0];return flatten([].concat(keys)).
+      map(String).
+      includes(key);}).
+    reduce(function (_obj, _ref7) {var _ref8 = (0, _slicedToArray2["default"])(_ref7, 2),key = _ref8[0],val = _ref8[1];return Object.assign(_obj, (0, _defineProperty2["default"])({}, key, val));}, {});};};exports.pick = pick;
+
+var set = function set(key, value) {return function (obj) {return _objectSpread(_objectSpread({},
+    obj), {}, (0, _defineProperty2["default"])({},
+    key, value));};};exports.set = set;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zds-pickers",
-  "version": "3.9.2",
+  "version": "3.9.3",
   "homepage": "https://github.com/dkadrios/zds-pickers#readme",
   "license": "MIT",
   "main": "dist/index.js",
@@ -65,20 +65,20 @@
     "eslint-plugin-prettier": "4.2.1",
     "eslint-plugin-react": "7.31.10",
     "eslint-plugin-react-hooks": "4.6.0",
+    "nebiru-react-rotary-knob": "1.1.8",
     "prop-types": "15.8.1",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "react-rotary-knob": "1.1.8",
-    "react-select": "5.5.4",
+    "react-select": "5.7.0",
     "reduce-css-calc": "2.1.8",
     "zds-mappings": "1.4.9"
   },
   "dependencies": {},
   "peerDependencies": {
     "classnames": "^2.3.2",
+    "nebiru-react-rotary-knob": "1.1.8",
     "prop-types": "^15.8.1",
     "react": ">=18.2.0",
-    "react-rotary-knob": "^1.1.8",
     "react-select": ">=5.5.4",
     "reduce-css-calc": ">=2.1.8",
     "zds-mappings": "^1.4.9"