[EASI-3934] Dependency Updates -- Round 1

package.json

@@ -7,12 +7,12 @@
     "@babel/plugin-syntax-class-properties": "^7.12.13",
     "@cypress/code-coverage": "^3.10.0",
     "@graphql-codegen/typescript-react-apollo": "^4.1.0",
-    "@json2csv/formatters": "^7.0.5",
-    "@json2csv/plainjs": "^7.0.5",
-    "@json2csv/transforms": "^7.0.5",
+    "@json2csv/formatters": "^7.0.6",
+    "@json2csv/plainjs": "^7.0.6",
+    "@json2csv/transforms": "^7.0.6",
     "@okta/okta-auth-js": "^6.1.0",
-    "@okta/okta-react": "^6.4.2",
-    "@okta/okta-signin-widget": "^7.9.1",
+    "@okta/okta-react": "^6.7.0",
+    "@okta/okta-signin-widget": "^7.15.1",
     "@tiptap/core": "^2.1.11",
     "@tiptap/extension-character-count": "^2.1.11",
     "@tiptap/extension-document": "^2.1.11",
@@ -37,28 +37,26 @@
     "@types/react-modal": "^3.10.5",
     "@types/react-redux": "^7.1.33",
     "@types/react-router-dom": "^5.1.0",
-    "@types/react-table": "^7.0.23",
+    "@types/react-table": "^7.7.19",
     "@types/react-test-renderer": "^17.0.1",
     "@types/redux-mock-store": "^1.0.6",
     "@types/redux-saga-routines": "^3.1.8",
     "@types/sinon": "^10.0.16",
     "@types/text-encoding": "^0.0.39",
-    "@types/yup": "^0.29.11",
     "@uswds/uswds": "^3.4.1",
     "apollo": "^2.34",
     "apollo-upload-client": "^17.0.0",
     "axios": "^0.21.3",
-    "classnames": "^2.3.1",
+    "classnames": "^2.5.1",
     "cross-fetch": "^3.1.5",
     "cypress-file-upload": "^5.0.8",
-    "detect-browser": "^5.0.0",
+    "detect-browser": "^5.3.0",
     "font-awesome": "^4.7.0",
     "formik": "^2.1.6",
     "graphql": "^15.8.0",
     "i18next": "^23.7.6",
     "i18next-browser-languagedetector": "^5.0.0",
     "istanbul-lib-coverage": "^3.0.0",
-    "js-base64": "^3.6.0",
     "launchdarkly-react-client-sdk": "^3.0.10",
     "lodash": "^4.17.21",
     "luxon": "^1.22.0",
@@ -67,29 +65,29 @@
     "react": "^17.0.2",
     "react-autosuggest": "^10.1.0",
     "react-dom": "^17.0.2",
-    "react-ga4": "^2.0.0",
+    "react-ga4": "^2.1.0",
     "react-i18next": "^13.4.1",
     "react-idle-timer": "^5.4.2",
     "react-media": "^1.10.0",
-    "react-modal": "^3.11.2",
-    "react-paginate": "^8.1.4",
+    "react-modal": "^3.16.1",
+    "react-paginate": "^8.2.0",
     "react-redux": "^7.1.1",
     "react-router-dom": "^5.1.2",
-    "react-select": "^5.4.0",
+    "react-select": "^5.8.0",
     "react-table": "^7.5.1",
-    "react-to-print": "^2.14.15",
+    "react-to-print": "^2.15.1",
     "redux": "^4.0.4",
     "redux-actions": "^2.6.5",
-    "redux-devtools-extension": "^2.13.8",
+    "redux-devtools-extension": "^2.13.9",
     "redux-saga": "^1.1.1",
     "redux-saga-routines": "^3.2.2",
-    "sass": "^1.57.1",
-    "storybook": "^7.5.1",
+    "sass": "^1.70.0",
+    "storybook": "^7.6.16",
     "subscriptions-transport-ws": "^0.11.0",
     "tippy.js": "^6.3.7",
     "typescript": "^4.5.2",
-    "wait-on": "^5.2.1",
-    "yup": "^1.2.0"
+    "wait-on": "^7.2.0",
+    "yup": "^1.3.3"
   },
   "scripts": {
     "start": "vite",
@@ -131,19 +129,19 @@
   },
   "devDependencies": {
     "@apollo/react-testing": "^4.0.0",
-    "@babel/core": "^7.22.15",
-    "@babel/preset-env": "^7.22.15",
+    "@babel/core": "^7.23.9",
+    "@babel/preset-env": "^7.23.9",
     "@cypress/webpack-preprocessor": "^6.0.1",
     "@graphql-codegen/cli": "5.0.2",
     "@graphql-codegen/client-preset": "4.1.0",
     "@graphql-codegen/introspection": "4.0.2",
-    "@storybook/addon-actions": "^7.5.1",
-    "@storybook/addon-controls": "^7.5.1",
-    "@storybook/addon-essentials": "^7.5.1",
-    "@storybook/addon-links": "^7.5.1",
-    "@storybook/node-logger": "^7.5.1",
-    "@storybook/react": "^7.5.1",
-    "@storybook/react-vite": "^7.5.1",
+    "@storybook/addon-actions": "^7.6.16",
+    "@storybook/addon-controls": "^7.6.16",
+    "@storybook/addon-essentials": "^7.6.16",
+    "@storybook/addon-links": "^7.6.16",
+    "@storybook/node-logger": "^7.6.16",
+    "@storybook/react": "^7.6.16",
+    "@storybook/react-vite": "^7.6.16",
     "@testing-library/jest-dom": "^5.12.0",
     "@testing-library/react": "^11.2.7",
     "@testing-library/user-event": "^13.5.0",
@@ -155,7 +153,7 @@
     "apollo-link-error": "^1.1.13",
     "autoprefixer": "^10.4.17",
     "babel-loader": "^9.1.3",
-    "cypress": "^13.1.0",
+    "cypress": "^13.6.4",
     "cypress-otp": "^1.0.3",
     "enzyme": "^3.10.0",
     "eslint": "^7.11.0",

src/components/OktaUserSelect/__snapshots__/index.test.tsx.snap

@@ -15,33 +15,42 @@ exports[`OktaUserSelect > selects contact from dropdown 1`] = `
       aria-live="polite"
       aria-relevant="additions text"
       class="css-1f43avz-a11yText-A11yText"
+      role="log"
     >
       <span
         id="aria-selection"
       />
       <span
-        id="aria-context"
+        id="aria-focused"
+      />
+      <span
+        id="aria-results"
+      >
+        1 result available for search term Adeline.
+      </span>
+      <span
+        id="aria-guidance"
       >
-        option Adeline Aarons, ABCD focused, 1 of 1. 1 result available for search term Adeline. Use Up and Down to choose options, press Enter to select the currently focused option, press Escape to exit the menu, press Tab to select the option and exit the menu.
+        Use Up and Down to choose options, press Enter to select the currently focused option, press Escape to exit the menu, press Tab to select the option and exit the menu.
       </span>
     </span>
     <div
-      class="cedar-contact-select__control cedar-contact-select__control--is-focused cedar-contact-select__control--menu-is-open css-1cjrczp-control"
+      class="cedar-contact-select__control cedar-contact-select__control--is-focused cedar-contact-select__control--menu-is-open css-13u0srz-control"
     >
       <div
-        class="cedar-contact-select__value-container css-319lph-ValueContainer"
+        class="cedar-contact-select__value-container css-1fdsijx-ValueContainer"
       >
         <div
-          class="cedar-contact-select__input-container css-1pndypt-Input"
+          class="cedar-contact-select__input-container css-166bipr-Input"
           data-value="Adeline"
         >
           <input
+            aria-activedescendant="react-select-cedarContactSelect-option-0"
             aria-autocomplete="list"
             aria-controls="react-select-cedarContactSelect-listbox"
             aria-describedby="react-select-cedarContactSelect-placeholder"
             aria-expanded="true"
             aria-haspopup="true"
-            aria-owns="react-select-cedarContactSelect-listbox"
             autocapitalize="none"
             autocomplete="off"
             autocorrect="off"
@@ -61,11 +70,11 @@ exports[`OktaUserSelect > selects contact from dropdown 1`] = `
         class="cedar-contact-select__indicators css-1hb7zxy-IndicatorsContainer"
       >
         <span
-          class="cedar-contact-select__indicator-separator css-1okebmr-indicatorSeparator"
+          class="cedar-contact-select__indicator-separator css-1u9des2-indicatorSeparator"
         />
         <div
           aria-hidden="true"
-          class="cedar-contact-select__indicator cedar-contact-select__dropdown-indicator css-ja6fon-indicatorContainer"
+          class="cedar-contact-select__indicator cedar-contact-select__dropdown-indicator css-ylv2i7-indicatorContainer"
         >
           <svg
             aria-hidden="true"
@@ -83,16 +92,20 @@ exports[`OktaUserSelect > selects contact from dropdown 1`] = `
       </div>
     </div>
     <div
-      class="cedar-contact-select__menu css-1met4b5-menu"
-      id="react-select-cedarContactSelect-listbox"
+      class="cedar-contact-select__menu css-1v1oxpf-menu"
     >
       <div
-        class="cedar-contact-select__menu-list css-19oqr5x-MenuList"
+        aria-multiselectable="false"
+        class="cedar-contact-select__menu-list css-bgzggo-MenuList"
+        id="react-select-cedarContactSelect-listbox"
+        role="listbox"
       >
         <div
           aria-disabled="false"
-          class="usa-combo-box__list-option usa-combo-box__list-option--focused cedar-contact-select__option cedar-contact-select__option--is-focused css-yt9ioa-option"
+          aria-selected="false"
+          class="usa-combo-box__list-option usa-combo-box__list-option--focused cedar-contact-select__option cedar-contact-select__option--is-focused css-10wo9uf-option"
           id="react-select-cedarContactSelect-option-0"
+          role="option"
           tabindex="-1"
         >
           Adeline Aarons, ABCD

src/components/ShareExport/__snapshots__/index.test.tsx.snap

@@ -6782,24 +6782,26 @@ exports[`ShareExportModal > matches the snapshot 1`] = `
                     aria-live="polite"
                     aria-relevant="additions text"
                     class="css-1f43avz-a11yText-A11yText"
+                    role="log"
                   />
                   <div
-                    class="cedar-contact-select__control css-jvusj8-control"
+                    class="cedar-contact-select__control css-1vl89cy-control"
                   >
                     <div
-                      class="cedar-contact-select__value-container cedar-contact-select__value-container--is-multi css-319lph-ValueContainer"
+                      class="cedar-contact-select__value-container cedar-contact-select__value-container--is-multi css-1fdsijx-ValueContainer"
                     >
                       <div
-                        class="cedar-contact-select__placeholder css-14el2xx-placeholder"
+                        class="cedar-contact-select__placeholder css-1jqq78o-placeholder"
                         id="react-select-share-model-recipients-placeholder"
                       >
                         0 selected
                       </div>
                       <div
-                        class="cedar-contact-select__input-container css-6j8wv5-Input"
+                        class="cedar-contact-select__input-container css-qbdosj-Input"
                         data-value=""
                       >
                         <input
+                          aria-activedescendant=""
                           aria-autocomplete="list"
                           aria-describedby="react-select-share-model-recipients-placeholder"
                           aria-expanded="false"
@@ -6823,11 +6825,11 @@ exports[`ShareExportModal > matches the snapshot 1`] = `
                       class="cedar-contact-select__indicators css-1hb7zxy-IndicatorsContainer"
                     >
                       <span
-                        class="cedar-contact-select__indicator-separator css-1vtyy7d-indicatorSeparator"
+                        class="cedar-contact-select__indicator-separator css-16b81-indicatorSeparator"
                       />
                       <div
                         aria-hidden="true"
-                        class="cedar-contact-select__indicator cedar-contact-select__dropdown-indicator css-1232v1p-indicatorContainer"
+                        class="cedar-contact-select__indicator cedar-contact-select__dropdown-indicator css-gjng1h-indicatorContainer"
                       >
                         <svg
                           aria-hidden="true"
@@ -6848,6 +6850,7 @@ exports[`ShareExportModal > matches the snapshot 1`] = `
                     <input
                       name="usernames"
                       type="hidden"
+                      value=""
                     />
                   </div>
                 </div>
@@ -13710,24 +13713,26 @@ exports[`ShareExportModal > matches the snapshot 2`] = `
                     aria-live="polite"
                     aria-relevant="additions text"
                     class="css-1f43avz-a11yText-A11yText"
+                    role="log"
                   />
                   <div
-                    class="cedar-contact-select__control css-jvusj8-control"
+                    class="cedar-contact-select__control css-1vl89cy-control"
                   >
                     <div
-                      class="cedar-contact-select__value-container cedar-contact-select__value-container--is-multi css-319lph-ValueContainer"
+                      class="cedar-contact-select__value-container cedar-contact-select__value-container--is-multi css-1fdsijx-ValueContainer"
                     >
                       <div
-                        class="cedar-contact-select__placeholder css-14el2xx-placeholder"
+                        class="cedar-contact-select__placeholder css-1jqq78o-placeholder"
                         id="react-select-share-model-recipients-placeholder"
                       >
                         0 selected
                       </div>
                       <div
-                        class="cedar-contact-select__input-container css-6j8wv5-Input"
+                        class="cedar-contact-select__input-container css-qbdosj-Input"
                         data-value=""
                       >
                         <input
+                          aria-activedescendant=""
                           aria-autocomplete="list"
                           aria-describedby="react-select-share-model-recipients-placeholder"
                           aria-expanded="false"
@@ -13751,11 +13756,11 @@ exports[`ShareExportModal > matches the snapshot 2`] = `
                       class="cedar-contact-select__indicators css-1hb7zxy-IndicatorsContainer"
                     >
                       <span
-                        class="cedar-contact-select__indicator-separator css-1vtyy7d-indicatorSeparator"
+                        class="cedar-contact-select__indicator-separator css-16b81-indicatorSeparator"
                       />
                       <div
                         aria-hidden="true"
-                        class="cedar-contact-select__indicator cedar-contact-select__dropdown-indicator css-1232v1p-indicatorContainer"
+                        class="cedar-contact-select__indicator cedar-contact-select__dropdown-indicator css-gjng1h-indicatorContainer"
                       >
                         <svg
                           aria-hidden="true"
@@ -13776,6 +13781,7 @@ exports[`ShareExportModal > matches the snapshot 2`] = `
                     <input
                       name="usernames"
                       type="hidden"
+                      value=""
                     />
                   </div>
                 </div>

src/components/shared/MultiSelect/__snapshots__/index.test.tsx.snap

@@ -16,24 +16,26 @@ exports[`MultiSelect > matches the snapshot 1`] = `
         aria-live="polite"
         aria-relevant="additions text"
         class="css-1f43avz-a11yText-A11yText"
+        role="log"
       />
       <div
-        class=" css-jvusj8-control"
+        class=" css-1vl89cy-control"
       >
         <div
-          class=" css-319lph-ValueContainer"
+          class=" css-1fdsijx-ValueContainer"
         >
           <div
-            class=" css-14el2xx-placeholder"
+            class=" css-1jqq78o-placeholder"
             id="react-select-2-placeholder"
           >
             0 selected
           </div>
           <div
-            class=" css-6j8wv5-Input"
+            class=" css-qbdosj-Input"
             data-value=""
           >
             <input
+              aria-activedescendant=""
               aria-autocomplete="list"
               aria-describedby="react-select-2-placeholder"
               aria-expanded="false"
@@ -57,11 +59,11 @@ exports[`MultiSelect > matches the snapshot 1`] = `
           class=" css-1hb7zxy-IndicatorsContainer"
         >
           <span
-            class=" css-1vtyy7d-indicatorSeparator"
+            class=" css-16b81-indicatorSeparator"
           />
           <div
             aria-hidden="true"
-            class=" css-1232v1p-indicatorContainer"
+            class=" css-gjng1h-indicatorContainer"
           >
             <svg
               aria-hidden="true"
@@ -82,6 +84,7 @@ exports[`MultiSelect > matches the snapshot 1`] = `
         <input
           name="testMultiSelect"
           type="hidden"
+          value=""
         />
       </div>
     </div>