fix(deps): update dependency @zendeskgarden/container-utilities to v2 (#1686)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: george treviranus <geowtrev@gmail.com>
Co-authored-by: Jonathan Zempel <jzempel@gmail.com>

Author: 3 people

.github/renovate.json

@@ -1,7 +1,7 @@
 {
   "extends": ["config:base"],
   "rebaseStalePrs": true,
-  "ignorePaths": ["**/node_modules/**"],
+  "ignorePaths": ["**/node_modules/**", "packages/dropdowns"],
   "schedule": ["on Monday every 9 weeks of the year starting on the 5th week"],
   "labels": ["PR: Internal :seedling:"],
   "postUpdateOptions": ["npmDedupe"],

package-lock.json

@@ -22,7 +22,7 @@
   "types": "dist/typings/index.d.ts",
   "dependencies": {
     "@zendeskgarden/container-accordion": "^3.0.0",
-    "@zendeskgarden/container-utilities": "^1.0.0",
+    "@zendeskgarden/container-utilities": "^2.0.0",
     "polished": "^4.0.0",
     "prop-types": "^15.5.7"
   },

packages/accordions/package.json

@@ -22,7 +22,7 @@
   "types": "dist/typings/index.d.ts",
   "dependencies": {
     "@zendeskgarden/container-selection": "^3.0.0",
-    "@zendeskgarden/container-utilities": "^1.0.6",
+    "@zendeskgarden/container-utilities": "^2.0.0",
     "polished": "^4.0.0",
     "prop-types": "^15.5.7",
     "react-merge-refs": "^1.1.0"

packages/buttons/package.json

@@ -22,7 +22,7 @@
   "types": "dist/typings/index.d.ts",
   "dependencies": {
     "@zendeskgarden/container-accordion": "^2.0.0",
-    "@zendeskgarden/container-utilities": "^1.0.0",
+    "@zendeskgarden/container-utilities": "^2.0.0",
     "dom-helpers": "^5.2.1",
     "polished": "^4.0.0",
     "prop-types": "^15.5.7",

packages/chrome/package.json

@@ -22,7 +22,7 @@
   "types": "dist/typings/index.d.ts",
   "dependencies": {
     "@zendeskgarden/container-grid": "^0.1.1",
-    "@zendeskgarden/container-utilities": "^1.0.0",
+    "@zendeskgarden/container-utilities": "^2.0.0",
     "@zendeskgarden/react-buttons": "^8.74.0",
     "@zendeskgarden/react-forms": "^8.74.0",
     "@zendeskgarden/react-modals": "^8.74.0",

packages/colorpickers/package.json

@@ -21,7 +21,7 @@
   "sideEffects": false,
   "types": "dist/typings/index.d.ts",
   "dependencies": {
-    "@zendeskgarden/container-utilities": "^1.0.0",
+    "@zendeskgarden/container-utilities": "^2.0.0",
     "date-fns": "^2.0.0-beta.2",
     "prop-types": "^15.5.7",
     "react-popper": "^1.3.4"

packages/datepickers/package.json

@@ -10,7 +10,7 @@ import userEvent from '@testing-library/user-event';
 import { render, renderRtl, fireEvent, act } from 'garden-test-utils';
 import { addDays, subDays } from 'date-fns';
 import mockDate from 'mockdate';
-import { KEY_CODES } from '@zendeskgarden/container-utilities';
+import { KEYS } from '@zendeskgarden/container-utilities';
 import { Datepicker } from './Datepicker';
 import { IDatepickerProps } from '../../types';
 
@@ -304,11 +304,11 @@ describe('Datepicker', () => {
       );
       const input = getByTestId('input');
 
-      fireEvent.keyDown(input, { keyCode: KEY_CODES.UP });
+      fireEvent.keyDown(input, { key: KEYS.UP });
       expect(queryByTestId('datepicker-menu')).toHaveAttribute('data-test-open', 'true');
       await user.tab();
 
-      fireEvent.keyDown(input, { keyCode: KEY_CODES.DOWN });
+      fireEvent.keyDown(input, { key: KEYS.DOWN });
       expect(queryByTestId('datepicker-menu')).toHaveAttribute('data-test-open', 'true');
       await user.tab();
 
@@ -324,12 +324,12 @@ describe('Datepicker', () => {
       const input = getByTestId('input');
 
       await user.click(input);
-      fireEvent.keyDown(input, { keyCode: KEY_CODES.ESCAPE });
+      fireEvent.keyDown(input, { key: KEYS.ESCAPE });
 
       expect(queryByTestId('datepicker-menu')).toHaveAttribute('data-test-open', 'false');
 
       await user.click(input);
-      fireEvent.keyDown(input, { keyCode: KEY_CODES.ENTER });
+      fireEvent.keyDown(input, { key: KEYS.ENTER });
 
       expect(queryByTestId('datepicker-menu')).toHaveAttribute('data-test-open', 'false');
     });

packages/datepickers/src/elements/Datepicker/Datepicker.spec.tsx

@@ -18,7 +18,7 @@ import React, {
 import PropTypes from 'prop-types';
 import { ThemeContext } from 'styled-components';
 import { Manager, Popper, Reference } from 'react-popper';
-import { KEY_CODES, composeEventHandlers } from '@zendeskgarden/container-utilities';
+import { KEYS, composeEventHandlers } from '@zendeskgarden/container-utilities';
 import { IDatepickerProps, PLACEMENT, PopperPlacement, WEEK_STARTS_ON } from '../../types';
 import { getRtlPopperPlacement, getPopperPlacement } from './utils/garden-placements';
 import { Calendar } from './components/Calendar';
@@ -143,14 +143,14 @@ export const Datepicker = forwardRef<HTMLDivElement, IDatepickerProps>((props, c
               onKeyDown: composeEventHandlers(
                 childElement.props.onKeyDown,
                 (e: React.KeyboardEvent<HTMLInputElement>) => {
-                  switch (e.keyCode) {
-                    case KEY_CODES.ESCAPE:
-                    case KEY_CODES.ENTER:
+                  switch (e.key) {
+                    case KEYS.ESCAPE:
+                    case KEYS.ENTER:
                       dispatch({ type: 'CLOSE' });
                       break;
-                    case KEY_CODES.UP:
-                    case KEY_CODES.DOWN:
-                    case KEY_CODES.SPACE:
+                    case KEYS.UP:
+                    case KEYS.DOWN:
+                    case KEYS.SPACE:
                       dispatch({ type: 'OPEN' });
                       break;
                   }

packages/datepickers/src/elements/Datepicker/Datepicker.tsx

@@ -9,7 +9,7 @@ import React from 'react';
 import userEvent from '@testing-library/user-event';
 import { fireEvent, render } from 'garden-test-utils';
 import mockDate from 'mockdate';
-import { KEY_CODES, KEYS } from '@zendeskgarden/container-utilities';
+import { KEYS } from '@zendeskgarden/container-utilities';
 
 import { DatepickerRange } from '../DatepickerRange';
 import { IDatepickerRangeProps } from '../../../types';
@@ -134,7 +134,7 @@ describe('DatepickerRange', () => {
 
       await user.clear(endInput);
       await user.type(endInput, 'January 4th, 2019');
-      fireEvent.keyDown(endInput, { key: KEYS.ENTER, keyCode: KEY_CODES.ENTER });
+      fireEvent.keyDown(endInput, { key: KEYS.ENTER });
 
       expect(onChangeSpy).toHaveBeenCalledWith({
         startValue: DEFAULT_START_VALUE,