@momentum-design/components 0.53.8 → 0.54.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 (48) hide show
  1. package/dist/browser/index.js +433 -406
  2. package/dist/browser/index.js.map +4 -4
  3. package/dist/components/checkbox/checkbox.component.d.ts +1 -9
  4. package/dist/components/checkbox/checkbox.component.js +7 -21
  5. package/dist/components/checkbox/checkbox.styles.js +30 -67
  6. package/dist/components/checkbox/index.d.ts +1 -0
  7. package/dist/components/checkbox/index.js +1 -0
  8. package/dist/components/link/link.component.d.ts +29 -18
  9. package/dist/components/link/link.component.js +67 -39
  10. package/dist/components/link/link.styles.js +34 -48
  11. package/dist/components/link/link.types.d.ts +7 -1
  12. package/dist/components/radio/index.d.ts +1 -0
  13. package/dist/components/radio/index.js +1 -0
  14. package/dist/components/radio/radio.component.d.ts +3 -11
  15. package/dist/components/radio/radio.component.js +10 -16
  16. package/dist/components/radio/radio.styles.js +36 -111
  17. package/dist/components/staticcheckbox/index.d.ts +8 -0
  18. package/dist/components/staticcheckbox/index.js +5 -0
  19. package/dist/components/staticcheckbox/staticcheckbox.component.d.ts +42 -0
  20. package/dist/components/staticcheckbox/staticcheckbox.component.js +76 -0
  21. package/dist/components/staticcheckbox/staticcheckbox.constants.d.ts +3 -0
  22. package/dist/components/staticcheckbox/staticcheckbox.constants.js +4 -0
  23. package/dist/components/staticcheckbox/staticcheckbox.styles.d.ts +2 -0
  24. package/dist/components/staticcheckbox/staticcheckbox.styles.js +60 -0
  25. package/dist/components/staticradio/index.d.ts +7 -0
  26. package/dist/components/staticradio/index.js +4 -0
  27. package/dist/components/staticradio/staticradio.component.d.ts +41 -0
  28. package/dist/components/staticradio/staticradio.component.js +67 -0
  29. package/dist/components/staticradio/staticradio.constants.d.ts +2 -0
  30. package/dist/components/staticradio/staticradio.constants.js +3 -0
  31. package/dist/components/staticradio/staticradio.styles.d.ts +2 -0
  32. package/dist/components/staticradio/staticradio.styles.js +86 -0
  33. package/dist/custom-elements.json +1838 -1491
  34. package/dist/index.d.ts +3 -1
  35. package/dist/index.js +3 -1
  36. package/dist/react/checkbox/index.d.ts +1 -9
  37. package/dist/react/checkbox/index.js +1 -9
  38. package/dist/react/index.d.ts +4 -2
  39. package/dist/react/index.js +4 -2
  40. package/dist/react/link/index.d.ts +13 -3
  41. package/dist/react/link/index.js +12 -3
  42. package/dist/react/radio/index.d.ts +3 -11
  43. package/dist/react/radio/index.js +3 -11
  44. package/dist/react/staticcheckbox/index.d.ts +25 -0
  45. package/dist/react/staticcheckbox/index.js +34 -0
  46. package/dist/react/staticradio/index.d.ts +24 -0
  47. package/dist/react/staticradio/index.js +33 -0
  48. package/package.json +1 -1
package/dist/components/staticradio/staticradio.styles.js ADDED
@@ -0,0 +1,86 @@
1
+ import { css } from 'lit';
2
+ const styles = [css `
3
+ :host{
4
+ display: block;
5
+ position: relative;
6
+ width: 1rem;
7
+ height: 1rem;
8
+ margin: 0.125rem 0;
9
+ border-radius: 50%;
10
+
11
+ --mdc-staticradio-inner-circle-size: 0.375rem;
12
+ --mdc-staticradio-text-disabled-color: var(--mds-color-theme-text-primary-disabled);
13
+ --mdc-staticradio-disabled-border-color: var(--mds-color-theme-outline-primary-disabled);
14
+ --mdc-staticradio-normal-border-color: var(--mds-color-theme-outline-input-normal);
15
+ --mdc-staticradio-inner-circle-normal-background: var(--mds-color-theme-inverted-text-primary-normal);
16
+ --mdc-staticradio-inner-circle-disabled-background: var(--mds-color-theme-inverted-text-primary-disabled);
17
+ --mdc-staticradio-control-inactive-color: var(--mds-color-theme-control-inactive-normal);
18
+ --mdc-staticradio-control-inactive-disabled-background: var(--mds-color-theme-control-inactive-disabled);
19
+ --mdc-staticradio-control-active-color: var(--mds-color-theme-control-active-normal);
20
+ --mdc-staticradio-control-active-disabled-background: var(--mds-color-theme-control-active-disabled);
21
+ }
22
+
23
+ .icon:after {
24
+ content: "";
25
+ position: absolute;
26
+ display: none;
27
+ }
28
+
29
+ :host([disabled]) .icon,
30
+ :host([disabled][readonly]) .icon {
31
+ border-color: var(--mdc-staticradio-disabled-border-color);
32
+ background: var(--mdc-staticradio-control-inactive-disabled-background);
33
+ }
34
+
35
+ :host([disabled][checked]) .icon,
36
+ :host([disabled][readonly][checked]) .icon {
37
+ border: var(--mdc-staticradio-control-active-disabled-background);
38
+ background: var(--mdc-staticradio-control-active-disabled-background);
39
+ }
40
+
41
+ :host([disabled][checked]) .icon:after,
42
+ :host([disabled][readonly][checked]) .icon:after {
43
+ background: var(--mdc-staticradio-inner-circle-disabled-background);
44
+ }
45
+
46
+ .icon {
47
+ position: absolute;
48
+ top: 0;
49
+ left: 0;
50
+ width: 1rem;
51
+ height: 1rem;
52
+ border: 0.0625rem solid var(--mdc-staticradio-normal-border-color);
53
+ background-color: var(--mdc-staticradio-control-inactive-color);
54
+ border-radius: 50%;
55
+ }
56
+
57
+ :host([checked]) .icon {
58
+ border-color: var(--mdc-staticradio-control-active-color);
59
+ background-color: var(--mdc-staticradio-control-active-color);
60
+ }
61
+
62
+ :host([checked]) .icon:after {
63
+ display: block;
64
+ top: 50%;
65
+ left: 50%;
66
+ transform: translate(-50%, -50%);
67
+ width: var(--mdc-staticradio-inner-circle-size);
68
+ height: var(--mdc-staticradio-inner-circle-size);
69
+ border-radius: 50%;
70
+ background: var(--mdc-staticradio-inner-circle-normal-background);
71
+ }
72
+
73
+ :host([readonly]) .icon{
74
+ border-color: var(--mdc-staticradio-normal-border-color);
75
+ background-color: var(--mdc-staticradio-control-inactive-color);
76
+ }
77
+
78
+ :host([readonly][checked]) .icon {
79
+ border-color: var(--mdc-staticradio-normal-border-color);
80
+ }
81
+
82
+ :host([readonly][checked]) .icon:after{
83
+ background-color: var(--mdc-staticradio-text-disabled-color);
84
+ }
85
+ `];
86
+ export default styles;