@zohodesk/components 1.4.7 → 1.4.9

package/lib/MultiSelect/props/propTypes.js

@@ -56,11 +56,13 @@ var MultiSelect_propTypes = {
   getRef: _propTypes["default"].func,
   getTargetRef: _propTypes["default"].func,
   i18nKeys: _propTypes["default"].shape({
+    searchText: _propTypes["default"].string,
     clearText: _propTypes["default"].string,
     loadingText: _propTypes["default"].string,
     emptyText: _propTypes["default"].string,
     noMoreText: _propTypes["default"].string,
-    searchEmptyText: _propTypes["default"].string
+    searchEmptyText: _propTypes["default"].string,
+    limitReachedMessage: _propTypes["default"].string
   }),
   a11y: _propTypes["default"].shape({
     clearLabel: _propTypes["default"].string
@@ -135,7 +137,8 @@ var MultiSelect_propTypes = {
   isFocus: _propTypes["default"].bool,
   allowValueFallback: _propTypes["default"].bool,
   renderCustomClearComponent: _propTypes["default"].func,
-  renderCustomToggleIndicator: _propTypes["default"].oneOfType([_propTypes["default"].func, _propTypes["default"].node])
+  renderCustomToggleIndicator: _propTypes["default"].oneOfType([_propTypes["default"].func, _propTypes["default"].node]),
+  limit: _propTypes["default"].number
 };
 exports.MultiSelect_propTypes = MultiSelect_propTypes;
 var MultiSelectHeader_propTypes = {
@@ -176,7 +179,8 @@ var SelectedOptions_propTypes = {
   })),
   size: _propTypes["default"].oneOf(['medium', 'xmedium']),
   palette: _propTypes["default"].string,
-  dataId: _propTypes["default"].string
+  dataId: _propTypes["default"].string,
+  limit: _propTypes["default"].number
 };
 exports.SelectedOptions_propTypes = SelectedOptions_propTypes;
 var Suggestions_propTypes = {
@@ -207,7 +211,9 @@ var Suggestions_propTypes = {
     logo: _propTypes["default"].string,
     optionType: _propTypes["default"].string,
     listItemProps: _propTypes["default"].object
-  }))
+  })),
+  limit: _propTypes["default"].number,
+  limitReachedMessage: _propTypes["default"].string
 };
 exports.Suggestions_propTypes = Suggestions_propTypes;
 var AdvancedGroupMultiSelect_propTypes = (_AdvancedGroupMultiSe = {
@@ -226,7 +232,8 @@ var AdvancedGroupMultiSelect_propTypes = (_AdvancedGroupMultiSe = {
     loadingText: _propTypes["default"].string,
     emptyText: _propTypes["default"].string,
     noMoreText: _propTypes["default"].string,
-    searchEmptyText: _propTypes["default"].string
+    searchEmptyText: _propTypes["default"].string,
+    limitReachedMessage: _propTypes["default"].string
   }),
   a11y: _propTypes["default"].shape({
     clearLabel: _propTypes["default"].string
@@ -278,7 +285,7 @@ var AdvancedGroupMultiSelect_propTypes = (_AdvancedGroupMultiSe = {
   needToCloseOnSelect: _propTypes["default"].func,
   searchStr: _propTypes["default"].string,
   children: _propTypes["default"].node
-}, _defineProperty(_AdvancedGroupMultiSe, "dataSelectorId", _propTypes["default"].string), _defineProperty(_AdvancedGroupMultiSe, "isFocus", _propTypes["default"].bool), _defineProperty(_AdvancedGroupMultiSe, "allowValueFallback", _propTypes["default"].bool), _AdvancedGroupMultiSe);
+}, _defineProperty(_AdvancedGroupMultiSe, "dataSelectorId", _propTypes["default"].string), _defineProperty(_AdvancedGroupMultiSe, "isFocus", _propTypes["default"].bool), _defineProperty(_AdvancedGroupMultiSe, "allowValueFallback", _propTypes["default"].bool), _defineProperty(_AdvancedGroupMultiSe, "limit", _propTypes["default"].number), _AdvancedGroupMultiSe);
 exports.AdvancedGroupMultiSelect_propTypes = AdvancedGroupMultiSelect_propTypes;
 
 var AdvancedMultiSelect_propTypes = _objectSpread(_objectSpread({}, MultiSelect_propTypes), {}, {
@@ -293,70 +300,22 @@ var AdvancedMultiSelect_propTypes = _objectSpread(_objectSpread({}, MultiSelect_
   selectedOptions: _propTypes["default"].arrayOf(_propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number])).isRequired,
   selectedOptionsLimit: _propTypes["default"].number,
   getSelectedOptionDetails: _propTypes["default"].func,
-  emptyMessage: _propTypes["default"].string.isRequired,
-  isDisabled: _propTypes["default"].bool,
-  isReadOnly: _propTypes["default"].bool,
-  needLocalSearch: _propTypes["default"].bool,
-  needSelectAll: _propTypes["default"].bool,
-  onChange: _propTypes["default"].func.isRequired,
-  searchEmptyMessage: _propTypes["default"].string,
-  placeHolder: _propTypes["default"].string,
-  selectAllText: _propTypes["default"].string,
-  textField: _propTypes["default"].string,
-  valueField: _propTypes["default"].string,
   imageField: _propTypes["default"].string,
   iconName: _propTypes["default"].string,
   prefixText: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
   //For grouping multiSelect
   optionType: _propTypes["default"].oneOf(['default', 'avatar', 'icon']),
-  needEffect: _propTypes["default"].bool,
   secondaryField: _propTypes["default"].string,
-  animationStyle: _propTypes["default"].string,
-  defaultDropBoxPosition: _propTypes["default"].oneOf(['bottom', 'top', 'left', 'right']),
-  dropBoxSize: _propTypes["default"].oneOf(['small', 'medium', 'large']),
-  isAnimate: _propTypes["default"].bool,
-  size: _propTypes["default"].oneOf(['medium', 'xmedium']),
-  textBoxSize: _propTypes["default"].oneOf(['small', 'medium', 'xmedium']),
-  title: _propTypes["default"].string,
-  variant: _propTypes["default"].string,
   dataIdClearIcon: _propTypes["default"].string,
   dataIdLoading: _propTypes["default"].string,
   dataIdMultiSelectComp: _propTypes["default"].string,
   dataIdSelectAllEle: _propTypes["default"].string,
-
-  /**** Popup Props ****/
-  isPopupOpen: _propTypes["default"].bool,
-  isPopupReady: _propTypes["default"].bool,
-  togglePopup: _propTypes["default"].func,
-  getContainerRef: _propTypes["default"].func,
-  position: _propTypes["default"].string,
-  removeClose: _propTypes["default"].func,
   listItemSize: _propTypes["default"].oneOf(['small', 'medium', 'large']),
-  needBorder: _propTypes["default"].bool,
-  htmlId: _propTypes["default"].string,
-  i18nKeys: _propTypes["default"].shape({
-    clearText: _propTypes["default"].string,
-    loadingText: _propTypes["default"].string,
-    emptyText: _propTypes["default"].string,
-    noMoreText: _propTypes["default"].string,
-    searchEmptyText: _propTypes["default"].string
-  }),
-  a11y: _propTypes["default"].shape({
-    clearLabel: _propTypes["default"].string
-  }),
-  borderColor: _propTypes["default"].oneOf(['transparent', 'default', 'dark']),
-  isBoxPaddingNeed: _propTypes["default"].bool,
-  isSearchClearOnSelect: _propTypes["default"].bool,
-  disabledOptions: _propTypes["default"].arrayOf(_propTypes["default"].string),
-  getFooter: _propTypes["default"].func,
   customProps: _propTypes["default"].shape({
     SuggestionsProps: _propTypes["default"].object,
     DropBoxProps: _propTypes["default"].object
   }),
-  isLoading: _propTypes["default"].bool,
-  dataSelectorId: _propTypes["default"].string,
-  customClass: _propTypes["default"].object,
-  isFocus: _propTypes["default"].bool
+  customClass: _propTypes["default"].object
 });
 
 exports.AdvancedMultiSelect_propTypes = AdvancedMultiSelect_propTypes;

package/lib/Popup/Popup.js

@@ -236,7 +236,11 @@ var Popup = function Popup(Component) {
       _this.handleDropElementStyleUpdate = _this.handleDropElementStyleUpdate.bind(_assertThisInitialized(_this));
       _this.positionRef = /*#__PURE__*/_react["default"].createRef();
       _this.rootElement = _Registry["default"].getRootElement();
-      _this.popupObserver = new _ResizeObserver["default"](_this.handlePopupResize); //dropBoxSize
+      _this.popupObserver = new _ResizeObserver["default"](_this.handlePopupResize);
+      _this.cancelRaf = _this.cancelRaf.bind(_assertThisInitialized(_this));
+      _this.cancelPendingAnimationFrames = _this.cancelPendingAnimationFrames.bind(_assertThisInitialized(_this));
+      _this.setPositionRafId = null;
+      _this.resizePositionRafId = null; //dropBoxSize
 
       _this.size = null;
       _this.isTargetElementVisible = false;
@@ -262,18 +266,21 @@ var Popup = function Popup(Component) {
         groupPopups.push(this);
         _Registry["default"].popups[group] = groupPopups;
 
-        if (Object.keys(_Registry["default"].popups).length === 1 && groupPopups.length === 1) {
-          this.updateListeners(true, CLICK_EVENTS, document);
-          document.addEventListener('keyup', this.documentKeyupHandler, false); // document.addEventListener('scroll', this.handleScroll, true);
+        if (Object.keys(_Registry["default"].popups).length === 1 && groupPopups.length === 1 && _Registry["default"].listenerPopupRef === undefined) {
+          _Registry["default"].listenerPopupRef = this;
 
-          window.addEventListener('resize', this.handleResize);
-          document.addEventListener('mousedown', this.handleDocumentMouseDown, true);
-          document.addEventListener('focus', this.handleDocumentFocus, true);
+          _Registry["default"].listenerPopupRef.updateListeners(true, CLICK_EVENTS, document);
+
+          document.addEventListener('keyup', _Registry["default"].listenerPopupRef.documentKeyupHandler, false); // document.addEventListener('scroll', Registry.listenerPopupRef.handleScroll, true);
+
+          window.addEventListener('resize', _Registry["default"].listenerPopupRef.handleResize);
+          document.addEventListener('mousedown', _Registry["default"].listenerPopupRef.handleDocumentMouseDown, true);
+          document.addEventListener('focus', _Registry["default"].listenerPopupRef.handleDocumentFocus, true);
         }
       }
     }, {
-      key: "componentWillReceiveProps",
-      value: function componentWillReceiveProps(nextProps) {
+      key: "UNSAFE_componentWillReceiveProps",
+      value: function UNSAFE_componentWillReceiveProps(nextProps) {
         var isPopupOpen = this.state.isPopupOpen;
 
         if (typeof nextProps.isPopupOpen !== 'undefined' && nextProps.isPopupOpen !== isPopupOpen) {
@@ -337,6 +344,22 @@ var Popup = function Popup(Component) {
           this.handleIframeEventListeners(shouldAdd, CLICK_EVENTS);
         }
       }
+    }, {
+      key: "cancelRaf",
+      value: function cancelRaf(refName) {
+        var id = this[refName];
+
+        if (id) {
+          cancelAnimationFrame(id);
+          this[refName] = null;
+        }
+      }
+    }, {
+      key: "cancelPendingAnimationFrames",
+      value: function cancelPendingAnimationFrames() {
+        this.cancelRaf('setPositionRafId');
+        this.cancelRaf('resizePositionRafId');
+      }
     }, {
       key: "componentWillUnmount",
       value: function componentWillUnmount() {
@@ -371,14 +394,18 @@ var Popup = function Popup(Component) {
           this.popupObserver.disconnect();
         }
 
-        if (noPopups) {
-          this.updateListeners(false, CLICK_EVENTS, document);
-          document.removeEventListener('keyup', this.documentKeyupHandler); // document.removeEventListener('scroll', this.handleScroll);
+        if (noPopups && _Registry["default"].listenerPopupRef !== undefined) {
+          _Registry["default"].listenerPopupRef.updateListeners(false, CLICK_EVENTS, document);
 
-          window.removeEventListener('resize', this.handleResize);
-          document.removeEventListener('mousedown', this.handleDocumentMouseDown, true);
-          document.removeEventListener('focus', this.handleDocumentFocus, true);
+          document.removeEventListener('keyup', _Registry["default"].listenerPopupRef.documentKeyupHandler); // document.removeEventListener('scroll', Registry.listenerPopupRef.handleScroll);
+
+          window.removeEventListener('resize', _Registry["default"].listenerPopupRef.handleResize);
+          document.removeEventListener('mousedown', _Registry["default"].listenerPopupRef.handleDocumentMouseDown, true);
+          document.removeEventListener('focus', _Registry["default"].listenerPopupRef.handleDocumentFocus, true);
+          _Registry["default"].listenerPopupRef = undefined;
         }
+
+        this.cancelPendingAnimationFrames();
       }
     }, {
       key: "handleAddingScrollBlock",
@@ -906,13 +933,15 @@ var Popup = function Popup(Component) {
         }
 
         var setPosition = function setPosition() {
-          requestAnimationFrame(function () {
+          _this6.cancelRaf('setPositionRafId');
+
+          _this6.setPositionRafId = requestAnimationFrame(function () {
             var placeHolderElement = _this6.placeHolderElement,
                 dropElement = _this6.dropElement;
             var _this6$state = _this6.state,
                 position = _this6$state.position,
                 isPopupReady = _this6$state.isPopupReady;
-            var scrollContainer = placeHolderElement.closest('[data-scroll=true]') || document.body;
+            var scrollContainer = placeHolderElement ? placeHolderElement.closest('[data-scroll=true]') || document.body : document.body;
 
             var betterPosition = _viewPort["default"].betterView(dropElement, placeHolderElement, defaultPosition, scrollContainer, {
               needArrow: needArrow,
@@ -942,6 +971,8 @@ var Popup = function Popup(Component) {
                 _this6.updatePopupState(view, views, viewsOffset, targetOffset, popupOffset, isAbsolute);
               }
             }
+
+            _this6.setPositionRafId = null;
           });
         };
 
@@ -974,7 +1005,10 @@ var Popup = function Popup(Component) {
 
               if (placeHolderElement && dropElement) {
                 var scrollContainer = placeHolderElement.closest('[data-scroll=true]') || document.body;
-                requestAnimationFrame(function () {
+
+                _this7.cancelRaf('resizePositionRafId');
+
+                _this7.resizePositionRafId = requestAnimationFrame(function () {
                   var needArrow = _this7.getNeedArrow(popup);
 
                   var isAbsolute = _this7.getIsAbsolutePopup(popup);
@@ -1045,6 +1079,8 @@ var Popup = function Popup(Component) {
                   //   });
                   // }
 
+
+                  _this7.resizePositionRafId = null;
                 });
               }
             }

package/lib/Popup/Registry.js

@@ -10,6 +10,7 @@ var _Config = require("../Provider/Config.js");
 var Registry = {
   lastOpenedGroup: [],
   popups: {},
+  listenerPopupRef: undefined,
   scrollBlockedListenerPopupRef: undefined,
   scrollableListenerPopupRef: undefined,
   getOpenedPopups: function getOpenedPopups() {

package/lib/Select/Select.js

@@ -184,8 +184,8 @@ var SelectComponent = /*#__PURE__*/function (_Component) {
       //   suggestionContainer.addEventListener('scroll', this.handleScroll);
     }
   }, {
-    key: "componentWillReceiveProps",
-    value: function componentWillReceiveProps(nextProps) {
+    key: "UNSAFE_componentWillReceiveProps",
+    value: function UNSAFE_componentWillReceiveProps(nextProps) {
       var selectedValue = nextProps.selectedValue,
           isDefaultSelectValue = nextProps.isDefaultSelectValue,
           valueField = nextProps.valueField,

package/lib/Select/__tests__/Select.spec.js

@@ -294,7 +294,14 @@ describe('Select -', function () {
 
     expect(getAllByRole(listItemRole)).toHaveLength(1);
     expect(asFragment()).toMatchSnapshot();
-  });
+  }); // test('Should render the only options matching search value even with additional spaces before and after', () => {
+  //   const { getByRole, getAllByRole, asFragment, getByTestId } = render(<Select needSearch options={options} />);
+  //   userEvent.click(getByRole(selectInputRole));
+  //   userEvent.type(within(getByTestId(dropboxTestId)).getByRole('textbox'), '  2  ');
+  //   expect(getAllByRole(listItemRole)).toHaveLength(1);
+  //   expect(asFragment()).toMatchSnapshot();
+  // });
+
   test('Should trigger given onSearch, when type on the search input', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
     var mockOnSearch, _render15, getByRole, getByTestId;
 

package/lib/utils/dropDownUtils.js

@@ -52,6 +52,10 @@ var getOptionsOrder = function getOptionsOrder(props) {
   return props.optionsOrder || dummyArray;
 };
 
+var getLimit = function getLimit(props) {
+  return props.limit || 0;
+};
+
 var getSelectedOptionsSel = function getSelectedOptionsSel(props) {
   return props.selectedOptions || dummyArray;
 };
@@ -339,7 +343,7 @@ var makeFormatOptions = function makeFormatOptions() {
 exports.makeFormatOptions = makeFormatOptions;
 
 var makeGetMultiSelectSelectedOptions = function makeGetMultiSelectSelectedOptions() {
-  return (0, _reselect.createSelector)([getSelectedOptionsSel, getNormalizedFormatOptions, getSelectedOptionsLength, getAllowValueFallback], function (selectedOptions, normalizedFormatOptions, selectedOptionsLength, allowValueFallback) {
+  return (0, _reselect.createSelector)([getSelectedOptionsSel, getNormalizedFormatOptions, getSelectedOptionsLength, getAllowValueFallback, getLimit], function (selectedOptions, normalizedFormatOptions, selectedOptionsLength, allowValueFallback, limit) {
     var output = [];
     var revampSelectedOptions = [];
     var normalizedSelectedOptions = {};
@@ -367,6 +371,12 @@ var makeGetMultiSelectSelectedOptions = function makeGetMultiSelectSelectedOptio
       }
     }
 
+    if (limit && limit > 0) {
+      output = output.slice(0, limit);
+      revampSelectedOptions = revampSelectedOptions.slice(0, limit);
+      normalizedSelectedOptions = Object.fromEntries(Object.entries(normalizedSelectedOptions).slice(0, limit));
+    }
+
     return {
       formatSelectedOptions: output,
       normalizedSelectedOptions: normalizedSelectedOptions,
@@ -593,7 +603,8 @@ var filterSelectedOptions = function filterSelectedOptions() {
       _ref4$propSelectedOpt = _ref4.propSelectedOptions,
       propSelectedOptions = _ref4$propSelectedOpt === void 0 ? dummyArray : _ref4$propSelectedOpt,
       _ref4$disabledOptions = _ref4.disabledOptions,
-      disabledOptions = _ref4$disabledOptions === void 0 ? dummyArray : _ref4$disabledOptions;
+      disabledOptions = _ref4$disabledOptions === void 0 ? dummyArray : _ref4$disabledOptions,
+      limit = _ref4.limit;
 
   // eslint-disable-next-line no-param-reassign
   selectedOptions = selectedOptions || dummyArray; // eslint-disable-next-line no-param-reassign
@@ -617,8 +628,18 @@ var filterSelectedOptions = function filterSelectedOptions() {
 
     return true;
   });
+  var totalSelectedOptions = [].concat(_toConsumableArray(oldValidSelectedOptions), _toConsumableArray(newlyAddedOptions));
+
+  if (limit && limit > 0) {
+    if (totalSelectedOptions.length > limit) {
+      return {
+        newSelectedOptions: totalSelectedOptions.slice(0, limit)
+      };
+    }
+  }
+
   return {
-    newSelectedOptions: [].concat(_toConsumableArray(oldValidSelectedOptions), _toConsumableArray(newlyAddedOptions))
+    newSelectedOptions: totalSelectedOptions
   };
 };
 

package/lib/v1/Popup/Popup.js

@@ -186,8 +186,8 @@ var Popup = function Popup(Component) {
         }
       }
     }, {
-      key: "componentWillReceiveProps",
-      value: function componentWillReceiveProps(nextProps) {
+      key: "UNSAFE_componentWillReceiveProps",
+      value: function UNSAFE_componentWillReceiveProps(nextProps) {
         var isPopupOpen = this.state.isPopupOpen;
 
         if (typeof nextProps.isPopupOpen !== 'undefined' && nextProps.isPopupOpen !== isPopupOpen) {

package/lib/v1/Select/Select.js

@@ -185,8 +185,8 @@ var SelectComponent = /*#__PURE__*/function (_Component) {
       //   suggestionContainer.addEventListener('scroll', this.handleScroll);
     }
   }, {
-    key: "componentWillReceiveProps",
-    value: function componentWillReceiveProps(nextProps) {
+    key: "UNSAFE_componentWillReceiveProps",
+    value: function UNSAFE_componentWillReceiveProps(nextProps) {
       var selectedValue = nextProps.selectedValue,
           isDefaultSelectValue = nextProps.isDefaultSelectValue,
           valueField = nextProps.valueField,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/components",
-  "version": "1.4.7",
+  "version": "1.4.9",
   "main": "es/index.js",
   "module": "es/index.js",
   "private": false,
@@ -18,9 +18,10 @@
   ],
   "scripts": {
     "build:docs": "react-cli build:docs",
-    "lint": "react-cli lint",
+    "_lint": "react-cli lint",
     "lintAll": "react-cli lint ./src",
     "lintAllFix": "npm run lintAll --eslint:fix=true",
+    "lint": "npx eslint ./src",
     "clean": "react-cli clean build unittest coverage es lib assets && mkdir assets",
     "dubCheck": "node ./node_modules/@zohodesk-private/node-plugins/es/dublication_css_file_finder  node_modules/@zohodesk/icons/es node_modules/@zohodesk/variables/es",
     "init": "npm run clean && cd ../assets && npm run componentsassets && cd ../components && npm run build:variables",
@@ -47,7 +48,7 @@
     "snap-update": "npm run test-clean && npm run test -- -u",
     "sstest": "npm run init && react-cli sstest",
     "build:external": "npm run clean &&  npm run init  && npm run docsjs:build && npm run build:externalDocCopy && react-cli build:component:umd && npm run externalDocHTMLChange",
-    "download": "react-cli clean ./node_modules ./package-lock.json && npm install",
+    "download": "react-cli clean ./node_modules ./package-lock.json && npm install && cd ../ && npm run download",
     "expublish": "npm publish --tag experimental-version",
     "css:lineheight:validate": "node ./node_modules/@zohodesk-private/node-plugins/es/lineheight_automation/lineHeightErrorCheck.js ./src/",
     "cssVariableConvert": "react-cli variableConverter ./lib ./lib && react-cli variableConverter ./es ./es",
@@ -73,21 +74,22 @@
     "@testing-library/react-hooks": "^7.0.2",
     "@testing-library/user-event": "^13.0.10",
     "@zohodesk-private/color-variable-preprocessor": "1.2.0",
-    "@zohodesk-private/css-variable-migrator": "^1.0.8",
+    "@zohodesk-private/css-variable-migrator": "1.0.9",
     "@zohodesk-private/node-plugins": "1.1.13",
     "@zohodesk-private/react-prop-validator": "1.2.3",
-    "@zohodesk/a11y": "2.3.6",
+    "@zohodesk/a11y": "2.3.7",
     "@zohodesk/docstool": "1.0.0-alpha-2",
     "@zohodesk/dotkit": "1.0.3",
     "@zohodesk/hooks": "2.0.5",
     "@zohodesk/icons": "1.1.0",
     "@zohodesk/layout": "3.1.0",
-    "@zohodesk/svg": "1.2.1",
+    "@zohodesk/svg": "1.2.2",
     "@zohodesk/utils": "1.3.14",
     "@zohodesk/variables": "1.1.0",
     "@zohodesk/virtualizer": "1.0.3",
     "react-sortable-hoc": "^0.8.3",
-    "velocity-react": "1.4.3"
+    "velocity-react": "1.4.3",
+    "@zohodesk/react-cli": "1.1.27"
   },
   "dependencies": {
     "hoist-non-react-statics": "3.0.1",
@@ -98,13 +100,13 @@
   "peerDependencies": {
     "@zohodesk/icons": "1.1.0",
     "@zohodesk/variables": "1.1.0",
-    "@zohodesk/svg": "1.2.1",
+    "@zohodesk/svg": "1.2.2",
     "@zohodesk/virtualizer": "1.0.3",
     "velocity-react": "1.4.3",
     "react-sortable-hoc": "^0.8.3",
     "@zohodesk/hooks": "2.0.5",
     "@zohodesk/utils": "1.3.14",
-    "@zohodesk/a11y": "2.3.6",
+    "@zohodesk/a11y": "2.3.7",
     "@zohodesk/layout": "3.1.0",
     "@zohodesk/dotkit": "1.0.3"
   }