@bcc-code/design-tokens 3.0.3 → 3.0.5
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.
- package/README.md +62 -62
- package/build/bcc/aura-bcc-config.js +1148 -0
- package/build/bcc/dark.css +217 -302
- package/build/bcc/dark.js +289 -444
- package/build/bcc/light.css +318 -317
- package/build/bcc/light.js +450 -455
- package/build/bcc/tailwind-dark.css +217 -302
- package/build/bcc/tailwind-light.css +318 -317
- package/config/primevue.config.d.ts +7 -7
- package/config/primevue.config.js +23 -121
- package/package.json +42 -41
- package/build/bcc/primitives.js +0 -258
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
declare module "*primevue.config.js" {
|
|
2
|
-
export const BCCPreset: any;
|
|
3
|
-
}
|
|
4
|
-
|
|
5
|
-
declare module "@bcc-code/design-tokens/primevue" {
|
|
6
|
-
export const BCCPreset: any;
|
|
7
|
-
}
|
|
1
|
+
declare module "*primevue.config.js" {
|
|
2
|
+
export const BCCPreset: any;
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
declare module "@bcc-code/design-tokens/primevue" {
|
|
6
|
+
export const BCCPreset: any;
|
|
7
|
+
}
|
|
@@ -1,121 +1,23 @@
|
|
|
1
|
-
import { definePreset } from "@primeuix/themes";
|
|
2
|
-
import Aura from "@primeuix/themes/aura";
|
|
3
|
-
|
|
4
|
-
import tokens from "../build/bcc/
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
2: tokens["border-width"][2],
|
|
25
|
-
},
|
|
26
|
-
fontFamily: {
|
|
27
|
-
archivo: tokens["font-family"].archivo,
|
|
28
|
-
},
|
|
29
|
-
fontSize: {
|
|
30
|
-
xs: tokens["font-size"].xs,
|
|
31
|
-
xl: tokens["font-size"].xl,
|
|
32
|
-
sm: tokens["font-size"].sm,
|
|
33
|
-
md: tokens["font-size"].md,
|
|
34
|
-
lg: tokens["font-size"].lg,
|
|
35
|
-
"2xl": tokens["font-size"]["2xl"],
|
|
36
|
-
"3xl": tokens["font-size"]["3xl"],
|
|
37
|
-
"4xl": tokens["font-size"]["4xl"],
|
|
38
|
-
},
|
|
39
|
-
fontWeight: {
|
|
40
|
-
regular: tokens["font-weight"].regular,
|
|
41
|
-
medium: tokens["font-weight"].medium,
|
|
42
|
-
bold: tokens["font-weight"].bold,
|
|
43
|
-
},
|
|
44
|
-
lineHeight: {
|
|
45
|
-
1: tokens["line-height"][1],
|
|
46
|
-
2: tokens["line-height"][2],
|
|
47
|
-
3: tokens["line-height"][3],
|
|
48
|
-
4: tokens["line-height"][4],
|
|
49
|
-
5: tokens["line-height"][5],
|
|
50
|
-
6: tokens["line-height"][6],
|
|
51
|
-
7: tokens["line-height"][7],
|
|
52
|
-
8: tokens["line-height"][8],
|
|
53
|
-
9: tokens["line-height"][9],
|
|
54
|
-
10: tokens["line-height"][10],
|
|
55
|
-
},
|
|
56
|
-
space: {
|
|
57
|
-
0: tokens.space[0],
|
|
58
|
-
25: tokens.space[25],
|
|
59
|
-
50: tokens.space[50],
|
|
60
|
-
75: tokens.space[75],
|
|
61
|
-
100: tokens.space[100],
|
|
62
|
-
150: tokens.space[150],
|
|
63
|
-
200: tokens.space[200],
|
|
64
|
-
250: tokens.space[250],
|
|
65
|
-
300: tokens.space[300],
|
|
66
|
-
400: tokens.space[400],
|
|
67
|
-
500: tokens.space[500],
|
|
68
|
-
600: tokens.space[600],
|
|
69
|
-
800: tokens.space[800],
|
|
70
|
-
1000: tokens.space[1000],
|
|
71
|
-
negative: {
|
|
72
|
-
25: tokens.space.negative[25],
|
|
73
|
-
50: tokens.space.negative[50],
|
|
74
|
-
75: tokens.space.negative[75],
|
|
75
|
-
100: tokens.space.negative[100],
|
|
76
|
-
150: tokens.space.negative[150],
|
|
77
|
-
200: tokens.space.negative[200],
|
|
78
|
-
250: tokens.space.negative[250],
|
|
79
|
-
300: tokens.space.negative[300],
|
|
80
|
-
400: tokens.space.negative[400],
|
|
81
|
-
},
|
|
82
|
-
},
|
|
83
|
-
},
|
|
84
|
-
semantic: {
|
|
85
|
-
primary: {
|
|
86
|
-
50: "{dark-green.100}",
|
|
87
|
-
100: "{dark-green.200}",
|
|
88
|
-
200: "{dark-green.300}",
|
|
89
|
-
300: "{dark-green.400}",
|
|
90
|
-
400: "{dark-green.500}",
|
|
91
|
-
500: "{dark-green.600}",
|
|
92
|
-
600: "{dark-green.700}",
|
|
93
|
-
700: "{dark-green.800}",
|
|
94
|
-
800: "{dark-green.900}",
|
|
95
|
-
900: "{dark-green.1000}",
|
|
96
|
-
950: "{dark-green.1000}",
|
|
97
|
-
},
|
|
98
|
-
colorScheme: {
|
|
99
|
-
dark: {
|
|
100
|
-
shadow: {
|
|
101
|
-
overflow: {
|
|
102
|
-
default: darkTokens.elevation.shadow.overflow.default,
|
|
103
|
-
perimeter: darkTokens.elevation.shadow.overflow.perimeter,
|
|
104
|
-
spread: darkTokens.elevation.shadow.overflow.spread,
|
|
105
|
-
},
|
|
106
|
-
overlay: darkTokens.elevation.shadow.overlay,
|
|
107
|
-
raised: darkTokens.elevation.shadow.raised,
|
|
108
|
-
},
|
|
109
|
-
},
|
|
110
|
-
light: {
|
|
111
|
-
shadow: {
|
|
112
|
-
overflow: lightTokens.elevation.shadow.overlay,
|
|
113
|
-
overlay: lightTokens.elevation.shadow.overlay,
|
|
114
|
-
raised: lightTokens.elevation.shadow.raised,
|
|
115
|
-
},
|
|
116
|
-
},
|
|
117
|
-
},
|
|
118
|
-
},
|
|
119
|
-
});
|
|
120
|
-
|
|
121
|
-
export default BCCPreset;
|
|
1
|
+
import { definePreset } from "@primeuix/themes";
|
|
2
|
+
import Aura from "@primeuix/themes/aura";
|
|
3
|
+
|
|
4
|
+
import tokens from "../build/bcc/aura-bcc-config.js";
|
|
5
|
+
|
|
6
|
+
const BCCPreset = definePreset(Aura, {
|
|
7
|
+
primitive: {
|
|
8
|
+
...tokens["aura/primitive"],
|
|
9
|
+
},
|
|
10
|
+
semantic: {
|
|
11
|
+
...tokens["aura/semantic"],
|
|
12
|
+
colorScheme: {
|
|
13
|
+
dark: {
|
|
14
|
+
...tokens["aura/semantic/dark"],
|
|
15
|
+
},
|
|
16
|
+
light: {
|
|
17
|
+
...tokens["aura/semantic/light"],
|
|
18
|
+
},
|
|
19
|
+
},
|
|
20
|
+
}
|
|
21
|
+
});
|
|
22
|
+
|
|
23
|
+
export default BCCPreset;
|
package/package.json
CHANGED
|
@@ -1,41 +1,42 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@bcc-code/design-tokens",
|
|
3
|
-
"version": "3.0.
|
|
4
|
-
"description": "Design tokens build system",
|
|
5
|
-
"type": "module",
|
|
6
|
-
"exports": {
|
|
7
|
-
"./css/light": "./build/bcc/light.css",
|
|
8
|
-
"./css/dark": "./build/bcc/dark.css",
|
|
9
|
-
"./tailwind/light": "./build/bcc/tailwind-light.css",
|
|
10
|
-
"./tailwind/dark": "./build/bcc/tailwind-dark.css",
|
|
11
|
-
"./primevue": {
|
|
12
|
-
"import": "./config/primevue.config.js",
|
|
13
|
-
"types": "./config/primevue.config.d.ts"
|
|
14
|
-
},
|
|
15
|
-
"./package.json": "./package.json"
|
|
16
|
-
},
|
|
17
|
-
"files": [
|
|
18
|
-
"build/**/*",
|
|
19
|
-
"config/primevue.config.js",
|
|
20
|
-
"config/primevue.config.d.ts",
|
|
21
|
-
"README.md",
|
|
22
|
-
"package.json"
|
|
23
|
-
],
|
|
24
|
-
"scripts": {
|
|
25
|
-
"build": "node export-tokens/build.js"
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
"
|
|
29
|
-
"
|
|
30
|
-
|
|
31
|
-
"
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
"
|
|
35
|
-
|
|
36
|
-
"
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "@bcc-code/design-tokens",
|
|
3
|
+
"version": "3.0.5",
|
|
4
|
+
"description": "Design tokens build system",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"exports": {
|
|
7
|
+
"./css/light": "./build/bcc/light.css",
|
|
8
|
+
"./css/dark": "./build/bcc/dark.css",
|
|
9
|
+
"./tailwind/light": "./build/bcc/tailwind-light.css",
|
|
10
|
+
"./tailwind/dark": "./build/bcc/tailwind-dark.css",
|
|
11
|
+
"./primevue": {
|
|
12
|
+
"import": "./config/primevue.config.js",
|
|
13
|
+
"types": "./config/primevue.config.d.ts"
|
|
14
|
+
},
|
|
15
|
+
"./package.json": "./package.json"
|
|
16
|
+
},
|
|
17
|
+
"files": [
|
|
18
|
+
"build/**/*",
|
|
19
|
+
"config/primevue.config.js",
|
|
20
|
+
"config/primevue.config.d.ts",
|
|
21
|
+
"README.md",
|
|
22
|
+
"package.json"
|
|
23
|
+
],
|
|
24
|
+
"scripts": {
|
|
25
|
+
"build": "node export-tokens/build.js",
|
|
26
|
+
"prepublishOnly": "npm run build"
|
|
27
|
+
},
|
|
28
|
+
"author": "BCC Code",
|
|
29
|
+
"license": "MIT",
|
|
30
|
+
"repository": {
|
|
31
|
+
"type": "git",
|
|
32
|
+
"url": "https://github.com/bcc-code/bcc-tokens.git"
|
|
33
|
+
},
|
|
34
|
+
"homepage": "https://github.com/bcc-code/bcc-tokens#readme",
|
|
35
|
+
"dependencies": {
|
|
36
|
+
"@tokens-studio/sd-transforms": "^1.3.0",
|
|
37
|
+
"style-dictionary": "^5.0.0"
|
|
38
|
+
},
|
|
39
|
+
"peerDependencies": {
|
|
40
|
+
"@primeuix/themes": "^1.1.1"
|
|
41
|
+
}
|
|
42
|
+
}
|
package/build/bcc/primitives.js
DELETED
|
@@ -1,258 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Do not edit directly, this file was auto-generated.
|
|
3
|
-
*/
|
|
4
|
-
|
|
5
|
-
export default {
|
|
6
|
-
"font-family": {
|
|
7
|
-
archivo: "Archivo",
|
|
8
|
-
},
|
|
9
|
-
color: {
|
|
10
|
-
neutral: {
|
|
11
|
-
0: "#ffffff",
|
|
12
|
-
100: "#f7f8f9",
|
|
13
|
-
200: "#f1f2f4",
|
|
14
|
-
300: "#dcdfe4",
|
|
15
|
-
400: "#b3b9c4",
|
|
16
|
-
500: "#8590a2",
|
|
17
|
-
600: "#758195",
|
|
18
|
-
700: "#626f86",
|
|
19
|
-
800: "#4b5668",
|
|
20
|
-
900: "#374152",
|
|
21
|
-
1000: "#282f3c",
|
|
22
|
-
1100: "#1e242d",
|
|
23
|
-
},
|
|
24
|
-
"dark-neutral": {
|
|
25
|
-
0: "#161a1d",
|
|
26
|
-
100: "#1d2125",
|
|
27
|
-
200: "#22272b",
|
|
28
|
-
250: "#282e33",
|
|
29
|
-
300: "#2c333a",
|
|
30
|
-
350: "#38414a",
|
|
31
|
-
400: "#454f59",
|
|
32
|
-
500: "#596773",
|
|
33
|
-
600: "#738496",
|
|
34
|
-
700: "#8c9bab",
|
|
35
|
-
800: "#9fadbc",
|
|
36
|
-
900: "#b6c2cf",
|
|
37
|
-
1000: "#c7d1db",
|
|
38
|
-
1100: "#dee4ea",
|
|
39
|
-
"negative-100": "#101214",
|
|
40
|
-
},
|
|
41
|
-
"dark-green": {
|
|
42
|
-
100: "#f0fcfa",
|
|
43
|
-
200: "#d2eeeb",
|
|
44
|
-
300: "#a0cec8",
|
|
45
|
-
400: "#6fb5ad",
|
|
46
|
-
500: "#3e9f97",
|
|
47
|
-
600: "#1d7f78",
|
|
48
|
-
700: "#0c625c",
|
|
49
|
-
800: "#014d49",
|
|
50
|
-
900: "#0b3633",
|
|
51
|
-
1000: "#012320",
|
|
52
|
-
},
|
|
53
|
-
orange: {
|
|
54
|
-
100: "#fffaed",
|
|
55
|
-
200: "#fee3c1",
|
|
56
|
-
300: "#f6b981",
|
|
57
|
-
400: "#f19457",
|
|
58
|
-
500: "#da772e",
|
|
59
|
-
600: "#b55919",
|
|
60
|
-
700: "#943a14",
|
|
61
|
-
800: "#782612",
|
|
62
|
-
900: "#5d1712",
|
|
63
|
-
1000: "#420e0d",
|
|
64
|
-
},
|
|
65
|
-
red: {
|
|
66
|
-
100: "#fff8f3",
|
|
67
|
-
200: "#fee2dd",
|
|
68
|
-
300: "#fab6ad",
|
|
69
|
-
400: "#fa877e",
|
|
70
|
-
500: "#ed6362",
|
|
71
|
-
600: "#ca414e",
|
|
72
|
-
700: "#a42237",
|
|
73
|
-
800: "#811436",
|
|
74
|
-
900: "#630d2e",
|
|
75
|
-
1000: "#440223",
|
|
76
|
-
},
|
|
77
|
-
green: {
|
|
78
|
-
100: "#efffed",
|
|
79
|
-
200: "#cbf3c9",
|
|
80
|
-
300: "#83d895",
|
|
81
|
-
400: "#32c180",
|
|
82
|
-
500: "#1ca673",
|
|
83
|
-
600: "#09825d",
|
|
84
|
-
700: "#0c6241",
|
|
85
|
-
800: "#094c3b",
|
|
86
|
-
900: "#073734",
|
|
87
|
-
1000: "#032429",
|
|
88
|
-
},
|
|
89
|
-
teal: {
|
|
90
|
-
100: "#f6fbff",
|
|
91
|
-
200: "#c3f2f8",
|
|
92
|
-
300: "#82d3e3",
|
|
93
|
-
400: "#51b9cf",
|
|
94
|
-
500: "#1a9eb7",
|
|
95
|
-
600: "#0b7da1",
|
|
96
|
-
700: "#005b81",
|
|
97
|
-
800: "#09486b",
|
|
98
|
-
900: "#0d324d",
|
|
99
|
-
1000: "#0c2132",
|
|
100
|
-
},
|
|
101
|
-
brown: {
|
|
102
|
-
100: "#f9faf4",
|
|
103
|
-
200: "#ece8dc",
|
|
104
|
-
300: "#d1c5b0",
|
|
105
|
-
400: "#bea889",
|
|
106
|
-
500: "#a98c66",
|
|
107
|
-
600: "#8b6d45",
|
|
108
|
-
700: "#6e5232",
|
|
109
|
-
800: "#553d28",
|
|
110
|
-
900: "#3f2c1e",
|
|
111
|
-
1000: "#2e1b0f",
|
|
112
|
-
},
|
|
113
|
-
blue: {
|
|
114
|
-
100: "#f6fbff",
|
|
115
|
-
200: "#d9ecff",
|
|
116
|
-
300: "#a6cdfd",
|
|
117
|
-
400: "#7cabf9",
|
|
118
|
-
500: "#608ef6",
|
|
119
|
-
600: "#446add",
|
|
120
|
-
700: "#274eb5",
|
|
121
|
-
800: "#273c8f",
|
|
122
|
-
900: "#212c64",
|
|
123
|
-
1000: "#091e47",
|
|
124
|
-
},
|
|
125
|
-
purple: {
|
|
126
|
-
100: "#f6f9ff",
|
|
127
|
-
200: "#e3e3fe",
|
|
128
|
-
300: "#c9c3ec",
|
|
129
|
-
400: "#afa0e0",
|
|
130
|
-
500: "#9a82da",
|
|
131
|
-
600: "#8360c3",
|
|
132
|
-
700: "#61479c",
|
|
133
|
-
800: "#493481",
|
|
134
|
-
900: "#352465",
|
|
135
|
-
1000: "#1d154d",
|
|
136
|
-
},
|
|
137
|
-
magenta: {
|
|
138
|
-
100: "#fff8ff",
|
|
139
|
-
200: "#fce0f8",
|
|
140
|
-
300: "#f3b4e2",
|
|
141
|
-
400: "#eb8acf",
|
|
142
|
-
500: "#de66b0",
|
|
143
|
-
600: "#be428f",
|
|
144
|
-
700: "#952e70",
|
|
145
|
-
800: "#751f57",
|
|
146
|
-
900: "#5b1043",
|
|
147
|
-
1000: "#3f0534",
|
|
148
|
-
},
|
|
149
|
-
"neutral-alpha": {
|
|
150
|
-
"100A": "rgba(9, 30, 77, 0.03)",
|
|
151
|
-
"500A": "rgba(9, 30, 77, 0.5)",
|
|
152
|
-
"200A": "rgba(9, 30, 77, 0.06)",
|
|
153
|
-
"300A": "rgba(9, 30, 77, 0.14)",
|
|
154
|
-
"400A": "rgba(9, 30, 77, 0.31)",
|
|
155
|
-
},
|
|
156
|
-
"dark-neutral-alpha": {
|
|
157
|
-
"100A": "rgba(188, 214, 240, 0.04)",
|
|
158
|
-
"200A": "rgba(188, 214, 240, 0.84)",
|
|
159
|
-
"300A": "rgba(188, 214, 240, 0.16)",
|
|
160
|
-
"400A": "rgba(188, 214, 240, 0.28)",
|
|
161
|
-
"500A": "rgba(188, 214, 240, 0.5)",
|
|
162
|
-
"250A": "rgba(188, 214, 240, 0.1)",
|
|
163
|
-
"350A": "rgba(188, 214, 240, 0.2)",
|
|
164
|
-
"negative-100A": "rgba(0, 0, 0, 0.24)",
|
|
165
|
-
},
|
|
166
|
-
yellow: {
|
|
167
|
-
100: "#fdf8e9",
|
|
168
|
-
200: "#f8e6a0",
|
|
169
|
-
300: "#e9c348",
|
|
170
|
-
400: "#d5a406",
|
|
171
|
-
500: "#bc870d",
|
|
172
|
-
600: "#a4670b",
|
|
173
|
-
700: "#854901",
|
|
174
|
-
800: "#653805",
|
|
175
|
-
900: "#4b2c04",
|
|
176
|
-
1000: "#2d1f00",
|
|
177
|
-
},
|
|
178
|
-
Transparent: "rgba(0, 0, 0, 0)",
|
|
179
|
-
},
|
|
180
|
-
space: {
|
|
181
|
-
0: "0rem",
|
|
182
|
-
25: "0.125rem",
|
|
183
|
-
50: "0.25rem",
|
|
184
|
-
75: "0.375rem",
|
|
185
|
-
100: "0.5rem",
|
|
186
|
-
150: "0.75rem",
|
|
187
|
-
200: "1rem",
|
|
188
|
-
250: "1.25rem",
|
|
189
|
-
300: "1.5rem",
|
|
190
|
-
400: "2rem",
|
|
191
|
-
500: "2.5rem",
|
|
192
|
-
600: "3rem",
|
|
193
|
-
800: "4rem",
|
|
194
|
-
1000: "5rem",
|
|
195
|
-
negative: {
|
|
196
|
-
25: "-0.125rem",
|
|
197
|
-
50: "-0.25rem",
|
|
198
|
-
75: "-0.375rem",
|
|
199
|
-
100: "-0.5rem",
|
|
200
|
-
150: "-0.75rem",
|
|
201
|
-
200: "-1rem",
|
|
202
|
-
250: "-1.25rem",
|
|
203
|
-
300: "-1.5rem",
|
|
204
|
-
400: "-2rem",
|
|
205
|
-
},
|
|
206
|
-
},
|
|
207
|
-
"border-radius": {
|
|
208
|
-
none: "0",
|
|
209
|
-
xs: "0.125rem",
|
|
210
|
-
sm: "0.25rem",
|
|
211
|
-
md: "0.5rem",
|
|
212
|
-
lg: "1rem",
|
|
213
|
-
xl: "1.5rem",
|
|
214
|
-
"2xl": "2rem",
|
|
215
|
-
"3xl": "3rem",
|
|
216
|
-
full: "999px",
|
|
217
|
-
},
|
|
218
|
-
"icon-size": {
|
|
219
|
-
xs: "1rem",
|
|
220
|
-
sm: "1.25rem",
|
|
221
|
-
md: "1.5rem",
|
|
222
|
-
lg: "2rem",
|
|
223
|
-
xl: "3rem",
|
|
224
|
-
},
|
|
225
|
-
"border-width": {
|
|
226
|
-
0: "0",
|
|
227
|
-
1: "1px",
|
|
228
|
-
2: "2px",
|
|
229
|
-
},
|
|
230
|
-
"font-weight": {
|
|
231
|
-
regular: 400,
|
|
232
|
-
medium: 500,
|
|
233
|
-
bold: 700,
|
|
234
|
-
},
|
|
235
|
-
"line-height": {
|
|
236
|
-
1: "12px",
|
|
237
|
-
2: "16px",
|
|
238
|
-
3: "20px",
|
|
239
|
-
4: "24px",
|
|
240
|
-
5: "28px",
|
|
241
|
-
6: "32px",
|
|
242
|
-
7: "36px",
|
|
243
|
-
8: "40px",
|
|
244
|
-
9: "52px",
|
|
245
|
-
10: "64px",
|
|
246
|
-
none: 1,
|
|
247
|
-
},
|
|
248
|
-
"font-size": {
|
|
249
|
-
xs: "0.75rem",
|
|
250
|
-
sm: "0.875rem",
|
|
251
|
-
md: "1rem",
|
|
252
|
-
lg: "1.25rem",
|
|
253
|
-
xl: "1.5rem",
|
|
254
|
-
"2xl": "2em",
|
|
255
|
-
"3xl": "2.25rem",
|
|
256
|
-
"4xl": "3rem",
|
|
257
|
-
},
|
|
258
|
-
};
|