@alfalab/core-components-select 19.1.6 → 19.1.7-alfasans

package/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_1rcmv {
+.select__optgroup_zyfdu {
     position: relative;
     display: flex;
     align-items: center;
@@ -33,21 +34,21 @@
     background: var(--select-optgroup-background);
     min-height: 40px;
 }
-.select__optgroup_1rcmv + *[role='option']:before {
+.select__optgroup_zyfdu + *[role='option']:before {
         display: none;
     }
-.select__label_1rcmv {
+.select__label_zyfdu {
     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_1rcmv {
+.select__size-72_zyfdu {
     padding-left: var(--select-optgroup-l-left-padding);
     padding-right: var(--select-optgroup-l-right-padding);
 }

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

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"optgroup":"select__optgroup_1rcmv","label":"select__label_1rcmv","size-72":"select__size-72_1rcmv"};
+var styles = {"optgroup":"select__optgroup_zyfdu","label":"select__label_zyfdu","size-72":"select__size-72_zyfdu"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/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_1mvvw {
+.select__option_sbpt0 {
     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_1mvvw:not(.select__disabled_1mvvw):active {
+.select__option_sbpt0:not(.select__disabled_sbpt0):active {
         background: var(--select-option-active-background);
         color: var(--select-option-active-color);
     }
-.select__option_1mvvw:before {
+.select__option_sbpt0: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_1mvvw:first-child:before {
+.select__option_sbpt0:first-child:before {
         display: none;
     }
-.select__size-48_1mvvw {
+.select__size-48_sbpt0 {
     min-height: var(--size-s-height);
 }
-.select__size-56_1mvvw {
+.select__size-56_sbpt0 {
     min-height: var(--size-m-height);
 }
-.select__size-64_1mvvw {
+.select__size-64_sbpt0 {
     min-height: var(--size-l-height);
 }
-.select__size-72_1mvvw {
+.select__size-72_sbpt0 {
     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_1mvvw:before {
+.select__size-72_sbpt0:before {
         left: var(--select-option-l-left-padding);
         right: var(--select-option-l-right-padding);
     }
-.select__selected_1mvvw {
+.select__selected_sbpt0 {
     background: var(--select-option-selected-background);
     color: var(--select-option-selected-color);
     cursor: default;
 }
-.select__highlighted_1mvvw {
+.select__highlighted_sbpt0 {
     background: var(--select-option-hover-background);
     color: var(--select-option-hover-color);
 }
-.select__highlighted_1mvvw:before,
-    .select__highlighted_1mvvw + .select__option_1mvvw:before {
+.select__highlighted_sbpt0:before,
+    .select__highlighted_sbpt0 + .select__option_sbpt0:before {
         opacity: 0;
     }
-.select__disabled_1mvvw {
+.select__disabled_sbpt0 {
     cursor: var(--disabled-cursor);
     background: var(--select-option-disabled-background);
     color: var(--select-option-disabled-color);
 }
-.select__content_1mvvw {
+.select__content_sbpt0 {
     overflow: hidden;
     flex: 1;
     text-overflow: ellipsis;
 }
-.select__textContent_1mvvw {
+.select__textContent_sbpt0 {
     padding-top: var(--gap-12);
     padding-bottom: var(--gap-12);
 }
-.select__highlighted_1mvvw {
+.select__highlighted_sbpt0 {
     background: var(--select-option-hover-background);
     color: var(--select-option-hover-color);
 }
-.select__highlighted_1mvvw:before,
-    .select__highlighted_1mvvw + .select__option_1mvvw:before {
+.select__highlighted_sbpt0:before,
+    .select__highlighted_sbpt0 + .select__option_sbpt0:before {
         opacity: 0;
     }

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

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"option":"select__option_1mvvw","disabled":"select__disabled_1mvvw","size-48":"select__size-48_1mvvw","size-56":"select__size-56_1mvvw","size-64":"select__size-64_1mvvw","size-72":"select__size-72_1mvvw","selected":"select__selected_1mvvw","highlighted":"select__highlighted_1mvvw","content":"select__content_1mvvw","textContent":"select__textContent_1mvvw"};
+var styles = {"option":"select__option_sbpt0","disabled":"select__disabled_sbpt0","size-48":"select__size-48_sbpt0","size-56":"select__size-56_sbpt0","size-64":"select__size-64_sbpt0","size-72":"select__size-72_sbpt0","selected":"select__selected_sbpt0","highlighted":"select__highlighted_sbpt0","content":"select__content_sbpt0","textContent":"select__textContent_sbpt0"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/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_1y4dz {
+.select__option_1o11n {
     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_1y4dz:not(.select__disabled_1y4dz):active {
+.select__option_1o11n:not(.select__disabled_1o11n):active {
         background: var(--select-option-active-background);
         color: var(--select-option-active-color);
     }
-.select__option_1y4dz:before {
+.select__option_1o11n: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_1y4dz:first-child:before {
+.select__option_1o11n:first-child:before {
         display: none;
     }
-.select__size-48_1y4dz {
+.select__size-48_1o11n {
     min-height: var(--size-s-height);
 }
-.select__size-56_1y4dz {
+.select__size-56_1o11n {
     min-height: var(--size-m-height);
 }
-.select__size-64_1y4dz {
+.select__size-64_1o11n {
     min-height: var(--size-l-height);
 }
-.select__size-72_1y4dz {
+.select__size-72_1o11n {
     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_1y4dz:before {
+.select__size-72_1o11n:before {
         left: var(--select-option-l-left-padding);
         right: var(--select-option-l-right-padding);
     }
-.select__selected_1y4dz {
+.select__selected_1o11n {
     background: var(--select-option-selected-background);
     color: var(--select-option-selected-color);
     cursor: default;
 }
-.select__highlighted_1y4dz {
+.select__highlighted_1o11n {
     background: var(--select-option-hover-background);
     color: var(--select-option-hover-color);
 }
-.select__highlighted_1y4dz:before,
-    .select__highlighted_1y4dz + .select__option_1y4dz:before {
+.select__highlighted_1o11n:before,
+    .select__highlighted_1o11n + .select__option_1o11n:before {
         opacity: 0;
     }
-.select__disabled_1y4dz {
+.select__disabled_1o11n {
     cursor: var(--disabled-cursor);
     background: var(--select-option-disabled-background);
     color: var(--select-option-disabled-color);
 }
-.select__content_1y4dz {
+.select__content_1o11n {
     overflow: hidden;
     flex: 1;
     text-overflow: ellipsis;
 }
-.select__textContent_1y4dz {
+.select__textContent_1o11n {
     padding-top: var(--gap-12);
     padding-bottom: var(--gap-12);
 }

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

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"option":"select__option_1y4dz","disabled":"select__disabled_1y4dz","size-48":"select__size-48_1y4dz","size-56":"select__size-56_1y4dz","size-64":"select__size-64_1y4dz","size-72":"select__size-72_1y4dz","selected":"select__selected_1y4dz","highlighted":"select__highlighted_1y4dz","content":"select__content_1y4dz","textContent":"select__textContent_1y4dz"};
+var styles = {"option":"select__option_1o11n","disabled":"select__disabled_1o11n","size-48":"select__size-48_1o11n","size-56":"select__size-56_1o11n","size-64":"select__size-64_1o11n","size-72":"select__size-72_1o11n","selected":"select__selected_1o11n","highlighted":"select__highlighted_1o11n","content":"select__content_1o11n","textContent":"select__textContent_1o11n"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/components/options-list/index.css

@@ -15,57 +15,57 @@
     --select-options-list-scrollbar-gap: var(--gap-12);
     --select-options-list-empty-placeholder-color: var(--color-light-text-secondary);
 }
-.select__optionsList_15vxr {
+.select__optionsList_16rvb {
     width: 100%;
     outline: none;
     box-sizing: border-box;
     position: relative;
 }
-.select__optionsList_15vxr .select__scrollable_15vxr {
+.select__optionsList_16rvb .select__scrollable_16rvb {
         overflow: auto;
         width: 100%;
     }
-.select__optionsList_15vxr .select__scrollable_15vxr .select__verticalBar_15vxr.select__verticalBar_15vxr {
+.select__optionsList_16rvb .select__scrollable_16rvb .select__verticalBar_16rvb.select__verticalBar_16rvb {
             top: var(--select-options-list-scrollbar-gap);
             height: calc(100% - 2 * var(--select-options-list-scrollbar-gap));
         }
-.select__optionsList_15vxr .select__scrollable_15vxr .select__verticalBar_15vxr.select__verticalBar_15vxr.select__verticalBarWithHeader_15vxr {
+.select__optionsList_16rvb .select__scrollable_16rvb .select__verticalBar_16rvb.select__verticalBar_16rvb.select__verticalBarWithHeader_16rvb {
                 top: 0;
                 height: calc(100% - var(--select-options-list-scrollbar-gap));
             }
-.select__optionsList_15vxr .select__scrollable_15vxr .select__verticalBar_15vxr.select__verticalBar_15vxr.select__verticalBarWithFooter_15vxr {
+.select__optionsList_16rvb .select__scrollable_16rvb .select__verticalBar_16rvb.select__verticalBar_16rvb.select__verticalBarWithFooter_16rvb {
                 top: var(--select-options-list-scrollbar-gap);
                 height: calc(100% - var(--select-options-list-scrollbar-gap));
             }
-.select__optionsList_15vxr .select__scrollable_15vxr .select__verticalBar_15vxr.select__verticalBar_15vxr.select__verticalBarWithHeader_15vxr.select__verticalBarWithFooter_15vxr {
+.select__optionsList_16rvb .select__scrollable_16rvb .select__verticalBar_16rvb.select__verticalBar_16rvb.select__verticalBarWithHeader_16rvb.select__verticalBarWithFooter_16rvb {
                 top: 0;
                 height: 100%;
             }
-.select__optionsListHeader_15vxr {
+.select__optionsListHeader_16rvb {
     box-sizing: border-box;
     border-bottom: 1px solid transparent;
     transition: border-color 0.2s ease;
 }
-.select__optionsListHeader_15vxr.select__headerHighlighted_15vxr {
+.select__optionsListHeader_16rvb.select__headerHighlighted_16rvb {
         border-bottom-color: var(--color-light-neutral-300);
     }
-.select__optionsListFooter_15vxr {
+.select__optionsListFooter_16rvb {
     position: sticky;
     bottom: var(--gap-0);
     box-sizing: border-box;
     border-top: 1px solid transparent;
     transition: border-color 0.2s ease;
 }
-.select__optionsListFooter_15vxr.select__withBorder_15vxr {
+.select__optionsListFooter_16rvb.select__withBorder_16rvb {
         border-top-color: var(--color-light-neutral-300);
     }
-.select__mask_15vxr {
+.select__mask_16rvb {
     min-width: 4000px;
 }
-.select__emptyPlaceholder_15vxr {
+.select__emptyPlaceholder_16rvb {
     padding: var(--gap-16) var(--gap-12);
     color: var(--select-options-list-empty-placeholder-color);
 }
-.select__size-72_15vxr .select__emptyPlaceholder_15vxr {
+.select__size-72_16rvb .select__emptyPlaceholder_16rvb {
     padding: var(--gap-24) var(--gap-16);
 }

package/components/options-list/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"optionsList":"select__optionsList_15vxr","scrollable":"select__scrollable_15vxr","verticalBar":"select__verticalBar_15vxr","verticalBarWithHeader":"select__verticalBarWithHeader_15vxr","verticalBarWithFooter":"select__verticalBarWithFooter_15vxr","optionsListHeader":"select__optionsListHeader_15vxr","headerHighlighted":"select__headerHighlighted_15vxr","optionsListFooter":"select__optionsListFooter_15vxr","withBorder":"select__withBorder_15vxr","mask":"select__mask_15vxr","emptyPlaceholder":"select__emptyPlaceholder_15vxr","size-72":"select__size-72_15vxr"};
+var styles = {"optionsList":"select__optionsList_16rvb","scrollable":"select__scrollable_16rvb","verticalBar":"select__verticalBar_16rvb","verticalBarWithHeader":"select__verticalBarWithHeader_16rvb","verticalBarWithFooter":"select__verticalBarWithFooter_16rvb","optionsListHeader":"select__optionsListHeader_16rvb","headerHighlighted":"select__headerHighlighted_16rvb","optionsListFooter":"select__optionsListFooter_16rvb","withBorder":"select__withBorder_16rvb","mask":"select__mask_16rvb","emptyPlaceholder":"select__emptyPlaceholder_16rvb","size-72":"select__size-72_16rvb"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/components/search/index.css

@@ -1,3 +1,3 @@
-.select__component_1tuuj.select__component_1tuuj {
+.select__component_1f6ip.select__component_1f6ip {
     width: auto;
 }

package/components/search/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"component":"select__component_1tuuj"};
+var styles = {"component":"select__component_1f6ip"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/components/virtual-options-list/index.css

@@ -20,42 +20,42 @@
     --select-option-left-padding: var(--gap-12);
     --select-option-right-padding: var(--gap-12);
 }
-.select__virtualOptionsList_1edbn {
+.select__virtualOptionsList_149c3 {
     width: 100%;
     outline: none;
     box-sizing: border-box;
     position: sticky;
     justify-content: space-between;
 }
-.select__virtualOptionsListHeader_1edbn {
+.select__virtualOptionsListHeader_149c3 {
     box-sizing: border-box;
     border-bottom: 1px solid var(--color-light-neutral-300);
 }
-.select__virtualOptionsListFooter_1edbn {
+.select__virtualOptionsListFooter_149c3 {
     position: sticky;
     bottom: var(--gap-0);
     box-sizing: border-box;
     border-top: 1px solid transparent;
 }
-.select__virtualOptionsListFooter_1edbn.select__withBorder_1edbn {
+.select__virtualOptionsListFooter_149c3.select__withBorder_149c3 {
         border-top: 1px solid var(--color-light-neutral-300);
     }
-.select__scrollable_1edbn {
+.select__scrollable_149c3 {
     position: relative;
     overflow: auto;
     width: 100%;
 }
-.select__inner_1edbn {
+.select__inner_149c3 {
     position: relative;
     width: 100%;
 }
-.select__virtualRow_1edbn {
+.select__virtualRow_149c3 {
     position: absolute;
     top: var(--gap-0);
     left: var(--gap-0);
     width: 100%;
 }
-.select__virtualRow_1edbn:before {
+.select__virtualRow_149c3:before {
         content: '';
         position: absolute;
         z-index: 1;
@@ -66,18 +66,18 @@
         background: var(--select-option-divider-background);
         display: var(--select-option-divider-display);
     }
-.select__virtualRow_1edbn:first-child:before {
+.select__virtualRow_149c3:first-child:before {
         display: none;
     }
-.select__highlighted_1edbn:before,
-    .select__highlighted_1edbn + .select__virtualRow_1edbn:before {
+.select__highlighted_149c3:before,
+    .select__highlighted_149c3 + .select__virtualRow_149c3:before {
         display: none;
     }
-.select__emptyPlaceholder_1edbn {
+.select__emptyPlaceholder_149c3 {
     padding: var(--gap-16) var(--gap-12);
     color: var(--select-options-list-empty-placeholder-color);
     flex: 1;
 }
-.select__size-72_1edbn .select__emptyPlaceholder_1edbn {
+.select__size-72_149c3 .select__emptyPlaceholder_149c3 {
     padding: var(--gap-24) var(--gap-16);
 }

package/components/virtual-options-list/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"virtualOptionsList":"select__virtualOptionsList_1edbn","virtualOptionsListHeader":"select__virtualOptionsListHeader_1edbn","virtualOptionsListFooter":"select__virtualOptionsListFooter_1edbn","withBorder":"select__withBorder_1edbn","scrollable":"select__scrollable_1edbn","inner":"select__inner_1edbn","virtualRow":"select__virtualRow_1edbn","highlighted":"select__highlighted_1edbn","emptyPlaceholder":"select__emptyPlaceholder_1edbn","size-72":"select__size-72_1edbn"};
+var styles = {"virtualOptionsList":"select__virtualOptionsList_149c3","virtualOptionsListHeader":"select__virtualOptionsListHeader_149c3","virtualOptionsListFooter":"select__virtualOptionsListFooter_149c3","withBorder":"select__withBorder_149c3","scrollable":"select__scrollable_149c3","inner":"select__inner_149c3","virtualRow":"select__virtualRow_149c3","highlighted":"select__highlighted_149c3","emptyPlaceholder":"select__emptyPlaceholder_149c3","size-72":"select__size-72_149c3"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/cssm/components/base-option/index.module.css

@@ -15,8 +15,9 @@
     --gap-20: var(--gap-l);
 }
 :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;
@@ -38,7 +39,8 @@
     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;

package/cssm/components/field/index.module.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);
@@ -43,7 +44,8 @@
     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;
@@ -54,7 +56,8 @@
         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);
     }
 .value {
     overflow: hidden;
@@ -65,7 +68,8 @@
         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);
     }
 .focusVisible {
     outline: 2px solid var(--focus-color);

package/cssm/components/optgroup/index.module.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 {
 
@@ -42,7 +43,7 @@
     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);

package/cssm/components/option/desktop/index.module.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;
@@ -47,7 +48,8 @@
     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;

package/cssm/components/option/mobile/index.module.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;
@@ -47,7 +48,8 @@
     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;

package/cssm/presets/useSelectWithApply/options-list-with-apply/footer/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../../../../../src/presets/useSelectWithApply/options-list-with-apply/footer/Component.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport { ButtonDesktop } from '@alfalab/core-components-button/desktop';\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { type OptionShape, type OptionsListProps } from '../../../../typings';\n\nimport styles from './index.module.css';\n\nexport type FooterProps = {\n    handleClear?: () => void;\n    handleApply?: () => void;\n    showClear?: boolean;\n    selectedDraft?: OptionShape[];\n    dataTestId?: string;\n    size?: OptionsListProps['size'];\n};\n\nexport const Footer = ({\n    handleApply,\n    handleClear,\n    showClear,\n    selectedDraft = [],\n    dataTestId,\n    size,\n}: FooterProps) => (\n    <div\n        // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n        tabIndex={0}\n        className={cn(styles.footer, size && styles[`size-${size}`])}\n    >\n        <ButtonDesktop\n            size={32}\n            view='primary'\n            onClick={handleApply}\n            dataTestId={getDataTestId(dataTestId, 'apply')}\n            className={styles.button}\n        >\n            Применить\n        </ButtonDesktop>\n\n        {showClear && selectedDraft.length > 0 && (\n            <ButtonDesktop\n                size={32}\n                view='secondary'\n                onClick={handleClear}\n                dataTestId={getDataTestId(dataTestId, 'clear')}\n                className={styles.button}\n            >\n                Сбросить\n            </ButtonDesktop>\n        )}\n    </div>\n);\n"],"names":["React","cn","styles","ButtonDesktop","getDataTestId"],"mappings":";;;;;;;;;;;;;;;;AAmBO,IAAM,MAAM,GAAG,UAAC,EAOT,EAAA;AANV,IAAA,IAAA,WAAW,iBAAA,EACX,WAAW,iBAAA,EACX,SAAS,eAAA,EACT,EAAA,GAAA,EAAA,CAAA,aAAkB,EAAlB,aAAa,GAAA,EAAA,KAAA,MAAA,GAAG,EAAE,GAAA,EAAA,EAClB,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,IAAI,GAAA,EAAA,CAAA,IAAA;AACW,IAAA,QACfA,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;;AAEI,QAAA,QAAQ,EAAE,CAAC,EACX,SAAS,EAAEC,mBAAE,CAACC,uBAAM,CAAC,MAAM,EAAE,IAAI,IAAIA,uBAAM,CAAC,eAAQ,IAAI,CAAE,CAAC,CAAC,EAAA;AAE5D,QAAAF,sBAAA,CAAA,aAAA,CAACG,qBAAa,EAAA,EACV,IAAI,EAAE,EAAE,EACR,IAAI,EAAC,SAAS,EACd,OAAO,EAAE,WAAW,EACpB,UAAU,EAAEC,kBAAa,CAAC,UAAU,EAAE,OAAO,CAAC,EAC9C,SAAS,EAAEF,uBAAM,CAAC,MAAM,EAGZ,EAAA,wDAAA,CAAA;AAEf,QAAA,SAAS,IAAI,aAAa,CAAC,MAAM,GAAG,CAAC,KAClCF,sBAAA,CAAA,aAAA,CAACG,qBAAa,EAAA,EACV,IAAI,EAAE,EAAE,EACR,IAAI,EAAC,WAAW,EAChB,OAAO,EAAE,WAAW,EACpB,UAAU,EAAEC,kBAAa,CAAC,UAAU,EAAE,OAAO,CAAC,EAC9C,SAAS,EAAEF,uBAAM,CAAC,MAAM,EAGZ,EAAA,kDAAA,CAAA,CACnB,CACC;AA3BS;;;;"}
+{"version":3,"file":"Component.js","sources":["../../../../src/presets/useSelectWithApply/options-list-with-apply/footer/Component.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport { ButtonDesktop } from '@alfalab/core-components-button/desktop';\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { type OptionShape, type OptionsListProps } from '../../../../typings';\n\nimport styles from './index.module.css';\n\nexport type FooterProps = {\n    handleClear?: () => void;\n    handleApply?: () => void;\n    showClear?: boolean;\n    selectedDraft?: OptionShape[];\n    dataTestId?: string;\n    size?: OptionsListProps['size'];\n};\n\nexport const Footer = ({\n    handleApply,\n    handleClear,\n    showClear,\n    selectedDraft = [],\n    dataTestId,\n    size,\n}: FooterProps) => (\n    <div\n        // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n        tabIndex={0}\n        className={cn(styles.footer, size && styles[`size-${size}`])}\n    >\n        <ButtonDesktop\n            size={32}\n            view='primary'\n            onClick={handleApply}\n            dataTestId={getDataTestId(dataTestId, 'apply')}\n            className={styles.button}\n        >\n            Применить\n        </ButtonDesktop>\n\n        {showClear && selectedDraft.length > 0 && (\n            <ButtonDesktop\n                size={32}\n                view='secondary'\n                onClick={handleClear}\n                dataTestId={getDataTestId(dataTestId, 'clear')}\n                className={styles.button}\n            >\n                Сбросить\n            </ButtonDesktop>\n        )}\n    </div>\n);\n"],"names":["React","cn","styles","ButtonDesktop","getDataTestId"],"mappings":";;;;;;;;;;;;;;;;AAmBO,IAAM,MAAM,GAAG,UAAC,EAOT,EAAA;AANV,IAAA,IAAA,WAAW,iBAAA,EACX,WAAW,iBAAA,EACX,SAAS,eAAA,EACT,EAAA,GAAA,EAAA,CAAA,aAAkB,EAAlB,aAAa,GAAA,EAAA,KAAA,MAAA,GAAG,EAAE,GAAA,EAAA,EAClB,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,IAAI,GAAA,EAAA,CAAA,IAAA;AACW,IAAA,QACfA,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;;AAEI,QAAA,QAAQ,EAAE,CAAC,EACX,SAAS,EAAEC,mBAAE,CAACC,uBAAM,CAAC,MAAM,EAAE,IAAI,IAAIA,uBAAM,CAAC,eAAQ,IAAI,CAAE,CAAC,CAAC,EAAA;AAE5D,QAAAF,sBAAA,CAAA,aAAA,CAACG,qBAAa,EAAA,EACV,IAAI,EAAE,EAAE,EACR,IAAI,EAAC,SAAS,EACd,OAAO,EAAE,WAAW,EACpB,UAAU,EAAEC,kBAAa,CAAC,UAAU,EAAE,OAAO,CAAC,EAC9C,SAAS,EAAEF,uBAAM,CAAC,MAAM,EAGZ,EAAA,wDAAA,CAAA;AAEf,QAAA,SAAS,IAAI,aAAa,CAAC,MAAM,GAAG,CAAC,KAClCF,sBAAA,CAAA,aAAA,CAACG,qBAAa,EAAA,EACV,IAAI,EAAE,EAAE,EACR,IAAI,EAAC,WAAW,EAChB,OAAO,EAAE,WAAW,EACpB,UAAU,EAAEC,kBAAa,CAAC,UAAU,EAAE,OAAO,CAAC,EAC9C,SAAS,EAAEF,uBAAM,CAAC,MAAM,EAGZ,EAAA,kDAAA,CAAA,CACnB,CACC;AA3BS;;;;"}

package/cssm/presets/useSelectWithApply/options-list-with-apply/header/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../../../../../src/presets/useSelectWithApply/options-list-with-apply/header/Component.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport { Checkbox, type CheckboxProps } from '@alfalab/core-components-checkbox';\n\nimport { type OptionsListProps } from '../../../../typings';\n\nimport styles from './index.module.css';\n\nexport type HeaderProps = {\n    checked?: boolean;\n    indeterminate?: boolean;\n    onChange?: CheckboxProps['onChange'];\n    mobile?: boolean;\n    dataTestId?: string;\n    checkmarkPosition?: 'before' | 'after';\n    size?: OptionsListProps['size'];\n};\n\nexport const Header: React.FC<HeaderProps> = ({\n    onChange,\n    checked,\n    indeterminate,\n    mobile,\n    dataTestId,\n    size,\n    checkmarkPosition = 'before',\n}) => (\n    <div\n        className={cn(size && styles[`size-${size}`], {\n            [styles.desktop]: !mobile,\n            [styles.mobile]: mobile,\n        })}\n    >\n        <Checkbox\n            block={true}\n            indeterminate={indeterminate}\n            size={24}\n            onChange={onChange}\n            checked={checked}\n            label='Выбрать все'\n            dataTestId={dataTestId}\n            position={checkmarkPosition}\n            contentClassName={cn({ [styles.positionAfter]: checkmarkPosition === 'after' })}\n        />\n    </div>\n);\n"],"names":["React","cn","styles","Checkbox"],"mappings":";;;;;;;;;;;;;;;AAmBO,IAAM,MAAM,GAA0B,UAAC,EAQ7C,EAAA;;QAPG,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,OAAO,GAAA,EAAA,CAAA,OAAA,EACP,aAAa,GAAA,EAAA,CAAA,aAAA,EACb,MAAM,GAAA,EAAA,CAAA,MAAA,EACN,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,IAAI,GAAA,EAAA,CAAA,IAAA,EACJ,yBAA4B,EAA5B,iBAAiB,GAAG,EAAA,KAAA,MAAA,GAAA,QAAQ,GAAA,EAAA;AAC1B,IAAA,QACFA,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAEC,mBAAE,CAAC,IAAI,IAAIC,uBAAM,CAAC,OAAQ,CAAA,MAAA,CAAA,IAAI,CAAE,CAAC,GAAA,EAAA,GAAA,EAAA;AACxC,YAAA,EAAA,CAACA,uBAAM,CAAC,OAAO,CAAA,GAAG,CAAC,MAAM;AACzB,YAAA,EAAA,CAACA,uBAAM,CAAC,MAAM,CAAA,GAAG,MAAM;AACzB,YAAA,EAAA,EAAA,EAAA;QAEFF,sBAAC,CAAA,aAAA,CAAAG,aAAQ,IACL,KAAK,EAAE,IAAI,EACX,aAAa,EAAE,aAAa,EAC5B,IAAI,EAAE,EAAE,EACR,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAC,+DAAa,EACnB,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAE,iBAAiB,EAC3B,gBAAgB,EAAEF,mBAAE,WAAG,EAAC,CAAAC,uBAAM,CAAC,aAAa,CAAG,GAAA,iBAAiB,KAAK,OAAO,EAAA,EAAA,EAAG,EACjF,CAAA,CACA;AAlBJ;;;;"}
+{"version":3,"file":"Component.js","sources":["../../../../src/presets/useSelectWithApply/options-list-with-apply/header/Component.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport { Checkbox, type CheckboxProps } from '@alfalab/core-components-checkbox';\n\nimport { type OptionsListProps } from '../../../../typings';\n\nimport styles from './index.module.css';\n\nexport type HeaderProps = {\n    checked?: boolean;\n    indeterminate?: boolean;\n    onChange?: CheckboxProps['onChange'];\n    mobile?: boolean;\n    dataTestId?: string;\n    checkmarkPosition?: 'before' | 'after';\n    size?: OptionsListProps['size'];\n};\n\nexport const Header: React.FC<HeaderProps> = ({\n    onChange,\n    checked,\n    indeterminate,\n    mobile,\n    dataTestId,\n    size,\n    checkmarkPosition = 'before',\n}) => (\n    <div\n        className={cn(size && styles[`size-${size}`], {\n            [styles.desktop]: !mobile,\n            [styles.mobile]: mobile,\n        })}\n    >\n        <Checkbox\n            block={true}\n            indeterminate={indeterminate}\n            size={24}\n            onChange={onChange}\n            checked={checked}\n            label='Выбрать все'\n            dataTestId={dataTestId}\n            position={checkmarkPosition}\n            contentClassName={cn({ [styles.positionAfter]: checkmarkPosition === 'after' })}\n        />\n    </div>\n);\n"],"names":["React","cn","styles","Checkbox"],"mappings":";;;;;;;;;;;;;;;AAmBO,IAAM,MAAM,GAA0B,UAAC,EAQ7C,EAAA;;QAPG,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,OAAO,GAAA,EAAA,CAAA,OAAA,EACP,aAAa,GAAA,EAAA,CAAA,aAAA,EACb,MAAM,GAAA,EAAA,CAAA,MAAA,EACN,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,IAAI,GAAA,EAAA,CAAA,IAAA,EACJ,yBAA4B,EAA5B,iBAAiB,GAAG,EAAA,KAAA,MAAA,GAAA,QAAQ,GAAA,EAAA;AAC1B,IAAA,QACFA,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAEC,mBAAE,CAAC,IAAI,IAAIC,uBAAM,CAAC,OAAQ,CAAA,MAAA,CAAA,IAAI,CAAE,CAAC,GAAA,EAAA,GAAA,EAAA;AACxC,YAAA,EAAA,CAACA,uBAAM,CAAC,OAAO,CAAA,GAAG,CAAC,MAAM;AACzB,YAAA,EAAA,CAACA,uBAAM,CAAC,MAAM,CAAA,GAAG,MAAM;AACzB,YAAA,EAAA,EAAA,EAAA;QAEFF,sBAAC,CAAA,aAAA,CAAAG,aAAQ,IACL,KAAK,EAAE,IAAI,EACX,aAAa,EAAE,aAAa,EAC5B,IAAI,EAAE,EAAE,EACR,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAC,+DAAa,EACnB,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAE,iBAAiB,EAC3B,gBAAgB,EAAEF,mBAAE,WAAG,EAAC,CAAAC,uBAAM,CAAC,aAAa,CAAG,GAAA,iBAAiB,KAAK,OAAO,EAAA,EAAA,EAAG,EACjF,CAAA,CACA;AAlBJ;;;;"}