@commercetools-uikit/money-input 20.2.2 → 20.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/commercetools-uikit-money-input.cjs.dev.js +33 -27
  2. package/dist/commercetools-uikit-money-input.cjs.prod.js +32 -26
  3. package/dist/commercetools-uikit-money-input.esm.js +32 -27
  4. package/package.json +12 -12
package/dist/commercetools-uikit-money-input.cjs.dev.js CHANGED
@@ -22,6 +22,7 @@ var _parseInt = require('@babel/runtime-corejs3/core-js-stable/parse-int');
22
22
  var _trimInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/trim');
23
23
  var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
24
24
  var _findInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/find');
25
+ var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
25
26
  var react$1 = require('react');
26
27
  var ReactDOM = require('react-dom');
27
28
  var has = require('lodash/has');
@@ -57,6 +58,7 @@ var _parseInt__default = /*#__PURE__*/_interopDefault(_parseInt);
57
58
  var _trimInstanceProperty__default = /*#__PURE__*/_interopDefault(_trimInstanceProperty);
58
59
  var _mapInstanceProperty__default = /*#__PURE__*/_interopDefault(_mapInstanceProperty);
59
60
  var _findInstanceProperty__default = /*#__PURE__*/_interopDefault(_findInstanceProperty);
61
+ var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
60
62
  var ReactDOM__default = /*#__PURE__*/_interopDefault(ReactDOM);
61
63
  var has__default = /*#__PURE__*/_interopDefault(has);
62
64
  var Select__default = /*#__PURE__*/_interopDefault(Select);
@@ -757,7 +759,7 @@ var messages = reactIntl.defineMessages({
757
759
  const _excluded = ["id"],
758
760
  _excluded2 = ["currencies", "horizontalConstraint", "menuPortalZIndex"];
759
761
  function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
760
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context1, _context10; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context1 = ownKeys(Object(t), !0)).call(_context1, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context10 = ownKeys(Object(t))).call(_context10, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
762
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context11, _context12; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context11 = ownKeys(Object(t), !0)).call(_context11, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context12 = ownKeys(Object(t))).call(_context12, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
761
763
  function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
762
764
  const TooltipWrapper = /*#__PURE__*/_styled__default["default"]("div", process.env.NODE_ENV === "production" ? {
763
765
  target: "e1u90zjc0"
@@ -773,8 +775,8 @@ const TooltipWrapper = /*#__PURE__*/_styled__default["default"]("div", process.e
773
775
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
774
776
  });
775
777
  const moneyInputSequentialId = utils.createSequentialId('money-input-');
776
- const getPortalId = id => `portal-${id}`;
777
- const getPortalNode = id => document.querySelector(`#${getPortalId(id)}`);
778
+ const getPortalId = id => "portal-".concat(id);
779
+ const getPortalNode = id => document.querySelector("#".concat(getPortalId(id)));
778
780
  const Portal = props => {
779
781
  const domNode = getPortalNode(props.id);
780
782
  if (domNode) {
@@ -818,15 +820,15 @@ const createCurrencySelectStyles = _ref4 => {
818
820
  });
819
821
  return _objectSpread(_objectSpread({}, selectStyles), {}, {
820
822
  control: (base, state) => _objectSpread(_objectSpread({}, selectStyles.control(base, state)), {}, {
821
- padding: `0 ${designSystem.designTokens.spacing25}`,
823
+ padding: "0 ".concat(designSystem.designTokens.spacing25),
822
824
  borderTopRightRadius: '0',
823
825
  borderBottomRightRadius: '0',
824
826
  borderRight: '0',
825
827
  minWidth: '80px',
826
828
  height: '100%',
827
829
  borderColor: (() => {
828
- if (isDisabled) return `${designSystem.designTokens.borderColorForInputWhenDisabled} !important`;
829
- if (isReadOnly) return `${designSystem.designTokens.borderColorForInputWhenReadonly} !important`;
830
+ if (isDisabled) return "".concat(designSystem.designTokens.borderColorForInputWhenDisabled, " !important");
831
+ if (isReadOnly) return "".concat(designSystem.designTokens.borderColorForInputWhenReadonly, " !important");
830
832
  if (hasError) return designSystem.designTokens.borderColorForInputWhenError;
831
833
  if (hasWarning) return designSystem.designTokens.borderColorForInputWhenWarning;
832
834
  if (currencyHasFocus) {
@@ -836,7 +838,7 @@ const createCurrencySelectStyles = _ref4 => {
836
838
  })(),
837
839
  cursor: (() => {
838
840
  if (isDisabled) return 'not-allowed';
839
- if (isReadOnly) return `default`;
841
+ if (isReadOnly) return "default";
840
842
  return 'pointer';
841
843
  })(),
842
844
  backgroundColor: (() => {
@@ -949,7 +951,7 @@ const parseRawAmountToNumber = (rawAmount, locale) => {
949
951
  }
950
952
  fractionsSeparator = fractionsSeparator === '.' ? '\\.' : fractionsSeparator; // here we escape the '.' to use it as regex
951
953
  // The raw amount with only one sparator
952
- const normalizedAmount = String(rawAmount).replace(new RegExp(`[^-0-9${fractionsSeparator}]`, 'g'), '') // we just keep the numbers and the fraction symbol
954
+ const normalizedAmount = String(rawAmount).replace(new RegExp("[^-0-9".concat(fractionsSeparator, "]"), 'g'), '') // we just keep the numbers and the fraction symbol
953
955
  .replace(fractionsSeparator, '.'); // then we change whatever `fractionsSeparator` was to `.` so we can parse it as float
954
956
 
955
957
  return _parseFloat__default["default"](normalizedAmount);
@@ -974,7 +976,7 @@ const createMoneyValue = (rawAmount, locale, currencyCode) => {
974
976
  if (!currency) return null;
975
977
  // The user may enter a value with a comma, dot, or apostrophe as the decimal separator.
976
978
  if (rawAmount.length === 0 || !utils.isNumberish(rawAmount)) return null;
977
- process.env.NODE_ENV !== "production" ? utils.warning(locale || currency.fractionDigits !== 0, `MoneyInput: A locale must be provided when currency has no fraction digits (${currencyCode})`) : void 0;
979
+ process.env.NODE_ENV !== "production" ? utils.warning(locale || currency.fractionDigits !== 0, "MoneyInput: A locale must be provided when currency has no fraction digits (".concat(currencyCode, ")")) : void 0;
978
980
  const amountAsNumber = parseRawAmountToNumber(rawAmount, locale);
979
981
  if (isNaN(amountAsNumber)) return null;
980
982
 
@@ -1041,8 +1043,8 @@ const formatAmount = (rawAmount, locale, currencyCode) => {
1041
1043
  minimumFractionDigits: fractionDigits
1042
1044
  });
1043
1045
  };
1044
- const getAmountInputName = name => name ? `${name}.amount` : undefined;
1045
- const getCurrencyDropdownName = name => name ? `${name}.currencyCode` : undefined;
1046
+ const getAmountInputName = name => name ? "".concat(name, ".amount") : undefined;
1047
+ const getCurrencyDropdownName = name => name ? "".concat(name, ".currencyCode") : undefined;
1046
1048
  var _ref = process.env.NODE_ENV === "production" ? {
1047
1049
  name: "pw7jst",
1048
1050
  styles: "position:relative;width:100%"
@@ -1060,6 +1062,7 @@ var _ref2 = process.env.NODE_ENV === "production" ? {
1060
1062
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
1061
1063
  };
1062
1064
  const MoneyInput = _ref5 => {
1065
+ var _context8, _context9;
1063
1066
  let _ref5$currencies = _ref5.currencies,
1064
1067
  currencies = _ref5$currencies === void 0 ? [] : _ref5$currencies,
1065
1068
  _ref5$horizontalConst = _ref5.horizontalConstraint,
@@ -1119,18 +1122,20 @@ const MoneyInput = _ref5 => {
1119
1122
  value: formattedAmount
1120
1123
  }
1121
1124
  };
1122
- onChange?.(fakeEvent);
1125
+ onChange === null || onChange === void 0 || onChange(fakeEvent);
1123
1126
  }
1124
1127
  }
1125
1128
  }, [intl.locale, onChange, moneyInputId, props.name, props.value.amount, props.value.currencyCode, toggleAmountHasFocus]);
1126
1129
  const handleAmountChange = react$1.useCallback(event => {
1127
- if (utils.isNumberish(event.target?.value)) {
1128
- onChange?.({
1130
+ var _event$target;
1131
+ if (utils.isNumberish((_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.value)) {
1132
+ var _event$target2;
1133
+ onChange === null || onChange === void 0 || onChange({
1129
1134
  persist: () => {},
1130
1135
  target: {
1131
1136
  id: MoneyInput.getAmountInputId(moneyInputId),
1132
1137
  name: getAmountInputName(props.name),
1133
- value: event.target?.value
1138
+ value: (_event$target2 = event.target) === null || _event$target2 === void 0 ? void 0 : _event$target2.value
1134
1139
  }
1135
1140
  });
1136
1141
  }
@@ -1138,7 +1143,7 @@ const MoneyInput = _ref5 => {
1138
1143
  const handleCurrencyChange = react$1.useCallback(option => {
1139
1144
  const currencyCode = option.value;
1140
1145
  if (props.value.currencyCode !== currencyCode) {
1141
- var _context6;
1146
+ var _context6, _amountInputRef$curre;
1142
1147
  // When the user changes from a currency with 3 fraction digits to
1143
1148
  // a currency with 2 fraction digits, and when the input value was
1144
1149
  // "9.000" (9), then it should change to "9.00" to reflect the new
@@ -1160,11 +1165,11 @@ const MoneyInput = _ref5 => {
1160
1165
  value: currencyCode || ''
1161
1166
  }
1162
1167
  };
1163
- onChange?.(fakeCurrencyEvent);
1168
+ onChange === null || onChange === void 0 || onChange(fakeCurrencyEvent);
1164
1169
 
1165
1170
  // change amount if necessary
1166
1171
  if (props.value.amount !== nextAmount) {
1167
- onChange?.({
1172
+ onChange === null || onChange === void 0 || onChange({
1168
1173
  persist: () => {},
1169
1174
  target: {
1170
1175
  id: MoneyInput.getAmountInputId(moneyInputId),
@@ -1173,7 +1178,7 @@ const MoneyInput = _ref5 => {
1173
1178
  }
1174
1179
  });
1175
1180
  }
1176
- amountInputRef.current?.focus();
1181
+ (_amountInputRef$curre = amountInputRef.current) === null || _amountInputRef$curre === void 0 || _amountInputRef$curre.focus();
1177
1182
  }
1178
1183
  }, [intl.locale, onChange, moneyInputId, props.name, props.value.amount, props.value.currencyCode]);
1179
1184
  const handleCurrencyFocus = react$1.useCallback(() => {
@@ -1217,9 +1222,10 @@ const MoneyInput = _ref5 => {
1217
1222
  const isHighPrecision = !MoneyInput.isEmpty(props.value) && MoneyInput.isHighPrecision(props.value, intl.locale);
1218
1223
  const onBlur = props.onBlur;
1219
1224
  const handleContainerBlur = react$1.useCallback(event => {
1225
+ var _containerRef$current;
1220
1226
  // ensures that both fields are marked as touched when one of them
1221
1227
  // is blurred
1222
- if (typeof onBlur === 'function' && !containerRef.current?.contains(event.relatedTarget)) {
1228
+ if (typeof onBlur === 'function' && !((_containerRef$current = containerRef.current) !== null && _containerRef$current !== void 0 && _containerRef$current.contains(event.relatedTarget))) {
1223
1229
  onBlur({
1224
1230
  target: {
1225
1231
  id: MoneyInput.getCurrencyDropdownId(moneyInputId),
@@ -1319,7 +1325,7 @@ const MoneyInput = _ref5 => {
1319
1325
  ,
1320
1326
  styles: {
1321
1327
  body: {
1322
- margin: `${designSystem.designTokens.spacing20} -${designSystem.designTokens.spacing10} ${designSystem.designTokens.spacing20} 0`
1328
+ margin: _concatInstanceProperty__default["default"](_context8 = _concatInstanceProperty__default["default"](_context9 = "".concat(designSystem.designTokens.spacing20, " -")).call(_context9, designSystem.designTokens.spacing10, " ")).call(_context8, designSystem.designTokens.spacing20, " 0")
1323
1329
  }
1324
1330
  },
1325
1331
  title: intl.formatMessage(messages.highPrecision),
@@ -1341,8 +1347,8 @@ MoneyInput.displayName = 'MoneyInput';
1341
1347
  MoneyInput.getAmountInputId = getAmountInputName;
1342
1348
  MoneyInput.getCurrencyDropdownId = getCurrencyDropdownName;
1343
1349
  MoneyInput.convertToMoneyValue = (value, locale) => {
1344
- var _context8;
1345
- return createMoneyValue(typeof value.amount === 'string' ? _trimInstanceProperty__default["default"](_context8 = value.amount).call(_context8) : '', locale, value.currencyCode);
1350
+ var _context0;
1351
+ return createMoneyValue(typeof value.amount === 'string' ? _trimInstanceProperty__default["default"](_context0 = value.amount).call(_context0) : '', locale, value.currencyCode);
1346
1352
  };
1347
1353
  MoneyInput.parseMoneyValue = (moneyValue, locale) => {
1348
1354
  if (!moneyValue) return {
@@ -1365,19 +1371,19 @@ MoneyInput.parseMoneyValue = (moneyValue, locale) => {
1365
1371
  };
1366
1372
  };
1367
1373
  MoneyInput.isEmpty = formValue => {
1368
- var _context9, _context0;
1369
- return !formValue || _trimInstanceProperty__default["default"](_context9 = formValue.amount).call(_context9) === '' || _trimInstanceProperty__default["default"](_context0 = formValue.currencyCode).call(_context0) === '';
1374
+ var _context1, _context10;
1375
+ return !formValue || _trimInstanceProperty__default["default"](_context1 = formValue.amount).call(_context1) === '' || _trimInstanceProperty__default["default"](_context10 = formValue.currencyCode).call(_context10) === '';
1370
1376
  };
1371
1377
  MoneyInput.isHighPrecision = (formValue, locale) => {
1372
1378
  process.env.NODE_ENV !== "production" ? utils.warning(!MoneyInput.isEmpty(formValue), 'MoneyValue.isHighPrecision may not be called with an empty money value.') : void 0;
1373
1379
  const moneyValue = MoneyInput.convertToMoneyValue(formValue, locale);
1374
- return moneyValue?.type === 'highPrecision';
1380
+ return (moneyValue === null || moneyValue === void 0 ? void 0 : moneyValue.type) === 'highPrecision';
1375
1381
  };
1376
1382
  MoneyInput.isTouched = touched => Boolean(touched && touched.currencyCode && touched.amount);
1377
1383
  var MoneyInput$1 = MoneyInput;
1378
1384
 
1379
1385
  // NOTE: This string will be replaced on build time with the package version.
1380
- var version = "20.2.2";
1386
+ var version = "20.3.0";
1381
1387
 
1382
1388
  exports["default"] = MoneyInput$1;
1383
1389
  exports.version = version;
package/dist/commercetools-uikit-money-input.cjs.prod.js CHANGED
@@ -22,6 +22,7 @@ var _parseInt = require('@babel/runtime-corejs3/core-js-stable/parse-int');
22
22
  var _trimInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/trim');
23
23
  var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
24
24
  var _findInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/find');
25
+ var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
25
26
  var react$1 = require('react');
26
27
  var ReactDOM = require('react-dom');
27
28
  require('lodash/has');
@@ -57,6 +58,7 @@ var _parseInt__default = /*#__PURE__*/_interopDefault(_parseInt);
57
58
  var _trimInstanceProperty__default = /*#__PURE__*/_interopDefault(_trimInstanceProperty);
58
59
  var _mapInstanceProperty__default = /*#__PURE__*/_interopDefault(_mapInstanceProperty);
59
60
  var _findInstanceProperty__default = /*#__PURE__*/_interopDefault(_findInstanceProperty);
61
+ var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
60
62
  var ReactDOM__default = /*#__PURE__*/_interopDefault(ReactDOM);
61
63
  var Select__default = /*#__PURE__*/_interopDefault(Select);
62
64
  var Tooltip__default = /*#__PURE__*/_interopDefault(Tooltip);
@@ -756,7 +758,7 @@ var messages = reactIntl.defineMessages({
756
758
  const _excluded = ["id"],
757
759
  _excluded2 = ["currencies", "horizontalConstraint", "menuPortalZIndex"];
758
760
  function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
759
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context1, _context10; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context1 = ownKeys(Object(t), !0)).call(_context1, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context10 = ownKeys(Object(t))).call(_context10, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
761
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context11, _context12; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context11 = ownKeys(Object(t), !0)).call(_context11, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context12 = ownKeys(Object(t))).call(_context12, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
760
762
  const TooltipWrapper = /*#__PURE__*/_styled__default["default"]("div", {
761
763
  target: "e1u90zjc0"
762
764
  } )({
@@ -764,8 +766,8 @@ const TooltipWrapper = /*#__PURE__*/_styled__default["default"]("div", {
764
766
  styles: "display:flex"
765
767
  } );
766
768
  const moneyInputSequentialId = utils.createSequentialId('money-input-');
767
- const getPortalId = id => `portal-${id}`;
768
- const getPortalNode = id => document.querySelector(`#${getPortalId(id)}`);
769
+ const getPortalId = id => "portal-".concat(id);
770
+ const getPortalNode = id => document.querySelector("#".concat(getPortalId(id)));
769
771
  const Portal = props => {
770
772
  const domNode = getPortalNode(props.id);
771
773
  if (domNode) {
@@ -809,15 +811,15 @@ const createCurrencySelectStyles = _ref4 => {
809
811
  });
810
812
  return _objectSpread(_objectSpread({}, selectStyles), {}, {
811
813
  control: (base, state) => _objectSpread(_objectSpread({}, selectStyles.control(base, state)), {}, {
812
- padding: `0 ${designSystem.designTokens.spacing25}`,
814
+ padding: "0 ".concat(designSystem.designTokens.spacing25),
813
815
  borderTopRightRadius: '0',
814
816
  borderBottomRightRadius: '0',
815
817
  borderRight: '0',
816
818
  minWidth: '80px',
817
819
  height: '100%',
818
820
  borderColor: (() => {
819
- if (isDisabled) return `${designSystem.designTokens.borderColorForInputWhenDisabled} !important`;
820
- if (isReadOnly) return `${designSystem.designTokens.borderColorForInputWhenReadonly} !important`;
821
+ if (isDisabled) return "".concat(designSystem.designTokens.borderColorForInputWhenDisabled, " !important");
822
+ if (isReadOnly) return "".concat(designSystem.designTokens.borderColorForInputWhenReadonly, " !important");
821
823
  if (hasError) return designSystem.designTokens.borderColorForInputWhenError;
822
824
  if (hasWarning) return designSystem.designTokens.borderColorForInputWhenWarning;
823
825
  if (currencyHasFocus) {
@@ -827,7 +829,7 @@ const createCurrencySelectStyles = _ref4 => {
827
829
  })(),
828
830
  cursor: (() => {
829
831
  if (isDisabled) return 'not-allowed';
830
- if (isReadOnly) return `default`;
832
+ if (isReadOnly) return "default";
831
833
  return 'pointer';
832
834
  })(),
833
835
  backgroundColor: (() => {
@@ -940,7 +942,7 @@ const parseRawAmountToNumber = (rawAmount, locale) => {
940
942
  }
941
943
  fractionsSeparator = fractionsSeparator === '.' ? '\\.' : fractionsSeparator; // here we escape the '.' to use it as regex
942
944
  // The raw amount with only one sparator
943
- const normalizedAmount = String(rawAmount).replace(new RegExp(`[^-0-9${fractionsSeparator}]`, 'g'), '') // we just keep the numbers and the fraction symbol
945
+ const normalizedAmount = String(rawAmount).replace(new RegExp("[^-0-9".concat(fractionsSeparator, "]"), 'g'), '') // we just keep the numbers and the fraction symbol
944
946
  .replace(fractionsSeparator, '.'); // then we change whatever `fractionsSeparator` was to `.` so we can parse it as float
945
947
 
946
948
  return _parseFloat__default["default"](normalizedAmount);
@@ -1031,8 +1033,8 @@ const formatAmount = (rawAmount, locale, currencyCode) => {
1031
1033
  minimumFractionDigits: fractionDigits
1032
1034
  });
1033
1035
  };
1034
- const getAmountInputName = name => name ? `${name}.amount` : undefined;
1035
- const getCurrencyDropdownName = name => name ? `${name}.currencyCode` : undefined;
1036
+ const getAmountInputName = name => name ? "".concat(name, ".amount") : undefined;
1037
+ const getCurrencyDropdownName = name => name ? "".concat(name, ".currencyCode") : undefined;
1036
1038
  var _ref = {
1037
1039
  name: "pw7jst",
1038
1040
  styles: "position:relative;width:100%"
@@ -1042,6 +1044,7 @@ var _ref2 = {
1042
1044
  styles: "font-family:inherit;width:100%;position:relative;display:flex"
1043
1045
  } ;
1044
1046
  const MoneyInput = _ref5 => {
1047
+ var _context8, _context9;
1045
1048
  let _ref5$currencies = _ref5.currencies,
1046
1049
  currencies = _ref5$currencies === void 0 ? [] : _ref5$currencies,
1047
1050
  _ref5$horizontalConst = _ref5.horizontalConstraint,
@@ -1099,18 +1102,20 @@ const MoneyInput = _ref5 => {
1099
1102
  value: formattedAmount
1100
1103
  }
1101
1104
  };
1102
- onChange?.(fakeEvent);
1105
+ onChange === null || onChange === void 0 || onChange(fakeEvent);
1103
1106
  }
1104
1107
  }
1105
1108
  }, [intl.locale, onChange, moneyInputId, props.name, props.value.amount, props.value.currencyCode, toggleAmountHasFocus]);
1106
1109
  const handleAmountChange = react$1.useCallback(event => {
1107
- if (utils.isNumberish(event.target?.value)) {
1108
- onChange?.({
1110
+ var _event$target;
1111
+ if (utils.isNumberish((_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.value)) {
1112
+ var _event$target2;
1113
+ onChange === null || onChange === void 0 || onChange({
1109
1114
  persist: () => {},
1110
1115
  target: {
1111
1116
  id: MoneyInput.getAmountInputId(moneyInputId),
1112
1117
  name: getAmountInputName(props.name),
1113
- value: event.target?.value
1118
+ value: (_event$target2 = event.target) === null || _event$target2 === void 0 ? void 0 : _event$target2.value
1114
1119
  }
1115
1120
  });
1116
1121
  }
@@ -1118,7 +1123,7 @@ const MoneyInput = _ref5 => {
1118
1123
  const handleCurrencyChange = react$1.useCallback(option => {
1119
1124
  const currencyCode = option.value;
1120
1125
  if (props.value.currencyCode !== currencyCode) {
1121
- var _context6;
1126
+ var _context6, _amountInputRef$curre;
1122
1127
  // When the user changes from a currency with 3 fraction digits to
1123
1128
  // a currency with 2 fraction digits, and when the input value was
1124
1129
  // "9.000" (9), then it should change to "9.00" to reflect the new
@@ -1140,11 +1145,11 @@ const MoneyInput = _ref5 => {
1140
1145
  value: currencyCode || ''
1141
1146
  }
1142
1147
  };
1143
- onChange?.(fakeCurrencyEvent);
1148
+ onChange === null || onChange === void 0 || onChange(fakeCurrencyEvent);
1144
1149
 
1145
1150
  // change amount if necessary
1146
1151
  if (props.value.amount !== nextAmount) {
1147
- onChange?.({
1152
+ onChange === null || onChange === void 0 || onChange({
1148
1153
  persist: () => {},
1149
1154
  target: {
1150
1155
  id: MoneyInput.getAmountInputId(moneyInputId),
@@ -1153,7 +1158,7 @@ const MoneyInput = _ref5 => {
1153
1158
  }
1154
1159
  });
1155
1160
  }
1156
- amountInputRef.current?.focus();
1161
+ (_amountInputRef$curre = amountInputRef.current) === null || _amountInputRef$curre === void 0 || _amountInputRef$curre.focus();
1157
1162
  }
1158
1163
  }, [intl.locale, onChange, moneyInputId, props.name, props.value.amount, props.value.currencyCode]);
1159
1164
  const handleCurrencyFocus = react$1.useCallback(() => {
@@ -1197,9 +1202,10 @@ const MoneyInput = _ref5 => {
1197
1202
  const isHighPrecision = !MoneyInput.isEmpty(props.value) && MoneyInput.isHighPrecision(props.value, intl.locale);
1198
1203
  const onBlur = props.onBlur;
1199
1204
  const handleContainerBlur = react$1.useCallback(event => {
1205
+ var _containerRef$current;
1200
1206
  // ensures that both fields are marked as touched when one of them
1201
1207
  // is blurred
1202
- if (typeof onBlur === 'function' && !containerRef.current?.contains(event.relatedTarget)) {
1208
+ if (typeof onBlur === 'function' && !((_containerRef$current = containerRef.current) !== null && _containerRef$current !== void 0 && _containerRef$current.contains(event.relatedTarget))) {
1203
1209
  onBlur({
1204
1210
  target: {
1205
1211
  id: MoneyInput.getCurrencyDropdownId(moneyInputId),
@@ -1299,7 +1305,7 @@ const MoneyInput = _ref5 => {
1299
1305
  ,
1300
1306
  styles: {
1301
1307
  body: {
1302
- margin: `${designSystem.designTokens.spacing20} -${designSystem.designTokens.spacing10} ${designSystem.designTokens.spacing20} 0`
1308
+ margin: _concatInstanceProperty__default["default"](_context8 = _concatInstanceProperty__default["default"](_context9 = "".concat(designSystem.designTokens.spacing20, " -")).call(_context9, designSystem.designTokens.spacing10, " ")).call(_context8, designSystem.designTokens.spacing20, " 0")
1303
1309
  }
1304
1310
  },
1305
1311
  title: intl.formatMessage(messages.highPrecision),
@@ -1321,8 +1327,8 @@ MoneyInput.displayName = 'MoneyInput';
1321
1327
  MoneyInput.getAmountInputId = getAmountInputName;
1322
1328
  MoneyInput.getCurrencyDropdownId = getCurrencyDropdownName;
1323
1329
  MoneyInput.convertToMoneyValue = (value, locale) => {
1324
- var _context8;
1325
- return createMoneyValue(typeof value.amount === 'string' ? _trimInstanceProperty__default["default"](_context8 = value.amount).call(_context8) : '', locale, value.currencyCode);
1330
+ var _context0;
1331
+ return createMoneyValue(typeof value.amount === 'string' ? _trimInstanceProperty__default["default"](_context0 = value.amount).call(_context0) : '', locale, value.currencyCode);
1326
1332
  };
1327
1333
  MoneyInput.parseMoneyValue = (moneyValue, locale) => {
1328
1334
  if (!moneyValue) return {
@@ -1338,18 +1344,18 @@ MoneyInput.parseMoneyValue = (moneyValue, locale) => {
1338
1344
  };
1339
1345
  };
1340
1346
  MoneyInput.isEmpty = formValue => {
1341
- var _context9, _context0;
1342
- return !formValue || _trimInstanceProperty__default["default"](_context9 = formValue.amount).call(_context9) === '' || _trimInstanceProperty__default["default"](_context0 = formValue.currencyCode).call(_context0) === '';
1347
+ var _context1, _context10;
1348
+ return !formValue || _trimInstanceProperty__default["default"](_context1 = formValue.amount).call(_context1) === '' || _trimInstanceProperty__default["default"](_context10 = formValue.currencyCode).call(_context10) === '';
1343
1349
  };
1344
1350
  MoneyInput.isHighPrecision = (formValue, locale) => {
1345
1351
  const moneyValue = MoneyInput.convertToMoneyValue(formValue, locale);
1346
- return moneyValue?.type === 'highPrecision';
1352
+ return (moneyValue === null || moneyValue === void 0 ? void 0 : moneyValue.type) === 'highPrecision';
1347
1353
  };
1348
1354
  MoneyInput.isTouched = touched => Boolean(touched && touched.currencyCode && touched.amount);
1349
1355
  var MoneyInput$1 = MoneyInput;
1350
1356
 
1351
1357
  // NOTE: This string will be replaced on build time with the package version.
1352
- var version = "20.2.2";
1358
+ var version = "20.3.0";
1353
1359
 
1354
1360
  exports["default"] = MoneyInput$1;
1355
1361
  exports.version = version;
package/dist/commercetools-uikit-money-input.esm.js CHANGED
@@ -18,6 +18,7 @@ import _parseInt from '@babel/runtime-corejs3/core-js-stable/parse-int';
18
18
  import _trimInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/trim';
19
19
  import _mapInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/map';
20
20
  import _findInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/find';
21
+ import _concatInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/concat';
21
22
  import { useRef, useCallback } from 'react';
22
23
  import ReactDOM from 'react-dom';
23
24
  import has from 'lodash/has';
@@ -728,7 +729,7 @@ var messages = defineMessages({
728
729
  const _excluded = ["id"],
729
730
  _excluded2 = ["currencies", "horizontalConstraint", "menuPortalZIndex"];
730
731
  function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
731
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context1, _context10; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context1 = ownKeys(Object(t), !0)).call(_context1, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context10 = ownKeys(Object(t))).call(_context10, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
732
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context11, _context12; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context11 = ownKeys(Object(t), !0)).call(_context11, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context12 = ownKeys(Object(t))).call(_context12, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
732
733
  function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
733
734
  const TooltipWrapper = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
734
735
  target: "e1u90zjc0"
@@ -744,8 +745,8 @@ const TooltipWrapper = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "pro
744
745
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
745
746
  });
746
747
  const moneyInputSequentialId = createSequentialId('money-input-');
747
- const getPortalId = id => `portal-${id}`;
748
- const getPortalNode = id => document.querySelector(`#${getPortalId(id)}`);
748
+ const getPortalId = id => "portal-".concat(id);
749
+ const getPortalNode = id => document.querySelector("#".concat(getPortalId(id)));
749
750
  const Portal = props => {
750
751
  const domNode = getPortalNode(props.id);
751
752
  if (domNode) {
@@ -789,15 +790,15 @@ const createCurrencySelectStyles = _ref4 => {
789
790
  });
790
791
  return _objectSpread(_objectSpread({}, selectStyles), {}, {
791
792
  control: (base, state) => _objectSpread(_objectSpread({}, selectStyles.control(base, state)), {}, {
792
- padding: `0 ${designTokens.spacing25}`,
793
+ padding: "0 ".concat(designTokens.spacing25),
793
794
  borderTopRightRadius: '0',
794
795
  borderBottomRightRadius: '0',
795
796
  borderRight: '0',
796
797
  minWidth: '80px',
797
798
  height: '100%',
798
799
  borderColor: (() => {
799
- if (isDisabled) return `${designTokens.borderColorForInputWhenDisabled} !important`;
800
- if (isReadOnly) return `${designTokens.borderColorForInputWhenReadonly} !important`;
800
+ if (isDisabled) return "".concat(designTokens.borderColorForInputWhenDisabled, " !important");
801
+ if (isReadOnly) return "".concat(designTokens.borderColorForInputWhenReadonly, " !important");
801
802
  if (hasError) return designTokens.borderColorForInputWhenError;
802
803
  if (hasWarning) return designTokens.borderColorForInputWhenWarning;
803
804
  if (currencyHasFocus) {
@@ -807,7 +808,7 @@ const createCurrencySelectStyles = _ref4 => {
807
808
  })(),
808
809
  cursor: (() => {
809
810
  if (isDisabled) return 'not-allowed';
810
- if (isReadOnly) return `default`;
811
+ if (isReadOnly) return "default";
811
812
  return 'pointer';
812
813
  })(),
813
814
  backgroundColor: (() => {
@@ -920,7 +921,7 @@ const parseRawAmountToNumber = (rawAmount, locale) => {
920
921
  }
921
922
  fractionsSeparator = fractionsSeparator === '.' ? '\\.' : fractionsSeparator; // here we escape the '.' to use it as regex
922
923
  // The raw amount with only one sparator
923
- const normalizedAmount = String(rawAmount).replace(new RegExp(`[^-0-9${fractionsSeparator}]`, 'g'), '') // we just keep the numbers and the fraction symbol
924
+ const normalizedAmount = String(rawAmount).replace(new RegExp("[^-0-9".concat(fractionsSeparator, "]"), 'g'), '') // we just keep the numbers and the fraction symbol
924
925
  .replace(fractionsSeparator, '.'); // then we change whatever `fractionsSeparator` was to `.` so we can parse it as float
925
926
 
926
927
  return _parseFloat(normalizedAmount);
@@ -945,7 +946,7 @@ const createMoneyValue = (rawAmount, locale, currencyCode) => {
945
946
  if (!currency) return null;
946
947
  // The user may enter a value with a comma, dot, or apostrophe as the decimal separator.
947
948
  if (rawAmount.length === 0 || !isNumberish(rawAmount)) return null;
948
- process.env.NODE_ENV !== "production" ? warning(locale || currency.fractionDigits !== 0, `MoneyInput: A locale must be provided when currency has no fraction digits (${currencyCode})`) : void 0;
949
+ process.env.NODE_ENV !== "production" ? warning(locale || currency.fractionDigits !== 0, "MoneyInput: A locale must be provided when currency has no fraction digits (".concat(currencyCode, ")")) : void 0;
949
950
  const amountAsNumber = parseRawAmountToNumber(rawAmount, locale);
950
951
  if (isNaN(amountAsNumber)) return null;
951
952
 
@@ -1012,8 +1013,8 @@ const formatAmount = (rawAmount, locale, currencyCode) => {
1012
1013
  minimumFractionDigits: fractionDigits
1013
1014
  });
1014
1015
  };
1015
- const getAmountInputName = name => name ? `${name}.amount` : undefined;
1016
- const getCurrencyDropdownName = name => name ? `${name}.currencyCode` : undefined;
1016
+ const getAmountInputName = name => name ? "".concat(name, ".amount") : undefined;
1017
+ const getCurrencyDropdownName = name => name ? "".concat(name, ".currencyCode") : undefined;
1017
1018
  var _ref = process.env.NODE_ENV === "production" ? {
1018
1019
  name: "pw7jst",
1019
1020
  styles: "position:relative;width:100%"
@@ -1031,6 +1032,7 @@ var _ref2 = process.env.NODE_ENV === "production" ? {
1031
1032
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
1032
1033
  };
1033
1034
  const MoneyInput = _ref5 => {
1035
+ var _context8, _context9;
1034
1036
  let _ref5$currencies = _ref5.currencies,
1035
1037
  currencies = _ref5$currencies === void 0 ? [] : _ref5$currencies,
1036
1038
  _ref5$horizontalConst = _ref5.horizontalConstraint,
@@ -1090,18 +1092,20 @@ const MoneyInput = _ref5 => {
1090
1092
  value: formattedAmount
1091
1093
  }
1092
1094
  };
1093
- onChange?.(fakeEvent);
1095
+ onChange === null || onChange === void 0 || onChange(fakeEvent);
1094
1096
  }
1095
1097
  }
1096
1098
  }, [intl.locale, onChange, moneyInputId, props.name, props.value.amount, props.value.currencyCode, toggleAmountHasFocus]);
1097
1099
  const handleAmountChange = useCallback(event => {
1098
- if (isNumberish(event.target?.value)) {
1099
- onChange?.({
1100
+ var _event$target;
1101
+ if (isNumberish((_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.value)) {
1102
+ var _event$target2;
1103
+ onChange === null || onChange === void 0 || onChange({
1100
1104
  persist: () => {},
1101
1105
  target: {
1102
1106
  id: MoneyInput.getAmountInputId(moneyInputId),
1103
1107
  name: getAmountInputName(props.name),
1104
- value: event.target?.value
1108
+ value: (_event$target2 = event.target) === null || _event$target2 === void 0 ? void 0 : _event$target2.value
1105
1109
  }
1106
1110
  });
1107
1111
  }
@@ -1109,7 +1113,7 @@ const MoneyInput = _ref5 => {
1109
1113
  const handleCurrencyChange = useCallback(option => {
1110
1114
  const currencyCode = option.value;
1111
1115
  if (props.value.currencyCode !== currencyCode) {
1112
- var _context6;
1116
+ var _context6, _amountInputRef$curre;
1113
1117
  // When the user changes from a currency with 3 fraction digits to
1114
1118
  // a currency with 2 fraction digits, and when the input value was
1115
1119
  // "9.000" (9), then it should change to "9.00" to reflect the new
@@ -1131,11 +1135,11 @@ const MoneyInput = _ref5 => {
1131
1135
  value: currencyCode || ''
1132
1136
  }
1133
1137
  };
1134
- onChange?.(fakeCurrencyEvent);
1138
+ onChange === null || onChange === void 0 || onChange(fakeCurrencyEvent);
1135
1139
 
1136
1140
  // change amount if necessary
1137
1141
  if (props.value.amount !== nextAmount) {
1138
- onChange?.({
1142
+ onChange === null || onChange === void 0 || onChange({
1139
1143
  persist: () => {},
1140
1144
  target: {
1141
1145
  id: MoneyInput.getAmountInputId(moneyInputId),
@@ -1144,7 +1148,7 @@ const MoneyInput = _ref5 => {
1144
1148
  }
1145
1149
  });
1146
1150
  }
1147
- amountInputRef.current?.focus();
1151
+ (_amountInputRef$curre = amountInputRef.current) === null || _amountInputRef$curre === void 0 || _amountInputRef$curre.focus();
1148
1152
  }
1149
1153
  }, [intl.locale, onChange, moneyInputId, props.name, props.value.amount, props.value.currencyCode]);
1150
1154
  const handleCurrencyFocus = useCallback(() => {
@@ -1188,9 +1192,10 @@ const MoneyInput = _ref5 => {
1188
1192
  const isHighPrecision = !MoneyInput.isEmpty(props.value) && MoneyInput.isHighPrecision(props.value, intl.locale);
1189
1193
  const onBlur = props.onBlur;
1190
1194
  const handleContainerBlur = useCallback(event => {
1195
+ var _containerRef$current;
1191
1196
  // ensures that both fields are marked as touched when one of them
1192
1197
  // is blurred
1193
- if (typeof onBlur === 'function' && !containerRef.current?.contains(event.relatedTarget)) {
1198
+ if (typeof onBlur === 'function' && !((_containerRef$current = containerRef.current) !== null && _containerRef$current !== void 0 && _containerRef$current.contains(event.relatedTarget))) {
1194
1199
  onBlur({
1195
1200
  target: {
1196
1201
  id: MoneyInput.getCurrencyDropdownId(moneyInputId),
@@ -1290,7 +1295,7 @@ const MoneyInput = _ref5 => {
1290
1295
  ,
1291
1296
  styles: {
1292
1297
  body: {
1293
- margin: `${designTokens.spacing20} -${designTokens.spacing10} ${designTokens.spacing20} 0`
1298
+ margin: _concatInstanceProperty(_context8 = _concatInstanceProperty(_context9 = "".concat(designTokens.spacing20, " -")).call(_context9, designTokens.spacing10, " ")).call(_context8, designTokens.spacing20, " 0")
1294
1299
  }
1295
1300
  },
1296
1301
  title: intl.formatMessage(messages.highPrecision),
@@ -1312,8 +1317,8 @@ MoneyInput.displayName = 'MoneyInput';
1312
1317
  MoneyInput.getAmountInputId = getAmountInputName;
1313
1318
  MoneyInput.getCurrencyDropdownId = getCurrencyDropdownName;
1314
1319
  MoneyInput.convertToMoneyValue = (value, locale) => {
1315
- var _context8;
1316
- return createMoneyValue(typeof value.amount === 'string' ? _trimInstanceProperty(_context8 = value.amount).call(_context8) : '', locale, value.currencyCode);
1320
+ var _context0;
1321
+ return createMoneyValue(typeof value.amount === 'string' ? _trimInstanceProperty(_context0 = value.amount).call(_context0) : '', locale, value.currencyCode);
1317
1322
  };
1318
1323
  MoneyInput.parseMoneyValue = (moneyValue, locale) => {
1319
1324
  if (!moneyValue) return {
@@ -1336,18 +1341,18 @@ MoneyInput.parseMoneyValue = (moneyValue, locale) => {
1336
1341
  };
1337
1342
  };
1338
1343
  MoneyInput.isEmpty = formValue => {
1339
- var _context9, _context0;
1340
- return !formValue || _trimInstanceProperty(_context9 = formValue.amount).call(_context9) === '' || _trimInstanceProperty(_context0 = formValue.currencyCode).call(_context0) === '';
1344
+ var _context1, _context10;
1345
+ return !formValue || _trimInstanceProperty(_context1 = formValue.amount).call(_context1) === '' || _trimInstanceProperty(_context10 = formValue.currencyCode).call(_context10) === '';
1341
1346
  };
1342
1347
  MoneyInput.isHighPrecision = (formValue, locale) => {
1343
1348
  process.env.NODE_ENV !== "production" ? warning(!MoneyInput.isEmpty(formValue), 'MoneyValue.isHighPrecision may not be called with an empty money value.') : void 0;
1344
1349
  const moneyValue = MoneyInput.convertToMoneyValue(formValue, locale);
1345
- return moneyValue?.type === 'highPrecision';
1350
+ return (moneyValue === null || moneyValue === void 0 ? void 0 : moneyValue.type) === 'highPrecision';
1346
1351
  };
1347
1352
  MoneyInput.isTouched = touched => Boolean(touched && touched.currencyCode && touched.amount);
1348
1353
  var MoneyInput$1 = MoneyInput;
1349
1354
 
1350
1355
  // NOTE: This string will be replaced on build time with the package version.
1351
- var version = "20.2.2";
1356
+ var version = "20.3.0";
1352
1357
 
1353
1358
  export { MoneyInput$1 as default, version };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@commercetools-uikit/money-input",
3
3
  "description": "A controlled input component for money values with validation states.",
4
- "version": "20.2.2",
4
+ "version": "20.3.0",
5
5
  "bugs": "https://github.com/commercetools/ui-kit/issues",
6
6
  "repository": {
7
7
  "type": "git",
@@ -21,22 +21,22 @@
21
21
  "dependencies": {
22
22
  "@babel/runtime": "^7.20.13",
23
23
  "@babel/runtime-corejs3": "^7.20.13",
24
- "@commercetools-uikit/constraints": "20.2.2",
25
- "@commercetools-uikit/design-system": "20.2.2",
26
- "@commercetools-uikit/hooks": "20.2.2",
27
- "@commercetools-uikit/icons": "20.2.2",
28
- "@commercetools-uikit/input-utils": "20.2.2",
29
- "@commercetools-uikit/select-utils": "20.2.2",
30
- "@commercetools-uikit/tooltip": "20.2.2",
31
- "@commercetools-uikit/utils": "20.2.2",
24
+ "@commercetools-uikit/constraints": "20.3.0",
25
+ "@commercetools-uikit/design-system": "20.3.0",
26
+ "@commercetools-uikit/hooks": "20.3.0",
27
+ "@commercetools-uikit/icons": "20.3.0",
28
+ "@commercetools-uikit/input-utils": "20.3.0",
29
+ "@commercetools-uikit/select-utils": "20.3.0",
30
+ "@commercetools-uikit/tooltip": "20.3.0",
31
+ "@commercetools-uikit/utils": "20.3.0",
32
32
  "@emotion/react": "^11.10.5",
33
33
  "@emotion/styled": "^11.10.5",
34
34
  "lodash": "4.17.21",
35
- "react-select": "5.10.1"
35
+ "react-select": "5.10.2"
36
36
  },
37
37
  "devDependencies": {
38
- "react": "19.1.0",
39
- "react-dom": "19.1.0",
38
+ "react": "19.2.0",
39
+ "react-dom": "19.2.0",
40
40
  "react-intl": "^7.1.4"
41
41
  },
42
42
  "peerDependencies": {