@woosmap/ui 4.30.0 → 4.31.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/.idea/encodings.xml +6 -0
- package/.idea/inspectionProfiles/Project_Default.xml +18 -0
- package/.idea/inspectionProfiles/profiles_settings.xml +6 -0
- package/.idea/misc.xml +4 -0
- package/.idea/modules.xml +8 -0
- package/.idea/prettier.xml +6 -0
- package/.idea/ui.iml +15 -0
- package/.idea/vcs.xml +6 -0
- package/package.json +1 -1
- package/src/components/Icon/Icon.js +5 -2
- package/src/components/Select/LanguageSelect.js +334 -0
- package/src/components/Select/Select.stories.js +10 -0
- package/src/icons/social-github.svg +1 -0
- package/src/icons/social-google.svg +1 -0
- package/src/styles/console/select.styl +2 -0
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
<component name="InspectionProjectProfileManager">
|
|
2
|
+
<profile version="1.0">
|
|
3
|
+
<option name="myName" value="Project Default" />
|
|
4
|
+
<inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
|
|
5
|
+
<inspection_tool class="PyPackageRequirementsInspection" enabled="true" level="WARNING" enabled_by_default="true">
|
|
6
|
+
<option name="ignoredPackages">
|
|
7
|
+
<value>
|
|
8
|
+
<list size="4">
|
|
9
|
+
<item index="0" class="java.lang.String" itemvalue="Fabric" />
|
|
10
|
+
<item index="1" class="java.lang.String" itemvalue="PyYAML" />
|
|
11
|
+
<item index="2" class="java.lang.String" itemvalue="Jinja2" />
|
|
12
|
+
<item index="3" class="java.lang.String" itemvalue="github3.py" />
|
|
13
|
+
</list>
|
|
14
|
+
</value>
|
|
15
|
+
</option>
|
|
16
|
+
</inspection_tool>
|
|
17
|
+
</profile>
|
|
18
|
+
</component>
|
package/.idea/misc.xml
ADDED
package/.idea/ui.iml
ADDED
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
+
<module type="PYTHON_MODULE" version="4">
|
|
3
|
+
<component name="NewModuleRootManager">
|
|
4
|
+
<content url="file://$MODULE_DIR$" />
|
|
5
|
+
<orderEntry type="inheritedJdk" />
|
|
6
|
+
<orderEntry type="sourceFolder" forTests="false" />
|
|
7
|
+
</component>
|
|
8
|
+
<component name="TemplatesService">
|
|
9
|
+
<option name="TEMPLATE_FOLDERS">
|
|
10
|
+
<list>
|
|
11
|
+
<option value="$MODULE_DIR$/node_modules/@storybook/core/dist/server/templates" />
|
|
12
|
+
</list>
|
|
13
|
+
</option>
|
|
14
|
+
</component>
|
|
15
|
+
</module>
|
package/.idea/vcs.xml
ADDED
package/package.json
CHANGED
|
@@ -175,8 +175,8 @@ import { ReactComponent as Expand } from '../../icons/expand.svg';
|
|
|
175
175
|
import { ReactComponent as Export } from '../../icons/export.svg';
|
|
176
176
|
import { ReactComponent as Flag } from '../../icons/flag.svg';
|
|
177
177
|
import { ReactComponent as Forbidden } from '../../icons/forbidden.svg';
|
|
178
|
+
|
|
178
179
|
import { ReactComponent as Globe } from '../../icons/globe.svg';
|
|
179
|
-
import { ReactComponent as Google } from '../../icons/google.svg';
|
|
180
180
|
import { ReactComponent as Home } from '../../icons/home.svg';
|
|
181
181
|
import { ReactComponent as Hourglass } from '../../icons/hourglass.svg';
|
|
182
182
|
import { ReactComponent as HomeUser } from '../../icons/home-user.svg';
|
|
@@ -245,6 +245,8 @@ import { ReactComponent as Showcases } from '../../icons/showcases.svg';
|
|
|
245
245
|
import { ReactComponent as Indoor } from '../../icons/indoor.svg';
|
|
246
246
|
|
|
247
247
|
import { ReactComponent as SocialFacebook } from '../../icons/social-facebook.svg';
|
|
248
|
+
import { ReactComponent as socialGithub } from '../../icons/social-github.svg';
|
|
249
|
+
import { ReactComponent as socialGoogle } from '../../icons/social-google.svg';
|
|
248
250
|
import { ReactComponent as SocialLinkedin } from '../../icons/social-linkedin.svg';
|
|
249
251
|
import { ReactComponent as SocialTwitter } from '../../icons/social-twitter.svg';
|
|
250
252
|
|
|
@@ -526,7 +528,6 @@ const ConsoleIcons = {
|
|
|
526
528
|
flag: Flag,
|
|
527
529
|
forbidden: Forbidden,
|
|
528
530
|
globe: Globe,
|
|
529
|
-
google: Google,
|
|
530
531
|
'home-user': HomeUser,
|
|
531
532
|
home: Home,
|
|
532
533
|
hourglass: Hourglass,
|
|
@@ -566,6 +567,8 @@ const ConsoleIcons = {
|
|
|
566
567
|
shield: Shield,
|
|
567
568
|
shortcut: Shortcut,
|
|
568
569
|
'social-facebook': SocialFacebook,
|
|
570
|
+
'social-github': socialGithub,
|
|
571
|
+
'social-google': socialGoogle,
|
|
569
572
|
'social-linkedin': SocialLinkedin,
|
|
570
573
|
'social-twitter': SocialTwitter,
|
|
571
574
|
'star-filled': StarFilled,
|
|
@@ -0,0 +1,334 @@
|
|
|
1
|
+
/* eslint-disable react/prop-types */
|
|
2
|
+
import React, { Component } from 'react';
|
|
3
|
+
import cl from 'classnames';
|
|
4
|
+
import PropTypes from 'prop-types';
|
|
5
|
+
import Select, { components } from 'react-select';
|
|
6
|
+
|
|
7
|
+
export const languageOptions = [
|
|
8
|
+
{ value: 'aa', label: 'Afar' },
|
|
9
|
+
{ value: 'ab', label: 'Abkhaz' },
|
|
10
|
+
{ value: 'ae', label: 'Avestan' },
|
|
11
|
+
{ value: 'af', label: 'Afrikaans' },
|
|
12
|
+
{ value: 'ak', label: 'Akan' },
|
|
13
|
+
{ value: 'am', label: 'Amharic' },
|
|
14
|
+
{ value: 'an', label: 'Aragonese' },
|
|
15
|
+
{ value: 'ar', label: 'Arabic' },
|
|
16
|
+
{ value: 'as', label: 'Assamese' },
|
|
17
|
+
{ value: 'av', label: 'Avaric' },
|
|
18
|
+
{ value: 'ay', label: 'Aymara' },
|
|
19
|
+
{ value: 'az', label: 'Azerbaijani' },
|
|
20
|
+
{ value: 'ba', label: 'Bashkir' },
|
|
21
|
+
{ value: 'be', label: 'Belarusian' },
|
|
22
|
+
{ value: 'bg', label: 'Bulgarian' },
|
|
23
|
+
{ value: 'bh', label: 'Bihari' },
|
|
24
|
+
{ value: 'bi', label: 'Bislama' },
|
|
25
|
+
{ value: 'bm', label: 'Bambara' },
|
|
26
|
+
{ value: 'bn', label: 'Bengali' },
|
|
27
|
+
{ value: 'bo', label: 'Tibetan' },
|
|
28
|
+
{ value: 'br', label: 'Breton' },
|
|
29
|
+
{ value: 'bs', label: 'Bosnian' },
|
|
30
|
+
{ value: 'ca', label: 'Catalan' },
|
|
31
|
+
{ value: 'ce', label: 'Chechen' },
|
|
32
|
+
{ value: 'ch', label: 'Chamorro' },
|
|
33
|
+
{ value: 'co', label: 'Corsican' },
|
|
34
|
+
{ value: 'cr', label: 'Cree' },
|
|
35
|
+
{ value: 'cs', label: 'Czech' },
|
|
36
|
+
{ value: 'cu', label: 'Old Church Slavonic' },
|
|
37
|
+
{ value: 'cv', label: 'Chuvash' },
|
|
38
|
+
{ value: 'cy', label: 'Welsh' },
|
|
39
|
+
{ value: 'da', label: 'Danish' },
|
|
40
|
+
{ value: 'de', label: 'German' },
|
|
41
|
+
{ value: 'dv', label: 'Divehi' },
|
|
42
|
+
{ value: 'dz', label: 'Dzongkha' },
|
|
43
|
+
{ value: 'ee', label: 'Ewe' },
|
|
44
|
+
{ value: 'el', label: 'Greek' },
|
|
45
|
+
{ value: 'en', label: 'English' },
|
|
46
|
+
{ value: 'eo', label: 'Esperanto' },
|
|
47
|
+
{ value: 'es', label: 'Spanish' },
|
|
48
|
+
{ value: 'et', label: 'Estonian' },
|
|
49
|
+
{ value: 'eu', label: 'Basque' },
|
|
50
|
+
{ value: 'fa', label: 'Persian' },
|
|
51
|
+
{ value: 'ff', label: 'Fula' },
|
|
52
|
+
{ value: 'fi', label: 'Finnish' },
|
|
53
|
+
{ value: 'fj', label: 'Fijian' },
|
|
54
|
+
{ value: 'fo', label: 'Faroese' },
|
|
55
|
+
{ value: 'fr', label: 'French' },
|
|
56
|
+
{ value: 'fy', label: 'Western Frisian' },
|
|
57
|
+
{ value: 'ga', label: 'Irish' },
|
|
58
|
+
{ value: 'gd', label: 'Scottish Gaelic' },
|
|
59
|
+
{ value: 'gl', label: 'Galician' },
|
|
60
|
+
{ value: 'gu', label: 'Gujarati' },
|
|
61
|
+
{ value: 'gv', label: 'Manx' },
|
|
62
|
+
{ value: 'ha', label: 'Hausa' },
|
|
63
|
+
{ value: 'he', label: 'Hebrew' },
|
|
64
|
+
{ value: 'hi', label: 'Hindi' },
|
|
65
|
+
{ value: 'ho', label: 'Hiri Motu' },
|
|
66
|
+
{ value: 'hr', label: 'Croatian' },
|
|
67
|
+
{ value: 'ht', label: 'Haitian' },
|
|
68
|
+
{ value: 'hu', label: 'Hungarian' },
|
|
69
|
+
{ value: 'hy', label: 'Armenian' },
|
|
70
|
+
{ value: 'hz', label: 'Herero' },
|
|
71
|
+
{ value: 'ia', label: 'Interlingua' },
|
|
72
|
+
{ value: 'id', label: 'Indonesian' },
|
|
73
|
+
{ value: 'ie', label: 'Interlingue' },
|
|
74
|
+
{ value: 'ig', label: 'Igbo' },
|
|
75
|
+
{ value: 'ii', label: 'Nuosu' },
|
|
76
|
+
{ value: 'ik', label: 'Inupiaq' },
|
|
77
|
+
{ value: 'io', label: 'Ido' },
|
|
78
|
+
{ value: 'is', label: 'Icelandic' },
|
|
79
|
+
{ value: 'it', label: 'Italian' },
|
|
80
|
+
{ value: 'iu', label: 'Inuktitut' },
|
|
81
|
+
{ value: 'ja', label: 'Japanese' },
|
|
82
|
+
{ value: 'jv', label: 'Javanese' },
|
|
83
|
+
{ value: 'ka', label: 'Georgian' },
|
|
84
|
+
{ value: 'kg', label: 'Kongo' },
|
|
85
|
+
{ value: 'ki', label: 'Kikuyu' },
|
|
86
|
+
{ value: 'kj', label: 'Kwanyama' },
|
|
87
|
+
{ value: 'kk', label: 'Kazakh' },
|
|
88
|
+
{ value: 'kl', label: 'Kalaallisut' },
|
|
89
|
+
{ value: 'km', label: 'Khmer' },
|
|
90
|
+
{ value: 'kn', label: 'Kannada' },
|
|
91
|
+
{ value: 'ko', label: 'Korean' },
|
|
92
|
+
{ value: 'kr', label: 'Kanuri' },
|
|
93
|
+
{ value: 'ks', label: 'Kashmiri' },
|
|
94
|
+
{ value: 'ku', label: 'Kurdish' },
|
|
95
|
+
{ value: 'kv', label: 'Komi' },
|
|
96
|
+
{ value: 'kw', label: 'Cornish' },
|
|
97
|
+
{ value: 'ky', label: 'Kyrgyz' },
|
|
98
|
+
{ value: 'la', label: 'Latin' },
|
|
99
|
+
{ value: 'lb', label: 'Luxembourgish' },
|
|
100
|
+
{ value: 'lg', label: 'Ganda' },
|
|
101
|
+
{ value: 'li', label: 'Limburgish' },
|
|
102
|
+
{ value: 'ln', label: 'Lingala' },
|
|
103
|
+
{ value: 'lo', label: 'Lao' },
|
|
104
|
+
{ value: 'lt', label: 'Lithuanian' },
|
|
105
|
+
{ value: 'lu', label: 'Luba-Katanga' },
|
|
106
|
+
{ value: 'lv', label: 'Latvian' },
|
|
107
|
+
{ value: 'mg', label: 'Malagasy' },
|
|
108
|
+
{ value: 'mh', label: 'Marshallese' },
|
|
109
|
+
{ value: 'mi', label: 'Māori' },
|
|
110
|
+
{ value: 'mk', label: 'Macedonian' },
|
|
111
|
+
{ value: 'ml', label: 'Malayalam' },
|
|
112
|
+
{ value: 'mn', label: 'Mongolian' },
|
|
113
|
+
{ value: 'mr', label: 'Marathi' },
|
|
114
|
+
{ value: 'ms', label: 'Malay' },
|
|
115
|
+
{ value: 'mt', label: 'Maltese' },
|
|
116
|
+
{ value: 'my', label: 'Burmese' },
|
|
117
|
+
{ value: 'na', label: 'Nauru' },
|
|
118
|
+
{ value: 'nb', label: 'Norwegian Bokmål' },
|
|
119
|
+
{ value: 'nd', label: 'Northern Ndebele' },
|
|
120
|
+
{ value: 'ne', label: 'Nepali' },
|
|
121
|
+
{ value: 'ng', label: 'Ndonga' },
|
|
122
|
+
{ value: 'nl', label: 'Dutch' },
|
|
123
|
+
{ value: 'nn', label: 'Norwegian Nynorsk' },
|
|
124
|
+
{ value: 'no', label: 'Norwegian' },
|
|
125
|
+
{ value: 'nr', label: 'Southern Ndebele' },
|
|
126
|
+
{ value: 'nv', label: 'Navajo' },
|
|
127
|
+
{ value: 'ny', label: 'Chichewa' },
|
|
128
|
+
{ value: 'oc', label: 'Occitan' },
|
|
129
|
+
{ value: 'oj', label: 'Ojibwe' },
|
|
130
|
+
{ value: 'om', label: 'Oromo' },
|
|
131
|
+
{ value: 'or', label: 'Oriya' },
|
|
132
|
+
{ value: 'os', label: 'Ossetian' },
|
|
133
|
+
{ value: 'pa', label: 'Panjabi' },
|
|
134
|
+
{ value: 'pi', label: 'Pāli' },
|
|
135
|
+
{ value: 'pl', label: 'Polish' },
|
|
136
|
+
{ value: 'ps', label: 'Pashto' },
|
|
137
|
+
{ value: 'pt', label: 'Portuguese' },
|
|
138
|
+
{ value: 'qu', label: 'Quechua' },
|
|
139
|
+
{ value: 'rm', label: 'Romansh' },
|
|
140
|
+
{ value: 'rn', label: 'Kirundi' },
|
|
141
|
+
{ value: 'ro', label: 'Romanian' },
|
|
142
|
+
{ value: 'ru', label: 'Russian' },
|
|
143
|
+
{ value: 'rw', label: 'Kinyarwanda' },
|
|
144
|
+
{ value: 'sa', label: 'Sanskrit' },
|
|
145
|
+
{ value: 'sc', label: 'Sardinian' },
|
|
146
|
+
{ value: 'sd', label: 'Sindhi' },
|
|
147
|
+
{ value: 'se', label: 'Northern Sami' },
|
|
148
|
+
{ value: 'sg', label: 'Sango' },
|
|
149
|
+
{ value: 'si', label: 'Sinhala' },
|
|
150
|
+
{ value: 'sk', label: 'Slovak' },
|
|
151
|
+
{ value: 'sl', label: 'Slovenian' },
|
|
152
|
+
{ value: 'sn', label: 'Shona' },
|
|
153
|
+
{ value: 'so', label: 'Somali' },
|
|
154
|
+
{ value: 'sq', label: 'Albanian' },
|
|
155
|
+
{ value: 'sr', label: 'Serbian' },
|
|
156
|
+
{ value: 'ss', label: 'Swati' },
|
|
157
|
+
{ value: 'st', label: 'Southern Sotho' },
|
|
158
|
+
{ value: 'su', label: 'Sundanese' },
|
|
159
|
+
{ value: 'sv', label: 'Swedish' },
|
|
160
|
+
{ value: 'sw', label: 'Swahili' },
|
|
161
|
+
{ value: 'ta', label: 'Tamil' },
|
|
162
|
+
{ value: 'te', label: 'Telugu' },
|
|
163
|
+
{ value: 'tg', label: 'Tajik' },
|
|
164
|
+
{ value: 'th', label: 'Thai' },
|
|
165
|
+
{ value: 'ti', label: 'Tigrinya' },
|
|
166
|
+
{ value: 'tk', label: 'Turkmen' },
|
|
167
|
+
{ value: 'tl', label: 'Tagalog' },
|
|
168
|
+
{ value: 'tn', label: 'Tswana' },
|
|
169
|
+
{ value: 'to', label: 'Tonga' },
|
|
170
|
+
{ value: 'tr', label: 'Turkish' },
|
|
171
|
+
{ value: 'ts', label: 'Tsonga' },
|
|
172
|
+
{ value: 'tt', label: 'Tatar' },
|
|
173
|
+
{ value: 'tw', label: 'Twi' },
|
|
174
|
+
{ value: 'ty', label: 'Tahitian' },
|
|
175
|
+
{ value: 'ug', label: 'Uyghur' },
|
|
176
|
+
{ value: 'uk', label: 'Ukrainian' },
|
|
177
|
+
{ value: 'ur', label: 'Urdu' },
|
|
178
|
+
{ value: 'uz', label: 'Uzbek' },
|
|
179
|
+
{ value: 've', label: 'Venda' },
|
|
180
|
+
{ value: 'vi', label: 'Vietnamese' },
|
|
181
|
+
{ value: 'vo', label: 'Volapük' },
|
|
182
|
+
{ value: 'wa', label: 'Walloon' },
|
|
183
|
+
{ value: 'wo', label: 'Wolof' },
|
|
184
|
+
{ value: 'xh', label: 'Xhosa' },
|
|
185
|
+
{ value: 'yi', label: 'Yiddish' },
|
|
186
|
+
{ value: 'yo', label: 'Yoruba' },
|
|
187
|
+
{ value: 'za', label: 'Zhuang' },
|
|
188
|
+
{ value: 'zh', label: 'Chinese' },
|
|
189
|
+
{ value: 'zu', label: 'Zulu' },
|
|
190
|
+
];
|
|
191
|
+
|
|
192
|
+
// eslint-disable-next-line react/prop-types
|
|
193
|
+
const MultiValueLabel = (props) => {
|
|
194
|
+
const { data } = props;
|
|
195
|
+
return (
|
|
196
|
+
<>
|
|
197
|
+
<components.MultiValueLabel {...props}>
|
|
198
|
+
<span>{data.value.toUpperCase()}</span>
|
|
199
|
+
</components.MultiValueLabel>
|
|
200
|
+
</>
|
|
201
|
+
);
|
|
202
|
+
};
|
|
203
|
+
const MultiValueRemove = (props) => {
|
|
204
|
+
const { selectProps } = props;
|
|
205
|
+
const { value, minimumLength } = selectProps;
|
|
206
|
+
return value.length <= minimumLength ? null : (
|
|
207
|
+
<>
|
|
208
|
+
<components.MultiValueRemove {...props} />
|
|
209
|
+
</>
|
|
210
|
+
);
|
|
211
|
+
};
|
|
212
|
+
const Option = (props) => {
|
|
213
|
+
const { data } = props;
|
|
214
|
+
return (
|
|
215
|
+
<components.Option {...props}>
|
|
216
|
+
<span className={cl('select__option__label')}>{data.label}</span>
|
|
217
|
+
</components.Option>
|
|
218
|
+
);
|
|
219
|
+
};
|
|
220
|
+
|
|
221
|
+
export default class LanguageSelect extends Component {
|
|
222
|
+
constructor(props) {
|
|
223
|
+
super(props);
|
|
224
|
+
const { defaultValue } = props;
|
|
225
|
+
const defaultLanguage = defaultValue && languageOptions.find((item) => item.value === defaultValue);
|
|
226
|
+
this.state = {
|
|
227
|
+
languages: [defaultLanguage],
|
|
228
|
+
};
|
|
229
|
+
}
|
|
230
|
+
|
|
231
|
+
getOptions = () => {
|
|
232
|
+
const { filter } = this.props;
|
|
233
|
+
if (filter && filter.length > 0) {
|
|
234
|
+
return languageOptions
|
|
235
|
+
.filter((item) => filter.includes(item.value))
|
|
236
|
+
.sort((a, b) => filter.indexOf(a.value) - filter.indexOf(b.value));
|
|
237
|
+
}
|
|
238
|
+
return languageOptions;
|
|
239
|
+
};
|
|
240
|
+
|
|
241
|
+
onChange = (newValue, actionMeta) => {
|
|
242
|
+
const { minimumLength, isMulti } = this.props;
|
|
243
|
+
const newLanguages = newValue;
|
|
244
|
+
switch (actionMeta.action) {
|
|
245
|
+
case 'remove-value':
|
|
246
|
+
case 'pop-value':
|
|
247
|
+
if (newValue.length < minimumLength && isMulti) {
|
|
248
|
+
return;
|
|
249
|
+
}
|
|
250
|
+
break;
|
|
251
|
+
default:
|
|
252
|
+
break;
|
|
253
|
+
}
|
|
254
|
+
|
|
255
|
+
this.setState({ languages: newLanguages });
|
|
256
|
+
};
|
|
257
|
+
|
|
258
|
+
renderInput() {
|
|
259
|
+
const { placeholder, onChange, size, isMulti, value, className, minimumLength, defaultValue, ...rest } =
|
|
260
|
+
this.props;
|
|
261
|
+
const { languages } = this.state;
|
|
262
|
+
delete rest.className;
|
|
263
|
+
return (
|
|
264
|
+
<Select
|
|
265
|
+
isMulti={isMulti}
|
|
266
|
+
className="select__item"
|
|
267
|
+
classNamePrefix="select"
|
|
268
|
+
options={this.getOptions()}
|
|
269
|
+
components={{ MultiValueLabel, MultiValueRemove, Option }}
|
|
270
|
+
placeholder={placeholder}
|
|
271
|
+
onChange={this.onChange}
|
|
272
|
+
isClearable={false}
|
|
273
|
+
value={languages}
|
|
274
|
+
minimumLength={minimumLength}
|
|
275
|
+
{...rest}
|
|
276
|
+
/>
|
|
277
|
+
);
|
|
278
|
+
}
|
|
279
|
+
|
|
280
|
+
render() {
|
|
281
|
+
const { size, className, error, label, hideLabel, icon, ...rest } = this.props;
|
|
282
|
+
const errorComponent = error ? <span className="select__error">{error}</span> : null;
|
|
283
|
+
const classesContainer = cl('select', { 'select--iconed': icon }, `select--${size}`, className);
|
|
284
|
+
return (
|
|
285
|
+
<div className={classesContainer}>
|
|
286
|
+
{hideLabel ? (
|
|
287
|
+
this.renderInput({ error, size, ...rest })
|
|
288
|
+
) : (
|
|
289
|
+
<>
|
|
290
|
+
{label && (
|
|
291
|
+
<label className="select__label" htmlFor={this.inputId}>
|
|
292
|
+
{label}
|
|
293
|
+
</label>
|
|
294
|
+
)}
|
|
295
|
+
{this.renderInput({ error, size, ...rest })}
|
|
296
|
+
</>
|
|
297
|
+
)}
|
|
298
|
+
{icon}
|
|
299
|
+
{errorComponent}
|
|
300
|
+
</div>
|
|
301
|
+
);
|
|
302
|
+
}
|
|
303
|
+
}
|
|
304
|
+
|
|
305
|
+
LanguageSelect.defaultProps = {
|
|
306
|
+
filter: [],
|
|
307
|
+
isMulti: false,
|
|
308
|
+
placeholder: '',
|
|
309
|
+
onChange: null,
|
|
310
|
+
size: 'normal',
|
|
311
|
+
className: null,
|
|
312
|
+
hideLabel: false,
|
|
313
|
+
icon: null,
|
|
314
|
+
value: null,
|
|
315
|
+
defaultValue: null,
|
|
316
|
+
label: null,
|
|
317
|
+
error: null,
|
|
318
|
+
minimumLength: 0,
|
|
319
|
+
};
|
|
320
|
+
LanguageSelect.propTypes = {
|
|
321
|
+
filter: PropTypes.array,
|
|
322
|
+
isMulti: PropTypes.bool,
|
|
323
|
+
placeholder: PropTypes.string,
|
|
324
|
+
value: PropTypes.string,
|
|
325
|
+
defaultValue: PropTypes.string,
|
|
326
|
+
minimumLength: PropTypes.number,
|
|
327
|
+
onChange: PropTypes.func,
|
|
328
|
+
className: PropTypes.string,
|
|
329
|
+
size: PropTypes.oneOf(['big', 'normal', 'small', 'mini']),
|
|
330
|
+
label: PropTypes.string,
|
|
331
|
+
error: PropTypes.string,
|
|
332
|
+
hideLabel: PropTypes.bool,
|
|
333
|
+
icon: PropTypes.string,
|
|
334
|
+
};
|
|
@@ -2,6 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import Select from './Select';
|
|
3
3
|
import AsyncSelect from './AsyncSelect';
|
|
4
4
|
import CountrySelect from './CountrySelect';
|
|
5
|
+
import LanguageSelect from './LanguageSelect';
|
|
5
6
|
|
|
6
7
|
const Story = {
|
|
7
8
|
title: 'base/Select',
|
|
@@ -86,3 +87,12 @@ AsyncLoadOptions.args = {
|
|
|
86
87
|
const TemplateCountrySelect = () => <CountrySelect placeholder="Select country" />;
|
|
87
88
|
export const CountrySelectChange = TemplateCountrySelect.bind({});
|
|
88
89
|
CountrySelectChange.args = {};
|
|
90
|
+
|
|
91
|
+
const TemplateLanguageSelect = (args) => <LanguageSelect {...args} />;
|
|
92
|
+
export const LanguageSelectChange = TemplateLanguageSelect.bind({});
|
|
93
|
+
LanguageSelectChange.args = {
|
|
94
|
+
isMulti: true,
|
|
95
|
+
closeMenuOnSelect: false,
|
|
96
|
+
defaultValue: 'en',
|
|
97
|
+
minimumLength: 1,
|
|
98
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path id="d" d="m8.563,18.179c0,.084-.096.151-.218.151-.138.013-.235-.054-.235-.151,0-.084.096-.151.218-.151.126-.013.235.054.235.151Zm-1.302-.188c-.029.084.054.179.179.205.095.046.21.009.26-.084.025-.084-.054-.179-.179-.218-.098-.035-.208.005-.26.096Zm1.85-.071c-.119.029-.205.109-.192.205.013.084.119.138.247.109s.205-.109.192-.192-.126-.135-.247-.122ZM11.865,1.88C6.323,1.764,1.736,6.162,1.62,11.704c-.003.13-.003.26,0,.39-.036,4.516,2.822,8.549,7.095,10.012.536.096.724-.235.724-.507,0-.26-.013-1.691-.013-2.57,0,0-2.93.628-3.545-1.25,0,0-.476-1.218-1.164-1.532,0,0-.958-.655.067-.645.677.092,1.273.491,1.616,1.083.577,1.077,1.918,1.483,2.995.906.019-.01.038-.021.056-.031.054-.533.291-1.032.67-1.411-2.339-.26-4.703-.598-4.703-4.625-.047-.927.314-1.827.988-2.465-.317-.928-.279-1.941.109-2.842.875-.272,2.888,1.131,2.888,1.131,1.72-.474,3.537-.474,5.257,0,0,0,2.013-1.407,2.888-1.131.388.901.426,1.914.109,2.842.699.627,1.092,1.526,1.08,2.465,0,4.039-2.465,4.362-4.805,4.625.51.512.771,1.222.714,1.942,0,1.411-.013,3.155-.013,3.499,0,.272.192.603.724.507,4.26-1.46,7.096-5.498,7.024-10.001-.002-5.809-4.71-10.216-10.516-10.216Zm-6.178,14.436c-.054.042-.042.138.029.218.067.067.163.096.218.042.054-.042.042-.138-.029-.218-.067-.067-.163-.096-.218-.042Zm-.452-.339c-.029.054.013.119.096.163.055.042.133.031.174-.023.001-.002.003-.004.004-.006.029-.054-.013-.119-.096-.163-.082-.025-.149-.013-.179.03h0Zm1.356,1.488c-.067.054-.042.179.054.26.096.096.218.109.272.042.054-.054.029-.179-.054-.26-.092-.094-.217-.107-.272-.039v-.002Zm-.476-.616c-.067.042-.067.151,0,.247s.179.138.235.096c.068-.073.068-.186,0-.26-.06-.094-.168-.136-.235-.082v-.002Z"/></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="m21.998,10.27h-9.777v3.902h5.598c-.251,1.28-.986,2.362-2.077,3.097-.934.623-2.12,1.004-3.521,1.004-2.708,0-5.001-1.826-5.823-4.291-.216-.623-.329-1.289-.329-1.981s.121-1.358.329-1.981c.822-2.466,3.115-4.292,5.823-4.292,1.531,0,2.898.528,3.98,1.557l2.959-2.959c-1.791-1.679-4.136-2.708-6.939-2.708-4.058,0-7.562,2.336-9.267,5.728-.709,1.402-1.116,2.976-1.116,4.655s.407,3.253,1.116,4.655c1.705,3.392,5.209,5.728,9.267,5.728,2.803,0,5.148-.934,6.861-2.518,1.955-1.808,3.08-4.473,3.08-7.631,0-.684-.061-1.332-.164-1.964Z"/></svg>
|