@alfalab/core-components 23.3.0 → 23.6.0-beta.0

package/select/modern/components/option/index.css

@@ -1,4 +1,4 @@
-/* hash: 1r8pz */
+/* hash: jfu8g */
 :root {
     --color-light-bg-primary: #fff;
     --color-light-bg-secondary: #f3f4f5;
@@ -53,7 +53,7 @@
 
     /* optgroup */
 }
-.select__option_1nsz0 {
+.select__option_mkr6z {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -69,11 +69,11 @@
     position: relative;
     cursor: pointer
 }
-.select__option_1nsz0:not(.select__disabled_1nsz0):active {
+.select__option_mkr6z:not(.select__disabled_mkr6z):active {
         background: var(--select-option-active-background);
         color: var(--select-option-active-color);
     }
-.select__option_1nsz0:before {
+.select__option_mkr6z:before {
         content: '';
         position: absolute;
         left: var(--select-option-left-padding);
@@ -84,60 +84,60 @@
         display: var(--select-option-divider-display);
         transition: opacity 0.2s ease;
     }
-.select__option_1nsz0:first-child:before {
+.select__option_mkr6z:first-child:before {
         display: none;
     }
-.select__s_1nsz0 {
+.select__s_mkr6z {
     min-height: var(--size-s-height);
 }
-.select__m_1nsz0 {
+.select__m_mkr6z {
     min-height: var(--size-m-height);
 }
-.select__l_1nsz0 {
+.select__l_mkr6z {
     min-height: var(--size-l-height);
 }
-.select__xl_1nsz0 {
+.select__xl_mkr6z {
     min-height: var(--size-xl-height);
 }
-.select__l_1nsz0,
-.select__xl_1nsz0 {
+.select__l_mkr6z,
+.select__xl_mkr6z {
     padding-left: var(--select-option-l-left-padding);
     padding-right: var(--select-option-l-right-padding)
 }
-.select__l_1nsz0:before, .select__xl_1nsz0:before {
+.select__l_mkr6z:before, .select__xl_mkr6z:before {
         left: var(--select-option-l-left-padding);
         right: var(--select-option-l-right-padding);
     }
-.select__selected_1nsz0 {
+.select__selected_mkr6z {
     background: var(--select-option-selected-background);
     color: var(--select-option-selected-color);
     cursor: default;
 }
-.select__highlighted_1nsz0 {
+.select__highlighted_mkr6z {
     background: var(--select-option-hover-background);
     color: var(--select-option-hover-color)
 }
-.select__highlighted_1nsz0:before,
-    .select__highlighted_1nsz0 + .select__option_1nsz0:before {
+.select__highlighted_mkr6z:before,
+    .select__highlighted_mkr6z + .select__option_mkr6z:before {
         opacity: 0;
     }
-.select__disabled_1nsz0 {
+.select__disabled_mkr6z {
     cursor: var(--disabled-cursor);
     background: var(--select-option-disabled-background);
     color: var(--select-option-disabled-color);
 }
-.select__content_1nsz0 {
+.select__content_mkr6z {
     overflow: hidden;
     text-overflow: ellipsis;
     flex: 1;
 }
-.select__textContent_1nsz0 {
+.select__textContent_mkr6z {
     padding-top: var(--gap-s);
     padding-bottom: var(--gap-s);
 }
 /* IE min-height fix */
 @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
-    .select__option_1nsz0:after {
+    .select__option_mkr6z:after {
         min-height: inherit;
         font-size: 0;
         content: '';

package/select/modern/components/option/index.js

@@ -1,4 +1,5 @@
 import 'react';
 import 'classnames';
+import '../../../../checkbox/modern';
 import '../checkmark/Component.js';
 export { Option } from './Component.js';

package/select/modern/components/options-list/Component.js

@@ -4,7 +4,7 @@ import mergeRefs from 'react-merge-refs';
 import { useVisibleOptions, isGroup } from '../../utils.js';
 import { Optgroup } from '../optgroup/Component.js';
 
-var styles = {"optionsList":"select__optionsList_v01nt","emptyPlaceholder":"select__emptyPlaceholder_v01nt","l":"select__l_v01nt","xl":"select__xl_v01nt"};
+var styles = {"optionsList":"select__optionsList_1w89h","emptyPlaceholder":"select__emptyPlaceholder_1w89h","l":"select__l_1w89h","xl":"select__xl_1w89h"};
 require('./index.css');
 
 const createCounter = () => {

package/select/modern/components/options-list/index.css

@@ -1,4 +1,4 @@
-/* hash: y8oeg */
+/* hash: llpjm */
 :root {
     --color-light-text-secondary: #546272;
 }
@@ -26,17 +26,17 @@
 
     /* optgroup */
 }
-.select__optionsList_v01nt {
+.select__optionsList_1w89h {
     overflow: auto;
     width: 100%;
     outline: none;
     box-sizing: border-box;
 }
-.select__emptyPlaceholder_v01nt {
+.select__emptyPlaceholder_1w89h {
     padding: var(--gap-m) var(--gap-s);
     color: var(--select-options-list-empty-placeholder-color);
 }
-.select__l_v01nt .select__emptyPlaceholder_v01nt,
-.select__xl_v01nt .select__emptyPlaceholder_v01nt {
+.select__l_1w89h .select__emptyPlaceholder_1w89h,
+.select__xl_1w89h .select__emptyPlaceholder_1w89h {
     padding: var(--gap-xl) var(--gap-m);
 }

package/select/modern/components/virtual-options-list/Component.js

@@ -4,7 +4,7 @@ import { useVirtual } from 'react-virtual';
 import { usePrevious, lastIndexOf, useVisibleOptions, isGroup } from '../../utils.js';
 import { Optgroup } from '../optgroup/Component.js';
 
-var styles = {"virtualOptionsList":"select__virtualOptionsList_184js","inner":"select__inner_184js","virtualRow":"select__virtualRow_184js","highlighted":"select__highlighted_184js","emptyPlaceholder":"select__emptyPlaceholder_184js","l":"select__l_184js","xl":"select__xl_184js"};
+var styles = {"virtualOptionsList":"select__virtualOptionsList_6wbyz","inner":"select__inner_6wbyz","virtualRow":"select__virtualRow_6wbyz","highlighted":"select__highlighted_6wbyz","emptyPlaceholder":"select__emptyPlaceholder_6wbyz","l":"select__l_6wbyz","xl":"select__xl_6wbyz"};
 require('./index.css');
 
 /* eslint-disable react-hooks/exhaustive-deps */

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

@@ -1,4 +1,4 @@
-/* hash: 75ska */
+/* hash: 1cdpu */
 :root {
     --color-light-border-primary: #dbdee1;
     --color-light-text-secondary: #546272;
@@ -32,24 +32,24 @@
 
     /* optgroup */
 }
-.select__virtualOptionsList_184js {
+.select__virtualOptionsList_6wbyz {
     overflow: auto;
     width: 100%;
     outline: none;
     box-sizing: border-box;
     position: relative;
 }
-.select__inner_184js {
+.select__inner_6wbyz {
     position: relative;
     width: 100%;
 }
-.select__virtualRow_184js {
+.select__virtualRow_6wbyz {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%
 }
-.select__virtualRow_184js:before {
+.select__virtualRow_6wbyz:before {
         content: '';
         position: absolute;
         z-index: 1;
@@ -60,18 +60,18 @@
         background: var(--select-option-divider-background);
         display: var(--select-option-divider-display);
     }
-.select__virtualRow_184js:first-child:before {
+.select__virtualRow_6wbyz:first-child:before {
         display: none;
     }
-.select__highlighted_184js:before,
-    .select__highlighted_184js + .select__virtualRow_184js:before {
+.select__highlighted_6wbyz:before,
+    .select__highlighted_6wbyz + .select__virtualRow_6wbyz:before {
         display: none;
     }
-.select__emptyPlaceholder_184js {
+.select__emptyPlaceholder_6wbyz {
     padding: var(--gap-m) var(--gap-s);
     color: var(--select-options-list-empty-placeholder-color);
 }
-.select__l_184js .select__emptyPlaceholder_184js,
-.select__xl_184js .select__emptyPlaceholder_184js {
+.select__l_6wbyz .select__emptyPlaceholder_6wbyz,
+.select__xl_6wbyz .select__emptyPlaceholder_6wbyz {
     padding: var(--gap-xl) var(--gap-m);
 }

package/select/modern/index.js

@@ -12,6 +12,7 @@ export { Field } from './components/field/Component.js';
 export { Arrow } from './components/arrow/Component.js';
 export { Optgroup } from './components/optgroup/Component.js';
 export { OptionsList } from './components/options-list/Component.js';
+import '../../checkbox/modern';
 import './components/checkmark/Component.js';
 export { Option } from './components/option/Component.js';
 import '../../popover/modern';

package/select/modern/presets/index.js

@@ -1,5 +1,6 @@
 import 'react';
 import 'classnames';
+import '../../../checkbox/modern';
 import '../components/checkmark/Component.js';
 import '../components/option/Component.js';
 import '../../../skeleton/modern';

package/select/modern/presets/useLazyLoading/hook.js

@@ -1,5 +1,6 @@
 import React, { useReducer, useRef, useCallback, useEffect, useMemo } from 'react';
 import 'classnames';
+import '../../../../checkbox/modern';
 import '../../components/checkmark/Component.js';
 import { Option } from '../../components/option/Component.js';
 import { Skeleton } from '../../../../skeleton/modern';
@@ -896,7 +897,7 @@ import { Skeleton } from '../../../../skeleton/modern';
     window.IntersectionObserverEntry = IntersectionObserverEntry;
 }());
 
-var styles = {"skeleton":"select__skeleton_15eoc"};
+var styles = {"skeleton":"select__skeleton_46git"};
 require('./index.css');
 
 const DEBOUNCE_TIMEOUT = 300;

package/select/modern/presets/useLazyLoading/index.css

@@ -1,5 +1,5 @@
-/* hash: wk5ga */
-.select__skeleton_15eoc {
+/* hash: 1nsdr */
+.select__skeleton_46git {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);

package/select/modern/presets/useSelectWithLoading/hook.js

@@ -1,10 +1,11 @@
 import React, { useCallback } from 'react';
 import 'classnames';
+import '../../../../checkbox/modern';
 import '../../components/checkmark/Component.js';
 import { Option } from '../../components/option/Component.js';
 import { Skeleton } from '../../../../skeleton/modern';
 
-var styles = {"skeleton":"select__skeleton_1j9pa"};
+var styles = {"skeleton":"select__skeleton_lgt1u"};
 require('./index.css');
 
 function useSelectWithLoading({ loading = false, visibleOptions = 6, }) {

package/select/modern/presets/useSelectWithLoading/index.css

@@ -1,5 +1,5 @@
-/* hash: 1jbkv */
-.select__skeleton_1j9pa {
+/* hash: 16om0 */
+.select__skeleton_lgt1u {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);

package/select/modern/typings.d.ts

@@ -414,6 +414,10 @@ type OptionProps = {
      * Флаг, заблокирован ли данный пункт
      */
     disabled?: boolean;
+    /**
+     * Флаг множественного выбора
+     */
+    multiple?: boolean;
     /**
      * Компонент пункта меню
      */
@@ -438,5 +442,17 @@ type CheckmarkProps = {
      * Флаг, данный пункт выбран
      */
     selected?: boolean;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Флаг множественного выбора
+     */
+    multiple?: boolean;
+    /**
+     * Расположение отметки
+     */
+    position?: 'before' | 'after';
 };
 export { OptionShape, GroupShape, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps };

package/select/presets/index.js

@@ -1,8 +1,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../tslib.es6-484a3c90.js');
+require('../tslib.es6-b78c884e.js');
 require('react');
 require('classnames');
+require('../../checkbox');
 require('../components/checkmark/Component.js');
 require('../components/option/Component.js');
 require('../../skeleton');

package/select/presets/useLazyLoading/hook.js

@@ -1,8 +1,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../tslib.es6-484a3c90.js');
+var tslib_es6 = require('../../tslib.es6-b78c884e.js');
 var React = require('react');
 require('classnames');
+require('../../../checkbox');
 require('../../components/checkmark/Component.js');
 var components_option_Component = require('../../components/option/Component.js');
 var coreComponentsSkeleton = require('../../../skeleton');
@@ -903,7 +904,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
     window.IntersectionObserverEntry = IntersectionObserverEntry;
 }());
 
-var styles = {"skeleton":"select__skeleton_15eoc"};
+var styles = {"skeleton":"select__skeleton_46git"};
 require('./index.css');
 
 var DEBOUNCE_TIMEOUT = 300;

package/select/presets/useLazyLoading/index.css

@@ -1,5 +1,5 @@
-/* hash: wk5ga */
-.select__skeleton_15eoc {
+/* hash: 1nsdr */
+.select__skeleton_46git {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);

package/select/presets/useSelectWithLoading/hook.js

@@ -1,8 +1,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../tslib.es6-484a3c90.js');
+var tslib_es6 = require('../../tslib.es6-b78c884e.js');
 var React = require('react');
 require('classnames');
+require('../../../checkbox');
 require('../../components/checkmark/Component.js');
 var components_option_Component = require('../../components/option/Component.js');
 var coreComponentsSkeleton = require('../../../skeleton');
@@ -11,7 +12,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var styles = {"skeleton":"select__skeleton_1j9pa"};
+var styles = {"skeleton":"select__skeleton_lgt1u"};
 require('./index.css');
 
 function useSelectWithLoading(_a) {

package/select/presets/useSelectWithLoading/index.css

@@ -1,5 +1,5 @@
-/* hash: 1jbkv */
-.select__skeleton_1j9pa {
+/* hash: 16om0 */
+.select__skeleton_lgt1u {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);

package/select/typings.d.ts

@@ -414,6 +414,10 @@ type OptionProps = {
      * Флаг, заблокирован ли данный пункт
      */
     disabled?: boolean;
+    /**
+     * Флаг множественного выбора
+     */
+    multiple?: boolean;
     /**
      * Компонент пункта меню
      */
@@ -438,5 +442,17 @@ type CheckmarkProps = {
      * Флаг, данный пункт выбран
      */
     selected?: boolean;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Флаг множественного выбора
+     */
+    multiple?: boolean;
+    /**
+     * Расположение отметки
+     */
+    position?: 'before' | 'after';
 };
 export { OptionShape, GroupShape, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps };

package/select-with-tags/component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-0ccd3ff3.js');
+var tslib_es6 = require('./tslib.es6-751f31cc.js');
 var React = require('react');
 var coreComponentsSelect = require('../select');
 require('classnames');

package/select-with-tags/components/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../tslib.es6-0ccd3ff3.js');
+require('../tslib.es6-751f31cc.js');
 require('react');
 require('classnames');
 require('@alfalab/hooks');

package/select-with-tags/components/tag/component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../tslib.es6-0ccd3ff3.js');
+var tslib_es6 = require('../../tslib.es6-751f31cc.js');
 var React = require('react');
 var cn = require('classnames');
 var coreComponentsTag = require('../../../tag');
@@ -11,7 +11,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"tag":"select-with-tags__tag_1j675","tagNoClose":"select-with-tags__tagNoClose_1j675","tagContentWrap":"select-with-tags__tagContentWrap_1j675","tagCross":"select-with-tags__tagCross_1j675"};
+var styles = {"tag":"select-with-tags__tag_2m35k","tagNoClose":"select-with-tags__tagNoClose_2m35k","tagContentWrap":"select-with-tags__tagContentWrap_2m35k","tagCross":"select-with-tags__tagCross_2m35k"};
 require('./index.css');
 
 var Tag = function (_a) {

package/select-with-tags/components/tag/index.css

@@ -1,51 +1,55 @@
-/* hash: bfve3 */
-.select-with-tags__tag_1j675 {
+/* hash: 1ei69 */
+:root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+}
+:root {
+    --gap-2xs: 4px;
+    --gap-xs: 8px;
+    --gap-m: 16px;
+}
+.select-with-tags__tag_2m35k {
     padding: 0;
     padding-left: var(--gap-m);
     margin: var(--gap-2xs);
     cursor: default
 }
-
-.select-with-tags__tag_1j675:active:not(:disabled) {
+.select-with-tags__tag_2m35k:active:not(:disabled) {
         background-color: var(--tag-background-color-checked);
         color: var(--tag-text-color-checked);
     }
-
-.select-with-tags__tag_1j675:hover:not(:disabled):not(:active) {
+.select-with-tags__tag_2m35k:hover:not(:disabled):not(:active) {
         background-color: var(--tag-background-color-checked);
         color: var(--tag-text-color-checked);
     }
-
-.select-with-tags__tag_1j675 > span {
+.select-with-tags__tag_2m35k > span {
         width: 100%;
         height: 100%;
     }
-
-.select-with-tags__tagNoClose_1j675 {
+.select-with-tags__tagNoClose_2m35k {
     padding-right: var(--gap-m);
 }
-
-.select-with-tags__tagContentWrap_1j675 {
+.select-with-tags__tagContentWrap_2m35k {
     display: flex;
     justify-content: flex-start;
     align-items: center;
     height: 100%;
     cursor: pointer;
 }
-
-.select-with-tags__tagCross_1j675 {
+.select-with-tags__tagCross_2m35k {
     padding-right: var(--gap-xs);
     height: 100%
 }
-
-.select-with-tags__tagCross_1j675:hover {
+.select-with-tags__tagCross_2m35k:hover {
         opacity: 0.7;
     }
-
-.select-with-tags__tagCross_1j675:active {
+.select-with-tags__tagCross_2m35k:active {
         opacity: 0.5;
     }
-
-.select-with-tags__tagCross_1j675 svg {
+.select-with-tags__tagCross_2m35k svg {
         height: 100%;
     }

package/select-with-tags/components/tag/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../../tslib.es6-0ccd3ff3.js');
+require('../../tslib.es6-751f31cc.js');
 require('react');
 require('classnames');
 require('../../../tag');

package/select-with-tags/components/tag-list/component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../tslib.es6-0ccd3ff3.js');
+var tslib_es6 = require('../../tslib.es6-751f31cc.js');
 var React = require('react');
 var cn = require('classnames');
 var hooks = require('@alfalab/hooks');
@@ -15,7 +15,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"component":"select-with-tags__component_fjzez","xl":"select-with-tags__xl_fjzez","contentWrapper":"select-with-tags__contentWrapper_fjzez","l":"select-with-tags__l_fjzez","m":"select-with-tags__m_fjzez","s":"select-with-tags__s_fjzez","contentWrapperVertical":"select-with-tags__contentWrapperVertical_fjzez","hasLabel":"select-with-tags__hasLabel_fjzez","hasTags":"select-with-tags__hasTags_fjzez","addons":"select-with-tags__addons_fjzez","field":"select-with-tags__field_fjzez","input":"select-with-tags__input_fjzez","block":"select-with-tags__block_fjzez","focusVisible":"select-with-tags__focusVisible_fjzez","placeholder":"select-with-tags__placeholder_fjzez","addons-size-m":"select-with-tags__addons-size-m_fjzez","addons-size-l":"select-with-tags__addons-size-l_fjzez","addons-size-xl":"select-with-tags__addons-size-xl_fjzez","label":"select-with-tags__label_fjzez"};
+var styles = {"component":"select-with-tags__component_1w43f","xl":"select-with-tags__xl_1w43f","contentWrapper":"select-with-tags__contentWrapper_1w43f","l":"select-with-tags__l_1w43f","m":"select-with-tags__m_1w43f","s":"select-with-tags__s_1w43f","contentWrapperVertical":"select-with-tags__contentWrapperVertical_1w43f","hasLabel":"select-with-tags__hasLabel_1w43f","hasTags":"select-with-tags__hasTags_1w43f","addons":"select-with-tags__addons_1w43f","field":"select-with-tags__field_1w43f","input":"select-with-tags__input_1w43f","block":"select-with-tags__block_1w43f","focusVisible":"select-with-tags__focusVisible_1w43f","placeholder":"select-with-tags__placeholder_1w43f","addons-size-m":"select-with-tags__addons-size-m_1w43f","addons-size-l":"select-with-tags__addons-size-l_1w43f","addons-size-xl":"select-with-tags__addons-size-xl_1w43f","label":"select-with-tags__label_1w43f"};
 require('./index.css');
 
 var TagList = function (_a) {