@commercetools-uikit/localized-rich-text-input 20.5.0 → 20.6.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.
package/README.md CHANGED
@@ -1,5 +1,5 @@
1
1
  <!-- THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY. -->
2
- <!-- This file is created by the `yarn generate-readme` script. -->
2
+ <!-- This file is created by the `pnpm generate-readme` script. -->
3
3
 
4
4
  # LocalizedRichTextInput
5
5
 
@@ -11,7 +11,7 @@ states.
11
11
  ## Installation
12
12
 
13
13
  ```
14
- yarn add @commercetools-uikit/localized-rich-text-input
14
+ pnpm add @commercetools-uikit/localized-rich-text-input
15
15
  ```
16
16
 
17
17
  ```
@@ -21,7 +21,7 @@ npm --save install @commercetools-uikit/localized-rich-text-input
21
21
  Additionally install the peer dependencies (if not present)
22
22
 
23
23
  ```
24
- yarn add react react-dom react-intl
24
+ pnpm add react react-dom react-intl
25
25
  ```
26
26
 
27
27
  ```
@@ -13,7 +13,6 @@ var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWit
13
13
  var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
14
14
  var _reduceInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/reduce');
15
15
  var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
16
- var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
17
16
  var _Map = require('@babel/runtime-corejs3/core-js-stable/map');
18
17
  var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
19
18
  var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
@@ -57,7 +56,6 @@ var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$def
57
56
  var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
58
57
  var _reduceInstanceProperty__default = /*#__PURE__*/_interopDefault(_reduceInstanceProperty);
59
58
  var _Object$keys__default = /*#__PURE__*/_interopDefault(_Object$keys);
60
- var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
61
59
  var _Map__default = /*#__PURE__*/_interopDefault(_Map);
62
60
  var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachInstanceProperty);
63
61
  var _mapInstanceProperty__default = /*#__PURE__*/_interopDefault(_mapInstanceProperty);
@@ -72,7 +70,7 @@ var isHotkey__default = /*#__PURE__*/_interopDefault(isHotkey);
72
70
  var pipe__default = /*#__PURE__*/_interopDefault(pipe);
73
71
 
74
72
  function _EMOTION_STRINGIFIED_CSS_ERROR__$1() { 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)."; }
75
- const getEditorLanguageLabelBorderColor = props => "1px solid ".concat(props.isReadOnly ? designSystem.designTokens.borderColorForInputWhenReadonly : designSystem.designTokens.borderColorForInputWhenDisabled);
73
+ const getEditorLanguageLabelBorderColor = props => `1px solid ${props.isReadOnly ? designSystem.designTokens.borderColorForInputWhenReadonly : designSystem.designTokens.borderColorForInputWhenDisabled}`;
76
74
  const getBackgroundColor = props => {
77
75
  if (props.isDisabled) {
78
76
  return designSystem.designTokens.backgroundColorForInputWhenDisabled;
@@ -185,8 +183,7 @@ const Editor = /*#__PURE__*/react.forwardRef((props, forwardedRef) => {
185
183
  toggleLanguage(props.language);
186
184
  }, [toggleLanguage, props.language]);
187
185
  const updateRenderToggleButton = react.useCallback(() => {
188
- var _ref$current;
189
- const doesExceedCollapsedHeightLimit = Number((_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.clientHeight) > COLLAPSED_HEIGHT;
186
+ const doesExceedCollapsedHeightLimit = Number(ref.current?.clientHeight) > COLLAPSED_HEIGHT;
190
187
  if (doesExceedCollapsedHeightLimit && !renderToggleButton) {
191
188
  setRenderToggleButton(true);
192
189
  }
@@ -200,8 +197,7 @@ const Editor = /*#__PURE__*/react.forwardRef((props, forwardedRef) => {
200
197
 
201
198
  // resetting
202
199
  const resetValue = react.useCallback(newValue => {
203
- var _newValue$props$langu;
204
- const newStringValue = typeof newValue === 'string' ? newValue : (_newValue$props$langu = newValue === null || newValue === void 0 ? void 0 : newValue[props.language]) !== null && _newValue$props$langu !== void 0 ? _newValue$props$langu : '';
200
+ const newStringValue = typeof newValue === 'string' ? newValue : newValue?.[props.language] ?? '';
205
201
  richTextUtils.resetEditor(editor, newStringValue);
206
202
  }, [editor, props.language]);
207
203
  /*
@@ -279,8 +275,7 @@ const Editor = /*#__PURE__*/react.forwardRef((props, forwardedRef) => {
279
275
  autoFocus: props.isAutofocused,
280
276
  onBlur: props.onBlur,
281
277
  onFocus: event => {
282
- var _props$onFocus;
283
- (_props$onFocus = props.onFocus) === null || _props$onFocus === void 0 || _props$onFocus.call(props, event);
278
+ props.onFocus?.(event);
284
279
  // opens the input if it regains focus and it's closed
285
280
  if (!isOpen) {
286
281
  toggle();
@@ -388,8 +383,7 @@ let RichTextInput = /*#__PURE__*/function (_PureComponent) {
388
383
  // the consumer only cares about the serializedValue, so it doesn't make sense to call
389
384
  // onChange unless this value changes.
390
385
  if (hasSerializedValueChanged) {
391
- var _this$props$onChange, _this$props;
392
- (_this$props$onChange = (_this$props = _this.props).onChange) === null || _this$props$onChange === void 0 || _this$props$onChange.call(_this$props, richTextUtils.html.serialize(state));
386
+ _this.props.onChange?.(richTextUtils.html.serialize(state));
393
387
  }
394
388
  if (hasInternalSlateValueChanged && !hasSerializedValueChanged) {
395
389
  // this way we force update if cursor or selection changes
@@ -465,7 +459,7 @@ var RequiredValueErrorMessage$1 = RequiredValueErrorMessage;
465
459
 
466
460
  const _excluded = ["horizontalConstraint", "showExpandIcon"];
467
461
  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; }
468
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context6, _context7; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context6 = ownKeys(Object(t), !0)).call(_context6, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context7 = ownKeys(Object(t))).call(_context7, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
462
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context4, _context5; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context4 = ownKeys(Object(t), !0)).call(_context4, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context5 = ownKeys(Object(t))).call(_context5, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
469
463
  const expandedTranslationsReducer = (state, action) => {
470
464
  switch (action.type) {
471
465
  case 'toggle':
@@ -528,11 +522,10 @@ const LocalizedRichTextInput = /*#__PURE__*/react.forwardRef((_ref, ref) => {
528
522
  });
529
523
  }, [expandedTranslationsDispatch]);
530
524
  const createChangeHandler = react.useCallback(language => state => {
531
- var _props$onChange, _context3, _context4;
532
- (_props$onChange = props.onChange) === null || _props$onChange === void 0 || _props$onChange.call(props, {
525
+ props.onChange?.({
533
526
  target: {
534
- id: props !== null && props !== void 0 && props.id ? _concatInstanceProperty__default["default"](_context3 = "".concat(props.id, ".")).call(_context3, language) : '',
535
- name: props !== null && props !== void 0 && props.name ? _concatInstanceProperty__default["default"](_context4 = "".concat(props.name, ".")).call(_context4, language) : '',
527
+ id: props?.id ? `${props.id}.${language}` : '',
528
+ name: props?.name ? `${props.name}.${language}` : '',
536
529
  language,
537
530
  value: state
538
531
  }
@@ -552,9 +545,9 @@ const LocalizedRichTextInput = /*#__PURE__*/react.forwardRef((_ref, ref) => {
552
545
  }
553
546
  const langRefs = react.useRef(new _Map__default["default"]());
554
547
  const resetValue = react.useCallback(newValue => {
555
- var _context5;
556
- _forEachInstanceProperty__default["default"](_context5 = langRefs.current).call(_context5, langRef => {
557
- langRef === null || langRef === void 0 || langRef.resetValue(newValue);
548
+ var _context3;
549
+ _forEachInstanceProperty__default["default"](_context3 = langRefs.current).call(_context3, langRef => {
550
+ langRef?.resetValue(newValue);
558
551
  });
559
552
  }, []);
560
553
  react.useImperativeHandle(ref, () => {
@@ -621,7 +614,7 @@ LocalizedRichTextInput.isTouched = localizedUtils.isTouched;
621
614
  var LocalizedRichTextInput$1 = LocalizedRichTextInput;
622
615
 
623
616
  // NOTE: This string will be replaced on build time with the package version.
624
- var version = "20.5.0";
617
+ var version = "20.6.0";
625
618
 
626
619
  exports["default"] = LocalizedRichTextInput$1;
627
620
  exports.version = version;
@@ -13,7 +13,6 @@ var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWit
13
13
  var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
14
14
  var _reduceInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/reduce');
15
15
  var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
16
- var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
17
16
  var _Map = require('@babel/runtime-corejs3/core-js-stable/map');
18
17
  var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
19
18
  var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
@@ -57,7 +56,6 @@ var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$def
57
56
  var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
58
57
  var _reduceInstanceProperty__default = /*#__PURE__*/_interopDefault(_reduceInstanceProperty);
59
58
  var _Object$keys__default = /*#__PURE__*/_interopDefault(_Object$keys);
60
- var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
61
59
  var _Map__default = /*#__PURE__*/_interopDefault(_Map);
62
60
  var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachInstanceProperty);
63
61
  var _mapInstanceProperty__default = /*#__PURE__*/_interopDefault(_mapInstanceProperty);
@@ -71,7 +69,7 @@ var FlatButton__default = /*#__PURE__*/_interopDefault(FlatButton);
71
69
  var isHotkey__default = /*#__PURE__*/_interopDefault(isHotkey);
72
70
  var pipe__default = /*#__PURE__*/_interopDefault(pipe);
73
71
 
74
- const getEditorLanguageLabelBorderColor = props => "1px solid ".concat(props.isReadOnly ? designSystem.designTokens.borderColorForInputWhenReadonly : designSystem.designTokens.borderColorForInputWhenDisabled);
72
+ const getEditorLanguageLabelBorderColor = props => `1px solid ${props.isReadOnly ? designSystem.designTokens.borderColorForInputWhenReadonly : designSystem.designTokens.borderColorForInputWhenDisabled}`;
75
73
  const getBackgroundColor = props => {
76
74
  if (props.isDisabled) {
77
75
  return designSystem.designTokens.backgroundColorForInputWhenDisabled;
@@ -143,8 +141,7 @@ const Editor = /*#__PURE__*/react.forwardRef((props, forwardedRef) => {
143
141
  toggleLanguage(props.language);
144
142
  }, [toggleLanguage, props.language]);
145
143
  const updateRenderToggleButton = react.useCallback(() => {
146
- var _ref$current;
147
- const doesExceedCollapsedHeightLimit = Number((_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.clientHeight) > COLLAPSED_HEIGHT;
144
+ const doesExceedCollapsedHeightLimit = Number(ref.current?.clientHeight) > COLLAPSED_HEIGHT;
148
145
  if (doesExceedCollapsedHeightLimit && !renderToggleButton) {
149
146
  setRenderToggleButton(true);
150
147
  }
@@ -158,8 +155,7 @@ const Editor = /*#__PURE__*/react.forwardRef((props, forwardedRef) => {
158
155
 
159
156
  // resetting
160
157
  const resetValue = react.useCallback(newValue => {
161
- var _newValue$props$langu;
162
- const newStringValue = typeof newValue === 'string' ? newValue : (_newValue$props$langu = newValue === null || newValue === void 0 ? void 0 : newValue[props.language]) !== null && _newValue$props$langu !== void 0 ? _newValue$props$langu : '';
158
+ const newStringValue = typeof newValue === 'string' ? newValue : newValue?.[props.language] ?? '';
163
159
  richTextUtils.resetEditor(editor, newStringValue);
164
160
  }, [editor, props.language]);
165
161
  /*
@@ -237,8 +233,7 @@ const Editor = /*#__PURE__*/react.forwardRef((props, forwardedRef) => {
237
233
  autoFocus: props.isAutofocused,
238
234
  onBlur: props.onBlur,
239
235
  onFocus: event => {
240
- var _props$onFocus;
241
- (_props$onFocus = props.onFocus) === null || _props$onFocus === void 0 || _props$onFocus.call(props, event);
236
+ props.onFocus?.(event);
242
237
  // opens the input if it regains focus and it's closed
243
238
  if (!isOpen) {
244
239
  toggle();
@@ -346,8 +341,7 @@ let RichTextInput = /*#__PURE__*/function (_PureComponent) {
346
341
  // the consumer only cares about the serializedValue, so it doesn't make sense to call
347
342
  // onChange unless this value changes.
348
343
  if (hasSerializedValueChanged) {
349
- var _this$props$onChange, _this$props;
350
- (_this$props$onChange = (_this$props = _this.props).onChange) === null || _this$props$onChange === void 0 || _this$props$onChange.call(_this$props, richTextUtils.html.serialize(state));
344
+ _this.props.onChange?.(richTextUtils.html.serialize(state));
351
345
  }
352
346
  if (hasInternalSlateValueChanged && !hasSerializedValueChanged) {
353
347
  // this way we force update if cursor or selection changes
@@ -419,7 +413,7 @@ var RequiredValueErrorMessage$1 = RequiredValueErrorMessage;
419
413
 
420
414
  const _excluded = ["horizontalConstraint", "showExpandIcon"];
421
415
  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; }
422
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context6, _context7; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context6 = ownKeys(Object(t), !0)).call(_context6, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context7 = ownKeys(Object(t))).call(_context7, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
416
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context4, _context5; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context4 = ownKeys(Object(t), !0)).call(_context4, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context5 = ownKeys(Object(t))).call(_context5, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
423
417
  const expandedTranslationsReducer = (state, action) => {
424
418
  switch (action.type) {
425
419
  case 'toggle':
@@ -475,11 +469,10 @@ const LocalizedRichTextInput = /*#__PURE__*/react.forwardRef((_ref, ref) => {
475
469
  });
476
470
  }, [expandedTranslationsDispatch]);
477
471
  const createChangeHandler = react.useCallback(language => state => {
478
- var _props$onChange, _context3, _context4;
479
- (_props$onChange = props.onChange) === null || _props$onChange === void 0 || _props$onChange.call(props, {
472
+ props.onChange?.({
480
473
  target: {
481
- id: props !== null && props !== void 0 && props.id ? _concatInstanceProperty__default["default"](_context3 = "".concat(props.id, ".")).call(_context3, language) : '',
482
- name: props !== null && props !== void 0 && props.name ? _concatInstanceProperty__default["default"](_context4 = "".concat(props.name, ".")).call(_context4, language) : '',
474
+ id: props?.id ? `${props.id}.${language}` : '',
475
+ name: props?.name ? `${props.name}.${language}` : '',
483
476
  language,
484
477
  value: state
485
478
  }
@@ -499,9 +492,9 @@ const LocalizedRichTextInput = /*#__PURE__*/react.forwardRef((_ref, ref) => {
499
492
  }
500
493
  const langRefs = react.useRef(new _Map__default["default"]());
501
494
  const resetValue = react.useCallback(newValue => {
502
- var _context5;
503
- _forEachInstanceProperty__default["default"](_context5 = langRefs.current).call(_context5, langRef => {
504
- langRef === null || langRef === void 0 || langRef.resetValue(newValue);
495
+ var _context3;
496
+ _forEachInstanceProperty__default["default"](_context3 = langRefs.current).call(_context3, langRef => {
497
+ langRef?.resetValue(newValue);
505
498
  });
506
499
  }, []);
507
500
  react.useImperativeHandle(ref, () => {
@@ -568,7 +561,7 @@ LocalizedRichTextInput.isTouched = localizedUtils.isTouched;
568
561
  var LocalizedRichTextInput$1 = LocalizedRichTextInput;
569
562
 
570
563
  // NOTE: This string will be replaced on build time with the package version.
571
- var version = "20.5.0";
564
+ var version = "20.6.0";
572
565
 
573
566
  exports["default"] = LocalizedRichTextInput$1;
574
567
  exports.version = version;
@@ -9,7 +9,6 @@ import _objectWithoutProperties from '@babel/runtime-corejs3/helpers/esm/objectW
9
9
  import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
10
10
  import _reduceInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/reduce';
11
11
  import _Object$keys from '@babel/runtime-corejs3/core-js-stable/object/keys';
12
- import _concatInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/concat';
13
12
  import _Map from '@babel/runtime-corejs3/core-js-stable/map';
14
13
  import _forEachInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/for-each';
15
14
  import _mapInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/map';
@@ -44,7 +43,7 @@ import pipe from 'lodash/fp/pipe';
44
43
  import { jsx, jsxs } from '@emotion/react/jsx-runtime';
45
44
 
46
45
  function _EMOTION_STRINGIFIED_CSS_ERROR__$1() { 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)."; }
47
- const getEditorLanguageLabelBorderColor = props => "1px solid ".concat(props.isReadOnly ? designTokens.borderColorForInputWhenReadonly : designTokens.borderColorForInputWhenDisabled);
46
+ const getEditorLanguageLabelBorderColor = props => `1px solid ${props.isReadOnly ? designTokens.borderColorForInputWhenReadonly : designTokens.borderColorForInputWhenDisabled}`;
48
47
  const getBackgroundColor = props => {
49
48
  if (props.isDisabled) {
50
49
  return designTokens.backgroundColorForInputWhenDisabled;
@@ -157,8 +156,7 @@ const Editor = /*#__PURE__*/forwardRef((props, forwardedRef) => {
157
156
  toggleLanguage(props.language);
158
157
  }, [toggleLanguage, props.language]);
159
158
  const updateRenderToggleButton = useCallback(() => {
160
- var _ref$current;
161
- const doesExceedCollapsedHeightLimit = Number((_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.clientHeight) > COLLAPSED_HEIGHT;
159
+ const doesExceedCollapsedHeightLimit = Number(ref.current?.clientHeight) > COLLAPSED_HEIGHT;
162
160
  if (doesExceedCollapsedHeightLimit && !renderToggleButton) {
163
161
  setRenderToggleButton(true);
164
162
  }
@@ -172,8 +170,7 @@ const Editor = /*#__PURE__*/forwardRef((props, forwardedRef) => {
172
170
 
173
171
  // resetting
174
172
  const resetValue = useCallback(newValue => {
175
- var _newValue$props$langu;
176
- const newStringValue = typeof newValue === 'string' ? newValue : (_newValue$props$langu = newValue === null || newValue === void 0 ? void 0 : newValue[props.language]) !== null && _newValue$props$langu !== void 0 ? _newValue$props$langu : '';
173
+ const newStringValue = typeof newValue === 'string' ? newValue : newValue?.[props.language] ?? '';
177
174
  resetEditor(editor, newStringValue);
178
175
  }, [editor, props.language]);
179
176
  /*
@@ -251,8 +248,7 @@ const Editor = /*#__PURE__*/forwardRef((props, forwardedRef) => {
251
248
  autoFocus: props.isAutofocused,
252
249
  onBlur: props.onBlur,
253
250
  onFocus: event => {
254
- var _props$onFocus;
255
- (_props$onFocus = props.onFocus) === null || _props$onFocus === void 0 || _props$onFocus.call(props, event);
251
+ props.onFocus?.(event);
256
252
  // opens the input if it regains focus and it's closed
257
253
  if (!isOpen) {
258
254
  toggle();
@@ -360,8 +356,7 @@ let RichTextInput = /*#__PURE__*/function (_PureComponent) {
360
356
  // the consumer only cares about the serializedValue, so it doesn't make sense to call
361
357
  // onChange unless this value changes.
362
358
  if (hasSerializedValueChanged) {
363
- var _this$props$onChange, _this$props;
364
- (_this$props$onChange = (_this$props = _this.props).onChange) === null || _this$props$onChange === void 0 || _this$props$onChange.call(_this$props, html.serialize(state));
359
+ _this.props.onChange?.(html.serialize(state));
365
360
  }
366
361
  if (hasInternalSlateValueChanged && !hasSerializedValueChanged) {
367
362
  // this way we force update if cursor or selection changes
@@ -437,7 +432,7 @@ var RequiredValueErrorMessage$1 = RequiredValueErrorMessage;
437
432
 
438
433
  const _excluded = ["horizontalConstraint", "showExpandIcon"];
439
434
  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; }
440
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context6, _context7; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context6 = ownKeys(Object(t), !0)).call(_context6, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context7 = ownKeys(Object(t))).call(_context7, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
435
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context4, _context5; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context4 = ownKeys(Object(t), !0)).call(_context4, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context5 = ownKeys(Object(t))).call(_context5, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
441
436
  const expandedTranslationsReducer = (state, action) => {
442
437
  switch (action.type) {
443
438
  case 'toggle':
@@ -500,11 +495,10 @@ const LocalizedRichTextInput = /*#__PURE__*/forwardRef((_ref, ref) => {
500
495
  });
501
496
  }, [expandedTranslationsDispatch]);
502
497
  const createChangeHandler = useCallback(language => state => {
503
- var _props$onChange, _context3, _context4;
504
- (_props$onChange = props.onChange) === null || _props$onChange === void 0 || _props$onChange.call(props, {
498
+ props.onChange?.({
505
499
  target: {
506
- id: props !== null && props !== void 0 && props.id ? _concatInstanceProperty(_context3 = "".concat(props.id, ".")).call(_context3, language) : '',
507
- name: props !== null && props !== void 0 && props.name ? _concatInstanceProperty(_context4 = "".concat(props.name, ".")).call(_context4, language) : '',
500
+ id: props?.id ? `${props.id}.${language}` : '',
501
+ name: props?.name ? `${props.name}.${language}` : '',
508
502
  language,
509
503
  value: state
510
504
  }
@@ -524,9 +518,9 @@ const LocalizedRichTextInput = /*#__PURE__*/forwardRef((_ref, ref) => {
524
518
  }
525
519
  const langRefs = useRef(new _Map());
526
520
  const resetValue = useCallback(newValue => {
527
- var _context5;
528
- _forEachInstanceProperty(_context5 = langRefs.current).call(_context5, langRef => {
529
- langRef === null || langRef === void 0 || langRef.resetValue(newValue);
521
+ var _context3;
522
+ _forEachInstanceProperty(_context3 = langRefs.current).call(_context3, langRef => {
523
+ langRef?.resetValue(newValue);
530
524
  });
531
525
  }, []);
532
526
  useImperativeHandle(ref, () => {
@@ -593,6 +587,6 @@ LocalizedRichTextInput.isTouched = isTouched;
593
587
  var LocalizedRichTextInput$1 = LocalizedRichTextInput;
594
588
 
595
589
  // NOTE: This string will be replaced on build time with the package version.
596
- var version = "20.5.0";
590
+ var version = "20.6.0";
597
591
 
598
592
  export { LocalizedRichTextInput$1 as default, version };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@commercetools-uikit/localized-rich-text-input",
3
3
  "description": "A controlled text input component for localized rich text input with validation states.",
4
- "version": "20.5.0",
4
+ "version": "20.6.0",
5
5
  "bugs": "https://github.com/commercetools/ui-kit/issues",
6
6
  "repository": {
7
7
  "type": "git",
@@ -9,7 +9,13 @@
9
9
  "directory": "packages/components/inputs/localized-rich-text-input"
10
10
  },
11
11
  "homepage": "https://uikit.commercetools.com",
12
- "keywords": ["javascript", "typescript", "design-system", "react", "uikit"],
12
+ "keywords": [
13
+ "javascript",
14
+ "typescript",
15
+ "design-system",
16
+ "react",
17
+ "uikit"
18
+ ],
13
19
  "license": "MIT",
14
20
  "publishConfig": {
15
21
  "access": "public"
@@ -17,44 +23,50 @@
17
23
  "sideEffects": false,
18
24
  "main": "dist/commercetools-uikit-localized-rich-text-input.cjs.js",
19
25
  "module": "dist/commercetools-uikit-localized-rich-text-input.esm.js",
20
- "files": ["dist"],
26
+ "files": [
27
+ "dist"
28
+ ],
21
29
  "dependencies": {
22
30
  "@babel/runtime": "^7.20.13",
23
31
  "@babel/runtime-corejs3": "^7.20.13",
24
- "@commercetools-uikit/collapsible-motion": "20.5.0",
25
- "@commercetools-uikit/constraints": "20.5.0",
26
- "@commercetools-uikit/design-system": "20.5.0",
27
- "@commercetools-uikit/flat-button": "20.5.0",
28
- "@commercetools-uikit/hooks": "20.5.0",
29
- "@commercetools-uikit/icons": "20.5.0",
30
- "@commercetools-uikit/input-utils": "20.5.0",
31
- "@commercetools-uikit/localized-utils": "20.5.0",
32
- "@commercetools-uikit/messages": "20.5.0",
33
- "@commercetools-uikit/rich-text-utils": "20.5.0",
34
- "@commercetools-uikit/spacings-inline": "20.5.0",
35
- "@commercetools-uikit/spacings-stack": "20.5.0",
36
- "@commercetools-uikit/text": "20.5.0",
37
- "@commercetools-uikit/tooltip": "20.5.0",
38
- "@commercetools-uikit/utils": "20.5.0",
39
32
  "@emotion/react": "^11.10.5",
40
33
  "@emotion/styled": "^11.10.5",
41
34
  "downshift": "9.0.10",
42
- "immutable": "4.3.7",
35
+ "immutable": "4.3.8",
43
36
  "is-hotkey": "0.2.0",
44
- "lodash": "4.17.23",
37
+ "lodash": "4.18.1",
45
38
  "react-textarea-autosize": "8.4.0",
46
39
  "slate": "0.75.0",
47
40
  "slate-history": "0.113.1",
48
- "slate-react": "0.75.0"
41
+ "slate-react": "0.75.0",
42
+ "@commercetools-uikit/collapsible-motion": "^20.6.0",
43
+ "@commercetools-uikit/design-system": "^20.6.0",
44
+ "@commercetools-uikit/constraints": "^20.6.0",
45
+ "@commercetools-uikit/flat-button": "^20.6.0",
46
+ "@commercetools-uikit/hooks": "^20.6.0",
47
+ "@commercetools-uikit/input-utils": "^20.6.0",
48
+ "@commercetools-uikit/rich-text-utils": "^20.6.0",
49
+ "@commercetools-uikit/messages": "^20.6.0",
50
+ "@commercetools-uikit/spacings-inline": "^20.6.0",
51
+ "@commercetools-uikit/spacings-stack": "^20.6.0",
52
+ "@commercetools-uikit/text": "^20.6.0",
53
+ "@commercetools-uikit/icons": "^20.6.0",
54
+ "@commercetools-uikit/utils": "^20.6.0",
55
+ "@commercetools-uikit/localized-utils": "^20.6.0",
56
+ "@commercetools-uikit/tooltip": "^20.6.0"
49
57
  },
50
58
  "devDependencies": {
51
59
  "react": "19.2.0",
52
60
  "react-dom": "19.2.0",
53
- "react-intl": "^7.1.4"
61
+ "react-intl": "^7.1.4",
62
+ "react-router-dom": "5.3.4",
63
+ "@commercetools-uikit/collapsible-panel": "^20.6.0",
64
+ "@commercetools-uikit/spacings": "^20.6.0",
65
+ "@commercetools-uikit/primary-button": "^20.6.0"
54
66
  },
55
67
  "peerDependencies": {
56
68
  "react": "19.x",
57
69
  "react-dom": "19.x",
58
70
  "react-intl": "7.x"
59
71
  }
60
- }
72
+ }