@digdir/designsystemet 0.1.0-alpha.13 → 0.1.0-alpha.15

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 (67) hide show
  1. package/dist/bin/designsystemet.js +32 -3439
  2. package/dist/src/colors/colorUtils.js +301 -343
  3. package/dist/src/colors/index.js +3 -607
  4. package/dist/src/colors/themeUtils.js +319 -348
  5. package/dist/src/colors/types.js +1 -1
  6. package/dist/src/init/createTokensPackage.js +230 -0
  7. package/dist/src/init/generateMetadataJson.js +16 -0
  8. package/dist/src/init/generateThemesJson.js +50 -0
  9. package/dist/src/init/index.js +7 -0
  10. package/dist/src/init/nextStepsMarkdown.js +90 -0
  11. package/dist/src/init/template/default-files/README.md +10 -0
  12. package/dist/src/init/template/default-files/design-tokens/README.md +3 -0
  13. package/dist/src/init/template/default-files/design-tokens/primitives/globals.json +197 -0
  14. package/dist/src/init/template/default-files/design-tokens/primitives/typography/default.json +86 -0
  15. package/dist/src/init/template/default-files/design-tokens/semantic/color.json +562 -0
  16. package/dist/src/init/template/default-files/design-tokens/semantic/style.json +543 -0
  17. package/dist/src/init/template/prettier.config.js +7 -0
  18. package/dist/src/init/template/template-files/design-tokens/primitives/colors/contrast/global.json +376 -0
  19. package/dist/src/init/template/template-files/design-tokens/primitives/colors/contrast/theme-template.json +314 -0
  20. package/dist/src/init/template/template-files/design-tokens/primitives/colors/dark/global.json +376 -0
  21. package/dist/src/init/template/template-files/design-tokens/primitives/colors/dark/theme-template.json +314 -0
  22. package/dist/src/init/template/template-files/design-tokens/primitives/colors/light/global.json +376 -0
  23. package/dist/src/init/template/template-files/design-tokens/primitives/colors/light/theme-template.json +314 -0
  24. package/dist/src/init/template/template-files/design-tokens/themes/theme-template.json +314 -0
  25. package/dist/src/init/template/template-files/package.json +23 -0
  26. package/dist/src/init/utils.js +11 -0
  27. package/dist/src/migrations/beta-to-v1.js +341 -407
  28. package/dist/src/migrations/codemods/css/plugins.js +36 -42
  29. package/dist/src/migrations/codemods/css/run.js +20 -17
  30. package/dist/src/migrations/codemods/jsx/classname-prefix.js +63 -59
  31. package/dist/src/migrations/codemods/jsx/run.js +20 -20
  32. package/dist/src/migrations/index.js +5 -436
  33. package/dist/src/migrations/react-beta-to-v1.js +4 -27
  34. package/dist/src/test/a.css +39 -0
  35. package/dist/src/test/jsx-test.js +12 -0
  36. package/dist/src/tokens/actions.js +23 -2176
  37. package/dist/src/tokens/build.js +54 -2974
  38. package/dist/src/tokens/configs.js +234 -2874
  39. package/dist/src/tokens/formats/css.js +153 -2632
  40. package/dist/src/tokens/formats/js-tokens.js +28 -42
  41. package/dist/src/tokens/transformers.js +44 -82
  42. package/dist/src/tokens/utils/noCase.js +26 -28
  43. package/dist/src/tokens/utils/permutateThemes.js +65 -217
  44. package/dist/src/tokens/utils/utils.js +25 -14
  45. package/package.json +16 -23
  46. package/LICENSE +0 -7
  47. package/dist/bin/designsystemet.js.map +0 -1
  48. package/dist/src/colors/colorUtils.js.map +0 -1
  49. package/dist/src/colors/index.js.map +0 -1
  50. package/dist/src/colors/themeUtils.js.map +0 -1
  51. package/dist/src/colors/types.js.map +0 -1
  52. package/dist/src/migrations/beta-to-v1.js.map +0 -1
  53. package/dist/src/migrations/codemods/css/plugins.js.map +0 -1
  54. package/dist/src/migrations/codemods/css/run.js.map +0 -1
  55. package/dist/src/migrations/codemods/jsx/classname-prefix.js.map +0 -1
  56. package/dist/src/migrations/codemods/jsx/run.js.map +0 -1
  57. package/dist/src/migrations/index.js.map +0 -1
  58. package/dist/src/migrations/react-beta-to-v1.js.map +0 -1
  59. package/dist/src/tokens/actions.js.map +0 -1
  60. package/dist/src/tokens/build.js.map +0 -1
  61. package/dist/src/tokens/configs.js.map +0 -1
  62. package/dist/src/tokens/formats/css.js.map +0 -1
  63. package/dist/src/tokens/formats/js-tokens.js.map +0 -1
  64. package/dist/src/tokens/transformers.js.map +0 -1
  65. package/dist/src/tokens/utils/noCase.js.map +0 -1
  66. package/dist/src/tokens/utils/permutateThemes.js.map +0 -1
  67. package/dist/src/tokens/utils/utils.js.map +0 -1
@@ -1,49 +1,43 @@
1
- // src/migrations/codemods/css/plugins.ts
2
1
  import * as R from "ramda";
3
2
  import chalk from "chalk";
4
3
  import hash from "object-hash";
5
- var printDelete = (text) => console.log(`${chalk.red("Deleted:")} ${text}`.replace(/"|'/g, ""));
6
- var deleteMsg = (decl, from) => `${chalk.yellow(from)} @ ${chalk.gray(`${JSON.stringify(decl.source?.input.file)}:${decl.source?.start?.line}:${decl.source?.start?.column}`)}`;
7
- var cssClassRename = (dictionary) => ({
8
- postcssPlugin: `Renames CSS classes ${hash(dictionary)}`,
9
- Rule(rule) {
10
- const selector = rule.selector;
11
- if (!selector) return;
12
- Object.entries(dictionary).forEach(([from, to]) => {
13
- if (!selector.includes(from)) return;
14
- const newSelector = selector.replace(new RegExp(from, "g"), to);
15
- rule.selector = newSelector;
4
+ const printDelete = (text)=>console.log(`${chalk.red('Deleted:')} ${text}`.replace(/"|'/g, ''));
5
+ const deleteMsg = (decl, from)=>`${chalk.yellow(from)} @ ${chalk.gray(`${JSON.stringify(decl.source?.input.file)}:${decl.source?.start?.line}:${decl.source?.start?.column}`)}`;
6
+ export const cssClassRename = (dictionary)=>({
7
+ postcssPlugin: `Renames CSS classes ${hash(dictionary)}`,
8
+ Rule (rule) {
9
+ const selector = rule.selector;
10
+ if (!selector) return;
11
+ Object.entries(dictionary).forEach(([from, to])=>{
12
+ if (!selector.includes(from)) return;
13
+ const newSelector = selector.replace(new RegExp(from, 'g'), to);
14
+ rule.selector = newSelector;
15
+ });
16
+ }
16
17
  });
17
- }
18
- });
19
- var cssVarRename = (dictionary) => ({
20
- postcssPlugin: `Replaces CSS variables ${hash(dictionary)}`,
21
- Declaration(decl) {
22
- const { value, prop } = decl;
23
- const deleted = /* @__PURE__ */ new Set();
24
- Object.entries(dictionary).forEach(([from, to]) => {
25
- if (!R.isEmpty(to)) {
26
- switch (true) {
27
- case R.includes(from, value):
28
- to === "[delete]" && deleted.add(deleteMsg(decl, from));
29
- decl.value = value.replace(from, to);
30
- break;
31
- case R.includes(from, prop):
32
- if (decl.variable) {
33
- to === "[delete]" && deleted.add(deleteMsg(decl, from));
34
- decl.prop = prop.replace(from, to);
35
- break;
18
+ export const cssVarRename = (dictionary)=>({
19
+ postcssPlugin: `Replaces CSS variables ${hash(dictionary)}`,
20
+ Declaration (decl) {
21
+ const { value, prop } = decl;
22
+ const deleted = new Set();
23
+ Object.entries(dictionary).forEach(([from, to])=>{
24
+ if (!R.isEmpty(to)) {
25
+ switch(true){
26
+ case R.includes(from, value):
27
+ to === '[delete]' && deleted.add(deleteMsg(decl, from));
28
+ decl.value = value.replace(from, to);
29
+ break;
30
+ case R.includes(from, prop):
31
+ if (decl.variable) {
32
+ to === '[delete]' && deleted.add(deleteMsg(decl, from));
33
+ decl.prop = prop.replace(from, to);
34
+ break;
35
+ }
36
+ }
37
+ }
38
+ });
39
+ if (deleted.size > 0) {
40
+ Array.from(deleted).forEach(printDelete);
36
41
  }
37
42
  }
38
- }
39
43
  });
40
- if (deleted.size > 0) {
41
- Array.from(deleted).forEach(printDelete);
42
- }
43
- }
44
- });
45
- export {
46
- cssClassRename,
47
- cssVarRename
48
- };
49
- //# sourceMappingURL=plugins.js.map
@@ -1,21 +1,24 @@
1
- // src/migrations/codemods/css/run.ts
2
1
  import fs from "fs";
3
2
  import postcss from "postcss";
4
3
  import glob from "fast-glob";
5
- var runCssCodemod = async ({ plugins = [], globPattern = "./**/*.css" }) => {
6
- const processor = postcss(plugins);
7
- const transform = async () => {
8
- const files = await glob(globPattern, { ignore: ["node_modules/**", "dist/**"] });
9
- const filePromises = files.map(async (file) => {
10
- const contents = fs.readFileSync(file).toString();
11
- const result = await processor.process(contents, { from: file });
12
- fs.writeFileSync(file, result.css);
13
- });
14
- await Promise.all(filePromises);
15
- };
16
- return transform();
4
+ export const runCssCodemod = async ({ plugins = [], globPattern = './**/*.css' })=>{
5
+ const processor = postcss(plugins);
6
+ const transform = async ()=>{
7
+ const files = await glob(globPattern, {
8
+ ignore: [
9
+ 'node_modules/**',
10
+ 'dist/**'
11
+ ]
12
+ });
13
+ const filePromises = files.map(async (file)=>{
14
+ const contents = fs.readFileSync(file).toString();
15
+ const result = await processor.process(contents, {
16
+ from: file
17
+ });
18
+ fs.writeFileSync(file, result.css);
19
+ });
20
+ await Promise.all(filePromises);
21
+ };
22
+ // Run the transform.
23
+ return transform();
17
24
  };
18
- export {
19
- runCssCodemod
20
- };
21
- //# sourceMappingURL=run.js.map
@@ -1,65 +1,69 @@
1
- // src/migrations/codemods/jsx/classname-prefix.ts
2
- var replaceInLiteral = (node) => {
3
- if (node.startsWith("fds-")) {
4
- return node.replace("fds-", "ds-");
5
- }
6
- return node;
1
+ const replaceInLiteral = (node)=>{
2
+ if (node.startsWith('fds-')) {
3
+ return node.replace('fds-', 'ds-');
4
+ }
5
+ return node;
7
6
  };
8
- var replaceInTemplateLiteral = (node) => {
9
- node.forEach((element) => {
10
- const value = element.value.raw;
11
- if (typeof value !== "string") return;
12
- element.value.raw = replaceInLiteral(value);
13
- });
7
+ const replaceInTemplateLiteral = (node)=>{
8
+ node.forEach((element)=>{
9
+ const value = element.value.raw;
10
+ if (typeof value !== 'string') return;
11
+ element.value.raw = replaceInLiteral(value);
12
+ });
14
13
  };
15
- var processNode = (node) => {
16
- if (!node) return;
17
- if (node.type === "Literal") {
18
- const value = node.value;
19
- if (typeof value !== "string") return;
20
- node.value = replaceInLiteral(value);
21
- } else if (node.type === "StringLiteral") {
22
- const value = node.value;
23
- if (typeof value !== "string") return;
24
- node.value = replaceInLiteral(value);
25
- } else if (node.type === "TemplateLiteral") {
26
- node.quasis && replaceInTemplateLiteral(node.quasis);
27
- } else if (node.type === "JSXExpressionContainer") {
28
- const expression = node.expression;
29
- if (!expression) return;
30
- if (expression.type === "CallExpression") {
31
- expression.arguments?.forEach(processNode);
32
- } else {
33
- processNode(expression);
14
+ const processNode = (node)=>{
15
+ if (!node) return;
16
+ if (node.type === 'Literal') {
17
+ const value = node.value;
18
+ if (typeof value !== 'string') return;
19
+ node.value = replaceInLiteral(value);
20
+ } else if (node.type === 'StringLiteral') {
21
+ const value = node.value;
22
+ if (typeof value !== 'string') return;
23
+ node.value = replaceInLiteral(value);
24
+ } else if (node.type === 'TemplateLiteral') {
25
+ node.quasis && replaceInTemplateLiteral(node.quasis);
26
+ } else if (node.type === 'JSXExpressionContainer') {
27
+ const expression = node.expression;
28
+ if (!expression) return;
29
+ if (expression.type === 'CallExpression') {
30
+ expression.arguments?.forEach(processNode);
31
+ } else {
32
+ processNode(expression);
33
+ }
34
+ } else if (node.type === 'ConditionalExpression') {
35
+ node.test && processNode(node.test);
36
+ node.consequent && processNode(node.consequent);
37
+ node.alternate && processNode(node.alternate);
38
+ } else if (node.type === 'BinaryExpression') {
39
+ node.right && processNode(node.right);
40
+ node.left && processNode(node.left);
41
+ } else if (node.type === 'LogicalExpression') {
42
+ node.right && processNode(node.right);
43
+ node.left && processNode(node.left);
34
44
  }
35
- } else if (node.type === "ConditionalExpression") {
36
- node.test && processNode(node.test);
37
- node.consequent && processNode(node.consequent);
38
- node.alternate && processNode(node.alternate);
39
- } else if (node.type === "BinaryExpression") {
40
- node.right && processNode(node.right);
41
- node.left && processNode(node.left);
42
- } else if (node.type === "LogicalExpression") {
43
- node.right && processNode(node.right);
44
- node.left && processNode(node.left);
45
- }
46
45
  };
47
- function replaceClassNamePrefix(file, api) {
48
- const j = api.jscodeshift;
49
- const root = j(file.source);
50
- root.find(j.JSXElement).forEach((path) => {
51
- j(path).find(j.JSXAttribute, { name: { name: "className" } }).forEach((nodePath) => {
52
- processNode(nodePath.value.value);
46
+ /**
47
+ * Replace all class prefixes from 'fds-' to 'ds-'
48
+ * @param file
49
+ * @param api
50
+ * @returns
51
+ */ function replaceClassNamePrefix(file, api) {
52
+ const j = api.jscodeshift;
53
+ const root = j(file.source);
54
+ root.find(j.JSXElement).forEach((path)=>{
55
+ j(path).find(j.JSXAttribute, {
56
+ name: {
57
+ name: 'className'
58
+ }
59
+ }).forEach((nodePath)=>{
60
+ processNode(nodePath.value.value);
61
+ });
62
+ });
63
+ return root.toSource({
64
+ quote: 'single',
65
+ reuseWhitespace: true,
66
+ wrapColumn: 100
53
67
  });
54
- });
55
- return root.toSource({
56
- quote: "single",
57
- reuseWhitespace: true,
58
- wrapColumn: 100
59
- });
60
68
  }
61
- var classname_prefix_default = replaceClassNamePrefix;
62
- export {
63
- classname_prefix_default as default
64
- };
65
- //# sourceMappingURL=classname-prefix.js.map
69
+ export default replaceClassNamePrefix;
@@ -1,24 +1,24 @@
1
- // src/migrations/codemods/jsx/run.ts
2
1
  import glob from "fast-glob";
3
2
  import { run as jscodeshift } from "jscodeshift/src/Runner.js";
4
3
  import chalk from "chalk";
5
- var transformer = `${import.meta.dirname}/classname-prefix.ts`;
6
- var runJSXCodemod = async ({ globPattern = "./**/*.tsx", dry }) => {
7
- const options = {
8
- dry,
9
- extensions: "tsx",
10
- parser: "tsx"
11
- };
12
- const transform = async () => {
13
- const files = await glob(globPattern, { ignore: ["node_modules/**", "dist/**"] });
14
- const result = await jscodeshift(transformer, files, options);
15
- if (result.ok) {
16
- console.log(chalk.green("Finished parsing"));
17
- }
18
- };
19
- return transform();
4
+ const transformer = `${import.meta.dirname}/classname-prefix.ts`;
5
+ export const runJSXCodemod = async ({ globPattern = './**/*.tsx', dry })=>{
6
+ const options = {
7
+ dry,
8
+ extensions: 'tsx',
9
+ parser: 'tsx'
10
+ };
11
+ const transform = async ()=>{
12
+ const files = await glob(globPattern, {
13
+ ignore: [
14
+ 'node_modules/**',
15
+ 'dist/**'
16
+ ]
17
+ });
18
+ const result = await jscodeshift(transformer, files, options);
19
+ if (result.ok) {
20
+ console.log(chalk.green('Finished parsing'));
21
+ }
22
+ };
23
+ return transform();
20
24
  };
21
- export {
22
- runJSXCodemod
23
- };
24
- //# sourceMappingURL=run.js.map