@true-engineering/true-react-common-ui-kit 3.52.0 → 3.53.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -0
- package/dist/components/FiltersPane/FiltersPane.d.ts +4 -2
- package/dist/components/FiltersPane/FiltersPane.stories.d.ts +3 -3
- package/dist/components/FiltersPane/components/Filter/Filter.d.ts +2 -2
- package/dist/components/FiltersPane/components/Filter/helpers.d.ts +4 -0
- package/dist/components/FiltersPane/components/FilterValueView/FilterValueView.d.ts +3 -1
- package/dist/components/FiltersPane/components/FilterWrapper/FilterWrapper.d.ts +2 -2
- package/dist/true-react-common-ui-kit.js +56 -36
- package/dist/true-react-common-ui-kit.js.map +1 -1
- package/dist/true-react-common-ui-kit.umd.cjs +56 -36
- package/dist/true-react-common-ui-kit.umd.cjs.map +1 -1
- package/package.json +1 -1
- package/src/components/FiltersPane/FiltersPane.stories.tsx +4 -2
- package/src/components/FiltersPane/FiltersPane.tsx +14 -9
- package/src/components/FiltersPane/components/Filter/Filter.tsx +24 -17
- package/src/components/FiltersPane/components/Filter/helpers.ts +18 -0
- package/src/components/FiltersPane/components/FilterValueView/FilterValueView.tsx +8 -5
- package/src/components/FiltersPane/components/FilterWithDates/FilterWithDates.styles.ts +1 -0
- package/src/components/FiltersPane/components/FilterWithPeriod/FilterWithPeriod.tsx +1 -1
- package/src/components/FiltersPane/components/FilterWrapper/FilterWrapper.tsx +7 -5
|
@@ -17994,6 +17994,7 @@
|
|
|
17994
17994
|
}
|
|
17995
17995
|
var useStyles$q = createThemedStyles("FilterWithDates", {
|
|
17996
17996
|
root: {
|
|
17997
|
+
width: 320,
|
|
17997
17998
|
background: colors.CLASSIC_WHITE,
|
|
17998
17999
|
position: "relative",
|
|
17999
18000
|
zIndex: 20
|
|
@@ -18588,9 +18589,6 @@
|
|
|
18588
18589
|
}),
|
|
18589
18590
|
isDatePickerShown && /* @__PURE__ */ jsx("div", {
|
|
18590
18591
|
className: classes.picker,
|
|
18591
|
-
style: {
|
|
18592
|
-
width: 320
|
|
18593
|
-
},
|
|
18594
18592
|
ref: refDatePicker,
|
|
18595
18593
|
children: /* @__PURE__ */ jsx(FilterWithDates, {
|
|
18596
18594
|
onStartBtnSubmit: function() {
|
|
@@ -18614,6 +18612,25 @@
|
|
|
18614
18612
|
]
|
|
18615
18613
|
});
|
|
18616
18614
|
};
|
|
18615
|
+
function _instanceof$2(left2, right2) {
|
|
18616
|
+
if (right2 != null && typeof Symbol !== "undefined" && right2[Symbol.hasInstance]) {
|
|
18617
|
+
return !!right2[Symbol.hasInstance](left2);
|
|
18618
|
+
} else {
|
|
18619
|
+
return left2 instanceof right2;
|
|
18620
|
+
}
|
|
18621
|
+
}
|
|
18622
|
+
var isDateOrEmpty = function(value) {
|
|
18623
|
+
return trueReactPlatformHelpers.isEmpty(value) || _instanceof$2(value, Date);
|
|
18624
|
+
};
|
|
18625
|
+
var isDatePeriodValue = function(value) {
|
|
18626
|
+
return isDateOrEmpty(value === null || value === void 0 ? void 0 : value.from) && isDateOrEmpty(value === null || value === void 0 ? void 0 : value.to);
|
|
18627
|
+
};
|
|
18628
|
+
var isPeriodValue = function(value) {
|
|
18629
|
+
return trueReactPlatformHelpers.isString(value === null || value === void 0 ? void 0 : value.periodType) && isDatePeriodValue(value);
|
|
18630
|
+
};
|
|
18631
|
+
var isMultiSelectValue = function(value) {
|
|
18632
|
+
return Array.isArray(value === null || value === void 0 ? void 0 : value.include);
|
|
18633
|
+
};
|
|
18617
18634
|
function _define_property$s(obj, key, value) {
|
|
18618
18635
|
if (key in obj) {
|
|
18619
18636
|
Object.defineProperty(obj, key, {
|
|
@@ -18688,8 +18705,9 @@
|
|
|
18688
18705
|
}, filter));
|
|
18689
18706
|
}
|
|
18690
18707
|
if (filter.type === "dateRange") {
|
|
18708
|
+
var preparedValue = isPeriodValue(value) ? _object_spread$r({}, value) : void 0;
|
|
18691
18709
|
return /* @__PURE__ */ jsx(FilterWithPeriod, _object_spread$r({
|
|
18692
|
-
value:
|
|
18710
|
+
value: preparedValue,
|
|
18693
18711
|
onChange,
|
|
18694
18712
|
onClose,
|
|
18695
18713
|
localeKey: translatesLocaleKey,
|
|
@@ -18698,29 +18716,26 @@
|
|
|
18698
18716
|
}, filter));
|
|
18699
18717
|
}
|
|
18700
18718
|
if (filter.type === "dateRangeWithoutPeriod") {
|
|
18701
|
-
|
|
18702
|
-
|
|
18703
|
-
|
|
18719
|
+
var preparedValue1 = isDatePeriodValue(value) ? value : void 0;
|
|
18720
|
+
return /* @__PURE__ */ jsx(FilterWithDates, _object_spread$r({
|
|
18721
|
+
value: preparedValue1,
|
|
18722
|
+
onChange: function(v) {
|
|
18723
|
+
return onChange(_object_spread_props$q(_object_spread$r({}, v), {
|
|
18724
|
+
periodType: "CUSTOM"
|
|
18725
|
+
}));
|
|
18704
18726
|
},
|
|
18705
|
-
|
|
18706
|
-
|
|
18707
|
-
|
|
18708
|
-
|
|
18709
|
-
|
|
18710
|
-
|
|
18711
|
-
|
|
18712
|
-
onEndBtnSubmit: function() {
|
|
18713
|
-
return onChange(void 0);
|
|
18714
|
-
},
|
|
18715
|
-
localeKey: translatesLocaleKey,
|
|
18716
|
-
locale: translates,
|
|
18717
|
-
testId: testId !== void 0 ? "".concat(testId, "-dates") : void 0
|
|
18718
|
-
}, filter))
|
|
18719
|
-
});
|
|
18727
|
+
onEndBtnSubmit: function() {
|
|
18728
|
+
return onChange(void 0);
|
|
18729
|
+
},
|
|
18730
|
+
localeKey: translatesLocaleKey,
|
|
18731
|
+
locale: translates,
|
|
18732
|
+
testId: testId !== void 0 ? "".concat(testId, "-dates") : void 0
|
|
18733
|
+
}, filter));
|
|
18720
18734
|
}
|
|
18721
18735
|
if (filter.type === "multiSelect") {
|
|
18736
|
+
var preparedValue2 = isMultiSelectValue(value) ? value : void 0;
|
|
18722
18737
|
return /* @__PURE__ */ jsx(FilterMultiSelect, _object_spread$r({
|
|
18723
|
-
value,
|
|
18738
|
+
value: preparedValue2,
|
|
18724
18739
|
onChange,
|
|
18725
18740
|
onClose,
|
|
18726
18741
|
localeKey: translatesLocaleKey,
|
|
@@ -18729,8 +18744,9 @@
|
|
|
18729
18744
|
}, filter));
|
|
18730
18745
|
}
|
|
18731
18746
|
if (filter.type === "interval") {
|
|
18747
|
+
var preparedValue3 = Array.isArray(value) ? value : void 0;
|
|
18732
18748
|
return /* @__PURE__ */ jsx(FilterInterval, _object_spread$r({
|
|
18733
|
-
value,
|
|
18749
|
+
value: preparedValue3,
|
|
18734
18750
|
onChange,
|
|
18735
18751
|
localeKey: translatesLocaleKey,
|
|
18736
18752
|
locale: translates,
|
|
@@ -19090,7 +19106,7 @@
|
|
|
19090
19106
|
}
|
|
19091
19107
|
}
|
|
19092
19108
|
function FilterValueView(param) {
|
|
19093
|
-
var
|
|
19109
|
+
var value = param.value, filter = param.filter, locale2 = param.locale, localeKey = param.localeKey, tweakStyles = param.tweakStyles;
|
|
19094
19110
|
var classes = useStyles$n({
|
|
19095
19111
|
theme: tweakStyles
|
|
19096
19112
|
});
|
|
@@ -19463,8 +19479,8 @@
|
|
|
19463
19479
|
children: /* @__PURE__ */ jsx(FilterValueView, {
|
|
19464
19480
|
value,
|
|
19465
19481
|
filter,
|
|
19466
|
-
localeKey,
|
|
19467
19482
|
locale: locale2,
|
|
19483
|
+
localeKey,
|
|
19468
19484
|
testId: trueReactPlatformHelpers.getTestId(testId, "value"),
|
|
19469
19485
|
tweakStyles: tweakFilterValueViewStyles
|
|
19470
19486
|
})
|
|
@@ -19491,8 +19507,8 @@
|
|
|
19491
19507
|
return /* @__PURE__ */ jsx(Filter, {
|
|
19492
19508
|
value,
|
|
19493
19509
|
filter,
|
|
19494
|
-
localeKey,
|
|
19495
19510
|
locale: locale2,
|
|
19511
|
+
localeKey,
|
|
19496
19512
|
onClose,
|
|
19497
19513
|
onChange,
|
|
19498
19514
|
testId
|
|
@@ -19553,7 +19569,7 @@
|
|
|
19553
19569
|
return target;
|
|
19554
19570
|
}
|
|
19555
19571
|
function FiltersPane(param) {
|
|
19556
|
-
var data = param.data, tweakStyles = param.tweakStyles, filtersConfig = param.filtersConfig, enabledFilters = param.enabledFilters, _param_values = param.values, values = _param_values === void 0 ? {} : _param_values, localeKey = param.localeKey, locale2 = param.locale, search = param.search, _param_isDisabled = param.isDisabled, isDisabled = _param_isDisabled === void 0 ? false : _param_isDisabled, _param_hasClearButton = param.hasClearButton, hasClearButton = _param_hasClearButton === void 0 ? true : _param_hasClearButton, testId = param.testId, onChangeFilters = param.onChangeFilters, onSettingsButtonClick = param.onSettingsButtonClick, onClear = param.onClear;
|
|
19572
|
+
var data = param.data, tweakStyles = param.tweakStyles, filtersConfig = param.filtersConfig, enabledFilters = param.enabledFilters, _param_values = param.values, values = _param_values === void 0 ? {} : _param_values, localeKey = param.localeKey, locale2 = param.locale, search = param.search, _param_isDisabled = param.isDisabled, isDisabled = _param_isDisabled === void 0 ? false : _param_isDisabled, _param_hasClearButton = param.hasClearButton, hasClearButton = _param_hasClearButton === void 0 ? true : _param_hasClearButton, _param_shouldRenderDataId = param.shouldRenderDataId, shouldRenderDataId = _param_shouldRenderDataId === void 0 ? false : _param_shouldRenderDataId, testId = param.testId, onChangeFilters = param.onChangeFilters, onSettingsButtonClick = param.onSettingsButtonClick, onClear = param.onClear;
|
|
19557
19573
|
var classes = useStyles$u({
|
|
19558
19574
|
theme: tweakStyles
|
|
19559
19575
|
});
|
|
@@ -19574,7 +19590,7 @@
|
|
|
19574
19590
|
localeKey,
|
|
19575
19591
|
locale2
|
|
19576
19592
|
]);
|
|
19577
|
-
var filtersKeys = enabledFilters
|
|
19593
|
+
var filtersKeys = enabledFilters !== null && enabledFilters !== void 0 ? enabledFilters : Object.keys(filtersConfig);
|
|
19578
19594
|
var handleClear = function() {
|
|
19579
19595
|
if (onClear !== void 0) {
|
|
19580
19596
|
onClear();
|
|
@@ -19626,10 +19642,11 @@
|
|
|
19626
19642
|
filtersKeys.map(function(key, index) {
|
|
19627
19643
|
var _filter_requiredFilledFilters;
|
|
19628
19644
|
var isLast = index === filtersKeys.length - 1;
|
|
19629
|
-
var
|
|
19630
|
-
var
|
|
19645
|
+
var filterKey = String(key);
|
|
19646
|
+
var currentValue = values[filterKey];
|
|
19647
|
+
var filter = filtersConfig[filterKey];
|
|
19631
19648
|
if (filter === void 0) {
|
|
19632
|
-
console.error("enabledFilters содержит фильтр ".concat(
|
|
19649
|
+
console.error("enabledFilters содержит фильтр ".concat(filterKey, ", не описанный в конфиге"));
|
|
19633
19650
|
if (isLast) {
|
|
19634
19651
|
return clearButton;
|
|
19635
19652
|
}
|
|
@@ -19640,15 +19657,18 @@
|
|
|
19640
19657
|
locale: locale2,
|
|
19641
19658
|
localeKey,
|
|
19642
19659
|
onChange: function(value) {
|
|
19643
|
-
return onChangeFilters(_object_spread_props$n(_object_spread$o({}, values), _define_property$p({},
|
|
19660
|
+
return onChangeFilters(_object_spread_props$n(_object_spread$o({}, values), _define_property$p({}, filterKey, value)));
|
|
19644
19661
|
},
|
|
19645
19662
|
value: currentValue,
|
|
19646
19663
|
isDisabled: isDisabled || (filter === null || filter === void 0 ? void 0 : (_filter_requiredFilledFilters = filter.requiredFilledFilters) === null || _filter_requiredFilledFilters === void 0 ? void 0 : _filter_requiredFilledFilters.some(function(item) {
|
|
19647
19664
|
return !values[item];
|
|
19648
19665
|
})),
|
|
19649
19666
|
tweakStyles: tweakFilterWrapperStyles,
|
|
19650
|
-
|
|
19651
|
-
|
|
19667
|
+
data: shouldRenderDataId ? {
|
|
19668
|
+
id: filterKey
|
|
19669
|
+
} : void 0,
|
|
19670
|
+
testId: trueReactPlatformHelpers.getTestId(testId, "filter-".concat(filterKey))
|
|
19671
|
+
}, filterKey);
|
|
19652
19672
|
if (isLast) {
|
|
19653
19673
|
return /* @__PURE__ */ jsxs("div", {
|
|
19654
19674
|
className: classes.filterWithClearButton,
|
|
@@ -19658,7 +19678,7 @@
|
|
|
19658
19678
|
children: clearButton
|
|
19659
19679
|
})
|
|
19660
19680
|
]
|
|
19661
|
-
},
|
|
19681
|
+
}, filterKey);
|
|
19662
19682
|
}
|
|
19663
19683
|
return filterWrapper;
|
|
19664
19684
|
})
|