intelicoreact 2.0.16 → 2.0.18

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 (99) hide show
  1. package/dist/css/accordion.css +1 -1
  2. package/dist/css/advanced-status.css +1 -1
  3. package/dist/css/datepicker.css +1 -1
  4. package/dist/css/dropdown-live-search.css +1 -1
  5. package/dist/css/dropdown.css +1 -1
  6. package/dist/css/input-date-range.css +1 -1
  7. package/dist/css/main-menu.css +1 -1
  8. package/dist/css/switcher-radio.css +1 -1
  9. package/dist/css/switcher-range-list.css +1 -1
  10. package/dist/css/switcher-tags-dropdown.css +1 -1
  11. package/dist/css/switcher-textarea.css +1 -1
  12. package/dist/css/table.css +1 -1
  13. package/dist/css/tags-dropdown.css +1 -1
  14. package/dist/css/wizard-stepper.css +1 -1
  15. package/dist/es/_virtual/_rolldown/runtime.js +27 -0
  16. package/dist/es/charts.js +4 -0
  17. package/dist/es/classes.js +4 -0
  18. package/dist/es/form.js +99 -0
  19. package/dist/es/hooks.js +32 -0
  20. package/dist/es/icons.js +10 -0
  21. package/dist/es/icons.js.map +1 -0
  22. package/dist/es/index.js +71 -0
  23. package/dist/es/layout.js +3 -0
  24. package/dist/es/presets.js +6 -0
  25. package/dist/es/router-ui.js +8 -0
  26. package/dist/es/sdk.js +1 -0
  27. package/dist/es/styles/base.css +1 -0
  28. package/dist/es/types/index.js +2 -0
  29. package/dist/es/ui.js +42 -0
  30. package/dist/es/utils.js +6 -0
  31. package/dist/intelicoreact.css +1 -1
  32. package/dist/scss/_mixins.scss +2 -2
  33. package/dist/scss/_vars.scss +1 -1
  34. package/dist/scss/main.scss +4 -1
  35. package/package.json +47 -64
  36. package/charts/package.json +0 -5
  37. package/classes/package.json +0 -5
  38. package/dist/charts.cjs +0 -927
  39. package/dist/charts.cjs.map +0 -7
  40. package/dist/charts.js +0 -911
  41. package/dist/charts.js.map +0 -7
  42. package/dist/classes.cjs +0 -1858
  43. package/dist/classes.cjs.map +0 -7
  44. package/dist/classes.js +0 -1836
  45. package/dist/classes.js.map +0 -7
  46. package/dist/form.cjs +0 -15167
  47. package/dist/form.cjs.map +0 -7
  48. package/dist/form.js +0 -15182
  49. package/dist/form.js.map +0 -7
  50. package/dist/hooks.cjs +0 -2330
  51. package/dist/hooks.cjs.map +0 -7
  52. package/dist/hooks.js +0 -2298
  53. package/dist/hooks.js.map +0 -7
  54. package/dist/icons.cjs +0 -1807
  55. package/dist/icons.cjs.map +0 -7
  56. package/dist/icons.js +0 -1785
  57. package/dist/icons.js.map +0 -7
  58. package/dist/index.cjs +0 -22917
  59. package/dist/index.cjs.map +0 -7
  60. package/dist/index.js +0 -22938
  61. package/dist/index.js.map +0 -7
  62. package/dist/layout.cjs +0 -458
  63. package/dist/layout.cjs.map +0 -7
  64. package/dist/layout.js +0 -426
  65. package/dist/layout.js.map +0 -7
  66. package/dist/presets.cjs +0 -262
  67. package/dist/presets.cjs.map +0 -7
  68. package/dist/presets.js +0 -240
  69. package/dist/presets.js.map +0 -7
  70. package/dist/router-ui.cjs +0 -989
  71. package/dist/router-ui.cjs.map +0 -7
  72. package/dist/router-ui.js +0 -957
  73. package/dist/router-ui.js.map +0 -7
  74. package/dist/sdk.cjs +0 -451
  75. package/dist/sdk.cjs.map +0 -7
  76. package/dist/sdk.js +0 -429
  77. package/dist/sdk.js.map +0 -7
  78. package/dist/types/index.cjs +0 -18
  79. package/dist/types/index.cjs.map +0 -7
  80. package/dist/types/index.js +0 -1
  81. package/dist/types/index.js.map +0 -7
  82. package/dist/ui.cjs +0 -4090
  83. package/dist/ui.cjs.map +0 -7
  84. package/dist/ui.js +0 -4064
  85. package/dist/ui.js.map +0 -7
  86. package/dist/utils.cjs +0 -653
  87. package/dist/utils.cjs.map +0 -7
  88. package/dist/utils.js +0 -621
  89. package/dist/utils.js.map +0 -7
  90. package/form/package.json +0 -5
  91. package/hooks/package.json +0 -5
  92. package/icons/package.json +0 -5
  93. package/layout/package.json +0 -5
  94. package/presets/package.json +0 -5
  95. package/router-ui/package.json +0 -5
  96. package/sdk/package.json +0 -5
  97. package/types/package.json +0 -5
  98. package/ui/package.json +0 -5
  99. package/utils/package.json +0 -5
package/dist/ui.js DELETED
@@ -1,4064 +0,0 @@
1
- // src/Atomic/UI/AccordionTable/AccordionTable.js
2
- import React2, { useEffect as useEffect2, useState as useState2 } from "react";
3
- import cn2 from "classnames";
4
- import { ArrowDown, ArrowUp, ChevronDown, Tag } from "react-feather";
5
-
6
- // src/Atomic/UI/MonoAccordion/MonoAccordion.js
7
- import React, { useEffect, useRef, useState } from "react";
8
- import cn from "classnames";
9
- import { jsx, jsxs } from "react/jsx-runtime";
10
- var RC = "mono-accordion";
11
- var MonoAccordion = ({
12
- titleJSX,
13
- icon,
14
- children,
15
- isOpen,
16
- onClick,
17
- className,
18
- disabled,
19
- testId = "mono-accordion",
20
- datasetProp = {}
21
- }) => {
22
- const [maxHeight, setMaxHeight] = useState();
23
- const titleRef = useRef();
24
- const containerRef = useRef();
25
- const setHeight = (value) => {
26
- if (value !== void 0) setMaxHeight((state) => `${value}px`);
27
- else
28
- setMaxHeight(
29
- (state) => `${Array.from(containerRef.current?.childNodes)?.reduce?.((acc, el) => acc + el.offsetHeight, 0)}px`
30
- );
31
- };
32
- const handleClick = (e) => {
33
- if (!Array.from(titleRef.current.childNodes).some(
34
- (el) => el.contains(e.target)
35
- )) {
36
- onClick(e);
37
- e?.preventDefault();
38
- e?.stopPropagation();
39
- } else return e;
40
- };
41
- useEffect(() => {
42
- if (!isOpen) setHeight(0);
43
- else setHeight();
44
- }, [isOpen, children]);
45
- return /* @__PURE__ */ jsxs(
46
- "div",
47
- {
48
- ...datasetProp,
49
- "data-testid": testId,
50
- className: cn(RC, className, {
51
- [`${RC}_is-open`]: isOpen,
52
- [`${RC}_disabled`]: disabled
53
- }),
54
- children: [
55
- /* @__PURE__ */ jsxs(
56
- "div",
57
- {
58
- className: `${RC}__head`,
59
- onClick: handleClick,
60
- children: [
61
- /* @__PURE__ */ jsx("div", { ref: titleRef, className: `${RC}__tile-container`, children: titleJSX }),
62
- /* @__PURE__ */ jsx("span", { className: `${RC}__icon-container`, children: icon })
63
- ]
64
- }
65
- ),
66
- /* @__PURE__ */ jsx(
67
- "div",
68
- {
69
- ref: containerRef,
70
- style: { maxHeight },
71
- className: cn(`${RC}__container`),
72
- children: /* @__PURE__ */ jsx("div", { className: `${RC}__content-wrapper`, children })
73
- }
74
- )
75
- ]
76
- }
77
- );
78
- };
79
- var MonoAccordion_default = MonoAccordion;
80
-
81
- // src/Atomic/UI/AccordionTable/AccordionTable.js
82
- import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
83
- var AccordionTable = ({
84
- className,
85
- header,
86
- items,
87
- onChange,
88
- testId,
89
- onSort = () => {
90
- },
91
- sortParams
92
- }) => {
93
- const [accordions, setAccordions] = useState2(items);
94
- const sortedColClassName = (item) => cn2(
95
- "accordion-table__header-item",
96
- item.className,
97
- {
98
- "accordion-table--sorted-col": sortParams && sortParams.key === item.key
99
- },
100
- { "accordion-table__header-item-sortable": !item.noSort }
101
- );
102
- const handle = {
103
- accordionChange: (key, e) => {
104
- const newArr = accordions?.map((item) => {
105
- if (item.key === key) {
106
- return {
107
- ...item,
108
- isOpen: !item.isOpen
109
- };
110
- }
111
- return item;
112
- });
113
- const isArrowSvg = e?.target?.tagName === "svg";
114
- const isAccordionElement = e.target.className?.includes?.("accordion-table");
115
- if (isAccordionElement || isArrowSvg) {
116
- onChange(newArr);
117
- setAccordions(newArr);
118
- }
119
- },
120
- setSort: (key) => {
121
- let newSorting;
122
- if (key !== sortParams.key) newSorting = { key, direction: "DESC" };
123
- else {
124
- newSorting = {
125
- key,
126
- direction: sortParams.direction === "ASC" ? "DESC" : "ASC"
127
- };
128
- }
129
- onSort(newSorting);
130
- }
131
- };
132
- const getHeaderItem = (key) => {
133
- return header?.find((item) => item.key === key);
134
- };
135
- const renderTd = (tr) => {
136
- return Object.entries(tr)?.map(([key, value]) => {
137
- return key === "promoDetails" || key === "disclosure" ? null : /* @__PURE__ */ jsx2(
138
- "div",
139
- {
140
- style: { flexBasis: `${getHeaderItem(key)?.width}%` },
141
- className: cn2(
142
- "accordion-table__td",
143
- `accordion-table__td--${key}`,
144
- getHeaderItem(key)?.className
145
- ),
146
- children: /* @__PURE__ */ jsx2(
147
- "p",
148
- {
149
- className: "accordion-table__statistics-td-value",
150
- title: typeof value !== "object" ? value : value.value,
151
- children: typeof value !== "object" ? value : value.value
152
- }
153
- )
154
- },
155
- key
156
- );
157
- });
158
- };
159
- const renderTr = (rows) => {
160
- return rows?.map((row, index) => {
161
- return /* @__PURE__ */ jsxs2(
162
- "div",
163
- {
164
- className: cn2(
165
- "accordion-table__tr",
166
- {
167
- "accordion-table__tr-with-promo": row.promoDetails || row.cols?.promoDetails
168
- },
169
- row.className
170
- ),
171
- children: [
172
- /* @__PURE__ */ jsx2("div", { className: "df w100", children: renderTd(row.cols || row) }),
173
- row.promoDetails || row.cols?.promoDetails ? /* @__PURE__ */ jsx2("div", { className: "accordion-table__tr-promo-wrapper", children: /* @__PURE__ */ jsxs2("div", { className: "accordion-table__tr-promo", children: [
174
- /* @__PURE__ */ jsx2(Tag, { className: "tr-promo-icon", width: 16, height: 16 }),
175
- /* @__PURE__ */ jsx2("span", { className: "tr-promo-label", children: "PROMOTION" }),
176
- row.promoDetails || row.cols?.promoDetails
177
- ] }) }) : null,
178
- row.disclosure || row.cols?.disclosure ? /* @__PURE__ */ jsx2("div", { className: "accordion-table__tr-promo-wrapper", children: /* @__PURE__ */ jsx2("div", { className: "accordion-table__tr-promo accordion-table__tr-promo-disclosure", children: row.disclosure || row.cols?.disclosure }) }) : null
179
- ]
180
- },
181
- index
182
- );
183
- });
184
- };
185
- const defineAccordionTitle = (row) => {
186
- return /* @__PURE__ */ jsxs2(
187
- "div",
188
- {
189
- onClick: (e) => handle.accordionChange(row.key, e),
190
- className: "accordion-table__accordion-label-box",
191
- children: [
192
- /* @__PURE__ */ jsxs2("div", { className: "accordion-table__accordion-label-wrapper j4", children: [
193
- /* @__PURE__ */ jsx2(
194
- ChevronDown,
195
- {
196
- width: 8,
197
- height: 4,
198
- className: cn2("accordion-label-box__icon", {
199
- "accordion-label-box__icon--open": row.isOpen
200
- })
201
- }
202
- ),
203
- /* @__PURE__ */ jsx2("span", { className: "accordion-label-box__label", children: row.label }),
204
- row.statistics && /* @__PURE__ */ jsx2("div", { className: cn2("accordion-table__tr", row.className), children: Object.entries(row.statistics).map(([key, value]) => {
205
- return /* @__PURE__ */ jsx2(
206
- "div",
207
- {
208
- style: { width: `${getHeaderItem(key)?.width}%` },
209
- className: cn2(
210
- "accordion-table__statistics-td",
211
- getHeaderItem(key)?.className
212
- ),
213
- children: /* @__PURE__ */ jsx2("div", { className: "accordion-table__statistics-td-value-wrapper", children: key === "status" ? /* @__PURE__ */ jsx2("div", { className: "accordion-table__statistics-td-value", children: value }) : /* @__PURE__ */ jsx2(
214
- "p",
215
- {
216
- className: "accordion-table__statistics-td-value",
217
- title: value,
218
- children: value
219
- }
220
- ) })
221
- },
222
- key
223
- );
224
- }) })
225
- ] }),
226
- row.titleContent
227
- ]
228
- }
229
- );
230
- };
231
- useEffect2(() => {
232
- setAccordions(items);
233
- }, [items]);
234
- return /* @__PURE__ */ jsxs2("div", { className: cn2("accordion-table", className), children: [
235
- /* @__PURE__ */ jsx2("div", { className: "accordion-table__header", children: header?.map((item) => {
236
- return /* @__PURE__ */ jsxs2(
237
- "div",
238
- {
239
- style: { flexBasis: `${item.width}%` },
240
- className: sortedColClassName(item),
241
- onClick: () => !item.noSort && handle.setSort(item.key),
242
- children: [
243
- sortParams && item.key === sortParams.key && sortParams.key !== "actions" && (sortParams.direction === "DESC" ? /* @__PURE__ */ jsx2(ArrowDown, { size: 16 }) : /* @__PURE__ */ jsx2(ArrowUp, { size: 16 })),
244
- item.label
245
- ]
246
- },
247
- item.key
248
- );
249
- }) }),
250
- /* @__PURE__ */ jsx2("div", { className: "accordion-table__body", children: accordions?.map((accordion) => {
251
- return /* @__PURE__ */ jsx2(
252
- MonoAccordion_default,
253
- {
254
- testId,
255
- onClick: (e) => handle.accordionChange(accordion.key, e),
256
- isOpen: accordion.isOpen,
257
- className: cn2(
258
- "accordion-table__body-accordion",
259
- {
260
- "accordion-table__body-accordion--closed": !accordion.isOpen
261
- },
262
- accordion.className
263
- ),
264
- titleJSX: defineAccordionTitle(accordion),
265
- children: accordion.children ?? renderTr(accordion.rows)
266
- },
267
- accordion.key
268
- );
269
- }) })
270
- ] });
271
- };
272
- var AccordionTable_default = AccordionTable;
273
-
274
- // src/Atomic/UI/AccordionText/AccordionText.js
275
- import { useEffect as useEffect3, useRef as useRef2, useState as useState3 } from "react";
276
- import React3 from "react";
277
- import cn3 from "classnames";
278
- import { ChevronDown as ChevronDown2, ChevronUp } from "react-feather";
279
- import { Fragment, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
280
- var defaultText = /* @__PURE__ */ jsx3(Fragment, { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat." });
281
- var AccordionText = ({
282
- isDefaultOpen = false,
283
- isOuterOpen = false,
284
- className,
285
- text = defaultText,
286
- shortText = null
287
- }) => {
288
- const bodyRef = useRef2(null);
289
- const [isOpen, setIsOpen] = useState3(isDefaultOpen);
290
- const [isNeedTrimText, setIsNeedTrimText] = useState3(false);
291
- useEffect3(() => {
292
- setIsOpen(isOuterOpen);
293
- }, [isOuterOpen]);
294
- useEffect3(() => {
295
- const checkEllipsis = () => {
296
- if (bodyRef.current) {
297
- setIsNeedTrimText(bodyRef.current.scrollWidth > bodyRef.current.clientWidth);
298
- }
299
- };
300
- const resizeObserver = new ResizeObserver(() => {
301
- checkEllipsis();
302
- });
303
- if (bodyRef.current) {
304
- resizeObserver.observe(bodyRef.current);
305
- checkEllipsis();
306
- }
307
- return () => {
308
- if (bodyRef.current) {
309
- resizeObserver.unobserve(bodyRef.current);
310
- }
311
- };
312
- }, [text]);
313
- return /* @__PURE__ */ jsxs3(
314
- "div",
315
- {
316
- className: cn3("accordion-text", className, {
317
- "accordion-text--open": isOpen
318
- }),
319
- onClick: () => setIsOpen((prevIsOpen) => !prevIsOpen),
320
- children: [
321
- /* @__PURE__ */ jsx3(
322
- "div",
323
- {
324
- className: cn3("accordion-text__body", {
325
- "accordion-text__body--trim-text": isNeedTrimText && !isOpen
326
- }),
327
- ref: bodyRef,
328
- children: shortText ? isOpen ? text : shortText : text
329
- }
330
- ),
331
- /* @__PURE__ */ jsx3("div", { className: "accordion-text__toggle", children: isOpen ? /* @__PURE__ */ jsx3(ChevronUp, {}) : /* @__PURE__ */ jsx3(ChevronDown2, {}) })
332
- ]
333
- }
334
- );
335
- };
336
- var AccordionText_default = AccordionText;
337
-
338
- // src/Atomic/UI/AdvancedTag/AdvancedTags.tsx
339
- import cn7 from "classnames";
340
- import { useState as useState6 } from "react";
341
-
342
- // src/Atomic/UI/Tag/Tag.tsx
343
- import cn5 from "classnames";
344
- import { useEffect as useEffect4, useMemo, useRef as useRef3, useState as useState4 } from "react";
345
- import { createPortal } from "react-dom";
346
- import { AlertTriangle, X } from "react-feather";
347
-
348
- // src/Atomic/Layout/Spinner/Spinner.tsx
349
- import cn4 from "classnames";
350
- import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
351
- var CN = "loader-box";
352
- var Spinner = ({ size = null, className, testId = CN }) => {
353
- return /* @__PURE__ */ jsx4(
354
- "div",
355
- {
356
- role: "status",
357
- "aria-live": "polite",
358
- "aria-busy": "true",
359
- "data-testid": testId,
360
- className: cn4(
361
- CN,
362
- {
363
- j5: size !== "small",
364
- j8: size === "small"
365
- },
366
- className
367
- ),
368
- children: /* @__PURE__ */ jsxs4("div", { className: cn4("lds-ring", { [`lds-ring_${size}`]: size }), children: [
369
- /* @__PURE__ */ jsx4("div", {}),
370
- /* @__PURE__ */ jsx4("div", {}),
371
- /* @__PURE__ */ jsx4("div", {}),
372
- /* @__PURE__ */ jsx4("div", {})
373
- ] })
374
- }
375
- );
376
- };
377
- var Spinner_default = Spinner;
378
-
379
- // src/Atomic/Layout/Spinner/index.ts
380
- var Spinner_default2 = Spinner_default;
381
-
382
- // src/Atomic/UI/Tag/Tag.tsx
383
- import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
384
- var CN2 = "tag";
385
- function defaultOnClick() {
386
- }
387
- var Tag2 = ({
388
- value,
389
- className,
390
- style,
391
- label,
392
- warning,
393
- isWarningHint = true,
394
- removeItem,
395
- name,
396
- isPopup,
397
- popupInfoContent,
398
- popupClassName,
399
- id,
400
- isUseInTable,
401
- isNoDismiss = true,
402
- onClick = defaultOnClick,
403
- testId = CN2
404
- }) => {
405
- const tagRef = useRef3(null);
406
- const [isTagHover, setIsTagHover] = useState4(false);
407
- const [isTagPopupOpened, setIsTagPopupOpened] = useState4(false);
408
- const { x, y, height, width } = tagRef?.current?.getBoundingClientRect() ?? {};
409
- const { scrollY } = window;
410
- const tagPopupStyles = useMemo(() => {
411
- if (!isTagPopupOpened || !tagRef?.current) return {};
412
- const { x: x2, y: y2, height: height2, width: width2 } = tagRef?.current?.getBoundingClientRect();
413
- return {
414
- left: `${x2}px`,
415
- top: `${y2 + scrollY}px`,
416
- transform: `translate(calc(-1 * calc(100% - ${width2 / 2 + 22}px)), ${height2 + 10}px)`
417
- };
418
- }, [isTagPopupOpened, x, y, width, height, scrollY]);
419
- const tagLabelStyle = useMemo(() => {
420
- const styleObj = {};
421
- const bgColor = style?.backgroundColor ?? style?.background;
422
- if (bgColor === "#242424") {
423
- styleObj.color = "#fff";
424
- }
425
- return styleObj;
426
- }, [style]);
427
- const handle = {
428
- onTagClick: (event) => {
429
- if (isUseInTable) {
430
- event.stopPropagation();
431
- }
432
- if (isPopup) {
433
- setIsTagPopupOpened(!isTagPopupOpened);
434
- }
435
- onClick(id, event);
436
- }
437
- };
438
- const handleClickOutside = () => {
439
- setIsTagPopupOpened(false);
440
- };
441
- useEffect4(() => {
442
- document.addEventListener("click", handleClickOutside, true);
443
- return () => {
444
- document.removeEventListener("click", handleClickOutside, true);
445
- };
446
- }, []);
447
- useEffect4(() => {
448
- const handleScroll = () => {
449
- setIsTagPopupOpened(false);
450
- };
451
- window.addEventListener("scroll", handleScroll, true);
452
- return () => {
453
- window.removeEventListener("scroll", handleScroll, true);
454
- };
455
- }, []);
456
- return /* @__PURE__ */ jsxs5(
457
- "div",
458
- {
459
- onMouseEnter: () => setIsTagHover(true),
460
- onMouseLeave: () => setIsTagHover(false),
461
- "data-testid": testId,
462
- role: "listitem",
463
- "aria-label": `Tag: ${label || name}`,
464
- className: cn5(CN2, className, { "tag-warn": warning }),
465
- style: style ?? {},
466
- onClick: (event) => handle.onTagClick(event),
467
- ref: tagRef,
468
- children: [
469
- warning && typeof warning === "string" && /* @__PURE__ */ jsx5(AlertTriangle, { className: "advanced-tags--warning-icon mr5", "aria-label": "Warning" }),
470
- warning && typeof warning === "string" && isTagHover && isWarningHint && /* @__PURE__ */ jsx5("div", { className: "tag__warn-hint", role: "tooltip", children: warning }),
471
- /* @__PURE__ */ jsx5("span", { className: "tag__label", style: tagLabelStyle, children: label || name }),
472
- removeItem && !isNoDismiss && /* @__PURE__ */ jsx5(
473
- "button",
474
- {
475
- type: "button",
476
- onClick: (e) => {
477
- e?.preventDefault();
478
- e?.stopPropagation();
479
- removeItem(value);
480
- },
481
- "aria-label": `Remove ${label || name}`,
482
- className: "tag__button",
483
- children: /* @__PURE__ */ jsx5(X, { className: "color--text" })
484
- }
485
- ),
486
- isTagPopupOpened && createPortal(
487
- /* @__PURE__ */ jsx5("div", { id: `tagPopup${value}`, className: cn5("tag__popup", popupClassName), style: tagPopupStyles, children: !popupInfoContent ? /* @__PURE__ */ jsx5(Spinner_default2, { size: "small" }) : popupInfoContent }),
488
- document.getElementById("root")
489
- )
490
- ]
491
- }
492
- );
493
- };
494
- var Tag_default = Tag2;
495
-
496
- // src/Atomic/UI/AdvancedTag/AdvTag.tsx
497
- import cn6 from "classnames";
498
- import { useEffect as useEffect5, useRef as useRef4, useState as useState5 } from "react";
499
- import { AlertTriangle as AlertTriangle2 } from "react-feather";
500
- import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
501
- var AdvTag = ({
502
- item,
503
- className,
504
- testId = "adv-tag",
505
- toTop = true
506
- }) => {
507
- const {
508
- labelLeft,
509
- labelRight,
510
- active = 0,
511
- pause = 0,
512
- merchants,
513
- warnLeft,
514
- warnLeftMsg,
515
- warnRightMsg,
516
- isEntityAndCounter = false,
517
- entityAndCounter = {
518
- nullCounterMessage: "",
519
- title: "",
520
- counter: null
521
- },
522
- type
523
- } = item;
524
- const [isOpen, setIsOpen] = useState5(false);
525
- const [clickedWarning, setClickedWarning] = useState5("");
526
- const hintRef = useRef4(null);
527
- const activeNumberClass = cn6("strong", {
528
- "color--pause": active === 0,
529
- "color--green-haze": active > 0
530
- });
531
- const pauseNumberClass = cn6("strong", {
532
- "color--pause": pause === 0,
533
- "color--light-red": pause > 0
534
- });
535
- const isEmptyEntitys = isEntityAndCounter && (!entityAndCounter?.counter || entityAndCounter.counter === 0) || !isEntityAndCounter && (warnLeft || !merchants);
536
- const advancedTagClass = cn6("advanced-tags", {
537
- "advanced-tags--error": isEmptyEntitys
538
- }, className);
539
- const onWarningClick = (warn) => {
540
- setIsOpen(true);
541
- setClickedWarning(warn);
542
- };
543
- const handleClickOutside = (event) => {
544
- if (hintRef.current && !hintRef.current.contains(event.target)) {
545
- setIsOpen(false);
546
- }
547
- };
548
- useEffect5(() => {
549
- document.addEventListener("click", handleClickOutside, true);
550
- return () => {
551
- document.removeEventListener("click", handleClickOutside, true);
552
- };
553
- }, []);
554
- if (!item) return null;
555
- const renderClassicTag = () => /* @__PURE__ */ jsxs6("div", { "data-testid": testId, className: advancedTagClass, ref: hintRef, children: [
556
- warnLeft && /* @__PURE__ */ jsx6(
557
- "div",
558
- {
559
- "data-testid": `${testId}-left`,
560
- className: "advanced-tags--warning-icon-wrapper",
561
- onMouseEnter: () => onWarningClick("warnLeft"),
562
- onMouseLeave: () => setIsOpen(false),
563
- children: /* @__PURE__ */ jsx6(
564
- AlertTriangle2,
565
- {
566
- width: 16,
567
- height: 16,
568
- className: "advanced-tags--warning-icon mr5"
569
- }
570
- )
571
- }
572
- ),
573
- labelLeft && /* @__PURE__ */ jsx6("span", { className: "mr5", children: labelLeft }),
574
- labelRight && /* @__PURE__ */ jsx6("span", { children: labelRight }),
575
- type !== "simple" && /* @__PURE__ */ jsx6("span", { className: "ml5 mr5", children: "|" }),
576
- type !== "simple" && /* @__PURE__ */ jsxs6("div", { className: "df", children: [
577
- /* @__PURE__ */ jsx6("span", { className: activeNumberClass, children: active }),
578
- /* @__PURE__ */ jsx6("span", { className: "strong color--pause", children: "/" }),
579
- /* @__PURE__ */ jsx6("span", { className: pauseNumberClass, children: pause })
580
- ] }),
581
- type !== "simple" && /* @__PURE__ */ jsx6("span", { className: "ml5 mr5", children: "|" }),
582
- merchants ? /* @__PURE__ */ jsx6("span", { children: merchants }) : type !== "simple" && /* @__PURE__ */ jsx6(
583
- "div",
584
- {
585
- "data-testid": `${testId}-right`,
586
- className: "advanced-tags--warning-icon-wrapper",
587
- onMouseEnter: () => onWarningClick("warnRight"),
588
- onMouseLeave: () => setIsOpen(false),
589
- children: /* @__PURE__ */ jsx6(
590
- AlertTriangle2,
591
- {
592
- width: 16,
593
- height: 16,
594
- className: "advanced-tags--warning-icon"
595
- }
596
- )
597
- }
598
- ),
599
- isOpen && warnLeftMsg && clickedWarning === "warnLeft" && /* @__PURE__ */ jsx6(
600
- "span",
601
- {
602
- className: cn6(
603
- "advanced-tags__warn-text advanced-tags__warn-text--warnLeft",
604
- { "advanced-tags__warn-text--warnLeft--to-top": toTop }
605
- ),
606
- children: warnLeftMsg
607
- }
608
- ),
609
- isOpen && warnRightMsg && clickedWarning === "warnRight" && /* @__PURE__ */ jsx6(
610
- "span",
611
- {
612
- className: cn6(
613
- "advanced-tags__warn-text",
614
- "advanced-tags__warn-text--warnRight",
615
- { "advanced-tags__warn-text--warnRight--to-top": toTop }
616
- ),
617
- children: warnRightMsg
618
- }
619
- )
620
- ] });
621
- const renderWithEntityAndCounterTag = () => {
622
- const isNullcounter = entityAndCounter?.counter?.toString() === "0";
623
- return /* @__PURE__ */ jsxs6("div", { "data-testid": testId, className: advancedTagClass, ref: hintRef, children: [
624
- isNullcounter && /* @__PURE__ */ jsx6(
625
- "div",
626
- {
627
- "data-testid": `${testId}-left`,
628
- className: "advanced-tags--warning-icon-wrapper",
629
- onMouseEnter: () => onWarningClick("warnLeft"),
630
- onMouseLeave: () => setIsOpen(false),
631
- children: /* @__PURE__ */ jsx6(
632
- AlertTriangle2,
633
- {
634
- width: 16,
635
- height: 16,
636
- className: "advanced-tags--warning-icon mr5"
637
- }
638
- )
639
- }
640
- ),
641
- isOpen && entityAndCounter?.nullCounterMessage && clickedWarning === "warnLeft" && /* @__PURE__ */ jsx6(
642
- "span",
643
- {
644
- className: cn6(
645
- "advanced-tags__warn-text advanced-tags__warn-text--warnLeft",
646
- { "advanced-tags__warn-text--warnLeft--to-top": toTop }
647
- ),
648
- children: entityAndCounter.nullCounterMessage
649
- }
650
- ),
651
- entityAndCounter?.title && /* @__PURE__ */ jsx6("span", { className: "mr5", children: entityAndCounter.title }),
652
- /* @__PURE__ */ jsx6(
653
- "div",
654
- {
655
- className: cn6("advanced-tags__counter", {
656
- "advanced-tags__counter--null": isNullcounter,
657
- "advanced-tags__counter--bold": !isNullcounter
658
- }),
659
- children: entityAndCounter?.counter
660
- }
661
- )
662
- ] });
663
- };
664
- return !isEntityAndCounter ? renderClassicTag() : renderWithEntityAndCounterTag();
665
- };
666
- var AdvTag_default = AdvTag;
667
-
668
- // src/Atomic/UI/AdvancedTag/AdvancedTags.tsx
669
- import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
670
- var AdvancedTags = ({
671
- items,
672
- noItemsTagLabel,
673
- className,
674
- testId = "advanced-tag-test",
675
- toTop = true
676
- }) => {
677
- const [showedItems, setShowedItems] = useState6(items.slice(0, 2));
678
- const [showMore, setShowMore] = useState6(true);
679
- const onShowMoreClick = () => {
680
- setShowedItems(showMore ? items : items.slice(0, 2));
681
- setShowMore(!showMore);
682
- };
683
- if ((!items || !items.length) && noItemsTagLabel) {
684
- return /* @__PURE__ */ jsx7(
685
- Tag_default,
686
- {
687
- label: noItemsTagLabel?.toString(),
688
- className: cn7(className, "tag-warn")
689
- }
690
- );
691
- }
692
- if ((!items || !items.length) && !noItemsTagLabel) return null;
693
- return /* @__PURE__ */ jsxs7("div", { "data-testid": testId, className: cn7(className, "j4 wrap"), children: [
694
- showedItems.map((item, index) => {
695
- if (!item) return null;
696
- return /* @__PURE__ */ jsx7(
697
- AdvTag_default,
698
- {
699
- toTop,
700
- item,
701
- testId: `${testId}-item-${index}`
702
- },
703
- index
704
- );
705
- }),
706
- items.length >= 3 && /* @__PURE__ */ jsx7(
707
- "span",
708
- {
709
- "data-testid": `${testId}-showMore`,
710
- onClick: onShowMoreClick,
711
- className: "advanced-tags advanced-tags--showMore",
712
- children: showMore ? `+${items.length - showedItems.length}` : "..."
713
- }
714
- )
715
- ] });
716
- };
717
- var AdvancedTags_default = AdvancedTags;
718
-
719
- // src/Atomic/UI/AdvancedTag/index.ts
720
- var AdvancedTag_default = AdvancedTags_default;
721
-
722
- // src/Atomic/UI/Alert/Alert.tsx
723
- import cn9 from "classnames";
724
- import { useState as useState7 } from "react";
725
- import { X as X2 } from "react-feather";
726
-
727
- // src/Atomic/UI/Button/Button.tsx
728
- import cn8 from "classnames";
729
- import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
730
- var RC2 = "button";
731
- var Button = ({
732
- label,
733
- onClick,
734
- disabled,
735
- icon,
736
- className,
737
- children,
738
- style,
739
- noIcon,
740
- isIconRight,
741
- testId = "button",
742
- tabIndex = 0,
743
- variant = "primary",
744
- isTextEllipsis = false,
745
- ...props
746
- }) => {
747
- const noRenderIcon = noIcon || variant === "ellipse-apply" || variant === "ellipse-cancel";
748
- return /* @__PURE__ */ jsxs8(
749
- "button",
750
- {
751
- "data-testid": testId,
752
- tabIndex,
753
- style,
754
- className: cn8(
755
- RC2,
756
- {
757
- [`${RC2}_${variant}`]: variant,
758
- "button_icon-left": icon && !isIconRight,
759
- "button_icon-right": icon && isIconRight
760
- },
761
- className
762
- ),
763
- onClick,
764
- disabled,
765
- type: "button",
766
- ...props,
767
- children: [
768
- !noRenderIcon && icon,
769
- label && /* @__PURE__ */ jsx8("div", { className: cn8("button__text", { "text-ellipsis": isTextEllipsis }), children: label }),
770
- !label && children ? children : null
771
- ]
772
- }
773
- );
774
- };
775
- var Button_default = Button;
776
-
777
- // src/Atomic/UI/Alert/Alert.tsx
778
- import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
779
- var Alert = ({
780
- message,
781
- icon,
782
- className,
783
- children,
784
- noDismiss,
785
- testId = "alert",
786
- isHidden = false,
787
- variant = "warning",
788
- isLoading,
789
- buttonParams
790
- }) => {
791
- const [onClose, setOnClose] = useState7(false);
792
- const renderActionsBlock = () => {
793
- if (buttonParams) {
794
- return /* @__PURE__ */ jsxs9("div", { className: "j6 alert__btns-box", children: [
795
- /* @__PURE__ */ jsx9(Button_default, { ...buttonParams }),
796
- !noDismiss && /* @__PURE__ */ jsx9("div", { className: "alert__close-btn", children: /* @__PURE__ */ jsx9(X2, { "data-testid": `${testId}-close`, onClick: () => setOnClose(!onClose) }) })
797
- ] });
798
- }
799
- if (!noDismiss) {
800
- return /* @__PURE__ */ jsx9("div", { className: "alert__close-btn", children: /* @__PURE__ */ jsx9(X2, { "data-testid": `${testId}-close`, onClick: () => setOnClose(!onClose) }) });
801
- } else {
802
- return null;
803
- }
804
- };
805
- return /* @__PURE__ */ jsxs9(
806
- "div",
807
- {
808
- "data-testid": testId,
809
- className: cn9(className, { hidden: onClose }, `alert alert--${variant}`, {
810
- "hidden": isHidden,
811
- "alert--loading": isLoading
812
- }),
813
- children: [
814
- /* @__PURE__ */ jsxs9("div", { className: "alert__icon-text-box j4", children: [
815
- icon,
816
- /* @__PURE__ */ jsx9("div", { children: children || message })
817
- ] }),
818
- renderActionsBlock(),
819
- isLoading && /* @__PURE__ */ jsx9(Spinner_default, { size: "small", testId: "loader-box" })
820
- ]
821
- }
822
- );
823
- };
824
- var Alert_default = Alert;
825
-
826
- // src/Atomic/UI/Alert/index.ts
827
- var Alert_default2 = Alert_default;
828
-
829
- // src/Atomic/UI/Arrow/Arrow.tsx
830
- import cn10 from "classnames";
831
- import { useEffect as useEffect7, useRef as useRef5, useState as useState8 } from "react";
832
-
833
- // src/Functions/utils.js
834
- import { useEffect as useEffect6 } from "react";
835
- import moment from "moment-timezone";
836
-
837
- // src/Constants/index.constants.js
838
- var DEFAULT_COLORS = [
839
- "#D9C1FF",
840
- "#FFBAF0",
841
- "#FFB8CE",
842
- "#FFC3A2",
843
- "#FFDB7C",
844
- "#F9F871",
845
- "#C3FCF1",
846
- "#F6F2CB",
847
- "#E0F8D1",
848
- "#B1DFFB",
849
- "#8DECFE",
850
- "#76F7ED",
851
- "#8AFEC8"
852
- ];
853
-
854
- // src/Functions/utils.js
855
- var getIsOnlyAnObject = (input) => {
856
- return typeof input === "object" && // "отбивает" примитивы и функции
857
- input instanceof Object && // "отбивает" null
858
- !Array.isArray(input) && // "отбивает" массивы
859
- !(input instanceof Set) && // "отбивает" сеты
860
- !(input instanceof Map);
861
- };
862
- var handleObjectChange = (updateObject, updateFunction) => (data, prop = "", isNumber) => {
863
- let value;
864
- if (data?.target) {
865
- value = data.target.type === "checkbox" ? data.target.checked : data.target.value;
866
- } else value = data;
867
- value = isNumber ? Number(value) : value;
868
- const props = prop.split(".");
869
- const currentObject = props.reduce((res, chapter, index) => {
870
- if (props.length !== index + 1) res = res[chapter];
871
- return res;
872
- }, updateObject);
873
- currentObject[props.pop()] = value;
874
- updateFunction();
875
- };
876
- var useOutsideToggle = (ref, setOut, open) => {
877
- function handleClickOutside(event) {
878
- if (ref.current && !ref.current.contains(event.target)) {
879
- setOut(open);
880
- }
881
- }
882
- useEffect6(() => {
883
- document.addEventListener("mouseup", handleClickOutside);
884
- return () => {
885
- document.removeEventListener("mouseup", handleClickOutside);
886
- };
887
- }, [ref]);
888
- };
889
- var getStyles = (el, prop) => {
890
- if (!el) return null;
891
- if (!prop) return window.getComputedStyle(el);
892
- return window.getComputedStyle(el).getPropertyValue(prop);
893
- };
894
- var getColorById = (id, colors) => {
895
- if (!id) return "#FF7D00";
896
- const idToArr = Array.from(id);
897
- const colorsArr = colors && colors.length > 0 ? colors : DEFAULT_COLORS;
898
- let number = idToArr.reduce((acc, item) => {
899
- if (Number(item)) {
900
- return acc + Number(item);
901
- }
902
- return acc;
903
- }, 0);
904
- while (number >= colorsArr.length) {
905
- number -= colorsArr.length;
906
- }
907
- return colorsArr[number];
908
- };
909
- var addBitDepthPoints = (value, step = 3) => {
910
- const isFraction = value?.includes(".");
911
- const valueBeforeDot = isFraction ? value?.slice(0, value?.indexOf(".")) : value;
912
- const intPart = valueBeforeDot.split("").reverse().reduce(
913
- (acc, item, idx) => idx % step === 0 && idx !== 0 ? [...acc, ",", item] : [...acc, item],
914
- []
915
- ).reverse().join("");
916
- return isFraction ? intPart + value?.slice(value?.indexOf(".")) : intPart;
917
- };
918
- var firstLetterCapital = (str) => typeof str === "string" ? `${str.charAt(0).toUpperCase()}${str.slice(1)}` : str;
919
- var capitalized = firstLetterCapital;
920
- var checkedRef = (ref) => ref ? typeof ref === "function" ? (node) => ref(node) : ref : null;
921
- String.prototype.longerThan = function(compareWith) {
922
- return this?.length > compareWith?.length;
923
- };
924
- String.prototype.lastIndexEqualsTo = function(index) {
925
- return this?.length - 1 === index;
926
- };
927
-
928
- // src/Atomic/UI/Arrow/Arrow.tsx
929
- import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
930
- function Arrow({ type, className, onClick, disabled, testId, isAlt }) {
931
- const ref = useRef5(null);
932
- const [color, setColor] = useState8("currentColor");
933
- useEffect7(() => {
934
- if (ref.current) {
935
- setColor(getStyles(ref.current, "color"));
936
- }
937
- }, [ref.current]);
938
- if (!type || type !== "left" && type !== "right") return null;
939
- function renderSVG() {
940
- if (type === "left") {
941
- if (isAlt) {
942
- return /* @__PURE__ */ jsxs10(
943
- "svg",
944
- {
945
- "data-testid": testId,
946
- version: "1.1",
947
- id: "Layer_1",
948
- xmlns: "http://www.w3.org/2000/svg",
949
- width: "16",
950
- height: "16",
951
- viewBox: "0 0 16 16",
952
- children: [
953
- /* @__PURE__ */ jsx10(
954
- "path",
955
- {
956
- d: "M12.7,8H3.3",
957
- stroke: color,
958
- fill: "none",
959
- strokeWidth: 1.3333,
960
- strokeLinecap: "round",
961
- strokeLinejoin: "round"
962
- }
963
- ),
964
- /* @__PURE__ */ jsx10(
965
- "path",
966
- {
967
- d: "M8,3.3L3.3,8L8,12.7",
968
- stroke: color,
969
- fill: "none",
970
- strokeWidth: 1.3333,
971
- strokeLinecap: "round",
972
- strokeLinejoin: "round"
973
- }
974
- )
975
- ]
976
- }
977
- );
978
- }
979
- return /* @__PURE__ */ jsx10(
980
- "svg",
981
- {
982
- "data-testid": testId,
983
- width: "24",
984
- height: "24",
985
- viewBox: "0 0 24 24",
986
- fill: "none",
987
- xmlns: "http://www.w3.org/2000/svg",
988
- children: /* @__PURE__ */ jsx10(
989
- "path",
990
- {
991
- d: "M15 18L9 12L15 6",
992
- stroke: color,
993
- strokeWidth: "2",
994
- strokeLinecap: "round",
995
- strokeLinejoin: "round"
996
- }
997
- )
998
- }
999
- );
1000
- }
1001
- if (isAlt) {
1002
- return /* @__PURE__ */ jsxs10(
1003
- "svg",
1004
- {
1005
- "data-testid": testId,
1006
- id: "Layer_1",
1007
- xmlns: "http://www.w3.org/2000/svg",
1008
- width: "16",
1009
- height: "16",
1010
- viewBox: "0 0 16 16",
1011
- children: [
1012
- /* @__PURE__ */ jsx10(
1013
- "path",
1014
- {
1015
- d: "M3.3,8h9.3",
1016
- stroke: color,
1017
- fill: "none",
1018
- strokeWidth: 1.3333,
1019
- strokeLinecap: "round",
1020
- strokeLinejoin: "round"
1021
- }
1022
- ),
1023
- /* @__PURE__ */ jsx10(
1024
- "path",
1025
- {
1026
- d: "M8,3.3L12.7,8L8,12.7",
1027
- stroke: color,
1028
- fill: "none",
1029
- strokeWidth: 1.3333,
1030
- strokeLinecap: "round",
1031
- strokeLinejoin: "round"
1032
- }
1033
- )
1034
- ]
1035
- }
1036
- );
1037
- }
1038
- return /* @__PURE__ */ jsx10(
1039
- "svg",
1040
- {
1041
- "data-testid": testId,
1042
- width: "24",
1043
- height: "24",
1044
- viewBox: "0 0 24 24",
1045
- fill: "none",
1046
- xmlns: "http://www.w3.org/2000/svg",
1047
- children: /* @__PURE__ */ jsx10(
1048
- "path",
1049
- {
1050
- d: "M9 18L15 12L9 6",
1051
- stroke: "currentColor",
1052
- strokeWidth: "2",
1053
- strokeLinecap: "round",
1054
- strokeLinejoin: "round"
1055
- }
1056
- )
1057
- }
1058
- );
1059
- }
1060
- return /* @__PURE__ */ jsx10(
1061
- "div",
1062
- {
1063
- "data-testid": `arrow--key-${testId}--type-${type}`,
1064
- ref,
1065
- className: cn10("arrow", `arrow_${type}`, className, {
1066
- arrow_disabled: disabled
1067
- }),
1068
- onClick,
1069
- children: renderSVG()
1070
- }
1071
- );
1072
- }
1073
- var Arrow_default = Arrow;
1074
-
1075
- // src/Atomic/UI/Box/Box.tsx
1076
- import cn11 from "classnames";
1077
- import { jsx as jsx11 } from "react/jsx-runtime";
1078
- var directionVariants = {
1079
- column: "column",
1080
- row: "row"
1081
- };
1082
- var sizes = {
1083
- none: "none",
1084
- xs: "xs",
1085
- s: "s",
1086
- m: "m",
1087
- l: "l",
1088
- xl: "xl"
1089
- };
1090
- function Box({
1091
- children,
1092
- paddingVariant = sizes.m,
1093
- radiiVariant = sizes.s,
1094
- direction = directionVariants.column,
1095
- className,
1096
- ...restProps
1097
- }) {
1098
- const styles = {
1099
- flexDirection: direction
1100
- };
1101
- return /* @__PURE__ */ jsx11(
1102
- "div",
1103
- {
1104
- style: styles,
1105
- "data-testid": "box",
1106
- className: cn11(
1107
- "box",
1108
- `box--padding-${paddingVariant}`,
1109
- `box--radii-${radiiVariant}`,
1110
- className,
1111
- {
1112
- "df": direction === directionVariants.row,
1113
- "dfc-jc": direction === directionVariants.column
1114
- }
1115
- ),
1116
- ...restProps,
1117
- children
1118
- }
1119
- );
1120
- }
1121
- var Box_default = Box;
1122
-
1123
- // src/Atomic/UI/CircleProgressBar/CircleProgressBar.js
1124
- import React8, { useEffect as useEffect8, useState as useState9 } from "react";
1125
- import cn12 from "classnames";
1126
- import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
1127
- var CircleProgressBar = ({
1128
- amount,
1129
- totalAmount,
1130
- isReverseType,
1131
- children,
1132
- className,
1133
- colors,
1134
- isInnerLine,
1135
- radius = 59,
1136
- strokeWidth = 2,
1137
- innerLineStrokeWidth = 2,
1138
- testId = "circle-progress-bar"
1139
- }) => {
1140
- const circumference = Math.round(2 * Math.PI * radius);
1141
- const amountProgress = amount < totalAmount ? Math.round(amount / totalAmount * 100) : 100;
1142
- const defaultColors = {
1143
- start: "#6b81dd",
1144
- finish: "#f06d8d",
1145
- meter: "#ffcad6"
1146
- };
1147
- const [strokeDashoffset, setStrokeDashoffset] = useState9(isReverseType ? String(0) : circumference);
1148
- useEffect8(() => {
1149
- setStrokeDashoffset(circumference - circumference * amountProgress / 100);
1150
- }, [amountProgress]);
1151
- return /* @__PURE__ */ jsxs11(
1152
- "div",
1153
- {
1154
- "data-testid": testId,
1155
- className: cn12("limit-progress-bar", { "limit-progress-bar--reverse": isReverseType }, className),
1156
- children: [
1157
- /* @__PURE__ */ jsxs11(
1158
- "svg",
1159
- {
1160
- className: "limit-progress-bar__progress",
1161
- width: "124",
1162
- height: "124",
1163
- viewBox: "0 0 124 124",
1164
- children: [
1165
- /* @__PURE__ */ jsx12("defs", { children: isReverseType ? /* @__PURE__ */ jsxs11(
1166
- "linearGradient",
1167
- {
1168
- id: "limit-progress-bar-linear-gradient-reverse",
1169
- x1: "0",
1170
- y1: "1",
1171
- x2: "0",
1172
- y2: "0",
1173
- children: [
1174
- /* @__PURE__ */ jsx12(
1175
- "stop",
1176
- {
1177
- offset: "0",
1178
- stopColor: colors.finish || defaultColors.finish
1179
- }
1180
- ),
1181
- /* @__PURE__ */ jsx12(
1182
- "stop",
1183
- {
1184
- offset: "1",
1185
- stopColor: colors.start || defaultColors.start
1186
- }
1187
- )
1188
- ]
1189
- }
1190
- ) : /* @__PURE__ */ jsxs11(
1191
- "linearGradient",
1192
- {
1193
- id: "limit-progress-bar-linear-gradient",
1194
- x1: "0",
1195
- y1: "1",
1196
- x2: "0",
1197
- y2: "0",
1198
- children: [
1199
- /* @__PURE__ */ jsx12(
1200
- "stop",
1201
- {
1202
- offset: "0",
1203
- stopColor: colors.start || defaultColors.start
1204
- }
1205
- ),
1206
- /* @__PURE__ */ jsx12(
1207
- "stop",
1208
- {
1209
- offset: "1",
1210
- stopColor: colors.finish || defaultColors.finish
1211
- }
1212
- )
1213
- ]
1214
- }
1215
- ) }),
1216
- /* @__PURE__ */ jsx12(
1217
- "circle",
1218
- {
1219
- className: "limit-progress-bar__meter",
1220
- cx: radius,
1221
- cy: radius,
1222
- r: radius,
1223
- stroke: !isInnerLine ? "" : colors.meter || defaultColors.meter,
1224
- strokeWidth: String(innerLineStrokeWidth)
1225
- }
1226
- ),
1227
- /* @__PURE__ */ jsx12(
1228
- "circle",
1229
- {
1230
- className: "limit-progress-bar__value",
1231
- cx: radius,
1232
- cy: radius,
1233
- r: radius,
1234
- strokeWidth: String(strokeWidth),
1235
- stroke: `url(#limit-progress-bar-linear-gradient${isReverseType ? "-reverse" : ""})`,
1236
- style: {
1237
- strokeDasharray: circumference,
1238
- strokeDashoffset
1239
- }
1240
- }
1241
- )
1242
- ]
1243
- }
1244
- ),
1245
- /* @__PURE__ */ jsx12("div", { className: "limit-progress-bar__content", children })
1246
- ]
1247
- }
1248
- );
1249
- };
1250
- var CircleProgressBar_default = CircleProgressBar;
1251
-
1252
- // src/Atomic/UI/DateTime/DateTime.tsx
1253
- import cn13 from "classnames";
1254
- import moment2 from "moment-timezone";
1255
- import { useMemo as useMemo2 } from "react";
1256
- import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
1257
- var RC3 = "date-time";
1258
- var DEFAULT_DATE_FORMAT = "DD.MM.YYYY";
1259
- var DEFAULT_TIME_FORMAT = "HH:mm:ss";
1260
- var DateTime = ({
1261
- className,
1262
- value,
1263
- valueFormat,
1264
- dateFormat: inputDateFormat,
1265
- timeFormat: inputTimeFormat,
1266
- isNoDate,
1267
- isNoTime,
1268
- testId = "date-time"
1269
- }) => {
1270
- const dateFormat = inputDateFormat ?? DEFAULT_DATE_FORMAT;
1271
- const timeFormat = inputTimeFormat ?? DEFAULT_TIME_FORMAT;
1272
- const date = useMemo2(() => {
1273
- return (valueFormat ? moment2(value, valueFormat) : moment2(value)).format(
1274
- dateFormat
1275
- );
1276
- }, [value, valueFormat, dateFormat]);
1277
- const time = useMemo2(() => {
1278
- return (valueFormat ? moment2(value, valueFormat) : moment2(value)).format(
1279
- timeFormat
1280
- );
1281
- }, [value, valueFormat, timeFormat]);
1282
- return /* @__PURE__ */ jsxs12("div", { "data-testid": testId, className: cn13(RC3, className), children: [
1283
- !isNoDate && /* @__PURE__ */ jsx13("span", { "data-testid": `${testId}-date`, className: `${RC3}__date`, children: date }),
1284
- !isNoTime && /* @__PURE__ */ jsx13(
1285
- "span",
1286
- {
1287
- "data-testid": `${testId}-time`,
1288
- className: cn13(`${RC3}__time`, {
1289
- [`${RC3}_color--pause`]: !isNoDate
1290
- }),
1291
- children: time
1292
- }
1293
- )
1294
- ] });
1295
- };
1296
- var DateTime_default = DateTime;
1297
-
1298
- // src/Atomic/UI/DebugContainer/DebugContainer.tsx
1299
- import cn14 from "classnames";
1300
- import { useState as useState10 } from "react";
1301
- import { ChevronDown as ChevronDown3, ChevronUp as ChevronUp2 } from "react-feather";
1302
- import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
1303
- var defaultData = {};
1304
- var DebugContainer = ({ data = defaultData, children, className }) => {
1305
- const [isVisible, setIsVisible] = useState10(true);
1306
- const renderData = () => /* @__PURE__ */ jsxs13("pre", { children: [
1307
- "{\n",
1308
- Object.keys(data).map((key) => ` ${key}: ${String(data[key])},
1309
- `),
1310
- "}"
1311
- ] });
1312
- return /* @__PURE__ */ jsxs13("div", { className: cn14("debug-container", className), "data-testid": "debug-container", children: [
1313
- isVisible && /* @__PURE__ */ jsxs13("div", { className: "debug-container__body", children: [
1314
- /* @__PURE__ */ jsx14("h5", { children: "Debug:" }),
1315
- data && Object.keys(data).length > 0 && /* @__PURE__ */ jsx14("div", { className: "debug-container__body-row", "data-testid": "debug-data", children: renderData() }),
1316
- children && /* @__PURE__ */ jsx14("div", { className: "debug-container__body-row", "data-testid": "debug-children", children })
1317
- ] }),
1318
- /* @__PURE__ */ jsx14(
1319
- "div",
1320
- {
1321
- className: "debug-container__toggler",
1322
- onClick: () => setIsVisible((v) => !v),
1323
- "data-testid": "debug-toggler",
1324
- children: isVisible ? /* @__PURE__ */ jsx14(ChevronUp2, {}) : /* @__PURE__ */ jsx14(ChevronDown3, {})
1325
- }
1326
- )
1327
- ] });
1328
- };
1329
- var DebugContainer_default = DebugContainer;
1330
-
1331
- // src/Atomic/UI/DebugContainer/useDebugContainer.tsx
1332
- import { useState as useState11 } from "react";
1333
- import { jsx as jsx15 } from "react/jsx-runtime";
1334
- function useDebugContainer() {
1335
- const [data, setData] = useState11({});
1336
- return {
1337
- debugData: data,
1338
- setDebugData: setData,
1339
- renderDebugContainer: /* @__PURE__ */ jsx15(DebugContainer_default, { data })
1340
- };
1341
- }
1342
- var useDebugContainer_default = useDebugContainer;
1343
-
1344
- // src/Atomic/UI/DoubleString/DoubleString.tsx
1345
- import cn15 from "classnames";
1346
- import moment3 from "moment";
1347
- import { useEffect as useEffect9, useRef as useRef6, useState as useState12 } from "react";
1348
- import { Eye, EyeOff } from "react-feather";
1349
- import { Fragment as Fragment2, jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
1350
- var RC4 = "double-string";
1351
- var DoubleString = ({
1352
- value,
1353
- description,
1354
- subDescription,
1355
- valuePostfix,
1356
- className,
1357
- testId = "double-string",
1358
- isFormatValueToDate,
1359
- isUseOnClick,
1360
- dateFormatSettings: {
1361
- parseFormat = "MM.DD.YYYY",
1362
- displayFormat = "MM.DD.YYYY"
1363
- } = {},
1364
- revert = false,
1365
- noTitle,
1366
- isUseHideMode = false,
1367
- isShowHiddenValueAvailable = false
1368
- }) => {
1369
- const [isValueHidden, setIsValueHidden] = useState12(isUseHideMode);
1370
- const computedValue = isFormatValueToDate ? moment3(value, parseFormat).format(displayFormat) : value;
1371
- const valueRef = useRef6(null);
1372
- ;
1373
- const descriptionRef = useRef6(null);
1374
- const [elemsWidth, setElemsWidth] = useState12({
1375
- valueWidth: 0,
1376
- descriptionWidth: 0
1377
- });
1378
- const [isOnClickON, setIsOnClickON] = useState12(false);
1379
- const handle = {
1380
- click: () => {
1381
- setIsOnClickON(!isOnClickON);
1382
- }
1383
- };
1384
- useEffect9(() => {
1385
- const valueWidth = valueRef?.current?.clientWidth ?? 0;
1386
- const descriptionWidth = descriptionRef?.current?.clientWidth ?? 0;
1387
- setElemsWidth({ valueWidth, descriptionWidth });
1388
- }, [descriptionRef, valueRef]);
1389
- return /* @__PURE__ */ jsxs14("div", { "data-testid": testId, className: cn15(RC4, className), children: [
1390
- /* @__PURE__ */ jsx16(
1391
- "p",
1392
- {
1393
- onClick: () => handle.click(),
1394
- ref: valueRef,
1395
- className: cn15(
1396
- `${RC4}__value`,
1397
- {
1398
- "double-string--value-opened": isOnClickON && isUseOnClick
1399
- },
1400
- { pointer: isUseOnClick }
1401
- ),
1402
- title: !noTitle && elemsWidth.valueWidth > 99 ? computedValue : "",
1403
- children: !revert ? /* @__PURE__ */ jsxs14(Fragment2, { children: [
1404
- isUseHideMode ? /* @__PURE__ */ jsx16("span", { children: !isValueHidden ? computedValue : "*********" }) : computedValue,
1405
- isUseHideMode && isShowHiddenValueAvailable && isValueHidden && /* @__PURE__ */ jsx16(Eye, { "data-testid": "double-string-eye", className: `${RC4}__hide-mode-icon`, onClick: () => setIsValueHidden(false) }),
1406
- isUseHideMode && isShowHiddenValueAvailable && !isValueHidden && /* @__PURE__ */ jsx16(EyeOff, { "data-testid": "double-string-eyeoff", className: `${RC4}__hide-mode-icon`, onClick: () => setIsValueHidden(true) }),
1407
- valuePostfix && /* @__PURE__ */ jsx16("span", { className: cn15(`${RC4}__value-postfix`), children: valuePostfix })
1408
- ] }) : description
1409
- }
1410
- ),
1411
- /* @__PURE__ */ jsx16(
1412
- "p",
1413
- {
1414
- ref: descriptionRef,
1415
- className: cn15(`${RC4}__description`),
1416
- title: !noTitle && elemsWidth.descriptionWidth > 99 ? computedValue : "",
1417
- children: !revert ? description : /* @__PURE__ */ jsxs14(Fragment2, { children: [
1418
- computedValue,
1419
- valuePostfix && /* @__PURE__ */ jsx16("span", { className: cn15(`${RC4}__value-postfix`), children: valuePostfix })
1420
- ] })
1421
- }
1422
- ),
1423
- subDescription && /* @__PURE__ */ jsx16("p", { className: cn15(`${RC4}__sub-description`), children: subDescription })
1424
- ] });
1425
- };
1426
- var DoubleString_default = DoubleString;
1427
-
1428
- // src/Atomic/UI/DoubleString/index.ts
1429
- var DoubleString_default2 = DoubleString_default;
1430
-
1431
- // src/Atomic/UI/Hint/Hint.tsx
1432
- import cn16 from "classnames";
1433
- import { useEffect as useEffect10, useRef as useRef7, useState as useState13 } from "react";
1434
- import { createPortal as createPortal2 } from "react-dom";
1435
- import { AlertTriangle as AlertTriangle3, HelpCircle } from "react-feather";
1436
-
1437
- // src/Molecular/CustomIcons/components/HelpCircleFilled.tsx
1438
- import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
1439
- function HelpCircleFilled(props) {
1440
- return /* @__PURE__ */ jsxs15(
1441
- "svg",
1442
- {
1443
- xmlns: "http://www.w3.org/2000/svg",
1444
- width: 16,
1445
- height: 16,
1446
- fill: "none",
1447
- ...props,
1448
- children: [
1449
- /* @__PURE__ */ jsx17(
1450
- "path",
1451
- {
1452
- fill: "#9AA0B9",
1453
- d: "M8 14.667A6.667 6.667 0 1 0 8 1.333a6.667 6.667 0 0 0 0 13.334Z"
1454
- }
1455
- ),
1456
- /* @__PURE__ */ jsx17(
1457
- "path",
1458
- {
1459
- stroke: "#fff",
1460
- d: "M6.06 6a2 2 0 0 1 3.887.667c0 1.333-2 2-2 2M8 11.333h.006"
1461
- }
1462
- )
1463
- ]
1464
- }
1465
- );
1466
- }
1467
-
1468
- // src/Atomic/UI/Hint/partials/_constants.ts
1469
- var I_AM_OPENED_EVENT_NAME = "hint:i-am-open";
1470
- var I_AM_OPENED_EVENT_OPTIONS = {
1471
- bubbles: true,
1472
- cancelable: true,
1473
- composed: false
1474
- };
1475
-
1476
- // src/Atomic/UI/Hint/partials/_utils.ts
1477
- var getHintContainerId = (hintId) => `hint-container-for-hint--id-${hintId}`;
1478
- function getHintContainer(hintId) {
1479
- return document.getElementById(getHintContainerId(hintId));
1480
- }
1481
- function getParentNode() {
1482
- return document.querySelector("div#root") ?? document.querySelector("div#app") ?? document.body;
1483
- }
1484
- function initHintContainer(hintId, hintContainerSettings) {
1485
- const { className } = hintContainerSettings;
1486
- const hintContainer = document.createElement("div");
1487
- hintContainer.setAttribute("id", getHintContainerId(hintId));
1488
- hintContainer.classList.add("hint__container");
1489
- if (className) hintContainer.classList.add(className);
1490
- getParentNode()?.append(hintContainer);
1491
- }
1492
- function HandleScrollObj(setIsOpen) {
1493
- this.setIsOpen = setIsOpen;
1494
- this.handleEvent = function() {
1495
- this.setIsOpen(false);
1496
- };
1497
- }
1498
- function HandleClickOutsideObj(id, setIsOpen) {
1499
- this.id = id;
1500
- this.setIsOpen = setIsOpen;
1501
- this.handleEvent = function(event) {
1502
- if (getHintContainer(this.id)) {
1503
- if (!getHintContainer(this.id).contains(event?.target)) {
1504
- this.setIsOpen(false);
1505
- }
1506
- }
1507
- };
1508
- }
1509
-
1510
- // src/Atomic/UI/Hint/Hint.tsx
1511
- import { Fragment as Fragment3, jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
1512
- var hintTimeoutMap = /* @__PURE__ */ new Map();
1513
- var isContentHoveredOuter = false;
1514
- var DEFAULT_EMPTY_OBJ = {};
1515
- function DEFAULT_VOID_FN() {
1516
- }
1517
- var Hint = ({
1518
- hint,
1519
- side = "right",
1520
- className,
1521
- hintContainer = DEFAULT_EMPTY_OBJ,
1522
- label = "",
1523
- variant = "filled",
1524
- handleOpenType = "click",
1525
- onClickCallback,
1526
- onOpenChange = DEFAULT_VOID_FN,
1527
- key,
1528
- id,
1529
- children,
1530
- icon,
1531
- isAccessability = false,
1532
- testId = "hint",
1533
- isHoverableContent = false,
1534
- isLoading,
1535
- isCloseOnChildrenClick = false
1536
- }) => {
1537
- const hintRef = useRef7(null);
1538
- const [hintId] = useState13(id ?? key ?? Math.random().toString(16).slice(2));
1539
- const [iAmOpenedOptions] = useState13({ ...I_AM_OPENED_EVENT_OPTIONS, detail: { hintId } });
1540
- const [isOpen, setIsOpen] = useState13(false);
1541
- const [isStyleComputed, setIsStyleComputed] = useState13(false);
1542
- const [handleScroll] = useState13(new HandleScrollObj(setIsOpen));
1543
- const [handleClickOutside] = useState13(new HandleClickOutsideObj(hintId, setIsOpen));
1544
- const isCallbackExist = typeof onClickCallback === "function";
1545
- const handle = {
1546
- onMouseEnter: () => {
1547
- const existing = hintTimeoutMap.get(hintId);
1548
- if (existing) clearTimeout(existing);
1549
- if (handleOpenType === "hover") {
1550
- const timer = setTimeout(() => {
1551
- setIsOpen(true);
1552
- !isOpen && onClickCallback?.();
1553
- hintRef.current?.dispatchEvent?.(new CustomEvent(I_AM_OPENED_EVENT_NAME, iAmOpenedOptions));
1554
- }, 350);
1555
- hintTimeoutMap.set(hintId, timer);
1556
- }
1557
- },
1558
- onMouseLeave: () => {
1559
- const existing = hintTimeoutMap.get(hintId);
1560
- if (existing) clearTimeout(existing);
1561
- if (!isHoverableContent && handleOpenType === "hover") {
1562
- const timer = setTimeout(() => {
1563
- setIsOpen(false);
1564
- hintTimeoutMap.delete(hintId);
1565
- }, 1e3);
1566
- hintTimeoutMap.set(hintId, timer);
1567
- } else if (isHoverableContent && handleOpenType === "hover") {
1568
- const timer = setTimeout(() => {
1569
- if (!isContentHoveredOuter) {
1570
- setIsOpen(false);
1571
- }
1572
- hintTimeoutMap.delete(hintId);
1573
- }, 100);
1574
- hintTimeoutMap.set(hintId, timer);
1575
- }
1576
- },
1577
- onMouseLeaveHoverableContent: () => {
1578
- const existing = hintTimeoutMap.get(hintId);
1579
- if (existing) clearTimeout(existing);
1580
- if (isHoverableContent && handleOpenType === "hover") {
1581
- const timer = setTimeout(() => {
1582
- setIsOpen(false);
1583
- isContentHoveredOuter = false;
1584
- hintTimeoutMap.delete(hintId);
1585
- }, 100);
1586
- hintTimeoutMap.set(hintId, timer);
1587
- }
1588
- },
1589
- onClick: isCloseOnChildrenClick ? () => setIsOpen(false) : () => {
1590
- }
1591
- };
1592
- const getHintMarkUp = (className2) => {
1593
- return /* @__PURE__ */ jsxs16(
1594
- "div",
1595
- {
1596
- "data-testid": "test-hint-text",
1597
- className: cn16("hint__text", `hint__text_${side}`, `hint--${className2}__text`),
1598
- onMouseEnter: () => {
1599
- if (isHoverableContent) isContentHoveredOuter = true;
1600
- },
1601
- onMouseLeave: isHoverableContent ? handle.onMouseLeaveHoverableContent : void 0,
1602
- onClick: handle.onClick,
1603
- style: { visibility: isStyleComputed ? "visible" : "hidden" },
1604
- children: [
1605
- isLoading && /* @__PURE__ */ jsx18(Spinner_default, { size: "small" }),
1606
- hint,
1607
- children
1608
- ]
1609
- }
1610
- );
1611
- };
1612
- const setHintContainerStyles = () => {
1613
- const hc = getHintContainer(hintId);
1614
- if (!hc || !isOpen) return false;
1615
- const { width = 0, top = 0, left = 0 } = hintRef?.current !== null ? hintRef?.current?.getBoundingClientRect() : {};
1616
- const { addWidth, addLeft, addTop } = hintContainer ?? {};
1617
- const windowInnerWidth = document.documentElement.clientWidth;
1618
- const windowInnerHeight = document.documentElement.clientHeight;
1619
- const sw = hc.getElementsByClassName("hint__text")[0];
1620
- const { width: swWidth, height: swHeight } = sw?.getBoundingClientRect() || {};
1621
- hc.style.width = isOpen ? ((addWidth && !Number.isNaN(+addWidth) ? +addWidth : 0) + width)?.toString().concat("px") : "0";
1622
- hc.style.left = isOpen ? ((addLeft && !Number.isNaN(+addLeft) ? +addLeft : 0) + left)?.toString().concat("px") : "0";
1623
- hc.style.top = isOpen ? ((addTop && !Number.isNaN(+addTop) ? +addTop : 0) + top)?.toString().concat("px") : "0";
1624
- hc.style.maxHeight = isOpen ? swHeight?.toString().concat("px") : "0";
1625
- const INACCURACY = 20;
1626
- switch (side) {
1627
- case "top":
1628
- case "centeredTop":
1629
- if (top - swHeight - INACCURACY / 2 < 0) {
1630
- sw.classList.remove(`hint__text_${side}`);
1631
- sw.classList.add(`hint__text_${side === "top" ? "bottom" : "centeredBottom"}`);
1632
- }
1633
- break;
1634
- case "bottom":
1635
- case "centeredBottom":
1636
- if (top + swHeight + INACCURACY > windowInnerHeight) {
1637
- sw.classList.remove(`hint__text_${side}`);
1638
- sw.classList.add(`hint__text_${side === "bottom" ? "top" : "centeredTop"}`);
1639
- }
1640
- break;
1641
- case "left":
1642
- if (left - swWidth - INACCURACY / 2 < 0) {
1643
- sw.classList.remove(`hint__text_${side}`);
1644
- sw.classList.add("hint__text_right");
1645
- }
1646
- break;
1647
- case "right":
1648
- default:
1649
- if (left + width + swWidth + INACCURACY / 2 > windowInnerWidth) {
1650
- sw.classList.remove(`hint__text_${side}`);
1651
- sw.classList.add("hint__text_left");
1652
- }
1653
- break;
1654
- }
1655
- setIsStyleComputed(true);
1656
- };
1657
- const renderHintContainer = (className2) => {
1658
- const hc = getHintContainer(hintId);
1659
- if (!hc) return null;
1660
- return createPortal2(getHintMarkUp(className2), hc);
1661
- };
1662
- useEffect10(() => {
1663
- initHintContainer(hintId, hintContainer);
1664
- const iAmOpenedCallback = (ev) => {
1665
- const event = ev;
1666
- if (event?.detail?.hintId !== hintId) {
1667
- setIsOpen(false);
1668
- const timer = hintTimeoutMap.get(hintId);
1669
- if (timer) {
1670
- clearTimeout(timer);
1671
- hintTimeoutMap.delete(hintId);
1672
- }
1673
- }
1674
- return event;
1675
- };
1676
- if (hintRef.current) {
1677
- document.addEventListener(I_AM_OPENED_EVENT_NAME, iAmOpenedCallback);
1678
- }
1679
- return () => {
1680
- document.removeEventListener(I_AM_OPENED_EVENT_NAME, iAmOpenedCallback);
1681
- const timer = hintTimeoutMap.get(hintId);
1682
- if (timer) {
1683
- clearTimeout(timer);
1684
- hintTimeoutMap.delete(hintId);
1685
- }
1686
- };
1687
- }, []);
1688
- useEffect10(() => {
1689
- setIsStyleComputed(false);
1690
- setHintContainerStyles();
1691
- onOpenChange?.(isOpen);
1692
- if (isOpen) {
1693
- document.addEventListener("scroll", handleScroll, true);
1694
- document.addEventListener("click", handleClickOutside, true);
1695
- } else {
1696
- document.removeEventListener("scroll", handleScroll, true);
1697
- document.removeEventListener("click", handleClickOutside, true);
1698
- }
1699
- return () => {
1700
- const timer = hintTimeoutMap.get(hintId);
1701
- if (timer) {
1702
- clearTimeout(timer);
1703
- hintTimeoutMap.delete(hintId);
1704
- }
1705
- };
1706
- }, [isOpen]);
1707
- return /* @__PURE__ */ jsxs16("div", { "data-testid": testId, className: cn16("hint", className), ref: hintRef, children: [
1708
- /* @__PURE__ */ jsxs16(
1709
- "button",
1710
- {
1711
- tabIndex: isAccessability ? 0 : -1,
1712
- "data-testid": typeof label === "string" && label.length ? label.replace?.(/\s/g, "-") : `${testId}--button`,
1713
- "aria-label": isAccessability && typeof label === "string" ? label : "",
1714
- onClick: () => handleOpenType === "click" && (isCallbackExist ? onClickCallback?.() : setIsOpen(!isOpen)),
1715
- onMouseEnter: handle.onMouseEnter,
1716
- onMouseLeave: handle.onMouseLeave,
1717
- className: cn16("hint__button", { hint__button_active: isOpen }),
1718
- children: [
1719
- icon || icon === null || /* @__PURE__ */ jsxs16(Fragment3, { children: [
1720
- variant === "outlined" && /* @__PURE__ */ jsx18(HelpCircle, { width: 16, height: 16, className: "hint__icon outlined" }),
1721
- variant === "filled" && /* @__PURE__ */ jsx18(HelpCircleFilled, { className: "hint__icon filled" }),
1722
- variant === "warning" && /* @__PURE__ */ jsx18(AlertTriangle3, { className: "hint__icon", color: "#F06D8D", width: 16, height: 16 })
1723
- ] }),
1724
- label && /* @__PURE__ */ jsx18("span", { className: cn16("hint__label", { "color--primary": isOpen }), children: typeof label === "string" ? capitalized(label) : label })
1725
- ]
1726
- }
1727
- ),
1728
- isOpen && renderHintContainer(className)
1729
- ] });
1730
- };
1731
- var Hint_default = Hint;
1732
-
1733
- // src/Atomic/UI/Hint/index.ts
1734
- var Hint_default2 = Hint_default;
1735
-
1736
- // src/Atomic/UI/Modal/Modal.tsx
1737
- import cn19 from "classnames";
1738
- import { useEffect as useEffect15, useLayoutEffect as useLayoutEffect3, useMemo as useMemo4, useRef as useRef10 } from "react";
1739
-
1740
- // src/Functions/useKeyPress/useHandleKeyPress.ts
1741
- import { useEffect as useEffect12 } from "react";
1742
-
1743
- // src/Functions/useKeyPress/useKeyPress.ts
1744
- import { useCallback, useEffect as useEffect11, useState as useState14 } from "react";
1745
- function isISuspendProcessing(x) {
1746
- return getIsOnlyAnObject(x) && Object.values(x).every((v) => typeof v === "function");
1747
- }
1748
- function useKeyPress(targetKey, clamping = true, isForbidden, suspendProcessing) {
1749
- const [keyPressed, setKeyPressed] = useState14(false);
1750
- const safelySuspendProcessing = isISuspendProcessing(suspendProcessing) ? suspendProcessing : {};
1751
- const downHandler = useCallback(
1752
- (event) => {
1753
- const { key, repeat, altKey, ctrlKey, shiftKey, metaKey } = event;
1754
- const isPressingWithoutAuxiliaryKeys = !altKey && !ctrlKey && !shiftKey && !metaKey;
1755
- if (key === targetKey && isPressingWithoutAuxiliaryKeys && !safelySuspendProcessing[key]?.(event)) {
1756
- if (!clamping && repeat) return;
1757
- setKeyPressed(true);
1758
- }
1759
- },
1760
- // ? Намерянно в зависимостях используем именно входной suspendProcessing,
1761
- // ? хоть в коде используем "безопасный"
1762
- [clamping, targetKey, suspendProcessing]
1763
- );
1764
- const upHandler = useCallback(
1765
- (event) => {
1766
- const { key, repeat, altKey, ctrlKey, shiftKey, metaKey } = event;
1767
- const isPressingWithoutAuxiliaryKeys = !altKey && !ctrlKey && !shiftKey && !metaKey;
1768
- if (key === targetKey && isPressingWithoutAuxiliaryKeys && !safelySuspendProcessing[key]?.(event)) {
1769
- if (!clamping && repeat) return;
1770
- setKeyPressed(false);
1771
- }
1772
- },
1773
- // ? Намерянно в зависимостях используем именно входной suspendProcessing,
1774
- // ? хоть в коде используем "безопасный"
1775
- [clamping, targetKey, suspendProcessing]
1776
- );
1777
- useEffect11(
1778
- () => {
1779
- const handleDown = (event) => downHandler(event);
1780
- const handleUp = (event) => upHandler(event);
1781
- if (!isForbidden) {
1782
- window.addEventListener("keydown", handleDown);
1783
- window.addEventListener("keyup", handleUp);
1784
- }
1785
- return () => {
1786
- window.removeEventListener("keydown", handleDown);
1787
- window.removeEventListener("keyup", handleUp);
1788
- };
1789
- },
1790
- // ? Намерянно в зависимостях используем именно входной suspendProcessing,
1791
- // ? хоть в коде используем "безопасный"
1792
- [downHandler, upHandler, isForbidden, suspendProcessing]
1793
- );
1794
- return keyPressed;
1795
- }
1796
- var useKeyPress_default = useKeyPress;
1797
-
1798
- // src/Functions/useKeyPress/useHandleKeyPress.ts
1799
- function useHandleKeyPress({
1800
- escCallback,
1801
- enterCallback,
1802
- withClamping = true,
1803
- withEventManagementStructure,
1804
- suspendProcessing = null
1805
- }) {
1806
- const { isWithSubmitAndCloseManagement } = withEventManagementStructure || {};
1807
- const isPressEnter = useKeyPress_default("Enter", withClamping, isWithSubmitAndCloseManagement, suspendProcessing);
1808
- const isPressEscape = useKeyPress_default("Escape", withClamping, isWithSubmitAndCloseManagement, suspendProcessing);
1809
- useEffect12(() => {
1810
- if (!isWithSubmitAndCloseManagement && isPressEscape && typeof escCallback === "function") {
1811
- escCallback();
1812
- }
1813
- }, [isPressEscape, escCallback]);
1814
- useEffect12(() => {
1815
- if (!isWithSubmitAndCloseManagement && isPressEnter && typeof enterCallback === "function") {
1816
- enterCallback();
1817
- }
1818
- }, [isPressEnter, enterCallback]);
1819
- }
1820
- var useHandleKeyPress_default = useHandleKeyPress;
1821
-
1822
- // src/Atomic/UI/Modal/partials/_constants.ts
1823
- var DEFAULT_EVENT_OPTIONS = Object.freeze({
1824
- bubbles: true,
1825
- cancelable: true,
1826
- composed: false
1827
- });
1828
- var EVENTS = Object.freeze({
1829
- ["iGotAnEnterKeyPress" /* iGotAnEnterKeyPress */]: {
1830
- innerKey: "iGotAnEnterKeyPress" /* iGotAnEnterKeyPress */,
1831
- name: "modal:i-got-an-enter-key-press",
1832
- shortName: "enterIsPressed",
1833
- middlewareKey: "Enter",
1834
- options: DEFAULT_EVENT_OPTIONS
1835
- },
1836
- ["iGotAnEscKeyPress" /* iGotAnEscKeyPress */]: {
1837
- innerKey: "iGotAnEscKeyPress" /* iGotAnEscKeyPress */,
1838
- name: "modal:i-got-an-esc-key-press",
1839
- shortName: "escIsPressed",
1840
- middlewareKey: "Escape",
1841
- options: DEFAULT_EVENT_OPTIONS
1842
- }
1843
- });
1844
-
1845
- // src/Atomic/UI/Modal/partials/_utils.ts
1846
- function getWithEventManagementStructure(modalId, withEventManagement) {
1847
- const output = {
1848
- isWithSubmitAndCloseManagement: false
1849
- };
1850
- for (const key in output) {
1851
- if (!modalId) {
1852
- output[key] = false;
1853
- } else {
1854
- output[key] = getIsOnlyAnObject(withEventManagement) ? withEventManagement[key] ?? false : !!withEventManagement;
1855
- }
1856
- }
1857
- return output;
1858
- }
1859
- function getOnKeyPress({
1860
- id: modalId,
1861
- onSubmit,
1862
- onClose,
1863
- suspendProcessing
1864
- }) {
1865
- if (!modalId) return null;
1866
- return function onKeyPress(ev) {
1867
- const customEvent = ev;
1868
- const { id: eventId, realEvent } = customEvent.detail || {};
1869
- const constantInfoAboutCustomEvent = Object.values(EVENTS).find((ev2) => ev2.name === customEvent.type || ev2.shortName === customEvent.type) || {};
1870
- const middlewareKey = constantInfoAboutCustomEvent.middlewareKey || "incorrectKey";
1871
- const safelySuspendProcessing = isISuspendProcessing(suspendProcessing) ? suspendProcessing : {};
1872
- if (modalId && eventId && eventId === modalId && !safelySuspendProcessing[middlewareKey]?.(realEvent)) {
1873
- switch (customEvent.type) {
1874
- case EVENTS.iGotAnEnterKeyPress.name: {
1875
- onSubmit?.();
1876
- break;
1877
- }
1878
- case EVENTS.iGotAnEscKeyPress.name: {
1879
- onClose?.();
1880
- break;
1881
- }
1882
- default: {
1883
- break;
1884
- }
1885
- }
1886
- }
1887
- };
1888
- }
1889
- function dispatchEventForModalManagement(realEvent, nameOfCustomEvent, uniqueIdOfRecipient, target) {
1890
- const { repeat, altKey, ctrlKey, shiftKey, metaKey } = realEvent;
1891
- const isPressingWithoutAuxiliaryKeys = !altKey && !ctrlKey && !shiftKey && !metaKey;
1892
- if (!repeat && isPressingWithoutAuxiliaryKeys) {
1893
- const event = Object.values(EVENTS).find((ev) => ev.name === nameOfCustomEvent || ev.shortName === nameOfCustomEvent);
1894
- if (event && uniqueIdOfRecipient) {
1895
- (target ?? document).dispatchEvent(new CustomEvent(event.name, { ...event.options, detail: { id: uniqueIdOfRecipient, realEvent } }));
1896
- }
1897
- }
1898
- }
1899
-
1900
- // src/Atomic/UI/Modal/partials/ModalFooter.tsx
1901
- import cn17 from "classnames";
1902
- import { memo } from "react";
1903
- import { jsx as jsx19 } from "react/jsx-runtime";
1904
- var ModalFooter = memo(
1905
- ({ className = "", children, wrapperRef, testId = "modal-footer" }) => {
1906
- return /* @__PURE__ */ jsx19(
1907
- "footer",
1908
- {
1909
- "data-testid": testId,
1910
- ref: wrapperRef,
1911
- className: cn17("modal__footer", className),
1912
- role: "contentinfo",
1913
- "aria-label": "Modal footer",
1914
- children
1915
- }
1916
- );
1917
- }
1918
- );
1919
- ModalFooter.displayName = "ModalFooter";
1920
- var ModalFooter_default = ModalFooter;
1921
-
1922
- // src/Atomic/UI/Modal/partials/ModalTitle.tsx
1923
- import cn18 from "classnames";
1924
- import { memo as memo2, useLayoutEffect, useMemo as useMemo3, useRef as useRef8 } from "react";
1925
- import { X as X3 } from "react-feather";
1926
- import { jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
1927
- var ModalTitle = memo2(
1928
- ({
1929
- variant = "primary",
1930
- children,
1931
- isForced = false,
1932
- onClose,
1933
- closeBtnDisable,
1934
- noHeaderCloseBtn = false,
1935
- className,
1936
- wrapperRef,
1937
- testId = "modal-title"
1938
- }) => {
1939
- const closeModalRef = useRef8(onClose);
1940
- const handleClick = useMemo3(() => () => closeModalRef.current?.(), []);
1941
- useLayoutEffect(() => {
1942
- closeModalRef.current = closeBtnDisable ? void 0 : onClose;
1943
- }, [onClose, closeBtnDisable]);
1944
- return /* @__PURE__ */ jsxs17(
1945
- "header",
1946
- {
1947
- "data-testid": testId,
1948
- ref: wrapperRef,
1949
- className: cn18("modal__header", className, {
1950
- [`modal__header-${variant}`]: variant
1951
- }),
1952
- role: "banner",
1953
- "aria-label": "Modal header",
1954
- children: [
1955
- /* @__PURE__ */ jsx20(
1956
- "span",
1957
- {
1958
- className: cn18("modal__header-title", {
1959
- [`modal__header-${variant}-title`]: variant
1960
- }),
1961
- id: `${testId}-heading`,
1962
- children
1963
- }
1964
- ),
1965
- !isForced && /* @__PURE__ */ jsx20(
1966
- "button",
1967
- {
1968
- type: "button",
1969
- onClick: handleClick,
1970
- className: cn18("modal-close-icon-box", {
1971
- "modal-close-icon-box-primary": variant === "primary",
1972
- "modal-close-icon-box--hidden": noHeaderCloseBtn
1973
- }),
1974
- "aria-label": "Close modal",
1975
- title: "Close modal",
1976
- children: !noHeaderCloseBtn && /* @__PURE__ */ jsx20(X3, { className: "modal-close-icon", role: "img", "aria-hidden": "true" })
1977
- }
1978
- )
1979
- ]
1980
- }
1981
- );
1982
- }
1983
- );
1984
- ModalTitle.displayName = "ModalTitle";
1985
- var ModalTitle_default = ModalTitle;
1986
-
1987
- // src/Atomic/UI/Modal/partials/useMobileModal.tsx
1988
- import { useCallback as useCallback2, useEffect as useEffect14, useLayoutEffect as useLayoutEffect2, useRef as useRef9, useState as useState16 } from "react";
1989
-
1990
- // src/Functions/useIsMobile/useIsMobile.ts
1991
- import { useEffect as useEffect13, useState as useState15 } from "react";
1992
- function useIsMobile({ isWithoutWidthCheck = false } = {}) {
1993
- const isIPad = () => {
1994
- const ua = navigator.userAgent || navigator.vendor || window.opera;
1995
- const isMac = /Macintosh/.test(ua);
1996
- const hasTouch = navigator.maxTouchPoints && navigator.maxTouchPoints > 2;
1997
- return isMac && !!hasTouch;
1998
- };
1999
- const getIsMobile = () => {
2000
- return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) || isIPad();
2001
- };
2002
- const [isMobile, setIsMobile] = useState15(getIsMobile());
2003
- useEffect13(() => {
2004
- if (getIsMobile()) {
2005
- setIsMobile(true);
2006
- }
2007
- }, [navigator.userAgent]);
2008
- return {
2009
- isMobile: isMobile && (isWithoutWidthCheck || window.screen.width <= 768 || window.screen.width <= 1024 && window.matchMedia("(orientation: landscape)").matches),
2010
- isMobilePortrait: isMobile && window.screen.width <= 768 && window.matchMedia("(orientation: portait)").matches,
2011
- isMobileLandscape: isMobile && window.screen.width <= 1024 && window.matchMedia("(orientation: landscape)").matches
2012
- };
2013
- }
2014
- var useIsMobile_default = useIsMobile;
2015
-
2016
- // src/Atomic/UI/Modal/partials/useMobileModal.tsx
2017
- import { jsx as jsx21 } from "react/jsx-runtime";
2018
- var SCROLL_DIRECTION = {
2019
- UP: "up",
2020
- DOWN: "down"
2021
- };
2022
- function useMobileModal({
2023
- modalRef,
2024
- withMobileLogic = false,
2025
- withFixedFooter = false,
2026
- isOpen = false
2027
- }) {
2028
- const modalMobileContainerRef = useRef9(null);
2029
- const modalMobileHeaderRef = useRef9(null);
2030
- const modalMobileFooterRef = useRef9(null);
2031
- const modalMobileBodyRef = useRef9(null);
2032
- const { isMobile } = useIsMobile_default();
2033
- const [modalHeight, setModalHeight] = useState16(0);
2034
- const [modalsLogic, setModalsLogic] = useState16({
2035
- IS_HEADER_HIDDEN: false,
2036
- IS_HEADER_STICKY: false,
2037
- IS_FOOTER_HIDDEN: false,
2038
- IS_FOOTER_STICKY: withFixedFooter
2039
- });
2040
- const [modalsLogicProps, setModalsLogicProps] = useState16({
2041
- headerHeight: 0,
2042
- footerHeight: 0
2043
- });
2044
- const [scrollDirection, setScrollDirection] = useState16(SCROLL_DIRECTION.UP);
2045
- const [scrollTopPrev, setScrollTopPrev] = useState16(0);
2046
- const [scrollTop, setScrollTop] = useState16(0);
2047
- const [scrollHeight, setScrollHeight] = useState16(1);
2048
- const [, setContainerScrollHeight] = useState16(1);
2049
- useLayoutEffect2(() => {
2050
- const el = modalMobileContainerRef?.current;
2051
- if (el) {
2052
- el.addEventListener("scroll", () => {
2053
- setScrollTop((scrollTop2) => {
2054
- if (scrollTop2 !== el.scrollTop) setScrollTopPrev(scrollTop2);
2055
- return el.scrollTop;
2056
- });
2057
- });
2058
- }
2059
- }, [modalMobileContainerRef?.current]);
2060
- useEffect14(() => {
2061
- setScrollDirection(
2062
- (prevScrollDirection) => scrollTop < scrollTopPrev ? SCROLL_DIRECTION.UP : scrollTop > scrollTopPrev ? SCROLL_DIRECTION.DOWN : prevScrollDirection
2063
- );
2064
- }, [scrollTop, scrollTopPrev]);
2065
- useLayoutEffect2(() => {
2066
- if (isOpen) {
2067
- const modalStyle = modalRef?.current ? modalRef?.current.style || window.getComputedStyle(modalRef?.current) : {};
2068
- const computedModalHeight = modalRef?.current ? modalHeight + Number.parseFloat(modalStyle?.marginTop || "0") : 0;
2069
- const windowHeight = document.documentElement.clientHeight || window.screen.availHeight || window.screen.height;
2070
- if (modalMobileContainerRef?.current) {
2071
- if (computedModalHeight <= windowHeight) {
2072
- modalMobileContainerRef.current.style.display = "flex";
2073
- modalMobileContainerRef.current.style.alignItems = "flex-end";
2074
- } else {
2075
- modalMobileContainerRef.current?.style?.removeProperty("display");
2076
- modalMobileContainerRef.current?.style?.removeProperty("align-items");
2077
- }
2078
- }
2079
- }
2080
- }, [modalsLogicProps, isOpen, isMobile, modalHeight]);
2081
- useLayoutEffect2(() => {
2082
- if (isMobile && isOpen) {
2083
- const newModalHeight = modalRef?.current?.getBoundingClientRect()?.height;
2084
- if (newModalHeight && modalHeight !== newModalHeight) {
2085
- setModalHeight(newModalHeight);
2086
- }
2087
- }
2088
- });
2089
- useEffect14(() => {
2090
- if (isMobile && withMobileLogic) {
2091
- const { footerHeight, headerHeight } = modalsLogicProps;
2092
- setModalsLogic((prevStickyLogic) => ({
2093
- IS_HEADER_HIDDEN: scrollDirection === SCROLL_DIRECTION.DOWN || scrollTop === 0,
2094
- IS_HEADER_STICKY: scrollDirection === SCROLL_DIRECTION.UP && scrollTop !== 0 && (scrollTop >= headerHeight || prevStickyLogic.IS_HEADER_STICKY),
2095
- IS_FOOTER_HIDDEN: !withFixedFooter && (scrollDirection === SCROLL_DIRECTION.UP || scrollHeight === Math.round(scrollTop)),
2096
- IS_FOOTER_STICKY: withFixedFooter && scrollHeight > 1 || scrollDirection === SCROLL_DIRECTION.DOWN && (scrollHeight - Math.round(scrollTop) >= footerHeight || prevStickyLogic.IS_FOOTER_STICKY)
2097
- }));
2098
- }
2099
- }, [
2100
- scrollTop,
2101
- scrollHeight,
2102
- isMobile,
2103
- withMobileLogic,
2104
- scrollDirection,
2105
- modalsLogicProps,
2106
- modalHeight,
2107
- window.innerHeight
2108
- ]);
2109
- useLayoutEffect2(() => {
2110
- if (modalMobileHeaderRef?.current?.getBoundingClientRect()?.height !== void 0) {
2111
- setModalsLogicProps((state) => ({
2112
- ...state,
2113
- headerHeight: modalMobileHeaderRef?.current?.getBoundingClientRect()?.height ?? 0
2114
- }));
2115
- }
2116
- }, [modalMobileHeaderRef?.current?.getBoundingClientRect()?.height]);
2117
- useLayoutEffect2(() => {
2118
- if (modalMobileFooterRef?.current?.getBoundingClientRect()?.height !== void 0) {
2119
- setModalsLogicProps((state) => ({
2120
- ...state,
2121
- footerHeight: modalMobileFooterRef?.current?.getBoundingClientRect()?.height ?? 0
2122
- }));
2123
- }
2124
- }, [modalMobileFooterRef?.current?.getBoundingClientRect()?.height]);
2125
- useEffect14(() => {
2126
- if (modalMobileContainerRef?.current) {
2127
- setContainerScrollHeight(modalMobileContainerRef?.current?.scrollHeight);
2128
- setScrollHeight(
2129
- modalMobileContainerRef?.current?.scrollHeight - window.innerHeight
2130
- );
2131
- }
2132
- }, [scrollTop, modalMobileContainerRef?.current, window.innerHeight]);
2133
- useEffect14(() => {
2134
- window.addEventListener("resize", () => {
2135
- setContainerScrollHeight((containerScrollHeight) => {
2136
- setScrollHeight(containerScrollHeight - window.innerHeight);
2137
- return containerScrollHeight;
2138
- });
2139
- });
2140
- }, []);
2141
- const renderModal = useCallback2(
2142
- (modal) => {
2143
- if (!isMobile || !withMobileLogic) return modal;
2144
- return /* @__PURE__ */ jsx21("div", { className: "modal-mobile-container", ref: modalMobileContainerRef, children: modal });
2145
- },
2146
- [isMobile, withMobileLogic]
2147
- );
2148
- return {
2149
- modalMobileContainerRef,
2150
- modalMobileHeaderRef,
2151
- modalMobileBodyRef,
2152
- modalMobileFooterRef,
2153
- MODALS_LOGIC: modalsLogic,
2154
- SCROLL_DIRECTION,
2155
- scrollTop,
2156
- scrollHeight,
2157
- renderModal,
2158
- isMobile
2159
- };
2160
- }
2161
-
2162
- // src/Atomic/UI/Modal/Modal.tsx
2163
- import { Fragment as Fragment4, jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
2164
- var attrsForModalBodyDefault = {};
2165
- var KEY_CODE = Object.freeze({
2166
- ENTER: 13,
2167
- ESC: 27
2168
- });
2169
- function renderModalTitle({
2170
- mode,
2171
- title,
2172
- onlyTitle
2173
- }) {
2174
- if (mode && mode !== "default" && !onlyTitle) {
2175
- return `${mode[0].toUpperCase()}${mode.slice(1)} ${title}`;
2176
- }
2177
- return title;
2178
- }
2179
- function Modal({
2180
- ref,
2181
- id,
2182
- testId = "modal",
2183
- zIndex = 100,
2184
- isOpen,
2185
- onConfirm,
2186
- onDecline,
2187
- closeModal,
2188
- className,
2189
- variant = "primary",
2190
- size,
2191
- mode,
2192
- title,
2193
- onlyTitle,
2194
- atributesForModalBody = attrsForModalBodyDefault,
2195
- confirmBtnClassName,
2196
- confirmBtnLabel,
2197
- confirmBtnVariant = "primary",
2198
- confirmBtnDisable,
2199
- confirmBtnIcon,
2200
- isConfirmBtnIconPositionRight,
2201
- noConfirmBtn,
2202
- forced,
2203
- closeBtnClassName,
2204
- closeBtnText,
2205
- closeBtnVariant,
2206
- closeBtnDisable,
2207
- closeBtnIcon,
2208
- btnClassNames,
2209
- isCloseBtnIconPositionRight,
2210
- noCloseBtn,
2211
- noHeader,
2212
- noHeaderCloseBtn,
2213
- customHeader,
2214
- declineBtnDisable,
2215
- noFooter,
2216
- customFooter,
2217
- withFixedFooter,
2218
- leftContentOfFooter,
2219
- isSubmittingByEnter: isSubmittingByEnterOuter = true,
2220
- isClosingByEsc: isClosingByEscOuter = true,
2221
- withEventManagement = false,
2222
- submitOnEnter,
2223
- closeOnEsc,
2224
- withMobileLogic,
2225
- children
2226
- }) {
2227
- const internalRef = useRef10(null);
2228
- const modalRef = ref || internalRef;
2229
- const onConfirmRef = useRef10(onConfirm);
2230
- const closeModalRef = useRef10(closeModal);
2231
- const onDeclineRef = useRef10(onDecline);
2232
- const isSubmittingByEnter = submitOnEnter === false ? false : isSubmittingByEnterOuter;
2233
- const isClosingByEsc = closeOnEsc === false ? false : isClosingByEscOuter;
2234
- const withEventManagementStructure = getWithEventManagementStructure(id, withEventManagement);
2235
- const isUseAutoBlockingForHandlers = withEventManagementStructure.isWithSubmitAndCloseManagement;
2236
- const isOnConfirmBlocked = typeof onConfirm === "function" && isUseAutoBlockingForHandlers && confirmBtnDisable;
2237
- const isCloseModalBlocked = typeof closeModal === "function" && isUseAutoBlockingForHandlers && closeBtnDisable;
2238
- const isOnDeclineBlocked = typeof onDecline === "function" && isUseAutoBlockingForHandlers && declineBtnDisable;
2239
- const {
2240
- modalMobileHeaderRef,
2241
- modalMobileBodyRef,
2242
- modalMobileFooterRef,
2243
- MODALS_LOGIC,
2244
- renderModal,
2245
- isMobile,
2246
- scrollTop,
2247
- scrollHeight
2248
- } = useMobileModal({
2249
- withMobileLogic,
2250
- withFixedFooter,
2251
- isOpen
2252
- });
2253
- const handle = useMemo4(() => ({
2254
- confirm: () => onConfirmRef.current?.(),
2255
- close: () => closeModalRef.current?.(),
2256
- decline: () => {
2257
- if (typeof onDeclineRef.current === "function") onDeclineRef.current();
2258
- else closeModalRef.current?.();
2259
- }
2260
- }), []);
2261
- const suspendProcessing = {
2262
- // FIN-12482
2263
- // ? Чтобы НЕ замыкать рефку на модалку в логике, чтобы потом поискать в контенте все текстэриа,
2264
- // ? чтобы оценить есть ли среди них сфокусированная - делаем элеГАнтно:
2265
- // ? оцениваем ev.target, и если target это текстэриа, то вот сейчас то она и сфокусирована,
2266
- // ? т.е нужно приостановить процессы связанные с нажатием enter.
2267
- Enter: (ev) => ev?.target?.nodeName === "TEXTAREA"
2268
- // ? Колбеки опциональны, можно передавать только нужные
2269
- // Escape: (ev: globalThis.KeyboardEvent) => false,
2270
- };
2271
- useHandleKeyPress_default({
2272
- enterCallback: isSubmittingByEnter && typeof onConfirm === "function" && !confirmBtnDisable ? handle.confirm : void 0,
2273
- escCallback: isClosingByEsc && typeof closeModal === "function" ? handle.close : void 0,
2274
- withClamping: false,
2275
- withEventManagementStructure: {
2276
- isWithSubmitAndCloseManagement: confirmBtnDisable || withEventManagementStructure.isWithSubmitAndCloseManagement
2277
- },
2278
- suspendProcessing
2279
- });
2280
- useLayoutEffect3(() => {
2281
- onConfirmRef.current = isOnConfirmBlocked ? void 0 : onConfirm;
2282
- }, [onConfirm, isOnConfirmBlocked]);
2283
- useLayoutEffect3(() => {
2284
- closeModalRef.current = isCloseModalBlocked ? void 0 : closeModal;
2285
- }, [closeModal, isCloseModalBlocked]);
2286
- useLayoutEffect3(() => {
2287
- onDeclineRef.current = isOnDeclineBlocked ? () => {
2288
- } : onDecline;
2289
- }, [onDecline, isOnDeclineBlocked]);
2290
- useEffect15(() => {
2291
- const outerTarget = getIsOnlyAnObject(withEventManagement) ? withEventManagement.listenersTarget : void 0;
2292
- const target = outerTarget ?? document;
2293
- const onKeyPress = getOnKeyPress({ id, onSubmit: handle.confirm, onClose: handle.close, suspendProcessing });
2294
- if (withEventManagementStructure.isWithSubmitAndCloseManagement && !!onKeyPress) {
2295
- if (isSubmittingByEnter) target.addEventListener(EVENTS.iGotAnEnterKeyPress.name, onKeyPress);
2296
- if (isClosingByEsc) target.addEventListener(EVENTS.iGotAnEscKeyPress.name, onKeyPress);
2297
- }
2298
- return () => {
2299
- if (withEventManagementStructure.isWithSubmitAndCloseManagement && !!onKeyPress) {
2300
- if (isSubmittingByEnter) target.removeEventListener(EVENTS.iGotAnEnterKeyPress.name, onKeyPress);
2301
- if (isClosingByEsc) target.removeEventListener(EVENTS.iGotAnEscKeyPress.name, onKeyPress);
2302
- }
2303
- };
2304
- }, []);
2305
- if (!isOpen) return null;
2306
- return /* @__PURE__ */ jsx22(
2307
- "div",
2308
- {
2309
- id: `${id}`,
2310
- style: { zIndex },
2311
- "data-testid": testId,
2312
- className: "modal-box j5",
2313
- role: "dialog",
2314
- "aria-modal": "true",
2315
- "aria-labelledby": `${testId}-title`,
2316
- children: renderModal(
2317
- /* @__PURE__ */ jsxs18(Fragment4, { children: [
2318
- /* @__PURE__ */ jsx22(
2319
- "div",
2320
- {
2321
- "data-testid": `${testId}-overlay`,
2322
- className: isOpen ? "modal-overlay" : "hidden",
2323
- onClick: handle.close,
2324
- role: "presentation"
2325
- }
2326
- ),
2327
- /* @__PURE__ */ jsxs18(
2328
- "div",
2329
- {
2330
- ref: modalRef,
2331
- style: { width: typeof size === "number" ? `${size}px` : `${size?.replace("px", "")}px` },
2332
- className: cn19(className, {
2333
- "modal": isOpen,
2334
- "modal--no-header": isOpen && noHeader && !customHeader,
2335
- "modal-mobile": isOpen && isMobile,
2336
- "hidden": !isOpen
2337
- }),
2338
- children: [
2339
- customHeader || !noHeader && /* @__PURE__ */ jsx22(
2340
- ModalTitle_default,
2341
- {
2342
- wrapperRef: modalMobileHeaderRef,
2343
- className: cn19({
2344
- "modal__header--hidden": MODALS_LOGIC.IS_HEADER_HIDDEN,
2345
- "modal__header--sticky": !MODALS_LOGIC.IS_HEADER_HIDDEN && MODALS_LOGIC.IS_HEADER_STICKY
2346
- }),
2347
- variant,
2348
- isForced: forced,
2349
- onClose: handle.close,
2350
- noHeaderCloseBtn,
2351
- children: /* @__PURE__ */ jsx22("span", { id: `${testId}-title`, children: renderModalTitle({ mode, title, onlyTitle }) })
2352
- }
2353
- ),
2354
- /* @__PURE__ */ jsx22(
2355
- "div",
2356
- {
2357
- ...atributesForModalBody,
2358
- ref: modalMobileBodyRef,
2359
- className: cn19("modal__body", {
2360
- "modal__body--no-footer": noFooter
2361
- }),
2362
- role: "document",
2363
- children
2364
- }
2365
- ),
2366
- (!noFooter || customFooter) && /* @__PURE__ */ jsx22(
2367
- ModalFooter_default,
2368
- {
2369
- wrapperRef: modalMobileFooterRef,
2370
- className: cn19({
2371
- "modal__footer--hidden": MODALS_LOGIC.IS_FOOTER_HIDDEN,
2372
- "modal__footer--sticky": !MODALS_LOGIC.IS_FOOTER_HIDDEN && MODALS_LOGIC.IS_FOOTER_STICKY && scrollTop !== scrollHeight,
2373
- "modal__footer_with-left-content": leftContentOfFooter
2374
- }),
2375
- children: customFooter || /* @__PURE__ */ jsxs18(Fragment4, { children: [
2376
- leftContentOfFooter,
2377
- (!noCloseBtn || !noConfirmBtn) && /* @__PURE__ */ jsxs18("div", { className: "modal__buttons-block", children: [
2378
- !noCloseBtn && /* @__PURE__ */ jsx22(
2379
- Button_default,
2380
- {
2381
- testId: "modal",
2382
- className: cn19(closeBtnClassName, btnClassNames),
2383
- variant: closeBtnVariant || "dark-outline",
2384
- onClick: handle.decline,
2385
- label: closeBtnText || "Cancel",
2386
- disabled: typeof onDecline === "function" ? declineBtnDisable : closeBtnDisable,
2387
- icon: closeBtnIcon,
2388
- isIconRight: isCloseBtnIconPositionRight,
2389
- tabIndex: 1,
2390
- "aria-label": "Close modal"
2391
- }
2392
- ),
2393
- !noConfirmBtn && /* @__PURE__ */ jsx22(
2394
- Button_default,
2395
- {
2396
- testId: "modal",
2397
- onClick: handle.confirm,
2398
- label: confirmBtnLabel || mode && mode?.[0].toUpperCase() + mode?.slice(1) || "Apply",
2399
- className: cn19("ml5", confirmBtnClassName, btnClassNames),
2400
- variant: confirmBtnVariant,
2401
- disabled: confirmBtnDisable,
2402
- icon: confirmBtnIcon,
2403
- isIconRight: isConfirmBtnIconPositionRight,
2404
- "aria-label": "Confirm modal"
2405
- }
2406
- )
2407
- ] })
2408
- ] })
2409
- }
2410
- )
2411
- ]
2412
- }
2413
- )
2414
- ] })
2415
- )
2416
- }
2417
- );
2418
- }
2419
- Modal.displayName = "Modal";
2420
- var Modal_default = Modal;
2421
-
2422
- // src/Atomic/UI/Modal/ModalHOC.tsx
2423
- import cn20 from "classnames";
2424
- import { useEffect as useEffect16, useLayoutEffect as useLayoutEffect4, useMemo as useMemo5, useRef as useRef11 } from "react";
2425
- import { jsx as jsx23, jsxs as jsxs19 } from "react/jsx-runtime";
2426
- var ModalHOC = ({
2427
- id,
2428
- zIndex = 100,
2429
- isOpen,
2430
- closeModal,
2431
- closeBtnDisable,
2432
- children,
2433
- className,
2434
- size,
2435
- testId = "modal",
2436
- withEventManagement = false,
2437
- // ! Полностью проигнорируется если в модалку НЕ прокинут id
2438
- // ? isClosingByEsc является явным разрешением/запретом на работу ф-ла,
2439
- // ? в то время как withEventManagement лишь настройка способа реализации этого ф-ла
2440
- isClosingByEsc: isClosingByEscOuter = true,
2441
- closeOnEsc
2442
- }) => {
2443
- const modalRef = useRef11(null);
2444
- const closeModalRef = useRef11(closeModal);
2445
- const isClosingByEsc = closeOnEsc === false ? false : isClosingByEscOuter;
2446
- const withEventManagementStructure = getWithEventManagementStructure(id, withEventManagement);
2447
- const handleClose = useMemo5(() => () => closeModalRef.current?.(), []);
2448
- useHandleKeyPress_default({
2449
- escCallback: isClosingByEsc && typeof closeModal === "function" ? handleClose : void 0,
2450
- withEventManagementStructure
2451
- });
2452
- useLayoutEffect4(() => {
2453
- closeModalRef.current = closeBtnDisable ? void 0 : closeModal;
2454
- }, [closeModal, closeBtnDisable]);
2455
- useEffect16(() => {
2456
- const onKeyPress = getOnKeyPress({ id, onClose: handleClose });
2457
- if (withEventManagementStructure.isWithSubmitAndCloseManagement && !!onKeyPress) {
2458
- if (isClosingByEsc) document.addEventListener(EVENTS.iGotAnEscKeyPress.name, onKeyPress);
2459
- }
2460
- return () => {
2461
- if (withEventManagementStructure.isWithSubmitAndCloseManagement && !!onKeyPress) {
2462
- if (isClosingByEsc) document.removeEventListener(EVENTS.iGotAnEscKeyPress.name, onKeyPress);
2463
- }
2464
- };
2465
- }, []);
2466
- if (!isOpen) return null;
2467
- return /* @__PURE__ */ jsxs19("div", { id: `${id}`, style: { zIndex }, "data-testid": testId, className: "modal-box j5", role: "presentation", children: [
2468
- /* @__PURE__ */ jsx23("div", { className: "modal-overlay", onClick: handleClose, role: "presentation", "aria-hidden": "true" }),
2469
- /* @__PURE__ */ jsx23(
2470
- "div",
2471
- {
2472
- ref: modalRef,
2473
- style: { width: size },
2474
- className: cn20(className, "modal"),
2475
- role: "dialog",
2476
- "aria-modal": "true",
2477
- "aria-labelledby": testId,
2478
- tabIndex: -1,
2479
- children
2480
- }
2481
- )
2482
- ] });
2483
- };
2484
- var ModalHOC_default = ModalHOC;
2485
-
2486
- // src/Atomic/UI/Modal/index.ts
2487
- var Modal_default2 = Modal_default;
2488
-
2489
- // src/Atomic/UI/MonoAccordion/index.ts
2490
- var MonoAccordion_default2 = MonoAccordion_default;
2491
-
2492
- // src/Atomic/UI/PageTitle/PageTitle.tsx
2493
- import cn21 from "classnames";
2494
- import { Home } from "react-feather";
2495
- import { jsx as jsx24, jsxs as jsxs20 } from "react/jsx-runtime";
2496
- var RC5 = "page-title";
2497
- var PageTitle = ({ title, pages, children, testId = RC5 }) => /* @__PURE__ */ jsxs20("div", { "data-testid": testId, className: RC5, role: "region", "aria-label": title, children: [
2498
- /* @__PURE__ */ jsxs20("div", { className: `${RC5}__wrap`, children: [
2499
- /* @__PURE__ */ jsx24("h1", { className: `${RC5}__title`, children: title }),
2500
- pages.length > 0 && /* @__PURE__ */ jsx24("nav", { className: `${RC5}__pages`, "aria-label": "Breadcrumb", children: /* @__PURE__ */ jsxs20("ol", { className: `${RC5}__list`, children: [
2501
- /* @__PURE__ */ jsx24("li", { children: /* @__PURE__ */ jsx24("a", { className: `${RC5}__link`, href: "/", "aria-label": "Home page", children: /* @__PURE__ */ jsx24(Home, { "aria-hidden": "true" }) }) }),
2502
- pages.map(({ name, path }, index) => /* @__PURE__ */ jsxs20("li", { children: [
2503
- /* @__PURE__ */ jsx24("span", { className: `${RC5}__delimiter`, "aria-hidden": "true", children: "/" }),
2504
- pages.length - 1 === index ? /* @__PURE__ */ jsx24("span", { className: cn21(`${RC5}__link`, `${RC5}__link_last`), "aria-current": "page", children: name }) : /* @__PURE__ */ jsx24("a", { className: `${RC5}__link`, href: path, children: name })
2505
- ] }, path))
2506
- ] }) })
2507
- ] }),
2508
- children
2509
- ] });
2510
- var PageTitle_default = PageTitle;
2511
-
2512
- // src/Atomic/UI/PageTitle/index.ts
2513
- var PageTitle_default2 = PageTitle_default;
2514
-
2515
- // src/Atomic/UI/Price/Price.tsx
2516
- import cn22 from "classnames";
2517
-
2518
- // src/Functions/fieldValueFormatters.js
2519
- var getSafelyValue = (value) => value !== void 0 && value !== null ? value?.toString?.() || "" : "";
2520
- var intlNumbersFormatter = (inputValue, settings = {}) => {
2521
- const safelyInputValue = getSafelyValue(inputValue);
2522
- const previousValue = safelyInputValue.slice(0, -1);
2523
- const lastSym = safelyInputValue.slice(-1);
2524
- const value = lastSym === "." ? previousValue : safelyInputValue;
2525
- if (Number.isNaN(Number(value)) || !getSafelyValue(value)) return "";
2526
- const {
2527
- // локаль, даже региональная, влияет на отображение знаков и формата.
2528
- locale = "en-US",
2529
- // percent || currency(default case) || decimal(просто число) влияет на ТИП обработки.
2530
- withSymbol,
2531
- //группировка запятыми поразрядно.
2532
- useGrouping = true,
2533
- //!!работает только при withSymbol: 'currency' !! влияет на то, как именно будет выглядет формат валюты.
2534
- currency = {},
2535
- //сколько знаков после точки, и всегда ли они будут.
2536
- // !!если поставить isAlwaysRender: true, но не дать центов, то будет 100.00
2537
- fractionDigits = {}
2538
- } = settings;
2539
- const { currencyType = "USD", currencyDisplay: inputCurrencyDisplay } = currency;
2540
- let currencyDisplay;
2541
- switch (inputCurrencyDisplay) {
2542
- case "name":
2543
- currencyDisplay = "name";
2544
- break;
2545
- case "code":
2546
- currencyDisplay = "code";
2547
- break;
2548
- case "narrowSymbol":
2549
- currencyDisplay = "narrowSymbol";
2550
- break;
2551
- default:
2552
- currencyDisplay = "symbol";
2553
- }
2554
- let numberStyle;
2555
- switch (withSymbol) {
2556
- case "percent":
2557
- numberStyle = "percent";
2558
- break;
2559
- case "currency":
2560
- numberStyle = "currency";
2561
- break;
2562
- default:
2563
- numberStyle = "decimal";
2564
- break;
2565
- }
2566
- const {
2567
- quantity,
2568
- isRenderAlways = false,
2569
- minimumFractionDigits: inputMinimumFractionDigits,
2570
- maximumFractionDigits: inputMaximumFractionDigits,
2571
- conditionallyMinimumFractionDigits
2572
- } = fractionDigits;
2573
- const dotIndex = safelyInputValue?.indexOf(".");
2574
- const afterDot = dotIndex !== -1 ? safelyInputValue.slice(dotIndex + 1) : "";
2575
- const minimumFractionDigits = (() => {
2576
- if (typeof inputMinimumFractionDigits === "number")
2577
- return inputMinimumFractionDigits;
2578
- if (typeof conditionallyMinimumFractionDigits === "number") {
2579
- return afterDot && lastSym !== "." ? conditionallyMinimumFractionDigits : 0;
2580
- }
2581
- return afterDot && lastSym !== "." ? safelyInputValue.slice(dotIndex).length - 1 : isRenderAlways ? quantity : 0;
2582
- })();
2583
- const priceSettings = {
2584
- useGrouping,
2585
- //группировка разрядов
2586
- style: numberStyle,
2587
- //тип форматирования (валюта или число). decimal - без знака валюты
2588
- currency: currencyType,
2589
- //валюта
2590
- currencyDisplay,
2591
- //валюта в виде символа
2592
- //минимально не надо отображать центы, если их нет, иначе всегда будет .00
2593
- minimumFractionDigits,
2594
- //! Важно! Если придет велью с количеством дробных разрядов БОЛЬШИМ
2595
- //! чем указано в (inputMaximumFractionDigits ?? quantity) - округлит по правилам округления
2596
- //максимально отображать 2 цифры после запятой, если центы всё же есть
2597
- maximumFractionDigits: inputMaximumFractionDigits ?? quantity
2598
- };
2599
- let output;
2600
- try {
2601
- output = new Intl.NumberFormat(locale, priceSettings).format(value);
2602
- } catch (e) {
2603
- output = value;
2604
- console.warn("Intl.NumberFormat error", e);
2605
- }
2606
- return lastSym === "." ? output + lastSym : output;
2607
- };
2608
- var formatToPriceWithUSD = (value) => {
2609
- if (isNaN(Number(value))) return value;
2610
- return intlNumbersFormatter(getSafelyValue(value), {
2611
- withSymbol: "currency",
2612
- currency: { currencyType: "USD" },
2613
- fractionDigits: { quantity: 2, conditionallyMinimumFractionDigits: 2 }
2614
- });
2615
- };
2616
- var formatToPriceWithCurrency = (value, currencyCode, symbolPosition = "before") => {
2617
- if (isNaN(Number(value))) return value;
2618
- return intlNumbersFormatter(getSafelyValue(value), {
2619
- withSymbol: "currency",
2620
- currency: { currencyType: currencyCode },
2621
- fractionDigits: { quantity: 2, conditionallyMinimumFractionDigits: 2 }
2622
- });
2623
- };
2624
-
2625
- // src/Atomic/UI/Price/Price.tsx
2626
- import { jsx as jsx25 } from "react/jsx-runtime";
2627
- var CN3 = "price";
2628
- var Price = ({ value, currencyCode, isSymbolAfter, className, testId = CN3 }) => {
2629
- if (value === void 0 || value === null) return null;
2630
- return /* @__PURE__ */ jsx25(
2631
- "div",
2632
- {
2633
- "data-testid": testId,
2634
- className: cn22(CN3, className),
2635
- role: "contentinfo",
2636
- "aria-label": `Price: ${formatToPriceWithCurrency(value, currencyCode, isSymbolAfter ? "after" : "before")}`,
2637
- children: formatToPriceWithCurrency(value, currencyCode, isSymbolAfter ? "after" : "before")
2638
- }
2639
- );
2640
- };
2641
- var Price_default = Price;
2642
-
2643
- // src/Atomic/UI/Price/index.ts
2644
- var Price_default2 = Price_default;
2645
-
2646
- // src/Atomic/UI/PriceRange/PriceRange.tsx
2647
- import cn23 from "classnames";
2648
- import { jsx as jsx26, jsxs as jsxs21 } from "react/jsx-runtime";
2649
- var CN4 = "price-range";
2650
- var PriceRange = ({ from, to, mode, testId = CN4 }) => {
2651
- return /* @__PURE__ */ jsx26("div", { "data-testid": testId, className: cn23(CN4, "j4"), role: "region", "aria-label": "Price range", children: mode === "simple" ? /* @__PURE__ */ jsxs21("span", { "aria-live": "polite", children: [
2652
- from,
2653
- " - ",
2654
- to
2655
- ] }) : /* @__PURE__ */ jsxs21("span", { "aria-live": "polite", children: [
2656
- formatToPriceWithUSD(from?.toString()),
2657
- " - ",
2658
- formatToPriceWithUSD(to?.toString())
2659
- ] }) });
2660
- };
2661
- var PriceRange_default = PriceRange;
2662
-
2663
- // src/Atomic/UI/PriceRange/index.ts
2664
- var PriceRange_default2 = PriceRange_default;
2665
-
2666
- // src/Atomic/UI/ProgressLine/ProgressLine.tsx
2667
- import cn24 from "classnames";
2668
- import { jsx as jsx27, jsxs as jsxs22 } from "react/jsx-runtime";
2669
- var CN5 = "progress-line";
2670
- var ProgressLine = ({
2671
- label = "",
2672
- labelAlign = "left",
2673
- renderValue = false,
2674
- renderValueInPercents = false,
2675
- valueMeasurement = "",
2676
- valueHorizontalPosition = "right",
2677
- valueVerticalPosition = "center",
2678
- symbolsAfterComma = 0,
2679
- minValue = 0,
2680
- maxValue = 100,
2681
- value = 0,
2682
- showExtremums = false,
2683
- extremumsPosition = "top",
2684
- variant = "info",
2685
- useVariantLabelColor = true,
2686
- isShowLine = true,
2687
- className,
2688
- testId = CN5
2689
- }) => {
2690
- const getFilledLineWidth = () => {
2691
- if (value > maxValue) value = maxValue;
2692
- return `${((value - minValue) * 100 / (maxValue - minValue)).toFixed(symbolsAfterComma)}%`;
2693
- };
2694
- const renderLabel = () => {
2695
- if (!label) return null;
2696
- return /* @__PURE__ */ jsx27("div", { className: `progress-line__wrapper__label align-${labelAlign}`, children: label });
2697
- };
2698
- const renderProgressValue = () => {
2699
- if (!renderValue) return null;
2700
- return /* @__PURE__ */ jsx27("div", { className: "progress-line__wrapper__value", "aria-live": "polite", children: renderValueInPercents ? getFilledLineWidth() : `${addBitDepthPoints(String(value))} ${valueMeasurement}` });
2701
- };
2702
- const renderExtremums = () => {
2703
- if (!showExtremums) return null;
2704
- return /* @__PURE__ */ jsxs22("div", { "aria-hidden": "true", className: `progress-line__wrapper__extremums position-${extremumsPosition}`, children: [
2705
- /* @__PURE__ */ jsx27("div", { className: "progress-line__wrapper__extremums--min", children: renderValueInPercents ? "0 %" : `${minValue} ${valueMeasurement}` }),
2706
- /* @__PURE__ */ jsx27("div", { className: "progress-line__wrapper__extremums--max", children: renderValueInPercents ? "100 %" : `${maxValue} ${valueMeasurement}` })
2707
- ] });
2708
- };
2709
- const renderFilledLine = () => {
2710
- return /* @__PURE__ */ jsx27(
2711
- "div",
2712
- {
2713
- className: "progress-line__wrapper__line--filled",
2714
- role: "progressbar",
2715
- "aria-label": `Progress: ${value} out of ${maxValue}`,
2716
- "aria-valuenow": value,
2717
- "aria-valuemin": minValue,
2718
- "aria-valuemax": maxValue,
2719
- style: { width: getFilledLineWidth() }
2720
- }
2721
- );
2722
- };
2723
- const renderLine = () => {
2724
- return /* @__PURE__ */ jsxs22("div", { className: "progress-line__wrapper__line", children: [
2725
- renderExtremums(),
2726
- renderFilledLine()
2727
- ] });
2728
- };
2729
- return /* @__PURE__ */ jsxs22("div", { className: cn24(CN5, className), "data-testid": testId, role: "region", "aria-label": "Progress line", children: [
2730
- renderLabel(),
2731
- /* @__PURE__ */ jsxs22(
2732
- "div",
2733
- {
2734
- className: `progress-line__wrapper variant-${useVariantLabelColor && variant} value-${valueVerticalPosition}-${valueHorizontalPosition} ${className}`,
2735
- children: [
2736
- renderProgressValue(),
2737
- isShowLine && renderLine()
2738
- ]
2739
- }
2740
- )
2741
- ] });
2742
- };
2743
- var ProgressLine_default = ProgressLine;
2744
-
2745
- // src/Atomic/UI/ProgressLine/index.ts
2746
- var ProgressLine_default2 = ProgressLine_default;
2747
-
2748
- // src/Atomic/UI/Status/Status.tsx
2749
- import cn25 from "classnames";
2750
- import { jsx as jsx28, jsxs as jsxs23 } from "react/jsx-runtime";
2751
- function defaultOnClick2() {
2752
- }
2753
- var Status = ({
2754
- icon,
2755
- value,
2756
- label,
2757
- status,
2758
- disabled,
2759
- type,
2760
- active = 0,
2761
- pause = 0,
2762
- className,
2763
- noBackground,
2764
- children,
2765
- testId = "status",
2766
- onClick = defaultOnClick2
2767
- }) => {
2768
- if (!status) return null;
2769
- const text = children && typeof children === "string" ? children : value || label || status;
2770
- const formattedLabel = text?.[0].toUpperCase() + text?.slice(1);
2771
- return /* @__PURE__ */ jsx28("div", { onClick, "data-testid": testId, className: cn25({ disabled }, className), children: type === "number" ? /* @__PURE__ */ jsx28("div", { children: active === 0 && pause === 0 ? /* @__PURE__ */ jsx28("div", { className: "status status--error", children: /* @__PURE__ */ jsx28("span", { children: active }) }) : /* @__PURE__ */ jsxs23("div", { className: "status status--warning", children: [
2772
- /* @__PURE__ */ jsx28("span", { className: "status--number-active", children: active }),
2773
- /* @__PURE__ */ jsx28("span", { className: "color--gray-gull", children: " / " }),
2774
- /* @__PURE__ */ jsx28("span", { className: pause > 0 ? "color--froly" : "color--gray-gull", children: pause })
2775
- ] }) }) : /* @__PURE__ */ jsxs23(
2776
- "div",
2777
- {
2778
- className: cn25(
2779
- "status",
2780
- `status--${status}`,
2781
- {
2782
- "status--no-bg": noBackground && status === "pause",
2783
- "color--gray-gull": noBackground && status === "pause" && !className,
2784
- "j4": !!icon
2785
- },
2786
- className
2787
- ),
2788
- children: [
2789
- icon,
2790
- formattedLabel
2791
- ]
2792
- }
2793
- ) });
2794
- };
2795
- var Status_default = Status;
2796
-
2797
- // src/Atomic/UI/Status/index.ts
2798
- var Status_default2 = Status_default;
2799
-
2800
- // src/Atomic/UI/Table/Table.js
2801
- import React22 from "react";
2802
- import cn32 from "classnames";
2803
-
2804
- // src/Atomic/UI/Table/Partials/TdHeader.js
2805
- import React16 from "react";
2806
- import cn26 from "classnames";
2807
-
2808
- // src/Langs.js
2809
- var Langs = {
2810
- en: {
2811
- auth: {},
2812
- settings: {},
2813
- labels: {
2814
- industries: "Industries",
2815
- includedLenders: "Included Lenders",
2816
- admin: "Administrator",
2817
- user: "User",
2818
- help: "Help",
2819
- description: "Description",
2820
- value: "Value",
2821
- paramName: "Parameter name(key)",
2822
- active: "Active",
2823
- pause: "Pause",
2824
- error: "Error",
2825
- sold: "Sold",
2826
- processing: "Processing",
2827
- home: "Home",
2828
- goods: "Goods",
2829
- improvement: "Improvement",
2830
- jewelry: "Jewelry",
2831
- firstName: "First Name",
2832
- lastName: "Last Name",
2833
- dateOfBirth: "Date of Birth",
2834
- militaryStatus: "Military status",
2835
- ssn: "SSN",
2836
- lengthAtAddress: "Length At Address",
2837
- rentOrOwn: "Rent or Own",
2838
- zip: "ZIP",
2839
- city: "City",
2840
- state: "State",
2841
- address: "Address",
2842
- email: "E-mail",
2843
- homePhone: "Home Phone",
2844
- cellPhone: "Cell Phone",
2845
- contactTime: "Contact Time",
2846
- dlState: "DL state",
2847
- dlNumber: "DL number",
2848
- ownCar: "Do you own a car?",
2849
- tcpaOptin: "TCPA OPTIN",
2850
- incomeSource: "Income Source",
2851
- timeEmployed: "Time Employed",
2852
- jobTitle: "Job Title",
2853
- currentEmployer: "Current Employer",
2854
- employersPhone: "Employer's Phone",
2855
- netMonthlyIncome: "Net monthly income",
2856
- howOftenIsPaid: "How often is paid",
2857
- nextPayDate: "Next Pay Date",
2858
- secondPayDate: "Second Pay Date",
2859
- loanAmount: "Loan amount",
2860
- ip: "IP",
2861
- storyName: "Story name",
2862
- channelName: "Channel name",
2863
- employmentInfo: "Employment Information",
2864
- personalDetails: "Personal Details",
2865
- offer: "Offer",
2866
- offers: "Offers",
2867
- status: "Status",
2868
- name: "Name",
2869
- from: "From",
2870
- to: "to",
2871
- periodMonths: "Period (months)",
2872
- loansSent: "Loans Sent",
2873
- approved: "Approved",
2874
- rejected: "Rejected",
2875
- loanAmountApproved: "Loan Amount Approved ($)",
2876
- loanAmountRejected: "Loan Amount Rejected ($)",
2877
- approveRate: "Approve Rate (%)",
2878
- actions: "Actions",
2879
- locations: "Locations",
2880
- score: "Score",
2881
- priority: "Priority",
2882
- lender: "Lender",
2883
- weight: "Weight",
2884
- selectLender: "Select lender"
2885
- },
2886
- singulars: {},
2887
- titles: {
2888
- pingTree: "Ping tree",
2889
- edit: "Edit",
2890
- create: "Create",
2891
- add: "Add",
2892
- consumerInfo: "Consumer info",
2893
- personalDetails: "Personal Details",
2894
- employmentInfo: "Employment Information",
2895
- tools: "Tools",
2896
- lenders: "Lenders",
2897
- settings: "Settings",
2898
- dashboard: "Dashboard",
2899
- consumers: "Consumers",
2900
- ticketDesk: "Ticket desk",
2901
- accounting: "Accounting",
2902
- users: "Users",
2903
- merchants: "Merchants",
2904
- lenderPingTree: "Lender Ping Tree",
2905
- reports: "Reports",
2906
- leads: "Leads",
2907
- location: "Location",
2908
- mainMenu: "Main menu",
2909
- partners: "Partners",
2910
- other: "Other",
2911
- homeGoodsAndInteriorDesign: "Home Goods and Interior Design"
2912
- },
2913
- placeholders: {
2914
- typeName: "Type name",
2915
- params: "Params placeholder",
2916
- value: "Value placeholder",
2917
- description: "Description placeholder"
2918
- },
2919
- hints: {
2920
- landerNotIncluded: "Lender is not included in Ping Tree by the \u201CHome Goods\u201D industry",
2921
- noMerchants: "No Merchants for the \u201CHome Goods\u201D industry"
2922
- },
2923
- buttons: {
2924
- create: "Create",
2925
- edit: "Edit",
2926
- add: "Add",
2927
- close: "Close",
2928
- apply: "Apply",
2929
- pingTree: "Ping tree",
2930
- addRow: "Add row",
2931
- consumerInfo: "Consumer Info",
2932
- deletePingTree: "Delete Ping Tree",
2933
- cancel: "Cancel"
2934
- },
2935
- radioButtons: {},
2936
- weekDays: {
2937
- su: "Su",
2938
- mo: "Mo",
2939
- tu: "Tu",
2940
- we: "We",
2941
- th: "Th",
2942
- fr: "Fr",
2943
- sa: "Sa"
2944
- },
2945
- alerts: {
2946
- lendersWillBeRemoved: "lenders will be removed"
2947
- },
2948
- checkboxes: {
2949
- homeGoods: "Home Goods",
2950
- travel: "Travel",
2951
- energyImprovement: "Energy Improvement",
2952
- jewelryIncluded: "Jewelry (included in PingTree name 2)",
2953
- jewelry: "Jewelry",
2954
- autoRepair: "Auto Repair",
2955
- cosmetics: "Cosmetics",
2956
- health: "Health"
2957
- },
2958
- errors: {},
2959
- texts: {},
2960
- tabs: {
2961
- general: "General",
2962
- payments: "Payments",
2963
- filters: "Filters",
2964
- offers: "Offers",
2965
- merchants: "Merchants",
2966
- integration: "Integration",
2967
- customDetails: "Custom details",
2968
- customerDetails: "Customer details",
2969
- postsLog: "Posts log"
2970
- },
2971
- toasts: {}
2972
- }
2973
- };
2974
- var Langs_default = Langs;
2975
-
2976
- // src/Atomic/UI/Table/Partials/TdHeader.js
2977
- import { jsx as jsx29, jsxs as jsxs24 } from "react/jsx-runtime";
2978
- var TdHeader = ({ item, testId = "td-header" }) => {
2979
- const txt = Langs_default[global.lng];
2980
- switch (item.type) {
2981
- case "double":
2982
- return /* @__PURE__ */ jsx29("th", { "data-testid": testId, children: /* @__PURE__ */ jsxs24("div", { className: "j46", children: [
2983
- /* @__PURE__ */ jsx29("div", { className: "", children: txt.labels[item.left] || item.left }),
2984
- /* @__PURE__ */ jsx29("div", { className: "", children: txt.labels[item.right] || item.right })
2985
- ] }) });
2986
- default:
2987
- return /* @__PURE__ */ jsx29("th", { "data-testid": testId, className: cn26(item.className), children: /* @__PURE__ */ jsxs24("div", { className: cn26({ df: item.button }), children: [
2988
- /* @__PURE__ */ jsx29("div", { className: "mr5", children: txt.labels[item.label] || item.label }),
2989
- item.button && /* @__PURE__ */ jsx29("div", { className: "cards-table__btn", children: txt.buttons[item.button] || item.button })
2990
- ] }) });
2991
- }
2992
- };
2993
- var TdHeader_default = TdHeader;
2994
-
2995
- // src/Atomic/UI/Table/Partials/TdRow.js
2996
- import React21, { useState as useState21 } from "react";
2997
- import cn31 from "classnames";
2998
-
2999
- // src/Atomic/UI/Table/TdTypes/TdRange.js
3000
- import { jsx as jsx30, jsxs as jsxs25 } from "react/jsx-runtime";
3001
- var TdRange = ({ item }) => {
3002
- if (!item) return false;
3003
- return /* @__PURE__ */ jsxs25("div", { children: [
3004
- /* @__PURE__ */ jsx30("span", { children: item.from }),
3005
- /* @__PURE__ */ jsx30("span", { children: " - " }),
3006
- /* @__PURE__ */ jsx30("span", { children: item.to })
3007
- ] });
3008
- };
3009
- var TdRange_default = TdRange;
3010
-
3011
- // src/Atomic/UI/Table/Partials/TdCell.js
3012
- import React20, { useState as useState20 } from "react";
3013
-
3014
- // src/Atomic/UI/Accordion/AccordionItem.tsx
3015
- import cn27 from "classnames";
3016
- import { useEffect as useEffect17, useRef as useRef12, useState as useState17 } from "react";
3017
- import * as Icons from "react-feather";
3018
- import { jsx as jsx31, jsxs as jsxs26 } from "react/jsx-runtime";
3019
- var DefaultLink = ({ to, className, children }) => /* @__PURE__ */ jsx31("a", { href: to, className, children });
3020
- var AccordionItem = ({
3021
- item,
3022
- onClick,
3023
- isOpen,
3024
- className,
3025
- children,
3026
- noChevron,
3027
- linkComponent: LinkComponent = DefaultLink,
3028
- testId = "accordion-item"
3029
- }) => {
3030
- const Icon = Icons[item.icon];
3031
- const [maxHeight, setMaxHeight] = useState17(0);
3032
- const ref = useRef12(null);
3033
- const getItemsHeight = () => {
3034
- let itemHeight = 0;
3035
- ref.current?.childNodes.forEach((el) => {
3036
- itemHeight += el.offsetHeight;
3037
- });
3038
- return itemHeight + 20;
3039
- };
3040
- useEffect17(() => {
3041
- setMaxHeight(isOpen ? getItemsHeight() : 0);
3042
- }, [isOpen]);
3043
- const calculateStatusCount = () => {
3044
- return item?.rows?.reduce(
3045
- (acc, row) => {
3046
- const result = row.cols.reduce(
3047
- (accum, col) => ({
3048
- active: accum.active + (col.status === "active" ? 1 : 0),
3049
- pause: accum.pause + (col.status === "pause" ? 1 : 0)
3050
- }),
3051
- { active: 0, pause: 0 }
3052
- );
3053
- return {
3054
- active: acc.active + result.active,
3055
- pause: acc.pause + result.pause
3056
- };
3057
- },
3058
- { active: 0, pause: 0 }
3059
- );
3060
- };
3061
- return /* @__PURE__ */ jsxs26(
3062
- "div",
3063
- {
3064
- "data-testid": testId,
3065
- className: cn27("accordion--item", className),
3066
- role: "region",
3067
- "aria-labelledby": `accordion-title-${item.title}`,
3068
- children: [
3069
- /* @__PURE__ */ jsxs26(
3070
- "div",
3071
- {
3072
- className: cn27("accordion--title-box", {
3073
- "accordion--title-open": isOpen
3074
- }),
3075
- onClick: () => onClick(!isOpen),
3076
- id: `accordion-title-${item.title}`,
3077
- role: "button",
3078
- "aria-expanded": isOpen,
3079
- "aria-controls": `accordion-content-${item.title}`,
3080
- tabIndex: 0,
3081
- children: [
3082
- /* @__PURE__ */ jsxs26("div", { className: "j4 no-wrap", children: [
3083
- item?.icon && /* @__PURE__ */ jsx31(Icon, { className: cn27("mr5", item?.className), "aria-hidden": "true" }),
3084
- /* @__PURE__ */ jsx31("span", { className: "accordion--title", children: item.title || "Menu Chapter" })
3085
- ] }),
3086
- /* @__PURE__ */ jsxs26("div", { className: "j6 accordion-title__right-box", children: [
3087
- item.status && /* @__PURE__ */ jsx31("div", { className: "mr5", children: /* @__PURE__ */ jsx31(
3088
- Status_default2,
3089
- {
3090
- type: item?.status.type,
3091
- value: item?.status.value,
3092
- status: item?.status.status,
3093
- active: calculateStatusCount()?.active,
3094
- pause: calculateStatusCount()?.pause
3095
- }
3096
- ) }),
3097
- !noChevron && /* @__PURE__ */ jsx31(
3098
- Icons.ChevronRight,
3099
- {
3100
- "aria-hidden": "true",
3101
- className: cn27("accordion--title-chevron", {
3102
- "accordion--title-chevron-open": isOpen
3103
- })
3104
- }
3105
- )
3106
- ] })
3107
- ]
3108
- }
3109
- ),
3110
- /* @__PURE__ */ jsx31(
3111
- "div",
3112
- {
3113
- ref,
3114
- style: { maxHeight },
3115
- className: cn27("accordion--content", {
3116
- "accordion--content-is-open": isOpen
3117
- }),
3118
- id: `accordion-content-${item.title}`,
3119
- role: "region",
3120
- "aria-labelledby": `accordion-title-${item.title}`,
3121
- children: item.children ? item.children.map((el) => {
3122
- return /* @__PURE__ */ jsx31(LinkComponent, { to: el.link, className: "accordion--content-item accordion--menu-link", children: el?.title || "Menu item" }, el.id);
3123
- }) : children
3124
- }
3125
- )
3126
- ]
3127
- }
3128
- );
3129
- };
3130
- var AccordionItem_default = AccordionItem;
3131
-
3132
- // src/Atomic/UI/Table/TdTypes/TdActions.js
3133
- import React18, { useState as useState18 } from "react";
3134
- import * as Icons2 from "react-feather";
3135
-
3136
- // src/Atomic/FormElements/Switcher/Switcher.tsx
3137
- import cn28 from "classnames";
3138
- import { jsx as jsx32, jsxs as jsxs27 } from "react/jsx-runtime";
3139
- var RC6 = "switcher";
3140
- var Switcher = ({
3141
- label,
3142
- className,
3143
- isActive,
3144
- disabled,
3145
- onChange,
3146
- isLabelBold,
3147
- hint,
3148
- hintSide,
3149
- testId = "switcher"
3150
- }) => {
3151
- return /* @__PURE__ */ jsxs27(
3152
- "div",
3153
- {
3154
- "data-testid": testId,
3155
- className: cn28(RC6, className, { [`${RC6}_disabled`]: disabled }),
3156
- children: [
3157
- /* @__PURE__ */ jsxs27(
3158
- "button",
3159
- {
3160
- type: "button",
3161
- "data-testid": `${testId}-button`,
3162
- className: cn28(`${RC6}__button`),
3163
- disabled,
3164
- onClick: (e) => onChange(!isActive, e),
3165
- children: [
3166
- /* @__PURE__ */ jsx32(
3167
- "div",
3168
- {
3169
- className: cn28(`${RC6}__button-content`, {
3170
- [`${RC6}__button-content_active`]: isActive
3171
- }),
3172
- children: /* @__PURE__ */ jsx32("div", { className: `${RC6}__ball` })
3173
- }
3174
- ),
3175
- label && /* @__PURE__ */ jsx32(
3176
- "span",
3177
- {
3178
- className: cn28(`${RC6}__label`, {
3179
- [`${RC6}__label_bold`]: isLabelBold
3180
- }),
3181
- children: label
3182
- }
3183
- )
3184
- ]
3185
- }
3186
- ),
3187
- hint && /* @__PURE__ */ jsx32(Hint_default, { className: `${RC6}__hint`, hint, side: hintSide })
3188
- ]
3189
- }
3190
- );
3191
- };
3192
- var Switcher_default = Switcher;
3193
-
3194
- // src/Atomic/UI/Table/TdTypes/TdActions.js
3195
- import { jsx as jsx33 } from "react/jsx-runtime";
3196
- var TdActions = ({ actions, onChange, onActionClick, rowItem }) => {
3197
- if (!actions) return false;
3198
- const [state, setState] = useState18(actions);
3199
- const handleArrayChange = (value, index, prop) => {
3200
- state[index][prop] = value;
3201
- setState([...state]);
3202
- onChange(state);
3203
- };
3204
- return /* @__PURE__ */ jsx33("div", { className: "j6", children: actions?.map((action, index) => {
3205
- switch (action.type) {
3206
- case "download":
3207
- return /* @__PURE__ */ jsx33(
3208
- "div",
3209
- {
3210
- className: "td-actions--item td-actions--download",
3211
- onClick: () => {
3212
- },
3213
- children: /* @__PURE__ */ jsx33(Icons2.Download, {})
3214
- },
3215
- index
3216
- );
3217
- case "edit":
3218
- return /* @__PURE__ */ jsx33(
3219
- "div",
3220
- {
3221
- className: "td-actions--item td-actions--edit",
3222
- onClick: () => {
3223
- },
3224
- children: /* @__PURE__ */ jsx33(Icons2.Edit3, {})
3225
- },
3226
- index
3227
- );
3228
- case "delete":
3229
- return /* @__PURE__ */ jsx33(
3230
- "div",
3231
- {
3232
- className: "td-actions--item td-actions--delete",
3233
- onClick: () => onActionClick("delete", rowItem),
3234
- children: /* @__PURE__ */ jsx33(Icons2.Trash2, {})
3235
- },
3236
- index
3237
- );
3238
- case "undo":
3239
- return /* @__PURE__ */ jsx33(
3240
- "div",
3241
- {
3242
- className: "td-actions--item td-actions--undo",
3243
- onClick: () => onActionClick("undo", rowItem),
3244
- children: /* @__PURE__ */ jsx33(Icons2.RotateCcw, {})
3245
- },
3246
- index
3247
- );
3248
- case "switcher":
3249
- return /* @__PURE__ */ jsx33("div", { className: "df", children: /* @__PURE__ */ jsx33(
3250
- Switcher_default,
3251
- {
3252
- label: action.label || null,
3253
- isActive: action?.value,
3254
- onChange: (e) => handleArrayChange(e, index, "value")
3255
- }
3256
- ) }, index);
3257
- default:
3258
- return null;
3259
- }
3260
- }) });
3261
- };
3262
-
3263
- // src/Atomic/UI/Table/TdTypes/TdPriority.js
3264
- import React19 from "react";
3265
- import cn29 from "classnames";
3266
- import { ArrowDown as ArrowDown2, ArrowUp as ArrowUp2 } from "react-feather";
3267
- import { jsx as jsx34, jsxs as jsxs28 } from "react/jsx-runtime";
3268
- var TdPriority = ({ onClick, rowIndex, cardLength }) => {
3269
- return /* @__PURE__ */ jsxs28("div", { className: "cards-table__priority", children: [
3270
- /* @__PURE__ */ jsx34("span", { className: "mr5", children: rowIndex + 1 }),
3271
- /* @__PURE__ */ jsxs28("div", { className: "df", children: [
3272
- /* @__PURE__ */ jsx34(
3273
- ArrowDown2,
3274
- {
3275
- onClick: () => onClick(rowIndex),
3276
- className: cn29("table--icon", {
3277
- disabled: rowIndex + 1 === cardLength
3278
- })
3279
- }
3280
- ),
3281
- /* @__PURE__ */ jsx34(
3282
- ArrowUp2,
3283
- {
3284
- onClick: () => onClick(rowIndex, true),
3285
- className: cn29("table--icon", { disabled: rowIndex === 0 })
3286
- }
3287
- )
3288
- ] })
3289
- ] });
3290
- };
3291
- var TdPriority_default = TdPriority;
3292
-
3293
- // src/Atomic/UI/Table/TdTypes/TdWeight.js
3294
- import { useEffect as useEffect18, useState as useState19 } from "react";
3295
- import cn30 from "classnames";
3296
- import { Fragment as Fragment5, jsx as jsx35, jsxs as jsxs29 } from "react/jsx-runtime";
3297
- var TdWeight = ({ value, percent, onChange, className }) => {
3298
- const [state, setState] = useState19(value);
3299
- const {
3300
- isToggled: isEdited,
3301
- toggleOff: unsetIsEdited,
3302
- toggleOn: setIsEdited
3303
- } = useOutsideToggle(false);
3304
- useEffect18(() => {
3305
- setState(value);
3306
- }, [value, isEdited]);
3307
- const handleKeyUp = ({ keyCode, target }) => {
3308
- if (keyCode === KEY_CODE.ENTER) {
3309
- const newValue = Number(target.value) || 1;
3310
- onChange(newValue);
3311
- unsetIsEdited();
3312
- }
3313
- };
3314
- return /* @__PURE__ */ jsx35(Fragment5, { children: isEdited ? /* @__PURE__ */ jsx35(
3315
- Input,
3316
- {
3317
- value: state,
3318
- onChange: (e) => setState(e),
3319
- onBlur: unsetIsEdited,
3320
- onKeyUp: handleKeyUp,
3321
- autoFocus: true
3322
- }
3323
- ) : /* @__PURE__ */ jsxs29("div", { className: cn30("td-weight", className), onClick: setIsEdited, children: [
3324
- /* @__PURE__ */ jsx35("span", { children: value }),
3325
- /* @__PURE__ */ jsxs29("span", { className: "ml2 color--grey-gull", children: [
3326
- "(",
3327
- percent,
3328
- "%)"
3329
- ] })
3330
- ] }) });
3331
- };
3332
- var TdWeight_default = TdWeight;
3333
-
3334
- // src/Atomic/UI/Table/Partials/TdCell.js
3335
- import { jsx as jsx36 } from "react/jsx-runtime";
3336
- var TdCell = ({
3337
- type,
3338
- item,
3339
- rowIndex,
3340
- onChange,
3341
- cardLength,
3342
- changePriority,
3343
- getAdviceWeight,
3344
- onActionClick,
3345
- rowItem,
3346
- isDeleted
3347
- }) => {
3348
- const [isAccordionOpen, setIsAccordionOpen] = useState20(item.isOpen);
3349
- const percent = item.type === "weight" && getAdviceWeight(isDeleted ? 0 : item.value);
3350
- switch (type) {
3351
- case "accordion":
3352
- return /* @__PURE__ */ jsx36(
3353
- AccordionItem_default,
3354
- {
3355
- className: item.itemClassName,
3356
- item,
3357
- isOpen: isAccordionOpen,
3358
- onClick: (e) => setIsAccordionOpen(e),
3359
- children: /* @__PURE__ */ jsx36(Table_default, { rows: item.rows, className: "accordion--table" })
3360
- }
3361
- );
3362
- case "actions":
3363
- return /* @__PURE__ */ jsx36(
3364
- TdActions,
3365
- {
3366
- rowItem,
3367
- actions: item,
3368
- onChange,
3369
- onActionClick
3370
- }
3371
- );
3372
- case "advancedTags":
3373
- return /* @__PURE__ */ jsx36(AdvancedTags_default, { items: item });
3374
- case "link":
3375
- return /* @__PURE__ */ jsx36("a", { href: item.link, children: item.label });
3376
- case "priority":
3377
- return /* @__PURE__ */ jsx36(
3378
- TdPriority_default,
3379
- {
3380
- rowIndex,
3381
- cardLength,
3382
- onClick: changePriority
3383
- }
3384
- );
3385
- case "status":
3386
- return /* @__PURE__ */ jsx36(
3387
- Status_default,
3388
- {
3389
- className: item.className,
3390
- label: item.label,
3391
- status: item.status
3392
- }
3393
- );
3394
- case "tags":
3395
- return item.map((tag, index) => /* @__PURE__ */ jsx36(Tag_default, { label: tag.label }, index));
3396
- case "weight":
3397
- return /* @__PURE__ */ jsx36(
3398
- TdWeight_default,
3399
- {
3400
- value: item.value,
3401
- percent,
3402
- onChange: (value) => onChange({ ...item, value })
3403
- }
3404
- );
3405
- default:
3406
- return /* @__PURE__ */ jsx36("span", { className: item.className, children: item.value });
3407
- }
3408
- };
3409
- var TdCell_default = TdCell;
3410
-
3411
- // src/Atomic/UI/Table/Partials/TdRow.js
3412
- import { Fragment as Fragment6, jsx as jsx37, jsxs as jsxs30 } from "react/jsx-runtime";
3413
- var TdRow = ({
3414
- item,
3415
- onChange,
3416
- rowIndex,
3417
- cardStatus,
3418
- range,
3419
- type,
3420
- rowSpan,
3421
- colSpan,
3422
- cardLength,
3423
- changePriority,
3424
- getAdviceWeight,
3425
- onActionClick,
3426
- isDeleted,
3427
- testId = "td-row"
3428
- }) => {
3429
- const [isOpen, setIsOpen] = useState21(false);
3430
- const handleChange = handleObjectChange(item, () => onChange({ ...item }));
3431
- return /* @__PURE__ */ jsxs30(Fragment6, { children: [
3432
- /* @__PURE__ */ jsxs30("tr", { "data-testid": testId, children: [
3433
- type && rowSpan && /* @__PURE__ */ jsx37("td", { className: "rel", rowSpan: rowSpan + 1, children: /* @__PURE__ */ jsx37(
3434
- "span",
3435
- {
3436
- className: cn31(
3437
- type && `cards-table__score cards-table__score-${cardStatus}`
3438
- ),
3439
- children: /* @__PURE__ */ jsx37(TdRange_default, { item: range })
3440
- }
3441
- ) }),
3442
- Object.entries(item).map(
3443
- ([key, value]) => key === "id" || key === "isDeleted" ? null : /* @__PURE__ */ jsx37(
3444
- "td",
3445
- {
3446
- className: cn31("cards-table__body-item", {
3447
- "cards-table__accordion": value.type === "accordion"
3448
- }),
3449
- children: /* @__PURE__ */ jsx37(
3450
- TdCell_default,
3451
- {
3452
- onActionClick,
3453
- changePriority,
3454
- cardLength,
3455
- rowIndex,
3456
- rowItem: item,
3457
- type: key,
3458
- item: value,
3459
- onChange: (newValue) => handleChange(newValue, key),
3460
- getAdviceWeight,
3461
- isDeleted
3462
- }
3463
- )
3464
- },
3465
- key
3466
- )
3467
- )
3468
- ] }),
3469
- type && colSpan ? /* @__PURE__ */ jsxs30("tr", { children: [
3470
- /* @__PURE__ */ jsx37("td", {}),
3471
- /* @__PURE__ */ jsxs30("td", { colSpan, children: [
3472
- /* @__PURE__ */ jsx37(
3473
- "span",
3474
- {
3475
- className: "cards-table__title-select-lender-btn",
3476
- onClick: () => setIsOpen(true),
3477
- children: "Select Lender"
3478
- }
3479
- ),
3480
- /* @__PURE__ */ jsx37(
3481
- Modal_default,
3482
- {
3483
- closeModal: () => setIsOpen(false),
3484
- isOpen,
3485
- title: "Choose Lender",
3486
- size: "420",
3487
- children: "test"
3488
- }
3489
- )
3490
- ] })
3491
- ] }) : null
3492
- ] });
3493
- };
3494
- var TdRow_default = TdRow;
3495
-
3496
- // src/Atomic/UI/Table/Table.js
3497
- import { jsx as jsx38, jsxs as jsxs31 } from "react/jsx-runtime";
3498
- var Table = ({
3499
- rows,
3500
- onChange,
3501
- className,
3502
- header,
3503
- onActionClick,
3504
- testId = "table"
3505
- }) => {
3506
- const handleArrayChange = (value, index) => {
3507
- rows[index] = value;
3508
- onChange({ header: [...header], rows: [...rows] });
3509
- };
3510
- return /* @__PURE__ */ jsx38(
3511
- "div",
3512
- {
3513
- "data-testid": testId,
3514
- className: cn32("simple-table", {
3515
- [`simple-table--${className}`]: className
3516
- }),
3517
- children: /* @__PURE__ */ jsxs31("table", { children: [
3518
- /* @__PURE__ */ jsx38("thead", { children: /* @__PURE__ */ jsx38("tr", { children: header?.map((item) => /* @__PURE__ */ jsx38(TdHeader_default, { item }, item.key)) }) }),
3519
- /* @__PURE__ */ jsx38("tbody", { children: rows && rows?.length ? rows?.map((row, index) => /* @__PURE__ */ jsx38(
3520
- TdRow_default,
3521
- {
3522
- onActionClick,
3523
- rowIndex: index,
3524
- item: row,
3525
- header,
3526
- onChange: (value) => handleArrayChange(value, index)
3527
- },
3528
- typeof row.id === "object" ? row.id.value : row.id
3529
- )) : /* @__PURE__ */ jsx38("tr", { children: /* @__PURE__ */ jsx38("td", { className: "row--not-found", colSpan: header?.length, children: "Not set" }) }) })
3530
- ] })
3531
- }
3532
- );
3533
- };
3534
- var Table_default = Table;
3535
-
3536
- // src/Atomic/UI/Tag/index.ts
3537
- var Tag_default2 = Tag_default;
3538
-
3539
- // src/Atomic/UI/TagList/TagList.tsx
3540
- import cn33 from "classnames";
3541
- import {
3542
- createRef,
3543
- useEffect as useEffect19,
3544
- useLayoutEffect as useLayoutEffect5,
3545
- useRef as useRef13,
3546
- useState as useState22
3547
- } from "react";
3548
- import { Edit3 as Edit32 } from "react-feather";
3549
- import { jsx as jsx39, jsxs as jsxs32 } from "react/jsx-runtime";
3550
- var TagList = ({
3551
- disabled,
3552
- className,
3553
- onTagClick,
3554
- removeItem,
3555
- items,
3556
- withToggle = true,
3557
- disableShowMore = false,
3558
- shownItemsCount = "auto",
3559
- testId = "test-taglist",
3560
- refProp,
3561
- renderOrder,
3562
- onEditClick,
3563
- onToggleRenderAll,
3564
- isUseInTable
3565
- }) => {
3566
- const wrapperRef = useRef13(null);
3567
- const [tagList, setTagList] = useState22([]);
3568
- const [staticTagsCount, setStaticTagsCount] = useState22(-1);
3569
- const [renderItemsCount, setRenderItemsCount] = useState22(-1);
3570
- const [renderAll, setRenderAll] = useState22(!withToggle);
3571
- const wrapperWidth = wrapperRef?.current?.getBoundingClientRect()?.width ?? -1;
3572
- const setRenderAllInterceptor = (v, event) => {
3573
- setRenderAll(v);
3574
- onToggleRenderAll?.(v);
3575
- event?.stopPropagation();
3576
- event?.preventDefault();
3577
- };
3578
- const getStaticTagsCount = (computedWidth) => {
3579
- if (typeof shownItemsCount === "number") return shownItemsCount;
3580
- const delta = typeof onEditClick === "function" ? 60 : 32;
3581
- const result = tagList.reduce((result2, { itemRef }, index) => {
3582
- if (result2.skip) return result2;
3583
- const itemStyle = itemRef?.current && window.getComputedStyle(itemRef.current);
3584
- const itemWidth = [
3585
- Number.parseInt((itemRef.current?.getBoundingClientRect()?.width ?? 0).toString(), 10),
3586
- Number.parseInt((itemStyle?.marginLeft ?? 0).toString(), 10),
3587
- Number.parseInt((itemStyle?.marginRight ?? 0).toString(), 10)
3588
- ].reduce((result3, item) => {
3589
- if (!Number.isNaN(item)) result3 += item;
3590
- return result3;
3591
- }, 0);
3592
- if (!Number.isNaN(itemWidth) && itemWidth > 0 && itemWidth + result2.width < computedWidth - delta || index === 0) {
3593
- result2 = {
3594
- count: result2.count + 1,
3595
- width: result2.width + itemWidth,
3596
- items: [...result2.items, { w: itemWidth, r: itemRef?.current }]
3597
- };
3598
- } else {
3599
- result2.skip = true;
3600
- }
3601
- return result2;
3602
- }, { count: 0, width: 0, items: [], skip: false });
3603
- if (result?.items?.length === 1 && result.items[0].r && tagList.length > 1) {
3604
- result.items[0].r.style.maxWidth = `${computedWidth - delta - 8}px`;
3605
- }
3606
- return result?.count;
3607
- };
3608
- const cancelDefault = (_e, cb) => {
3609
- cb?.();
3610
- };
3611
- const renderTags = () => {
3612
- const tagsRenderOrder = renderOrder ?? tagList.map(({ value, id }) => id ?? value);
3613
- return tagsRenderOrder.map((v, i) => {
3614
- const item = tagList.find(({ value, id }) => {
3615
- if (id) return id === v;
3616
- if (value) return value === v;
3617
- return false;
3618
- });
3619
- if (!item) return null;
3620
- const isHidden = renderItemsCount !== -1 && staticTagsCount !== -1 ? i >= renderItemsCount : false;
3621
- return /* @__PURE__ */ jsx39(
3622
- "div",
3623
- {
3624
- className: `tag-list_wrapper_item ${isHidden ? "tag-list_wrapper_item--hidden" : ""}`,
3625
- ref: checkedRef(item?.itemRef),
3626
- children: /* @__PURE__ */ jsx39(
3627
- Tag_default,
3628
- {
3629
- testId: `test-taglist-item-${item?.id ?? item?.value}`,
3630
- ...item,
3631
- onClick: onTagClick,
3632
- removeItem,
3633
- isUseInTable
3634
- }
3635
- )
3636
- },
3637
- `tag-list-item-${item?.id ?? item?.value}`
3638
- );
3639
- });
3640
- };
3641
- const renderMoreTags = () => {
3642
- if (typeof shownItemsCount === "number" && tagList?.length < shownItemsCount || !tagList?.length || disableShowMore) {
3643
- return null;
3644
- }
3645
- const restItems = tagList.length - renderItemsCount;
3646
- if (restItems === 0 || !withToggle || staticTagsCount === -1) return null;
3647
- return /* @__PURE__ */ jsx39(
3648
- Tag_default,
3649
- {
3650
- label: `+${restItems}`,
3651
- className: "tag-list_wrapper_render-more",
3652
- onClick: disableShowMore ? () => {
3653
- } : (value, event) => cancelDefault(value, () => setRenderAllInterceptor(true, event)),
3654
- isUseInTable
3655
- }
3656
- );
3657
- };
3658
- const renderHideTags = () => {
3659
- if (renderItemsCount !== tagList?.length || !withToggle || staticTagsCount === -1 || staticTagsCount === tagList?.length) {
3660
- return null;
3661
- }
3662
- return /* @__PURE__ */ jsx39(
3663
- Tag_default,
3664
- {
3665
- label: "...",
3666
- className: "tag-list_wrapper_hide-more",
3667
- onClick: (value, event) => cancelDefault(value, () => setRenderAllInterceptor(false, event)),
3668
- isUseInTable
3669
- }
3670
- );
3671
- };
3672
- useEffect19(() => {
3673
- setStaticTagsCount(-1);
3674
- setRenderItemsCount(-1);
3675
- setRenderAllInterceptor(false, null);
3676
- const itemsWithRef = items.map((item) => ({ ...item, itemRef: createRef() }));
3677
- setTagList(itemsWithRef);
3678
- }, [items]);
3679
- useLayoutEffect5(() => {
3680
- if (withToggle && wrapperWidth !== -1 && staticTagsCount === -1) {
3681
- let computedWidth = wrapperWidth;
3682
- if (computedWidth === 0) {
3683
- computedWidth = Number.parseInt(
3684
- (wrapperRef?.current ? window.getComputedStyle(wrapperRef?.current)?.width : 0).toString()
3685
- );
3686
- }
3687
- if (!Number.isNaN(computedWidth)) {
3688
- setStaticTagsCount(getStaticTagsCount(computedWidth));
3689
- }
3690
- }
3691
- }, [tagList, wrapperWidth, wrapperRef?.current]);
3692
- useLayoutEffect5(() => {
3693
- setRenderItemsCount(staticTagsCount);
3694
- }, [staticTagsCount]);
3695
- useEffect19(() => {
3696
- setRenderItemsCount(renderAll ? tagList?.length : staticTagsCount);
3697
- }, [renderAll]);
3698
- useEffect19(() => {
3699
- if (wrapperRef?.current && refProp) refProp.current = wrapperRef?.current;
3700
- }, [wrapperRef?.current]);
3701
- return /* @__PURE__ */ jsxs32(
3702
- "div",
3703
- {
3704
- "data-testid": testId,
3705
- className: cn33(
3706
- "tag-list_wrapper",
3707
- `${renderItemsCount !== tagList?.length || !withToggle || staticTagsCount === -1 || staticTagsCount === tagList?.length ? "tag-list_wrapper--only-static-items" : "tag-list_wrapper--all-items"}`,
3708
- className,
3709
- { "tag-list_wrapper--disabled": disabled }
3710
- ),
3711
- style: {
3712
- visibility: staticTagsCount === -1 ? "hidden" : "visible",
3713
- zIndex: staticTagsCount === -1 ? "-1" : "auto"
3714
- },
3715
- ref: wrapperRef,
3716
- children: [
3717
- renderTags(),
3718
- renderMoreTags(),
3719
- renderHideTags(),
3720
- typeof onEditClick === "function" && /* @__PURE__ */ jsx39("div", { className: "tag-list__edit-trigger", children: /* @__PURE__ */ jsx39(Edit32, { onClick: onEditClick }) })
3721
- ]
3722
- }
3723
- );
3724
- };
3725
- var TagList_default = TagList;
3726
-
3727
- // src/Atomic/UI/UserBox/UserBox.tsx
3728
- import cn35 from "classnames";
3729
-
3730
- // src/Atomic/FormElements/Label/Label.tsx
3731
- import cn34 from "classnames";
3732
- import { Fragment as Fragment7, jsx as jsx40, jsxs as jsxs33 } from "react/jsx-runtime";
3733
- var CN6 = "label";
3734
- var Label = ({
3735
- className = "",
3736
- label = "",
3737
- note,
3738
- hint,
3739
- isRequired,
3740
- isLabelBolt,
3741
- onClickHintCallback,
3742
- error = null,
3743
- isAccessability = false,
3744
- isAccessabilityHint = false,
3745
- testId = CN6
3746
- }) => {
3747
- const correctLabel = isRequired ? /* @__PURE__ */ jsxs33(Fragment7, { children: [
3748
- label,
3749
- " ",
3750
- /* @__PURE__ */ jsx40("span", { className: "label_asterisk", children: "*" }),
3751
- " ",
3752
- note && /* @__PURE__ */ jsx40("span", { className: "label_note", children: note }),
3753
- hint && /* @__PURE__ */ jsx40(
3754
- Hint_default,
3755
- {
3756
- id: `hint-${label}`,
3757
- children: null,
3758
- isLoading: false,
3759
- isAccessability: isAccessabilityHint,
3760
- hint: hint.text,
3761
- icon: hint.icon,
3762
- variant: hint.variant,
3763
- side: hint.hintSide,
3764
- className: "label-hint",
3765
- onClickCallback: onClickHintCallback
3766
- },
3767
- `hint-${label}`
3768
- )
3769
- ] }) : /* @__PURE__ */ jsxs33(Fragment7, { children: [
3770
- label,
3771
- " ",
3772
- note && /* @__PURE__ */ jsx40("span", { className: "label_note", children: note }),
3773
- hint && /* @__PURE__ */ jsx40(
3774
- Hint_default,
3775
- {
3776
- isAccessability: isAccessabilityHint,
3777
- hint: hint.text,
3778
- icon: hint.icon,
3779
- variant: hint.variant,
3780
- side: hint.hintSide,
3781
- className: "label-hint",
3782
- onClickCallback: onClickHintCallback,
3783
- id: void 0,
3784
- children: void 0,
3785
- isLoading: void 0
3786
- },
3787
- void 0
3788
- )
3789
- ] });
3790
- return /* @__PURE__ */ jsx40(
3791
- "span",
3792
- {
3793
- tabIndex: isAccessability ? 0 : -1,
3794
- "aria-label": label,
3795
- className: cn34(CN6, { label_bold: isLabelBolt, error, isRequired }, className),
3796
- "data-testid": testId,
3797
- children: /* @__PURE__ */ jsx40("span", { className: "label_text", "data-testid": "label-text", children: correctLabel })
3798
- }
3799
- );
3800
- };
3801
- var Label_default = Label;
3802
-
3803
- // src/Atomic/UI/UserBox/UserBox.tsx
3804
- import { Fragment as Fragment8, jsx as jsx41, jsxs as jsxs34 } from "react/jsx-runtime";
3805
- var UserBox = ({
3806
- name = "Username",
3807
- role,
3808
- id,
3809
- onClick,
3810
- isModal,
3811
- className,
3812
- colors,
3813
- testId = "userbox"
3814
- }) => {
3815
- const getNameFirstLetter = name.charAt(0).toUpperCase();
3816
- const renderUser = () => {
3817
- if (isModal) {
3818
- return /* @__PURE__ */ jsxs34(Fragment8, { children: [
3819
- /* @__PURE__ */ jsx41("div", { style: { backgroundColor: getColorById(id, colors) }, className: "td-user-box__avatar", children: getNameFirstLetter }),
3820
- /* @__PURE__ */ jsxs34("div", { className: "td-user-box__user-data", children: [
3821
- /* @__PURE__ */ jsx41(Button_default, { className: "p0 no-shadow", onClick, label: name, variant: "link" }),
3822
- role && /* @__PURE__ */ jsx41("span", { children: role })
3823
- ] })
3824
- ] });
3825
- } else {
3826
- return /* @__PURE__ */ jsxs34(Fragment8, { children: [
3827
- /* @__PURE__ */ jsx41("div", { style: { backgroundColor: getColorById(id) }, className: "td-user-box__avatar", children: getNameFirstLetter }),
3828
- /* @__PURE__ */ jsxs34("div", { className: "td-user-box__user-data", children: [
3829
- /* @__PURE__ */ jsx41(Label_default, { label: name }),
3830
- role && /* @__PURE__ */ jsx41("span", { "aria-label": `User role: ${role}`, children: role })
3831
- ] })
3832
- ] });
3833
- }
3834
- };
3835
- return /* @__PURE__ */ jsx41(
3836
- "div",
3837
- {
3838
- "data-testid": testId,
3839
- className: cn35("td-user-box", className),
3840
- role: "region",
3841
- "aria-label": `User box for ${name}`,
3842
- children: renderUser()
3843
- }
3844
- );
3845
- };
3846
- var UserBox_default = UserBox;
3847
-
3848
- // src/Atomic/UI/UserBox/index.ts
3849
- var UserBox_default2 = UserBox_default;
3850
-
3851
- // src/Atomic/UI/WizardStepper/ui/StepWrapper/StepWrapper.tsx
3852
- import classNames from "classnames";
3853
-
3854
- // src/Atomic/UI/WizardStepper/ui/icons.tsx
3855
- import { jsx as jsx42, jsxs as jsxs35 } from "react/jsx-runtime";
3856
- var DoneIcon = () => /* @__PURE__ */ jsxs35("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
3857
- /* @__PURE__ */ jsx42("rect", { width: "20", height: "20", rx: "10", fill: "#69A457" }),
3858
- /* @__PURE__ */ jsx42("mask", { id: "mask0_54394_4001", style: { maskType: "alpha" }, maskUnits: "userSpaceOnUse", x: "2", y: "2", width: "16", height: "16", children: /* @__PURE__ */ jsx42("path", { d: "M14.5 7L9 12.5L6 9.5", stroke: "black", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }),
3859
- /* @__PURE__ */ jsx42("g", { mask: "url(#mask0_54394_4001)", children: /* @__PURE__ */ jsx42("rect", { x: "2", y: "2", width: "16", height: "16", fill: "white" }) })
3860
- ] });
3861
- var TodoIcon = () => {
3862
- return /* @__PURE__ */ jsxs35("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
3863
- /* @__PURE__ */ jsx42("g", { clipPath: "url(#clip0_54394_4448)", children: /* @__PURE__ */ jsx42("circle", { cx: "10", cy: "10", r: "7", fill: "white", stroke: "#B3B8CB", strokeWidth: "2" }) }),
3864
- /* @__PURE__ */ jsx42("defs", { children: /* @__PURE__ */ jsx42("clipPath", { id: "clip0_54394_4448", children: /* @__PURE__ */ jsx42("rect", { width: "16", height: "16", fill: "white", transform: "translate(2 2)" }) }) })
3865
- ] });
3866
- };
3867
- var ActiveIcon = () => {
3868
- return /* @__PURE__ */ jsxs35("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
3869
- /* @__PURE__ */ jsx42("rect", { width: "20", height: "20", rx: "10", fill: "#E8F9E5" }),
3870
- "ii",
3871
- /* @__PURE__ */ jsx42("mask", { id: "mask0_54394_1459", style: { maskType: "alpha" }, maskUnits: "userSpaceOnUse", x: "2", y: "2", width: "16", height: "16", children: /* @__PURE__ */ jsx42("circle", { cx: "10", cy: "10", r: "4", fill: "#171D33" }) }),
3872
- /* @__PURE__ */ jsx42("g", { mask: "url(#mask0_54394_1459)", children: /* @__PURE__ */ jsx42("rect", { x: "2", y: "2", width: "16", height: "16", fill: "#171D33" }) })
3873
- ] });
3874
- };
3875
- var alternativeIconSet = {
3876
- defaultIcon: /* @__PURE__ */ jsx42(TodoIcon, {}),
3877
- doneIcon: /* @__PURE__ */ jsx42(DoneIcon, {}),
3878
- activeIcon: /* @__PURE__ */ jsx42(ActiveIcon, {})
3879
- };
3880
-
3881
- // src/Atomic/UI/WizardStepper/ui/StepRow/StepRow.tsx
3882
- import cn37 from "classnames";
3883
-
3884
- // src/Atomic/UI/WizardStepper/constructor.js
3885
- import React23 from "react";
3886
- import { jsx as jsx43, jsxs as jsxs36 } from "react/jsx-runtime";
3887
- var WIZARD_STEP_VARIANTS = Object.freeze({
3888
- DEFAULT: "default",
3889
- DONE: "done",
3890
- ACTIVE: "active"
3891
- });
3892
-
3893
- // src/Atomic/UI/WizardStepper/ui/StateIcon/StateIcon.tsx
3894
- import cn36 from "classnames";
3895
- import { jsx as jsx44 } from "react/jsx-runtime";
3896
- var DefaultPoint = () => {
3897
- return /* @__PURE__ */ jsx44("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ jsx44("circle", { cx: "8", cy: "8", r: "4" }) });
3898
- };
3899
- var DonePoint = () => {
3900
- return /* @__PURE__ */ jsx44("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ jsx44("path", { d: "M12.5 5L7 10.5L4 7.5", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
3901
- };
3902
- var RC7 = "state-icon";
3903
- var { ACTIVE, DEFAULT, DONE } = WIZARD_STEP_VARIANTS;
3904
- var StateIcon = ({ variant = DEFAULT, className }) => {
3905
- const computedState = variant === ACTIVE || variant === DONE ? variant : DEFAULT;
3906
- const Inner = {
3907
- [DEFAULT]: /* @__PURE__ */ jsx44(DefaultPoint, {}),
3908
- [ACTIVE]: /* @__PURE__ */ jsx44(DefaultPoint, {}),
3909
- [DONE]: /* @__PURE__ */ jsx44(DonePoint, {})
3910
- };
3911
- return /* @__PURE__ */ jsx44("div", { className: cn36(RC7, `${RC7}--${computedState}`, className), children: Inner[computedState] });
3912
- };
3913
-
3914
- // src/Atomic/UI/WizardStepper/ui/StateIcon/index.ts
3915
- var StateIcon_default = StateIcon;
3916
-
3917
- // src/Atomic/UI/WizardStepper/ui/StepRow/StepRow.tsx
3918
- import { jsx as jsx45, jsxs as jsxs37 } from "react/jsx-runtime";
3919
- var RC8 = "step-row";
3920
- var { DEFAULT: DEFAULT2, ACTIVE: ACTIVE2, DONE: DONE2 } = WIZARD_STEP_VARIANTS;
3921
- var StepRow = ({
3922
- label,
3923
- description,
3924
- className,
3925
- isOptional,
3926
- isFinished,
3927
- isActive,
3928
- titleSlot,
3929
- contentSlot,
3930
- customIcons
3931
- }) => {
3932
- const title = label;
3933
- const rowVariant = (() => {
3934
- if (isActive) return ACTIVE2;
3935
- if (isFinished) return DONE2;
3936
- return DEFAULT2;
3937
- })();
3938
- const alternaviteIconFromProps = (() => {
3939
- if (isActive) return customIcons?.activeIcon;
3940
- if (isFinished) return customIcons?.doneIcon;
3941
- return customIcons?.defaultIcon;
3942
- })();
3943
- const CorrectIcon = () => {
3944
- if (!customIcons || Object?.values(customIcons)?.every((icon) => !icon)) {
3945
- return /* @__PURE__ */ jsx45(StateIcon_default, { variant: rowVariant });
3946
- }
3947
- return alternaviteIconFromProps || null;
3948
- };
3949
- return /* @__PURE__ */ jsxs37("div", { className: cn37(RC8, `${RC8}--${rowVariant}`, className), children: [
3950
- /* @__PURE__ */ jsx45("div", { className: cn37(`${RC8}__state-point`, `${RC8}__state-point--${rowVariant}`), children: /* @__PURE__ */ jsx45(CorrectIcon, {}) }),
3951
- /* @__PURE__ */ jsxs37("div", { className: `${RC8}__content`, children: [
3952
- /* @__PURE__ */ jsxs37("div", { className: `${RC8}__title`, children: [
3953
- /* @__PURE__ */ jsxs37("div", { className: `${RC8}__title-left`, children: [
3954
- /* @__PURE__ */ jsx45("div", { className: cn37(`${RC8}__title-text`, { "text-muted": rowVariant === DEFAULT2 }), children: title }),
3955
- isOptional && /* @__PURE__ */ jsx45(Status_default, { label: "Optional", status: "draft" })
3956
- ] }),
3957
- titleSlot && /* @__PURE__ */ jsx45("div", { className: `${RC8}__title-right`, children: titleSlot })
3958
- ] }),
3959
- description && /* @__PURE__ */ jsx45("div", { className: `${RC8}__description`, children: description }),
3960
- contentSlot && /* @__PURE__ */ jsx45("div", { className: `${RC8}__body`, children: contentSlot })
3961
- ] })
3962
- ] }, label);
3963
- };
3964
- var StepRow_default = StepRow;
3965
-
3966
- // src/Atomic/UI/WizardStepper/ui/StepWrapper/StepWrapper.tsx
3967
- import { jsx as jsx46 } from "react/jsx-runtime";
3968
- var StepWrapper = ({
3969
- steps,
3970
- customIcons,
3971
- variant = "default",
3972
- className,
3973
- testId = "step-wrapper"
3974
- }) => {
3975
- if (!steps?.length) return /* @__PURE__ */ jsx46("div", { "data-testid": "empty-state", children: "No steps available" });
3976
- const renderStepRow = (step) => {
3977
- const { key, ...stepProps } = step;
3978
- return /* @__PURE__ */ jsx46(
3979
- StepRow_default,
3980
- {
3981
- ...stepProps,
3982
- customIcons: customIcons || alternativeIconSet
3983
- },
3984
- key
3985
- );
3986
- };
3987
- switch (variant) {
3988
- case "ghost":
3989
- return /* @__PURE__ */ jsx46(
3990
- Box_default,
3991
- {
3992
- className: classNames("step-wrapper", "step-wrapper-ghost", className),
3993
- "data-testid": testId,
3994
- children: steps?.map(renderStepRow)
3995
- }
3996
- );
3997
- case "cardActive":
3998
- return /* @__PURE__ */ jsx46(
3999
- "div",
4000
- {
4001
- className: classNames("step-wrapper", "step-wrapper-card-active", className),
4002
- "data-testid": testId,
4003
- children: steps?.map(renderStepRow)
4004
- }
4005
- );
4006
- default:
4007
- return /* @__PURE__ */ jsx46(
4008
- "div",
4009
- {
4010
- className: classNames("step-wrapper", className),
4011
- "data-testid": testId,
4012
- children: steps?.map(renderStepRow)
4013
- }
4014
- );
4015
- }
4016
- };
4017
- var StepWrapper_default = StepWrapper;
4018
-
4019
- // src/Atomic/UI/WizardStepper/ui/StepWrapper/index.ts
4020
- var StepWrapper_default2 = StepWrapper_default;
4021
-
4022
- // src/Atomic/UI/WizardStepper/ui/index.ts
4023
- var ui_default = StepWrapper_default2;
4024
-
4025
- // src/Atomic/UI/WizardStepper/index.ts
4026
- var WizardStepper_default = ui_default;
4027
- export {
4028
- AccordionTable_default as AccordionTable,
4029
- AccordionText_default as AccordionText,
4030
- AdvTag_default as AdvTag,
4031
- AdvancedTag_default as AdvancedTags,
4032
- Alert_default2 as Alert,
4033
- Arrow_default as Arrow,
4034
- Box_default as Box,
4035
- Button_default as Button,
4036
- CircleProgressBar_default as CircleProgressBar,
4037
- DateTime_default as DateTime,
4038
- DebugContainer_default as DebugContainer,
4039
- DoubleString_default2 as DoubleString,
4040
- EVENTS,
4041
- Hint_default2 as Hint,
4042
- Modal_default2 as Modal,
4043
- ModalFooter_default as ModalFooter,
4044
- ModalHOC_default as ModalHOC,
4045
- ModalTitle_default as ModalTitle,
4046
- MonoAccordion_default2 as MonoAccordion,
4047
- PageTitle_default2 as PageTitle,
4048
- Price_default2 as Price,
4049
- PriceRange_default2 as PriceRange,
4050
- ProgressLine_default2 as ProgressLine,
4051
- Status_default2 as Status,
4052
- Table_default as Table,
4053
- Tag_default2 as Tag,
4054
- TagList_default as TagList,
4055
- UserBox_default2 as UserBox,
4056
- WizardStepper_default as WizardStepper,
4057
- dispatchEventForModalManagement,
4058
- useDebugContainer_default as useDebugContainer,
4059
- useMobileModal
4060
- };
4061
- //! Важно! Если придет велью с количеством дробных разрядов БОЛЬШИМ
4062
- //! чем указано в quantity - округлит по правилам округления
4063
- //! чем указано в decimalPlaces - округлит по правилам округления
4064
- //# sourceMappingURL=ui.js.map