@salutejs/plasma-new-hope 0.335.0-canary.2191.17321424209.0 → 0.335.0-canary.2196.17375511532.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 (171) hide show
  1. package/cjs/components/Autocomplete/Autocomplete.js +1 -6
  2. package/cjs/components/Autocomplete/Autocomplete.js.map +1 -1
  3. package/cjs/components/Autocomplete/ui/VirtualList/VirtualList.js +43 -13
  4. package/cjs/components/Autocomplete/ui/VirtualList/VirtualList.js.map +1 -1
  5. package/cjs/components/Carousel/CarouselNew/Carousel.js +4 -3
  6. package/cjs/components/Carousel/CarouselNew/Carousel.js.map +1 -1
  7. package/cjs/components/Carousel/CarouselNew/hooks/useCarousel.js +6 -1
  8. package/cjs/components/Carousel/CarouselNew/hooks/useCarousel.js.map +1 -1
  9. package/cjs/components/Combobox/ComboboxNew/Combobox.js +15 -30
  10. package/cjs/components/Combobox/ComboboxNew/Combobox.js.map +1 -1
  11. package/cjs/components/Combobox/ComboboxNew/ui/VirtualList/VirtualList.js +43 -13
  12. package/cjs/components/Combobox/ComboboxNew/ui/VirtualList/VirtualList.js.map +1 -1
  13. package/cjs/components/Combobox/ComboboxNew/utils/getTextValue.js +24 -0
  14. package/cjs/components/Combobox/ComboboxNew/utils/getTextValue.js.map +1 -0
  15. package/cjs/components/DatePicker/RangeDate/RangeDate.js +3 -1
  16. package/cjs/components/DatePicker/RangeDate/RangeDate.js.map +1 -1
  17. package/cjs/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.js +5 -2
  18. package/cjs/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.js.map +1 -1
  19. package/cjs/components/DatePicker/SingleDate/SingleDate.js +4 -2
  20. package/cjs/components/DatePicker/SingleDate/SingleDate.js.map +1 -1
  21. package/cjs/components/Popup/Popup.js +67 -8
  22. package/cjs/components/Popup/Popup.js.map +1 -1
  23. package/cjs/components/Select/ui/VirtualList/VirtualList.js +43 -13
  24. package/cjs/components/Select/ui/VirtualList/VirtualList.js.map +1 -1
  25. package/cjs/components/Slider/ui/Handler/Handler.js +3 -3
  26. package/cjs/components/Slider/ui/Handler/Handler.js.map +1 -1
  27. package/emotion/cjs/components/Autocomplete/Autocomplete.js +1 -8
  28. package/emotion/cjs/components/Autocomplete/ui/VirtualList/VirtualList.js +84 -16
  29. package/emotion/cjs/components/Carousel/CarouselNew/Carousel.js +2 -2
  30. package/emotion/cjs/components/Carousel/CarouselNew/hooks/useCarousel.js +6 -1
  31. package/emotion/cjs/components/Combobox/ComboboxNew/Combobox.js +26 -44
  32. package/emotion/cjs/components/Combobox/ComboboxNew/ui/VirtualList/VirtualList.js +84 -16
  33. package/emotion/cjs/components/Combobox/ComboboxNew/utils/getTextValue.js +25 -0
  34. package/emotion/cjs/components/Combobox/ComboboxNew/utils/index.js +4 -0
  35. package/emotion/cjs/components/DatePicker/RangeDate/RangeDate.js +3 -1
  36. package/emotion/cjs/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.js +5 -3
  37. package/emotion/cjs/components/DatePicker/SingleDate/SingleDate.js +4 -2
  38. package/emotion/cjs/components/Popup/Popup.js +69 -7
  39. package/emotion/cjs/components/Select/ui/VirtualList/VirtualList.js +84 -16
  40. package/emotion/es/components/Autocomplete/Autocomplete.js +2 -9
  41. package/emotion/es/components/Autocomplete/ui/VirtualList/VirtualList.js +45 -13
  42. package/emotion/es/components/Carousel/CarouselNew/Carousel.js +2 -2
  43. package/emotion/es/components/Carousel/CarouselNew/hooks/useCarousel.js +6 -1
  44. package/emotion/es/components/Combobox/ComboboxNew/Combobox.js +12 -30
  45. package/emotion/es/components/Combobox/ComboboxNew/ui/VirtualList/VirtualList.js +45 -13
  46. package/emotion/es/components/Combobox/ComboboxNew/utils/getTextValue.js +16 -0
  47. package/emotion/es/components/Combobox/ComboboxNew/utils/index.js +1 -0
  48. package/emotion/es/components/DatePicker/RangeDate/RangeDate.js +3 -1
  49. package/emotion/es/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.js +5 -3
  50. package/emotion/es/components/DatePicker/SingleDate/SingleDate.js +4 -2
  51. package/emotion/es/components/Popup/Popup.js +63 -6
  52. package/emotion/es/components/Select/ui/VirtualList/VirtualList.js +45 -13
  53. package/es/components/Autocomplete/Autocomplete.js +2 -7
  54. package/es/components/Autocomplete/Autocomplete.js.map +1 -1
  55. package/es/components/Autocomplete/ui/VirtualList/VirtualList.js +44 -13
  56. package/es/components/Autocomplete/ui/VirtualList/VirtualList.js.map +1 -1
  57. package/es/components/Carousel/CarouselNew/Carousel.js +5 -4
  58. package/es/components/Carousel/CarouselNew/Carousel.js.map +1 -1
  59. package/es/components/Carousel/CarouselNew/hooks/useCarousel.js +6 -1
  60. package/es/components/Carousel/CarouselNew/hooks/useCarousel.js.map +1 -1
  61. package/es/components/Combobox/ComboboxNew/Combobox.js +15 -30
  62. package/es/components/Combobox/ComboboxNew/Combobox.js.map +1 -1
  63. package/es/components/Combobox/ComboboxNew/ui/VirtualList/VirtualList.js +44 -13
  64. package/es/components/Combobox/ComboboxNew/ui/VirtualList/VirtualList.js.map +1 -1
  65. package/es/components/Combobox/ComboboxNew/utils/getTextValue.js +20 -0
  66. package/es/components/Combobox/ComboboxNew/utils/getTextValue.js.map +1 -0
  67. package/es/components/DatePicker/RangeDate/RangeDate.js +3 -1
  68. package/es/components/DatePicker/RangeDate/RangeDate.js.map +1 -1
  69. package/es/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.js +5 -2
  70. package/es/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.js.map +1 -1
  71. package/es/components/DatePicker/SingleDate/SingleDate.js +4 -2
  72. package/es/components/DatePicker/SingleDate/SingleDate.js.map +1 -1
  73. package/es/components/Popup/Popup.js +65 -7
  74. package/es/components/Popup/Popup.js.map +1 -1
  75. package/es/components/Select/ui/VirtualList/VirtualList.js +44 -13
  76. package/es/components/Select/ui/VirtualList/VirtualList.js.map +1 -1
  77. package/es/components/Slider/ui/Handler/Handler.js +2 -2
  78. package/es/components/Slider/ui/Handler/Handler.js.map +1 -1
  79. package/package.json +2 -3
  80. package/styled-components/cjs/components/Autocomplete/Autocomplete.js +1 -8
  81. package/styled-components/cjs/components/Autocomplete/ui/VirtualList/VirtualList.js +84 -16
  82. package/styled-components/cjs/components/Carousel/CarouselNew/Carousel.js +2 -2
  83. package/styled-components/cjs/components/Carousel/CarouselNew/hooks/useCarousel.js +6 -1
  84. package/styled-components/cjs/components/Combobox/ComboboxNew/Combobox.js +26 -44
  85. package/styled-components/cjs/components/Combobox/ComboboxNew/ui/VirtualList/VirtualList.js +84 -16
  86. package/styled-components/cjs/components/Combobox/ComboboxNew/utils/getTextValue.js +25 -0
  87. package/styled-components/cjs/components/Combobox/ComboboxNew/utils/index.js +4 -0
  88. package/styled-components/cjs/components/DatePicker/RangeDate/RangeDate.js +3 -1
  89. package/styled-components/cjs/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.js +5 -3
  90. package/styled-components/cjs/components/DatePicker/SingleDate/SingleDate.js +4 -2
  91. package/styled-components/cjs/components/Popup/Popup.js +69 -7
  92. package/styled-components/cjs/components/Select/ui/VirtualList/VirtualList.js +84 -16
  93. package/styled-components/es/components/Autocomplete/Autocomplete.js +2 -9
  94. package/styled-components/es/components/Autocomplete/ui/VirtualList/VirtualList.js +45 -13
  95. package/styled-components/es/components/Carousel/CarouselNew/Carousel.js +2 -2
  96. package/styled-components/es/components/Carousel/CarouselNew/hooks/useCarousel.js +6 -1
  97. package/styled-components/es/components/Combobox/ComboboxNew/Combobox.js +12 -30
  98. package/styled-components/es/components/Combobox/ComboboxNew/ui/VirtualList/VirtualList.js +45 -13
  99. package/styled-components/es/components/Combobox/ComboboxNew/utils/getTextValue.js +16 -0
  100. package/styled-components/es/components/Combobox/ComboboxNew/utils/index.js +1 -0
  101. package/styled-components/es/components/DatePicker/RangeDate/RangeDate.js +3 -1
  102. package/styled-components/es/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.js +5 -3
  103. package/styled-components/es/components/DatePicker/SingleDate/SingleDate.js +4 -2
  104. package/styled-components/es/components/Popup/Popup.js +63 -6
  105. package/styled-components/es/components/Select/ui/VirtualList/VirtualList.js +45 -13
  106. package/styled-components/es/examples/components/Combobox/Combobox.js +7 -0
  107. package/types/components/Autocomplete/Autocomplete.d.ts.map +1 -1
  108. package/types/components/Autocomplete/Autocomplete.types.d.ts +17 -17
  109. package/types/components/Autocomplete/Autocomplete.types.d.ts.map +1 -1
  110. package/types/components/Autocomplete/ui/VirtualList/VirtualList.d.ts +1 -1
  111. package/types/components/Autocomplete/ui/VirtualList/VirtualList.d.ts.map +1 -1
  112. package/types/components/Carousel/CarouselNew/Carousel.d.ts.map +1 -1
  113. package/types/components/Carousel/CarouselNew/Carousel.types.d.ts +5 -0
  114. package/types/components/Carousel/CarouselNew/Carousel.types.d.ts.map +1 -1
  115. package/types/components/Carousel/CarouselNew/hooks/useCarousel.d.ts.map +1 -1
  116. package/types/components/Combobox/ComboboxNew/Combobox.d.ts.map +1 -1
  117. package/types/components/Combobox/ComboboxNew/Combobox.types.d.ts +2 -2
  118. package/types/components/Combobox/ComboboxNew/Combobox.types.d.ts.map +1 -1
  119. package/types/components/Combobox/ComboboxNew/ui/VirtualList/VirtualList.d.ts +1 -1
  120. package/types/components/Combobox/ComboboxNew/ui/VirtualList/VirtualList.d.ts.map +1 -1
  121. package/types/components/Combobox/ComboboxNew/utils/getTextValue.d.ts +4 -0
  122. package/types/components/Combobox/ComboboxNew/utils/getTextValue.d.ts.map +1 -0
  123. package/types/components/Combobox/ComboboxNew/utils/index.d.ts +1 -0
  124. package/types/components/Combobox/ComboboxNew/utils/index.d.ts.map +1 -1
  125. package/types/components/DatePicker/RangeDate/RangeDate.d.ts.map +1 -1
  126. package/types/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.d.ts +1 -1
  127. package/types/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.d.ts.map +1 -1
  128. package/types/components/DatePicker/SingleDate/SingleDate.d.ts.map +1 -1
  129. package/types/components/DatePicker/SingleDate/SingleDate.types.d.ts +4 -0
  130. package/types/components/DatePicker/SingleDate/SingleDate.types.d.ts.map +1 -1
  131. package/types/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.styles.d.ts +12 -12
  132. package/types/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.styles.d.ts.map +1 -1
  133. package/types/components/Popup/Popup.d.ts.map +1 -1
  134. package/types/components/Select/Select.types.d.ts +4 -4
  135. package/types/components/Select/Select.types.d.ts.map +1 -1
  136. package/types/components/Select/ui/VirtualList/VirtualList.d.ts +1 -1
  137. package/types/components/Select/ui/VirtualList/VirtualList.d.ts.map +1 -1
  138. package/types/components/Table/ui/HeadCell/ui/Filter/Filter.styles.d.ts +12 -12
  139. package/types/components/Table/ui/HeadCell/ui/Filter/Filter.styles.d.ts.map +1 -1
  140. package/types/examples/components/Autocomplete/Autocomplete.d.ts +40 -40
  141. package/types/examples/components/Autocomplete/Autocomplete.d.ts.map +1 -1
  142. package/types/examples/components/Combobox/Combobox.d.ts +24 -24
  143. package/types/examples/components/Combobox/Combobox.d.ts.map +1 -1
  144. package/types/examples/components/Select/Select.d.ts +12 -12
  145. package/types/examples/components/Select/Select.d.ts.map +1 -1
  146. package/cjs/components/Popup/ui/Draggable/Draggable.js +0 -33
  147. package/cjs/components/Popup/ui/Draggable/Draggable.js.map +0 -1
  148. package/cjs/components/Popup/ui/Resizable/Resizable.js +0 -79
  149. package/cjs/components/Popup/ui/Resizable/Resizable.js.map +0 -1
  150. package/emotion/cjs/components/Popup/ui/Draggable/Draggable.js +0 -75
  151. package/emotion/cjs/components/Popup/ui/Resizable/Resizable.js +0 -114
  152. package/emotion/cjs/components/Popup/ui/index.js +0 -20
  153. package/emotion/es/components/Popup/ui/Draggable/Draggable.js +0 -19
  154. package/emotion/es/components/Popup/ui/Resizable/Resizable.js +0 -63
  155. package/emotion/es/components/Popup/ui/index.js +0 -2
  156. package/es/components/Popup/ui/Draggable/Draggable.js +0 -24
  157. package/es/components/Popup/ui/Draggable/Draggable.js.map +0 -1
  158. package/es/components/Popup/ui/Resizable/Resizable.js +0 -71
  159. package/es/components/Popup/ui/Resizable/Resizable.js.map +0 -1
  160. package/styled-components/cjs/components/Popup/ui/Draggable/Draggable.js +0 -75
  161. package/styled-components/cjs/components/Popup/ui/Resizable/Resizable.js +0 -114
  162. package/styled-components/cjs/components/Popup/ui/index.js +0 -20
  163. package/styled-components/es/components/Popup/ui/Draggable/Draggable.js +0 -19
  164. package/styled-components/es/components/Popup/ui/Resizable/Resizable.js +0 -63
  165. package/styled-components/es/components/Popup/ui/index.js +0 -2
  166. package/types/components/Popup/ui/Draggable/Draggable.d.ts +0 -6
  167. package/types/components/Popup/ui/Draggable/Draggable.d.ts.map +0 -1
  168. package/types/components/Popup/ui/Resizable/Resizable.d.ts +0 -7
  169. package/types/components/Popup/ui/Resizable/Resizable.d.ts.map +0 -1
  170. package/types/components/Popup/ui/index.d.ts +0 -3
  171. package/types/components/Popup/ui/index.d.ts.map +0 -1
@@ -101,13 +101,15 @@ function _unsupported_iterable_to_array(o, minLen) {
101
101
  }
102
102
  import React, { forwardRef, useRef } from "react";
103
103
  import { useForkRef } from "@salutejs/plasma-core";
104
+ import Draggable from "react-draggable";
105
+ import { Resizable } from "re-resizable";
104
106
  import { canUseDOM, cx, safeUseId } from "../../utils";
105
107
  import { Portal } from "../Portal";
106
- import { Draggable, Resizable } from "./ui";
108
+ import { getRatioBasedOnPlacement, getResizeDirections, getHandleStyles } from "./utils";
107
109
  import { PopupRoot } from "./PopupRoot";
108
110
  import { usePopup } from "./hooks";
109
111
  import { classes } from "./Popup.tokens";
110
- import { StyledPortalContainer, base } from "./Popup.styles";
112
+ import { StyledPortalContainer, base, IconResizeDiagonalStyled } from "./Popup.styles";
111
113
  export var handlePosition = function(placement, offset) {
112
114
  var x = '0rem';
113
115
  var y = '0rem';
@@ -188,7 +190,12 @@ export var handlePosition = function(placement, offset) {
188
190
  "draggable",
189
191
  "resizable"
190
192
  ]);
193
+ var _resizable_hiddenIcons, _resizable_icons, _resizable_hiddenIcons1, _resizable_icons1, _resizable_hiddenIcons2, _resizable_icons2, _resizable_hiddenIcons3, _resizable_icons3;
194
+ var nodeRef = useRef(null);
191
195
  var innerIsOpen = isOpen || opened;
196
+ var resizable = typeof outerResizable === 'boolean' ? {
197
+ disabled: !outerResizable
198
+ } : outerResizable;
192
199
  var uniqId = safeUseId();
193
200
  var innerId = id || uniqId;
194
201
  var _usePopup = usePopup({
@@ -199,11 +206,22 @@ export var handlePosition = function(placement, offset) {
199
206
  }), isVisible = _usePopup.isVisible, animationInfo = _usePopup.animationInfo, setVisible = _usePopup.setVisible, rootId = _usePopup.rootId;
200
207
  var portalRef = useRef(null);
201
208
  var contentRef = useRef(null);
209
+ var resizableContainer = useRef(null);
202
210
  var innerRef = useForkRef(contentRef, outerRootRef);
203
211
  if (!isVisible && !innerIsOpen) {
204
212
  return null;
205
213
  }
206
214
  var cls = cx(className, (animationInfo === null || animationInfo === void 0 ? void 0 : animationInfo.endAnimation) ? classes.endAnimation : '', (animationInfo === null || animationInfo === void 0 ? void 0 : animationInfo.endTransition) ? classes.endTransition : '');
215
+ var handleResizeStart = function() {
216
+ if ((resizableContainer === null || resizableContainer === void 0 ? void 0 : resizableContainer.current) && resizableContainer.current.resizable) {
217
+ resizableContainer.current.resizable.classList.toggle(classes.resizableContainerNoSelect);
218
+ }
219
+ };
220
+ var handleResizeStop = function() {
221
+ if ((resizableContainer === null || resizableContainer === void 0 ? void 0 : resizableContainer.current) && resizableContainer.current.resizable) {
222
+ resizableContainer.current.resizable.classList.toggle(classes.resizableContainerNoSelect);
223
+ }
224
+ };
207
225
  var rootNode = /*#__PURE__*/ React.createElement(Root, {
208
226
  className: cls
209
227
  }, overlay, /*#__PURE__*/ React.createElement(PopupRoot, _object_spread({
@@ -215,11 +233,50 @@ export var handlePosition = function(placement, offset) {
215
233
  animationInfo: animationInfo,
216
234
  setVisible: setVisible
217
235
  }, rest), /*#__PURE__*/ React.createElement(Draggable, {
218
- draggable: draggable
236
+ nodeRef: nodeRef,
237
+ defaultClassName: draggable ? classes.draggablePopupWrapper : undefined,
238
+ defaultClassNameDragging: draggable ? classes.draggingPopupWrapper : undefined,
239
+ disabled: !draggable,
240
+ cancel: ".".concat(classes.resizableHandleWrapper)
241
+ }, /*#__PURE__*/ React.createElement("div", {
242
+ ref: nodeRef
219
243
  }, /*#__PURE__*/ React.createElement(Resizable, {
220
- resizable: outerResizable,
221
- placement: placement
222
- }, children))));
244
+ ref: resizableContainer,
245
+ enable: resizable && !resizable.disabled ? getResizeDirections(resizable.directions) : false,
246
+ resizeRatio: getRatioBasedOnPlacement(placement),
247
+ defaultSize: resizable === null || resizable === void 0 ? void 0 : resizable.defaultSize,
248
+ minWidth: resizable === null || resizable === void 0 ? void 0 : resizable.minWidth,
249
+ minHeight: resizable === null || resizable === void 0 ? void 0 : resizable.minHeight,
250
+ maxWidth: resizable === null || resizable === void 0 ? void 0 : resizable.maxWidth,
251
+ maxHeight: resizable === null || resizable === void 0 ? void 0 : resizable.maxHeight,
252
+ onResizeStart: handleResizeStart,
253
+ onResizeStop: handleResizeStop,
254
+ handleComponent: {
255
+ topRight: (resizable === null || resizable === void 0 ? void 0 : (_resizable_hiddenIcons = resizable.hiddenIcons) === null || _resizable_hiddenIcons === void 0 ? void 0 : _resizable_hiddenIcons.includes('top-right')) ? undefined : /*#__PURE__*/ React.createElement(React.Fragment, null, (resizable === null || resizable === void 0 ? void 0 : (_resizable_icons = resizable.icons) === null || _resizable_icons === void 0 ? void 0 : _resizable_icons.topRight) || /*#__PURE__*/ React.createElement(IconResizeDiagonalStyled, {
256
+ className: classes.resizableTopRightIcon,
257
+ color: "inherit",
258
+ size: resizable === null || resizable === void 0 ? void 0 : resizable.iconSize
259
+ })),
260
+ bottomRight: (resizable === null || resizable === void 0 ? void 0 : (_resizable_hiddenIcons1 = resizable.hiddenIcons) === null || _resizable_hiddenIcons1 === void 0 ? void 0 : _resizable_hiddenIcons1.includes('bottom-right')) ? undefined : /*#__PURE__*/ React.createElement(React.Fragment, null, (resizable === null || resizable === void 0 ? void 0 : (_resizable_icons1 = resizable.icons) === null || _resizable_icons1 === void 0 ? void 0 : _resizable_icons1.bottomRight) || /*#__PURE__*/ React.createElement(IconResizeDiagonalStyled, {
261
+ className: classes.resizableBottomRightIcon,
262
+ color: "inherit",
263
+ size: resizable === null || resizable === void 0 ? void 0 : resizable.iconSize
264
+ })),
265
+ bottomLeft: (resizable === null || resizable === void 0 ? void 0 : (_resizable_hiddenIcons2 = resizable.hiddenIcons) === null || _resizable_hiddenIcons2 === void 0 ? void 0 : _resizable_hiddenIcons2.includes('bottom-left')) ? undefined : /*#__PURE__*/ React.createElement(React.Fragment, null, (resizable === null || resizable === void 0 ? void 0 : (_resizable_icons2 = resizable.icons) === null || _resizable_icons2 === void 0 ? void 0 : _resizable_icons2.bottomLeft) || /*#__PURE__*/ React.createElement(IconResizeDiagonalStyled, {
266
+ className: classes.resizableBottomLeftIcon,
267
+ color: "inherit",
268
+ size: resizable === null || resizable === void 0 ? void 0 : resizable.iconSize
269
+ })),
270
+ topLeft: (resizable === null || resizable === void 0 ? void 0 : (_resizable_hiddenIcons3 = resizable.hiddenIcons) === null || _resizable_hiddenIcons3 === void 0 ? void 0 : _resizable_hiddenIcons3.includes('top-left')) ? undefined : /*#__PURE__*/ React.createElement(React.Fragment, null, (resizable === null || resizable === void 0 ? void 0 : (_resizable_icons3 = resizable.icons) === null || _resizable_icons3 === void 0 ? void 0 : _resizable_icons3.topLeft) || /*#__PURE__*/ React.createElement(IconResizeDiagonalStyled, {
271
+ className: classes.resizableTopLeftIcon,
272
+ color: "inherit",
273
+ size: resizable === null || resizable === void 0 ? void 0 : resizable.iconSize
274
+ }))
275
+ },
276
+ className: classes.resizableContainer,
277
+ handleStyles: getHandleStyles(),
278
+ handleWrapperClass: classes.resizableHandleWrapper
279
+ }, children)))));
223
280
  if (typeof frame !== 'string' && frame && frame.current && canUseDOM) {
224
281
  return /*#__PURE__*/ React.createElement(Portal, {
225
282
  container: frame.current
@@ -1,25 +1,57 @@
1
- import React from "react";
2
- import List from "rc-virtual-list";
1
+ import React, { useRef } from "react";
2
+ import { useVirtualizer } from "@tanstack/react-virtual";
3
3
  import { getHeightAsNumber } from "../../../../utils";
4
4
  import { Item } from "../Inner/ui";
5
5
  export var VirtualList = function(param) {
6
6
  var items = param.items, listMaxHeight = param.listMaxHeight, onScroll = param.onScroll;
7
- return /*#__PURE__*/ React.createElement(List, {
8
- data: items,
9
- height: getHeightAsNumber(listMaxHeight),
10
- fullHeight: false,
11
- itemHeight: 100,
12
- itemKey: "id",
7
+ var _virtualItems_;
8
+ var parentRef = useRef(null);
9
+ var virtualizer = useVirtualizer({
10
+ count: items.length,
11
+ getScrollElement: function() {
12
+ return parentRef.current;
13
+ },
14
+ estimateSize: function() {
15
+ return 48;
16
+ }
17
+ });
18
+ var virtualItems = virtualizer.getVirtualItems();
19
+ var _virtualItems__start;
20
+ return /*#__PURE__*/ React.createElement("div", {
21
+ ref: parentRef,
22
+ style: {
23
+ height: 'auto',
24
+ maxHeight: getHeightAsNumber(listMaxHeight),
25
+ overflowY: 'auto'
26
+ },
13
27
  onScroll: onScroll
14
- }, function(item, index, props) {
15
- return /*#__PURE__*/ React.createElement("div", props, /*#__PURE__*/ React.createElement(Item, {
16
- item: item,
28
+ }, /*#__PURE__*/ React.createElement("div", {
29
+ style: {
30
+ height: virtualizer.getTotalSize(),
31
+ width: '100%',
32
+ position: 'relative'
33
+ }
34
+ }, /*#__PURE__*/ React.createElement("div", {
35
+ style: {
36
+ position: 'absolute',
37
+ top: 0,
38
+ left: 0,
39
+ width: '100%',
40
+ transform: "translateY(".concat((_virtualItems__start = (_virtualItems_ = virtualItems[0]) === null || _virtualItems_ === void 0 ? void 0 : _virtualItems_.start) !== null && _virtualItems__start !== void 0 ? _virtualItems__start : 0, "px)")
41
+ }
42
+ }, virtualItems.map(function(virtualRow) {
43
+ return /*#__PURE__*/ React.createElement("div", {
44
+ key: virtualRow.key,
45
+ "data-index": virtualRow.index,
46
+ ref: virtualizer.measureElement
47
+ }, /*#__PURE__*/ React.createElement(Item, {
48
+ item: items[virtualRow.index],
17
49
  path: [
18
50
  'root'
19
51
  ],
20
52
  currentLevel: 0,
21
- index: index,
53
+ index: virtualRow.index,
22
54
  ariaLevel: 1
23
55
  }));
24
- });
56
+ }))));
25
57
  };
@@ -1,5 +1,5 @@
1
1
  import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
- import React, { forwardRef, useReducer, useState, useRef, useLayoutEffect } from 'react';
2
+ import React, { forwardRef, useReducer, useState, useRef } from 'react';
3
3
  import { FloatingPopover } from './FloatingPopover.js';
4
4
  import { focusedReducer } from './reducers/focusedReducer.js';
5
5
  import { ListWrapper, Ul, InfiniteLoaderWrapper, base, StyledLeftHelper } from './Autocomplete.styles.js';
@@ -64,7 +64,7 @@ var autocompleteRoot = function autocompleteRoot(Root) {
64
64
  _useReducer2 = _slicedToArray(_useReducer, 2),
65
65
  focused = _useReducer2[0],
66
66
  dispatchFocused = _useReducer2[1];
67
- var _useState = useState(''),
67
+ var _useState = useState(defaultValue || ''),
68
68
  _useState2 = _slicedToArray(_useState, 2),
69
69
  innerValue = _useState2[0],
70
70
  setInnerValue = _useState2[1];
@@ -125,11 +125,6 @@ var autocompleteRoot = function autocompleteRoot(Root) {
125
125
  type: 'reset'
126
126
  });
127
127
  }, [value]);
128
- useLayoutEffect(function () {
129
- if (defaultValue) {
130
- setInnerValue(defaultValue);
131
- }
132
- }, [defaultValue]);
133
128
  return /*#__PURE__*/React.createElement(Root, {
134
129
  view: view,
135
130
  size: size,
@@ -1 +1 @@
1
- {"version":3,"file":"Autocomplete.js","sources":["../../../src/components/Autocomplete/Autocomplete.tsx"],"sourcesContent":["import React, { forwardRef, useState, useReducer, useLayoutEffect, useRef } from 'react';\nimport { safeUseId } from 'src/utils';\nimport { useDidMountEffect, useOutsideClick } from 'src/hooks';\nimport { RootProps } from 'src/engines';\n\nimport { FloatingPopover } from './FloatingPopover';\nimport { focusedReducer } from './reducers/focusedReducer';\nimport { SuggestionItem, StyledTextField, VirtualList } from './ui';\nimport { Ul, InfiniteLoaderWrapper, base, StyledLeftHelper, ListWrapper } from './Autocomplete.styles';\nimport type { AutocompleteProps, SuggestionItemType } from './Autocomplete.types';\nimport { useKeyNavigation } from './hooks/useKeyboardNavigation';\n\n/**\n * Компонент Autocomplete. Поле ввода с подсказками в выпадающем списке.\n */\nexport const autocompleteRoot = (Root: RootProps<HTMLInputElement, Omit<AutocompleteProps, 'hintText'>>) =>\n forwardRef<HTMLInputElement, AutocompleteProps>(\n (\n {\n value: outerValue,\n defaultValue,\n onChange,\n suggestions,\n view,\n size,\n labelPlacement,\n keepPlaceholder,\n disabled,\n readOnly,\n label,\n leftHelper,\n contentLeft,\n contentRight,\n textBefore,\n textAfter,\n onScroll,\n listMaxHeight = '25rem',\n listWidth,\n portal,\n zIndex,\n filter,\n onSuggestionSelect,\n threshold = 2,\n renderList,\n renderListEnd,\n renderItem,\n onSearch,\n hintText,\n hintView = 'default',\n hintSize = 'm',\n beforeList,\n afterList,\n virtual = false,\n // @ts-ignore\n _offset,\n ...rest\n },\n ref,\n ) => {\n const [focused, dispatchFocused] = useReducer(focusedReducer, null);\n const [innerValue, setInnerValue] = useState<string | number>('');\n const [isOpen, setIsOpen] = useState(false);\n\n const listId = safeUseId();\n const value = outerValue ?? innerValue;\n\n const helperTextId = safeUseId();\n const floatingPopoverRef = useRef<HTMLDivElement>(null);\n\n const targetRef = useOutsideClick<HTMLUListElement>(() => {\n setIsOpen(false);\n }, floatingPopoverRef);\n\n const handleFocus = () => {\n if (value.toString().length >= threshold) {\n setIsOpen(true);\n }\n };\n\n const handleItemClick = (e: SuggestionItemType) => {\n setInnerValue(e.label);\n\n if (onSuggestionSelect) {\n onSuggestionSelect(e);\n }\n\n setIsOpen(false);\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const currentValue = e.target.value;\n\n setInnerValue(currentValue);\n\n if (onChange) {\n onChange(e);\n }\n\n if (currentValue.toString().length >= threshold) {\n setIsOpen(true);\n } else {\n setIsOpen(false);\n }\n };\n\n const defaultFilterCallback = ({ label }: { label: string }) => {\n return label.toLowerCase().includes(value.toString().toLowerCase());\n };\n\n const helperTextStopPropagation = (event: React.MouseEvent<HTMLDivElement>) => {\n event.stopPropagation();\n };\n\n const finalResults = suggestions?.filter(filter || defaultFilterCallback) || [];\n\n const { onKeyDown } = useKeyNavigation({\n isOpen,\n setIsOpen,\n focused,\n dispatchFocused,\n finalResults,\n handleItemClick,\n });\n\n useDidMountEffect(() => {\n dispatchFocused({ type: 'reset' });\n }, [value]);\n\n useLayoutEffect(() => {\n if (defaultValue) {\n setInnerValue(defaultValue);\n }\n }, [defaultValue]);\n\n return (\n <Root\n view={view}\n size={size}\n labelPlacement={labelPlacement}\n disabled={disabled}\n readOnly={readOnly}\n hintView={hintView}\n hintSize={hintSize}\n >\n <FloatingPopover\n ref={floatingPopoverRef}\n opened={isOpen}\n portal={portal}\n zIndex={zIndex}\n listWidth={listWidth}\n offset={_offset}\n target={(referenceRef) => (\n <StyledTextField\n ref={ref}\n inputWrapperRef={referenceRef}\n value={value}\n onChange={handleChange}\n onSearch={focused === null ? onSearch : undefined}\n size={size}\n view={view}\n disabled={disabled}\n readOnly={readOnly}\n label={label}\n contentLeft={contentLeft}\n contentRight={contentRight}\n textBefore={textBefore}\n textAfter={textAfter}\n onFocus={handleFocus}\n onKeyDown={onKeyDown}\n role=\"combobox\"\n aria-autocomplete=\"list\"\n aria-controls={listId}\n aria-expanded={isOpen}\n aria-activedescendant={`${listId}/${focused}`}\n aria-describedby={helperTextId}\n hintText={String(hintText || '')}\n labelPlacement={labelPlacement}\n keepPlaceholder={keepPlaceholder}\n leftHelper={\n leftHelper && (\n <StyledLeftHelper onClick={helperTextStopPropagation}>\n {leftHelper}\n </StyledLeftHelper>\n )\n }\n {...rest}\n />\n )}\n >\n {(renderList && renderList(finalResults)) ||\n (Boolean(finalResults.length) && (\n <Root\n view={view}\n size={size}\n labelPlacement={labelPlacement}\n disabled={disabled}\n readOnly={readOnly}\n >\n <ListWrapper>\n <Ul\n ref={targetRef}\n id={listId}\n role=\"listbox\"\n aria-label={label}\n onScroll={virtual ? undefined : onScroll}\n listMaxHeight={listMaxHeight}\n virtual={virtual}\n >\n {virtual ? (\n <VirtualList\n items={finalResults}\n onClick={handleItemClick}\n listId={listId}\n listMaxHeight={listMaxHeight}\n onScroll={onScroll}\n renderItem={renderItem}\n />\n ) : (\n <>\n {beforeList}\n\n {finalResults.map((suggestion, index) => (\n <SuggestionItem\n key={index}\n item={suggestion}\n onClick={handleItemClick}\n id={`${listId}/${index}`}\n focused={focused === index}\n renderItem={renderItem}\n />\n ))}\n\n {afterList}\n </>\n )}\n\n {renderListEnd && (\n <InfiniteLoaderWrapper>{renderListEnd()}</InfiniteLoaderWrapper>\n )}\n </Ul>\n </ListWrapper>\n </Root>\n ))}\n </FloatingPopover>\n </Root>\n );\n },\n );\n\nexport const autocompleteConfig = {\n name: 'Autocomplete',\n tag: 'div',\n layout: autocompleteRoot,\n base,\n defaults: {\n view: 'default',\n size: 'l',\n labelPlacement: 'outer',\n },\n variations: {\n view: {\n css: '',\n },\n },\n};\n"],"names":["autocompleteRoot","Root","forwardRef","_ref","ref","_StyledLeftHelper","outerValue","value","defaultValue","onChange","suggestions","view","size","labelPlacement","keepPlaceholder","disabled","readOnly","label","leftHelper","contentLeft","contentRight","textBefore","textAfter","onScroll","_ref$listMaxHeight","listMaxHeight","listWidth","portal","zIndex","filter","onSuggestionSelect","_ref$threshold","threshold","renderList","renderListEnd","renderItem","onSearch","hintText","_ref$hintView","hintView","_ref$hintSize","hintSize","beforeList","afterList","_ref$virtual","virtual","_offset","rest","_objectWithoutProperties","_excluded","_useReducer","useReducer","focusedReducer","_useReducer2","_slicedToArray","focused","dispatchFocused","_useState","useState","_useState2","innerValue","setInnerValue","_useState3","_useState4","isOpen","setIsOpen","listId","safeUseId","helperTextId","floatingPopoverRef","useRef","targetRef","useOutsideClick","handleFocus","toString","length","handleItemClick","e","handleChange","currentValue","target","defaultFilterCallback","_ref2","toLowerCase","includes","helperTextStopPropagation","event","stopPropagation","finalResults","_useKeyNavigation","useKeyNavigation","onKeyDown","useDidMountEffect","type","useLayoutEffect","React","createElement","FloatingPopover","opened","offset","referenceRef","StyledTextField","_extends","inputWrapperRef","undefined","onFocus","role","concat","String","StyledLeftHelper","onClick","Boolean","ListWrapper","Ul","id","VirtualList","items","Fragment","map","suggestion","index","SuggestionItem","key","item","InfiniteLoaderWrapper","autocompleteConfig","name","tag","layout","base","defaults","variations","css"],"mappings":"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"}
1
+ {"version":3,"file":"Autocomplete.js","sources":["../../../src/components/Autocomplete/Autocomplete.tsx"],"sourcesContent":["import React, { forwardRef, useState, useReducer, useRef } from 'react';\nimport { safeUseId } from 'src/utils';\nimport { useDidMountEffect, useOutsideClick } from 'src/hooks';\nimport { RootProps } from 'src/engines';\n\nimport { FloatingPopover } from './FloatingPopover';\nimport { focusedReducer } from './reducers/focusedReducer';\nimport { SuggestionItem, StyledTextField, VirtualList } from './ui';\nimport { Ul, InfiniteLoaderWrapper, base, StyledLeftHelper, ListWrapper } from './Autocomplete.styles';\nimport type { AutocompleteProps, SuggestionItemType } from './Autocomplete.types';\nimport { useKeyNavigation } from './hooks/useKeyboardNavigation';\n\n/**\n * Компонент Autocomplete. Поле ввода с подсказками в выпадающем списке.\n */\nexport const autocompleteRoot = (Root: RootProps<HTMLInputElement, Omit<AutocompleteProps, 'hintText'>>) =>\n forwardRef<HTMLInputElement, AutocompleteProps>(\n (\n {\n value: outerValue,\n defaultValue,\n onChange,\n suggestions,\n view,\n size,\n labelPlacement,\n keepPlaceholder,\n disabled,\n readOnly,\n label,\n leftHelper,\n contentLeft,\n contentRight,\n textBefore,\n textAfter,\n onScroll,\n listMaxHeight = '25rem',\n listWidth,\n portal,\n zIndex,\n filter,\n onSuggestionSelect,\n threshold = 2,\n renderList,\n renderListEnd,\n renderItem,\n onSearch,\n hintText,\n hintView = 'default',\n hintSize = 'm',\n beforeList,\n afterList,\n virtual = false,\n // @ts-ignore\n _offset,\n ...rest\n },\n ref,\n ) => {\n const [focused, dispatchFocused] = useReducer(focusedReducer, null);\n const [innerValue, setInnerValue] = useState<string>(defaultValue || '');\n const [isOpen, setIsOpen] = useState(false);\n\n const listId = safeUseId();\n const value = outerValue ?? innerValue;\n\n const helperTextId = safeUseId();\n const floatingPopoverRef = useRef<HTMLDivElement>(null);\n\n const targetRef = useOutsideClick<HTMLUListElement>(() => {\n setIsOpen(false);\n }, floatingPopoverRef);\n\n const handleFocus = () => {\n if (value.toString().length >= threshold) {\n setIsOpen(true);\n }\n };\n\n const handleItemClick = (e: SuggestionItemType) => {\n setInnerValue(e.label);\n\n if (onSuggestionSelect) {\n onSuggestionSelect(e);\n }\n\n setIsOpen(false);\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const currentValue = e.target.value;\n\n setInnerValue(currentValue);\n\n if (onChange) {\n onChange(e);\n }\n\n if (currentValue.toString().length >= threshold) {\n setIsOpen(true);\n } else {\n setIsOpen(false);\n }\n };\n\n const defaultFilterCallback = ({ label }: { label: string }) => {\n return label.toLowerCase().includes(value.toString().toLowerCase());\n };\n\n const helperTextStopPropagation = (event: React.MouseEvent<HTMLDivElement>) => {\n event.stopPropagation();\n };\n\n const finalResults = suggestions?.filter(filter || defaultFilterCallback) || [];\n\n const { onKeyDown } = useKeyNavigation({\n isOpen,\n setIsOpen,\n focused,\n dispatchFocused,\n finalResults,\n handleItemClick,\n });\n\n useDidMountEffect(() => {\n dispatchFocused({ type: 'reset' });\n }, [value]);\n\n return (\n <Root\n view={view}\n size={size}\n labelPlacement={labelPlacement}\n disabled={disabled}\n readOnly={readOnly}\n hintView={hintView}\n hintSize={hintSize}\n >\n <FloatingPopover\n ref={floatingPopoverRef}\n opened={isOpen}\n portal={portal}\n zIndex={zIndex}\n listWidth={listWidth}\n offset={_offset}\n target={(referenceRef) => (\n <StyledTextField\n ref={ref}\n inputWrapperRef={referenceRef}\n value={value}\n onChange={handleChange}\n onSearch={focused === null ? onSearch : undefined}\n size={size}\n view={view}\n disabled={disabled}\n readOnly={readOnly}\n label={label}\n contentLeft={contentLeft}\n contentRight={contentRight}\n textBefore={textBefore}\n textAfter={textAfter}\n onFocus={handleFocus}\n onKeyDown={onKeyDown}\n role=\"combobox\"\n aria-autocomplete=\"list\"\n aria-controls={listId}\n aria-expanded={isOpen}\n aria-activedescendant={`${listId}/${focused}`}\n aria-describedby={helperTextId}\n hintText={String(hintText || '')}\n labelPlacement={labelPlacement}\n keepPlaceholder={keepPlaceholder}\n leftHelper={\n leftHelper && (\n <StyledLeftHelper onClick={helperTextStopPropagation}>\n {leftHelper}\n </StyledLeftHelper>\n )\n }\n {...rest}\n />\n )}\n >\n {(renderList && renderList(finalResults)) ||\n (Boolean(finalResults.length) && (\n <Root\n view={view}\n size={size}\n labelPlacement={labelPlacement}\n disabled={disabled}\n readOnly={readOnly}\n >\n <ListWrapper>\n <Ul\n ref={targetRef}\n id={listId}\n role=\"listbox\"\n aria-label={label}\n onScroll={virtual ? undefined : onScroll}\n listMaxHeight={listMaxHeight}\n virtual={virtual}\n >\n {virtual ? (\n <VirtualList\n items={finalResults}\n onClick={handleItemClick}\n listId={listId}\n listMaxHeight={listMaxHeight}\n onScroll={onScroll}\n renderItem={renderItem}\n />\n ) : (\n <>\n {beforeList}\n\n {finalResults.map((suggestion, index) => (\n <SuggestionItem\n key={index}\n item={suggestion}\n onClick={handleItemClick}\n id={`${listId}/${index}`}\n focused={focused === index}\n renderItem={renderItem}\n />\n ))}\n\n {afterList}\n </>\n )}\n\n {renderListEnd && (\n <InfiniteLoaderWrapper>{renderListEnd()}</InfiniteLoaderWrapper>\n )}\n </Ul>\n </ListWrapper>\n </Root>\n ))}\n </FloatingPopover>\n </Root>\n );\n },\n );\n\nexport const autocompleteConfig = {\n name: 'Autocomplete',\n tag: 'div',\n layout: autocompleteRoot,\n base,\n defaults: {\n view: 'default',\n size: 'l',\n labelPlacement: 'outer',\n },\n variations: {\n view: {\n css: '',\n },\n },\n};\n"],"names":["autocompleteRoot","Root","forwardRef","_ref","ref","_StyledLeftHelper","outerValue","value","defaultValue","onChange","suggestions","view","size","labelPlacement","keepPlaceholder","disabled","readOnly","label","leftHelper","contentLeft","contentRight","textBefore","textAfter","onScroll","_ref$listMaxHeight","listMaxHeight","listWidth","portal","zIndex","filter","onSuggestionSelect","_ref$threshold","threshold","renderList","renderListEnd","renderItem","onSearch","hintText","_ref$hintView","hintView","_ref$hintSize","hintSize","beforeList","afterList","_ref$virtual","virtual","_offset","rest","_objectWithoutProperties","_excluded","_useReducer","useReducer","focusedReducer","_useReducer2","_slicedToArray","focused","dispatchFocused","_useState","useState","_useState2","innerValue","setInnerValue","_useState3","_useState4","isOpen","setIsOpen","listId","safeUseId","helperTextId","floatingPopoverRef","useRef","targetRef","useOutsideClick","handleFocus","toString","length","handleItemClick","e","handleChange","currentValue","target","defaultFilterCallback","_ref2","toLowerCase","includes","helperTextStopPropagation","event","stopPropagation","finalResults","_useKeyNavigation","useKeyNavigation","onKeyDown","useDidMountEffect","type","React","createElement","FloatingPopover","opened","offset","referenceRef","StyledTextField","_extends","inputWrapperRef","undefined","onFocus","role","concat","String","StyledLeftHelper","onClick","Boolean","ListWrapper","Ul","id","VirtualList","items","Fragment","map","suggestion","index","SuggestionItem","key","item","InfiniteLoaderWrapper","autocompleteConfig","name","tag","layout","base","defaults","variations","css"],"mappings":"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"}
@@ -1,31 +1,62 @@
1
- import React from 'react';
2
- import List from 'rc-virtual-list';
1
+ import React, { useRef } from 'react';
2
+ import { useVirtualizer } from '@tanstack/react-virtual';
3
3
  import { SuggestionItem } from '../SuggestionItem/SuggestionItem.js';
4
4
  import { getHeightAsNumber } from '../../../../utils/getHeightAsNumber.js';
5
5
 
6
6
  var VirtualList = function VirtualList(_ref) {
7
+ var _virtualItems$0$start, _virtualItems$;
7
8
  var items = _ref.items,
8
9
  onClick = _ref.onClick,
9
10
  listId = _ref.listId,
10
11
  listMaxHeight = _ref.listMaxHeight,
11
12
  onScroll = _ref.onScroll,
12
13
  renderItem = _ref.renderItem;
13
- return /*#__PURE__*/React.createElement(List, {
14
- data: items,
15
- height: getHeightAsNumber(listMaxHeight),
16
- fullHeight: false,
17
- itemHeight: 100,
18
- itemKey: "id",
14
+ var parentRef = useRef(null);
15
+ var virtualizer = useVirtualizer({
16
+ count: items.length,
17
+ getScrollElement: function getScrollElement() {
18
+ return parentRef.current;
19
+ },
20
+ estimateSize: function estimateSize() {
21
+ return 48;
22
+ }
23
+ });
24
+ var virtualItems = virtualizer.getVirtualItems();
25
+ return /*#__PURE__*/React.createElement("div", {
26
+ ref: parentRef,
27
+ style: {
28
+ height: 'auto',
29
+ maxHeight: getHeightAsNumber(listMaxHeight),
30
+ overflowY: 'auto'
31
+ },
19
32
  onScroll: onScroll
20
- }, function (item, index, props) {
21
- return /*#__PURE__*/React.createElement("div", props, /*#__PURE__*/React.createElement(SuggestionItem, {
22
- item: item,
33
+ }, /*#__PURE__*/React.createElement("div", {
34
+ style: {
35
+ height: virtualizer.getTotalSize(),
36
+ width: '100%',
37
+ position: 'relative'
38
+ }
39
+ }, /*#__PURE__*/React.createElement("div", {
40
+ style: {
41
+ position: 'absolute',
42
+ top: 0,
43
+ left: 0,
44
+ width: '100%',
45
+ transform: "translateY(".concat((_virtualItems$0$start = (_virtualItems$ = virtualItems[0]) === null || _virtualItems$ === void 0 ? void 0 : _virtualItems$.start) !== null && _virtualItems$0$start !== void 0 ? _virtualItems$0$start : 0, "px)")
46
+ }
47
+ }, virtualItems.map(function (virtualRow) {
48
+ return /*#__PURE__*/React.createElement("div", {
49
+ key: virtualRow.key,
50
+ "data-index": virtualRow.index,
51
+ ref: virtualizer.measureElement
52
+ }, /*#__PURE__*/React.createElement(SuggestionItem, {
53
+ item: items[virtualRow.index],
23
54
  onClick: onClick,
24
- id: "".concat(listId, "/").concat(index),
55
+ id: "".concat(listId, "/").concat(virtualRow.index),
25
56
  focused: false,
26
57
  renderItem: renderItem
27
58
  }));
28
- });
59
+ }))));
29
60
  };
30
61
 
31
62
  export { VirtualList };
@@ -1 +1 @@
1
- {"version":3,"file":"VirtualList.js","sources":["../../../../../src/components/Autocomplete/ui/VirtualList/VirtualList.tsx"],"sourcesContent":["import React from 'react';\nimport List from 'rc-virtual-list';\nimport { getHeightAsNumber } from 'src/utils';\n\nimport { SuggestionItem } from '../SuggestionItem/SuggestionItem';\nimport type { SuggestionItemType } from '../../Autocomplete.types';\n\ninterface Props {\n items: SuggestionItemType[];\n onClick: (e: SuggestionItemType) => void;\n listId: string;\n listMaxHeight?: string;\n onScroll?: (e: React.UIEvent<HTMLUListElement>) => void;\n renderItem?: (item: SuggestionItemType) => React.ReactNode;\n}\n\nexport const VirtualList: React.FC<Props> = ({ items, onClick, listId, listMaxHeight, onScroll, renderItem }) => (\n <List\n data={items}\n height={getHeightAsNumber(listMaxHeight)}\n fullHeight={false}\n itemHeight={100}\n itemKey=\"id\"\n onScroll={onScroll}\n >\n {(item, index, props) => (\n <div {...props}>\n <SuggestionItem\n item={item}\n onClick={onClick}\n id={`${listId}/${index}`}\n focused={false}\n renderItem={renderItem}\n />\n </div>\n )}\n </List>\n);\n"],"names":["VirtualList","_ref","items","onClick","listId","listMaxHeight","onScroll","renderItem","React","createElement","List","data","height","getHeightAsNumber","fullHeight","itemHeight","itemKey","item","index","props","SuggestionItem","id","concat","focused"],"mappings":";;;;;IAgBaA,WAA4B,GAAG,SAA/BA,WAA4BA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAMC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAEC,OAAO,GAAAF,IAAA,CAAPE,OAAO;IAAEC,MAAM,GAAAH,IAAA,CAANG,MAAM;IAAEC,aAAa,GAAAJ,IAAA,CAAbI,aAAa;IAAEC,QAAQ,GAAAL,IAAA,CAARK,QAAQ;IAAEC,UAAU,GAAAN,IAAA,CAAVM,UAAU,CAAA;AAAA,EAAA,oBACtGC,KAAA,CAAAC,aAAA,CAACC,IAAI,EAAA;AACDC,IAAAA,IAAI,EAAET,KAAM;AACZU,IAAAA,MAAM,EAAEC,iBAAiB,CAACR,aAAa,CAAE;AACzCS,IAAAA,UAAU,EAAE,KAAM;AAClBC,IAAAA,UAAU,EAAE,GAAI;AAChBC,IAAAA,OAAO,EAAC,IAAI;AACZV,IAAAA,QAAQ,EAAEA,QAAAA;AAAS,GAAA,EAElB,UAACW,IAAI,EAAEC,KAAK,EAAEC,KAAK,EAAA;IAAA,oBAChBX,KAAA,CAAAC,aAAA,CAASU,KAAAA,EAAAA,KAAK,eACVX,KAAA,CAAAC,aAAA,CAACW,cAAc,EAAA;AACXH,MAAAA,IAAI,EAAEA,IAAK;AACXd,MAAAA,OAAO,EAAEA,OAAQ;MACjBkB,EAAE,EAAA,EAAA,CAAAC,MAAA,CAAKlB,MAAM,OAAAkB,MAAA,CAAIJ,KAAK,CAAG;AACzBK,MAAAA,OAAO,EAAE,KAAM;AACfhB,MAAAA,UAAU,EAAEA,UAAAA;AAAW,KAC1B,CACA,CAAC,CAAA;AAAA,GAER,CAAC,CAAA;AAAA;;;;"}
1
+ {"version":3,"file":"VirtualList.js","sources":["../../../../../src/components/Autocomplete/ui/VirtualList/VirtualList.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { useVirtualizer } from '@tanstack/react-virtual';\nimport { getHeightAsNumber } from 'src/utils';\n\nimport { SuggestionItem } from '../SuggestionItem/SuggestionItem';\nimport type { SuggestionItemType } from '../../Autocomplete.types';\n\ninterface Props {\n items: SuggestionItemType[];\n onClick: (e: SuggestionItemType) => void;\n listId: string;\n listMaxHeight?: string;\n onScroll?: (e: React.UIEvent<HTMLElement>) => void;\n renderItem?: (item: SuggestionItemType) => React.ReactNode;\n}\n\nexport const VirtualList: React.FC<Props> = ({ items, onClick, listId, listMaxHeight, onScroll, renderItem }) => {\n const parentRef = useRef<HTMLDivElement>(null);\n\n const virtualizer = useVirtualizer({\n count: items.length,\n getScrollElement: () => parentRef.current,\n estimateSize: () => 48,\n });\n\n const virtualItems = virtualizer.getVirtualItems();\n\n return (\n <div\n ref={parentRef}\n style={{\n height: 'auto',\n maxHeight: getHeightAsNumber(listMaxHeight),\n overflowY: 'auto',\n }}\n onScroll={onScroll}\n >\n <div\n style={{\n height: virtualizer.getTotalSize(),\n width: '100%',\n position: 'relative',\n }}\n >\n <div\n style={{\n position: 'absolute',\n top: 0,\n left: 0,\n width: '100%',\n transform: `translateY(${virtualItems[0]?.start ?? 0}px)`,\n }}\n >\n {virtualItems.map((virtualRow) => (\n <div\n key={virtualRow.key as React.Key}\n data-index={virtualRow.index}\n ref={virtualizer.measureElement}\n >\n <SuggestionItem\n item={items[virtualRow.index]}\n onClick={onClick}\n id={`${listId}/${virtualRow.index}`}\n focused={false}\n renderItem={renderItem}\n />\n </div>\n ))}\n </div>\n </div>\n </div>\n );\n};\n"],"names":["VirtualList","_ref","_virtualItems$0$start","_virtualItems$","items","onClick","listId","listMaxHeight","onScroll","renderItem","parentRef","useRef","virtualizer","useVirtualizer","count","length","getScrollElement","current","estimateSize","virtualItems","getVirtualItems","React","createElement","ref","style","height","maxHeight","getHeightAsNumber","overflowY","getTotalSize","width","position","top","left","transform","concat","start","map","virtualRow","key","index","measureElement","SuggestionItem","item","id","focused"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
2
- import React, { forwardRef, useState, Children } from 'react';
2
+ import React, { forwardRef, Children, useState } from 'react';
3
3
  import { classes } from './Carousel.tokens.js';
4
4
  import { base as base$2 } from './variations/_size/base.js';
5
5
  import { base as base$1 } from './variations/_view/base.js';
@@ -30,12 +30,13 @@ var carouselNewRoot = function carouselNewRoot(Root) {
30
30
  _ref$gap = _ref.gap,
31
31
  gap = _ref$gap === void 0 ? '20px' : _ref$gap,
32
32
  className = _ref.className,
33
- style = _ref.style;
34
- var _useState = useState(0),
33
+ style = _ref.style,
34
+ defaultIndex = _ref.defaultIndex;
35
+ var slidesAmount = Children.count(children);
36
+ var _useState = useState(defaultIndex && defaultIndex >= 0 ? Math.min(slidesAmount - 1, defaultIndex) : 0),
35
37
  _useState2 = _slicedToArray(_useState, 2),
36
38
  index = _useState2[0],
37
39
  setIndex = _useState2[1];
38
- var slidesAmount = Children.count(children);
39
40
  var handleClickLeft = function handleClickLeft() {
40
41
  setIndex(Math.max(0, index - 1));
41
42
  };
@@ -1 +1 @@
1
- {"version":3,"file":"Carousel.js","sources":["../../../../src/components/Carousel/CarouselNew/Carousel.tsx"],"sourcesContent":["import { RootProps } from 'src/engines';\nimport React, { forwardRef, useState, Children } from 'react';\nimport { IconDisclosureLeft, IconDisclosureRight } from 'src/components/_Icon';\nimport { useDisableScroll } from 'src/hooks';\n\nimport { classes } from './Carousel.tokens';\nimport { base as sizeCSS } from './variations/_size/base';\nimport { base as viewCSS } from './variations/_view/base';\nimport { base, CarouselWrapper, CarouselTrack, ControlsWrapper, IconButton } from './Carousel.styles';\nimport { CarouselNewProps } from './Carousel.types';\nimport { useCarousel } from './hooks/useCarousel';\nimport { Dots } from './ui';\n\nconst VISIBLE_DOTS_DEFAULT = 10;\nconst DOTS_CENTERED_DEFAULT = false;\n\n/**\n * Компонент для создания списков с прокруткой.\n */\nexport const carouselNewRoot = (Root: RootProps<HTMLDivElement, CarouselNewProps>) =>\n forwardRef<HTMLDivElement, CarouselNewProps>(\n (\n {\n view,\n size,\n scrollAlign = 'start',\n children,\n controlArrowsDisabled = false,\n paginationOptions,\n gap = '20px',\n className,\n style,\n },\n ref,\n ) => {\n const [index, setIndex] = useState(0);\n\n const slidesAmount = Children.count(children);\n\n const handleClickLeft = () => {\n setIndex(Math.max(0, index - 1));\n };\n\n const handleClickRight = () => {\n setIndex(Math.min(slidesAmount - 1, index + 1));\n };\n\n const { scrollRef, trackRef } = useCarousel({\n index,\n scrollAlign,\n });\n\n useDisableScroll(scrollRef);\n\n return (\n <Root className={className} style={style} size={size} view={view} ref={ref}>\n <ControlsWrapper>\n {index !== 0 && !controlArrowsDisabled && (\n <IconButton className={classes.leftControlButton} onClick={handleClickLeft}>\n <IconDisclosureLeft size=\"m\" color=\"inherit\" />\n </IconButton>\n )}\n\n <CarouselWrapper ref={scrollRef}>\n <CarouselTrack ref={trackRef} gap={gap}>\n {children}\n </CarouselTrack>\n </CarouselWrapper>\n\n {index !== slidesAmount - 1 && !controlArrowsDisabled && (\n <IconButton className={classes.rightControlButton} onClick={handleClickRight}>\n <IconDisclosureRight size=\"m\" color=\"inherit\" />\n </IconButton>\n )}\n </ControlsWrapper>\n\n {!paginationOptions?.disabled && (\n <Dots\n index={index}\n onChange={setIndex}\n visibleCount={paginationOptions?.visibleDots || VISIBLE_DOTS_DEFAULT}\n count={slidesAmount}\n centered={paginationOptions?.centered || DOTS_CENTERED_DEFAULT}\n />\n )}\n </Root>\n );\n },\n );\n\nexport const carouselNewConfig = {\n name: 'Carousel',\n tag: 'div',\n layout: carouselNewRoot,\n base,\n variations: {\n view: {\n css: viewCSS,\n },\n size: {\n css: sizeCSS,\n },\n },\n defaults: {\n view: 'default',\n size: 's',\n },\n};\n"],"names":["VISIBLE_DOTS_DEFAULT","DOTS_CENTERED_DEFAULT","carouselNewRoot","Root","forwardRef","_ref","ref","view","size","_ref$scrollAlign","scrollAlign","children","_ref$controlArrowsDis","controlArrowsDisabled","paginationOptions","_ref$gap","gap","className","style","_useState","useState","_useState2","_slicedToArray","index","setIndex","slidesAmount","Children","count","handleClickLeft","Math","max","handleClickRight","min","_useCarousel","useCarousel","scrollRef","trackRef","useDisableScroll","React","createElement","ControlsWrapper","IconButton","classes","leftControlButton","onClick","_IconDisclosureLeft","IconDisclosureLeft","color","CarouselWrapper","CarouselTrack","rightControlButton","_IconDisclosureRight","IconDisclosureRight","disabled","Dots","onChange","visibleCount","visibleDots","centered","carouselNewConfig","name","tag","layout","base","variations","css","viewCSS","sizeCSS","defaults"],"mappings":"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"}
1
+ {"version":3,"file":"Carousel.js","sources":["../../../../src/components/Carousel/CarouselNew/Carousel.tsx"],"sourcesContent":["import { RootProps } from 'src/engines';\nimport React, { forwardRef, useState, Children } from 'react';\nimport { IconDisclosureLeft, IconDisclosureRight } from 'src/components/_Icon';\nimport { useDisableScroll } from 'src/hooks';\n\nimport { classes } from './Carousel.tokens';\nimport { base as sizeCSS } from './variations/_size/base';\nimport { base as viewCSS } from './variations/_view/base';\nimport { base, CarouselWrapper, CarouselTrack, ControlsWrapper, IconButton } from './Carousel.styles';\nimport { CarouselNewProps } from './Carousel.types';\nimport { useCarousel } from './hooks/useCarousel';\nimport { Dots } from './ui';\n\nconst VISIBLE_DOTS_DEFAULT = 10;\nconst DOTS_CENTERED_DEFAULT = false;\n\n/**\n * Компонент для создания списков с прокруткой.\n */\nexport const carouselNewRoot = (Root: RootProps<HTMLDivElement, CarouselNewProps>) =>\n forwardRef<HTMLDivElement, CarouselNewProps>(\n (\n {\n view,\n size,\n scrollAlign = 'start',\n children,\n controlArrowsDisabled = false,\n paginationOptions,\n gap = '20px',\n className,\n style,\n defaultIndex,\n },\n ref,\n ) => {\n const slidesAmount = Children.count(children);\n\n const [index, setIndex] = useState(\n defaultIndex && defaultIndex >= 0 ? Math.min(slidesAmount - 1, defaultIndex) : 0,\n );\n\n const handleClickLeft = () => {\n setIndex(Math.max(0, index - 1));\n };\n\n const handleClickRight = () => {\n setIndex(Math.min(slidesAmount - 1, index + 1));\n };\n\n const { scrollRef, trackRef } = useCarousel({\n index,\n scrollAlign,\n });\n\n useDisableScroll(scrollRef);\n\n return (\n <Root className={className} style={style} size={size} view={view} ref={ref}>\n <ControlsWrapper>\n {index !== 0 && !controlArrowsDisabled && (\n <IconButton className={classes.leftControlButton} onClick={handleClickLeft}>\n <IconDisclosureLeft size=\"m\" color=\"inherit\" />\n </IconButton>\n )}\n\n <CarouselWrapper ref={scrollRef}>\n <CarouselTrack ref={trackRef} gap={gap}>\n {children}\n </CarouselTrack>\n </CarouselWrapper>\n\n {index !== slidesAmount - 1 && !controlArrowsDisabled && (\n <IconButton className={classes.rightControlButton} onClick={handleClickRight}>\n <IconDisclosureRight size=\"m\" color=\"inherit\" />\n </IconButton>\n )}\n </ControlsWrapper>\n\n {!paginationOptions?.disabled && (\n <Dots\n index={index}\n onChange={setIndex}\n visibleCount={paginationOptions?.visibleDots || VISIBLE_DOTS_DEFAULT}\n count={slidesAmount}\n centered={paginationOptions?.centered || DOTS_CENTERED_DEFAULT}\n />\n )}\n </Root>\n );\n },\n );\n\nexport const carouselNewConfig = {\n name: 'Carousel',\n tag: 'div',\n layout: carouselNewRoot,\n base,\n variations: {\n view: {\n css: viewCSS,\n },\n size: {\n css: sizeCSS,\n },\n },\n defaults: {\n view: 'default',\n size: 's',\n },\n};\n"],"names":["VISIBLE_DOTS_DEFAULT","DOTS_CENTERED_DEFAULT","carouselNewRoot","Root","forwardRef","_ref","ref","view","size","_ref$scrollAlign","scrollAlign","children","_ref$controlArrowsDis","controlArrowsDisabled","paginationOptions","_ref$gap","gap","className","style","defaultIndex","slidesAmount","Children","count","_useState","useState","Math","min","_useState2","_slicedToArray","index","setIndex","handleClickLeft","max","handleClickRight","_useCarousel","useCarousel","scrollRef","trackRef","useDisableScroll","React","createElement","ControlsWrapper","IconButton","classes","leftControlButton","onClick","_IconDisclosureLeft","IconDisclosureLeft","color","CarouselWrapper","CarouselTrack","rightControlButton","_IconDisclosureRight","IconDisclosureRight","disabled","Dots","onChange","visibleCount","visibleDots","centered","carouselNewConfig","name","tag","layout","base","variations","css","viewCSS","sizeCSS","defaults"],"mappings":"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"}
@@ -41,6 +41,7 @@ var useCarousel = function useCarousel(_ref2) {
41
41
  scrollAlign = _ref2.scrollAlign;
42
42
  var scrollRef = useRef(null);
43
43
  var trackRef = useRef(null);
44
+ var isFirstRender = useRef(true);
44
45
 
45
46
  // Прокрутка до нужной позиции индекса, если индекс изменился.
46
47
  useEffect(function () {
@@ -57,9 +58,13 @@ var useCarousel = function useCarousel(_ref2) {
57
58
  scrollAlign: scrollAlign
58
59
  });
59
60
  scrollRef.current.scrollTo({
60
- left: pos
61
+ left: pos,
62
+ behavior: isFirstRender.current ? 'instant' : 'smooth'
61
63
  });
62
64
  }
65
+ if (isFirstRender.current) {
66
+ isFirstRender.current = false;
67
+ }
63
68
  }, [index]);
64
69
  return {
65
70
  scrollRef: scrollRef,
@@ -1 +1 @@
1
- {"version":3,"file":"useCarousel.js","sources":["../../../../../src/components/Carousel/CarouselNew/hooks/useCarousel.tsx"],"sourcesContent":["import { useEffect, useRef, RefObject } from 'react';\n\nimport { CarouselNewProps as CarouselProps } from '../Carousel.types';\n\n/**\n * Подсчет отступа для скролла до переданного индекса.\n */\nexport const getCalculatedPos = ({\n scrollRef,\n trackRef,\n itemsCollection,\n index,\n scrollAlign,\n}: {\n scrollRef: RefObject<HTMLDivElement>;\n trackRef: RefObject<HTMLDivElement>;\n itemsCollection: HTMLCollection;\n index: number;\n scrollAlign: CarouselProps['scrollAlign'];\n}): number => {\n const item = itemsCollection.item(index);\n\n if (!item || !trackRef.current || !scrollRef.current) {\n return 0;\n }\n\n const itemRect = item.getBoundingClientRect();\n const trackRect = trackRef.current.getBoundingClientRect();\n const scrollRect = scrollRef.current.getBoundingClientRect();\n\n const left = itemRect.left - trackRect.left + trackRef.current.scrollLeft;\n\n switch (scrollAlign) {\n case 'start': {\n return left;\n }\n case 'center': {\n return left - scrollRect.width / 2 + itemRect.width / 2;\n }\n case 'end': {\n return left - scrollRect.width + itemRect.width;\n }\n default: {\n return 0;\n }\n }\n};\n\ntype UseCarouselOptions = Pick<CarouselProps, 'scrollAlign'> & {\n index: number;\n};\n\ntype UseCarouselHookResult = {\n scrollRef: RefObject<HTMLDivElement>;\n trackRef: RefObject<HTMLDivElement>;\n};\n\nexport const useCarousel = ({ index, scrollAlign }: UseCarouselOptions): UseCarouselHookResult => {\n const scrollRef = useRef<HTMLDivElement>(null);\n const trackRef = useRef<HTMLDivElement>(null);\n\n // Прокрутка до нужной позиции индекса, если индекс изменился.\n useEffect(() => {\n if (!scrollRef.current || !trackRef.current) {\n return;\n }\n\n const itemsCollection = trackRef.current.children;\n\n if (itemsCollection && itemsCollection.length > 0) {\n const pos = getCalculatedPos({\n scrollRef,\n trackRef,\n itemsCollection,\n index,\n scrollAlign,\n });\n\n scrollRef.current.scrollTo({ left: pos });\n }\n }, [index]);\n\n return {\n scrollRef,\n trackRef,\n };\n};\n"],"names":["getCalculatedPos","_ref","scrollRef","trackRef","itemsCollection","index","scrollAlign","item","current","itemRect","getBoundingClientRect","trackRect","scrollRect","left","scrollLeft","width","useCarousel","_ref2","useRef","useEffect","children","length","pos","scrollTo"],"mappings":"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"}
1
+ {"version":3,"file":"useCarousel.js","sources":["../../../../../src/components/Carousel/CarouselNew/hooks/useCarousel.tsx"],"sourcesContent":["import { useEffect, useRef, RefObject } from 'react';\n\nimport { CarouselNewProps as CarouselProps } from '../Carousel.types';\n\n/**\n * Подсчет отступа для скролла до переданного индекса.\n */\nexport const getCalculatedPos = ({\n scrollRef,\n trackRef,\n itemsCollection,\n index,\n scrollAlign,\n}: {\n scrollRef: RefObject<HTMLDivElement>;\n trackRef: RefObject<HTMLDivElement>;\n itemsCollection: HTMLCollection;\n index: number;\n scrollAlign: CarouselProps['scrollAlign'];\n}): number => {\n const item = itemsCollection.item(index);\n\n if (!item || !trackRef.current || !scrollRef.current) {\n return 0;\n }\n\n const itemRect = item.getBoundingClientRect();\n const trackRect = trackRef.current.getBoundingClientRect();\n const scrollRect = scrollRef.current.getBoundingClientRect();\n\n const left = itemRect.left - trackRect.left + trackRef.current.scrollLeft;\n\n switch (scrollAlign) {\n case 'start': {\n return left;\n }\n case 'center': {\n return left - scrollRect.width / 2 + itemRect.width / 2;\n }\n case 'end': {\n return left - scrollRect.width + itemRect.width;\n }\n default: {\n return 0;\n }\n }\n};\n\ntype UseCarouselOptions = Pick<CarouselProps, 'scrollAlign'> & {\n index: number;\n};\n\ntype UseCarouselHookResult = {\n scrollRef: RefObject<HTMLDivElement>;\n trackRef: RefObject<HTMLDivElement>;\n};\n\nexport const useCarousel = ({ index, scrollAlign }: UseCarouselOptions): UseCarouselHookResult => {\n const scrollRef = useRef<HTMLDivElement>(null);\n const trackRef = useRef<HTMLDivElement>(null);\n const isFirstRender = useRef(true);\n\n // Прокрутка до нужной позиции индекса, если индекс изменился.\n useEffect(() => {\n if (!scrollRef.current || !trackRef.current) {\n return;\n }\n\n const itemsCollection = trackRef.current.children;\n\n if (itemsCollection && itemsCollection.length > 0) {\n const pos = getCalculatedPos({\n scrollRef,\n trackRef,\n itemsCollection,\n index,\n scrollAlign,\n });\n\n scrollRef.current.scrollTo({ left: pos, behavior: isFirstRender.current ? 'instant' : 'smooth' });\n }\n\n if (isFirstRender.current) {\n isFirstRender.current = false;\n }\n }, [index]);\n\n return {\n scrollRef,\n trackRef,\n };\n};\n"],"names":["getCalculatedPos","_ref","scrollRef","trackRef","itemsCollection","index","scrollAlign","item","current","itemRect","getBoundingClientRect","trackRect","scrollRect","left","scrollLeft","width","useCarousel","_ref2","useRef","isFirstRender","useEffect","children","length","pos","scrollTo","behavior"],"mappings":";;AAIA;AACA;AACA;IACaA,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAAC,IAAA,EAYf;AAAA,EAAA,IAXVC,SAAS,GAAAD,IAAA,CAATC,SAAS;IACTC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IACRC,eAAe,GAAAH,IAAA,CAAfG,eAAe;IACfC,KAAK,GAAAJ,IAAA,CAALI,KAAK;IACLC,WAAW,GAAAL,IAAA,CAAXK,WAAW,CAAA;AAQX,EAAA,IAAMC,IAAI,GAAGH,eAAe,CAACG,IAAI,CAACF,KAAK,CAAC,CAAA;AAExC,EAAA,IAAI,CAACE,IAAI,IAAI,CAACJ,QAAQ,CAACK,OAAO,IAAI,CAACN,SAAS,CAACM,OAAO,EAAE;AAClD,IAAA,OAAO,CAAC,CAAA;AACZ,GAAA;AAEA,EAAA,IAAMC,QAAQ,GAAGF,IAAI,CAACG,qBAAqB,EAAE,CAAA;EAC7C,IAAMC,SAAS,GAAGR,QAAQ,CAACK,OAAO,CAACE,qBAAqB,EAAE,CAAA;EAC1D,IAAME,UAAU,GAAGV,SAAS,CAACM,OAAO,CAACE,qBAAqB,EAAE,CAAA;AAE5D,EAAA,IAAMG,IAAI,GAAGJ,QAAQ,CAACI,IAAI,GAAGF,SAAS,CAACE,IAAI,GAAGV,QAAQ,CAACK,OAAO,CAACM,UAAU,CAAA;AAEzE,EAAA,QAAQR,WAAW;AACf,IAAA,KAAK,OAAO;AAAE,MAAA;AACV,QAAA,OAAOO,IAAI,CAAA;AACf,OAAA;AACA,IAAA,KAAK,QAAQ;AAAE,MAAA;AACX,QAAA,OAAOA,IAAI,GAAGD,UAAU,CAACG,KAAK,GAAG,CAAC,GAAGN,QAAQ,CAACM,KAAK,GAAG,CAAC,CAAA;AAC3D,OAAA;AACA,IAAA,KAAK,KAAK;AAAE,MAAA;QACR,OAAOF,IAAI,GAAGD,UAAU,CAACG,KAAK,GAAGN,QAAQ,CAACM,KAAK,CAAA;AACnD,OAAA;AACA,IAAA;AAAS,MAAA;AACL,QAAA,OAAO,CAAC,CAAA;AACZ,OAAA;AACJ,GAAA;AACJ,EAAC;IAWYC,WAAW,GAAG,SAAdA,WAAWA,CAAAC,KAAA,EAA0E;AAAA,EAAA,IAApEZ,KAAK,GAAAY,KAAA,CAALZ,KAAK;IAAEC,WAAW,GAAAW,KAAA,CAAXX,WAAW,CAAA;AAC5C,EAAA,IAAMJ,SAAS,GAAGgB,MAAM,CAAiB,IAAI,CAAC,CAAA;AAC9C,EAAA,IAAMf,QAAQ,GAAGe,MAAM,CAAiB,IAAI,CAAC,CAAA;AAC7C,EAAA,IAAMC,aAAa,GAAGD,MAAM,CAAC,IAAI,CAAC,CAAA;;AAElC;AACAE,EAAAA,SAAS,CAAC,YAAM;IACZ,IAAI,CAAClB,SAAS,CAACM,OAAO,IAAI,CAACL,QAAQ,CAACK,OAAO,EAAE;AACzC,MAAA,OAAA;AACJ,KAAA;AAEA,IAAA,IAAMJ,eAAe,GAAGD,QAAQ,CAACK,OAAO,CAACa,QAAQ,CAAA;AAEjD,IAAA,IAAIjB,eAAe,IAAIA,eAAe,CAACkB,MAAM,GAAG,CAAC,EAAE;MAC/C,IAAMC,GAAG,GAAGvB,gBAAgB,CAAC;AACzBE,QAAAA,SAAS,EAATA,SAAS;AACTC,QAAAA,QAAQ,EAARA,QAAQ;AACRC,QAAAA,eAAe,EAAfA,eAAe;AACfC,QAAAA,KAAK,EAALA,KAAK;AACLC,QAAAA,WAAW,EAAXA,WAAAA;AACJ,OAAC,CAAC,CAAA;AAEFJ,MAAAA,SAAS,CAACM,OAAO,CAACgB,QAAQ,CAAC;AAAEX,QAAAA,IAAI,EAAEU,GAAG;AAAEE,QAAAA,QAAQ,EAAEN,aAAa,CAACX,OAAO,GAAG,SAAS,GAAG,QAAA;AAAS,OAAC,CAAC,CAAA;AACrG,KAAA;IAEA,IAAIW,aAAa,CAACX,OAAO,EAAE;MACvBW,aAAa,CAACX,OAAO,GAAG,KAAK,CAAA;AACjC,KAAA;AACJ,GAAC,EAAE,CAACH,KAAK,CAAC,CAAC,CAAA;EAEX,OAAO;AACHH,IAAAA,SAAS,EAATA,SAAS;AACTC,IAAAA,QAAQ,EAARA,QAAAA;GACH,CAAA;AACL;;;;"}