@ui5/webcomponents-tools 1.7.1 → 1.9.0

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/CHANGELOG.md CHANGED
@@ -3,6 +3,18 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # [1.8.0](https://github.com/SAP/ui5-webcomponents/compare/v1.7.1...v1.8.0) (2022-10-03)
7
+
8
+
9
+ ### Features
10
+
11
+ * **icons:** create type-definitions for icon imports ([#5753](https://github.com/SAP/ui5-webcomponents/issues/5753)) ([2de4a04](https://github.com/SAP/ui5-webcomponents/commit/2de4a045f56e2f166d3e846ff11e6f9d76e98009)), closes [#5747](https://github.com/SAP/ui5-webcomponents/issues/5747) [#5335](https://github.com/SAP/ui5-webcomponents/issues/5335)
12
+ * **main:** add support for custom SVG icons ([#5865](https://github.com/SAP/ui5-webcomponents/issues/5865)) ([d8b7200](https://github.com/SAP/ui5-webcomponents/commit/d8b7200f30c16d94b7f15ddbdf9808d8efbaa38c))
13
+
14
+
15
+
16
+
17
+
6
18
  ## [1.7.1](https://github.com/SAP/ui5-webcomponents/compare/v1.7.0...v1.7.1) (2022-09-08)
7
19
 
8
20
  **Note:** Version bump only for package @ui5/webcomponents-tools
@@ -1,6 +1,7 @@
1
1
  const path = require("path");
2
2
  const fs = require("fs");
3
3
  const LIB = path.join(__dirname, `../lib/`);
4
+ const FIORI = path.join(__dirname, `../../fiori/`);
4
5
 
5
6
 
6
7
  const getScripts = (options) => {
@@ -32,7 +33,7 @@ const getScripts = (options) => {
32
33
  // no custom configuration - use default from tools project
33
34
  eslintConfig = `--config "${require.resolve("@ui5/webcomponents-tools/components-package/eslint.js")}"`;
34
35
  }
35
-
36
+
36
37
  const scripts = {
37
38
  clean: 'rimraf dist && rimraf .port && nps "scope.testPages.clean"',
38
39
  lint: `eslint . ${eslintConfig}`,
@@ -40,7 +41,7 @@ const getScripts = (options) => {
40
41
  prepare: {
41
42
  default: "nps clean prepare.all",
42
43
  all: 'concurrently "nps build.templates" "nps build.i18n" "nps prepare.styleRelated" "nps copy" "nps build.api" "nps build.illustrations"',
43
- styleRelated: "nps build.styles build.jsonImports",
44
+ styleRelated: "nps build.styles build.jsonImports build.jsImports",
44
45
  },
45
46
  build: {
46
47
  default: "nps lint prepare build.bundle",
@@ -60,6 +61,10 @@ const getScripts = (options) => {
60
61
  themes: `node "${LIB}/generate-json-imports/themes.js" dist/generated/assets/themes dist/generated/json-imports`,
61
62
  i18n: `node "${LIB}/generate-json-imports/i18n.js" dist/generated/assets/i18n dist/generated/json-imports`,
62
63
  },
64
+ jsImports: {
65
+ default: "mkdirp dist/generated/js-imports && nps build.jsImports.illustrations",
66
+ illustrations: `node "${LIB}/generate-js-imports/illustrations.js" ${FIORI}/dist/illustrations ${FIORI}/dist/illustrations/tnt dist/generated/js-imports`,
67
+ },
63
68
  bundle: `vite build ${viteConfig}`,
64
69
  api: `jsdoc -c "${LIB}/jsdoc/config.json"`,
65
70
  illustrations: illustrationsScript
@@ -48,6 +48,23 @@ export default "${name}";
48
48
  export { pathData, ltr, accData };`;
49
49
 
50
50
 
51
+ const typeDefinitionTemplate = (name, accData, collection) => `declare const pathData: string;
52
+ declare const ltr: boolean;
53
+ declare const accData: ${accData ? '{ key: string; defaultText: string; }' : null}
54
+ declare const _default: "${collection}/${name}";
55
+
56
+ export default _default;
57
+ export { pathData, ltr, accData };`
58
+
59
+ const collectionTypeDefinitionTemplate = (name, accData) => `declare const pathData: string;
60
+ declare const ltr: boolean;
61
+ declare const accData: ${accData ? '{ key: string; defaultText: string; }' : null}
62
+ declare const _default: "${name}";
63
+
64
+ export default _default;
65
+ export { pathData, ltr, accData };`
66
+
67
+
51
68
  const svgTemplate = (pathData) => `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
52
69
  <path d="${pathData}"/>
53
70
  </svg>`;
@@ -68,9 +85,11 @@ const createIcons = async (file) => {
68
85
 
69
86
  promises.push(fs.writeFile(path.join(destDir, `${name}.js`), content));
70
87
  promises.push(fs.writeFile(path.join(destDir, `${name}.svg`), svgTemplate(pathData)));
88
+ promises.push(fs.writeFile(path.join(destDir, `${name}.d.ts`), typeDefinitionTemplate(name, acc, json.collection)));
71
89
 
72
90
  if (json.version) {
73
91
  promises.push(fs.writeFile(path.join(path.normalize("dist/"), `${name}.js`), collectionTemplate(name)));
92
+ promises.push(fs.writeFile(path.join(path.normalize("dist/"), `${name}.d.ts`), collectionTypeDefinitionTemplate(name, acc)));
74
93
  }
75
94
  }
76
95
 
@@ -40,7 +40,7 @@ const metadata = {
40
40
  * @constructor
41
41
  * @author SAP SE
42
42
  * @alias sap.ui.webcomponents.${library}.${componentName}
43
- * @extends UI5Element
43
+ * @extends sap.ui.webcomponents.base.UI5Element
44
44
  * @tagname ${tagName}
45
45
  * @public
46
46
  */
@@ -0,0 +1,369 @@
1
+ const fs = require("fs").promises;
2
+ // https://github.com/webcomponents/custom-elements-manifest/blob/main/schema.json
3
+
4
+ const camelToKebabMap = new Map();
5
+ const apiIndex = new Map();
6
+ const processedApiIndex = new Set();
7
+ const forbiddenAttributeTypes = ["object", "array"];
8
+
9
+ const camelToKebabCase = string => {
10
+ if (!camelToKebabMap.has(string)) {
11
+ const result = string.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
12
+ camelToKebabMap.set(string, result);
13
+ }
14
+ return camelToKebabMap.get(string);
15
+ };
16
+
17
+ const generateJavaScriptExport = entity => {
18
+ return {
19
+ declaration: generateRefenrece(entity),
20
+ deprecated: !!entity.deprecated,
21
+ kind: "js",
22
+ name: "default",
23
+ };
24
+ };
25
+
26
+ const generateCustomElementExport = entity => {
27
+ return {
28
+ declaration: {
29
+ name: entity.basename,
30
+ module: `${entity.module}.js`,
31
+ },
32
+ deprecated: !!entity.deprecated,
33
+ kind: "custom-element-definition",
34
+ name: entity.tagname,
35
+ };
36
+ };
37
+
38
+ const generateJavaScriptModule = entity => {
39
+ return {
40
+ kind: "javascript-module",
41
+ path: `${entity.basename}.js`,
42
+ declarations: [
43
+ generateCustomElementDeclaration(entity),
44
+ ],
45
+ exports: [
46
+ generateJavaScriptExport(entity),
47
+ generateCustomElementExport(entity),
48
+ ],
49
+ };
50
+ };
51
+
52
+ const generateSingleClassField = classField => {
53
+ let generatedClassField = {
54
+ deprecated: !!classField.deprecated,
55
+ kind: "field",
56
+ name: classField.name,
57
+ privacy: classField.visibility,
58
+ static: !!classField.static,
59
+ type: generateType(classField.type),
60
+ };
61
+
62
+ if (classField.defaultValue) {
63
+ generatedClassField.default = classField.defaultValue;
64
+ }
65
+
66
+ if (classField.description) {
67
+ generatedClassField.description = classField.description;
68
+ }
69
+
70
+ return generatedClassField;
71
+ };
72
+
73
+ const generateSingleParameter = parameter => {
74
+ let generatedParameter = {
75
+ deprecated: !!parameter.deprecated,
76
+ name: parameter.name,
77
+ type: generateType(parameter.type),
78
+ };
79
+
80
+ if (parameter.description) {
81
+ generatedParameter.description = parameter.description;
82
+ }
83
+
84
+ if (parameter.optional) {
85
+ generatedParameter.optional = parameter.optional;
86
+ }
87
+
88
+ return generatedParameter;
89
+ };
90
+
91
+ const generateParameters = (parameters) => {
92
+ return parameters.reduce((newParametersArray, parameter) => {
93
+ newParametersArray.push(generateSingleParameter(parameter));
94
+
95
+ return newParametersArray;
96
+ }, []);
97
+ };
98
+
99
+ const generateSingleClassMethod = classMethod => {
100
+ let generatedClassMethod = {
101
+ deprecated: !!classMethod.deprecated,
102
+ kind: "method",
103
+ name: classMethod.name,
104
+ privacy: classMethod.visibility,
105
+ static: classMethod.static,
106
+ };
107
+
108
+ if (classMethod.description) {
109
+ generatedClassMethod.description = classMethod.description;
110
+ }
111
+
112
+ if (classMethod.parameters && classMethod.parameters.length) {
113
+ generatedClassMethod.parameters = generateParameters(classMethod.parameters);
114
+ }
115
+
116
+ if (classMethod.returnValue) {
117
+ generatedClassMethod.return = {
118
+ type: generateType(classMethod.returnValue.type),
119
+ };
120
+
121
+ if (classMethod.returnValue.description) {
122
+ generatedClassMethod.return.description = classMethod.returnValue.type;
123
+ }
124
+ }
125
+
126
+ return generatedClassMethod;
127
+ };
128
+
129
+ const generateClassFields = classFields => {
130
+ return classFields.reduce((newClassFieldsArray, classField) => {
131
+ newClassFieldsArray.push(generateSingleClassField(classField));
132
+
133
+ return newClassFieldsArray;
134
+ }, []);
135
+ };
136
+
137
+ const generateClassMethods = classMethods => {
138
+ return classMethods.reduce((newClassMethodsArray, classMethod) => {
139
+ newClassMethodsArray.push(generateSingleClassMethod(classMethod));
140
+
141
+ return newClassMethodsArray;
142
+ }, []);
143
+ };
144
+
145
+ const generateMembers = (classFields, classMethods) => {
146
+ return [...generateClassFields(classFields), ...generateClassMethods(classMethods)];
147
+ };
148
+
149
+ const generateType = type => {
150
+ const dataType = apiIndex.get(type);
151
+
152
+ return {
153
+ text: dataType && dataType.name.includes(".types.") ?
154
+ filterPublicApi(dataType.properties)
155
+ .map(prop => `"${prop.name}"`)
156
+ .join(" | ") : type,
157
+ };
158
+ };
159
+
160
+ const generateSingleAttribute = attribute => {
161
+ let generatedAttribute = {
162
+ default: attribute.defaultValue,
163
+ deprecated: !!attribute.deprecated,
164
+ fieldName: attribute.name,
165
+ name: camelToKebabCase(attribute.name),
166
+ type: generateType(attribute.type),
167
+ };
168
+
169
+ if (attribute.description) {
170
+ generatedAttribute.description = attribute.description;
171
+ }
172
+
173
+ return generatedAttribute;
174
+ };
175
+
176
+ const generateAttributes = attributes => {
177
+ attributes = attributes.reduce((newAttributesArray, attribute) => {
178
+ newAttributesArray.push(generateSingleAttribute(attribute));
179
+
180
+ return newAttributesArray;
181
+ }, []);
182
+
183
+ return attributes;
184
+ };
185
+
186
+ const generateSingleEvent = event => {
187
+ let generatedEvent = {
188
+ deprecated: !!event.deprecated,
189
+ name: event.name,
190
+ type: event.native === "true" ? "NativeEvent" : "CustomEvent",
191
+ };
192
+
193
+ if (event.description) {
194
+ generatedEvent.description = event.description;
195
+ }
196
+
197
+ return generatedEvent;
198
+ };
199
+
200
+ const generateEvents = events => {
201
+ events = events.reduce((newEventsArray, event) => {
202
+ newEventsArray.push(generateSingleEvent(event));
203
+
204
+ return newEventsArray;
205
+ }, []);
206
+
207
+ return events;
208
+ };
209
+
210
+ const generateSingleSlot = slot => {
211
+ return {
212
+ deprecated: !!slot.deprecated,
213
+ description: slot.description,
214
+ name: slot.name,
215
+ };
216
+ };
217
+
218
+ const generateSlots = slots => {
219
+ slots = slots.reduce((newSlotsArray, event) => {
220
+ newSlotsArray.push(generateSingleSlot(event));
221
+
222
+ return newSlotsArray;
223
+ }, []);
224
+
225
+ return slots;
226
+ };
227
+
228
+ const generateCustomElementDeclaration = entity => {
229
+ entity = generateFullComponentApi(entity);
230
+
231
+ let generatedCustomElementDeclaration = {
232
+ deprecated: !!entity.deprecated,
233
+ customElement: true,
234
+ kind: entity.basename,
235
+ name: entity.basename,
236
+ tagName: entity.tagname,
237
+ };
238
+
239
+ const slots = filterPublicApi(entity.slots);
240
+ const events = filterPublicApi(entity.events);
241
+ const classFields = filterPublicApi(entity.properties);
242
+ const classMethods = filterPublicApi(entity.methods);
243
+ const attributes = classFields.filter(property => {
244
+ return property.noattribute !== "true" && property.readonly !== "true" && !forbiddenAttributeTypes.includes(property.type.toLowerCase());
245
+ });
246
+
247
+ if (slots.length) {
248
+ generatedCustomElementDeclaration.slots = generateSlots(slots);
249
+ }
250
+
251
+ if (events.length) {
252
+ generatedCustomElementDeclaration.events = generateEvents(events);
253
+ }
254
+
255
+ if (attributes.length) {
256
+ generatedCustomElementDeclaration.attributes = generateAttributes(attributes);
257
+ }
258
+
259
+ if (entity.description) {
260
+ generatedCustomElementDeclaration.description = entity.description;
261
+ }
262
+
263
+ if (classFields.length || classMethods.length) {
264
+ generatedCustomElementDeclaration.members = generateMembers(classFields, classMethods);
265
+ }
266
+
267
+ if (entity.extends && entity.extends !== "HTMLElement") {
268
+ generatedCustomElementDeclaration.superclass = generateRefenrece(apiIndex.get(entity.extends));
269
+ }
270
+
271
+ return generatedCustomElementDeclaration;
272
+ };
273
+
274
+ const generateRefenrece = (entity) => {
275
+ let packageName;
276
+
277
+ if (entity.name.includes("sap.ui.webcomponents.main")) {
278
+ packageName = "@ui5/webcomponents";
279
+ } else if (entity.name.includes("sap.ui.webcomponents.fiori")) {
280
+ packageName = "@ui5/webcomponents-fiori";
281
+ } else if (entity.name.includes("sap.ui.webcomponents.base")) {
282
+ packageName = "@ui5/webcomponents-base";
283
+ }
284
+
285
+ return {
286
+ module: `${entity.module}.js`,
287
+ name: `${entity.basename}`,
288
+ package: packageName,
289
+ };
290
+ };
291
+
292
+ const generateFullComponentApi = entity => {
293
+ const componentProps = ["properties", "slots", "events", "methods"];
294
+ let parent = apiIndex.get(entity.extends);
295
+
296
+ if (!parent) {
297
+ processedApiIndex.add(entity.name);
298
+
299
+ return entity;
300
+ }
301
+
302
+ parent = processedApiIndex.has(entity.extends) ? apiIndex.get(entity.extends) : generateFullComponentApi(parent);
303
+
304
+ componentProps.forEach(prop => {
305
+ if (parent[prop] && parent[prop].length) {
306
+ if (entity[prop] && entity[prop].length) {
307
+ const uniqueParentState = parent[prop].filter(pSlot => {
308
+ return !entity[prop].some(eSlot => eSlot.name === pSlot.name);
309
+ });
310
+
311
+ entity[prop] = entity[prop].concat(uniqueParentState);
312
+ } else {
313
+ entity[prop] = [...parent[prop]];
314
+ }
315
+ }
316
+ });
317
+
318
+ processedApiIndex.add(entity.name);
319
+
320
+ return entity;
321
+ };
322
+
323
+ const filterPublicApi = array => {
324
+ return (array || []).filter(el => el.visibility === "public");
325
+ };
326
+
327
+ const generate = async () => {
328
+ const apiFilesPaths = [
329
+ require.resolve("@ui5/webcomponents-base/dist/api.json"),
330
+ require.resolve("@ui5/webcomponents/dist/api.json"),
331
+ require.resolve("@ui5/webcomponents-fiori/dist/api.json"),
332
+ ];
333
+
334
+ let apiFiles = new Map();
335
+
336
+ await Promise.all(apiFilesPaths.map(async (apiFilePath) => {
337
+ const file = JSON.parse(await fs.readFile(apiFilePath));
338
+
339
+ apiFiles.set(apiFilePath, file);
340
+
341
+ file.symbols.forEach(symbol => {
342
+ apiIndex.set(symbol.name, symbol);
343
+ });
344
+ }));
345
+
346
+ await Promise.all(apiFilesPaths.map(async (apiFilePath) => {
347
+ if (apiFilePath.includes("base")) {
348
+ return;
349
+ }
350
+
351
+ let customElementsManifest = {
352
+ schemaVersion: "1.0.0",
353
+ readme: "",
354
+ modules: [],
355
+ };
356
+
357
+ apiFiles.get(apiFilePath).symbols.forEach(entity => {
358
+ if (entity.tagname) {
359
+ customElementsManifest.modules.push(generateJavaScriptModule(entity));
360
+ }
361
+ });
362
+
363
+ await fs.writeFile(apiFilePath.replace("api.json", "custom-elements.json"), JSON.stringify(customElementsManifest));
364
+ }));
365
+ };
366
+
367
+ generate().then(() => {
368
+ console.log("Custom elements manifest generated.");
369
+ });
@@ -0,0 +1,72 @@
1
+ const fs = require("fs").promises;
2
+ const path = require('path');
3
+
4
+ const generate = async () => {
5
+ const fioriInputFolder = path.normalize(process.argv[2]);
6
+ const tntInputFolder = path.normalize(process.argv[3]);
7
+ const outputFile = path.normalize(`${process.argv[4]}/Illustrations.js`);
8
+
9
+ const dir = await fs.readdir(fioriInputFolder);
10
+ const fioriIllustrationsOnFileSystem = dir.map(illustrationName => {
11
+ const fioriMatches = illustrationName.match(/.*\.js$/);
12
+ return fioriMatches ? illustrationName : undefined;
13
+ }).filter(key => !!key);
14
+
15
+ const tntDir = await fs.readdir(tntInputFolder);
16
+ const tntIllustrationsOnFileSystem = tntDir.map(illustrationName => {
17
+ const tntMatches = illustrationName.match(/.*\.js$/);
18
+ return tntMatches ? illustrationName : undefined;
19
+ }).filter(key => !!key);
20
+
21
+ // dynamic imports for Fiori illustrations
22
+ const fioriAvailableIllustrationsArray = `[${fioriIllustrationsOnFileSystem.filter(
23
+ // skipping the items starting with sapIllus-Dialog, sapIllus-Scene, sapIllus-Spot since they are included in the illustration's js file
24
+ line => !line.startsWith("sapIllus-Dialog") && !line.startsWith("sapIllus-Scene") && !line.startsWith("sapIllus-Spot") && !line.startsWith("AllIllustrations")).map(illustrationName => `"${illustrationName.replace('.js', '')}"`).join(", ")}]`;
25
+
26
+ const fioriDynamicImportLines = fioriIllustrationsOnFileSystem.map(illustrationName =>
27
+ `\t\tcase "${illustrationName.replace('.js', '')}": return (await import("../../illustrations/${illustrationName}")).default;`).filter(
28
+ // skipping the items starting with sapIllus-Dialog, sapIllus-Scene, sapIllus-Spot since they are included in the illustration's js file
29
+ line => !line.startsWith("\t\tcase \"sapIllus-Dialog") && !line.startsWith("\t\tcase \"sapIllus-Scene") && !line.startsWith("\t\tcase \"sapIllus-Spot") && !line.startsWith("\t\tcase \"AllIllustrations")).join("\n");
30
+
31
+ // dynamic imports for Tnt illustrations
32
+ const tntAvailableIllustrationsArray = `[${tntIllustrationsOnFileSystem.filter(
33
+ // skipping the items starting with tnt-Dialog, tnt-Scene, tnt-Spot since they are included in the illustration's js file
34
+ line => !line.startsWith("tnt-Dialog") && !line.startsWith("tnt-Scene") && !line.startsWith("tnt-Spot")).map(illustrationName => `"Tnt${illustrationName.replace('.js', '')}"`).join(", ")}]`;
35
+
36
+ const tntDynamicImportLines = tntIllustrationsOnFileSystem.map(illustrationName =>
37
+ `\t\tcase "Tnt${illustrationName.replace('.js', '')}": return (await import("../../illustrations/tnt/${illustrationName}")).default;`).filter(
38
+ // skipping the items starting with tnt-Dialog, tnt-Scene, tnt-Spot since they are included in the illustration's js file
39
+ line => !line.startsWith("\t\tcase \"Tnttnt-Dialog") && !line.startsWith("\t\tcase \"Tnttnt-Scene") && !line.startsWith("\t\tcase \"Tnttnt-Spot")).join("\n");
40
+
41
+
42
+ // dynamic imports file content
43
+ const contentDynamic = `import { registerIllustrationLoader } from "@ui5/webcomponents-base/dist/asset-registries/Illustrations.js";
44
+
45
+ const loadIllustration = async (illustrationName) => {
46
+ switch (illustrationName) {
47
+ ${fioriDynamicImportLines}
48
+ ${tntDynamicImportLines}
49
+ default: throw new Error("[Illustrations] Illustration not found: " + illustrationName);
50
+ }
51
+ };
52
+ const loadAndCheck = async (illustrationName) => {
53
+ const data = await loadIllustration(illustrationName);
54
+ return data;
55
+ }
56
+
57
+
58
+ ${fioriAvailableIllustrationsArray}.forEach(illustrationName => registerIllustrationLoader(illustrationName, loadAndCheck));
59
+ ${tntAvailableIllustrationsArray}.forEach(illustrationName => registerIllustrationLoader(illustrationName, loadAndCheck));`;
60
+
61
+
62
+ await fs.mkdir(path.dirname(outputFile), { recursive: true });
63
+ return Promise.all([fs.writeFile(outputFile, contentDynamic)]);
64
+ };
65
+
66
+ generate().then(() => {
67
+ console.log("Generated Illustrations.js");
68
+ })
69
+ .catch(err => {
70
+ console.error(err);
71
+ process.exit(1);
72
+ });
@@ -17,6 +17,14 @@ const hbs2lit = async (file) => {
17
17
 
18
18
  sPreprocessed = removeWhiteSpaces(sPreprocessed);
19
19
 
20
+ // icons hack
21
+ if (sPreprocessed.startsWith("<g ") || sPreprocessed.startsWith("<g>")) {
22
+ return `
23
+ let block0 = () => {
24
+ return svg\`${sPreprocessed}\`
25
+ }`;
26
+ }
27
+
20
28
  const ast = Handlebars.parse(sPreprocessed);
21
29
 
22
30
  const pv = new PartialsVisitor();
@@ -34,7 +34,7 @@ function HTMLLitVisitor(debug) {
34
34
  this.blocks = {};
35
35
  this.result = "";
36
36
  this.mainBlock = "";
37
- this.blockPath = "context";
37
+ this.blockLevel = 0;
38
38
  this.blockParameters = ["context", "tags", "suffix"];
39
39
  this.paths = []; //contains all normalized relative paths
40
40
  this.debug = debug;
@@ -57,7 +57,6 @@ HTMLLitVisitor.prototype.Program = function(program) {
57
57
  this.blocks[this.prevKey()] += this.currentKey() + "(" + this.blockParameters.join(", ") + ")";
58
58
  } else {
59
59
  this.mainBlock = this.currentKey();
60
- this.paths.push(this.blockPath);
61
60
  }
62
61
 
63
62
  this.blocks[this.currentKey()] += "html`";
@@ -173,7 +172,7 @@ function visitEachBlock(block) {
173
172
 
174
173
  this.blocks[this.currentKey()] += "${ repeat(" + normalizePath.call(this, block.params[0].original) + ", (item, index) => item._id || index, (item, index) => ";
175
174
  this.paths.push(normalizePath.call(this, block.params[0].original));
176
- this.blockPath = "item";
175
+ this.blockLevel++;
177
176
 
178
177
  if (this.blockParameters.indexOf("item") === -1) {
179
178
  bParamAdded = true;
@@ -185,8 +184,7 @@ function visitEachBlock(block) {
185
184
  this.blockParameters.shift("item");
186
185
  this.blockParameters.shift("index");
187
186
  }
188
- this.blockPath = "context";
189
-
187
+ this.blockLevel--;
190
188
  this.blocks[this.currentKey()] += ") }";
191
189
  }
192
190
 
@@ -195,12 +193,52 @@ function normalizePath(sPath) {
195
193
 
196
194
  //read carefully - https://github.com/wycats/handlebars.js/issues/1028
197
195
  //kpdecker commented on May 20, 2015
198
- if (result.indexOf("../") === 0) {
199
- let absolutePath = replaceAll(this.paths[this.paths.length - 1], ".", "/") + "/" + result;
196
+
197
+ if (result.indexOf("@root") === 0) {
198
+ // Trying to access root context via the HBS "@root" variable.
199
+ // Example: {{@root.property}} compiles to "context.property" - called from anywhere within the template.
200
+ result = result.replace("@root", "context");
201
+
202
+ } else if (result.indexOf("../") === 0) {
203
+ let absolutePath;
204
+ const levelsUp = (result.match(/..\//g) || []).length;
205
+
206
+ if (this.blockLevel <= levelsUp) {
207
+ // Trying to access root context from nested loops.
208
+ // Example: {{../../property}} compiles to "context.property" - when currently in a nested level loop.
209
+ // Example: {{../../../property}} compile to "context.property" - when requested levels are not present. fallback to root context.
210
+ absolutePath = `context.${replaceAll(result,"../", "")}`;
211
+ } else {
212
+ // Trying to access upper context (one-level-up) and based on the current lelev, that could be "context" or "item".
213
+ // Example: {{../property}} compiles to "context.property" - when called in a top level loop.
214
+ // Example: {{../property}} compiles to "item.property" - when called in a nested level loop.
215
+ // TODO: the second example, although correctly generated to "item.property", "item" will point to the current object within the nested loop,
216
+ // not the upper level loop as intended. So accessing the upper loop from nested loop is currently not working.
217
+ absolutePath = replaceAll(this.paths[this.paths.length - 1 - levelsUp], ".", "/") + "/" + result;
218
+ }
219
+
200
220
  result = replaceAll(path.normalize(absolutePath), path.sep, ".");
221
+
201
222
  } else {
202
- result = result ? replaceAll(this.blockPath + "/" + result, "/", ".") : this.blockPath;
223
+ // When neither "@root", nor "../" are used, use the following contexts:
224
+ // - use "context" - for the top level of execution, e.g "this.blockLevel = 0".
225
+ // - use "item" - for any nested level, e.g "this.blockLevel > 0".
226
+ // Example:
227
+ //
228
+ // {{text}} -> compiles to "context.text"
229
+ // {{#each items}}
230
+ // Item text: {{text}}</div> -> compiles to "item.text"
231
+ // {{#each words}}
232
+ // Word text: {{text}}</div> -> compiles to "item.text"
233
+ // {{/each}}
234
+ // Item text: {{text}}</div> -> compiles to "item.text"
235
+ // {{/each}}
236
+ // {{text}} -> compiles to "context.text"
237
+
238
+ const blockPath = this.blockLevel > 0 ? "item" : "context";
239
+ result = result ? replaceAll(blockPath + "/" + result, "/", ".") : blockPath;
203
240
  }
241
+
204
242
  return result;
205
243
  }
206
244
 
@@ -22,6 +22,15 @@ const generate = async () => {
22
22
  } catch (e) {
23
23
  }
24
24
 
25
+ // Merge messagebundle.properties and messagebundle_en.properties files to generate the default texts.
26
+ // Note:
27
+ // (1) at DEV time, it's intuituve to work with the source bundle file - the messagebundle.properties,
28
+ // and see the changes there take effect.
29
+ // (2) as the messagebundle.properties file is always written in English,
30
+ // it makes sense to consider the messagebundle.properties content only when the default language is "en".
31
+ if (defaultLanguage === "en") {
32
+ defaultLanguageProperties = Object.assign({}, defaultLanguageProperties, properties);
33
+ }
25
34
 
26
35
  /*
27
36
  * Returns the single text object to enable single export.
@@ -34,6 +34,10 @@
34
34
  * native
35
35
  *
36
36
  * noattribute
37
+ *
38
+ * formEvents
39
+ *
40
+ * formProperty
37
41
  *
38
42
  * allowPreventDefault
39
43
  *
@@ -2108,6 +2112,34 @@ exports.defineTags = function(dictionary) {
2108
2112
  doclet.noattribute = true;
2109
2113
  }
2110
2114
  });
2115
+
2116
+ dictionary.defineTag('formEvents', {
2117
+ mustHaveValue: false,
2118
+ onTagged: function(doclet, tag) {
2119
+ if (tag.value) {
2120
+ doclet.formEvents = doclet.formEvents || [];
2121
+ tag.value.split(" ").forEach(function($) {
2122
+ if ( doclet.formEvents.indexOf($) < 0 ) {
2123
+ doclet.formEvents.push($);
2124
+ }
2125
+ });
2126
+ }
2127
+ }
2128
+ });
2129
+
2130
+ dictionary.defineTag('formProperty', {
2131
+ mustHaveValue: false,
2132
+ onTagged: function(doclet, tag) {
2133
+ doclet.formProperty = true;
2134
+ }
2135
+ });
2136
+
2137
+ dictionary.defineTag('formAssociated', {
2138
+ mustHaveValue: false,
2139
+ onTagged: function(doclet, tag) {
2140
+ doclet.formAssociated = doclet.formAssociated || true;
2141
+ }
2142
+ });
2111
2143
  };
2112
2144
 
2113
2145
  exports.handlers = {
@@ -2820,6 +2820,14 @@ function createAPIJSON4Symbol(symbol, omitDefaults) {
2820
2820
  attrib("since", extractVersion(member.since));
2821
2821
  }
2822
2822
 
2823
+ if ( member.formEvents ) {
2824
+ attrib("formEvents", member.formEvents);
2825
+ }
2826
+
2827
+ if ( member.formEvents ) {
2828
+ attrib("formProperty", member.formProperty);
2829
+ }
2830
+
2823
2831
  var type = listTypes(member.type);
2824
2832
  attrib("type", type);
2825
2833
 
@@ -3865,7 +3873,7 @@ function createAPIJS(symbols, filename) {
3865
3873
 
3866
3874
  var output = [];
3867
3875
 
3868
- var rkeywords = /^(?:abstract|as|boolean|break|byte|case|catch|char|class|continue|const|debugger|default|delete|do|double|else|enum|export|extends|false|final|finally|float|for|function|goto|if|implements|import|in|instanceof|int|interface|is|long|namespace|native|new|null|noattribute|package|private|protected|public|return|short|static|super|switch|synchronized|this|throw|throws|transient|true|try|typeof|use|var|void|volatile|while|with)$/;
3876
+ var rkeywords = /^(?:abstract|as|boolean|break|byte|case|catch|char|class|continue|const|debugger|default|delete|do|double|else|enum|export|extends|false|final|finally|float|for|function|formEvents|formProperty|goto|if|implements|import|in|instanceof|int|interface|is|long|namespace|native|new|null|noattribute|package|private|protected|public|return|short|static|super|switch|synchronized|this|throw|throws|transient|true|try|typeof|use|var|void|volatile|while|with)$/;
3869
3877
 
3870
3878
  function isNoKeyword($) { return !rkeywords.test($.name); }
3871
3879
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ui5/webcomponents-tools",
3
- "version": "1.7.1",
3
+ "version": "1.9.0",
4
4
  "description": "UI5 Web Components: webcomponents.tools",
5
5
  "author": "SAP SE (https://www.sap.com)",
6
6
  "license": "Apache-2.0",