@mozaic-ds/vue 0.38.0 → 0.39.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mozaic-ds/vue",
3
- "version": "0.38.0",
3
+ "version": "0.39.0",
4
4
  "description": "Vue.js implementation of Mozaic Design System",
5
5
  "author": "Adeo - Mozaic Design System",
6
6
  "scripts": {
@@ -24,9 +24,9 @@
24
24
  ],
25
25
  "dependencies": {
26
26
  "@linusborg/vue-simple-portal": "^0.1.5",
27
- "@mozaic-ds/css-dev-tools": "1.50.0",
28
- "@mozaic-ds/icons": "1.52.0",
29
- "@mozaic-ds/styles": "1.53.0",
27
+ "@mozaic-ds/css-dev-tools": "1.54.0",
28
+ "@mozaic-ds/icons": "1.54.0",
29
+ "@mozaic-ds/styles": "1.54.0",
30
30
  "@mozaic-ds/web-fonts": "1.22.0",
31
31
  "core-js": "^3.28.0",
32
32
  "libphonenumber-js": "^1.10.19",
@@ -22,9 +22,10 @@
22
22
  v-model="inputValue"
23
23
  :placeholder="placeholder"
24
24
  :is-invalid="isInvalid"
25
+ :is-valid="isValid"
25
26
  :disabled="disabled"
26
27
  :size="size"
27
- :root-class="getInvalidRootClass"
28
+ :root-class="[getInvalidRootClass, getValidRootClass]"
28
29
  text-input-field-class="mc-autocomplete__trigger"
29
30
  icon-position="left"
30
31
  icon="DisplaySearch48"
@@ -153,6 +154,10 @@ export default {
153
154
  type: Boolean,
154
155
  default: false,
155
156
  },
157
+ valid: {
158
+ type: Boolean,
159
+ default: false,
160
+ },
156
161
  loading: {
157
162
  type: Boolean,
158
163
  default: false,
@@ -242,9 +247,15 @@ export default {
242
247
  isInvalid() {
243
248
  return this.invalid || this.isFiltered;
244
249
  },
250
+ isValid() {
251
+ return this.valid || this.isFiltered;
252
+ },
245
253
  getInvalidRootClass() {
246
254
  return (this.isInvalid && 'is-invalid') || null;
247
255
  },
256
+ getValidRootClass() {
257
+ return (this.isValid && 'is-valid') || null;
258
+ },
248
259
  },
249
260
 
250
261
  watch: {
@@ -166,17 +166,4 @@ export default {
166
166
  <style lang="scss">
167
167
  @import 'settings-tools/all-settings';
168
168
  @import 'components/c.fields';
169
-
170
- // TODO: temporary fix - should be put inside @mozaic-ds/styles
171
- .mc-field--group {
172
- .mc-field {
173
- &__container {
174
- margin-top: 0;
175
- }
176
-
177
- &__legend {
178
- margin-bottom: 1rem;
179
- }
180
- }
181
- }
182
169
  </style>
@@ -270,7 +270,7 @@ export default {
270
270
 
271
271
  &__tile {
272
272
  align-items: center;
273
- color: #1e1e1c;
273
+ color: $color-grey-900;
274
274
  display: flex;
275
275
  gap: $mu050;
276
276
  min-height: $mu250;
@@ -108,17 +108,4 @@ export default {
108
108
  <style lang="scss">
109
109
  @import 'settings-tools/all-settings';
110
110
  @import 'components/c.fields';
111
-
112
- // TODO: temporary fix - should be put inside @mozaic-ds/styles
113
- .mc-field--group {
114
- .mc-field {
115
- &__container {
116
- margin-top: 0;
117
- }
118
-
119
- &__legend {
120
- margin-bottom: 1rem;
121
- }
122
- }
123
- }
124
111
  </style>