haya-select 1.0.8 → 1.0.9
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/package.json +1 -1
- package/src/select/index.jsx +37 -12
package/package.json
CHANGED
package/src/select/index.jsx
CHANGED
|
@@ -14,8 +14,9 @@ const nameForComponentWithMultiple = (component) => {
|
|
|
14
14
|
return name
|
|
15
15
|
}
|
|
16
16
|
|
|
17
|
-
export default class
|
|
17
|
+
export default class HayaSelect extends React.PureComponent {
|
|
18
18
|
static defaultProps = {
|
|
19
|
+
defaultToggled: {},
|
|
19
20
|
multiple: false,
|
|
20
21
|
search: false
|
|
21
22
|
}
|
|
@@ -23,13 +24,16 @@ export default class CustomSelect extends React.PureComponent {
|
|
|
23
24
|
static propTypes = {
|
|
24
25
|
attribute: PropTypes.string,
|
|
25
26
|
className: PropTypes.string,
|
|
27
|
+
defaultToggled: PropTypes.object,
|
|
26
28
|
defaultValue: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
27
29
|
defaultValues: PropTypes.array,
|
|
28
30
|
defaultValuesFromOptions: PropTypes.array,
|
|
31
|
+
id: PropTypes.node,
|
|
29
32
|
model: PropTypes.object,
|
|
30
33
|
multiple: PropTypes.bool.isRequired,
|
|
31
34
|
onChange: PropTypes.func,
|
|
32
35
|
options: PropTypes.oneOfType([PropTypes.array, PropTypes.func]).isRequired,
|
|
36
|
+
placeholder: PropTypes.node,
|
|
33
37
|
search: PropTypes.bool.isRequired,
|
|
34
38
|
toggleOptions: PropTypes.arrayOf(PropTypes.shape({
|
|
35
39
|
icon: PropTypes.string.isRequired,
|
|
@@ -51,7 +55,7 @@ export default class CustomSelect extends React.PureComponent {
|
|
|
51
55
|
optionsWidth: undefined,
|
|
52
56
|
scrollLeft: undefined,
|
|
53
57
|
scrollTop: undefined,
|
|
54
|
-
toggled:
|
|
58
|
+
toggled: digg(this, "props", "defaultToggled")
|
|
55
59
|
}
|
|
56
60
|
|
|
57
61
|
defaultCurrentOptions() {
|
|
@@ -88,7 +92,22 @@ export default class CustomSelect extends React.PureComponent {
|
|
|
88
92
|
|
|
89
93
|
render() {
|
|
90
94
|
const {endOfSelectRef} = digs(this, "endOfSelectRef")
|
|
91
|
-
const {
|
|
95
|
+
const {
|
|
96
|
+
attribute,
|
|
97
|
+
className,
|
|
98
|
+
defaultToggled,
|
|
99
|
+
defaultValue,
|
|
100
|
+
defaultValues,
|
|
101
|
+
id,
|
|
102
|
+
model,
|
|
103
|
+
multiple,
|
|
104
|
+
onChange,
|
|
105
|
+
options,
|
|
106
|
+
placeholder,
|
|
107
|
+
search,
|
|
108
|
+
toggleOptions,
|
|
109
|
+
...restProps
|
|
110
|
+
} = this.props
|
|
92
111
|
const {currentOptions, opened} = digs(this.state, "currentOptions", "opened")
|
|
93
112
|
const BodyPortal = config.getBodyPortal()
|
|
94
113
|
|
|
@@ -120,17 +139,19 @@ export default class CustomSelect extends React.PureComponent {
|
|
|
120
139
|
<>
|
|
121
140
|
{currentOptions.length == 0 &&
|
|
122
141
|
<div style={{color: "grey"}}>
|
|
123
|
-
{I18n.t("haya_select.nothing_selected")}
|
|
142
|
+
{placeholder || I18n.t("haya_select.nothing_selected")}
|
|
124
143
|
</div>
|
|
125
144
|
}
|
|
126
145
|
{currentOptions.map((currentOption) =>
|
|
127
146
|
<div className="current-option" key={`current-value-${digg(currentOption, "value")}`}>
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
147
|
+
{nameForComponentWithMultiple(this) &&
|
|
148
|
+
<input
|
|
149
|
+
id={idForComponent(this)}
|
|
150
|
+
name={nameForComponentWithMultiple(this)}
|
|
151
|
+
type="hidden"
|
|
152
|
+
value={digg(currentOption, "value")}
|
|
153
|
+
/>
|
|
154
|
+
}
|
|
134
155
|
{this.presentOption(currentOption)}
|
|
135
156
|
</div>
|
|
136
157
|
)}
|
|
@@ -375,7 +396,6 @@ export default class CustomSelect extends React.PureComponent {
|
|
|
375
396
|
)
|
|
376
397
|
|
|
377
398
|
if (!multiple) this.closeOptions()
|
|
378
|
-
|
|
379
399
|
}
|
|
380
400
|
|
|
381
401
|
presentOption = (currentValue) => {
|
|
@@ -383,7 +403,12 @@ export default class CustomSelect extends React.PureComponent {
|
|
|
383
403
|
const {toggled} = digs(this.state, "toggled")
|
|
384
404
|
|
|
385
405
|
return (
|
|
386
|
-
<div
|
|
406
|
+
<div
|
|
407
|
+
className="haya-select-option-presentation"
|
|
408
|
+
data-toggle-icon={toggleOptions[toggled[currentValue.value]]?.icon}
|
|
409
|
+
data-toggle-value={toggleOptions[toggled[currentValue.value]]?.value}
|
|
410
|
+
data-value={currentValue.value}
|
|
411
|
+
>
|
|
387
412
|
{toggleOptions && !(currentValue.value in toggled) &&
|
|
388
413
|
<i className="fa fa-fw" />
|
|
389
414
|
}
|