@true-engineering/true-react-common-ui-kit 3.17.0 → 3.18.0

package/dist/true-react-common-ui-kit.umd.cjs

@@ -1068,6 +1068,7 @@
       }
     }
   };
+  var SLIDE_UP_ANIMATION_DURATION = 150;
   var SLIDE_UP_POSITION_START = 15;
   var SLIDE_UP_POSITION_END = 0;
   var animations = {
@@ -1081,7 +1082,7 @@
       "slide-up-enter-active": {
         opacity: 1,
         transform: "translateY(".concat(SLIDE_UP_POSITION_END, "px)"),
-        transition: "150ms ease-in-out",
+        transition: "".concat(SLIDE_UP_ANIMATION_DURATION, "ms ease-in-out"),
         transitionProperty: "opacity, transform"
       },
       "slide-up-exit-active": {
@@ -1091,7 +1092,7 @@
       "slide-up-exit": {
         opacity: 0,
         transform: "translateY(".concat(SLIDE_UP_POSITION_START, "px)"),
-        transition: "150ms ease-in-out",
+        transition: "".concat(SLIDE_UP_ANIMATION_DURATION, "ms ease-in-out"),
         transitionProperty: "opacity, transform"
       }
     }
@@ -17634,6 +17635,21 @@
     },
     popup: {
       zIndex: 5
+    },
+    animationEnd: {},
+    animationStart: {},
+    "dropdown-initial": {
+      extend: "animationEnd"
+    },
+    "dropdown-open": {
+      extend: "animationStart"
+    },
+    "dropdown-close": {
+      visibility: "hidden",
+      extend: "animationEnd"
+    },
+    "dropdown-unmounted": {
+      extend: "animationEnd"
     }
   });
   function _array_like_to_array$a(arr, len) {
@@ -17789,7 +17805,10 @@
     }), refs = _useFloating.refs, floatingStyles = _useFloating.floatingStyles, context = _useFloating.context;
     var hover = react.useHover(context, {
       enabled: eventType === "hover",
-      delay: hoverDelay
+      delay: typeof hoverDelay === "number" ? {
+        open: hoverDelay,
+        close: 0
+      } : hoverDelay
     });
     var click = react.useClick(context, {
       enabled: eventType === "click",
@@ -17804,7 +17823,11 @@
       click,
       dismiss
     ]).getFloatingProps;
-    var _useTransitionStatus = react.useTransitionStatus(context), isMounted = _useTransitionStatus.isMounted, status = _useTransitionStatus.status;
+    var _useTransitionStatus = react.useTransitionStatus(context, {
+      duration: {
+        close: 500
+      }
+    }), isMounted = _useTransitionStatus.isMounted, status = _useTransitionStatus.status;
     return /* @__PURE__ */ jsxs("div", _object_spread_props$q(_object_spread$r({
       ref: refs.setReference,
       className: clsx(classes.root, _define_property$s({}, classes.disabled, isDisabled))
@@ -17827,10 +17850,12 @@
             className: classes.popup,
             ref: refs.setFloating
           }, getFloatingProps()), {
-            children: trueReactPlatformHelpers.isFunction(children) ? children({
-              status,
-              onClose: handleClose
-            }) : children
+            children: /* @__PURE__ */ jsx("div", {
+              className: classes["dropdown-".concat(status)],
+              children: trueReactPlatformHelpers.isFunction(children) ? children({
+                onClose: handleClose
+              }) : children
+            })
           }))
         })
       ]
@@ -17937,20 +17962,6 @@
       fontWeight: "bold",
       display: "flex",
       minWidth: 0
-    },
-    animationEnd: animations.slideUp["slide-up-exit"],
-    animationStart: animations.slideUp["slide-up-enter-active"],
-    "dropdown-initial": {
-      extend: "animationEnd"
-    },
-    "dropdown-open": {
-      extend: "animationStart"
-    },
-    "dropdown-close": {
-      extend: "animationEnd"
-    },
-    "dropdown-unmounted": {
-      extend: "animationEnd"
     }
   });
   function _define_property$r(obj, key, value) {
@@ -18010,6 +18021,11 @@
     var classes = useStyles$p({
       theme: tweakStyles
     });
+    var tweakWithPopupStyles = useTweakStyles({
+      tweakStyles,
+      className: "tweakWithPopup",
+      currentComponentName: "FilterWrapper"
+    });
     var tweakFilterValueViewStyles = useTweakStyles({
       tweakStyles,
       className: "tweakValueView",
@@ -18036,6 +18052,7 @@
       placement: "bottom-start",
       canBeFlipped: true,
       isDisabled: isBoolean || isDisabled,
+      tweakStyles: tweakWithPopupStyles,
       trigger: function(param2) {
         var isActive = param2.isActive;
         var _obj;
@@ -18072,18 +18089,15 @@
         }));
       },
       children: function(param2) {
-        var onClose = param2.onClose, status = param2.status;
-        return /* @__PURE__ */ jsx("div", {
-          className: classes["dropdown-".concat(status)],
-          children: /* @__PURE__ */ jsx(Filter, {
-            value,
-            filter,
-            localeKey,
-            locale: locale2,
-            onClose,
-            onChange,
-            testId
-          })
+        var onClose = param2.onClose;
+        return /* @__PURE__ */ jsx(Filter, {
+          value,
+          filter,
+          localeKey,
+          locale: locale2,
+          onClose,
+          onChange,
+          testId
         });
       }
     });
@@ -25219,7 +25233,7 @@
                 var TitleComponent = itemConfig === null || itemConfig === void 0 ? void 0 : itemConfig.titleComponent;
                 var _itemConfig_titleAlign, _itemConfig_title;
                 var _obj;
-                return /* @__PURE__ */ jsx(TableHeader, {
+                return /* @__PURE__ */ jsx(TableHeader, _object_spread_props$k(_object_spread$l({
                   className: clsx(classes.header, (_obj = {}, _define_property$m(_obj, classes.headerSticky, isFirstColumnSticky && i === 0), _define_property$m(_obj, classes.headerSecond, isFirstColumnSticky && i === 1), _obj)),
                   style: {
                     minWidth: itemConfig === null || itemConfig === void 0 ? void 0 : itemConfig.minWidth,
@@ -25227,13 +25241,16 @@
                     maxWidth: itemConfig === null || itemConfig === void 0 ? void 0 : itemConfig.maxWidth,
                     textAlign: (_itemConfig_titleAlign = itemConfig === null || itemConfig === void 0 ? void 0 : itemConfig.titleAlign) !== null && _itemConfig_titleAlign !== void 0 ? _itemConfig_titleAlign : "left"
                   },
-                  onClick: function() {
-                    return onHeadClick === null || onHeadClick === void 0 ? void 0 : onHeadClick(key);
-                  },
+                  onClick: trueReactPlatformHelpers.isNotEmpty(onHeadClick) ? function() {
+                    return onHeadClick(key);
+                  } : void 0
+                }, addDataAttributes({
+                  id: (itemConfig === null || itemConfig === void 0 ? void 0 : itemConfig.shouldRenderDataId) ? key : void 0
+                })), {
                   children: trueReactPlatformHelpers.isNotEmpty(TitleComponent) ? /* @__PURE__ */ jsx(TitleComponent, {
                     value: headerContent === null || headerContent === void 0 ? void 0 : headerContent[key]
                   }) : (_itemConfig_title = itemConfig === null || itemConfig === void 0 ? void 0 : itemConfig.title) !== null && _itemConfig_title !== void 0 ? _itemConfig_title : ""
-                }, key);
+                }), key);
               })
             })
           }),
@@ -30377,6 +30394,7 @@
   exports2.NumberInput = NumberInput;
   exports2.PhoneInput = PhoneInput;
   exports2.RadioButton = RadioButton;
+  exports2.SLIDE_UP_ANIMATION_DURATION = SLIDE_UP_ANIMATION_DURATION;
   exports2.ScrollIntoViewIfNeeded = ScrollIntoViewIfNeeded;
   exports2.SearchInput = SearchInput;
   exports2.Select = Select;