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

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\n    const isTextContent = !isValidElement(content);\n\n    const renderCheckmark = () => {\n        if (Checkmark && showCheckMark) {\n            return (\n                <Checkmark\n                    className={cn({\n                        [styles.checkmarkBeforeContent]: checkmarkPosition === 'before',\n                        [styles.checkmarkAfterContent]: checkmarkPosition === 'after',\n                    })}\n                    disabled={disabled}\n                    selected={selected}\n                    multiple={multiple}\n                    align={align}\n                />\n            );\n        }\n\n        return null;\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]: !isTextContent && checkmarkPosition === 'after',\n                [styles.checkmarkBefore]: !isTextContent && checkmarkPosition === 'before',\n            })}\n            data-test-id={dataTestId}\n            aria-label={option?.value?.name}\n        >\n            {checkmarkPosition === 'before' && renderCheckmark()}\n\n            <div className={cn(styles.content)}>{content}</div>\n\n            {checkmarkPosition === 'after' && renderCheckmark()}\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    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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"}

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_4yj2g {
+.select__option_fdniw {
     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,55 +52,49 @@
     cursor: pointer;
     min-height: var(--size-s-height);
 }
-.select__option_4yj2g:not(.select__disabled_4yj2g):active {
+.select__option_fdniw:not(.select__disabled_fdniw):active {
         background: var(--select-option-active-background);
         color: var(--select-option-active-color);
     }
-.select__option_4yj2g.select__checkmarkBefore_4yj2g {
+.select__option_fdniw.select__checkmarkBefore_fdniw {
         padding: var(--gap-0) var(--gap-0) var(--gap-0) var(--gap-12);
     }
-.select__option_4yj2g.select__checkmarkBefore_4yj2g.select__mobile_4yj2g {
+.select__option_fdniw.select__checkmarkBefore_fdniw.select__mobile_fdniw {
             padding-left: var(--gap-16);
         }
-.select__option_4yj2g.select__checkmarkAfter_4yj2g.select__checkmarkAfter_4yj2g {
+.select__option_fdniw.select__checkmarkAfter_fdniw.select__checkmarkAfter_fdniw {
         padding: var(--gap-0) var(--gap-12) var(--gap-0) var(--gap-0);
     }
-.select__option_4yj2g.select__checkmarkAfter_4yj2g.select__checkmarkAfter_4yj2g.select__size-72_4yj2g {
+.select__option_fdniw.select__checkmarkAfter_fdniw.select__checkmarkAfter_fdniw.select__size-72_fdniw {
             padding-right: var(--gap-16);
         }
-.select__option_4yj2g.select__checkmarkAfter_4yj2g.select__checkmarkAfter_4yj2g.select__mobile_4yj2g {
+.select__option_fdniw.select__checkmarkAfter_fdniw.select__checkmarkAfter_fdniw.select__mobile_fdniw {
             padding-right: var(--gap-20);
         }
-.select__option_4yj2g.select__textContent_4yj2g {
+.select__option_fdniw.select__textContent_fdniw {
         padding: var(--gap-12);
     }
-.select__option_4yj2g.select__textContent_4yj2g.select__size-72_4yj2g {
+.select__option_fdniw.select__textContent_fdniw.select__size-72_fdniw {
             padding-left: var(--gap-16);
             padding-right: var(--gap-16);
         }
-.select__option_4yj2g.select__textContent_4yj2g.select__mobile_4yj2g {
+.select__option_fdniw.select__textContent_fdniw.select__mobile_fdniw {
             padding: var(--gap-16) var(--gap-20) var(--gap-16) var(--gap-16);
         }
-.select__selected_4yj2g {
+.select__selected_fdniw {
     background: var(--select-option-selected-background);
     color: var(--select-option-selected-color);
     cursor: default;
 }
-.select__highlighted_4yj2g {
+.select__highlighted_fdniw {
     background: var(--select-option-hover-background);
     color: var(--select-option-hover-color);
 }
-.select__disabled_4yj2g {
+.select__disabled_fdniw {
     cursor: var(--disabled-cursor);
     background: var(--select-option-disabled-background);
     color: var(--select-option-disabled-color);
 }
-.select__checkmarkBeforeContent_4yj2g {
-    margin-right: var(--gap-12);
-}
-.select__checkmarkAfterContent_4yj2g {
-    margin-left: var(--gap-12);
-}
-.select__content_4yj2g {
+.select__content_fdniw {
     flex: 1;
 }

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

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"option":"select__option_4yj2g","disabled":"select__disabled_4yj2g","checkmarkBefore":"select__checkmarkBefore_4yj2g","mobile":"select__mobile_4yj2g","checkmarkAfter":"select__checkmarkAfter_4yj2g","size-72":"select__size-72_4yj2g","textContent":"select__textContent_4yj2g","selected":"select__selected_4yj2g","highlighted":"select__highlighted_4yj2g","checkmarkBeforeContent":"select__checkmarkBeforeContent_4yj2g","checkmarkAfterContent":"select__checkmarkAfterContent_4yj2g","content":"select__content_4yj2g"};
+var styles = {"option":"select__option_fdniw","disabled":"select__disabled_fdniw","checkmarkBefore":"select__checkmarkBefore_fdniw","mobile":"select__mobile_fdniw","checkmarkAfter":"select__checkmarkAfter_fdniw","size-72":"select__size-72_fdniw","textContent":"select__textContent_fdniw","selected":"select__selected_fdniw","highlighted":"select__highlighted_fdniw","content":"select__content_fdniw"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["../../src/components/base-option/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../../vars.css';\n\n.option {\n    @mixin paragraph_component;\n\n    display: flex;\n    align-items: center;\n    transition: background-color 0.2s ease;\n    background: var(--select-option-background);\n    color: var(--select-option-color);\n    box-sizing: border-box;\n    position: relative;\n    cursor: pointer;\n    min-height: var(--size-s-height);\n\n    &:not(.disabled):active {\n        background: var(--select-option-active-background);\n        color: var(--select-option-active-color);\n    }\n\n    &.checkmarkBefore {\n        padding: var(--gap-0) var(--gap-0) var(--gap-0) var(--gap-12);\n\n        &.mobile {\n            padding-left: var(--gap-16);\n        }\n    }\n\n    &.checkmarkAfter.checkmarkAfter {\n        padding: var(--gap-0) var(--gap-12) var(--gap-0) var(--gap-0);\n\n        &.size-72 {\n            padding-right: var(--gap-16);\n        }\n\n        &.mobile {\n            padding-right: var(--gap-20);\n        }\n    }\n\n    &.textContent {\n        padding: var(--gap-12);\n\n        &.size-72 {\n            padding-left: var(--gap-16);\n            padding-right: var(--gap-16);\n        }\n\n        &.mobile {\n            padding: var(--gap-16) var(--gap-20) var(--gap-16) var(--gap-16);\n        }\n    }\n}\n\n.selected {\n    background: var(--select-option-selected-background);\n    color: var(--select-option-selected-color);\n    cursor: default;\n}\n\n.highlighted {\n    background: var(--select-option-hover-background);\n    color: var(--select-option-hover-color);\n}\n\n.disabled {\n    cursor: var(--disabled-cursor);\n    background: var(--select-option-disabled-background);\n    color: var(--select-option-disabled-color);\n}\n\n.checkmarkBeforeContent {\n    margin-right: var(--gap-12);\n}\n\n.checkmarkAfterContent {\n    margin-left: var(--gap-12);\n}\n\n.content {\n    flex: 1;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,QAAQ,CAAC,sBAAsB,CAAC,UAAU,CAAC,wBAAwB,CAAC,iBAAiB,CAAC,+BAA+B,CAAC,QAAQ,CAAC,sBAAsB,CAAC,gBAAgB,CAAC,8BAA8B,CAAC,SAAS,CAAC,uBAAuB,CAAC,aAAa,CAAC,2BAA2B,CAAC,UAAU,CAAC,wBAAwB,CAAC,aAAa,CAAC,2BAA2B,CAAC,wBAAwB,CAAC,sCAAsC,CAAC,uBAAuB,CAAC,qCAAqC,CAAC,SAAS,CAAC,uBAAuB,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/base-option/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../../vars.css';\n\n.option {\n    @mixin paragraph_component;\n\n    display: flex;\n    align-items: center;\n    transition: background-color 0.2s ease;\n    background: var(--select-option-background);\n    color: var(--select-option-color);\n    box-sizing: border-box;\n    position: relative;\n    cursor: pointer;\n    min-height: var(--size-s-height);\n\n    &:not(.disabled):active {\n        background: var(--select-option-active-background);\n        color: var(--select-option-active-color);\n    }\n\n    &.checkmarkBefore {\n        padding: var(--gap-0) var(--gap-0) var(--gap-0) var(--gap-12);\n\n        &.mobile {\n            padding-left: var(--gap-16);\n        }\n    }\n\n    &.checkmarkAfter.checkmarkAfter {\n        padding: var(--gap-0) var(--gap-12) var(--gap-0) var(--gap-0);\n\n        &.size-72 {\n            padding-right: var(--gap-16);\n        }\n\n        &.mobile {\n            padding-right: var(--gap-20);\n        }\n    }\n\n    &.textContent {\n        padding: var(--gap-12);\n\n        &.size-72 {\n            padding-left: var(--gap-16);\n            padding-right: var(--gap-16);\n        }\n\n        &.mobile {\n            padding: var(--gap-16) var(--gap-20) var(--gap-16) var(--gap-16);\n        }\n    }\n}\n\n.selected {\n    background: var(--select-option-selected-background);\n    color: var(--select-option-selected-color);\n    cursor: default;\n}\n\n.highlighted {\n    background: var(--select-option-hover-background);\n    color: var(--select-option-hover-color);\n}\n\n.disabled {\n    cursor: var(--disabled-cursor);\n    background: var(--select-option-disabled-background);\n    color: var(--select-option-disabled-color);\n}\n\n.content {\n    flex: 1;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,QAAQ,CAAC,sBAAsB,CAAC,UAAU,CAAC,wBAAwB,CAAC,iBAAiB,CAAC,+BAA+B,CAAC,QAAQ,CAAC,sBAAsB,CAAC,gBAAgB,CAAC,8BAA8B,CAAC,SAAS,CAAC,uBAAuB,CAAC,aAAa,CAAC,2BAA2B,CAAC,UAAU,CAAC,wBAAwB,CAAC,aAAa,CAAC,2BAA2B,CAAC,SAAS,CAAC,uBAAuB,CAAC;;;;"}

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_1k6ms {
+.select__component_p59ri {
     width: -moz-max-content;
     width: max-content;
     position: relative;
     outline: 0;
     max-width: 100%;
 }
-.select__popoverInner_1k6ms {
+.select__popoverInner_p59ri {
     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_1k6ms.select__popoverInner_1k6ms {
+.select__popoverInner_p59ri.select__popoverInner_p59ri {
     box-shadow: none;
     border: none;
 }
-.select__optionsListWrapper_1k6ms {
+.select__optionsListWrapper_p59ri {
     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_1k6ms {
+.select__optionsListBorder_p59ri {
     position: absolute;
     top: var(--gap-0);
     right: var(--gap-0);
@@ -68,7 +68,7 @@
     border-radius: inherit;
     pointer-events: none;
 }
-.select__nativeSelect_1k6ms {
+.select__nativeSelect_p59ri {
     opacity: 0;
     overflow: hidden;
     position: absolute;
@@ -82,19 +82,19 @@
     cursor: pointer;
     z-index: 1;
 }
-.select__block_1k6ms {
+.select__block_p59ri {
     width: 100%;
 }
-.select__emptySearchPlaceholder_1k6ms {
+.select__emptySearchPlaceholder_p59ri {
     text-align: center;
 }
-.select__search_1k6ms {
+.select__search_p59ri {
     margin: var(--gap-12) var(--gap-12) var(--gap-0);
 }
-.select__search_1k6ms.select__size-72_1k6ms {
+.select__search_p59ri.select__size-72_p59ri {
         margin-left: var(--gap-16);
         margin-right: var(--gap-16);
     }
-.select__search_1k6ms:last-child {
+.select__search_p59ri: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_1k6ms","popoverInner":"select__popoverInner_1k6ms","optionsListWrapper":"select__optionsListWrapper_1k6ms","optionsListBorder":"select__optionsListBorder_1k6ms","nativeSelect":"select__nativeSelect_1k6ms","block":"select__block_1k6ms","emptySearchPlaceholder":"select__emptySearchPlaceholder_1k6ms","search":"select__search_1k6ms","size-72":"select__size-72_1k6ms"};
+var styles = {"component":"select__component_p59ri","popoverInner":"select__popoverInner_p59ri","optionsListWrapper":"select__optionsListWrapper_p59ri","optionsListBorder":"select__optionsListBorder_p59ri","nativeSelect":"select__nativeSelect_p59ri","block":"select__block_p59ri","emptySearchPlaceholder":"select__emptySearchPlaceholder_p59ri","search":"select__search_p59ri","size-72":"select__size-72_p59ri"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

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

@@ -9,40 +9,40 @@
     --gap-16: var(--gap-m);
     --gap-20: var(--gap-l);
 }
-.select__sheet_1mnwo {
+.select__sheet_1buiw {
     overflow: hidden;
 }
-.select__sheetContent_1mnwo.select__sheetContent_1mnwo {
+.select__sheetContent_1buiw.select__sheetContent_1buiw {
     padding: var(--gap-0);
 }
-.select__sheetContent_1mnwo.select__sheetContent_1mnwo .select__modalContent_1mnwo {
+.select__sheetContent_1buiw.select__sheetContent_1buiw .select__modalContent_1buiw {
         padding: var(--gap-0);
         display: flex;
         flex-direction: column;
     }
-.select__sheetContainer_1mnwo {
+.select__sheetContainer_1buiw {
     padding: var(--gap-0);
 }
-.select__optionsListWrapper_1mnwo {
+.select__optionsListWrapper_1buiw {
     flex: 1;
 }
-.select__optionsList_1mnwo.select__optionsList_1mnwo {
+.select__optionsList_1buiw.select__optionsList_1buiw {
     height: 100%;
     display: flex;
     flex-direction: column;
 }
-.select__scrollbar_1mnwo {
+.select__scrollbar_1buiw {
     flex: 1;
 }
-.select__search_1mnwo {
+.select__search_1buiw {
     padding: var(--gap-8);
 }
-.select__option_1mnwo.select__option_1mnwo {
+.select__option_1buiw.select__option_1buiw {
     padding: var(--gap-4) var(--gap-20) var(--gap-4) var(--gap-16);
 }
-.select__option_1mnwo.select__option_1mnwo:before {
+.select__option_1buiw.select__option_1buiw:before {
         display: none;
     }
-.select__optionGroup_1mnwo.select__optionGroup_1mnwo {
+.select__optionGroup_1buiw.select__optionGroup_1buiw {
     padding: var(--gap-16) var(--gap-16) var(--gap-8);
 }

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

@@ -1,6 +1,6 @@
 import './mobile.css';
 
-var mobileStyles = {"sheet":"select__sheet_1mnwo","sheetContent":"select__sheetContent_1mnwo","modalContent":"select__modalContent_1mnwo","sheetContainer":"select__sheetContainer_1mnwo","optionsListWrapper":"select__optionsListWrapper_1mnwo","optionsList":"select__optionsList_1mnwo","scrollbar":"select__scrollbar_1mnwo","search":"select__search_1mnwo","option":"select__option_1mnwo","optionGroup":"select__optionGroup_1mnwo"};
+var mobileStyles = {"sheet":"select__sheet_1buiw","sheetContent":"select__sheetContent_1buiw","modalContent":"select__modalContent_1buiw","sheetContainer":"select__sheetContainer_1buiw","optionsListWrapper":"select__optionsListWrapper_1buiw","optionsList":"select__optionsList_1buiw","scrollbar":"select__scrollbar_1buiw","search":"select__search_1buiw","option":"select__option_1buiw","optionGroup":"select__optionGroup_1buiw"};
 
 export { mobileStyles as default };
 //# sourceMappingURL=mobile.module.css.js.map

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import { type CheckmarkProps } from '../../typings';
-export declare const Checkmark: ({ selected, disabled, className, multiple, position, }: CheckmarkProps) => React.JSX.Element;
+export declare const Checkmark: ({ selected, disabled, className, multiple, position, content, }: CheckmarkProps) => React.JSX.Element;

package/esm/components/checkmark/Component.js

@@ -1,14 +1,12 @@
 import React, { useCallback } from 'react';
 import cn from 'classnames';
-import { Badge } from '@alfalab/core-components-badge/esm';
 import { Checkbox } from '@alfalab/core-components-checkbox/esm';
-import { CheckmarkCircleMIcon } from '@alfalab/icons-glyph/CheckmarkCircleMIcon';
 import CheckmarkMIcon from '@alfalab/icons-glyph/CheckmarkMIcon';
 import styles from './index.module.css.js';
 
 var Checkmark = function (_a) {
     var _b;
-    var selected = _a.selected, _c = _a.disabled, disabled = _c === void 0 ? false : _c, className = _a.className, multiple = _a.multiple, _d = _a.position, position = _d === void 0 ? 'before' : _d;
+    var selected = _a.selected, _c = _a.disabled, disabled = _c === void 0 ? false : _c, className = _a.className, multiple = _a.multiple, _d = _a.position, position = _d === void 0 ? 'before' : _d, content = _a.content;
     var single = !multiple;
     var checkmarkClassNames = cn(styles.checkmark, className, styles[position], (_b = {},
         _b[styles.multiple] = !single,
@@ -16,7 +14,8 @@ var Checkmark = function (_a) {
         _b[styles.selected] = selected,
         _b));
     var handleCheckboxClick = useCallback(function (event) { return event.stopPropagation(); }, []);
-    return single ? (React.createElement("div", { className: checkmarkClassNames }, position === 'before' ? (React.createElement(Badge, { className: styles.after, view: 'icon', size: 'm', iconColor: 'positive', content: React.createElement(CheckmarkCircleMIcon, { className: styles.colorIcon }) })) : (React.createElement(CheckmarkMIcon, { className: cn(styles.displayIcon) })))) : (React.createElement(Checkbox, { checked: selected, disabled: disabled, className: checkmarkClassNames, size: 24, onClick: handleCheckboxClick }));
+    return single ? (React.createElement("div", { className: checkmarkClassNames },
+        React.createElement(CheckmarkMIcon, { className: cn(styles.displayIcon) }))) : (React.createElement(Checkbox, { checked: selected, disabled: disabled, className: checkmarkClassNames, size: 24, label: content, onClick: handleCheckboxClick }));
 };
 
 export { Checkmark };

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

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../../../src/components/checkmark/Component.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\nimport cn from 'classnames';\n\nimport { Badge } from '@alfalab/core-components-badge';\nimport { Checkbox, type CheckboxProps } from '@alfalab/core-components-checkbox';\nimport { CheckmarkCircleMIcon } from '@alfalab/icons-glyph/CheckmarkCircleMIcon';\nimport CheckmarkMIcon from '@alfalab/icons-glyph/CheckmarkMIcon';\n\nimport { type CheckmarkProps } from '../../typings';\n\nimport styles from './index.module.css';\n\nexport const Checkmark = ({\n    selected,\n    disabled = false,\n    className,\n    multiple,\n    position = 'before',\n}: CheckmarkProps) => {\n    const single = !multiple;\n\n    const checkmarkClassNames = cn(styles.checkmark, className, styles[position], {\n        [styles.multiple]: !single,\n        [styles.single]: single,\n        [styles.selected]: selected,\n    });\n\n    const handleCheckboxClick = useCallback<Required<CheckboxProps>['onClick']>(\n        (event) => event.stopPropagation(),\n        [],\n    );\n\n    return single ? (\n        <div className={checkmarkClassNames}>\n            {position === 'before' ? (\n                <Badge\n                    className={styles.after}\n                    view='icon'\n                    size='m'\n                    iconColor='positive'\n                    content={<CheckmarkCircleMIcon className={styles.colorIcon} />}\n                />\n            ) : (\n                <CheckmarkMIcon className={cn(styles.displayIcon)} />\n            )}\n        </div>\n    ) : (\n        <Checkbox\n            checked={selected}\n            disabled={disabled}\n            className={checkmarkClassNames}\n            size={24}\n            onClick={handleCheckboxClick}\n        />\n    );\n};\n"],"names":[],"mappings":";;;;;;;;AAYO,IAAM,SAAS,GAAG,UAAC,EAMT,EAAA;;QALb,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,EAAgB,GAAA,EAAA,CAAA,QAAA,EAAhB,QAAQ,GAAG,EAAA,KAAA,MAAA,GAAA,KAAK,KAAA,EAChB,SAAS,eAAA,EACT,QAAQ,cAAA,EACR,EAAA,GAAA,EAAA,CAAA,QAAmB,EAAnB,QAAQ,GAAA,EAAA,KAAA,MAAA,GAAG,QAAQ,GAAA,EAAA;AAEnB,IAAA,IAAM,MAAM,GAAG,CAAC,QAAQ;AAExB,IAAA,IAAM,mBAAmB,GAAG,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,EAAE,MAAM,CAAC,QAAQ,CAAC,GAAA,EAAA,GAAA,EAAA;AACxE,QAAA,EAAA,CAAC,MAAM,CAAC,QAAQ,CAAA,GAAG,CAAC,MAAM;AAC1B,QAAA,EAAA,CAAC,MAAM,CAAC,MAAM,CAAA,GAAG,MAAM;AACvB,QAAA,EAAA,CAAC,MAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;YAC7B;AAEF,IAAA,IAAM,mBAAmB,GAAG,WAAW,CACnC,UAAC,KAAK,EAAK,EAAA,OAAA,KAAK,CAAC,eAAe,EAAE,CAAA,EAAA,EAClC,EAAE,CACL;IAED,OAAO,MAAM,IACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,mBAAmB,EAAA,EAC9B,QAAQ,KAAK,QAAQ,IAClB,KAAC,CAAA,aAAA,CAAA,KAAK,EACF,EAAA,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,GAAG,EACR,SAAS,EAAC,UAAU,EACpB,OAAO,EAAE,KAAC,CAAA,aAAA,CAAA,oBAAoB,IAAC,SAAS,EAAE,MAAM,CAAC,SAAS,EAAA,CAAI,GAChE,KAEF,oBAAC,cAAc,EAAA,EAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,CAAC,EAAA,CAAI,CACxD,CACC,KAEN,oBAAC,QAAQ,EAAA,EACL,OAAO,EAAE,QAAQ,EACjB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,mBAAmB,EAC9B,IAAI,EAAE,EAAE,EACR,OAAO,EAAE,mBAAmB,EAC9B,CAAA,CACL;AACL;;;;"}
+{"version":3,"file":"Component.js","sources":["../../../src/components/checkmark/Component.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\nimport cn from 'classnames';\n\nimport { Checkbox, type CheckboxProps } 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 Checkmark = ({\n    selected,\n    disabled = false,\n    className,\n    multiple,\n    position = 'before',\n    content,\n}: CheckmarkProps) => {\n    const single = !multiple;\n\n    const checkmarkClassNames = cn(styles.checkmark, className, styles[position], {\n        [styles.multiple]: !single,\n        [styles.single]: single,\n        [styles.selected]: selected,\n    });\n\n    const handleCheckboxClick = useCallback<Required<CheckboxProps>['onClick']>(\n        (event) => event.stopPropagation(),\n        [],\n    );\n\n    return single ? (\n        <div className={checkmarkClassNames}>\n            <CheckmarkMIcon className={cn(styles.displayIcon)} />\n        </div>\n    ) : (\n        <Checkbox\n            checked={selected}\n            disabled={disabled}\n            className={checkmarkClassNames}\n            size={24}\n            label={content}\n            onClick={handleCheckboxClick}\n        />\n    );\n};\n"],"names":[],"mappings":";;;;;;AAUO,IAAM,SAAS,GAAG,UAAC,EAOT,EAAA;;QANb,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,EAAgB,GAAA,EAAA,CAAA,QAAA,EAAhB,QAAQ,GAAG,EAAA,KAAA,MAAA,GAAA,KAAK,GAAA,EAAA,EAChB,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,EAAA,GAAA,EAAA,CAAA,QAAmB,EAAnB,QAAQ,mBAAG,QAAQ,GAAA,EAAA,EACnB,OAAO,GAAA,EAAA,CAAA,OAAA;AAEP,IAAA,IAAM,MAAM,GAAG,CAAC,QAAQ;AAExB,IAAA,IAAM,mBAAmB,GAAG,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,EAAE,MAAM,CAAC,QAAQ,CAAC,GAAA,EAAA,GAAA,EAAA;AACxE,QAAA,EAAA,CAAC,MAAM,CAAC,QAAQ,CAAA,GAAG,CAAC,MAAM;AAC1B,QAAA,EAAA,CAAC,MAAM,CAAC,MAAM,CAAA,GAAG,MAAM;AACvB,QAAA,EAAA,CAAC,MAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;YAC7B;AAEF,IAAA,IAAM,mBAAmB,GAAG,WAAW,CACnC,UAAC,KAAK,EAAK,EAAA,OAAA,KAAK,CAAC,eAAe,EAAE,CAAA,EAAA,EAClC,EAAE,CACL;IAED,OAAO,MAAM,IACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,mBAAmB,EAAA;QAC/B,KAAC,CAAA,aAAA,CAAA,cAAc,IAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,CAAC,GAAI,CACnD,KAEN,KAAC,CAAA,aAAA,CAAA,QAAQ,IACL,OAAO,EAAE,QAAQ,EACjB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,mBAAmB,EAC9B,IAAI,EAAE,EAAE,EACR,KAAK,EAAE,OAAO,EACd,OAAO,EAAE,mBAAmB,EAC9B,CAAA,CACL;AACL;;;;"}

package/esm/components/checkmark/index.css

@@ -1,64 +1,56 @@
 :root {
-    --color-light-neutral-translucent-1300: rgba(3, 3, 6, 0.88);
     --color-light-status-positive: #0cc44d;
 }
 :root {
-    --border-radius-circle: 50%;
-}
-:root {
-    --gap-xs: 8px;
     --gap-s: 12px;
-    --gap-0: 0px;
-    --gap-8: var(--gap-xs);
     --gap-12: var(--gap-s);
 }
 :root {
-
-    --select-checkmark-margin: var(--gap-0) var(--gap-8) var(--gap-0) var(--gap-0);
-    --select-checkmark-margin-after: var(--select-checkmark-margin);
-    --select-checkmark-size: 4px;
-    --select-checkmark-before-display: 'flex';
+    --select-checkmark-size: 24px;
+    --select-checkmark-before-display: flex;
     --select-checkmark-after-display: none;
     --select-checkmark-before-display-multiple: block;
-    --select-checkmark-after-display-single: none;
+    --select-checkmark-after-display-single: flex;
     --select-checkmark-unselected-opacity: 0;
-    --select-checkmark-background: var(--color-light-neutral-translucent-1300);
-    --select-checkmark-border-radius: var(--border-radius-circle);
 }
-.select__checkmark_9wypm {
+.select__checkmark_1195e {
     flex-shrink: 0;
-    margin: var(--select-checkmark-margin);
 }
-.select__checkmark_9wypm.select__after_9wypm {
-        margin: var(--select-checkmark-margin-after);
+.select__checkmark_1195e.select__before_1195e {
+        display: var(--select-checkmark-before-display);
+    }
+.select__checkmark_1195e.select__after_1195e {
+        display: var(--select-checkmark-after-display);
     }
-.select__single_9wypm {
+.select__single_1195e {
     display: flex;
     align-items: center;
     justify-content: center;
     opacity: var(--select-checkmark-unselected-opacity);
-    background: var(--select-checkmark-background);
-    background-size: cover;
-    border-radius: var(--select-checkmark-border-radius);
     width: var(--select-checkmark-size);
     height: var(--select-checkmark-size);
 }
-.select__single_9wypm.select__selected_9wypm {
+.select__single_1195e.select__selected_1195e {
         opacity: 1;
     }
-.select__before_9wypm {
-    display: var(--select-checkmark-before-display);
-}
-.select__before_9wypm.select__multiple_9wypm {
+.select__multiple_1195e.select__before_1195e {
         margin-right: var(--gap-12);
         display: var(--select-checkmark-before-display-multiple);
     }
-.select__after_9wypm.select__after_9wypm {
+.select__multiple_1195e.select__after_1195e {
+        margin-left: var(--gap-12);
+    }
+.select__after_1195e.select__after_1195e {
     display: var(--select-checkmark-after-display);
 }
-.select__after_9wypm.select__after_9wypm.select__single_9wypm {
+.select__after_1195e.select__after_1195e.select__single_1195e {
         display: var(--select-checkmark-after-display-single);
     }
-.select__colorIcon_9wypm {
+.select__colorIcon_1195e {
     color: var(--color-light-status-positive);
 }
+.select__displayIcon_1195e {
+    display: block;
+    width: 100%;
+    height: 100%;
+}

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

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"checkmark":"select__checkmark_9wypm","after":"select__after_9wypm","single":"select__single_9wypm","selected":"select__selected_9wypm","before":"select__before_9wypm","multiple":"select__multiple_9wypm","colorIcon":"select__colorIcon_9wypm"};
+var styles = {"checkmark":"select__checkmark_1195e","before":"select__before_1195e","after":"select__after_1195e","single":"select__single_1195e","selected":"select__selected_1195e","multiple":"select__multiple_1195e","colorIcon":"select__colorIcon_1195e","displayIcon":"select__displayIcon_1195e"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["../../src/components/checkmark/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../../vars.css';\n\n.checkmark {\n    flex-shrink: 0;\n    margin: var(--select-checkmark-margin);\n\n    &.after {\n        margin: var(--select-checkmark-margin-after);\n    }\n}\n\n.single {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    opacity: var(--select-checkmark-unselected-opacity);\n    background: var(--select-checkmark-background);\n    background-size: cover;\n    border-radius: var(--select-checkmark-border-radius);\n    width: var(--select-checkmark-size);\n    height: var(--select-checkmark-size);\n\n    &.selected {\n        opacity: 1;\n    }\n}\n\n.before {\n    display: var(--select-checkmark-before-display);\n\n    &.multiple {\n        margin-right: var(--gap-12);\n        display: var(--select-checkmark-before-display-multiple);\n    }\n}\n\n.after.after {\n    display: var(--select-checkmark-after-display);\n\n    &.single {\n        display: var(--select-checkmark-after-display-single);\n    }\n}\n\n.colorIcon {\n    color: var(--color-light-status-positive);\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,yBAAyB,CAAC,OAAO,CAAC,qBAAqB,CAAC,QAAQ,CAAC,sBAAsB,CAAC,UAAU,CAAC,wBAAwB,CAAC,QAAQ,CAAC,sBAAsB,CAAC,UAAU,CAAC,wBAAwB,CAAC,WAAW,CAAC,yBAAyB,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/checkmark/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../../vars.css';\n\n.checkmark {\n    flex-shrink: 0;\n\n    &.before {\n        display: var(--select-checkmark-before-display);\n    }\n\n    &.after {\n        display: var(--select-checkmark-after-display);\n    }\n}\n\n.single {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    opacity: var(--select-checkmark-unselected-opacity);\n    width: var(--select-checkmark-size);\n    height: var(--select-checkmark-size);\n\n    &.selected {\n        opacity: 1;\n    }\n}\n\n.multiple {\n    &.before {\n        margin-right: var(--gap-12);\n        display: var(--select-checkmark-before-display-multiple);\n    }\n\n    &.after {\n        margin-left: var(--gap-12);\n    }\n}\n\n.after.after {\n    display: var(--select-checkmark-after-display);\n\n    &.single {\n        display: var(--select-checkmark-after-display-single);\n    }\n}\n\n.colorIcon {\n    color: var(--color-light-status-positive);\n}\n\n.displayIcon {\n    display: block;\n    width: 100%;\n    height: 100%;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,yBAAyB,CAAC,QAAQ,CAAC,sBAAsB,CAAC,OAAO,CAAC,qBAAqB,CAAC,QAAQ,CAAC,sBAAsB,CAAC,UAAU,CAAC,wBAAwB,CAAC,UAAU,CAAC,wBAAwB,CAAC,WAAW,CAAC,yBAAyB,CAAC,aAAa,CAAC,2BAA2B,CAAC;;;;"}

package/esm/components/checkmark-mobile/Component.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import { type CheckmarkProps } from '../../typings';
-export declare const Checkmark: ({ selected, className }: CheckmarkProps) => React.JSX.Element;
+export declare const Checkmark: ({ selected, className, position }: CheckmarkProps) => React.JSX.Element;

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

@@ -5,8 +5,8 @@ import styles from './index.module.css.js';
 
 var Checkmark = function (_a) {
     var _b;
-    var selected = _a.selected, className = _a.className;
-    return (React.createElement("div", { className: cn(styles.checkmark, className, (_b = {},
+    var selected = _a.selected, className = _a.className, _c = _a.position, position = _c === void 0 ? 'after' : _c;
+    return (React.createElement("div", { className: cn(styles.checkmark, className, styles[position], (_b = {},
             _b[styles.selected] = selected,
             _b)) },
         React.createElement(CheckmarkMIcon, { className: styles.displayIcon })));

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

@@ -1 +1 @@
-{"version":3,"file":"Component.js","sources":["../../../src/components/checkmark-mobile/Component.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport { CheckmarkMIcon } from '@alfalab/icons-glyph/CheckmarkMIcon';\n\nimport { type CheckmarkProps } from '../../typings';\n\nimport styles from './index.module.css';\n\nexport const Checkmark = ({ selected, className }: CheckmarkProps) => (\n    <div\n        className={cn(styles.checkmark, className, {\n            [styles.selected]: selected,\n        })}\n    >\n        <CheckmarkMIcon className={styles.displayIcon} />\n    </div>\n);\n"],"names":[],"mappings":";;;;;AASO,IAAM,SAAS,GAAG,UAAC,EAAuC,EAAA;;QAArC,QAAQ,GAAA,EAAA,CAAA,QAAA,EAAE,SAAS,GAAA,EAAA,CAAA,SAAA;IAAuB,QAClE,KACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,GAAA,EAAA,GAAA,EAAA;AACrC,YAAA,EAAA,CAAC,MAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;AAC7B,YAAA,EAAA,EAAA,EAAA;QAEF,KAAC,CAAA,aAAA,CAAA,cAAc,IAAC,SAAS,EAAE,MAAM,CAAC,WAAW,EAAI,CAAA,CAC/C;AAP4D;;;;"}
+{"version":3,"file":"Component.js","sources":["../../../src/components/checkmark-mobile/Component.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport { CheckmarkMIcon } from '@alfalab/icons-glyph/CheckmarkMIcon';\n\nimport { type CheckmarkProps } from '../../typings';\n\nimport styles from './index.module.css';\n\nexport const Checkmark = ({ selected, className, position = 'after' }: CheckmarkProps) => (\n    <div\n        className={cn(styles.checkmark, className, styles[position], {\n            [styles.selected]: selected,\n        })}\n    >\n        <CheckmarkMIcon className={styles.displayIcon} />\n    </div>\n);\n"],"names":[],"mappings":";;;;;AASO,IAAM,SAAS,GAAG,UAAC,EAA2D,EAAA;;QAAzD,QAAQ,GAAA,EAAA,CAAA,QAAA,EAAE,SAAS,GAAA,EAAA,CAAA,SAAA,EAAE,gBAAkB,EAAlB,QAAQ,GAAG,EAAA,KAAA,MAAA,GAAA,OAAO,GAAA,EAAA;AAAuB,IAAA,QACtF,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,EAAE,MAAM,CAAC,QAAQ,CAAC,GAAA,EAAA,GAAA,EAAA;AACvD,YAAA,EAAA,CAAC,MAAM,CAAC,QAAQ,CAAA,GAAG,QAAQ;AAC7B,YAAA,EAAA,EAAA,EAAA;QAEF,KAAC,CAAA,aAAA,CAAA,cAAc,IAAC,SAAS,EAAE,MAAM,CAAC,WAAW,EAAI,CAAA,CAC/C;AAPgF;;;;"}

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

@@ -1,8 +1,12 @@
+:root {
+    --gap-xs: 8px;
+    --gap-8: var(--gap-xs);
+}
 :root {
     --select-mobile-checkmark-display-icon: block;
     --select-mobile-checkmark-display-badge: none;
 }
-.select__checkmark_2nxmj {
+.select__checkmark_zsmr7 {
     flex-shrink: 0;
     display: flex;
     align-items: center;
@@ -11,15 +15,18 @@
     height: 24px;
     opacity: 0;
 }
-.select__checkmark_2nxmj:first-child {
-        display: none;
-    }
-.select__checkmark_2nxmj.select__selected_2nxmj {
+.select__checkmark_zsmr7.select__selected_zsmr7 {
         opacity: 1;
     }
-.select__displayIcon_2nxmj {
+.select__checkmark_zsmr7.select__before_zsmr7 {
+        margin-right: var(--gap-8);
+    }
+.select__checkmark_zsmr7.select__after_zsmr7 {
+        margin-left: var(--gap-8);
+    }
+.select__displayIcon_zsmr7 {
     display: var(--select-mobile-checkmark-display-icon);
 }
-.select__displayBadge_2nxmj {
+.select__displayBadge_zsmr7 {
     display: var(--select-mobile-checkmark-display-badge);
 }

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

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"checkmark":"select__checkmark_2nxmj","selected":"select__selected_2nxmj","displayIcon":"select__displayIcon_2nxmj"};
+var styles = {"checkmark":"select__checkmark_zsmr7","selected":"select__selected_zsmr7","before":"select__before_zsmr7","after":"select__after_zsmr7","displayIcon":"select__displayIcon_zsmr7","displayBadge":"select__displayBadge_zsmr7"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["../../src/components/checkmark-mobile/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../../vars.css';\n\n.checkmark {\n    flex-shrink: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 24px;\n    height: 24px;\n    opacity: 0;\n\n    &:first-child {\n        display: none;\n    }\n\n    &.selected {\n        opacity: 1;\n    }\n}\n\n.displayIcon {\n    display: var(--select-mobile-checkmark-display-icon);\n}\n\n.displayBadge {\n    display: var(--select-mobile-checkmark-display-badge);\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,yBAAyB,CAAC,UAAU,CAAC,wBAAwB,CAAC,aAAa,CAAC,2BAAuE,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/checkmark-mobile/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n@import '../../vars.css';\n\n.checkmark {\n    flex-shrink: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 24px;\n    height: 24px;\n    opacity: 0;\n\n    &.selected {\n        opacity: 1;\n    }\n\n    &.before {\n        margin-right: var(--gap-8);\n    }\n\n    &.after {\n        margin-left: var(--gap-8);\n    }\n}\n\n.displayIcon {\n    display: var(--select-mobile-checkmark-display-icon);\n}\n\n.displayBadge {\n    display: var(--select-mobile-checkmark-display-badge);\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,yBAAyB,CAAC,UAAU,CAAC,wBAAwB,CAAC,QAAQ,CAAC,sBAAsB,CAAC,OAAO,CAAC,qBAAqB,CAAC,aAAa,CAAC,2BAA2B,CAAC,cAAc,CAAC,4BAA4B,CAAC;;;;"}

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

@@ -6,16 +6,16 @@
 :root {
     --input-error-icon-display: none;
 }
-.select__clearIcon_im64r {
+.select__clearIcon_1m06p {
     display: block;
     color: var(--color-light-neutral-translucent-500);
 }
-.select__clearIcon_im64r:hover {
+.select__clearIcon_1m06p:hover {
         color: var(--color-light-neutral-translucent-500-hover);
     }
-.select__clearIcon_im64r:active {
+.select__clearIcon_1m06p:active {
         color: var(--color-light-neutral-translucent-500-press);
     }
-.select__clearButton_im64r + [data-addon='error-icon'] {
+.select__clearButton_1m06p + [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_im64r","clearButton":"select__clearButton_im64r"};
+var styles = {"clearIcon":"select__clearIcon_1m06p","clearButton":"select__clearButton_1m06p"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/field/Component.js

@@ -1,7 +1,7 @@
 import { __rest, __assign } from 'tslib';
-import React, { useState, useRef, useCallback } from 'react';
+import React, { useState, useRef, useCallback, Fragment } from 'react';
 import cn from 'classnames';
-import { getAddonsByPriority, LockIcon } from '@alfalab/core-components-input/esm/shared';
+import { LockIcon } from '@alfalab/core-components-input/esm/shared';
 import { getDataTestId } from '@alfalab/core-components-shared/esm';
 import { useFocus } from '@alfalab/hooks';
 import { joinOptions } from '../../utils.js';
@@ -30,32 +30,15 @@ var Field = function (_a) {
      * [1] - Indicators (eye, calendar, chevron, stepper e.g.)
      * [0] - Lock
      */
-    var rightAddonsMap = getAddonsByPriority([
-        {
-            priority: 4,
-            predicate: clear && filled && !disabled,
-            render: function () { return (React.createElement(ClearButton, { onClick: onClear, disabled: disabled, dataTestId: getDataTestId(dataTestId, 'clear-icon'), size: size })); },
-        },
-        {
-            priority: 2,
-            predicate: Boolean(rightAddons),
-            render: function () { return rightAddons; },
-        },
-        {
-            priority: 1,
-            predicate: Boolean(Arrow) && !disabled,
-            render: function () { return Arrow && React.cloneElement(Arrow, { className: styles.arrow }); },
-        },
-        {
-            priority: 0,
-            predicate: disabled,
-            render: function () { return React.createElement(LockIcon, { colors: colors, size: size }); },
-        },
-    ]);
+    var renderRightAddons = function () { return (React.createElement(Fragment, null,
+        clear && filled && !disabled && (React.createElement(ClearButton, { onClick: onClear, disabled: disabled, dataTestId: getDataTestId(dataTestId, 'clear-icon'), size: size })),
+        rightAddons,
+        !disabled && Arrow && React.cloneElement(Arrow, { className: styles.arrow }),
+        disabled && React.createElement(LockIcon, { colors: colors, size: size }))); };
     return (React.createElement("div", { className: styles.component, ref: wrapperRef, onFocus: handleFocus, onBlur: handleBlur }, FormControlComponent ? (React.createElement(FormControlComponent, __assign({ dataTestId: getDataTestId(dataTestId, 'form-control'), fieldClassName: cn(styles.field, fieldClassName, (_b = {},
             _b[styles.disabled] = disabled,
             _b[styles.focusVisible] = focusVisible,
-            _b)), block: true, size: size, focused: focused || open, disabled: disabled, filled: filled || (!!placeholder && open), label: showLabel && label, labelView: labelView, error: error, hint: hint, rightAddons: rightAddonsMap, "data-test-id": dataTestId }, restProps, innerProps),
+            _b)), block: true, size: size, focused: focused || open, disabled: disabled, filled: filled || (!!placeholder && open), label: showLabel && label, labelView: labelView, error: error, hint: hint, rightAddons: renderRightAddons(), "data-test-id": dataTestId }, restProps, innerProps),
         React.createElement("div", { className: cn(styles.contentWrapper, styles["size-".concat(size)]) },
             showPlaceholder && (React.createElement("span", { className: cn(styles.placeholder, (_c = {},
                     _c[styles.focused] = focused || open,