@educarehq/solaris-ui 0.27.3 → 2.0.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.
Files changed (41) hide show
  1. package/fesm2022/educarehq-solaris-ui-holidays-en-US-mijc8PUa.mjs +96 -0
  2. package/fesm2022/educarehq-solaris-ui-holidays-en-US-mijc8PUa.mjs.map +1 -0
  3. package/fesm2022/educarehq-solaris-ui-holidays-es-rZHStdFY.mjs +72 -0
  4. package/fesm2022/educarehq-solaris-ui-holidays-es-rZHStdFY.mjs.map +1 -0
  5. package/fesm2022/educarehq-solaris-ui-holidays-pt-BR-BIt7aq4i.mjs +127 -0
  6. package/fesm2022/educarehq-solaris-ui-holidays-pt-BR-BIt7aq4i.mjs.map +1 -0
  7. package/fesm2022/educarehq-solaris-ui.mjs +82187 -18398
  8. package/fesm2022/educarehq-solaris-ui.mjs.map +1 -1
  9. package/package.json +14 -8
  10. package/styles/_button.scss +494 -270
  11. package/styles/_core.scss +3 -0
  12. package/styles/_dropdown-menu.scss +3 -3
  13. package/styles/_form-field.scss +116 -0
  14. package/styles/_icon-button.scss +577 -210
  15. package/styles/_index.scss +3 -0
  16. package/styles/_input.scss +113 -63
  17. package/styles/_loading-zone.scss +7 -0
  18. package/styles/_motion.scss +14 -0
  19. package/styles/_popover.scss +5 -4
  20. package/styles/_textarea.scss +97 -47
  21. package/styles/_theme.scss +12 -0
  22. package/styles/token/color/_dark.scss +61 -51
  23. package/styles/token/color/_high-contrast.scss +157 -122
  24. package/styles/token/color/_light.scss +62 -52
  25. package/styles/token/density/_comfortable.scss +12 -12
  26. package/styles/token/density/_compact.scss +13 -13
  27. package/styles/token/density/_normal.scss +13 -13
  28. package/styles/token/focus/_focus.scss +4 -2
  29. package/styles/token/motion/_index.scss +2 -0
  30. package/styles/token/motion/_motion-keyframes.scss +188 -0
  31. package/styles/token/motion/_motion-mixins.scss +213 -0
  32. package/styles/token/motion/_motion.scss +4 -1
  33. package/styles/token/motion/_reduced-motion.scss +2 -0
  34. package/styles/token/radius/_radius.scss +1 -0
  35. package/styles/token/sizing/_control-height.scss +42 -0
  36. package/styles/token/sizing/_control-matrix.scss +37 -0
  37. package/styles/token/sizing/_index.scss +2 -0
  38. package/styles/token/spacing/_spacing.scss +19 -16
  39. package/styles/token/typography/_font-family.scss +1 -2
  40. package/styles/token/typography/_typography.scss +15 -11
  41. package/types/educarehq-solaris-ui.d.ts +17665 -4154
package/styles/_core.scss CHANGED
@@ -7,7 +7,10 @@
7
7
  /// @use '@solaris-ui/angular/styles' as solaris;
8
8
  /// @include solaris.core();
9
9
 
10
+ @use 'token/motion/motion-keyframes' as motion-keyframes;
11
+
10
12
  @mixin core() {
11
13
  // Uses browser default font-size (100%).
12
14
  // No root font-size override needed.
15
+ @include motion-keyframes.solaris-motion-keyframes;
13
16
  }
package/styles/_dropdown-menu.scss CHANGED
@@ -4,11 +4,11 @@
4
4
  overflow: hidden;
5
5
  }
6
6
  --solaris-dropdown-menu-min-width: calc(
7
- var(--solaris-spacing-24) + var(--solaris-spacing-10) +
7
+ var(--solaris-spacing-17) + var(--solaris-spacing-10) +
8
8
  var(--solaris-spacing-1)
9
9
  );
10
10
  --solaris-dropdown-menu-max-width: calc(
11
- var(--solaris-spacing-24) * 2 + var(--solaris-spacing-10) +
11
+ var(--solaris-spacing-17) * 2 + var(--solaris-spacing-10) +
12
12
  var(--solaris-spacing-2)
13
13
  );
14
14
  }
@@ -53,7 +53,7 @@ solaris-dropdown-menu-label {
53
53
  align-items: center;
54
54
  letter-spacing: 0.05em;
55
55
  text-transform: uppercase;
56
- color: var(--solaris-text-muted);
56
+ color: var(--solaris-neutral-text-secondary);
57
57
  font-size: var(--solaris-font-size-xs);
58
58
  line-height: var(--solaris-line-height-xs);
59
59
  font-weight: var(--solaris-font-weight-semibold);
package/styles/_form-field.scss ADDED
@@ -0,0 +1,116 @@
1
+ solaris-form-field .solaris-form-label {
2
+ cursor: pointer;
3
+ display: inline-block;
4
+ color: var(--solaris-form-field-label-color);
5
+ font-size: var(--solaris-form-field-label-font-size);
6
+ font-weight: var(--solaris-form-field-label-font-weight);
7
+ }
8
+
9
+ solaris-form-field .solaris-form-label-action {
10
+ margin-inline-start: auto;
11
+ white-space: nowrap;
12
+ }
13
+
14
+ solaris-otp-input solaris-form-field[data-appearance][data-focused] {
15
+ --solaris-form-field-focus-ring-color: transparent;
16
+ --solaris-form-field-error-border-color: transparent;
17
+ }
18
+
19
+ solaris-form-field .solaris-form-prefix,
20
+ solaris-form-field .solaris-form-suffix {
21
+ border: 0;
22
+ flex: 0 0 auto;
23
+ color: inherit;
24
+ cursor: inherit;
25
+ align-self: auto;
26
+ align-items: center;
27
+ display: inline-flex;
28
+ justify-content: center;
29
+ line-height: var(--solaris-line-height-none);
30
+ }
31
+
32
+ solaris-form-field[data-size][data-density]
33
+ .solaris-form-field__affix--prefix
34
+ [solaris-icon-button],
35
+ solaris-form-field[data-size][data-density]
36
+ .solaris-form-field__affix--suffix
37
+ [solaris-icon-button] {
38
+ --solaris-icon-button-size: var(--solaris-form-field-affix-size);
39
+ }
40
+
41
+ solaris-form-field[data-size][data-density]
42
+ .solaris-form-field__affix--prefix
43
+ [solaris-icon-button]::after,
44
+ solaris-form-field[data-size][data-density]
45
+ .solaris-form-field__affix--suffix
46
+ [solaris-icon-button]::after {
47
+ content: none;
48
+ }
49
+
50
+ solaris-form-field solaris-icon.solaris-form-prefix,
51
+ solaris-form-field solaris-icon.solaris-form-suffix,
52
+ solaris-form-field .solaris-form-prefix solaris-icon,
53
+ solaris-form-field .solaris-form-suffix solaris-icon {
54
+ flex: 0 0 auto;
55
+ color: inherit;
56
+ block-size: 1em;
57
+ inline-size: 1em;
58
+ font-size: var(--solaris-density-font-size);
59
+ transition: color var(--solaris-motion-duration-normal)
60
+ var(--solaris-motion-easing-standard);
61
+ }
62
+
63
+ solaris-form-field[data-density='compact'] solaris-icon.solaris-form-prefix,
64
+ solaris-form-field[data-density='compact'] solaris-icon.solaris-form-suffix,
65
+ solaris-form-field[data-density='compact'] .solaris-form-prefix solaris-icon,
66
+ solaris-form-field[data-density='compact'] .solaris-form-suffix solaris-icon {
67
+ font-size: var(--solaris-font-size-xs);
68
+ }
69
+
70
+ solaris-form-field[data-density='normal'] solaris-icon.solaris-form-prefix,
71
+ solaris-form-field[data-density='normal'] solaris-icon.solaris-form-suffix,
72
+ solaris-form-field[data-density='normal'] .solaris-form-prefix solaris-icon,
73
+ solaris-form-field[data-density='normal'] .solaris-form-suffix solaris-icon {
74
+ font-size: var(--solaris-font-size-sm);
75
+ }
76
+
77
+ solaris-form-field[data-density='comfortable'] solaris-icon.solaris-form-prefix,
78
+ solaris-form-field[data-density='comfortable'] solaris-icon.solaris-form-suffix,
79
+ solaris-form-field[data-density='comfortable']
80
+ .solaris-form-prefix
81
+ solaris-icon,
82
+ solaris-form-field[data-density='comfortable']
83
+ .solaris-form-suffix
84
+ solaris-icon {
85
+ font-size: var(--solaris-font-size-md);
86
+ }
87
+
88
+ solaris-form-field
89
+ .solaris-form-field__affix--suffix[data-variant='action']
90
+ [solaris-button] {
91
+ flex: none;
92
+ height: calc(
93
+ var(--solaris-form-field-control-height) -
94
+ (var(--solaris-border-width-sm) * 2) -
95
+ (var(--solaris-form-field-action-inset) * 2)
96
+ );
97
+ }
98
+
99
+ solaris-form-field[data-control-type='textarea'][data-control-resize='horizontal']
100
+ textarea[solaris-textarea] {
101
+ width: 100%;
102
+ min-width: 0;
103
+ resize: none;
104
+ display: block;
105
+ }
106
+
107
+ solaris-form-field[data-control-type='textarea'][data-control-resize='both']
108
+ textarea[solaris-textarea] {
109
+ width: 100%;
110
+ height: 100%;
111
+ resize: none;
112
+ min-width: 0;
113
+ min-height: 0;
114
+ display: block;
115
+ flex: 1 1 auto;
116
+ }