@alfalab/core-components-input-autocomplete 9.1.4 → 9.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-7ca84eff.d.ts +3 -2
- package/{Component.d.ts → Component.desktop.d.ts} +3 -3
- package/{Component.js → Component.desktop.js} +8 -10
- package/Component.mobile.d.ts +2 -2
- package/Component.mobile.js +23 -18
- package/Component.responsive.d.ts +13 -0
- package/Component.responsive.js +31 -0
- package/autocomplete-field/Component.d.ts +2 -2
- package/autocomplete-field/Component.js +9 -11
- package/autocomplete-field/index.css +2 -2
- package/autocomplete-field/index.js +2 -4
- package/autocomplete-mobile-field/Component.js +12 -14
- package/autocomplete-mobile-field/index.css +8 -8
- package/autocomplete-mobile-field/index.js +2 -4
- package/cssm/Component-7ca84eff.d.ts +3 -2
- package/{esm/Component.d.ts → cssm/Component.desktop.d.ts} +7 -7
- package/cssm/{Component.js → Component.desktop.js} +8 -10
- package/cssm/Component.mobile.d.ts +2 -2
- package/cssm/Component.mobile.js +24 -19
- package/cssm/Component.responsive.d.ts +13 -0
- package/cssm/Component.responsive.js +34 -0
- package/cssm/autocomplete-field/Component.d.ts +2 -2
- package/cssm/autocomplete-field/Component.js +10 -12
- package/cssm/autocomplete-field/index.js +2 -4
- package/cssm/autocomplete-mobile-field/Component.js +14 -16
- package/cssm/autocomplete-mobile-field/index.js +2 -4
- package/cssm/desktop.d.ts +2 -0
- package/cssm/desktop.js +15 -0
- package/cssm/getDataTestId-3fe0d3e6.d.ts +1 -1
- package/cssm/index-bdb4c6b9.d.ts +3 -2
- package/cssm/index.d.ts +2 -1
- package/cssm/index.js +15 -7
- package/cssm/mobile.d.ts +1 -0
- package/cssm/mobile.js +3 -5
- package/cssm/responsive.d.ts +2 -0
- package/cssm/responsive.js +24 -0
- package/cssm/{tslib.es6-9682e485.d.ts → tslib.es6-bbd6cd2a.d.ts} +0 -0
- package/cssm/{tslib.es6-9682e485.js → tslib.es6-bbd6cd2a.js} +0 -0
- package/desktop.d.ts +2 -0
- package/desktop.js +14 -0
- package/esm/Component-7ca84eff.d.ts +3 -2
- package/{cssm/Component.d.ts → esm/Component.desktop.d.ts} +7 -7
- package/esm/{Component.js → Component.desktop.js} +5 -5
- package/esm/Component.mobile.d.ts +2 -2
- package/esm/Component.mobile.js +14 -7
- package/esm/Component.responsive.d.ts +13 -0
- package/esm/Component.responsive.js +25 -0
- package/esm/autocomplete-field/Component.d.ts +2 -2
- package/esm/autocomplete-field/Component.js +2 -2
- package/esm/autocomplete-field/index.css +2 -2
- package/esm/autocomplete-field/index.js +2 -2
- package/esm/autocomplete-mobile-field/Component.js +4 -4
- package/esm/autocomplete-mobile-field/index.css +8 -8
- package/esm/autocomplete-mobile-field/index.js +2 -2
- package/esm/desktop.d.ts +2 -0
- package/esm/desktop.js +8 -0
- package/esm/getDataTestId-3fe0d3e6.d.ts +1 -1
- package/esm/index-bdb4c6b9.d.ts +3 -2
- package/esm/index.d.ts +2 -1
- package/esm/index.js +11 -4
- package/esm/mobile.css +4 -4
- package/esm/mobile.d.ts +1 -0
- package/esm/mobile.js +3 -3
- package/esm/responsive.d.ts +2 -0
- package/esm/responsive.js +15 -0
- package/esm/{tslib.es6-2208c38d.d.ts → tslib.es6-4587d140.d.ts} +0 -0
- package/esm/{tslib.es6-2208c38d.js → tslib.es6-4587d140.js} +0 -0
- package/getDataTestId-3fe0d3e6.d.ts +1 -1
- package/index-bdb4c6b9.d.ts +3 -2
- package/index.d.ts +2 -1
- package/index.js +13 -7
- package/mobile.css +4 -4
- package/mobile.d.ts +1 -0
- package/mobile.js +3 -5
- package/modern/Component-7ca84eff.d.ts +3 -2
- package/modern/{Component.d.ts → Component.desktop.d.ts} +7 -7
- package/modern/Component.desktop.js +17 -0
- package/modern/Component.mobile.d.ts +2 -2
- package/modern/Component.mobile.js +13 -6
- package/modern/Component.responsive.d.ts +13 -0
- package/modern/Component.responsive.js +23 -0
- package/modern/autocomplete-field/Component.d.ts +2 -2
- package/modern/autocomplete-field/Component.js +1 -1
- package/modern/autocomplete-field/index.css +2 -2
- package/modern/autocomplete-field/index.js +1 -1
- package/modern/autocomplete-mobile-field/Component.js +2 -2
- package/modern/autocomplete-mobile-field/index.css +8 -8
- package/modern/autocomplete-mobile-field/index.js +1 -1
- package/modern/desktop.d.ts +2 -0
- package/modern/desktop.js +7 -0
- package/modern/getDataTestId-3fe0d3e6.d.ts +1 -1
- package/modern/index-bdb4c6b9.d.ts +3 -2
- package/modern/index.d.ts +2 -1
- package/modern/index.js +10 -3
- package/modern/mobile.css +4 -4
- package/modern/mobile.d.ts +1 -0
- package/modern/mobile.js +2 -2
- package/modern/responsive.d.ts +2 -0
- package/modern/responsive.js +14 -0
- package/package.json +5 -5
- package/responsive.d.ts +2 -0
- package/responsive.js +21 -0
- package/{tslib.es6-8ec3b181.d.ts → tslib.es6-89e6fcc2.d.ts} +0 -0
- package/{tslib.es6-8ec3b181.js → tslib.es6-89e6fcc2.js} +0 -0
- package/modern/Component.js +0 -17
package/cssm/Component.mobile.js
CHANGED
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var tslib_es6 = require('./tslib.es6-9682e485.js');
|
|
3
|
+
var tslib_es6 = require('./tslib.es6-bbd6cd2a.js');
|
|
6
4
|
var React = require('react');
|
|
7
5
|
var mergeRefs = require('react-merge-refs');
|
|
8
6
|
var cn = require('classnames');
|
|
@@ -10,23 +8,23 @@ var throttle = require('lodash.throttle');
|
|
|
10
8
|
var coreComponentsButton = require('@alfalab/core-components-button/cssm');
|
|
11
9
|
var coreComponentsInput = require('@alfalab/core-components-input/cssm');
|
|
12
10
|
var coreComponentsSelect = require('@alfalab/core-components-select/cssm');
|
|
11
|
+
var autocompleteMobileField_Component = require('./autocomplete-mobile-field/Component.js');
|
|
12
|
+
var styles = require('./mobile.module.css');
|
|
13
13
|
require('@alfalab/core-components-form-control/cssm');
|
|
14
14
|
require('@alfalab/hooks');
|
|
15
15
|
require('./autocomplete-mobile-field/index.module.css');
|
|
16
|
-
var autocompleteMobileField_Component = require('./autocomplete-mobile-field/Component.js');
|
|
17
|
-
var styles = require('./mobile.module.css');
|
|
18
16
|
|
|
19
|
-
function
|
|
17
|
+
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
20
18
|
|
|
21
|
-
var React__default = /*#__PURE__*/
|
|
22
|
-
var mergeRefs__default = /*#__PURE__*/
|
|
23
|
-
var cn__default = /*#__PURE__*/
|
|
24
|
-
var throttle__default = /*#__PURE__*/
|
|
25
|
-
var styles__default = /*#__PURE__*/
|
|
19
|
+
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
20
|
+
var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
|
|
21
|
+
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
22
|
+
var throttle__default = /*#__PURE__*/_interopDefaultCompat(throttle);
|
|
23
|
+
var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
|
|
26
24
|
|
|
27
25
|
var SELECTED = [];
|
|
28
|
-
var InputAutocompleteMobile = React__default
|
|
29
|
-
var Input = _a.Input, _b = _a.bottomSheetProps, bottomSheetProps = _b === void 0 ? {} : _b, _c = _a.bottomSheetHeaderAddonsProps, bottomSheetHeaderAddonsProps = _c === void 0 ? {} : _c, _d = _a.value, value = _d === void 0 ? '' : _d, _e = _a.filter, filter = _e === void 0 ? '' : _e, name = _a.name, _f = _a.Arrow, Arrow = _f === void 0 ? null : _f, label = _a.label, placeholder = _a.placeholder, _g = _a.size, size = _g === void 0 ? 's' : _g, openProp = _a.open, onFilter = _a.onFilter, onChange = _a.onChange, onOpen = _a.onOpen, onCancel = _a.onCancel, onClearFilter = _a.onClearFilter, continueButtonProps = _a.continueButtonProps, cancelButtonProps = _a.cancelButtonProps, restProps = tslib_es6.__rest(_a, ["Input", "bottomSheetProps", "bottomSheetHeaderAddonsProps", "value", "filter", "name", "Arrow", "label", "placeholder", "size", "open", "onFilter", "onChange", "onOpen", "onCancel", "onClearFilter", "continueButtonProps", "cancelButtonProps"]);
|
|
26
|
+
var InputAutocompleteMobile = React__default.default.forwardRef(function (_a, ref) {
|
|
27
|
+
var Input = _a.Input, _b = _a.bottomSheetProps, bottomSheetProps = _b === void 0 ? {} : _b, _c = _a.bottomSheetHeaderAddonsProps, bottomSheetHeaderAddonsProps = _c === void 0 ? {} : _c, _d = _a.value, value = _d === void 0 ? '' : _d, _e = _a.filter, filter = _e === void 0 ? '' : _e, name = _a.name, _f = _a.Arrow, Arrow = _f === void 0 ? null : _f, label = _a.label, placeholder = _a.placeholder, _g = _a.size, size = _g === void 0 ? 's' : _g, openProp = _a.open, onFilter = _a.onFilter, onChange = _a.onChange, onOpen = _a.onOpen, onCancel = _a.onCancel, onClearFilter = _a.onClearFilter, continueButtonProps = _a.continueButtonProps, cancelButtonProps = _a.cancelButtonProps, selected = _a.selected, multiple = _a.multiple, restProps = tslib_es6.__rest(_a, ["Input", "bottomSheetProps", "bottomSheetHeaderAddonsProps", "value", "filter", "name", "Arrow", "label", "placeholder", "size", "open", "onFilter", "onChange", "onOpen", "onCancel", "onClearFilter", "continueButtonProps", "cancelButtonProps", "selected", "multiple"]);
|
|
30
28
|
var _h = React.useState(false), open = _h[0], setOpen = _h[1];
|
|
31
29
|
var bottomSheetInputRef = React.useRef(null);
|
|
32
30
|
var targetRef = React.useRef(null);
|
|
@@ -42,17 +40,24 @@ var InputAutocompleteMobile = React__default['default'].forwardRef(function (_a,
|
|
|
42
40
|
setBottomSheetVisibility(Boolean(payload.open));
|
|
43
41
|
};
|
|
44
42
|
var handleOptionsListTouchMove = React.useMemo(function () {
|
|
45
|
-
return throttle__default
|
|
43
|
+
return throttle__default.default(function () {
|
|
46
44
|
var input = bottomSheetInputRef.current;
|
|
47
45
|
if (input && document.activeElement === input) {
|
|
48
46
|
input.blur();
|
|
49
47
|
}
|
|
50
48
|
}, 300);
|
|
51
49
|
}, []);
|
|
52
|
-
var
|
|
50
|
+
var handleApply = function () {
|
|
53
51
|
setBottomSheetVisibility(false);
|
|
54
52
|
onChange(filter);
|
|
55
53
|
};
|
|
54
|
+
var handleChange = function (payload) {
|
|
55
|
+
onChange(payload);
|
|
56
|
+
if (multiple) {
|
|
57
|
+
// После выбора опции возвращаем фокус в поле ввода.
|
|
58
|
+
requestAnimationFrame(function () { var _a; return (_a = bottomSheetInputRef.current) === null || _a === void 0 ? void 0 : _a.focus(); });
|
|
59
|
+
}
|
|
60
|
+
};
|
|
56
61
|
var handleCancel = function () {
|
|
57
62
|
setBottomSheetVisibility(false);
|
|
58
63
|
if (onCancel) {
|
|
@@ -70,14 +75,14 @@ var InputAutocompleteMobile = React__default['default'].forwardRef(function (_a,
|
|
|
70
75
|
};
|
|
71
76
|
var getBottomSheetProps = function () {
|
|
72
77
|
var Component = Input || coreComponentsInput.Input;
|
|
73
|
-
return tslib_es6.__assign(tslib_es6.__assign({ actionButton: (React__default
|
|
74
|
-
React__default
|
|
75
|
-
React__default
|
|
78
|
+
return tslib_es6.__assign(tslib_es6.__assign({ actionButton: (React__default.default.createElement("div", { className: styles__default.default.footer },
|
|
79
|
+
React__default.default.createElement(coreComponentsButton.Button, tslib_es6.__assign({ block: true, view: 'primary', size: 's', onClick: handleApply }, continueButtonProps), "\u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C"),
|
|
80
|
+
React__default.default.createElement(coreComponentsButton.Button, tslib_es6.__assign({ block: true, view: 'secondary', size: 's', onClick: handleCancel }, cancelButtonProps), "\u041E\u0442\u043C\u0435\u043D\u0430"))), title: label || placeholder, bottomAddons: (React__default.default.createElement(Component, tslib_es6.__assign({ block: true, clear: !!onClearFilter, onClear: onClearFilter, value: filter, onInput: onFilter, placeholder: placeholder, onFocus: handleInputFocus }, bottomSheetHeaderAddonsProps, { className: cn__default.default(styles__default.default.bottomSheetInput, bottomSheetHeaderAddonsProps.className), ref: mergeRefs__default.default([
|
|
76
81
|
bottomSheetInputRef,
|
|
77
82
|
bottomSheetHeaderAddonsProps.ref,
|
|
78
83
|
]) }))), initialHeight: 'full' }, bottomSheetProps), { containerProps: tslib_es6.__assign({ onTouchMove: handleOptionsListTouchMove }, bottomSheetProps.containerProps) });
|
|
79
84
|
};
|
|
80
|
-
return (React__default
|
|
85
|
+
return (React__default.default.createElement(coreComponentsSelect.SelectMobile, tslib_es6.__assign({ ref: mergeRefs__default.default([targetRef, ref]), selected: selected || SELECTED, open: Boolean(open || openProp), onOpen: handleOpen, onChange: handleChange, Arrow: Arrow, Field: autocompleteMobileField_Component.AutocompleteMobileField, fieldProps: { value: value }, placeholder: placeholder, label: label, size: size, name: name, multiple: multiple, bottomSheetProps: getBottomSheetProps(), optionsListProps: { showFooter: false } }, restProps)));
|
|
81
86
|
});
|
|
82
87
|
|
|
83
88
|
exports.InputAutocompleteMobile = InputAutocompleteMobile;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { InputAutocompleteDesktopProps } from "./Component.desktop";
|
|
3
|
+
import { InputAutocompleteMobileProps } from "./Component.mobile";
|
|
4
|
+
type InputAutocompleteResponsiveProps = InputAutocompleteDesktopProps & InputAutocompleteMobileProps & {
|
|
5
|
+
/**
|
|
6
|
+
* Контрольная точка, с нее начинается desktop версия
|
|
7
|
+
* @default 1024
|
|
8
|
+
*/
|
|
9
|
+
breakpoint?: number;
|
|
10
|
+
};
|
|
11
|
+
type InputAutocompleteMedia = 'desktop' | 'mobile';
|
|
12
|
+
declare const InputAutocompleteResponsive: FC<InputAutocompleteResponsiveProps>;
|
|
13
|
+
export { InputAutocompleteResponsiveProps, InputAutocompleteMedia, InputAutocompleteResponsive };
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var tslib_es6 = require('./tslib.es6-bbd6cd2a.js');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
var hooks = require('@alfalab/hooks');
|
|
6
|
+
var Component_desktop = require('./Component.desktop.js');
|
|
7
|
+
var Component_mobile = require('./Component.mobile.js');
|
|
8
|
+
require('@alfalab/core-components-select/cssm');
|
|
9
|
+
require('./autocomplete-field/Component.js');
|
|
10
|
+
require('react-merge-refs');
|
|
11
|
+
require('classnames');
|
|
12
|
+
require('@alfalab/core-components-input/cssm');
|
|
13
|
+
require('./autocomplete-field/index.module.css');
|
|
14
|
+
require('lodash.throttle');
|
|
15
|
+
require('@alfalab/core-components-button/cssm');
|
|
16
|
+
require('./autocomplete-mobile-field/Component.js');
|
|
17
|
+
require('@alfalab/core-components-form-control/cssm');
|
|
18
|
+
require('./autocomplete-mobile-field/index.module.css');
|
|
19
|
+
require('./mobile.module.css');
|
|
20
|
+
|
|
21
|
+
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
22
|
+
|
|
23
|
+
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
24
|
+
|
|
25
|
+
var InputAutocompleteResponsive = function (_a) {
|
|
26
|
+
var _b = _a.breakpoint, breakpoint = _b === void 0 ? 1024 : _b, restProps = tslib_es6.__rest(_a, ["breakpoint"]);
|
|
27
|
+
var view = hooks.useMedia([
|
|
28
|
+
['mobile', "(max-width: ".concat(breakpoint - 1, "px)")],
|
|
29
|
+
['desktop', "(min-width: ".concat(breakpoint, "px)")],
|
|
30
|
+
], 'desktop')[0];
|
|
31
|
+
return view === 'desktop' ? (React__default.default.createElement(Component_desktop.InputAutocompleteDesktop, tslib_es6.__assign({}, restProps))) : (React__default.default.createElement(Component_mobile.InputAutocompleteMobile, tslib_es6.__assign({}, restProps)));
|
|
32
|
+
};
|
|
33
|
+
|
|
34
|
+
exports.InputAutocompleteResponsive = InputAutocompleteResponsive;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { FieldProps } from "@alfalab/core-components-select";
|
|
3
|
-
import {
|
|
4
|
-
type AutocompleteFieldProps = FieldProps & Pick<
|
|
3
|
+
import { InputAutocompleteDesktopProps } from "../Component.desktop";
|
|
4
|
+
type AutocompleteFieldProps = FieldProps & Pick<InputAutocompleteDesktopProps, 'Input' | 'inputProps' | 'value' | 'onInput' | 'readOnly'>;
|
|
5
5
|
declare const AutocompleteField: ({ label, labelView, placeholder, size, Arrow, Input, value, error, success, hint, disabled, readOnly, onInput, inputProps, innerProps, }: AutocompleteFieldProps) => JSX.Element;
|
|
6
6
|
export { AutocompleteFieldProps, AutocompleteField };
|
|
@@ -1,20 +1,18 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var tslib_es6 = require('../tslib.es6-9682e485.js');
|
|
3
|
+
var tslib_es6 = require('../tslib.es6-bbd6cd2a.js');
|
|
6
4
|
var React = require('react');
|
|
7
5
|
var mergeRefs = require('react-merge-refs');
|
|
8
6
|
var cn = require('classnames');
|
|
9
7
|
var coreComponentsInput = require('@alfalab/core-components-input/cssm');
|
|
10
8
|
var styles = require('./index.module.css');
|
|
11
9
|
|
|
12
|
-
function
|
|
10
|
+
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
13
11
|
|
|
14
|
-
var React__default = /*#__PURE__*/
|
|
15
|
-
var mergeRefs__default = /*#__PURE__*/
|
|
16
|
-
var cn__default = /*#__PURE__*/
|
|
17
|
-
var styles__default = /*#__PURE__*/
|
|
12
|
+
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
13
|
+
var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
|
|
14
|
+
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
15
|
+
var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
|
|
18
16
|
|
|
19
17
|
var AutocompleteField = function (_a) {
|
|
20
18
|
var _b;
|
|
@@ -29,13 +27,13 @@ var AutocompleteField = function (_a) {
|
|
|
29
27
|
inputRef.current.focus();
|
|
30
28
|
}
|
|
31
29
|
}, [onClick]);
|
|
32
|
-
return (React__default
|
|
30
|
+
return (React__default.default.createElement(Input, tslib_es6.__assign({}, inputProps, innerProps, { wrapperRef: mergeRefs__default.default([
|
|
33
31
|
innerProps.ref,
|
|
34
32
|
inputProps.wrapperRef,
|
|
35
|
-
]), ref: mergeRefs__default
|
|
33
|
+
]), ref: mergeRefs__default.default([inputRef, inputProps.ref]), disabled: disabled, readOnly: readOnly, block: true, label: label, labelView: labelView, placeholder: placeholder, size: size, error: error, success: success, hint: hint, onChange: onInput, onClick: inputDisabled ? undefined : handleClick, onFocus: inputDisabled ? undefined : onFocus, autoComplete: 'off', value: value, rightAddons: (Arrow || inputProps.rightAddons) && (React__default.default.createElement(React__default.default.Fragment, null,
|
|
36
34
|
inputProps.rightAddons,
|
|
37
|
-
Arrow && (React__default
|
|
38
|
-
_b[styles__default
|
|
35
|
+
Arrow && (React__default.default.createElement("span", { className: cn__default.default(styles__default.default.arrow, (_b = {},
|
|
36
|
+
_b[styles__default.default.error] = error,
|
|
39
37
|
_b)) }, Arrow)))) })));
|
|
40
38
|
};
|
|
41
39
|
|
|
@@ -1,14 +1,12 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
require('../tslib.es6-9682e485.js');
|
|
3
|
+
var autocompleteField_Component = require('./Component.js');
|
|
4
|
+
require('../tslib.es6-bbd6cd2a.js');
|
|
6
5
|
require('react');
|
|
7
6
|
require('react-merge-refs');
|
|
8
7
|
require('classnames');
|
|
9
8
|
require('@alfalab/core-components-input/cssm');
|
|
10
9
|
require('./index.module.css');
|
|
11
|
-
var autocompleteField_Component = require('./Component.js');
|
|
12
10
|
|
|
13
11
|
|
|
14
12
|
|
|
@@ -1,36 +1,34 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var tslib_es6 = require('../tslib.es6-9682e485.js');
|
|
3
|
+
var tslib_es6 = require('../tslib.es6-bbd6cd2a.js');
|
|
6
4
|
var React = require('react');
|
|
7
5
|
var cn = require('classnames');
|
|
8
6
|
var coreComponentsFormControl = require('@alfalab/core-components-form-control/cssm');
|
|
9
7
|
var hooks = require('@alfalab/hooks');
|
|
10
8
|
var styles = require('./index.module.css');
|
|
11
9
|
|
|
12
|
-
function
|
|
10
|
+
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
13
11
|
|
|
14
|
-
var React__default = /*#__PURE__*/
|
|
15
|
-
var cn__default = /*#__PURE__*/
|
|
16
|
-
var styles__default = /*#__PURE__*/
|
|
12
|
+
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
13
|
+
var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
|
|
14
|
+
var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
|
|
17
15
|
|
|
18
16
|
var AutocompleteMobileField = function (_a) {
|
|
19
17
|
var _b;
|
|
20
|
-
var _c = _a.size, size = _c === void 0 ? 'm' : _c
|
|
18
|
+
var _c = _a.size, size = _c === void 0 ? 'm' : _c; _a.open; var error = _a.error, hint = _a.hint, disabled = _a.disabled, label = _a.label, _d = _a.labelView, labelView = _d === void 0 ? 'inner' : _d, placeholder = _a.placeholder, value = _a.value, innerProps = _a.innerProps, dataTestId = _a.dataTestId, fieldClassName = _a.fieldClassName, Arrow = _a.Arrow; _a.valueRenderer; _a.toggleMenu; _a.setSelectedItems; _a.selectedMultiple; var restProps = tslib_es6.__rest(_a, ["size", "open", "error", "hint", "disabled", "label", "labelView", "placeholder", "value", "innerProps", "dataTestId", "fieldClassName", "Arrow", "valueRenderer", "toggleMenu", "setSelectedItems", "selectedMultiple"]);
|
|
21
19
|
var _e = React.useState(false), focused = _e[0], setFocused = _e[1];
|
|
22
20
|
var wrapperRef = React.useRef(null);
|
|
23
21
|
var focusVisible = hooks.useFocus(wrapperRef, 'keyboard')[0];
|
|
24
22
|
var filled = Boolean(value);
|
|
25
23
|
var showLabel = !!label && (filled || !placeholder || labelView === 'outer');
|
|
26
|
-
return (React__default
|
|
27
|
-
React__default
|
|
28
|
-
_b[styles__default
|
|
29
|
-
_b[styles__default
|
|
30
|
-
_b)), block: true, size: size, focused: focused, disabled: disabled, filled: filled, label: showLabel && label, labelView: labelView, error: error, hint: hint, "data-test-id": dataTestId }, restProps, innerProps),
|
|
31
|
-
React__default
|
|
32
|
-
placeholder && !filled && (React__default
|
|
33
|
-
filled && React__default
|
|
24
|
+
return (React__default.default.createElement("div", { className: styles__default.default.component, ref: wrapperRef, onFocus: function () { return setFocused(true); }, onBlur: function () { return setFocused(false); } },
|
|
25
|
+
React__default.default.createElement(coreComponentsFormControl.FormControl, tslib_es6.__assign({ fieldClassName: cn__default.default(styles__default.default.field, fieldClassName, (_b = {},
|
|
26
|
+
_b[styles__default.default.disabled] = disabled,
|
|
27
|
+
_b[styles__default.default.focusVisible] = focusVisible,
|
|
28
|
+
_b)), block: true, size: size, focused: focused, disabled: disabled, filled: filled, label: showLabel && label, labelView: labelView, error: error, hint: hint, rightAddons: Arrow, "data-test-id": dataTestId }, restProps, innerProps),
|
|
29
|
+
React__default.default.createElement("div", { className: styles__default.default.contentWrapper },
|
|
30
|
+
placeholder && !filled && (React__default.default.createElement("span", { className: styles__default.default.placeholder }, placeholder)),
|
|
31
|
+
filled && React__default.default.createElement("div", { className: styles__default.default.value }, value)))));
|
|
34
32
|
};
|
|
35
33
|
|
|
36
34
|
exports.AutocompleteMobileField = AutocompleteMobileField;
|
|
@@ -1,14 +1,12 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
require('../tslib.es6-9682e485.js');
|
|
3
|
+
var autocompleteMobileField_Component = require('./Component.js');
|
|
4
|
+
require('../tslib.es6-bbd6cd2a.js');
|
|
6
5
|
require('react');
|
|
7
6
|
require('classnames');
|
|
8
7
|
require('@alfalab/core-components-form-control/cssm');
|
|
9
8
|
require('@alfalab/hooks');
|
|
10
9
|
require('./index.module.css');
|
|
11
|
-
var autocompleteMobileField_Component = require('./Component.js');
|
|
12
10
|
|
|
13
11
|
|
|
14
12
|
|
package/cssm/desktop.js
ADDED
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var Component_desktop = require('./Component.desktop.js');
|
|
4
|
+
require('./tslib.es6-bbd6cd2a.js');
|
|
5
|
+
require('react');
|
|
6
|
+
require('@alfalab/core-components-select/cssm');
|
|
7
|
+
require('./autocomplete-field/Component.js');
|
|
8
|
+
require('react-merge-refs');
|
|
9
|
+
require('classnames');
|
|
10
|
+
require('@alfalab/core-components-input/cssm');
|
|
11
|
+
require('./autocomplete-field/index.module.css');
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
exports.InputAutocompleteDesktop = Component_desktop.InputAutocompleteDesktop;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const getDataTestId: (dataTestId?: string
|
|
1
|
+
declare const getDataTestId: (dataTestId?: string, element?: string) => string | undefined;
|
|
2
2
|
export { getDataTestId };
|
package/cssm/index-bdb4c6b9.d.ts
CHANGED
|
@@ -151,7 +151,7 @@ declare function isScrolledToBottom(target: HTMLElement): boolean;
|
|
|
151
151
|
declare function hasScrollbar(target: HTMLElement): boolean;
|
|
152
152
|
declare const getScrollbarSize: () => number;
|
|
153
153
|
declare const restoreContainerStyles: (container: HTMLElement) => void;
|
|
154
|
-
declare const handleContainer: (container?: HTMLElement
|
|
154
|
+
declare const handleContainer: (container?: HTMLElement) => void;
|
|
155
155
|
/**
|
|
156
156
|
* Набор констант для z-index соответствующих классов компонентов.
|
|
157
157
|
* Значения выбраны по приоритету.
|
|
@@ -201,4 +201,5 @@ declare class GlobalStore {
|
|
|
201
201
|
constructor();
|
|
202
202
|
getModalStore: () => ModalStore;
|
|
203
203
|
}
|
|
204
|
-
export { BaseModalProps, BaseModalContext, BaseModal, isScrolledToTop, isScrolledToBottom, hasScrollbar, getScrollbarSize, restoreContainerStyles, handleContainer, stackingOrder, StackingContext, StackProps, Stack, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef,
|
|
204
|
+
export { BaseModalProps, BaseModalContext, BaseModal, isScrolledToTop, isScrolledToBottom, hasScrollbar, getScrollbarSize, restoreContainerStyles, handleContainer, stackingOrder, StackingContext, StackProps, Stack, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef, getModalStore, GlobalStore };
|
|
205
|
+
export type { SavedStyle };
|
package/cssm/index.d.ts
CHANGED
|
@@ -1 +1,2 @@
|
|
|
1
|
-
export
|
|
1
|
+
export { InputAutocompleteDesktop as InputAutocomplete, InputAutocompleteDesktopProps as InputAutocompleteProps } from "./Component.desktop";
|
|
2
|
+
export * from "./responsive";
|
package/cssm/index.js
CHANGED
|
@@ -1,17 +1,25 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
require('./tslib.es6-
|
|
3
|
+
var Component_desktop = require('./Component.desktop.js');
|
|
4
|
+
var Component_responsive = require('./Component.responsive.js');
|
|
5
|
+
require('./tslib.es6-bbd6cd2a.js');
|
|
6
6
|
require('react');
|
|
7
|
+
require('@alfalab/core-components-select/cssm');
|
|
8
|
+
require('./autocomplete-field/Component.js');
|
|
7
9
|
require('react-merge-refs');
|
|
8
10
|
require('classnames');
|
|
9
11
|
require('@alfalab/core-components-input/cssm');
|
|
10
|
-
require('@alfalab/core-components-select/cssm');
|
|
11
12
|
require('./autocomplete-field/index.module.css');
|
|
12
|
-
require('
|
|
13
|
-
|
|
13
|
+
require('@alfalab/hooks');
|
|
14
|
+
require('./Component.mobile.js');
|
|
15
|
+
require('lodash.throttle');
|
|
16
|
+
require('@alfalab/core-components-button/cssm');
|
|
17
|
+
require('./autocomplete-mobile-field/Component.js');
|
|
18
|
+
require('@alfalab/core-components-form-control/cssm');
|
|
19
|
+
require('./autocomplete-mobile-field/index.module.css');
|
|
20
|
+
require('./mobile.module.css');
|
|
14
21
|
|
|
15
22
|
|
|
16
23
|
|
|
17
|
-
exports.InputAutocomplete =
|
|
24
|
+
exports.InputAutocomplete = Component_desktop.InputAutocompleteDesktop;
|
|
25
|
+
exports.InputAutocompleteResponsive = Component_responsive.InputAutocompleteResponsive;
|
package/cssm/mobile.d.ts
CHANGED
package/cssm/mobile.js
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
require('./tslib.es6-9682e485.js');
|
|
3
|
+
var Component_mobile = require('./Component.mobile.js');
|
|
4
|
+
require('./tslib.es6-bbd6cd2a.js');
|
|
6
5
|
require('react');
|
|
7
6
|
require('react-merge-refs');
|
|
8
7
|
require('classnames');
|
|
@@ -10,12 +9,11 @@ require('lodash.throttle');
|
|
|
10
9
|
require('@alfalab/core-components-button/cssm');
|
|
11
10
|
require('@alfalab/core-components-input/cssm');
|
|
12
11
|
require('@alfalab/core-components-select/cssm');
|
|
12
|
+
require('./autocomplete-mobile-field/Component.js');
|
|
13
13
|
require('@alfalab/core-components-form-control/cssm');
|
|
14
14
|
require('@alfalab/hooks');
|
|
15
15
|
require('./autocomplete-mobile-field/index.module.css');
|
|
16
|
-
require('./autocomplete-mobile-field/Component.js');
|
|
17
16
|
require('./mobile.module.css');
|
|
18
|
-
var Component_mobile = require('./Component.mobile.js');
|
|
19
17
|
|
|
20
18
|
|
|
21
19
|
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var Component_responsive = require('./Component.responsive.js');
|
|
4
|
+
require('./tslib.es6-bbd6cd2a.js');
|
|
5
|
+
require('react');
|
|
6
|
+
require('@alfalab/hooks');
|
|
7
|
+
require('./Component.desktop.js');
|
|
8
|
+
require('@alfalab/core-components-select/cssm');
|
|
9
|
+
require('./autocomplete-field/Component.js');
|
|
10
|
+
require('react-merge-refs');
|
|
11
|
+
require('classnames');
|
|
12
|
+
require('@alfalab/core-components-input/cssm');
|
|
13
|
+
require('./autocomplete-field/index.module.css');
|
|
14
|
+
require('./Component.mobile.js');
|
|
15
|
+
require('lodash.throttle');
|
|
16
|
+
require('@alfalab/core-components-button/cssm');
|
|
17
|
+
require('./autocomplete-mobile-field/Component.js');
|
|
18
|
+
require('@alfalab/core-components-form-control/cssm');
|
|
19
|
+
require('./autocomplete-mobile-field/index.module.css');
|
|
20
|
+
require('./mobile.module.css');
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
exports.InputAutocompleteResponsive = Component_responsive.InputAutocompleteResponsive;
|
|
File without changes
|
|
File without changes
|
package/desktop.d.ts
ADDED
package/desktop.js
ADDED
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var Component_desktop = require('./Component.desktop.js');
|
|
4
|
+
require('./tslib.es6-89e6fcc2.js');
|
|
5
|
+
require('react');
|
|
6
|
+
require('@alfalab/core-components-select');
|
|
7
|
+
require('./autocomplete-field/Component.js');
|
|
8
|
+
require('react-merge-refs');
|
|
9
|
+
require('classnames');
|
|
10
|
+
require('@alfalab/core-components-input');
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
exports.InputAutocompleteDesktop = Component_desktop.InputAutocompleteDesktop;
|
|
@@ -63,7 +63,7 @@ declare const colors: readonly [
|
|
|
63
63
|
"link",
|
|
64
64
|
"negative"
|
|
65
65
|
];
|
|
66
|
-
type Color = typeof colors[number];
|
|
66
|
+
type Color = (typeof colors)[number];
|
|
67
67
|
type TextElementType = HTMLParagraphElement | HTMLSpanElement | HTMLDivElement;
|
|
68
68
|
type NativeProps = HTMLAttributes<HTMLSpanElement>;
|
|
69
69
|
type TextBaseProps = {
|
|
@@ -259,4 +259,5 @@ type HeaderProps = {
|
|
|
259
259
|
onBack?: () => void;
|
|
260
260
|
};
|
|
261
261
|
declare const Header: FC<HeaderProps>;
|
|
262
|
-
export { CloserProps, Closer, Typography, typographyPresets,
|
|
262
|
+
export { CloserProps, Closer, Typography, typographyPresets, BackerProps, Backer, TitleResponsive, HeaderProps, Header };
|
|
263
|
+
export type { TitleProps, TextProps, Color };
|
|
@@ -3,7 +3,7 @@ import React from 'react';
|
|
|
3
3
|
import { ChangeEvent, FC, RefAttributes } from "react";
|
|
4
4
|
import { InputProps } from "@alfalab/core-components-input";
|
|
5
5
|
import { BaseSelectProps } from "@alfalab/core-components-select";
|
|
6
|
-
type
|
|
6
|
+
type InputAutocompleteDesktopProps = Omit<BaseSelectProps, 'Field' | 'nativeSelect'> & {
|
|
7
7
|
/**
|
|
8
8
|
* Компонент ввода значения
|
|
9
9
|
*/
|
|
@@ -33,11 +33,11 @@ type InputAutocompleteProps = Omit<BaseSelectProps, 'Field' | 'nativeSelect'> &
|
|
|
33
33
|
*/
|
|
34
34
|
updatePopover?: BaseSelectProps['updatePopover'];
|
|
35
35
|
};
|
|
36
|
-
declare const
|
|
36
|
+
declare const InputAutocompleteDesktop: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "nativeSelect" | "Field"> & {
|
|
37
37
|
/**
|
|
38
38
|
* Компонент ввода значения
|
|
39
39
|
*/
|
|
40
|
-
Input?: React.FC<Omit<React.InputHTMLAttributes<HTMLInputElement>, "
|
|
40
|
+
Input?: React.FC<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type" | "defaultValue" | "onChange" | "onClick" | "onMouseDown" | "value" | "enterKeyHint"> & {
|
|
41
41
|
value?: string | undefined;
|
|
42
42
|
defaultValue?: string | undefined;
|
|
43
43
|
block?: boolean | undefined;
|
|
@@ -49,7 +49,7 @@ declare const InputAutocomplete: React.ForwardRefExoticComponent<Omit<BaseSelect
|
|
|
49
49
|
hint?: React.ReactNode;
|
|
50
50
|
label?: React.ReactNode;
|
|
51
51
|
labelView?: "inner" | "outer" | undefined;
|
|
52
|
-
type?: "number" | "text" | "tel" | "email" | "
|
|
52
|
+
type?: "number" | "text" | "tel" | "email" | "card" | "money" | "password" | undefined;
|
|
53
53
|
wrapperRef?: React.Ref<HTMLDivElement> | undefined;
|
|
54
54
|
leftAddons?: React.ReactNode;
|
|
55
55
|
rightAddons?: React.ReactNode;
|
|
@@ -73,7 +73,7 @@ declare const InputAutocomplete: React.ForwardRefExoticComponent<Omit<BaseSelect
|
|
|
73
73
|
/**
|
|
74
74
|
* Пропсы, которые будут прокинуты в инпут
|
|
75
75
|
*/
|
|
76
|
-
inputProps?: (Omit<React.InputHTMLAttributes<HTMLInputElement>, "
|
|
76
|
+
inputProps?: (Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "type" | "defaultValue" | "onChange" | "onClick" | "onMouseDown" | "value" | "enterKeyHint"> & {
|
|
77
77
|
value?: string | undefined;
|
|
78
78
|
defaultValue?: string | undefined;
|
|
79
79
|
block?: boolean | undefined;
|
|
@@ -85,7 +85,7 @@ declare const InputAutocomplete: React.ForwardRefExoticComponent<Omit<BaseSelect
|
|
|
85
85
|
hint?: React.ReactNode;
|
|
86
86
|
label?: React.ReactNode;
|
|
87
87
|
labelView?: "inner" | "outer" | undefined;
|
|
88
|
-
type?: "number" | "text" | "tel" | "email" | "
|
|
88
|
+
type?: "number" | "text" | "tel" | "email" | "card" | "money" | "password" | undefined;
|
|
89
89
|
wrapperRef?: React.Ref<HTMLDivElement> | undefined;
|
|
90
90
|
leftAddons?: React.ReactNode;
|
|
91
91
|
rightAddons?: React.ReactNode;
|
|
@@ -127,4 +127,4 @@ declare const InputAutocomplete: React.ForwardRefExoticComponent<Omit<BaseSelect
|
|
|
127
127
|
*/
|
|
128
128
|
updatePopover?: BaseSelectProps['updatePopover'];
|
|
129
129
|
} & React.RefAttributes<HTMLInputElement>>;
|
|
130
|
-
export {
|
|
130
|
+
export { InputAutocompleteDesktopProps, InputAutocompleteDesktop };
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import { _ as __rest, a as __assign } from './tslib.es6-
|
|
1
|
+
import { _ as __rest, a as __assign } from './tslib.es6-4587d140.js';
|
|
2
2
|
import React, { forwardRef } from 'react';
|
|
3
|
+
import { BaseSelect, OptionsList, Optgroup, Option } from '@alfalab/core-components-select/esm';
|
|
4
|
+
import { AutocompleteField } from './autocomplete-field/Component.js';
|
|
3
5
|
import 'react-merge-refs';
|
|
4
6
|
import 'classnames';
|
|
5
7
|
import '@alfalab/core-components-input/esm';
|
|
6
|
-
import { BaseSelect, OptionsList, Optgroup, Option } from '@alfalab/core-components-select/esm';
|
|
7
|
-
import { AutocompleteField } from './autocomplete-field/Component.js';
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var InputAutocompleteDesktop = forwardRef(function (_a, ref) {
|
|
10
10
|
var _b = _a.OptionsList, OptionsList$1 = _b === void 0 ? OptionsList : _b, _c = _a.Optgroup, Optgroup$1 = _c === void 0 ? Optgroup : _c, _d = _a.Option, Option$1 = _d === void 0 ? Option : _d, Input = _a.Input, _e = _a.inputProps, inputProps = _e === void 0 ? {} : _e, onInput = _a.onInput, value = _a.value, success = _a.success, readOnly = _a.readOnly, _f = _a.closeOnSelect, closeOnSelect = _f === void 0 ? false : _f, options = _a.options, restProps = __rest(_a, ["OptionsList", "Optgroup", "Option", "Input", "inputProps", "onInput", "value", "success", "readOnly", "closeOnSelect", "options"]);
|
|
11
11
|
return (React.createElement(BaseSelect, __assign({ ref: ref, autocomplete: true, options: options, closeOnSelect: closeOnSelect, Option: Option$1, Field: AutocompleteField, fieldProps: {
|
|
12
12
|
Input: Input,
|
|
@@ -18,4 +18,4 @@ var InputAutocomplete = forwardRef(function (_a, ref) {
|
|
|
18
18
|
}, Optgroup: Optgroup$1, OptionsList: OptionsList$1 }, restProps)));
|
|
19
19
|
});
|
|
20
20
|
|
|
21
|
-
export {
|
|
21
|
+
export { InputAutocompleteDesktop };
|
|
@@ -4,7 +4,7 @@ import { ChangeEvent, ElementType } from "react";
|
|
|
4
4
|
import { BottomSheetProps } from "./index-7ca84eff";
|
|
5
5
|
import { ButtonProps } from "@alfalab/core-components-button";
|
|
6
6
|
import { BaseSelectChangePayload, BaseSelectProps } from "@alfalab/core-components-select";
|
|
7
|
-
type InputAutocompleteMobileProps = Omit<BaseSelectProps, 'OptionsList' | 'Checkmark' | 'onScroll' | '
|
|
7
|
+
type InputAutocompleteMobileProps = Omit<BaseSelectProps, 'OptionsList' | 'Checkmark' | 'onScroll' | 'nativeSelect' | 'autocomplete' | 'valueRenderer'> & {
|
|
8
8
|
/**
|
|
9
9
|
* Обработчик выбора
|
|
10
10
|
*/
|
|
@@ -50,7 +50,7 @@ type InputAutocompleteMobileProps = Omit<BaseSelectProps, 'OptionsList' | 'Check
|
|
|
50
50
|
*/
|
|
51
51
|
Input?: ElementType;
|
|
52
52
|
};
|
|
53
|
-
declare const InputAutocompleteMobile: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "onScroll" | "
|
|
53
|
+
declare const InputAutocompleteMobile: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "onScroll" | "valueRenderer" | "autocomplete" | "nativeSelect" | "OptionsList" | "Checkmark"> & {
|
|
54
54
|
/**
|
|
55
55
|
* Обработчик выбора
|
|
56
56
|
*/
|