@alfalab/core-components-select 17.19.0 → 17.20.1

package/components/field/index.css

@@ -1,4 +1,4 @@
-/* hash: 1r8ob */
+/* hash: 476yg */
 :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-status-info: #2288fa;
@@ -46,22 +46,22 @@
     /* checkmark */
 
     /* optgroup */
-} .select__component_kthbq {
+} .select__component_1nej4 {
     width: 100%;
     outline: none;
-} .select__field_kthbq:not(.select__disabled_kthbq) {
+} .select__field_1nej4:not(.select__disabled_1nej4) {
     cursor: pointer
-} .select__field_kthbq:not(.select__disabled_kthbq):hover .select__arrow_kthbq {
+} .select__field_1nej4:not(.select__disabled_1nej4):hover .select__arrow_1nej4 {
             opacity: var(--select-arrow-hover-opacity);
-        } .select__disabled_kthbq {
+        } .select__disabled_1nej4 {
     cursor: var(--disabled-cursor);
-} .select__placeholder_kthbq {
+} .select__placeholder_1nej4 {
     color: var(--input-placeholder-color);
     transition: color 0.2s ease;
-    animation: select__show-placeholder_kthbq 0.2s ease
-} .select__placeholder_kthbq.select__focused_kthbq {
+    animation: select__show-placeholder_1nej4 0.2s ease
+} .select__placeholder_1nej4.select__focused_1nej4 {
         color: var(--input-focus-placeholder-color);
-    } .select__contentWrapper_kthbq {
+    } .select__contentWrapper_1nej4 {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -70,22 +70,22 @@
     text-overflow: ellipsis;
     overflow: hidden;
     width: 100%
-} .select__contentWrapper_kthbq.select__size-40_kthbq {
+} .select__contentWrapper_1nej4.select__size-40_1nej4 {
         font-size: 14px;
         line-height: 18px;
         font-weight: 400;
-    } .select__value_kthbq {
+    } .select__value_1nej4 {
     overflow: hidden;
     text-overflow: ellipsis;
     text-align: left
-} .select__value_kthbq.select__size-40_kthbq {
+} .select__value_1nej4.select__size-40_1nej4 {
         font-size: 14px;
         line-height: 18px;
         font-weight: 400;
-    } .select__focusVisible_kthbq {
+    } .select__focusVisible_1nej4 {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
-} @keyframes select__show-placeholder_kthbq {
+} @keyframes select__show-placeholder_1nej4 {
     from {
         opacity: 0;
     }

package/components/footer/Component.js

@@ -13,7 +13,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"footer":"select__footer_j5bi3","button":"select__button_j5bi3","highlighted":"select__highlighted_j5bi3"};
+var styles = {"footer":"select__footer_21msx","button":"select__button_21msx","highlighted":"select__highlighted_21msx"};
 require('./index.css')
 
 var Footer = function (_a) {

package/components/footer/index.css

@@ -1,4 +1,4 @@
-/* hash: a2bkb */
+/* hash: ppx5t */
 :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-modal-bg-primary: #fff;
@@ -31,17 +31,17 @@
     /* checkmark */
 
     /* optgroup */
-} .select__footer_j5bi3 {
+} .select__footer_21msx {
     display: flex;
     box-sizing: border-box;
     width: 100%;
     padding: var(--gap-16) var(--gap-16);
     background-color: var(--color-light-modal-bg-primary)
-} .select__footer_j5bi3 .select__button_j5bi3:first-of-type {
+} .select__footer_21msx .select__button_21msx:first-of-type {
         margin-right: var(--gap-16);
-    } .select__button_j5bi3 {
+    } .select__button_21msx {
     width: 50%;
-} .select__highlighted_j5bi3 {
+} .select__highlighted_21msx {
     border-top: 1px solid var(--color-light-neutral-300);
     background-color: var(--color-light-modal-bg-primary);
 }

package/components/index.js

@@ -6,7 +6,9 @@ var components_arrow_Component = require('./arrow/Component.js');
 var components_baseSelect_Component = require('./base-select/Component.js');
 var components_field_Component = require('./field/Component.js');
 var components_optgroup_Component = require('./optgroup/Component.js');
-var components_option_Component = require('./option/Component.js');
+var components_option_desktop_Component = require('./option/desktop/Component.js');
+var components_option_mobile_Component = require('./option/mobile/Component.js');
+var components_option_Component_responsive = require('./option/Component.responsive.js');
 var components_optionsList_Component = require('./options-list/Component.js');
 var components_virtualOptionsList_Component = require('./virtual-options-list/Component.js');
 var components_baseOption_Component = require('./base-option/Component.js');
@@ -18,7 +20,9 @@ exports.Arrow = components_arrow_Component.Arrow;
 exports.BaseSelect = components_baseSelect_Component.BaseSelect;
 exports.Field = components_field_Component.Field;
 exports.Optgroup = components_optgroup_Component.Optgroup;
-exports.Option = components_option_Component.Option;
+exports.OptionDesktop = components_option_desktop_Component.OptionDesktop;
+exports.OptionMobile = components_option_mobile_Component.OptionMobile;
+exports.Option = components_option_Component_responsive.OptionResponsive;
 exports.OptionsList = components_optionsList_Component.OptionsList;
 exports.VirtualOptionsList = components_virtualOptionsList_Component.VirtualOptionsList;
 exports.BaseOption = components_baseOption_Component.BaseOption;

package/components/optgroup/Component.js

@@ -11,7 +11,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"optgroup":"select__optgroup_1oy32","label":"select__label_1oy32","size-64":"select__size-64_1oy32","size-72":"select__size-72_1oy32"};
+var styles = {"optgroup":"select__optgroup_is4la","label":"select__label_is4la","size-64":"select__size-64_is4la","size-72":"select__size-72_is4la"};
 require('./index.css')
 
 var Optgroup = function (_a) {

package/components/optgroup/index.css

@@ -1,4 +1,4 @@
-/* hash: tx7k4 */
+/* hash: 16l7m */
 :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-modal-bg-primary: #fff;
@@ -42,7 +42,7 @@
     --select-optgroup-right-padding: var(--gap-12);
     --select-optgroup-l-left-padding: var(--gap-16);
     --select-optgroup-l-right-padding: var(--gap-16);
-} .select__optgroup_1oy32 {
+} .select__optgroup_is4la {
     position: relative;
     display: flex;
     align-items: center;
@@ -51,9 +51,9 @@
     box-sizing: border-box;
     background: var(--select-optgroup-background);
     min-height: 40px
-} .select__optgroup_1oy32 + *[role='option']:before {
+} .select__optgroup_is4la + *[role='option']:before {
         display: none;
-    } .select__label_1oy32 {
+    } .select__label_is4la {
     font-size: 12px;
     line-height: 16px;
     font-weight: 500;
@@ -62,8 +62,8 @@
 
     display: block;
     color: var(--select-optgroup-color);
-} .select__size-64_1oy32,
-.select__size-72_1oy32 {
+} .select__size-64_is4la,
+.select__size-72_is4la {
     padding-left: var(--select-optgroup-l-left-padding);
     padding-right: var(--select-optgroup-l-right-padding);
 }

package/components/option/Component.d.ts

@@ -1,4 +1,17 @@
+/// <reference types="module.d.ts" />
 import { FC } from 'react';
-import { OptionProps } from "../../typings";
-declare const Option: FC<OptionProps>;
-export { Option };
+import { OptionCommonProps } from "../../typings";
+import stylesDesktop from './desktop/index.module.css';
+import stylesMobile from './mobile/index.module.css';
+type OptionPrivateProps = {
+    /**
+     * Мобильная версия option.
+     */
+    mobile: boolean;
+    /**
+     * Стили
+     */
+    styles: typeof stylesDesktop | typeof stylesMobile;
+};
+declare const OptionBase: FC<OptionCommonProps & OptionPrivateProps>;
+export { OptionBase };

package/components/option/Component.js

@@ -6,22 +6,17 @@ var tslib = require('tslib');
 var React = require('react');
 var cn = require('classnames');
 var consts = require('../../consts.js');
-var components_checkmark_Component = require('../checkmark/Component.js');
-var components_checkmarkMobile_Component = require('../checkmark-mobile/Component.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"option":"select__option_1v7m6","disabled":"select__disabled_1v7m6","size-48":"select__size-48_1v7m6","size-56":"select__size-56_1v7m6","size-64":"select__size-64_1v7m6","size-72":"select__size-72_1v7m6","selected":"select__selected_1v7m6","highlighted":"select__highlighted_1v7m6","content":"select__content_1v7m6","textContent":"select__textContent_1v7m6"};
-require('./index.css')
-
-var Option = function (_a) {
+var OptionBase = function (_a) {
     var _b, _c;
-    var _d = _a.size, size = _d === void 0 ? 48 : _d, className = _a.className, option = _a.option, children = _a.children, selected = _a.selected, highlighted = _a.highlighted, disabled = _a.disabled, multiple = _a.multiple, mobile = _a.mobile, _e = _a.Checkmark, Checkmark = _e === void 0 ? mobile ? components_checkmarkMobile_Component.Checkmark : components_checkmark_Component.Checkmark : _e, innerProps = _a.innerProps, dataTestId = _a.dataTestId;
+    var _d = _a.size, size = _d === void 0 ? 48 : _d, className = _a.className, option = _a.option, children = _a.children, selected = _a.selected, highlighted = _a.highlighted, disabled = _a.disabled, multiple = _a.multiple, mobile = _a.mobile, Checkmark = _a.Checkmark, innerProps = _a.innerProps, dataTestId = _a.dataTestId, styles = _a.styles;
     var content = children || option.content || option.key;
-    var _f = option.showCheckMark, showCheckMark = _f === void 0 ? true : _f;
+    var _e = option.showCheckMark, showCheckMark = _e === void 0 ? true : _e;
     return (React__default.default.createElement("div", tslib.__assign({}, innerProps, { className: cn__default.default(styles.option, styles[consts.SIZE_TO_CLASSNAME_MAP[size]], className, (_b = {},
             _b[styles.highlighted] = !mobile && highlighted,
             _b[styles.selected] = selected,
@@ -34,4 +29,4 @@ var Option = function (_a) {
         Checkmark && showCheckMark && (React__default.default.createElement(Checkmark, { disabled: disabled, selected: selected, multiple: multiple, position: 'after' }))));
 };
 
-exports.Option = Option;
+exports.OptionBase = OptionBase;

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

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import React from 'react';
+import { OptionProps } from "../../typings";
+declare const OptionResponsive: ({ mobile, ...props }: OptionProps) => React.JSX.Element;
+export { OptionResponsive };

package/components/option/Component.responsive.js

@@ -0,0 +1,19 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var components_option_desktop_Component = require('./desktop/Component.js');
+var components_option_mobile_Component = require('./mobile/Component.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+var OptionResponsive = function (_a) {
+    var mobile = _a.mobile, props = tslib.__rest(_a, ["mobile"]);
+    return mobile ? React__default.default.createElement(components_option_mobile_Component.OptionMobile, tslib.__assign({}, props)) : React__default.default.createElement(components_option_desktop_Component.OptionDesktop, tslib.__assign({}, props));
+};
+
+exports.OptionResponsive = OptionResponsive;

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

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import React from 'react';
+import { OptionCommonProps } from "../../../typings";
+declare const OptionDesktop: ({ Checkmark, ...props }: OptionCommonProps) => React.JSX.Element;
+export { OptionDesktop };

package/components/option/desktop/Component.js

@@ -0,0 +1,22 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var components_checkmark_Component = require('../../checkmark/Component.js');
+var components_option_Component = require('../Component.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+var styles = {"option":"select__option_h04qy","disabled":"select__disabled_h04qy","size-48":"select__size-48_h04qy","size-56":"select__size-56_h04qy","size-64":"select__size-64_h04qy","size-72":"select__size-72_h04qy","selected":"select__selected_h04qy","highlighted":"select__highlighted_h04qy","content":"select__content_h04qy","textContent":"select__textContent_h04qy"};
+require('./index.css')
+
+var OptionDesktop = function (_a) {
+    var _b = _a.Checkmark, Checkmark = _b === void 0 ? components_checkmark_Component.Checkmark : _b, props = tslib.__rest(_a, ["Checkmark"]);
+    return (React__default.default.createElement(components_option_Component.OptionBase, tslib.__assign({}, props, { mobile: false, Checkmark: Checkmark, styles: styles })));
+};
+
+exports.OptionDesktop = OptionDesktop;

package/components/option/desktop/index.css

@@ -0,0 +1,135 @@
+/* hash: gp7cj */
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} /* deprecated */ :root {
+    --color-light-modal-bg-primary: #fff;
+    --color-light-neutral-400: #d2d3d9;
+    --color-light-text-primary: rgba(3, 3, 6, 0.88);
+    --color-light-text-secondary: rgba(4, 4, 19, 0.55);
+    --color-light-transparent-default-hover: rgba(38, 55, 88, 0.06);
+    --color-light-transparent-default-press: rgba(30, 43, 68, 0.08); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+
+    /* новые значения, используйте их */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */
+    --gap-s: 12px; /* deprecated */ /* deprecated */
+    --gap-m: 16px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+
+    /* новые значения, используйте их */
+    --gap-0: 0;
+    --gap-12: var(--gap-s);
+    --gap-16: var(--gap-m);
+} :root {
+} :root {
+    --disabled-cursor: not-allowed;
+    --size-s-height: 48px;
+    --size-m-height: 56px;
+    --size-l-height: 64px;
+    --size-xl-height: 72px;
+} /* сбрасывает синюю подсветку при нажатии */ :root {
+
+    /* options list */
+    --select-option-divider-display: none;
+    --select-option-divider-background: var(--color-light-neutral-400);
+
+    /* option */
+
+    --select-option-left-padding: var(--gap-12);
+    --select-option-right-padding: var(--gap-12);
+    --select-option-l-left-padding: var(--gap-16);
+    --select-option-l-right-padding: var(--gap-16);
+    --select-option-background: var(--color-light-modal-bg-primary);
+    --select-option-selected-background: var(--color-light-modal-bg-primary);
+    --select-option-hover-background: var(--color-light-transparent-default-hover);
+    --select-option-active-background: var(--color-light-transparent-default-press);
+    --select-option-disabled-background: var(--color-light-modal-bg-primary);
+    --select-option-color: var(--color-light-text-primary);
+    --select-option-selected-color: var(--color-light-text-primary);
+    --select-option-hover-color: var(--color-light-text-primary);
+    --select-option-active-color: var(--color-light-text-primary);
+    --select-option-disabled-color: var(--color-light-text-secondary);
+
+    /* checkmark */
+
+    /* optgroup */
+} .select__option_h04qy {
+    font-size: 16px;
+    line-height: 20px;
+    font-weight: 400;
+
+    display: flex;
+    align-items: center;
+    padding-left: var(--select-option-left-padding);
+    padding-right: var(--select-option-right-padding);
+    transition: background-color 0.2s ease;
+    background: var(--select-option-background);
+    color: var(--select-option-color);
+    box-sizing: border-box;
+    position: relative;
+    cursor: pointer
+} .select__option_h04qy:not(.select__disabled_h04qy):active {
+        background: var(--select-option-active-background);
+        color: var(--select-option-active-color);
+    } .select__option_h04qy:before {
+        content: '';
+        position: absolute;
+        left: var(--select-option-left-padding);
+        right: var(--select-option-right-padding);
+        top: var(--gap-0);
+        height: 1px;
+        background: var(--select-option-divider-background);
+        display: var(--select-option-divider-display);
+        transition: opacity 0.2s ease;
+    } .select__option_h04qy:first-child:before {
+        display: none;
+    } .select__size-48_h04qy {
+    min-height: var(--size-s-height);
+} .select__size-56_h04qy {
+    min-height: var(--size-m-height);
+} .select__size-64_h04qy {
+    min-height: var(--size-l-height);
+} .select__size-72_h04qy {
+    min-height: var(--size-xl-height);
+} .select__size-64_h04qy,
+.select__size-72_h04qy {
+    padding-left: var(--select-option-l-left-padding);
+    padding-right: var(--select-option-l-right-padding)
+} .select__size-64_h04qy:before, .select__size-72_h04qy:before {
+        left: var(--select-option-l-left-padding);
+        right: var(--select-option-l-right-padding);
+    } .select__selected_h04qy {
+    background: var(--select-option-selected-background);
+    color: var(--select-option-selected-color);
+    cursor: default;
+} .select__highlighted_h04qy {
+    background: var(--select-option-hover-background);
+    color: var(--select-option-hover-color)
+} .select__highlighted_h04qy:before,
+    .select__highlighted_h04qy + .select__option_h04qy:before {
+        opacity: 0;
+    } .select__disabled_h04qy {
+    cursor: var(--disabled-cursor);
+    background: var(--select-option-disabled-background);
+    color: var(--select-option-disabled-color);
+} .select__content_h04qy {
+    overflow: hidden;
+    flex: 1;
+    text-overflow: ellipsis;
+} .select__textContent_h04qy {
+    padding-top: var(--gap-12);
+    padding-bottom: var(--gap-12);
+} .select__highlighted_h04qy {
+    background: var(--select-option-hover-background);
+    color: var(--select-option-hover-color)
+} .select__highlighted_h04qy:before,
+    .select__highlighted_h04qy + .select__option_h04qy:before {
+        opacity: 0;
+    }

package/components/option/index.d.ts

@@ -1 +1,3 @@
-export * from "./Component";
+export * from "./desktop/Component";
+export * from "./mobile/Component";
+export { OptionResponsive as Option } from "./Component.responsive";

package/components/option/index.js

@@ -2,8 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var components_option_Component = require('./Component.js');
+var components_option_desktop_Component = require('./desktop/Component.js');
+var components_option_mobile_Component = require('./mobile/Component.js');
+var components_option_Component_responsive = require('./Component.responsive.js');
 
 
 
-exports.Option = components_option_Component.Option;
+exports.OptionDesktop = components_option_desktop_Component.OptionDesktop;
+exports.OptionMobile = components_option_mobile_Component.OptionMobile;
+exports.Option = components_option_Component_responsive.OptionResponsive;

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

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import React from 'react';
+import { OptionCommonProps } from "../../../typings";
+declare const OptionMobile: ({ Checkmark, ...props }: OptionCommonProps) => React.JSX.Element;
+export { OptionMobile };

package/components/option/mobile/Component.js

@@ -0,0 +1,22 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var components_checkmarkMobile_Component = require('../../checkmark-mobile/Component.js');
+var components_option_Component = require('../Component.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+var styles = {"option":"select__option_uw0s4","disabled":"select__disabled_uw0s4","size-48":"select__size-48_uw0s4","size-56":"select__size-56_uw0s4","size-64":"select__size-64_uw0s4","size-72":"select__size-72_uw0s4","selected":"select__selected_uw0s4","highlighted":"select__highlighted_uw0s4","content":"select__content_uw0s4","textContent":"select__textContent_uw0s4"};
+require('./index.css')
+
+var OptionMobile = function (_a) {
+    var _b = _a.Checkmark, Checkmark = _b === void 0 ? components_checkmarkMobile_Component.Checkmark : _b, props = tslib.__rest(_a, ["Checkmark"]);
+    return (React__default.default.createElement(components_option_Component.OptionBase, tslib.__assign({}, props, { mobile: true, Checkmark: Checkmark, styles: styles })));
+};
+
+exports.OptionMobile = OptionMobile;

package/components/option/{index.css → mobile/index.css}

@@ -1,4 +1,4 @@
-/* hash: 5wosz */
+/* hash: 1m1w1 */
 :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-modal-bg-primary: #fff;
@@ -60,7 +60,7 @@
     /* checkmark */
 
     /* optgroup */
-} .select__option_1v7m6 {
+} .select__option_uw0s4 {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -75,10 +75,10 @@
     box-sizing: border-box;
     position: relative;
     cursor: pointer
-} .select__option_1v7m6:not(.select__disabled_1v7m6):active {
+} .select__option_uw0s4:not(.select__disabled_uw0s4):active {
         background: var(--select-option-active-background);
         color: var(--select-option-active-color);
-    } .select__option_1v7m6:before {
+    } .select__option_uw0s4:before {
         content: '';
         position: absolute;
         left: var(--select-option-left-padding);
@@ -88,42 +88,42 @@
         background: var(--select-option-divider-background);
         display: var(--select-option-divider-display);
         transition: opacity 0.2s ease;
-    } .select__option_1v7m6:first-child:before {
+    } .select__option_uw0s4:first-child:before {
         display: none;
-    } .select__size-48_1v7m6 {
+    } .select__size-48_uw0s4 {
     min-height: var(--size-s-height);
-} .select__size-56_1v7m6 {
+} .select__size-56_uw0s4 {
     min-height: var(--size-m-height);
-} .select__size-64_1v7m6 {
+} .select__size-64_uw0s4 {
     min-height: var(--size-l-height);
-} .select__size-72_1v7m6 {
+} .select__size-72_uw0s4 {
     min-height: var(--size-xl-height);
-} .select__size-64_1v7m6,
-.select__size-72_1v7m6 {
+} .select__size-64_uw0s4,
+.select__size-72_uw0s4 {
     padding-left: var(--select-option-l-left-padding);
     padding-right: var(--select-option-l-right-padding)
-} .select__size-64_1v7m6:before, .select__size-72_1v7m6:before {
+} .select__size-64_uw0s4:before, .select__size-72_uw0s4:before {
         left: var(--select-option-l-left-padding);
         right: var(--select-option-l-right-padding);
-    } .select__selected_1v7m6 {
+    } .select__selected_uw0s4 {
     background: var(--select-option-selected-background);
     color: var(--select-option-selected-color);
     cursor: default;
-} .select__highlighted_1v7m6 {
+} .select__highlighted_uw0s4 {
     background: var(--select-option-hover-background);
     color: var(--select-option-hover-color)
-} .select__highlighted_1v7m6:before,
-    .select__highlighted_1v7m6 + .select__option_1v7m6:before {
+} .select__highlighted_uw0s4:before,
+    .select__highlighted_uw0s4 + .select__option_uw0s4:before {
         opacity: 0;
-    } .select__disabled_1v7m6 {
+    } .select__disabled_uw0s4 {
     cursor: var(--disabled-cursor);
     background: var(--select-option-disabled-background);
     color: var(--select-option-disabled-color);
-} .select__content_1v7m6 {
+} .select__content_uw0s4 {
     overflow: hidden;
     flex: 1;
     text-overflow: ellipsis;
-} .select__textContent_1v7m6 {
+} .select__textContent_uw0s4 {
     padding-top: var(--gap-12);
     padding-bottom: var(--gap-12);
 }

package/components/options-list/Component.js

@@ -19,7 +19,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"optionsList":"select__optionsList_1ahtz","optionsListHeader":"select__optionsListHeader_1ahtz","headerHighlighted":"select__headerHighlighted_1ahtz","optionsListFooter":"select__optionsListFooter_1ahtz","withBorder":"select__withBorder_1ahtz","scrollable":"select__scrollable_1ahtz","-webkit-mask":"select__mask_1ahtz","mask":"select__mask_1ahtz","emptyPlaceholder":"select__emptyPlaceholder_1ahtz","size-64":"select__size-64_1ahtz","size-72":"select__size-72_1ahtz"};
+var styles = {"optionsList":"select__optionsList_19por","optionsListHeader":"select__optionsListHeader_19por","headerHighlighted":"select__headerHighlighted_19por","optionsListFooter":"select__optionsListFooter_19por","withBorder":"select__withBorder_19por","scrollable":"select__scrollable_19por","-webkit-mask":"select__mask_19por","mask":"select__mask_19por","emptyPlaceholder":"select__emptyPlaceholder_19por","size-64":"select__size-64_19por","size-72":"select__size-72_19por"};
 require('./index.css')
 
 var createCounter = function () {