@ndlib/component-library 0.0.125 → 0.0.128
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.
|
@@ -37,7 +37,7 @@ export const Alerts = (_a) => {
|
|
|
37
37
|
}) })));
|
|
38
38
|
};
|
|
39
39
|
export const Alert = (_a) => {
|
|
40
|
-
var { type = ALERT_TYPE.INFORMATIONAL, description = '', dismiss } = _a, rest = __rest(_a, ["type", "description", "dismiss"]);
|
|
40
|
+
var { type = ALERT_TYPE.INFORMATIONAL, description = '', dismiss, sx } = _a, rest = __rest(_a, ["type", "description", "dismiss", "sx"]);
|
|
41
41
|
const theme = useTheme();
|
|
42
42
|
const style = {
|
|
43
43
|
backgroundColor: COLOR.ALERT_INFORMATIONAL_BG,
|
|
@@ -65,7 +65,8 @@ export const Alert = (_a) => {
|
|
|
65
65
|
[ALERT_TYPE.INFORMATIONAL]: InfoIcon,
|
|
66
66
|
[ALERT_TYPE.SUCCESS]: SuccessIcon,
|
|
67
67
|
}[type];
|
|
68
|
-
|
|
68
|
+
const mergedStyles = Object.assign(Object.assign({}, style), sx);
|
|
69
|
+
return (_jsx(Row, Object.assign({ sx: mergedStyles }, rest, { children: _jsxs(Row, Object.assign({ sx: {
|
|
69
70
|
boxSizing: 'border-box',
|
|
70
71
|
margin: '0 auto',
|
|
71
72
|
pl: '.5rem',
|
|
@@ -25,9 +25,14 @@ const colors = [
|
|
|
25
25
|
{ color: COLOR.ND_BLUE_DARK, label: 'ND_BLUE_DARK' },
|
|
26
26
|
{ color: COLOR.ND_BLUE_LIGHT, label: 'ND_BLUE_LIGHT' },
|
|
27
27
|
{ color: COLOR.ND_BLUE_BRIGHT, label: 'ND_BLUE_BRIGHT' },
|
|
28
|
+
{ color: COLOR.ND_SKY_BLUE, label: 'ND_SKY_BLUE' },
|
|
29
|
+
{ color: COLOR.ND_SKY_BLUE_LIGHT, label: 'ND_SKY_BLUE_LIGHT' },
|
|
30
|
+
{ color: COLOR.ND_SKY_BLUE_DARK, label: 'ND_SKY_BLUE_DARK' },
|
|
28
31
|
{ color: COLOR.ND_GOLD, label: 'ND_GOLD' },
|
|
29
32
|
{ color: COLOR.ND_GOLD_LIGHT, label: 'ND_GOLD_LIGHT' },
|
|
30
33
|
{ color: COLOR.ND_GOLD_DARK, label: 'ND_GOLD_DARK' },
|
|
34
|
+
{ color: COLOR.ND_GREEN, label: 'ND_GREEN' },
|
|
35
|
+
{ color: COLOR.ND_GREEN_LIGHT, label: 'ND_GREEN_LIGHT' },
|
|
31
36
|
{ color: COLOR.ND_METALLIC_GOLD, label: 'ND_METALLIC_GOLD' },
|
|
32
37
|
{ color: COLOR.ND_PROVOST_BLUE, label: 'ND_PROVOST_BLUE' },
|
|
33
38
|
{ color: COLOR.ND_SECONDARY_1, label: 'ND_SECONDARY_1' },
|
|
@@ -43,6 +48,9 @@ const colors = [
|
|
|
43
48
|
{ color: COLOR.ND_TERTIARY_5, label: 'ND_TERTIARY_5' },
|
|
44
49
|
{ color: COLOR.ND_TERTIARY_6, label: 'ND_TERTIARY_6' },
|
|
45
50
|
{ color: COLOR.ALERT_INFORMATIONAL_BG, label: 'ALERT_INFORMATIONAL_BG' },
|
|
51
|
+
{ color: COLOR.WHITE, label: 'WHITE' },
|
|
52
|
+
{ color: COLOR.WARM_WHITE, label: 'WARM_WHITE' },
|
|
53
|
+
{ color: COLOR.WARM_WHITE_DARK, label: 'WARM_WHITE_DARK' },
|
|
46
54
|
{
|
|
47
55
|
color: COLOR.ALERT_INFORMATIONAL_BORDER,
|
|
48
56
|
label: 'ALERT_INFORMATIONAL_BORDER',
|
package/dist/theme/colors.d.ts
CHANGED
|
@@ -10,6 +10,8 @@ export declare enum COLOR {
|
|
|
10
10
|
TEXT_ON_SECONDARY = "textOnSecondary",
|
|
11
11
|
SECONDARY_HIGHLIGHT = "secondaryHighlight",
|
|
12
12
|
WHITE = "white",
|
|
13
|
+
WARM_WHITE = "warmWhite",
|
|
14
|
+
WARM_WHITE_DARK = "warmWhiteDark",
|
|
13
15
|
BLACK = "black",
|
|
14
16
|
DARK_GRAY = "darkGray",
|
|
15
17
|
GRAY = "gray",
|
|
@@ -24,8 +26,11 @@ export declare enum COLOR {
|
|
|
24
26
|
ND_GOLD = "ndGold",
|
|
25
27
|
ND_GOLD_LIGHT = "ndGoldLight",
|
|
26
28
|
ND_GOLD_DARK = "ndGoldDark",
|
|
29
|
+
ND_GREEN = "ndGreem",
|
|
30
|
+
ND_GREEN_LIGHT = "ndGreemLight",
|
|
27
31
|
ND_SKY_BLUE = "ndSkyBlue",
|
|
28
32
|
ND_SKY_BLUE_DARK = "ndSkyBlueDark",
|
|
33
|
+
ND_SKY_BLUE_LIGHT = "ndSkyBlueLight",
|
|
29
34
|
ND_METALLIC_GOLD = "ndMetallicGold",
|
|
30
35
|
ND_PROVOST_BLUE = "ndProvostBlue",
|
|
31
36
|
ND_SECONDARY_1 = "ndSecondary1",
|
package/dist/theme/colors.js
CHANGED
|
@@ -11,6 +11,8 @@ export var COLOR;
|
|
|
11
11
|
COLOR["TEXT_ON_SECONDARY"] = "textOnSecondary";
|
|
12
12
|
COLOR["SECONDARY_HIGHLIGHT"] = "secondaryHighlight";
|
|
13
13
|
COLOR["WHITE"] = "white";
|
|
14
|
+
COLOR["WARM_WHITE"] = "warmWhite";
|
|
15
|
+
COLOR["WARM_WHITE_DARK"] = "warmWhiteDark";
|
|
14
16
|
COLOR["BLACK"] = "black";
|
|
15
17
|
COLOR["DARK_GRAY"] = "darkGray";
|
|
16
18
|
COLOR["GRAY"] = "gray";
|
|
@@ -25,8 +27,11 @@ export var COLOR;
|
|
|
25
27
|
COLOR["ND_GOLD"] = "ndGold";
|
|
26
28
|
COLOR["ND_GOLD_LIGHT"] = "ndGoldLight";
|
|
27
29
|
COLOR["ND_GOLD_DARK"] = "ndGoldDark";
|
|
30
|
+
COLOR["ND_GREEN"] = "ndGreem";
|
|
31
|
+
COLOR["ND_GREEN_LIGHT"] = "ndGreemLight";
|
|
28
32
|
COLOR["ND_SKY_BLUE"] = "ndSkyBlue";
|
|
29
33
|
COLOR["ND_SKY_BLUE_DARK"] = "ndSkyBlueDark";
|
|
34
|
+
COLOR["ND_SKY_BLUE_LIGHT"] = "ndSkyBlueLight";
|
|
30
35
|
COLOR["ND_METALLIC_GOLD"] = "ndMetallicGold";
|
|
31
36
|
COLOR["ND_PROVOST_BLUE"] = "ndProvostBlue";
|
|
32
37
|
COLOR["ND_SECONDARY_1"] = "ndSecondary1";
|
|
@@ -62,6 +67,8 @@ export const colors = {
|
|
|
62
67
|
[COLOR.SECONDARY_HIGHLIGHT]: '#ddcc70',
|
|
63
68
|
[COLOR.TEXT_ON_SECONDARY]: '#040401',
|
|
64
69
|
[COLOR.WHITE]: '#ffffff',
|
|
70
|
+
[COLOR.WARM_WHITE]: '#f8f4ec',
|
|
71
|
+
[COLOR.WARM_WHITE_DARK]: '#efe9d9',
|
|
65
72
|
[COLOR.BLACK]: '#000000',
|
|
66
73
|
[COLOR.DARK_GRAY]: '#333333',
|
|
67
74
|
[COLOR.GRAY]: '#767676',
|
|
@@ -71,12 +78,15 @@ export const colors = {
|
|
|
71
78
|
[COLOR.ND_GOLD]: '#ae9142',
|
|
72
79
|
[COLOR.ND_GOLD_LIGHT]: '#d39f10',
|
|
73
80
|
[COLOR.ND_GOLD_DARK]: '#8c7535',
|
|
81
|
+
[COLOR.ND_GREEN]: '#0a843d',
|
|
82
|
+
[COLOR.ND_GREEN_LIGHT]: '#b3dac5',
|
|
74
83
|
[COLOR.ND_BLUE]: '#0c2340',
|
|
75
84
|
[COLOR.ND_BLUE_DARK]: '#081629',
|
|
76
85
|
[COLOR.ND_BLUE_LIGHT]: '#143865',
|
|
77
86
|
[COLOR.ND_BLUE_BRIGHT]: '#1c4f8f',
|
|
78
87
|
[COLOR.ND_SKY_BLUE]: '#e1e8f2',
|
|
79
88
|
[COLOR.ND_SKY_BLUE_DARK]: '#c1cddd',
|
|
89
|
+
[COLOR.ND_SKY_BLUE_LIGHT]: '#edf2f9',
|
|
80
90
|
[COLOR.ND_METALLIC_GOLD]: '#ae9142',
|
|
81
91
|
[COLOR.ND_PROVOST_BLUE]: '#002a5d',
|
|
82
92
|
[COLOR.ND_SECONDARY_1]: '#5aabbc',
|
package/dist/theme/index.d.ts
CHANGED
|
@@ -28,6 +28,8 @@ export declare const theme: {
|
|
|
28
28
|
textOnSecondary: string;
|
|
29
29
|
secondaryHighlight: string;
|
|
30
30
|
white: string;
|
|
31
|
+
warmWhite: string;
|
|
32
|
+
warmWhiteDark: string;
|
|
31
33
|
black: string;
|
|
32
34
|
darkGray: string;
|
|
33
35
|
gray: string;
|
|
@@ -42,8 +44,11 @@ export declare const theme: {
|
|
|
42
44
|
ndGold: string;
|
|
43
45
|
ndGoldLight: string;
|
|
44
46
|
ndGoldDark: string;
|
|
47
|
+
ndGreem: string;
|
|
48
|
+
ndGreemLight: string;
|
|
45
49
|
ndSkyBlue: string;
|
|
46
50
|
ndSkyBlueDark: string;
|
|
51
|
+
ndSkyBlueLight: string;
|
|
47
52
|
ndMetallicGold: string;
|
|
48
53
|
ndProvostBlue: string;
|
|
49
54
|
ndSecondary1: string;
|
|
@@ -127,6 +132,8 @@ export declare const useTheme: () => {
|
|
|
127
132
|
textOnSecondary: string;
|
|
128
133
|
secondaryHighlight: string;
|
|
129
134
|
white: string;
|
|
135
|
+
warmWhite: string;
|
|
136
|
+
warmWhiteDark: string;
|
|
130
137
|
black: string;
|
|
131
138
|
darkGray: string;
|
|
132
139
|
gray: string;
|
|
@@ -141,8 +148,11 @@ export declare const useTheme: () => {
|
|
|
141
148
|
ndGold: string;
|
|
142
149
|
ndGoldLight: string;
|
|
143
150
|
ndGoldDark: string;
|
|
151
|
+
ndGreem: string;
|
|
152
|
+
ndGreemLight: string;
|
|
144
153
|
ndSkyBlue: string;
|
|
145
154
|
ndSkyBlueDark: string;
|
|
155
|
+
ndSkyBlueLight: string;
|
|
146
156
|
ndMetallicGold: string;
|
|
147
157
|
ndProvostBlue: string;
|
|
148
158
|
ndSecondary1: string;
|