@weni/unnnic-system 3.9.1-alpha.5 → 3.9.1-alpha.6
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/dist/components/DateFilter/DateFilter.vue.d.ts +82 -3
- package/dist/components/Input/BaseInput.vue.d.ts +22 -0
- package/dist/components/Input/BaseInput.vue.d.ts.map +1 -1
- package/dist/components/Input/Input.vue.d.ts +82 -3
- package/dist/components/Input/Input.vue.d.ts.map +1 -1
- package/dist/components/Input/TextInput.vue.d.ts +53 -2
- package/dist/components/Input/TextInput.vue.d.ts.map +1 -1
- package/dist/components/InputDatePicker/InputDatePicker.vue.d.ts +82 -3
- package/dist/components/InputNext/InputNext.vue.d.ts +1 -1
- package/dist/components/ModalNext/ModalNext.vue.d.ts +82 -3
- package/dist/components/SelectSmart/SelectSmart.vue.d.ts +53 -2
- package/dist/components/SelectTime/index.vue.d.ts +53 -2
- package/dist/components/index.d.ts +658 -26
- package/dist/components/index.d.ts.map +1 -1
- package/dist/{es-34d30fa1.mjs → es-18dc2623.mjs} +1 -1
- package/dist/{index-70478d63.mjs → index-d490afbf.mjs} +2423 -2365
- package/dist/locales/en.json.d.ts +2 -1
- package/dist/locales/es.json.d.ts +2 -1
- package/dist/locales/pt_br.json.d.ts +2 -1
- package/dist/{pt-br-c6ed3625.mjs → pt-br-ea959d2d.mjs} +1 -1
- package/dist/style.css +1 -1
- package/dist/unnnic.mjs +1 -1
- package/dist/unnnic.umd.js +28 -28
- package/package.json +1 -1
- package/src/assets/scss/scheme-colors.scss +309 -223
- package/src/components/Checkbox/Checkbox.vue +1 -1
- package/src/components/Input/BaseInput.vue +21 -2
- package/src/components/Input/Input.scss +2 -1
- package/src/components/Input/Input.vue +19 -1
- package/src/components/Input/TextInput.vue +66 -21
- package/src/components/Input/__test__/__snapshots__/Input.spec.js.snap +10 -6
- package/src/components/Input/__test__/__snapshots__/TextInput.spec.js.snap +7 -1
- package/src/components/MultiSelectV2/MultSelectOption.vue +67 -0
- package/src/components/MultiSelectV2/__tests__/MultiSelect.spec.js +556 -0
- package/src/components/MultiSelectV2/__tests__/MultiSelectOption.spec.js +229 -0
- package/src/components/MultiSelectV2/__tests__/__snapshots__/MultiSelect.spec.js.snap +121 -0
- package/src/components/MultiSelectV2/__tests__/__snapshots__/MultiSelectOption.spec.js.snap +51 -0
- package/src/components/MultiSelectV2/index.vue +221 -0
- package/src/components/Popover/__tests__/Popover.spec.js +147 -0
- package/src/components/Popover/__tests__/__snapshots__/Popover.spec.js.snap +8 -0
- package/src/components/Popover/index.vue +146 -0
- package/src/components/Select/SelectOption.vue +65 -0
- package/src/components/Select/__tests__/Select.spec.js +412 -0
- package/src/components/Select/__tests__/SelectItem.spec.js +330 -0
- package/src/components/Select/__tests__/SelectOption.spec.js +174 -0
- package/src/components/Select/__tests__/__snapshots__/Select.spec.js.snap +97 -0
- package/src/components/Select/__tests__/__snapshots__/SelectItem.spec.js.snap +15 -0
- package/src/components/Select/__tests__/__snapshots__/SelectOption.spec.js.snap +25 -0
- package/src/components/Select/index.vue +249 -0
- package/src/locales/en.json +2 -1
- package/src/locales/es.json +2 -1
- package/src/locales/pt_br.json +2 -1
- package/src/stories/MultiSelectV2.stories.js +158 -0
- package/src/stories/Select.stories.js +158 -0
package/package.json
CHANGED
|
@@ -3,242 +3,327 @@
|
|
|
3
3
|
|
|
4
4
|
// Global scheme colors mapping for all components
|
|
5
5
|
|
|
6
|
-
$unnnic-scheme-colors:
|
|
7
|
-
'white' $unnnic-color-white,
|
|
6
|
+
$unnnic-scheme-colors: 'white'$unnnic-color-white,
|
|
8
7
|
|
|
9
|
-
'black'
|
|
8
|
+
'black'$unnnic-color-black,
|
|
10
9
|
|
|
11
|
-
'gray-50'
|
|
12
|
-
'gray-100'
|
|
13
|
-
'gray-200'
|
|
14
|
-
'gray-300'
|
|
15
|
-
'gray-400'
|
|
16
|
-
'gray-500'
|
|
17
|
-
'gray-600'
|
|
18
|
-
'gray-700'
|
|
19
|
-
'gray-800'
|
|
20
|
-
'gray-900'
|
|
21
|
-
'gray-950'
|
|
10
|
+
'gray-50'$unnnic-color-gray-50,
|
|
11
|
+
'gray-100'$unnnic-color-gray-100,
|
|
12
|
+
'gray-200'$unnnic-color-gray-200,
|
|
13
|
+
'gray-300'$unnnic-color-gray-300,
|
|
14
|
+
'gray-400'$unnnic-color-gray-400,
|
|
15
|
+
'gray-500'$unnnic-color-gray-500,
|
|
16
|
+
'gray-600'$unnnic-color-gray-600,
|
|
17
|
+
'gray-700'$unnnic-color-gray-700,
|
|
18
|
+
'gray-800'$unnnic-color-gray-800,
|
|
19
|
+
'gray-900'$unnnic-color-gray-900,
|
|
20
|
+
'gray-950'$unnnic-color-gray-950,
|
|
22
21
|
|
|
23
|
-
'teal-50'
|
|
24
|
-
'teal-100'
|
|
25
|
-
'teal-200'
|
|
26
|
-
'teal-300'
|
|
27
|
-
'teal-400'
|
|
28
|
-
'teal-500'
|
|
29
|
-
'teal-600'
|
|
30
|
-
'teal-700'
|
|
31
|
-
'teal-800'
|
|
32
|
-
'teal-900'
|
|
33
|
-
'teal-950'
|
|
22
|
+
'teal-50'$unnnic-color-teal-50,
|
|
23
|
+
'teal-100'$unnnic-color-teal-100,
|
|
24
|
+
'teal-200'$unnnic-color-teal-200,
|
|
25
|
+
'teal-300'$unnnic-color-teal-300,
|
|
26
|
+
'teal-400'$unnnic-color-teal-400,
|
|
27
|
+
'teal-500'$unnnic-color-teal-500,
|
|
28
|
+
'teal-600'$unnnic-color-teal-600,
|
|
29
|
+
'teal-700'$unnnic-color-teal-700,
|
|
30
|
+
'teal-800'$unnnic-color-teal-800,
|
|
31
|
+
'teal-900'$unnnic-color-teal-900,
|
|
32
|
+
'teal-950'$unnnic-color-teal-950,
|
|
34
33
|
|
|
35
|
-
'green-50'
|
|
36
|
-
'green-100'
|
|
37
|
-
'green-200'
|
|
38
|
-
'green-300'
|
|
39
|
-
'green-400'
|
|
40
|
-
'green-500'
|
|
41
|
-
'green-600'
|
|
42
|
-
'green-700'
|
|
43
|
-
'green-800'
|
|
44
|
-
'green-900'
|
|
45
|
-
'green-950'
|
|
34
|
+
'green-50'$unnnic-color-green-50,
|
|
35
|
+
'green-100'$unnnic-color-green-100,
|
|
36
|
+
'green-200'$unnnic-color-green-200,
|
|
37
|
+
'green-300'$unnnic-color-green-300,
|
|
38
|
+
'green-400'$unnnic-color-green-400,
|
|
39
|
+
'green-500'$unnnic-color-green-500,
|
|
40
|
+
'green-600'$unnnic-color-green-600,
|
|
41
|
+
'green-700'$unnnic-color-green-700,
|
|
42
|
+
'green-800'$unnnic-color-green-800,
|
|
43
|
+
'green-900'$unnnic-color-green-900,
|
|
44
|
+
'green-950'$unnnic-color-green-950,
|
|
46
45
|
|
|
47
|
-
'blue-50'
|
|
48
|
-
'blue-100'
|
|
49
|
-
'blue-200'
|
|
50
|
-
'blue-300'
|
|
51
|
-
'blue-400'
|
|
52
|
-
'blue-500'
|
|
53
|
-
'blue-600'
|
|
54
|
-
'blue-700'
|
|
55
|
-
'blue-800'
|
|
56
|
-
'blue-900'
|
|
57
|
-
'blue-950'
|
|
46
|
+
'blue-50'$unnnic-color-blue-50,
|
|
47
|
+
'blue-100'$unnnic-color-blue-100,
|
|
48
|
+
'blue-200'$unnnic-color-blue-200,
|
|
49
|
+
'blue-300'$unnnic-color-blue-300,
|
|
50
|
+
'blue-400'$unnnic-color-blue-400,
|
|
51
|
+
'blue-500'$unnnic-color-blue-500,
|
|
52
|
+
'blue-600'$unnnic-color-blue-600,
|
|
53
|
+
'blue-700'$unnnic-color-blue-700,
|
|
54
|
+
'blue-800'$unnnic-color-blue-800,
|
|
55
|
+
'blue-900'$unnnic-color-blue-900,
|
|
56
|
+
'blue-950'$unnnic-color-blue-950,
|
|
58
57
|
|
|
59
|
-
'purple-50'
|
|
60
|
-
'purple-100'
|
|
61
|
-
'purple-200'
|
|
62
|
-
'purple-300'
|
|
63
|
-
'purple-400'
|
|
64
|
-
'purple-500'
|
|
65
|
-
'purple-600'
|
|
66
|
-
'purple-700'
|
|
67
|
-
'purple-800'
|
|
68
|
-
'purple-900'
|
|
69
|
-
'purple-950'
|
|
58
|
+
'purple-50'$unnnic-color-purple-50,
|
|
59
|
+
'purple-100'$unnnic-color-purple-100,
|
|
60
|
+
'purple-200'$unnnic-color-purple-200,
|
|
61
|
+
'purple-300'$unnnic-color-purple-300,
|
|
62
|
+
'purple-400'$unnnic-color-purple-400,
|
|
63
|
+
'purple-500'$unnnic-color-purple-500,
|
|
64
|
+
'purple-600'$unnnic-color-purple-600,
|
|
65
|
+
'purple-700'$unnnic-color-purple-700,
|
|
66
|
+
'purple-800'$unnnic-color-purple-800,
|
|
67
|
+
'purple-900'$unnnic-color-purple-900,
|
|
68
|
+
'purple-950'$unnnic-color-purple-950,
|
|
70
69
|
|
|
71
|
-
'red-50'
|
|
72
|
-
'red-100'
|
|
73
|
-
'red-200'
|
|
74
|
-
'red-300'
|
|
75
|
-
'red-400'
|
|
76
|
-
'red-500'
|
|
77
|
-
'red-600'
|
|
78
|
-
'red-700'
|
|
79
|
-
'red-800'
|
|
80
|
-
'red-900'
|
|
81
|
-
'red-950'
|
|
70
|
+
'red-50'$unnnic-color-red-50,
|
|
71
|
+
'red-100'$unnnic-color-red-100,
|
|
72
|
+
'red-200'$unnnic-color-red-200,
|
|
73
|
+
'red-300'$unnnic-color-red-300,
|
|
74
|
+
'red-400'$unnnic-color-red-400,
|
|
75
|
+
'red-500'$unnnic-color-red-500,
|
|
76
|
+
'red-600'$unnnic-color-red-600,
|
|
77
|
+
'red-700'$unnnic-color-red-700,
|
|
78
|
+
'red-800'$unnnic-color-red-800,
|
|
79
|
+
'red-900'$unnnic-color-red-900,
|
|
80
|
+
'red-950'$unnnic-color-red-950,
|
|
82
81
|
|
|
83
|
-
'orange-50'
|
|
84
|
-
'orange-100'
|
|
85
|
-
'orange-200'
|
|
86
|
-
'orange-300'
|
|
87
|
-
'orange-400'
|
|
88
|
-
'orange-500'
|
|
89
|
-
'orange-600'
|
|
90
|
-
'orange-700'
|
|
91
|
-
'orange-800'
|
|
92
|
-
'orange-900'
|
|
93
|
-
'orange-950'
|
|
82
|
+
'orange-50'$unnnic-color-orange-50,
|
|
83
|
+
'orange-100'$unnnic-color-orange-100,
|
|
84
|
+
'orange-200'$unnnic-color-orange-200,
|
|
85
|
+
'orange-300'$unnnic-color-orange-300,
|
|
86
|
+
'orange-400'$unnnic-color-orange-400,
|
|
87
|
+
'orange-500'$unnnic-color-orange-500,
|
|
88
|
+
'orange-600'$unnnic-color-orange-600,
|
|
89
|
+
'orange-700'$unnnic-color-orange-700,
|
|
90
|
+
'orange-800'$unnnic-color-orange-800,
|
|
91
|
+
'orange-900'$unnnic-color-orange-900,
|
|
92
|
+
'orange-950'$unnnic-color-orange-950,
|
|
94
93
|
|
|
95
|
-
'yellow-50'
|
|
96
|
-
'yellow-100'
|
|
97
|
-
'yellow-200'
|
|
98
|
-
'yellow-300'
|
|
99
|
-
'yellow-400'
|
|
100
|
-
'yellow-500'
|
|
101
|
-
'yellow-600'
|
|
102
|
-
'yellow-700'
|
|
103
|
-
'yellow-800'
|
|
104
|
-
'yellow-900'
|
|
105
|
-
'yellow-950'
|
|
94
|
+
'yellow-50'$unnnic-color-yellow-50,
|
|
95
|
+
'yellow-100'$unnnic-color-yellow-100,
|
|
96
|
+
'yellow-200'$unnnic-color-yellow-200,
|
|
97
|
+
'yellow-300'$unnnic-color-yellow-300,
|
|
98
|
+
'yellow-400'$unnnic-color-yellow-400,
|
|
99
|
+
'yellow-500'$unnnic-color-yellow-500,
|
|
100
|
+
'yellow-600'$unnnic-color-yellow-600,
|
|
101
|
+
'yellow-700'$unnnic-color-yellow-700,
|
|
102
|
+
'yellow-800'$unnnic-color-yellow-800,
|
|
103
|
+
'yellow-900'$unnnic-color-yellow-900,
|
|
104
|
+
'yellow-950'$unnnic-color-yellow-950,
|
|
106
105
|
|
|
107
|
-
'bg-base'
|
|
108
|
-
'bg-soft'
|
|
109
|
-
'bg-muted'
|
|
110
|
-
'bg-active'
|
|
111
|
-
'bg-info'
|
|
112
|
-
'bg-success'
|
|
113
|
-
'bg-warning'
|
|
114
|
-
'bg-critical'
|
|
106
|
+
'bg-base'$unnnic-color-bg-base,
|
|
107
|
+
'bg-soft'$unnnic-color-bg-soft,
|
|
108
|
+
'bg-muted'$unnnic-color-bg-muted,
|
|
109
|
+
'bg-active'$unnnic-color-bg-active,
|
|
110
|
+
'bg-info'$unnnic-color-bg-info,
|
|
111
|
+
'bg-success'$unnnic-color-bg-success,
|
|
112
|
+
'bg-warning'$unnnic-color-bg-warning,
|
|
113
|
+
'bg-critical'$unnnic-color-bg-critical,
|
|
115
114
|
|
|
116
|
-
'fg-base'
|
|
117
|
-
'fg-muted'
|
|
118
|
-
'fg-emphasized'
|
|
119
|
-
'fg-inverted'
|
|
120
|
-
'fg-active'
|
|
121
|
-
'fg-info'
|
|
122
|
-
'fg-success'
|
|
123
|
-
'fg-warning'
|
|
124
|
-
'fg-critical'
|
|
115
|
+
'fg-base'$unnnic-color-fg-base,
|
|
116
|
+
'fg-muted'$unnnic-color-fg-muted,
|
|
117
|
+
'fg-emphasized'$unnnic-color-fg-emphasized,
|
|
118
|
+
'fg-inverted'$unnnic-color-fg-inverted,
|
|
119
|
+
'fg-active'$unnnic-color-fg-active,
|
|
120
|
+
'fg-info'$unnnic-color-fg-info,
|
|
121
|
+
'fg-success'$unnnic-color-fg-success,
|
|
122
|
+
'fg-warning'$unnnic-color-fg-warning,
|
|
123
|
+
'fg-critical'$unnnic-color-fg-critical,
|
|
125
124
|
|
|
126
|
-
'border-base'
|
|
127
|
-
'border-soft'
|
|
128
|
-
'border-muted'
|
|
129
|
-
'border-emphasized'
|
|
130
|
-
'border-active'
|
|
131
|
-
'border-info'
|
|
132
|
-
'border-success'
|
|
133
|
-
'border-warning'
|
|
134
|
-
'border-critical'
|
|
125
|
+
'border-base'$unnnic-color-border-base,
|
|
126
|
+
'border-soft'$unnnic-color-border-soft,
|
|
127
|
+
'border-muted'$unnnic-color-border-muted,
|
|
128
|
+
'border-emphasized'$unnnic-color-border-emphasized,
|
|
129
|
+
'border-active'$unnnic-color-border-active,
|
|
130
|
+
'border-info'$unnnic-color-border-info,
|
|
131
|
+
'border-success'$unnnic-color-border-success,
|
|
132
|
+
'border-warning'$unnnic-color-border-warning,
|
|
133
|
+
'border-critical'$unnnic-color-border-critical,
|
|
135
134
|
|
|
136
135
|
// Deprecated
|
|
137
|
-
'background-solo'
|
|
138
|
-
'background-sky'
|
|
139
|
-
'background-grass'
|
|
140
|
-
'background-carpet'
|
|
141
|
-
'background-snow'
|
|
142
|
-
'background-lightest'
|
|
143
|
-
'background-white'
|
|
144
|
-
|
|
145
|
-
'neutral-black' $unnnic-color-gray-900,
|
|
146
|
-
'neutral-darkest' $unnnic-color-gray-800,
|
|
147
|
-
'neutral-dark' $unnnic-color-gray-700,
|
|
148
|
-
'neutral-cloudy' $unnnic-color-gray-500,
|
|
149
|
-
'neutral-cleanest' $unnnic-color-gray-200,
|
|
150
|
-
'neutral-clean' $unnnic-color-gray-300,
|
|
151
|
-
'neutral-soft' $unnnic-color-gray-100,
|
|
152
|
-
'neutral-lightest' $unnnic-color-gray-50,
|
|
153
|
-
'neutral-light' $unnnic-color-gray-50,
|
|
154
|
-
'neutral-white' $unnnic-color-white,
|
|
155
|
-
'neutral-snow' $unnnic-color-white,
|
|
156
|
-
|
|
157
|
-
'feedback-red' $unnnic-color-red-500,
|
|
158
|
-
'feedback-green' $unnnic-color-green-500,
|
|
159
|
-
'feedback-yellow' $unnnic-color-yellow-500,
|
|
160
|
-
'feedback-blue' $unnnic-color-blue-500,
|
|
161
|
-
'feedback-grey' $unnnic-color-gray-500,
|
|
162
|
-
|
|
163
|
-
'aux-blue' $unnnic-color-blue-500,
|
|
164
|
-
'aux-purple' $unnnic-color-purple-500,
|
|
165
|
-
'aux-orange' $unnnic-color-orange-500,
|
|
166
|
-
'aux-lemon' $unnnic-color-yellow-400,
|
|
167
|
-
'aux-pink' $unnnic-color-red-300,
|
|
168
|
-
'aux-baby-blue' $unnnic-color-blue-200,
|
|
169
|
-
'aux-baby-yellow' $unnnic-color-yellow-200,
|
|
170
|
-
'aux-baby-red' $unnnic-color-red-200,
|
|
171
|
-
'aux-baby-green' $unnnic-color-green-200,
|
|
172
|
-
'aux-baby-pink' $unnnic-color-red-100,
|
|
173
|
-
|
|
174
|
-
'aux-green-100' $unnnic-color-green-100,
|
|
175
|
-
'aux-green-300' $unnnic-color-green-300,
|
|
176
|
-
'aux-green-500' $unnnic-color-green-500,
|
|
177
|
-
'aux-green-700' $unnnic-color-green-700,
|
|
178
|
-
'aux-green-900' $unnnic-color-green-900,
|
|
179
|
-
'aux-blue-100' $unnnic-color-blue-100,
|
|
180
|
-
'aux-blue-300' $unnnic-color-blue-300,
|
|
181
|
-
'aux-blue-500' $unnnic-color-blue-500,
|
|
182
|
-
'aux-blue-700' $unnnic-color-blue-700,
|
|
183
|
-
'aux-blue-900' $unnnic-color-blue-900,
|
|
184
|
-
'aux-purple-100' $unnnic-color-purple-100,
|
|
185
|
-
'aux-purple-300' $unnnic-color-purple-300,
|
|
186
|
-
'aux-purple-500' $unnnic-color-purple-500,
|
|
187
|
-
'aux-purple-700' $unnnic-color-purple-700,
|
|
188
|
-
'aux-purple-900' $unnnic-color-purple-900,
|
|
189
|
-
'aux-red-100' $unnnic-color-red-100,
|
|
190
|
-
'aux-red-300' $unnnic-color-red-300,
|
|
191
|
-
'aux-red-500' $unnnic-color-red-500,
|
|
192
|
-
'aux-red-700' $unnnic-color-red-700,
|
|
193
|
-
'aux-red-900' $unnnic-color-red-900,
|
|
194
|
-
'aux-orange-100' $unnnic-color-orange-100,
|
|
195
|
-
'aux-orange-300' $unnnic-color-orange-300,
|
|
196
|
-
'aux-orange-500' $unnnic-color-orange-500,
|
|
197
|
-
'aux-orange-700' $unnnic-color-orange-700,
|
|
198
|
-
'aux-orange-900' $unnnic-color-orange-900,
|
|
199
|
-
'aux-yellow-100' $unnnic-color-yellow-100,
|
|
200
|
-
'aux-yellow-300' $unnnic-color-yellow-300,
|
|
201
|
-
'aux-yellow-500' $unnnic-color-yellow-500,
|
|
202
|
-
'aux-yellow-700' $unnnic-color-yellow-700,
|
|
203
|
-
'aux-yellow-900' $unnnic-color-yellow-900,
|
|
204
|
-
|
|
205
|
-
'floweditor-blue' $unnnic-color-blue-600,
|
|
206
|
-
'floweditor-purple' $unnnic-color-purple-600,
|
|
207
|
-
'floweditor-wine' $unnnic-color-red-800,
|
|
208
|
-
'floweditor-orange' $unnnic-color-orange-600,
|
|
209
|
-
'floweditor-pink' $unnnic-color-red-400,
|
|
210
|
-
'floweditor-turquoise' $unnnic-color-teal-500,
|
|
211
|
-
'floweditor-green' $unnnic-color-green-600,
|
|
212
|
-
|
|
213
|
-
'weni-50' $unnnic-color-teal-50,
|
|
214
|
-
'weni-100' $unnnic-color-teal-100,
|
|
215
|
-
'weni-200' $unnnic-color-teal-200,
|
|
216
|
-
'weni-300' $unnnic-color-teal-300,
|
|
217
|
-
'weni-400' $unnnic-color-teal-400,
|
|
218
|
-
'weni-500' $unnnic-color-teal-500,
|
|
219
|
-
'weni-600' $unnnic-color-teal-600,
|
|
220
|
-
'weni-700' $unnnic-color-teal-700,
|
|
221
|
-
'weni-800' $unnnic-color-teal-800,
|
|
222
|
-
'weni-900' $unnnic-color-teal-900,
|
|
223
|
-
'weni-950' $unnnic-color-teal-950,
|
|
224
|
-
'brand-weni' $unnnic-color-teal-600,
|
|
225
|
-
'brand-weni-dark' $unnnic-color-teal-800,
|
|
226
|
-
'brand-weni-soft' $unnnic-color-teal-600,
|
|
227
|
-
'brand-sec-dark' $unnnic-color-blue-800,
|
|
228
|
-
'brand-sec-soft' $unnnic-color-blue-100,
|
|
229
|
-
'brand-sec' $unnnic-color-blue-600,
|
|
136
|
+
'background-solo'$unnnic-color-teal-50,
|
|
137
|
+
'background-sky'$unnnic-color-gray-50,
|
|
138
|
+
'background-grass'$unnnic-color-green-50,
|
|
139
|
+
'background-carpet'$unnnic-color-gray-50,
|
|
140
|
+
'background-snow'$unnnic-color-white,
|
|
141
|
+
'background-lightest'$unnnic-color-gray-50,
|
|
142
|
+
'background-white'$unnnic-color-white,
|
|
230
143
|
|
|
231
|
-
'
|
|
232
|
-
'
|
|
233
|
-
'
|
|
234
|
-
'
|
|
235
|
-
'
|
|
236
|
-
'
|
|
237
|
-
'
|
|
238
|
-
'
|
|
239
|
-
'
|
|
240
|
-
'
|
|
241
|
-
'
|
|
144
|
+
'neutral-black'$unnnic-color-gray-900,
|
|
145
|
+
'neutral-darkest'$unnnic-color-gray-800,
|
|
146
|
+
'neutral-dark'$unnnic-color-gray-700,
|
|
147
|
+
'neutral-cloudy'$unnnic-color-gray-500,
|
|
148
|
+
'neutral-cleanest'$unnnic-color-gray-200,
|
|
149
|
+
'neutral-clean'$unnnic-color-gray-300,
|
|
150
|
+
'neutral-soft'$unnnic-color-gray-100,
|
|
151
|
+
'neutral-lightest'$unnnic-color-gray-50,
|
|
152
|
+
'neutral-light'$unnnic-color-gray-50,
|
|
153
|
+
'neutral-white'$unnnic-color-white,
|
|
154
|
+
'neutral-snow'$unnnic-color-white,
|
|
155
|
+
|
|
156
|
+
'feedback-red'$unnnic-color-red-500,
|
|
157
|
+
'feedback-green'$unnnic-color-green-500,
|
|
158
|
+
'feedback-yellow'$unnnic-color-yellow-500,
|
|
159
|
+
'feedback-blue'$unnnic-color-blue-500,
|
|
160
|
+
'feedback-grey'$unnnic-color-gray-500,
|
|
161
|
+
|
|
162
|
+
'aux-blue'$unnnic-color-blue-500,
|
|
163
|
+
'aux-purple'$unnnic-color-purple-500,
|
|
164
|
+
'aux-orange'$unnnic-color-orange-500,
|
|
165
|
+
'aux-lemon'$unnnic-color-yellow-400,
|
|
166
|
+
'aux-pink'$unnnic-color-red-300,
|
|
167
|
+
'aux-baby-blue'$unnnic-color-blue-200,
|
|
168
|
+
'aux-baby-yellow'$unnnic-color-yellow-200,
|
|
169
|
+
'aux-baby-red'$unnnic-color-red-200,
|
|
170
|
+
'aux-baby-green'$unnnic-color-green-200,
|
|
171
|
+
'aux-baby-pink'$unnnic-color-red-100,
|
|
172
|
+
|
|
173
|
+
'aux-green-100'$unnnic-color-green-100,
|
|
174
|
+
'aux-green-300'$unnnic-color-green-300,
|
|
175
|
+
'aux-green-500'$unnnic-color-green-500,
|
|
176
|
+
'aux-green-700'$unnnic-color-green-700,
|
|
177
|
+
'aux-green-900'$unnnic-color-green-900,
|
|
178
|
+
'aux-blue-100'$unnnic-color-blue-100,
|
|
179
|
+
'aux-blue-300'$unnnic-color-blue-300,
|
|
180
|
+
'aux-blue-500'$unnnic-color-blue-500,
|
|
181
|
+
'aux-blue-700'$unnnic-color-blue-700,
|
|
182
|
+
'aux-blue-900'$unnnic-color-blue-900,
|
|
183
|
+
'aux-purple-100'$unnnic-color-purple-100,
|
|
184
|
+
'aux-purple-300'$unnnic-color-purple-300,
|
|
185
|
+
'aux-purple-500'$unnnic-color-purple-500,
|
|
186
|
+
'aux-purple-700'$unnnic-color-purple-700,
|
|
187
|
+
'aux-purple-900'$unnnic-color-purple-900,
|
|
188
|
+
'aux-red-100'$unnnic-color-red-100,
|
|
189
|
+
'aux-red-300'$unnnic-color-red-300,
|
|
190
|
+
'aux-red-500'$unnnic-color-red-500,
|
|
191
|
+
'aux-red-700'$unnnic-color-red-700,
|
|
192
|
+
'aux-red-900'$unnnic-color-red-900,
|
|
193
|
+
'aux-orange-100'$unnnic-color-orange-100,
|
|
194
|
+
'aux-orange-300'$unnnic-color-orange-300,
|
|
195
|
+
'aux-orange-500'$unnnic-color-orange-500,
|
|
196
|
+
'aux-orange-700'$unnnic-color-orange-700,
|
|
197
|
+
'aux-orange-900'$unnnic-color-orange-900,
|
|
198
|
+
'aux-yellow-100'$unnnic-color-yellow-100,
|
|
199
|
+
'aux-yellow-300'$unnnic-color-yellow-300,
|
|
200
|
+
'aux-yellow-500'$unnnic-color-yellow-500,
|
|
201
|
+
'aux-yellow-700'$unnnic-color-yellow-700,
|
|
202
|
+
'aux-yellow-900'$unnnic-color-yellow-900,
|
|
203
|
+
|
|
204
|
+
'floweditor-blue'$unnnic-color-blue-600,
|
|
205
|
+
'floweditor-purple'$unnnic-color-purple-600,
|
|
206
|
+
'floweditor-wine'$unnnic-color-red-800,
|
|
207
|
+
'floweditor-orange'$unnnic-color-orange-600,
|
|
208
|
+
'floweditor-pink'$unnnic-color-red-400,
|
|
209
|
+
'floweditor-turquoise'$unnnic-color-teal-500,
|
|
210
|
+
'floweditor-green'$unnnic-color-green-600,
|
|
211
|
+
|
|
212
|
+
'weni-50'$unnnic-color-teal-50,
|
|
213
|
+
'weni-100'$unnnic-color-teal-100,
|
|
214
|
+
'weni-200'$unnnic-color-teal-200,
|
|
215
|
+
'weni-300'$unnnic-color-teal-300,
|
|
216
|
+
'weni-400'$unnnic-color-teal-400,
|
|
217
|
+
'weni-500'$unnnic-color-teal-500,
|
|
218
|
+
'weni-600'$unnnic-color-teal-600,
|
|
219
|
+
'weni-700'$unnnic-color-teal-700,
|
|
220
|
+
'weni-800'$unnnic-color-teal-800,
|
|
221
|
+
'weni-900'$unnnic-color-teal-900,
|
|
222
|
+
'weni-950'$unnnic-color-teal-950,
|
|
223
|
+
'brand-weni'$unnnic-color-teal-600,
|
|
224
|
+
'brand-weni-dark'$unnnic-color-teal-800,
|
|
225
|
+
'brand-weni-soft'$unnnic-color-teal-600,
|
|
226
|
+
'brand-sec-dark'$unnnic-color-blue-800,
|
|
227
|
+
'brand-sec-soft'$unnnic-color-blue-100,
|
|
228
|
+
'brand-sec'$unnnic-color-blue-600,
|
|
229
|
+
|
|
230
|
+
'neutral-black'$unnnic-color-gray-900,
|
|
231
|
+
'neutral-darkest'$unnnic-color-gray-800,
|
|
232
|
+
'neutral-dark'$unnnic-color-gray-700,
|
|
233
|
+
'neutral-cloudy'$unnnic-color-gray-500,
|
|
234
|
+
'neutral-cleanest'$unnnic-color-gray-200,
|
|
235
|
+
'neutral-clean'$unnnic-color-gray-300,
|
|
236
|
+
'neutral-soft'$unnnic-color-gray-100,
|
|
237
|
+
'neutral-lightest'$unnnic-color-gray-50,
|
|
238
|
+
'neutral-light'$unnnic-color-gray-50,
|
|
239
|
+
'neutral-white'$unnnic-color-white,
|
|
240
|
+
'neutral-snow'$unnnic-color-white,
|
|
241
|
+
|
|
242
|
+
'feedback-red'$unnnic-color-red-500,
|
|
243
|
+
'feedback-green'$unnnic-color-green-500,
|
|
244
|
+
'feedback-yellow'$unnnic-color-yellow-500,
|
|
245
|
+
'feedback-blue'$unnnic-color-blue-500,
|
|
246
|
+
'feedback-grey'$unnnic-color-gray-500,
|
|
247
|
+
|
|
248
|
+
'aux-blue'$unnnic-color-blue-500,
|
|
249
|
+
'aux-purple'$unnnic-color-purple-500,
|
|
250
|
+
'aux-orange'$unnnic-color-orange-500,
|
|
251
|
+
'aux-lemon'$unnnic-color-yellow-400,
|
|
252
|
+
'aux-pink'$unnnic-color-red-300,
|
|
253
|
+
'aux-baby-blue'$unnnic-color-blue-200,
|
|
254
|
+
'aux-baby-yellow'$unnnic-color-yellow-200,
|
|
255
|
+
'aux-baby-red'$unnnic-color-red-200,
|
|
256
|
+
'aux-baby-green'$unnnic-color-green-200,
|
|
257
|
+
'aux-baby-pink'$unnnic-color-red-100,
|
|
258
|
+
|
|
259
|
+
'aux-green-100'$unnnic-color-green-100,
|
|
260
|
+
'aux-green-300'$unnnic-color-green-300,
|
|
261
|
+
'aux-green-500'$unnnic-color-green-500,
|
|
262
|
+
'aux-green-700'$unnnic-color-green-700,
|
|
263
|
+
'aux-green-900'$unnnic-color-green-900,
|
|
264
|
+
'aux-blue-100'$unnnic-color-blue-100,
|
|
265
|
+
'aux-blue-300'$unnnic-color-blue-300,
|
|
266
|
+
'aux-blue-500'$unnnic-color-blue-500,
|
|
267
|
+
'aux-blue-700'$unnnic-color-blue-700,
|
|
268
|
+
'aux-blue-900'$unnnic-color-blue-900,
|
|
269
|
+
'aux-purple-100'$unnnic-color-purple-100,
|
|
270
|
+
'aux-purple-300'$unnnic-color-purple-300,
|
|
271
|
+
'aux-purple-500'$unnnic-color-purple-500,
|
|
272
|
+
'aux-purple-700'$unnnic-color-purple-700,
|
|
273
|
+
'aux-purple-900'$unnnic-color-purple-900,
|
|
274
|
+
'aux-red-100'$unnnic-color-red-100,
|
|
275
|
+
'aux-red-300'$unnnic-color-red-300,
|
|
276
|
+
'aux-red-500'$unnnic-color-red-500,
|
|
277
|
+
'aux-red-700'$unnnic-color-red-700,
|
|
278
|
+
'aux-red-900'$unnnic-color-red-900,
|
|
279
|
+
'aux-orange-100'$unnnic-color-orange-100,
|
|
280
|
+
'aux-orange-300'$unnnic-color-orange-300,
|
|
281
|
+
'aux-orange-500'$unnnic-color-orange-500,
|
|
282
|
+
'aux-orange-700'$unnnic-color-orange-700,
|
|
283
|
+
'aux-orange-900'$unnnic-color-orange-900,
|
|
284
|
+
'aux-yellow-100'$unnnic-color-yellow-100,
|
|
285
|
+
'aux-yellow-300'$unnnic-color-yellow-300,
|
|
286
|
+
'aux-yellow-500'$unnnic-color-yellow-500,
|
|
287
|
+
'aux-yellow-700'$unnnic-color-yellow-700,
|
|
288
|
+
'aux-yellow-900'$unnnic-color-yellow-900,
|
|
289
|
+
|
|
290
|
+
'floweditor-blue'$unnnic-color-blue-600,
|
|
291
|
+
'floweditor-purple'$unnnic-color-purple-600,
|
|
292
|
+
'floweditor-wine'$unnnic-color-red-800,
|
|
293
|
+
'floweditor-orange'$unnnic-color-orange-600,
|
|
294
|
+
'floweditor-pink'$unnnic-color-red-400,
|
|
295
|
+
'floweditor-turquoise'$unnnic-color-teal-500,
|
|
296
|
+
'floweditor-green'$unnnic-color-green-600,
|
|
297
|
+
|
|
298
|
+
'weni-50'$unnnic-color-teal-50,
|
|
299
|
+
'weni-100'$unnnic-color-teal-100,
|
|
300
|
+
'weni-200'$unnnic-color-teal-200,
|
|
301
|
+
'weni-300'$unnnic-color-teal-300,
|
|
302
|
+
'weni-400'$unnnic-color-teal-400,
|
|
303
|
+
'weni-500'$unnnic-color-teal-500,
|
|
304
|
+
'weni-600'$unnnic-color-teal-600,
|
|
305
|
+
'weni-700'$unnnic-color-teal-700,
|
|
306
|
+
'weni-800'$unnnic-color-teal-800,
|
|
307
|
+
'weni-900'$unnnic-color-teal-900,
|
|
308
|
+
'weni-950'$unnnic-color-teal-950,
|
|
309
|
+
'brand-weni'$unnnic-color-teal-600,
|
|
310
|
+
'brand-weni-dark'$unnnic-color-teal-800,
|
|
311
|
+
'brand-weni-soft'$unnnic-color-teal-100,
|
|
312
|
+
'brand-sec-dark'$unnnic-color-blue-800,
|
|
313
|
+
'brand-sec-soft'$unnnic-color-blue-100,
|
|
314
|
+
'brand-sec'$unnnic-color-blue-600,
|
|
315
|
+
|
|
316
|
+
'teal-50'$unnnic-color-teal-50,
|
|
317
|
+
'teal-100'$unnnic-color-teal-100,
|
|
318
|
+
'teal-200'$unnnic-color-teal-200,
|
|
319
|
+
'teal-300'$unnnic-color-teal-300,
|
|
320
|
+
'teal-400'$unnnic-color-teal-400,
|
|
321
|
+
'teal-500'$unnnic-color-teal-500,
|
|
322
|
+
'teal-600'$unnnic-color-teal-600,
|
|
323
|
+
'teal-700'$unnnic-color-teal-700,
|
|
324
|
+
'teal-800'$unnnic-color-teal-800,
|
|
325
|
+
'teal-900'$unnnic-color-teal-900,
|
|
326
|
+
'teal-950'$unnnic-color-teal-950;
|
|
242
327
|
|
|
243
328
|
@mixin generate-scheme-classes($component-name, $property: 'background-color') {
|
|
244
329
|
@each $name, $color in $unnnic-scheme-colors {
|
|
@@ -250,10 +335,11 @@ $unnnic-scheme-colors:
|
|
|
250
335
|
|
|
251
336
|
@function get-scheme-color($name) {
|
|
252
337
|
@each $scheme-name, $color in $unnnic-scheme-colors {
|
|
253
|
-
@if $scheme-name
|
|
338
|
+
@if $scheme-name ==$name {
|
|
254
339
|
@return $color;
|
|
255
340
|
}
|
|
256
341
|
}
|
|
342
|
+
|
|
257
343
|
@warn "Scheme color '#{$name}' not found in $unnnic-scheme-colors";
|
|
258
344
|
@return null;
|
|
259
|
-
}
|
|
345
|
+
}
|
|
@@ -4,16 +4,18 @@
|
|
|
4
4
|
v-mask="mask"
|
|
5
5
|
v-bind="attributes"
|
|
6
6
|
:value="fullySanitize(modelValue)"
|
|
7
|
-
:class="classes"
|
|
7
|
+
:class="[classes, { focus: forceActiveStatus }]"
|
|
8
8
|
:type="nativeType"
|
|
9
|
+
:readonly="readonly"
|
|
9
10
|
/>
|
|
10
11
|
<input
|
|
11
12
|
v-else
|
|
12
13
|
v-bind="attributes"
|
|
13
14
|
:value="fullySanitize(modelValue)"
|
|
14
|
-
:class="classes"
|
|
15
|
+
:class="[classes, { focus: forceActiveStatus }]"
|
|
15
16
|
:type="nativeType"
|
|
16
17
|
:maxlength="maxlength"
|
|
18
|
+
:readonly="readonly"
|
|
17
19
|
/>
|
|
18
20
|
</template>
|
|
19
21
|
|
|
@@ -49,10 +51,19 @@ export default {
|
|
|
49
51
|
},
|
|
50
52
|
hasIconLeft: Boolean,
|
|
51
53
|
hasIconRight: Boolean,
|
|
54
|
+
hasClearIcon: Boolean,
|
|
52
55
|
maxlength: {
|
|
53
56
|
type: Number,
|
|
54
57
|
default: null,
|
|
55
58
|
},
|
|
59
|
+
readonly: {
|
|
60
|
+
type: Boolean,
|
|
61
|
+
default: false,
|
|
62
|
+
},
|
|
63
|
+
forceActiveStatus: {
|
|
64
|
+
type: Boolean,
|
|
65
|
+
default: false,
|
|
66
|
+
},
|
|
56
67
|
},
|
|
57
68
|
emits: ['update:modelValue'],
|
|
58
69
|
data() {
|
|
@@ -77,6 +88,7 @@ export default {
|
|
|
77
88
|
{
|
|
78
89
|
'input--has-icon-left': this.hasIconLeft,
|
|
79
90
|
'input--has-icon-right': this.hasIconRight,
|
|
91
|
+
'input--has-clear-icon': this.hasClearIcon,
|
|
80
92
|
},
|
|
81
93
|
];
|
|
82
94
|
},
|
|
@@ -117,6 +129,13 @@ export default {
|
|
|
117
129
|
|
|
118
130
|
&.input--has-icon-right {
|
|
119
131
|
padding-right: $unnnic-space-10;
|
|
132
|
+
&.input--has-clear-icon {
|
|
133
|
+
padding-right: $unnnic-space-10 + $unnnic-space-6;
|
|
134
|
+
}
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
&.input--has-clear-icon {
|
|
138
|
+
padding-right: $unnnic-space-10;
|
|
120
139
|
}
|
|
121
140
|
|
|
122
141
|
&.error {
|