@texturehq/edges 0.1.8 ā 1.0.0
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/dist/components.manifest.json +548 -7
- package/dist/generated/tailwind-tokens-dark.css +190 -0
- package/dist/generated/tailwind-tokens-light.css +190 -0
- package/dist/index.cjs +6 -5
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1183 -125
- package/dist/index.d.ts +1183 -125
- package/dist/index.js +6 -5
- package/dist/index.js.map +1 -1
- package/dist/styles/animations.css +132 -0
- package/dist/styles/computed.css +137 -0
- package/dist/styles/utilities.css +13 -0
- package/dist/styles.css +1654 -641
- package/dist/theme.css +26 -1102
- package/package.json +44 -16
- package/scripts/validate-tokens.js +177 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@texturehq/edges",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "1.0.0",
|
|
4
4
|
"author": "Nicholas Brown <nick@texturehq.com>",
|
|
5
5
|
"description": "A shared component library for Texture",
|
|
6
6
|
"type": "module",
|
|
@@ -27,14 +27,21 @@
|
|
|
27
27
|
"scripts": {
|
|
28
28
|
"dev": "yarn watch",
|
|
29
29
|
"watch": "tsup --watch",
|
|
30
|
-
"build": "tsup",
|
|
30
|
+
"build": "yarn tokens:build && tsup",
|
|
31
|
+
"tokens:build": "node style-dictionary.config.mjs",
|
|
32
|
+
"tokens:build:tailwind": "node style-dictionary.config.mjs",
|
|
33
|
+
"tokens:watch": "nodemon --watch tokens --ext json --exec 'yarn tokens:build'",
|
|
34
|
+
"tokens:watch:tailwind": "nodemon --watch tokens --ext json --exec 'yarn tokens:build:tailwind'",
|
|
35
|
+
"tokens:validate": "node scripts/validate-tokens.js",
|
|
31
36
|
"build:yalc": "yarn build && npx yalc publish && npx yalc push",
|
|
32
37
|
"dev:yalc": "yarn build && npx yalc publish && npx yalc push && echo 'Package updated! Run in target project: yarn install && yarn dev'",
|
|
33
38
|
"dev:yalc:force": "yarn build && npx yalc publish && npx yalc push && echo 'Package updated! Run in target project: rm -rf .vite && yarn cache clean && yarn dev --force'",
|
|
34
39
|
"clean": "rm -rf dist",
|
|
35
|
-
"lint": "
|
|
36
|
-
"lint:quiet": "
|
|
37
|
-
"lint:fix": "
|
|
40
|
+
"lint": "biome check src/",
|
|
41
|
+
"lint:quiet": "biome check --reporter=github src/",
|
|
42
|
+
"lint:fix": "biome check --write src/",
|
|
43
|
+
"format": "biome format --write src/",
|
|
44
|
+
"format:check": "biome format src/",
|
|
38
45
|
"test": "vitest run",
|
|
39
46
|
"test:watch": "vitest",
|
|
40
47
|
"test:coverage": "vitest run --coverage",
|
|
@@ -49,23 +56,45 @@
|
|
|
49
56
|
},
|
|
50
57
|
"dependencies": {
|
|
51
58
|
"@phosphor-icons/react": "^2.1.7",
|
|
59
|
+
"@tiptap/core": "^3.4.5",
|
|
60
|
+
"@tiptap/extension-link": "^3.4.5",
|
|
61
|
+
"@tiptap/pm": "^3.4.5",
|
|
62
|
+
"@tiptap/react": "^3.4.5",
|
|
63
|
+
"@tiptap/starter-kit": "^3.4.5",
|
|
64
|
+
"@types/react-map-gl": "6.1.6",
|
|
65
|
+
"@visx/axis": "^3.10.1",
|
|
66
|
+
"@visx/curve": "^3.3.0",
|
|
67
|
+
"@visx/event": "^3.3.0",
|
|
68
|
+
"@visx/responsive": "^3.10.2",
|
|
69
|
+
"@visx/scale": "^3.5.0",
|
|
70
|
+
"@visx/shape": "^3.5.0",
|
|
71
|
+
"@visx/tooltip": "^3.3.0",
|
|
72
|
+
"ace-builds": "^1.43.3",
|
|
73
|
+
"d3-array": "^3.2.4",
|
|
74
|
+
"file-saver": "^2.0.5",
|
|
52
75
|
"filestack-react": "^6.0.0",
|
|
53
|
-
"
|
|
76
|
+
"framer-motion": "^12.23.18",
|
|
77
|
+
"lucide-react": "^0.544.0",
|
|
54
78
|
"luxon": "^3.4.4",
|
|
79
|
+
"mapbox-gl": "3.7.0",
|
|
55
80
|
"next-intl": "^4.0.2",
|
|
81
|
+
"papaparse": "^5.5.3",
|
|
56
82
|
"react-ace": "^14.0.1",
|
|
57
83
|
"react-aria-components": "^1.7.1",
|
|
84
|
+
"react-map-gl": "7.1.7",
|
|
58
85
|
"react-stately": "^3.35.0",
|
|
59
86
|
"tailwind-merge": "^3.2.0"
|
|
60
87
|
},
|
|
61
88
|
"devDependencies": {
|
|
62
|
-
"@
|
|
63
|
-
"@storybook/addon-
|
|
89
|
+
"@biomejs/biome": "^2.2.4",
|
|
90
|
+
"@storybook/addon-essentials": "^8.6.14",
|
|
91
|
+
"@storybook/addon-interactions": "^8.6.14",
|
|
64
92
|
"@storybook/addon-styling-webpack": "^1.0.1",
|
|
65
|
-
"@storybook/
|
|
66
|
-
"@storybook/
|
|
67
|
-
"@storybook/react
|
|
68
|
-
"@storybook/
|
|
93
|
+
"@storybook/addon-themes": "^8.6.14",
|
|
94
|
+
"@storybook/blocks": "^8.6.14",
|
|
95
|
+
"@storybook/react": "^8.6.14",
|
|
96
|
+
"@storybook/react-vite": "^8.6.14",
|
|
97
|
+
"@storybook/test": "^8.6.14",
|
|
69
98
|
"@tailwindcss/postcss": "^4.1.4",
|
|
70
99
|
"@testing-library/dom": "^10.4.0",
|
|
71
100
|
"@testing-library/jest-dom": "^6.4.2",
|
|
@@ -73,21 +102,20 @@
|
|
|
73
102
|
"@testing-library/user-event": "^14.5.2",
|
|
74
103
|
"@types/file-saver": "^2.0.7",
|
|
75
104
|
"@types/node": "^20.11.30",
|
|
76
|
-
"@types/papaparse": "^5.3.
|
|
105
|
+
"@types/papaparse": "^5.3.16",
|
|
77
106
|
"@types/react": "^18.2.67",
|
|
78
107
|
"@types/react-dom": "^18.2.22",
|
|
79
108
|
"@vitejs/plugin-react": "^4.2.1",
|
|
80
109
|
"@vitest/coverage-v8": "^3.1.1",
|
|
81
110
|
"@vitest/ui": "^3.1.1",
|
|
82
111
|
"autoprefixer": "^10.4.19",
|
|
83
|
-
"eslint": "^8.57.0",
|
|
84
|
-
"eslint-plugin-storybook": "^0.12.0",
|
|
85
112
|
"jsdom": "^24.0.0",
|
|
86
113
|
"postcss": "^8.4.35",
|
|
87
114
|
"postcss-cli": "^11.0.0",
|
|
88
115
|
"react": "^18.2.0",
|
|
89
116
|
"react-dom": "^18.2.0",
|
|
90
|
-
"storybook": "^8.6.
|
|
117
|
+
"storybook": "^8.6.14",
|
|
118
|
+
"style-dictionary": "^5.0.4",
|
|
91
119
|
"tailwindcss": "^4.1.3",
|
|
92
120
|
"tsup": "^8.0.2",
|
|
93
121
|
"typescript": "~5.9.2",
|
|
@@ -0,0 +1,177 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Validates design tokens against DTCG (Design Tokens Community Group) spec
|
|
5
|
+
* https://tr.designtokens.org/format/
|
|
6
|
+
*/
|
|
7
|
+
|
|
8
|
+
import { readFileSync, readdirSync, statSync } from 'fs';
|
|
9
|
+
import { join, extname } from 'path';
|
|
10
|
+
|
|
11
|
+
const TOKENS_DIR = './tokens';
|
|
12
|
+
const REQUIRED_SCHEMA = 'https://tr.designtokens.org/format/0.1/';
|
|
13
|
+
|
|
14
|
+
// DTCG spec required properties for different token types
|
|
15
|
+
const TOKEN_TYPE_REQUIREMENTS = {
|
|
16
|
+
color: ['$value'],
|
|
17
|
+
dimension: ['$value'],
|
|
18
|
+
fontFamily: ['$value'],
|
|
19
|
+
fontWeight: ['$value'],
|
|
20
|
+
duration: ['$value'],
|
|
21
|
+
number: ['$value'],
|
|
22
|
+
// Add more as needed
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
// Valid top-level properties
|
|
26
|
+
const VALID_TOP_LEVEL = ['$schema', '$name', '$description', '$type', '$value', '$extensions'];
|
|
27
|
+
|
|
28
|
+
// Validation results
|
|
29
|
+
const errors = [];
|
|
30
|
+
const warnings = [];
|
|
31
|
+
const successes = [];
|
|
32
|
+
|
|
33
|
+
/**
|
|
34
|
+
* Get all JSON files recursively
|
|
35
|
+
*/
|
|
36
|
+
function getTokenFiles(dir) {
|
|
37
|
+
const files = [];
|
|
38
|
+
const items = readdirSync(dir);
|
|
39
|
+
|
|
40
|
+
for (const item of items) {
|
|
41
|
+
const path = join(dir, item);
|
|
42
|
+
const stat = statSync(path);
|
|
43
|
+
|
|
44
|
+
if (stat.isDirectory()) {
|
|
45
|
+
files.push(...getTokenFiles(path));
|
|
46
|
+
} else if (extname(path) === '.json') {
|
|
47
|
+
files.push(path);
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
return files;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
/**
|
|
55
|
+
* Validate a single token
|
|
56
|
+
*/
|
|
57
|
+
function validateToken(token, path, parentType = null) {
|
|
58
|
+
const type = token.$type || parentType;
|
|
59
|
+
|
|
60
|
+
// Check for $value
|
|
61
|
+
if (!token.$value && !hasNestedTokens(token)) {
|
|
62
|
+
errors.push(`${path}: Token missing $value property`);
|
|
63
|
+
return;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
// If has $value, validate based on type
|
|
67
|
+
if (token.$value && type) {
|
|
68
|
+
const requirements = TOKEN_TYPE_REQUIREMENTS[type];
|
|
69
|
+
if (requirements) {
|
|
70
|
+
for (const req of requirements) {
|
|
71
|
+
if (!(req in token)) {
|
|
72
|
+
errors.push(`${path}: Token of type "${type}" missing required property "${req}"`);
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
// Check for $description (recommended but not required)
|
|
79
|
+
if (!token.$description && token.$value) {
|
|
80
|
+
warnings.push(`${path}: Token missing $description (recommended)`);
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
// Validate nested tokens
|
|
84
|
+
for (const key in token) {
|
|
85
|
+
if (!key.startsWith('$') && typeof token[key] === 'object') {
|
|
86
|
+
validateToken(token[key], `${path}.${key}`, type);
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
/**
|
|
92
|
+
* Check if object has nested tokens
|
|
93
|
+
*/
|
|
94
|
+
function hasNestedTokens(obj) {
|
|
95
|
+
for (const key in obj) {
|
|
96
|
+
if (!key.startsWith('$') && typeof obj[key] === 'object') {
|
|
97
|
+
return true;
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
return false;
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
/**
|
|
104
|
+
* Validate a token file
|
|
105
|
+
*/
|
|
106
|
+
function validateFile(filepath) {
|
|
107
|
+
console.log(`\nValidating: ${filepath}`);
|
|
108
|
+
|
|
109
|
+
try {
|
|
110
|
+
const content = readFileSync(filepath, 'utf8');
|
|
111
|
+
const tokens = JSON.parse(content);
|
|
112
|
+
|
|
113
|
+
// Check for $schema
|
|
114
|
+
if (!tokens.$schema) {
|
|
115
|
+
warnings.push(`${filepath}: Missing $schema declaration`);
|
|
116
|
+
} else if (!tokens.$schema.includes('designtokens.org')) {
|
|
117
|
+
warnings.push(`${filepath}: Non-standard schema: ${tokens.$schema}`);
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
// Check for $name
|
|
121
|
+
if (!tokens.$name) {
|
|
122
|
+
warnings.push(`${filepath}: Missing $name property (recommended)`);
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
// Validate all tokens
|
|
126
|
+
for (const key in tokens) {
|
|
127
|
+
if (!key.startsWith('$') && typeof tokens[key] === 'object') {
|
|
128
|
+
validateToken(tokens[key], `${filepath}:${key}`, tokens.$type);
|
|
129
|
+
}
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
successes.push(`${filepath}: Valid DTCG token file`);
|
|
133
|
+
|
|
134
|
+
} catch (error) {
|
|
135
|
+
errors.push(`${filepath}: ${error.message}`);
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
/**
|
|
140
|
+
* Main validation
|
|
141
|
+
*/
|
|
142
|
+
function main() {
|
|
143
|
+
console.log('š DTCG Token Validation\n');
|
|
144
|
+
console.log('==========================');
|
|
145
|
+
|
|
146
|
+
const files = getTokenFiles(TOKENS_DIR);
|
|
147
|
+
console.log(`Found ${files.length} token files\n`);
|
|
148
|
+
|
|
149
|
+
for (const file of files) {
|
|
150
|
+
validateFile(file);
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
// Report results
|
|
154
|
+
console.log('\n==========================');
|
|
155
|
+
console.log('š Validation Results\n');
|
|
156
|
+
|
|
157
|
+
if (successes.length > 0) {
|
|
158
|
+
console.log('ā
Valid Files:');
|
|
159
|
+
successes.forEach(s => console.log(` ${s}`));
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
if (warnings.length > 0) {
|
|
163
|
+
console.log('\nā ļø Warnings:');
|
|
164
|
+
warnings.forEach(w => console.log(` ${w}`));
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
if (errors.length > 0) {
|
|
168
|
+
console.log('\nā Errors:');
|
|
169
|
+
errors.forEach(e => console.log(` ${e}`));
|
|
170
|
+
process.exit(1);
|
|
171
|
+
} else {
|
|
172
|
+
console.log('\n⨠All tokens are DTCG compliant!');
|
|
173
|
+
}
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
// Run validation
|
|
177
|
+
main();
|