@volue/design-colors 1.2.5-next.0 → 1.3.0-next.10

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 (5) hide show
  1. package/dist/colors.map.scss +55 -0
  2. package/dist/index.map.scss +55 -0
  3. package/package.json +7 -6
  4. package/src/colors.yml +224 -0
  5. package/src/index.yml +1 -223
package/dist/colors.map.scss ADDED
@@ -0,0 +1,55 @@
1
+
2
+ $colors-map: (
3
+ 'color-black': (#000000),
4
+ 'color-white': (#ffffff),
5
+ 'color-gray5': (#f2f2f2),
6
+ 'color-gray10': (#e5e5e5),
7
+ 'color-gray15': (#d9d9d9),
8
+ 'color-gray25': (#b2b2b2),
9
+ 'color-gray50': (#666666),
10
+ 'color-gray75': (#333333),
11
+ 'color-primary5': (#f2f4f5),
12
+ 'color-primary10': (#e6e9ea),
13
+ 'color-primary60': (#6b8085),
14
+ 'color-primary100': (#082b33),
15
+ 'color-primary120': (#062228),
16
+ 'color-accent5': (#f2f8f8),
17
+ 'color-accent10': (#e5f1f2),
18
+ 'color-accent15': (#d9ebec),
19
+ 'color-accent25': (#bfddde),
20
+ 'color-accent60': (#7fbbbd),
21
+ 'color-accent100': (#01797d),
22
+ 'color-accent120': (#016063),
23
+ 'color-blue10': (#e9f1f6),
24
+ 'color-blue50': (#92b8d4),
25
+ 'color-blue100': (#2673aa),
26
+ 'color-blue120': (#1a5178),
27
+ 'color-green10': (#ecf3ea),
28
+ 'color-green50': (#a0c29b),
29
+ 'color-green100': (#438538),
30
+ 'color-green120': (#295222),
31
+ 'color-orange10': (#fbf0e5),
32
+ 'color-orange50': (#ecb67f),
33
+ 'color-orange100': (#da6e00),
34
+ 'color-orange120': (#a65300),
35
+ 'color-red10': (#fbe9ea),
36
+ 'color-red50': (#df9e99),
37
+ 'color-red100': (#bf3f34),
38
+ 'color-red120': (#8c2e26),
39
+ 'color-teal10': (#e9f6f7),
40
+ 'color-teal50': (#94d1d5),
41
+ 'color-teal100': (#2ba3ab),
42
+ 'color-teal120': (#1e7278),
43
+ 'color-purple10': (#f1ecf5),
44
+ 'color-purple50': (#bfa9d3),
45
+ 'color-purple100': (#8054a8),
46
+ 'color-purple120': (#593b75),
47
+ 'color-pink10': (#faebef),
48
+ 'color-pink50': (#e79eb0),
49
+ 'color-pink100': (#cf3f63),
50
+ 'color-pink120': (#9c2f4a),
51
+ 'color-yellow10': (#fdfaf4),
52
+ 'color-yellow50': (#fdd9a3),
53
+ 'color-yellow100': (#faa600),
54
+ 'color-yellow120': (#c78500),
55
+ );
package/dist/index.map.scss ADDED
@@ -0,0 +1,55 @@
1
+
2
+ $index-map: (
3
+ 'color-black': (#000000),
4
+ 'color-white': (#ffffff),
5
+ 'color-gray5': (#f2f2f2),
6
+ 'color-gray10': (#e5e5e5),
7
+ 'color-gray15': (#d9d9d9),
8
+ 'color-gray25': (#b2b2b2),
9
+ 'color-gray50': (#666666),
10
+ 'color-gray75': (#333333),
11
+ 'color-primary5': (#f2f4f5),
12
+ 'color-primary10': (#e6e9ea),
13
+ 'color-primary60': (#6b8085),
14
+ 'color-primary100': (#082b33),
15
+ 'color-primary120': (#062228),
16
+ 'color-accent5': (#f2f8f8),
17
+ 'color-accent10': (#e5f1f2),
18
+ 'color-accent15': (#d9ebec),
19
+ 'color-accent25': (#bfddde),
20
+ 'color-accent60': (#7fbbbd),
21
+ 'color-accent100': (#01797d),
22
+ 'color-accent120': (#016063),
23
+ 'color-blue10': (#e9f1f6),
24
+ 'color-blue50': (#92b8d4),
25
+ 'color-blue100': (#2673aa),
26
+ 'color-blue120': (#1a5178),
27
+ 'color-green10': (#ecf3ea),
28
+ 'color-green50': (#a0c29b),
29
+ 'color-green100': (#438538),
30
+ 'color-green120': (#295222),
31
+ 'color-orange10': (#fbf0e5),
32
+ 'color-orange50': (#ecb67f),
33
+ 'color-orange100': (#da6e00),
34
+ 'color-orange120': (#a65300),
35
+ 'color-red10': (#fbe9ea),
36
+ 'color-red50': (#df9e99),
37
+ 'color-red100': (#bf3f34),
38
+ 'color-red120': (#8c2e26),
39
+ 'color-teal10': (#e9f6f7),
40
+ 'color-teal50': (#94d1d5),
41
+ 'color-teal100': (#2ba3ab),
42
+ 'color-teal120': (#1e7278),
43
+ 'color-purple10': (#f1ecf5),
44
+ 'color-purple50': (#bfa9d3),
45
+ 'color-purple100': (#8054a8),
46
+ 'color-purple120': (#593b75),
47
+ 'color-pink10': (#faebef),
48
+ 'color-pink50': (#e79eb0),
49
+ 'color-pink100': (#cf3f63),
50
+ 'color-pink120': (#9c2f4a),
51
+ 'color-yellow10': (#fdfaf4),
52
+ 'color-yellow50': (#fdd9a3),
53
+ 'color-yellow100': (#faa600),
54
+ 'color-yellow120': (#c78500),
55
+ );
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@volue/design-colors",
3
- "version": "1.2.5-next.0",
3
+ "version": "1.3.0-next.10",
4
4
  "description": "Color primitives for Volue design primitives",
5
5
  "license": "UNLICENSED",
6
6
  "repository": {
@@ -27,7 +27,8 @@
27
27
  "test": "run-p lint \"_prettier --check\"",
28
28
  "clean": "rimraf dist",
29
29
  "_theo": "theo --setup theo.setup.js --transform web --dest dist",
30
- "build:tokens": "npm run _theo -s -- --format scss,json,common.js,common.d.ts,module.js,module.d.ts,custom-properties.css,cssmodules.css,html src/index.yml",
30
+ "build:tokens": "npm run _theo -s -- --format scss,map.scss,json,common.js,common.d.ts,module.js,module.d.ts,custom-properties.css,cssmodules.css,html src/index.yml",
31
+ "build:tokensMap": "npm run _theo -s -- --format map.scss src/colors.yml",
31
32
  "build:backgroundFills": "npm run _theo -s -- --format withTextColors.json,html src/backgroundFills.yml",
32
33
  "build:textColors": "npm run _theo -s -- --format json,html src/textColors.yml",
33
34
  "build": "yarn run clean && run-p \"build:*\"",
@@ -38,13 +39,13 @@
38
39
  "@fantasy-color/from-hex": "2.1.0",
39
40
  "@fantasy-color/luminance-rgb": "2.1.0",
40
41
  "eslint": "7.32.0",
41
- "eslint-config-powel": "12.0.1",
42
+ "eslint-config-powel": "13.0.1",
42
43
  "eslint-import-resolver-node": "0.3.6",
43
- "eslint-plugin-import": "2.24.2",
44
+ "eslint-plugin-import": "2.25.3",
44
45
  "npm-run-all": "4.1.5",
45
- "prettier": "2.3.2",
46
+ "prettier": "2.5.1",
46
47
  "rimraf": "3.0.2",
47
48
  "theo": "8.1.5",
48
- "typescript": "4.4.2"
49
+ "typescript": "4.4.4"
49
50
  }
50
51
  }
package/src/colors.yml ADDED
@@ -0,0 +1,224 @@
1
+ global:
2
+ type: color
3
+ category: background-color
4
+ imports:
5
+ - ./_aliases.yml
6
+ props:
7
+ - name: COLOR_BLACK
8
+ value: '{!BLACK}'
9
+ meta:
10
+ friendlyName: Black
11
+ - name: COLOR_WHITE
12
+ value: '{!WHITE}'
13
+ meta:
14
+ friendlyName: White
15
+ - name: COLOR_GRAY5
16
+ value: '{!GRAY5}'
17
+ meta:
18
+ friendlyName: Gray 5
19
+ - name: COLOR_GRAY10
20
+ value: '{!GRAY10}'
21
+ meta:
22
+ friendlyName: Gray 10
23
+ - name: COLOR_GRAY15
24
+ value: '{!GRAY15}'
25
+ meta:
26
+ friendlyName: Gray 15
27
+ - name: COLOR_GRAY25
28
+ value: '{!GRAY25}'
29
+ meta:
30
+ friendlyName: Gray 25
31
+ - name: COLOR_GRAY50
32
+ value: '{!GRAY50}'
33
+ meta:
34
+ friendlyName: Gray 50
35
+ - name: COLOR_GRAY75
36
+ value: '{!GRAY75}'
37
+ meta:
38
+ friendlyName: Gray 75
39
+
40
+ - name: COLOR_PRIMARY5
41
+ value: '{!PRIMARY5}'
42
+ meta:
43
+ friendlyName: Primary 5
44
+ - name: COLOR_PRIMARY10
45
+ value: '{!PRIMARY10}'
46
+ meta:
47
+ friendlyName: Primary 10
48
+ - name: COLOR_PRIMARY60
49
+ value: '{!PRIMARY60}'
50
+ meta:
51
+ friendlyName: Primary 60
52
+ - name: COLOR_PRIMARY100
53
+ value: '{!PRIMARY100}'
54
+ meta:
55
+ friendlyName: Primary 100
56
+ - name: COLOR_PRIMARY120
57
+ value: '{!PRIMARY120}'
58
+ meta:
59
+ friendlyName: Primary 120
60
+
61
+ - name: COLOR_ACCENT5
62
+ value: '{!ACCENT5}'
63
+ meta:
64
+ friendlyName: Accent 5
65
+ - name: COLOR_ACCENT10
66
+ value: '{!ACCENT10}'
67
+ meta:
68
+ friendlyName: Accent 10
69
+ - name: COLOR_ACCENT15
70
+ value: '{!ACCENT15}'
71
+ meta:
72
+ friendlyName: Accent 15
73
+ - name: COLOR_ACCENT25
74
+ value: '{!ACCENT25}'
75
+ meta:
76
+ friendlyName: Accent 25
77
+ - name: COLOR_ACCENT60
78
+ value: '{!ACCENT60}'
79
+ meta:
80
+ friendlyName: Accent 60
81
+ - name: COLOR_ACCENT100
82
+ value: '{!ACCENT100}'
83
+ meta:
84
+ friendlyName: Accent 100
85
+ - name: COLOR_ACCENT120
86
+ value: '{!ACCENT120}'
87
+ meta:
88
+ friendlyName: Accent 120
89
+
90
+ - name: COLOR_BLUE10
91
+ value: '{!BLUE10}'
92
+ meta:
93
+ friendlyName: Blue 10
94
+ - name: COLOR_BLUE50
95
+ value: '{!BLUE50}'
96
+ meta:
97
+ friendlyName: Blue 50
98
+ - name: COLOR_BLUE100
99
+ value: '{!BLUE100}'
100
+ meta:
101
+ friendlyName: Blue 100
102
+ - name: COLOR_BLUE120
103
+ value: '{!BLUE120}'
104
+ meta:
105
+ friendlyName: Blue 120
106
+
107
+ - name: COLOR_GREEN10
108
+ value: '{!GREEN10}'
109
+ meta:
110
+ friendlyName: Green 10
111
+ - name: COLOR_GREEN50
112
+ value: '{!GREEN50}'
113
+ meta:
114
+ friendlyName: Green 50
115
+ - name: COLOR_GREEN100
116
+ value: '{!GREEN100}'
117
+ meta:
118
+ friendlyName: Green 100
119
+ - name: COLOR_GREEN120
120
+ value: '{!GREEN120}'
121
+ meta:
122
+ friendlyName: Green 120
123
+
124
+ - name: COLOR_ORANGE10
125
+ value: '{!ORANGE10}'
126
+ meta:
127
+ friendlyName: Orange 10
128
+ - name: COLOR_ORANGE50
129
+ value: '{!ORANGE50}'
130
+ meta:
131
+ friendlyName: Orange 50
132
+ - name: COLOR_ORANGE100
133
+ value: '{!ORANGE100}'
134
+ meta:
135
+ friendlyName: Orange 100
136
+ - name: COLOR_ORANGE120
137
+ value: '{!ORANGE120}'
138
+ meta:
139
+ friendlyName: Orange 120
140
+
141
+ - name: COLOR_RED10
142
+ value: '{!RED10}'
143
+ meta:
144
+ friendlyName: Red 10
145
+ - name: COLOR_RED50
146
+ value: '{!RED50}'
147
+ meta:
148
+ friendlyName: Red 50
149
+ - name: COLOR_RED100
150
+ value: '{!RED100}'
151
+ meta:
152
+ friendlyName: Red 100
153
+ - name: COLOR_RED120
154
+ value: '{!RED120}'
155
+ meta:
156
+ friendlyName: Red 120
157
+
158
+ - name: COLOR_TEAL10
159
+ value: '{!TEAL10}'
160
+ meta:
161
+ friendlyName: Teal 10
162
+ - name: COLOR_TEAL50
163
+ value: '{!TEAL50}'
164
+ meta:
165
+ friendlyName: Teal 50
166
+ - name: COLOR_TEAL100
167
+ value: '{!TEAL100}'
168
+ meta:
169
+ friendlyName: TEAL 100
170
+ - name: COLOR_TEAL120
171
+ value: '{!TEAL120}'
172
+ meta:
173
+ friendlyName: TEAL 120
174
+
175
+ - name: COLOR_PURPLE10
176
+ value: '{!PURPLE10}'
177
+ meta:
178
+ friendlyName: Purple 10
179
+ - name: COLOR_PURPLE50
180
+ value: '{!PURPLE50}'
181
+ meta:
182
+ friendlyName: Purple 50
183
+ - name: COLOR_PURPLE100
184
+ value: '{!PURPLE100}'
185
+ meta:
186
+ friendlyName: Purple 100
187
+ - name: COLOR_PURPLE120
188
+ value: '{!PURPLE120}'
189
+ meta:
190
+ friendlyName: Purple 120
191
+
192
+ - name: COLOR_PINK10
193
+ value: '{!PINK10}'
194
+ meta:
195
+ friendlyName: Pink 10
196
+ - name: COLOR_PINK50
197
+ value: '{!PINK50}'
198
+ meta:
199
+ friendlyName: Pink 50
200
+ - name: COLOR_PINK100
201
+ value: '{!PINK100}'
202
+ meta:
203
+ friendlyName: Pink 100
204
+ - name: COLOR_PINK120
205
+ value: '{!PINK120}'
206
+ meta:
207
+ friendlyName: Pink 120
208
+
209
+ - name: COLOR_YELLOW10
210
+ value: '{!YELLOW10}'
211
+ meta:
212
+ friendlyName: Yellow 10
213
+ - name: COLOR_YELLOW50
214
+ value: '{!YELLOW50}'
215
+ meta:
216
+ friendlyName: Yellow 50
217
+ - name: COLOR_YELLOW100
218
+ value: '{!YELLOW100}'
219
+ meta:
220
+ friendlyName: Yellow 100
221
+ - name: COLOR_YELLOW120
222
+ value: '{!YELLOW120}'
223
+ meta:
224
+ friendlyName: Yellow 120
package/src/index.yml CHANGED
@@ -1,224 +1,2 @@
1
- global:
2
- type: color
3
- category: background-color
4
1
  imports:
5
- - ./_aliases.yml
6
- props:
7
- - name: COLOR_BLACK
8
- value: '{!BLACK}'
9
- meta:
10
- friendlyName: Black
11
- - name: COLOR_WHITE
12
- value: '{!WHITE}'
13
- meta:
14
- friendlyName: White
15
- - name: COLOR_GRAY5
16
- value: '{!GRAY5}'
17
- meta:
18
- friendlyName: Gray 5
19
- - name: COLOR_GRAY10
20
- value: '{!GRAY10}'
21
- meta:
22
- friendlyName: Gray 10
23
- - name: COLOR_GRAY15
24
- value: '{!GRAY15}'
25
- meta:
26
- friendlyName: Gray 15
27
- - name: COLOR_GRAY25
28
- value: '{!GRAY25}'
29
- meta:
30
- friendlyName: Gray 25
31
- - name: COLOR_GRAY50
32
- value: '{!GRAY50}'
33
- meta:
34
- friendlyName: Gray 50
35
- - name: COLOR_GRAY75
36
- value: '{!GRAY75}'
37
- meta:
38
- friendlyName: Gray 75
39
-
40
- - name: COLOR_PRIMARY5
41
- value: '{!PRIMARY5}'
42
- meta:
43
- friendlyName: Primary 5
44
- - name: COLOR_PRIMARY10
45
- value: '{!PRIMARY10}'
46
- meta:
47
- friendlyName: Primary 10
48
- - name: COLOR_PRIMARY60
49
- value: '{!PRIMARY60}'
50
- meta:
51
- friendlyName: Primary 60
52
- - name: COLOR_PRIMARY100
53
- value: '{!PRIMARY100}'
54
- meta:
55
- friendlyName: Primary 100
56
- - name: COLOR_PRIMARY120
57
- value: '{!PRIMARY120}'
58
- meta:
59
- friendlyName: Primary 120
60
-
61
- - name: COLOR_ACCENT5
62
- value: '{!ACCENT5}'
63
- meta:
64
- friendlyName: Accent 5
65
- - name: COLOR_ACCENT10
66
- value: '{!ACCENT10}'
67
- meta:
68
- friendlyName: Accent 10
69
- - name: COLOR_ACCENT15
70
- value: '{!ACCENT15}'
71
- meta:
72
- friendlyName: Accent 15
73
- - name: COLOR_ACCENT25
74
- value: '{!ACCENT25}'
75
- meta:
76
- friendlyName: Accent 25
77
- - name: COLOR_ACCENT60
78
- value: '{!ACCENT60}'
79
- meta:
80
- friendlyName: Accent 60
81
- - name: COLOR_ACCENT100
82
- value: '{!ACCENT100}'
83
- meta:
84
- friendlyName: Accent 100
85
- - name: COLOR_ACCENT120
86
- value: '{!ACCENT120}'
87
- meta:
88
- friendlyName: Accent 120
89
-
90
- - name: COLOR_BLUE10
91
- value: '{!BLUE10}'
92
- meta:
93
- friendlyName: Blue 10
94
- - name: COLOR_BLUE50
95
- value: '{!BLUE50}'
96
- meta:
97
- friendlyName: Blue 50
98
- - name: COLOR_BLUE100
99
- value: '{!BLUE100}'
100
- meta:
101
- friendlyName: Blue 100
102
- - name: COLOR_BLUE120
103
- value: '{!BLUE120}'
104
- meta:
105
- friendlyName: Blue 120
106
-
107
- - name: COLOR_GREEN10
108
- value: '{!GREEN10}'
109
- meta:
110
- friendlyName: Green 10
111
- - name: COLOR_GREEN50
112
- value: '{!GREEN50}'
113
- meta:
114
- friendlyName: Green 50
115
- - name: COLOR_GREEN100
116
- value: '{!GREEN100}'
117
- meta:
118
- friendlyName: Green 100
119
- - name: COLOR_GREEN120
120
- value: '{!GREEN120}'
121
- meta:
122
- friendlyName: Green 120
123
-
124
- - name: COLOR_ORANGE10
125
- value: '{!ORANGE10}'
126
- meta:
127
- friendlyName: Orange 10
128
- - name: COLOR_ORANGE50
129
- value: '{!ORANGE50}'
130
- meta:
131
- friendlyName: Orange 50
132
- - name: COLOR_ORANGE100
133
- value: '{!ORANGE100}'
134
- meta:
135
- friendlyName: Orange 100
136
- - name: COLOR_ORANGE120
137
- value: '{!ORANGE120}'
138
- meta:
139
- friendlyName: Orange 120
140
-
141
- - name: COLOR_RED10
142
- value: '{!RED10}'
143
- meta:
144
- friendlyName: Red 10
145
- - name: COLOR_RED50
146
- value: '{!RED50}'
147
- meta:
148
- friendlyName: Red 50
149
- - name: COLOR_RED100
150
- value: '{!RED100}'
151
- meta:
152
- friendlyName: Red 100
153
- - name: COLOR_RED120
154
- value: '{!RED120}'
155
- meta:
156
- friendlyName: Red 120
157
-
158
- - name: COLOR_TEAL10
159
- value: '{!TEAL10}'
160
- meta:
161
- friendlyName: Teal 10
162
- - name: COLOR_TEAL50
163
- value: '{!TEAL50}'
164
- meta:
165
- friendlyName: Teal 50
166
- - name: COLOR_TEAL100
167
- value: '{!TEAL100}'
168
- meta:
169
- friendlyName: TEAL 100
170
- - name: COLOR_TEAL120
171
- value: '{!TEAL120}'
172
- meta:
173
- friendlyName: TEAL 120
174
-
175
- - name: COLOR_PURPLE10
176
- value: '{!PURPLE10}'
177
- meta:
178
- friendlyName: Purple 10
179
- - name: COLOR_PURPLE50
180
- value: '{!PURPLE50}'
181
- meta:
182
- friendlyName: Purple 50
183
- - name: COLOR_PURPLE100
184
- value: '{!PURPLE100}'
185
- meta:
186
- friendlyName: Purple 100
187
- - name: COLOR_PURPLE120
188
- value: '{!PURPLE120}'
189
- meta:
190
- friendlyName: Purple 120
191
-
192
- - name: COLOR_PINK10
193
- value: '{!PINK10}'
194
- meta:
195
- friendlyName: Pink 10
196
- - name: COLOR_PINK50
197
- value: '{!PINK50}'
198
- meta:
199
- friendlyName: Pink 50
200
- - name: COLOR_PINK100
201
- value: '{!PINK100}'
202
- meta:
203
- friendlyName: Pink 100
204
- - name: COLOR_PINK120
205
- value: '{!PINK120}'
206
- meta:
207
- friendlyName: Pink 120
208
-
209
- - name: COLOR_YELLOW10
210
- value: '{!YELLOW10}'
211
- meta:
212
- friendlyName: Yellow 10
213
- - name: COLOR_YELLOW50
214
- value: '{!YELLOW50}'
215
- meta:
216
- friendlyName: Yellow 50
217
- - name: COLOR_YELLOW100
218
- value: '{!YELLOW100}'
219
- meta:
220
- friendlyName: Yellow 100
221
- - name: COLOR_YELLOW120
222
- value: '{!YELLOW120}'
223
- meta:
224
- friendlyName: Yellow 120
2
+ - ./colors.yml