@alfalab/core-components-select 19.1.0 → 19.1.1-alfasans

package/esm/components/clear-button/index.css

@@ -6,16 +6,16 @@
 :root {
     --input-error-icon-display: none;
 }
-.select__clearIcon_dmm0q {
+.select__clearIcon_b532o {
     display: block;
     color: var(--color-light-neutral-translucent-500);
 }
-.select__clearIcon_dmm0q:hover {
+.select__clearIcon_b532o:hover {
         color: var(--color-light-neutral-translucent-500-hover);
     }
-.select__clearIcon_dmm0q:active {
+.select__clearIcon_b532o:active {
         color: var(--color-light-neutral-translucent-500-press);
     }
-.select__clearButton_dmm0q + [data-addon='error-icon'] {
+.select__clearButton_b532o + [data-addon='error-icon'] {
     display: var(--input-error-icon-display);
 }

package/esm/components/clear-button/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"clearIcon":"select__clearIcon_dmm0q","clearButton":"select__clearButton_dmm0q"};
+var styles = {"clearIcon":"select__clearIcon_b532o","clearButton":"select__clearButton_b532o"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/field/Component.d.ts

@@ -1,7 +1,7 @@
 import React, { type ElementType } from 'react';
 import { type FormControlProps } from '@alfalab/core-components-form-control/esm';
 import { type FieldProps as BaseFieldProps } from '../../typings';
-declare type FieldProps = {
+type FieldProps = {
     /**
      * Компонент FormControl
      */

package/esm/components/field/index.css

@@ -4,8 +4,9 @@
     --color-light-text-tertiary: rgba(5, 8, 29, 0.38);
 }
 :root {
-    --font-family-system:
-        system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, sans-serif;
+    --font-family-alfasans:
+        'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
+        Helvetica, sans-serif;
 }
 :root {
     --focus-color: var(--color-light-status-info);
@@ -18,60 +19,63 @@
 :root {
     --select-arrow-hover-opacity: 0.7;
 }
-.select__component_1ir9n {
+.select__component_1xfb3 {
     width: 100%;
     outline: none;
 }
-.select__field_1ir9n:not(.select__disabled_1ir9n) {
+.select__field_1xfb3:not(.select__disabled_1xfb3) {
     cursor: pointer;
 }
-.select__field_1ir9n:not(.select__disabled_1ir9n):hover .select__arrow_1ir9n {
+.select__field_1xfb3:not(.select__disabled_1xfb3):hover .select__arrow_1xfb3 {
             opacity: var(--select-arrow-hover-opacity);
         }
-.select__disabled_1ir9n {
+.select__disabled_1xfb3 {
     cursor: var(--disabled-cursor);
 }
-.select__placeholder_1ir9n {
+.select__placeholder_1xfb3 {
     color: var(--input-placeholder-color);
     transition: color 0.2s ease;
-    animation: select__show-placeholder_1ir9n 0.2s ease;
+    animation: select__show-placeholder_1xfb3 0.2s ease;
 }
-.select__placeholder_1ir9n.select__focused_1ir9n {
+.select__placeholder_1xfb3.select__focused_1xfb3 {
         color: var(--input-focus-placeholder-color);
     }
-.select__contentWrapper_1ir9n {
+.select__contentWrapper_1xfb3 {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
-    font-family: var(--font-family-system);
+    letter-spacing: -0.24px;
+    font-family: var(--font-family-alfasans);
 
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
     width: 100%;
 }
-.select__contentWrapper_1ir9n.select__size-40_1ir9n {
+.select__contentWrapper_1xfb3.select__size-40_1xfb3 {
         font-size: 14px;
         line-height: 18px;
         font-weight: 400;
-        font-family: var(--font-family-system);
+        letter-spacing: -0.08px;
+        font-family: var(--font-family-alfasans);
     }
-.select__value_1ir9n {
+.select__value_1xfb3 {
     overflow: hidden;
     text-overflow: ellipsis;
     text-align: left;
 }
-.select__value_1ir9n.select__size-40_1ir9n {
+.select__value_1xfb3.select__size-40_1xfb3 {
         font-size: 14px;
         line-height: 18px;
         font-weight: 400;
-        font-family: var(--font-family-system);
+        letter-spacing: -0.08px;
+        font-family: var(--font-family-alfasans);
     }
-.select__focusVisible_1ir9n {
+.select__focusVisible_1xfb3 {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }
-@keyframes select__show-placeholder_1ir9n {
+@keyframes select__show-placeholder_1xfb3 {
     from {
         opacity: 0;
     }

package/esm/components/field/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"component":"select__component_1ir9n","field":"select__field_1ir9n","disabled":"select__disabled_1ir9n","arrow":"select__arrow_1ir9n","placeholder":"select__placeholder_1ir9n","show-placeholder":"select__show-placeholder_1ir9n","focused":"select__focused_1ir9n","contentWrapper":"select__contentWrapper_1ir9n","size-40":"select__size-40_1ir9n","value":"select__value_1ir9n","focusVisible":"select__focusVisible_1ir9n"};
+var styles = {"component":"select__component_1xfb3","field":"select__field_1xfb3","disabled":"select__disabled_1xfb3","arrow":"select__arrow_1xfb3","placeholder":"select__placeholder_1xfb3","show-placeholder":"select__show-placeholder_1xfb3","focused":"select__focused_1xfb3","contentWrapper":"select__contentWrapper_1xfb3","size-40":"select__size-40_1xfb3","value":"select__value_1xfb3","focusVisible":"select__focusVisible_1xfb3"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/field/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["../../src/components/field/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../../../../input/src/vars.css';\n@import '../../vars.css';\n\n.component {\n    width: 100%;\n    outline: none;\n}\n\n.field:not(.disabled) {\n    cursor: pointer;\n\n    &:hover {\n        & .arrow {\n            opacity: var(--select-arrow-hover-opacity);\n        }\n    }\n}\n\n.disabled {\n    cursor: var(--disabled-cursor);\n}\n\n.placeholder {\n    color: var(--input-placeholder-color);\n    transition: color 0.2s ease;\n    animation: show-placeholder 0.2s ease;\n\n    &.focused {\n        color: var(--input-focus-placeholder-color);\n    }\n}\n\n.contentWrapper {\n    @mixin paragraph_component;\n\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 100%;\n\n    &.size-40 {\n        @mixin paragraph_component_secondary;\n    }\n}\n\n.value {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    text-align: left;\n\n    &.size-40 {\n        @mixin paragraph_component_secondary;\n    }\n}\n\n.focusVisible {\n    @mixin focus-outline;\n}\n\n@keyframes show-placeholder {\n    from {\n        opacity: 0;\n    }\n    to {\n        opacity: 1;\n    }\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,yBAAyB,CAAC,OAAO,CAAC,qBAAqB,CAAC,UAAU,CAAC,wBAAwB,CAAC,OAAO,CAAC,qBAAqB,CAAC,aAAa,CAAC,2BAA2B,CAAC,kBAAkB,CAAC,gCAAgC,CAAC,SAAS,CAAC,uBAAuB,CAAC,gBAAgB,CAAC,8BAA8B,CAAC,SAAS,CAAC,uBAAuB,CAAC,OAAO,CAAC,qBAAqB,CAAC,cAAc,CAAC,4BAA4B,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/field/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../../../../input/src/vars.css';\n@import '../../vars.css';\n\n.component {\n    width: 100%;\n    outline: none;\n}\n\n.field:not(.disabled) {\n    cursor: pointer;\n\n    &:hover {\n        & .arrow {\n            opacity: var(--select-arrow-hover-opacity);\n        }\n    }\n}\n\n.disabled {\n    cursor: var(--disabled-cursor);\n}\n\n.placeholder {\n    color: var(--input-placeholder-color);\n    transition: color 0.2s ease;\n    animation: show-placeholder 0.2s ease;\n\n    &.focused {\n        color: var(--input-focus-placeholder-color);\n    }\n}\n\n.contentWrapper {\n    @mixin paragraph_component;\n\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    width: 100%;\n\n    &.size-40 {\n        @mixin paragraph_component_secondary;\n    }\n}\n\n.value {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    text-align: left;\n\n    &.size-40 {\n        @mixin paragraph_component_secondary;\n    }\n}\n\n.focusVisible {\n    @mixin focus-outline;\n}\n\n@keyframes show-placeholder {\n    from {\n        opacity: 0;\n    }\n    to {\n        opacity: 1;\n    }\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,yBAAyB,CAAC,OAAO,CAAC,qBAAqB,CAAC,UAAU,CAAC,wBAAwB,CAAC,OAAO,CAAC,qBAAqB,CAAC,aAAa,CAAC,2BAA2B,CAAC,kBAAkB,CAAC,gCAAgC,CAAC,SAAS,CAAC,uBAAuB,CAAC,gBAAgB,CAAC,8BAA8B,CAAC,SAAS,CAAC,uBAAuB,CAAC,OAAO,CAAC,qBAAqB,CAAC,cAAc,CAAC,4BAA4B,CAAC;;;;"}

package/esm/components/footer/Component.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-export declare type FooterProps = {
+export type FooterProps = {
     handleClear?: () => void;
     handleApply?: () => void;
     showClear?: boolean;

package/esm/components/footer/index.css

@@ -6,20 +6,20 @@
     --gap-m: 16px;
     --gap-16: var(--gap-m);
 }
-.select__footer_72tfz {
+.select__footer_ribch {
     display: flex;
     box-sizing: border-box;
     width: 100%;
     padding: var(--gap-16) var(--gap-16);
     background-color: var(--color-light-modal-bg-primary);
 }
-.select__footer_72tfz .select__button_72tfz:first-of-type {
+.select__footer_ribch .select__button_ribch:first-of-type {
         margin-right: var(--gap-16);
     }
-.select__button_72tfz {
+.select__button_ribch {
     width: 50%;
 }
-.select__highlighted_72tfz {
+.select__highlighted_ribch {
     border-top: 1px solid var(--color-light-neutral-300);
     background-color: var(--color-light-modal-bg-primary);
 }

package/esm/components/footer/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"footer":"select__footer_72tfz","button":"select__button_72tfz","highlighted":"select__highlighted_72tfz"};
+var styles = {"footer":"select__footer_ribch","button":"select__button_ribch","highlighted":"select__highlighted_ribch"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/footer/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["../../src/components/footer/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../../vars.css';\n\n.footer {\n    display: flex;\n    box-sizing: border-box;\n    width: 100%;\n    padding: var(--gap-16) var(--gap-16);\n    background-color: var(--color-light-modal-bg-primary);\n\n    & .button:first-of-type {\n        margin-right: var(--gap-16);\n    }\n}\n\n.button {\n    width: 50%;\n}\n\n.highlighted {\n    border-top: 1px solid var(--color-light-neutral-300);\n    background-color: var(--color-light-modal-bg-primary);\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,QAAQ,CAAC,sBAAsB,CAAC,QAAQ,CAAC,sBAAsB,CAAC,aAAa,CAAC,2BAA2B,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/footer/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../../vars.css';\n\n.footer {\n    display: flex;\n    box-sizing: border-box;\n    width: 100%;\n    padding: var(--gap-16) var(--gap-16);\n    background-color: var(--color-light-modal-bg-primary);\n\n    & .button:first-of-type {\n        margin-right: var(--gap-16);\n    }\n}\n\n.button {\n    width: 50%;\n}\n\n.highlighted {\n    border-top: 1px solid var(--color-light-neutral-300);\n    background-color: var(--color-light-modal-bg-primary);\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,QAAQ,CAAC,sBAAsB,CAAC,QAAQ,CAAC,sBAAsB,CAAC,aAAa,CAAC,2BAA2B,CAAC;;;;"}

package/esm/components/native-select/Component.d.ts

@@ -1,6 +1,6 @@
 import React, { type SelectHTMLAttributes } from 'react';
 import { type GroupShape, type OptionShape } from '../../typings';
-export declare type NativeSelectProps = SelectHTMLAttributes<HTMLSelectElement> & {
+export type NativeSelectProps = SelectHTMLAttributes<HTMLSelectElement> & {
     /**
      * Список вариантов выбора
      */

package/esm/components/optgroup/index.css

@@ -11,8 +11,9 @@
     --gap-16: var(--gap-m);
 }
 :root {
-    --font-family-system:
-        system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, sans-serif;
+    --font-family-alfasans:
+        'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
+        Helvetica, sans-serif;
 }
 :root {
 
@@ -23,7 +24,7 @@
     --select-optgroup-l-left-padding: var(--gap-16);
     --select-optgroup-l-right-padding: var(--gap-16);
 }
-.select__optgroup_1rx6d {
+.select__optgroup_10iyv {
     position: relative;
     display: flex;
     align-items: center;
@@ -33,21 +34,21 @@
     background: var(--select-optgroup-background);
     min-height: 40px;
 }
-.select__optgroup_1rx6d + *[role='option']:before {
+.select__optgroup_10iyv + *[role='option']:before {
         display: none;
     }
-.select__label_1rx6d {
+.select__label_10iyv {
     font-size: 12px;
     line-height: 16px;
     font-weight: 400;
     letter-spacing: 1.25px;
     text-transform: uppercase;
-    font-family: var(--font-family-system);
+    font-family: var(--font-family-alfasans);
 
     display: block;
     color: var(--select-optgroup-color);
 }
-.select__size-72_1rx6d {
+.select__size-72_10iyv {
     padding-left: var(--select-optgroup-l-left-padding);
     padding-right: var(--select-optgroup-l-right-padding);
 }

package/esm/components/optgroup/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"optgroup":"select__optgroup_1rx6d","label":"select__label_1rx6d","size-72":"select__size-72_1rx6d"};
+var styles = {"optgroup":"select__optgroup_10iyv","label":"select__label_10iyv","size-72":"select__size-72_10iyv"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/optgroup/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["../../src/components/optgroup/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../../vars.css';\n\n.optgroup {\n    position: relative;\n    display: flex;\n    align-items: center;\n    padding: var(--gap-12) var(--select-optgroup-right-padding) var(--gap-4)\n        var(--select-optgroup-left-padding);\n    box-sizing: border-box;\n    background: var(--select-optgroup-background);\n    min-height: 40px;\n\n    & + *[role='option']:before {\n        display: none;\n    }\n}\n\n.label {\n    @mixin paragraph_caps;\n\n    display: block;\n    color: var(--select-optgroup-color);\n}\n\n.size-72 {\n    padding-left: var(--select-optgroup-l-left-padding);\n    padding-right: var(--select-optgroup-l-right-padding);\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,UAAU,CAAC,wBAAwB,CAAC,OAAO,CAAC,qBAAqB,CAAC,SAAS,CAAC,uBAAuB,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/optgroup/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../../vars.css';\n\n.optgroup {\n    position: relative;\n    display: flex;\n    align-items: center;\n    padding: var(--gap-12) var(--select-optgroup-right-padding) var(--gap-4)\n        var(--select-optgroup-left-padding);\n    box-sizing: border-box;\n    background: var(--select-optgroup-background);\n    min-height: 40px;\n\n    & + *[role='option']:before {\n        display: none;\n    }\n}\n\n.label {\n    @mixin paragraph_caps;\n\n    display: block;\n    color: var(--select-optgroup-color);\n}\n\n.size-72 {\n    padding-left: var(--select-optgroup-l-left-padding);\n    padding-right: var(--select-optgroup-l-right-padding);\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,UAAU,CAAC,wBAAwB,CAAC,OAAO,CAAC,qBAAqB,CAAC,SAAS,CAAC,uBAAuB,CAAC;;;;"}

package/esm/components/option/Component.d.ts

@@ -1,9 +1,8 @@
-/// <reference types="@alfalab/core-components-env" />
 import { type FC } from 'react';
 import { type OptionCommonProps } from '../../typings';
 import type stylesDesktop from './desktop/index.module.css';
 import type stylesMobile from './mobile/index.module.css';
-declare type OptionPrivateProps = {
+type OptionPrivateProps = {
     /**
      * Мобильная версия option.
      */

package/esm/components/option/desktop/index.css

@@ -14,8 +14,9 @@
     --gap-16: var(--gap-m);
 }
 :root {
-    --font-family-system:
-        system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, sans-serif;
+    --font-family-alfasans:
+        'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
+        Helvetica, sans-serif;
 }
 :root {
     --disabled-cursor: not-allowed;
@@ -43,11 +44,12 @@
     --select-option-active-color: var(--color-light-text-primary);
     --select-option-disabled-color: var(--color-light-text-secondary);
 }
-.select__option_uwrj7 {
+.select__option_14fo6 {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
-    font-family: var(--font-family-system);
+    letter-spacing: -0.24px;
+    font-family: var(--font-family-alfasans);
 
     display: flex;
     align-items: center;
@@ -60,11 +62,11 @@
     position: relative;
     cursor: pointer;
 }
-.select__option_uwrj7:not(.select__disabled_uwrj7):active {
+.select__option_14fo6:not(.select__disabled_14fo6):active {
         background: var(--select-option-active-background);
         color: var(--select-option-active-color);
     }
-.select__option_uwrj7:before {
+.select__option_14fo6:before {
         content: '';
         position: absolute;
         left: var(--select-option-left-padding);
@@ -75,59 +77,59 @@
         display: var(--select-option-divider-display);
         transition: opacity 0.2s ease;
     }
-.select__option_uwrj7:first-child:before {
+.select__option_14fo6:first-child:before {
         display: none;
     }
-.select__size-48_uwrj7 {
+.select__size-48_14fo6 {
     min-height: var(--size-s-height);
 }
-.select__size-56_uwrj7 {
+.select__size-56_14fo6 {
     min-height: var(--size-m-height);
 }
-.select__size-64_uwrj7 {
+.select__size-64_14fo6 {
     min-height: var(--size-l-height);
 }
-.select__size-72_uwrj7 {
+.select__size-72_14fo6 {
     min-height: var(--size-xl-height);
     padding-left: var(--select-option-l-left-padding);
     padding-right: var(--select-option-l-right-padding);
 }
-.select__size-72_uwrj7:before {
+.select__size-72_14fo6:before {
         left: var(--select-option-l-left-padding);
         right: var(--select-option-l-right-padding);
     }
-.select__selected_uwrj7 {
+.select__selected_14fo6 {
     background: var(--select-option-selected-background);
     color: var(--select-option-selected-color);
     cursor: default;
 }
-.select__highlighted_uwrj7 {
+.select__highlighted_14fo6 {
     background: var(--select-option-hover-background);
     color: var(--select-option-hover-color);
 }
-.select__highlighted_uwrj7:before,
-    .select__highlighted_uwrj7 + .select__option_uwrj7:before {
+.select__highlighted_14fo6:before,
+    .select__highlighted_14fo6 + .select__option_14fo6:before {
         opacity: 0;
     }
-.select__disabled_uwrj7 {
+.select__disabled_14fo6 {
     cursor: var(--disabled-cursor);
     background: var(--select-option-disabled-background);
     color: var(--select-option-disabled-color);
 }
-.select__content_uwrj7 {
+.select__content_14fo6 {
     overflow: hidden;
     flex: 1;
     text-overflow: ellipsis;
 }
-.select__textContent_uwrj7 {
+.select__textContent_14fo6 {
     padding-top: var(--gap-12);
     padding-bottom: var(--gap-12);
 }
-.select__highlighted_uwrj7 {
+.select__highlighted_14fo6 {
     background: var(--select-option-hover-background);
     color: var(--select-option-hover-color);
 }
-.select__highlighted_uwrj7:before,
-    .select__highlighted_uwrj7 + .select__option_uwrj7:before {
+.select__highlighted_14fo6:before,
+    .select__highlighted_14fo6 + .select__option_14fo6:before {
         opacity: 0;
     }

package/esm/components/option/desktop/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"option":"select__option_uwrj7","disabled":"select__disabled_uwrj7","size-48":"select__size-48_uwrj7","size-56":"select__size-56_uwrj7","size-64":"select__size-64_uwrj7","size-72":"select__size-72_uwrj7","selected":"select__selected_uwrj7","highlighted":"select__highlighted_uwrj7","content":"select__content_uwrj7","textContent":"select__textContent_uwrj7"};
+var styles = {"option":"select__option_14fo6","disabled":"select__disabled_14fo6","size-48":"select__size-48_14fo6","size-56":"select__size-56_14fo6","size-64":"select__size-64_14fo6","size-72":"select__size-72_14fo6","selected":"select__selected_14fo6","highlighted":"select__highlighted_14fo6","content":"select__content_14fo6","textContent":"select__textContent_14fo6"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/option/desktop/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["../../../src/components/option/desktop/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../../../vars.css';\n@import '../index.module.css';\n\n.highlighted {\n    background: var(--select-option-hover-background);\n    color: var(--select-option-hover-color);\n\n    &:before,\n    & + .option:before {\n        opacity: 0;\n    }\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,QAAQ,CAAC,sBAAsB,CAAC,UAAU,CAAC,wBAAwB,CAAC,SAAS,CAAC,uBAAuB,CAAC,SAAS,CAAC,uBAAuB,CAAC,SAAS,CAAC,uBAAuB,CAAC,SAAS,CAAC,uBAAuB,CAAC,UAAU,CAAC,wBAAwB,CAAC,aAAa,CAAC,2BAA2B,CAAC,SAAS,CAAC,uBAAuB,CAAC,aAAa,CAAC,2BAA2B,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../../src/components/option/desktop/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../../../vars.css';\n@import '../index.module.css';\n\n.highlighted {\n    background: var(--select-option-hover-background);\n    color: var(--select-option-hover-color);\n\n    &:before,\n    & + .option:before {\n        opacity: 0;\n    }\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,QAAQ,CAAC,sBAAsB,CAAC,UAAU,CAAC,wBAAwB,CAAC,SAAS,CAAC,uBAAuB,CAAC,SAAS,CAAC,uBAAuB,CAAC,SAAS,CAAC,uBAAuB,CAAC,SAAS,CAAC,uBAAuB,CAAC,UAAU,CAAC,wBAAwB,CAAC,aAAa,CAAC,2BAA2B,CAAC,SAAS,CAAC,uBAAuB,CAAC,aAAa,CAAC,2BAA2B,CAAC;;;;"}

package/esm/components/option/mobile/index.css

@@ -14,8 +14,9 @@
     --gap-16: var(--gap-m);
 }
 :root {
-    --font-family-system:
-        system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, sans-serif;
+    --font-family-alfasans:
+        'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
+        Helvetica, sans-serif;
 }
 :root {
     --disabled-cursor: not-allowed;
@@ -43,11 +44,12 @@
     --select-option-active-color: var(--color-light-text-primary);
     --select-option-disabled-color: var(--color-light-text-secondary);
 }
-.select__option_13qw6 {
+.select__option_tnjuk {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
-    font-family: var(--font-family-system);
+    letter-spacing: -0.24px;
+    font-family: var(--font-family-alfasans);
 
     display: flex;
     align-items: center;
@@ -60,11 +62,11 @@
     position: relative;
     cursor: pointer;
 }
-.select__option_13qw6:not(.select__disabled_13qw6):active {
+.select__option_tnjuk:not(.select__disabled_tnjuk):active {
         background: var(--select-option-active-background);
         color: var(--select-option-active-color);
     }
-.select__option_13qw6:before {
+.select__option_tnjuk:before {
         content: '';
         position: absolute;
         left: var(--select-option-left-padding);
@@ -75,51 +77,51 @@
         display: var(--select-option-divider-display);
         transition: opacity 0.2s ease;
     }
-.select__option_13qw6:first-child:before {
+.select__option_tnjuk:first-child:before {
         display: none;
     }
-.select__size-48_13qw6 {
+.select__size-48_tnjuk {
     min-height: var(--size-s-height);
 }
-.select__size-56_13qw6 {
+.select__size-56_tnjuk {
     min-height: var(--size-m-height);
 }
-.select__size-64_13qw6 {
+.select__size-64_tnjuk {
     min-height: var(--size-l-height);
 }
-.select__size-72_13qw6 {
+.select__size-72_tnjuk {
     min-height: var(--size-xl-height);
     padding-left: var(--select-option-l-left-padding);
     padding-right: var(--select-option-l-right-padding);
 }
-.select__size-72_13qw6:before {
+.select__size-72_tnjuk:before {
         left: var(--select-option-l-left-padding);
         right: var(--select-option-l-right-padding);
     }
-.select__selected_13qw6 {
+.select__selected_tnjuk {
     background: var(--select-option-selected-background);
     color: var(--select-option-selected-color);
     cursor: default;
 }
-.select__highlighted_13qw6 {
+.select__highlighted_tnjuk {
     background: var(--select-option-hover-background);
     color: var(--select-option-hover-color);
 }
-.select__highlighted_13qw6:before,
-    .select__highlighted_13qw6 + .select__option_13qw6:before {
+.select__highlighted_tnjuk:before,
+    .select__highlighted_tnjuk + .select__option_tnjuk:before {
         opacity: 0;
     }
-.select__disabled_13qw6 {
+.select__disabled_tnjuk {
     cursor: var(--disabled-cursor);
     background: var(--select-option-disabled-background);
     color: var(--select-option-disabled-color);
 }
-.select__content_13qw6 {
+.select__content_tnjuk {
     overflow: hidden;
     flex: 1;
     text-overflow: ellipsis;
 }
-.select__textContent_13qw6 {
+.select__textContent_tnjuk {
     padding-top: var(--gap-12);
     padding-bottom: var(--gap-12);
 }

package/esm/components/option/mobile/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"option":"select__option_13qw6","disabled":"select__disabled_13qw6","size-48":"select__size-48_13qw6","size-56":"select__size-56_13qw6","size-64":"select__size-64_13qw6","size-72":"select__size-72_13qw6","selected":"select__selected_13qw6","highlighted":"select__highlighted_13qw6","content":"select__content_13qw6","textContent":"select__textContent_13qw6"};
+var styles = {"option":"select__option_tnjuk","disabled":"select__disabled_tnjuk","size-48":"select__size-48_tnjuk","size-56":"select__size-56_tnjuk","size-64":"select__size-64_tnjuk","size-72":"select__size-72_tnjuk","selected":"select__selected_tnjuk","highlighted":"select__highlighted_tnjuk","content":"select__content_tnjuk","textContent":"select__textContent_tnjuk"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/option/mobile/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["../../../src/components/option/mobile/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../../../vars.css';\n@import '../index.module.css';\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,QAAQ,CAAC,sBAAsB,CAAC,UAAU,CAAC,wBAAwB,CAAC,SAAS,CAAC,uBAAuB,CAAC,SAAS,CAAC,uBAAuB,CAAC,SAAS,CAAC,uBAAuB,CAAC,SAAS,CAAC,uBAAuB,CAAC,UAAU,CAAC,wBAAwB,CAAC,aAAa,CAAC,2BAA2B,CAAC,SAAS,CAAC,uBAAuB,CAAC,aAAa,CAAC,2BAA2B,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../../src/components/option/mobile/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../../../vars.css';\n@import '../index.module.css';\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,QAAQ,CAAC,sBAAsB,CAAC,UAAU,CAAC,wBAAwB,CAAC,SAAS,CAAC,uBAAuB,CAAC,SAAS,CAAC,uBAAuB,CAAC,SAAS,CAAC,uBAAuB,CAAC,SAAS,CAAC,uBAAuB,CAAC,UAAU,CAAC,wBAAwB,CAAC,aAAa,CAAC,2BAA2B,CAAC,SAAS,CAAC,uBAAuB,CAAC,aAAa,CAAC,2BAA2B,CAAC;;;;"}

package/esm/components/options-list/Component.d.ts

@@ -1,36 +1,36 @@
 import React from 'react';
 import { type GroupShape, type OptionShape } from '../../typings';
 export declare const OptionsList: React.ForwardRefExoticComponent<Pick<import("../../typings").SelectProps, "client"> & {
-    className?: string | undefined;
-    optionGroupClassName?: string | undefined;
-    scrollbarClassName?: string | undefined;
-    footerClassName?: string | undefined;
-    size?: 40 | 48 | 56 | 64 | 72 | undefined;
+    className?: string;
+    optionGroupClassName?: string;
+    scrollbarClassName?: string;
+    footerClassName?: string;
+    size?: 40 | 48 | 56 | 64 | 72;
     Option: React.ComponentType<import("../../typings").OptionProps>;
     getOptionProps: (option: OptionShape, index: number) => import("../../typings").OptionProps;
-    groupOptionProps?: import("../../typings").AnyObject | undefined;
-    selectedItems?: OptionShape[] | undefined;
+    groupOptionProps?: import("../../typings").AnyObject;
+    selectedItems?: OptionShape[];
     setSelectedItems: (selected: OptionShape[]) => void;
     toggleMenu: () => void;
     header?: React.ReactNode;
     footer?: React.ReactNode;
-    options?: (OptionShape | GroupShape)[] | undefined;
-    flatOptions?: OptionShape[] | undefined;
-    highlightedIndex?: number | undefined;
-    open?: boolean | undefined;
-    Optgroup?: React.ComponentType<import("../../typings").OptgroupProps> | undefined;
+    options?: Array<OptionShape | GroupShape>;
+    flatOptions?: OptionShape[];
+    highlightedIndex?: number;
+    open?: boolean;
+    Optgroup?: import("../../typings").BaseSelectProps["Optgroup"];
     emptyPlaceholder?: React.ReactNode;
-    visibleOptions?: number | undefined;
-    onScroll?: ((event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void) | undefined;
-    dataTestId?: string | undefined;
-    inputProps?: import("@alfalab/core-components-input").InputProps | undefined;
-    showFooter?: boolean | undefined;
-    nativeScrollbar?: boolean | undefined;
-    optionsListWidth?: "field" | "content" | undefined;
-    onApply?: (() => void) | undefined;
-    onClear?: (() => void) | undefined;
-    setHighlightedIndex?: ((index: number) => void) | undefined;
-    search?: string | undefined;
-    multiple?: boolean | undefined;
-    limitDynamicOptionGroupSize?: boolean | undefined;
+    visibleOptions?: number;
+    onScroll?: (event: React.MouseEvent<HTMLDivElement>) => void;
+    dataTestId?: string;
+    inputProps?: import("@alfalab/core-components-input").InputProps;
+    showFooter?: boolean;
+    nativeScrollbar?: boolean;
+    optionsListWidth?: import("../../typings").BaseSelectProps["optionsListWidth"];
+    onApply?: () => void;
+    onClear?: () => void;
+    setHighlightedIndex?: (index: number) => void;
+    search?: string;
+    multiple?: boolean;
+    limitDynamicOptionGroupSize?: import("../../typings").BaseSelectProps["limitDynamicOptionGroupSize"];
 } & React.RefAttributes<HTMLDivElement>>;

package/esm/components/options-list/Component.js

@@ -66,7 +66,7 @@ var OptionsList = forwardRef(function (_a, ref) {
                 }
             })()
             : undefined,
-    }), measured = _p[0], height = _p[1];
+    }), measured = _p[0], maxHeight = _p[1];
     if (options.length === 0 && !emptyPlaceholder && !header && !footer) {
         return null;
     }
@@ -85,7 +85,7 @@ var OptionsList = forwardRef(function (_a, ref) {
         return (React.createElement(Scrollbar, { className: cn(styles.scrollable, scrollbarClassName), verticalBarClassName: cn(styles.verticalBar, (_a = {},
                 _a[styles.verticalBarWithHeader] = Boolean(header),
                 _a[styles.verticalBarWithFooter] = Boolean(footer),
-                _a)), ref: scrollbarRef, style: { height: height }, horizontalAutoStretch: optionsListWidth === 'content', scrollableNodeProps: scrollableNodeProps, contentNodeProps: { ref: listRef }, maskProps: {
+                _a)), ref: scrollbarRef, style: { maxHeight: maxHeight }, horizontalAutoStretch: optionsListWidth === 'content', scrollableNodeProps: scrollableNodeProps, contentNodeProps: { ref: listRef }, maskProps: {
                 /*
                  * Для корректного подсчета высоты опций(иначе для optionsListWidth: 'field'
                  * высота опции всегда будет равна высоте одной строчки)
@@ -95,7 +95,7 @@ var OptionsList = forwardRef(function (_a, ref) {
                     _b)),
             } }, renderListItems()));
     };
-    var renderWithNativeScrollbar = function () { return (React.createElement("div", { className: cn(styles.scrollable, scrollbarClassName), ref: mergeRefs([listRef, ref]), onScroll: handleScroll, style: { height: height } }, renderListItems())); };
+    var renderWithNativeScrollbar = function () { return (React.createElement("div", { className: cn(styles.scrollable, scrollbarClassName), ref: mergeRefs([listRef, ref]), onScroll: handleScroll, style: { maxHeight: maxHeight } }, renderListItems())); };
     var resetHighlightedIndex = function () { return setHighlightedIndex === null || setHighlightedIndex === void 0 ? void 0 : setHighlightedIndex(-1); };
     return (React.createElement("div", __assign({}, (nativeScrollbar && { 'data-test-id': dataTestId }), { className: cn(styles.optionsList, styles["size-".concat(size)], className) }),
         header && (React.createElement("div", { className: cn(styles.optionsListHeader, (_b = {},