@semcore/select 2.7.11 → 3.0.1
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 +22 -0
- package/lib/cjs/InputSearch.js +11 -20
- package/lib/cjs/InputSearch.js.map +1 -1
- package/lib/cjs/Select.js +34 -113
- package/lib/cjs/Select.js.map +1 -1
- package/lib/cjs/index.d.ts +0 -16
- package/lib/cjs/style/input-search.shadow.css +19 -6
- package/lib/cjs/style/select.shadow.css +16 -22
- package/lib/es6/InputSearch.js +11 -17
- package/lib/es6/InputSearch.js.map +1 -1
- package/lib/es6/Select.js +34 -111
- package/lib/es6/Select.js.map +1 -1
- package/lib/es6/index.d.ts +0 -16
- package/lib/es6/style/input-search.shadow.css +19 -6
- package/lib/es6/style/select.shadow.css +16 -22
- package/lib/types/index.d.ts +0 -16
- package/package.json +6 -6
- package/src/InputSearch.jsx +12 -20
- package/src/Select.jsx +13 -75
- package/src/index.d.ts +0 -16
- package/src/style/input-search.shadow.css +19 -6
- package/src/style/select.shadow.css +16 -22
package/lib/es6/InputSearch.js
CHANGED
|
@@ -16,11 +16,8 @@ import React from 'react';
|
|
|
16
16
|
import createComponent, { Component, CONTEXT_COMPONENT, sstyled } from '@semcore/core';
|
|
17
17
|
import { Box } from '@semcore/flex-box';
|
|
18
18
|
import Input from '@semcore/input';
|
|
19
|
-
import Divider from '@semcore/divider';
|
|
20
19
|
import SearchM from '@semcore/icon/Search/m';
|
|
21
20
|
import CloseM from '@semcore/icon/Close/m';
|
|
22
|
-
import SearchL from '@semcore/icon/Search/l';
|
|
23
|
-
import CloseL from '@semcore/icon/Close/l';
|
|
24
21
|
import Select from './Select';
|
|
25
22
|
|
|
26
23
|
/*__reshadow-styles__:"./style/input-search.shadow.css"*/
|
|
@@ -28,20 +25,19 @@ var style = (
|
|
|
28
25
|
/*__reshadow_css_start__*/
|
|
29
26
|
_sstyled.insert(
|
|
30
27
|
/*__inner_css_start__*/
|
|
31
|
-
".
|
|
28
|
+
".___SInputSearch_qj5zn_gg_.__size_qj5zn_gg_{padding:0}.___SInputSearch_qj5zn_gg_>[data-ui-name=Input]:first-child>[data-ui-name=InputSearch]~div{top:-1px;left:-1px;width:100%;border-radius:6px 6px 0 0}.___SInputSearch_qj5zn_gg_._size_m_qj5zn_gg_>[data-ui-name=Input]:first-child{height:32px}.___SInputSearch_qj5zn_gg_ [data-ui-name=\"Input.Addon\"]:last-of-type{visibility:hidden}.___SInputSearch_qj5zn_gg_.__filled_qj5zn_gg_ [data-ui-name=\"Input.Addon\"]:last-of-type{visibility:visible}"
|
|
32
29
|
/*__inner_css_end__*/
|
|
33
|
-
, "
|
|
30
|
+
, "16lophm_gg_")
|
|
34
31
|
/*__reshadow_css_end__*/
|
|
35
32
|
, {
|
|
36
|
-
"__SInputSearch": "
|
|
37
|
-
"
|
|
38
|
-
"
|
|
39
|
-
"
|
|
33
|
+
"__SInputSearch": "___SInputSearch_qj5zn_gg_",
|
|
34
|
+
"_size": "__size_qj5zn_gg_",
|
|
35
|
+
"_size_m": "_size_m_qj5zn_gg_",
|
|
36
|
+
"_filled": "__filled_qj5zn_gg_"
|
|
40
37
|
});
|
|
41
38
|
var MAP_SIZE_TO_ICON = {
|
|
42
39
|
m: [SearchM, CloseM],
|
|
43
|
-
l: [SearchM, CloseM]
|
|
44
|
-
xl: [SearchL, CloseL]
|
|
40
|
+
l: [SearchM, CloseM]
|
|
45
41
|
};
|
|
46
42
|
|
|
47
43
|
var InputSearch = /*#__PURE__*/function (_Component) {
|
|
@@ -86,8 +82,9 @@ var InputSearch = /*#__PURE__*/function (_Component) {
|
|
|
86
82
|
forwardRef = _this$asProps.forwardRef,
|
|
87
83
|
styles = _this$asProps.styles;
|
|
88
84
|
var finalSize = size || this.context.size;
|
|
89
|
-
return _ref = sstyled(styles), /*#__PURE__*/React.createElement(
|
|
90
|
-
"size": finalSize
|
|
85
|
+
return _ref = sstyled(styles), /*#__PURE__*/React.createElement(SInputSearch, _ref.cn("SInputSearch", {
|
|
86
|
+
"size": finalSize,
|
|
87
|
+
"use:filled": value
|
|
91
88
|
}), /*#__PURE__*/React.createElement(Input, _ref.cn("Input", {
|
|
92
89
|
"size": finalSize
|
|
93
90
|
}), /*#__PURE__*/React.createElement(Input.Addon, {
|
|
@@ -99,11 +96,8 @@ var InputSearch = /*#__PURE__*/function (_Component) {
|
|
|
99
96
|
tag: MAP_SIZE_TO_ICON[finalSize][1],
|
|
100
97
|
role: "button",
|
|
101
98
|
interactive: true,
|
|
102
|
-
style: {
|
|
103
|
-
visibility: value ? 'visible' : 'hidden'
|
|
104
|
-
},
|
|
105
99
|
onClick: this.handleClear
|
|
106
|
-
})))
|
|
100
|
+
})));
|
|
107
101
|
}
|
|
108
102
|
}]);
|
|
109
103
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/InputSearch.jsx"],"names":["React","createComponent","Component","CONTEXT_COMPONENT","sstyled","Box","Input","
|
|
1
|
+
{"version":3,"sources":["../../src/InputSearch.jsx"],"names":["React","createComponent","Component","CONTEXT_COMPONENT","sstyled","Box","Input","SearchM","CloseM","Select","MAP_SIZE_TO_ICON","m","l","InputSearch","e","handlers","value","SInputSearch","asProps","size","forwardRef","styles","finalSize","context","handleClear","style","defaultValue"],"mappings":";;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,eAAP,IAA0BC,SAA1B,EAAqCC,iBAArC,EAAwDC,OAAxD,QAAuE,eAAvE;AACA,SAASC,GAAT,QAAoB,mBAApB;AACA,OAAOC,KAAP,MAAkB,gBAAlB;AACA,OAAOC,OAAP,MAAoB,wBAApB;AACA,OAAOC,MAAP,MAAmB,uBAAnB;AACA,OAAOC,MAAP,MAAmB,UAAnB;;;;;;;;;;;;;;;;;AAIA,IAAMC,gBAAgB,GAAG;AACvBC,EAAAA,CAAC,EAAE,CAACJ,OAAD,EAAUC,MAAV,CADoB;AAEvBI,EAAAA,CAAC,EAAE,CAACL,OAAD,EAAUC,MAAV;AAFoB,CAAzB;;IAKMK,W;;;;;;;;;;;;;;;;kEAiBU,UAACC,CAAD,EAAO;AACnB,YAAKC,QAAL,CAAcC,KAAd,CAAoB,EAApB,EAAwBF,CAAxB;AACD,K;;;;;;;WARD,6BAAoB;AAClB,aAAO;AACLE,QAAAA,KAAK,EAAE;AADF,OAAP;AAGD;;;WAMD,kBAAS;AAAA;;AACP,UAAMC,YAAY,GAAGZ,GAArB;AACA,0BAA4C,KAAKa,OAAjD;AAAA,UAAQC,IAAR,iBAAQA,IAAR;AAAA,UAAcH,KAAd,iBAAcA,KAAd;AAAA,UAAqBI,UAArB,iBAAqBA,UAArB;AAAA,UAAiCC,MAAjC,iBAAiCA,MAAjC;AACA,UAAMC,SAAS,GAAGH,IAAI,IAAI,KAAKI,OAAL,CAAaJ,IAAvC;AAEA,oBAAOf,OAAO,CAACiB,MAAD,CAAd,eACE,oBAAC,YAAD;AAAA,gBAAoBC,SAApB;AAAA,sBAA2CN;AAA3C,uBACE,oBAAC,KAAD;AAAA,gBAAaM;AAAb,uBACE,oBAAC,KAAD,CAAO,KAAP;AAAa,QAAA,GAAG,EAAEZ,gBAAgB,CAACY,SAAD,CAAhB,CAA4B,CAA5B;AAAlB,QADF,eAEE,oBAAC,KAAD,CAAO,KAAP;AAAa,QAAA,GAAG,EAAEF,UAAlB;AAA8B,QAAA,SAAS;AAAvC,SAA4C,KAAKF,OAAjD,EAFF,eAGE,oBAAC,KAAD,CAAO,KAAP;AACE,QAAA,GAAG,EAAER,gBAAgB,CAACY,SAAD,CAAhB,CAA4B,CAA5B,CADP;AAEE,QAAA,IAAI,EAAC,QAFP;AAGE,QAAA,WAAW,MAHb;AAIE,QAAA,OAAO,EAAE,KAAKE;AAJhB,QAHF,CADF,CADF;AAcD;;;;EAxCuBtB,S;;gBAApBW,W,iBACiB,a;;gBADjBA,W,WAGWY,K;;gBAHXZ,W,kBAKkB;AACpBa,EAAAA,YAAY,EAAE;AADM,C;;gBALlBb,W,iBASiBJ,MAAM,CAACN,iBAAD,C;;AAkC7B,eAAeF,eAAe,CAACY,WAAD,CAA9B","sourcesContent":["import React from 'react';\nimport createComponent, { Component, CONTEXT_COMPONENT, sstyled } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport Input from '@semcore/input';\nimport SearchM from '@semcore/icon/Search/m';\nimport CloseM from '@semcore/icon/Close/m';\nimport Select from './Select';\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\n static defaultProps = {\n defaultValue: '',\n };\n\n static contextType = Select[CONTEXT_COMPONENT];\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 SInputSearch = Box;\n const { size, value, forwardRef, styles } = this.asProps;\n const finalSize = size || this.context.size;\n\n return sstyled(styles)(\n <SInputSearch size={finalSize} use:filled={value}>\n <Input size={finalSize}>\n <Input.Addon tag={MAP_SIZE_TO_ICON[finalSize][0]} />\n <Input.Value ref={forwardRef} autoFocus {...this.asProps} />\n <Input.Addon\n tag={MAP_SIZE_TO_ICON[finalSize][1]}\n role=\"button\"\n interactive\n onClick={this.handleClear}\n />\n </Input>\n </SInputSearch>,\n );\n }\n}\n\nexport default createComponent(InputSearch);\n"],"file":"InputSearch.js"}
|
package/lib/es6/Select.js
CHANGED
|
@@ -41,19 +41,17 @@ var style = (
|
|
|
41
41
|
/*__reshadow_css_start__*/
|
|
42
42
|
_sstyled.insert(
|
|
43
43
|
/*__inner_css_start__*/
|
|
44
|
-
".
|
|
44
|
+
".___SOptionCheckbox_1sdhb_gg_{margin-top:2px;margin-right:8px;margin-bottom:auto;position:relative;flex-shrink:0}.___SOptionCheckbox_1sdhb_gg_:before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background:#fff;border:1px solid;border-radius:4px;border-color:#c4c7cf}.___SOptionCheckbox_1sdhb_gg_{width:16px;height:16px}.___SOptionCheckbox_1sdhb_gg_:after{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;margin:0 2px;background-repeat:no-repeat;background-position:50%;background-image:url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOC4yNSAxTDQgNS4yNSAxLjc1IDMiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L3N2Zz4=\")}.___SOptionCheckbox_1sdhb_gg_._size_l_1sdhb_gg_{width:20px;height:20px}.___SOptionCheckbox_1sdhb_gg_._size_l_1sdhb_gg_:after{background-image:url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTEgMS41TDQuNzUgNy43NSAxIDQiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L3N2Zz4=\")}.___SOptionCheckbox_1sdhb_gg_.__checked_1sdhb_gg_:before{background-color:#008ff8;border-color:#008ff8}.___SOptionCheckbox_1sdhb_gg_.__theme_1sdhb_gg_:before{border-color:var(--theme_1lo3q1n)}.___SOptionCheckbox_1sdhb_gg_.__theme_1sdhb_gg_.__checked_1sdhb_gg_:before{background-color:var(--theme_1lo3q1n);border-color:var(--theme_1lo3q1n)}.___SOptionCheckbox_1sdhb_gg_.__selected_1sdhb_gg_{background-color:rgba(196,229,254,.7)}.___SOptionCheckbox_1sdhb_gg_.__selected_1sdhb_gg_:hover{background-color:rgba(196,229,254,.7)}"
|
|
45
45
|
/*__inner_css_end__*/
|
|
46
|
-
, "
|
|
46
|
+
, "1lo3q1n_gg_")
|
|
47
47
|
/*__reshadow_css_end__*/
|
|
48
48
|
, {
|
|
49
|
-
"__SOptionCheckbox": "
|
|
50
|
-
"
|
|
51
|
-
"
|
|
52
|
-
"
|
|
53
|
-
"
|
|
54
|
-
"
|
|
55
|
-
"--theme": "--theme_12l5bjj",
|
|
56
|
-
"_selected": "__selected_13dcz_gg_"
|
|
49
|
+
"__SOptionCheckbox": "___SOptionCheckbox_1sdhb_gg_",
|
|
50
|
+
"_size_l": "_size_l_1sdhb_gg_",
|
|
51
|
+
"_checked": "__checked_1sdhb_gg_",
|
|
52
|
+
"_theme": "__theme_1sdhb_gg_",
|
|
53
|
+
"--theme": "--theme_1lo3q1n",
|
|
54
|
+
"_selected": "__selected_1sdhb_gg_"
|
|
57
55
|
});
|
|
58
56
|
|
|
59
57
|
function isSelectedOption(value, valueOption) {
|
|
@@ -111,38 +109,11 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
111
109
|
};
|
|
112
110
|
});
|
|
113
111
|
|
|
114
|
-
_defineProperty(_assertThisInitialized(_this), "bindHandlerOptionFallbackClick", function (props) {
|
|
115
|
-
return function (e) {
|
|
116
|
-
var _this$asProps2 = _this.asProps,
|
|
117
|
-
selectedOptions = _this$asProps2.selectedOptions,
|
|
118
|
-
multiselect = _this$asProps2.multiselect;
|
|
119
|
-
var optionProps = [props];
|
|
120
|
-
|
|
121
|
-
if (multiselect) {
|
|
122
|
-
if (isSelectedOption(_this.fallbackDeprecatedValue(selectedOptions), props.value)) {
|
|
123
|
-
optionProps = selectedOptions.filter(function (o) {
|
|
124
|
-
return o.value !== props.value;
|
|
125
|
-
});
|
|
126
|
-
} else {
|
|
127
|
-
optionProps = selectedOptions.concat(props);
|
|
128
|
-
}
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
_this.handlers.value(optionProps, e);
|
|
132
|
-
|
|
133
|
-
if (!multiselect) _this.handlers.visible(false);
|
|
134
|
-
};
|
|
135
|
-
});
|
|
136
|
-
|
|
137
112
|
_defineProperty(_assertThisInitialized(_this), "handlerClear", function (e) {
|
|
138
113
|
var value = _this.asProps.value;
|
|
139
|
-
var emptyValue = getEmptyValue(Array.isArray(
|
|
114
|
+
var emptyValue = getEmptyValue(Array.isArray(value));
|
|
140
115
|
|
|
141
|
-
|
|
142
|
-
_this.handlers.value(Array.isArray(emptyValue) ? emptyValue : [], e);
|
|
143
|
-
} else {
|
|
144
|
-
_this.handlers.value(emptyValue, e);
|
|
145
|
-
}
|
|
116
|
+
_this.handlers.value(emptyValue, e);
|
|
146
117
|
|
|
147
118
|
_this.handlers.visible(false);
|
|
148
119
|
});
|
|
@@ -155,48 +126,25 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
155
126
|
value: function uncontrolledProps() {
|
|
156
127
|
return {
|
|
157
128
|
visible: null,
|
|
158
|
-
value: null
|
|
159
|
-
selectedOptions: null
|
|
129
|
+
value: null
|
|
160
130
|
};
|
|
161
131
|
}
|
|
162
|
-
}, {
|
|
163
|
-
key: "isFallback",
|
|
164
|
-
value: function isFallback() {
|
|
165
|
-
var _this$props = this.props,
|
|
166
|
-
selectedOptions = _this$props.selectedOptions,
|
|
167
|
-
defaultSelectedOptions = _this$props.defaultSelectedOptions;
|
|
168
|
-
return selectedOptions !== undefined || defaultSelectedOptions.length !== 0;
|
|
169
|
-
}
|
|
170
|
-
}, {
|
|
171
|
-
key: "fallbackDeprecatedValue",
|
|
172
|
-
value: function fallbackDeprecatedValue(value) {
|
|
173
|
-
return this.isFallback() ? this.asProps.selectedOptions.map(function (o) {
|
|
174
|
-
return o.value;
|
|
175
|
-
}) : value;
|
|
176
|
-
}
|
|
177
|
-
}, {
|
|
178
|
-
key: "fallbackDeprecatedLabel",
|
|
179
|
-
value: function fallbackDeprecatedLabel(value) {
|
|
180
|
-
return this.isFallback() ? this.asProps.selectedOptions.map(function (o) {
|
|
181
|
-
return o.label || o.value;
|
|
182
|
-
}) : value;
|
|
183
|
-
}
|
|
184
132
|
}, {
|
|
185
133
|
key: "getTriggerProps",
|
|
186
134
|
value: function getTriggerProps() {
|
|
187
|
-
var _this$
|
|
188
|
-
size = _this$
|
|
189
|
-
disabled = _this$
|
|
190
|
-
visible = _this$
|
|
191
|
-
state = _this$
|
|
192
|
-
placeholder = _this$
|
|
193
|
-
value = _this$
|
|
194
|
-
options = _this$
|
|
195
|
-
forwardRef = _this$
|
|
196
|
-
name = _this$
|
|
197
|
-
multiselect = _this$
|
|
135
|
+
var _this$asProps2 = this.asProps,
|
|
136
|
+
size = _this$asProps2.size,
|
|
137
|
+
disabled = _this$asProps2.disabled,
|
|
138
|
+
visible = _this$asProps2.visible,
|
|
139
|
+
state = _this$asProps2.state,
|
|
140
|
+
placeholder = _this$asProps2.placeholder,
|
|
141
|
+
value = _this$asProps2.value,
|
|
142
|
+
options = _this$asProps2.options,
|
|
143
|
+
forwardRef = _this$asProps2.forwardRef,
|
|
144
|
+
name = _this$asProps2.name,
|
|
145
|
+
multiselect = _this$asProps2.multiselect;
|
|
198
146
|
return {
|
|
199
|
-
empty: isEmptyValue(
|
|
147
|
+
empty: isEmptyValue(value),
|
|
200
148
|
size: size,
|
|
201
149
|
value: value,
|
|
202
150
|
name: name,
|
|
@@ -207,14 +155,14 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
207
155
|
disabled: disabled,
|
|
208
156
|
active: visible,
|
|
209
157
|
onClear: this.handlerClear,
|
|
210
|
-
children: this.renderChildrenTrigger(
|
|
158
|
+
children: this.renderChildrenTrigger(value, options)
|
|
211
159
|
};
|
|
212
160
|
}
|
|
213
161
|
}, {
|
|
214
162
|
key: "getOptionProps",
|
|
215
163
|
value: function getOptionProps(props) {
|
|
216
164
|
var value = this.asProps.value;
|
|
217
|
-
var selected = isSelectedOption(
|
|
165
|
+
var selected = isSelectedOption(value, props.value);
|
|
218
166
|
var other = {};
|
|
219
167
|
this._optionSelected = selected;
|
|
220
168
|
|
|
@@ -225,7 +173,7 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
225
173
|
|
|
226
174
|
return _objectSpread({
|
|
227
175
|
selected: selected,
|
|
228
|
-
onClick: this.
|
|
176
|
+
onClick: this.bindHandlerOptionClick(props.value)
|
|
229
177
|
}, other);
|
|
230
178
|
}
|
|
231
179
|
}, {
|
|
@@ -252,7 +200,6 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
252
200
|
key: "renderChildrenTrigger",
|
|
253
201
|
value: function renderChildrenTrigger(value, options) {
|
|
254
202
|
if (options) {
|
|
255
|
-
value = this.fallbackDeprecatedValue(value);
|
|
256
203
|
return [].concat(value).reduce(function (acc, value) {
|
|
257
204
|
var selectedOption = options.find(function (o) {
|
|
258
205
|
return isSelectedOption(value, o.value);
|
|
@@ -264,7 +211,6 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
264
211
|
}, []);
|
|
265
212
|
}
|
|
266
213
|
|
|
267
|
-
value = this.fallbackDeprecatedLabel(value);
|
|
268
214
|
return Array.isArray(value) ? value.reduce(function (acc, value) {
|
|
269
215
|
if (acc.length) acc.push(', ');
|
|
270
216
|
acc.push(value);
|
|
@@ -313,26 +259,21 @@ var RootSelect = /*#__PURE__*/function (_Component) {
|
|
|
313
259
|
value: function render() {
|
|
314
260
|
var _ref2 = this.asProps;
|
|
315
261
|
|
|
316
|
-
var _this$
|
|
317
|
-
Children = _this$
|
|
318
|
-
options = _this$
|
|
319
|
-
multiselect = _this$
|
|
320
|
-
other = _objectWithoutProperties(_this$
|
|
262
|
+
var _this$asProps3 = this.asProps,
|
|
263
|
+
Children = _this$asProps3.Children,
|
|
264
|
+
options = _this$asProps3.options,
|
|
265
|
+
multiselect = _this$asProps3.multiselect,
|
|
266
|
+
other = _objectWithoutProperties(_this$asProps3, _excluded);
|
|
321
267
|
|
|
322
268
|
var advanceMode = findComponent(Children, [Select.Trigger.displayName, Select.Popper.displayName]);
|
|
323
|
-
logger.warn( // @ts-ignore
|
|
324
|
-
this.isFallback(), "'selectedOptions'/'defaultSelectedOptions' changed to 'value/defaultValue' and take only values, not objects.", other['data-ui-name'] || Select.displayName);
|
|
325
269
|
logger.warn(options && advanceMode, "Don't use at the same time 'options' property and '<Select.Trigger/>/<Select.Popper/>'", other['data-ui-name'] || Select.displayName);
|
|
326
270
|
|
|
327
271
|
if (options) {
|
|
328
272
|
var _ref = arguments[0];
|
|
329
|
-
|
|
330
|
-
var _Component2 = multiselect ? Select.OptionCheckbox : Select.Option;
|
|
331
|
-
|
|
332
273
|
return /*#__PURE__*/React.createElement(DropdownMenu, _assignProps({}, _ref), /*#__PURE__*/React.createElement(Select.Trigger, other), /*#__PURE__*/React.createElement(Select.Menu, null, options.map(function (option, i) {
|
|
333
|
-
return /*#__PURE__*/React.createElement(
|
|
274
|
+
return /*#__PURE__*/React.createElement(Select.Option, _extends({
|
|
334
275
|
key: i
|
|
335
|
-
}, option));
|
|
276
|
+
}, option), multiselect && /*#__PURE__*/React.createElement(Select.Option.Checkbox, null), option.children);
|
|
336
277
|
})));
|
|
337
278
|
}
|
|
338
279
|
|
|
@@ -352,7 +293,6 @@ _defineProperty(RootSelect, "defaultProps", function (props) {
|
|
|
352
293
|
placeholder: props.multiselect ? 'Select options' : 'Select option',
|
|
353
294
|
size: 'm',
|
|
354
295
|
defaultValue: getEmptyValue(props.multiselect),
|
|
355
|
-
defaultSelectedOptions: [],
|
|
356
296
|
defaultVisible: false
|
|
357
297
|
};
|
|
358
298
|
});
|
|
@@ -401,22 +341,8 @@ function Checkbox(props) {
|
|
|
401
341
|
}));
|
|
402
342
|
}
|
|
403
343
|
|
|
404
|
-
function
|
|
405
|
-
var selected = props.selected,
|
|
406
|
-
size = props.size,
|
|
407
|
-
theme = props.theme,
|
|
408
|
-
children = props.children;
|
|
409
|
-
return /*#__PURE__*/React.createElement(DropdownMenu.Item, props, /*#__PURE__*/React.createElement(Checkbox, {
|
|
410
|
-
selected: selected,
|
|
411
|
-
size: size,
|
|
412
|
-
theme: theme,
|
|
413
|
-
styles: props.styles
|
|
414
|
-
}), children);
|
|
415
|
-
}
|
|
416
|
-
|
|
417
|
-
var InputSearchWrapper = function InputSearchWrapper(props) {
|
|
344
|
+
var InputSearchWrapper = function InputSearchWrapper() {
|
|
418
345
|
var _ref4 = arguments[0];
|
|
419
|
-
logger.warn(true, "'<".concat(props['data-ui-name'], "/>' is deprecated, use the named import 'import { InputSearch }'"), props['data-ui-name'] || Select.InputSearch.displayName);
|
|
420
346
|
return /*#__PURE__*/React.createElement(InputSearch, _assignProps4({}, _ref4));
|
|
421
347
|
};
|
|
422
348
|
|
|
@@ -434,9 +360,6 @@ var Select = createComponent(RootSelect, {
|
|
|
434
360
|
}],
|
|
435
361
|
OptionTitle: DropdownMenu.ItemTitle,
|
|
436
362
|
OptionHint: DropdownMenu.ItemHint,
|
|
437
|
-
OptionCheckbox: [OptionCheckbox, {
|
|
438
|
-
Addon: DropdownMenu.Item.Addon
|
|
439
|
-
}],
|
|
440
363
|
Divider: Divider,
|
|
441
364
|
InputSearch: InputSearchWrapper,
|
|
442
365
|
Input: InputSearchWrapper
|
package/lib/es6/Select.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Select.jsx"],"names":["React","cn","createComponent","Component","Root","sstyled","DropdownMenu","ButtonTrigger","Divider","findComponent","logger","resolveColor","addonTextChildren","InputSearch","useBox","isSelectedOption","value","valueOption","Array","isArray","includes","isEmptyValue","length","getEmptyValue","multiselect","RootSelect","createRef","optionValue","e","newValue","asProps","filter","v","concat","handlers","visible","props","selectedOptions","optionProps","fallbackDeprecatedValue","o","emptyValue","isFallback","defaultSelectedOptions","undefined","map","label","size","disabled","state","placeholder","options","forwardRef","name","empty","$hiddenRef","active","onClear","handlerClear","children","renderChildrenTrigger","selected","other","_optionSelected","isScrolledToFirstOption","ref","firstSelectedOptionRef","onClick","bindHandlerOptionFallbackClick","bindHandlerOptionClick","hasOption","getOptionProps","my","reduce","acc","selectedOption","find","push","fallbackDeprecatedLabel","setTimeout","current","scrollIntoView","block","inline","scrollToSelectedOption","prevProps","prevState","Children","advanceMode","Select","Trigger","displayName","Popper","warn","OptionCheckbox","Option","option","i","style","defaultValue","defaultVisible","tag","Tag","Text","Addon","Checkbox","SOptionCheckbox","componentProps","theme","styles","checked","className","InputSearchWrapper","List","Menu","Item","OptionTitle","ItemTitle","OptionHint","ItemHint","Input","parent"],"mappings":"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","sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport createComponent, { Component, Root, sstyled } from '@semcore/core';\nimport DropdownMenu from '@semcore/dropdown-menu';\nimport { ButtonTrigger } from '@semcore/base-trigger';\nimport Divider from '@semcore/divider';\nimport findComponent from '@semcore/utils/lib/findComponent';\nimport logger from '@semcore/utils/lib/logger';\nimport resolveColor from '@semcore/utils/lib/color';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\nimport InputSearch from './InputSearch';\nimport { useBox } from '@semcore/flex-box';\n\nimport style from './style/select.shadow.css';\n\nfunction isSelectedOption(value, valueOption) {\n return Array.isArray(value) ? value.includes(valueOption) : valueOption === value;\n}\n\nfunction isEmptyValue(value) {\n return Array.isArray(value) ? value.length === 0 : value === null;\n}\n\nfunction getEmptyValue(multiselect) {\n return multiselect ? [] : null;\n}\n\nclass RootSelect extends Component {\n static displayName = 'Select';\n\n static style = style;\n\n static defaultProps = (props) => ({\n placeholder: props.multiselect ? 'Select options' : 'Select option',\n size: 'm',\n defaultValue: getEmptyValue(props.multiselect),\n defaultSelectedOptions: [],\n defaultVisible: false,\n });\n\n firstSelectedOptionRef = React.createRef();\n\n isScrolledToFirstOption = false;\n\n uncontrolledProps() {\n return {\n visible: null,\n value: null,\n selectedOptions: null,\n };\n }\n\n isFallback() {\n const { selectedOptions, defaultSelectedOptions } = this.props;\n return selectedOptions !== undefined || defaultSelectedOptions.length !== 0;\n }\n\n fallbackDeprecatedValue(value) {\n return this.isFallback() ? this.asProps.selectedOptions.map((o) => o.value) : value;\n }\n\n fallbackDeprecatedLabel(value) {\n return this.isFallback() ? this.asProps.selectedOptions.map((o) => o.label || o.value) : value;\n }\n\n getTriggerProps() {\n const {\n size,\n disabled,\n visible,\n state,\n placeholder,\n value,\n options,\n forwardRef,\n name,\n multiselect,\n } = this.asProps;\n\n return {\n empty: isEmptyValue(this.fallbackDeprecatedValue(value)),\n size,\n value,\n name,\n $hiddenRef: forwardRef,\n multiselect,\n state,\n placeholder,\n disabled,\n active: visible,\n onClear: this.handlerClear,\n children: this.renderChildrenTrigger(this.fallbackDeprecatedValue(value), options),\n };\n }\n\n getOptionProps(props) {\n const { value } = this.asProps;\n const selected = isSelectedOption(this.fallbackDeprecatedValue(value), props.value);\n const other = {};\n this._optionSelected = selected;\n\n if (selected && !this.isScrolledToFirstOption) {\n other.ref = this.firstSelectedOptionRef;\n this.isScrolledToFirstOption = true;\n }\n\n return {\n selected,\n onClick: this.isFallback()\n ? this.bindHandlerOptionFallbackClick(props)\n : this.bindHandlerOptionClick(props.value),\n ...other,\n };\n }\n\n getOptionCheckboxProps(props) {\n const { size } = this.asProps;\n const hasOption = props.value === undefined;\n const optionProps = hasOption ? {} : this.getOptionProps(props);\n const selected = this._optionSelected;\n this._optionSelected = null;\n return {\n ...optionProps,\n size,\n selected,\n };\n }\n\n getDividerProps() {\n return { my: 1 };\n }\n\n renderChildrenTrigger(value, options) {\n if (options) {\n value = this.fallbackDeprecatedValue(value);\n return [].concat(value).reduce((acc, value) => {\n const selectedOption = options.find((o) => isSelectedOption(value, o.value));\n if (!selectedOption) return acc;\n if (acc.length) acc.push(', ');\n acc.push(selectedOption.label || selectedOption.value);\n return acc;\n }, []);\n }\n value = this.fallbackDeprecatedLabel(value);\n return Array.isArray(value)\n ? value.reduce((acc, value) => {\n if (acc.length) acc.push(', ');\n acc.push(value);\n return acc;\n }, [])\n : value;\n }\n\n bindHandlerOptionClick = (optionValue) => (e) => {\n let newValue = optionValue;\n const { value, multiselect } = this.asProps;\n if (Array.isArray(value)) {\n if (value.includes(optionValue)) {\n newValue = value.filter((v) => v !== optionValue);\n } else {\n newValue = value.concat(optionValue);\n }\n }\n this.handlers.value(newValue, e);\n if (!multiselect) this.handlers.visible(false);\n };\n\n bindHandlerOptionFallbackClick = (props) => (e) => {\n const { selectedOptions, multiselect } = this.asProps;\n let optionProps = [props];\n if (multiselect) {\n if (isSelectedOption(this.fallbackDeprecatedValue(selectedOptions), props.value)) {\n optionProps = selectedOptions.filter((o) => o.value !== props.value);\n } else {\n optionProps = selectedOptions.concat(props);\n }\n }\n this.handlers.value(optionProps, e);\n if (!multiselect) this.handlers.visible(false);\n };\n\n handlerClear = (e) => {\n const { value } = this.asProps;\n const emptyValue = getEmptyValue(Array.isArray(this.fallbackDeprecatedValue(value)));\n if (this.isFallback()) {\n this.handlers.value(Array.isArray(emptyValue) ? emptyValue : [], e);\n } else {\n this.handlers.value(emptyValue, e);\n }\n this.handlers.visible(false);\n };\n\n scrollToSelectedOption() {\n setTimeout(() => {\n this.firstSelectedOptionRef.current?.scrollIntoView({\n block: 'nearest',\n inline: 'nearest',\n });\n }, 0);\n }\n\n componentDidMount() {\n const { visible } = this.asProps;\n if (visible) {\n this.scrollToSelectedOption();\n }\n }\n\n componentDidUpdate(prevProps, prevState) {\n const { visible } = this.asProps;\n // TODO: вынести в хелпер\n // Если открыли\n if (visible) {\n this.isScrolledToFirstOption = false;\n\n // Если uncontroll\n if (prevProps.visible === undefined) {\n if (prevState.visible !== visible) this.scrollToSelectedOption();\n } else {\n if (prevProps.visible !== visible) this.scrollToSelectedOption();\n }\n }\n }\n\n render() {\n const { Children, options, multiselect, ...other } = this.asProps;\n const advanceMode = findComponent(Children, [\n Select.Trigger.displayName,\n Select.Popper.displayName,\n ]);\n\n logger.warn(\n // @ts-ignore\n this.isFallback(),\n \"'selectedOptions'/'defaultSelectedOptions' changed to 'value/defaultValue' and take only values, not objects.\",\n other['data-ui-name'] || Select.displayName,\n );\n\n logger.warn(\n options && advanceMode,\n \"Don't use at the same time 'options' property and '<Select.Trigger/>/<Select.Popper/>'\",\n other['data-ui-name'] || Select.displayName,\n );\n\n if (options) {\n const Component = multiselect ? Select.OptionCheckbox : Select.Option;\n return (\n <Root render={DropdownMenu}>\n <Select.Trigger {...other} />\n <Select.Menu>\n {options.map((option, i) => {\n return <Component key={i} {...option} />;\n })}\n </Select.Menu>\n </Root>\n );\n }\n\n return (\n <Root render={DropdownMenu}>\n <Children />\n </Root>\n );\n }\n}\n\nfunction Trigger({ Children, name, value, $hiddenRef, tag: Tag = ButtonTrigger }) {\n return (\n <Root render={DropdownMenu.Trigger} tag={Tag} placeholder=\"Select option\">\n {addonTextChildren(\n Children,\n Tag.Text || ButtonTrigger.Text,\n Tag.Addon || ButtonTrigger.Addon,\n )}\n {name && <input type=\"hidden\" defaultValue={value} name={name} ref={$hiddenRef} />}\n </Root>\n );\n}\n\nfunction Checkbox(props) {\n const [SOptionCheckbox, componentProps] = useBox(props, props.forwardRef);\n const { size, theme, selected } = props;\n const styles = sstyled(props.styles);\n\n const { className, style } = styles.cn('SOptionCheckbox', {\n size,\n 'use:theme': resolveColor(theme),\n checked: selected,\n });\n\n return (\n <SOptionCheckbox\n {...componentProps}\n className={cn(className, componentProps.className) || undefined}\n style={{ ...style, ...componentProps.style }}\n />\n );\n}\n\nfunction OptionCheckbox(props) {\n const { selected, size, theme, children } = props;\n\n return (\n <DropdownMenu.Item {...props}>\n <Checkbox selected={selected} size={size} theme={theme} styles={props.styles} />\n {children}\n </DropdownMenu.Item>\n );\n}\n\nconst InputSearchWrapper = function (props) {\n logger.warn(\n true,\n `\\'<${props['data-ui-name']}/>\\' is deprecated, use the named import \\'import { InputSearch }\\'`,\n props['data-ui-name'] || Select.InputSearch.displayName,\n );\n return <Root render={InputSearch} />;\n};\n\nconst Select = createComponent(\n RootSelect,\n {\n Trigger: [\n Trigger,\n {\n Addon: ButtonTrigger.Addon,\n Text: ButtonTrigger.Text,\n },\n ],\n Popper: DropdownMenu.Popper,\n List: DropdownMenu.List,\n Menu: DropdownMenu.Menu,\n Option: [\n DropdownMenu.Item,\n {\n Addon: DropdownMenu.Item.Addon,\n Checkbox,\n },\n ],\n OptionTitle: DropdownMenu.ItemTitle,\n OptionHint: DropdownMenu.ItemHint,\n OptionCheckbox: [\n OptionCheckbox,\n {\n Addon: DropdownMenu.Item.Addon,\n },\n ],\n Divider,\n InputSearch: InputSearchWrapper,\n Input: InputSearchWrapper,\n },\n { parent: DropdownMenu },\n);\n\nexport default Select;\n"],"file":"Select.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/Select.jsx"],"names":["React","cn","createComponent","Component","Root","sstyled","DropdownMenu","ButtonTrigger","Divider","findComponent","logger","resolveColor","addonTextChildren","InputSearch","useBox","isSelectedOption","value","valueOption","Array","isArray","includes","isEmptyValue","length","getEmptyValue","multiselect","RootSelect","createRef","optionValue","e","newValue","asProps","filter","v","concat","handlers","visible","emptyValue","size","disabled","state","placeholder","options","forwardRef","name","empty","$hiddenRef","active","onClear","handlerClear","children","renderChildrenTrigger","props","selected","other","_optionSelected","isScrolledToFirstOption","ref","firstSelectedOptionRef","onClick","bindHandlerOptionClick","hasOption","undefined","optionProps","getOptionProps","my","reduce","acc","selectedOption","find","o","push","label","setTimeout","current","scrollIntoView","block","inline","scrollToSelectedOption","prevProps","prevState","Children","advanceMode","Select","Trigger","displayName","Popper","warn","map","option","i","style","defaultValue","defaultVisible","tag","Tag","Text","Addon","Checkbox","SOptionCheckbox","componentProps","theme","styles","checked","className","InputSearchWrapper","List","Menu","Option","Item","OptionTitle","ItemTitle","OptionHint","ItemHint","Input","parent"],"mappings":"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","sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport createComponent, { Component, Root, sstyled } from '@semcore/core';\nimport DropdownMenu from '@semcore/dropdown-menu';\nimport { ButtonTrigger } from '@semcore/base-trigger';\nimport Divider from '@semcore/divider';\nimport findComponent from '@semcore/utils/lib/findComponent';\nimport logger from '@semcore/utils/lib/logger';\nimport resolveColor from '@semcore/utils/lib/color';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\nimport InputSearch from './InputSearch';\nimport { useBox } from '@semcore/flex-box';\n\nimport style from './style/select.shadow.css';\n\nfunction isSelectedOption(value, valueOption) {\n return Array.isArray(value) ? value.includes(valueOption) : valueOption === value;\n}\n\nfunction isEmptyValue(value) {\n return Array.isArray(value) ? value.length === 0 : value === null;\n}\n\nfunction getEmptyValue(multiselect) {\n return multiselect ? [] : null;\n}\n\nclass RootSelect extends Component {\n static displayName = 'Select';\n\n static style = style;\n\n static defaultProps = (props) => ({\n placeholder: props.multiselect ? 'Select options' : 'Select option',\n size: 'm',\n defaultValue: getEmptyValue(props.multiselect),\n defaultVisible: false,\n });\n\n firstSelectedOptionRef = React.createRef();\n\n isScrolledToFirstOption = false;\n\n uncontrolledProps() {\n return {\n visible: null,\n value: null,\n };\n }\n\n getTriggerProps() {\n const {\n size,\n disabled,\n visible,\n state,\n placeholder,\n value,\n options,\n forwardRef,\n name,\n multiselect,\n } = this.asProps;\n\n return {\n empty: isEmptyValue(value),\n size,\n value,\n name,\n $hiddenRef: forwardRef,\n multiselect,\n state,\n placeholder,\n disabled,\n active: visible,\n onClear: this.handlerClear,\n children: this.renderChildrenTrigger(value, options),\n };\n }\n\n getOptionProps(props) {\n const { value } = this.asProps;\n const selected = isSelectedOption(value, props.value);\n const other = {};\n this._optionSelected = selected;\n\n if (selected && !this.isScrolledToFirstOption) {\n other.ref = this.firstSelectedOptionRef;\n this.isScrolledToFirstOption = true;\n }\n\n return {\n selected,\n onClick: this.bindHandlerOptionClick(props.value),\n ...other,\n };\n }\n\n getOptionCheckboxProps(props) {\n const { size } = this.asProps;\n const hasOption = props.value === undefined;\n const optionProps = hasOption ? {} : this.getOptionProps(props);\n const selected = this._optionSelected;\n this._optionSelected = null;\n return {\n ...optionProps,\n size,\n selected,\n };\n }\n\n getDividerProps() {\n return { my: 1 };\n }\n\n renderChildrenTrigger(value, options) {\n if (options) {\n return [].concat(value).reduce((acc, value) => {\n const selectedOption = options.find((o) => isSelectedOption(value, o.value));\n if (!selectedOption) return acc;\n if (acc.length) acc.push(', ');\n acc.push(selectedOption.label || selectedOption.value);\n return acc;\n }, []);\n }\n return Array.isArray(value)\n ? value.reduce((acc, value) => {\n if (acc.length) acc.push(', ');\n acc.push(value);\n return acc;\n }, [])\n : value;\n }\n\n bindHandlerOptionClick = (optionValue) => (e) => {\n let newValue = optionValue;\n const { value, multiselect } = this.asProps;\n if (Array.isArray(value)) {\n if (value.includes(optionValue)) {\n newValue = value.filter((v) => v !== optionValue);\n } else {\n newValue = value.concat(optionValue);\n }\n }\n this.handlers.value(newValue, e);\n if (!multiselect) this.handlers.visible(false);\n };\n\n handlerClear = (e) => {\n const { value } = this.asProps;\n const emptyValue = getEmptyValue(Array.isArray(value));\n this.handlers.value(emptyValue, e);\n this.handlers.visible(false);\n };\n\n scrollToSelectedOption() {\n setTimeout(() => {\n this.firstSelectedOptionRef.current?.scrollIntoView({\n block: 'nearest',\n inline: 'nearest',\n });\n }, 0);\n }\n\n componentDidMount() {\n const { visible } = this.asProps;\n if (visible) {\n this.scrollToSelectedOption();\n }\n }\n\n componentDidUpdate(prevProps, prevState) {\n const { visible } = this.asProps;\n // TODO: вынести в хелпер\n // Если открыли\n if (visible) {\n this.isScrolledToFirstOption = false;\n\n // Если uncontroll\n if (prevProps.visible === undefined) {\n if (prevState.visible !== visible) this.scrollToSelectedOption();\n } else {\n if (prevProps.visible !== visible) this.scrollToSelectedOption();\n }\n }\n }\n\n render() {\n const { Children, options, multiselect, ...other } = this.asProps;\n const advanceMode = findComponent(Children, [\n Select.Trigger.displayName,\n Select.Popper.displayName,\n ]);\n\n logger.warn(\n options && advanceMode,\n \"Don't use at the same time 'options' property and '<Select.Trigger/>/<Select.Popper/>'\",\n other['data-ui-name'] || Select.displayName,\n );\n\n if (options) {\n return (\n <Root render={DropdownMenu}>\n <Select.Trigger {...other} />\n <Select.Menu>\n {options.map((option, i) => {\n return (\n <Select.Option key={i} {...option}>\n {multiselect && <Select.Option.Checkbox />}\n {option.children}\n </Select.Option>\n );\n })}\n </Select.Menu>\n </Root>\n );\n }\n\n return (\n <Root render={DropdownMenu}>\n <Children />\n </Root>\n );\n }\n}\n\nfunction Trigger({ Children, name, value, $hiddenRef, tag: Tag = ButtonTrigger }) {\n return (\n <Root render={DropdownMenu.Trigger} tag={Tag} placeholder=\"Select option\">\n {addonTextChildren(\n Children,\n Tag.Text || ButtonTrigger.Text,\n Tag.Addon || ButtonTrigger.Addon,\n )}\n {name && <input type=\"hidden\" defaultValue={value} name={name} ref={$hiddenRef} />}\n </Root>\n );\n}\n\nfunction Checkbox(props) {\n const [SOptionCheckbox, componentProps] = useBox(props, props.forwardRef);\n const { size, theme, selected } = props;\n const styles = sstyled(props.styles);\n\n const { className, style } = styles.cn('SOptionCheckbox', {\n size,\n 'use:theme': resolveColor(theme),\n checked: selected,\n });\n\n return (\n <SOptionCheckbox\n {...componentProps}\n className={cn(className, componentProps.className) || undefined}\n style={{ ...style, ...componentProps.style }}\n />\n );\n}\n\nconst InputSearchWrapper = function () {\n return <Root render={InputSearch} />;\n};\n\nconst Select = createComponent(\n RootSelect,\n {\n Trigger: [\n Trigger,\n {\n Addon: ButtonTrigger.Addon,\n Text: ButtonTrigger.Text,\n },\n ],\n Popper: DropdownMenu.Popper,\n List: DropdownMenu.List,\n Menu: DropdownMenu.Menu,\n Option: [\n DropdownMenu.Item,\n {\n Addon: DropdownMenu.Item.Addon,\n Checkbox,\n },\n ],\n OptionTitle: DropdownMenu.ItemTitle,\n OptionHint: DropdownMenu.ItemHint,\n Divider,\n InputSearch: InputSearchWrapper,\n Input: InputSearchWrapper,\n },\n { parent: DropdownMenu },\n);\n\nexport default Select;\n"],"file":"Select.js"}
|
package/lib/es6/index.d.ts
CHANGED
|
@@ -64,17 +64,6 @@ export interface ISelectProps<T extends SelectValue = SelectValue>
|
|
|
64
64
|
* Input name
|
|
65
65
|
*/
|
|
66
66
|
name?: string;
|
|
67
|
-
|
|
68
|
-
/**
|
|
69
|
-
* The list of options selected by default
|
|
70
|
-
* @deprecated v2.0.0 {@link ISelectProps.defaultValue}
|
|
71
|
-
*/
|
|
72
|
-
defaultSelectedOptions?: ISelectOption[];
|
|
73
|
-
/**
|
|
74
|
-
* List of the selected options
|
|
75
|
-
* @deprecated v2.0.0 {@link ISelectProps.value}
|
|
76
|
-
*/
|
|
77
|
-
selectedOptions?: ISelectOption[];
|
|
78
67
|
}
|
|
79
68
|
|
|
80
69
|
export interface ISelectOption {
|
|
@@ -130,11 +119,6 @@ declare const Select: (<T, V extends SelectValue = SelectValue>(
|
|
|
130
119
|
};
|
|
131
120
|
OptionTitle: typeof DropdownMenu.ItemTitle;
|
|
132
121
|
OptionHint: typeof DropdownMenu.ItemHint;
|
|
133
|
-
OptionCheckbox: (<T>(
|
|
134
|
-
props: CProps<ISelectOptionCheckboxProps & T, ISelectContext, ISelectHandlers>,
|
|
135
|
-
) => ReturnEl) & {
|
|
136
|
-
Addon: typeof DropdownMenu.Item.Addon;
|
|
137
|
-
};
|
|
138
122
|
Divider: typeof Divider;
|
|
139
123
|
InputSearch: typeof InputSearch;
|
|
140
124
|
Input: typeof InputSearch;
|
|
@@ -1,11 +1,24 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
@import '@semcore/utils/style/var.css';
|
|
2
|
+
|
|
3
|
+
SInputSearch[size] {
|
|
4
|
+
padding: 0;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
SInputSearch > [data-ui-name='Input']:first-child > [data-ui-name='InputSearch'] ~ div {
|
|
8
|
+
top: -1px;
|
|
9
|
+
left: -1px;
|
|
10
|
+
width: 100%;
|
|
11
|
+
border-radius: var(--rounded-m) var(--rounded-m) 0 0;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
SInputSearch[size='m'] > [data-ui-name='Input']:first-child {
|
|
15
|
+
height: 32px;
|
|
3
16
|
}
|
|
4
17
|
|
|
5
|
-
SInputSearch[
|
|
6
|
-
|
|
18
|
+
SInputSearch [data-ui-name='Input.Addon']:last-of-type {
|
|
19
|
+
visibility: hidden;
|
|
7
20
|
}
|
|
8
21
|
|
|
9
|
-
SInputSearch[
|
|
10
|
-
|
|
22
|
+
SInputSearch[filled] [data-ui-name='Input.Addon']:last-of-type {
|
|
23
|
+
visibility: visible;
|
|
11
24
|
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
@import '@semcore/utils/style/var.css';
|
|
2
2
|
|
|
3
3
|
SOptionCheckbox {
|
|
4
|
+
margin-top: 2px;
|
|
4
5
|
margin-right: 8px;
|
|
5
6
|
margin-bottom: auto;
|
|
6
7
|
position: relative;
|
|
@@ -15,10 +16,13 @@ SOptionCheckbox {
|
|
|
15
16
|
bottom: 0;
|
|
16
17
|
background: #fff;
|
|
17
18
|
border: 1px solid;
|
|
18
|
-
border-radius:
|
|
19
|
-
border-color: var(--
|
|
19
|
+
border-radius: var(--rounded-s);
|
|
20
|
+
border-color: var(--gray-200);
|
|
20
21
|
}
|
|
21
22
|
|
|
23
|
+
width: 16px;
|
|
24
|
+
height: 16px;
|
|
25
|
+
|
|
22
26
|
&::after {
|
|
23
27
|
content: '';
|
|
24
28
|
position: absolute;
|
|
@@ -27,33 +31,23 @@ SOptionCheckbox {
|
|
|
27
31
|
right: 0;
|
|
28
32
|
bottom: 0;
|
|
29
33
|
margin: 0 2px;
|
|
30
|
-
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA4IDYiIGZpbGw9IiNmZmYiPgogICAgPHBhdGggZD0iTTc3Ny44ODQsNTkzLjc4MmwtMC42NzktLjY3NWEwLjQsMC40LDAsMCwwLS41NTksMGwtMy41NzMsMy41NTYtMS43Mi0xLjcxM2EwLjQsMC40LDAsMCwwLS41NTgsMGwtMC42NzkuNjc1YTAuMzg0LDAuMzg0LDAsMCwwLS4xMTYuMjcyLDAuNCwwLjQsMCwwLDAsLjExNS4yODRsMi42NzksMi42NjVhMC40LDAuNCwwLDAsMCwuNTU5LDBsNC41MzEtNC41MDhhMC40LDAuNCwwLDAsMCwuMTE2LTAuMjg1QTAuMzgyLDAuMzgyLDAsMCwwLDc3Ny44ODQsNTkzLjc4MloiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC03NzAgLTU5MykiLz4KPC9zdmc+Cgo=');
|
|
31
34
|
background-repeat: no-repeat;
|
|
32
35
|
background-position: center center;
|
|
36
|
+
background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEwIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjI1IDFMNCA1LjI1TDEuNzUgMyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==');
|
|
33
37
|
}
|
|
34
38
|
}
|
|
35
39
|
|
|
36
|
-
SOptionCheckbox[size='
|
|
37
|
-
margin-top: 2px;
|
|
40
|
+
SOptionCheckbox[size='l'] {
|
|
38
41
|
width: 20px;
|
|
39
42
|
height: 20px;
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
margin-top: 1px;
|
|
44
|
-
width: 16px;
|
|
45
|
-
height: 16px;
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
SOptionCheckbox[size='m'] {
|
|
49
|
-
margin-top: 2px;
|
|
50
|
-
width: 12px;
|
|
51
|
-
height: 12px;
|
|
43
|
+
&::after {
|
|
44
|
+
background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMSAxLjVMNC43NSA3Ljc1TDEgNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==');
|
|
45
|
+
}
|
|
52
46
|
}
|
|
53
47
|
|
|
54
48
|
SOptionCheckbox[checked]:before {
|
|
55
|
-
background-color: var(--
|
|
56
|
-
border-color: var(--
|
|
49
|
+
background-color: var(--blue-400);
|
|
50
|
+
border-color: var(--blue-400);
|
|
57
51
|
}
|
|
58
52
|
|
|
59
53
|
SOptionCheckbox[theme]:before {
|
|
@@ -66,9 +60,9 @@ SOptionCheckbox[theme][checked]:before {
|
|
|
66
60
|
}
|
|
67
61
|
|
|
68
62
|
SOptionCheckbox[selected] {
|
|
69
|
-
background-color: color-mod(var(--
|
|
63
|
+
background-color: color-mod(var(--blue-100) a(70%));
|
|
70
64
|
|
|
71
|
-
|
|
72
|
-
background-color: color-mod(var(--
|
|
65
|
+
&:hover {
|
|
66
|
+
background-color: color-mod(var(--blue-100) a(70%));
|
|
73
67
|
}
|
|
74
68
|
}
|
package/lib/types/index.d.ts
CHANGED
|
@@ -64,17 +64,6 @@ export interface ISelectProps<T extends SelectValue = SelectValue>
|
|
|
64
64
|
* Input name
|
|
65
65
|
*/
|
|
66
66
|
name?: string;
|
|
67
|
-
|
|
68
|
-
/**
|
|
69
|
-
* The list of options selected by default
|
|
70
|
-
* @deprecated v2.0.0 {@link ISelectProps.defaultValue}
|
|
71
|
-
*/
|
|
72
|
-
defaultSelectedOptions?: ISelectOption[];
|
|
73
|
-
/**
|
|
74
|
-
* List of the selected options
|
|
75
|
-
* @deprecated v2.0.0 {@link ISelectProps.value}
|
|
76
|
-
*/
|
|
77
|
-
selectedOptions?: ISelectOption[];
|
|
78
67
|
}
|
|
79
68
|
|
|
80
69
|
export interface ISelectOption {
|
|
@@ -130,11 +119,6 @@ declare const Select: (<T, V extends SelectValue = SelectValue>(
|
|
|
130
119
|
};
|
|
131
120
|
OptionTitle: typeof DropdownMenu.ItemTitle;
|
|
132
121
|
OptionHint: typeof DropdownMenu.ItemHint;
|
|
133
|
-
OptionCheckbox: (<T>(
|
|
134
|
-
props: CProps<ISelectOptionCheckboxProps & T, ISelectContext, ISelectHandlers>,
|
|
135
|
-
) => ReturnEl) & {
|
|
136
|
-
Addon: typeof DropdownMenu.Item.Addon;
|
|
137
|
-
};
|
|
138
122
|
Divider: typeof Divider;
|
|
139
123
|
InputSearch: typeof InputSearch;
|
|
140
124
|
Input: typeof InputSearch;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/select",
|
|
3
3
|
"description": "SEMRush Select Component",
|
|
4
|
-
"version": "
|
|
4
|
+
"version": "3.0.1",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -13,13 +13,13 @@
|
|
|
13
13
|
},
|
|
14
14
|
"dependencies": {
|
|
15
15
|
"@semcore/utils": "^3.15",
|
|
16
|
-
"@semcore/base-trigger": "^
|
|
16
|
+
"@semcore/base-trigger": "^3.0.0",
|
|
17
17
|
"@semcore/icon": "^2.16",
|
|
18
|
-
"@semcore/dropdown-menu": "^
|
|
19
|
-
"@semcore/input": "^
|
|
20
|
-
"@semcore/checkbox": "^
|
|
18
|
+
"@semcore/dropdown-menu": "^3.0.0",
|
|
19
|
+
"@semcore/input": "^3.0.0",
|
|
20
|
+
"@semcore/checkbox": "^6",
|
|
21
21
|
"@semcore/flex-box": "^4",
|
|
22
|
-
"@semcore/divider": "^
|
|
22
|
+
"@semcore/divider": "^3",
|
|
23
23
|
"classnames": "2.2.6"
|
|
24
24
|
},
|
|
25
25
|
"peerDependencies": {
|