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

package/dist/components/Select/components/SelectListItem/SelectListItem.d.ts

@@ -1,6 +1,7 @@
 import { type ChangeEvent, type FC, type KeyboardEvent, type MouseEvent, type ReactNode } from 'react';
 import { type Classes } from 'jss';
-export interface ISelectListItemProps {
+import { IDataAttributesProps } from '../../../../types';
+export interface ISelectListItemProps extends IDataAttributesProps {
     index: number;
     isSemiChecked?: boolean;
     isDisabled?: boolean;

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

@@ -11474,7 +11474,7 @@ function _object_spread_props$F(target, source) {
   return target;
 }
 var SelectListItem = function(param) {
-  var classes = param.classes, index = param.index, isSemiChecked = param.isSemiChecked, isDisabled = param.isDisabled, isActive = param.isActive, children = param.children, isFocused = param.isFocused, isMultiSelect = param.isMultiSelect, onOptionSelect = param.onOptionSelect, onToggleCheckbox = param.onToggleCheckbox;
+  var classes = param.classes, index = param.index, isSemiChecked = param.isSemiChecked, isDisabled = param.isDisabled, isActive = param.isActive, children = param.children, isFocused = param.isFocused, isMultiSelect = param.isMultiSelect, data = param.data, onOptionSelect = param.onOptionSelect, onToggleCheckbox = param.onToggleCheckbox;
   var multiSelectContent = isMultiSelect && /* @__PURE__ */ jsx(Checkbox, {
     isChecked: isActive || isSemiChecked,
     isSemiChecked,
@@ -11493,11 +11493,11 @@ var SelectListItem = function(param) {
       block: "nearest"
     },
     className: clsx(classes.cell, (_obj2 = {}, _define_property$N(_obj2, classes.cellWithCheckbox, isMultiSelect), _define_property$N(_obj2, classes.focused, isFocused), _define_property$N(_obj2, classes.active, isActive && !isMultiSelect), _define_property$N(_obj2, classes.disabled, isDisabled), _obj2))
-  }, addDataAttributes({
+  }, addDataAttributes$1(_object_spread$L({
     disabled: isDisabled,
     active: isActive,
     focused: isFocused
-  })), {
+  }, data))), {
     onClick: !isDisabled && !isMultiSelect ? function(event) {
       return onOptionSelect(index, event);
     } : void 0,
@@ -11626,8 +11626,9 @@ function SelectList(param) {
             }),
             listOptions.map(function(opt, i) {
               var optionValue = options[i];
+              var id = convertValueToId(optionValue);
               var isFocused = focusedIndex === i;
-              var isActive = activeOptionsIds.has(convertValueToId(optionValue));
+              var isActive = activeOptionsIds.has(id);
               var isDisabled = optionsDisableMap[i];
               return /* @__PURE__ */ jsx(SelectListItem, {
                 classes,
@@ -11638,6 +11639,9 @@ function SelectList(param) {
                 isMultiSelect,
                 onOptionSelect,
                 onToggleCheckbox,
+                data: {
+                  id
+                },
                 children: opt
               }, i);
             }),
@@ -19077,7 +19081,7 @@ function FilterSelect(param) {
   }, []);
   return /* @__PURE__ */ jsxs("div", _object_spread_props$t(_object_spread$u({
     className: classes.root
-  }, addDataAttributes(data)), {
+  }, addDataAttributes$1(data, testId)), {
     children: [
       isSearchEnabled && /* @__PURE__ */ jsx("div", {
         className: classes.dropdownInput,
@@ -19086,20 +19090,20 @@ function FilterSelect(param) {
           placeholder: translates.searchPlaceholder,
           onChange: handleOnChange,
           tweakStyles: tweakSearchInputStyles,
-          testId: testId !== void 0 ? "".concat(testId, "-search") : void 0,
+          testId: getTestId(testId, "search"),
           shouldFocusOnMount: true
         })
       }),
       !isLoading && /* @__PURE__ */ jsxs(Fragment, {
         children: [
-          allOptions.length !== 0 && /* @__PURE__ */ jsxs("div", {
-            className: clsx(classes.list, hasClearButton && classes.withClearButton),
-            "data-testid": testId !== void 0 ? "".concat(testId, "-list") : void 0,
+          isArrayNotEmpty(allOptions) && /* @__PURE__ */ jsxs("div", _object_spread_props$t(_object_spread$u({
+            className: clsx(classes.list, _define_property$v({}, classes.withClearButton, hasClearButton))
+          }, addDataTestId(testId, "list")), {
             children: [
-              isGroupingEnabled && value !== void 0 && /* @__PURE__ */ jsxs(Fragment, {
+              isGroupingEnabled && isNotEmpty(value) && /* @__PURE__ */ jsxs(Fragment, {
                 children: [
                   /* @__PURE__ */ jsx("div", {
-                    className: clsx(classes.label, classes.labelChosen, !isSearchEnabled && classes.withoutTopGap),
+                    className: clsx(classes.label, classes.labelChosen, _define_property$v({}, classes.withoutTopGap, !isSearchEnabled)),
                     children: translates.chosen
                   }),
                   /* @__PURE__ */ jsxs("div", {
@@ -19127,7 +19131,7 @@ function FilterSelect(param) {
                 ]
               }),
               allOptions.map(function(item, index) {
-                var isActive = value !== void 0 && getValueId(value) === getValueId(item);
+                var isActive = isNotEmpty(value) && getValueId(value) === getValueId(item);
                 if (isGroupingEnabled && isActive) {
                   return null;
                 }
@@ -19140,11 +19144,14 @@ function FilterSelect(param) {
                     return handleChange(item);
                   },
                   children: [
-                    /* @__PURE__ */ jsx("div", {
-                      className: classes.option,
-                      "data-option": id,
+                    /* @__PURE__ */ jsx("div", _object_spread_props$t(_object_spread$u({
+                      className: classes.option
+                    }, addDataAttributes$1({
+                      id,
+                      option: id
+                    })), {
                       children: view
-                    }),
+                    })),
                     isActive && /* @__PURE__ */ jsx("div", {
                       className: classes.icon,
                       children: /* @__PURE__ */ jsx(Icon, {
@@ -19163,14 +19170,14 @@ function FilterSelect(param) {
                 }
               })
             ]
-          }),
+          })),
           shouldShowPreloader && /* @__PURE__ */ jsx("div", {
             className: classes.preloader,
             children: /* @__PURE__ */ jsx(ThemedPreloader, {
               type: "dots"
             })
           }),
-          allOptions.length === 0 && /* @__PURE__ */ jsx("div", {
+          !isArrayNotEmpty(allOptions) && /* @__PURE__ */ jsx("div", {
             className: classes.nothingFound,
             children: translates.nothingFound
           }),
@@ -19187,7 +19194,7 @@ function FilterSelect(param) {
                   onClick: handleClear,
                   size: "s",
                   view: "text",
-                  testId: testId !== void 0 ? "".concat(testId, "-clear-button") : void 0,
+                  testId: getTestId(testId, "clear-button"),
                   tweakStyles: tweakClearButtonStyles,
                   children: translates.clear
                 })