@true-engineering/true-react-common-ui-kit 4.0.0-alpha27 → 4.0.0-alpha28

package/dist/components/FiltersPane/types.d.ts

@@ -1,4 +1,5 @@
 import { FC, ReactNode } from 'react';
+import { ITestIdProps } from '../../types';
 import { IDatePickerProps } from '../DatePicker';
 import { IMultiSelectListValues } from '../MultiSelectList';
 import type { IFilterIntervalProps, IFilterMultiSelectProps, IFilterSelectProps, IFilterWithDatesProps, IFilterWithPeriodProps } from './components';
@@ -54,7 +55,7 @@ export type IDateRangeConfigItem<Value> = IConfigItemBasicBase<Value> & {
     type: 'dateRange';
     dateFormat?: string;
 } & Omit<IFilterWithPeriodProps, 'value' | 'onChange' | 'setIsOpen'>;
-export interface ICustomComponentProps<Value> {
+export interface ICustomComponentProps<Value> extends ITestIdProps {
     value?: Value;
     onChange: (v?: Value) => void;
     onClose?: () => void;

package/dist/true-react-common-ui-kit.js

@@ -19802,7 +19802,7 @@ var FilterWithPeriod = function(param) {
           locale: translates,
           tweakStyles: tweakSelectStyles,
           getValueView: getPeriodTranslate,
-          testId: testId !== void 0 ? "".concat(testId, "-select") : void 0
+          testId: getTestId(testId, "select")
         })
       }),
       isDatePickerShown && /* @__PURE__ */ jsx("div", {
@@ -19824,7 +19824,7 @@ var FilterWithPeriod = function(param) {
           onChange: handleCustomDateChange,
           localeKey,
           locale: translates,
-          testId: testId !== void 0 ? "".concat(testId, "-dates") : void 0
+          testId: getTestId(testId, "dates")
         })
       })
     ]
@@ -19919,7 +19919,7 @@ function Filter(props) {
       onClose,
       localeKey: translatesLocaleKey,
       locale: translates,
-      testId: testId !== void 0 ? "".concat(testId, "-select") : void 0
+      testId: getTestId(testId, "select")
     }, filter));
   }
   if (filter.type === "dateRange") {
@@ -19930,7 +19930,7 @@ function Filter(props) {
       onClose,
       localeKey: translatesLocaleKey,
       locale: translates,
-      testId: testId !== void 0 ? "".concat(testId, "-period") : void 0
+      testId: getTestId(testId, "period")
     }, filter));
   }
   if (filter.type === "dateRangeWithoutPeriod") {
@@ -19947,7 +19947,7 @@ function Filter(props) {
       },
       localeKey: translatesLocaleKey,
       locale: translates,
-      testId: testId !== void 0 ? "".concat(testId, "-dates") : void 0
+      testId: getTestId(testId, "dates")
     }, filter));
   }
   if (filter.type === "multiSelect") {
@@ -19958,7 +19958,7 @@ function Filter(props) {
       onClose,
       localeKey: translatesLocaleKey,
       locale: translates,
-      testId: testId !== void 0 ? "".concat(testId, "-multiSelect") : void 0
+      testId: getTestId(testId, "multiSelect")
     }, filter));
   }
   if (filter.type === "interval") {
@@ -19969,19 +19969,19 @@ function Filter(props) {
       localeKey: translatesLocaleKey,
       locale: translates,
       labelName: filter.name,
-      testId: testId !== void 0 ? "".concat(testId, "-interval") : void 0
+      testId: getTestId(testId, "interval")
     }, filter));
   }
-  if (filter.type === "boolean") {
-    return null;
-  }
   if (filter.type === "custom" && filter.component) {
     var Component = filter.component;
     return /* @__PURE__ */ jsx(Component, _object_spread_props$q(_object_spread$r({}, props), {
-      filter
+      filter,
+      testId: getTestId(testId, "dropdown")
     }));
   }
-  console.warn("%cДля фильтра ".concat(filter.name, " не задан тип или component"), "background: red; color: black");
+  if (filter.type !== "boolean") {
+    console.warn("%cДля фильтра ".concat(filter.name, " не задан тип или component"), "background: red; color: black");
+  }
   return null;
 }
 var useStyles$o = createThemedStyles("FiltersPaneSearch", {
@@ -20235,17 +20235,11 @@ function FiltersPaneSearch(param) {
     });
     setIsOpen(false);
   };
-  var selectedFieldLabel = useMemo(function() {
-    return field !== void 0 && getValueView !== void 0 ? getValueView(field) : void 0;
-  }, [
-    field
-  ]);
   var _obj2;
   return /* @__PURE__ */ jsxs("div", _object_spread_props$p(_object_spread$q({
     className: clsx(classes.root, (_obj2 = {}, _define_property$r(_obj2, classes.focused, isInputFocused), _define_property$r(_obj2, classes.disabled, isDisabled), _obj2)),
-    ref: refRoot,
-    "data-testid": testId
-  }, addDataAttributes(data)), {
+    ref: refRoot
+  }, addDataAttributes$1(data, testId)), {
     children: [
       /* @__PURE__ */ jsx(SearchInput, {
         value,
@@ -20258,23 +20252,23 @@ function FiltersPaneSearch(param) {
         onBlur: function() {
           return setIsInputFocused(false);
         },
-        testId: testId !== void 0 ? "".concat(testId, "-input") : void 0,
+        testId: getTestId(testId, "input"),
         maxLength,
         isDisabled
       }),
       /* @__PURE__ */ jsxs("div", {
         className: classes.selectWrapper,
         children: [
-          fields.length > 0 && /* @__PURE__ */ jsxs("div", {
+          fields.length > 0 && /* @__PURE__ */ jsxs("div", _object_spread_props$p(_object_spread$q({
             className: classes.selectBlock,
             onClick: !isDisabled ? function() {
               return setIsOpen(!isOpen);
-            } : void 0,
-            "data-testid": testId !== void 0 ? "".concat(testId, "-select") : void 0,
+            } : void 0
+          }, addDataTestId(testId, "select")), {
             children: [
               /* @__PURE__ */ jsx("div", {
-                className: clsx(classes.selectLabel, selectedFieldLabel !== void 0 && classes.active),
-                children: selectedFieldLabel !== null && selectedFieldLabel !== void 0 ? selectedFieldLabel : translates.displayedFields
+                className: clsx(classes.selectLabel, _define_property$r({}, classes.active, isNotEmpty(field))),
+                children: isNotEmpty(field) ? getValueView === null || getValueView === void 0 ? void 0 : getValueView(field) : translates.displayedFields
               }),
               /* @__PURE__ */ jsx("div", {
                 className: clsx(classes.chevronIcon, isOpen && classes.open),
@@ -20283,7 +20277,7 @@ function FiltersPaneSearch(param) {
                 })
               })
             ]
-          }),
+          })),
           isOpen && /* @__PURE__ */ jsx("div", {
             className: classes.dropdown,
             children: /* @__PURE__ */ jsx(FilterSelect, {
@@ -20298,7 +20292,7 @@ function FiltersPaneSearch(param) {
               onChange: handleFieldsChange,
               isSearchEnabled: isSelectSearchEnabled,
               hasClearButton: hasClearSelectButton,
-              testId: testId !== void 0 ? "".concat(testId, "-dropdown") : void 0
+              testId: getTestId(testId, "dropdown")
             })
           })
         ]
@@ -20683,7 +20677,7 @@ function FilterWrapper(param) {
       var _obj2;
       return /* @__PURE__ */ jsx("div", _object_spread_props$o(_object_spread$p({
         className: clsx(classes.root, (_obj2 = {}, _define_property$q(_obj2, classes.noValue, !hasValue), _define_property$q(_obj2, classes.openNoValue, isActive && !hasValue), _define_property$q(_obj2, classes.withValue, !isActive && hasValue), _define_property$q(_obj2, classes.openWithValue, isActive && hasValue), _define_property$q(_obj2, classes.boolean, isBoolean), _define_property$q(_obj2, classes.disabled, isDisabled), _obj2))
-      }, addDataTestId(testId), addDataAttributes(data), referenceProps), {
+      }, addDataAttributes$1(data, testId), referenceProps), {
         children: /* @__PURE__ */ jsxs("div", {
           onClick: handleLabelClick,
           className: clsx(classes.item, _define_property$q({}, classes.booleanItem, isBoolean)),
@@ -20692,7 +20686,7 @@ function FilterWrapper(param) {
               className: classes.name,
               children: filter.name
             }),
-            !isBoolean && value !== void 0 && value !== null && /* @__PURE__ */ jsx("div", {
+            !isBoolean && isNotEmpty(value) && /* @__PURE__ */ jsx("div", {
               className: classes.value,
               children: /* @__PURE__ */ jsx(FilterValueView, {
                 value,
@@ -20810,7 +20804,7 @@ function FiltersPane(param) {
   ]);
   var filtersKeys = enabledFilters !== null && enabledFilters !== void 0 ? enabledFilters : Object.keys(filtersConfig);
   var handleClear = function() {
-    if (onClear !== void 0) {
+    if (isNotEmpty(onClear)) {
       onClear();
       return;
     }
@@ -20819,9 +20813,9 @@ function FiltersPane(param) {
       search.onChange({});
     }
   };
-  var shouldShowClearButton = hasClearButton && (search !== void 0 || filtersKeys.filter(function(key) {
-    return filtersConfig[key] !== void 0;
-  }).length > 0);
+  var shouldShowClearButton = hasClearButton && (isNotEmpty(search) || filtersKeys.some(function(key) {
+    return isNotEmpty(filtersConfig[key]);
+  }));
   var clearButton = /* @__PURE__ */ jsx("div", {
     className: classes.clear,
     children: /* @__PURE__ */ jsx(Button, {
@@ -20837,7 +20831,7 @@ function FiltersPane(param) {
   var _search_localeKey, _search_localeKey1, _search_isDisabled;
   return /* @__PURE__ */ jsxs("div", _object_spread_props$n(_object_spread$o({
     className: classes.root
-  }, addDataTestId(testId), addDataAttributes(data)), {
+  }, addDataAttributes$1(data, testId)), {
     children: [
       onSettingsButtonClick !== void 0 && /* @__PURE__ */ jsx("div", _object_spread_props$n(_object_spread$o({
         className: classes.settings,