@semcore/select 3.5.12 → 3.6.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/CHANGELOG.md +8 -2
- package/lib/cjs/InputSearch.js +11 -48
- package/lib/cjs/InputSearch.js.map +1 -1
- package/lib/cjs/Select.js +61 -126
- package/lib/cjs/Select.js.map +1 -1
- package/lib/cjs/context.js +0 -4
- package/lib/cjs/context.js.map +1 -1
- package/lib/cjs/index.js +0 -3
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/translations/__intergalactic-dynamic-locales.js +0 -13
- package/lib/cjs/translations/__intergalactic-dynamic-locales.js.map +1 -1
- package/lib/es6/InputSearch.js +11 -37
- package/lib/es6/InputSearch.js.map +1 -1
- package/lib/es6/Select.js +61 -108
- package/lib/es6/Select.js.map +1 -1
- package/lib/es6/context.js.map +1 -1
- package/lib/es6/index.js.map +1 -1
- package/lib/es6/translations/__intergalactic-dynamic-locales.js.map +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -2,11 +2,17 @@
|
|
|
2
2
|
|
|
3
3
|
CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
|
|
4
4
|
|
|
5
|
-
## [3.
|
|
5
|
+
## [3.6.0] - 2023-04-04
|
|
6
|
+
|
|
7
|
+
### Added
|
|
8
|
+
|
|
9
|
+
- Return focus to trigger when option is selected.
|
|
10
|
+
|
|
11
|
+
## [3.5.13] - 2023-04-03
|
|
6
12
|
|
|
7
13
|
### Changed
|
|
8
14
|
|
|
9
|
-
- Version patch update due to children dependencies update (`@semcore/dropdown-menu` [3.6.
|
|
15
|
+
- Version patch update due to children dependencies update (`@semcore/checkbox` [6.4.9 ~> 6.4.10], `@semcore/dropdown-menu` [3.6.25 ~> 3.6.26]).
|
|
10
16
|
|
|
11
17
|
## [3.5.6] - 2023-03-23
|
|
12
18
|
|
package/lib/cjs/InputSearch.js
CHANGED
|
@@ -1,86 +1,53 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
|
4
|
-
|
|
5
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
10
8
|
exports["default"] = void 0;
|
|
11
|
-
|
|
12
9
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
13
|
-
|
|
14
10
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
15
|
-
|
|
16
11
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
17
|
-
|
|
18
12
|
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
19
|
-
|
|
20
13
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
21
|
-
|
|
22
14
|
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
23
|
-
|
|
24
15
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
25
|
-
|
|
26
16
|
var _core = _interopRequireWildcard(require("@semcore/core"));
|
|
27
|
-
|
|
28
17
|
var _react = _interopRequireDefault(require("react"));
|
|
29
|
-
|
|
30
18
|
var _m = _interopRequireDefault(require("@semcore/icon/Search/m"));
|
|
31
|
-
|
|
32
19
|
var _m2 = _interopRequireDefault(require("@semcore/icon/Close/m"));
|
|
33
|
-
|
|
34
20
|
var _input = _interopRequireDefault(require("@semcore/input"));
|
|
35
|
-
|
|
36
21
|
var _context = require("./context");
|
|
37
|
-
|
|
38
22
|
var _i18nEnhance = _interopRequireDefault(require("@semcore/utils/lib/enhances/i18nEnhance"));
|
|
39
|
-
|
|
40
23
|
var _intergalacticDynamicLocales = require("./translations/__intergalactic-dynamic-locales");
|
|
41
|
-
|
|
42
24
|
/*__reshadow-styles__:"./style/input-search.shadow.css"*/
|
|
43
|
-
var style = (
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
"
|
|
48
|
-
|
|
49
|
-
, "8c7d8_gg_")
|
|
50
|
-
/*__reshadow_css_end__*/
|
|
51
|
-
, {
|
|
52
|
-
"__SInputSearch": "___SInputSearch_8c7d8_gg_",
|
|
53
|
-
"_size_m": "_size_m_8c7d8_gg_",
|
|
54
|
-
"__SClose": "___SClose_8c7d8_gg_",
|
|
55
|
-
"_hide": "__hide_8c7d8_gg_",
|
|
56
|
-
"__SOutline": "___SOutline_8c7d8_gg_"
|
|
25
|
+
var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SInputSearch_ep7gm_gg_._size_m_ep7gm_gg_{height:32px}.___SClose_ep7gm_gg_.__hide_ep7gm_gg_{visibility:hidden}.___SOutline_ep7gm_gg_{top:-1px;left:-1px;width:100%;border-radius:var(--intergalactic-control-rounded, 6px) var(--intergalactic-control-rounded, 6px)0 0}" /*__inner_css_end__*/, "ep7gm_gg_") /*__reshadow_css_end__*/, {
|
|
26
|
+
"__SInputSearch": "___SInputSearch_ep7gm_gg_",
|
|
27
|
+
"_size_m": "_size_m_ep7gm_gg_",
|
|
28
|
+
"__SClose": "___SClose_ep7gm_gg_",
|
|
29
|
+
"_hide": "__hide_ep7gm_gg_",
|
|
30
|
+
"__SOutline": "___SOutline_ep7gm_gg_"
|
|
57
31
|
});
|
|
58
32
|
var MAP_SIZE_TO_ICON = {
|
|
59
33
|
m: [_m["default"], _m2["default"]],
|
|
60
34
|
l: [_m["default"], _m2["default"]]
|
|
61
35
|
};
|
|
62
|
-
|
|
63
36
|
var InputSearch = /*#__PURE__*/function (_Component) {
|
|
64
37
|
(0, _inherits2["default"])(InputSearch, _Component);
|
|
65
|
-
|
|
66
38
|
var _super = (0, _createSuper2["default"])(InputSearch);
|
|
67
|
-
|
|
68
39
|
function InputSearch() {
|
|
69
40
|
var _this;
|
|
70
|
-
|
|
71
41
|
(0, _classCallCheck2["default"])(this, InputSearch);
|
|
72
|
-
|
|
73
42
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
74
43
|
args[_key] = arguments[_key];
|
|
75
44
|
}
|
|
76
|
-
|
|
77
45
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
78
46
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleClear", function (e) {
|
|
79
47
|
_this.handlers.value('', e);
|
|
80
48
|
});
|
|
81
49
|
return _this;
|
|
82
50
|
}
|
|
83
|
-
|
|
84
51
|
(0, _createClass2["default"])(InputSearch, [{
|
|
85
52
|
key: "uncontrolledProps",
|
|
86
53
|
value: function uncontrolledProps() {
|
|
@@ -92,16 +59,15 @@ var InputSearch = /*#__PURE__*/function (_Component) {
|
|
|
92
59
|
key: "render",
|
|
93
60
|
value: function render() {
|
|
94
61
|
var _ref = this.asProps,
|
|
95
|
-
|
|
96
|
-
|
|
62
|
+
_ref2;
|
|
97
63
|
var Value = _input["default"].Value;
|
|
98
64
|
var SInputSearch = _input["default"];
|
|
99
65
|
var SClose = _input["default"].Addon;
|
|
100
66
|
var _this$asProps = this.asProps,
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
67
|
+
size = _this$asProps.size,
|
|
68
|
+
value = _this$asProps.value,
|
|
69
|
+
styles = _this$asProps.styles,
|
|
70
|
+
getI18nText = _this$asProps.getI18nText;
|
|
105
71
|
var finalSize = size || this.context.size;
|
|
106
72
|
var hideClose = !value;
|
|
107
73
|
var IconClose = MAP_SIZE_TO_ICON[finalSize][1];
|
|
@@ -123,7 +89,6 @@ var InputSearch = /*#__PURE__*/function (_Component) {
|
|
|
123
89
|
}]);
|
|
124
90
|
return InputSearch;
|
|
125
91
|
}(_core.Component);
|
|
126
|
-
|
|
127
92
|
(0, _defineProperty2["default"])(InputSearch, "displayName", 'InputSearch');
|
|
128
93
|
(0, _defineProperty2["default"])(InputSearch, "style", style);
|
|
129
94
|
(0, _defineProperty2["default"])(InputSearch, "enhance", [(0, _i18nEnhance["default"])(_intergalacticDynamicLocales.localizedMessages)]);
|
|
@@ -133,8 +98,6 @@ var InputSearch = /*#__PURE__*/function (_Component) {
|
|
|
133
98
|
locale: 'en'
|
|
134
99
|
});
|
|
135
100
|
(0, _defineProperty2["default"])(InputSearch, "contextType", _context.selectContext);
|
|
136
|
-
|
|
137
101
|
var _default = (0, _core["default"])(InputSearch);
|
|
138
|
-
|
|
139
102
|
exports["default"] = _default;
|
|
140
103
|
//# sourceMappingURL=InputSearch.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputSearch.js","names":["MAP_SIZE_TO_ICON","m","SearchM","CloseM","l","InputSearch","e","handlers","value","Value","Input","SInputSearch","SClose","Addon","asProps","size","styles","getI18nText","finalSize","context","hideClose","IconClose","IconSearch","
|
|
1
|
+
{"version":3,"file":"InputSearch.js","names":["_core","_interopRequireWildcard","require","_react","_interopRequireDefault","_m","_m2","_input","_context","_i18nEnhance","_intergalacticDynamicLocales","style","sstyled","insert","MAP_SIZE_TO_ICON","m","SearchM","CloseM","l","InputSearch","_Component","_inherits2","_super","_createSuper2","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty2","_assertThisInitialized2","e","handlers","value","_createClass2","key","uncontrolledProps","render","_ref","asProps","_ref2","Value","Input","SInputSearch","SClose","Addon","_this$asProps","size","styles","getI18nText","finalSize","context","hideClose","IconClose","IconSearch","createElement","cn","_objectSpread2","assignProps","handleClear","Component","i18nEnhance","localizedMessages","defaultValue","i18n","locale","selectContext","_default","createComponent","exports"],"sources":["../../src/InputSearch.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport SearchM from '@semcore/icon/Search/m';\nimport CloseM from '@semcore/icon/Close/m';\nimport Input from '@semcore/input';\nimport { selectContext } from './context';\nimport i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nimport style from './style/input-search.shadow.css';\n\nconst MAP_SIZE_TO_ICON = {\n m: [SearchM, CloseM],\n l: [SearchM, CloseM],\n};\n\nclass InputSearch extends Component {\n static displayName = 'InputSearch';\n\n static style = style;\n static enhance = [i18nEnhance(localizedMessages)];\n static defaultProps = {\n defaultValue: '',\n i18n: localizedMessages,\n locale: 'en',\n };\n\n static contextType = selectContext;\n\n uncontrolledProps() {\n return {\n value: null,\n };\n }\n\n handleClear = (e) => {\n this.handlers.value('', e);\n };\n\n render() {\n const Value = Root;\n const SInputSearch = Input;\n const SClose = Input.Addon;\n const { size, value, styles, getI18nText } = this.asProps;\n const finalSize = size || this.context.size;\n const hideClose = !value;\n const IconClose = MAP_SIZE_TO_ICON[finalSize][1];\n const IconSearch = MAP_SIZE_TO_ICON[finalSize][0];\n\n return sstyled(styles)(\n <SInputSearch size={finalSize} styles={styles}>\n <Input.Addon>\n <IconSearch />\n </Input.Addon>\n <Value render={Input.Value} autoFocus />\n <SClose\n role=\"button\"\n /* hide through css because the width of the input changes */\n hide={hideClose}\n aria-hidden={hideClose}\n interactive\n aria-label={getI18nText('clearSearch')}\n onClick={this.handleClear}\n >\n <IconClose />\n </SClose>\n </SInputSearch>,\n );\n }\n}\n\nexport default createComponent(InputSearch);\n"],"mappings":"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"}
|
package/lib/cjs/Select.js
CHANGED
|
@@ -1,100 +1,57 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
10
8
|
exports["default"] = void 0;
|
|
11
|
-
|
|
12
9
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
13
|
-
|
|
14
10
|
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
|
15
|
-
|
|
16
11
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
17
|
-
|
|
18
12
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
19
|
-
|
|
20
13
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
21
|
-
|
|
22
14
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
23
|
-
|
|
24
15
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
25
|
-
|
|
26
16
|
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
27
|
-
|
|
28
17
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
29
|
-
|
|
30
18
|
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
31
|
-
|
|
32
19
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
33
|
-
|
|
34
20
|
var _core = _interopRequireWildcard(require("@semcore/core"));
|
|
35
|
-
|
|
36
21
|
var _react = _interopRequireDefault(require("react"));
|
|
37
|
-
|
|
38
22
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
39
|
-
|
|
40
23
|
var _dropdownMenu = _interopRequireDefault(require("@semcore/dropdown-menu"));
|
|
41
|
-
|
|
42
24
|
var _baseTrigger = require("@semcore/base-trigger");
|
|
43
|
-
|
|
44
25
|
var _divider = _interopRequireDefault(require("@semcore/divider"));
|
|
45
|
-
|
|
46
26
|
var _findComponent = _interopRequireDefault(require("@semcore/utils/lib/findComponent"));
|
|
47
|
-
|
|
48
27
|
var _logger = _interopRequireDefault(require("@semcore/utils/lib/logger"));
|
|
49
|
-
|
|
50
28
|
var _color = _interopRequireDefault(require("@semcore/utils/lib/color"));
|
|
51
|
-
|
|
52
29
|
var _addonTextChildren = _interopRequireDefault(require("@semcore/utils/lib/addonTextChildren"));
|
|
53
|
-
|
|
54
30
|
var _InputSearch = _interopRequireDefault(require("./InputSearch"));
|
|
55
|
-
|
|
56
31
|
var _flexBox = require("@semcore/flex-box");
|
|
57
|
-
|
|
58
32
|
var _context = require("./context");
|
|
59
|
-
|
|
60
33
|
var _uniqueID = _interopRequireDefault(require("@semcore/utils/lib/uniqueID"));
|
|
61
|
-
|
|
62
34
|
var _i18nEnhance = _interopRequireDefault(require("@semcore/utils/lib/enhances/i18nEnhance"));
|
|
63
|
-
|
|
64
35
|
var _intergalacticDynamicLocales = require("./translations/__intergalactic-dynamic-locales");
|
|
65
|
-
|
|
66
36
|
var _excluded = ["Children", "options", "multiselect", "value"];
|
|
67
|
-
|
|
68
37
|
/*__reshadow-styles__:"./style/select.shadow.css"*/
|
|
69
|
-
var style = (
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
"
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
/*__reshadow_css_end__*/
|
|
77
|
-
, {
|
|
78
|
-
"__SOptionCheckbox": "___SOptionCheckbox_p2w95_gg_",
|
|
79
|
-
"_size_l": "_size_l_p2w95_gg_",
|
|
80
|
-
"_checked": "__checked_p2w95_gg_",
|
|
81
|
-
"_theme": "__theme_p2w95_gg_",
|
|
82
|
-
"--theme": "--theme_p2w95",
|
|
83
|
-
"_selected": "__selected_p2w95_gg_"
|
|
38
|
+
var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SOptionCheckbox_ddm5c_gg_{margin-top:var(--intergalactic-spacing-05x, 2px);margin-right:var(--intergalactic-spacing-2x, 8px);margin-bottom:auto;position:relative;flex-shrink:0;width:16px;height:16px}.___SOptionCheckbox_ddm5c_gg_::before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--intergalactic-bg-primary-neutral, #ffffff);border:1px solid;border-radius:var(--intergalactic-addon-rounded, 4px);border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SOptionCheckbox_ddm5c_gg_::after{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;margin:0 var(--intergalactic-spacing-05x, 2px);background-repeat:no-repeat;background-position:center center;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEwIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjI1IDFMNCA1LjI1TDEuNzUgMyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_ddm5c_gg_._size_l_ddm5c_gg_{width:20px;height:20px}.___SOptionCheckbox_ddm5c_gg_._size_l_ddm5c_gg_::after{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMSAxLjVMNC43NSA3Ljc1TDEgNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_ddm5c_gg_.__checked_ddm5c_gg_:before{background-color:var(--intergalactic-control-primary-info, #008ff8);border-color:var(--intergalactic-control-primary-info, #008ff8)}.___SOptionCheckbox_ddm5c_gg_.__theme_ddm5c_gg_:before{border-color:var(--theme_ddm5c)}.___SOptionCheckbox_ddm5c_gg_.__theme_ddm5c_gg_.__checked_ddm5c_gg_:before{background-color:var(--theme_ddm5c);border-color:var(--theme_ddm5c)}.___SOptionCheckbox_ddm5c_gg_.__selected_ddm5c_gg_{background-color:var(--intergalactic-dropdown-menu-item-selected, rgba(196, 229, 254, 0.7))}@media (hover:hover){.___SOptionCheckbox_ddm5c_gg_.__selected_ddm5c_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item-selected-hover, #c4e5fe)}}" /*__inner_css_end__*/, "ddm5c_gg_") /*__reshadow_css_end__*/, {
|
|
39
|
+
"__SOptionCheckbox": "___SOptionCheckbox_ddm5c_gg_",
|
|
40
|
+
"_size_l": "_size_l_ddm5c_gg_",
|
|
41
|
+
"_checked": "__checked_ddm5c_gg_",
|
|
42
|
+
"_theme": "__theme_ddm5c_gg_",
|
|
43
|
+
"--theme": "--theme_ddm5c",
|
|
44
|
+
"_selected": "__selected_ddm5c_gg_"
|
|
84
45
|
});
|
|
85
|
-
|
|
86
46
|
function isSelectedOption(value, valueOption) {
|
|
87
47
|
return Array.isArray(value) ? value.includes(valueOption) : valueOption === value;
|
|
88
48
|
}
|
|
89
|
-
|
|
90
49
|
function isEmptyValue(value) {
|
|
91
50
|
return Array.isArray(value) ? value.length === 0 : value === null;
|
|
92
51
|
}
|
|
93
|
-
|
|
94
52
|
function getEmptyValue(multiselect) {
|
|
95
53
|
return multiselect ? [] : null;
|
|
96
54
|
}
|
|
97
|
-
|
|
98
55
|
var scrollToNode = function scrollToNode(node) {
|
|
99
56
|
if (!node) return;
|
|
100
57
|
if (!node.scrollIntoView) return;
|
|
@@ -103,23 +60,18 @@ var scrollToNode = function scrollToNode(node) {
|
|
|
103
60
|
inline: 'nearest'
|
|
104
61
|
});
|
|
105
62
|
};
|
|
106
|
-
|
|
107
63
|
var RootSelect = /*#__PURE__*/function (_Component) {
|
|
108
64
|
(0, _inherits2["default"])(RootSelect, _Component);
|
|
109
|
-
|
|
110
65
|
var _super = (0, _createSuper2["default"])(RootSelect);
|
|
111
|
-
|
|
112
66
|
function RootSelect() {
|
|
113
67
|
var _this;
|
|
114
|
-
|
|
115
68
|
(0, _classCallCheck2["default"])(this, RootSelect);
|
|
116
|
-
|
|
117
69
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
118
70
|
args[_key] = arguments[_key];
|
|
119
71
|
}
|
|
120
|
-
|
|
121
72
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
122
73
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "firstSelectedOptionRef", /*#__PURE__*/_react["default"].createRef());
|
|
74
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "triggerRef", /*#__PURE__*/_react["default"].createRef());
|
|
123
75
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "isScrolledToFirstOption", false);
|
|
124
76
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "lastHandleOptionNodeCall", -1);
|
|
125
77
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleOptionNode", function (node) {
|
|
@@ -139,9 +91,8 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
139
91
|
return function (e) {
|
|
140
92
|
var newValue = optionValue;
|
|
141
93
|
var _this$asProps = _this.asProps,
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
94
|
+
value = _this$asProps.value,
|
|
95
|
+
multiselect = _this$asProps.multiselect;
|
|
145
96
|
if (Array.isArray(value)) {
|
|
146
97
|
if (value.includes(optionValue)) {
|
|
147
98
|
newValue = value.filter(function (v) {
|
|
@@ -151,23 +102,22 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
151
102
|
newValue = value.concat(optionValue);
|
|
152
103
|
}
|
|
153
104
|
}
|
|
154
|
-
|
|
155
105
|
_this.handlers.value(newValue, e);
|
|
156
|
-
|
|
157
|
-
|
|
106
|
+
if (!multiselect) {
|
|
107
|
+
var _this$triggerRef$curr;
|
|
108
|
+
(_this$triggerRef$curr = _this.triggerRef.current) === null || _this$triggerRef$curr === void 0 ? void 0 : _this$triggerRef$curr.focus();
|
|
109
|
+
_this.handlers.visible(false);
|
|
110
|
+
}
|
|
158
111
|
};
|
|
159
112
|
});
|
|
160
113
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handlerClear", function (e) {
|
|
161
114
|
var value = _this.asProps.value;
|
|
162
115
|
var emptyValue = getEmptyValue(Array.isArray(value));
|
|
163
|
-
|
|
164
116
|
_this.handlers.value(emptyValue, e);
|
|
165
|
-
|
|
166
117
|
_this.handlers.visible(false);
|
|
167
118
|
});
|
|
168
119
|
return _this;
|
|
169
120
|
}
|
|
170
|
-
|
|
171
121
|
(0, _createClass2["default"])(RootSelect, [{
|
|
172
122
|
key: "uncontrolledProps",
|
|
173
123
|
value: function uncontrolledProps() {
|
|
@@ -180,24 +130,24 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
180
130
|
key: "getTriggerProps",
|
|
181
131
|
value: function getTriggerProps() {
|
|
182
132
|
var _this$asProps2 = this.asProps,
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
133
|
+
size = _this$asProps2.size,
|
|
134
|
+
disabled = _this$asProps2.disabled,
|
|
135
|
+
visible = _this$asProps2.visible,
|
|
136
|
+
state = _this$asProps2.state,
|
|
137
|
+
placeholder = _this$asProps2.placeholder,
|
|
138
|
+
value = _this$asProps2.value,
|
|
139
|
+
options = _this$asProps2.options,
|
|
140
|
+
forwardRef = _this$asProps2.forwardRef,
|
|
141
|
+
name = _this$asProps2.name,
|
|
142
|
+
multiselect = _this$asProps2.multiselect,
|
|
143
|
+
uid = _this$asProps2.uid,
|
|
144
|
+
disablePortal = _this$asProps2.disablePortal,
|
|
145
|
+
getI18nText = _this$asProps2.getI18nText;
|
|
196
146
|
return {
|
|
197
147
|
id: "igc-".concat(uid, "-trigger"),
|
|
198
148
|
'aria-controls': "igc-".concat(uid, "-list"),
|
|
199
149
|
'aria-flowto': visible && !disablePortal ? "igc-".concat(uid, "-list") : undefined,
|
|
200
|
-
|
|
150
|
+
focusHint: visible && !disablePortal ? getI18nText('triggerHint') : undefined,
|
|
201
151
|
'aria-haspopup': 'listbox',
|
|
202
152
|
'aria-expanded': visible ? 'true' : 'false',
|
|
203
153
|
empty: isEmptyValue(value),
|
|
@@ -212,15 +162,16 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
212
162
|
active: visible,
|
|
213
163
|
onClear: this.handlerClear,
|
|
214
164
|
children: this.renderChildrenTrigger(value, options),
|
|
215
|
-
getI18nText: getI18nText
|
|
165
|
+
getI18nText: getI18nText,
|
|
166
|
+
ref: this.triggerRef
|
|
216
167
|
};
|
|
217
168
|
}
|
|
218
169
|
}, {
|
|
219
170
|
key: "getListProps",
|
|
220
171
|
value: function getListProps() {
|
|
221
172
|
var _this$asProps3 = this.asProps,
|
|
222
|
-
|
|
223
|
-
|
|
173
|
+
multiselect = _this$asProps3.multiselect,
|
|
174
|
+
uid = _this$asProps3.uid;
|
|
224
175
|
return {
|
|
225
176
|
'aria-multiselectable': multiselect ? 'true' : undefined,
|
|
226
177
|
id: "igc-".concat(uid, "-list"),
|
|
@@ -233,8 +184,8 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
233
184
|
key: "getMenuProps",
|
|
234
185
|
value: function getMenuProps() {
|
|
235
186
|
var _this$asProps4 = this.asProps,
|
|
236
|
-
|
|
237
|
-
|
|
187
|
+
uid = _this$asProps4.uid,
|
|
188
|
+
getI18nText = _this$asProps4.getI18nText;
|
|
238
189
|
return {
|
|
239
190
|
id: "igc-".concat(uid, "-list"),
|
|
240
191
|
role: 'listbox',
|
|
@@ -246,16 +197,14 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
246
197
|
key: "getOptionProps",
|
|
247
198
|
value: function getOptionProps(props) {
|
|
248
199
|
var _this$asProps5 = this.asProps,
|
|
249
|
-
|
|
250
|
-
|
|
200
|
+
value = _this$asProps5.value,
|
|
201
|
+
uid = _this$asProps5.uid;
|
|
251
202
|
var selected = isSelectedOption(value, props.value);
|
|
252
203
|
var other = {};
|
|
253
204
|
this._optionSelected = selected;
|
|
254
|
-
|
|
255
205
|
if (selected) {
|
|
256
206
|
other.ref = this.handleOptionNode;
|
|
257
207
|
}
|
|
258
|
-
|
|
259
208
|
return (0, _objectSpread2["default"])({
|
|
260
209
|
selected: selected,
|
|
261
210
|
'aria-selected': selected ? 'true' : 'false',
|
|
@@ -298,7 +247,6 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
298
247
|
return acc;
|
|
299
248
|
}, []);
|
|
300
249
|
}
|
|
301
|
-
|
|
302
250
|
return Array.isArray(value) ? value.reduce(function (acc, value) {
|
|
303
251
|
if (acc.length) acc.push(', ');
|
|
304
252
|
acc.push(value);
|
|
@@ -310,19 +258,17 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
310
258
|
value: function render() {
|
|
311
259
|
var _ref2 = this.asProps;
|
|
312
260
|
var _this$asProps6 = this.asProps,
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
261
|
+
Children = _this$asProps6.Children,
|
|
262
|
+
options = _this$asProps6.options,
|
|
263
|
+
multiselect = _this$asProps6.multiselect,
|
|
264
|
+
value = _this$asProps6.value,
|
|
265
|
+
other = (0, _objectWithoutProperties2["default"])(_this$asProps6, _excluded);
|
|
318
266
|
var advanceMode = (0, _findComponent["default"])(Children, [Select.Trigger.displayName, Select.Popper.displayName]);
|
|
319
|
-
|
|
320
|
-
_logger["default"].warn(options && advanceMode, "Don't use at the same time 'options' property and '<Select.Trigger/>/<Select.Popper/>'", other['data-ui-name'] || Select.displayName);
|
|
321
|
-
|
|
267
|
+
_logger["default"].warn(options && advanceMode, 'Don\'t use at the same time \'options\' property and \'<Select.Trigger/>/<Select.Popper/>\'', other['data-ui-name'] || Select.displayName);
|
|
322
268
|
if (options) {
|
|
323
269
|
var _ref = this.asProps;
|
|
324
270
|
return /*#__PURE__*/_react["default"].createElement(_dropdownMenu["default"], (0, _core.assignProps)({}, _ref), /*#__PURE__*/_react["default"].createElement(Select.Trigger, (0, _extends2["default"])({}, other, {
|
|
325
|
-
role: "
|
|
271
|
+
role: "combobox"
|
|
326
272
|
})), /*#__PURE__*/_react["default"].createElement(Select.Menu, null, options.map(function (option) {
|
|
327
273
|
return /*#__PURE__*/_react["default"].createElement(Select.Option, (0, _extends2["default"])({
|
|
328
274
|
key: option.value,
|
|
@@ -331,13 +277,11 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
331
277
|
}, option), multiselect && /*#__PURE__*/_react["default"].createElement(Select.Option.Checkbox, null), option.children);
|
|
332
278
|
})));
|
|
333
279
|
}
|
|
334
|
-
|
|
335
280
|
return /*#__PURE__*/_react["default"].createElement(_dropdownMenu["default"], (0, _core.assignProps)({}, _ref2), /*#__PURE__*/_react["default"].createElement(Children, null));
|
|
336
281
|
}
|
|
337
282
|
}]);
|
|
338
283
|
return RootSelect;
|
|
339
284
|
}(_core.Component);
|
|
340
|
-
|
|
341
285
|
(0, _defineProperty2["default"])(RootSelect, "displayName", 'Select');
|
|
342
286
|
(0, _defineProperty2["default"])(RootSelect, "style", style);
|
|
343
287
|
(0, _defineProperty2["default"])(RootSelect, "enhance", [(0, _uniqueID["default"])(), (0, _i18nEnhance["default"])(_intergalacticDynamicLocales.localizedMessages)]);
|
|
@@ -352,25 +296,22 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
352
296
|
locale: 'en'
|
|
353
297
|
};
|
|
354
298
|
});
|
|
355
|
-
|
|
356
299
|
var isInputTriggerTag = function isInputTriggerTag(tag) {
|
|
357
300
|
var _tag$render;
|
|
358
|
-
|
|
359
301
|
if (typeof tag === 'string') return tag.toLowerCase().includes('input');
|
|
360
302
|
if ((0, _typeof2["default"])(tag) === 'object' && tag !== null && typeof tag.displayName === 'string') return tag.displayName.toLowerCase().includes('input');
|
|
361
303
|
if ((0, _typeof2["default"])(tag) === 'object' && tag !== null && typeof ((_tag$render = tag.render) === null || _tag$render === void 0 ? void 0 : _tag$render.displayName) === 'string') return tag.render.displayName.toLowerCase().includes('input');
|
|
362
304
|
return false;
|
|
363
305
|
};
|
|
364
|
-
|
|
365
306
|
function Trigger(_ref5) {
|
|
366
307
|
var _ref3 = arguments[0];
|
|
367
308
|
var Children = _ref5.Children,
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
309
|
+
name = _ref5.name,
|
|
310
|
+
value = _ref5.value,
|
|
311
|
+
$hiddenRef = _ref5.$hiddenRef,
|
|
312
|
+
_ref5$tag = _ref5.tag,
|
|
313
|
+
Tag = _ref5$tag === void 0 ? _baseTrigger.ButtonTrigger : _ref5$tag,
|
|
314
|
+
getI18nText = _ref5.getI18nText;
|
|
374
315
|
var hasInputTrigger = isInputTriggerTag(Tag);
|
|
375
316
|
return /*#__PURE__*/_react["default"].createElement(_dropdownMenu["default"].Trigger, (0, _core.assignProps)({
|
|
376
317
|
"tag": Tag,
|
|
@@ -384,26 +325,22 @@ function Trigger(_ref5) {
|
|
|
384
325
|
ref: $hiddenRef
|
|
385
326
|
}));
|
|
386
327
|
}
|
|
387
|
-
|
|
388
328
|
function Checkbox(props) {
|
|
389
329
|
var _useBox = (0, _flexBox.useBox)(props, props.forwardRef),
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
330
|
+
_useBox2 = (0, _slicedToArray2["default"])(_useBox, 2),
|
|
331
|
+
SOptionCheckbox = _useBox2[0],
|
|
332
|
+
componentProps = _useBox2[1];
|
|
394
333
|
var size = props.size,
|
|
395
|
-
|
|
396
|
-
|
|
334
|
+
theme = props.theme,
|
|
335
|
+
selected = props.selected;
|
|
397
336
|
var styles = (0, _core.sstyled)(props.styles);
|
|
398
|
-
|
|
399
337
|
var _styles$cn = styles.cn('SOptionCheckbox', {
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
338
|
+
size: size,
|
|
339
|
+
'use:theme': (0, _color["default"])(theme),
|
|
340
|
+
checked: selected
|
|
341
|
+
}),
|
|
342
|
+
className = _styles$cn.className,
|
|
343
|
+
style = _styles$cn.style;
|
|
407
344
|
return /*#__PURE__*/_react["default"].createElement(SOptionCheckbox, (0, _extends2["default"])({}, componentProps, {
|
|
408
345
|
className: (0, _classnames["default"])(className, componentProps.className) || undefined,
|
|
409
346
|
style: (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, style), componentProps.style),
|
|
@@ -412,12 +349,10 @@ function Checkbox(props) {
|
|
|
412
349
|
"aria-checked": selected
|
|
413
350
|
}));
|
|
414
351
|
}
|
|
415
|
-
|
|
416
352
|
var InputSearchWrapper = function InputSearchWrapper() {
|
|
417
353
|
var _ref4 = arguments[0];
|
|
418
354
|
return /*#__PURE__*/_react["default"].createElement(_InputSearch["default"], (0, _core.assignProps)({}, _ref4));
|
|
419
355
|
};
|
|
420
|
-
|
|
421
356
|
var Select = (0, _core["default"])(RootSelect, {
|
|
422
357
|
Trigger: [Trigger, {
|
|
423
358
|
Addon: _baseTrigger.ButtonTrigger.Addon,
|