@true-engineering/true-react-common-ui-kit 3.10.0 → 3.11.0

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

@@ -1071,6 +1071,7 @@
   var SLIDE_UP_POSITION_START = 15;
   var SLIDE_UP_POSITION_END = 0;
   var animations = {
+    defaultTransition: "0.25s ease-in-out",
     // Если понадобится, сюда можно пробросить параметры через useTheme props
     slideUp: {
       "slide-up-enter": {
@@ -7727,7 +7728,8 @@
         0,
         ITEM_HORIZONTAL_PADDING$1
       ],
-      transition: "background-color 0.25s ease-in-out",
+      transition: animations.defaultTransition,
+      transitionProperty: "background-color",
       cursor: "pointer"
     },
     default: {},
@@ -7860,7 +7862,8 @@
         0,
         ITEM_HORIZONTAL_PADDING
       ],
-      transition: "background-color 0.25s ease-in-out",
+      transition: animations.defaultTransition,
+      transitionProperty: "background-color",
       cursor: "pointer"
     },
     disabledItem: {
@@ -8003,13 +8006,14 @@
         10
       ],
       fontSize: 14,
-      transition: "color 0.25s ease-in-out"
+      transition: animations.defaultTransition,
+      transitionProperty: "color"
     },
     accountNameOpened: {},
     accountChevron: {
       width: 16,
       height: 16,
-      transition: "ease-in-out 0.25s",
+      transition: animations.defaultTransition,
       transitionProperty: "transform, color"
     },
     accountChevronOpened: {
@@ -8543,7 +8547,7 @@
       cursor: "pointer",
       outline: "none",
       boxSizing: "border-box",
-      transition: "0.25s ease-in-out",
+      transition: animations.defaultTransition,
       transitionProperty: "background-color, color, box-shadow, border-color",
       maxWidth: "100%",
       border: [
@@ -9015,7 +9019,8 @@
       appearance: "none",
       backgroundColor: "transparent",
       cursor: "pointer",
-      transition: "background-color 0.25s ease-in-out",
+      transition: animations.defaultTransition,
+      transitionProperty: "background-color",
       "&:hover": {
         backgroundColor: rgba(colors.BORDER_MAIN, 0.5)
       },
@@ -9277,7 +9282,7 @@
       width: "100%",
       height: dimensions.CONTROL_HEIGHT,
       boxSizing: "border-box",
-      transition: "0.25s ease-in-out",
+      transition: animations.defaultTransition,
       transitionProperty: "border-color",
       backgroundColor: "white",
       position: "relative"
@@ -9297,7 +9302,7 @@
       outline: "none",
       boxSizing: "border-box",
       outlineStyle: "none",
-      transition: "0.25s ease-in-out",
+      transition: animations.defaultTransition,
       transitionProperty: "background-color",
       border: "none",
       background: "none",
@@ -9383,7 +9388,7 @@
       top: "50%",
       transformOrigin: "top left",
       transform: "translateY(-50%)",
-      transition: "0.25s ease-in-out",
+      transition: animations.defaultTransition,
       transitionProperty: "transform, color",
       fontSize: 16
     },
@@ -9492,7 +9497,8 @@
         4
       ],
       width: 20,
-      transition: "color 0.25s ease-in-out",
+      transition: animations.defaultTransition,
+      transitionProperty: "color",
       boxSizing: "content-box",
       "&:last-child": {
         paddingRight: 8
@@ -13322,7 +13328,8 @@
       width: 40,
       height: FILTER_HEIGHT,
       cursor: "pointer",
-      transition: "background-color 0.25s ease-in-out"
+      transition: animations.defaultTransition,
+      transitionProperty: "background-color"
     },
     settingsIcon: {
       width: 16,
@@ -14608,7 +14615,8 @@
       cursor: "pointer",
       fontSize: 14,
       minHeight: ITEM_HEIGHT,
-      transition: "background-color 0.25s ease-in-out",
+      transition: animations.defaultTransition,
+      transitionProperty: "background-color",
       boxSizing: "border-box"
     },
     option: {
@@ -17303,7 +17311,7 @@
       ],
       borderRadius: 18,
       paddingRight: 8,
-      transition: "0.25s ease-in-out",
+      transition: animations.defaultTransition,
       transitionProperty: "background-color, border-color"
     },
     focused: {
@@ -17786,7 +17794,7 @@
   var useStyles$q = createThemedStyles("FilterWrapper", {
     root: {
       position: "relative",
-      transition: "0.25s ease-in-out",
+      transition: animations.defaultTransition,
       transitionProperty: "background-color, border-color",
       border: [
         1,
@@ -24545,11 +24553,8 @@
         background: "transparent",
         pointerEvents: "none",
         zIndex: 1,
-        transition: [
-          "box-shadow",
-          "0.25s",
-          "ease-in-out"
-        ],
+        transition: animations.defaultTransition,
+        transitionProperty: "box-shadow",
         "[data-scrolled] &": {
           boxShadow: "4px 0 4px rgba(0, 0, 0, 0.05)"
         }
@@ -25322,7 +25327,7 @@
       cursor: "pointer",
       outline: "none",
       boxSizing: "border-box",
-      transition: "0.25s ease-in-out",
+      transition: animations.defaultTransition,
       transitionProperty: "background-color, color, border-color",
       border: "none",
       position: "relative",
@@ -25525,7 +25530,8 @@
       border: "none",
       outline: "none",
       backgroundColor: colors.GREY_BACKGROUND,
-      transition: "background-color 0.25s ease-in-out",
+      transition: animations.defaultTransition,
+      transitionProperty: "background-color",
       color: colors.FONT_MEDIUM,
       cursor: "pointer",
       display: "flex",
@@ -26303,7 +26309,8 @@
       borderRadius: "50%",
       border: "none",
       cursor: "pointer",
-      transition: "background-color 0.25s ease-in-out",
+      transition: animations.defaultTransition,
+      transitionProperty: "background-color",
       "&$hasCircle": {
         backgroundColor: rgba(colors.GREY_HOVER, 0.5)
       },
@@ -27843,7 +27850,7 @@
         height: "calc(100% - ".concat(SELECTOR_GAP * 2, "px)"),
         backgroundColor: colors.CLASSIC_WHITE,
         borderRadius: dimensions.BORDER_RADIUS_SMALL,
-        transition: "0.25s ease-in-out",
+        transition: animations.defaultTransition,
         transitionProperty: "transform, width"
       },
       "&$invalid": {
@@ -27856,7 +27863,8 @@
         height: "100%",
         color: colors.FONT_MEDIUM,
         fontSize: 16,
-        transition: "color 0.25s ease-in-out",
+        transition: animations.defaultTransition,
+        transitionProperty: "color",
         background: "none",
         "&$s": {
           padding: [
@@ -28648,8 +28656,8 @@
       backgroundColor: "#333",
       borderRadius: 10,
       boxSizing: "border-box",
+      transition: animations.defaultTransition,
       transitionProperty: "opacity, background-color",
-      transition: "0.25s ease-in-out",
       "&::before": {
         content: '""',
         position: "absolute",
@@ -28662,16 +28670,16 @@
         backgroundColor: "#fff",
         borderRadius: "50%",
         zIndex: 1,
-        transitionProperty: "left, background-color",
-        transition: "0.25s ease-in-out"
+        transition: animations.defaultTransition,
+        transitionProperty: "left, background-color"
       }
     },
     input: {
       display: "none"
     },
     label: {
-      transitionProperty: "opacity, color",
-      transition: "0.25s ease-in-out"
+      transition: animations.defaultTransition,
+      transitionProperty: "opacity, color"
     },
     labelLeft: {
       order: -1,
@@ -28781,7 +28789,7 @@
       width: "100%",
       flexGrow: 1,
       boxSizing: "border-box",
-      transition: "0.25s ease-in-out",
+      transition: animations.defaultTransition,
       transitionProperty: "border-color",
       backgroundColor: "white",
       border: [
@@ -28803,7 +28811,7 @@
         PADDING_X,
         8
       ],
-      transition: "0.25s ease-in-out",
+      transition: animations.defaultTransition,
       transitionProperty: "background-color",
       border: "none",
       resize: "none",
@@ -28855,7 +28863,7 @@
       top: PADDING_X * 2,
       transformOrigin: "top left",
       transform: "translateY(-50%)",
-      transition: "0.25s ease-in-out",
+      transition: animations.defaultTransition,
       transitionProperty: "transform, color",
       fontSize: 16
     },
@@ -29125,7 +29133,8 @@
       borderRadius: 0,
       cursor: "pointer",
       outline: "none",
-      transition: "color 0.25s ease-in-out",
+      transition: animations.defaultTransition,
+      transitionProperty: "color",
       "&[disabled]": {
         cursor: "default",
         pointerEvents: "none"
@@ -29164,7 +29173,7 @@
       width: 24,
       height: 24,
       borderRadius: "50%",
-      transition: "0.25s ease-in-out",
+      transition: animations.defaultTransition,
       transitionProperty: [
         "background",
         "color"
@@ -30375,7 +30384,8 @@
       borderRadius: "50%",
       border: "none",
       cursor: "pointer",
-      transition: "background-color 0.25s ease-in-out"
+      transition: animations.defaultTransition,
+      transitionProperty: "background-color"
     },
     icon: {
       width: 30,