@ui5/webcomponents-tools 0.0.0-f651a470c → 0.0.0-f6676abdd
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 +1346 -0
- package/README.md +3 -5
- package/assets-meta.js +11 -10
- package/components-package/cypress/support/commands.js +66 -0
- package/components-package/cypress/support/component-index.html +17 -0
- package/components-package/cypress/support/component.d.ts +22 -0
- package/components-package/cypress/support/component.js +46 -0
- package/components-package/cypress/support/cypress-ct-preact.js +11 -0
- package/components-package/cypress.config.js +33 -0
- package/components-package/eslint.js +94 -28
- package/components-package/nps.js +58 -47
- package/components-package/postcss.components.js +1 -21
- package/components-package/postcss.themes.js +1 -26
- package/components-package/vite.config.js +7 -11
- package/components-package/wdio.js +415 -393
- package/icons-collection/nps.js +9 -7
- package/lib/amd-to-es6/index.js +102 -0
- package/lib/amd-to-es6/no-remaining-require.js +33 -0
- package/lib/cem/custom-elements-manifest.config.mjs +544 -0
- package/lib/cem/event.mjs +168 -0
- package/lib/cem/schema-internal.json +1413 -0
- package/lib/cem/schema.json +1098 -0
- package/lib/cem/types-internal.d.ts +808 -0
- package/lib/cem/types.d.ts +736 -0
- package/lib/cem/utils.mjs +423 -0
- package/lib/cem/validate.js +70 -0
- package/lib/create-icons/index.js +8 -6
- package/lib/create-illustrations/index.js +51 -30
- package/lib/create-new-component/{tsFileContentTemplate.js → Component.js} +15 -25
- package/lib/create-new-component/ComponentTemplate.js +12 -0
- package/lib/create-new-component/index.js +35 -73
- package/lib/css-processors/css-processor-components.mjs +77 -0
- package/lib/css-processors/css-processor-themes.mjs +74 -0
- package/lib/css-processors/scope-variables.mjs +49 -0
- package/lib/css-processors/shared.mjs +56 -0
- package/lib/dev-server/custom-hot-update-plugin.js +39 -0
- package/lib/dev-server/{dev-server.js → dev-server.mjs} +4 -4
- package/lib/dev-server/virtual-index-html-plugin.js +24 -20
- package/lib/generate-js-imports/illustrations.js +78 -64
- package/lib/generate-json-imports/i18n.js +45 -61
- package/lib/generate-json-imports/themes.js +16 -33
- package/lib/hbs2lit/src/compiler.js +9 -6
- package/lib/hbs2lit/src/litVisitor2.js +42 -17
- package/lib/hbs2lit/src/svgProcessor.js +12 -5
- package/lib/hbs2ui5/RenderTemplates/LitRenderer.js +39 -6
- package/lib/hbs2ui5/index.js +23 -6
- package/lib/i18n/defaults.js +3 -2
- package/lib/postcss-combine-duplicated-selectors/index.js +12 -5
- package/lib/remove-dev-mode/remove-dev-mode.mjs +37 -0
- package/lib/scoping/get-all-tags.js +10 -3
- package/lib/scoping/lint-src.js +8 -7
- package/lib/scoping/scope-test-pages.js +2 -1
- package/lib/test-runner/test-runner.js +2 -2
- package/package.json +25 -13
- package/tsconfig.json +18 -0
- package/types/index.d.ts +1 -0
- package/components-package/wdio.sync.js +0 -360
- package/lib/create-new-component/jsFileContentTemplate.js +0 -77
- package/lib/esm-abs-to-rel/index.js +0 -58
- package/lib/generate-custom-elements-manifest/index.js +0 -327
- package/lib/jsdoc/config.json +0 -29
- package/lib/jsdoc/configTypescript.json +0 -29
- package/lib/jsdoc/plugin.js +0 -2468
- package/lib/jsdoc/preprocess.js +0 -146
- package/lib/jsdoc/template/publish.js +0 -4120
- package/lib/postcss-css-to-esm/index.js +0 -90
- package/lib/postcss-css-to-json/index.js +0 -47
- package/lib/postcss-new-files/index.js +0 -36
- package/lib/postcss-p/postcss-p.mjs +0 -14
- package/lib/replace-global-core/index.js +0 -25
package/lib/hbs2ui5/index.js
CHANGED
@@ -1,10 +1,13 @@
|
|
1
1
|
const fs = require('fs').promises;
|
2
|
+
const existsSync = require('fs').existsSync;
|
2
3
|
const getopts = require('getopts');
|
3
4
|
const hbs2lit = require('../hbs2lit');
|
4
5
|
const path = require('path');
|
5
6
|
const litRenderer = require('./RenderTemplates/LitRenderer');
|
6
7
|
const recursiveReadDir = require("recursive-readdir");
|
7
8
|
|
9
|
+
let missingTypesReported = false;
|
10
|
+
|
8
11
|
const args = getopts(process.argv.slice(2), {
|
9
12
|
alias: {
|
10
13
|
o: 'output',
|
@@ -21,15 +24,29 @@ const onError = (place) => {
|
|
21
24
|
console.log(`A problem occoured when reading ${place}. Please recheck passed parameters.`);
|
22
25
|
};
|
23
26
|
|
24
|
-
const isHandlebars = (fileName) => fileName.
|
27
|
+
const isHandlebars = (fileName) => fileName.endsWith('.hbs');
|
28
|
+
|
29
|
+
const hasTypes = (file, componentName) => {
|
30
|
+
const tsFile = path.join(path.dirname(file), componentName + ".ts")
|
31
|
+
const dtsFile = path.join(path.dirname(file), componentName + ".d.ts")
|
32
|
+
return existsSync(tsFile) || existsSync(dtsFile);
|
33
|
+
}
|
25
34
|
|
26
35
|
const processFile = async (file, outputDir) => {
|
27
|
-
const litCode = await hbs2lit(file);
|
28
|
-
const absoluteOutputDir = composeAbsoluteOutputDir(file, outputDir);
|
29
36
|
const componentNameMatcher = /(\w+)(\.hbs)/gim;
|
30
37
|
const componentName = componentNameMatcher.exec(file)[1];
|
38
|
+
const componentHasTypes = hasTypes(file, componentName);
|
39
|
+
if (!componentHasTypes) {
|
40
|
+
if (!missingTypesReported) {
|
41
|
+
console.warn("[Warn] The following templates do not have a corresponging .ts or .d.ts file and won't be type checked:")
|
42
|
+
missingTypesReported = true;
|
43
|
+
}
|
44
|
+
console.log(" -> " + componentName + ".hbs");
|
45
|
+
}
|
46
|
+
const litCode = await hbs2lit(file, componentName);
|
47
|
+
const absoluteOutputDir = composeAbsoluteOutputDir(file, outputDir);
|
31
48
|
|
32
|
-
return writeRenderers(absoluteOutputDir, componentName, litRenderer.generateTemplate(componentName, litCode));
|
49
|
+
return writeRenderers(absoluteOutputDir, componentName, litRenderer.generateTemplate(componentName, litCode, componentHasTypes));
|
33
50
|
};
|
34
51
|
|
35
52
|
const composeAbsoluteOutputDir = (file, outputDir) => {
|
@@ -70,7 +87,7 @@ const writeRenderers = async (outputDir, controlName, fileContent) => {
|
|
70
87
|
|
71
88
|
await fs.mkdir(outputDir, { recursive: true });
|
72
89
|
|
73
|
-
const compiledFilePath = `${outputDir}${path.sep}${controlName}Template.lit.js`;
|
90
|
+
const compiledFilePath = `${outputDir}${path.sep}${controlName}Template.lit.${process.env.UI5_TS ? "ts" : "js"}`;
|
74
91
|
|
75
92
|
// strip DOS line endings because the break the source maps
|
76
93
|
let fileContentUnix = fileContent.replace(/\r\n/g, "\n");
|
@@ -81,7 +98,7 @@ const writeRenderers = async (outputDir, controlName, fileContent) => {
|
|
81
98
|
|
82
99
|
let existingFileContent = "";
|
83
100
|
try {
|
84
|
-
existingFileContent = await fs.readFile(compiledFilePath);
|
101
|
+
existingFileContent = (await fs.readFile(compiledFilePath)).toString();
|
85
102
|
} catch (e) {}
|
86
103
|
|
87
104
|
if (existingFileContent !== fileContentUnix) {
|
package/lib/i18n/defaults.js
CHANGED
@@ -31,7 +31,8 @@ const generate = async () => {
|
|
31
31
|
// (2) as the messagebundle.properties file is always written in English,
|
32
32
|
// it makes sense to consider the messagebundle.properties content only when the default language is "en".
|
33
33
|
if (defaultLanguage === "en") {
|
34
|
-
|
34
|
+
// use messagebundle_en.properties to overwrite all developer properties, only the not translated ones will remain
|
35
|
+
defaultLanguageProperties = Object.assign({}, properties, defaultLanguageProperties);
|
35
36
|
}
|
36
37
|
|
37
38
|
/*
|
@@ -68,7 +69,7 @@ const generate = async () => {
|
|
68
69
|
const texts = textKeys.map(prop => getTextInfo(prop, properties[prop], defaultLanguageProperties && defaultLanguageProperties[prop])).join('');
|
69
70
|
|
70
71
|
// tabs are intentionally mixed to have proper identation in the produced file
|
71
|
-
return `${tsMode ? `import { I18nText } from "@ui5/webcomponents-base/dist/i18nBundle.js";` : ""}
|
72
|
+
return `${tsMode ? `import type { I18nText } from "@ui5/webcomponents-base/dist/i18nBundle.js";` : ""}
|
72
73
|
${texts}
|
73
74
|
export {${textKeys.join()}};`;
|
74
75
|
};
|
@@ -154,22 +154,29 @@ module.exports = (options) => {
|
|
154
154
|
options.removeDuplicatedProperties ||
|
155
155
|
options.removeDuplicatedValues
|
156
156
|
) {
|
157
|
-
removeDupProperties(
|
158
|
-
|
159
|
-
|
160
|
-
);
|
157
|
+
// removeDupProperties(
|
158
|
+
// destination,
|
159
|
+
// options.removeDuplicatedValues,
|
160
|
+
// );
|
161
161
|
}
|
162
162
|
} else {
|
163
163
|
if (
|
164
164
|
options.removeDuplicatedProperties ||
|
165
165
|
options.removeDuplicatedValues
|
166
166
|
) {
|
167
|
-
removeDupProperties(rule, options.removeDuplicatedValues);
|
167
|
+
// removeDupProperties(rule, options.removeDuplicatedValues);
|
168
168
|
}
|
169
169
|
// add new selector to symbol table
|
170
170
|
map.set(selector, rule);
|
171
171
|
}
|
172
172
|
},
|
173
|
+
OnceExit(root) {
|
174
|
+
root.nodes.forEach(node => {
|
175
|
+
if (node.type === "rule") {
|
176
|
+
removeDupProperties(node, options.removeDuplicatedValues);
|
177
|
+
}
|
178
|
+
})
|
179
|
+
}
|
173
180
|
};
|
174
181
|
},
|
175
182
|
};
|
@@ -0,0 +1,37 @@
|
|
1
|
+
import { globby } from "globby";
|
2
|
+
import * as esbuild from 'esbuild'
|
3
|
+
import * as fs from "fs";
|
4
|
+
|
5
|
+
let customPlugin = {
|
6
|
+
name: 'ui5-tools',
|
7
|
+
setup(build) {
|
8
|
+
build.onLoad({ filter: /UI5Element.ts$/ }, async (args) => {
|
9
|
+
let text = await fs.promises.readFile(args.path, 'utf8');
|
10
|
+
text = text.replaceAll(/const DEV_MODE = true/g, "");
|
11
|
+
text = text.replaceAll(/if \(DEV_MODE\)/g, "if (false)");
|
12
|
+
return {
|
13
|
+
contents: text,
|
14
|
+
loader: 'ts',
|
15
|
+
}
|
16
|
+
})
|
17
|
+
},
|
18
|
+
}
|
19
|
+
|
20
|
+
const getConfig = async () => {
|
21
|
+
const config = {
|
22
|
+
entryPoints: await globby("src/**/*.ts"),
|
23
|
+
bundle: false,
|
24
|
+
minify: true,
|
25
|
+
sourcemap: true,
|
26
|
+
outdir: 'dist/prod',
|
27
|
+
outbase: 'src',
|
28
|
+
plugins: [
|
29
|
+
customPlugin,
|
30
|
+
]
|
31
|
+
};
|
32
|
+
return config;
|
33
|
+
}
|
34
|
+
|
35
|
+
|
36
|
+
const config = await getConfig();
|
37
|
+
const result = await esbuild.build(config);
|
@@ -4,13 +4,20 @@ const glob = require("glob");
|
|
4
4
|
|
5
5
|
const getTag = file => {
|
6
6
|
const fileContent = String(fs.readFileSync(file)).replace(/\n/g, "");
|
7
|
-
|
8
|
-
|
7
|
+
let matches = fileContent.match(/\btag\b:\s*\"(.*?)\"/);
|
8
|
+
if (matches) {
|
9
|
+
return matches[1];
|
10
|
+
}
|
11
|
+
matches = fileContent.match(/@customElement\("(.*?)"\)/);
|
12
|
+
if (matches) {
|
13
|
+
return matches[1];
|
14
|
+
}
|
15
|
+
return undefined;
|
9
16
|
};
|
10
17
|
|
11
18
|
const getPackageTags = (packageDir) => {
|
12
19
|
const srcDir = path.join(packageDir, "src/");
|
13
|
-
return glob.sync(path.join(srcDir, "/**/*.
|
20
|
+
return glob.sync(path.join(srcDir, "/**/*.ts")).flatMap(file => {
|
14
21
|
const tag = getTag(file);
|
15
22
|
return [tag];
|
16
23
|
}).filter(item => !!item);
|
package/lib/scoping/lint-src.js
CHANGED
@@ -7,25 +7,26 @@ const tags = getAllTags(process.cwd());
|
|
7
7
|
|
8
8
|
const errors = [];
|
9
9
|
|
10
|
+
const removeComments = str => str.replaceAll(/\/\*[\s\S]*?\*\/|([^:]|^)\/\/.*$/gm, "");
|
11
|
+
|
10
12
|
glob.sync(path.join(process.cwd(), "src/**/*.css")).forEach(file => {
|
11
|
-
let content = String(fs.readFileSync(file));
|
13
|
+
let content = removeComments(String(fs.readFileSync(file)));
|
12
14
|
tags.forEach(tag => {
|
13
15
|
if (content.match(new RegExp(`(^|[^\.\-_A-Za-z0-9"\[])(${tag})([^\-_A-Za-z0-9]|$)`, "g"))) {
|
14
|
-
errors.push(
|
16
|
+
errors.push(`${tag} found in ${file}`);
|
15
17
|
}
|
16
18
|
});
|
17
19
|
});
|
18
20
|
|
19
|
-
glob.sync(path.join(process.cwd(), "src/**/*.
|
20
|
-
let content = String(fs.readFileSync(file));
|
21
|
+
glob.sync(path.join(process.cwd(), "src/**/*.ts")).forEach(file => {
|
22
|
+
let content = removeComments(String(fs.readFileSync(file)));
|
21
23
|
tags.forEach(tag => {
|
22
24
|
if (content.match(new RegExp(`querySelector[A-Za-z]*..${tag}`, "g"))) {
|
23
|
-
errors.push(`
|
25
|
+
errors.push(`querySelector for ${tag} found in ${file}`);
|
24
26
|
}
|
25
27
|
});
|
26
28
|
});
|
27
29
|
|
28
30
|
if (errors.length) {
|
29
|
-
errors.
|
30
|
-
throw new Error("Errors found.");
|
31
|
+
throw new Error(`Scoping-related errors found (f.e. used ui5-input instead of [ui5-input]): \n ${errors.join("\n")}`);
|
31
32
|
}
|
@@ -18,6 +18,7 @@ const replaceTagsHTML = content => {
|
|
18
18
|
|
19
19
|
// Replace tags in any content
|
20
20
|
const replaceTagsAny = content => {
|
21
|
+
console.log(tags.length);
|
21
22
|
tags.forEach(tag => {
|
22
23
|
content = content.replace(new RegExp(`(^|[^\-_A-Za-z0-9])(${tag})([^\-_A-Za-z0-9]|$)`, "g"), `$1$2-${suffix}$3`);
|
23
24
|
});
|
@@ -27,7 +28,7 @@ const replaceTagsAny = content => {
|
|
27
28
|
// Replace bundle names and HTML tag names in test pages
|
28
29
|
glob.sync(path.join(root, "/**/*.html")).forEach(file => {
|
29
30
|
let content = String(fs.readFileSync(file));
|
30
|
-
content = content.replace(
|
31
|
+
content = content.replace("%VITE_BUNDLE_PATH%", "%VITE_BUNDLE_PATH_SCOPED%");
|
31
32
|
content = replaceTagsHTML(content);
|
32
33
|
fs.writeFileSync(file, content);
|
33
34
|
});
|
@@ -61,8 +61,8 @@ if (process.argv.length > 3) {
|
|
61
61
|
let wdioConfig = "";
|
62
62
|
if (fs.existsSync("config/wdio.conf.cjs")) {
|
63
63
|
wdioConfig = "config/wdio.conf.cjs";
|
64
|
-
} else {
|
65
|
-
|
64
|
+
} else if (fs.existsSync("config/wdio.conf.js")) {
|
65
|
+
wdioConfig = "config/wdio.conf.js";
|
66
66
|
}
|
67
67
|
|
68
68
|
// run wdio with calculated parameters
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@ui5/webcomponents-tools",
|
3
|
-
"version": "0.0.0-
|
3
|
+
"version": "0.0.0-f6676abdd",
|
4
4
|
"description": "UI5 Web Components: webcomponents.tools",
|
5
5
|
"author": "SAP SE (https://www.sap.com)",
|
6
6
|
"license": "Apache-2.0",
|
@@ -10,6 +10,7 @@
|
|
10
10
|
"sapui5",
|
11
11
|
"ui5"
|
12
12
|
],
|
13
|
+
"types": "./types/index.d.ts",
|
13
14
|
"scripts": {},
|
14
15
|
"bin": {
|
15
16
|
"wc-dev": "bin/dev.js",
|
@@ -21,27 +22,35 @@
|
|
21
22
|
"directory": "packages/tools"
|
22
23
|
},
|
23
24
|
"dependencies": {
|
24
|
-
"@
|
25
|
-
"@
|
25
|
+
"@custom-elements-manifest/analyzer": "^0.8.4",
|
26
|
+
"@cypress/code-coverage": "^3.13.10",
|
27
|
+
"@typescript-eslint/eslint-plugin": "^6.9.0",
|
28
|
+
"@typescript-eslint/parser": "^6.9.0",
|
26
29
|
"@wdio/cli": "^7.19.7",
|
27
|
-
"@wdio/devtools-service": "^7.19.7",
|
28
30
|
"@wdio/dot-reporter": "^7.19.7",
|
29
31
|
"@wdio/local-runner": "^7.19.7",
|
30
32
|
"@wdio/mocha-framework": "^7.19.7",
|
31
33
|
"@wdio/spec-reporter": "^7.19.7",
|
32
34
|
"@wdio/static-server-service": "^7.19.5",
|
35
|
+
"ajv": "^8.12.0",
|
36
|
+
"cem-plugin-vs-code-custom-data-generator": "^1.4.2",
|
33
37
|
"chai": "^4.3.4",
|
34
38
|
"child_process": "^1.0.2",
|
35
|
-
"chokidar": "^3.
|
39
|
+
"chokidar": "^3.6.0",
|
36
40
|
"chokidar-cli": "^3.0.0",
|
37
41
|
"command-line-args": "^5.1.1",
|
42
|
+
"comment-parser": "^1.4.0",
|
38
43
|
"concurrently": "^6.0.0",
|
39
44
|
"cross-env": "^7.0.3",
|
40
|
-
"
|
45
|
+
"custom-element-jet-brains-integration": "^1.4.4",
|
46
|
+
"cypress": "^13.11.0",
|
47
|
+
"cypress-real-events": "^1.12.0",
|
41
48
|
"escodegen": "^2.0.0",
|
42
49
|
"eslint": "^7.22.0",
|
43
50
|
"eslint-config-airbnb-base": "^14.2.1",
|
44
|
-
"eslint-plugin-
|
51
|
+
"eslint-plugin-cypress": "^3.4.0",
|
52
|
+
"eslint-plugin-import": "^2.31.0",
|
53
|
+
"eslint-plugin-jsx-no-leaked-values": "^0.1.24",
|
45
54
|
"esprima": "^4.0.1",
|
46
55
|
"getopts": "^2.3.0",
|
47
56
|
"glob": "^7.1.6",
|
@@ -49,26 +58,26 @@
|
|
49
58
|
"globby": "^13.1.1",
|
50
59
|
"handlebars": "^4.7.7",
|
51
60
|
"is-port-reachable": "^3.1.0",
|
52
|
-
"jsdoc": "^3.6.6",
|
53
61
|
"json-beautify": "^1.1.1",
|
54
62
|
"mkdirp": "^1.0.4",
|
55
63
|
"nps": "^5.10.0",
|
56
64
|
"postcss": "^8.4.5",
|
57
65
|
"postcss-cli": "^9.1.0",
|
58
|
-
"postcss-import": "^14.0.2",
|
59
66
|
"postcss-selector-parser": "^6.0.10",
|
67
|
+
"preact": "^10.25.4",
|
68
|
+
"prompts": "^2.4.2",
|
60
69
|
"properties-reader": "^2.2.0",
|
61
70
|
"recursive-readdir": "^2.2.2",
|
62
71
|
"resolve": "^1.20.0",
|
63
72
|
"rimraf": "^3.0.2",
|
64
73
|
"slash": "3.0.0",
|
65
|
-
"vite": "^
|
66
|
-
"
|
67
|
-
"
|
74
|
+
"vite": "^5.4.8",
|
75
|
+
"vite-plugin-istanbul": "^6.0.2",
|
76
|
+
"wdio-chromedriver-service": "^7.3.2"
|
68
77
|
},
|
69
78
|
"peerDependencies": {
|
70
79
|
"chromedriver": "*",
|
71
|
-
"typescript": "^
|
80
|
+
"typescript": "^5.6.2"
|
72
81
|
},
|
73
82
|
"peerDependenciesMeta": {
|
74
83
|
"typescript": {
|
@@ -76,6 +85,9 @@
|
|
76
85
|
}
|
77
86
|
},
|
78
87
|
"devDependencies": {
|
88
|
+
"@cypress/mount-utils": "^4.1.2",
|
89
|
+
"cypress-real-events": "^1.12.0",
|
90
|
+
"esbuild": "^0.25.0",
|
79
91
|
"yargs": "^17.5.1"
|
80
92
|
}
|
81
93
|
}
|
package/tsconfig.json
ADDED
@@ -0,0 +1,18 @@
|
|
1
|
+
{
|
2
|
+
"compilerOptions": {
|
3
|
+
"target": "ES2021",
|
4
|
+
"lib": [
|
5
|
+
"DOM",
|
6
|
+
"DOM.Iterable",
|
7
|
+
"ES2023"
|
8
|
+
],
|
9
|
+
"declaration": true,
|
10
|
+
"skipLibCheck": true,
|
11
|
+
"sourceMap": true,
|
12
|
+
"inlineSources": true,
|
13
|
+
"strict": true,
|
14
|
+
"moduleResolution": "node",
|
15
|
+
"jsx": "react-jsx",
|
16
|
+
"jsxImportSource": "@ui5/webcomponents-base",
|
17
|
+
}
|
18
|
+
}
|
package/types/index.d.ts
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
import "../components-package/cypress/support/component"
|