@drivy/cobalt 0.26.2 → 0.26.3

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.
@@ -65,8 +65,10 @@ const red = {
65
65
  "900": "#3F2424"
66
66
  };
67
67
  const turquoise = {
68
+ "50": "#ECF9FB",
68
69
  "500": "#5ECBDD",
69
- "700": "#53B3C2"
70
+ "700": "#4CBED4",
71
+ "900": "#31ACC7"
70
72
  };
71
73
  const white = "#fff";
72
74
  const yellow = {
@@ -1 +1 @@
1
- {"version":3,"file":"palette.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"palette.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -33,6 +33,7 @@ const background = {
33
33
  DEFAULT: "turquoise/turquoise.500/turquoise.500",
34
34
  hover: "turquoise/turquoise.700/turquoise.500"
35
35
  },
36
+ connectAlt: "grey.light/turquoise.50/turquoise.900",
36
37
  driver: "deprecatedDriver/yellow.500/yellow.500",
37
38
  owner: "indigo.dark/navy.700/navy.700",
38
39
  disabled: "grey.light/navy.100/black.50",
@@ -189,6 +190,7 @@ const icon = {
189
190
  success: "green/green.700/green.700",
190
191
  successAlt: "white/green.900/green.100",
191
192
  connect: "turquoise/turquoise.500/white",
193
+ connectAlt: "turquoise/turquoise.900/turquoise.50",
192
194
  driver: "graphite/navy.700//navy.700",
193
195
  owner: "white/white/white",
194
196
  warning: "coral/orange.500/orange.300",
@@ -1 +1 @@
1
- {"version":3,"file":"theme.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"theme.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@drivy/cobalt",
3
- "version": "0.26.2",
3
+ "version": "0.26.3",
4
4
  "description": "Opinionated design system for Drivy's projects.",
5
5
  "main": "src/index.js",
6
6
  "types": "types/index.d.ts",
@@ -78,6 +78,10 @@
78
78
  fill: var(--c-icon-connect);
79
79
  }
80
80
 
81
+ .cobalt-Icon--colorConnectAlt {
82
+ fill: var(--c-icon-connectAlt);
83
+ }
84
+
81
85
  .cobalt-Icon--colorDriver {
82
86
  fill: var(--c-icon-driver);
83
87
  }
@@ -34,6 +34,7 @@ $theme-colors-map: (
34
34
  DEFAULT: var(--c-l-turquoise),
35
35
  hover: var(--c-l-turquoise)
36
36
  ),
37
+ connectAlt: var(--c-l-grey-light),
37
38
  driver: var(--c-l-deprecatedDriver),
38
39
  owner: var(--c-l-indigo-dark),
39
40
  disabled: var(--c-l-grey-light),
@@ -190,6 +191,7 @@ $theme-colors-map: (
190
191
  success: var(--c-l-green),
191
192
  successAlt: var(--c-l-white),
192
193
  connect: var(--c-l-turquoise),
194
+ connectAlt: var(--c-l-turquoise),
193
195
  driver: var(--c-l-graphite),
194
196
  owner: var(--c-l-white),
195
197
  warning: var(--c-l-coral),
@@ -47,8 +47,10 @@
47
47
  --c-red-500: #c71414;
48
48
  --c-red-700: #af1212;
49
49
  --c-red-900: #3f2424;
50
+ --c-turquoise-50: #ecf9fb;
50
51
  --c-turquoise-500: #5ecbdd;
51
- --c-turquoise-700: #53b3c2;
52
+ --c-turquoise-700: #4cbed4;
53
+ --c-turquoise-900: #31acc7;
52
54
  --c-white: #fff;
53
55
  --c-yellow-100: #ffeed1;
54
56
  --c-yellow-300: #ffdda3;
@@ -23,6 +23,7 @@
23
23
  --c-background-connect: var(--c-l-turquoise);
24
24
  --c-background-connectInteractive: var(--c-l-turquoise);
25
25
  --c-background-connectInteractive--hover: var(--c-l-turquoise);
26
+ --c-background-connectAlt: var(--c-l-grey-light);
26
27
  --c-background-driver: var(--c-l-deprecatedDriver);
27
28
  --c-background-owner: var(--c-l-indigo-dark);
28
29
  --c-background-disabled: var(--c-l-grey-light);
@@ -123,6 +124,7 @@
123
124
  --c-icon-success: var(--c-l-green);
124
125
  --c-icon-successAlt: var(--c-l-white);
125
126
  --c-icon-connect: var(--c-l-turquoise);
127
+ --c-icon-connectAlt: var(--c-l-turquoise);
126
128
  --c-icon-driver: var(--c-l-graphite);
127
129
  --c-icon-owner: var(--c-l-white);
128
130
  --c-icon-warning: var(--c-l-coral);
package/tokens/palette.js CHANGED
@@ -61,8 +61,10 @@ const red = {
61
61
  "900": "#3F2424"
62
62
  };
63
63
  const turquoise = {
64
+ "50": "#ECF9FB",
64
65
  "500": "#5ECBDD",
65
- "700": "#53B3C2"
66
+ "700": "#4CBED4",
67
+ "900": "#31ACC7"
66
68
  };
67
69
  const white = "#fff";
68
70
  const yellow = {
@@ -1 +1 @@
1
- {"version":3,"file":"palette.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"palette.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/tokens/theme.js CHANGED
@@ -29,6 +29,7 @@ const background = {
29
29
  DEFAULT: "turquoise/turquoise.500/turquoise.500",
30
30
  hover: "turquoise/turquoise.700/turquoise.500"
31
31
  },
32
+ connectAlt: "grey.light/turquoise.50/turquoise.900",
32
33
  driver: "deprecatedDriver/yellow.500/yellow.500",
33
34
  owner: "indigo.dark/navy.700/navy.700",
34
35
  disabled: "grey.light/navy.100/black.50",
@@ -185,6 +186,7 @@ const icon = {
185
186
  success: "green/green.700/green.700",
186
187
  successAlt: "white/green.900/green.100",
187
188
  connect: "turquoise/turquoise.500/white",
189
+ connectAlt: "turquoise/turquoise.900/turquoise.50",
188
190
  driver: "graphite/navy.700//navy.700",
189
191
  owner: "white/white/white",
190
192
  warning: "coral/orange.500/orange.300",
@@ -1 +1 @@
1
- {"version":3,"file":"theme.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"theme.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -5,7 +5,7 @@ interface IconsMap {
5
5
  }
6
6
  export declare const BUNDLED_ICONS: IconsMap;
7
7
  export type IconSources = keyof typeof iconTokens.icons;
8
- export declare const iconColors: ("info" | "amber" | "blue" | "coral" | "graphite" | "graphiteLight" | "green" | "greenDark" | "greenLight" | "grey" | "greyDark" | "greyLight" | "greyLighter" | "indigo" | "indigoDark" | "purple" | "purpleLight" | "red" | "turquoise" | "white" | "base" | "baseInteractive" | "subdued" | "subduedInteractive" | "accent" | "accentInteractive" | "accentAlt" | "accentAltInteractive" | "error" | "errorAlt" | "success" | "successAlt" | "connect" | "driver" | "owner" | "warning" | "infoAlt" | "inversed" | "disabled")[];
8
+ export declare const iconColors: ("info" | "amber" | "blue" | "coral" | "graphite" | "graphiteLight" | "green" | "greenDark" | "greenLight" | "grey" | "greyDark" | "greyLight" | "greyLighter" | "indigo" | "indigoDark" | "purple" | "purpleLight" | "red" | "turquoise" | "white" | "base" | "baseInteractive" | "subdued" | "subduedInteractive" | "accent" | "accentInteractive" | "accentAlt" | "accentAltInteractive" | "error" | "errorAlt" | "success" | "successAlt" | "connect" | "connectAlt" | "driver" | "owner" | "warning" | "infoAlt" | "inversed" | "disabled")[];
9
9
  export type IconColorsType = typeof iconColors[number];
10
10
  export interface IconProps {
11
11
  source: IconSources;
@@ -423,8 +423,10 @@ export declare const palette: {
423
423
  "900": string;
424
424
  };
425
425
  turquoise: {
426
+ "50": string;
426
427
  "500": string;
427
428
  "700": string;
429
+ "900": string;
428
430
  };
429
431
  white: string;
430
432
  yellow: {
@@ -468,6 +470,7 @@ export declare const theme: {
468
470
  DEFAULT: string;
469
471
  hover: string;
470
472
  };
473
+ connectAlt: string;
471
474
  driver: string;
472
475
  owner: string;
473
476
  disabled: string;
@@ -624,6 +627,7 @@ export declare const theme: {
624
627
  success: string;
625
628
  successAlt: string;
626
629
  connect: string;
630
+ connectAlt: string;
627
631
  driver: string;
628
632
  owner: string;
629
633
  warning: string;
package/utilities.css CHANGED
@@ -3890,6 +3890,10 @@
3890
3890
  background-color: #5ecbdd
3891
3891
  }
3892
3892
 
3893
+ .c-bg-connectAlt {
3894
+ background-color: #edebed
3895
+ }
3896
+
3893
3897
  .c-bg-driver {
3894
3898
  background-color: #ffd988
3895
3899
  }