@digdir/designsystemet 1.0.4 → 1.0.6
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/LICENSE +7 -0
- package/dist/bin/designsystemet.js +623 -593
- package/dist/src/colors/index.js +32 -0
- package/dist/src/colors/theme.js +1 -0
- package/dist/src/colors/utils.d.ts +13 -0
- package/dist/src/colors/utils.d.ts.map +1 -1
- package/dist/src/colors/utils.js +32 -0
- package/dist/src/config.js +1 -0
- package/dist/src/index.js +196 -142
- package/dist/src/scripts/createJsonSchema.js +39 -38
- package/dist/src/scripts/update-design-tokens.js +1 -0
- package/dist/src/tokens/build.d.ts.map +1 -1
- package/dist/src/tokens/build.js +353 -590
- package/dist/src/tokens/create/generators/$designsystemet.js +22 -19
- package/dist/src/tokens/create/generators/$themes.js +10 -10
- package/dist/src/tokens/create/generators/color.js +1 -0
- package/dist/src/tokens/create/write.js +32 -29
- package/dist/src/tokens/create.js +1 -0
- package/dist/src/tokens/format.d.ts +4 -5
- package/dist/src/tokens/format.d.ts.map +1 -1
- package/dist/src/tokens/format.js +165 -143
- package/dist/src/tokens/index.js +165 -142
- package/dist/src/tokens/process/configs/color.js +26 -22
- package/dist/src/tokens/process/configs/semantic.js +16 -12
- package/dist/src/tokens/process/configs/shared.js +16 -12
- package/dist/src/tokens/process/configs/storefront.js +16 -12
- package/dist/src/tokens/process/configs/typography.js +16 -12
- package/dist/src/tokens/process/configs.js +26 -22
- package/dist/src/tokens/process/formats/css/color.js +16 -12
- package/dist/src/tokens/process/formats/css/semantic.js +16 -12
- package/dist/src/tokens/process/formats/css.js +16 -12
- package/dist/src/tokens/process/formats/js-tokens.js +16 -12
- package/dist/src/tokens/process/platform.js +27 -23
- package/dist/src/tokens/process/theme.d.ts +27 -0
- package/dist/src/tokens/process/theme.d.ts.map +1 -0
- package/dist/src/tokens/process/theme.js +174 -0
- package/dist/src/tokens/process/transformers.js +16 -12
- package/dist/src/tokens/process/utils/getMultidimensionalThemes.js +26 -22
- package/dist/src/tokens/types.d.ts +4 -0
- package/dist/src/tokens/types.d.ts.map +1 -1
- package/dist/src/tokens/utils.d.ts +2 -2
- package/dist/src/tokens/utils.d.ts.map +1 -1
- package/dist/src/tokens/utils.js +16 -12
- package/package.json +31 -28
package/dist/src/tokens/index.js
CHANGED
|
@@ -994,6 +994,7 @@ import * as R4 from "ramda";
|
|
|
994
994
|
|
|
995
995
|
// src/colors/utils.ts
|
|
996
996
|
import chroma from "chroma-js";
|
|
997
|
+
import Colorjs from "colorjs.io";
|
|
997
998
|
import { Hsluv } from "hsluv";
|
|
998
999
|
var getLuminanceFromLightness = (lightness) => {
|
|
999
1000
|
const conv = new Hsluv();
|
|
@@ -2087,107 +2088,16 @@ var createTokens = async (opts) => {
|
|
|
2087
2088
|
};
|
|
2088
2089
|
|
|
2089
2090
|
// src/tokens/format.ts
|
|
2090
|
-
import * as
|
|
2091
|
-
import chalk3 from "chalk";
|
|
2091
|
+
import * as R20 from "ramda";
|
|
2092
2092
|
|
|
2093
|
-
//
|
|
2094
|
-
var package_default = {
|
|
2095
|
-
name: "@digdir/designsystemet",
|
|
2096
|
-
version: "1.0.4",
|
|
2097
|
-
description: "CLI for Designsystemet",
|
|
2098
|
-
author: "Designsystemet team",
|
|
2099
|
-
engines: {
|
|
2100
|
-
node: ">=22.14.0"
|
|
2101
|
-
},
|
|
2102
|
-
repository: {
|
|
2103
|
-
type: "git",
|
|
2104
|
-
url: "git+https://github.com/digdir/designsystemet.git"
|
|
2105
|
-
},
|
|
2106
|
-
homepage: "https://github.com/digdir/designsystemet/tree/main/scripts/cli",
|
|
2107
|
-
license: "MIT",
|
|
2108
|
-
type: "module",
|
|
2109
|
-
main: "./dist/src/index.js",
|
|
2110
|
-
files: [
|
|
2111
|
-
"./dist/**"
|
|
2112
|
-
],
|
|
2113
|
-
bin: "dist/bin/designsystemet.js",
|
|
2114
|
-
exports: {
|
|
2115
|
-
".": {
|
|
2116
|
-
import: "./dist/src/index.js"
|
|
2117
|
-
},
|
|
2118
|
-
"./color": {
|
|
2119
|
-
import: "./dist/src/colors/index.js"
|
|
2120
|
-
},
|
|
2121
|
-
"./tokens": {
|
|
2122
|
-
import: "./dist/src/tokens/index.js"
|
|
2123
|
-
}
|
|
2124
|
-
},
|
|
2125
|
-
publishConfig: {
|
|
2126
|
-
access: "public"
|
|
2127
|
-
},
|
|
2128
|
-
scripts: {
|
|
2129
|
-
designsystemet: "tsx ./bin/designsystemet.ts",
|
|
2130
|
-
"build:tokens": "yarn designsystemet tokens build -p -t ../../design-tokens -o ../../packages/theme/brand --clean",
|
|
2131
|
-
"build:tokens:debug": "tsx --inspect-brk ./bin/designsystemet.ts tokens build -p -t ../../design-tokens -o ../../packages/theme/brand --clean",
|
|
2132
|
-
build: "tsup && yarn build:types && yarn build:json-schema",
|
|
2133
|
-
"build:types": "tsc --emitDeclarationOnly --declaration",
|
|
2134
|
-
"build:json-schema": "tsx ./src/scripts/createJsonSchema.ts",
|
|
2135
|
-
types: "tsc --noEmit",
|
|
2136
|
-
"test:tokens-create-options": "yarn designsystemet tokens create -m dominant:#007682 -n #003333 -b 99 -o ./test-tokens-create --theme options-test --clean",
|
|
2137
|
-
"test:tokens-create-config": "yarn designsystemet tokens create --config ./test-tokens-create-complex.config.json",
|
|
2138
|
-
"test:tokens-build": "yarn designsystemet tokens build -t ./test-tokens-create -o ./test-tokens-build --clean",
|
|
2139
|
-
"test:tokens-create-and-build-options": "yarn test:tokens-create-options && yarn test:tokens-build",
|
|
2140
|
-
"test:tokens-create-and-build-config": "yarn test:tokens-create-config && yarn test:tokens-build",
|
|
2141
|
-
test: "yarn test:tokens-create-and-build-options && yarn test:tokens-create-and-build-config",
|
|
2142
|
-
"internal:tokens-create": "yarn designsystemet tokens create --config ./internal.config.json",
|
|
2143
|
-
"update:template": "tsx ./src/scripts/update-template.ts",
|
|
2144
|
-
"update:design-tokens": "yarn internal:tokens-create && tsx ./src/scripts/update-design-tokens.ts",
|
|
2145
|
-
verify: "yarn test && yarn update:template && yarn update:design-tokens"
|
|
2146
|
-
},
|
|
2147
|
-
dependencies: {
|
|
2148
|
-
"@commander-js/extra-typings": "^13.1.0",
|
|
2149
|
-
"@tokens-studio/sd-transforms": "1.2.12",
|
|
2150
|
-
"apca-w3": "^0.1.9",
|
|
2151
|
-
chalk: "^5.4.1",
|
|
2152
|
-
"change-case": "^5.4.4",
|
|
2153
|
-
"chroma-js": "^3.1.2",
|
|
2154
|
-
commander: "^13.1.0",
|
|
2155
|
-
"fast-glob": "^3.3.3",
|
|
2156
|
-
hsluv: "^1.0.1",
|
|
2157
|
-
"object-hash": "^3.0.0",
|
|
2158
|
-
postcss: "^8.5.3",
|
|
2159
|
-
ramda: "^0.30.1",
|
|
2160
|
-
"style-dictionary": "^4.3.3",
|
|
2161
|
-
zod: "^3.24.2",
|
|
2162
|
-
"zod-validation-error": "^3.4.0"
|
|
2163
|
-
},
|
|
2164
|
-
devDependencies: {
|
|
2165
|
-
"@types/apca-w3": "^0.1.3",
|
|
2166
|
-
"@types/chroma-js": "^3.1.1",
|
|
2167
|
-
"@types/fs-extra": "^11.0.4",
|
|
2168
|
-
"@types/glob": "^8.1.0",
|
|
2169
|
-
"@types/jscodeshift": "^0.12.0",
|
|
2170
|
-
"@types/node": "^22.14.0",
|
|
2171
|
-
"@types/object-hash": "^3.0.6",
|
|
2172
|
-
"@types/ramda": "^0.30.2",
|
|
2173
|
-
"fs-extra": "^11.3.0",
|
|
2174
|
-
"ts-toolbelt": "^9.6.0",
|
|
2175
|
-
tslib: "^2.8.1",
|
|
2176
|
-
tsup: "^8.4.0",
|
|
2177
|
-
tsx: "^4.19.3",
|
|
2178
|
-
typescript: "^5.8.2",
|
|
2179
|
-
"zod-to-json-schema": "^3.24.5"
|
|
2180
|
-
}
|
|
2181
|
-
};
|
|
2182
|
-
|
|
2183
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/BoxShadowTypes.js
|
|
2093
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/BoxShadowTypes.js
|
|
2184
2094
|
var BoxShadowTypes;
|
|
2185
2095
|
(function(BoxShadowTypes2) {
|
|
2186
2096
|
BoxShadowTypes2["DROP_SHADOW"] = "dropShadow";
|
|
2187
2097
|
BoxShadowTypes2["INNER_SHADOW"] = "innerShadow";
|
|
2188
2098
|
})(BoxShadowTypes || (BoxShadowTypes = {}));
|
|
2189
2099
|
|
|
2190
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/ColorModifierTypes.js
|
|
2100
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/ColorModifierTypes.js
|
|
2191
2101
|
var ColorModifierTypes;
|
|
2192
2102
|
(function(ColorModifierTypes2) {
|
|
2193
2103
|
ColorModifierTypes2["LIGHTEN"] = "lighten";
|
|
@@ -2196,7 +2106,7 @@ var ColorModifierTypes;
|
|
|
2196
2106
|
ColorModifierTypes2["ALPHA"] = "alpha";
|
|
2197
2107
|
})(ColorModifierTypes || (ColorModifierTypes = {}));
|
|
2198
2108
|
|
|
2199
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/ColorSpaceTypes.js
|
|
2109
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/ColorSpaceTypes.js
|
|
2200
2110
|
var ColorSpaceTypes;
|
|
2201
2111
|
(function(ColorSpaceTypes2) {
|
|
2202
2112
|
ColorSpaceTypes2["LCH"] = "lch";
|
|
@@ -2205,7 +2115,7 @@ var ColorSpaceTypes;
|
|
|
2205
2115
|
ColorSpaceTypes2["HSL"] = "hsl";
|
|
2206
2116
|
})(ColorSpaceTypes || (ColorSpaceTypes = {}));
|
|
2207
2117
|
|
|
2208
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/Properties.js
|
|
2118
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/Properties.js
|
|
2209
2119
|
var Properties;
|
|
2210
2120
|
(function(Properties2) {
|
|
2211
2121
|
Properties2["sizing"] = "sizing";
|
|
@@ -2257,7 +2167,7 @@ var Properties;
|
|
|
2257
2167
|
Properties2["description"] = "description";
|
|
2258
2168
|
})(Properties || (Properties = {}));
|
|
2259
2169
|
|
|
2260
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/TokenSetStatus.js
|
|
2170
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/TokenSetStatus.js
|
|
2261
2171
|
var TokenSetStatus;
|
|
2262
2172
|
(function(TokenSetStatus2) {
|
|
2263
2173
|
TokenSetStatus2["DISABLED"] = "disabled";
|
|
@@ -2265,7 +2175,7 @@ var TokenSetStatus;
|
|
|
2265
2175
|
TokenSetStatus2["ENABLED"] = "enabled";
|
|
2266
2176
|
})(TokenSetStatus || (TokenSetStatus = {}));
|
|
2267
2177
|
|
|
2268
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/TokenTypes.js
|
|
2178
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/TokenTypes.js
|
|
2269
2179
|
var TokenTypes;
|
|
2270
2180
|
(function(TokenTypes2) {
|
|
2271
2181
|
TokenTypes2["OTHER"] = "other";
|
|
@@ -2296,7 +2206,7 @@ var TokenTypes;
|
|
|
2296
2206
|
TokenTypes2["NUMBER"] = "number";
|
|
2297
2207
|
})(TokenTypes || (TokenTypes = {}));
|
|
2298
2208
|
|
|
2299
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/BorderValues.js
|
|
2209
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/BorderValues.js
|
|
2300
2210
|
var BorderValues;
|
|
2301
2211
|
(function(BorderValues2) {
|
|
2302
2212
|
BorderValues2["BORDER_COLOR"] = "color";
|
|
@@ -2304,7 +2214,7 @@ var BorderValues;
|
|
|
2304
2214
|
BorderValues2["BORDER_STYLE"] = "style";
|
|
2305
2215
|
})(BorderValues || (BorderValues = {}));
|
|
2306
2216
|
|
|
2307
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/StrokeStyleValues.js
|
|
2217
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/StrokeStyleValues.js
|
|
2308
2218
|
var StrokeStyleValues;
|
|
2309
2219
|
(function(StrokeStyleValues2) {
|
|
2310
2220
|
StrokeStyleValues2["SOLID"] = "solid";
|
|
@@ -2317,7 +2227,7 @@ var StrokeStyleValues;
|
|
|
2317
2227
|
StrokeStyleValues2["INSET"] = "inset";
|
|
2318
2228
|
})(StrokeStyleValues || (StrokeStyleValues = {}));
|
|
2319
2229
|
|
|
2320
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/BoxShadowValues.js
|
|
2230
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/BoxShadowValues.js
|
|
2321
2231
|
var BoxShadowValues;
|
|
2322
2232
|
(function(BoxShadowValues2) {
|
|
2323
2233
|
BoxShadowValues2["TYPE"] = "type";
|
|
@@ -2329,7 +2239,7 @@ var BoxShadowValues;
|
|
|
2329
2239
|
BoxShadowValues2["BLEND_MODE"] = "blendMode";
|
|
2330
2240
|
})(BoxShadowValues || (BoxShadowValues = {}));
|
|
2331
2241
|
|
|
2332
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/TypographyValues.js
|
|
2242
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/TypographyValues.js
|
|
2333
2243
|
var TypographyValues;
|
|
2334
2244
|
(function(TypographyValues2) {
|
|
2335
2245
|
TypographyValues2["FONT_FAMILY"] = "fontFamily";
|
|
@@ -2533,20 +2443,24 @@ var mapToLowerCase = R7.map(R7.toLower);
|
|
|
2533
2443
|
var hasAnyTruth = R7.any(R7.equals(true));
|
|
2534
2444
|
var getType = (token) => (token.$type ?? token.type) || "";
|
|
2535
2445
|
var getValue = (token) => token.$value ?? token.value;
|
|
2536
|
-
var typeEquals = R7.curry(
|
|
2537
|
-
|
|
2538
|
-
|
|
2446
|
+
var typeEquals = R7.curry(
|
|
2447
|
+
(types, token) => {
|
|
2448
|
+
if (R7.isNil(token)) {
|
|
2449
|
+
return false;
|
|
2450
|
+
}
|
|
2451
|
+
return R7.includes(R7.toLower(getType(token)), R7.map(R7.toLower, Array.isArray(types) ? types : [types]));
|
|
2539
2452
|
}
|
|
2540
|
-
|
|
2541
|
-
|
|
2542
|
-
|
|
2543
|
-
|
|
2544
|
-
|
|
2453
|
+
);
|
|
2454
|
+
var pathStartsWithOneOf = R7.curry(
|
|
2455
|
+
(paths, token) => {
|
|
2456
|
+
if (R7.isNil(token)) {
|
|
2457
|
+
return false;
|
|
2458
|
+
}
|
|
2459
|
+
const tokenPath = mapToLowerCase(token.path);
|
|
2460
|
+
const matchPathsStartingWith = R7.map((path) => R7.startsWith([path], tokenPath), mapToLowerCase(paths));
|
|
2461
|
+
return hasAnyTruth(matchPathsStartingWith);
|
|
2545
2462
|
}
|
|
2546
|
-
|
|
2547
|
-
const matchPathsStartingWith = R7.map((path) => R7.startsWith([path], tokenPath), mapToLowerCase(paths));
|
|
2548
|
-
return hasAnyTruth(matchPathsStartingWith);
|
|
2549
|
-
});
|
|
2463
|
+
);
|
|
2550
2464
|
function isSemanticToken(token) {
|
|
2551
2465
|
return token.filePath.includes("semantic/");
|
|
2552
2466
|
}
|
|
@@ -3334,7 +3248,7 @@ var buildConfigs = {
|
|
|
3334
3248
|
// },
|
|
3335
3249
|
};
|
|
3336
3250
|
async function processPlatform(options) {
|
|
3337
|
-
const {
|
|
3251
|
+
const { process, $themes } = options;
|
|
3338
3252
|
const platform = "css";
|
|
3339
3253
|
const tokenSets = process === "format" ? options.tokenSets : void 0;
|
|
3340
3254
|
const tokensDir = process === "build" ? options.tokensDir : void 0;
|
|
@@ -3435,36 +3349,118 @@ ${colors.map((color) => ` ${color}: never;`).join("\n")}
|
|
|
3435
3349
|
return typeDeclaration;
|
|
3436
3350
|
}
|
|
3437
3351
|
|
|
3438
|
-
// src/tokens/
|
|
3439
|
-
|
|
3440
|
-
|
|
3441
|
-
|
|
3442
|
-
|
|
3443
|
-
|
|
3444
|
-
|
|
3445
|
-
|
|
3446
|
-
|
|
3447
|
-
|
|
3448
|
-
|
|
3449
|
-
|
|
3450
|
-
|
|
3451
|
-
|
|
3452
|
-
|
|
3453
|
-
|
|
3454
|
-
}
|
|
3455
|
-
|
|
3456
|
-
|
|
3457
|
-
|
|
3458
|
-
|
|
3459
|
-
|
|
3460
|
-
|
|
3352
|
+
// src/tokens/process/theme.ts
|
|
3353
|
+
import * as R19 from "ramda";
|
|
3354
|
+
import chalk3 from "chalk";
|
|
3355
|
+
|
|
3356
|
+
// package.json
|
|
3357
|
+
var package_default = {
|
|
3358
|
+
name: "@digdir/designsystemet",
|
|
3359
|
+
version: "1.0.6",
|
|
3360
|
+
description: "CLI for Designsystemet",
|
|
3361
|
+
author: "Designsystemet team",
|
|
3362
|
+
engines: {
|
|
3363
|
+
node: ">=22.15.0"
|
|
3364
|
+
},
|
|
3365
|
+
repository: {
|
|
3366
|
+
type: "git",
|
|
3367
|
+
url: "git+https://github.com/digdir/designsystemet.git"
|
|
3368
|
+
},
|
|
3369
|
+
homepage: "https://github.com/digdir/designsystemet/tree/main/scripts/cli",
|
|
3370
|
+
license: "MIT",
|
|
3371
|
+
type: "module",
|
|
3372
|
+
main: "./dist/src/index.js",
|
|
3373
|
+
files: [
|
|
3374
|
+
"./dist/**"
|
|
3375
|
+
],
|
|
3376
|
+
bin: "dist/bin/designsystemet.js",
|
|
3377
|
+
exports: {
|
|
3378
|
+
".": {
|
|
3379
|
+
import: "./dist/src/index.js"
|
|
3380
|
+
},
|
|
3381
|
+
"./color": {
|
|
3382
|
+
import: "./dist/src/colors/index.js"
|
|
3383
|
+
},
|
|
3384
|
+
"./tokens": {
|
|
3385
|
+
import: "./dist/src/tokens/index.js"
|
|
3386
|
+
}
|
|
3387
|
+
},
|
|
3388
|
+
publishConfig: {
|
|
3389
|
+
access: "public"
|
|
3390
|
+
},
|
|
3391
|
+
scripts: {
|
|
3392
|
+
designsystemet: "tsx ./bin/designsystemet.ts",
|
|
3393
|
+
"build:tokens": "pnpm run designsystemet tokens build -p -t ../../design-tokens -o ../../packages/theme/brand --clean",
|
|
3394
|
+
"build:tokens:debug": "tsx --inspect-brk ./bin/designsystemet.ts tokens build -p -t ../../design-tokens -o ../../packages/theme/brand --clean",
|
|
3395
|
+
build: "tsup && pnpm build:types && pnpm build:json-schema",
|
|
3396
|
+
"build:types": "tsc --emitDeclarationOnly --declaration",
|
|
3397
|
+
"build:json-schema": "tsx ./src/scripts/createJsonSchema.ts",
|
|
3398
|
+
types: "tsc --noEmit",
|
|
3399
|
+
"test:tokens-create-options": 'pnpm run designsystemet tokens create -m dominant:"#007682" -n "#003333" -b 99 -o ./test-tokens/options --theme options --clean',
|
|
3400
|
+
"test:tokens-create-config": "pnpm run designsystemet tokens create --config ./test/test-tokens.config.json",
|
|
3401
|
+
"test:tokens-build": "pnpm run designsystemet tokens build -t ./test-tokens/options -o ./test-tokens/options-build --clean",
|
|
3402
|
+
"test:tokens-build-config": "pnpm run designsystemet tokens build -t ./test-tokens/config -o ./test-tokens/config-build --clean",
|
|
3403
|
+
"test:tokens-create-and-build-options": "pnpm test:tokens-create-options && pnpm test:tokens-build",
|
|
3404
|
+
"test:tokens-create-and-build-config": "pnpm test:tokens-create-config && pnpm test:tokens-build-config",
|
|
3405
|
+
test: "pnpm test:tokens-create-and-build-options && pnpm test:tokens-create-and-build-config",
|
|
3406
|
+
"internal:tokens-create": "pnpm run designsystemet tokens create --config ./internal.config.json",
|
|
3407
|
+
"update:template": "tsx ./src/scripts/update-template.ts",
|
|
3408
|
+
"update:design-tokens": "pnpm internal:tokens-create && tsx ./src/scripts/update-design-tokens.ts",
|
|
3409
|
+
verify: "pnpm test && pnpm update:template && pnpm update:design-tokens"
|
|
3410
|
+
},
|
|
3411
|
+
dependencies: {
|
|
3412
|
+
"@commander-js/extra-typings": "^13.1.0",
|
|
3413
|
+
"@tokens-studio/sd-transforms": "1.3.0",
|
|
3414
|
+
"apca-w3": "^0.1.9",
|
|
3415
|
+
chalk: "^5.4.1",
|
|
3416
|
+
"change-case": "^5.4.4",
|
|
3417
|
+
"chroma-js": "^3.1.2",
|
|
3418
|
+
"colorjs.io": "^0.6.0-alpha.1",
|
|
3419
|
+
commander: "^13.1.0",
|
|
3420
|
+
"fast-glob": "^3.3.3",
|
|
3421
|
+
hsluv: "^1.0.1",
|
|
3422
|
+
"object-hash": "^3.0.0",
|
|
3423
|
+
postcss: "^8.5.3",
|
|
3424
|
+
ramda: "^0.30.1",
|
|
3425
|
+
"style-dictionary": "^4.4.0",
|
|
3426
|
+
zod: "^3.24.4",
|
|
3427
|
+
"zod-validation-error": "^3.4.0"
|
|
3428
|
+
},
|
|
3429
|
+
devDependencies: {
|
|
3430
|
+
"@tokens-studio/types": "0.5.2",
|
|
3431
|
+
"@types/apca-w3": "^0.1.3",
|
|
3432
|
+
"@types/chroma-js": "^3.1.1",
|
|
3433
|
+
"@types/fs-extra": "^11.0.4",
|
|
3434
|
+
"@types/glob": "^8.1.0",
|
|
3435
|
+
"@types/jscodeshift": "^0.12.0",
|
|
3436
|
+
"@types/node": "^22.15.3",
|
|
3437
|
+
"@types/object-hash": "^3.0.6",
|
|
3438
|
+
"@types/ramda": "^0.30.2",
|
|
3439
|
+
"fs-extra": "^11.3.0",
|
|
3440
|
+
"ts-toolbelt": "^9.6.0",
|
|
3441
|
+
tslib: "^2.8.1",
|
|
3442
|
+
tsup: "^8.4.0",
|
|
3443
|
+
tsx: "^4.19.4",
|
|
3444
|
+
typescript: "^5.8.3",
|
|
3445
|
+
"zod-to-json-schema": "^3.24.5"
|
|
3446
|
+
}
|
|
3461
3447
|
};
|
|
3462
|
-
|
|
3448
|
+
|
|
3449
|
+
// src/tokens/process/theme.ts
|
|
3450
|
+
var defaultFileHeader = `build: v${package_default.version}`;
|
|
3451
|
+
var createThemeCSSFiles = ({
|
|
3452
|
+
processedBuilds,
|
|
3453
|
+
fileHeader: fileHeader2 = defaultFileHeader
|
|
3454
|
+
}) => {
|
|
3463
3455
|
const groupedByTheme = {};
|
|
3464
3456
|
for (const [_, buildResults] of Object.entries(R19.dissoc("types", processedBuilds))) {
|
|
3465
3457
|
for (const buildResult of buildResults) {
|
|
3466
|
-
const
|
|
3467
|
-
|
|
3458
|
+
const themeName = buildResult.permutation.theme;
|
|
3459
|
+
const newOutputs = buildResult.formatted;
|
|
3460
|
+
if (R19.isNotEmpty(newOutputs)) {
|
|
3461
|
+
const currentOutputs = groupedByTheme[themeName] ?? [];
|
|
3462
|
+
groupedByTheme[themeName] = R19.concat(currentOutputs, newOutputs);
|
|
3463
|
+
}
|
|
3468
3464
|
}
|
|
3469
3465
|
}
|
|
3470
3466
|
const sortOrder = [
|
|
@@ -3503,7 +3499,9 @@ order may change due to nondeterminism.`.trim()
|
|
|
3503
3499
|
|
|
3504
3500
|
@layer ds.theme, ds.base, ds.utilities, ds.components;
|
|
3505
3501
|
|
|
3506
|
-
/*
|
|
3502
|
+
/*
|
|
3503
|
+
${fileHeader2}
|
|
3504
|
+
*/
|
|
3507
3505
|
|
|
3508
3506
|
`;
|
|
3509
3507
|
const sortAlphabetically = R19.sort(R19.ascend((x) => x.destination || ""));
|
|
@@ -3521,6 +3519,31 @@ order may change due to nondeterminism.`.trim()
|
|
|
3521
3519
|
}));
|
|
3522
3520
|
return themeCSSFiles;
|
|
3523
3521
|
};
|
|
3522
|
+
|
|
3523
|
+
// src/tokens/format.ts
|
|
3524
|
+
var formatTokens = async (options) => {
|
|
3525
|
+
const processedBuilds = await processPlatform({
|
|
3526
|
+
process: "format",
|
|
3527
|
+
...options
|
|
3528
|
+
});
|
|
3529
|
+
return processedBuilds;
|
|
3530
|
+
};
|
|
3531
|
+
var formatTheme = async (themeConfig) => {
|
|
3532
|
+
const { tokenSets } = await createTokens(themeConfig);
|
|
3533
|
+
const $themes = await generate$Themes(["dark", "light"], [themeConfig.name], themeConfig.colors);
|
|
3534
|
+
const processedBuilds = await formatTokens({
|
|
3535
|
+
tokenSets,
|
|
3536
|
+
$themes,
|
|
3537
|
+
verbose: false,
|
|
3538
|
+
preview: false
|
|
3539
|
+
});
|
|
3540
|
+
return processedBuilds;
|
|
3541
|
+
};
|
|
3542
|
+
var formatThemeCSS = async (themeConfig) => {
|
|
3543
|
+
const processedBuilds = await formatTheme(themeConfig);
|
|
3544
|
+
const themeCSSFiles = createThemeCSSFiles({ processedBuilds });
|
|
3545
|
+
return R20.head(themeCSSFiles)?.output ?? "";
|
|
3546
|
+
};
|
|
3524
3547
|
export {
|
|
3525
3548
|
cliOptions,
|
|
3526
3549
|
createTokens,
|
|
@@ -7,20 +7,24 @@ var mapToLowerCase = R.map(R.toLower);
|
|
|
7
7
|
var hasAnyTruth = R.any(R.equals(true));
|
|
8
8
|
var getType = (token) => (token.$type ?? token.type) || "";
|
|
9
9
|
var getValue = (token) => token.$value ?? token.value;
|
|
10
|
-
var typeEquals = R.curry(
|
|
11
|
-
|
|
12
|
-
|
|
10
|
+
var typeEquals = R.curry(
|
|
11
|
+
(types, token) => {
|
|
12
|
+
if (R.isNil(token)) {
|
|
13
|
+
return false;
|
|
14
|
+
}
|
|
15
|
+
return R.includes(R.toLower(getType(token)), R.map(R.toLower, Array.isArray(types) ? types : [types]));
|
|
13
16
|
}
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
17
|
+
);
|
|
18
|
+
var pathStartsWithOneOf = R.curry(
|
|
19
|
+
(paths, token) => {
|
|
20
|
+
if (R.isNil(token)) {
|
|
21
|
+
return false;
|
|
22
|
+
}
|
|
23
|
+
const tokenPath = mapToLowerCase(token.path);
|
|
24
|
+
const matchPathsStartingWith = R.map((path) => R.startsWith([path], tokenPath), mapToLowerCase(paths));
|
|
25
|
+
return hasAnyTruth(matchPathsStartingWith);
|
|
19
26
|
}
|
|
20
|
-
|
|
21
|
-
const matchPathsStartingWith = R.map((path) => R.startsWith([path], tokenPath), mapToLowerCase(paths));
|
|
22
|
-
return hasAnyTruth(matchPathsStartingWith);
|
|
23
|
-
});
|
|
27
|
+
);
|
|
24
28
|
function isSemanticToken(token) {
|
|
25
29
|
return token.filePath.includes("semantic/");
|
|
26
30
|
}
|
|
@@ -510,14 +514,14 @@ var typographyVariables = ({ theme, typography: typography2 }) => {
|
|
|
510
514
|
};
|
|
511
515
|
};
|
|
512
516
|
|
|
513
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/BoxShadowTypes.js
|
|
517
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/BoxShadowTypes.js
|
|
514
518
|
var BoxShadowTypes;
|
|
515
519
|
(function(BoxShadowTypes2) {
|
|
516
520
|
BoxShadowTypes2["DROP_SHADOW"] = "dropShadow";
|
|
517
521
|
BoxShadowTypes2["INNER_SHADOW"] = "innerShadow";
|
|
518
522
|
})(BoxShadowTypes || (BoxShadowTypes = {}));
|
|
519
523
|
|
|
520
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/ColorModifierTypes.js
|
|
524
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/ColorModifierTypes.js
|
|
521
525
|
var ColorModifierTypes;
|
|
522
526
|
(function(ColorModifierTypes2) {
|
|
523
527
|
ColorModifierTypes2["LIGHTEN"] = "lighten";
|
|
@@ -526,7 +530,7 @@ var ColorModifierTypes;
|
|
|
526
530
|
ColorModifierTypes2["ALPHA"] = "alpha";
|
|
527
531
|
})(ColorModifierTypes || (ColorModifierTypes = {}));
|
|
528
532
|
|
|
529
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/ColorSpaceTypes.js
|
|
533
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/ColorSpaceTypes.js
|
|
530
534
|
var ColorSpaceTypes;
|
|
531
535
|
(function(ColorSpaceTypes2) {
|
|
532
536
|
ColorSpaceTypes2["LCH"] = "lch";
|
|
@@ -535,7 +539,7 @@ var ColorSpaceTypes;
|
|
|
535
539
|
ColorSpaceTypes2["HSL"] = "hsl";
|
|
536
540
|
})(ColorSpaceTypes || (ColorSpaceTypes = {}));
|
|
537
541
|
|
|
538
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/Properties.js
|
|
542
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/Properties.js
|
|
539
543
|
var Properties;
|
|
540
544
|
(function(Properties2) {
|
|
541
545
|
Properties2["sizing"] = "sizing";
|
|
@@ -587,7 +591,7 @@ var Properties;
|
|
|
587
591
|
Properties2["description"] = "description";
|
|
588
592
|
})(Properties || (Properties = {}));
|
|
589
593
|
|
|
590
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/TokenSetStatus.js
|
|
594
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/TokenSetStatus.js
|
|
591
595
|
var TokenSetStatus;
|
|
592
596
|
(function(TokenSetStatus2) {
|
|
593
597
|
TokenSetStatus2["DISABLED"] = "disabled";
|
|
@@ -595,7 +599,7 @@ var TokenSetStatus;
|
|
|
595
599
|
TokenSetStatus2["ENABLED"] = "enabled";
|
|
596
600
|
})(TokenSetStatus || (TokenSetStatus = {}));
|
|
597
601
|
|
|
598
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/TokenTypes.js
|
|
602
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/TokenTypes.js
|
|
599
603
|
var TokenTypes;
|
|
600
604
|
(function(TokenTypes2) {
|
|
601
605
|
TokenTypes2["OTHER"] = "other";
|
|
@@ -626,7 +630,7 @@ var TokenTypes;
|
|
|
626
630
|
TokenTypes2["NUMBER"] = "number";
|
|
627
631
|
})(TokenTypes || (TokenTypes = {}));
|
|
628
632
|
|
|
629
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/BorderValues.js
|
|
633
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/BorderValues.js
|
|
630
634
|
var BorderValues;
|
|
631
635
|
(function(BorderValues2) {
|
|
632
636
|
BorderValues2["BORDER_COLOR"] = "color";
|
|
@@ -634,7 +638,7 @@ var BorderValues;
|
|
|
634
638
|
BorderValues2["BORDER_STYLE"] = "style";
|
|
635
639
|
})(BorderValues || (BorderValues = {}));
|
|
636
640
|
|
|
637
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/StrokeStyleValues.js
|
|
641
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/StrokeStyleValues.js
|
|
638
642
|
var StrokeStyleValues;
|
|
639
643
|
(function(StrokeStyleValues2) {
|
|
640
644
|
StrokeStyleValues2["SOLID"] = "solid";
|
|
@@ -647,7 +651,7 @@ var StrokeStyleValues;
|
|
|
647
651
|
StrokeStyleValues2["INSET"] = "inset";
|
|
648
652
|
})(StrokeStyleValues || (StrokeStyleValues = {}));
|
|
649
653
|
|
|
650
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/BoxShadowValues.js
|
|
654
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/BoxShadowValues.js
|
|
651
655
|
var BoxShadowValues;
|
|
652
656
|
(function(BoxShadowValues2) {
|
|
653
657
|
BoxShadowValues2["TYPE"] = "type";
|
|
@@ -659,7 +663,7 @@ var BoxShadowValues;
|
|
|
659
663
|
BoxShadowValues2["BLEND_MODE"] = "blendMode";
|
|
660
664
|
})(BoxShadowValues || (BoxShadowValues = {}));
|
|
661
665
|
|
|
662
|
-
// ../../node_modules/@tokens-studio/types/dist/constants/TypographyValues.js
|
|
666
|
+
// ../../node_modules/.pnpm/@tokens-studio+types@0.5.2/node_modules/@tokens-studio/types/dist/constants/TypographyValues.js
|
|
663
667
|
var TypographyValues;
|
|
664
668
|
(function(TypographyValues2) {
|
|
665
669
|
TypographyValues2["FONT_FAMILY"] = "fontFamily";
|
|
@@ -8,20 +8,24 @@ var mapToLowerCase = R.map(R.toLower);
|
|
|
8
8
|
var hasAnyTruth = R.any(R.equals(true));
|
|
9
9
|
var getType = (token) => (token.$type ?? token.type) || "";
|
|
10
10
|
var getValue = (token) => token.$value ?? token.value;
|
|
11
|
-
var typeEquals = R.curry(
|
|
12
|
-
|
|
13
|
-
|
|
11
|
+
var typeEquals = R.curry(
|
|
12
|
+
(types, token) => {
|
|
13
|
+
if (R.isNil(token)) {
|
|
14
|
+
return false;
|
|
15
|
+
}
|
|
16
|
+
return R.includes(R.toLower(getType(token)), R.map(R.toLower, Array.isArray(types) ? types : [types]));
|
|
14
17
|
}
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
18
|
+
);
|
|
19
|
+
var pathStartsWithOneOf = R.curry(
|
|
20
|
+
(paths, token) => {
|
|
21
|
+
if (R.isNil(token)) {
|
|
22
|
+
return false;
|
|
23
|
+
}
|
|
24
|
+
const tokenPath = mapToLowerCase(token.path);
|
|
25
|
+
const matchPathsStartingWith = R.map((path) => R.startsWith([path], tokenPath), mapToLowerCase(paths));
|
|
26
|
+
return hasAnyTruth(matchPathsStartingWith);
|
|
20
27
|
}
|
|
21
|
-
|
|
22
|
-
const matchPathsStartingWith = R.map((path) => R.startsWith([path], tokenPath), mapToLowerCase(paths));
|
|
23
|
-
return hasAnyTruth(matchPathsStartingWith);
|
|
24
|
-
});
|
|
28
|
+
);
|
|
25
29
|
function isSemanticToken(token) {
|
|
26
30
|
return token.filePath.includes("semantic/");
|
|
27
31
|
}
|
|
@@ -8,20 +8,24 @@ var mapToLowerCase = R.map(R.toLower);
|
|
|
8
8
|
var hasAnyTruth = R.any(R.equals(true));
|
|
9
9
|
var getType = (token) => (token.$type ?? token.type) || "";
|
|
10
10
|
var getValue = (token) => token.$value ?? token.value;
|
|
11
|
-
var typeEquals = R.curry(
|
|
12
|
-
|
|
13
|
-
|
|
11
|
+
var typeEquals = R.curry(
|
|
12
|
+
(types, token) => {
|
|
13
|
+
if (R.isNil(token)) {
|
|
14
|
+
return false;
|
|
15
|
+
}
|
|
16
|
+
return R.includes(R.toLower(getType(token)), R.map(R.toLower, Array.isArray(types) ? types : [types]));
|
|
14
17
|
}
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
18
|
+
);
|
|
19
|
+
var pathStartsWithOneOf = R.curry(
|
|
20
|
+
(paths, token) => {
|
|
21
|
+
if (R.isNil(token)) {
|
|
22
|
+
return false;
|
|
23
|
+
}
|
|
24
|
+
const tokenPath = mapToLowerCase(token.path);
|
|
25
|
+
const matchPathsStartingWith = R.map((path) => R.startsWith([path], tokenPath), mapToLowerCase(paths));
|
|
26
|
+
return hasAnyTruth(matchPathsStartingWith);
|
|
20
27
|
}
|
|
21
|
-
|
|
22
|
-
const matchPathsStartingWith = R.map((path) => R.startsWith([path], tokenPath), mapToLowerCase(paths));
|
|
23
|
-
return hasAnyTruth(matchPathsStartingWith);
|
|
24
|
-
});
|
|
28
|
+
);
|
|
25
29
|
|
|
26
30
|
// src/tokens/process/transformers.ts
|
|
27
31
|
var isPx = R2.test(/\b\d+px\b/g);
|
|
@@ -8,20 +8,24 @@ var mapToLowerCase = R.map(R.toLower);
|
|
|
8
8
|
var hasAnyTruth = R.any(R.equals(true));
|
|
9
9
|
var getType = (token) => (token.$type ?? token.type) || "";
|
|
10
10
|
var getValue = (token) => token.$value ?? token.value;
|
|
11
|
-
var typeEquals = R.curry(
|
|
12
|
-
|
|
13
|
-
|
|
11
|
+
var typeEquals = R.curry(
|
|
12
|
+
(types, token) => {
|
|
13
|
+
if (R.isNil(token)) {
|
|
14
|
+
return false;
|
|
15
|
+
}
|
|
16
|
+
return R.includes(R.toLower(getType(token)), R.map(R.toLower, Array.isArray(types) ? types : [types]));
|
|
14
17
|
}
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
18
|
+
);
|
|
19
|
+
var pathStartsWithOneOf = R.curry(
|
|
20
|
+
(paths, token) => {
|
|
21
|
+
if (R.isNil(token)) {
|
|
22
|
+
return false;
|
|
23
|
+
}
|
|
24
|
+
const tokenPath = mapToLowerCase(token.path);
|
|
25
|
+
const matchPathsStartingWith = R.map((path) => R.startsWith([path], tokenPath), mapToLowerCase(paths));
|
|
26
|
+
return hasAnyTruth(matchPathsStartingWith);
|
|
20
27
|
}
|
|
21
|
-
|
|
22
|
-
const matchPathsStartingWith = R.map((path) => R.startsWith([path], tokenPath), mapToLowerCase(paths));
|
|
23
|
-
return hasAnyTruth(matchPathsStartingWith);
|
|
24
|
-
});
|
|
28
|
+
);
|
|
25
29
|
function isColorCategoryToken(token, category) {
|
|
26
30
|
if (!category) {
|
|
27
31
|
return ["main", "support"].some((c) => isColorCategoryToken(token, c));
|