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

package/cssm/components/base-checkmark/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../../../src/components/base-checkmark/Component.tsx"],"sourcesContent":["import React, { type FC } from 'react';\nimport cn from 'classnames';\n\nimport { Checkbox } from '@alfalab/core-components-checkbox';\nimport { CheckmarkMIcon } from '@alfalab/icons-glyph/CheckmarkMIcon';\n\nimport { type CheckmarkProps } from '../../typings';\n\nimport styles from './index.module.css';\n\nexport const BaseCheckmark: FC<CheckmarkProps> = ({\n    selected,\n    disabled = false,\n    className,\n    multiple,\n    align = 'center',\n    position = 'before',\n    content,\n}) => {\n    const renderCheckmarkIcon = () => (\n        <CheckmarkMIcon\n            className={cn(styles.singleIcon, styles[position], {\n                [styles.selected]: selected,\n            })}\n        />\n    );\n\n    return multiple ? (\n        <Checkbox\n            block={true}\n            checked={selected}\n            disabled={disabled}\n            contentClassName={cn({ [styles.positionAfter]: position === 'after' })}\n            className={cn(styles.checkmark, styles[align], className, {\n                [styles.selected]: selected,\n            })}\n            size={24}\n            position={position}\n            label={content}\n            hiddenInput={true}\n        />\n    ) : (\n        <div className={cn(styles.container, styles[align], className)}>\n            {position === 'before' && renderCheckmarkIcon()}\n\n            <div className={styles.content}>{content}</div>\n\n            {position === 'after' && renderCheckmarkIcon()}\n        </div>\n    );\n};\n"],"names":["React","CheckmarkMIcon","cn","styles","Checkbox"],"mappings":";;;;;;;;;;;;;;;;AAUO,IAAM,aAAa,GAAuB,UAAC,EAQjD,EAAA;;AAPG,IAAA,IAAA,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,EAAgB,GAAA,EAAA,CAAA,QAAA,EAAhB,QAAQ,GAAA,EAAA,KAAA,MAAA,GAAG,KAAK,GAAA,EAAA,EAChB,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,EAAgB,GAAA,EAAA,CAAA,KAAA,EAAhB,KAAK,GAAA,EAAA,KAAA,MAAA,GAAG,QAAQ,GAAA,EAAA,EAChB,EAAA,GAAA,EAAA,CAAA,QAAmB,EAAnB,QAAQ,GAAG,EAAA,KAAA,MAAA,GAAA,QAAQ,GAAA,EAAA,EACnB,OAAO,GAAA,EAAA,CAAA,OAAA;AAEP,IAAA,IAAM,mBAAmB,GAAG,YAAA;;AAAM,QAAA,QAC9BA,sBAAA,CAAA,aAAA,CAACC,6BAAc,EAAA,EACX,SAAS,EAAEC,mBAAE,CAACC,uBAAM,CAAC,UAAU,EAAEA,uBAAM,CAAC,QAAQ,CAAC,GAAA,EAAA,GAAA,EAAA;AAC7C,gBAAA,EAAA,CAACA,uBAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;AAC7B,gBAAA,EAAA,EAAA,EAAA,CACJ;AAL4B,KAMjC;IAED,OAAO,QAAQ,IACXH,sBAAC,CAAA,aAAA,CAAAI,aAAQ,IACL,KAAK,EAAE,IAAI,EACX,OAAO,EAAE,QAAQ,EACjB,QAAQ,EAAE,QAAQ,EAClB,gBAAgB,EAAEF,mBAAE,WAAG,EAAC,CAAAC,uBAAM,CAAC,aAAa,CAAA,GAAG,QAAQ,KAAK,OAAO,EAAG,EAAA,EAAA,EACtE,SAAS,EAAED,mBAAE,CAACC,uBAAM,CAAC,SAAS,EAAEA,uBAAM,CAAC,KAAK,CAAC,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AACpD,YAAA,EAAA,CAACA,uBAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;AAC7B,YAAA,EAAA,EAAA,EACF,IAAI,EAAE,EAAE,EACR,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,OAAO,EACd,WAAW,EAAE,IAAI,GACnB,KAEFH,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEE,mBAAE,CAACC,uBAAM,CAAC,SAAS,EAAEA,uBAAM,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,EAAA;AACzD,QAAA,QAAQ,KAAK,QAAQ,IAAI,mBAAmB,EAAE;AAE/C,QAAAH,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEG,uBAAM,CAAC,OAAO,EAAA,EAAG,OAAO,CAAO;AAE9C,QAAA,QAAQ,KAAK,OAAO,IAAI,mBAAmB,EAAE,CAC5C,CACT;AACL;;;;"}
+{"version":3,"file":"Component.js","sources":["../../../src/components/base-checkmark/Component.tsx"],"sourcesContent":["import React, { type FC } from 'react';\nimport cn from 'classnames';\n\nimport { Checkbox } from '@alfalab/core-components-checkbox';\nimport { CheckmarkMIcon } from '@alfalab/icons-glyph/CheckmarkMIcon';\n\nimport { type CheckmarkProps } from '../../typings';\n\nimport styles from './index.module.css';\n\nexport const BaseCheckmark: FC<CheckmarkProps> = ({\n    selected,\n    disabled = false,\n    className,\n    multiple,\n    align = 'center',\n    position = 'before',\n}) =>\n    multiple ? (\n        <Checkbox\n            checked={selected}\n            disabled={disabled}\n            className={cn(styles.checkmark, styles[position], styles[align], className, {\n                [styles.selected]: selected,\n            })}\n            size={24}\n            hiddenInput={true}\n        />\n    ) : (\n        <CheckmarkMIcon\n            className={cn(styles.singleIcon, styles[position], styles[align], className, {\n                [styles.selected]: selected,\n            })}\n        />\n    );\n"],"names":["React","Checkbox","cn","styles","CheckmarkMIcon"],"mappings":";;;;;;;;;;;;;;;;AAUO,IAAM,aAAa,GAAuB,UAAC,EAOjD,EAAA;;QANG,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,EAAA,GAAA,EAAA,CAAA,QAAgB,EAAhB,QAAQ,GAAG,EAAA,KAAA,MAAA,GAAA,KAAK,GAAA,EAAA,EAChB,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,EAAgB,GAAA,EAAA,CAAA,KAAA,EAAhB,KAAK,GAAA,EAAA,KAAA,MAAA,GAAG,QAAQ,GAAA,EAAA,EAChB,EAAA,GAAA,EAAA,CAAA,QAAmB,EAAnB,QAAQ,GAAG,EAAA,KAAA,MAAA,GAAA,QAAQ,GAAA,EAAA;AAEnB,IAAA,OAAA,QAAQ,IACJA,sBAAC,CAAA,aAAA,CAAAC,aAAQ,EACL,EAAA,OAAO,EAAE,QAAQ,EACjB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAEC,mBAAE,CAACC,uBAAM,CAAC,SAAS,EAAEA,uBAAM,CAAC,QAAQ,CAAC,EAAEA,uBAAM,CAAC,KAAK,CAAC,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AACtE,YAAA,EAAA,CAACA,uBAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;AAC7B,YAAA,EAAA,EAAA,EACF,IAAI,EAAE,EAAE,EACR,WAAW,EAAE,IAAI,EACnB,CAAA,KAEFH,sBAAA,CAAA,aAAA,CAACI,6BAAc,EACX,EAAA,SAAS,EAAEF,mBAAE,CAACC,uBAAM,CAAC,UAAU,EAAEA,uBAAM,CAAC,QAAQ,CAAC,EAAEA,uBAAM,CAAC,KAAK,CAAC,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AACvE,YAAA,EAAA,CAACA,uBAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;AAC7B,YAAA,EAAA,EAAA,EAAA,CACJ,CACL;AAhBD;;;;"}

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

@@ -6,28 +6,18 @@
     flex-shrink: 0;
     box-sizing: border-box;
 }
+.checkmark.before {
+        margin-right: var(--gap-12);
+    }
+.checkmark.after {
+        margin-left: var(--gap-12);
+    }
 .checkmark.start {
         align-self: start;
     }
 .checkmark.center {
         align-self: center;
     }
-.positionAfter {
-    margin-left: 0;
-    margin-left: initial;
-}
-.container {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 100%;
-}
-.container.start {
-        align-items: flex-start;
-    }
-.container.center {
-        align-items: center;
-    }
 .singleIcon {
     flex-shrink: 0;
     opacity: 0;
@@ -41,6 +31,3 @@
 .singleIcon.selected {
         opacity: 1;
     }
-.content {
-    flex: 1;
-}

package/cssm/components/base-option/Component.js

@@ -22,6 +22,9 @@ var BaseOption = function (_a) {
     var _h = option.showCheckMark, showCheckMark = _h === void 0 ? true : _h;
     var isTextContent = !React.isValidElement(content);
     var showCheckmark = Checkmark && showCheckMark;
+    var renderCheckmark = function (position) {
+        return showCheckmark && (React__default.default.createElement(Checkmark, { disabled: disabled, selected: selected, multiple: multiple, align: align, position: position }));
+    };
     return (React__default.default.createElement("div", tslib.__assign({}, innerProps, { className: cn__default.default(styles__default.default.option, size && styles__default.default["size-".concat(size)], className, (_b = {},
             _b[styles__default.default.highlighted] = !mobile && highlighted,
             _b[styles__default.default.selected] = selected,
@@ -30,7 +33,10 @@ var BaseOption = function (_a) {
             _b[styles__default.default.mobile] = mobile,
             _b[styles__default.default.checkmarkAfter] = showCheckmark && !isTextContent && checkmarkPosition === 'after',
             _b[styles__default.default.checkmarkBefore] = showCheckmark && !isTextContent && checkmarkPosition === 'before',
-            _b)), "data-test-id": dataTestId, "aria-label": (_c = option === null || option === void 0 ? void 0 : option.value) === null || _c === void 0 ? void 0 : _c.name }), showCheckmark ? (React__default.default.createElement(Checkmark, { disabled: disabled, selected: selected, multiple: multiple, align: align, position: checkmarkPosition, content: content })) : (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.content) }, content))));
+            _b)), "data-test-id": dataTestId, "aria-label": (_c = option === null || option === void 0 ? void 0 : option.value) === null || _c === void 0 ? void 0 : _c.name }),
+        checkmarkPosition === 'before' && renderCheckmark('before'),
+        React__default.default.createElement("div", { className: cn__default.default(styles__default.default.content) }, content),
+        checkmarkPosition === 'after' && renderCheckmark('after')));
 };
 
 exports.BaseOption = BaseOption;

package/cssm/components/base-option/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../../../src/components/base-option/Component.tsx"],"sourcesContent":["import React, { type FC, isValidElement } from 'react';\nimport cn from 'classnames';\n\nimport { type OptionProps } from '../../typings';\nimport { BaseCheckmark } from '../base-checkmark';\n\nimport styles from './index.module.css';\n\nexport const BaseOption: FC<OptionProps> = ({\n    className,\n    option,\n    children,\n    selected,\n    highlighted,\n    disabled,\n    multiple,\n    Checkmark = BaseCheckmark,\n    checkmarkPosition = multiple ? 'before' : 'after',\n    align = 'center',\n    innerProps,\n    dataTestId,\n    mobile = false,\n    size,\n}) => {\n    const content = children || option.content || option.key;\n    const { showCheckMark = true } = option;\n    const isTextContent = !isValidElement(content);\n    const showCheckmark = Checkmark && showCheckMark;\n\n    return (\n        <div\n            {...innerProps}\n            className={cn(styles.option, size && styles[`size-${size}`], className, {\n                [styles.highlighted]: !mobile && highlighted,\n                [styles.selected]: selected,\n                [styles.disabled]: disabled,\n                [styles.textContent]: isTextContent,\n                [styles.mobile]: mobile,\n                [styles.checkmarkAfter]:\n                    showCheckmark && !isTextContent && checkmarkPosition === 'after',\n                [styles.checkmarkBefore]:\n                    showCheckmark && !isTextContent && checkmarkPosition === 'before',\n            })}\n            data-test-id={dataTestId}\n            aria-label={option?.value?.name}\n        >\n            {showCheckmark ? (\n                <Checkmark\n                    disabled={disabled}\n                    selected={selected}\n                    multiple={multiple}\n                    align={align}\n                    position={checkmarkPosition}\n                    content={content}\n                />\n            ) : (\n                <div className={cn(styles.content)}>{content}</div>\n            )}\n        </div>\n    );\n};\n"],"names":["BaseCheckmark","isValidElement","React","cn","styles"],"mappings":";;;;;;;;;;;;;;;;AAQO,IAAM,UAAU,GAAoB,UAAC,EAe3C,EAAA;;;AAdG,IAAA,IAAA,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,MAAM,GAAA,EAAA,CAAA,MAAA,EACN,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,WAAW,GAAA,EAAA,CAAA,WAAA,EACX,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,EAAyB,GAAA,EAAA,CAAA,SAAA,EAAzB,SAAS,GAAA,EAAA,KAAA,MAAA,GAAGA,uBAAa,GAAA,EAAA,EACzB,EAAA,GAAA,EAAA,CAAA,iBAAiD,EAAjD,iBAAiB,GAAA,EAAA,KAAA,MAAA,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,GAAA,EAAA,EACjD,EAAA,GAAA,EAAA,CAAA,KAAgB,EAAhB,KAAK,mBAAG,QAAQ,GAAA,EAAA,EAChB,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,EAAA,GAAA,EAAA,CAAA,MAAc,EAAd,MAAM,GAAG,EAAA,KAAA,MAAA,GAAA,KAAK,GAAA,EAAA,EACd,IAAI,GAAA,EAAA,CAAA,IAAA;IAEJ,IAAM,OAAO,GAAG,QAAQ,IAAI,MAAM,CAAC,OAAO,IAAI,MAAM,CAAC,GAAG;IAChD,IAAA,EAAA,GAAyB,MAAM,CAAX,aAAA,EAApB,aAAa,GAAG,EAAA,KAAA,MAAA,GAAA,IAAI,KAAA;AAC5B,IAAA,IAAM,aAAa,GAAG,CAACC,oBAAc,CAAC,OAAO,CAAC;AAC9C,IAAA,IAAM,aAAa,GAAG,SAAS,IAAI,aAAa;IAEhD,QACIC,+DACQ,UAAU,EAAA,EACd,SAAS,EAAEC,mBAAE,CAACC,uBAAM,CAAC,MAAM,EAAE,IAAI,IAAIA,uBAAM,CAAC,eAAQ,IAAI,CAAE,CAAC,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AAClE,YAAA,EAAA,CAACA,uBAAM,CAAC,WAAW,IAAG,CAAC,MAAM,IAAI,WAAW;AAC5C,YAAA,EAAA,CAACA,uBAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;AAC3B,YAAA,EAAA,CAACA,uBAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;AAC3B,YAAA,EAAA,CAACA,uBAAM,CAAC,WAAW,CAAA,GAAG,aAAa;AACnC,YAAA,EAAA,CAACA,uBAAM,CAAC,MAAM,CAAA,GAAG,MAAM;YACvB,EAAC,CAAAA,uBAAM,CAAC,cAAc,CAClB,GAAA,aAAa,IAAI,CAAC,aAAa,IAAI,iBAAiB,KAAK,OAAO;YACpE,EAAC,CAAAA,uBAAM,CAAC,eAAe,CACnB,GAAA,aAAa,IAAI,CAAC,aAAa,IAAI,iBAAiB,KAAK,QAAQ;AACvE,YAAA,EAAA,EAAA,EAAA,cAAA,EACY,UAAU,EAAA,YAAA,EACZ,CAAA,EAAA,GAAA,MAAM,KAAN,IAAA,IAAA,MAAM,KAAN,MAAA,GAAA,MAAA,GAAA,MAAM,CAAE,KAAK,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAI,KAE9B,aAAa,IACVF,sBAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EACN,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,iBAAiB,EAC3B,OAAO,EAAE,OAAO,EAClB,CAAA,KAEFA,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEC,mBAAE,CAACC,uBAAM,CAAC,OAAO,CAAC,EAAA,EAAG,OAAO,CAAO,CACtD,CACC;AAEd;;;;"}
+{"version":3,"file":"Component.js","sources":["../../../src/components/base-option/Component.tsx"],"sourcesContent":["import React, { type FC, isValidElement } from 'react';\nimport cn from 'classnames';\n\nimport { type OptionProps } from '../../typings';\nimport { BaseCheckmark } from '../base-checkmark';\n\nimport styles from './index.module.css';\n\nexport const BaseOption: FC<OptionProps> = ({\n    className,\n    option,\n    children,\n    selected,\n    highlighted,\n    disabled,\n    multiple,\n    Checkmark = BaseCheckmark,\n    checkmarkPosition = multiple ? 'before' : 'after',\n    align = 'center',\n    innerProps,\n    dataTestId,\n    mobile = false,\n    size,\n}) => {\n    const content = children || option.content || option.key;\n    const { showCheckMark = true } = option;\n    const isTextContent = !isValidElement(content);\n    const showCheckmark = Checkmark && showCheckMark;\n\n    const renderCheckmark = (position: 'before' | 'after') =>\n        showCheckmark && (\n            <Checkmark\n                disabled={disabled}\n                selected={selected}\n                multiple={multiple}\n                align={align}\n                position={position}\n            />\n        );\n\n    return (\n        <div\n            {...innerProps}\n            className={cn(styles.option, size && styles[`size-${size}`], className, {\n                [styles.highlighted]: !mobile && highlighted,\n                [styles.selected]: selected,\n                [styles.disabled]: disabled,\n                [styles.textContent]: isTextContent,\n                [styles.mobile]: mobile,\n                [styles.checkmarkAfter]:\n                    showCheckmark && !isTextContent && checkmarkPosition === 'after',\n                [styles.checkmarkBefore]:\n                    showCheckmark && !isTextContent && checkmarkPosition === 'before',\n            })}\n            data-test-id={dataTestId}\n            aria-label={option?.value?.name}\n        >\n            {checkmarkPosition === 'before' && renderCheckmark('before')}\n\n            <div className={cn(styles.content)}>{content}</div>\n\n            {checkmarkPosition === 'after' && renderCheckmark('after')}\n        </div>\n    );\n};\n"],"names":["BaseCheckmark","isValidElement","React","cn","styles"],"mappings":"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"}

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/esm/components/arrow/index.css

@@ -9,7 +9,7 @@
     --select-arrow-color: var(--color-light-neutral-translucent-700);
     --select-arrow-disabled-color: var(--color-light-neutral-translucent-500);
 }
-.select__arrow_5gn75 {
+.select__arrow_li5k5 {
     display: block;
     width: 24px;
     height: 24px;
@@ -19,15 +19,15 @@
         transform 0.15s ease-in-out,
         opacity 0.2s ease;
 }
-.select__arrow_5gn75.select__disabled_5gn75 {
+.select__arrow_li5k5.select__disabled_li5k5 {
         color: var(--select-arrow-disabled-color);
     }
-.select__arrow_5gn75.select__size-40_5gn75 {
+.select__arrow_li5k5.select__size-40_li5k5 {
         width: auto;
         width: initial;
         height: auto;
         height: initial;
     }
-.select__open_5gn75 {
+.select__open_li5k5 {
     transform: var(--arrow-transform);
 }

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

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"arrow":"select__arrow_5gn75","disabled":"select__disabled_5gn75","size-40":"select__size-40_5gn75","open":"select__open_5gn75"};
+var styles = {"arrow":"select__arrow_li5k5","disabled":"select__disabled_li5k5","size-40":"select__size-40_li5k5","open":"select__open_li5k5"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/base-checkmark/Component.js

@@ -6,19 +6,12 @@ import styles from './index.module.css.js';
 
 var BaseCheckmark = function (_a) {
     var _b, _c;
-    var selected = _a.selected, _d = _a.disabled, disabled = _d === void 0 ? false : _d, className = _a.className, multiple = _a.multiple, _e = _a.align, align = _e === void 0 ? 'center' : _e, _f = _a.position, position = _f === void 0 ? 'before' : _f, content = _a.content;
-    var renderCheckmarkIcon = function () {
-        var _a;
-        return (React.createElement(CheckmarkMIcon, { className: cn(styles.singleIcon, styles[position], (_a = {},
-                _a[styles.selected] = selected,
-                _a)) }));
-    };
-    return multiple ? (React.createElement(Checkbox, { block: true, checked: selected, disabled: disabled, contentClassName: cn((_b = {}, _b[styles.positionAfter] = position === 'after', _b)), className: cn(styles.checkmark, styles[align], className, (_c = {},
+    var selected = _a.selected, _d = _a.disabled, disabled = _d === void 0 ? false : _d, className = _a.className, multiple = _a.multiple, _e = _a.align, align = _e === void 0 ? 'center' : _e, _f = _a.position, position = _f === void 0 ? 'before' : _f;
+    return multiple ? (React.createElement(Checkbox, { checked: selected, disabled: disabled, className: cn(styles.checkmark, styles[position], styles[align], className, (_b = {},
+            _b[styles.selected] = selected,
+            _b)), size: 24, hiddenInput: true })) : (React.createElement(CheckmarkMIcon, { className: cn(styles.singleIcon, styles[position], styles[align], className, (_c = {},
             _c[styles.selected] = selected,
-            _c)), size: 24, position: position, label: content, hiddenInput: true })) : (React.createElement("div", { className: cn(styles.container, styles[align], className) },
-        position === 'before' && renderCheckmarkIcon(),
-        React.createElement("div", { className: styles.content }, content),
-        position === 'after' && renderCheckmarkIcon()));
+            _c)) }));
 };
 
 export { BaseCheckmark };

package/esm/components/base-checkmark/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../../../src/components/base-checkmark/Component.tsx"],"sourcesContent":["import React, { type FC } from 'react';\nimport cn from 'classnames';\n\nimport { Checkbox } from '@alfalab/core-components-checkbox';\nimport { CheckmarkMIcon } from '@alfalab/icons-glyph/CheckmarkMIcon';\n\nimport { type CheckmarkProps } from '../../typings';\n\nimport styles from './index.module.css';\n\nexport const BaseCheckmark: FC<CheckmarkProps> = ({\n    selected,\n    disabled = false,\n    className,\n    multiple,\n    align = 'center',\n    position = 'before',\n    content,\n}) => {\n    const renderCheckmarkIcon = () => (\n        <CheckmarkMIcon\n            className={cn(styles.singleIcon, styles[position], {\n                [styles.selected]: selected,\n            })}\n        />\n    );\n\n    return multiple ? (\n        <Checkbox\n            block={true}\n            checked={selected}\n            disabled={disabled}\n            contentClassName={cn({ [styles.positionAfter]: position === 'after' })}\n            className={cn(styles.checkmark, styles[align], className, {\n                [styles.selected]: selected,\n            })}\n            size={24}\n            position={position}\n            label={content}\n            hiddenInput={true}\n        />\n    ) : (\n        <div className={cn(styles.container, styles[align], className)}>\n            {position === 'before' && renderCheckmarkIcon()}\n\n            <div className={styles.content}>{content}</div>\n\n            {position === 'after' && renderCheckmarkIcon()}\n        </div>\n    );\n};\n"],"names":[],"mappings":";;;;;;AAUO,IAAM,aAAa,GAAuB,UAAC,EAQjD,EAAA;;AAPG,IAAA,IAAA,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,EAAgB,GAAA,EAAA,CAAA,QAAA,EAAhB,QAAQ,GAAA,EAAA,KAAA,MAAA,GAAG,KAAK,GAAA,EAAA,EAChB,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,EAAgB,GAAA,EAAA,CAAA,KAAA,EAAhB,KAAK,GAAA,EAAA,KAAA,MAAA,GAAG,QAAQ,GAAA,EAAA,EAChB,EAAA,GAAA,EAAA,CAAA,QAAmB,EAAnB,QAAQ,GAAG,EAAA,KAAA,MAAA,GAAA,QAAQ,GAAA,EAAA,EACnB,OAAO,GAAA,EAAA,CAAA,OAAA;AAEP,IAAA,IAAM,mBAAmB,GAAG,YAAA;;AAAM,QAAA,QAC9B,KAAA,CAAA,aAAA,CAAC,cAAc,EAAA,EACX,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,UAAU,EAAE,MAAM,CAAC,QAAQ,CAAC,GAAA,EAAA,GAAA,EAAA;AAC7C,gBAAA,EAAA,CAAC,MAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;AAC7B,gBAAA,EAAA,EAAA,EAAA,CACJ;AAL4B,KAMjC;IAED,OAAO,QAAQ,IACX,KAAC,CAAA,aAAA,CAAA,QAAQ,IACL,KAAK,EAAE,IAAI,EACX,OAAO,EAAE,QAAQ,EACjB,QAAQ,EAAE,QAAQ,EAClB,gBAAgB,EAAE,EAAE,WAAG,EAAC,CAAA,MAAM,CAAC,aAAa,CAAA,GAAG,QAAQ,KAAK,OAAO,EAAG,EAAA,EAAA,EACtE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,KAAK,CAAC,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AACpD,YAAA,EAAA,CAAC,MAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;AAC7B,YAAA,EAAA,EAAA,EACF,IAAI,EAAE,EAAE,EACR,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,OAAO,EACd,WAAW,EAAE,IAAI,GACnB,KAEF,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,EAAA;AACzD,QAAA,QAAQ,KAAK,QAAQ,IAAI,mBAAmB,EAAE;AAE/C,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,OAAO,EAAA,EAAG,OAAO,CAAO;AAE9C,QAAA,QAAQ,KAAK,OAAO,IAAI,mBAAmB,EAAE,CAC5C,CACT;AACL;;;;"}
+{"version":3,"file":"Component.js","sources":["../../../src/components/base-checkmark/Component.tsx"],"sourcesContent":["import React, { type FC } from 'react';\nimport cn from 'classnames';\n\nimport { Checkbox } from '@alfalab/core-components-checkbox';\nimport { CheckmarkMIcon } from '@alfalab/icons-glyph/CheckmarkMIcon';\n\nimport { type CheckmarkProps } from '../../typings';\n\nimport styles from './index.module.css';\n\nexport const BaseCheckmark: FC<CheckmarkProps> = ({\n    selected,\n    disabled = false,\n    className,\n    multiple,\n    align = 'center',\n    position = 'before',\n}) =>\n    multiple ? (\n        <Checkbox\n            checked={selected}\n            disabled={disabled}\n            className={cn(styles.checkmark, styles[position], styles[align], className, {\n                [styles.selected]: selected,\n            })}\n            size={24}\n            hiddenInput={true}\n        />\n    ) : (\n        <CheckmarkMIcon\n            className={cn(styles.singleIcon, styles[position], styles[align], className, {\n                [styles.selected]: selected,\n            })}\n        />\n    );\n"],"names":[],"mappings":";;;;;;AAUO,IAAM,aAAa,GAAuB,UAAC,EAOjD,EAAA;;QANG,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,EAAA,GAAA,EAAA,CAAA,QAAgB,EAAhB,QAAQ,GAAG,EAAA,KAAA,MAAA,GAAA,KAAK,GAAA,EAAA,EAChB,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,EAAgB,GAAA,EAAA,CAAA,KAAA,EAAhB,KAAK,GAAA,EAAA,KAAA,MAAA,GAAG,QAAQ,GAAA,EAAA,EAChB,EAAA,GAAA,EAAA,CAAA,QAAmB,EAAnB,QAAQ,GAAG,EAAA,KAAA,MAAA,GAAA,QAAQ,GAAA,EAAA;AAEnB,IAAA,OAAA,QAAQ,IACJ,KAAC,CAAA,aAAA,CAAA,QAAQ,EACL,EAAA,OAAO,EAAE,QAAQ,EACjB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,KAAK,CAAC,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AACtE,YAAA,EAAA,CAAC,MAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;AAC7B,YAAA,EAAA,EAAA,EACF,IAAI,EAAE,EAAE,EACR,WAAW,EAAE,IAAI,EACnB,CAAA,KAEF,KAAA,CAAA,aAAA,CAAC,cAAc,EACX,EAAA,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,UAAU,EAAE,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,KAAK,CAAC,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AACvE,YAAA,EAAA,CAAC,MAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;AAC7B,YAAA,EAAA,EAAA,EAAA,CACJ,CACL;AAhBD;;;;"}

package/esm/components/base-checkmark/index.css

@@ -2,45 +2,32 @@
     --gap-s: 12px;
     --gap-12: var(--gap-s);
 }
-.select__checkmark_amrft {
+.select__checkmark_j0fuj {
     flex-shrink: 0;
     box-sizing: border-box;
 }
-.select__checkmark_amrft.select__start_amrft {
-        align-self: start;
+.select__checkmark_j0fuj.select__before_j0fuj {
+        margin-right: var(--gap-12);
     }
-.select__checkmark_amrft.select__center_amrft {
-        align-self: center;
+.select__checkmark_j0fuj.select__after_j0fuj {
+        margin-left: var(--gap-12);
     }
-.select__positionAfter_amrft {
-    margin-left: 0;
-    margin-left: initial;
-}
-.select__container_amrft {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 100%;
-}
-.select__container_amrft.select__start_amrft {
-        align-items: flex-start;
+.select__checkmark_j0fuj.select__start_j0fuj {
+        align-self: start;
     }
-.select__container_amrft.select__center_amrft {
-        align-items: center;
+.select__checkmark_j0fuj.select__center_j0fuj {
+        align-self: center;
     }
-.select__singleIcon_amrft {
+.select__singleIcon_j0fuj {
     flex-shrink: 0;
     opacity: 0;
 }
-.select__singleIcon_amrft.select__before_amrft {
+.select__singleIcon_j0fuj.select__before_j0fuj {
         margin-right: var(--gap-12);
     }
-.select__singleIcon_amrft.select__after_amrft {
+.select__singleIcon_j0fuj.select__after_j0fuj {
         margin-left: var(--gap-12);
     }
-.select__singleIcon_amrft.select__selected_amrft {
+.select__singleIcon_j0fuj.select__selected_j0fuj {
         opacity: 1;
     }
-.select__content_amrft {
-    flex: 1;
-}

package/esm/components/base-checkmark/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"checkmark":"select__checkmark_amrft","start":"select__start_amrft","center":"select__center_amrft","positionAfter":"select__positionAfter_amrft","container":"select__container_amrft","singleIcon":"select__singleIcon_amrft","before":"select__before_amrft","after":"select__after_amrft","selected":"select__selected_amrft","content":"select__content_amrft"};
+var styles = {"checkmark":"select__checkmark_j0fuj","before":"select__before_j0fuj","after":"select__after_j0fuj","start":"select__start_j0fuj","center":"select__center_j0fuj","singleIcon":"select__singleIcon_j0fuj","selected":"select__selected_j0fuj"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/base-checkmark/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["../../src/components/base-checkmark/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../../vars.css';\n\n.checkmark {\n    flex-shrink: 0;\n    box-sizing: border-box;\n\n    &.start {\n        align-self: start;\n    }\n\n    &.center {\n        align-self: center;\n    }\n}\n\n.positionAfter {\n    margin-left: unset;\n}\n\n.container {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n\n    &.start {\n        align-items: flex-start;\n    }\n\n    &.center {\n        align-items: center;\n    }\n}\n\n.singleIcon {\n    flex-shrink: 0;\n    opacity: 0;\n\n    &.before {\n        margin-right: var(--gap-12);\n    }\n\n    &.after {\n        margin-left: var(--gap-12);\n    }\n\n    &.selected {\n        opacity: 1;\n    }\n}\n\n.content {\n    flex: 1;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,yBAAyB,CAAC,OAAO,CAAC,qBAAqB,CAAC,QAAQ,CAAC,sBAAsB,CAAC,eAAe,CAAC,6BAA6B,CAAC,WAAW,CAAC,yBAAyB,CAAC,YAAY,CAAC,0BAA0B,CAAC,QAAQ,CAAC,sBAAsB,CAAC,OAAO,CAAC,qBAAqB,CAAC,UAAU,CAAC,wBAAwB,CAAC,SAAS,CAAC,uBAAuB,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/base-checkmark/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '../../vars.css';\n\n.checkmark {\n    flex-shrink: 0;\n    box-sizing: border-box;\n\n    &.before {\n        margin-right: var(--gap-12);\n    }\n\n    &.after {\n        margin-left: var(--gap-12);\n    }\n\n    &.start {\n        align-self: start;\n    }\n\n    &.center {\n        align-self: center;\n    }\n}\n\n.singleIcon {\n    flex-shrink: 0;\n    opacity: 0;\n\n    &.before {\n        margin-right: var(--gap-12);\n    }\n\n    &.after {\n        margin-left: var(--gap-12);\n    }\n\n    &.selected {\n        opacity: 1;\n    }\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,yBAAyB,CAAC,QAAQ,CAAC,sBAAsB,CAAC,OAAO,CAAC,qBAAqB,CAAC,OAAO,CAAC,qBAAqB,CAAC,QAAQ,CAAC,sBAAsB,CAAC,YAAY,CAAC,0BAA0B,CAAC,UAAU,CAAC,wBAAwB,CAAC;;;;"}

package/esm/components/base-option/Component.js

@@ -12,6 +12,9 @@ var BaseOption = function (_a) {
     var _h = option.showCheckMark, showCheckMark = _h === void 0 ? true : _h;
     var isTextContent = !isValidElement(content);
     var showCheckmark = Checkmark && showCheckMark;
+    var renderCheckmark = function (position) {
+        return showCheckmark && (React.createElement(Checkmark, { disabled: disabled, selected: selected, multiple: multiple, align: align, position: position }));
+    };
     return (React.createElement("div", __assign({}, innerProps, { className: cn(styles.option, size && styles["size-".concat(size)], className, (_b = {},
             _b[styles.highlighted] = !mobile && highlighted,
             _b[styles.selected] = selected,
@@ -20,7 +23,10 @@ var BaseOption = function (_a) {
             _b[styles.mobile] = mobile,
             _b[styles.checkmarkAfter] = showCheckmark && !isTextContent && checkmarkPosition === 'after',
             _b[styles.checkmarkBefore] = showCheckmark && !isTextContent && checkmarkPosition === 'before',
-            _b)), "data-test-id": dataTestId, "aria-label": (_c = option === null || option === void 0 ? void 0 : option.value) === null || _c === void 0 ? void 0 : _c.name }), showCheckmark ? (React.createElement(Checkmark, { disabled: disabled, selected: selected, multiple: multiple, align: align, position: checkmarkPosition, content: content })) : (React.createElement("div", { className: cn(styles.content) }, content))));
+            _b)), "data-test-id": dataTestId, "aria-label": (_c = option === null || option === void 0 ? void 0 : option.value) === null || _c === void 0 ? void 0 : _c.name }),
+        checkmarkPosition === 'before' && renderCheckmark('before'),
+        React.createElement("div", { className: cn(styles.content) }, content),
+        checkmarkPosition === 'after' && renderCheckmark('after')));
 };
 
 export { BaseOption };

package/esm/components/base-option/Component.js.map

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../../../src/components/base-option/Component.tsx"],"sourcesContent":["import React, { type FC, isValidElement } from 'react';\nimport cn from 'classnames';\n\nimport { type OptionProps } from '../../typings';\nimport { BaseCheckmark } from '../base-checkmark';\n\nimport styles from './index.module.css';\n\nexport const BaseOption: FC<OptionProps> = ({\n    className,\n    option,\n    children,\n    selected,\n    highlighted,\n    disabled,\n    multiple,\n    Checkmark = BaseCheckmark,\n    checkmarkPosition = multiple ? 'before' : 'after',\n    align = 'center',\n    innerProps,\n    dataTestId,\n    mobile = false,\n    size,\n}) => {\n    const content = children || option.content || option.key;\n    const { showCheckMark = true } = option;\n    const isTextContent = !isValidElement(content);\n    const showCheckmark = Checkmark && showCheckMark;\n\n    return (\n        <div\n            {...innerProps}\n            className={cn(styles.option, size && styles[`size-${size}`], className, {\n                [styles.highlighted]: !mobile && highlighted,\n                [styles.selected]: selected,\n                [styles.disabled]: disabled,\n                [styles.textContent]: isTextContent,\n                [styles.mobile]: mobile,\n                [styles.checkmarkAfter]:\n                    showCheckmark && !isTextContent && checkmarkPosition === 'after',\n                [styles.checkmarkBefore]:\n                    showCheckmark && !isTextContent && checkmarkPosition === 'before',\n            })}\n            data-test-id={dataTestId}\n            aria-label={option?.value?.name}\n        >\n            {showCheckmark ? (\n                <Checkmark\n                    disabled={disabled}\n                    selected={selected}\n                    multiple={multiple}\n                    align={align}\n                    position={checkmarkPosition}\n                    content={content}\n                />\n            ) : (\n                <div className={cn(styles.content)}>{content}</div>\n            )}\n        </div>\n    );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Component.js","sources":["../../../src/components/base-option/Component.tsx"],"sourcesContent":["import React, { type FC, isValidElement } from 'react';\nimport cn from 'classnames';\n\nimport { type OptionProps } from '../../typings';\nimport { BaseCheckmark } from '../base-checkmark';\n\nimport styles from './index.module.css';\n\nexport const BaseOption: FC<OptionProps> = ({\n    className,\n    option,\n    children,\n    selected,\n    highlighted,\n    disabled,\n    multiple,\n    Checkmark = BaseCheckmark,\n    checkmarkPosition = multiple ? 'before' : 'after',\n    align = 'center',\n    innerProps,\n    dataTestId,\n    mobile = false,\n    size,\n}) => {\n    const content = children || option.content || option.key;\n    const { showCheckMark = true } = option;\n    const isTextContent = !isValidElement(content);\n    const showCheckmark = Checkmark && showCheckMark;\n\n    const renderCheckmark = (position: 'before' | 'after') =>\n        showCheckmark && (\n            <Checkmark\n                disabled={disabled}\n                selected={selected}\n                multiple={multiple}\n                align={align}\n                position={position}\n            />\n        );\n\n    return (\n        <div\n            {...innerProps}\n            className={cn(styles.option, size && styles[`size-${size}`], className, {\n                [styles.highlighted]: !mobile && highlighted,\n                [styles.selected]: selected,\n                [styles.disabled]: disabled,\n                [styles.textContent]: isTextContent,\n                [styles.mobile]: mobile,\n                [styles.checkmarkAfter]:\n                    showCheckmark && !isTextContent && checkmarkPosition === 'after',\n                [styles.checkmarkBefore]:\n                    showCheckmark && !isTextContent && checkmarkPosition === 'before',\n            })}\n            data-test-id={dataTestId}\n            aria-label={option?.value?.name}\n        >\n            {checkmarkPosition === 'before' && renderCheckmark('before')}\n\n            <div className={cn(styles.content)}>{content}</div>\n\n            {checkmarkPosition === 'after' && renderCheckmark('after')}\n        </div>\n    );\n};\n"],"names":[],"mappings":"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"}

package/esm/components/base-option/index.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;
@@ -34,11 +35,12 @@
     --select-option-active-color: var(--color-light-text-primary);
     --select-option-disabled-color: var(--color-light-text-secondary);
 }
-.select__option_1k7vx {
+.select__option_16x17 {
     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;
@@ -50,49 +52,49 @@
     cursor: pointer;
     min-height: var(--size-s-height);
 }
-.select__option_1k7vx:not(.select__disabled_1k7vx):active {
+.select__option_16x17:not(.select__disabled_16x17):active {
         background: var(--select-option-active-background);
         color: var(--select-option-active-color);
     }
-.select__option_1k7vx.select__checkmarkBefore_1k7vx {
+.select__option_16x17.select__checkmarkBefore_16x17 {
         padding: var(--gap-0) var(--gap-0) var(--gap-0) var(--gap-12);
     }
-.select__option_1k7vx.select__checkmarkBefore_1k7vx.select__mobile_1k7vx {
+.select__option_16x17.select__checkmarkBefore_16x17.select__mobile_16x17 {
             padding-left: var(--gap-16);
         }
-.select__option_1k7vx.select__checkmarkAfter_1k7vx.select__checkmarkAfter_1k7vx {
+.select__option_16x17.select__checkmarkAfter_16x17.select__checkmarkAfter_16x17 {
         padding: var(--gap-0) var(--gap-12) var(--gap-0) var(--gap-0);
     }
-.select__option_1k7vx.select__checkmarkAfter_1k7vx.select__checkmarkAfter_1k7vx.select__size-72_1k7vx {
+.select__option_16x17.select__checkmarkAfter_16x17.select__checkmarkAfter_16x17.select__size-72_16x17 {
             padding-right: var(--gap-16);
         }
-.select__option_1k7vx.select__checkmarkAfter_1k7vx.select__checkmarkAfter_1k7vx.select__mobile_1k7vx {
+.select__option_16x17.select__checkmarkAfter_16x17.select__checkmarkAfter_16x17.select__mobile_16x17 {
             padding-right: var(--gap-20);
         }
-.select__option_1k7vx.select__textContent_1k7vx {
+.select__option_16x17.select__textContent_16x17 {
         padding: var(--gap-12);
     }
-.select__option_1k7vx.select__textContent_1k7vx.select__size-72_1k7vx {
+.select__option_16x17.select__textContent_16x17.select__size-72_16x17 {
             padding-left: var(--gap-16);
             padding-right: var(--gap-16);
         }
-.select__option_1k7vx.select__textContent_1k7vx.select__mobile_1k7vx {
+.select__option_16x17.select__textContent_16x17.select__mobile_16x17 {
             padding: var(--gap-16) var(--gap-20);
         }
-.select__selected_1k7vx {
+.select__selected_16x17 {
     background: var(--select-option-selected-background);
     color: var(--select-option-selected-color);
     cursor: default;
 }
-.select__highlighted_1k7vx {
+.select__highlighted_16x17 {
     background: var(--select-option-hover-background);
     color: var(--select-option-hover-color);
 }
-.select__disabled_1k7vx {
+.select__disabled_16x17 {
     cursor: var(--disabled-cursor);
     background: var(--select-option-disabled-background);
     color: var(--select-option-disabled-color);
 }
-.select__content_1k7vx {
+.select__content_16x17 {
     flex: 1;
 }

package/esm/components/base-option/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"option":"select__option_1k7vx","disabled":"select__disabled_1k7vx","checkmarkBefore":"select__checkmarkBefore_1k7vx","mobile":"select__mobile_1k7vx","checkmarkAfter":"select__checkmarkAfter_1k7vx","size-72":"select__size-72_1k7vx","textContent":"select__textContent_1k7vx","selected":"select__selected_1k7vx","highlighted":"select__highlighted_1k7vx","content":"select__content_1k7vx"};
+var styles = {"option":"select__option_16x17","disabled":"select__disabled_16x17","checkmarkBefore":"select__checkmarkBefore_16x17","mobile":"select__mobile_16x17","checkmarkAfter":"select__checkmarkAfter_16x17","size-72":"select__size-72_16x17","textContent":"select__textContent_16x17","selected":"select__selected_16x17","highlighted":"select__highlighted_16x17","content":"select__content_16x17"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/base-select/index.css

@@ -30,25 +30,25 @@
     --select-options-list-bottom-padding: var(--gap-0);
     --select-option-background: var(--color-light-modal-bg-primary);
 }
-.select__component_l1bbh {
+.select__component_1wn05 {
     width: -moz-max-content;
     width: max-content;
     position: relative;
     outline: 0;
     max-width: 100%;
 }
-.select__popoverInner_l1bbh {
+.select__popoverInner_1wn05 {
     padding-top: var(--select-options-list-offset);
     padding-bottom: var(--select-options-list-offset);
     background: transparent;
     border-radius: var(--border-radius-0);
     position: relative;
 }
-.select__popoverInner_l1bbh.select__popoverInner_l1bbh {
+.select__popoverInner_1wn05.select__popoverInner_1wn05 {
     box-shadow: none;
     border: none;
 }
-.select__optionsListWrapper_l1bbh {
+.select__optionsListWrapper_1wn05 {
     position: relative;
     padding-top: var(--select-options-list-top-padding);
     padding-bottom: var(--select-options-list-bottom-padding);
@@ -58,7 +58,7 @@
     overflow: hidden;
     will-change: transform;
 }
-.select__optionsListBorder_l1bbh {
+.select__optionsListBorder_1wn05 {
     position: absolute;
     top: var(--gap-0);
     right: var(--gap-0);
@@ -68,7 +68,7 @@
     border-radius: inherit;
     pointer-events: none;
 }
-.select__nativeSelect_l1bbh {
+.select__nativeSelect_1wn05 {
     opacity: 0;
     overflow: hidden;
     position: absolute;
@@ -82,19 +82,19 @@
     cursor: pointer;
     z-index: 1;
 }
-.select__block_l1bbh {
+.select__block_1wn05 {
     width: 100%;
 }
-.select__emptySearchPlaceholder_l1bbh {
+.select__emptySearchPlaceholder_1wn05 {
     text-align: center;
 }
-.select__search_l1bbh {
+.select__search_1wn05 {
     margin: var(--gap-12) var(--gap-12) var(--gap-0);
 }
-.select__search_l1bbh.select__size-72_l1bbh {
+.select__search_1wn05.select__size-72_1wn05 {
         margin-left: var(--gap-16);
         margin-right: var(--gap-16);
     }
-.select__search_l1bbh:last-child {
+.select__search_1wn05:last-child {
         margin-bottom: var(--gap-12);
     }

package/esm/components/base-select/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"component":"select__component_l1bbh","popoverInner":"select__popoverInner_l1bbh","optionsListWrapper":"select__optionsListWrapper_l1bbh","optionsListBorder":"select__optionsListBorder_l1bbh","nativeSelect":"select__nativeSelect_l1bbh","block":"select__block_l1bbh","emptySearchPlaceholder":"select__emptySearchPlaceholder_l1bbh","search":"select__search_l1bbh","size-72":"select__size-72_l1bbh"};
+var styles = {"component":"select__component_1wn05","popoverInner":"select__popoverInner_1wn05","optionsListWrapper":"select__optionsListWrapper_1wn05","optionsListBorder":"select__optionsListBorder_1wn05","nativeSelect":"select__nativeSelect_1wn05","block":"select__block_1wn05","emptySearchPlaceholder":"select__emptySearchPlaceholder_1wn05","search":"select__search_1wn05","size-72":"select__size-72_1wn05"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map