@pushwoosh/dumb-components 1.1.180 → 1.1.181

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 (46) hide show
  1. package/Banner/Banner.js +1 -1
  2. package/Calendar/CalendarDropdown/CalendarDropdown.js +3 -4
  3. package/Calendar/CalendarMonthSlider/CalendarMonthSlider.js +1 -1
  4. package/Calendar/CalendarSuperForm/components/CalendarTimeInput.js +1 -1
  5. package/Calendar/helpers.js +6 -7
  6. package/CardMetric/CardMetric.js +1 -1
  7. package/Checkbox/Checkbox.js +1 -1
  8. package/Combobox/Combobox.js +3 -6
  9. package/ComboboxMulti/ComboboxMulti.js +1 -2
  10. package/Drawer/components/Drawer/Drawer.js +2 -3
  11. package/Drawer/components/Drawer/styles.js +6 -6
  12. package/Drawer/components/DrawerDocs/DrawerDocs.js +1 -2
  13. package/DropdownMenu/components/DropdownMenu/DropdownMenu.js +2 -3
  14. package/DropdownMenu/components/DropdownMenuItem/DropdownMenuItem.js +1 -1
  15. package/DropdownMenu/components/DropdownMenuSubmenu/DropdownMenuSubmenu.js +1 -1
  16. package/EmojiPicker/EmojiPicker.js +1 -2
  17. package/FrequencyCapping/FrequencyCappingReadonly.js +1 -1
  18. package/FrequencyCapping/components/Settings/EditInAppCappingSettings.js +4 -5
  19. package/InputFile/InputFile.js +3 -8
  20. package/Modal/components/Modal/Modal.js +2 -3
  21. package/Modal/components/ModalConfirm/ModalConfirm.js +2 -2
  22. package/NativeRichMediaPreview/NativeRichMediaPreview.js +1 -2
  23. package/NativeRichMediaPreview/resolveLocalization.js +2 -3
  24. package/NativeRichMediaPreview/views/NativeRichMediaSpinwheelView/NativeRichMediaSpinwheelView.js +4 -4
  25. package/NotificationInbox/NotificationInbox.js +2 -3
  26. package/NotificationInbox/useInfiniteScroll.js +3 -5
  27. package/PageHeader/components/AutosizeInput/AutosizeInput.js +9 -17
  28. package/PushPreview/PushPreview.js +4 -4
  29. package/PushPreview/helpers.js +1 -1
  30. package/Radio/Radio.js +1 -1
  31. package/ReCaptcha/hooks.js +3 -8
  32. package/RichMessageEditor/RichMessageEditor.js +67 -70
  33. package/RichMessageEditor/slate/DynamicContentElement.js +1 -2
  34. package/RichmediaPreview/components/Template/Template.js +1 -2
  35. package/SandboxedHtmlFrame/SandboxedHtmlFrame.js +1 -2
  36. package/Tabs/components/Tab/Tab.js +1 -1
  37. package/Tooltip/Tooltip.js +1 -1
  38. package/hooks/useLayer.js +2 -6
  39. package/package.json +2 -2
  40. package/polyglot/liquid/parser.js +1 -1
  41. package/shared/dropdownField/FieldShell.js +4 -5
  42. package/shared/dropdownField/SuggestionsDropdown.js +4 -6
  43. package/shared/dropdownField/shared.js +3 -6
  44. package/shared/dropdownField/useDropdownPosition.js +1 -1
  45. package/shared/dropdownField/useFieldOpenEffects.js +2 -4
  46. package/shared/dropdownField/useListNavigation.js +2 -2
package/Banner/Banner.js CHANGED
@@ -42,7 +42,7 @@ export function Banner(props) {
42
42
  }, [onClose]);
43
43
  const handleAction = useCallback(() => {
44
44
  setIsActionPressed(true);
45
- action === null || action === void 0 || action.onClick();
45
+ action?.onClick();
46
46
  }, [action]);
47
47
  if (!type) {
48
48
  console.error(`[Banner]: required prop type "${type}" is not set`);
@@ -79,12 +79,11 @@ export const CalendarDropdown = props => {
79
79
  if (isOpen) closePopover();
80
80
  });
81
81
  const onChangeHandler = val => {
82
- var _props$onChange;
83
82
  setValue(val);
84
- (_props$onChange = props.onChange) === null || _props$onChange === void 0 || _props$onChange.call(props, val);
83
+ props.onChange?.(val);
85
84
  };
86
85
  const presets = 'presets' in props ? props.presets : undefined;
87
- const noValue = isRangePicker ? ((value === null || value === void 0 ? void 0 : value.length) ?? 0) === 0 : !value;
86
+ const noValue = isRangePicker ? (value?.length ?? 0) === 0 : !value;
88
87
  let buttonText;
89
88
  if (noValue) {
90
89
  buttonText = isRangePicker ? lang({
@@ -192,7 +191,7 @@ export const CalendarDropdown = props => {
192
191
  let isInvalid;
193
192
  if (isRangePicker) {
194
193
  const range = value;
195
- const length = (range === null || range === void 0 ? void 0 : range.length) ?? 0;
194
+ const length = range?.length ?? 0;
196
195
  isInvalid = allowEmpty ? length === 1 : length !== 2;
197
196
  } else {
198
197
  isInvalid = allowEmpty ? false : !value;
@@ -147,6 +147,6 @@ export const CalendarMonthSlider = ({
147
147
  onClick: animateForward,
148
148
  isDisabled: inTransition
149
149
  })
150
- }), renderAfter === null || renderAfter === void 0 ? void 0 : renderAfter()]
150
+ }), renderAfter?.()]
151
151
  });
152
152
  };
@@ -10,7 +10,7 @@ export const CalendarTimeInput = ({
10
10
  const defaultHour = endPeriod ? 23 : 0;
11
11
  const defaultMinute = endPeriod ? 59 : 0;
12
12
  return _jsx(NativeTimeInput, {
13
- value: `${formatTwoDigitNumber((value === null || value === void 0 ? void 0 : value.hour) ?? defaultHour)}:${formatTwoDigitNumber((value === null || value === void 0 ? void 0 : value.minute) ?? defaultMinute)}`,
13
+ value: `${formatTwoDigitNumber(value?.hour ?? defaultHour)}:${formatTwoDigitNumber(value?.minute ?? defaultMinute)}`,
14
14
  onChange: e => {
15
15
  const [hour, minute] = e.target.value.split(':').map(Number);
16
16
  onChange({
@@ -144,7 +144,6 @@ export const structToDate = (ds, tzOffsetMinutes) => {
144
144
  };
145
145
  /** Returns the offset in minutes (east of UTC) for an IANA `timezoneName` at the given instant `at`. */
146
146
  export function getTimezoneOffset(timezoneName, at = new Date()) {
147
- var _parts$find, _parts$find2, _parts$find3, _parts$find4, _parts$find5, _parts$find6;
148
147
  const dtf = new Intl.DateTimeFormat('en-US', {
149
148
  timeZone: timezoneName,
150
149
  hour12: false,
@@ -156,12 +155,12 @@ export function getTimezoneOffset(timezoneName, at = new Date()) {
156
155
  second: '2-digit'
157
156
  });
158
157
  const parts = dtf.formatToParts(at);
159
- const y = Number((_parts$find = parts.find(p => p.type === 'year')) === null || _parts$find === void 0 ? void 0 : _parts$find.value);
160
- const mo = Number((_parts$find2 = parts.find(p => p.type === 'month')) === null || _parts$find2 === void 0 ? void 0 : _parts$find2.value) - 1;
161
- const d = Number((_parts$find3 = parts.find(p => p.type === 'day')) === null || _parts$find3 === void 0 ? void 0 : _parts$find3.value);
162
- const h = Number((_parts$find4 = parts.find(p => p.type === 'hour')) === null || _parts$find4 === void 0 ? void 0 : _parts$find4.value);
163
- const mi = Number((_parts$find5 = parts.find(p => p.type === 'minute')) === null || _parts$find5 === void 0 ? void 0 : _parts$find5.value);
164
- const s = Number((_parts$find6 = parts.find(p => p.type === 'second')) === null || _parts$find6 === void 0 ? void 0 : _parts$find6.value);
158
+ const y = Number(parts.find(p => p.type === 'year')?.value);
159
+ const mo = Number(parts.find(p => p.type === 'month')?.value) - 1;
160
+ const d = Number(parts.find(p => p.type === 'day')?.value);
161
+ const h = Number(parts.find(p => p.type === 'hour')?.value);
162
+ const mi = Number(parts.find(p => p.type === 'minute')?.value);
163
+ const s = Number(parts.find(p => p.type === 'second')?.value);
165
164
  const asUTC = Date.UTC(y, mo, d, h, mi, s);
166
165
  return Math.round((asUTC - at.getTime()) / 60000);
167
166
  }
@@ -29,7 +29,7 @@ export function CardMetric({
29
29
  ...otherProps
30
30
  }) {
31
31
  const [visibleInfo, setVisibleInfo] = useState(false);
32
- const [isCollapsed, setIsCollapsed] = useState(!!(collapse !== null && collapse !== void 0 && collapse.isCollapsed));
32
+ const [isCollapsed, setIsCollapsed] = useState(!!collapse?.isCollapsed);
33
33
  const onMouseOver = () => setVisibleInfo(true);
34
34
  const onMouseOut = () => setVisibleInfo(false);
35
35
  return _jsxs(CardContainer, {
@@ -53,7 +53,7 @@ export function Checkbox(props) {
53
53
  checked: isChecked,
54
54
  disabled: isDisabled,
55
55
  "$type": type,
56
- onChange: event => onChange === null || onChange === void 0 ? void 0 : onChange(event.currentTarget.checked)
56
+ onChange: event => onChange?.(event.currentTarget.checked)
57
57
  })
58
58
  }), label && _jsx("span", {
59
59
  children: label
@@ -116,11 +116,10 @@ function FreeCombobox({
116
116
  onClose: close,
117
117
  showClear: !!(clearable && value),
118
118
  onClear: () => {
119
- var _inputRef$current;
120
119
  onChange('', {
121
120
  source: 'input'
122
121
  });
123
- (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus();
122
+ inputRef.current?.focus();
124
123
  },
125
124
  dropdownItems: dropdownItems,
126
125
  emptyText: resolveDropdownText(emptyText, value),
@@ -210,12 +209,11 @@ function SelectCombobox({
210
209
  setQuery('');
211
210
  }, []);
212
211
  const commit = useCallback(item => {
213
- var _inputRef$current2;
214
212
  onChange(item);
215
213
  setIsOpen(false);
216
214
  setQuery('');
217
215
  setActiveIndex(0);
218
- (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 || _inputRef$current2.blur();
216
+ inputRef.current?.blur();
219
217
  }, [onChange, setActiveIndex]);
220
218
  const onInputKeyDown = useListNavigation({
221
219
  isOpen,
@@ -269,9 +267,8 @@ function SelectCombobox({
269
267
  showChevron: true,
270
268
  onToggle: toggleOpen,
271
269
  onClear: () => {
272
- var _inputRef$current3;
273
270
  onChange(null);
274
- (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 || _inputRef$current3.focus();
271
+ inputRef.current?.focus();
275
272
  },
276
273
  dropdownItems: dropdownItems,
277
274
  emptyText: resolveDropdownText(emptyText, query),
@@ -94,7 +94,6 @@ export function ComboboxMulti({
94
94
  setQuery('');
95
95
  }, []);
96
96
  const toggle = useCallback(item => {
97
- var _inputRef$current;
98
97
  const key = getKey(item);
99
98
  if (selectedKeys.has(key)) {
100
99
  onChange(value.filter(v => getKey(v) !== key));
@@ -103,7 +102,7 @@ export function ComboboxMulti({
103
102
  if (maxValues !== undefined && value.length >= maxValues) return;
104
103
  onChange([...value, item]);
105
104
  setIsOpen(true);
106
- (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus();
105
+ inputRef.current?.focus();
107
106
  }, [value, getKey, selectedKeys, onChange, maxValues]);
108
107
  const create = useCallback(() => {
109
108
  const trimmed = query.trim();
@@ -38,13 +38,12 @@ export function Drawer({
38
38
  zIndex
39
39
  });
40
40
  useEffect(() => {
41
- var _document$body$lastCh;
42
- (_document$body$lastCh = document.body.lastChild) === null || _document$body$lastCh === void 0 || _document$body$lastCh.after(element);
41
+ document.body.lastChild?.after(element);
43
42
  return () => element.remove();
44
43
  }, [element]);
45
44
  const handleClose = useCallback(event => {
46
45
  if (event.target === event.currentTarget) {
47
- onClose === null || onClose === void 0 || onClose();
46
+ onClose?.();
48
47
  }
49
48
  }, [onClose]);
50
49
  const handleClickOutside = useCallback(event => {
@@ -20,20 +20,20 @@ export const DrawerInner = styled.div.withConfig({
20
20
  componentId: "sc-n2uxwd-1"
21
21
  })(["display:flex;justify-content:flex-end;width:100vw;height:100vh;padding-top:", ";padding-right:", ";padding-bottom:", ";padding-left:", ";", "{", "}", "{", "}"], ({
22
22
  $padding
23
- }) => ($padding === null || $padding === void 0 ? void 0 : $padding.top) || '0px', ({
23
+ }) => $padding?.top || '0px', ({
24
24
  $padding
25
- }) => ($padding === null || $padding === void 0 ? void 0 : $padding.right) || '0px', ({
25
+ }) => $padding?.right || '0px', ({
26
26
  $padding
27
- }) => ($padding === null || $padding === void 0 ? void 0 : $padding.bottom) || '0px', ({
27
+ }) => $padding?.bottom || '0px', ({
28
28
  $padding
29
- }) => ($padding === null || $padding === void 0 ? void 0 : $padding.left) || '280px', DrawerBody, ({
29
+ }) => $padding?.left || '280px', DrawerBody, ({
30
30
  $padding
31
- }) => ($padding === null || $padding === void 0 ? void 0 : $padding.bottom) && `
31
+ }) => $padding?.bottom && `
32
32
  border-bottom-left-radius: ${ShapeRadius.SECTION};
33
33
  border-bottom-right-radius: ${ShapeRadius.SECTION};
34
34
  `, DrawerHeader, ({
35
35
  $padding
36
- }) => ($padding === null || $padding === void 0 ? void 0 : $padding.top) && `
36
+ }) => $padding?.top && `
37
37
  border-top-left-radius: ${ShapeRadius.SECTION};
38
38
  border-top-right-radius: ${ShapeRadius.SECTION};
39
39
  `);
@@ -24,8 +24,7 @@ export function DrawerDocs(props) {
24
24
  const iframeRef = useRef(null);
25
25
  useEffect(() => {
26
26
  const updateDrawerWidth = () => {
27
- var _drawerDocsRef$curren;
28
- if ((_drawerDocsRef$curren = drawerDocsRef.current) !== null && _drawerDocsRef$curren !== void 0 && _drawerDocsRef$curren.parentElement) {
27
+ if (drawerDocsRef.current?.parentElement) {
29
28
  setDrawerWidth(drawerDocsRef.current.parentElement.getBoundingClientRect().width);
30
29
  }
31
30
  };
@@ -35,7 +35,7 @@ export const DropdownMenu = ({
35
35
  const [width, setWidth] = useState(windowWidth);
36
36
  const handleClose = useCallback(() => {
37
37
  setIsOpen(false);
38
- onClose === null || onClose === void 0 || onClose();
38
+ onClose?.();
39
39
  }, [onClose]);
40
40
  const {
41
41
  zIndex: resolvedZIndex
@@ -64,8 +64,7 @@ export const DropdownMenu = ({
64
64
  useEffect(() => {
65
65
  if (isOpen) {
66
66
  const handleClickListener = e => {
67
- var _refs$floating$curren, _refs$reference$curre;
68
- if (!((_refs$floating$curren = refs.floating.current) !== null && _refs$floating$curren !== void 0 && _refs$floating$curren.contains(e.target)) && !((_refs$reference$curre = refs.reference.current) !== null && _refs$reference$curre !== void 0 && _refs$reference$curre.contains(e.target))) {
67
+ if (!refs.floating.current?.contains(e.target) && !refs.reference.current?.contains(e.target)) {
69
68
  handleClose();
70
69
  }
71
70
  };
@@ -29,7 +29,7 @@ export const DropdownMenuItem = ({
29
29
  "$danger": isDanger,
30
30
  onClick: () => {
31
31
  if (closeOnClick) {
32
- onClickContext === null || onClickContext === void 0 || onClickContext(false);
32
+ onClickContext?.(false);
33
33
  }
34
34
  onClick();
35
35
  },
@@ -66,7 +66,7 @@ export const DropdownMenuSubmenu = ({
66
66
  const closeChain = useCallback(() => {
67
67
  openedByClick.current = false;
68
68
  setIsOpen(false);
69
- parentClose === null || parentClose === void 0 || parentClose(false);
69
+ parentClose?.(false);
70
70
  }, [parentClose]);
71
71
  return _jsx(DropdownContext.Provider, {
72
72
  value: closeChain,
@@ -14,8 +14,7 @@ export const EmojiPicker = props => {
14
14
  ...props
15
15
  });
16
16
  } else {
17
- var _window;
18
- const PickerElement = (_window = window) === null || _window === void 0 ? void 0 : _window.customElements.get('em-emoji-picker');
17
+ const PickerElement = window?.customElements.get('em-emoji-picker');
19
18
  instance.current = new (PickerElement || Picker)({
20
19
  data,
21
20
  ...props,
@@ -18,7 +18,7 @@ export function FrequencyCappingReadonly({
18
18
  isInJourney = false
19
19
  }) {
20
20
  const lang = useLang();
21
- const cappingOption = getCappingOption(capping === null || capping === void 0 ? void 0 : capping.enabled, capping === null || capping === void 0 ? void 0 : capping.ignoreGlobalCapping);
21
+ const cappingOption = getCappingOption(capping?.enabled, capping?.ignoreGlobalCapping);
22
22
  const isGlobalCappingDisabled = globalCapping.count === 0 && globalCapping.days === 0;
23
23
  const globalCappingLinkText = getGlobalCappingLinkText(lang, isGlobalCappingDisabled);
24
24
  const label = getReadonlyCappingLabel(cappingOption, isGlobalCappingDisabled, capping, globalCapping, isInJourney, lang);
@@ -6,7 +6,6 @@ import { Checkbox } from '../../../Checkbox';
6
6
  import { NumberPicker } from '../../../NumberPicker';
7
7
  import { Lang } from '../../polyglot';
8
8
  export function EditInAppCappingSettings(props) {
9
- var _capping$total, _capping$perDays, _capping$perDays2, _capping$leastDays;
10
9
  const {
11
10
  capping,
12
11
  onChange
@@ -106,7 +105,7 @@ export function EditInAppCappingSettings(props) {
106
105
  isChecked: hasTotal,
107
106
  onChange: onTotalToggle
108
107
  }), _jsx(NumberPicker, {
109
- value: ((_capping$total = capping.total) === null || _capping$total === void 0 ? void 0 : _capping$total.count) ?? 1,
108
+ value: capping.total?.count ?? 1,
110
109
  minValue: 1,
111
110
  maxValue: 1000,
112
111
  isDisabled: !hasTotal,
@@ -128,7 +127,7 @@ export function EditInAppCappingSettings(props) {
128
127
  isChecked: hasPerDays,
129
128
  onChange: onPerDaysToggle
130
129
  }), _jsx(NumberPicker, {
131
- value: ((_capping$perDays = capping.perDays) === null || _capping$perDays === void 0 ? void 0 : _capping$perDays.count) ?? 1,
130
+ value: capping.perDays?.count ?? 1,
132
131
  minValue: 1,
133
132
  maxValue: 1000,
134
133
  isDisabled: !hasPerDays,
@@ -138,7 +137,7 @@ export function EditInAppCappingSettings(props) {
138
137
  message: "DUMB.FREQUENCY_CAPPING.INAPP.IMPRESSIONS_IN"
139
138
  })
140
139
  }), _jsx(NumberPicker, {
141
- value: ((_capping$perDays2 = capping.perDays) === null || _capping$perDays2 === void 0 ? void 0 : _capping$perDays2.days) ?? 1,
140
+ value: capping.perDays?.days ?? 1,
142
141
  minValue: 1,
143
142
  maxValue: 366,
144
143
  isDisabled: !hasPerDays,
@@ -160,7 +159,7 @@ export function EditInAppCappingSettings(props) {
160
159
  isChecked: hasLeastDays,
161
160
  onChange: onLeastDaysToggle
162
161
  }), _jsx(NumberPicker, {
163
- value: ((_capping$leastDays = capping.leastDays) === null || _capping$leastDays === void 0 ? void 0 : _capping$leastDays.count) ?? 1,
162
+ value: capping.leastDays?.count ?? 1,
164
163
  minValue: 1,
165
164
  maxValue: 366,
166
165
  isDisabled: !hasLeastDays,
@@ -31,8 +31,7 @@ export function InputFile({
31
31
  }) {
32
32
  const fieldRef = useRef(null);
33
33
  const uploadFile = event => {
34
- var _event$target$files;
35
- const file = ((_event$target$files = event.target.files) === null || _event$target$files === void 0 ? void 0 : _event$target$files.length) && event.target.files[0];
34
+ const file = event.target.files?.length && event.target.files[0];
36
35
  if (!file) {
37
36
  return;
38
37
  }
@@ -48,10 +47,9 @@ export function InputFile({
48
47
  }
49
48
  const reader = new FileReader();
50
49
  reader.onload = upload => {
51
- var _upload$target;
52
50
  const result = {
53
51
  file,
54
- [name]: (_upload$target = upload.target) === null || _upload$target === void 0 ? void 0 : _upload$target.result
52
+ [name]: upload.target?.result
55
53
  };
56
54
  onChange(result);
57
55
  };
@@ -85,10 +83,7 @@ export function InputFile({
85
83
  size: "field",
86
84
  view: "shape",
87
85
  isDisabled: disabled,
88
- onClick: () => {
89
- var _fieldRef$current;
90
- return fieldRef === null || fieldRef === void 0 || (_fieldRef$current = fieldRef.current) === null || _fieldRef$current === void 0 ? void 0 : _fieldRef$current.click();
91
- },
86
+ onClick: () => fieldRef?.current?.click(),
92
87
  icon: _jsx(AttachmentIcon, {
93
88
  size: "medium",
94
89
  view: "lined"
@@ -37,12 +37,11 @@ export function Modal(props) {
37
37
  });
38
38
  const handleClose = useCallback(event => {
39
39
  if (event.target === event.currentTarget) {
40
- onClose === null || onClose === void 0 || onClose();
40
+ onClose?.();
41
41
  }
42
42
  }, [onClose]);
43
43
  useEffect(() => {
44
- var _document$body$lastCh;
45
- (_document$body$lastCh = document.body.lastChild) === null || _document$body$lastCh === void 0 || _document$body$lastCh.after(element);
44
+ document.body.lastChild?.after(element);
46
45
  return () => element.remove();
47
46
  }, [element]);
48
47
  return createPortal(_jsx(ModalBoxTrans, {
@@ -44,10 +44,10 @@ export function ModalConfirm(props) {
44
44
  try {
45
45
  setIsLoading(true);
46
46
  setErrorMessage('');
47
- await (callback === null || callback === void 0 ? void 0 : callback());
47
+ await callback?.();
48
48
  await onAccept();
49
49
  } catch (error) {
50
- setErrorMessage((error === null || error === void 0 ? void 0 : error.message) || lang({
50
+ setErrorMessage(error?.message || lang({
51
51
  message: 'DUMB.MODAL.UNEXPECTED_ERROR'
52
52
  }));
53
53
  } finally {
@@ -65,9 +65,8 @@ function renderBackdrop(config, activeIndex) {
65
65
  return renderCoverBackdrop(config.video.poster, '#000');
66
66
  case 'stories':
67
67
  {
68
- var _items$clampIndex;
69
68
  const items = config.stories.items;
70
- return renderCoverBackdrop((_items$clampIndex = items[clampIndex(activeIndex, items.length)]) === null || _items$clampIndex === void 0 ? void 0 : _items$clampIndex.image, '#000');
69
+ return renderCoverBackdrop(items[clampIndex(activeIndex, items.length)]?.image, '#000');
71
70
  }
72
71
  default:
73
72
  return null;
@@ -1,17 +1,16 @@
1
1
  const PLACEHOLDER_RE = /^\{\{([^|}]+)\|[^|}]*(?:\|([^}]*))?\}\}$/;
2
2
  function resolveValue(value, localization, language) {
3
- var _localization$languag, _localization$default;
4
3
  const match = PLACEHOLDER_RE.exec(value);
5
4
  if (!match) {
6
5
  return value;
7
6
  }
8
7
  const key = match[1];
9
8
  const fallback = match[2] ?? key;
10
- const languageValue = language ? localization === null || localization === void 0 || (_localization$languag = localization[language]) === null || _localization$languag === void 0 ? void 0 : _localization$languag[key] : undefined;
9
+ const languageValue = language ? localization?.[language]?.[key] : undefined;
11
10
  if (typeof languageValue === 'string') {
12
11
  return languageValue;
13
12
  }
14
- const defaultValue = localization === null || localization === void 0 || (_localization$default = localization.default) === null || _localization$default === void 0 ? void 0 : _localization$default[key];
13
+ const defaultValue = localization?.default?.[key];
15
14
  if (typeof defaultValue === 'string') {
16
15
  return defaultValue;
17
16
  }
@@ -45,10 +45,10 @@ export function NativeRichMediaSpinwheelView(props) {
45
45
  }, `spin-segment-${i}`);
46
46
  })
47
47
  }), _jsx(Pointer, {}), _jsx(Hub, {
48
- "$background": spinButton === null || spinButton === void 0 ? void 0 : spinButton.background,
49
- "$color": spinButton === null || spinButton === void 0 ? void 0 : spinButton.text.color,
50
- "$borderColor": spinButton === null || spinButton === void 0 ? void 0 : spinButton.border.color,
51
- children: (spinButton === null || spinButton === void 0 ? void 0 : spinButton.text.text) || 'SPIN'
48
+ "$background": spinButton?.background,
49
+ "$color": spinButton?.text.color,
50
+ "$borderColor": spinButton?.border.color,
51
+ children: spinButton?.text.text || 'SPIN'
52
52
  })]
53
53
  }), block.showClose && _jsx(NativeRichMediaCloseChip, {
54
54
  top: 16,
@@ -38,7 +38,7 @@ export function NotificationInbox({
38
38
  if (!notification.isRead && onMarkAsRead) {
39
39
  onMarkAsRead(notification.id);
40
40
  }
41
- onNotificationClick === null || onNotificationClick === void 0 || onNotificationClick(notification);
41
+ onNotificationClick?.(notification);
42
42
  }, [onMarkAsRead, onNotificationClick]);
43
43
  const loadMoreRef = useInfiniteScroll({
44
44
  hasMore,
@@ -169,9 +169,8 @@ export function NotificationInbox({
169
169
  children: [notification.actionButton && _jsx(NotificationActionLink, {
170
170
  "$isPrimary": true,
171
171
  onClick: e => {
172
- var _notification$actionB;
173
172
  e.stopPropagation();
174
- (_notification$actionB = notification.actionButton) === null || _notification$actionB === void 0 || _notification$actionB.onClick();
173
+ notification.actionButton?.onClick();
175
174
  },
176
175
  children: notification.actionButton.label
177
176
  }), showExpandButton && _jsx(NotificationActionLink, {
@@ -14,13 +14,12 @@ export function useInfiniteScroll({
14
14
  elementRef.current = node;
15
15
  }, []);
16
16
  useEffect(() => {
17
- var _observerRef$current;
18
17
  const el = elementRef.current;
19
18
  if (!enabled || !el || !hasMore || !onLoadMore) return;
20
19
  const resolvedRoot = root ?? el.closest('[data-notification-list]');
21
- (_observerRef$current = observerRef.current) === null || _observerRef$current === void 0 || _observerRef$current.disconnect();
20
+ observerRef.current?.disconnect();
22
21
  observerRef.current = new IntersectionObserver(([entry]) => {
23
- if (entry !== null && entry !== void 0 && entry.isIntersecting && !isLoading && hasMore) {
22
+ if (entry?.isIntersecting && !isLoading && hasMore) {
24
23
  onLoadMore();
25
24
  }
26
25
  }, {
@@ -30,8 +29,7 @@ export function useInfiniteScroll({
30
29
  });
31
30
  observerRef.current.observe(el);
32
31
  return () => {
33
- var _observerRef$current2;
34
- (_observerRef$current2 = observerRef.current) === null || _observerRef$current2 === void 0 || _observerRef$current2.disconnect();
32
+ observerRef.current?.disconnect();
35
33
  observerRef.current = null;
36
34
  };
37
35
  }, [enabled, hasMore, isLoading, onLoadMore, root, rootMargin, threshold]);
@@ -26,7 +26,7 @@ export function AutosizeInput(props) {
26
26
  useEffect(() => {
27
27
  if (!defaultValue.current) {
28
28
  defaultValue.current = DEFAULT_EMPTY_VALUE;
29
- onChange === null || onChange === void 0 || onChange(DEFAULT_EMPTY_VALUE);
29
+ onChange?.(DEFAULT_EMPTY_VALUE);
30
30
  }
31
31
  }, [defaultValue, onChange]);
32
32
  useEffect(() => {
@@ -39,35 +39,30 @@ export function AutosizeInput(props) {
39
39
  }, [value]);
40
40
  const onKeyDown = event => {
41
41
  if (event.key === 'Enter') {
42
- var _inputRef$current;
43
42
  event.preventDefault();
44
- inputRef === null || inputRef === void 0 || (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.blur();
43
+ inputRef?.current?.blur();
45
44
  }
46
45
  if (event.key === 'Escape') {
47
- var _inputRef$current2;
48
46
  event.preventDefault();
49
- onChange === null || onChange === void 0 || onChange(defaultValue.current);
47
+ onChange?.(defaultValue.current);
50
48
  setWidth(defaultValue.current.length);
51
- inputRef === null || inputRef === void 0 || (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 || _inputRef$current2.blur();
49
+ inputRef?.current?.blur();
52
50
  }
53
51
  };
54
52
  const onChangeHandler = event => {
55
53
  const formattedValue = maxLength ? event.currentTarget.value.slice(0, maxLength) : event.currentTarget.value;
56
- onChange === null || onChange === void 0 || onChange(formattedValue.replace(/\n/g, ''));
54
+ onChange?.(formattedValue.replace(/\n/g, ''));
57
55
  };
58
56
  const onFocus = () => {
59
57
  if (value === DEFAULT_EMPTY_VALUE) {
60
- onChange === null || onChange === void 0 || onChange('');
58
+ onChange?.('');
61
59
  }
62
60
  };
63
61
  const onBlur = () => {
64
62
  if (value === '') {
65
- onChange === null || onChange === void 0 || onChange(defaultValue.current);
63
+ onChange?.(defaultValue.current);
66
64
  }
67
- setTimeout(() => {
68
- var _inputRef$current3;
69
- return onComplete === null || onComplete === void 0 ? void 0 : onComplete(inputRef === null || inputRef === void 0 || (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 ? void 0 : _inputRef$current3.value);
70
- }, 100);
65
+ setTimeout(() => onComplete?.(inputRef?.current?.value), 100);
71
66
  };
72
67
  return _jsxs(RootBox, {
73
68
  children: [_jsxs(InputBox, {
@@ -88,10 +83,7 @@ export function AutosizeInput(props) {
88
83
  children: placeholder
89
84
  })]
90
85
  }), _jsx(PromptBox, {
91
- onClick: () => {
92
- var _inputRef$current4;
93
- return (_inputRef$current4 = inputRef.current) === null || _inputRef$current4 === void 0 ? void 0 : _inputRef$current4.focus();
94
- },
86
+ onClick: () => inputRef.current?.focus(),
95
87
  children: _jsx(EditIcon, {
96
88
  size: "small",
97
89
  view: "filled"
@@ -22,10 +22,10 @@ export function PushPreview({
22
22
  isLoading = false,
23
23
  width
24
24
  }) {
25
- const title = getLocalizedContent((pushPreset === null || pushPreset === void 0 ? void 0 : pushPreset.title) || (pushPreset === null || pushPreset === void 0 ? void 0 : pushPreset.localizedTitle), language) || appTitle;
26
- const subtitle = getLocalizedContent((pushPreset === null || pushPreset === void 0 ? void 0 : pushPreset.subtitle) || (pushPreset === null || pushPreset === void 0 ? void 0 : pushPreset.localizedSubtitle), language);
27
- const content = getLocalizedContent((pushPreset === null || pushPreset === void 0 ? void 0 : pushPreset.content) || (pushPreset === null || pushPreset === void 0 ? void 0 : pushPreset.localizedContent), language);
28
- const icon = (pushPreset === null || pushPreset === void 0 ? void 0 : pushPreset.icon) || appIcon || PREVIEW_ICON_URL;
25
+ const title = getLocalizedContent(pushPreset?.title || pushPreset?.localizedTitle, language) || appTitle;
26
+ const subtitle = getLocalizedContent(pushPreset?.subtitle || pushPreset?.localizedSubtitle, language);
27
+ const content = getLocalizedContent(pushPreset?.content || pushPreset?.localizedContent, language);
28
+ const icon = pushPreset?.icon || appIcon || PREVIEW_ICON_URL;
29
29
  if (isLoading) {
30
30
  return _jsx(PushBox, {
31
31
  view: view,
@@ -7,4 +7,4 @@ export const getDefaultLanguage = properties => {
7
7
  }
8
8
  return Object.keys(properties)[0];
9
9
  };
10
- export const getLocalizedContent = (value, language) => (value === null || value === void 0 ? void 0 : value[language || getDefaultLanguage(value)]) || '';
10
+ export const getLocalizedContent = (value, language) => value?.[language || getDefaultLanguage(value)] || '';
package/Radio/Radio.js CHANGED
@@ -50,7 +50,7 @@ export function Radio(props) {
50
50
  disabled: isDisabled,
51
51
  "$size": size,
52
52
  "$type": type,
53
- onChange: event => onChange === null || onChange === void 0 ? void 0 : onChange(event.currentTarget.value),
53
+ onChange: event => onChange?.(event.currentTarget.value),
54
54
  onBlur: onBlur
55
55
  })
56
56
  }), label && _jsx("span", {
@@ -6,9 +6,8 @@ import { asyncScriptLoad } from './helpers';
6
6
  * element, and returns `{ isRecaptchaReady, recaptchaErrorCode, getRecaptchaToken }`.
7
7
  */
8
8
  export function useRecaptcha() {
9
- var _window;
10
9
  const promiseRef = useRef({});
11
- const [isRecaptchaLoaded, setRecaptchaLoaded] = useState(!!((_window = window) !== null && _window !== void 0 && (_window = _window.grecaptcha) !== null && _window !== void 0 && _window.render));
10
+ const [isRecaptchaLoaded, setRecaptchaLoaded] = useState(!!window?.grecaptcha?.render);
12
11
  const [widgetID, setWidgetID] = useState(null);
13
12
  const [isRecaptchaReady, setRecaptchaReady] = useState(!!(isRecaptchaLoaded && widgetID));
14
13
  const [recaptchaErrorCode, setRecaptchaErrorCode] = useState(''); // RIEXXX - ReCaptcha Internal Error
@@ -20,8 +19,7 @@ export function useRecaptcha() {
20
19
  // Set interval while library download and initialize
21
20
  useEffect(() => {
22
21
  const newInterval = window.setInterval(() => {
23
- var _window2;
24
- if ((_window2 = window) !== null && _window2 !== void 0 && (_window2 = _window2.grecaptcha) !== null && _window2 !== void 0 && _window2.render) {
22
+ if (window?.grecaptcha?.render) {
25
23
  setRecaptchaLoaded(true);
26
24
  }
27
25
  }, 500);
@@ -38,10 +36,7 @@ export function useRecaptcha() {
38
36
  const widget = window.grecaptcha.render(RECAPTCHA_CONTAINER_ID, {
39
37
  sitekey: RECAPTCHA_KEY,
40
38
  size: 'invisible',
41
- callback: token => {
42
- var _promiseRef$current;
43
- return (_promiseRef$current = promiseRef.current) === null || _promiseRef$current === void 0 ? void 0 : _promiseRef$current.resolve(token);
44
- }
39
+ callback: token => promiseRef.current?.resolve(token)
45
40
  // 'expired-callback': () => {},
46
41
  // 'error-callback': () => {},
47
42
  });
@@ -82,7 +82,7 @@ export const RichMessageEditor = ({
82
82
  };
83
83
  const clickAwayHandler = usePersistentFunction(() => {
84
84
  onClose();
85
- onBlur === null || onBlur === void 0 || onBlur();
85
+ onBlur?.();
86
86
  });
87
87
  useEffect(() => {
88
88
  if (!isFocused) {
@@ -100,76 +100,73 @@ export const RichMessageEditor = ({
100
100
  onSelectionChange: onSelectionChange,
101
101
  children: ({
102
102
  editor
103
- }) => {
104
- var _getDcByPath, _middlewareData$arrow, _middlewareData$arrow2;
105
- return _jsxs(FieldBox, {
106
- title: title,
107
- boxRef: refs.setReference,
108
- error: error,
109
- actions: _jsx(Collapse, {
110
- expanded: isFocused,
111
- children: _jsxs(Horizontal, {
112
- "$gap": 8,
113
- children: [canUsePersonalization && _jsxs(ImSpan, {
114
- onClick: () => setShowDrop({
115
- type: 'personalization'
116
- }),
117
- children: [_jsx(PersonalizationIcon, {}), "Personalization"]
118
- }), canUseEmoji && _jsxs(ImSpan, {
119
- onClick: () => setShowDrop({
120
- type: 'emoji'
121
- }),
122
- children: [_jsx(EmojiIcon, {}), "Emoji"]
123
- })]
124
- })
125
- }),
126
- children: [_jsx(SlateEditable, {
127
- minHeight: minHeight,
128
- onFocus: () => {
129
- setIsFocused(true);
130
- const {
131
- selection
132
- } = editor;
133
- if (selection) {
134
- onSelectionChange(selection);
135
- }
136
- },
137
- onDelete: () => {
138
- setShowDrop(undefined);
103
+ }) => _jsxs(FieldBox, {
104
+ title: title,
105
+ boxRef: refs.setReference,
106
+ error: error,
107
+ actions: _jsx(Collapse, {
108
+ expanded: isFocused,
109
+ children: _jsxs(Horizontal, {
110
+ "$gap": 8,
111
+ children: [canUsePersonalization && _jsxs(ImSpan, {
112
+ onClick: () => setShowDrop({
113
+ type: 'personalization'
114
+ }),
115
+ children: [_jsx(PersonalizationIcon, {}), "Personalization"]
116
+ }), canUseEmoji && _jsxs(ImSpan, {
117
+ onClick: () => setShowDrop({
118
+ type: 'emoji'
119
+ }),
120
+ children: [_jsx(EmojiIcon, {}), "Emoji"]
121
+ })]
122
+ })
123
+ }),
124
+ children: [_jsx(SlateEditable, {
125
+ minHeight: minHeight,
126
+ onFocus: () => {
127
+ setIsFocused(true);
128
+ const {
129
+ selection
130
+ } = editor;
131
+ if (selection) {
132
+ onSelectionChange(selection);
139
133
  }
140
- }), showDrop && _jsxs(DropArea, {
141
- style: floatingStyles,
142
- ref: refs.setFloating,
143
- children: [showDrop.type === 'personalization' && _jsx(DropContent, {
144
- children: renderDynamicContent === null || renderDynamicContent === void 0 ? void 0 : renderDynamicContent({
145
- dc: showDrop.path ? (_getDcByPath = getDcByPath(editor.children, showDrop.path)) === null || _getDcByPath === void 0 ? void 0 : _getDcByPath.dc : undefined,
146
- onChange: newDC => {
147
- if (showDrop.path) {
148
- Transforms.setNodes(editor, {
149
- dc: newDC
150
- }, {
151
- at: showDrop.path
152
- });
153
- } else {
154
- insertDynamicContent(editor, newDC);
155
- }
156
- },
157
- onClose,
158
- update
159
- })
160
- }), showDrop.type === 'emoji' && _jsx(EditorEmojiPicker, {
161
- onEmojiSelect: s => editor.insertText(s)
162
- }), _jsx(Arrow, {
163
- "$direction": placementToDirection(placement),
164
- ref: arrowRef,
165
- style: {
166
- left: (_middlewareData$arrow = middlewareData.arrow) === null || _middlewareData$arrow === void 0 ? void 0 : _middlewareData$arrow.x,
167
- top: (_middlewareData$arrow2 = middlewareData.arrow) === null || _middlewareData$arrow2 === void 0 ? void 0 : _middlewareData$arrow2.y
134
+ },
135
+ onDelete: () => {
136
+ setShowDrop(undefined);
137
+ }
138
+ }), showDrop && _jsxs(DropArea, {
139
+ style: floatingStyles,
140
+ ref: refs.setFloating,
141
+ children: [showDrop.type === 'personalization' && _jsx(DropContent, {
142
+ children: renderDynamicContent?.({
143
+ dc: showDrop.path ? getDcByPath(editor.children, showDrop.path)?.dc : undefined,
144
+ onChange: newDC => {
145
+ if (showDrop.path) {
146
+ Transforms.setNodes(editor, {
147
+ dc: newDC
148
+ }, {
149
+ at: showDrop.path
150
+ });
151
+ } else {
152
+ insertDynamicContent(editor, newDC);
153
+ }
168
154
  },
169
- children: _jsx(ArrowIcon, {})
170
- })]
171
- }, showDrop.type)]
172
- });
173
- }
155
+ onClose,
156
+ update
157
+ })
158
+ }), showDrop.type === 'emoji' && _jsx(EditorEmojiPicker, {
159
+ onEmojiSelect: s => editor.insertText(s)
160
+ }), _jsx(Arrow, {
161
+ "$direction": placementToDirection(placement),
162
+ ref: arrowRef,
163
+ style: {
164
+ left: middlewareData.arrow?.x,
165
+ top: middlewareData.arrow?.y
166
+ },
167
+ children: _jsx(ArrowIcon, {})
168
+ })]
169
+ }, showDrop.type)]
170
+ })
174
171
  });
175
172
  };
@@ -28,8 +28,7 @@ const DynamicContentElementComponent = ({
28
28
  at: [paragraphIndex, elementIndex]
29
29
  });
30
30
  if (selected) {
31
- var _editor$children$para;
32
- const prevOffset = ((_editor$children$para = editor.children[paragraphIndex].children[elementIndex - 1]) === null || _editor$children$para === void 0 ? void 0 : _editor$children$para.text.length) || 0;
31
+ const prevOffset = editor.children[paragraphIndex].children[elementIndex - 1]?.text.length || 0;
33
32
  const point = {
34
33
  path: [paragraphIndex, elementIndex - 1],
35
34
  offset: prevOffset
@@ -15,8 +15,7 @@ export class Template {
15
15
  return str.replace(/<head[^>]*>/i, founded => `${founded}<base href="${this.baseUrl}" />`);
16
16
  }
17
17
  getParamValue(varName) {
18
- var _this$vars$varName;
19
- return this.params && Object.prototype.hasOwnProperty.call(this.params, varName) ? this.params[varName] : (_this$vars$varName = this.vars[varName]) === null || _this$vars$varName === void 0 ? void 0 : _this$vars$varName.defaults;
18
+ return this.params && Object.prototype.hasOwnProperty.call(this.params, varName) ? this.params[varName] : this.vars[varName]?.defaults;
20
19
  }
21
20
  parseHtml(html) {
22
21
  const replacers = [];
@@ -34,11 +34,10 @@ export function SandboxedHtmlFrame(props) {
34
34
  setIsReady(true);
35
35
  }, []);
36
36
  useEffect(() => {
37
- var _$ref$current;
38
37
  if (!isReady || !onReady) {
39
38
  return undefined;
40
39
  }
41
- const frameDocument = (_$ref$current = $ref.current) === null || _$ref$current === void 0 ? void 0 : _$ref$current.contentDocument;
40
+ const frameDocument = $ref.current?.contentDocument;
42
41
  if (!frameDocument) {
43
42
  return undefined;
44
43
  }
@@ -23,7 +23,7 @@ export const Tab = forwardRef((props, ref) => {
23
23
  onClick: () => {
24
24
  if (!rest.isDisabled) {
25
25
  setActiveTabCode(code);
26
- onActivate === null || onActivate === void 0 || onActivate(code);
26
+ onActivate?.(code);
27
27
  }
28
28
  },
29
29
  ...rest,
@@ -50,7 +50,7 @@ export function Tooltip({
50
50
  setReferenceEl(node);
51
51
  assignRef(originalRef, node);
52
52
  }, [originalRef]);
53
- const externalReferenceEl = (reference === null || reference === void 0 ? void 0 : reference.current) ?? null;
53
+ const externalReferenceEl = reference?.current ?? null;
54
54
  useEffect(() => {
55
55
  if (reference) {
56
56
  setReferenceEl(externalReferenceEl);
package/hooks/useLayer.js CHANGED
@@ -27,7 +27,6 @@ function notify() {
27
27
  getState().subscribers.forEach(subscriber => subscriber());
28
28
  }
29
29
  function handleKeydown(event) {
30
- var _top$close;
31
30
  if (event.key !== 'Escape') {
32
31
  return;
33
32
  }
@@ -35,7 +34,7 @@ function handleKeydown(event) {
35
34
  stack
36
35
  } = getState();
37
36
  const top = stack[stack.length - 1];
38
- top === null || top === void 0 || (_top$close = top.close) === null || _top$close === void 0 || _top$close.call(top);
37
+ top?.close?.();
39
38
  }
40
39
  function ensureKeydownListener() {
41
40
  const state = getState();
@@ -112,10 +111,7 @@ export function useLayer({
112
111
  }
113
112
  registerLayer({
114
113
  id,
115
- close: () => {
116
- var _onCloseRef$current;
117
- return (_onCloseRef$current = onCloseRef.current) === null || _onCloseRef$current === void 0 ? void 0 : _onCloseRef$current.call(onCloseRef);
118
- },
114
+ close: () => onCloseRef.current?.(),
119
115
  baseZIndex: zIndexRef.current
120
116
  });
121
117
  forceRender(value => value + 1);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pushwoosh/dumb-components",
3
- "version": "1.1.180",
3
+ "version": "1.1.181",
4
4
  "description": "React components to build Pushwoosh products",
5
5
  "main": "index.js",
6
6
  "module": "index.js",
@@ -24,7 +24,7 @@
24
24
  "npm": ">= 7"
25
25
  },
26
26
  "devDependencies": {
27
- "@pushwoosh/frontend-builder-engine": "^3.0.0",
27
+ "@pushwoosh/frontend-builder-engine": "^3.1.0",
28
28
  "@svgr/webpack": "^8.1.0",
29
29
  "@testing-library/jest-dom": "^6.9.1",
30
30
  "@testing-library/react": "^16.3.0",
@@ -345,7 +345,7 @@ export function stringToAst(template) {
345
345
  if (token.type === 'Text') {
346
346
  // eslint-disable-next-line no-nested-ternary
347
347
  const prevControl = tokens[index - 1] && tokens[index - 1].type === 'ControlArg' ? tokens[index - 2] : tokens[index - 1] && tokens[index - 1].type === 'Control' ? tokens[index - 1] : undefined;
348
- const leftTrim = prevControl === null || prevControl === void 0 ? void 0 : prevControl.trimRight;
348
+ const leftTrim = prevControl?.trimRight;
349
349
  const rightTrim = tokens[index + 1] && tokens[index + 1].trimLeft;
350
350
  if (leftTrim || rightTrim) {
351
351
  const newValue = leftTrim ? token.value.trimStart() : token.value;
@@ -55,13 +55,12 @@ export function FieldShell({
55
55
  onClose
56
56
  });
57
57
  const onShellBlur = event => {
58
- var _floatingRef$current;
59
58
  if (!isOpen) return;
60
59
  const next = event.relatedTarget;
61
60
  if (!next) return;
62
61
  if (event.currentTarget.contains(next)) return;
63
- if ((_floatingRef$current = floatingRef.current) !== null && _floatingRef$current !== void 0 && _floatingRef$current.contains(next)) return;
64
- onClose === null || onClose === void 0 || onClose();
62
+ if (floatingRef.current?.contains(next)) return;
63
+ onClose?.();
65
64
  };
66
65
  return _jsxs(_Fragment, {
67
66
  children: [_jsxs(Shell, {
@@ -83,7 +82,7 @@ export function FieldShell({
83
82
  onMouseDown: e => {
84
83
  e.preventDefault();
85
84
  e.stopPropagation();
86
- onClear === null || onClear === void 0 || onClear();
85
+ onClear?.();
87
86
  },
88
87
  "aria-label": clearLabel,
89
88
  children: _jsx(CloseIcon, {
@@ -95,7 +94,7 @@ export function FieldShell({
95
94
  onMouseDown: e => {
96
95
  e.preventDefault();
97
96
  e.stopPropagation();
98
- onToggle === null || onToggle === void 0 || onToggle();
97
+ onToggle?.();
99
98
  },
100
99
  children: _jsx(ChevronIcon, {
101
100
  direction: isOpen ? 'up' : 'down',
@@ -32,11 +32,10 @@ export function SuggestionsDropdown({
32
32
  if (el.scrollHeight - el.scrollTop - el.clientHeight <= LOAD_MORE_THRESHOLD) onLoadMore();
33
33
  };
34
34
  const activeItem = items.find(item => item.active);
35
- const activeKey = createActive ? CREATE_KEY : (activeItem === null || activeItem === void 0 ? void 0 : activeItem.key) ?? null;
35
+ const activeKey = createActive ? CREATE_KEY : activeItem?.key ?? null;
36
36
  useEffect(() => {
37
- var _activeItemRef$curren;
38
37
  if (activeKey === null) return;
39
- (_activeItemRef$curren = activeItemRef.current) === null || _activeItemRef$curren === void 0 || _activeItemRef$curren.scrollIntoView({
38
+ activeItemRef.current?.scrollIntoView({
40
39
  block: 'nearest'
41
40
  });
42
41
  }, [activeKey]);
@@ -63,7 +62,7 @@ export function SuggestionsDropdown({
63
62
  "$active": createActive,
64
63
  onMouseDown: e => {
65
64
  e.preventDefault();
66
- onCreate === null || onCreate === void 0 || onCreate();
65
+ onCreate?.();
67
66
  },
68
67
  children: _jsx(CreateItemLabel, {
69
68
  children: createLabel
@@ -76,9 +75,8 @@ export function SuggestionsDropdown({
76
75
  "$active": item.active,
77
76
  "$selected": item.selected,
78
77
  onMouseDown: e => {
79
- var _item$onSelect;
80
78
  e.preventDefault();
81
- (_item$onSelect = item.onSelect) === null || _item$onSelect === void 0 || _item$onSelect.call(item);
79
+ item.onSelect?.();
82
80
  },
83
81
  children: item.label
84
82
  }, item.key)), !loading && loadingMore && _jsx(DropdownLoadingMore, {
@@ -17,25 +17,22 @@ export function defaultLabelFilter(item, query, getLabel) {
17
17
  */
18
18
  export function useShellMouseDown(inputRef, isOpen, open) {
19
19
  return useCallback(event => {
20
- var _inputRef$current;
21
20
  const target = event.target;
22
21
  if (target instanceof HTMLInputElement) return;
23
22
  if (target.closest('button')) return;
24
23
  event.preventDefault();
25
- (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus();
24
+ inputRef.current?.focus();
26
25
  if (!isOpen) open();
27
26
  }, [inputRef, isOpen, open]);
28
27
  }
29
28
  export function useToggleOpen(inputRef, isOpen, open, close) {
30
29
  return useCallback(() => {
31
30
  if (isOpen) {
32
- var _inputRef$current2;
33
31
  close();
34
- (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 || _inputRef$current2.blur();
32
+ inputRef.current?.blur();
35
33
  } else {
36
- var _inputRef$current3;
37
34
  open();
38
- (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 || _inputRef$current3.focus();
35
+ inputRef.current?.focus();
39
36
  }
40
37
  }, [inputRef, isOpen, open, close]);
41
38
  }
@@ -39,7 +39,7 @@ export function useDropdownPosition({
39
39
  whileElementsMounted: autoUpdate
40
40
  });
41
41
  useOnClickOutside([refs.reference, refs.floating], () => {
42
- if (isOpen) onClickOutside === null || onClickOutside === void 0 || onClickOutside();
42
+ if (isOpen) onClickOutside?.();
43
43
  });
44
44
  return {
45
45
  setReference: refs.setReference,
@@ -14,16 +14,14 @@ export function useFieldOpenEffects({
14
14
  onCloseRef.current = onClose;
15
15
  const wasOpenRef = useRef(isOpen);
16
16
  useEffect(() => {
17
- var _onCloseRef$current;
18
- if (wasOpenRef.current && !isOpen) (_onCloseRef$current = onCloseRef.current) === null || _onCloseRef$current === void 0 || _onCloseRef$current.call(onCloseRef);
17
+ if (wasOpenRef.current && !isOpen) onCloseRef.current?.();
19
18
  wasOpenRef.current = isOpen;
20
19
  }, [isOpen]);
21
20
  const didAutoFocusRef = useRef(false);
22
21
  useEffect(() => {
23
- var _inputRef$current;
24
22
  if (!autoFocus || didAutoFocusRef.current) return;
25
23
  didAutoFocusRef.current = true;
26
- (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus();
24
+ inputRef.current?.focus();
27
25
  open();
28
26
  }, [autoFocus, open, inputRef]);
29
27
  }
@@ -30,7 +30,7 @@ export function useListNavigation({
30
30
  if (total > 0) {
31
31
  const next = activeIndex >= total - 1 ? 0 : activeIndex + 1;
32
32
  setActiveIndex(next);
33
- if (next > 0 && next >= total - 1) onReachEnd === null || onReachEnd === void 0 || onReachEnd();
33
+ if (next > 0 && next >= total - 1) onReachEnd?.();
34
34
  }
35
35
  return;
36
36
  }
@@ -49,7 +49,7 @@ export function useListNavigation({
49
49
  return;
50
50
  }
51
51
  event.preventDefault();
52
- if (hasExtraRow && activeIndex === 0) onSelectExtra === null || onSelectExtra === void 0 || onSelectExtra();else onSelectIndex(hasExtraRow ? activeIndex - 1 : activeIndex);
52
+ if (hasExtraRow && activeIndex === 0) onSelectExtra?.();else onSelectIndex(hasExtraRow ? activeIndex - 1 : activeIndex);
53
53
  return;
54
54
  }
55
55
  if (event.key === 'Escape') {