intelicoreact 2.0.7 → 2.0.9

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 (77) hide show
  1. package/charts/package.json +5 -0
  2. package/dist/Atomic/FormElements/Dropdown/components/DropdownLoader.d.ts +1 -1
  3. package/dist/Atomic/FormElements/FormattedRawSSN/FormattedRawSSN_old.d.ts +7 -7
  4. package/dist/Atomic/FormElements/Input/Input.d.ts +1 -1
  5. package/dist/Atomic/FormElements/Input/types.d.ts +0 -5
  6. package/dist/Atomic/FormElements/InputMask3/InputMask3.interface.d.ts +0 -3
  7. package/dist/Atomic/FormElements/NumericInput/NumericInput.d.ts +15 -15
  8. package/dist/Atomic/FormElements/RangeSlider/RangeSlider.d.ts +11 -11
  9. package/dist/Atomic/FormElements/TagListToDropdown/TagListToDropdown.interface.d.ts +1 -1
  10. package/dist/Atomic/FormElements/TagsDropdown/TagsDropdown.interface.d.ts +4 -4
  11. package/dist/Atomic/FormElements/VariantsListRadio/VariantsListRadio.d.ts +2 -2
  12. package/dist/Atomic/FormElements/VariantsListRadio/partials/VariantsListRadioItem.d.ts +4 -4
  13. package/dist/Atomic/UI/AccordionTable/AccordionTable.d.ts +1 -1
  14. package/dist/Atomic/UI/AccordionText/AccordionText.d.ts +4 -4
  15. package/dist/Atomic/UI/Alert/Alert.interface.d.ts +0 -2
  16. package/dist/Atomic/UI/CircleProgressBar/CircleProgressBar.d.ts +4 -4
  17. package/dist/Atomic/UI/ExampleChartIntegration/partial/utils.d.ts +1 -1
  18. package/dist/Atomic/UI/MonoAccordion/MonoAccordion.d.ts +2 -2
  19. package/dist/Atomic/UI/PieChart/PieChart.d.ts +3 -3
  20. package/dist/Atomic/UI/Table/Partials/TdHeader.d.ts +1 -1
  21. package/dist/Atomic/UI/Table/Partials/TdRow.d.ts +1 -1
  22. package/dist/Atomic/UI/Table/Table.d.ts +1 -1
  23. package/dist/Classes/AbortableFetch.d.ts +17 -17
  24. package/dist/Classes/RESTAPI/index.d.ts +1 -1
  25. package/dist/Classes/RESTAPI/partials/AbortableFetch.d.ts +17 -17
  26. package/dist/Classes/RESTAPI/partials/CredentialsProcessing.d.ts +4 -4
  27. package/dist/Functions/hooks/useFormFieldsChangesManager.d.ts +2 -2
  28. package/dist/Functions/sdk/runtime-sdk/transport.d.ts +2 -2
  29. package/dist/Functions/useFieldFocus.d.ts +2 -2
  30. package/dist/Functions/useFormTools/form-drivers/ArrayWithObjects.d.ts +1 -1
  31. package/dist/Functions/useFormTools/form-drivers/ObjectWithIterableObjects.d.ts +1 -1
  32. package/dist/Functions/useFormTools/form-drivers/ObjectWithNamedKeyObjects.d.ts +2 -2
  33. package/dist/Functions/useFormTools/functions/General.d.ts +3 -3
  34. package/dist/Functions/useFormTools/functions/RenderFields.d.ts +5 -5
  35. package/dist/Functions/useFormTools/index.d.ts +20 -20
  36. package/dist/Functions/useMetaInfo.d.ts +2 -2
  37. package/dist/Functions/usePasswordChecker.d.ts +1 -1
  38. package/dist/Functions/utils.d.ts +11 -11
  39. package/dist/charts.cjs +927 -0
  40. package/dist/charts.cjs.map +7 -0
  41. package/dist/charts.d.ts +7 -0
  42. package/dist/charts.js +911 -0
  43. package/dist/charts.js.map +7 -0
  44. package/dist/form.cjs +1498 -1933
  45. package/dist/form.cjs.map +4 -4
  46. package/dist/form.js +1114 -1549
  47. package/dist/form.js.map +4 -4
  48. package/dist/hooks.cjs +8 -324
  49. package/dist/hooks.cjs.map +4 -4
  50. package/dist/hooks.js +8 -324
  51. package/dist/hooks.js.map +4 -4
  52. package/dist/index.cjs +2507 -9293
  53. package/dist/index.cjs.map +4 -4
  54. package/dist/index.js +2059 -8861
  55. package/dist/index.js.map +4 -4
  56. package/dist/layout.cjs +207 -6308
  57. package/dist/layout.cjs.map +4 -4
  58. package/dist/layout.js +202 -6303
  59. package/dist/layout.js.map +4 -4
  60. package/dist/presets.cjs +0 -643
  61. package/dist/presets.cjs.map +4 -4
  62. package/dist/presets.js +0 -633
  63. package/dist/presets.js.map +4 -4
  64. package/dist/ui.cjs +711 -7854
  65. package/dist/ui.cjs.map +4 -4
  66. package/dist/ui.d.ts +0 -5
  67. package/dist/ui.js +722 -7881
  68. package/dist/ui.js.map +4 -4
  69. package/dist/utils.cjs +4 -51
  70. package/dist/utils.cjs.map +3 -3
  71. package/dist/utils.js +4 -51
  72. package/dist/utils.js.map +3 -3
  73. package/package.json +19 -3
  74. package/styles.css +1 -0
  75. package/dist/Atomic/UI/DynamicIcon/DynamicIcon.d.ts +0 -4
  76. package/dist/Atomic/UI/DynamicIcon/DynamicIcon.interface.d.ts +0 -6
  77. package/dist/Atomic/UI/DynamicIcon/index.d.ts +0 -3
@@ -0,0 +1,927 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __export = (target, all) => {
8
+ for (var name in all)
9
+ __defProp(target, name, { get: all[name], enumerable: true });
10
+ };
11
+ var __copyProps = (to, from, except, desc) => {
12
+ if (from && typeof from === "object" || typeof from === "function") {
13
+ for (let key of __getOwnPropNames(from))
14
+ if (!__hasOwnProp.call(to, key) && key !== except)
15
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
16
+ }
17
+ return to;
18
+ };
19
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
20
+ // If the importer is in node compatibility mode or this is not an ESM
21
+ // file that has been converted to a CommonJS file using a Babel-
22
+ // compatible transform (i.e. "__esModule" has not been set), then set
23
+ // "default" to the CommonJS "module.exports" for node compatibility.
24
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
25
+ mod
26
+ ));
27
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
28
+
29
+ // src/charts.ts
30
+ var charts_exports = {};
31
+ __export(charts_exports, {
32
+ Chart: () => Chart_default2,
33
+ PieChart: () => PieChart_default
34
+ });
35
+ module.exports = __toCommonJS(charts_exports);
36
+
37
+ // src/Atomic/UI/Chart/Chart.tsx
38
+ var import_chart = require("chart.js");
39
+ var import_classnames2 = __toESM(require("classnames"), 1);
40
+ var import_react2 = __toESM(require("react"), 1);
41
+ var ChartComponents = __toESM(require("react-chartjs-2"), 1);
42
+
43
+ // src/Functions/utils.js
44
+ var import_react = require("react");
45
+ var import_moment_timezone = __toESM(require("moment-timezone"), 1);
46
+ var clone = (input) => {
47
+ if (input === null || typeof input !== "object") return input;
48
+ const data = input instanceof Array ? [] : {};
49
+ for (const i in input) data[i] = clone(input[i]);
50
+ return data;
51
+ };
52
+ var omitKeys = (obj = {}, keys = []) => keys.reduce((acc, key) => {
53
+ const { [key]: omit, ...rest } = acc;
54
+ return rest;
55
+ }, obj);
56
+ String.prototype.longerThan = function(compareWith) {
57
+ return this?.length > compareWith?.length;
58
+ };
59
+ String.prototype.lastIndexEqualsTo = function(index) {
60
+ return this?.length - 1 === index;
61
+ };
62
+
63
+ // src/Atomic/UI/Chart/partial/Chart.constants.js
64
+ var CHART_TYPES = ["Bar", "Line"];
65
+ var DEFAULT_CHART_MODEL = "emptyLayout";
66
+ var FINTURF_ADD_GRADIENT_COLORS_POSITIVE = ["#53D1AD", "#389AA3"];
67
+ var FINTURF_ADD_GRADIENT_COLORS_NEGATIVE = ["#FDB4DB", "#FA2E69"];
68
+ var GRADIENTS_OBJECTS = {
69
+ finturf: {
70
+ bar: [
71
+ {
72
+ gradientTargetPropertyName: "backgroundColor",
73
+ colors: FINTURF_ADD_GRADIENT_COLORS_POSITIVE,
74
+ direction: "toBottom",
75
+ typeDistributionOfGradientPoints: "personalBase",
76
+ collorStopPoints: [0.2, 1]
77
+ }
78
+ ],
79
+ line: [
80
+ {
81
+ gradientTargetPropertyName: "borderColor",
82
+ colors: FINTURF_ADD_GRADIENT_COLORS_POSITIVE,
83
+ direction: "toRight"
84
+ },
85
+ {
86
+ gradientTargetPropertyName: "backgroundColor",
87
+ colors: [
88
+ "rgba(84, 210, 173, 0.2)",
89
+ "rgba(84, 210, 173, 0.1)",
90
+ "rgba(84, 210, 173, 0)"
91
+ ],
92
+ direction: "toBottom",
93
+ collorStopPoints: [0.31, 0.72, 1],
94
+ isAddFill: true
95
+ }
96
+ ],
97
+ positiveLineIcon: [
98
+ {
99
+ gradientTargetPropertyName: "borderColor",
100
+ colors: FINTURF_ADD_GRADIENT_COLORS_POSITIVE,
101
+ direction: "toRight"
102
+ }
103
+ ],
104
+ negativeLineIcon: [
105
+ {
106
+ gradientTargetPropertyName: "borderColor",
107
+ colors: FINTURF_ADD_GRADIENT_COLORS_NEGATIVE,
108
+ direction: "toRight"
109
+ }
110
+ ]
111
+ }
112
+ };
113
+ var FINTURF_TOOLTIP_OPTIONS = {
114
+ enabled: true,
115
+ mode: "index",
116
+ intersect: false,
117
+ padding: 8,
118
+ backgroundColor: "#FFFFFF",
119
+ titleColor: "#757F8C",
120
+ borderColor: "#D6D9E4",
121
+ titleFont: {
122
+ family: "Sarabun",
123
+ style: "normal",
124
+ weight: 500,
125
+ size: 12
126
+ // line-height: 18px;
127
+ },
128
+ titleAlign: "center",
129
+ bodyColor: "#1E1E2D",
130
+ bodyFont: {
131
+ family: "Sarabun",
132
+ style: "normal",
133
+ weight: 400,
134
+ size: 14
135
+ },
136
+ bodyAlign: "center",
137
+ caretSize: 0,
138
+ displayColors: false,
139
+ borderWidth: 1,
140
+ borderRadius: 6,
141
+ callbacks: {
142
+ label: (context) => context.raw || "0"
143
+ }
144
+ };
145
+ var ICON_MODELS = [
146
+ "lineIconLayout",
147
+ "finturfPositiveLineIcon",
148
+ "finturfNegativeLineIcon"
149
+ ];
150
+ var COMPONENT_OPTIONS = {
151
+ disableDescriptionsFor: [...ICON_MODELS],
152
+ disableChartTypeSwitcherFor: [...ICON_MODELS, "barLayout", "lineLayout"]
153
+ };
154
+
155
+ // src/Atomic/UI/Chart/partial/ChartTypeSwitcherIcon/ChartTypeSwitcherIcon.tsx
156
+ var import_classnames = __toESM(require("classnames"), 1);
157
+ var import_jsx_runtime = require("react/jsx-runtime");
158
+ var RC = "chart__type-switcher-icon";
159
+ function getIcon(type) {
160
+ switch (type) {
161
+ case "Bar":
162
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
163
+ "svg",
164
+ {
165
+ width: "24",
166
+ height: "24",
167
+ viewBox: "0 0 24 25",
168
+ fill: "none",
169
+ xmlns: "http://www.w3.org/2000/svg",
170
+ children: [
171
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { y: "0.5", width: "24", height: "24", rx: "4", fill: "#EAF2FF" }),
172
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
173
+ "path",
174
+ {
175
+ d: "M18 18V11",
176
+ stroke: "#1F7499",
177
+ strokeWidth: "2",
178
+ strokeLinecap: "round",
179
+ strokeLinejoin: "round"
180
+ }
181
+ ),
182
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
183
+ "path",
184
+ {
185
+ d: "M12 18V6",
186
+ stroke: "#1F7499",
187
+ strokeWidth: "2",
188
+ strokeLinecap: "round",
189
+ strokeLinejoin: "round"
190
+ }
191
+ ),
192
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
193
+ "path",
194
+ {
195
+ d: "M6 18V13",
196
+ stroke: "#1F7499",
197
+ strokeWidth: "2",
198
+ strokeLinecap: "round",
199
+ strokeLinejoin: "round"
200
+ }
201
+ )
202
+ ]
203
+ }
204
+ );
205
+ case "Line":
206
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
207
+ "svg",
208
+ {
209
+ width: "24",
210
+ height: "24",
211
+ viewBox: "0 0 24 25",
212
+ fill: "none",
213
+ xmlns: "http://www.w3.org/2000/svg",
214
+ children: [
215
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { y: "0.5", width: "24", height: "24", rx: "4", fill: "#EAF2FF" }),
216
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
217
+ "path",
218
+ {
219
+ d: "M21 8L15.2544 13.2668C14.1075 14.3181 12.3288 14.3014 11.1818\n 13.25V13.25C10.0349 12.1986 8.25615 12.1819 7.10919 13.2332L3 17",
220
+ stroke: "#1F7499",
221
+ strokeWidth: "2",
222
+ strokeLinecap: "round",
223
+ strokeLinejoin: "round"
224
+ }
225
+ )
226
+ ]
227
+ }
228
+ );
229
+ default:
230
+ return null;
231
+ }
232
+ }
233
+ var ChartTypeSwitcherIcon = ({
234
+ iconType,
235
+ isActive,
236
+ className,
237
+ onClick
238
+ }) => {
239
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
240
+ "div",
241
+ {
242
+ className: (0, import_classnames.default)(RC, { [`${RC}_active`]: isActive }, className),
243
+ onClick,
244
+ children: getIcon(iconType)
245
+ }
246
+ );
247
+ };
248
+ var ChartTypeSwitcherIcon_default = ChartTypeSwitcherIcon;
249
+
250
+ // src/Atomic/UI/Chart/partial/datasetSetters.js
251
+ var addDatasetsObjects = (currentData, mutation) => ({
252
+ ...currentData,
253
+ datasets: currentData.datasets?.map?.((dataset) => ({
254
+ ...dataset,
255
+ ...typeof mutation === "function" ? mutation(dataset) : mutation
256
+ }))
257
+ });
258
+ var createGradient = ({
259
+ ctx,
260
+ area,
261
+ colors,
262
+ direction,
263
+ correctionFactors,
264
+ collorStopPoints
265
+ }) => {
266
+ const getStartGradient = () => {
267
+ switch (direction) {
268
+ case "toTop-toRight":
269
+ return ctx.createLinearGradient(
270
+ area.left,
271
+ area.bottom,
272
+ area.right,
273
+ area.top
274
+ );
275
+ case "toTop-toLeft":
276
+ return ctx.createLinearGradient(
277
+ area.right,
278
+ area.bottom,
279
+ area.left,
280
+ area.top
281
+ );
282
+ case "toBottom-toRight":
283
+ return ctx.createLinearGradient(
284
+ area.left,
285
+ area.top,
286
+ area.right,
287
+ area.bottom
288
+ );
289
+ case "toBottom-toLeft":
290
+ return ctx.createLinearGradient(
291
+ area.right,
292
+ area.top,
293
+ area.left,
294
+ area.bottom
295
+ );
296
+ case "toBottom":
297
+ return ctx.createLinearGradient(0, area.top, 0, area.bottom);
298
+ case "toTop":
299
+ return ctx.createLinearGradient(0, area.bottom, 0, area.top);
300
+ case "toLeft":
301
+ return ctx.createLinearGradient(area.right, 0, area.left, 0);
302
+ case "toRight":
303
+ default:
304
+ return ctx.createLinearGradient(area.left, 0, area.right, 0);
305
+ }
306
+ };
307
+ const getGradientWithPoints = (corection) => {
308
+ const newGradient = getStartGradient();
309
+ const staptPoint = corection ? 1 - corection : 0;
310
+ colors.forEach((color, idx) => {
311
+ const point = (() => {
312
+ if (idx === colors.length - 1) return 1;
313
+ return collorStopPoints && Array.isArray(collorStopPoints) ? staptPoint + collorStopPoints[idx] * (corection || 1) : staptPoint + 1 / colors.length * (corection || 1);
314
+ })();
315
+ newGradient.addColorStop(point.toFixed(2), color);
316
+ });
317
+ return newGradient;
318
+ };
319
+ return correctionFactors ? correctionFactors.map((corection) => getGradientWithPoints(corection)) : getGradientWithPoints();
320
+ };
321
+ var addGradientsObject = (currentData, gradientSettingsObj, chartInstance) => addDatasetsObjects(currentData, (dataset) => ({
322
+ [gradientSettingsObj.gradientTargetPropertyName]: createGradient({
323
+ ctx: chartInstance.ctx,
324
+ area: chartInstance.chartArea,
325
+ colors: gradientSettingsObj.colors,
326
+ direction: gradientSettingsObj.direction,
327
+ correctionFactors: gradientSettingsObj.typeDistributionOfGradientPoints === "personalBase" ? dataset.data.map(
328
+ (value) => value / Math.max.apply(null, dataset.data)
329
+ ) : null,
330
+ collorStopPoints: gradientSettingsObj.collorStopPoints
331
+ }),
332
+ ...gradientSettingsObj.isAddFill ? { fill: true } : {}
333
+ }));
334
+ var addNotLibraryAnimation = (currentData, animationObj, chartInstance) => {
335
+ const { type, ...restAnimationObj } = animationObj || {};
336
+ switch (type) {
337
+ case "runningColumns":
338
+ const runningColumnsDefaultFromValue = 25;
339
+ const runningColumnsDefaultToValue = 75;
340
+ const runningColumnsDefaultAverageValue = 50;
341
+ const runningColumnsDefaultColumnsDelayCoef = 50;
342
+ return addDatasetsObjects(currentData, (dataset) => ({
343
+ animations: dataset.data.map((item, idx) => ({
344
+ y: {
345
+ duration: animationObj.duration,
346
+ easing: animationObj.easing || "linear",
347
+ from: animationObj.isFixExtremeColumns && (!idx || idx === dataset.data.length - 1) ? runningColumnsDefaultAverageValue : animationObj.from || runningColumnsDefaultFromValue,
348
+ to: animationObj.isFixExtremeColumns && (!idx || idx === dataset.data.length - 1) ? runningColumnsDefaultAverageValue : animationObj.to || runningColumnsDefaultToValue,
349
+ loop: true,
350
+ delay: Math.random().toFixed(1) * (animationObj.columnsDelayCoef || runningColumnsDefaultColumnsDelayCoef)
351
+ }
352
+ }))
353
+ }));
354
+ default:
355
+ return currentData;
356
+ }
357
+ };
358
+ function changeData(currentData, iterationKey, settingsForChange, chartInstance) {
359
+ switch (iterationKey) {
360
+ case "setMaxBarThickness":
361
+ return addDatasetsObjects(currentData, {
362
+ maxBarThickness: settingsForChange
363
+ });
364
+ case "addGradientsObjects":
365
+ return settingsForChange.reduce(
366
+ (acc, gradientSettingsObj) => addGradientsObject(acc, gradientSettingsObj, chartInstance),
367
+ clone(currentData)
368
+ );
369
+ case "addNotLibraryAnimations":
370
+ return settingsForChange.reduce(
371
+ (acc, animationObj) => addNotLibraryAnimation(acc, animationObj, chartInstance),
372
+ currentData
373
+ );
374
+ default:
375
+ return currentData;
376
+ }
377
+ }
378
+ var datasetSetters_default = changeData;
379
+
380
+ // src/Atomic/UI/Chart/partial/optionsSetters.js
381
+ var addGradientsSettings = (currentOptions, gradientsSettings) => ({
382
+ ...currentOptions,
383
+ notLibraryOptions: {
384
+ ...currentOptions.notLibraryOptions,
385
+ changeData: {
386
+ ...currentOptions.notLibraryOptions?.changeData,
387
+ addGradientsObjects: gradientsSettings
388
+ }
389
+ }
390
+ });
391
+ var addTooltipOptions = (currentOptions, tooltipOptions) => ({
392
+ ...currentOptions,
393
+ options: {
394
+ ...currentOptions.options,
395
+ plugins: {
396
+ ...currentOptions.options.plugins,
397
+ tooltip: tooltipOptions
398
+ }
399
+ }
400
+ });
401
+ var addAdditionalOptions = (currentOptions, optionsToAdd) => {
402
+ const addOption = (currentOptions2, optionKey, optionData) => {
403
+ switch (optionKey) {
404
+ case "addGradientsSettings":
405
+ return addGradientsSettings(currentOptions2, optionData);
406
+ case "addTooltipOptions":
407
+ return addTooltipOptions(currentOptions2, optionData);
408
+ default:
409
+ return currentOptions2;
410
+ }
411
+ };
412
+ const iterator = Object.keys(optionsToAdd);
413
+ return iterator.reduce(
414
+ (acc, key) => addOption(acc, key, optionsToAdd[key]),
415
+ currentOptions
416
+ );
417
+ };
418
+ var optionsSetters_default = addAdditionalOptions;
419
+
420
+ // src/Atomic/UI/Chart/partial/optionsConstructor.js
421
+ var reactChartJsOptionsLayouts = {
422
+ lineIconLayout: {
423
+ options: {
424
+ responsive: true,
425
+ maintainAspectRatio: false,
426
+ scales: {
427
+ x: { display: false },
428
+ y: { display: false }
429
+ },
430
+ elements: {
431
+ point: { radius: 0 },
432
+ line: {
433
+ tension: 0.45,
434
+ borderJoinStyle: "round",
435
+ borderWidth: 2,
436
+ capBezierPoints: true
437
+ }
438
+ }
439
+ },
440
+ redraw: true,
441
+ notLibraryOptions: {
442
+ // Этот ключ должен быть в любой итоговой конфигурации для нормальной работы компонента именно в такой вложенности
443
+ // На основании этого ключа будет приниматься решение какой компонет будет использован (<Line />, <Bar /> и т.д.)
444
+ // => Файл Chart.js => определение ChartComponent
445
+ chartTypeKey: "Line",
446
+ setCanvasDimensions: {
447
+ width: "75px",
448
+ height: "35px"
449
+ }
450
+ }
451
+ },
452
+ lineLayout: {
453
+ options: {
454
+ responsive: true,
455
+ elements: {
456
+ point: {
457
+ radius: 4,
458
+ pointStyle: "circle",
459
+ backgroundColor: "#FFFFFF",
460
+ color: "#FFFFFF"
461
+ },
462
+ line: {
463
+ tension: 0.45,
464
+ borderJoinStyle: "round",
465
+ borderWidth: 2,
466
+ capBezierPoints: true
467
+ }
468
+ }
469
+ },
470
+ redraw: true,
471
+ notLibraryOptions: {
472
+ // Этот ключ должен быть в любой итоговой конфигурации для нормальной работы компонента именно в такой вложенности
473
+ // На основании этого ключа будет приниматься решение какой компонет будет использован (<Line />, <Bar /> и т.д.)
474
+ // => Файл Chart.js => определение ChartComponent
475
+ chartTypeKey: "Line"
476
+ }
477
+ },
478
+ barLayout: {
479
+ options: {
480
+ responsive: true,
481
+ elements: {
482
+ bar: {
483
+ borderRadius: 10
484
+ }
485
+ }
486
+ },
487
+ redraw: true,
488
+ notLibraryOptions: {
489
+ // Этот ключ должен быть в любой итоговой конфигурации для нормальной работы компонента именно в такой вложенности
490
+ // На основании этого ключа будет приниматься решение какой компонет будет использован (<Line />, <Bar /> и т.д.)
491
+ // => Файл Chart.js => определение ChartComponent
492
+ chartTypeKey: "Bar"
493
+ }
494
+ },
495
+ emptyLayout: {
496
+ options: {
497
+ responsive: true,
498
+ maintainAspectRatio: false,
499
+ scales: {
500
+ x: { display: false },
501
+ y: { display: false }
502
+ },
503
+ elements: {
504
+ point: { radius: 0 },
505
+ line: { borderWidth: 0 }
506
+ }
507
+ },
508
+ notLibraryOptions: {
509
+ // Этот ключ должен быть в любой итоговой конфигурации для нормальной работы компонента именно в такой вложенности
510
+ // На основании этого ключа будет приниматься решение какой компонет будет использован (<Line />, <Bar /> и т.д.)
511
+ // => Файл Chart.js => определение подкомпонента ChartComponent => строка const Component = ...
512
+ chartTypeKey: "Line"
513
+ }
514
+ }
515
+ };
516
+ var finturfChartLayouts = (() => {
517
+ return ["barLayout", "lineLayout"].reduce(
518
+ (acc, key) => ({
519
+ ...acc,
520
+ [key]: {
521
+ ...reactChartJsOptionsLayouts[key],
522
+ options: {
523
+ ...reactChartJsOptionsLayouts[key].options,
524
+ scales: {
525
+ ...reactChartJsOptionsLayouts[key].options?.scales,
526
+ x: {
527
+ ...reactChartJsOptionsLayouts[key].options?.scales?.x,
528
+ grid: {
529
+ ...reactChartJsOptionsLayouts[key].options?.scales?.x?.grid,
530
+ display: false,
531
+ offset: true
532
+ },
533
+ ticks: {
534
+ ...reactChartJsOptionsLayouts[key].options?.scales?.y?.ticks,
535
+ autoSkipPadding: 10,
536
+ align: "center",
537
+ color: "#757F8C",
538
+ lineHeight: 18,
539
+ font: {
540
+ family: "Sarabun",
541
+ style: "normal",
542
+ weight: 400,
543
+ size: 8
544
+ }
545
+ // callback: (value, index, ticks) => {
546
+ // console.log(value);
547
+ // console.log(index);
548
+ // console.log(ticks);
549
+ // console.log('***********');
550
+ // return value;
551
+ // },
552
+ }
553
+ },
554
+ y: {
555
+ ...reactChartJsOptionsLayouts[key].options?.scales?.y,
556
+ min: 0,
557
+ // grace: '5%',
558
+ bounds: "data",
559
+ grid: {
560
+ ...reactChartJsOptionsLayouts[key].options?.scales?.y?.grid,
561
+ borderColor: "#E1E8F1",
562
+ color: "#E1E8F1",
563
+ borderDash: [5],
564
+ // borderDashOffset: 12,
565
+ drawTicks: false,
566
+ z: -1
567
+ },
568
+ ticks: {
569
+ ...reactChartJsOptionsLayouts[key].options?.scales?.y?.ticks,
570
+ autoSkipPadding: 10,
571
+ align: "center",
572
+ color: "#A0A4B0",
573
+ lineHeight: 18,
574
+ padding: 6,
575
+ font: {
576
+ family: "Sarabun",
577
+ style: "normal",
578
+ weight: 400,
579
+ size: 10
580
+ }
581
+ }
582
+ }
583
+ }
584
+ },
585
+ notLibraryOptions: {
586
+ ...reactChartJsOptionsLayouts[key].notLibraryOptions,
587
+ setCanvasDimensions: {
588
+ height: "194px"
589
+ }
590
+ }
591
+ }
592
+ }),
593
+ {}
594
+ );
595
+ })();
596
+ var finturfChartBar = {
597
+ ...finturfChartLayouts.barLayout,
598
+ options: {
599
+ ...finturfChartLayouts.barLayout?.options,
600
+ maintainAspectRatio: false,
601
+ elements: {
602
+ ...finturfChartLayouts.barLayout?.options?.elements,
603
+ bar: {
604
+ ...finturfChartLayouts.barLayout?.options?.elements?.bar,
605
+ borderRadius: 4
606
+ }
607
+ }
608
+ },
609
+ notLibraryOptions: {
610
+ ...finturfChartLayouts.barLayout?.notLibraryOptions,
611
+ changeData: {
612
+ ...finturfChartLayouts.barLayout?.notLibraryOptions?.changeData,
613
+ setMaxBarThickness: 16
614
+ }
615
+ }
616
+ };
617
+ var finturfChartLine = {
618
+ ...finturfChartLayouts.lineLayout,
619
+ options: {
620
+ ...finturfChartLayouts.lineLayout?.options,
621
+ maintainAspectRatio: false,
622
+ elements: {
623
+ ...finturfChartLayouts.lineLayout.options?.elements,
624
+ point: {
625
+ ...finturfChartLayouts.lineLayout.options?.elements?.point,
626
+ radius: 2,
627
+ borderColor: "#32A784",
628
+ borderWidth: 4
629
+ }
630
+ }
631
+ }
632
+ };
633
+ var finturfReactChartJsOptions = {
634
+ finturfChartBar: optionsSetters_default(finturfChartBar, {
635
+ addGradientsSettings: GRADIENTS_OBJECTS.finturf.bar,
636
+ addTooltipOptions: FINTURF_TOOLTIP_OPTIONS
637
+ }),
638
+ finturfLoadingModeBar: {
639
+ ...finturfChartBar,
640
+ options: {
641
+ ...finturfChartBar.options,
642
+ animations: {
643
+ ...finturfChartBar.options?.animations,
644
+ y: {
645
+ ...finturfChartBar.options?.animations?.y,
646
+ duration: 0
647
+ }
648
+ }
649
+ },
650
+ notLibraryOptions: {
651
+ ...finturfChartBar.notLibraryOptions,
652
+ changeData: {
653
+ ...finturfChartBar.notLibraryOptions?.changeData,
654
+ addNotLibraryAnimations: [
655
+ {
656
+ type: "runningColumns",
657
+ // duration - ms
658
+ duration: 600,
659
+ // default easing - 'linear',
660
+ // easing: 'easeInOutExpo',
661
+ // ToDo - предусмотреть 'auto' и default для from и to
662
+ from: 10,
663
+ to: 75,
664
+ columnsDelayCoef: 500
665
+ }
666
+ ]
667
+ }
668
+ }
669
+ },
670
+ finturfChartLine: optionsSetters_default(finturfChartLine, {
671
+ addGradientsSettings: GRADIENTS_OBJECTS.finturf.line,
672
+ addTooltipOptions: FINTURF_TOOLTIP_OPTIONS
673
+ // consoleCurrentData: true,
674
+ }),
675
+ finturfLoadingModeLine: {
676
+ ...finturfChartLine,
677
+ options: {
678
+ ...finturfChartLine.options,
679
+ elements: {
680
+ ...finturfChartLine.options?.elements,
681
+ point: {
682
+ ...finturfChartLine.options?.elements?.point,
683
+ radius: 4,
684
+ borderWidth: 1,
685
+ borderColor: "#E1E8F1"
686
+ }
687
+ },
688
+ animations: {
689
+ ...finturfChartLine.options?.animations,
690
+ y: {
691
+ ...finturfChartLine.options?.animations?.y,
692
+ duration: 0
693
+ }
694
+ }
695
+ },
696
+ notLibraryOptions: {
697
+ ...finturfChartLine.notLibraryOptions,
698
+ changeData: {
699
+ ...finturfChartLine.notLibraryOptions?.changeData,
700
+ addNotLibraryAnimations: [
701
+ {
702
+ type: "runningColumns",
703
+ // duration - ms
704
+ duration: 600,
705
+ // default easing - 'linear',
706
+ // easing: 'easeInOutExpo',
707
+ columnsDelayCoef: 500,
708
+ isFixExtremeColumns: true
709
+ }
710
+ ]
711
+ }
712
+ }
713
+ },
714
+ finturfPositiveLineIcon: optionsSetters_default(
715
+ reactChartJsOptionsLayouts.lineIconLayout,
716
+ {
717
+ addGradientsSettings: GRADIENTS_OBJECTS.finturf.positiveLineIcon
718
+ }
719
+ ),
720
+ finturfNegativeLineIcon: optionsSetters_default(
721
+ reactChartJsOptionsLayouts.lineIconLayout,
722
+ {
723
+ addGradientsSettings: GRADIENTS_OBJECTS.finturf.negativeLineIcon
724
+ }
725
+ )
726
+ };
727
+ var optionsConstructor_default = {
728
+ ...finturfReactChartJsOptions,
729
+ emptyLayout: reactChartJsOptionsLayouts.emptyLayout
730
+ };
731
+
732
+ // src/Atomic/UI/Chart/partial/utils.ts
733
+ function getChartTypeKey(model) {
734
+ return optionsConstructor_default[model]?.notLibraryOptions?.chartTypeKey;
735
+ }
736
+ function correctModelKey(model) {
737
+ if (!model) return DEFAULT_CHART_MODEL;
738
+ const options = optionsConstructor_default[model];
739
+ if (!options) return DEFAULT_CHART_MODEL;
740
+ const chartTypeKey = getChartTypeKey(model);
741
+ return chartTypeKey && CHART_TYPES.includes(chartTypeKey) ? model : DEFAULT_CHART_MODEL;
742
+ }
743
+ function getOptions(model) {
744
+ const modelOptions = optionsConstructor_default[model] || optionsConstructor_default[DEFAULT_CHART_MODEL];
745
+ return omitKeys(modelOptions, ["notLibraryOptions"]);
746
+ }
747
+ function getNotLibraryOptionsOptions(model) {
748
+ const modelOptions = optionsConstructor_default[model] || optionsConstructor_default[DEFAULT_CHART_MODEL];
749
+ const { notLibraryOptions } = modelOptions || {};
750
+ return notLibraryOptions ? clone(notLibraryOptions) : void 0;
751
+ }
752
+ function prepareData(model, data, chartInstance, addToDatasets) {
753
+ if (!chartInstance) return data;
754
+ const notLibraryOptions = getNotLibraryOptionsOptions(model);
755
+ const iterator = notLibraryOptions?.changeData ? Object.keys(notLibraryOptions.changeData) : [];
756
+ const changedData = iterator.reduce(
757
+ (acc, dataChangeKey) => datasetSetters_default(
758
+ acc,
759
+ dataChangeKey,
760
+ notLibraryOptions.changeData[dataChangeKey],
761
+ chartInstance
762
+ ),
763
+ clone(data)
764
+ );
765
+ return addToDatasets && typeof addToDatasets === "object" && !Array.isArray(addToDatasets) ? {
766
+ ...changedData,
767
+ datasets: changedData.datasets.map((dataset) => ({
768
+ ...dataset,
769
+ ...addToDatasets
770
+ }))
771
+ } : changedData;
772
+ }
773
+
774
+ // src/Atomic/UI/Chart/Chart.tsx
775
+ var import_jsx_runtime2 = require("react/jsx-runtime");
776
+ var RC2 = "chart";
777
+ import_chart.Chart.register(
778
+ import_chart.CategoryScale,
779
+ import_chart.LinearScale,
780
+ import_chart.BarElement,
781
+ import_chart.PointElement,
782
+ import_chart.LineElement,
783
+ import_chart.Filler,
784
+ import_chart.Tooltip
785
+ );
786
+ var Chart = ({
787
+ className,
788
+ initialModel,
789
+ modelsForSwitch,
790
+ setModelExternalValue,
791
+ description,
792
+ customOptions,
793
+ data,
794
+ addToDatasets,
795
+ modifyOptions
796
+ }) => {
797
+ const { label, value } = description || {};
798
+ const [model, setModel] = (0, import_react2.useState)(DEFAULT_CHART_MODEL);
799
+ const [localData, setLocalData] = (0, import_react2.useState)();
800
+ const chartRef = (0, import_react2.useRef)(null);
801
+ const charContainertRef = (0, import_react2.useRef)(null);
802
+ const options = (0, import_react2.useMemo)(
803
+ () => customOptions || (modifyOptions ? modifyOptions(getOptions(model)) : getOptions(model)),
804
+ [customOptions, model, modifyOptions?.toString?.(), data]
805
+ );
806
+ const notLibraryOptionsOptions = (0, import_react2.useMemo)(
807
+ () => customOptions ? customOptions?.notLibraryOptions : getNotLibraryOptionsOptions(model),
808
+ [customOptions, model, data]
809
+ );
810
+ const ChartComponent = (0, import_react2.useCallback)(
811
+ (props) => {
812
+ const chartType = getChartTypeKey(model);
813
+ const Component = ChartComponents[chartType];
814
+ return import_react2.default.createElement(Component, { ...props, ref: chartRef });
815
+ },
816
+ [model]
817
+ );
818
+ const isExcludeDescription = COMPONENT_OPTIONS.disableDescriptionsFor.includes(model);
819
+ const isExcludeChartTypeSwitcher = COMPONENT_OPTIONS.disableChartTypeSwitcherFor.includes(model);
820
+ (0, import_react2.useLayoutEffect)(() => {
821
+ if (setModelExternalValue && model !== "emptyLayout")
822
+ setModelExternalValue(model);
823
+ }, [model]);
824
+ (0, import_react2.useLayoutEffect)(() => {
825
+ const { setCanvasDimensions } = notLibraryOptionsOptions || {};
826
+ if (charContainertRef.current) {
827
+ charContainertRef.current.style.width = setCanvasDimensions?.width ?? "";
828
+ charContainertRef.current.style.height = setCanvasDimensions?.height ?? "";
829
+ }
830
+ }, [notLibraryOptionsOptions]);
831
+ (0, import_react2.useEffect)(() => {
832
+ setModel(correctModelKey(initialModel));
833
+ }, [initialModel]);
834
+ (0, import_react2.useEffect)(() => {
835
+ if (data) {
836
+ setLocalData(
837
+ prepareData(model, clone(data), chartRef.current, addToDatasets)
838
+ );
839
+ }
840
+ }, [model, data]);
841
+ if (!data || !localData) return null;
842
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
843
+ "div",
844
+ {
845
+ className: (0, import_classnames2.default)(
846
+ RC2,
847
+ { [`${RC2}_icon-mode`]: ICON_MODELS.includes(model) },
848
+ className
849
+ ),
850
+ children: [
851
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
852
+ "div",
853
+ {
854
+ className: (0, import_classnames2.default)(`${RC2}__header`, {
855
+ [`${RC2}__header_only-switcher`]: !description
856
+ }),
857
+ children: [
858
+ description && !isExcludeDescription ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: (0, import_classnames2.default)(`${RC2}__description`), children: [
859
+ label ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: (0, import_classnames2.default)(`${RC2}__description-title`), children: label }) : null,
860
+ value ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: (0, import_classnames2.default)(`${RC2}__description-value`), children: value }) : null
861
+ ] }) : null,
862
+ !isExcludeChartTypeSwitcher ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: (0, import_classnames2.default)(`${RC2}__type-switcher`), children: [
863
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
864
+ ChartTypeSwitcherIcon_default,
865
+ {
866
+ iconType: "Bar",
867
+ isActive: getChartTypeKey(model) === "Bar",
868
+ onClick: () => setModel(modelsForSwitch?.[0] || "barLayout")
869
+ }
870
+ ),
871
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
872
+ ChartTypeSwitcherIcon_default,
873
+ {
874
+ iconType: "Line",
875
+ isActive: getChartTypeKey(model) === "Line",
876
+ onClick: () => setModel(modelsForSwitch?.[1] || "lineLayout")
877
+ }
878
+ )
879
+ ] }) : null
880
+ ]
881
+ }
882
+ ),
883
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { ref: charContainertRef, className: (0, import_classnames2.default)(`${RC2}__chart-wrapper`), children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ChartComponent, { ...options, data: localData }) })
884
+ ]
885
+ }
886
+ );
887
+ };
888
+ var Chart_default = Chart;
889
+
890
+ // src/Atomic/UI/Chart/index.ts
891
+ var Chart_default2 = Chart_default;
892
+
893
+ // src/Atomic/UI/PieChart/PieChart.js
894
+ var import_react3 = __toESM(require("react"), 1);
895
+ var import_chart2 = require("chart.js");
896
+ var import_react_chartjs_2 = require("react-chartjs-2");
897
+ var import_jsx_runtime3 = require("react/jsx-runtime");
898
+ import_chart2.Chart.register(import_chart2.ArcElement, import_chart2.Tooltip);
899
+ var PieChart = ({
900
+ data,
901
+ cutout = "80%",
902
+ resultLabel,
903
+ resultValue = 0,
904
+ withLegend = false
905
+ }) => {
906
+ const options = {
907
+ cutout,
908
+ plugins: {
909
+ legend: {
910
+ display: withLegend
911
+ }
912
+ }
913
+ };
914
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "pie-chart-box", style: { maxWidth: `320px` }, children: [
915
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_chartjs_2.Pie, { data, options }),
916
+ Boolean(resultLabel) && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "pie-chart__result", children: [
917
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "pie-chart__result-value", children: [
918
+ resultValue,
919
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "pie-chart__result-percent", children: "%" }),
920
+ " "
921
+ ] }),
922
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "pie-chart__result-label", children: resultLabel })
923
+ ] })
924
+ ] });
925
+ };
926
+ var PieChart_default = PieChart;
927
+ //# sourceMappingURL=charts.cjs.map