@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.
Files changed (35) hide show
  1. package/README.md +96 -2
  2. package/dist/codemod/codeshift.utils.js +9 -1
  3. package/dist/codemod/migrations.js +75 -22
  4. package/dist/codemod/run-codeshift.js +14 -3
  5. package/dist/codemod/transforms/v8.0.0/accordion-variant/accordion-variant.js +16 -0
  6. package/dist/codemod/transforms/{darkside/box-to-boxnew/box-to-boxnew.js → v8.0.0/box/box.js} +80 -100
  7. package/dist/codemod/transforms/v8.0.0/box-new/box-new.js +91 -0
  8. package/dist/codemod/transforms/v8.0.0/chips-variant/chips-variant.js +31 -0
  9. package/dist/codemod/transforms/v8.0.0/list/list.js +218 -0
  10. package/dist/codemod/transforms/{darkside → v8.0.0}/prop-deprecate/prop-deprecate.js +1 -1
  11. package/dist/codemod/transforms/v8.0.0/tag-variant/tag-variant.js +38 -0
  12. package/dist/codemod/transforms/v8.0.0/toggle-group-variant/toggle-group-variant.js +16 -0
  13. package/dist/codemod/utils/ast.js +1 -1
  14. package/dist/codemod/utils/check.js +35 -0
  15. package/dist/codemod/utils/move-variant-to-data-color.js +120 -0
  16. package/dist/darkside/index.js +3 -9
  17. package/dist/darkside/run-tooling.js +138 -42
  18. package/dist/darkside/tasks/print-remaining.js +143 -38
  19. package/dist/darkside/tasks/status.js +147 -30
  20. package/dist/darkside/transforms/darkside-tokens-css.js +23 -8
  21. package/dist/darkside/transforms/darkside-tokens-tailwind.js +9 -10
  22. package/dist/help.js +0 -10
  23. package/dist/index.js +14 -17
  24. package/package.json +7 -7
  25. package/dist/css-imports/config.js +0 -5
  26. package/dist/css-imports/generate-output.js +0 -147
  27. package/dist/css-imports/get-directories.js +0 -34
  28. package/dist/css-imports/get-version.js +0 -28
  29. package/dist/css-imports/index.js +0 -187
  30. package/dist/css-imports/inquiry.js +0 -35
  31. package/dist/css-imports/scan-code.js +0 -45
  32. /package/dist/codemod/transforms/{spacing → v8.0.0}/primitives-spacing/spacing.js +0 -0
  33. /package/dist/codemod/transforms/{spacing → v8.0.0}/spacing.utils.js +0 -0
  34. /package/dist/codemod/transforms/{spacing → v8.0.0}/token-spacing/spacing.js +0 -0
  35. /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
- if (!(0, token_regex_1.getTokenRegex)(legacyToken, "css").test(fileSrc)) {
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 } = getWordPositionInFile(fileSrc, match.index);
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
- const legacyRegex = new RegExp(`(${legacy_component_tokens_1.legacyComponentTokenList.map((t) => `${t}:`).join("|")})`, "gm");
61
- let legacyMatch = legacyRegex.exec(fileSrc);
62
- while (legacyMatch !== null) {
63
- const { row, column } = getWordPositionInFile(fileSrc, legacyMatch.index);
64
- StatusStore.add({
65
- isLegacy: true,
66
- type: "component",
67
- columnNumber: column,
68
- lineNumber: row,
69
- canAutoMigrate: false,
70
- fileName,
71
- name: legacyMatch[0],
72
- });
73
- legacyMatch = legacyRegex.exec(fileSrc);
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
- if (!(0, token_regex_1.getTokenRegex)(newTokenName, "css").test(fileSrc)) {
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 } = getWordPositionInFile(fileSrc, match.index);
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 getWordPositionInFile(fileContent, index) {
113
- const lines = fileContent.split("\n");
114
- let lineNumber = 1;
115
- let charCount = 0;
116
- for (let i = 0; i < lines.length; i++) {
117
- const lineLength = lines[i].length + 1; // +1 to account for the newline character that was removed by split
118
- if (charCount + lineLength > index) {
119
- return { row: lineNumber, column: index - charCount + 1 };
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: lineNumber, column: 0 }; // Should not reach here if the index is within the file content range
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
- for (const [oldToken, config] of Object.entries(legacy_tokens_1.legacyTokenConfig)) {
8
- const oldCSSVar = `--a-${oldToken}`;
9
- /* We update all re-definitions of a token to a "legacy" version */
10
- const replaceRegex = new RegExp("(" + `${oldCSSVar}:` + ")", "gm");
11
- src = src.replace(replaceRegex, `--aksel-legacy${oldCSSVar.replace("--", "__")}:`);
12
- if (config.replacement.length > 0) {
13
- src = src.replace(config.regexes.css, `--ax-${config.replacement}`);
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
- const matches = src.match(config.regexes.tailwind) || [];
20
- for (const match of matches) {
21
- const index = beforeSplit.indexOf(match.trim().replace(":", ""));
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 = match.trim().startsWith(":");
23
+ const withPrefix = trimmed.startsWith(":");
24
24
  const addSpace = match.startsWith(" ");
25
25
  const replacementToken = afterSplit[index];
26
- src = src.replace((0, token_regex_1.createSingleTwRegex)(match), withPrefix
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
- if (!process.argv[2] || process.argv[2] === "help") {
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 (process.argv[2] === "css-imports") {
30
- yield (0, index_2.cssImportsCommand)();
31
- return;
32
- }
33
- if (process.argv[2] === "codemod") {
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
- if (process.argv[2] === "darkside") {
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.34.0",
4
- "description": "Aksel command line interface. Handles css-imports, codemods and more",
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.34.0",
36
- "@navikt/ds-tokens": "^7.34.0",
35
+ "@navikt/ds-css": "^7.35.1",
36
+ "@navikt/ds-tokens": "^7.35.1",
37
37
  "axios": "1.13.2",
38
- "chalk": "4.1.0",
38
+ "chalk": "5.6.2",
39
39
  "cli-progress": "^3.12.0",
40
- "clipboardy": "^2.3.0",
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": ">=16.0.0"
59
+ "node": ">=20.0.0"
60
60
  },
61
61
  "publishConfig": {
62
62
  "access": "public",
@@ -1,5 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.layerSuffix = exports.ComponentPrefix = void 0;
4
- exports.ComponentPrefix = "C_";
5
- exports.layerSuffix = " layer(aksel)";
@@ -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
- }