@ui5/create-webcomponents-package 0.0.0-7d5f73b20 → 0.0.0-8085abb8d

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,176 @@
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.14.0-rc.1](https://github.com/SAP/ui5-webcomponents/compare/v1.14.0-rc.0...v1.14.0-rc.1) (2023-05-25)
7
+
8
+ **Note:** Version bump only for package @ui5/create-webcomponents-package
9
+
10
+
11
+
12
+
13
+
14
+ # [1.14.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v1.13.2...v1.14.0-rc.0) (2023-05-18)
15
+
16
+
17
+ ### Features
18
+
19
+ * users can provide a JSDoc namespeace when creating a package ([#7034](https://github.com/SAP/ui5-webcomponents/issues/7034)) ([0af8d23](https://github.com/SAP/ui5-webcomponents/commit/0af8d2376e25e5abe6d940c72286ab7c682eea56))
20
+
21
+
22
+
23
+
24
+
25
+ ## [1.13.1](https://github.com/SAP/ui5-webcomponents/compare/v1.13.0-rc.5...v1.13.1) (2023-05-11)
26
+
27
+
28
+ ### Bug Fixes
29
+
30
+ * **create-package:** revert `moduleResolution` setting to `node` ([#7020](https://github.com/SAP/ui5-webcomponents/issues/7020)) ([9fc84e2](https://github.com/SAP/ui5-webcomponents/commit/9fc84e288452616ee72f3a2b6fc31d9752f05f6f))
31
+
32
+
33
+
34
+
35
+
36
+ # [1.13.0-rc.5](https://github.com/SAP/ui5-webcomponents/compare/v1.13.0-rc.4...v1.13.0-rc.5) (2023-05-11)
37
+
38
+
39
+ ### Bug Fixes
40
+
41
+ * **create-webcomponents-package:** fix package creation issues with test and lint ([#6976](https://github.com/SAP/ui5-webcomponents/issues/6976)) ([dd70f3a](https://github.com/SAP/ui5-webcomponents/commit/dd70f3aa8ef70b592f1d4e0f3f9894c6280fb1bf))
42
+
43
+
44
+
45
+
46
+
47
+ # [1.13.0-rc.4](https://github.com/SAP/ui5-webcomponents/compare/v1.13.0-rc.3...v1.13.0-rc.4) (2023-05-04)
48
+
49
+
50
+ ### Features
51
+
52
+ * generate TS from HBS templates ([#6558](https://github.com/SAP/ui5-webcomponents/issues/6558)) ([02611b2](https://github.com/SAP/ui5-webcomponents/commit/02611b2e24b2c2a06129b8e60a8bc680d9501e39))
53
+
54
+
55
+
56
+
57
+
58
+ # [1.13.0-rc.3](https://github.com/SAP/ui5-webcomponents/compare/v1.13.0-rc.2...v1.13.0-rc.3) (2023-04-27)
59
+
60
+ **Note:** Version bump only for package @ui5/create-webcomponents-package
61
+
62
+
63
+
64
+
65
+
66
+ # [1.13.0-rc.2](https://github.com/SAP/ui5-webcomponents/compare/v1.13.0-rc.1...v1.13.0-rc.2) (2023-04-20)
67
+
68
+ **Note:** Version bump only for package @ui5/create-webcomponents-package
69
+
70
+
71
+
72
+
73
+
74
+ # [1.13.0-rc.1](https://github.com/SAP/ui5-webcomponents/compare/v1.13.0-rc.0...v1.13.0-rc.1) (2023-04-13)
75
+
76
+ **Note:** Version bump only for package @ui5/create-webcomponents-package
77
+
78
+
79
+
80
+
81
+
82
+ # [1.13.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v1.12.0...v1.13.0-rc.0) (2023-04-06)
83
+
84
+ **Note:** Version bump only for package @ui5/create-webcomponents-package
85
+
86
+
87
+
88
+
89
+
90
+ # [1.12.0](https://github.com/SAP/ui5-webcomponents/compare/v1.12.0-rc.3...v1.12.0) (2023-04-04)
91
+
92
+ **Note:** Version bump only for package @ui5/create-webcomponents-package
93
+
94
+
95
+
96
+
97
+
98
+ # [1.12.0-rc.3](https://github.com/SAP/ui5-webcomponents/compare/v1.12.0-rc.2...v1.12.0-rc.3) (2023-03-30)
99
+
100
+ **Note:** Version bump only for package @ui5/create-webcomponents-package
101
+
102
+
103
+
104
+
105
+
106
+ # [1.12.0-rc.2](https://github.com/SAP/ui5-webcomponents/compare/v1.12.0-rc.1...v1.12.0-rc.2) (2023-03-23)
107
+
108
+
109
+ ### Bug Fixes
110
+
111
+ * inline sources in the .map file so the src folder is not mandatory ([#6732](https://github.com/SAP/ui5-webcomponents/issues/6732)) ([16771a6](https://github.com/SAP/ui5-webcomponents/commit/16771a64d7b13f418af9afa1a03b224fe3762775))
112
+
113
+
114
+
115
+
116
+
117
+ # [1.12.0-rc.1](https://github.com/SAP/ui5-webcomponents/compare/v1.12.0-rc.0...v1.12.0-rc.1) (2023-03-16)
118
+
119
+ **Note:** Version bump only for package @ui5/create-webcomponents-package
120
+
121
+
122
+
123
+
124
+
125
+ # [1.12.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v1.11.0...v1.12.0-rc.0) (2023-03-09)
126
+
127
+ **Note:** Version bump only for package @ui5/create-webcomponents-package
128
+
129
+
130
+
131
+
132
+
133
+ # [1.11.0](https://github.com/SAP/ui5-webcomponents/compare/v1.11.0-rc.4...v1.11.0) (2023-03-06)
134
+
135
+ **Note:** Version bump only for package @ui5/create-webcomponents-package
136
+
137
+
138
+
139
+
140
+
141
+ # [1.11.0-rc.4](https://github.com/SAP/ui5-webcomponents/compare/v1.11.0-rc.3...v1.11.0-rc.4) (2023-03-02)
142
+
143
+ **Note:** Version bump only for package @ui5/create-webcomponents-package
144
+
145
+
146
+
147
+
148
+
149
+ # [1.11.0-rc.3](https://github.com/SAP/ui5-webcomponents/compare/v1.11.0-rc.2...v1.11.0-rc.3) (2023-02-23)
150
+
151
+ **Note:** Version bump only for package @ui5/create-webcomponents-package
152
+
153
+
154
+
155
+
156
+
157
+ # [1.11.0-rc.2](https://github.com/SAP/ui5-webcomponents/compare/v1.11.0-rc.1...v1.11.0-rc.2) (2023-02-16)
158
+
159
+ **Note:** Version bump only for package @ui5/create-webcomponents-package
160
+
161
+
162
+
163
+
164
+
165
+ # [1.11.0-rc.1](https://github.com/SAP/ui5-webcomponents/compare/v1.11.0-rc.0...v1.11.0-rc.1) (2023-02-09)
166
+
167
+
168
+ ### Features
169
+
170
+ * **framework:** add option to define package name, tag and typescript support from CLI ([#6379](https://github.com/SAP/ui5-webcomponents/issues/6379)) ([687c0f7](https://github.com/SAP/ui5-webcomponents/commit/687c0f7a420a72f77f294ace2898223c48708ae2)), closes [#6382](https://github.com/SAP/ui5-webcomponents/issues/6382)
171
+
172
+
173
+
174
+
175
+
6
176
  # [1.11.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v1.10.4-rc.0...v1.11.0-rc.0) (2023-02-02)
7
177
 
8
178
  **Note:** Version bump only for package @ui5/create-webcomponents-package
package/README.md CHANGED
@@ -13,13 +13,14 @@ Usage:
13
13
 
14
14
  # npm 6.x
15
15
  npm init @ui5/webcomponents-package [OPTIONS]
16
- # npm 7+, extra double-dash is needed:
16
+ # npm 7+, an extra double-dash is needed:
17
17
  npm init @ui5/webcomponents-package -- [OPTIONS]
18
18
 
19
19
  Options:
20
- --name <string> - defines package name
21
- --tag <string> - defines predefined custom element tag name
22
- --enable-typescript - enables TypeScript support to the package
20
+ --name <string> - defines the package name
21
+ --componentName <string> - defines the component class name that will be created in your new package
22
+ --tag <string> - defines the tag name of the sample web component that will be created in your new package. The tag will be derived from the component name if not provided.
23
+ --enable-typescript - enables TypeScript support for the package
23
24
  --skip - skips configuration and generates package with a default value for each parameter that wasn't passed
24
25
  ```
25
26
 
@@ -32,10 +33,10 @@ components package.
32
33
  Usage:
33
34
  yarn create @ui5/webcomponents-package [OPTIONS]
34
35
  Options:
35
- --name <string> - defines package name
36
- --tag <string> - defines predefined custom element tag name
37
- --enable-typescript - enables TypeScript support to the package
38
- --skip - skips all configurations and generates package with default configurations
36
+ --name <string> - defines the package name
37
+ --tag <string> - defines the tag name of the sample web component that will be created in your new package
38
+ --enable-typescript - enables TypeScript support for the package
39
+ --skip - skips configuration and generates package with a default value for each parameter that wasn't passed
39
40
  ```
40
41
 
41
42
  The script creates a new directory, and fills it with a `package.json` file and all necessary source files, and resources for a new
package/create-package.js CHANGED
@@ -5,8 +5,8 @@ const path = require("path");
5
5
  const mkdirp = require("mkdirp");
6
6
  const prompts = require("prompts");
7
7
  const parser = require("npm-config-user-agent-parser");
8
- const yargs = require('yargs/yargs');
9
- const { hideBin } = require('yargs/helpers');
8
+ const yargs = require("yargs/yargs");
9
+ const { hideBin } = require("yargs/helpers");
10
10
 
11
11
  const argv = yargs(hideBin(process.argv)).argv;
12
12
 
@@ -16,21 +16,38 @@ const version = JSON.parse(fs.readFileSync(path.join(__dirname, "package.json"))
16
16
  const TEMPLATE_DIR = path.join(`${__dirname}`, `template/`);
17
17
 
18
18
  // String utils
19
- const capitalizeFirst = str => str.substr(0,1).toUpperCase() + str.substr(1);
20
- const kebabToCamelCase = string => toCamelCase(string.split("-"));
21
- const toCamelCase = parts => {
22
- return parts.map((string, index) => {
23
- return index === 0 ? string.toLowerCase() : string.charAt(0).toUpperCase() + string.slice(1).toLowerCase();
24
- }).join("");
19
+ const isTSRelatedFile = sourcePath => {
20
+ return ["Assets.ts", "MyFirstComponent.ts", "tsconfig.json", "global.d.ts"].some(fileName => sourcePath.includes(fileName));
21
+ };
22
+ const isJSRelatedFile = sourcePath => {
23
+ return ["Assets.js", "MyFirstComponent.js"].some(fileName => sourcePath.includes(fileName));
24
+ };
25
+ const isGitIgnore = sourcePath => {
26
+ return sourcePath.includes("gitignore");
27
+ };
28
+ const isNPMRC = sourcePath => {
29
+ return sourcePath.includes("npmrc");
25
30
  };
26
- const isTypescriptRelatedFile = sourcePath => {
27
- return ["Аssets.ts", "MyFirstComponent.ts", "tsconfig.json", "global.d.ts"].some(fileName => sourcePath.includes(fileName));
28
- }
29
31
 
30
32
  // Validation of user input
31
- const isNameValid = name => typeof name === "string" && name.match(/^[a-zA-Z0-9\-_]+$/);
33
+ const ComponentNamePattern = /^[A-Z][A-Za-z0-9]+$/;
34
+ const NamespacePattern = /^[a-z][a-z0-9\.\-]+$/;
35
+ const isPackageNameValid = name => typeof name === "string" && name.match(/^(@[a-z0-9-~][a-z0-9-._~]*\/)?[a-z0-9-~][a-z0-9-._~]*$/);
36
+ const isComponentNameValid = name => typeof name === "string" && ComponentNamePattern.test(name);
37
+ const isNamespaceValid = name => typeof name === "string" && NamespacePattern.test(name);
32
38
  const isTagValid = tag => typeof tag === "string" && tag.match(/^[a-z0-9]+?-[a-zA-Z0-9\-_]+?[a-z0-9]$/);
33
39
 
40
+ /**
41
+ * Hyphanates the given PascalCase string, f.e.:
42
+ * Foo -> "my-foo" (adds preffix)
43
+ * FooBar -> "foo-bar"
44
+ */
45
+ const hyphaneteComponentName = (componentName) => {
46
+ const result = componentName.replace(/([a-z])([A-Z])/g, '$1-$2' ).toLowerCase();
47
+
48
+ return result.includes("-") ? result : `my-${result}`;
49
+ };
50
+
34
51
  // Utils for building the file structure
35
52
  const replaceVarsInFileContent = (vars, content) => {
36
53
  for (let key in vars) {
@@ -45,17 +62,28 @@ const replaceVarsInFileName = (vars, fileName) => {
45
62
  };
46
63
 
47
64
  const copyFile = (vars, sourcePath, destPath) => {
48
- const ignoreJsRelated = vars.INIT_PACKAGE_VAR_TYPESCRIPT && sourcePath.includes("MyFirstComponent.js")
49
- const ignoreTsRelated = !vars.INIT_PACKAGE_VAR_TYPESCRIPT && isTypescriptRelatedFile(sourcePath)
65
+ const ignoreJsRelated = vars.INIT_PACKAGE_VAR_TYPESCRIPT && isJSRelatedFile(sourcePath);
66
+ const ignoreTsRelated = !vars.INIT_PACKAGE_VAR_TYPESCRIPT && isTSRelatedFile(sourcePath);
50
67
 
51
68
  if (ignoreJsRelated || ignoreTsRelated) {
52
69
  return;
53
70
  }
54
71
 
55
- let content = fs.readFileSync(sourcePath, {encoding: "UTF-8"});
72
+ let content = fs.readFileSync(sourcePath, { encoding: "UTF-8" });
56
73
  content = replaceVarsInFileContent(vars, content);
57
74
  destPath = replaceVarsInFileName(vars, destPath);
75
+
58
76
  fs.writeFileSync(destPath, content);
77
+
78
+ // Rename "gitignore" to ".gitignore" (npm init won't include ".gitignore", so we add it as "gitignore" and rename it later)
79
+ if (isGitIgnore(sourcePath)) {
80
+ fs.renameSync(destPath, destPath.replace("gitignore", ".gitignore"))
81
+ }
82
+
83
+ // Rename "npmrc" to ".npmrc" (npm init won't include ".npmrc", so we add it as "npmrc" and rename it later)
84
+ if (isNPMRC(sourcePath)) {
85
+ fs.renameSync(destPath, destPath.replace("npmrc", ".npmrc"));
86
+ }
59
87
  };
60
88
 
61
89
  const copyFiles = (vars, sourcePath, destPath) => {
@@ -72,20 +100,20 @@ const copyFiles = (vars, sourcePath, destPath) => {
72
100
  }
73
101
  };
74
102
 
75
-
76
- const generateFilesContent = (name, tag, typescript) => {
77
- const className = capitalizeFirst(kebabToCamelCase(tag));
103
+ const generateFilesContent = (packageName, componentName, namespace, typescript, skipSubfolder) => {
104
+ const tagName = argv.tag || hyphaneteComponentName(componentName);
78
105
 
79
106
  // All variables that will be replaced in the content of the resources/
80
107
  const vars = {
81
- INIT_PACKAGE_VAR_NAME: name,
82
- INIT_PACKAGE_VAR_TAG: tag,
83
- INIT_PACKAGE_VAR_CLASS_NAME: className,
84
- INIT_PACKAGE_VAR_TYPESCRIPT: typescript
108
+ INIT_PACKAGE_VAR_NAMESPACE: namespace, // namespace must be replaced before name
109
+ INIT_PACKAGE_VAR_NAME: packageName,
110
+ INIT_PACKAGE_VAR_TAG: tagName,
111
+ INIT_PACKAGE_VAR_CLASS_NAME: componentName,
112
+ INIT_PACKAGE_VAR_TYPESCRIPT: typescript,
85
113
  };
86
114
 
87
115
  const packageContent = {
88
- name,
116
+ packageName,
89
117
  version: "0.0.1",
90
118
  ui5: {
91
119
  webComponentsPackage: true,
@@ -117,15 +145,21 @@ const generateFilesContent = (name, tag, typescript) => {
117
145
  },
118
146
  };
119
147
 
148
+ if (typescript) {
149
+ packageContent.devDependencies.typescript = "^4.9.4";
150
+ }
151
+
120
152
  // Update package.json
121
- const destDir = path.join(`./`, name);
153
+ let destDir = packageName.includes("@") ? packageName.slice(packageName.lastIndexOf("/") + 1) : packageName;
154
+
155
+ destDir = skipSubfolder ? path.join("./") : path.join("./", destDir);
122
156
  mkdirp.sync(destDir);
123
157
  fs.writeFileSync(path.join(destDir, "package.json"), JSON.stringify(packageContent, null, 2));
124
158
  // Copy files
125
159
  copyFiles(vars, TEMPLATE_DIR, destDir);
126
160
 
127
161
  console.log("\nPackage successfully created!\nNext steps:\n");
128
- console.log(`$ cd ${name}`);
162
+ console.log(`$ cd ${destDir}`);
129
163
 
130
164
  let userAgentInfo;
131
165
  try {
@@ -141,25 +175,35 @@ const generateFilesContent = (name, tag, typescript) => {
141
175
  }
142
176
 
143
177
  console.log("\n");
144
- }
178
+ };
145
179
 
146
180
  // Main function
147
181
  const createWebcomponentsPackage = async () => {
148
182
  let response;
149
- if (argv.name && !isNameValid(argv.name)) {
150
- throw new Error("The package name should be a string (a-z, A-Z, 0-9).");
183
+ if (argv.name && !isPackageNameValid(argv.name)) {
184
+ throw new Error("The package name should be a string, starting with letter and containing the following symbols [a-z, A-Z, 0-9].");
185
+ }
186
+
187
+ if (argv.componentName && !isComponentNameValid(argv.componentName)) {
188
+ throw new Error("The component name should be a string, starting with a capital letter [A-Z][a-z], for example: Button, MyButton, etc.");
189
+ }
190
+
191
+ if (argv.namespace && !isNamespaceValid(argv.namespace)) {
192
+ throw new Error("The JSDoc namespace must start with a letter and can only contain small-case letters, numbers, dots and dashes.");
151
193
  }
152
194
 
153
195
  if (argv.tag && !isTagValid(argv.tag) ) {
154
- throw new Error("The tag should be in kebab-case (my-first-component f.e) and it can't be a single word.");
196
+ throw new Error("The tag should be in kebab-case (f.e my-component) and it can't be a single word.");
155
197
  }
156
198
 
157
- let name = argv.name || "my-package";
158
- let tag = argv.tag || "my-first-component";
199
+ let packageName = argv.name || "my-package";
200
+ let componentName = argv.componentName || "MyComponent";
201
+ let namespace = argv.namespace || "demo.components";
159
202
  let typescriptSupport = !!argv.enableTypescript;
203
+ const skipSubfolder = !!argv.skipSubfolder;
160
204
 
161
- if (!!argv.skip) {
162
- return generateFilesContent(name, tag, typescriptSupport);
205
+ if (argv.skip) {
206
+ return generateFilesContent(packageName, componentName, namespace, typescriptSupport, skipSubfolder);
163
207
  }
164
208
 
165
209
  if (!argv.name) {
@@ -167,9 +211,9 @@ const createWebcomponentsPackage = async () => {
167
211
  type: "text",
168
212
  name: "name",
169
213
  message: "Package name:",
170
- validate: isNameValid,
214
+ validate: (value) => isPackageNameValid(value) ? true : "Package name should be a string, starting with a letter and containing the following symbols [a-z, A-Z ,0-9, _, -].",
171
215
  });
172
- name = response.name;
216
+ packageName = response.name;
173
217
  }
174
218
 
175
219
  if (!typescriptSupport) {
@@ -186,23 +230,34 @@ const createWebcomponentsPackage = async () => {
186
230
  title: "TypeScript",
187
231
  value: true,
188
232
  },
189
- ]
233
+ ],
190
234
  });
191
- typescript = response.language;
235
+ typescriptSupport = response.language;
192
236
  }
193
237
 
194
- if (!argv.tag) {
238
+ if (!argv.componentName) {
195
239
  response = await prompts({
196
240
  type: "text",
197
- name: "tag",
241
+ name: "componentName",
198
242
  message: "Component name:",
199
- initial: "my-first-component",
200
- validate: isTagValid,
243
+ initial: "MyComponent",
244
+ validate: (value) => isComponentNameValid(value) ? true : "Component name should follow PascalCase naming convention (f.e. Button, MyButton, etc.).",
245
+ });
246
+ componentName = response.componentName;
247
+ }
248
+
249
+ if (!argv.namespace) {
250
+ response = await prompts({
251
+ type: "text",
252
+ name: "namespace",
253
+ message: "JSDoc namespace:",
254
+ initial: "demo.components",
255
+ validate: (value) => isNamespaceValid(value) ? true : "The JSDoc namespace must start with a letter and can only contain small-case letters, numbers, dots and dashes.",
201
256
  });
202
- tag = response.tag;
257
+ namespace = response.namespace;
203
258
  }
204
259
 
205
- return generateFilesContent(name, tag, typescript);
260
+ return generateFilesContent(packageName, componentName, namespace, typescriptSupport, skipSubfolder);
206
261
  };
207
262
 
208
263
  createWebcomponentsPackage();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ui5/create-webcomponents-package",
3
- "version": "0.0.0-7d5f73b20",
3
+ "version": "0.0.0-8085abb8d",
4
4
  "description": "UI5 Web Components: create package",
5
5
  "author": "SAP SE (https://www.sap.com)",
6
6
  "license": "Apache-2.0",
@@ -21,9 +21,7 @@
21
21
  "dependencies": {
22
22
  "mkdirp": "^1.0.4",
23
23
  "npm-config-user-agent-parser": "^1.0.0",
24
- "prompts": "^2.4.1"
25
- },
26
- "devDependencies": {
24
+ "prompts": "^2.4.1",
27
25
  "yargs": "^17.5.1"
28
26
  }
29
27
  }
@@ -2,4 +2,5 @@
2
2
  dist
3
3
  test
4
4
  src/generated
5
- jsdoc-dist
5
+ jsdoc-dist
6
+ .eslintrc.js
@@ -0,0 +1,5 @@
1
+ const config = require("@ui5/webcomponents-tools/components-package/eslint.js");
2
+
3
+ // This eslint config is defined @ui5/webcomponents-tools,
4
+ // Feel free to override part of the configuration or provide entirely new config to fit your dev requirements.
5
+ module.exports = config;
@@ -0,0 +1,4 @@
1
+ node_modules
2
+ dist
3
+ jsdoc-dist
4
+ src/generated
package/template/npmrc ADDED
@@ -0,0 +1,2 @@
1
+ # Auto detect the chromedriver version
2
+ detect_chromedriver_version=true
@@ -31,7 +31,7 @@ const metadata = {
31
31
  * The <code>INIT_PACKAGE_VAR_TAG</code> component is a demo component that displays some text.
32
32
  *
33
33
  * @constructor
34
- * @alias demo.components.INIT_PACKAGE_VAR_CLASS_NAME
34
+ * @alias INIT_PACKAGE_VAR_NAMESPACE.INIT_PACKAGE_VAR_CLASS_NAME
35
35
  * @extends sap.ui.webc.base.UI5Element
36
36
  * @tagname INIT_PACKAGE_VAR_TAG
37
37
  * @public
@@ -20,27 +20,20 @@ import { PLEASE_WAIT } from "./generated/i18n/i18n-defaults.js";
20
20
  * The <code>INIT_PACKAGE_VAR_TAG</code> component is a demo component that displays some text.
21
21
  *
22
22
  * @constructor
23
- * @alias demo.components.INIT_PACKAGE_VAR_CLASS_NAME
23
+ * @alias INIT_PACKAGE_VAR_NAMESPACE.INIT_PACKAGE_VAR_CLASS_NAME
24
24
  * @extends sap.ui.webc.base.UI5Element
25
25
  * @tagname INIT_PACKAGE_VAR_TAG
26
26
  * @public
27
27
  */
28
- @customElement("INIT_PACKAGE_VAR_TAG")
28
+ @customElement({
29
+ tag: "INIT_PACKAGE_VAR_TAG",
30
+ renderer: litRender,
31
+ styles: INIT_PACKAGE_VAR_CLASS_NAMECss,
32
+ template: INIT_PACKAGE_VAR_CLASS_NAMETemplate,
33
+ })
29
34
  class INIT_PACKAGE_VAR_CLASS_NAME extends UI5Element {
30
35
  static i18nBundle: I18nBundle;
31
36
 
32
- static get render() {
33
- return litRender;
34
- }
35
-
36
- static get template() {
37
- return INIT_PACKAGE_VAR_CLASS_NAMETemplate;
38
- }
39
-
40
- static get styles() {
41
- return INIT_PACKAGE_VAR_CLASS_NAMECss;
42
- }
43
-
44
37
  static async onDefine() {
45
38
  INIT_PACKAGE_VAR_CLASS_NAME.i18nBundle = await getI18nBundle("INIT_PACKAGE_VAR_NAME");
46
39
  }
@@ -0,0 +1,3 @@
1
+ :root {
2
+ --my-component-border-color: blue;
3
+ }
@@ -0,0 +1,3 @@
1
+ :root {
2
+ --my-component-border-color: white;
3
+ }
@@ -28,13 +28,14 @@
28
28
  <li><a href="?sap-ui-theme=sap_fiori_3_dark">Fiori 3 Dark</a></li>
29
29
  <li><a href="?sap-ui-theme=sap_fiori_3_hcb">Fiori 3 High Contrast Black</a></li>
30
30
  <li><a href="?sap-ui-theme=sap_fiori_3_hcw">Fiori 3 High Contrast White</a></li>
31
- <li><a href="?sap-ui-theme=sap_belize">Belize</a></li>
32
- <li><a href="?sap-ui-theme=sap_belize_hcb">Belize High Contrast Black</a></li>
33
- <li><a href="?sap-ui-theme=sap_belize_hcw">Belize High Contrast White</a></li>
31
+ <li><a href="?sap-ui-theme=sap_horizon">Horizon</a></li>
32
+ <li><a href="?sap-ui-theme=sap_horizon_dark">Horizon Dark</a></li>
33
+ <li><a href="?sap-ui-theme=sap_horizon_hcb">Horizon High Contrast Black</a></li>
34
+ <li><a href="?sap-ui-theme=sap_horizon_hcw">Horizon High Contrast White</a></li>
34
35
  </ul>
35
36
  <br>
36
37
  <span>or in the browser console, for example:</span>
37
- <code>window['sap-ui-webcomponents-bundle'].configuration.setTheme("sap_belize_hcb")</code>
38
+ <code>window['sap-ui-webcomponents-bundle'].configuration.setTheme("sap_horizon_hcb")</code>
38
39
 
39
40
  <br><br>
40
41
 
@@ -1,7 +1,9 @@
1
1
  const assert = require("assert");
2
2
 
3
3
  describe("INIT_PACKAGE_VAR_TAG rendering", async () => {
4
- await browser.url("test/pages/index.html");
4
+ before(async () => {
5
+ await browser.url("test/pages/index.html");
6
+ });
5
7
 
6
8
  it("tests if web component is correctly rendered", async () => {
7
9
 
@@ -7,6 +7,7 @@
7
7
  "outDir": "dist",
8
8
  "skipLibCheck": true,
9
9
  "sourceMap": true,
10
+ "inlineSources": true,
10
11
  "strict": true,
11
12
  "moduleResolution": "node",
12
13
  "experimentalDecorators": true,
@@ -1,12 +0,0 @@
1
- // eslint-disable-next-line
2
- import "@ui5/webcomponents-base/dist/global";
3
- import { TemplateFunction } from "@ui5/webcomponents-base/dist/renderer/executeTemplate.js";
4
-
5
- export {};
6
-
7
- declare global {
8
- module "*.lit.js" {
9
- const content: TemplateFunction;
10
- export default content;
11
- }
12
- }
@@ -1,3 +0,0 @@
1
- :root {
2
- --my-component-border-color: black;
3
- }