@schalkneethling/miyagi-core 4.4.2 → 4.4.4

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 (115) hide show
  1. package/README.md +7 -2
  2. package/api/app.js +16 -16
  3. package/api/index.js +263 -262
  4. package/bin/miyagi.js +1 -1
  5. package/dist/css/iframe.css +6 -30
  6. package/frontend/assets/css/iframe/accordion-tabs.css +39 -39
  7. package/frontend/assets/css/iframe/jsontree.js.css +149 -149
  8. package/frontend/assets/css/iframe/prism.css +45 -45
  9. package/frontend/assets/css/iframe/styleguide/colors.css +27 -27
  10. package/frontend/assets/css/iframe/styleguide/fonts.css +23 -23
  11. package/frontend/assets/css/iframe/styleguide/index.css +58 -58
  12. package/frontend/assets/css/iframe/styleguide/spacings.css +10 -10
  13. package/frontend/assets/css/iframe.css +191 -191
  14. package/frontend/assets/css/main/menu/config-switcher.css +21 -21
  15. package/frontend/assets/css/main/menu/config-switchers.css +34 -34
  16. package/frontend/assets/css/main/menu/goto.css +16 -16
  17. package/frontend/assets/css/main/menu/nav.css +49 -49
  18. package/frontend/assets/css/main/menu/search.css +34 -34
  19. package/frontend/assets/css/main/menu/title.css +18 -18
  20. package/frontend/assets/css/main/menu.css +89 -89
  21. package/frontend/assets/css/main/reset.css +47 -47
  22. package/frontend/assets/css/main.css +41 -41
  23. package/frontend/assets/css/shared.css +16 -16
  24. package/frontend/assets/css/tokens.css +108 -107
  25. package/frontend/assets/js/_accordion-tabs.js +392 -392
  26. package/frontend/assets/js/_goto.js +59 -59
  27. package/frontend/assets/js/_iframe-links.js +14 -14
  28. package/frontend/assets/js/_is-triggered.js +3 -3
  29. package/frontend/assets/js/_main.js +369 -369
  30. package/frontend/assets/js/_mock-data.js +8 -8
  31. package/frontend/assets/js/_prism.js +1082 -1081
  32. package/frontend/assets/js/_search.js +186 -186
  33. package/frontend/assets/js/_socket.js +44 -44
  34. package/frontend/assets/js/config-switcher/development-mode.js +38 -38
  35. package/frontend/assets/js/config-switcher/index.js +55 -55
  36. package/frontend/assets/js/config-switcher/text-direction.js +22 -22
  37. package/frontend/assets/js/config-switcher/theme.js +68 -68
  38. package/frontend/assets/js/iframe.build.js +25 -25
  39. package/frontend/assets/js/iframe.js +38 -38
  40. package/frontend/assets/js/jsontree.js +979 -976
  41. package/frontend/assets/js/main.build.js +29 -29
  42. package/frontend/assets/js/main.js +31 -31
  43. package/frontend/assets/js/styleguide/color-converter.js +652 -652
  44. package/frontend/assets/js/styleguide/index.js +100 -100
  45. package/lib/build/index.js +1014 -1020
  46. package/lib/cli/app.js +16 -16
  47. package/lib/cli/component.js +50 -50
  48. package/lib/cli/doctor.js +130 -121
  49. package/lib/cli/drupal-assets.js +163 -157
  50. package/lib/cli/lint.js +196 -196
  51. package/lib/cli/run.js +150 -146
  52. package/lib/config.js +86 -86
  53. package/lib/constants/lint-log-levels.js +6 -6
  54. package/lib/drupal/load-assets-config.js +59 -60
  55. package/lib/drupal/resolve-library-assets.js +132 -141
  56. package/lib/errors.js +20 -20
  57. package/lib/generator/component.js +124 -124
  58. package/lib/generator/mocks.js +156 -156
  59. package/lib/helpers.js +68 -68
  60. package/lib/i18n/en.js +93 -93
  61. package/lib/i18n/index.js +8 -8
  62. package/lib/index.js +13 -13
  63. package/lib/init/args.js +153 -153
  64. package/lib/init/config.js +452 -438
  65. package/lib/init/engines.js +41 -41
  66. package/lib/init/index.js +83 -83
  67. package/lib/init/rendering.js +3 -3
  68. package/lib/init/static.js +90 -90
  69. package/lib/init/twing/cache.js +27 -27
  70. package/lib/init/twing/functions.js +37 -37
  71. package/lib/init/views.js +5 -5
  72. package/lib/logger.js +72 -72
  73. package/lib/mocks/get.js +88 -88
  74. package/lib/mocks/index.js +2 -2
  75. package/lib/mocks/resolve/ref.js +447 -447
  76. package/lib/mocks/resolve/tpl.js +218 -218
  77. package/lib/mocks/resolve.js +154 -154
  78. package/lib/render/helpers/resolve-assets.js +29 -39
  79. package/lib/render/helpers.js +27 -27
  80. package/lib/render/index.js +18 -18
  81. package/lib/render/views/iframe/component.docs.js +50 -50
  82. package/lib/render/views/iframe/component.js +249 -248
  83. package/lib/render/views/iframe/design-tokens/colors.js +38 -38
  84. package/lib/render/views/iframe/design-tokens/index.js +3 -3
  85. package/lib/render/views/iframe/design-tokens/sizes.js +35 -35
  86. package/lib/render/views/iframe/design-tokens/typography.js +37 -37
  87. package/lib/render/views/iframe/docs.js +42 -42
  88. package/lib/render/views/iframe/index.js +28 -28
  89. package/lib/render/views/iframe/variation.js +89 -89
  90. package/lib/render/views/iframe/variation.standalone.js +69 -68
  91. package/lib/render/views/main/component.docs.js +38 -38
  92. package/lib/render/views/main/component.js +55 -55
  93. package/lib/render/views/main/design-tokens.js +38 -38
  94. package/lib/render/views/main/docs.js +33 -33
  95. package/lib/render/views/main/index.js +33 -33
  96. package/lib/state/components.js +99 -99
  97. package/lib/state/css.js +33 -33
  98. package/lib/state/docs.js +72 -72
  99. package/lib/state/file-contents.js +154 -154
  100. package/lib/state/helpers.js +53 -53
  101. package/lib/state/index.js +39 -39
  102. package/lib/state/menu/index.js +202 -202
  103. package/lib/state/menu/structure.js +84 -84
  104. package/lib/state/partials.js +12 -12
  105. package/lib/state/source-tree.js +51 -51
  106. package/lib/styleguide/color-names.js +148 -148
  107. package/lib/styleguide/colors.js +113 -113
  108. package/lib/styleguide/helpers.js +33 -33
  109. package/lib/styleguide/index.js +4 -4
  110. package/lib/styleguide/media-queries.js +18 -18
  111. package/lib/styleguide/spacings.js +22 -22
  112. package/lib/styleguide/typography.js +46 -46
  113. package/lib/validator/mocks.js +110 -83
  114. package/lib/validator/schemas.js +236 -227
  115. package/package.json +120 -117
package/README.md CHANGED
@@ -35,10 +35,15 @@ pnpm add -D @schalkneethling/miyagi-core twing
35
35
  Create `.miyagi.mjs`:
36
36
 
37
37
  ```js
38
- import { createSynchronousEnvironment, createSynchronousFilesystemLoader } from "twing";
38
+ import {
39
+ createSynchronousEnvironment,
40
+ createSynchronousFilesystemLoader,
41
+ } from "twing";
39
42
  import fs from "node:fs";
40
43
 
41
- const twing = createSynchronousEnvironment(createSynchronousFilesystemLoader(fs));
44
+ const twing = createSynchronousEnvironment(
45
+ createSynchronousFilesystemLoader(fs),
46
+ );
42
47
 
43
48
  export default {
44
49
  components: {
package/api/app.js CHANGED
@@ -17,23 +17,23 @@ import setViews from "../lib/init/views.js";
17
17
  * @returns {Promise<object>}
18
18
  */
19
19
  export default async function init(mergedConfig) {
20
- global.app = express();
21
- global.config = mergedConfig;
22
- global.app.set("view cache", false);
23
- global.app.set("cache", false);
20
+ global.app = express();
21
+ global.config = mergedConfig;
22
+ global.app.set("view cache", false);
23
+ global.app.set("cache", false);
24
24
 
25
- await setEngines();
26
- await setState({
27
- sourceTree: true,
28
- menu: true,
29
- partials: true,
30
- fileContents: true,
31
- css: true,
32
- });
25
+ await setEngines();
26
+ await setState({
27
+ sourceTree: true,
28
+ menu: true,
29
+ partials: true,
30
+ fileContents: true,
31
+ css: true,
32
+ });
33
33
 
34
- setStatic();
35
- setRouter();
36
- setViews();
34
+ setStatic();
35
+ setRouter();
36
+ setViews();
37
37
 
38
- return global.app;
38
+ return global.app;
39
39
  }
package/api/index.js CHANGED
@@ -8,9 +8,9 @@ import generateMockData from "../lib/generator/mocks.js";
8
8
  import generateComponent from "../lib/generator/component.js";
9
9
  import validateMockData from "../lib/validator/mocks.js";
10
10
  import {
11
- getSchemaValidationMode,
12
- toSchemaValidationResult,
13
- validateSchemas,
11
+ getSchemaValidationMode,
12
+ toSchemaValidationResult,
13
+ validateSchemas,
14
14
  } from "../lib/validator/schemas.js";
15
15
 
16
16
  /**
@@ -20,43 +20,43 @@ import {
20
20
  * @returns {Promise<object>}
21
21
  */
22
22
  export const getMockData = async (
23
- { component, variant = "default" } = { component: null },
23
+ { component, variant = "default" } = { component: null },
24
24
  ) => {
25
- if (!component)
26
- return {
27
- success: false,
28
- message:
29
- 'Please pass a component to `getMockData` ({ component: "name" }).',
30
- };
31
-
32
- global.app = await init("api");
33
-
34
- const componentObject = getComponentsObject(component);
35
-
36
- if (!componentObject)
37
- return {
38
- success: false,
39
- message: `Component "${component}" does not exist.`,
40
- };
41
-
42
- const data = await getVariationData(componentObject, variant);
43
-
44
- if (!data) {
45
- return {
46
- success: true,
47
- message: `No mock data found for component "${component}", variant "${variant}".`,
48
- data: null,
49
- };
50
- }
51
-
52
- if (!data.resolved) {
53
- return {
54
- success: false,
55
- message: "An unknown error occured.",
56
- };
57
- }
58
-
59
- return { success: true, data: data.resolved };
25
+ if (!component)
26
+ return {
27
+ success: false,
28
+ message:
29
+ 'Please pass a component to `getMockData` ({ component: "name" }).',
30
+ };
31
+
32
+ global.app = await init("api");
33
+
34
+ const componentObject = getComponentsObject(component);
35
+
36
+ if (!componentObject)
37
+ return {
38
+ success: false,
39
+ message: `Component "${component}" does not exist.`,
40
+ };
41
+
42
+ const data = await getVariationData(componentObject, variant);
43
+
44
+ if (!data) {
45
+ return {
46
+ success: true,
47
+ message: `No mock data found for component "${component}", variant "${variant}".`,
48
+ data: null,
49
+ };
50
+ }
51
+
52
+ if (!data.resolved) {
53
+ return {
54
+ success: false,
55
+ message: "An unknown error occured.",
56
+ };
57
+ }
58
+
59
+ return { success: true, data: data.resolved };
60
60
  };
61
61
 
62
62
  /**
@@ -66,228 +66,229 @@ export const getMockData = async (
66
66
  * @returns {Promise<object>}
67
67
  */
68
68
  export const getHtml = async (
69
- { component, variant } = { component: null, variant: "default" },
69
+ { component, variant } = { component: null, variant: "default" },
70
70
  ) => {
71
- if (!component)
72
- return {
73
- success: false,
74
- message: 'Please pass a component to `getHtml` ({ component: "name" }).',
75
- };
76
-
77
- const { success, data, message } = await getMockData({ component, variant });
78
-
79
- if (success) {
80
- const result = await renderIframeVariationStandalone({
81
- component: getComponentsObject(component),
82
- componentData: success ? data : {},
83
- });
84
-
85
- return {
86
- success: true,
87
- data: result,
88
- };
89
- } else {
90
- return {
91
- success: false,
92
- message,
93
- };
94
- }
71
+ if (!component)
72
+ return {
73
+ success: false,
74
+ message: 'Please pass a component to `getHtml` ({ component: "name" }).',
75
+ };
76
+
77
+ const { success, data, message } = await getMockData({ component, variant });
78
+
79
+ if (success) {
80
+ const result = await renderIframeVariationStandalone({
81
+ component: getComponentsObject(component),
82
+ componentData: success ? data : {},
83
+ });
84
+
85
+ return {
86
+ success: true,
87
+ data: result,
88
+ };
89
+ } else {
90
+ return {
91
+ success: false,
92
+ message,
93
+ };
94
+ }
95
95
  };
96
96
 
97
97
  export const createBuild = async () => {
98
- global.app = await init("api", { isBuild: true });
99
-
100
- try {
101
- const message = await build();
102
-
103
- return {
104
- success: true,
105
- message,
106
- };
107
- } catch (message) {
108
- return {
109
- success: false,
110
- message,
111
- };
112
- }
98
+ global.app = await init("api", { isBuild: true });
99
+
100
+ try {
101
+ const message = await build();
102
+
103
+ return {
104
+ success: true,
105
+ message,
106
+ };
107
+ } catch (message) {
108
+ return {
109
+ success: false,
110
+ message,
111
+ };
112
+ }
113
113
  };
114
114
 
115
115
  export const createMockData = async ({ component }) => {
116
- if (!component) {
117
- return {
118
- success: false,
119
- message: t("dataGenerator.noComponentFolderDefined"),
120
- };
121
- }
122
-
123
- try {
124
- global.app = await init("api");
125
-
126
- const { success, message } = await generateMockData(
127
- path.join(global.config.components.folder, component),
128
- global.config.files,
129
- );
130
-
131
- if (success) {
132
- return {
133
- success: true,
134
- };
135
- }
136
-
137
- return {
138
- success,
139
- message: message.text,
140
- };
141
- } catch (message) {
142
- return {
143
- success: false,
144
- message,
145
- };
146
- }
116
+ if (!component) {
117
+ return {
118
+ success: false,
119
+ message: t("dataGenerator.noComponentFolderDefined"),
120
+ };
121
+ }
122
+
123
+ try {
124
+ global.app = await init("api");
125
+
126
+ const { success, message } = await generateMockData(
127
+ path.join(global.config.components.folder, component),
128
+ global.config.files,
129
+ );
130
+
131
+ if (success) {
132
+ return {
133
+ success: true,
134
+ };
135
+ }
136
+
137
+ return {
138
+ success,
139
+ message: message.text,
140
+ };
141
+ } catch (message) {
142
+ return {
143
+ success: false,
144
+ message,
145
+ };
146
+ }
147
147
  };
148
148
 
149
149
  export const createComponent = async ({ component, only = [], skip = [] }) => {
150
- global.app = await init("api");
151
-
152
- let fileTypes = ["css", "docs", "js", "mocks", "schema", "tpl"];
153
-
154
- if (only.length > 0) {
155
- fileTypes = only;
156
- } else if (skip.length > 0) {
157
- fileTypes = fileTypes.filter((value) => !skip.includes(value));
158
- }
159
-
160
- try {
161
- const result = await generateComponent({
162
- component: path.join(global.config.components.folder, component),
163
- fileTypes,
164
- });
165
-
166
- return {
167
- success: true,
168
- message: result,
169
- };
170
- } catch (message) {
171
- return {
172
- success: false,
173
- message,
174
- };
175
- }
150
+ global.app = await init("api");
151
+
152
+ let fileTypes = ["css", "docs", "js", "mocks", "schema", "tpl"];
153
+
154
+ if (only.length > 0) {
155
+ fileTypes = only;
156
+ } else if (skip.length > 0) {
157
+ fileTypes = fileTypes.filter((value) => !skip.includes(value));
158
+ }
159
+
160
+ try {
161
+ const result = await generateComponent({
162
+ component: path.join(global.config.components.folder, component),
163
+ fileTypes,
164
+ });
165
+
166
+ return {
167
+ success: true,
168
+ message: result,
169
+ };
170
+ } catch (message) {
171
+ return {
172
+ success: false,
173
+ message,
174
+ };
175
+ }
176
176
  };
177
177
 
178
178
  export const lintComponents = async () => {
179
- global.app = await init("api");
180
- const mode = getSchemaValidationMode();
181
- const components = global.state.routes.filter((route) => route.paths.tpl);
182
- const schemaValidation = validateSchemas({
183
- components,
184
- });
185
- const schemaErrorsByComponent = new Map();
186
-
187
- schemaValidation.errors.forEach((entry) => {
188
- if (!schemaErrorsByComponent.has(entry.component)) {
189
- schemaErrorsByComponent.set(entry.component, []);
190
- }
191
- schemaErrorsByComponent
192
- .get(entry.component)
193
- .push(toSchemaValidationResult(entry));
194
- });
195
-
196
- if (mode === "fail-fast" && schemaValidation.errors.length > 0) {
197
- return {
198
- success: false,
199
- data: getLintComponentErrorsInRouteOrder({
200
- components,
201
- errorMap: schemaErrorsByComponent,
202
- }),
203
- };
204
- }
205
-
206
- const promises = components
207
- .filter((route) => !schemaErrorsByComponent.has(route.paths.dir.short))
208
- .map(
209
- (route) =>
210
- new Promise((resolve) => {
211
- getComponentData(route).then((data) => {
212
- const validation = validateMockData(
213
- route,
214
- data || [],
215
- true,
216
- schemaValidation.validSchemas,
217
- );
218
-
219
- resolve({
220
- component: route.alias,
221
- errors: validation,
222
- });
223
- });
224
- }),
225
- );
226
-
227
- return await Promise.all(promises)
228
- .then((res) => {
229
- res.forEach((result) => {
230
- if (!result?.errors?.length) {
231
- return;
232
- }
233
- const componentErrors = schemaErrorsByComponent.get(result.component) || [];
234
- schemaErrorsByComponent.set(result.component, [
235
- ...componentErrors,
236
- ...result.errors,
237
- ]);
238
- });
239
-
240
- const errors = getLintComponentErrorsInRouteOrder({
241
- components,
242
- errorMap: schemaErrorsByComponent,
243
- });
244
-
245
- return {
246
- success: errors.length === 0,
247
- data: errors,
248
- };
249
- })
250
- .catch((err) => {
251
- return { success: false, message: err.toString() };
252
- });
179
+ global.app = await init("api");
180
+ const mode = getSchemaValidationMode();
181
+ const components = global.state.routes.filter((route) => route.paths.tpl);
182
+ const schemaValidation = validateSchemas({
183
+ components,
184
+ });
185
+ const schemaErrorsByComponent = new Map();
186
+
187
+ schemaValidation.errors.forEach((entry) => {
188
+ if (!schemaErrorsByComponent.has(entry.component)) {
189
+ schemaErrorsByComponent.set(entry.component, []);
190
+ }
191
+ schemaErrorsByComponent
192
+ .get(entry.component)
193
+ .push(toSchemaValidationResult(entry));
194
+ });
195
+
196
+ if (mode === "fail-fast" && schemaValidation.errors.length > 0) {
197
+ return {
198
+ success: false,
199
+ data: getLintComponentErrorsInRouteOrder({
200
+ components,
201
+ errorMap: schemaErrorsByComponent,
202
+ }),
203
+ };
204
+ }
205
+
206
+ const promises = components
207
+ .filter((route) => !schemaErrorsByComponent.has(route.paths.dir.short))
208
+ .map(
209
+ (route) =>
210
+ new Promise((resolve) => {
211
+ getComponentData(route).then((data) => {
212
+ const validation = validateMockData(
213
+ route,
214
+ data || [],
215
+ true,
216
+ schemaValidation.validSchemas,
217
+ );
218
+
219
+ resolve({
220
+ component: route.alias,
221
+ errors: validation,
222
+ });
223
+ });
224
+ }),
225
+ );
226
+
227
+ return await Promise.all(promises)
228
+ .then((res) => {
229
+ res.forEach((result) => {
230
+ if (!result?.errors?.length) {
231
+ return;
232
+ }
233
+ const componentErrors =
234
+ schemaErrorsByComponent.get(result.component) || [];
235
+ schemaErrorsByComponent.set(result.component, [
236
+ ...componentErrors,
237
+ ...result.errors,
238
+ ]);
239
+ });
240
+
241
+ const errors = getLintComponentErrorsInRouteOrder({
242
+ components,
243
+ errorMap: schemaErrorsByComponent,
244
+ });
245
+
246
+ return {
247
+ success: errors.length === 0,
248
+ data: errors,
249
+ };
250
+ })
251
+ .catch((err) => {
252
+ return { success: false, message: err.toString() };
253
+ });
253
254
  };
254
255
 
255
256
  export const lintComponent = async ({ component }) => {
256
- global.app = await init("api");
257
-
258
- const componentObject = getComponentsObject(component);
259
-
260
- if (!componentObject)
261
- return {
262
- success: false,
263
- message: `The component ${component} does not seem to exist.`,
264
- };
265
-
266
- const allSchemaValidation = validateSchemas({
267
- components: [componentObject],
268
- });
269
-
270
- if (allSchemaValidation.errors.length > 0) {
271
- return {
272
- success: false,
273
- data: allSchemaValidation.errors.map((entry) =>
274
- toSchemaValidationResult(entry),
275
- ),
276
- };
277
- }
278
-
279
- const data = await getComponentData(componentObject);
280
- const errors = validateMockData(
281
- componentObject,
282
- data || [],
283
- true,
284
- allSchemaValidation.validSchemas,
285
- );
286
-
287
- return {
288
- success: errors === null || errors?.length === 0,
289
- data: errors,
290
- };
257
+ global.app = await init("api");
258
+
259
+ const componentObject = getComponentsObject(component);
260
+
261
+ if (!componentObject)
262
+ return {
263
+ success: false,
264
+ message: `The component ${component} does not seem to exist.`,
265
+ };
266
+
267
+ const allSchemaValidation = validateSchemas({
268
+ components: [componentObject],
269
+ });
270
+
271
+ if (allSchemaValidation.errors.length > 0) {
272
+ return {
273
+ success: false,
274
+ data: allSchemaValidation.errors.map((entry) =>
275
+ toSchemaValidationResult(entry),
276
+ ),
277
+ };
278
+ }
279
+
280
+ const data = await getComponentData(componentObject);
281
+ const errors = validateMockData(
282
+ componentObject,
283
+ data || [],
284
+ true,
285
+ allSchemaValidation.validSchemas,
286
+ );
287
+
288
+ return {
289
+ success: errors === null || errors?.length === 0,
290
+ data: errors,
291
+ };
291
292
  };
292
293
 
293
294
  /**
@@ -295,9 +296,9 @@ export const lintComponent = async ({ component }) => {
295
296
  * @returns {object}
296
297
  */
297
298
  function getComponentsObject(component) {
298
- return global.state.routes.find(
299
- (route) => route.paths.dir.short === component,
300
- );
299
+ return global.state.routes.find(
300
+ (route) => route.paths.dir.short === component,
301
+ );
301
302
  }
302
303
 
303
304
  /**
@@ -307,18 +308,18 @@ function getComponentsObject(component) {
307
308
  * @returns {Array<object>}
308
309
  */
309
310
  function getLintComponentErrorsInRouteOrder({ components, errorMap }) {
310
- return components
311
- .map((route) => {
312
- const componentErrors = errorMap.get(route.alias) || [];
313
-
314
- if (componentErrors.length === 0) {
315
- return null;
316
- }
317
-
318
- return {
319
- component: route.alias,
320
- errors: componentErrors,
321
- };
322
- })
323
- .filter(Boolean);
311
+ return components
312
+ .map((route) => {
313
+ const componentErrors = errorMap.get(route.alias) || [];
314
+
315
+ if (componentErrors.length === 0) {
316
+ return null;
317
+ }
318
+
319
+ return {
320
+ component: route.alias,
321
+ errors: componentErrors,
322
+ };
323
+ })
324
+ .filter(Boolean);
324
325
  }
package/bin/miyagi.js CHANGED
@@ -4,7 +4,7 @@ import runCli from "../index.js";
4
4
  const result = await runCli();
5
5
 
6
6
  if (result?.shouldExit) {
7
- process.exit(result.code ?? 0);
7
+ process.exit(result.code ?? 0);
8
8
  }
9
9
 
10
10
  process.exitCode = result?.code ?? 0;