@alfalab/core-components 36.4.0 → 36.5.0

package/side-panel/modern/transitions.desktop.css

@@ -1,32 +1,32 @@
 /* hash: 1ede6 */
-.side-panel__enterRight_6wkbe {
+.side-panel__enterRight_1u7at {
     opacity: 0;
     transform: translateX(15px);
 }
 
-.side-panel__enterLeft_6wkbe {
+.side-panel__enterLeft_1u7at {
     opacity: 0;
     transform: translateX(-15px);
 }
 
-.side-panel__enterActive_6wkbe {
+.side-panel__enterActive_1u7at {
     opacity: 1;
     transform: translateX(0);
     transition: opacity 200ms ease-in, transform 200ms ease-in;
 }
 
-.side-panel__exit_6wkbe {
+.side-panel__exit_1u7at {
     opacity: 1;
     transform: translateX(0);
 }
 
-.side-panel__exitActiveRight_6wkbe {
+.side-panel__exitActiveRight_1u7at {
     opacity: 0;
     transition: opacity 200ms ease-out, transform 200ms ease-out;
     transform: translateX(15px);
 }
 
-.side-panel__exitActiveLeft_6wkbe {
+.side-panel__exitActiveLeft_1u7at {
     opacity: 0;
     transition: opacity 200ms ease-out, transform 200ms ease-out;
     transform: translateX(-15px);

package/side-panel/modern/transitions.mobile.css

@@ -1,24 +1,24 @@
 /* hash: d4mql */
-.side-panel__appear_1ld79,
-.side-panel__enter_1ld79 {
+.side-panel__appear_g0s2m,
+.side-panel__enter_g0s2m {
     opacity: 0;
     transform: translateY(15px);
 }
 
-.side-panel__appearActive_1ld79,
-.side-panel__enterActive_1ld79 {
+.side-panel__appearActive_g0s2m,
+.side-panel__enterActive_g0s2m {
     opacity: 1;
     transform: translateY(0);
     transition: opacity 200ms ease-in, transform 200ms ease-in;
 }
 
-.side-panel__exit_1ld79 {
+.side-panel__exit_g0s2m {
     opacity: 1;
     transform: translateY(0);
 }
 
-.side-panel__exitActive_1ld79,
-.side-panel__exitDone_1ld79 {
+.side-panel__exitActive_g0s2m,
+.side-panel__exitDone_g0s2m {
     opacity: 0;
     transform: translateY(15px);
     transition: opacity 200ms ease-out, transform 200ms ease-out;

package/side-panel/responsive.js

@@ -1,5 +1,5 @@
 var Component_responsive = require('./Component.responsive.js');
-require('./tslib.es6-72355cd8.js');
+require('./tslib.es6-e6454e7b.js');
 require('react');
 require('@alfalab/hooks');
 require('./components/closer/Component.js');

package/side-panel/transitions.desktop.css

@@ -1,32 +1,32 @@
 /* hash: 1ede6 */
-.side-panel__enterRight_6wkbe {
+.side-panel__enterRight_1u7at {
     opacity: 0;
     transform: translateX(15px);
 }
 
-.side-panel__enterLeft_6wkbe {
+.side-panel__enterLeft_1u7at {
     opacity: 0;
     transform: translateX(-15px);
 }
 
-.side-panel__enterActive_6wkbe {
+.side-panel__enterActive_1u7at {
     opacity: 1;
     transform: translateX(0);
     transition: opacity 200ms ease-in, transform 200ms ease-in;
 }
 
-.side-panel__exit_6wkbe {
+.side-panel__exit_1u7at {
     opacity: 1;
     transform: translateX(0);
 }
 
-.side-panel__exitActiveRight_6wkbe {
+.side-panel__exitActiveRight_1u7at {
     opacity: 0;
     transition: opacity 200ms ease-out, transform 200ms ease-out;
     transform: translateX(15px);
 }
 
-.side-panel__exitActiveLeft_6wkbe {
+.side-panel__exitActiveLeft_1u7at {
     opacity: 0;
     transition: opacity 200ms ease-out, transform 200ms ease-out;
     transform: translateX(-15px);

package/side-panel/transitions.mobile.css

@@ -1,24 +1,24 @@
 /* hash: d4mql */
-.side-panel__appear_1ld79,
-.side-panel__enter_1ld79 {
+.side-panel__appear_g0s2m,
+.side-panel__enter_g0s2m {
     opacity: 0;
     transform: translateY(15px);
 }
 
-.side-panel__appearActive_1ld79,
-.side-panel__enterActive_1ld79 {
+.side-panel__appearActive_g0s2m,
+.side-panel__enterActive_g0s2m {
     opacity: 1;
     transform: translateY(0);
     transition: opacity 200ms ease-in, transform 200ms ease-in;
 }
 
-.side-panel__exit_1ld79 {
+.side-panel__exit_g0s2m {
     opacity: 1;
     transform: translateY(0);
 }
 
-.side-panel__exitActive_1ld79,
-.side-panel__exitDone_1ld79 {
+.side-panel__exitActive_g0s2m,
+.side-panel__exitDone_g0s2m {
     opacity: 0;
     transform: translateY(15px);
     transition: opacity 200ms ease-out, transform 200ms ease-out;

package/skeleton/Component.js

@@ -1,16 +1,21 @@
 var React = require('react');
 var cn = require('classnames');
 
-var styles = {"component":"skeleton__component_1yymb","animate":"skeleton__animate_1yymb","background":"skeleton__background_1yymb","gradient":"skeleton__gradient_1yymb"};
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+
+var styles = {"component":"skeleton__component_d7542","animate":"skeleton__animate_d7542","background":"skeleton__background_d7542","gradient":"skeleton__gradient_d7542"};
 require('./index.css');
 
 var Skeleton = function (_a) {
     var _b;
     var visible = _a.visible, _c = _a.animate, animate = _c === void 0 ? true : _c, className = _a.className, dataTestId = _a.dataTestId, children = _a.children;
     if (visible) {
-        return (React.createElement("div", { className: cn(styles.component, (_b = {}, _b[styles.animate] = animate, _b), className), "data-test-id": dataTestId }, children));
+        return (React__default.default.createElement("div", { className: cn__default.default(styles.component, (_b = {}, _b[styles.animate] = animate, _b), className), "data-test-id": dataTestId }, children));
     }
-    return (React.createElement("div", { "data-test-id": dataTestId, className: className }, children));
+    return (React__default.default.createElement("div", { "data-test-id": dataTestId, className: className }, children));
 };
 
 exports.Skeleton = Skeleton;

package/skeleton/cssm/Component.js

@@ -2,13 +2,19 @@ var React = require('react');
 var cn = require('classnames');
 var styles = require('./index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 var Skeleton = function (_a) {
     var _b;
     var visible = _a.visible, _c = _a.animate, animate = _c === void 0 ? true : _c, className = _a.className, dataTestId = _a.dataTestId, children = _a.children;
     if (visible) {
-        return (React.createElement("div", { className: cn(styles.component, (_b = {}, _b[styles.animate] = animate, _b), className), "data-test-id": dataTestId }, children));
+        return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.component, (_b = {}, _b[styles__default.default.animate] = animate, _b), className), "data-test-id": dataTestId }, children));
     }
-    return (React.createElement("div", { "data-test-id": dataTestId, className: className }, children));
+    return (React__default.default.createElement("div", { "data-test-id": dataTestId, className: className }, children));
 };
 
 exports.Skeleton = Skeleton;

package/skeleton/esm/Component.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import cn from 'classnames';
 
-var styles = {"component":"skeleton__component_1yymb","animate":"skeleton__animate_1yymb","background":"skeleton__background_1yymb","gradient":"skeleton__gradient_1yymb"};
+var styles = {"component":"skeleton__component_d7542","animate":"skeleton__animate_d7542","background":"skeleton__background_d7542","gradient":"skeleton__gradient_d7542"};
 require('./index.css');
 
 var Skeleton = function (_a) {

package/skeleton/esm/index.css

@@ -24,7 +24,7 @@
     --skeleton-bg-animation-display: none;
     --skeleton-bg-animation-color: transparent;
 }
-.skeleton__component_1yymb {
+.skeleton__component_d7542 {
     position: relative;
     display: var(--skeleton-display);
     vertical-align: middle;
@@ -38,10 +38,10 @@
     /* Safari overflow fix https://gist.github.com/ayamflow/b602ab436ac9f05660d9c15190f4fd7b */
     -webkit-mask-image: -webkit-radial-gradient(white, black);
 }
-.skeleton__component_1yymb > * {
+.skeleton__component_d7542 > * {
     visibility: hidden;
 }
-.skeleton__component_1yymb:before {
+.skeleton__component_d7542:before {
     content: '';
     position: absolute;
     top: 0;
@@ -50,9 +50,9 @@
     bottom: 0;
     background: var(--skeleton-bg-animation-color);
 }
-.skeleton__animate_1yymb:before {
+.skeleton__animate_d7542:before {
     display: var(--skeleton-bg-animation-display);
-    animation-name: skeleton__background_1yymb;
+    animation-name: skeleton__background_d7542;
     animation-duration: 0.5s;
     animation-iteration-count: infinite;
     animation-direction: alternate;
@@ -61,11 +61,11 @@
     opacity: 0.5;
 }
 @supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
-    .skeleton__animate_1yymb:before {
+    .skeleton__animate_d7542:before {
         opacity: 0.4;
     }
 }
-.skeleton__animate_1yymb:after {
+.skeleton__animate_d7542:after {
     display: var(--skeleton-gradient-animation-display);
     content: '';
     position: absolute;
@@ -74,7 +74,7 @@
     width: 500%;
     height: 100%;
     transform: translateX(-80%);
-    animation-name: skeleton__gradient_1yymb;
+    animation-name: skeleton__gradient_d7542;
     animation-duration: 2s;
     animation-iteration-count: infinite;
     animation-timing-function: linear;
@@ -87,7 +87,7 @@
         rgba(0, 0, 0, 0)
     );
 }
-@keyframes skeleton__gradient_1yymb {
+@keyframes skeleton__gradient_d7542 {
     0% {
         transform: translateX(-80%);
     }
@@ -98,7 +98,7 @@
         transform: translateX(0);
     }
 }
-@keyframes skeleton__background_1yymb {
+@keyframes skeleton__background_d7542 {
     0% {
         background: rgb(182, 188, 195);
     }

package/skeleton/index.css

@@ -24,7 +24,7 @@
     --skeleton-bg-animation-display: none;
     --skeleton-bg-animation-color: transparent;
 }
-.skeleton__component_1yymb {
+.skeleton__component_d7542 {
     position: relative;
     display: var(--skeleton-display);
     vertical-align: middle;
@@ -38,10 +38,10 @@
     /* Safari overflow fix https://gist.github.com/ayamflow/b602ab436ac9f05660d9c15190f4fd7b */
     -webkit-mask-image: -webkit-radial-gradient(white, black);
 }
-.skeleton__component_1yymb > * {
+.skeleton__component_d7542 > * {
     visibility: hidden;
 }
-.skeleton__component_1yymb:before {
+.skeleton__component_d7542:before {
     content: '';
     position: absolute;
     top: 0;
@@ -50,9 +50,9 @@
     bottom: 0;
     background: var(--skeleton-bg-animation-color);
 }
-.skeleton__animate_1yymb:before {
+.skeleton__animate_d7542:before {
     display: var(--skeleton-bg-animation-display);
-    animation-name: skeleton__background_1yymb;
+    animation-name: skeleton__background_d7542;
     animation-duration: 0.5s;
     animation-iteration-count: infinite;
     animation-direction: alternate;
@@ -61,11 +61,11 @@
     opacity: 0.5;
 }
 @supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
-    .skeleton__animate_1yymb:before {
+    .skeleton__animate_d7542:before {
         opacity: 0.4;
     }
 }
-.skeleton__animate_1yymb:after {
+.skeleton__animate_d7542:after {
     display: var(--skeleton-gradient-animation-display);
     content: '';
     position: absolute;
@@ -74,7 +74,7 @@
     width: 500%;
     height: 100%;
     transform: translateX(-80%);
-    animation-name: skeleton__gradient_1yymb;
+    animation-name: skeleton__gradient_d7542;
     animation-duration: 2s;
     animation-iteration-count: infinite;
     animation-timing-function: linear;
@@ -87,7 +87,7 @@
         rgba(0, 0, 0, 0)
     );
 }
-@keyframes skeleton__gradient_1yymb {
+@keyframes skeleton__gradient_d7542 {
     0% {
         transform: translateX(-80%);
     }
@@ -98,7 +98,7 @@
         transform: translateX(0);
     }
 }
-@keyframes skeleton__background_1yymb {
+@keyframes skeleton__background_d7542 {
     0% {
         background: rgb(182, 188, 195);
     }

package/skeleton/modern/Component.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import cn from 'classnames';
 
-const styles = {"component":"skeleton__component_1yymb","animate":"skeleton__animate_1yymb","background":"skeleton__background_1yymb","gradient":"skeleton__gradient_1yymb"};
+const styles = {"component":"skeleton__component_d7542","animate":"skeleton__animate_d7542","background":"skeleton__background_d7542","gradient":"skeleton__gradient_d7542"};
 require('./index.css');
 
 const Skeleton = ({ visible, animate = true, className, dataTestId, children, }) => {

package/skeleton/modern/index.css

@@ -24,7 +24,7 @@
     --skeleton-bg-animation-display: none;
     --skeleton-bg-animation-color: transparent;
 }
-.skeleton__component_1yymb {
+.skeleton__component_d7542 {
     position: relative;
     display: var(--skeleton-display);
     vertical-align: middle;
@@ -38,10 +38,10 @@
     /* Safari overflow fix https://gist.github.com/ayamflow/b602ab436ac9f05660d9c15190f4fd7b */
     -webkit-mask-image: -webkit-radial-gradient(white, black);
 }
-.skeleton__component_1yymb > * {
+.skeleton__component_d7542 > * {
     visibility: hidden;
 }
-.skeleton__component_1yymb:before {
+.skeleton__component_d7542:before {
     content: '';
     position: absolute;
     top: 0;
@@ -50,9 +50,9 @@
     bottom: 0;
     background: var(--skeleton-bg-animation-color);
 }
-.skeleton__animate_1yymb:before {
+.skeleton__animate_d7542:before {
     display: var(--skeleton-bg-animation-display);
-    animation-name: skeleton__background_1yymb;
+    animation-name: skeleton__background_d7542;
     animation-duration: 0.5s;
     animation-iteration-count: infinite;
     animation-direction: alternate;
@@ -61,11 +61,11 @@
     opacity: 0.5;
 }
 @supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
-    .skeleton__animate_1yymb:before {
+    .skeleton__animate_d7542:before {
         opacity: 0.4;
     }
 }
-.skeleton__animate_1yymb:after {
+.skeleton__animate_d7542:after {
     display: var(--skeleton-gradient-animation-display);
     content: '';
     position: absolute;
@@ -74,7 +74,7 @@
     width: 500%;
     height: 100%;
     transform: translateX(-80%);
-    animation-name: skeleton__gradient_1yymb;
+    animation-name: skeleton__gradient_d7542;
     animation-duration: 2s;
     animation-iteration-count: infinite;
     animation-timing-function: linear;
@@ -87,7 +87,7 @@
         rgba(0, 0, 0, 0)
     );
 }
-@keyframes skeleton__gradient_1yymb {
+@keyframes skeleton__gradient_d7542 {
     0% {
         transform: translateX(-80%);
     }
@@ -98,7 +98,7 @@
         transform: translateX(0);
     }
 }
-@keyframes skeleton__background_1yymb {
+@keyframes skeleton__background_d7542 {
     0% {
         background: rgb(182, 188, 195);
     }

package/slider/Component.js

@@ -2,6 +2,12 @@ var React = require('react');
 var cn = require('classnames');
 var noUiSlider = require('nouislider');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var noUiSlider__default = /*#__PURE__*/_interopDefaultCompat(noUiSlider);
+
 /******************************************************************************
 Copyright (c) Microsoft Corporation.
 
@@ -29,7 +35,7 @@ var __assign = function () {
     return __assign.apply(this, arguments);
 };
 
-var styles = {"component":"slider__component_6wt26","s":"slider__s_6wt26","m":"slider__m_6wt26"};
+var styles = {"component":"slider__component_u1ldd","s":"slider__s_u1ldd","m":"slider__m_u1ldd"};
 require('./index.css');
 
 var Slider = function (_a) {
@@ -40,7 +46,7 @@ var Slider = function (_a) {
     React.useEffect(function () {
         if (!sliderRef.current)
             return;
-        var slider = noUiSlider.create(sliderRef.current, {
+        var slider = noUiSlider__default.default.create(sliderRef.current, {
             start: [value],
             connect: [true, false],
             step: step,
@@ -83,7 +89,7 @@ var Slider = function (_a) {
         slider.off('slide');
         slider.on('slide', handler);
     }, [onChange]);
-    return (React.createElement("div", __assign({ className: cn(styles.component, className, styles[size]), ref: sliderRef, "data-test-id": dataTestId }, { disabled: disabled })));
+    return (React__default.default.createElement("div", __assign({ className: cn__default.default(styles.component, className, styles[size]), ref: sliderRef, "data-test-id": dataTestId }, { disabled: disabled })));
 };
 
 exports.Slider = Slider;

package/slider/cssm/Component.js

@@ -3,6 +3,13 @@ var cn = require('classnames');
 var noUiSlider = require('nouislider');
 var styles = require('./index.module.css');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var noUiSlider__default = /*#__PURE__*/_interopDefaultCompat(noUiSlider);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
 /******************************************************************************
 Copyright (c) Microsoft Corporation.
 
@@ -38,7 +45,7 @@ var Slider = function (_a) {
     React.useEffect(function () {
         if (!sliderRef.current)
             return;
-        var slider = noUiSlider.create(sliderRef.current, {
+        var slider = noUiSlider__default.default.create(sliderRef.current, {
             start: [value],
             connect: [true, false],
             step: step,
@@ -81,7 +88,7 @@ var Slider = function (_a) {
         slider.off('slide');
         slider.on('slide', handler);
     }, [onChange]);
-    return (React.createElement("div", __assign({ className: cn(styles.component, className, styles[size]), ref: sliderRef, "data-test-id": dataTestId }, { disabled: disabled })));
+    return (React__default.default.createElement("div", __assign({ className: cn__default.default(styles__default.default.component, className, styles__default.default[size]), ref: sliderRef, "data-test-id": dataTestId }, { disabled: disabled })));
 };
 
 exports.Slider = Slider;

package/slider/esm/Component.js

@@ -29,7 +29,7 @@ var __assign = function () {
     return __assign.apply(this, arguments);
 };
 
-var styles = {"component":"slider__component_6wt26","s":"slider__s_6wt26","m":"slider__m_6wt26"};
+var styles = {"component":"slider__component_u1ldd","s":"slider__s_u1ldd","m":"slider__m_u1ldd"};
 require('./index.css');
 
 var Slider = function (_a) {

package/slider/esm/index.css

@@ -44,24 +44,24 @@
     --slider-origin-width: 100%;
     --slider-origin-right: 0;
 }
-.slider__component_6wt26 {
+.slider__component_u1ldd {
     width: 100%;
     padding-top: var(--slider-progress-s-height);
     position: relative
 }
-.slider__component_6wt26 .noUi-base:hover .noUi-connects {
+.slider__component_u1ldd .noUi-base:hover .noUi-connects {
             background: var(--slider-progress-hover-background);
         }
-.slider__component_6wt26 .noUi-base:hover .noUi-connect {
+.slider__component_u1ldd .noUi-base:hover .noUi-connect {
             background: var(--slider-progress-hover-color);
         }
-.slider__component_6wt26 .noUi-handle:hover .noUi-touch-area {
+.slider__component_u1ldd .noUi-handle:hover .noUi-touch-area {
         background: var(--slider-thumb-hover-color);
     }
-.slider__component_6wt26 .noUi-handle:active .noUi-touch-area {
+.slider__component_u1ldd .noUi-handle:active .noUi-touch-area {
         background: var(--slider-thumb-active-color);
     }
-.slider__component_6wt26 .noUi-base {
+.slider__component_u1ldd .noUi-base {
         position: absolute;
         width: 100%;
         height: var(--slider-clickable-area-size);
@@ -69,14 +69,14 @@
 
         cursor: pointer;
     }
-.slider__component_6wt26 .noUi-origin {
+.slider__component_u1ldd .noUi-origin {
         width: var(--slider-origin-width);
         position: absolute;
         top: 0;
         right: var(--slider-origin-right);
         height: 0;
     }
-.slider__component_6wt26 .noUi-connects {
+.slider__component_u1ldd .noUi-connects {
         width: 100%;
         height: 100%;
         position: relative;
@@ -85,7 +85,7 @@
         z-index: 1;
         overflow: hidden;
     }
-.slider__component_6wt26 .noUi-connect {
+.slider__component_u1ldd .noUi-connect {
         background: var(--slider-progress-color);
         position: absolute;
         z-index: 1;
@@ -97,7 +97,7 @@
         will-change: transform;
         transform-origin: 0 0;
     }
-.slider__component_6wt26 .noUi-handle {
+.slider__component_u1ldd .noUi-handle {
         position: absolute;
         top: calc((var(--slider-thumb-half-size) - var(--slider-clickable-area-half-size)) * -1);
         right: calc(var(--slider-thumb-half-size) * -1);
@@ -112,13 +112,13 @@
         outline: none;
         transition: background 0.15s;
     }
-.slider__component_6wt26 .noUi-touch-area {
+.slider__component_u1ldd .noUi-touch-area {
         border-radius: var(--border-radius-circle);
         background: var(--slider-thumb-color);
         width: 100%;
         height: 100%;
     }
-.slider__component_6wt26 .noUi-pips {
+.slider__component_u1ldd .noUi-pips {
         font-size: 14px;
         line-height: 18px;
         font-weight: 400;
@@ -128,36 +128,36 @@
         position: relative;
         width: 100%;
     }
-.slider__component_6wt26 .noUi-marker {
+.slider__component_u1ldd .noUi-marker {
         display: none;
     }
-.slider__component_6wt26 .noUi-value {
+.slider__component_u1ldd .noUi-value {
         position: absolute;
         white-space: nowrap;
         text-align: center;
         top: 0;
         transform: translateX(-50%)
     }
-.slider__component_6wt26 .noUi-value:nth-child(2) {
+.slider__component_u1ldd .noUi-value:nth-child(2) {
             transform: none;
         }
-.slider__component_6wt26 .noUi-value:last-child {
+.slider__component_u1ldd .noUi-value:last-child {
             transform: translateX(-100%);
         }
-.slider__s_6wt26 .noUi-base {
+.slider__s_u1ldd .noUi-base {
         border-radius: var(--slider-progress-s-border-radius);
         top: calc(var(--slider-progress-s-height) / 2);
     }
-.slider__s_6wt26 .noUi-connects {
+.slider__s_u1ldd .noUi-connects {
         top: calc(var(--slider-clickable-area-half-size) - var(--slider-progress-s-height) / 2);
         height: var(--slider-progress-s-height);
         border-radius: var(--slider-progress-s-border-radius);
     }
-.slider__m_6wt26 .noUi-base {
+.slider__m_u1ldd .noUi-base {
         border-radius: var(--slider-progress-m-border-radius);
         top: calc(var(--slider-progress-m-height) / 2);
     }
-.slider__m_6wt26 .noUi-connects {
+.slider__m_u1ldd .noUi-connects {
         top: calc(var(--slider-clickable-area-half-size) - var(--slider-progress-m-height) / 2);
         height: var(--slider-progress-m-height);
         border-radius: var(--slider-progress-m-border-radius);