@webitel/ui-sdk 23.12.43 → 23.12.44

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.
Files changed (35) hide show
  1. package/dist/img/sprite/index.js +1 -0
  2. package/dist/img/sprite/variable-select.svg +9 -0
  3. package/dist/ui-sdk.css +1 -1
  4. package/dist/ui-sdk.mjs +4300 -4301
  5. package/dist/ui-sdk.umd.js +6 -6
  6. package/package.json +1 -1
  7. package/src/components/wt-checkbox/wt-checkbox.vue +3 -41
  8. package/src/components/wt-chip/_variables.scss +25 -2
  9. package/src/components/wt-chip/wt-chip.scss +20 -17
  10. package/src/components/wt-chip/wt-chip.vue +4 -2
  11. package/src/components/wt-icon-btn/wt-icon-btn.vue +2 -1
  12. package/src/components/wt-input/wt-input.vue +1 -1
  13. package/src/components/wt-popup/_variables.scss +4 -3
  14. package/src/components/wt-popup/wt-popup.vue +5 -3
  15. package/src/components/wt-select/_multiselect.scss +48 -52
  16. package/src/components/wt-select/_variables.scss +0 -3
  17. package/src/components/wt-select/wt-select.vue +8 -21
  18. package/src/components/wt-switcher/_variables.scss +30 -7
  19. package/src/components/wt-switcher/wt-switcher.vue +44 -28
  20. package/src/components/wt-table/_variables.scss +8 -5
  21. package/src/components/wt-table/wt-table.vue +13 -18
  22. package/src/components/wt-table-column-select/wt-table-column-select.vue +5 -2
  23. package/src/components/wt-tabs/_variables.scss +4 -4
  24. package/src/components/wt-tabs/wt-tabs.vue +8 -6
  25. package/src/components/wt-tags-input/wt-tags-input.vue +3 -20
  26. package/src/components/wt-textarea/wt-textarea.vue +6 -23
  27. package/src/components/wt-time-input/wt-time-input.vue +17 -50
  28. package/src/components/wt-timepicker/wt-timepicker.vue +0 -12
  29. package/src/components/wt-tooltip/__tests__/WtTooltip.spec.js +0 -10
  30. package/src/components/wt-tooltip/_variables.scss +2 -4
  31. package/src/components/wt-tooltip/wt-tooltip.vue +2 -14
  32. package/src/css/styleguide/colors/_colors.scss +6 -6
  33. package/src/css/styleguide/colors/reusable/_text-field.scss +16 -0
  34. package/src/css/styleguide/placeholder/_placeholder.scss +5 -0
  35. package/src/components/wt-tags-input/_variables.scss +0 -24
package/src/css/styleguide/colors/_colors.scss CHANGED
@@ -36,7 +36,7 @@
36
36
  --success-color: var(--green-darken-4);
37
37
  --success-hover-color: var(--green-darken-3);
38
38
  --success-light-color: var(--green-lighten-4);
39
- --success-on-color: var(--black);
39
+ --success-on-color: var(--white);
40
40
 
41
41
  // warning colors
42
42
  --warning-color: var(--orange-accent-2);
@@ -48,7 +48,7 @@
48
48
  --error-color: var(--red-accent-2);
49
49
  --error-hover-color: var(--red-lighten-2);
50
50
  --error-light-color: var(--red-lighten-4);
51
- --error-on-color: var(--black);
51
+ --error-on-color: var(--white);
52
52
 
53
53
  // info colors
54
54
  --info-color: var(--blue-darken-1);
@@ -93,7 +93,7 @@
93
93
 
94
94
  :root.theme--dark {
95
95
  // dp colors
96
- --dp-24-surface-color: hsl(0, 0%, 25%);
96
+ --dp-24-surface-color: hsl(225, 20%, 25%);
97
97
  --dp-23-surface-color: hsl(225, 20%, 24%);
98
98
  --dp-22-surface-color: hsl(225, 20%, 23%);
99
99
  --dp-21-surface-color: hsl(225, 20%, 22%);
@@ -125,19 +125,19 @@
125
125
  --success-color: var(--green-darken-4);
126
126
  --success-hover-color: var(--green-darken-3);
127
127
  --success-light-color: var(--green-lighten-3);
128
- --success-on-color: var(--white);
128
+ --success-on-color: var(--black);
129
129
 
130
130
  // warning colors
131
131
  --warning-color: var(--orange-accent-2);
132
132
  --warning-hover-color: var(--orange-accent-1);
133
133
  --warning-light-color: var(--orange-lighten-3);
134
- --warning-on-color: var(--white);
134
+ --warning-on-color: var(--black);
135
135
 
136
136
  // error colors
137
137
  --error-color: var(--red-accent-2);
138
138
  --error-hover-color: var(--red-lighten-2);
139
139
  --error-light-color: var(--red-lighten-3);
140
- --error-on-color: var(--white);
140
+ --error-on-color: var(--black);
141
141
 
142
142
  // info colors
143
143
  --info-color: var(--blue-darken-1);
package/src/css/styleguide/colors/reusable/_text-field.scss CHANGED
@@ -2,17 +2,33 @@
2
2
 
3
3
  :root {
4
4
  // TODO: move to separate helper-text component
5
+ // helper
5
6
  --wt-helper-text-color: var(--text-main-color);
6
7
  --wt-helper-text-disabled-color: var(--text-disabled-color);
7
8
 
9
+ // placeholder
8
10
  --wt-text-field-error-text-color: var(--error-color);
9
11
  --wt-text-field-placeholder-color: var(--text-main-color);
10
12
  --wt-text-field-placeholder-error-color: var(--error-color);
11
13
  --wt-text-field-placeholder-disabled-color: var(--text-disabled-color);
12
14
 
15
+ // border
13
16
  --wt-text-field-input-border-color: var(--grey-darken-1);
14
17
  --wt-text-field-input-border-disabled-color: var(--dp-16-surface-color);
15
18
  --wt-text-field-input-border-error-color: var(--error-color);
19
+
20
+ // input bg
21
+ --wt-text-field-input-background-disabled-color: var(--dp-16-surface-color);
22
+
23
+ // select
24
+ --wt-text-field-select-option-text-color: var(--text-main-color);
25
+ --wt-text-field-select-option-text-hover-color: var(--primary-on-color);
26
+ --wt-text-field-select-option-text-selected-color: var(--primary-on-color);
27
+
28
+ --wt-text-field-select-option-wrapper-border-color: var(--dp-22-surface-color);
29
+ --wt-text-field-select-option-background-color: var(--dp-22-surface-color);
30
+ --wt-text-field-select-option-background-hover-color: var(--primary-light-color);
31
+ --wt-text-field-select-option-background-selected-color: var(--primary-color);
16
32
  }
17
33
 
18
34
  :root.theme--dark {
package/src/css/styleguide/placeholder/_placeholder.scss CHANGED
@@ -42,3 +42,8 @@ $vendors: (':-webkit', '-moz', ':-moz', '-ms');
42
42
  @extend %wt-placeholder;
43
43
  color: var(--wt-text-field-placeholder-disabled-color);
44
44
  }
45
+
46
+ %wt-placeholder--error {
47
+ @extend %wt-placeholder;
48
+ color: var(--wt-text-field-placeholder-error-color);
49
+ }
package/src/components/wt-tags-input/_variables.scss DELETED
@@ -1,24 +0,0 @@
1
-
2
- :root {
3
- --tags-input-padding: var(--input-padding);
4
- --tags-input-min-height: 40px; // 24px lh + paddings
5
- --tags-input-border: var(--input-border);
6
- --tags-input-border-color: var(--form-border-color);
7
-
8
- --tags-input-tags-gap: var(--spacing-xs);
9
- --tags-input-tag-text-color: var(--text-primary-color);
10
- --tags-input-tag-bg-color: var(--accent-secondary-color);
11
- --tags-input-tag-actions-margin-left: var(--spacing-2xs);
12
-
13
- --tags-input-tag-text-color--deletion: var(--text-contrast-color);
14
- --tags-input-tag-bg-color--deletion: var(--false-color);
15
-
16
- --tags-input-autocomplete-max-height: 300px;
17
- --tags-input-autocomplete-border: var(--input-border);
18
- --tags-input-autocomplete-border-color: var(--form-border-color);
19
- --tags-input-autocomplete-option-padding: var(--input-padding);
20
- --tags-input-autocomplete-option--text-color: var(--form-placeholder-color);
21
-
22
- --tags-input-option-bg-color--hover: var(--accent-secondary-color);
23
- --tags-input-option-text-color--hover: var(--text-primary-color);
24
- }