@esri/calcite-design-tokens 4.0.0-next.16 → 4.0.0-next.18

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 (27) hide show
  1. package/dist/css/core.css +1 -0
  2. package/dist/css/dark.css +22 -22
  3. package/dist/css/global.css +1 -1
  4. package/dist/css/index.css +110 -110
  5. package/dist/css/light.css +22 -22
  6. package/dist/css/semantic.css +1 -1
  7. package/dist/docs/core.json +27 -1
  8. package/dist/docs/dark.json +427 -433
  9. package/dist/docs/global.json +458 -464
  10. package/dist/docs/light.json +427 -433
  11. package/dist/docs/semantic.json +2 -2
  12. package/dist/es6/core.d.ts +1 -0
  13. package/dist/es6/core.js +1 -0
  14. package/dist/es6/dark.d.ts +22 -22
  15. package/dist/es6/dark.js +22 -22
  16. package/dist/es6/global.d.ts +28 -28
  17. package/dist/es6/global.js +45 -45
  18. package/dist/es6/light.d.ts +22 -22
  19. package/dist/es6/light.js +22 -22
  20. package/dist/es6/semantic.js +1 -1
  21. package/dist/scss/core.scss +1 -0
  22. package/dist/scss/dark.scss +22 -22
  23. package/dist/scss/global.scss +1 -1
  24. package/dist/scss/index.scss +44 -44
  25. package/dist/scss/light.scss +22 -22
  26. package/dist/scss/semantic.scss +1 -1
  27. package/package.json +2 -2
package/dist/docs/semantic.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": 1767982687524,
2
+ "timestamp": 1769461873966,
3
3
  "tokens": [
4
4
  {
5
5
  "key": "{semantic.border.width.none}",
@@ -403,7 +403,7 @@
403
403
  },
404
404
  {
405
405
  "key": "{semantic.corner-radius.pill}",
406
- "value": "100%",
406
+ "value": "9999px",
407
407
  "type": "dimension",
408
408
  "attributes": {
409
409
  "category": "corner-radius",
package/dist/es6/core.d.ts CHANGED
@@ -610,6 +610,7 @@ export const calciteSize192: string;
610
610
  export const calciteSize224: string;
611
611
  export const calciteSize256: string;
612
612
  export const calciteSize288: string;
613
+ export const calciteSize9999: string;
613
614
  export const calciteSizeNone: string;
614
615
  export const calciteSizeRelative50: string;
615
616
  export const calciteSizeRelative100: string;
package/dist/es6/core.js CHANGED
@@ -590,6 +590,7 @@ export const calciteSize192 = "192px";
590
590
  export const calciteSize224 = "224px";
591
591
  export const calciteSize256 = "256px";
592
592
  export const calciteSize288 = "288px";
593
+ export const calciteSize9999 = "9999px";
593
594
  export const calciteSizeNone = "0";
594
595
  export const calciteSizeRelative50 = "50%";
595
596
  export const calciteSizeRelative100 = "100%";
package/dist/es6/dark.d.ts CHANGED
@@ -19,17 +19,25 @@ export const calciteColorForeground2: string;
19
19
  export const calciteColorForeground3: string;
20
20
  /** deprecated, use --calcite-color-surface-highlight instead */
21
21
  export const calciteColorForegroundCurrent: string;
22
- export const calciteColorTransparent: string;
23
- export const calciteColorTransparentHover: string;
24
- export const calciteColorTransparentPress: string;
25
- export const calciteColorTransparentInverseHover: string;
26
- export const calciteColorTransparentInversePress: string;
27
- export const calciteColorTransparentScrim: string;
28
- export const calciteColorTransparentTint: string;
22
+ export const calciteColorText1: string;
23
+ export const calciteColorText2: string;
24
+ export const calciteColorText3: string;
25
+ export const calciteColorTextInverse: string;
26
+ export const calciteColorTextLink: string;
27
+ export const calciteColorTextHighlight: string;
28
+ export const calciteColorBorder1: string;
29
+ export const calciteColorBorder2: string;
30
+ export const calciteColorBorder3: string;
31
+ export const calciteColorBorderInput: string;
32
+ export const calciteColorBorderGhost: string;
33
+ export const calciteColorBorderWhite: string;
29
34
  export const calciteColorBrand: string;
30
35
  export const calciteColorBrandHover: string;
31
36
  export const calciteColorBrandPress: string;
32
37
  export const calciteColorBrandUnderline: string;
38
+ export const calciteColorInverse: string;
39
+ export const calciteColorInverseHover: string;
40
+ export const calciteColorInversePress: string;
33
41
  export const calciteColorStatusInfo: string;
34
42
  export const calciteColorStatusInfoHover: string;
35
43
  export const calciteColorStatusInfoPress: string;
@@ -42,19 +50,11 @@ export const calciteColorStatusWarningPress: string;
42
50
  export const calciteColorStatusDanger: string;
43
51
  export const calciteColorStatusDangerHover: string;
44
52
  export const calciteColorStatusDangerPress: string;
45
- export const calciteColorInverse: string;
46
- export const calciteColorInverseHover: string;
47
- export const calciteColorInversePress: string;
48
- export const calciteColorText1: string;
49
- export const calciteColorText2: string;
50
- export const calciteColorText3: string;
51
- export const calciteColorTextHighlight: string;
52
- export const calciteColorTextInverse: string;
53
- export const calciteColorTextLink: string;
54
- export const calciteColorBorder1: string;
55
- export const calciteColorBorder2: string;
56
- export const calciteColorBorder3: string;
57
- export const calciteColorBorderInput: string;
58
- export const calciteColorBorderGhost: string;
59
- export const calciteColorBorderWhite: string;
53
+ export const calciteColorTransparent: string;
54
+ export const calciteColorTransparentHover: string;
55
+ export const calciteColorTransparentPress: string;
56
+ export const calciteColorTransparentScrim: string;
57
+ export const calciteColorTransparentTint: string;
58
+ export const calciteColorTransparentInverseHover: string;
59
+ export const calciteColorTransparentInversePress: string;
60
60
  export const calciteColorFocus: string;
package/dist/es6/dark.js CHANGED
@@ -14,17 +14,25 @@ export const calciteColorForeground1 = "#2b2b2b"; // Deprecated, use `--calcite-
14
14
  export const calciteColorForeground2 = "#363636"; // Deprecated, use `--calcite-color-surface-3` instead
15
15
  export const calciteColorForeground3 = "#404040"; // Deprecated, use `--calcite-color-surface-4` instead
16
16
  export const calciteColorForegroundCurrent = "#2b465f"; // deprecated, use --calcite-color-surface-highlight instead
17
- export const calciteColorTransparent = "rgba(255, 255, 255, 0)";
18
- export const calciteColorTransparentHover = "rgba(255, 255, 255, 0.12)";
19
- export const calciteColorTransparentPress = "rgba(255, 255, 255, 0.16)";
20
- export const calciteColorTransparentInverseHover = "rgba(0, 0, 0, 0.04)";
21
- export const calciteColorTransparentInversePress = "rgba(0, 0, 0, 0.08)";
22
- export const calciteColorTransparentScrim = "rgba(0, 0, 0, 0.85)";
23
- export const calciteColorTransparentTint = "rgba(43, 43, 43, 0.8)";
17
+ export const calciteColorText1 = "#ffffff";
18
+ export const calciteColorText2 = "#bfbfbf";
19
+ export const calciteColorText3 = "#9e9e9e";
20
+ export const calciteColorTextInverse = "#141414";
21
+ export const calciteColorTextLink = "#00a0ff";
22
+ export const calciteColorTextHighlight = "#d6efff";
23
+ export const calciteColorBorder1 = "#545454";
24
+ export const calciteColorBorder2 = "#4a4a4a";
25
+ export const calciteColorBorder3 = "#404040";
26
+ export const calciteColorBorderInput = "#757575";
27
+ export const calciteColorBorderGhost = "rgba(117, 117, 117, 0.3)";
28
+ export const calciteColorBorderWhite = "#f7f7f7";
24
29
  export const calciteColorBrand = "#009af2";
25
30
  export const calciteColorBrandHover = "#007ac2";
26
31
  export const calciteColorBrandPress = "#00619b";
27
32
  export const calciteColorBrandUnderline = "rgba(0, 160, 255, 0.4)";
33
+ export const calciteColorInverse = "#f7f7f7";
34
+ export const calciteColorInverseHover = "#f2f2f2";
35
+ export const calciteColorInversePress = "#ebebeb";
28
36
  export const calciteColorStatusInfo = "#00a0ff";
29
37
  export const calciteColorStatusInfoHover = "#3db8ff";
30
38
  export const calciteColorStatusInfoPress = "#009af2";
@@ -37,19 +45,11 @@ export const calciteColorStatusWarningPress = "#ff9500";
37
45
  export const calciteColorStatusDanger = "#fe583e";
38
46
  export const calciteColorStatusDangerHover = "#ff0015";
39
47
  export const calciteColorStatusDangerPress = "#d90012";
40
- export const calciteColorInverse = "#f7f7f7";
41
- export const calciteColorInverseHover = "#f2f2f2";
42
- export const calciteColorInversePress = "#ebebeb";
43
- export const calciteColorText1 = "#ffffff";
44
- export const calciteColorText2 = "#bfbfbf";
45
- export const calciteColorText3 = "#9e9e9e";
46
- export const calciteColorTextHighlight = "#d6efff";
47
- export const calciteColorTextInverse = "#141414";
48
- export const calciteColorTextLink = "#00a0ff";
49
- export const calciteColorBorder1 = "#545454";
50
- export const calciteColorBorder2 = "#4a4a4a";
51
- export const calciteColorBorder3 = "#404040";
52
- export const calciteColorBorderInput = "#757575";
53
- export const calciteColorBorderGhost = "rgba(117, 117, 117, 0.3)";
54
- export const calciteColorBorderWhite = "#f7f7f7";
48
+ export const calciteColorTransparent = "rgba(255, 255, 255, 0)";
49
+ export const calciteColorTransparentHover = "rgba(255, 255, 255, 0.12)";
50
+ export const calciteColorTransparentPress = "rgba(255, 255, 255, 0.16)";
51
+ export const calciteColorTransparentScrim = "rgba(0, 0, 0, 0.85)";
52
+ export const calciteColorTransparentTint = "rgba(43, 43, 43, 0.8)";
53
+ export const calciteColorTransparentInverseHover = "rgba(0, 0, 0, 0.04)";
54
+ export const calciteColorTransparentInversePress = "rgba(0, 0, 0, 0.08)";
55
55
  export const calciteColorFocus = "#009af2";
package/dist/es6/global.d.ts CHANGED
@@ -20,23 +20,25 @@ export const calciteColorForeground2: { light: string; dark: string };
20
20
  export const calciteColorForeground3: { light: string; dark: string };
21
21
  /** deprecated, use --calcite-color-surface-highlight instead */
22
22
  export const calciteColorForegroundCurrent: { light: string; dark: string };
23
- export const calciteColorTransparent: { light: string; dark: string };
24
- export const calciteColorTransparentHover: { light: string; dark: string };
25
- export const calciteColorTransparentPress: { light: string; dark: string };
26
- export const calciteColorTransparentInverseHover: {
27
- light: string;
28
- dark: string;
29
- };
30
- export const calciteColorTransparentInversePress: {
31
- light: string;
32
- dark: string;
33
- };
34
- export const calciteColorTransparentScrim: { light: string; dark: string };
35
- export const calciteColorTransparentTint: { light: string; dark: string };
23
+ export const calciteColorText1: { light: string; dark: string };
24
+ export const calciteColorText2: { light: string; dark: string };
25
+ export const calciteColorText3: { light: string; dark: string };
26
+ export const calciteColorTextInverse: { light: string; dark: string };
27
+ export const calciteColorTextLink: { light: string; dark: string };
28
+ export const calciteColorTextHighlight: { light: string; dark: string };
29
+ export const calciteColorBorder1: { light: string; dark: string };
30
+ export const calciteColorBorder2: { light: string; dark: string };
31
+ export const calciteColorBorder3: { light: string; dark: string };
32
+ export const calciteColorBorderInput: { light: string; dark: string };
33
+ export const calciteColorBorderGhost: { light: string; dark: string };
34
+ export const calciteColorBorderWhite: { light: string; dark: string };
36
35
  export const calciteColorBrand: { light: string; dark: string };
37
36
  export const calciteColorBrandHover: { light: string; dark: string };
38
37
  export const calciteColorBrandPress: { light: string; dark: string };
39
38
  export const calciteColorBrandUnderline: { light: string; dark: string };
39
+ export const calciteColorInverse: { light: string; dark: string };
40
+ export const calciteColorInverseHover: { light: string; dark: string };
41
+ export const calciteColorInversePress: { light: string; dark: string };
40
42
  export const calciteColorStatusInfo: { light: string; dark: string };
41
43
  export const calciteColorStatusInfoHover: { light: string; dark: string };
42
44
  export const calciteColorStatusInfoPress: { light: string; dark: string };
@@ -49,21 +51,19 @@ export const calciteColorStatusWarningPress: { light: string; dark: string };
49
51
  export const calciteColorStatusDanger: { light: string; dark: string };
50
52
  export const calciteColorStatusDangerHover: { light: string; dark: string };
51
53
  export const calciteColorStatusDangerPress: { light: string; dark: string };
52
- export const calciteColorInverse: { light: string; dark: string };
53
- export const calciteColorInverseHover: { light: string; dark: string };
54
- export const calciteColorInversePress: { light: string; dark: string };
55
- export const calciteColorText1: { light: string; dark: string };
56
- export const calciteColorText2: { light: string; dark: string };
57
- export const calciteColorText3: { light: string; dark: string };
58
- export const calciteColorTextHighlight: { light: string; dark: string };
59
- export const calciteColorTextInverse: { light: string; dark: string };
60
- export const calciteColorTextLink: { light: string; dark: string };
61
- export const calciteColorBorder1: { light: string; dark: string };
62
- export const calciteColorBorder2: { light: string; dark: string };
63
- export const calciteColorBorder3: { light: string; dark: string };
64
- export const calciteColorBorderInput: { light: string; dark: string };
65
- export const calciteColorBorderGhost: { light: string; dark: string };
66
- export const calciteColorBorderWhite: { light: string; dark: string };
54
+ export const calciteColorTransparent: { light: string; dark: string };
55
+ export const calciteColorTransparentHover: { light: string; dark: string };
56
+ export const calciteColorTransparentPress: { light: string; dark: string };
57
+ export const calciteColorTransparentScrim: { light: string; dark: string };
58
+ export const calciteColorTransparentTint: { light: string; dark: string };
59
+ export const calciteColorTransparentInverseHover: {
60
+ light: string;
61
+ dark: string;
62
+ };
63
+ export const calciteColorTransparentInversePress: {
64
+ light: string;
65
+ dark: string;
66
+ };
67
67
  export const calciteColorFocus: { light: string; dark: string };
68
68
  export const calciteBorderWidthNone: string;
69
69
  export const calciteBorderWidthSm: string;
package/dist/es6/global.js CHANGED
@@ -21,34 +21,21 @@ export const calciteColorForegroundCurrent = {
21
21
  light: "#d6efff",
22
22
  dark: "#2b465f",
23
23
  }; // deprecated, use --calcite-color-surface-highlight instead
24
- export const calciteColorTransparent = {
25
- light: "rgba(0, 0, 0, 0)",
26
- dark: "rgba(255, 255, 255, 0)",
27
- };
28
- export const calciteColorTransparentHover = {
29
- light: "rgba(0, 0, 0, 0.04)",
30
- dark: "rgba(255, 255, 255, 0.12)",
31
- };
32
- export const calciteColorTransparentPress = {
33
- light: "rgba(0, 0, 0, 0.08)",
34
- dark: "rgba(255, 255, 255, 0.16)",
35
- };
36
- export const calciteColorTransparentInverseHover = {
37
- light: "rgba(255, 255, 255, 0.12)",
38
- dark: "rgba(0, 0, 0, 0.04)",
39
- };
40
- export const calciteColorTransparentInversePress = {
41
- light: "rgba(255, 255, 255, 0.16)",
42
- dark: "rgba(0, 0, 0, 0.08)",
43
- };
44
- export const calciteColorTransparentScrim = {
45
- light: "rgba(255, 255, 255, 0.85)",
46
- dark: "rgba(0, 0, 0, 0.85)",
47
- };
48
- export const calciteColorTransparentTint = {
49
- light: "rgba(255, 255, 255, 0.8)",
50
- dark: "rgba(43, 43, 43, 0.8)",
24
+ export const calciteColorText1 = { light: "#141414", dark: "#ffffff" };
25
+ export const calciteColorText2 = { light: "#4a4a4a", dark: "#bfbfbf" };
26
+ export const calciteColorText3 = { light: "#6b6b6b", dark: "#9e9e9e" };
27
+ export const calciteColorTextInverse = { light: "#ffffff", dark: "#141414" };
28
+ export const calciteColorTextLink = { light: "#00619b", dark: "#00a0ff" };
29
+ export const calciteColorTextHighlight = { light: "#004874", dark: "#d6efff" };
30
+ export const calciteColorBorder1 = { light: "#d4d4d4", dark: "#545454" };
31
+ export const calciteColorBorder2 = { light: "#dedede", dark: "#4a4a4a" };
32
+ export const calciteColorBorder3 = { light: "#ebebeb", dark: "#404040" };
33
+ export const calciteColorBorderInput = { light: "#949494", dark: "#757575" };
34
+ export const calciteColorBorderGhost = {
35
+ light: "rgba(0, 0, 0, 0.3)",
36
+ dark: "rgba(117, 117, 117, 0.3)",
51
37
  };
38
+ export const calciteColorBorderWhite = { light: "#ffffff", dark: "#f7f7f7" };
52
39
  export const calciteColorBrand = { light: "#007ac2", dark: "#009af2" };
53
40
  export const calciteColorBrandHover = { light: "#00619b", dark: "#007ac2" };
54
41
  export const calciteColorBrandPress = { light: "#004874", dark: "#00619b" };
@@ -56,6 +43,9 @@ export const calciteColorBrandUnderline = {
56
43
  light: "rgba(0, 97, 155, 0.4)",
57
44
  dark: "rgba(0, 160, 255, 0.4)",
58
45
  };
46
+ export const calciteColorInverse = { light: "#363636", dark: "#f7f7f7" };
47
+ export const calciteColorInverseHover = { light: "#2b2b2b", dark: "#f2f2f2" };
48
+ export const calciteColorInversePress = { light: "#212121", dark: "#ebebeb" };
59
49
  export const calciteColorStatusInfo = { light: "#00619b", dark: "#00a0ff" };
60
50
  export const calciteColorStatusInfoHover = {
61
51
  light: "#004874",
@@ -92,24 +82,34 @@ export const calciteColorStatusDangerPress = {
92
82
  light: "#7c1d13",
93
83
  dark: "#d90012",
94
84
  };
95
- export const calciteColorInverse = { light: "#363636", dark: "#f7f7f7" };
96
- export const calciteColorInverseHover = { light: "#2b2b2b", dark: "#f2f2f2" };
97
- export const calciteColorInversePress = { light: "#212121", dark: "#ebebeb" };
98
- export const calciteColorText1 = { light: "#141414", dark: "#ffffff" };
99
- export const calciteColorText2 = { light: "#4a4a4a", dark: "#bfbfbf" };
100
- export const calciteColorText3 = { light: "#6b6b6b", dark: "#9e9e9e" };
101
- export const calciteColorTextHighlight = { light: "#004874", dark: "#d6efff" };
102
- export const calciteColorTextInverse = { light: "#ffffff", dark: "#141414" };
103
- export const calciteColorTextLink = { light: "#00619b", dark: "#00a0ff" };
104
- export const calciteColorBorder1 = { light: "#d4d4d4", dark: "#545454" };
105
- export const calciteColorBorder2 = { light: "#dedede", dark: "#4a4a4a" };
106
- export const calciteColorBorder3 = { light: "#ebebeb", dark: "#404040" };
107
- export const calciteColorBorderInput = { light: "#949494", dark: "#757575" };
108
- export const calciteColorBorderGhost = {
109
- light: "rgba(0, 0, 0, 0.3)",
110
- dark: "rgba(117, 117, 117, 0.3)",
85
+ export const calciteColorTransparent = {
86
+ light: "rgba(0, 0, 0, 0)",
87
+ dark: "rgba(255, 255, 255, 0)",
88
+ };
89
+ export const calciteColorTransparentHover = {
90
+ light: "rgba(0, 0, 0, 0.04)",
91
+ dark: "rgba(255, 255, 255, 0.12)",
92
+ };
93
+ export const calciteColorTransparentPress = {
94
+ light: "rgba(0, 0, 0, 0.08)",
95
+ dark: "rgba(255, 255, 255, 0.16)",
96
+ };
97
+ export const calciteColorTransparentScrim = {
98
+ light: "rgba(255, 255, 255, 0.85)",
99
+ dark: "rgba(0, 0, 0, 0.85)",
100
+ };
101
+ export const calciteColorTransparentTint = {
102
+ light: "rgba(255, 255, 255, 0.8)",
103
+ dark: "rgba(43, 43, 43, 0.8)",
104
+ };
105
+ export const calciteColorTransparentInverseHover = {
106
+ light: "rgba(255, 255, 255, 0.12)",
107
+ dark: "rgba(0, 0, 0, 0.04)",
108
+ };
109
+ export const calciteColorTransparentInversePress = {
110
+ light: "rgba(255, 255, 255, 0.16)",
111
+ dark: "rgba(0, 0, 0, 0.08)",
111
112
  };
112
- export const calciteColorBorderWhite = { light: "#ffffff", dark: "#f7f7f7" };
113
113
  export const calciteColorFocus = { light: "#007ac2", dark: "#009af2" };
114
114
  export const calciteBorderWidthNone = "0";
115
115
  export const calciteBorderWidthSm = "1px";
@@ -139,7 +139,7 @@ export const calciteCornerRadiusNone = "0";
139
139
  export const calciteCornerRadiusXs = "2px";
140
140
  export const calciteCornerRadiusSm = "4px";
141
141
  export const calciteCornerRadiusRound = "4px"; // deprecated, use --calcite-corner-radius-sm instead
142
- export const calciteCornerRadiusPill = "100%";
142
+ export const calciteCornerRadiusPill = "9999px";
143
143
  export const calciteFontFamily = [
144
144
  "Avenir Next",
145
145
  "Avenir",
package/dist/es6/light.d.ts CHANGED
@@ -19,17 +19,25 @@ export const calciteColorForeground2: string;
19
19
  export const calciteColorForeground3: string;
20
20
  /** deprecated, use --calcite-color-surface-highlight instead */
21
21
  export const calciteColorForegroundCurrent: string;
22
- export const calciteColorTransparent: string;
23
- export const calciteColorTransparentHover: string;
24
- export const calciteColorTransparentPress: string;
25
- export const calciteColorTransparentInverseHover: string;
26
- export const calciteColorTransparentInversePress: string;
27
- export const calciteColorTransparentScrim: string;
28
- export const calciteColorTransparentTint: string;
22
+ export const calciteColorText1: string;
23
+ export const calciteColorText2: string;
24
+ export const calciteColorText3: string;
25
+ export const calciteColorTextInverse: string;
26
+ export const calciteColorTextLink: string;
27
+ export const calciteColorTextHighlight: string;
28
+ export const calciteColorBorder1: string;
29
+ export const calciteColorBorder2: string;
30
+ export const calciteColorBorder3: string;
31
+ export const calciteColorBorderInput: string;
32
+ export const calciteColorBorderGhost: string;
33
+ export const calciteColorBorderWhite: string;
29
34
  export const calciteColorBrand: string;
30
35
  export const calciteColorBrandHover: string;
31
36
  export const calciteColorBrandPress: string;
32
37
  export const calciteColorBrandUnderline: string;
38
+ export const calciteColorInverse: string;
39
+ export const calciteColorInverseHover: string;
40
+ export const calciteColorInversePress: string;
33
41
  export const calciteColorStatusInfo: string;
34
42
  export const calciteColorStatusInfoHover: string;
35
43
  export const calciteColorStatusInfoPress: string;
@@ -42,19 +50,11 @@ export const calciteColorStatusWarningPress: string;
42
50
  export const calciteColorStatusDanger: string;
43
51
  export const calciteColorStatusDangerHover: string;
44
52
  export const calciteColorStatusDangerPress: string;
45
- export const calciteColorInverse: string;
46
- export const calciteColorInverseHover: string;
47
- export const calciteColorInversePress: string;
48
- export const calciteColorText1: string;
49
- export const calciteColorText2: string;
50
- export const calciteColorText3: string;
51
- export const calciteColorTextHighlight: string;
52
- export const calciteColorTextInverse: string;
53
- export const calciteColorTextLink: string;
54
- export const calciteColorBorder1: string;
55
- export const calciteColorBorder2: string;
56
- export const calciteColorBorder3: string;
57
- export const calciteColorBorderInput: string;
58
- export const calciteColorBorderGhost: string;
59
- export const calciteColorBorderWhite: string;
53
+ export const calciteColorTransparent: string;
54
+ export const calciteColorTransparentHover: string;
55
+ export const calciteColorTransparentPress: string;
56
+ export const calciteColorTransparentScrim: string;
57
+ export const calciteColorTransparentTint: string;
58
+ export const calciteColorTransparentInverseHover: string;
59
+ export const calciteColorTransparentInversePress: string;
60
60
  export const calciteColorFocus: string;
package/dist/es6/light.js CHANGED
@@ -14,17 +14,25 @@ export const calciteColorForeground1 = "#ffffff"; // Deprecated, use `--calcite-
14
14
  export const calciteColorForeground2 = "#f2f2f2"; // Deprecated, use `--calcite-color-surface-3` instead
15
15
  export const calciteColorForeground3 = "#ebebeb"; // Deprecated, use `--calcite-color-surface-4` instead
16
16
  export const calciteColorForegroundCurrent = "#d6efff"; // deprecated, use --calcite-color-surface-highlight instead
17
- export const calciteColorTransparent = "rgba(0, 0, 0, 0)";
18
- export const calciteColorTransparentHover = "rgba(0, 0, 0, 0.04)";
19
- export const calciteColorTransparentPress = "rgba(0, 0, 0, 0.08)";
20
- export const calciteColorTransparentInverseHover = "rgba(255, 255, 255, 0.12)";
21
- export const calciteColorTransparentInversePress = "rgba(255, 255, 255, 0.16)";
22
- export const calciteColorTransparentScrim = "rgba(255, 255, 255, 0.85)";
23
- export const calciteColorTransparentTint = "rgba(255, 255, 255, 0.8)";
17
+ export const calciteColorText1 = "#141414";
18
+ export const calciteColorText2 = "#4a4a4a";
19
+ export const calciteColorText3 = "#6b6b6b";
20
+ export const calciteColorTextInverse = "#ffffff";
21
+ export const calciteColorTextLink = "#00619b";
22
+ export const calciteColorTextHighlight = "#004874";
23
+ export const calciteColorBorder1 = "#d4d4d4";
24
+ export const calciteColorBorder2 = "#dedede";
25
+ export const calciteColorBorder3 = "#ebebeb";
26
+ export const calciteColorBorderInput = "#949494";
27
+ export const calciteColorBorderGhost = "rgba(0, 0, 0, 0.3)";
28
+ export const calciteColorBorderWhite = "#ffffff";
24
29
  export const calciteColorBrand = "#007ac2";
25
30
  export const calciteColorBrandHover = "#00619b";
26
31
  export const calciteColorBrandPress = "#004874";
27
32
  export const calciteColorBrandUnderline = "rgba(0, 97, 155, 0.4)";
33
+ export const calciteColorInverse = "#363636";
34
+ export const calciteColorInverseHover = "#2b2b2b";
35
+ export const calciteColorInversePress = "#212121";
28
36
  export const calciteColorStatusInfo = "#00619b";
29
37
  export const calciteColorStatusInfoHover = "#004874";
30
38
  export const calciteColorStatusInfoPress = "#00304d";
@@ -37,19 +45,11 @@ export const calciteColorStatusWarningPress = "#9a5b10";
37
45
  export const calciteColorStatusDanger = "#d83020";
38
46
  export const calciteColorStatusDangerHover = "#a82b1e";
39
47
  export const calciteColorStatusDangerPress = "#7c1d13";
40
- export const calciteColorInverse = "#363636";
41
- export const calciteColorInverseHover = "#2b2b2b";
42
- export const calciteColorInversePress = "#212121";
43
- export const calciteColorText1 = "#141414";
44
- export const calciteColorText2 = "#4a4a4a";
45
- export const calciteColorText3 = "#6b6b6b";
46
- export const calciteColorTextHighlight = "#004874";
47
- export const calciteColorTextInverse = "#ffffff";
48
- export const calciteColorTextLink = "#00619b";
49
- export const calciteColorBorder1 = "#d4d4d4";
50
- export const calciteColorBorder2 = "#dedede";
51
- export const calciteColorBorder3 = "#ebebeb";
52
- export const calciteColorBorderInput = "#949494";
53
- export const calciteColorBorderGhost = "rgba(0, 0, 0, 0.3)";
54
- export const calciteColorBorderWhite = "#ffffff";
48
+ export const calciteColorTransparent = "rgba(0, 0, 0, 0)";
49
+ export const calciteColorTransparentHover = "rgba(0, 0, 0, 0.04)";
50
+ export const calciteColorTransparentPress = "rgba(0, 0, 0, 0.08)";
51
+ export const calciteColorTransparentScrim = "rgba(255, 255, 255, 0.85)";
52
+ export const calciteColorTransparentTint = "rgba(255, 255, 255, 0.8)";
53
+ export const calciteColorTransparentInverseHover = "rgba(255, 255, 255, 0.12)";
54
+ export const calciteColorTransparentInversePress = "rgba(255, 255, 255, 0.16)";
55
55
  export const calciteColorFocus = "#007ac2";
package/dist/es6/semantic.js CHANGED
@@ -17,7 +17,7 @@ export const calciteCornerRadiusNone = "0";
17
17
  export const calciteCornerRadiusXs = "2px";
18
18
  export const calciteCornerRadiusSm = "4px";
19
19
  export const calciteCornerRadiusRound = "4px"; // deprecated, use --calcite-corner-radius-sm instead
20
- export const calciteCornerRadiusPill = "100%";
20
+ export const calciteCornerRadiusPill = "9999px";
21
21
  export const calciteFontFamily = [
22
22
  "Avenir Next",
23
23
  "Avenir",
package/dist/scss/core.scss CHANGED
@@ -554,6 +554,7 @@ $calcite-size-192: 192px;
554
554
  $calcite-size-224: 224px;
555
555
  $calcite-size-256: 256px;
556
556
  $calcite-size-288: 288px;
557
+ $calcite-size-9999: 9999px;
557
558
  $calcite-size-none: 0;
558
559
  $calcite-size-relative-50: 50%;
559
560
  $calcite-size-relative-100: 100%;
package/dist/scss/dark.scss CHANGED
@@ -13,17 +13,25 @@ $calcite-color-foreground-1: #2b2b2b; // Deprecated, use `--calcite-color-surfac
13
13
  $calcite-color-foreground-2: #363636; // Deprecated, use `--calcite-color-surface-3` instead
14
14
  $calcite-color-foreground-3: #404040; // Deprecated, use `--calcite-color-surface-4` instead
15
15
  $calcite-color-foreground-current: #2b465f; // deprecated, use --calcite-color-surface-highlight instead
16
- $calcite-color-transparent: rgba(255, 255, 255, 0);
17
- $calcite-color-transparent-hover: rgba(255, 255, 255, 0.12);
18
- $calcite-color-transparent-press: rgba(255, 255, 255, 0.16);
19
- $calcite-color-transparent-inverse-hover: rgba(0, 0, 0, 0.04);
20
- $calcite-color-transparent-inverse-press: rgba(0, 0, 0, 0.08);
21
- $calcite-color-transparent-scrim: rgba(0, 0, 0, 0.85);
22
- $calcite-color-transparent-tint: rgba(43, 43, 43, 0.8);
16
+ $calcite-color-text-1: #ffffff;
17
+ $calcite-color-text-2: #bfbfbf;
18
+ $calcite-color-text-3: #9e9e9e;
19
+ $calcite-color-text-inverse: #141414;
20
+ $calcite-color-text-link: #00a0ff;
21
+ $calcite-color-text-highlight: #d6efff;
22
+ $calcite-color-border-1: #545454;
23
+ $calcite-color-border-2: #4a4a4a;
24
+ $calcite-color-border-3: #404040;
25
+ $calcite-color-border-input: #757575;
26
+ $calcite-color-border-ghost: rgba(117, 117, 117, 0.3);
27
+ $calcite-color-border-white: #f7f7f7;
23
28
  $calcite-color-brand: #009af2;
24
29
  $calcite-color-brand-hover: #007ac2;
25
30
  $calcite-color-brand-press: #00619b;
26
31
  $calcite-color-brand-underline: rgba(0, 160, 255, 0.4);
32
+ $calcite-color-inverse: #f7f7f7;
33
+ $calcite-color-inverse-hover: #f2f2f2;
34
+ $calcite-color-inverse-press: #ebebeb;
27
35
  $calcite-color-status-info: #00a0ff;
28
36
  $calcite-color-status-info-hover: #3db8ff;
29
37
  $calcite-color-status-info-press: #009af2;
@@ -36,19 +44,11 @@ $calcite-color-status-warning-press: #ff9500;
36
44
  $calcite-color-status-danger: #fe583e;
37
45
  $calcite-color-status-danger-hover: #ff0015;
38
46
  $calcite-color-status-danger-press: #d90012;
39
- $calcite-color-inverse: #f7f7f7;
40
- $calcite-color-inverse-hover: #f2f2f2;
41
- $calcite-color-inverse-press: #ebebeb;
42
- $calcite-color-text-1: #ffffff;
43
- $calcite-color-text-2: #bfbfbf;
44
- $calcite-color-text-3: #9e9e9e;
45
- $calcite-color-text-highlight: #d6efff;
46
- $calcite-color-text-inverse: #141414;
47
- $calcite-color-text-link: #00a0ff;
48
- $calcite-color-border-1: #545454;
49
- $calcite-color-border-2: #4a4a4a;
50
- $calcite-color-border-3: #404040;
51
- $calcite-color-border-input: #757575;
52
- $calcite-color-border-ghost: rgba(117, 117, 117, 0.3);
53
- $calcite-color-border-white: #f7f7f7;
47
+ $calcite-color-transparent: rgba(255, 255, 255, 0);
48
+ $calcite-color-transparent-hover: rgba(255, 255, 255, 0.12);
49
+ $calcite-color-transparent-press: rgba(255, 255, 255, 0.16);
50
+ $calcite-color-transparent-scrim: rgba(0, 0, 0, 0.85);
51
+ $calcite-color-transparent-tint: rgba(43, 43, 43, 0.8);
52
+ $calcite-color-transparent-inverse-hover: rgba(0, 0, 0, 0.04);
53
+ $calcite-color-transparent-inverse-press: rgba(0, 0, 0, 0.08);
54
54
  $calcite-color-focus: $calcite-color-brand;
package/dist/scss/global.scss CHANGED
@@ -17,7 +17,7 @@ $calcite-corner-radius-none: 0;
17
17
  $calcite-corner-radius-xs: 2px;
18
18
  $calcite-corner-radius-sm: 4px;
19
19
  $calcite-corner-radius-round: 4px; // deprecated, use --calcite-corner-radius-sm instead
20
- $calcite-corner-radius-pill: 100%;
20
+ $calcite-corner-radius-pill: 9999px;
21
21
  $calcite-font-family: 'Avenir Next', Avenir, 'Helvetica Neue', sans-serif; // Primary font with fallbacks
22
22
  $calcite-font-family-code: Monaco, Consolas, 'Andale Mono', 'Lucida Console', monospace; // Font family for code with fallbacks
23
23
  $calcite-font-weight-light: 300; // For Avenir Next World (secondary font family)