@alfalab/core-components 39.0.0-beta.3 → 39.0.0-beta.4

package/select/responsive.js

@@ -6,7 +6,7 @@ require('./Component.js');
 require('./components/arrow/Component.js');
 require('classnames');
 require('@alfalab/icons-glyph/ChevronDownMIcon');
-require('./Component-0faa75bc.js');
+require('./Component-1a5e3b7a.js');
 require('react-merge-refs');
 require('@juggle/resize-observer');
 require('downshift');
@@ -25,14 +25,14 @@ require('../checkbox');
 require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
 require('./components/options-list/Component.js');
 require('../scrollbar');
-require('./Component-8918e540.js');
+require('./Component-5cb88539.js');
 require('../bottom-sheet');
 require('../modal/mobile');
 require('react-virtual');
 require('./components/base-option/Component.js');
 require('./components/base-checkmark/Component.js');
 require('../skeleton');
-require('./intersection-observer-cd53e318.js');
+require('./intersection-observer-81cf0f4e.js');
 require('../button');
 require('./components/base-select-mobile/options-list/Component.js');
 require('../base-modal');

package/tag/Component.d.ts

@@ -39,9 +39,9 @@ type TagProps = Omit<NativeProps, 'onClick'> & {
         name?: string;
     }) => void;
     /**
-     * Callback передачи нод tag и children
+     * ref на children
      */
-    nodesTransfer?: (tag: HTMLButtonElement, children: HTMLSpanElement) => void;
+    childrenRef?: React.RefObject<HTMLSpanElement>;
     /**
      * Набор цветов для компонента
      */
@@ -98,9 +98,9 @@ declare const Tag: React.ForwardRefExoticComponent<Omit<NativeProps, "onClick">
         name?: string;
     }) => void) | undefined;
     /**
-     * Callback передачи нод tag и children
+     * ref на children
      */
-    nodesTransfer?: ((tag: HTMLButtonElement, children: HTMLSpanElement) => void) | undefined;
+    childrenRef?: React.RefObject<HTMLSpanElement> | undefined;
     /**
      * Набор цветов для компонента
      */

package/tag/Component.js

@@ -25,10 +25,9 @@ var colorStylesMap = {
 };
 var Tag = React.forwardRef(function (_a, ref) {
     var _b;
-    var rightAddons = _a.rightAddons, leftAddons = _a.leftAddons, children = _a.children, _c = _a.size, size = _c === void 0 ? 's' : _c, checked = _a.checked, className = _a.className, dataTestId = _a.dataTestId, name = _a.name, _d = _a.colors, colors = _d === void 0 ? 'default' : _d, onClick = _a.onClick, _e = _a.variant, variant = _e === void 0 ? 'default' : _e, shape = _a.shape, _f = _a.view, view = _f === void 0 ? 'outlined' : _f, nodesTransfer = _a.nodesTransfer, childrenClassName = _a.childrenClassName, restProps = tslib.__rest(_a, ["rightAddons", "leftAddons", "children", "size", "checked", "className", "dataTestId", "name", "colors", "onClick", "variant", "shape", "view", "nodesTransfer", "childrenClassName"]);
+    var rightAddons = _a.rightAddons, leftAddons = _a.leftAddons, children = _a.children, _c = _a.size, size = _c === void 0 ? 's' : _c, checked = _a.checked, className = _a.className, dataTestId = _a.dataTestId, name = _a.name, _d = _a.colors, colors = _d === void 0 ? 'default' : _d, onClick = _a.onClick, _e = _a.variant, variant = _e === void 0 ? 'default' : _e, shape = _a.shape, _f = _a.view, view = _f === void 0 ? 'outlined' : _f, childrenClassName = _a.childrenClassName, childrenRef = _a.childrenRef, restProps = tslib.__rest(_a, ["rightAddons", "leftAddons", "children", "size", "checked", "className", "dataTestId", "name", "colors", "onClick", "variant", "shape", "view", "childrenClassName", "childrenRef"]);
     var colorStyles = colorStylesMap[colors];
     var tagRef = React.useRef(null);
-    var childrenRef = React.useRef(null);
     var focused = hooks.useFocus(tagRef, 'keyboard')[0];
     var variantClassName = variant === 'default' ? 'rounded' : 'rectangular';
     var shapeClassName = shape || variantClassName;
@@ -47,12 +46,6 @@ var Tag = React.forwardRef(function (_a, ref) {
             onClick(event, { name: name, checked: !checked });
         }
     };
-    React.useLayoutEffect(function () {
-        var handlerAndNodesExist = nodesTransfer && tagRef.current && childrenRef.current;
-        if (handlerAndNodesExist) {
-            nodesTransfer(tagRef.current, childrenRef.current);
-        }
-    }, [nodesTransfer]);
     return (React__default.default.createElement("button", tslib.__assign({ ref: mergeRefs__default.default([tagRef, ref]), type: 'button', onClick: handleClick }, tagProps, restProps),
         leftAddons ? React__default.default.createElement("span", { className: styles.addons }, leftAddons) : null,
         children && (React__default.default.createElement("span", { ref: childrenRef, className: childrenClassName }, children)),

package/tag/cssm/Component.d.ts

@@ -39,9 +39,9 @@ type TagProps = Omit<NativeProps, 'onClick'> & {
         name?: string;
     }) => void;
     /**
-     * Callback передачи нод tag и children
+     * ref на children
      */
-    nodesTransfer?: (tag: HTMLButtonElement, children: HTMLSpanElement) => void;
+    childrenRef?: React.RefObject<HTMLSpanElement>;
     /**
      * Набор цветов для компонента
      */
@@ -98,9 +98,9 @@ declare const Tag: React.ForwardRefExoticComponent<Omit<NativeProps, "onClick">
         name?: string;
     }) => void) | undefined;
     /**
-     * Callback передачи нод tag и children
+     * ref на children
      */
-    nodesTransfer?: ((tag: HTMLButtonElement, children: HTMLSpanElement) => void) | undefined;
+    childrenRef?: React.RefObject<HTMLSpanElement> | undefined;
     /**
      * Набор цветов для компонента
      */

package/tag/cssm/Component.js

@@ -22,10 +22,9 @@ var colorStylesMap = {
 };
 var Tag = React.forwardRef(function (_a, ref) {
     var _b;
-    var rightAddons = _a.rightAddons, leftAddons = _a.leftAddons, children = _a.children, _c = _a.size, size = _c === void 0 ? 's' : _c, checked = _a.checked, className = _a.className, dataTestId = _a.dataTestId, name = _a.name, _d = _a.colors, colors = _d === void 0 ? 'default' : _d, onClick = _a.onClick, _e = _a.variant, variant = _e === void 0 ? 'default' : _e, shape = _a.shape, _f = _a.view, view = _f === void 0 ? 'outlined' : _f, nodesTransfer = _a.nodesTransfer, childrenClassName = _a.childrenClassName, restProps = tslib.__rest(_a, ["rightAddons", "leftAddons", "children", "size", "checked", "className", "dataTestId", "name", "colors", "onClick", "variant", "shape", "view", "nodesTransfer", "childrenClassName"]);
+    var rightAddons = _a.rightAddons, leftAddons = _a.leftAddons, children = _a.children, _c = _a.size, size = _c === void 0 ? 's' : _c, checked = _a.checked, className = _a.className, dataTestId = _a.dataTestId, name = _a.name, _d = _a.colors, colors = _d === void 0 ? 'default' : _d, onClick = _a.onClick, _e = _a.variant, variant = _e === void 0 ? 'default' : _e, shape = _a.shape, _f = _a.view, view = _f === void 0 ? 'outlined' : _f, childrenClassName = _a.childrenClassName, childrenRef = _a.childrenRef, restProps = tslib.__rest(_a, ["rightAddons", "leftAddons", "children", "size", "checked", "className", "dataTestId", "name", "colors", "onClick", "variant", "shape", "view", "childrenClassName", "childrenRef"]);
     var colorStyles = colorStylesMap[colors];
     var tagRef = React.useRef(null);
-    var childrenRef = React.useRef(null);
     var focused = hooks.useFocus(tagRef, 'keyboard')[0];
     var variantClassName = variant === 'default' ? 'rounded' : 'rectangular';
     var shapeClassName = shape || variantClassName;
@@ -44,12 +43,6 @@ var Tag = React.forwardRef(function (_a, ref) {
             onClick(event, { name: name, checked: !checked });
         }
     };
-    React.useLayoutEffect(function () {
-        var handlerAndNodesExist = nodesTransfer && tagRef.current && childrenRef.current;
-        if (handlerAndNodesExist) {
-            nodesTransfer(tagRef.current, childrenRef.current);
-        }
-    }, [nodesTransfer]);
     return (React__default.default.createElement("button", tslib.__assign({ ref: mergeRefs__default.default([tagRef, ref]), type: 'button', onClick: handleClick }, tagProps, restProps),
         leftAddons ? React__default.default.createElement("span", { className: styles__default.default.addons }, leftAddons) : null,
         children && (React__default.default.createElement("span", { ref: childrenRef, className: childrenClassName }, children)),

package/tag/esm/Component.d.ts

@@ -39,9 +39,9 @@ type TagProps = Omit<NativeProps, 'onClick'> & {
         name?: string;
     }) => void;
     /**
-     * Callback передачи нод tag и children
+     * ref на children
      */
-    nodesTransfer?: (tag: HTMLButtonElement, children: HTMLSpanElement) => void;
+    childrenRef?: React.RefObject<HTMLSpanElement>;
     /**
      * Набор цветов для компонента
      */
@@ -98,9 +98,9 @@ declare const Tag: React.ForwardRefExoticComponent<Omit<NativeProps, "onClick">
         name?: string;
     }) => void) | undefined;
     /**
-     * Callback передачи нод tag и children
+     * ref на children
      */
-    nodesTransfer?: ((tag: HTMLButtonElement, children: HTMLSpanElement) => void) | undefined;
+    childrenRef?: React.RefObject<HTMLSpanElement> | undefined;
     /**
      * Набор цветов для компонента
      */

package/tag/esm/Component.js

@@ -1,5 +1,5 @@
 import { __rest, __assign } from 'tslib';
-import React, { forwardRef, useRef, useLayoutEffect } from 'react';
+import React, { forwardRef, useRef } from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { useFocus } from '@alfalab/hooks';
@@ -19,10 +19,9 @@ var colorStylesMap = {
 };
 var Tag = forwardRef(function (_a, ref) {
     var _b;
-    var rightAddons = _a.rightAddons, leftAddons = _a.leftAddons, children = _a.children, _c = _a.size, size = _c === void 0 ? 's' : _c, checked = _a.checked, className = _a.className, dataTestId = _a.dataTestId, name = _a.name, _d = _a.colors, colors = _d === void 0 ? 'default' : _d, onClick = _a.onClick, _e = _a.variant, variant = _e === void 0 ? 'default' : _e, shape = _a.shape, _f = _a.view, view = _f === void 0 ? 'outlined' : _f, nodesTransfer = _a.nodesTransfer, childrenClassName = _a.childrenClassName, restProps = __rest(_a, ["rightAddons", "leftAddons", "children", "size", "checked", "className", "dataTestId", "name", "colors", "onClick", "variant", "shape", "view", "nodesTransfer", "childrenClassName"]);
+    var rightAddons = _a.rightAddons, leftAddons = _a.leftAddons, children = _a.children, _c = _a.size, size = _c === void 0 ? 's' : _c, checked = _a.checked, className = _a.className, dataTestId = _a.dataTestId, name = _a.name, _d = _a.colors, colors = _d === void 0 ? 'default' : _d, onClick = _a.onClick, _e = _a.variant, variant = _e === void 0 ? 'default' : _e, shape = _a.shape, _f = _a.view, view = _f === void 0 ? 'outlined' : _f, childrenClassName = _a.childrenClassName, childrenRef = _a.childrenRef, restProps = __rest(_a, ["rightAddons", "leftAddons", "children", "size", "checked", "className", "dataTestId", "name", "colors", "onClick", "variant", "shape", "view", "childrenClassName", "childrenRef"]);
     var colorStyles = colorStylesMap[colors];
     var tagRef = useRef(null);
-    var childrenRef = useRef(null);
     var focused = useFocus(tagRef, 'keyboard')[0];
     var variantClassName = variant === 'default' ? 'rounded' : 'rectangular';
     var shapeClassName = shape || variantClassName;
@@ -41,12 +40,6 @@ var Tag = forwardRef(function (_a, ref) {
             onClick(event, { name: name, checked: !checked });
         }
     };
-    useLayoutEffect(function () {
-        var handlerAndNodesExist = nodesTransfer && tagRef.current && childrenRef.current;
-        if (handlerAndNodesExist) {
-            nodesTransfer(tagRef.current, childrenRef.current);
-        }
-    }, [nodesTransfer]);
     return (React.createElement("button", __assign({ ref: mergeRefs([tagRef, ref]), type: 'button', onClick: handleClick }, tagProps, restProps),
         leftAddons ? React.createElement("span", { className: styles.addons }, leftAddons) : null,
         children && (React.createElement("span", { ref: childrenRef, className: childrenClassName }, children)),

package/tag/modern/Component.d.ts

@@ -39,9 +39,9 @@ type TagProps = Omit<NativeProps, 'onClick'> & {
         name?: string;
     }) => void;
     /**
-     * Callback передачи нод tag и children
+     * ref на children
      */
-    nodesTransfer?: (tag: HTMLButtonElement, children: HTMLSpanElement) => void;
+    childrenRef?: React.RefObject<HTMLSpanElement>;
     /**
      * Набор цветов для компонента
      */
@@ -98,9 +98,9 @@ declare const Tag: React.ForwardRefExoticComponent<Omit<NativeProps, "onClick">
         name?: string;
     }) => void) | undefined;
     /**
-     * Callback передачи нод tag и children
+     * ref на children
      */
-    nodesTransfer?: ((tag: HTMLButtonElement, children: HTMLSpanElement) => void) | undefined;
+    childrenRef?: React.RefObject<HTMLSpanElement> | undefined;
     /**
      * Набор цветов для компонента
      */

package/tag/modern/Component.js

@@ -1,4 +1,4 @@
-import React, { forwardRef, useRef, useLayoutEffect } from 'react';
+import React, { forwardRef, useRef } from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { useFocus } from '@alfalab/hooks';
@@ -16,10 +16,9 @@ const colorStylesMap = {
     default: defaultColors,
     inverted: invertedColors,
 };
-const Tag = forwardRef(({ rightAddons, leftAddons, children, size = 's', checked, className, dataTestId, name, colors = 'default', onClick, variant = 'default', shape, view = 'outlined', nodesTransfer, childrenClassName, ...restProps }, ref) => {
+const Tag = forwardRef(({ rightAddons, leftAddons, children, size = 's', checked, className, dataTestId, name, colors = 'default', onClick, variant = 'default', shape, view = 'outlined', childrenClassName, childrenRef, ...restProps }, ref) => {
     const colorStyles = colorStylesMap[colors];
     const tagRef = useRef(null);
-    const childrenRef = useRef(null);
     const [focused] = useFocus(tagRef, 'keyboard');
     const variantClassName = variant === 'default' ? 'rounded' : 'rectangular';
     const shapeClassName = shape || variantClassName;
@@ -38,12 +37,6 @@ const Tag = forwardRef(({ rightAddons, leftAddons, children, size = 's', checked
             onClick(event, { name, checked: !checked });
         }
     };
-    useLayoutEffect(() => {
-        const handlerAndNodesExist = nodesTransfer && tagRef.current && childrenRef.current;
-        if (handlerAndNodesExist) {
-            nodesTransfer(tagRef.current, childrenRef.current);
-        }
-    }, [nodesTransfer]);
     return (React.createElement("button", { ref: mergeRefs([tagRef, ref]), type: 'button', onClick: handleClick, ...tagProps, ...restProps },
         leftAddons ? React.createElement("span", { className: styles.addons }, leftAddons) : null,
         children && (React.createElement("span", { ref: childrenRef, className: childrenClassName }, children)),

package/themes/compiled/mobile-dark-bluetint.css

@@ -71,14 +71,6 @@
     border: 1px solid #121212;
 }.divider__component_1vgyo {
     border-bottom: 1px solid #2b2b2e;
-}.checkbox-group__error_vabza {
-    border-left: 1px solid #f15045;
-} .checkbox-group__label_vabza {
-    color: #fff;
-} .checkbox-group__errorMessage_vabza {
-    color: #f15045;
-} .checkbox-group__hint_vabza {
-    color: rgba(235, 235, 245, 0.54);
 }.checkbox__box_1lqkg {
     color: #0e0e0e;
     background-color: #0e0e0e;
@@ -143,6 +135,14 @@
 } .checkbox__indeterminateLine_1lqkg {
     background-color: #0e0e0e;
 } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
+}.checkbox-group__error_vabza {
+    border-left: 1px solid #f15045;
+} .checkbox-group__label_vabza {
+    color: #fff;
+} .checkbox-group__errorMessage_vabza {
+    color: #f15045;
+} .checkbox-group__hint_vabza {
+    color: rgba(235, 235, 245, 0.54);
 }.code-input__error_1iy7u {
     color: #f15045;
 } @keyframes code-input__shake_1iy7u {
@@ -431,17 +431,7 @@
     outline: 2px solid #0072ef;
 } .pure-input__component_evr8d:not(:disabled):hover {
     background-color: #202022;
-}.radio-group__error_o4fkf {
-    border-left: 1px solid #f15045;
-} .radio-group__label_o4fkf {
-    color: #fff;
-} .radio-group__errorMessage_o4fkf {
-    color: #f15045;
-} .radio-group__hint_o4fkf {
-    color: rgba(235, 235, 245, 0.54);
-} .radio-group__hiddenInput_o4fkf:focus ~ button {
-        outline: 2px solid #0072ef;
-    }.radio__container_i01xx:not(.radio__checked_i01xx):not(.radio__disabled_i01xx):not(.radio__inactive_i01xx) .radio__circle_i01xx {
+}.radio__container_i01xx:not(.radio__checked_i01xx):not(.radio__disabled_i01xx):not(.radio__inactive_i01xx) .radio__circle_i01xx {
             background-color: #0e0e0e;
             border: 1.5px solid #85858d;
         } .radio__container_i01xx:not(.radio__checked_i01xx):not(.radio__disabled_i01xx):not(.radio__inactive_i01xx):hover:not(:active) .radio__circle_i01xx {
@@ -483,7 +473,17 @@
     color: #fff;
 } .radio__hint_i01xx {
     color: rgba(235, 235, 245, 0.54);
-}.scrollbar__component_tymdo .scrollbar:before {
+}.radio-group__error_o4fkf {
+    border-left: 1px solid #f15045;
+} .radio-group__label_o4fkf {
+    color: #fff;
+} .radio-group__errorMessage_o4fkf {
+    color: #f15045;
+} .radio-group__hint_o4fkf {
+    color: rgba(235, 235, 245, 0.54);
+} .radio-group__hiddenInput_o4fkf:focus ~ button {
+        outline: 2px solid #0072ef;
+    }.scrollbar__component_tymdo .scrollbar:before {
             background-color: rgba(255, 255, 255, 0.3);
         } .scrollbar__component_tymdo.dragging .track .scrollbar.visible:before {
             background-color: rgba(255, 255, 255, 0.6);
@@ -493,22 +493,7 @@
             background-color: rgba(14, 14, 14, 0.3);
         } .scrollbar__component_tvvbd.dragging .track .scrollbar.visible:before {
             background-color: rgba(14, 14, 14, 0.6);
-        }.segmented-control__wrapper_15iod {
-    background-color: rgba(255, 255, 255, 0.06);
-} .segmented-control__selectedBox_15iod {
-    border: 0.5px solid #1c1c1e;
-    box-shadow: 0 12px 16px rgba(0, 0, 0, 0.04), 0 4px 8px rgba(0, 0, 0, 0.04),
-        0 0 1px rgba(0, 0, 0, 0.04);
-    background-color: #121212;
-}
-.segmented-control__segment_zpknt {
-    background-color: transparent;
-    color: #fff
-} .segmented-control__segment_zpknt:not(:first-child):before {
-        background-color: #2b2b2e;
-    } .segmented-control__focused_zpknt {
-    outline: 2px solid #0072ef;
-}.skeleton__component_1xabk {
+        }.skeleton__component_1xabk {
     color: transparent;
     background: rgba(255, 255, 255, 0.1);
 } .skeleton__component_1xabk:before {
@@ -530,6 +515,21 @@
     100% {
         background: rgb(198, 205, 214);
     }
+}.segmented-control__wrapper_15iod {
+    background-color: rgba(255, 255, 255, 0.06);
+} .segmented-control__selectedBox_15iod {
+    border: 0.5px solid #1c1c1e;
+    box-shadow: 0 12px 16px rgba(0, 0, 0, 0.04), 0 4px 8px rgba(0, 0, 0, 0.04),
+        0 0 1px rgba(0, 0, 0, 0.04);
+    background-color: #121212;
+}
+.segmented-control__segment_zpknt {
+    background-color: transparent;
+    color: #fff
+} .segmented-control__segment_zpknt:not(:first-child):before {
+        background-color: #2b2b2e;
+    } .segmented-control__focused_zpknt {
+    outline: 2px solid #0072ef;
 }.slider__component_ovogz .noUi-base:hover .noUi-connects {
             background: #303032;
         } .slider__component_ovogz .noUi-base:hover .noUi-connect {
@@ -717,49 +717,4 @@
             background-color: rgb(237, 237, 237);
         } .tag__component_wgu6a.tag__checked_wgu6a:active:not(:disabled) {
             background-color: rgb(217, 217, 217);
-        }.typography__tertiary_1bml9 {
-    color: rgba(235, 235, 245, 0.32);
-} .typography__disabled_1bml9 {
-    color: rgba(235, 235, 245, 0.2);
-} .typography__accent_1bml9 {
-    color: #ef3124;
-} .typography__primary_1bml9 {
-    color: #fff;
-} .typography__attention_1bml9 {
-    color: #cb830f;
-} .typography__positive_1bml9 {
-    color: #13a463;
-} .typography__secondary_1bml9 {
-    color: rgba(235, 235, 245, 0.54);
-} .typography__tertiary-inverted_1bml9 {
-    color: rgba(60, 60, 67, 0.4);
-} .typography__primary-inverted_1bml9 {
-    color: #0e0e0e;
-} .typography__secondary-inverted_1bml9 {
-    color: rgba(60, 60, 67, 0.66);
-} .typography__link_1bml9 {
-    color: #0072ef;
-} .typography__negative_1bml9 {
-    color: #f15045;
-} .typography__static-primary-light_1bml9 {
-    color: #fff;
-} .typography__static-secondary-light_1bml9 {
-    color: rgba(235, 235, 245, 0.54);
-} .typography__static-tertiary-light_1bml9 {
-    color: rgba(235, 235, 245, 0.32);
-} .typography__static-primary-dark_1bml9 {
-    color: #0e0e0e;
-} .typography__static-secondary-dark_1bml9 {
-    color: rgba(60, 60, 67, 0.66);
-} .typography__static-tertiary-dark_1bml9 {
-    color: rgba(60, 60, 67, 0.4);
-} .typography__static-accent_1bml9 {
-    color: #ef3124;
-}
-
-
-
-
-@media screen and (min-width: 600px) {
-} @media screen and (min-width: 1024px) {
-}
+        }

package/themes/dist/compiled/mobile-dark-bluetint.css

@@ -71,14 +71,6 @@
     border: 1px solid #121212;
 }.divider__component_1vgyo {
     border-bottom: 1px solid #2b2b2e;
-}.checkbox-group__error_vabza {
-    border-left: 1px solid #f15045;
-} .checkbox-group__label_vabza {
-    color: #fff;
-} .checkbox-group__errorMessage_vabza {
-    color: #f15045;
-} .checkbox-group__hint_vabza {
-    color: rgba(235, 235, 245, 0.54);
 }.checkbox__box_1lqkg {
     color: #0e0e0e;
     background-color: #0e0e0e;
@@ -143,6 +135,14 @@
 } .checkbox__indeterminateLine_1lqkg {
     background-color: #0e0e0e;
 } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
+}.checkbox-group__error_vabza {
+    border-left: 1px solid #f15045;
+} .checkbox-group__label_vabza {
+    color: #fff;
+} .checkbox-group__errorMessage_vabza {
+    color: #f15045;
+} .checkbox-group__hint_vabza {
+    color: rgba(235, 235, 245, 0.54);
 }.code-input__error_1iy7u {
     color: #f15045;
 } @keyframes code-input__shake_1iy7u {
@@ -431,17 +431,7 @@
     outline: 2px solid #0072ef;
 } .pure-input__component_evr8d:not(:disabled):hover {
     background-color: #202022;
-}.radio-group__error_o4fkf {
-    border-left: 1px solid #f15045;
-} .radio-group__label_o4fkf {
-    color: #fff;
-} .radio-group__errorMessage_o4fkf {
-    color: #f15045;
-} .radio-group__hint_o4fkf {
-    color: rgba(235, 235, 245, 0.54);
-} .radio-group__hiddenInput_o4fkf:focus ~ button {
-        outline: 2px solid #0072ef;
-    }.radio__container_i01xx:not(.radio__checked_i01xx):not(.radio__disabled_i01xx):not(.radio__inactive_i01xx) .radio__circle_i01xx {
+}.radio__container_i01xx:not(.radio__checked_i01xx):not(.radio__disabled_i01xx):not(.radio__inactive_i01xx) .radio__circle_i01xx {
             background-color: #0e0e0e;
             border: 1.5px solid #85858d;
         } .radio__container_i01xx:not(.radio__checked_i01xx):not(.radio__disabled_i01xx):not(.radio__inactive_i01xx):hover:not(:active) .radio__circle_i01xx {
@@ -483,7 +473,17 @@
     color: #fff;
 } .radio__hint_i01xx {
     color: rgba(235, 235, 245, 0.54);
-}.scrollbar__component_tymdo .scrollbar:before {
+}.radio-group__error_o4fkf {
+    border-left: 1px solid #f15045;
+} .radio-group__label_o4fkf {
+    color: #fff;
+} .radio-group__errorMessage_o4fkf {
+    color: #f15045;
+} .radio-group__hint_o4fkf {
+    color: rgba(235, 235, 245, 0.54);
+} .radio-group__hiddenInput_o4fkf:focus ~ button {
+        outline: 2px solid #0072ef;
+    }.scrollbar__component_tymdo .scrollbar:before {
             background-color: rgba(255, 255, 255, 0.3);
         } .scrollbar__component_tymdo.dragging .track .scrollbar.visible:before {
             background-color: rgba(255, 255, 255, 0.6);
@@ -493,22 +493,7 @@
             background-color: rgba(14, 14, 14, 0.3);
         } .scrollbar__component_tvvbd.dragging .track .scrollbar.visible:before {
             background-color: rgba(14, 14, 14, 0.6);
-        }.segmented-control__wrapper_15iod {
-    background-color: rgba(255, 255, 255, 0.06);
-} .segmented-control__selectedBox_15iod {
-    border: 0.5px solid #1c1c1e;
-    box-shadow: 0 12px 16px rgba(0, 0, 0, 0.04), 0 4px 8px rgba(0, 0, 0, 0.04),
-        0 0 1px rgba(0, 0, 0, 0.04);
-    background-color: #121212;
-}
-.segmented-control__segment_zpknt {
-    background-color: transparent;
-    color: #fff
-} .segmented-control__segment_zpknt:not(:first-child):before {
-        background-color: #2b2b2e;
-    } .segmented-control__focused_zpknt {
-    outline: 2px solid #0072ef;
-}.skeleton__component_1xabk {
+        }.skeleton__component_1xabk {
     color: transparent;
     background: rgba(255, 255, 255, 0.1);
 } .skeleton__component_1xabk:before {
@@ -530,6 +515,21 @@
     100% {
         background: rgb(198, 205, 214);
     }
+}.segmented-control__wrapper_15iod {
+    background-color: rgba(255, 255, 255, 0.06);
+} .segmented-control__selectedBox_15iod {
+    border: 0.5px solid #1c1c1e;
+    box-shadow: 0 12px 16px rgba(0, 0, 0, 0.04), 0 4px 8px rgba(0, 0, 0, 0.04),
+        0 0 1px rgba(0, 0, 0, 0.04);
+    background-color: #121212;
+}
+.segmented-control__segment_zpknt {
+    background-color: transparent;
+    color: #fff
+} .segmented-control__segment_zpknt:not(:first-child):before {
+        background-color: #2b2b2e;
+    } .segmented-control__focused_zpknt {
+    outline: 2px solid #0072ef;
 }.slider__component_ovogz .noUi-base:hover .noUi-connects {
             background: #303032;
         } .slider__component_ovogz .noUi-base:hover .noUi-connect {
@@ -1444,7 +1444,9 @@
         color: #fff;
     } .circular-progress-bar__iconWrapper_x4tag.circular-progress-bar__icon-secondary_x4tag {
         color: #85858d;
-    }.chart__coreChart_3uku9 .recharts-text tspan {
+    }.list-header__filled_4lf5h {
+    background-color: rgba(255, 255, 255, 0.1);
+}.chart__coreChart_3uku9 .recharts-text tspan {
         fill: #fff;
     }
 @keyframes chart__showDot_tainb {
@@ -1467,8 +1469,6 @@
     background-color: #121212;
 } .chart__tooltipArrow_1ketq:before {
     border-color: transparent #121212 transparent transparent;
-}.list-header__filled_4lf5h {
-    background-color: rgba(255, 255, 255, 0.1);
 }.list__list_1jqtb {
     color: #fff;
 }
@@ -2092,7 +2092,6 @@
 }
 .amount-input__minorPartAndCurrency_1bt25 {
     color: rgba(60, 60, 67, 0.66);
-}@media (min-width: 600px) {
 }.tooltip__hint_zrry2 {
     background-color: #fff;
     box-shadow: 0 20px 24px rgba(0, 0, 0, 0.2), 0 12px 16px rgba(0, 0, 0, 0.16),
@@ -2122,7 +2121,8 @@
 } .tooltip__hint_1wkwr .tooltip__arrow_1wkwr:after {
     background-color: #121212;
 }
-
+@media (min-width: 600px) {
+}
 .calendar__wrapper_ojo29 {
     background: #121212;
 } .calendar__calendar_ojo29 th {
@@ -2229,7 +2229,50 @@
                 color: #0e0e0e;
             }
 @media (max-width: 374px) {
-        }.select__arrow_196xx {
+        }.gallery__modal_bv9xy {
+    background: transparent;
+}
+.gallery__header_146bh {
+    background-color: #e9e9eb;
+}
+
+.gallery__component_1jo8n {
+    border: 2px solid rgba(0, 0, 0, 0);
+} .gallery__active_1jo8n {
+    border-color: #000
+} .gallery__image_1jo8n {
+    background-color: #121212
+} .gallery__loading_1jo8n {
+    background-color: #e9eaeb;
+} .gallery__brokenImageWrapper_1jo8n {
+    background-color: #121212
+} .gallery__focused_1jo8n {
+    outline: 2px solid #0072ef;
+}
+.gallery__component_191kf {
+    background-color: rgba(255, 255, 255, 0.5);
+} .gallery__slideLoading_191kf {
+    background-color: #e9eaeb;
+} .gallery__image_191kf {
+    background-color: #121212;
+} .gallery__smallImage_191kf {
+    background-color: #121212;
+} .gallery__arrow_191kf {
+    color: #0e0e0e
+} .gallery__arrow_191kf:hover {
+        background-color: rgba(255, 255, 255, 0.1);
+    } .gallery__arrow_191kf:active {
+        background-color: rgba(255, 255, 255, 0.2);
+    } .gallery__focused_191kf {
+    outline: 2px solid #0072ef;
+} .gallery__placeholder_191kf {
+    background-color: #121212;
+} .gallery__fullScreenImage_191kf {
+    background-color: #121212;
+}
+.gallery__component_nqftv {
+    background-color: #e9e9eb
+}.select__arrow_196xx {
     color: #fff;
 }
 
@@ -2337,49 +2380,6 @@
 }
 .select__footer_18cwu {
     background: #121212
-}.gallery__modal_bv9xy {
-    background: transparent;
-}
-.gallery__header_146bh {
-    background-color: #e9e9eb;
-}
-
-.gallery__component_1jo8n {
-    border: 2px solid rgba(0, 0, 0, 0);
-} .gallery__active_1jo8n {
-    border-color: #000
-} .gallery__image_1jo8n {
-    background-color: #121212
-} .gallery__loading_1jo8n {
-    background-color: #e9eaeb;
-} .gallery__brokenImageWrapper_1jo8n {
-    background-color: #121212
-} .gallery__focused_1jo8n {
-    outline: 2px solid #0072ef;
-}
-.gallery__component_191kf {
-    background-color: rgba(255, 255, 255, 0.5);
-} .gallery__slideLoading_191kf {
-    background-color: #e9eaeb;
-} .gallery__image_191kf {
-    background-color: #121212;
-} .gallery__smallImage_191kf {
-    background-color: #121212;
-} .gallery__arrow_191kf {
-    color: #0e0e0e
-} .gallery__arrow_191kf:hover {
-        background-color: rgba(255, 255, 255, 0.1);
-    } .gallery__arrow_191kf:active {
-        background-color: rgba(255, 255, 255, 0.2);
-    } .gallery__focused_191kf {
-    outline: 2px solid #0072ef;
-} .gallery__placeholder_191kf {
-    background-color: #121212;
-} .gallery__fullScreenImage_191kf {
-    background-color: #121212;
-}
-.gallery__component_nqftv {
-    background-color: #e9e9eb
 }.calendar-with-skeleton__skeleton_1ir2j {
     background-color: #121212;
 }.date-range-input__calendarContainer_ltwj3 {