@commercetools-frontend/experimental-components 5.4.0 → 5.4.1

package/dist/commercetools-frontend-experimental-components.cjs.dev.js

@@ -7630,10 +7630,12 @@ const CustomFieldsInternal = props => {
       return jsxRuntime.jsx(formik.FastField, {
         name: fieldName,
         validate: validate,
-        children: () => {
-          var _context3;
-          return jsxRuntime.jsxs(uiKit.Spacings.Stack, {
-            scale: "xs",
+        children: () => jsxRuntime.jsx(uiKit.Spacings.Stack, {
+          scale: "xs",
+          children: jsxRuntime.jsxs("div", {
+            "aria-invalid": _Object$keys__default["default"](fieldErrors !== null && fieldErrors !== void 0 ? fieldErrors : {}).length > 0,
+            "aria-errormessage": "".concat(fieldName, "-error"),
+            id: "".concat(fieldName, "-error"),
             children: [jsxRuntime.jsx(CustomFieldsLabel, {
               name: fieldName,
               fieldDefinition: fieldDefinition
@@ -7648,26 +7650,22 @@ const CustomFieldsInternal = props => {
                 isReadOnly: props.isReadOnly,
                 onBlur: handleBlur,
                 setFieldValue: props.setFieldValue
-              }) : jsxRuntime.jsx("div", {
-                "aria-invalid": _Object$keys__default["default"](fieldErrors !== null && fieldErrors !== void 0 ? fieldErrors : {}).length > 0,
-                "aria-errormessage": "".concat(fieldName, "-error"),
-                children: jsxRuntime.jsx(CustomFieldInput, {
-                  name: fieldName,
-                  value: value,
-                  fieldDefinition: fieldDefinition,
-                  isDisabled: props.isDisabled,
-                  isReadOnly: props.isReadOnly,
-                  onBlur: handleBlur,
-                  setFieldValue: props.setFieldValue,
-                  hasError: hasError
-                })
-              }, _concatInstanceProperty__default["default"](_context3 = "".concat(fieldName, "-")).call(_context3, index)), jsxRuntime.jsx(CustomFieldErrors, {
+              }) : jsxRuntime.jsx(CustomFieldInput, {
+                name: fieldName,
+                value: value,
+                fieldDefinition: fieldDefinition,
+                isDisabled: props.isDisabled,
+                isReadOnly: props.isReadOnly,
+                onBlur: handleBlur,
+                setFieldValue: props.setFieldValue,
+                hasError: hasError
+              }), jsxRuntime.jsx(CustomFieldErrors, {
                 isTouched: isTouched,
                 errors: fieldErrors
               })]
             })]
-          });
-        }
+          })
+        })
       }, _concatInstanceProperty__default["default"](_context2 = "".concat(fieldName, "-")).call(_context2, index));
     })
   });
@@ -11341,6 +11339,10 @@ const ScrollToFieldError = () => {
   const formik$1 = formik.useFormikContext();
   const isValid = formik$1.isValid,
     submitCount = formik$1.submitCount;
+  const _useApplicationContex = applicationShellConnectors.useApplicationContext(applicationContext => ({
+      dataLocale: applicationContext.dataLocale
+    })),
+    dataLocale = _useApplicationContex.dataLocale;
   React.useEffect(() => {
     // Do not run the effect if the form hasn't been submitted yet.
     if (submitCount === 0) return;
@@ -11348,17 +11350,23 @@ const ScrollToFieldError = () => {
     if (isValid) return;
     const firstErrorElement = document.querySelector('[aria-invalid="true"]');
     if (firstErrorElement) {
-      var _ref, _document$querySelect, _elementToScrollTo$sc;
+      var _ref, _ref2, _document$querySelect, _elementToScrollTo$sc;
       // Get a reference to the label.
-      const id = firstErrorElement.getAttribute('id');
+      const firstElementId = firstErrorElement.getAttribute('id');
+      const localizedInputIndex = _indexOfInstanceProperty__default["default"](firstElementId).call(firstElementId, ".".concat(dataLocale));
+
+      // check if locale is appended then remove it from id
+      const id = localizedInputIndex > -1 ? firstElementId.replace(".".concat(dataLocale), '') : firstElementId;
 
       // Scroll to the label (if found), otherwise to the input element itself.
-      const elementToScrollTo = (_ref = (_document$querySelect = document.querySelector("label[for=\"".concat(id, "\"]"))) !== null && _document$querySelect !== void 0 ? _document$querySelect : document.querySelector("label#".concat(id))) !== null && _ref !== void 0 ? _ref : firstErrorElement;
+
+      const elementToScrollTo = //  div is used only for custom fields
+      (_ref = (_ref2 = (_document$querySelect = document.querySelector("div[aria-errormessage=\"".concat(firstElementId, "\"]"))) !== null && _document$querySelect !== void 0 ? _document$querySelect : document.querySelector("label[for=\"".concat(id, "\"]"))) !== null && _ref2 !== void 0 ? _ref2 : document.querySelector("label#".concat(id))) !== null && _ref !== void 0 ? _ref : firstErrorElement;
       (_elementToScrollTo$sc = elementToScrollTo.scrollIntoView) === null || _elementToScrollTo$sc === void 0 || _elementToScrollTo$sc.call(elementToScrollTo, {
         behavior: 'smooth'
       });
     }
-  }, [isValid, submitCount]);
+  }, [dataLocale, isValid, submitCount]);
   return null;
 };
 

package/dist/commercetools-frontend-experimental-components.cjs.prod.js

@@ -7623,10 +7623,12 @@ const CustomFieldsInternal = props => {
       return jsxRuntime.jsx(formik.FastField, {
         name: fieldName,
         validate: validate,
-        children: () => {
-          var _context3;
-          return jsxRuntime.jsxs(uiKit.Spacings.Stack, {
-            scale: "xs",
+        children: () => jsxRuntime.jsx(uiKit.Spacings.Stack, {
+          scale: "xs",
+          children: jsxRuntime.jsxs("div", {
+            "aria-invalid": _Object$keys__default["default"](fieldErrors !== null && fieldErrors !== void 0 ? fieldErrors : {}).length > 0,
+            "aria-errormessage": "".concat(fieldName, "-error"),
+            id: "".concat(fieldName, "-error"),
             children: [jsxRuntime.jsx(CustomFieldsLabel, {
               name: fieldName,
               fieldDefinition: fieldDefinition
@@ -7641,26 +7643,22 @@ const CustomFieldsInternal = props => {
                 isReadOnly: props.isReadOnly,
                 onBlur: handleBlur,
                 setFieldValue: props.setFieldValue
-              }) : jsxRuntime.jsx("div", {
-                "aria-invalid": _Object$keys__default["default"](fieldErrors !== null && fieldErrors !== void 0 ? fieldErrors : {}).length > 0,
-                "aria-errormessage": "".concat(fieldName, "-error"),
-                children: jsxRuntime.jsx(CustomFieldInput, {
-                  name: fieldName,
-                  value: value,
-                  fieldDefinition: fieldDefinition,
-                  isDisabled: props.isDisabled,
-                  isReadOnly: props.isReadOnly,
-                  onBlur: handleBlur,
-                  setFieldValue: props.setFieldValue,
-                  hasError: hasError
-                })
-              }, _concatInstanceProperty__default["default"](_context3 = "".concat(fieldName, "-")).call(_context3, index)), jsxRuntime.jsx(CustomFieldErrors, {
+              }) : jsxRuntime.jsx(CustomFieldInput, {
+                name: fieldName,
+                value: value,
+                fieldDefinition: fieldDefinition,
+                isDisabled: props.isDisabled,
+                isReadOnly: props.isReadOnly,
+                onBlur: handleBlur,
+                setFieldValue: props.setFieldValue,
+                hasError: hasError
+              }), jsxRuntime.jsx(CustomFieldErrors, {
                 isTouched: isTouched,
                 errors: fieldErrors
               })]
             })]
-          });
-        }
+          })
+        })
       }, _concatInstanceProperty__default["default"](_context2 = "".concat(fieldName, "-")).call(_context2, index));
     })
   });
@@ -11334,6 +11332,10 @@ const ScrollToFieldError = () => {
   const formik$1 = formik.useFormikContext();
   const isValid = formik$1.isValid,
     submitCount = formik$1.submitCount;
+  const _useApplicationContex = applicationShellConnectors.useApplicationContext(applicationContext => ({
+      dataLocale: applicationContext.dataLocale
+    })),
+    dataLocale = _useApplicationContex.dataLocale;
   React.useEffect(() => {
     // Do not run the effect if the form hasn't been submitted yet.
     if (submitCount === 0) return;
@@ -11341,17 +11343,23 @@ const ScrollToFieldError = () => {
     if (isValid) return;
     const firstErrorElement = document.querySelector('[aria-invalid="true"]');
     if (firstErrorElement) {
-      var _ref, _document$querySelect, _elementToScrollTo$sc;
+      var _ref, _ref2, _document$querySelect, _elementToScrollTo$sc;
       // Get a reference to the label.
-      const id = firstErrorElement.getAttribute('id');
+      const firstElementId = firstErrorElement.getAttribute('id');
+      const localizedInputIndex = _indexOfInstanceProperty__default["default"](firstElementId).call(firstElementId, ".".concat(dataLocale));
+
+      // check if locale is appended then remove it from id
+      const id = localizedInputIndex > -1 ? firstElementId.replace(".".concat(dataLocale), '') : firstElementId;
 
       // Scroll to the label (if found), otherwise to the input element itself.
-      const elementToScrollTo = (_ref = (_document$querySelect = document.querySelector("label[for=\"".concat(id, "\"]"))) !== null && _document$querySelect !== void 0 ? _document$querySelect : document.querySelector("label#".concat(id))) !== null && _ref !== void 0 ? _ref : firstErrorElement;
+
+      const elementToScrollTo = //  div is used only for custom fields
+      (_ref = (_ref2 = (_document$querySelect = document.querySelector("div[aria-errormessage=\"".concat(firstElementId, "\"]"))) !== null && _document$querySelect !== void 0 ? _document$querySelect : document.querySelector("label[for=\"".concat(id, "\"]"))) !== null && _ref2 !== void 0 ? _ref2 : document.querySelector("label#".concat(id))) !== null && _ref !== void 0 ? _ref : firstErrorElement;
       (_elementToScrollTo$sc = elementToScrollTo.scrollIntoView) === null || _elementToScrollTo$sc === void 0 || _elementToScrollTo$sc.call(elementToScrollTo, {
         behavior: 'smooth'
       });
     }
-  }, [isValid, submitCount]);
+  }, [dataLocale, isValid, submitCount]);
   return null;
 };
 

package/dist/commercetools-frontend-experimental-components.esm.js

@@ -7547,10 +7547,12 @@ const CustomFieldsInternal = props => {
       return jsx(FastField, {
         name: fieldName,
         validate: validate,
-        children: () => {
-          var _context3;
-          return jsxs(Spacings.Stack, {
-            scale: "xs",
+        children: () => jsx(Spacings.Stack, {
+          scale: "xs",
+          children: jsxs("div", {
+            "aria-invalid": _Object$keys(fieldErrors !== null && fieldErrors !== void 0 ? fieldErrors : {}).length > 0,
+            "aria-errormessage": "".concat(fieldName, "-error"),
+            id: "".concat(fieldName, "-error"),
             children: [jsx(CustomFieldsLabel, {
               name: fieldName,
               fieldDefinition: fieldDefinition
@@ -7565,26 +7567,22 @@ const CustomFieldsInternal = props => {
                 isReadOnly: props.isReadOnly,
                 onBlur: handleBlur,
                 setFieldValue: props.setFieldValue
-              }) : jsx("div", {
-                "aria-invalid": _Object$keys(fieldErrors !== null && fieldErrors !== void 0 ? fieldErrors : {}).length > 0,
-                "aria-errormessage": "".concat(fieldName, "-error"),
-                children: jsx(CustomFieldInput, {
-                  name: fieldName,
-                  value: value,
-                  fieldDefinition: fieldDefinition,
-                  isDisabled: props.isDisabled,
-                  isReadOnly: props.isReadOnly,
-                  onBlur: handleBlur,
-                  setFieldValue: props.setFieldValue,
-                  hasError: hasError
-                })
-              }, _concatInstanceProperty(_context3 = "".concat(fieldName, "-")).call(_context3, index)), jsx(CustomFieldErrors, {
+              }) : jsx(CustomFieldInput, {
+                name: fieldName,
+                value: value,
+                fieldDefinition: fieldDefinition,
+                isDisabled: props.isDisabled,
+                isReadOnly: props.isReadOnly,
+                onBlur: handleBlur,
+                setFieldValue: props.setFieldValue,
+                hasError: hasError
+              }), jsx(CustomFieldErrors, {
                 isTouched: isTouched,
                 errors: fieldErrors
               })]
             })]
-          });
-        }
+          })
+        })
       }, _concatInstanceProperty(_context2 = "".concat(fieldName, "-")).call(_context2, index));
     })
   });
@@ -11258,6 +11256,10 @@ const ScrollToFieldError = () => {
   const formik = useFormikContext();
   const isValid = formik.isValid,
     submitCount = formik.submitCount;
+  const _useApplicationContex = useApplicationContext(applicationContext => ({
+      dataLocale: applicationContext.dataLocale
+    })),
+    dataLocale = _useApplicationContex.dataLocale;
   useEffect(() => {
     // Do not run the effect if the form hasn't been submitted yet.
     if (submitCount === 0) return;
@@ -11265,17 +11267,23 @@ const ScrollToFieldError = () => {
     if (isValid) return;
     const firstErrorElement = document.querySelector('[aria-invalid="true"]');
     if (firstErrorElement) {
-      var _ref, _document$querySelect, _elementToScrollTo$sc;
+      var _ref, _ref2, _document$querySelect, _elementToScrollTo$sc;
       // Get a reference to the label.
-      const id = firstErrorElement.getAttribute('id');
+      const firstElementId = firstErrorElement.getAttribute('id');
+      const localizedInputIndex = _indexOfInstanceProperty(firstElementId).call(firstElementId, ".".concat(dataLocale));
+
+      // check if locale is appended then remove it from id
+      const id = localizedInputIndex > -1 ? firstElementId.replace(".".concat(dataLocale), '') : firstElementId;
 
       // Scroll to the label (if found), otherwise to the input element itself.
-      const elementToScrollTo = (_ref = (_document$querySelect = document.querySelector("label[for=\"".concat(id, "\"]"))) !== null && _document$querySelect !== void 0 ? _document$querySelect : document.querySelector("label#".concat(id))) !== null && _ref !== void 0 ? _ref : firstErrorElement;
+
+      const elementToScrollTo = //  div is used only for custom fields
+      (_ref = (_ref2 = (_document$querySelect = document.querySelector("div[aria-errormessage=\"".concat(firstElementId, "\"]"))) !== null && _document$querySelect !== void 0 ? _document$querySelect : document.querySelector("label[for=\"".concat(id, "\"]"))) !== null && _ref2 !== void 0 ? _ref2 : document.querySelector("label#".concat(id))) !== null && _ref !== void 0 ? _ref : firstErrorElement;
       (_elementToScrollTo$sc = elementToScrollTo.scrollIntoView) === null || _elementToScrollTo$sc === void 0 || _elementToScrollTo$sc.call(elementToScrollTo, {
         behavior: 'smooth'
       });
     }
-  }, [isValid, submitCount]);
+  }, [dataLocale, isValid, submitCount]);
   return null;
 };
 

package/dist/styles.css

@@ -1,3 +1,55 @@
+/*  imported from label-range.module.css  */
+
+.label-range-module__label___3Tb0p {
+  font-size: 0.9rem;
+  font-weight: bold;
+}
+/*  imported from multi-value-search-input.module.css  */
+
+.multi-value-search-input-module__container___2u64d {
+  position: relative;
+}
+
+.multi-value-search-input-module__searchInput___363nj input {
+  border-color: var(--border-color-for-input);
+}
+
+.multi-value-search-input-module__searchInput___363nj input::placeholder {
+  color: var(--font-color-for-input-when-disabled);
+}
+
+.multi-value-search-input-module__submittingTip___2339U {
+  margin-top: var(--spacing-xs);
+  background: var(--background-color-for-input);
+  border: solid 1px var(--border-color-for-input-when-focused);
+  border-radius: var(--border-radius-for-input);
+  position: relative;
+  cursor: default;
+}
+
+.multi-value-search-input-module__submitting-tip-single___1LcNy {
+  padding: var(--spacing-s);
+  color: var(--font-color-for-input-when-disabled);
+}
+
+.multi-value-search-input-module__submitting-tip-content___IyuVb {
+  padding: var(--spacing-s);
+}
+
+.multi-value-search-input-module__submitting-tip-content-separate___3Y_CI {
+  padding-top: var(--spacing-s);
+}
+
+.multi-value-search-input-module__submitting-tip-content-hoverable___2TK6S:hover {
+  background-color: var(--color-neutral-95);
+  border-radius: var(--border-radius-for-input);
+}
+
+.multi-value-search-input-module__submitting-tip-content-separate-hoverable___3VUnV:hover {
+  background-color: var(--color-neutral-95);
+  border-bottom-left-radius: var(--border-radius-for-input);
+  border-bottom-right-radius: var(--border-radius-for-input);
+}
 /*  imported from search-input.module.css  */
 
 .search-input-module__block___1uM-y {
@@ -125,58 +177,6 @@
 .validated-input-module__container___3L2KB {
   display: inline;
 }
-/*  imported from label-range.module.css  */
-
-.label-range-module__label___3Tb0p {
-  font-size: 0.9rem;
-  font-weight: bold;
-}
-/*  imported from multi-value-search-input.module.css  */
-
-.multi-value-search-input-module__container___2u64d {
-  position: relative;
-}
-
-.multi-value-search-input-module__searchInput___363nj input {
-  border-color: var(--border-color-for-input);
-}
-
-.multi-value-search-input-module__searchInput___363nj input::placeholder {
-  color: var(--font-color-for-input-when-disabled);
-}
-
-.multi-value-search-input-module__submittingTip___2339U {
-  margin-top: var(--spacing-xs);
-  background: var(--background-color-for-input);
-  border: solid 1px var(--border-color-for-input-when-focused);
-  border-radius: var(--border-radius-for-input);
-  position: relative;
-  cursor: default;
-}
-
-.multi-value-search-input-module__submitting-tip-single___1LcNy {
-  padding: var(--spacing-s);
-  color: var(--font-color-for-input-when-disabled);
-}
-
-.multi-value-search-input-module__submitting-tip-content___IyuVb {
-  padding: var(--spacing-s);
-}
-
-.multi-value-search-input-module__submitting-tip-content-separate___3Y_CI {
-  padding-top: var(--spacing-s);
-}
-
-.multi-value-search-input-module__submitting-tip-content-hoverable___2TK6S:hover {
-  background-color: var(--color-neutral-95);
-  border-radius: var(--border-radius-for-input);
-}
-
-.multi-value-search-input-module__submitting-tip-content-separate-hoverable___3VUnV:hover {
-  background-color: var(--color-neutral-95);
-  border-bottom-left-radius: var(--border-radius-for-input);
-  border-bottom-right-radius: var(--border-radius-for-input);
-}
 /*  imported from numeric-format-input.module.css  */
 
 .numeric-format-input-module__invalid___3LcyE {
@@ -261,42 +261,6 @@
   border-bottom-left-radius: 0;
   margin-left: 0;
 }
-/* imported from file-input.module.css  */
-
-/** Button */
-
-.file-input-module__button___2KypN {
-  display: inline-flex;
-  background-color: var(--color-surface);
-  border: var(--border-for-button-as-secondary);
-  box-shadow: none;
-  border-radius: var(--border-radius-4);
-  color: var(--color-solid);
-  height: var(--height-for-button-as-big);
-  font-size: var(--font-size-20);
-  font-weight: var(--font-weight-500);
-  align-items: center;
-  transition: background-color var(--transition-linear-80ms);
-  padding: 0 var(--spacing-m);
-}
-
-.file-input-module__button___2KypN:hover,
-.file-input-module__button___2KypN:focus {
-  cursor: pointer;
-  background-color: var(--background-color-for-button-when-hovered);
-  box-shadow: none;
-}
-
-.file-input-module__button___2KypN:active {
-  box-shadow: var(--shadow-9);
-  background-color: var(--color-surface);
-}
-
-.file-input-module__input___3MP4D {
-  visibility: hidden;
-  width: 1px;
-  height: 1px;
-}
 /*  imported from button.module.css  */
 
 /* Generic button */
@@ -500,6 +464,42 @@
 .button-module__add-button___1f093 {
   min-height: 32px;
 }
+/* imported from file-input.module.css  */
+
+/** Button */
+
+.file-input-module__button___2KypN {
+  display: inline-flex;
+  background-color: var(--color-surface);
+  border: var(--border-for-button-as-secondary);
+  box-shadow: none;
+  border-radius: var(--border-radius-4);
+  color: var(--color-solid);
+  height: var(--height-for-button-as-big);
+  font-size: var(--font-size-20);
+  font-weight: var(--font-weight-500);
+  align-items: center;
+  transition: background-color var(--transition-linear-80ms);
+  padding: 0 var(--spacing-m);
+}
+
+.file-input-module__button___2KypN:hover,
+.file-input-module__button___2KypN:focus {
+  cursor: pointer;
+  background-color: var(--background-color-for-button-when-hovered);
+  box-shadow: none;
+}
+
+.file-input-module__button___2KypN:active {
+  box-shadow: var(--shadow-9);
+  background-color: var(--color-surface);
+}
+
+.file-input-module__input___3MP4D {
+  visibility: hidden;
+  width: 1px;
+  height: 1px;
+}
 /*  imported from centered-loading-spinner.module.css  */
 
 .centered-loading-spinner-module__loading-container___3_9-h {
@@ -556,23 +556,23 @@
 .set-buttons-module__gap___38Qr0 {
   padding: 20px;
 }
-/*  imported from platform-limits-customer-groups-status.module.css  */
+/*  imported from platform-limits-customers-status.module.css  */
 
-.platform-limits-customer-groups-status-module__status___6099G {
+.platform-limits-customers-status-module__status___3rXYM {
   min-width: max-content;
 }
-/*  imported from platform-limits-customer-groups-combined.module.css  */
+/*  imported from platform-limits-customers-combined.module.css  */
 
-.platform-limits-customer-groups-combined-module__combined___WjRoI {
+.platform-limits-customers-combined-module__combined___OszDd {
   margin-bottom: var(--spacing-s);
 }
-/*  imported from platform-limits-customers-status.module.css  */
+/*  imported from platform-limits-customer-groups-status.module.css  */
 
-.platform-limits-customers-status-module__status___3rXYM {
+.platform-limits-customer-groups-status-module__status___6099G {
   min-width: max-content;
 }
-/*  imported from platform-limits-customers-combined.module.css  */
+/*  imported from platform-limits-customer-groups-combined.module.css  */
 
-.platform-limits-customers-combined-module__combined___OszDd {
+.platform-limits-customer-groups-combined-module__combined___WjRoI {
   margin-bottom: var(--spacing-s);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercetools-frontend/experimental-components",
-  "version": "5.4.0",
+  "version": "5.4.1",
   "description": "",
   "main": "dist/commercetools-frontend-experimental-components.cjs.js",
   "module": "dist/commercetools-frontend-experimental-components.esm.js",
@@ -13,18 +13,18 @@
     "@babel/core": "^7.22.11",
     "@babel/runtime": "^7.21.0",
     "@babel/runtime-corejs3": "^7.21.0",
-    "@commercetools-frontend/actions-global": "^22.7.1",
-    "@commercetools-frontend/application-components": "^22.7.1",
-    "@commercetools-frontend/application-shell": "^22.7.1",
-    "@commercetools-frontend/application-shell-connectors": "^22.7.1",
-    "@commercetools-frontend/constants": "^22.7.1",
-    "@commercetools-frontend/l10n": "^22.7.1",
-    "@commercetools-frontend/sdk": "^22.7.1",
-    "@commercetools-frontend/sentry": "^22.7.1",
-    "@commercetools-frontend/ui-kit": "^16.7.4",
-    "@commercetools-uikit/design-system": "^16.7.4",
-    "@commercetools-uikit/select-utils": "^16.7.4",
-    "@commercetools-uikit/utils": "^16.7.4",
+    "@commercetools-frontend/actions-global": "^22.8.2",
+    "@commercetools-frontend/application-components": "^22.8.2",
+    "@commercetools-frontend/application-shell": "^22.8.2",
+    "@commercetools-frontend/application-shell-connectors": "^22.8.2",
+    "@commercetools-frontend/constants": "^22.8.2",
+    "@commercetools-frontend/l10n": "^22.8.2",
+    "@commercetools-frontend/sdk": "^22.8.2",
+    "@commercetools-frontend/sentry": "^22.8.2",
+    "@commercetools-frontend/ui-kit": "^16.7.5",
+    "@commercetools-uikit/design-system": "^16.7.5",
+    "@commercetools-uikit/select-utils": "^16.7.5",
+    "@commercetools-uikit/utils": "^16.7.5",
     "@emotion/react": "^11.11.1",
     "classnames": "2.3.2",
     "cleave.js": "1.5.10",
@@ -65,10 +65,10 @@
     "react-router-dom": "^5.3.4",
     "react-test-renderer": "^17.0.2",
     "redux": "^4.2.1",
-    "typescript": "5.1.6",
+    "typescript": "5.2.2",
     "xhr-mock": "^2.5.1",
-    "@commercetools-local/test-data": "1.2.1",
-    "@commercetools-local/test-utils": "1.2.1"
+    "@commercetools-local/test-data": "1.2.2",
+    "@commercetools-local/test-utils": "1.2.2"
   },
   "peerDependencies": {
     "@apollo/client": "3.x",