@momentum-design/components 0.18.3 → 0.18.4
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/browser/index.js +0 -14
- package/dist/browser/index.js.map +2 -2
- package/dist/components/badge/badge.component.d.ts +12 -0
- package/dist/components/badge/badge.component.js +12 -0
- package/dist/components/icon/icon.component.d.ts +2 -0
- package/dist/components/icon/icon.component.js +2 -0
- package/dist/components/presence/presence.component.d.ts +16 -0
- package/dist/components/presence/presence.component.js +16 -0
- package/dist/components/presence/presence.styles.js +0 -14
- package/dist/custom-elements.json +617 -501
- package/dist/react/badge/index.d.ts +12 -0
- package/dist/react/badge/index.js +12 -0
- package/dist/react/icon/index.d.ts +2 -0
- package/dist/react/icon/index.js +2 -0
- package/dist/react/index.d.ts +1 -1
- package/dist/react/index.js +1 -1
- package/dist/react/presence/index.d.ts +16 -0
- package/dist/react/presence/index.js +16 -0
- package/package.json +1 -1
@@ -23,6 +23,18 @@ import type { IconVariant, BadgeType } from './badge.types';
|
|
23
23
|
* @dependency mdc-text
|
24
24
|
*
|
25
25
|
* @tagname mdc-badge
|
26
|
+
*
|
27
|
+
* @cssproperty --mdc-badge-primary-foreground-color - The foreground color of the primary badge.
|
28
|
+
* @cssproperty --mdc-badge-primary-background-color - The background color of the primary badge.
|
29
|
+
* @cssproperty --mdc-badge-secondary-foreground-color - The foreground color of the secondary badge.
|
30
|
+
* @cssproperty --mdc-badge-secondary-background-color - The background color of the secondary badge.
|
31
|
+
* @cssproperty --mdc-badge-success-foreground-color - The foreground color of the success badge.
|
32
|
+
* @cssproperty --mdc-badge-success-background-color - The background color of the success badge.
|
33
|
+
* @cssproperty --mdc-badge-warning-foreground-color - The foreground color of the warning badge.
|
34
|
+
* @cssproperty --mdc-badge-warning-background-color - The background color of the warning badge.
|
35
|
+
* @cssproperty --mdc-badge-error-foreground-color - The foreground color of the error badge.
|
36
|
+
* @cssproperty --mdc-badge-error-background-color - The background color of the error badge.
|
37
|
+
* @cssproperty --mdc-badge-overlay-background-color - The background color of the badge overlay.
|
26
38
|
*/
|
27
39
|
declare class Badge extends Component {
|
28
40
|
/**
|
@@ -36,6 +36,18 @@ import styles from './badge.styles';
|
|
36
36
|
* @dependency mdc-text
|
37
37
|
*
|
38
38
|
* @tagname mdc-badge
|
39
|
+
*
|
40
|
+
* @cssproperty --mdc-badge-primary-foreground-color - The foreground color of the primary badge.
|
41
|
+
* @cssproperty --mdc-badge-primary-background-color - The background color of the primary badge.
|
42
|
+
* @cssproperty --mdc-badge-secondary-foreground-color - The foreground color of the secondary badge.
|
43
|
+
* @cssproperty --mdc-badge-secondary-background-color - The background color of the secondary badge.
|
44
|
+
* @cssproperty --mdc-badge-success-foreground-color - The foreground color of the success badge.
|
45
|
+
* @cssproperty --mdc-badge-success-background-color - The background color of the success badge.
|
46
|
+
* @cssproperty --mdc-badge-warning-foreground-color - The foreground color of the warning badge.
|
47
|
+
* @cssproperty --mdc-badge-warning-background-color - The background color of the warning badge.
|
48
|
+
* @cssproperty --mdc-badge-error-foreground-color - The foreground color of the error badge.
|
49
|
+
* @cssproperty --mdc-badge-error-background-color - The background color of the error badge.
|
50
|
+
* @cssproperty --mdc-badge-overlay-background-color - The background color of the badge overlay.
|
39
51
|
*/
|
40
52
|
class Badge extends Component {
|
41
53
|
constructor() {
|
@@ -44,6 +44,8 @@ import type { IconNames } from './icon.types';
|
|
44
44
|
* @tagname mdc-icon
|
45
45
|
*
|
46
46
|
* @cssproperty --mdc-icon-fill-color - Allows customization of the default fill color.
|
47
|
+
* @cssproperty --mdc-icon-size - Allows customization of the icon size.
|
48
|
+
* @cssproperty --mdc-icon-border-radius - Allows customization of the icon border radius.
|
47
49
|
*/
|
48
50
|
declare class Icon extends Component {
|
49
51
|
private iconData?;
|
@@ -58,6 +58,8 @@ import { DEFAULTS } from './icon.constants';
|
|
58
58
|
* @tagname mdc-icon
|
59
59
|
*
|
60
60
|
* @cssproperty --mdc-icon-fill-color - Allows customization of the default fill color.
|
61
|
+
* @cssproperty --mdc-icon-size - Allows customization of the icon size.
|
62
|
+
* @cssproperty --mdc-icon-border-radius - Allows customization of the icon border radius.
|
61
63
|
*/
|
62
64
|
class Icon extends Component {
|
63
65
|
constructor() {
|
@@ -11,6 +11,22 @@ import type { PresenceType, PresenceSize } from './presence.types';
|
|
11
11
|
* @dependency mdc-icon
|
12
12
|
*
|
13
13
|
* @tagname mdc-presence
|
14
|
+
*
|
15
|
+
* @cssproperty --mdc-presence-active-background-color - The background color of the presence type active.
|
16
|
+
* @cssproperty --mdc-presence-away-background-color - The background color of the presence type away.
|
17
|
+
* @cssproperty --mdc-presence-away-calling-background-color - The background color of the presence type away-calling.
|
18
|
+
* @cssproperty --mdc-presence-busy-background-color - The background color of the presence type busy.
|
19
|
+
* @cssproperty --mdc-presence-dnd-background-color - The background color of the presence type dnd.
|
20
|
+
* @cssproperty --mdc-presence-meeting-background-color - The background color of the presence type meeting.
|
21
|
+
* @cssproperty --mdc-presence-on-call-background-color - The background color of the presence type on-call.
|
22
|
+
* @cssproperty --mdc-presence-on-device-background-color - The background color of the presence type on-device.
|
23
|
+
* @cssproperty --mdc-presence-on-mobile-background-color - The background color of the presence type on-mobile.
|
24
|
+
* @cssproperty --mdc-presence-pause-background-color - The background color of the presence type pause.
|
25
|
+
* @cssproperty --mdc-presence-pto-background-color - The background color of the presence type pto.
|
26
|
+
* @cssproperty --mdc-presence-presenting-background-color - The background color of the presence type presenting.
|
27
|
+
* @cssproperty --mdc-presence-quiet-background-color - The background color of the presence type quiet.
|
28
|
+
* @cssproperty --mdc-presence-scheduled-background-color - The background color of the presence type scheduled.
|
29
|
+
* @cssproperty --mdc-presence-overlay-background-color - The background color of the presence type overlay.
|
14
30
|
*/
|
15
31
|
declare class Presence extends Component {
|
16
32
|
/**
|
@@ -23,6 +23,22 @@ import { getIconValue } from './presence.utils';
|
|
23
23
|
* @dependency mdc-icon
|
24
24
|
*
|
25
25
|
* @tagname mdc-presence
|
26
|
+
*
|
27
|
+
* @cssproperty --mdc-presence-active-background-color - The background color of the presence type active.
|
28
|
+
* @cssproperty --mdc-presence-away-background-color - The background color of the presence type away.
|
29
|
+
* @cssproperty --mdc-presence-away-calling-background-color - The background color of the presence type away-calling.
|
30
|
+
* @cssproperty --mdc-presence-busy-background-color - The background color of the presence type busy.
|
31
|
+
* @cssproperty --mdc-presence-dnd-background-color - The background color of the presence type dnd.
|
32
|
+
* @cssproperty --mdc-presence-meeting-background-color - The background color of the presence type meeting.
|
33
|
+
* @cssproperty --mdc-presence-on-call-background-color - The background color of the presence type on-call.
|
34
|
+
* @cssproperty --mdc-presence-on-device-background-color - The background color of the presence type on-device.
|
35
|
+
* @cssproperty --mdc-presence-on-mobile-background-color - The background color of the presence type on-mobile.
|
36
|
+
* @cssproperty --mdc-presence-pause-background-color - The background color of the presence type pause.
|
37
|
+
* @cssproperty --mdc-presence-pto-background-color - The background color of the presence type pto.
|
38
|
+
* @cssproperty --mdc-presence-presenting-background-color - The background color of the presence type presenting.
|
39
|
+
* @cssproperty --mdc-presence-quiet-background-color - The background color of the presence type quiet.
|
40
|
+
* @cssproperty --mdc-presence-scheduled-background-color - The background color of the presence type scheduled.
|
41
|
+
* @cssproperty --mdc-presence-overlay-background-color - The background color of the presence type overlay.
|
26
42
|
*/
|
27
43
|
class Presence extends Component {
|
28
44
|
constructor() {
|
@@ -5,33 +5,19 @@ const styles = [
|
|
5
5
|
css `
|
6
6
|
:host {
|
7
7
|
--mdc-presence-active-background-color: var(--mds-color-theme-indicator-stable);
|
8
|
-
|
9
8
|
--mdc-presence-away-background-color: var(--mds-color-theme-indicator-locked);
|
10
|
-
|
11
9
|
--mdc-presence-away-calling-background-color: var(--mds-color-theme-indicator-locked);
|
12
|
-
|
13
10
|
--mdc-presence-busy-background-color: var(--mds-color-theme-indicator-unstable);
|
14
|
-
|
15
11
|
--mdc-presence-dnd-background-color: var(--mds-color-theme-indicator-attention);
|
16
|
-
|
17
12
|
--mdc-presence-meeting-background-color: var(--mds-color-theme-indicator-unstable);
|
18
|
-
|
19
13
|
--mdc-presence-on-call-background-color: var(--mds-color-theme-indicator-unstable);
|
20
|
-
|
21
14
|
--mdc-presence-on-device-background-color: var(--mds-color-theme-indicator-locked);
|
22
|
-
|
23
15
|
--mdc-presence-on-mobile-background-color: var(--mds-color-theme-indicator-locked);
|
24
|
-
|
25
16
|
--mdc-presence-pause-background-color: var(--mds-color-theme-indicator-locked);
|
26
|
-
|
27
17
|
--mdc-presence-pto-background-color: var(--mds-color-theme-indicator-locked);
|
28
|
-
|
29
18
|
--mdc-presence-presenting-background-color: var(--mds-color-theme-indicator-attention);
|
30
|
-
|
31
19
|
--mdc-presence-quiet-background-color: var(--mds-color-theme-indicator-locked);
|
32
|
-
|
33
20
|
--mdc-presence-scheduled-background-color: var(--mds-color-theme-indicator-unstable);
|
34
|
-
|
35
21
|
--mdc-presence-overlay-background-color: var(--mds-color-theme-background-solid-primary-normal);
|
36
22
|
}
|
37
23
|
|