@alfalab/core-components 47.24.1 → 47.25.1

package/file-upload-item/modern/index.css

@@ -1,4 +1,4 @@
-/* hash: 1e0ny */
+/* hash: 1oklu */
 :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-neutral-300: #e7e8eb;
@@ -36,7 +36,7 @@
     --gap-24: var(--gap-xl);
 } :root {
 } :root {
-} /* сбрасывает синюю подсветку при нажатии */ .file-upload-item__component_1hur4 {
+} /* сбрасывает синюю подсветку при нажатии */ .file-upload-item__component_au643 {
     font-size: 13px;
     line-height: 16px;
     font-weight: 400;
@@ -48,78 +48,78 @@
     color: var(--color-light-text-secondary);
     box-shadow: 0 -1px 0 0 var(--color-light-neutral-300) inset;
     box-sizing: border-box
-} .file-upload-item__component_1hur4 svg {
+} .file-upload-item__component_au643 svg {
         display: block;
-    } .file-upload-item__component_1hur4:last-child {
+    } .file-upload-item__component_au643:last-child {
         box-shadow: none;
-    } .file-upload-item__infoSection_1hur4 {
+    } .file-upload-item__infoSection_au643 {
     display: flex;
     flex-direction: column;
     flex: 1;
     margin-top: var(--gap-4);
     margin-left: var(--gap-12);
     min-width: 40%;
-} .file-upload-item__info_1hur4 {
+} .file-upload-item__info_au643 {
     display: flex;
     flex-wrap: wrap;
     flex: 1;
     overflow: hidden;
-} .file-upload-item__icon_1hur4 {
+} .file-upload-item__icon_au643 {
     display: block;
     flex-shrink: 0;
     color: var(--color-light-neutral-translucent-1300);
-} .file-upload-item__errorIcon_1hur4 {
+} .file-upload-item__errorIcon_au643 {
     flex-shrink: 0;
     color: var(--color-light-status-negative);
-} .file-upload-item__successIcon_1hur4 {
+} .file-upload-item__successIcon_au643 {
     flex-shrink: 0;
     color: var(--color-light-status-positive);
-} .file-upload-item__name_1hur4 {
+} .file-upload-item__name_au643 {
     color: var(--color-light-text-primary)
-} .file-upload-item__name_1hur4 a {
+} .file-upload-item__name_au643 a {
         display: block;
         margin-bottom: 1px;
-    } .file-upload-item__name_1hur4.file-upload-item__rowLimit_1hur4 {
+    } .file-upload-item__name_au643.file-upload-item__rowLimit_au643 {
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
-    } .file-upload-item__meta_1hur4 {
+    } .file-upload-item__meta_au643 {
     display: flex;
     white-space: nowrap;
     margin-right: var(--gap-4);
     margin-left: 36px;
     padding: var(--gap-4) var(--gap-0)
-} .file-upload-item__meta_1hur4 > * {
+} .file-upload-item__meta_au643 > * {
         margin-right: var(--gap-12)
-    } .file-upload-item__meta_1hur4 > *:last-child {
+    } .file-upload-item__meta_au643 > *:last-child {
             margin-right: var(--gap-0);
-        } .file-upload-item__size_1hur4 {
+        } .file-upload-item__size_au643 {
     text-align: right;
-} .file-upload-item__delete_1hur4,
-.file-upload-item__download_1hur4 {
+} .file-upload-item__delete_au643,
+.file-upload-item__download_au643 {
     height: 24px;
     width: 24px;
     margin-left: var(--gap-8);
-} .file-upload-item__errorWrapper_1hur4 {
+} .file-upload-item__errorWrapper_au643 {
     margin-top: var(--gap-4);
     color: var(--color-light-text-negative);
-} .file-upload-item__restore_1hur4 {
+} .file-upload-item__restore_au643 {
     font-size: 14px;
     line-height: 20px;
     font-weight: 400;
 
     margin-left: var(--gap-12);
     margin-top: var(--gap-2);
-} .file-upload-item__spinnerWrapper_1hur4 {
+} .file-upload-item__spinnerWrapper_au643 {
     display: flex;
     justify-content: center;
     align-items: center;
     width: 24px;
     height: 24px;
-} .file-upload-item__spinner_1hur4 {
+} .file-upload-item__spinner_au643 {
     width: 20px;
     height: 20px;
-} .file-upload-item__uploadPercent_1hur4 {
+} .file-upload-item__uploadPercent_au643 {
     margin-top: var(--gap-4);
     margin-left: var(--gap-24);
 }

package/filter-tag/components/base-filter-tag/Component.js

@@ -13,7 +13,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var commonStyles = {"component":"filter-tag__component_1i1a4","block":"filter-tag__block_1i1a4","disabled":"filter-tag__disabled_1i1a4","rounded":"filter-tag__rounded_1i1a4","size-32":"filter-tag__size-32_1i1a4","size-40":"filter-tag__size-40_1i1a4","size-48":"filter-tag__size-48_1i1a4","checked":"filter-tag__checked_1i1a4","content":"filter-tag__content_1i1a4","focused":"filter-tag__focused_1i1a4","chevron":"filter-tag__chevron_1i1a4","valueButton":"filter-tag__valueButton_1i1a4","outlined":"filter-tag__outlined_1i1a4","filled":"filter-tag__filled_1i1a4","open":"filter-tag__open_1i1a4","close":"filter-tag__close_1i1a4","clear":"filter-tag__clear_1i1a4","iconWrapper":"filter-tag__iconWrapper_1i1a4"};
+var commonStyles = {"component":"filter-tag__component_1nsat","block":"filter-tag__block_1nsat","disabled":"filter-tag__disabled_1nsat","rounded":"filter-tag__rounded_1nsat","size-32":"filter-tag__size-32_1nsat","size-40":"filter-tag__size-40_1nsat","size-48":"filter-tag__size-48_1nsat","checked":"filter-tag__checked_1nsat","content":"filter-tag__content_1nsat","focused":"filter-tag__focused_1nsat","chevron":"filter-tag__chevron_1nsat","valueButton":"filter-tag__valueButton_1nsat","outlined":"filter-tag__outlined_1nsat","filled":"filter-tag__filled_1nsat","open":"filter-tag__open_1nsat","close":"filter-tag__close_1nsat","clear":"filter-tag__clear_1nsat","iconWrapper":"filter-tag__iconWrapper_1nsat"};
 require('./index.css');
 
 var isKeyBoardEvent = function (event) {

package/filter-tag/components/base-filter-tag/index.css

@@ -1,4 +1,4 @@
-/* hash: 51ac3 */
+/* hash: 16e8s */
 :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-accent-secondary: #212124;
@@ -37,8 +37,7 @@
     --gap-xs: 8px; /* deprecated */
     --gap-s: 12px; /* deprecated */ /* deprecated */
     --gap-m: 16px; /* deprecated */
-    --gap-l: 20px; /* deprecated */
-    --gap-xl: 24px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+    --gap-l: 20px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
     --gap-0: 0;
@@ -47,7 +46,6 @@
     --gap-12: var(--gap-s);
     --gap-16: var(--gap-m);
     --gap-20: var(--gap-l);
-    --gap-24: var(--gap-xl);
 } :root {
 } :root {
     --focus-color: var(--color-light-status-info);
@@ -66,6 +64,10 @@
     --tag-border-color-disabled: var(--color-light-neutral-translucent-500);
     --tag-border-width: 1px;
     --tag-border-radius: var(--border-radius-pill);
+
+    /* rectangular border-radius */
+
+    /* rounded border-radius */
     --tag-rounded-xxs-border-radius: var(--border-radius-pill);
     --tag-rounded-xs-border-radius: var(--border-radius-pill);
     --tag-rounded-s-border-radius: var(--border-radius-pill);
@@ -107,49 +109,49 @@
     /* mobile inverted */
 } :root {
     --filter-tag-separator-background-color-hover: transparent;
-} .filter-tag__component_1i1a4 {
+} .filter-tag__component_1nsat {
     display: flex;
     width: max-content;
     max-width: 100%;
     box-sizing: border-box
-} .filter-tag__component_1i1a4.filter-tag__block_1i1a4 {
+} .filter-tag__component_1nsat.filter-tag__block_1nsat {
         width: 100%;
-    } .filter-tag__component_1i1a4.filter-tag__disabled_1i1a4 {
+    } .filter-tag__component_1nsat.filter-tag__disabled_1nsat {
         background-color: var(--tag-outlined-background-color-disabled);
-    } .filter-tag__component_1i1a4.filter-tag__rounded_1i1a4.filter-tag__size-32_1i1a4 {
+    } .filter-tag__component_1nsat.filter-tag__rounded_1nsat.filter-tag__size-32_1nsat {
             border-radius: var(--tag-rounded-xxs-border-radius);
-        } .filter-tag__component_1i1a4.filter-tag__rounded_1i1a4.filter-tag__size-40_1i1a4 {
+        } .filter-tag__component_1nsat.filter-tag__rounded_1nsat.filter-tag__size-40_1nsat {
             border-radius: var(--tag-rounded-xs-border-radius);
-        } .filter-tag__component_1i1a4.filter-tag__rounded_1i1a4.filter-tag__size-48_1i1a4 {
+        } .filter-tag__component_1nsat.filter-tag__rounded_1nsat.filter-tag__size-48_1nsat {
             border-radius: var(--tag-rounded-s-border-radius);
-        } .filter-tag__component_1i1a4.filter-tag__checked_1i1a4:not(.filter-tag__disabled_1i1a4) {
+        } .filter-tag__component_1nsat.filter-tag__checked_1nsat:not(.filter-tag__disabled_1nsat) {
             background-color: var(--tag-background-color-checked);
-        } .filter-tag__component_1i1a4.filter-tag__checked_1i1a4:not(.filter-tag__disabled_1i1a4).filter-tag__size-32_1i1a4 {
-            min-width: 84px;
-        } .filter-tag__component_1i1a4.filter-tag__checked_1i1a4:not(.filter-tag__disabled_1i1a4).filter-tag__size-40_1i1a4 {
-            min-width: 104px;
-        } .filter-tag__component_1i1a4.filter-tag__checked_1i1a4:not(.filter-tag__disabled_1i1a4).filter-tag__size-48_1i1a4 {
-            min-width: 116px;
+        } .filter-tag__component_1nsat.filter-tag__checked_1nsat:not(.filter-tag__disabled_1nsat).filter-tag__size-32_1nsat {
+            min-width: 80px;
+        } .filter-tag__component_1nsat.filter-tag__checked_1nsat:not(.filter-tag__disabled_1nsat).filter-tag__size-40_1nsat {
+            min-width: 100px;
+        } .filter-tag__component_1nsat.filter-tag__checked_1nsat:not(.filter-tag__disabled_1nsat).filter-tag__size-48_1nsat {
+            min-width: 112px;
         } @media (hover: hover) {
-            .filter-tag__component_1i1a4.filter-tag__checked_1i1a4:not(.filter-tag__disabled_1i1a4):hover {
+            .filter-tag__component_1nsat.filter-tag__checked_1nsat:not(.filter-tag__disabled_1nsat):hover {
                 background-color: var(--tag-background-color-checked-hover);
             }
-        } .filter-tag__component_1i1a4.filter-tag__checked_1i1a4:not(.filter-tag__disabled_1i1a4):active {
+        } .filter-tag__component_1nsat.filter-tag__checked_1nsat:not(.filter-tag__disabled_1nsat):active {
             background-color: var(--tag-background-color-checked-active);
-        } .filter-tag__content_1i1a4 {
+        } .filter-tag__content_1nsat {
     overflow: hidden;
     text-overflow: ellipsis;
-} .filter-tag__focused_1i1a4 {
+} .filter-tag__focused_1nsat {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
-} .filter-tag__chevron_1i1a4 {
+} .filter-tag__chevron_1nsat {
     position: relative;
     transition: transform 0.2s ease;
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--color-light-neutral-translucent-1300);
-} .filter-tag__valueButton_1i1a4 {
+} .filter-tag__valueButton_1nsat {
     display: flex;
     align-items: center;
     box-shadow: none;
@@ -161,134 +163,138 @@
     font-family: var(--font-family);
     color: var(--tag-text-color);
     background-color: var(--tag-outlined-background-color);
-    border-width: var(--tag-border-width);
-    border-color: var(--tag-border-color);
-    border-style: solid;
     transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
-    margin: var(--gap-0)
-} .filter-tag__valueButton_1i1a4.filter-tag__block_1i1a4 {
+    margin: var(--gap-0);
+    border: var(--tag-border-width) solid var(--tag-border-color)
+} .filter-tag__valueButton_1nsat.filter-tag__block_1nsat {
         width: inherit;
         justify-content: center;
-    } .filter-tag__valueButton_1i1a4:disabled {
+    } .filter-tag__valueButton_1nsat:disabled {
         cursor: var(--disabled-cursor)
-    } .filter-tag__valueButton_1i1a4:disabled > .filter-tag__chevron_1i1a4 {
+    } .filter-tag__valueButton_1nsat:disabled > .filter-tag__chevron_1nsat {
             color: var(--color-light-neutral-500);
-        } .filter-tag__valueButton_1i1a4.filter-tag__rounded_1i1a4.filter-tag__size-32_1i1a4 {
+        } .filter-tag__valueButton_1nsat.filter-tag__rounded_1nsat.filter-tag__size-32_1nsat {
             border-radius: var(--tag-rounded-xxs-border-radius);
-        } .filter-tag__valueButton_1i1a4.filter-tag__rounded_1i1a4.filter-tag__size-40_1i1a4 {
+        } .filter-tag__valueButton_1nsat.filter-tag__rounded_1nsat.filter-tag__size-40_1nsat {
             border-radius: var(--tag-rounded-xs-border-radius);
-        } .filter-tag__valueButton_1i1a4.filter-tag__rounded_1i1a4.filter-tag__size-48_1i1a4 {
+        } .filter-tag__valueButton_1nsat.filter-tag__rounded_1nsat.filter-tag__size-48_1nsat {
             border-radius: var(--tag-rounded-s-border-radius);
-        } .filter-tag__valueButton_1i1a4.filter-tag__size-32_1i1a4 {
-        min-width: 60px;
+        } .filter-tag__valueButton_1nsat.filter-tag__size-32_1nsat {
+        min-width: 52px;
         min-height: var(--size-xxs-height);
-    } .filter-tag__valueButton_1i1a4.filter-tag__size-40_1i1a4 {
-        min-width: 72px;
+    } .filter-tag__valueButton_1nsat.filter-tag__size-40_1nsat {
+        min-width: 64px;
         min-height: var(--size-xs-height);
-    } .filter-tag__valueButton_1i1a4.filter-tag__size-48_1i1a4 {
-        min-width: 80px;
+    } .filter-tag__valueButton_1nsat.filter-tag__size-48_1nsat {
+        min-width: 72px;
         min-height: var(--size-s-height);
-    } .filter-tag__valueButton_1i1a4.filter-tag__outlined_1i1a4 {
+    } .filter-tag__valueButton_1nsat.filter-tag__outlined_1nsat {
         color: var(--tag-text-color);
         border-color: var(--tag-border-color);
         background-color: var(--tag-outlined-background-color)
-    } .filter-tag__valueButton_1i1a4.filter-tag__outlined_1i1a4:disabled {
+    } .filter-tag__valueButton_1nsat.filter-tag__outlined_1nsat:disabled {
             border-color: var(--tag-border-color-disabled);
             color: var(--tag-text-color-disabled);
             background-color: var(--tag-outlined-background-color-disabled);
         } @media (hover: hover) {
-            .filter-tag__valueButton_1i1a4.filter-tag__outlined_1i1a4:not(:disabled):hover {
+            .filter-tag__valueButton_1nsat.filter-tag__outlined_1nsat:not(:disabled):hover {
                 border-color: var(--tag-border-color-hover);
                 background-color: var(--tag-outlined-background-color-hover);
             }
-        } .filter-tag__valueButton_1i1a4.filter-tag__outlined_1i1a4:not(:disabled):active {
+        } .filter-tag__valueButton_1nsat.filter-tag__outlined_1nsat:not(:disabled):active {
             border-color: var(--tag-border-color-active);
             background-color: var(--tag-outlined-background-color-active);
-        } .filter-tag__valueButton_1i1a4.filter-tag__filled_1i1a4 {
+        } .filter-tag__valueButton_1nsat.filter-tag__filled_1nsat {
         color: var(--tag-text-color);
         border-color: var(--tag-filled-border-color)
-    } .filter-tag__valueButton_1i1a4.filter-tag__filled_1i1a4:disabled {
+    } .filter-tag__valueButton_1nsat.filter-tag__filled_1nsat:disabled {
             color: var(--tag-text-color-disabled);
-        } .filter-tag__valueButton_1i1a4.filter-tag__size-48_1i1a4 {
+        } .filter-tag__valueButton_1nsat.filter-tag__size-48_1nsat {
         font-size: 16px;
         line-height: 24px;
         font-weight: 400;
-        padding-right: var(--gap-12);
-        padding-left: var(--gap-24)
-    } .filter-tag__valueButton_1i1a4.filter-tag__size-48_1i1a4 .filter-tag__chevron_1i1a4 {
+        padding-right: var(--gap-8);
+        padding-left: var(--gap-20)
+    } .filter-tag__valueButton_1nsat.filter-tag__size-48_1nsat .filter-tag__chevron_1nsat {
             margin: var(--gap-0) var(--gap-8);
-        } .filter-tag__valueButton_1i1a4.filter-tag__size-40_1i1a4 {
+        } .filter-tag__valueButton_1nsat.filter-tag__size-40_1nsat {
         font-size: 14px;
         line-height: 20px;
         font-weight: 400;
-        padding-right: var(--gap-8);
-        padding-left: var(--gap-20)
-    } .filter-tag__valueButton_1i1a4.filter-tag__size-40_1i1a4 .filter-tag__chevron_1i1a4 {
+        padding-right: var(--gap-4);
+        padding-left: var(--gap-16)
+    } .filter-tag__valueButton_1nsat.filter-tag__size-40_1nsat .filter-tag__chevron_1nsat {
             margin: var(--gap-0) var(--gap-12) var(--gap-0) 6px;
-        } .filter-tag__valueButton_1i1a4.filter-tag__size-32_1i1a4 {
+        } .filter-tag__valueButton_1nsat.filter-tag__size-32_1nsat {
         font-size: 14px;
         line-height: 20px;
         font-weight: 400;
-        padding-right: var(--gap-4);
-        padding-left: var(--gap-16)
-    } .filter-tag__valueButton_1i1a4.filter-tag__size-32_1i1a4 .filter-tag__chevron_1i1a4 {
+        padding-right: var(--gap-0);
+        padding-left: var(--gap-12)
+    } .filter-tag__valueButton_1nsat.filter-tag__size-32_1nsat .filter-tag__chevron_1nsat {
             margin: var(--gap-0) var(--gap-8) var(--gap-0) 6px;
-        } .filter-tag__valueButton_1i1a4.filter-tag__open_1i1a4 .filter-tag__chevron_1i1a4 {
+        } .filter-tag__valueButton_1nsat.filter-tag__open_1nsat .filter-tag__chevron_1nsat {
         transform: rotateZ(180deg);
-    } .filter-tag__valueButton_1i1a4.filter-tag__checked_1i1a4 {
+    } .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat {
         border-width: 0;
         color: var(--tag-text-color-checked);
         background-color: var(--tag-background-color-checked)
-    } .filter-tag__valueButton_1i1a4.filter-tag__checked_1i1a4 > .filter-tag__chevron_1i1a4 {
+    } .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat > .filter-tag__chevron_1nsat {
             color: var(--color-light-neutral-translucent-1300-inverted);
-        } .filter-tag__valueButton_1i1a4.filter-tag__checked_1i1a4.filter-tag__rounded_1i1a4.filter-tag__size-32_1i1a4 {
+        } .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat.filter-tag__rounded_1nsat.filter-tag__size-32_1nsat {
                 border-radius: var(--tag-rounded-xxs-border-radius) 0 0
                     var(--tag-rounded-xxs-border-radius);
-            } .filter-tag__valueButton_1i1a4.filter-tag__checked_1i1a4.filter-tag__rounded_1i1a4.filter-tag__size-40_1i1a4 {
+            } .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat.filter-tag__rounded_1nsat.filter-tag__size-40_1nsat {
                 border-radius: var(--tag-rounded-xs-border-radius) 0 0
                     var(--tag-rounded-xs-border-radius);
-            } .filter-tag__valueButton_1i1a4.filter-tag__checked_1i1a4.filter-tag__rounded_1i1a4.filter-tag__size-48_1i1a4 {
+            } .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat.filter-tag__rounded_1nsat.filter-tag__size-48_1nsat {
                 border-radius: var(--tag-rounded-s-border-radius) 0 0
                     var(--tag-rounded-s-border-radius);
-            } .filter-tag__valueButton_1i1a4.filter-tag__checked_1i1a4.filter-tag__rounded_1i1a4:disabled,
-            .filter-tag__valueButton_1i1a4.filter-tag__checked_1i1a4.filter-tag__rounded_1i1a4.filter-tag__close_1i1a4 {
+            } .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat.filter-tag__rounded_1nsat:disabled,
+            .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat.filter-tag__rounded_1nsat.filter-tag__close_1nsat {
                 border-radius: var(--tag-border-radius);
-            } .filter-tag__valueButton_1i1a4.filter-tag__checked_1i1a4:not(:disabled) {
+            } .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat:not(:disabled) {
             padding-right: var(--gap-0);
-            border-right-width: 0;
-        } @media (hover: hover) {
-            .filter-tag__valueButton_1i1a4.filter-tag__checked_1i1a4:not(:disabled):hover {
+            border-right-width: 0
+        } .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat:not(:disabled).filter-tag__close_1nsat.filter-tag__size-32_1nsat {
+                    padding-right: var(--gap-0);
+                } .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat:not(:disabled).filter-tag__close_1nsat.filter-tag__size-40_1nsat {
+                    padding-right: var(--gap-4);
+                } .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat:not(:disabled).filter-tag__close_1nsat.filter-tag__size-48_1nsat {
+                    padding-right: var(--gap-8);
+                } @media (hover: hover) {
+            .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat:not(:disabled):hover {
                 background-color: var(--tag-background-color-checked-hover);
             }
-        } .filter-tag__valueButton_1i1a4.filter-tag__checked_1i1a4:not(:disabled):active {
+        } .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat:not(:disabled):active {
             background-color: var(--tag-background-color-checked-active);
         } @media (hover: hover) {
-            .filter-tag__valueButton_1i1a4.filter-tag__checked_1i1a4:not(:disabled):hover + .filter-tag__clear_1i1a4:before {
+            .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat:not(:disabled):hover + .filter-tag__clear_1nsat:before {
                 background-color: var(--filter-tag-separator-background-color-hover);
             }
-        } .filter-tag__valueButton_1i1a4.filter-tag__checked_1i1a4:not(:disabled):active + .filter-tag__clear_1i1a4:before {
+        } .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat:not(:disabled):active + .filter-tag__clear_1nsat:before {
             background-color: transparent;
-        } .filter-tag__valueButton_1i1a4.filter-tag__checked_1i1a4:disabled {
+        } .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat:disabled {
             color: var(--tag-text-color-checked-disabled);
             background-color: var(--tag-background-color-checked-disabled)
-        } .filter-tag__valueButton_1i1a4.filter-tag__checked_1i1a4:disabled > .filter-tag__chevron_1i1a4 {
+        } .filter-tag__valueButton_1nsat.filter-tag__checked_1nsat:disabled > .filter-tag__chevron_1nsat {
                 color: var(--color-light-neutral-500);
-            } .filter-tag__clear_1i1a4 {
+            } .filter-tag__clear_1nsat {
     position: relative;
     cursor: pointer;
     display: flex;
     align-items: center;
     color: var(--color-light-neutral-translucent-700-inverted);
     background-color: var(--tag-background-color-checked)
-} .filter-tag__clear_1i1a4.filter-tag__rounded_1i1a4.filter-tag__size-32_1i1a4 {
+} .filter-tag__clear_1nsat.filter-tag__rounded_1nsat.filter-tag__size-32_1nsat {
             border-radius: 0 var(--tag-rounded-xxs-border-radius)
                 var(--tag-rounded-xxs-border-radius) 0;
-        } .filter-tag__clear_1i1a4.filter-tag__rounded_1i1a4.filter-tag__size-40_1i1a4 {
+        } .filter-tag__clear_1nsat.filter-tag__rounded_1nsat.filter-tag__size-40_1nsat {
             border-radius: 0 var(--tag-rounded-xs-border-radius) var(--tag-rounded-xs-border-radius)
                 0;
-        } .filter-tag__clear_1i1a4.filter-tag__rounded_1i1a4.filter-tag__size-48_1i1a4 {
+        } .filter-tag__clear_1nsat.filter-tag__rounded_1nsat.filter-tag__size-48_1nsat {
             border-radius: 0 var(--tag-rounded-s-border-radius) var(--tag-rounded-s-border-radius) 0;
-        } .filter-tag__clear_1i1a4:before {
+        } .filter-tag__clear_1nsat:before {
         content: '';
         position: absolute;
         left: var(--gap-0);
@@ -299,32 +305,32 @@
         width: 1px;
         transition: background-color 0.2s ease;
     } @media (hover: hover) {
-        .filter-tag__clear_1i1a4:hover:before {
+        .filter-tag__clear_1nsat:hover:before {
             background-color: var(--filter-tag-separator-background-color-hover);
         }
-    } .filter-tag__clear_1i1a4:active:before {
+    } .filter-tag__clear_1nsat:active:before {
         background-color: transparent;
     } @media (hover: hover) {
-        .filter-tag__clear_1i1a4:hover {
+        .filter-tag__clear_1nsat:hover {
             color: var(--color-light-neutral-translucent-700-inverted-hover);
             background-color: var(--tag-background-color-checked-hover);
         }
-    } .filter-tag__clear_1i1a4:active {
+    } .filter-tag__clear_1nsat:active {
         color: var(--color-light-neutral-translucent-700-inverted-press);
         background-color: var(--tag-background-color-checked-active);
-    } .filter-tag__clear_1i1a4.filter-tag__size-48_1i1a4 {
+    } .filter-tag__clear_1nsat.filter-tag__size-48_1nsat {
         padding: var(--gap-0) var(--gap-12) var(--gap-0) var(--gap-8)
-    } .filter-tag__clear_1i1a4.filter-tag__size-48_1i1a4:before {
+    } .filter-tag__clear_1nsat.filter-tag__size-48_1nsat:before {
             height: 24px;
-        } .filter-tag__clear_1i1a4.filter-tag__size-40_1i1a4 {
+        } .filter-tag__clear_1nsat.filter-tag__size-40_1nsat {
         padding: var(--gap-0) var(--gap-8)
-    } .filter-tag__clear_1i1a4.filter-tag__size-40_1i1a4:before {
+    } .filter-tag__clear_1nsat.filter-tag__size-40_1nsat:before {
             height: 24px;
-        } .filter-tag__clear_1i1a4.filter-tag__size-32_1i1a4 {
+        } .filter-tag__clear_1nsat.filter-tag__size-32_1nsat {
         padding: var(--gap-0) 3px var(--gap-0) var(--gap-4)
-    } .filter-tag__clear_1i1a4.filter-tag__size-32_1i1a4:before {
+    } .filter-tag__clear_1nsat.filter-tag__size-32_1nsat:before {
             height: 20px;
-        } .filter-tag__iconWrapper_1i1a4 {
+        } .filter-tag__iconWrapper_1nsat {
     width: 24px;
     height: 24px;
     display: flex;

package/filter-tag/cssm/components/base-filter-tag/index.module.css

@@ -36,8 +36,7 @@
     --gap-xs: 8px; /* deprecated */
     --gap-s: 12px; /* deprecated */ /* deprecated */
     --gap-m: 16px; /* deprecated */
-    --gap-l: 20px; /* deprecated */
-    --gap-xl: 24px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+    --gap-l: 20px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
     --gap-0: 0;
@@ -46,7 +45,6 @@
     --gap-12: var(--gap-s);
     --gap-16: var(--gap-m);
     --gap-20: var(--gap-l);
-    --gap-24: var(--gap-xl);
 } :root {
 } :root {
     --focus-color: var(--color-light-status-info);
@@ -65,6 +63,10 @@
     --tag-border-color-disabled: var(--color-light-neutral-translucent-500);
     --tag-border-width: 1px;
     --tag-border-radius: var(--border-radius-pill);
+
+    /* rectangular border-radius */
+
+    /* rounded border-radius */
     --tag-rounded-xxs-border-radius: var(--border-radius-pill);
     --tag-rounded-xs-border-radius: var(--border-radius-pill);
     --tag-rounded-s-border-radius: var(--border-radius-pill);
@@ -124,11 +126,11 @@
         } .component.checked:not(.disabled) {
             background-color: var(--tag-background-color-checked);
         } .component.checked:not(.disabled).size-32 {
-            min-width: 84px;
+            min-width: 80px;
         } .component.checked:not(.disabled).size-40 {
-            min-width: 104px;
+            min-width: 100px;
         } .component.checked:not(.disabled).size-48 {
-            min-width: 116px;
+            min-width: 112px;
         } @media (hover: hover) {
             .component.checked:not(.disabled):hover {
                 background-color: var(--tag-background-color-checked-hover);
@@ -160,11 +162,9 @@
     font-family: var(--font-family);
     color: var(--tag-text-color);
     background-color: var(--tag-outlined-background-color);
-    border-width: var(--tag-border-width);
-    border-color: var(--tag-border-color);
-    border-style: solid;
     transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
-    margin: var(--gap-0)
+    margin: var(--gap-0);
+    border: var(--tag-border-width) solid var(--tag-border-color)
 } .valueButton.block {
         width: inherit;
         justify-content: center;
@@ -179,13 +179,13 @@
         } .valueButton.rounded.size-48 {
             border-radius: var(--tag-rounded-s-border-radius);
         } .valueButton.size-32 {
-        min-width: 60px;
+        min-width: 52px;
         min-height: var(--size-xxs-height);
     } .valueButton.size-40 {
-        min-width: 72px;
+        min-width: 64px;
         min-height: var(--size-xs-height);
     } .valueButton.size-48 {
-        min-width: 80px;
+        min-width: 72px;
         min-height: var(--size-s-height);
     } .valueButton.outlined {
         color: var(--tag-text-color);
@@ -212,24 +212,24 @@
         font-size: 16px;
         line-height: 24px;
         font-weight: 400;
-        padding-right: var(--gap-12);
-        padding-left: var(--gap-24)
+        padding-right: var(--gap-8);
+        padding-left: var(--gap-20)
     } .valueButton.size-48 .chevron {
             margin: var(--gap-0) var(--gap-8);
         } .valueButton.size-40 {
         font-size: 14px;
         line-height: 20px;
         font-weight: 400;
-        padding-right: var(--gap-8);
-        padding-left: var(--gap-20)
+        padding-right: var(--gap-4);
+        padding-left: var(--gap-16)
     } .valueButton.size-40 .chevron {
             margin: var(--gap-0) var(--gap-12) var(--gap-0) 6px;
         } .valueButton.size-32 {
         font-size: 14px;
         line-height: 20px;
         font-weight: 400;
-        padding-right: var(--gap-4);
-        padding-left: var(--gap-16)
+        padding-right: var(--gap-0);
+        padding-left: var(--gap-12)
     } .valueButton.size-32 .chevron {
             margin: var(--gap-0) var(--gap-8) var(--gap-0) 6px;
         } .valueButton.open .chevron {
@@ -254,8 +254,14 @@
                 border-radius: var(--tag-border-radius);
             } .valueButton.checked:not(:disabled) {
             padding-right: var(--gap-0);
-            border-right-width: 0;
-        } @media (hover: hover) {
+            border-right-width: 0
+        } .valueButton.checked:not(:disabled).close.size-32 {
+                    padding-right: var(--gap-0);
+                } .valueButton.checked:not(:disabled).close.size-40 {
+                    padding-right: var(--gap-4);
+                } .valueButton.checked:not(:disabled).close.size-48 {
+                    padding-right: var(--gap-8);
+                } @media (hover: hover) {
             .valueButton.checked:not(:disabled):hover {
                 background-color: var(--tag-background-color-checked-hover);
             }

package/filter-tag/cssm/desktop/desktop.module.css

@@ -26,10 +26,14 @@
 } :root {
 } /* сбрасывает синюю подсветку при нажатии */ :root {
     /* border */
+
+    /* rectangular border-radius */
     --tag-rectangular-xxs-border-radius: var(--border-radius-6);
     --tag-rectangular-xs-border-radius: var(--border-radius-8);
     --tag-rectangular-s-border-radius: var(--border-radius-8);
 
+    /* rounded border-radius */
+
     /* background-color outlined */
 
     /* background-color filled */

package/filter-tag/cssm/mobile/mobile.module.css

@@ -26,6 +26,10 @@
 } /* сбрасывает синюю подсветку при нажатии */ :root {
     /* border */
 
+    /* rectangular border-radius */
+
+    /* rounded border-radius */
+
     /* background-color outlined */
 
     /* background-color filled */

package/filter-tag/desktop/Component.desktop.js

@@ -8,7 +8,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
-var styles = {"component":"filter-tag__component_10pwm","rectangular":"filter-tag__rectangular_10pwm","size-32":"filter-tag__size-32_10pwm","size-40":"filter-tag__size-40_10pwm","size-48":"filter-tag__size-48_10pwm","valueButton":"filter-tag__valueButton_10pwm","filled":"filter-tag__filled_10pwm","checked":"filter-tag__checked_10pwm","close":"filter-tag__close_10pwm","clear":"filter-tag__clear_10pwm"};
+var styles = {"component":"filter-tag__component_1tgsp","rectangular":"filter-tag__rectangular_1tgsp","size-32":"filter-tag__size-32_1tgsp","size-40":"filter-tag__size-40_1tgsp","size-48":"filter-tag__size-48_1tgsp","valueButton":"filter-tag__valueButton_1tgsp","filled":"filter-tag__filled_1tgsp","checked":"filter-tag__checked_1tgsp","close":"filter-tag__close_1tgsp","clear":"filter-tag__clear_1tgsp"};
 require('./desktop.css');
 
 var FilterTagDesktop = React.forwardRef(function (restProps, ref) { return React__default.default.createElement(components_baseFilterTag_Component.BaseFilterTag, tslib.__assign({}, restProps, { ref: ref, styles: styles })); });