@volue/design-colors 3.0.0-next.0 → 3.0.0-next.1

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 (19) hide show
  1. package/dist/flat.common.js +63 -1
  2. package/dist/flat.d.ts +44 -2
  3. package/dist/flat.module.js +43 -1
  4. package/dist/generic.common.js +245 -3
  5. package/dist/generic.d.ts +125 -2
  6. package/dist/generic.module.js +245 -3
  7. package/dist/index.common.js +40 -2
  8. package/dist/index.cssmodules.css +22 -2
  9. package/dist/index.custom-properties.css +22 -2
  10. package/dist/index.d.ts +40 -2
  11. package/dist/index.json +22 -2
  12. package/dist/index.map.scss +23 -3
  13. package/dist/index.module.js +40 -2
  14. package/dist/index.scss +22 -2
  15. package/dist/internal/fillsWithTextColors.json +44 -0
  16. package/package.json +1 -5
  17. package/src/functional.json +10 -4
  18. package/src/internal/fills.json +9 -0
  19. package/src/rgb-channels.json +77 -0
package/dist/internal/fillsWithTextColors.json CHANGED
@@ -1,4 +1,48 @@
1
1
  [
2
+ {
3
+ "name": "CANVAS",
4
+ "palette": "canvas",
5
+ "textColors": [
6
+ {
7
+ "name": "NEUTRAL",
8
+ "rating": "AAA"
9
+ },
10
+ {
11
+ "name": "NEUTRAL_MODERATE",
12
+ "rating": "AAA"
13
+ },
14
+ {
15
+ "name": "NEUTRAL_SUBTLE",
16
+ "rating": "AA"
17
+ },
18
+ {
19
+ "name": "LINK",
20
+ "rating": "AAA"
21
+ }
22
+ ]
23
+ },
24
+ {
25
+ "name": "CANVAS_SUBTLE",
26
+ "palette": "canvas",
27
+ "textColors": [
28
+ {
29
+ "name": "NEUTRAL",
30
+ "rating": "AAA"
31
+ },
32
+ {
33
+ "name": "NEUTRAL_MODERATE",
34
+ "rating": "AAA"
35
+ },
36
+ {
37
+ "name": "NEUTRAL_SUBTLE",
38
+ "rating": "AA"
39
+ },
40
+ {
41
+ "name": "LINK",
42
+ "rating": "AAA"
43
+ }
44
+ ]
45
+ },
2
46
  {
3
47
  "name": "SURFACE",
4
48
  "palette": "surface",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@volue/design-colors",
3
- "version": "3.0.0-next.0",
3
+ "version": "3.0.0-next.1",
4
4
  "description": "Color primitives for Volue design primitives",
5
5
  "license": "UNLICENSED",
6
6
  "repository": {
@@ -60,15 +60,11 @@
60
60
  "format": "yarn run _prettier --write",
61
61
  "test": "run-p lint \"_prettier --check\"",
62
62
  "clean": "rimraf dist",
63
- "_theo": "theo --setup theo.setup.js --transform web --dest dist",
64
63
  "build:tokens": "style-dictionary build",
65
64
  "build": "yarn run clean && yarn run build:tokens",
66
65
  "prepack": "yarn run build"
67
66
  },
68
67
  "devDependencies": {
69
- "@fantasy-color/contrast-ratio-luminance": "2.1.0",
70
- "@fantasy-color/from-hex": "2.1.0",
71
- "@fantasy-color/luminance-rgb": "2.1.0",
72
68
  "change-case": "4.1.2",
73
69
  "color2k": "1.2.5",
74
70
  "eslint": "8.46.0",
package/src/functional.json CHANGED
@@ -2,8 +2,14 @@
2
2
  "color": {
3
3
  "background": {
4
4
  "canvas": {
5
- "value": "{color.background.neutral.minimal.value}",
6
- "description": "Canvas background. Used for the background of your app."
5
+ "@": {
6
+ "value": "{color.background.neutral.minimal.value}",
7
+ "description": "Canvas background. Used for the background of your app."
8
+ },
9
+ "subtle": {
10
+ "value": "{color.background.neutral.subtle.@.value}",
11
+ "description": "Subtle canvas background. Used for the background of your app, e.g. when you create a card-based layout."
12
+ }
7
13
  },
8
14
  "surface": {
9
15
  "@": {
@@ -12,7 +18,7 @@
12
18
  },
13
19
  "subtle": {
14
20
  "value": "{color.background.neutral.moderate.@.value}",
15
- "description": "Subtle surface background. Used for the background area of components that should stand out somewhat against default surface."
21
+ "description": "Subtle surface background. Used for the background area of components that should stand out somewhat against default surface or app canvas."
16
22
  },
17
23
  "contrast": {
18
24
  "value": "{color.background.neutral.contrast.value}",
@@ -286,7 +292,7 @@
286
292
  "inverse": {
287
293
  "value": "{color.background.neutral.minimal.value}",
288
294
  "description": "Inverse background. Used for backgrounds of elements on a strong background.",
289
- "alpha": 0.1
295
+ "alpha": 0.1125
290
296
  }
291
297
  },
292
298
  "foreground": {
package/src/internal/fills.json CHANGED
@@ -47,6 +47,15 @@
47
47
  }
48
48
  },
49
49
  "paletteGroups": {
50
+ "canvas": {
51
+ "@": {
52
+ "value": "{color.background.canvas.@.value}"
53
+ },
54
+ "subtle": {
55
+ "value": "{color.background.canvas.subtle.value}"
56
+ }
57
+ },
58
+
50
59
  "surface": {
51
60
  "@": {
52
61
  "value": "{color.background.surface.@.value}"
package/src/rgb-channels.json ADDED
@@ -0,0 +1,77 @@
1
+ {
2
+ "color": {
3
+ "rgb": {
4
+ "background": {
5
+ "surface": {
6
+ "value": "{color.background.surface.@.value}"
7
+ },
8
+ "neutral": {
9
+ "@": {
10
+ "value": "{color.background.neutral.@.value}"
11
+ },
12
+ "bold": {
13
+ "value": "{color.background.neutral.bold.value}"
14
+ },
15
+ "strong": {
16
+ "value": "{color.background.neutral.strong.value}"
17
+ }
18
+ },
19
+ "accent": {
20
+ "@": {
21
+ "value": "{color.background.accent.@.value}"
22
+ },
23
+ "bold": {
24
+ "value": "{color.background.accent.bold.value}"
25
+ },
26
+ "strong": {
27
+ "value": "{color.background.accent.strong.@.value}"
28
+ }
29
+ },
30
+ "danger": {
31
+ "@": {
32
+ "value": "{color.background.danger.@.value}"
33
+ },
34
+ "bold": {
35
+ "value": "{color.background.danger.bold.value}"
36
+ },
37
+ "strong": {
38
+ "value": "{color.background.danger.strong.@.value}"
39
+ }
40
+ },
41
+ "warning": {
42
+ "@": {
43
+ "value": "{color.background.warning.@.value}"
44
+ },
45
+ "bold": {
46
+ "value": "{color.background.warning.bold.value}"
47
+ },
48
+ "strong": {
49
+ "value": "{color.background.warning.strong.@.value}"
50
+ }
51
+ },
52
+ "success": {
53
+ "@": {
54
+ "value": "{color.background.success.@.value}"
55
+ },
56
+ "bold": {
57
+ "value": "{color.background.success.bold.value}"
58
+ },
59
+ "strong": {
60
+ "value": "{color.background.success.strong.@.value}"
61
+ }
62
+ },
63
+ "info": {
64
+ "@": {
65
+ "value": "{color.background.info.@.value}"
66
+ },
67
+ "bold": {
68
+ "value": "{color.background.info.bold.value}"
69
+ },
70
+ "strong": {
71
+ "value": "{color.background.info.strong.@.value}"
72
+ }
73
+ }
74
+ }
75
+ }
76
+ }
77
+ }