@navikt/aksel 7.34.0 → 7.35.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.
- package/README.md +96 -2
- package/dist/codemod/codeshift.utils.js +9 -1
- package/dist/codemod/migrations.js +75 -22
- package/dist/codemod/run-codeshift.js +14 -3
- package/dist/codemod/transforms/v8.0.0/accordion-variant/accordion-variant.js +16 -0
- package/dist/codemod/transforms/{darkside/box-to-boxnew/box-to-boxnew.js → v8.0.0/box/box.js} +80 -100
- package/dist/codemod/transforms/v8.0.0/box-new/box-new.js +91 -0
- package/dist/codemod/transforms/v8.0.0/chips-variant/chips-variant.js +31 -0
- package/dist/codemod/transforms/v8.0.0/list/list.js +218 -0
- package/dist/codemod/transforms/{darkside → v8.0.0}/prop-deprecate/prop-deprecate.js +1 -1
- package/dist/codemod/transforms/v8.0.0/tag-variant/tag-variant.js +38 -0
- package/dist/codemod/transforms/v8.0.0/toggle-group-variant/toggle-group-variant.js +16 -0
- package/dist/codemod/utils/ast.js +1 -1
- package/dist/codemod/utils/check.js +35 -0
- package/dist/codemod/utils/move-variant-to-data-color.js +120 -0
- package/dist/darkside/index.js +3 -9
- package/dist/darkside/run-tooling.js +138 -42
- package/dist/darkside/tasks/print-remaining.js +143 -38
- package/dist/darkside/tasks/status.js +147 -30
- package/dist/darkside/transforms/darkside-tokens-css.js +23 -8
- package/dist/darkside/transforms/darkside-tokens-tailwind.js +9 -10
- package/dist/help.js +0 -10
- package/dist/index.js +14 -17
- package/package.json +7 -7
- package/dist/css-imports/config.js +0 -5
- package/dist/css-imports/generate-output.js +0 -147
- package/dist/css-imports/get-directories.js +0 -34
- package/dist/css-imports/get-version.js +0 -28
- package/dist/css-imports/index.js +0 -187
- package/dist/css-imports/inquiry.js +0 -35
- package/dist/css-imports/scan-code.js +0 -45
- /package/dist/codemod/transforms/{spacing → v8.0.0}/primitives-spacing/spacing.js +0 -0
- /package/dist/codemod/transforms/{spacing → v8.0.0}/spacing.utils.js +0 -0
- /package/dist/codemod/transforms/{spacing → v8.0.0}/token-spacing/spacing.js +0 -0
- /package/dist/codemod/transforms/{spacing → v8.0.0}/token-spacing-js/spacing.js +0 -0
|
@@ -4,13 +4,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
exports.getStatus = getStatus;
|
|
7
|
+
exports.getCharacterPositionInFile = getCharacterPositionInFile;
|
|
8
|
+
exports.getLineStarts = getLineStarts;
|
|
7
9
|
const cli_progress_1 = __importDefault(require("cli-progress"));
|
|
8
10
|
const node_fs_1 = __importDefault(require("node:fs"));
|
|
11
|
+
const translate_token_1 = require("../../codemod/utils/translate-token");
|
|
9
12
|
const TokenStatus_1 = require("../config/TokenStatus");
|
|
10
13
|
const darkside_tokens_1 = require("../config/darkside.tokens");
|
|
11
14
|
const legacy_component_tokens_1 = require("../config/legacy-component.tokens");
|
|
12
15
|
const legacy_tokens_1 = require("../config/legacy.tokens");
|
|
13
|
-
const token_regex_1 = require("../config/token-regex");
|
|
14
16
|
const StatusStore = new TokenStatus_1.TokenStatus();
|
|
15
17
|
/**
|
|
16
18
|
* Get the status of the tokens in the files
|
|
@@ -25,13 +27,57 @@ function getStatus(files, action = "print") {
|
|
|
25
27
|
progressBar.start(files.length, 0);
|
|
26
28
|
}
|
|
27
29
|
StatusStore.initStatus();
|
|
30
|
+
/**
|
|
31
|
+
* Prepare search terms for legacy and darkside tokens.
|
|
32
|
+
* By pre-computing these sets, we save re-calculating them for each file,
|
|
33
|
+
* improving performance when processing large numbers of files.
|
|
34
|
+
*/
|
|
35
|
+
const legacySearchTerms = getLegacySearchTerms();
|
|
36
|
+
const darksideSearchTerms = getDarksideSearchTerms();
|
|
37
|
+
const legacyComponentTokensSet = new Set(legacy_component_tokens_1.legacyComponentTokenList);
|
|
38
|
+
/**
|
|
39
|
+
* Pre-computed regex for legacy component tokens
|
|
40
|
+
*/
|
|
41
|
+
const legacyRegex = new RegExp(`(${legacy_component_tokens_1.legacyComponentTokenList.map((t) => `${t}:`).join("|")})`, "gm");
|
|
42
|
+
/**
|
|
43
|
+
* Process each file to find and record token usages
|
|
44
|
+
*/
|
|
28
45
|
files.forEach((fileName, index) => {
|
|
29
46
|
const fileSrc = node_fs_1.default.readFileSync(fileName, "utf8");
|
|
47
|
+
/**
|
|
48
|
+
* Create a set of all words in the file to quickly check for potential matches
|
|
49
|
+
*/
|
|
50
|
+
const fileWords = new Set(fileSrc.match(/[a-zA-Z0-9_@$-]+/g) || []);
|
|
51
|
+
let lineStarts;
|
|
52
|
+
/**
|
|
53
|
+
* Gets line-start positions for the file, caching the result.
|
|
54
|
+
* We only calculate this if we actually find a token match, saving processing time.
|
|
55
|
+
*/
|
|
56
|
+
const getLineStartsLazy = () => {
|
|
57
|
+
if (!lineStarts) {
|
|
58
|
+
lineStarts = getLineStarts(fileSrc);
|
|
59
|
+
}
|
|
60
|
+
return lineStarts;
|
|
61
|
+
};
|
|
30
62
|
/**
|
|
31
63
|
* We first parse trough all legacy tokens (--a-) prefixed tokens
|
|
32
64
|
*/
|
|
33
65
|
for (const [legacyToken, config] of Object.entries(legacy_tokens_1.legacyTokenConfig)) {
|
|
34
|
-
|
|
66
|
+
const terms = legacySearchTerms.get(legacyToken);
|
|
67
|
+
/**
|
|
68
|
+
* Optimization: Check if any of the search terms exist in the file words set
|
|
69
|
+
* before running expensive regex operations.
|
|
70
|
+
*/
|
|
71
|
+
let found = false;
|
|
72
|
+
if (terms) {
|
|
73
|
+
for (const term of terms) {
|
|
74
|
+
if (fileWords.has(term)) {
|
|
75
|
+
found = true;
|
|
76
|
+
break;
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
if (!found) {
|
|
35
81
|
continue;
|
|
36
82
|
}
|
|
37
83
|
for (const [regexKey, regex] of Object.entries(config.regexes)) {
|
|
@@ -40,7 +86,7 @@ function getStatus(files, action = "print") {
|
|
|
40
86
|
}
|
|
41
87
|
let match = regex.exec(fileSrc);
|
|
42
88
|
while (match) {
|
|
43
|
-
const { row, column } =
|
|
89
|
+
const { row, column } = getCharacterPositionInFile(match.index, getLineStartsLazy());
|
|
44
90
|
StatusStore.add({
|
|
45
91
|
isLegacy: true,
|
|
46
92
|
comment: config.comment,
|
|
@@ -57,23 +103,43 @@ function getStatus(files, action = "print") {
|
|
|
57
103
|
}
|
|
58
104
|
}
|
|
59
105
|
}
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
106
|
+
let hasLegacyComponentToken = false;
|
|
107
|
+
for (const token of legacyComponentTokensSet) {
|
|
108
|
+
if (fileWords.has(token)) {
|
|
109
|
+
hasLegacyComponentToken = true;
|
|
110
|
+
break;
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
if (hasLegacyComponentToken) {
|
|
114
|
+
legacyRegex.lastIndex = 0;
|
|
115
|
+
let legacyMatch = legacyRegex.exec(fileSrc);
|
|
116
|
+
while (legacyMatch !== null) {
|
|
117
|
+
const { row, column } = getCharacterPositionInFile(legacyMatch.index, getLineStartsLazy());
|
|
118
|
+
StatusStore.add({
|
|
119
|
+
isLegacy: true,
|
|
120
|
+
type: "component",
|
|
121
|
+
columnNumber: column,
|
|
122
|
+
lineNumber: row,
|
|
123
|
+
canAutoMigrate: false,
|
|
124
|
+
fileName,
|
|
125
|
+
name: legacyMatch[0],
|
|
126
|
+
});
|
|
127
|
+
legacyMatch = legacyRegex.exec(fileSrc);
|
|
128
|
+
}
|
|
74
129
|
}
|
|
75
130
|
for (const [newTokenName, config] of Object.entries(darkside_tokens_1.darksideTokenConfig)) {
|
|
76
|
-
|
|
131
|
+
const terms = darksideSearchTerms.get(newTokenName);
|
|
132
|
+
/* Optimization: Check if any of the search terms exist in the file words set */
|
|
133
|
+
let found = false;
|
|
134
|
+
if (terms) {
|
|
135
|
+
for (const term of terms) {
|
|
136
|
+
if (fileWords.has(term)) {
|
|
137
|
+
found = true;
|
|
138
|
+
break;
|
|
139
|
+
}
|
|
140
|
+
}
|
|
141
|
+
}
|
|
142
|
+
if (!found) {
|
|
77
143
|
continue;
|
|
78
144
|
}
|
|
79
145
|
for (const [regexKey, regex] of Object.entries(config.regexes)) {
|
|
@@ -82,7 +148,7 @@ function getStatus(files, action = "print") {
|
|
|
82
148
|
}
|
|
83
149
|
let match = regex.exec(fileSrc);
|
|
84
150
|
while (match) {
|
|
85
|
-
const { row, column } =
|
|
151
|
+
const { row, column } = getCharacterPositionInFile(match.index, getLineStartsLazy());
|
|
86
152
|
StatusStore.add({
|
|
87
153
|
isLegacy: false,
|
|
88
154
|
type: regexKey,
|
|
@@ -109,17 +175,68 @@ function getStatus(files, action = "print") {
|
|
|
109
175
|
console.info("\n");
|
|
110
176
|
return StatusStore;
|
|
111
177
|
}
|
|
112
|
-
function
|
|
113
|
-
const
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
178
|
+
function getLegacySearchTerms() {
|
|
179
|
+
const legacySearchTerms = new Map();
|
|
180
|
+
for (const [legacyToken, config] of Object.entries(legacy_tokens_1.legacyTokenConfig)) {
|
|
181
|
+
const terms = new Set();
|
|
182
|
+
const tokenName = `--a-${legacyToken}`;
|
|
183
|
+
terms.add(tokenName);
|
|
184
|
+
terms.add((0, translate_token_1.translateToken)(tokenName, "scss"));
|
|
185
|
+
terms.add((0, translate_token_1.translateToken)(tokenName, "less"));
|
|
186
|
+
terms.add((0, translate_token_1.translateToken)(tokenName, "js"));
|
|
187
|
+
if (config.twOld) {
|
|
188
|
+
config.twOld.split(",").forEach((t) => terms.add(t.trim()));
|
|
189
|
+
}
|
|
190
|
+
legacySearchTerms.set(legacyToken, terms);
|
|
191
|
+
}
|
|
192
|
+
return legacySearchTerms;
|
|
193
|
+
}
|
|
194
|
+
function getDarksideSearchTerms() {
|
|
195
|
+
const darksideSearchTerms = new Map();
|
|
196
|
+
for (const [newTokenName, config] of Object.entries(darkside_tokens_1.darksideTokenConfig)) {
|
|
197
|
+
const terms = new Set();
|
|
198
|
+
const tokenName = `--ax-${newTokenName}`;
|
|
199
|
+
terms.add(tokenName);
|
|
200
|
+
terms.add((0, translate_token_1.translateToken)(tokenName, "scss"));
|
|
201
|
+
terms.add((0, translate_token_1.translateToken)(tokenName, "less"));
|
|
202
|
+
terms.add((0, translate_token_1.translateToken)(newTokenName, "js"));
|
|
203
|
+
terms.add(newTokenName);
|
|
204
|
+
if (config.tw) {
|
|
205
|
+
config.tw.split(",").forEach((t) => terms.add(t.trim()));
|
|
206
|
+
}
|
|
207
|
+
darksideSearchTerms.set(newTokenName, terms);
|
|
208
|
+
}
|
|
209
|
+
return darksideSearchTerms;
|
|
210
|
+
}
|
|
211
|
+
/**
|
|
212
|
+
* Given the content of a file, returns an array of line start positions.
|
|
213
|
+
*/
|
|
214
|
+
function getLineStarts(content) {
|
|
215
|
+
const starts = [0];
|
|
216
|
+
let lineIndex = content.indexOf("\n", 0);
|
|
217
|
+
while (lineIndex !== -1) {
|
|
218
|
+
starts.push(lineIndex + 1);
|
|
219
|
+
lineIndex = content.indexOf("\n", lineIndex + 1);
|
|
220
|
+
}
|
|
221
|
+
return starts;
|
|
222
|
+
}
|
|
223
|
+
/**
|
|
224
|
+
* Given a character index and an array of line start positions,
|
|
225
|
+
* returns the corresponding row and column numbers.
|
|
226
|
+
*/
|
|
227
|
+
function getCharacterPositionInFile(index, lineStarts) {
|
|
228
|
+
let low = 0;
|
|
229
|
+
let high = lineStarts.length - 1;
|
|
230
|
+
let lineIndex = 0;
|
|
231
|
+
while (low <= high) {
|
|
232
|
+
const mid = (low + high) >>> 1;
|
|
233
|
+
if (lineStarts[mid] <= index) {
|
|
234
|
+
lineIndex = mid;
|
|
235
|
+
low = mid + 1;
|
|
236
|
+
}
|
|
237
|
+
else {
|
|
238
|
+
high = mid - 1;
|
|
120
239
|
}
|
|
121
|
-
charCount += lineLength;
|
|
122
|
-
lineNumber++;
|
|
123
240
|
}
|
|
124
|
-
return { row:
|
|
241
|
+
return { row: lineIndex + 1, column: index - lineStarts[lineIndex] + 1 };
|
|
125
242
|
}
|
|
@@ -4,14 +4,29 @@ exports.default = transformer;
|
|
|
4
4
|
const legacy_tokens_1 = require("../config/legacy.tokens");
|
|
5
5
|
function transformer(file) {
|
|
6
6
|
let src = file.source;
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
7
|
+
/*
|
|
8
|
+
1. Replace definitions: --a-token: -> --aksel-legacy__a-token:
|
|
9
|
+
Matches "--a-token" followed by optional whitespace and a colon.
|
|
10
|
+
Uses negative lookbehind to ensure we don't match "--not-a-token".
|
|
11
|
+
*/
|
|
12
|
+
src = src.replace(/(?<![\w-])(--a-[\w-]+)(\s*:)/g, (match, tokenName, suffix) => {
|
|
13
|
+
const key = tokenName.replace("--a-", "");
|
|
14
|
+
if (legacy_tokens_1.legacyTokenConfig[key]) {
|
|
15
|
+
return `--aksel-legacy${tokenName.replace("--", "__")}${suffix}`;
|
|
14
16
|
}
|
|
15
|
-
|
|
17
|
+
return match;
|
|
18
|
+
});
|
|
19
|
+
/*
|
|
20
|
+
2. Replace usages: --a-token -> --ax-replacement
|
|
21
|
+
Matches "--a-token" with word boundaries.
|
|
22
|
+
*/
|
|
23
|
+
src = src.replace(/(?<![\w-])(--a-[\w-]+)(?![\w-])/g, (match, tokenName) => {
|
|
24
|
+
const key = tokenName.replace("--a-", "");
|
|
25
|
+
const config = legacy_tokens_1.legacyTokenConfig[key];
|
|
26
|
+
if (config === null || config === void 0 ? void 0 : config.replacement) {
|
|
27
|
+
return `--ax-${config.replacement}`;
|
|
28
|
+
}
|
|
29
|
+
return match;
|
|
30
|
+
});
|
|
16
31
|
return src;
|
|
17
32
|
}
|
|
@@ -2,11 +2,10 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.default = transformer;
|
|
4
4
|
const legacy_tokens_1 = require("../config/legacy.tokens");
|
|
5
|
-
const token_regex_1 = require("../config/token-regex");
|
|
6
5
|
function transformer(file) {
|
|
7
6
|
let src = file.source;
|
|
8
7
|
for (const [name, config] of Object.entries(legacy_tokens_1.legacyTokenConfig)) {
|
|
9
|
-
if (!config.twOld || !config.twNew) {
|
|
8
|
+
if (!config.twOld || !config.twNew || !config.regexes.tailwind) {
|
|
10
9
|
continue;
|
|
11
10
|
}
|
|
12
11
|
const isBreakpoint = name.includes("breakpoint");
|
|
@@ -16,18 +15,18 @@ function transformer(file) {
|
|
|
16
15
|
}
|
|
17
16
|
const beforeSplit = config.twOld.split(",");
|
|
18
17
|
const afterSplit = config.twNew.split(",");
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
const
|
|
18
|
+
src = src.replace(config.regexes.tailwind, (match) => {
|
|
19
|
+
const trimmed = match.trim();
|
|
20
|
+
const cleanToken = trimmed.replace(":", "");
|
|
21
|
+
const index = beforeSplit.indexOf(cleanToken);
|
|
22
22
|
if (index >= 0) {
|
|
23
|
-
const withPrefix =
|
|
23
|
+
const withPrefix = trimmed.startsWith(":");
|
|
24
24
|
const addSpace = match.startsWith(" ");
|
|
25
25
|
const replacementToken = afterSplit[index];
|
|
26
|
-
|
|
27
|
-
? `:${replacementToken}`
|
|
28
|
-
: `${addSpace ? " " : ""}${replacementToken}`);
|
|
26
|
+
return `${addSpace ? " " : ""}${withPrefix ? ":" : ""}${replacementToken}`;
|
|
29
27
|
}
|
|
30
|
-
|
|
28
|
+
return match;
|
|
29
|
+
});
|
|
31
30
|
}
|
|
32
31
|
return src;
|
|
33
32
|
}
|
package/dist/help.js
CHANGED
|
@@ -13,18 +13,8 @@ function helpCommand() {
|
|
|
13
13
|
- ${chalk_1.default.blueBright("https://aksel.nav.no/grunnleggende/kode/kommandolinje")}
|
|
14
14
|
|
|
15
15
|
💻 Commands:
|
|
16
|
-
- ${chalk_1.default.cyan(`npx @navikt/aksel ${chalk_1.default.green("css-imports")}`)}
|
|
17
|
-
✔︎ Helps with CSS imports for all Aksel components
|
|
18
|
-
✔︎ Supports Static and CDN-imports
|
|
19
|
-
✔︎ Handles cascading, tailwind and @layer rules
|
|
20
|
-
|
|
21
16
|
- ${chalk_1.default.cyan(`npx @navikt/aksel ${chalk_1.default.green("codemod")} ${chalk_1.default.gray("<migration>")}`)}
|
|
22
17
|
✔︎ Code-transformations for breaking changes when updating Aksel
|
|
23
18
|
✔︎ Run with ${chalk_1.default.cyan(`${chalk_1.default.green("--help")}`)} to get started!
|
|
24
|
-
|
|
25
|
-
- ${chalk_1.default.cyan(`npx @navikt/aksel ${chalk_1.default.green("darkside")} ${chalk_1.default.gray("<task>")}`)}
|
|
26
|
-
✔︎ Tooling for migrating to the darkside
|
|
27
|
-
✔︎ Check current status and migrate tokens
|
|
28
|
-
✔︎ Run with ${chalk_1.default.cyan(`${chalk_1.default.green("--help")}`)} to get started!
|
|
29
19
|
`);
|
|
30
20
|
}
|
package/dist/index.js
CHANGED
|
@@ -14,35 +14,32 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
14
14
|
};
|
|
15
15
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
16
16
|
const chalk_1 = __importDefault(require("chalk"));
|
|
17
|
+
const commander_1 = require("commander");
|
|
17
18
|
const node_fs_1 = __importDefault(require("node:fs"));
|
|
18
19
|
const index_1 = require("./codemod/index");
|
|
19
|
-
const index_2 = require("./css-imports/index");
|
|
20
20
|
const darkside_1 = require("./darkside");
|
|
21
21
|
const help_1 = require("./help");
|
|
22
22
|
run();
|
|
23
23
|
function run() {
|
|
24
24
|
return __awaiter(this, void 0, void 0, function* () {
|
|
25
|
-
|
|
25
|
+
const pkg = JSON.parse(node_fs_1.default.readFileSync("./package.json").toString()).version;
|
|
26
|
+
const program = new commander_1.Command();
|
|
27
|
+
program.version(pkg, "-v, --version");
|
|
28
|
+
program.allowUnknownOption().helpOption(false);
|
|
29
|
+
program.parse();
|
|
30
|
+
const args = program.args;
|
|
31
|
+
if (args.length === 0 || args[0] === "help") {
|
|
26
32
|
(0, help_1.helpCommand)();
|
|
27
33
|
return;
|
|
28
34
|
}
|
|
29
|
-
if (
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
35
|
+
if (args[0] === "codemod") {
|
|
36
|
+
if (args.includes("v8-tokens")) {
|
|
37
|
+
(0, darkside_1.darksideCommand)();
|
|
38
|
+
return;
|
|
39
|
+
}
|
|
34
40
|
(0, index_1.codemodCommand)();
|
|
35
41
|
return;
|
|
36
42
|
}
|
|
37
|
-
|
|
38
|
-
(0, darkside_1.darksideCommand)();
|
|
39
|
-
return;
|
|
40
|
-
}
|
|
41
|
-
if (process.argv[2] === "-v" || process.argv[2] === "--version") {
|
|
42
|
-
const pkg = JSON.parse(node_fs_1.default.readFileSync("./package.json").toString()).version;
|
|
43
|
-
console.info(pkg);
|
|
44
|
-
return;
|
|
45
|
-
}
|
|
46
|
-
console.info(chalk_1.default.red(`Unknown command: ${process.argv[2]}.\nRun ${chalk_1.default.cyan("npx @navikt/aksel help")} for all available commands.`));
|
|
43
|
+
console.info(chalk_1.default.red(`Unknown command: ${args[0]}.\nRun ${chalk_1.default.cyan("npx @navikt/aksel help")} for all available commands.`));
|
|
47
44
|
});
|
|
48
45
|
}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@navikt/aksel",
|
|
3
|
-
"version": "7.
|
|
4
|
-
"description": "Aksel command line interface.
|
|
3
|
+
"version": "7.35.1",
|
|
4
|
+
"description": "Aksel command line interface. Codemods and other utilities for Aksel users.",
|
|
5
5
|
"author": "Aksel | Nav designsystem team",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"keywords": [
|
|
@@ -32,12 +32,12 @@
|
|
|
32
32
|
"url": "https://github.com/navikt/aksel/issues"
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
|
-
"@navikt/ds-css": "^7.
|
|
36
|
-
"@navikt/ds-tokens": "^7.
|
|
35
|
+
"@navikt/ds-css": "^7.35.1",
|
|
36
|
+
"@navikt/ds-tokens": "^7.35.1",
|
|
37
37
|
"axios": "1.13.2",
|
|
38
|
-
"chalk": "
|
|
38
|
+
"chalk": "5.6.2",
|
|
39
39
|
"cli-progress": "^3.12.0",
|
|
40
|
-
"clipboardy": "^
|
|
40
|
+
"clipboardy": "^5.0.0",
|
|
41
41
|
"commander": "10.0.1",
|
|
42
42
|
"enquirer": "^2.3.6",
|
|
43
43
|
"fast-glob": "3.2.11",
|
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
},
|
|
57
57
|
"sideEffects": false,
|
|
58
58
|
"engines": {
|
|
59
|
-
"node": ">=
|
|
59
|
+
"node": ">=20.0.0"
|
|
60
60
|
},
|
|
61
61
|
"publishConfig": {
|
|
62
62
|
"access": "public",
|
|
@@ -1,147 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
3
|
-
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
4
|
-
return new (P || (P = Promise))(function (resolve, reject) {
|
|
5
|
-
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
6
|
-
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
7
|
-
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
8
|
-
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
9
|
-
});
|
|
10
|
-
};
|
|
11
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
12
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
13
|
-
};
|
|
14
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
15
|
-
exports.generateImportOutput = generateImportOutput;
|
|
16
|
-
const chalk_1 = __importDefault(require("chalk"));
|
|
17
|
-
const clipboardy_1 = __importDefault(require("clipboardy"));
|
|
18
|
-
const lodash_1 = __importDefault(require("lodash"));
|
|
19
|
-
const _mappings_1 = require("@navikt/ds-css/config/_mappings");
|
|
20
|
-
const config_js_1 = require("./config.js");
|
|
21
|
-
const inquiry_1 = require("./inquiry");
|
|
22
|
-
function generateImportOutput(answers) {
|
|
23
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
24
|
-
const useCdn = answers.cdn === "yes";
|
|
25
|
-
const useTailwind = answers.tailwind === "yes";
|
|
26
|
-
const version = answers.version;
|
|
27
|
-
const imports = [];
|
|
28
|
-
let importStr = "";
|
|
29
|
-
yield (0, inquiry_1.inquiry)(answers, [
|
|
30
|
-
{
|
|
31
|
-
type: "select",
|
|
32
|
-
name: "output",
|
|
33
|
-
message: "Output format",
|
|
34
|
-
initial: "print-clipboard",
|
|
35
|
-
choices: [
|
|
36
|
-
{ message: "Clipboard & Print", name: "clipboard-print" },
|
|
37
|
-
{ message: "Clipboard", name: "clipboard" },
|
|
38
|
-
{ message: "Print", name: "print" },
|
|
39
|
-
],
|
|
40
|
-
},
|
|
41
|
-
]);
|
|
42
|
-
answers["config-type"] === "regular"
|
|
43
|
-
? imports.push(simpleOutput(useCdn, answers.layers === "yes", version))
|
|
44
|
-
: imports.push(...advancedOutput(answers, useCdn, answers.layers === "yes", version));
|
|
45
|
-
if (useTailwind) {
|
|
46
|
-
importStr = `@import "tailwindcss/base";
|
|
47
|
-
${imports.join("\n")}
|
|
48
|
-
|
|
49
|
-
@import "tailwindcss/components";
|
|
50
|
-
@import "tailwindcss/utilities";
|
|
51
|
-
`;
|
|
52
|
-
}
|
|
53
|
-
else {
|
|
54
|
-
importStr = imports.join("\n");
|
|
55
|
-
}
|
|
56
|
-
if (answers.output.includes("print")) {
|
|
57
|
-
console.info(chalk_1.default.bold.cyan(`\nImports 🚀 \n`));
|
|
58
|
-
console.info(chalk_1.default.green(`${importStr}`));
|
|
59
|
-
}
|
|
60
|
-
if (useCdn) {
|
|
61
|
-
console.info(chalk_1.default.bold.underline.cyan(`\nNotes on CDN-usage 📝`));
|
|
62
|
-
console.info(`We recommend using Static imports, then uploading the your bundled static-files to your own CDN-instance.
|
|
63
|
-
✔︎ This allows you to control the version of the CSS-files with package.json, and avoids desync between ds-react/ds-css.
|
|
64
|
-
✔︎ Remember to add 'https://cdn.nav.no' to your applications CSP!`);
|
|
65
|
-
}
|
|
66
|
-
if (useTailwind) {
|
|
67
|
-
console.info(chalk_1.default.bold.underline.cyan(`\nNotes on Tailwind-use 📝`));
|
|
68
|
-
console.info(`When using tailwind with Aksel, you will need to add the postcss plugin ${chalk_1.default.cyan("postcss-import")}
|
|
69
|
-
✔︎ NPM: https://www.npmjs.com/package/postcss-import
|
|
70
|
-
✔︎ Read more here: https://aksel.nav.no/grunnleggende/kode/tailwind`);
|
|
71
|
-
}
|
|
72
|
-
if (answers.layers === "yes") {
|
|
73
|
-
console.info(chalk_1.default.bold.underline.cyan(`\nNotes on Layers 📝`));
|
|
74
|
-
console.info(`Layers is not yet supported in Safari <= 15.3. (https://caniuse.com/css-cascade-layers)`);
|
|
75
|
-
}
|
|
76
|
-
answers.output.includes("clipboard") && clipboardy_1.default.writeSync(importStr);
|
|
77
|
-
});
|
|
78
|
-
}
|
|
79
|
-
function simpleOutput(cdn, layers, version) {
|
|
80
|
-
const options = {
|
|
81
|
-
static: `@import "@navikt/ds-css"${layers ? config_js_1.layerSuffix : ""};`,
|
|
82
|
-
cdn: toCdn("index.css", version),
|
|
83
|
-
};
|
|
84
|
-
return cdn ? options.cdn : options.static;
|
|
85
|
-
}
|
|
86
|
-
function advancedOutput(answers, cdn, layers, version) {
|
|
87
|
-
const imports = ["/* Defaults */"];
|
|
88
|
-
const baselineImports = answers.imports.filter((x) => !x.startsWith(config_js_1.ComponentPrefix) && x !== "default");
|
|
89
|
-
const componentImports = answers.imports
|
|
90
|
-
.filter((x) => x.startsWith(config_js_1.ComponentPrefix) && x !== "components")
|
|
91
|
-
.map((x) => x.replace(config_js_1.ComponentPrefix, ""));
|
|
92
|
-
baselineImports.forEach((x) => {
|
|
93
|
-
cdn
|
|
94
|
-
? imports.push(toCdn(`${_mappings_1.globalDir}/${x}.css`, version))
|
|
95
|
-
: imports.push(toCssImport(`${_mappings_1.globalDir}/${x}.css`, layers));
|
|
96
|
-
});
|
|
97
|
-
if (answers["config-type"] === "easy") {
|
|
98
|
-
cdn
|
|
99
|
-
? imports.push(toCdn(_mappings_1.componentsCss, version))
|
|
100
|
-
: imports.push(toCssImport(`${_mappings_1.rootDir}/${_mappings_1.componentsCss}`, layers));
|
|
101
|
-
return imports;
|
|
102
|
-
}
|
|
103
|
-
const components = new Set();
|
|
104
|
-
componentImports.forEach((x) => {
|
|
105
|
-
var _a;
|
|
106
|
-
const styleRef = _mappings_1.StyleMappings.components.find((y) => y.component === x);
|
|
107
|
-
if (styleRef) {
|
|
108
|
-
components.add(styleRef.main);
|
|
109
|
-
(_a = styleRef === null || styleRef === void 0 ? void 0 : styleRef.dependencies) === null || _a === void 0 ? void 0 : _a.forEach((dep) => components.add(dep));
|
|
110
|
-
}
|
|
111
|
-
});
|
|
112
|
-
let componentImportsList = Array.from(components)
|
|
113
|
-
.filter((x) => x.length > 0)
|
|
114
|
-
.sort((a, b) => a.localeCompare(b));
|
|
115
|
-
if (componentImportsList.find((x) => x === _mappings_1.formCss)) {
|
|
116
|
-
componentImportsList = componentImportsList.filter((x) => x !== _mappings_1.formCss);
|
|
117
|
-
componentImportsList.unshift(_mappings_1.formCss);
|
|
118
|
-
}
|
|
119
|
-
if (componentImportsList.find((x) => x === _mappings_1.primitivesCss)) {
|
|
120
|
-
componentImportsList = componentImportsList.filter((x) => x !== _mappings_1.primitivesCss);
|
|
121
|
-
componentImportsList.unshift(_mappings_1.primitivesCss);
|
|
122
|
-
}
|
|
123
|
-
if (componentImportsList.find((x) => x === _mappings_1.typoCss)) {
|
|
124
|
-
componentImportsList = componentImportsList.filter((x) => x !== _mappings_1.typoCss);
|
|
125
|
-
componentImportsList.unshift(_mappings_1.typoCss);
|
|
126
|
-
}
|
|
127
|
-
if (componentImportsList.length === 0) {
|
|
128
|
-
return imports;
|
|
129
|
-
}
|
|
130
|
-
imports.push(``);
|
|
131
|
-
imports.push(`/* Components */`);
|
|
132
|
-
componentImportsList.forEach((x) => {
|
|
133
|
-
const pascalCase = lodash_1.default.camelCase(x.replace("css", "")).toLowerCase();
|
|
134
|
-
cdn
|
|
135
|
-
? imports.push(toCdn(`${_mappings_1.componentDir}/${pascalCase}.css`, version))
|
|
136
|
-
: imports.push(toCssImport(`${_mappings_1.componentDir}/${pascalCase}.css`, layers));
|
|
137
|
-
});
|
|
138
|
-
return imports;
|
|
139
|
-
}
|
|
140
|
-
function toCdn(str, version) {
|
|
141
|
-
return `<link rel="preload" href="https://cdn.nav.no/aksel/@navikt/ds-css/${version}/${str
|
|
142
|
-
.replace(".css", ".min.css")
|
|
143
|
-
.replace(`${_mappings_1.rootDir}/`, "")}" as="style"></link>`;
|
|
144
|
-
}
|
|
145
|
-
function toCssImport(str, layers) {
|
|
146
|
-
return `@import "@navikt/ds-css/${str}"${layers ? config_js_1.layerSuffix : ""};`;
|
|
147
|
-
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
3
|
-
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
4
|
-
return new (P || (P = Promise))(function (resolve, reject) {
|
|
5
|
-
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
6
|
-
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
7
|
-
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
8
|
-
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
9
|
-
});
|
|
10
|
-
};
|
|
11
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
12
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
13
|
-
};
|
|
14
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
15
|
-
exports.getDirectories = getDirectories;
|
|
16
|
-
const fast_glob_1 = __importDefault(require("fast-glob"));
|
|
17
|
-
const node_path_1 = __importDefault(require("node:path"));
|
|
18
|
-
function getDirectories() {
|
|
19
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
20
|
-
const baseDir = process.cwd();
|
|
21
|
-
const ignoreNodeModules = [
|
|
22
|
-
"**/node_modules/**",
|
|
23
|
-
"**/dist/**",
|
|
24
|
-
"**/build/**",
|
|
25
|
-
"**/lib/**",
|
|
26
|
-
];
|
|
27
|
-
const directories = yield (0, fast_glob_1.default)(`${baseDir}/**`, {
|
|
28
|
-
onlyDirectories: true,
|
|
29
|
-
ignore: ignoreNodeModules,
|
|
30
|
-
});
|
|
31
|
-
directories.sort((a, b) => a.length - b.length);
|
|
32
|
-
return [baseDir, ...directories].map((x) => x.replace(baseDir, node_path_1.default.basename(baseDir)));
|
|
33
|
-
});
|
|
34
|
-
}
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
3
|
-
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
4
|
-
return new (P || (P = Promise))(function (resolve, reject) {
|
|
5
|
-
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
6
|
-
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
7
|
-
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
8
|
-
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
9
|
-
});
|
|
10
|
-
};
|
|
11
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
12
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
13
|
-
};
|
|
14
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
15
|
-
exports.getAllVersions = getAllVersions;
|
|
16
|
-
const axios_1 = __importDefault(require("axios"));
|
|
17
|
-
function getAllVersions() {
|
|
18
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
19
|
-
try {
|
|
20
|
-
const npmPackageData = yield axios_1.default.get(`https://registry.npmjs.org/@navikt/ds-css`);
|
|
21
|
-
return Object.keys(npmPackageData.data.versions);
|
|
22
|
-
}
|
|
23
|
-
catch (e) {
|
|
24
|
-
console.error(e);
|
|
25
|
-
return [];
|
|
26
|
-
}
|
|
27
|
-
});
|
|
28
|
-
}
|