@alfalab/core-components-select 14.1.2 → 14.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Component-3885b0d7.d.ts +1 -1
- package/{Component-00c64376.d.ts → Component-3eb05f44.d.ts} +48 -1
- package/{Component-00c64376.js → Component-3eb05f44.js} +26 -20
- package/Component.js +1 -1
- package/Component.mobile-b2c0420d.d.ts +93 -0
- package/Component.responsive.js +4 -3
- package/components/arrow/Component.js +1 -1
- package/components/arrow/index.css +3 -3
- package/components/base-checkmark/Component.js +1 -1
- package/components/base-checkmark/index.css +4 -4
- package/components/base-option/Component.js +2 -2
- package/components/base-option/index.css +13 -13
- package/components/base-select/Component.js +2 -2
- package/components/base-select/index.css +8 -8
- package/components/base-select/index.js +1 -1
- package/components/base-select-mobile/Component.d.ts +24 -0
- package/components/base-select-mobile/Component.js +25 -7
- package/components/base-select-mobile/footer/Component.js +3 -3
- package/components/base-select-mobile/footer/index.css +5 -5
- package/components/base-select-mobile/index.css +10 -10
- package/components/base-select-mobile/index.js +1 -1
- package/components/checkmark/Component.js +1 -1
- package/components/checkmark/index.css +10 -10
- package/components/checkmark-mobile/Component.js +1 -1
- package/components/checkmark-mobile/index.css +6 -6
- package/components/field/Component.js +1 -1
- package/components/field/index.css +9 -9
- package/components/index.js +5 -4
- package/components/optgroup/Component.js +1 -1
- package/components/optgroup/index.css +6 -6
- package/components/option/Component.js +2 -2
- package/components/option/index.css +20 -20
- package/components/options-list/Component.js +3 -3
- package/components/options-list/index.css +9 -9
- package/components/select-mobile/Component.js +4 -3
- package/components/select-mobile/index.d.ts +1 -1
- package/components/select-mobile/index.js +4 -3
- package/components/select-modal-mobile/Component.js +4 -3
- package/components/select-modal-mobile/index.d.ts +1 -1
- package/components/select-modal-mobile/index.js +4 -3
- package/components/virtual-options-list/Component.js +4 -4
- package/components/virtual-options-list/index.css +15 -15
- package/cssm/Component-3885b0d7.d.ts +1 -1
- package/{modern/Component-0b711513.d.ts → cssm/Component-4727d474.d.ts} +48 -1
- package/cssm/{Component-f86f43e3.js → Component-4727d474.js} +25 -19
- package/cssm/Component.mobile-b2c0420d.d.ts +93 -0
- package/cssm/Component.responsive.js +3 -1
- package/cssm/components/base-option/Component.js +1 -1
- package/cssm/components/base-select-mobile/Component.d.ts +24 -0
- package/cssm/components/base-select-mobile/Component.js +23 -5
- package/cssm/components/base-select-mobile/footer/Component.js +2 -2
- package/cssm/components/index.js +4 -2
- package/cssm/components/option/Component.js +1 -1
- package/cssm/components/options-list/Component.js +2 -2
- package/cssm/components/select-mobile/Component.js +3 -1
- package/cssm/components/select-mobile/index.d.ts +1 -1
- package/cssm/components/select-mobile/index.js +3 -1
- package/cssm/components/select-modal-mobile/Component.js +3 -1
- package/cssm/components/select-modal-mobile/index.d.ts +1 -1
- package/cssm/components/select-modal-mobile/index.js +3 -1
- package/cssm/components/virtual-options-list/Component.js +3 -3
- package/{esm/hook-4b555174.d.ts → cssm/hook-b4e70cb0.d.ts} +15 -4
- package/cssm/index.js +4 -2
- package/cssm/mobile.d.ts +4 -0
- package/cssm/mobile.js +67 -0
- package/cssm/presets/index.d.ts +1 -1
- package/cssm/presets/index.js +3 -1
- package/cssm/presets/useSelectWithApply/hook.js +3 -1
- package/cssm/presets/useSelectWithApply/options-list-with-apply/Component.js +3 -1
- package/cssm/presets/useSelectWithApply/options-list-with-apply/footer/index.module.css +0 -9
- package/cssm/presets/useSelectWithApply/options-list-with-apply/header/Component.d.ts +11 -0
- package/cssm/presets/useSelectWithApply/options-list-with-apply/header/Component.js +23 -0
- package/cssm/presets/useSelectWithApply/options-list-with-apply/header/index.module.css +22 -0
- package/cssm/presets/useSelectWithApply/options-list-with-apply/index.d.ts +1 -1
- package/cssm/presets/useSelectWithApply/options-list-with-apply/index.js +3 -1
- package/cssm/responsive.js +3 -1
- package/esm/Component-3885b0d7.d.ts +1 -1
- package/{cssm/Component-f86f43e3.d.ts → esm/Component-b436aedf.d.ts} +48 -1
- package/esm/{Component-2ff63ae2.js → Component-b436aedf.js} +26 -20
- package/esm/Component.js +1 -1
- package/esm/Component.mobile-b2c0420d.d.ts +93 -0
- package/esm/Component.responsive.js +4 -3
- package/esm/components/arrow/Component.js +1 -1
- package/esm/components/arrow/index.css +3 -3
- package/esm/components/base-checkmark/Component.js +1 -1
- package/esm/components/base-checkmark/index.css +4 -4
- package/esm/components/base-option/Component.js +2 -2
- package/esm/components/base-option/index.css +13 -13
- package/esm/components/base-select/Component.js +2 -2
- package/esm/components/base-select/index.css +8 -8
- package/esm/components/base-select/index.js +1 -1
- package/esm/components/base-select-mobile/Component.d.ts +24 -0
- package/esm/components/base-select-mobile/Component.js +26 -8
- package/esm/components/base-select-mobile/footer/Component.js +3 -3
- package/esm/components/base-select-mobile/footer/index.css +5 -5
- package/esm/components/base-select-mobile/index.css +10 -10
- package/esm/components/base-select-mobile/index.js +1 -1
- package/esm/components/checkmark/Component.js +1 -1
- package/esm/components/checkmark/index.css +10 -10
- package/esm/components/checkmark-mobile/Component.js +1 -1
- package/esm/components/checkmark-mobile/index.css +6 -6
- package/esm/components/field/Component.js +1 -1
- package/esm/components/field/index.css +9 -9
- package/esm/components/index.js +5 -4
- package/esm/components/optgroup/Component.js +1 -1
- package/esm/components/optgroup/index.css +6 -6
- package/esm/components/option/Component.js +2 -2
- package/esm/components/option/index.css +20 -20
- package/esm/components/options-list/Component.js +3 -3
- package/esm/components/options-list/index.css +9 -9
- package/esm/components/select-mobile/Component.js +4 -3
- package/esm/components/select-mobile/index.d.ts +1 -1
- package/esm/components/select-mobile/index.js +4 -3
- package/esm/components/select-modal-mobile/Component.js +4 -3
- package/esm/components/select-modal-mobile/index.d.ts +1 -1
- package/esm/components/select-modal-mobile/index.js +4 -3
- package/esm/components/virtual-options-list/Component.js +4 -4
- package/esm/components/virtual-options-list/index.css +15 -15
- package/{cssm/hook-4b555174.d.ts → esm/hook-b4e70cb0.d.ts} +15 -4
- package/esm/index-3885b0d7.d.ts +1 -1
- package/esm/index.js +5 -4
- package/esm/mobile.d.ts +4 -0
- package/esm/mobile.js +41 -0
- package/esm/presets/index.d.ts +1 -1
- package/esm/presets/index.js +4 -3
- package/esm/presets/useLazyLoading/hook.js +2 -2
- package/esm/presets/useLazyLoading/index.css +2 -2
- package/esm/presets/useSelectWithApply/hook.js +4 -3
- package/esm/presets/useSelectWithApply/options-list-with-apply/Component.js +4 -3
- package/esm/presets/useSelectWithApply/options-list-with-apply/footer/Component.js +1 -1
- package/esm/presets/useSelectWithApply/options-list-with-apply/footer/index.css +3 -12
- package/esm/presets/useSelectWithApply/options-list-with-apply/header/Component.d.ts +11 -0
- package/esm/presets/useSelectWithApply/options-list-with-apply/header/Component.js +15 -0
- package/esm/presets/useSelectWithApply/options-list-with-apply/header/index.css +23 -0
- package/esm/presets/useSelectWithApply/options-list-with-apply/index.d.ts +1 -1
- package/esm/presets/useSelectWithApply/options-list-with-apply/index.js +4 -3
- package/esm/presets/useSelectWithLoading/hook.js +1 -1
- package/esm/presets/useSelectWithLoading/index.css +2 -2
- package/esm/responsive.js +4 -3
- package/{hook-4b555174.d.ts → hook-b4e70cb0.d.ts} +15 -4
- package/index-3885b0d7.d.ts +1 -1
- package/index.js +5 -4
- package/mobile.d.ts +4 -0
- package/mobile.js +50 -0
- package/modern/Component-3885b0d7.d.ts +1 -1
- package/{esm/Component-2ff63ae2.d.ts → modern/Component-c22703bb.d.ts} +48 -1
- package/modern/{Component-0b711513.js → Component-c22703bb.js} +31 -17
- package/modern/Component.js +1 -1
- package/modern/Component.mobile-b2c0420d.d.ts +93 -0
- package/modern/Component.responsive.js +4 -3
- package/modern/components/arrow/Component.js +1 -1
- package/modern/components/arrow/index.css +3 -3
- package/modern/components/base-checkmark/Component.js +1 -1
- package/modern/components/base-checkmark/index.css +4 -4
- package/modern/components/base-option/Component.js +2 -2
- package/modern/components/base-option/index.css +13 -13
- package/modern/components/base-select/Component.js +2 -2
- package/modern/components/base-select/index.css +8 -8
- package/modern/components/base-select/index.js +1 -1
- package/modern/components/base-select-mobile/Component.d.ts +24 -0
- package/modern/components/base-select-mobile/Component.js +20 -7
- package/modern/components/base-select-mobile/footer/Component.js +3 -3
- package/modern/components/base-select-mobile/footer/index.css +5 -5
- package/modern/components/base-select-mobile/index.css +10 -10
- package/modern/components/base-select-mobile/index.js +1 -1
- package/modern/components/checkmark/Component.js +1 -1
- package/modern/components/checkmark/index.css +10 -10
- package/modern/components/checkmark-mobile/Component.js +1 -1
- package/modern/components/checkmark-mobile/index.css +6 -6
- package/modern/components/field/Component.js +1 -1
- package/modern/components/field/index.css +9 -9
- package/modern/components/index.js +5 -4
- package/modern/components/optgroup/Component.js +1 -1
- package/modern/components/optgroup/index.css +6 -6
- package/modern/components/option/Component.js +2 -2
- package/modern/components/option/index.css +20 -20
- package/modern/components/options-list/Component.js +3 -3
- package/modern/components/options-list/index.css +9 -9
- package/modern/components/select-mobile/Component.js +4 -3
- package/modern/components/select-mobile/index.d.ts +1 -1
- package/modern/components/select-mobile/index.js +4 -3
- package/modern/components/select-modal-mobile/Component.js +4 -3
- package/modern/components/select-modal-mobile/index.d.ts +1 -1
- package/modern/components/select-modal-mobile/index.js +4 -3
- package/modern/components/virtual-options-list/Component.js +3 -3
- package/modern/components/virtual-options-list/index.css +15 -15
- package/modern/{hook-4b555174.d.ts → hook-b4e70cb0.d.ts} +15 -4
- package/modern/index-3885b0d7.d.ts +1 -1
- package/modern/index.js +5 -4
- package/modern/mobile.d.ts +4 -0
- package/modern/mobile.js +40 -0
- package/modern/presets/index.d.ts +1 -1
- package/modern/presets/index.js +4 -3
- package/modern/presets/useLazyLoading/hook.js +2 -2
- package/modern/presets/useLazyLoading/index.css +2 -2
- package/modern/presets/useSelectWithApply/hook.js +4 -3
- package/modern/presets/useSelectWithApply/options-list-with-apply/Component.js +4 -3
- package/modern/presets/useSelectWithApply/options-list-with-apply/footer/Component.js +1 -1
- package/modern/presets/useSelectWithApply/options-list-with-apply/footer/index.css +3 -12
- package/modern/presets/useSelectWithApply/options-list-with-apply/header/Component.d.ts +11 -0
- package/modern/presets/useSelectWithApply/options-list-with-apply/header/Component.js +11 -0
- package/modern/presets/useSelectWithApply/options-list-with-apply/header/index.css +23 -0
- package/modern/presets/useSelectWithApply/options-list-with-apply/index.d.ts +1 -1
- package/modern/presets/useSelectWithApply/options-list-with-apply/index.js +4 -3
- package/modern/presets/useSelectWithLoading/hook.js +1 -1
- package/modern/presets/useSelectWithLoading/index.css +2 -2
- package/modern/responsive.js +4 -3
- package/package.json +6 -6
- package/presets/index.d.ts +1 -1
- package/presets/index.js +4 -3
- package/presets/useLazyLoading/hook.js +2 -2
- package/presets/useLazyLoading/index.css +2 -2
- package/presets/useSelectWithApply/hook.js +4 -3
- package/presets/useSelectWithApply/options-list-with-apply/Component.js +4 -3
- package/presets/useSelectWithApply/options-list-with-apply/footer/Component.js +1 -1
- package/presets/useSelectWithApply/options-list-with-apply/footer/index.css +3 -12
- package/presets/useSelectWithApply/options-list-with-apply/header/Component.d.ts +11 -0
- package/presets/useSelectWithApply/options-list-with-apply/header/Component.js +24 -0
- package/presets/useSelectWithApply/options-list-with-apply/header/index.css +23 -0
- package/presets/useSelectWithApply/options-list-with-apply/index.d.ts +1 -1
- package/presets/useSelectWithApply/options-list-with-apply/index.js +4 -3
- package/presets/useSelectWithLoading/hook.js +1 -1
- package/presets/useSelectWithLoading/index.css +2 -2
- package/responsive.js +4 -3
- /package/esm/{getDataTestId-d8d91b2e.d.ts → getDataTestId-416fe68c.d.ts} +0 -0
- /package/esm/{getDataTestId-d8d91b2e.js → getDataTestId-416fe68c.js} +0 -0
- /package/esm/{intersection-observer-210062db.d.ts → intersection-observer-71fc11ef.d.ts} +0 -0
- /package/esm/{intersection-observer-210062db.js → intersection-observer-71fc11ef.js} +0 -0
- /package/{getDataTestId-d8391785.d.ts → getDataTestId-e8d9eb23.d.ts} +0 -0
- /package/{getDataTestId-d8391785.js → getDataTestId-e8d9eb23.js} +0 -0
- /package/{intersection-observer-131fbe35.d.ts → intersection-observer-c227d471.d.ts} +0 -0
- /package/{intersection-observer-131fbe35.js → intersection-observer-c227d471.js} +0 -0
- /package/modern/{getDataTestId-b301a7a9.d.ts → getDataTestId-03736ddc.d.ts} +0 -0
- /package/modern/{getDataTestId-b301a7a9.js → getDataTestId-03736ddc.js} +0 -0
- /package/modern/{intersection-observer-210062db.d.ts → intersection-observer-71fc11ef.d.ts} +0 -0
- /package/modern/{intersection-observer-210062db.js → intersection-observer-71fc11ef.js} +0 -0
|
@@ -22,6 +22,18 @@ type SelectMobileProps = Omit<BaseSelectProps, 'Checkmark' | 'onScroll'> & {
|
|
|
22
22
|
* Дополнительные пропсы шторки
|
|
23
23
|
*/
|
|
24
24
|
bottomSheetProps?: Partial<BottomSheetProps>;
|
|
25
|
+
/**
|
|
26
|
+
* Дополнительные пропсы модалки
|
|
27
|
+
*/
|
|
28
|
+
modalProps?: Partial<React.ComponentProps<typeof ModalMobile>>;
|
|
29
|
+
/**
|
|
30
|
+
* Дополнительные пропсы шапки модалки
|
|
31
|
+
*/
|
|
32
|
+
modalHeaderProps?: Partial<React.ComponentProps<typeof ModalMobile.Header>>;
|
|
33
|
+
/**
|
|
34
|
+
* Дополнительные пропсы футера модалки
|
|
35
|
+
*/
|
|
36
|
+
modalFooterProps?: Partial<React.ComponentProps<typeof ModalMobile.Footer>>;
|
|
25
37
|
};
|
|
26
38
|
declare const BaseSelectMobile: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "onScroll" | "Checkmark"> & {
|
|
27
39
|
/**
|
|
@@ -42,5 +54,17 @@ declare const BaseSelectMobile: React.ForwardRefExoticComponent<Omit<BaseSelectP
|
|
|
42
54
|
* Дополнительные пропсы шторки
|
|
43
55
|
*/
|
|
44
56
|
bottomSheetProps?: Partial<BottomSheetProps> | undefined;
|
|
57
|
+
/**
|
|
58
|
+
* Дополнительные пропсы модалки
|
|
59
|
+
*/
|
|
60
|
+
modalProps?: Partial<import("../../Component.mobile-b2c0420d").ModalMobileProps & React.RefAttributes<HTMLDivElement>> | undefined;
|
|
61
|
+
/**
|
|
62
|
+
* Дополнительные пропсы шапки модалки
|
|
63
|
+
*/
|
|
64
|
+
modalHeaderProps?: Partial<import("../../Component.mobile-b2c0420d").HeaderProps> | undefined;
|
|
65
|
+
/**
|
|
66
|
+
* Дополнительные пропсы футера модалки
|
|
67
|
+
*/
|
|
68
|
+
modalFooterProps?: Partial<import("../../Component.mobile-b2c0420d").FooterProps> | undefined;
|
|
45
69
|
} & React.RefAttributes<unknown>>;
|
|
46
70
|
export { SelectMobileProps, BaseSelectMobile };
|
|
@@ -9,7 +9,7 @@ var cn = require('classnames');
|
|
|
9
9
|
var downshift = require('downshift');
|
|
10
10
|
var coreComponentsBottomSheet = require('@alfalab/core-components-bottom-sheet');
|
|
11
11
|
var mobile = require('@alfalab/core-components-modal/mobile');
|
|
12
|
-
var getDataTestId = require('../../getDataTestId-
|
|
12
|
+
var getDataTestId = require('../../getDataTestId-e8d9eb23.js');
|
|
13
13
|
var utils = require('../../utils.js');
|
|
14
14
|
var components_arrow_Component = require('../arrow/Component.js');
|
|
15
15
|
var components_field_Component = require('../field/Component.js');
|
|
@@ -34,16 +34,17 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
|
34
34
|
var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
|
|
35
35
|
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
36
36
|
|
|
37
|
-
var styles = {"component":"
|
|
37
|
+
var styles = {"component":"select__component_ggaik","sheet":"select__sheet_ggaik","sheetContent":"select__sheetContent_ggaik","sheetContainer":"select__sheetContainer_ggaik","block":"select__block_ggaik","option":"select__option_ggaik","optionGroup":"select__optionGroup_ggaik"};
|
|
38
38
|
require('./index.css')
|
|
39
39
|
|
|
40
40
|
var BaseSelectMobile = React.forwardRef(function (_a, ref) {
|
|
41
41
|
var _b;
|
|
42
|
-
var dataTestId = _a.dataTestId, className = _a.className, fieldClassName = _a.fieldClassName, optionsListClassName = _a.optionsListClassName, optionClassName = _a.optionClassName, optionGroupClassName = _a.optionGroupClassName, optionsListProps = _a.optionsListProps, _c = _a.options, options = _c === void 0 ? [] : _c, _d = _a.autocomplete, autocomplete = _d === void 0 ? false : _d, _e = _a.multiple, multiple = _e === void 0 ? false : _e, _f = _a.allowUnselect, allowUnselect = _f === void 0 ? false : _f, _g = _a.disabled, disabled = _g === void 0 ? false : _g, _h = _a.closeOnSelect, closeOnSelect = _h === void 0 ? !multiple : _h, _j = _a.circularNavigation, circularNavigation = _j === void 0 ? false : _j, _k = _a.defaultOpen, defaultOpen = _k === void 0 ? false : _k, openProp = _a.open, _l = _a.optionsListWidth, optionsListWidth = _l === void 0 ? 'content' : _l, name = _a.name, id = _a.id, _m = _a.selected, selected = _m === void 0 ? [] : _m, _o = _a.size, size = _o === void 0 ? 'm' : _o, _p = _a.optionsSize, optionsSize = _p === void 0 ? 'm' : _p, error = _a.error, hint = _a.hint, block = _a.block, label = _a.label, labelView = _a.labelView, placeholder = _a.placeholder, _q = _a.fieldProps, fieldProps = _q === void 0 ? {} : _q, _r = _a.optionProps, optionProps = _r === void 0 ? {} : _r, valueRenderer = _a.valueRenderer, onChange = _a.onChange, onOpen = _a.onOpen, onFocus = _a.onFocus, _s = _a.Arrow, Arrow = _s === void 0 ? components_arrow_Component.Arrow : _s, _t = _a.Field, Field = _t === void 0 ? components_field_Component.Field : _t, _u = _a.Optgroup, Optgroup = _u === void 0 ? components_optgroup_Component.Optgroup : _u, _v = _a.Option, Option = _v === void 0 ? components_option_Component.Option : _v, _w = _a.OptionsList, OptionsList = _w === void 0 ? components_optionsList_Component.OptionsList : _w, swipeable = _a.swipeable, footer = _a.footer, isBottomSheet = _a.isBottomSheet, bottomSheetProps = _a.bottomSheetProps, _x = _a.showEmptyOptionsList, showEmptyOptionsList = _x === void 0 ? false : _x;
|
|
42
|
+
var dataTestId = _a.dataTestId, className = _a.className, fieldClassName = _a.fieldClassName, optionsListClassName = _a.optionsListClassName, optionClassName = _a.optionClassName, optionGroupClassName = _a.optionGroupClassName, optionsListProps = _a.optionsListProps, _c = _a.options, options = _c === void 0 ? [] : _c, _d = _a.autocomplete, autocomplete = _d === void 0 ? false : _d, _e = _a.multiple, multiple = _e === void 0 ? false : _e, _f = _a.allowUnselect, allowUnselect = _f === void 0 ? false : _f, _g = _a.disabled, disabled = _g === void 0 ? false : _g, _h = _a.closeOnSelect, closeOnSelect = _h === void 0 ? !multiple : _h, _j = _a.circularNavigation, circularNavigation = _j === void 0 ? false : _j, _k = _a.defaultOpen, defaultOpen = _k === void 0 ? false : _k, openProp = _a.open, _l = _a.optionsListWidth, optionsListWidth = _l === void 0 ? 'content' : _l, name = _a.name, id = _a.id, _m = _a.selected, selected = _m === void 0 ? [] : _m, _o = _a.size, size = _o === void 0 ? 'm' : _o, _p = _a.optionsSize, optionsSize = _p === void 0 ? 'm' : _p, error = _a.error, hint = _a.hint, block = _a.block, label = _a.label, labelView = _a.labelView, placeholder = _a.placeholder, _q = _a.fieldProps, fieldProps = _q === void 0 ? {} : _q, _r = _a.optionProps, optionProps = _r === void 0 ? {} : _r, valueRenderer = _a.valueRenderer, onChange = _a.onChange, onOpen = _a.onOpen, onFocus = _a.onFocus, _s = _a.Arrow, Arrow = _s === void 0 ? components_arrow_Component.Arrow : _s, _t = _a.Field, Field = _t === void 0 ? components_field_Component.Field : _t, _u = _a.Optgroup, Optgroup = _u === void 0 ? components_optgroup_Component.Optgroup : _u, _v = _a.Option, Option = _v === void 0 ? components_option_Component.Option : _v, _w = _a.OptionsList, OptionsList = _w === void 0 ? components_optionsList_Component.OptionsList : _w, swipeable = _a.swipeable, footer = _a.footer, isBottomSheet = _a.isBottomSheet, bottomSheetProps = _a.bottomSheetProps, modalProps = _a.modalProps, modalHeaderProps = _a.modalHeaderProps, modalFooterProps = _a.modalFooterProps, _x = _a.showEmptyOptionsList, showEmptyOptionsList = _x === void 0 ? false : _x;
|
|
43
43
|
var rootRef = React.useRef(null);
|
|
44
44
|
var fieldRef = React.useRef(null);
|
|
45
45
|
var listRef = React.useRef(null);
|
|
46
46
|
var initiatorRef = React.useRef(null);
|
|
47
|
+
var alreadyClickedRef = React.useRef(false);
|
|
47
48
|
var itemToString = function (option) { return (option ? option.key : ''); };
|
|
48
49
|
var _y = React.useMemo(function () { return utils.processOptions(options, selected); }, [options, selected]), flatOptions = _y.flatOptions, selectedOptions = _y.selectedOptions;
|
|
49
50
|
var scrollableContainerRef = React.useRef(null);
|
|
@@ -107,7 +108,12 @@ var BaseSelectMobile = React.forwardRef(function (_a, ref) {
|
|
|
107
108
|
case downshift.useCombobox.stateChangeTypes.InputKeyDownEnter:
|
|
108
109
|
case downshift.useCombobox.stateChangeTypes.ItemClick:
|
|
109
110
|
initiatorRef.current = selectedItem;
|
|
110
|
-
if (selectedItem && !selectedItem.disabled) {
|
|
111
|
+
if (selectedItem && !selectedItem.disabled && !alreadyClickedRef.current) {
|
|
112
|
+
alreadyClickedRef.current = true;
|
|
113
|
+
// TODO!!! Проблема downshift + React 18. ItemClick срабатывает дважды. См https://github.com/downshift-js/downshift/issues/1384
|
|
114
|
+
setTimeout(function () {
|
|
115
|
+
alreadyClickedRef.current = false;
|
|
116
|
+
});
|
|
111
117
|
var alreadySelected = selectedItems.includes(selectedItem);
|
|
112
118
|
var allowRemove = allowUnselect || (multiple && selectedItems.length > 1);
|
|
113
119
|
if (alreadySelected && allowRemove) {
|
|
@@ -215,9 +221,21 @@ var BaseSelectMobile = React.forwardRef(function (_a, ref) {
|
|
|
215
221
|
: undefined,
|
|
216
222
|
}, dataTestId: getDataTestId.getDataTestId(dataTestId, 'field') }, fieldProps)),
|
|
217
223
|
name && renderValue(),
|
|
218
|
-
isBottomSheet ? (React__default.default.createElement(coreComponentsBottomSheet.BottomSheet, tslib.__assign({ open: open, onClose: handleClose, className: styles.sheet, contentClassName: styles.sheetContent, containerClassName: styles.sheetContainer, title: label || placeholder, actionButton: footer, stickyHeader: true, hasCloser: true, swipeable: swipeable, scrollableContainerRef: scrollableContainerRef }, bottomSheetProps), renderOptionsList())) : (React__default.default.createElement(mobile.ModalMobile, { open: open,
|
|
219
|
-
|
|
220
|
-
|
|
224
|
+
isBottomSheet ? (React__default.default.createElement(coreComponentsBottomSheet.BottomSheet, tslib.__assign({ open: open, onClose: handleClose, className: styles.sheet, contentClassName: styles.sheetContent, containerClassName: styles.sheetContainer, title: label || placeholder, actionButton: footer, stickyHeader: true, hasCloser: true, swipeable: swipeable, scrollableContainerRef: scrollableContainerRef }, bottomSheetProps), renderOptionsList())) : (React__default.default.createElement(mobile.ModalMobile, tslib.__assign({ open: open, hasCloser: true }, modalProps, { onClose: function () {
|
|
225
|
+
var _a;
|
|
226
|
+
var args = [];
|
|
227
|
+
for (var _i = 0; _i < arguments.length; _i++) {
|
|
228
|
+
args[_i] = arguments[_i];
|
|
229
|
+
}
|
|
230
|
+
handleClose();
|
|
231
|
+
(_a = modalProps === null || modalProps === void 0 ? void 0 : modalProps.onClose) === null || _a === void 0 ? void 0 : _a.call.apply(_a, tslib.__spreadArray([modalProps], args, false));
|
|
232
|
+
}, contentClassName: cn__default.default(styles.sheetContent, modalProps === null || modalProps === void 0 ? void 0 : modalProps.contentClassName), ref: mergeRefs__default.default([
|
|
233
|
+
scrollableContainerRef,
|
|
234
|
+
modalProps === null || modalProps === void 0 ? void 0 : modalProps.ref,
|
|
235
|
+
]) }),
|
|
236
|
+
React__default.default.createElement(mobile.ModalMobile.Header, tslib.__assign({ hasCloser: true, sticky: true }, modalHeaderProps), label || placeholder),
|
|
237
|
+
renderOptionsList(),
|
|
238
|
+
(modalFooterProps === null || modalFooterProps === void 0 ? void 0 : modalFooterProps.children) && React__default.default.createElement(mobile.ModalMobile.Footer, tslib.__assign({}, modalFooterProps))))));
|
|
221
239
|
});
|
|
222
240
|
|
|
223
241
|
exports.BaseSelectMobile = BaseSelectMobile;
|
|
@@ -12,7 +12,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
|
|
|
12
12
|
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
13
13
|
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
14
14
|
|
|
15
|
-
var styles = {"footer":"
|
|
15
|
+
var styles = {"footer":"select__footer_1di6u","button":"select__button_1di6u","highlighted":"select__highlighted_1di6u"};
|
|
16
16
|
require('./index.css')
|
|
17
17
|
|
|
18
18
|
var Footer = function (_a) {
|
|
@@ -27,8 +27,8 @@ var Footer = function (_a) {
|
|
|
27
27
|
tabIndex: 0, className: cn__default.default(styles.footer, (_b = {},
|
|
28
28
|
_b[styles.highlighted] = footerHighlighted,
|
|
29
29
|
_b)) },
|
|
30
|
-
React__default.default.createElement(coreComponentsButton.Button, { size: 's', view: '
|
|
31
|
-
|
|
30
|
+
showClear && (React__default.default.createElement(coreComponentsButton.Button, { size: 's', view: 'secondary', className: styles.button, onClick: handleClear }, "\u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C")),
|
|
31
|
+
React__default.default.createElement(coreComponentsButton.Button, { size: 's', view: 'primary', className: styles.button, onClick: handleApply }, "\u041F\u0440\u0438\u043C\u0435\u043D\u0438\u0442\u044C")));
|
|
32
32
|
};
|
|
33
33
|
|
|
34
34
|
exports.Footer = Footer;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 1j6qf */
|
|
2
2
|
:root {
|
|
3
3
|
} /* deprecated */ :root {
|
|
4
4
|
--color-light-bg-primary: #fff;
|
|
@@ -26,17 +26,17 @@
|
|
|
26
26
|
/* checkmark */
|
|
27
27
|
|
|
28
28
|
/* optgroup */
|
|
29
|
-
} .
|
|
29
|
+
} .select__footer_1di6u {
|
|
30
30
|
display: flex;
|
|
31
31
|
box-sizing: border-box;
|
|
32
32
|
width: 100%;
|
|
33
33
|
padding: var(--gap-m) var(--gap-m);
|
|
34
34
|
background-color: var(--color-light-bg-primary)
|
|
35
|
-
} .
|
|
35
|
+
} .select__footer_1di6u .select__button_1di6u:first-of-type {
|
|
36
36
|
margin-right: var(--gap-m);
|
|
37
|
-
} .
|
|
37
|
+
} .select__button_1di6u {
|
|
38
38
|
width: 50%;
|
|
39
|
-
} .
|
|
39
|
+
} .select__highlighted_1di6u {
|
|
40
40
|
border-top: 1px solid var(--color-light-border-primary);
|
|
41
41
|
background-color: var(--color-light-bg-primary);
|
|
42
42
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 1n2l2 */
|
|
2
2
|
:root {
|
|
3
3
|
} /* 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 */
|
|
4
4
|
} :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 */
|
|
@@ -27,27 +27,27 @@
|
|
|
27
27
|
/* checkmark */
|
|
28
28
|
|
|
29
29
|
/* optgroup */
|
|
30
|
-
} .
|
|
30
|
+
} .select__component_ggaik {
|
|
31
31
|
width: max-content;
|
|
32
32
|
position: relative;
|
|
33
33
|
outline: 0;
|
|
34
|
-
} .
|
|
34
|
+
} .select__sheet_ggaik {
|
|
35
35
|
overflow: hidden;
|
|
36
|
-
} .
|
|
36
|
+
} .select__sheetContent_ggaik {
|
|
37
37
|
padding: 0;
|
|
38
|
-
} .
|
|
38
|
+
} .select__sheetContainer_ggaik {
|
|
39
39
|
padding: 0;
|
|
40
|
-
} .
|
|
40
|
+
} .select__block_ggaik {
|
|
41
41
|
width: 100%;
|
|
42
42
|
} /* width: max-content; fix for IE */ @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
|
|
43
|
-
.
|
|
43
|
+
.select__component_ggaik {
|
|
44
44
|
float: left;
|
|
45
45
|
clear: left;
|
|
46
46
|
}
|
|
47
|
-
} .
|
|
47
|
+
} .select__option_ggaik {
|
|
48
48
|
padding: var(--gap-2xs) var(--gap-l) var(--gap-2xs) var(--gap-m)
|
|
49
|
-
} .
|
|
49
|
+
} .select__option_ggaik:before {
|
|
50
50
|
display: none;
|
|
51
|
-
} .
|
|
51
|
+
} .select__optionGroup_ggaik {
|
|
52
52
|
padding: var(--gap-m) var(--gap-m) var(--gap-xs);
|
|
53
53
|
}
|
|
@@ -10,7 +10,7 @@ require('classnames');
|
|
|
10
10
|
require('downshift');
|
|
11
11
|
require('@alfalab/core-components-bottom-sheet');
|
|
12
12
|
require('@alfalab/core-components-modal/mobile');
|
|
13
|
-
require('../../getDataTestId-
|
|
13
|
+
require('../../getDataTestId-e8d9eb23.js');
|
|
14
14
|
require('../../utils.js');
|
|
15
15
|
require('../arrow/Component.js');
|
|
16
16
|
require('@alfalab/icons-glyph/ChevronDownMIcon');
|
|
@@ -15,7 +15,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
|
15
15
|
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
16
16
|
var CheckmarkMIcon__default = /*#__PURE__*/_interopDefaultCompat(CheckmarkMIcon);
|
|
17
17
|
|
|
18
|
-
var styles = {"checkmark":"
|
|
18
|
+
var styles = {"checkmark":"select__checkmark_1sddt","after":"select__after_1sddt","single":"select__single_1sddt","selected":"select__selected_1sddt","before":"select__before_1sddt","multiple":"select__multiple_1sddt","colorIcon":"select__colorIcon_1sddt"};
|
|
19
19
|
require('./index.css')
|
|
20
20
|
|
|
21
21
|
var Checkmark = function (_a) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 1hquc */
|
|
2
2
|
:root {
|
|
3
3
|
} /* deprecated */ :root {
|
|
4
4
|
--color-light-graphic-positive: #2fc26e;
|
|
@@ -39,12 +39,12 @@
|
|
|
39
39
|
--select-checkmark-border-radius: var(--border-radius-circle);
|
|
40
40
|
|
|
41
41
|
/* optgroup */
|
|
42
|
-
} .
|
|
42
|
+
} .select__checkmark_1sddt {
|
|
43
43
|
flex-shrink: 0;
|
|
44
44
|
margin: var(--select-checkmark-margin)
|
|
45
|
-
} .
|
|
45
|
+
} .select__checkmark_1sddt.select__after_1sddt {
|
|
46
46
|
margin: var(--select-checkmark-margin-after);
|
|
47
|
-
} .
|
|
47
|
+
} .select__single_1sddt {
|
|
48
48
|
display: flex;
|
|
49
49
|
align-items: center;
|
|
50
50
|
justify-content: center;
|
|
@@ -54,17 +54,17 @@
|
|
|
54
54
|
border-radius: var(--select-checkmark-border-radius);
|
|
55
55
|
width: var(--select-checkmark-size);
|
|
56
56
|
height: var(--select-checkmark-size)
|
|
57
|
-
} .
|
|
57
|
+
} .select__single_1sddt.select__selected_1sddt {
|
|
58
58
|
opacity: 1;
|
|
59
|
-
} .
|
|
59
|
+
} .select__before_1sddt {
|
|
60
60
|
display: var(--select-checkmark-before-display)
|
|
61
|
-
} .
|
|
61
|
+
} .select__before_1sddt.select__multiple_1sddt {
|
|
62
62
|
margin-right: var(--gap-s);
|
|
63
63
|
display: var(--select-checkmark-before-display-multiple);
|
|
64
|
-
} .
|
|
64
|
+
} .select__after_1sddt {
|
|
65
65
|
display: var(--select-checkmark-after-display)
|
|
66
|
-
} .
|
|
66
|
+
} .select__after_1sddt.select__single_1sddt {
|
|
67
67
|
display: var(--select-checkmark-after-display-single);
|
|
68
|
-
} .
|
|
68
|
+
} .select__colorIcon_1sddt {
|
|
69
69
|
color: var(--color-light-graphic-positive);
|
|
70
70
|
}
|
|
@@ -11,7 +11,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
|
|
|
11
11
|
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
12
12
|
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
13
13
|
|
|
14
|
-
var styles = {"checkmark":"
|
|
14
|
+
var styles = {"checkmark":"select__checkmark_1a50f","selected":"select__selected_1a50f","displayIcon":"select__displayIcon_1a50f","displayBadge":"select__displayBadge_1a50f"};
|
|
15
15
|
require('./index.css')
|
|
16
16
|
|
|
17
17
|
var Checkmark = function (_a) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 1yz33 */
|
|
2
2
|
:root {
|
|
3
3
|
} /* 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 */
|
|
4
4
|
} :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 */
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
--select-mobile-checkmark-display-badge: none;
|
|
26
26
|
|
|
27
27
|
/* optgroup */
|
|
28
|
-
} .
|
|
28
|
+
} .select__checkmark_1a50f {
|
|
29
29
|
flex-shrink: 0;
|
|
30
30
|
display: flex;
|
|
31
31
|
align-items: center;
|
|
@@ -33,12 +33,12 @@
|
|
|
33
33
|
width: 24px;
|
|
34
34
|
height: 24px;
|
|
35
35
|
opacity: 0
|
|
36
|
-
} .
|
|
36
|
+
} .select__checkmark_1a50f:first-child {
|
|
37
37
|
display: none;
|
|
38
|
-
} .
|
|
38
|
+
} .select__checkmark_1a50f.select__selected_1a50f {
|
|
39
39
|
opacity: 1;
|
|
40
|
-
} .
|
|
40
|
+
} .select__displayIcon_1a50f {
|
|
41
41
|
display: var(--select-mobile-checkmark-display-icon);
|
|
42
|
-
} .
|
|
42
|
+
} .select__displayBadge_1a50f {
|
|
43
43
|
display: var(--select-mobile-checkmark-display-badge);
|
|
44
44
|
}
|
|
@@ -14,7 +14,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
|
|
|
14
14
|
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
15
15
|
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
16
16
|
|
|
17
|
-
var styles = {"component":"
|
|
17
|
+
var styles = {"component":"select__component_13vbk","field":"select__field_13vbk","disabled":"select__disabled_13vbk","arrow":"select__arrow_13vbk","placeholder":"select__placeholder_13vbk","contentWrapper":"select__contentWrapper_13vbk","value":"select__value_13vbk","focusVisible":"select__focusVisible_13vbk"};
|
|
18
18
|
require('./index.css')
|
|
19
19
|
|
|
20
20
|
var Field = function (_a) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 97e92 */
|
|
2
2
|
:root {
|
|
3
3
|
} /* deprecated */ :root {
|
|
4
4
|
--color-light-border-link: #0072ef;
|
|
@@ -28,18 +28,18 @@
|
|
|
28
28
|
/* checkmark */
|
|
29
29
|
|
|
30
30
|
/* optgroup */
|
|
31
|
-
} .
|
|
31
|
+
} .select__component_13vbk {
|
|
32
32
|
width: 100%;
|
|
33
33
|
outline: none;
|
|
34
|
-
} .
|
|
34
|
+
} .select__field_13vbk:not(.select__disabled_13vbk) {
|
|
35
35
|
cursor: pointer
|
|
36
|
-
} .
|
|
36
|
+
} .select__field_13vbk:not(.select__disabled_13vbk):hover .select__arrow_13vbk {
|
|
37
37
|
opacity: var(--select-arrow-hover-opacity);
|
|
38
|
-
} .
|
|
38
|
+
} .select__disabled_13vbk {
|
|
39
39
|
cursor: var(--disabled-cursor);
|
|
40
|
-
} /* TODO: Заюзать переменные из инпута */ .
|
|
40
|
+
} /* TODO: Заюзать переменные из инпута */ .select__placeholder_13vbk {
|
|
41
41
|
color: var(--color-light-text-secondary);
|
|
42
|
-
} .
|
|
42
|
+
} .select__contentWrapper_13vbk {
|
|
43
43
|
font-size: 16px;
|
|
44
44
|
line-height: 20px;
|
|
45
45
|
font-weight: 400;
|
|
@@ -48,11 +48,11 @@
|
|
|
48
48
|
text-overflow: ellipsis;
|
|
49
49
|
overflow: hidden;
|
|
50
50
|
width: 100%;
|
|
51
|
-
} .
|
|
51
|
+
} .select__value_13vbk {
|
|
52
52
|
overflow: hidden;
|
|
53
53
|
text-overflow: ellipsis;
|
|
54
54
|
text-align: left;
|
|
55
|
-
} .
|
|
55
|
+
} .select__focusVisible_13vbk {
|
|
56
56
|
outline: 2px solid var(--focus-color);
|
|
57
57
|
outline-offset: 2px;
|
|
58
58
|
}
|
package/components/index.js
CHANGED
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var components_arrow_Component = require('./arrow/Component.js');
|
|
6
6
|
var components_baseSelect_Component = require('./base-select/Component.js');
|
|
7
|
-
var presets_useSelectWithApply_optionsListWithApply_Component = require('../Component-
|
|
7
|
+
var presets_useSelectWithApply_optionsListWithApply_Component = require('../Component-3eb05f44.js');
|
|
8
8
|
var components_field_Component = require('./field/Component.js');
|
|
9
9
|
var components_optgroup_Component = require('./optgroup/Component.js');
|
|
10
10
|
var components_option_Component = require('./option/Component.js');
|
|
@@ -20,10 +20,12 @@ require('@juggle/resize-observer');
|
|
|
20
20
|
require('downshift');
|
|
21
21
|
require('@alfalab/core-components-popover');
|
|
22
22
|
require('@alfalab/hooks');
|
|
23
|
-
require('../getDataTestId-
|
|
23
|
+
require('../getDataTestId-e8d9eb23.js');
|
|
24
24
|
require('../utils.js');
|
|
25
25
|
require('./native-select/Component.js');
|
|
26
26
|
require('../Component.js');
|
|
27
|
+
require('../presets/useSelectWithApply/options-list-with-apply/header/Component.js');
|
|
28
|
+
require('@alfalab/core-components-checkbox');
|
|
27
29
|
require('./base-select-mobile/Component.js');
|
|
28
30
|
require('@alfalab/core-components-bottom-sheet');
|
|
29
31
|
require('@alfalab/core-components-modal/mobile');
|
|
@@ -32,11 +34,10 @@ require('@alfalab/core-components-base-modal');
|
|
|
32
34
|
require('@alfalab/core-components-button');
|
|
33
35
|
require('@alfalab/core-components-form-control');
|
|
34
36
|
require('@alfalab/core-components-badge');
|
|
35
|
-
require('@alfalab/core-components-checkbox');
|
|
36
37
|
require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
|
|
37
38
|
require('@alfalab/icons-glyph/CheckmarkMIcon');
|
|
38
39
|
require('@alfalab/core-components-skeleton');
|
|
39
|
-
require('../intersection-observer-
|
|
40
|
+
require('../intersection-observer-c227d471.js');
|
|
40
41
|
require('../consts.js');
|
|
41
42
|
require('../presets/useSelectWithApply/options-list-with-apply/footer/Component.js');
|
|
42
43
|
require('./checkmark/Component.js');
|
|
@@ -10,7 +10,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
|
|
|
10
10
|
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
11
11
|
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
12
12
|
|
|
13
|
-
var styles = {"optgroup":"
|
|
13
|
+
var styles = {"optgroup":"select__optgroup_148aj","label":"select__label_148aj","l":"select__l_148aj","xl":"select__xl_148aj"};
|
|
14
14
|
require('./index.css')
|
|
15
15
|
|
|
16
16
|
var Optgroup = function (_a) {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 6u5ry */
|
|
2
2
|
:root {
|
|
3
3
|
} /* deprecated */ :root {
|
|
4
4
|
--color-light-bg-primary: #fff;
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
--select-optgroup-right-padding: var(--gap-s);
|
|
36
36
|
--select-optgroup-l-left-padding: var(--gap-m);
|
|
37
37
|
--select-optgroup-l-right-padding: var(--gap-m);
|
|
38
|
-
} .
|
|
38
|
+
} .select__optgroup_148aj {
|
|
39
39
|
position: relative;
|
|
40
40
|
display: flex;
|
|
41
41
|
align-items: center;
|
|
@@ -44,9 +44,9 @@
|
|
|
44
44
|
box-sizing: border-box;
|
|
45
45
|
background: var(--select-optgroup-background);
|
|
46
46
|
min-height: 40px
|
|
47
|
-
} .
|
|
47
|
+
} .select__optgroup_148aj + *[role='option']:before {
|
|
48
48
|
display: none;
|
|
49
|
-
} .
|
|
49
|
+
} .select__label_148aj {
|
|
50
50
|
font-size: 12px;
|
|
51
51
|
line-height: 16px;
|
|
52
52
|
font-weight: 500;
|
|
@@ -55,8 +55,8 @@
|
|
|
55
55
|
|
|
56
56
|
display: block;
|
|
57
57
|
color: var(--select-optgroup-color);
|
|
58
|
-
} .
|
|
59
|
-
.
|
|
58
|
+
} .select__l_148aj,
|
|
59
|
+
.select__xl_148aj {
|
|
60
60
|
padding-left: var(--select-optgroup-l-left-padding);
|
|
61
61
|
padding-right: var(--select-optgroup-l-right-padding);
|
|
62
62
|
}
|
|
@@ -17,7 +17,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
|
|
|
17
17
|
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
18
18
|
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
19
19
|
|
|
20
|
-
var styles = {"option":"
|
|
20
|
+
var styles = {"option":"select__option_2ab4z","disabled":"select__disabled_2ab4z","s":"select__s_2ab4z","m":"select__m_2ab4z","l":"select__l_2ab4z","xl":"select__xl_2ab4z","selected":"select__selected_2ab4z","highlighted":"select__highlighted_2ab4z","content":"select__content_2ab4z","textContent":"select__textContent_2ab4z"};
|
|
21
21
|
require('./index.css')
|
|
22
22
|
|
|
23
23
|
var Option = function (_a) {
|
|
@@ -26,7 +26,7 @@ var Option = function (_a) {
|
|
|
26
26
|
var content = children || option.content || option.key;
|
|
27
27
|
var _f = option.showCheckMark, showCheckMark = _f === void 0 ? true : _f;
|
|
28
28
|
return (React__default.default.createElement("div", tslib.__assign({}, innerProps, { className: cn__default.default(styles.option, styles[size], className, (_b = {},
|
|
29
|
-
_b[styles.highlighted] = highlighted,
|
|
29
|
+
_b[styles.highlighted] = !mobile && highlighted,
|
|
30
30
|
_b[styles.selected] = selected,
|
|
31
31
|
_b[styles.disabled] = disabled,
|
|
32
32
|
_b)), "data-test-id": dataTestId }),
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: 1kdce */
|
|
2
2
|
:root {
|
|
3
3
|
} /* deprecated */ :root {
|
|
4
4
|
--color-light-bg-primary: #fff;
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
/* checkmark */
|
|
54
54
|
|
|
55
55
|
/* optgroup */
|
|
56
|
-
} .
|
|
56
|
+
} .select__option_2ab4z {
|
|
57
57
|
font-size: 16px;
|
|
58
58
|
line-height: 20px;
|
|
59
59
|
font-weight: 400;
|
|
@@ -68,10 +68,10 @@
|
|
|
68
68
|
box-sizing: border-box;
|
|
69
69
|
position: relative;
|
|
70
70
|
cursor: pointer
|
|
71
|
-
} .
|
|
71
|
+
} .select__option_2ab4z:not(.select__disabled_2ab4z):active {
|
|
72
72
|
background: var(--select-option-active-background);
|
|
73
73
|
color: var(--select-option-active-color);
|
|
74
|
-
} .
|
|
74
|
+
} .select__option_2ab4z:before {
|
|
75
75
|
content: '';
|
|
76
76
|
position: absolute;
|
|
77
77
|
left: var(--select-option-left-padding);
|
|
@@ -81,46 +81,46 @@
|
|
|
81
81
|
background: var(--select-option-divider-background);
|
|
82
82
|
display: var(--select-option-divider-display);
|
|
83
83
|
transition: opacity 0.2s ease;
|
|
84
|
-
} .
|
|
84
|
+
} .select__option_2ab4z:first-child:before {
|
|
85
85
|
display: none;
|
|
86
|
-
} .
|
|
86
|
+
} .select__s_2ab4z {
|
|
87
87
|
min-height: var(--size-s-height);
|
|
88
|
-
} .
|
|
88
|
+
} .select__m_2ab4z {
|
|
89
89
|
min-height: var(--size-m-height);
|
|
90
|
-
} .
|
|
90
|
+
} .select__l_2ab4z {
|
|
91
91
|
min-height: var(--size-l-height);
|
|
92
|
-
} .
|
|
92
|
+
} .select__xl_2ab4z {
|
|
93
93
|
min-height: var(--size-xl-height);
|
|
94
|
-
} .
|
|
95
|
-
.
|
|
94
|
+
} .select__l_2ab4z,
|
|
95
|
+
.select__xl_2ab4z {
|
|
96
96
|
padding-left: var(--select-option-l-left-padding);
|
|
97
97
|
padding-right: var(--select-option-l-right-padding)
|
|
98
|
-
} .
|
|
98
|
+
} .select__l_2ab4z:before, .select__xl_2ab4z:before {
|
|
99
99
|
left: var(--select-option-l-left-padding);
|
|
100
100
|
right: var(--select-option-l-right-padding);
|
|
101
|
-
} .
|
|
101
|
+
} .select__selected_2ab4z {
|
|
102
102
|
background: var(--select-option-selected-background);
|
|
103
103
|
color: var(--select-option-selected-color);
|
|
104
104
|
cursor: default;
|
|
105
|
-
} .
|
|
105
|
+
} .select__highlighted_2ab4z {
|
|
106
106
|
background: var(--select-option-hover-background);
|
|
107
107
|
color: var(--select-option-hover-color)
|
|
108
|
-
} .
|
|
109
|
-
.
|
|
108
|
+
} .select__highlighted_2ab4z:before,
|
|
109
|
+
.select__highlighted_2ab4z + .select__option_2ab4z:before {
|
|
110
110
|
opacity: 0;
|
|
111
|
-
} .
|
|
111
|
+
} .select__disabled_2ab4z {
|
|
112
112
|
cursor: var(--disabled-cursor);
|
|
113
113
|
background: var(--select-option-disabled-background);
|
|
114
114
|
color: var(--select-option-disabled-color);
|
|
115
|
-
} .
|
|
115
|
+
} .select__content_2ab4z {
|
|
116
116
|
overflow: hidden;
|
|
117
117
|
flex: 1;
|
|
118
118
|
text-overflow: ellipsis;
|
|
119
|
-
} .
|
|
119
|
+
} .select__textContent_2ab4z {
|
|
120
120
|
padding-top: var(--gap-s);
|
|
121
121
|
padding-bottom: var(--gap-s);
|
|
122
122
|
} /* IE min-height fix */ @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
|
|
123
|
-
.
|
|
123
|
+
.select__option_2ab4z:after {
|
|
124
124
|
min-height: inherit;
|
|
125
125
|
font-size: 0;
|
|
126
126
|
content: '';
|
|
@@ -18,7 +18,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
|
18
18
|
var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
|
|
19
19
|
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
20
20
|
|
|
21
|
-
var styles = {"optionsList":"
|
|
21
|
+
var styles = {"optionsList":"select__optionsList_1iyoz","optionsListHeader":"select__optionsListHeader_1iyoz","optionsListFooter":"select__optionsListFooter_1iyoz","withBorder":"select__withBorder_1iyoz","scrollable":"select__scrollable_1iyoz","emptyPlaceholder":"select__emptyPlaceholder_1iyoz","l":"select__l_1iyoz","xl":"select__xl_1iyoz"};
|
|
22
22
|
require('./index.css')
|
|
23
23
|
|
|
24
24
|
var createCounter = function () {
|
|
@@ -28,7 +28,7 @@ var createCounter = function () {
|
|
|
28
28
|
};
|
|
29
29
|
var OptionsList = React.forwardRef(function (_a, ref) {
|
|
30
30
|
var _b;
|
|
31
|
-
var _c = _a.size, size = _c === void 0 ? 's' : _c, className = _a.className, optionGroupClassName = _a.optionGroupClassName, Option = _a.Option, getOptionProps = _a.getOptionProps, _d = _a.options, options = _d === void 0 ? [] : _d, _e = _a.Optgroup, Optgroup = _e === void 0 ? components_optgroup_Component.Optgroup : _e, dataTestId = _a.dataTestId, emptyPlaceholder = _a.emptyPlaceholder, _f = _a.visibleOptions, visibleOptions = _f === void 0 ? consts.DEFAULT_VISIBLE_OPTIONS : _f, onScroll = _a.onScroll, open = _a.open, header = _a.header, footer = _a.footer, optionsListWidth = _a.optionsListWidth, nativeScrollbarProp = _a.nativeScrollbar,
|
|
31
|
+
var _c = _a.size, size = _c === void 0 ? 's' : _c, className = _a.className, optionGroupClassName = _a.optionGroupClassName, Option = _a.Option, getOptionProps = _a.getOptionProps, _d = _a.options, options = _d === void 0 ? [] : _d, _e = _a.Optgroup, Optgroup = _e === void 0 ? components_optgroup_Component.Optgroup : _e, dataTestId = _a.dataTestId, emptyPlaceholder = _a.emptyPlaceholder, _f = _a.visibleOptions, visibleOptions = _f === void 0 ? consts.DEFAULT_VISIBLE_OPTIONS : _f, onScroll = _a.onScroll, open = _a.open, header = _a.header, footer = _a.footer, _g = _a.showFooter, showFooter = _g === void 0 ? true : _g, optionsListWidth = _a.optionsListWidth, nativeScrollbarProp = _a.nativeScrollbar, _h = _a.flatOptions, flatOptions = _h === void 0 ? [] : _h;
|
|
32
32
|
var nativeScrollbar = hooks.useMedia([[true, '(max-width: 1023px)']], false)[0];
|
|
33
33
|
nativeScrollbar = Boolean(nativeScrollbarProp !== null && nativeScrollbarProp !== void 0 ? nativeScrollbarProp : nativeScrollbar);
|
|
34
34
|
var renderOption = function (option, index) { return (React__default.default.createElement(Option, tslib.__assign({ key: option.key }, getOptionProps(option, index)))); };
|
|
@@ -57,7 +57,7 @@ var OptionsList = React.forwardRef(function (_a, ref) {
|
|
|
57
57
|
return (React__default.default.createElement("div", tslib.__assign({}, (nativeScrollbar && { 'data-test-id': dataTestId }), { className: cn__default.default(styles.optionsList, styles[size], className) }),
|
|
58
58
|
header && React__default.default.createElement("div", { className: styles.optionsListHeader }, header),
|
|
59
59
|
nativeScrollbar ? renderWithNativeScrollbar() : renderWithCustomScrollbar(),
|
|
60
|
-
footer && (React__default.default.createElement("div", { className: cn__default.default(styles.optionsListFooter, (_b = {},
|
|
60
|
+
showFooter && footer && (React__default.default.createElement("div", { className: cn__default.default(styles.optionsListFooter, (_b = {},
|
|
61
61
|
_b[styles.withBorder] = visibleOptions && flatOptions.length > visibleOptions,
|
|
62
62
|
_b)) }, footer))));
|
|
63
63
|
});
|