@ui5/create-webcomponents-package 2.14.0 → 2.15.0-rc.2
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 +27 -0
- package/README.md +7 -7
- package/create-package.js +2 -1
- package/package.json +5 -7
- package/template/cypress/component/MyFirstComponent.cy.tsx +13 -0
- package/template/cypress/fixtures/example.json +5 -0
- package/template/cypress/support/commands.ts +37 -0
- package/template/cypress/support/component-index.html +12 -0
- package/template/cypress/support/component.ts +36 -0
- package/template/cypress/tsconfig.template.json +19 -0
- package/template/eslintignore +7 -0
- package/template/eslintrc.cjs +5 -0
- package/template/npmignore +6 -0
- package/template/test/pages/css/index.css +89 -0
- package/template/test/pages/img/logo.png +0 -0
- package/template/test/pages/index.html +53 -0
- /package/template/{.npsrc.json → npsrc.json} +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,33 @@
|
|
|
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
|
+
# [2.15.0-rc.2](https://github.com/UI5/webcomponents/compare/v2.15.0-rc.1...v2.15.0-rc.2) (2025-09-25)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @ui5/create-webcomponents-package
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
# [2.15.0-rc.1](https://github.com/UI5/webcomponents/compare/v2.15.0-rc.0...v2.15.0-rc.1) (2025-09-25)
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
### Bug Fixes
|
|
18
|
+
|
|
19
|
+
* **create-new-package:** missing files ([#12327](https://github.com/UI5/webcomponents/issues/12327)) ([c80c4e9](https://github.com/UI5/webcomponents/commit/c80c4e96d853657e4618328c3b0fb0d1cb457e80))
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
# [2.15.0-rc.0](https://github.com/UI5/webcomponents/compare/v2.14.0...v2.15.0-rc.0) (2025-09-11)
|
|
26
|
+
|
|
27
|
+
**Note:** Version bump only for package @ui5/create-webcomponents-package
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
|
|
31
|
+
|
|
32
|
+
|
|
6
33
|
# [2.14.0](https://github.com/SAP/ui5-webcomponents/compare/v2.14.0-rc.7...v2.14.0) (2025-09-04)
|
|
7
34
|
|
|
8
35
|
**Note:** Version bump only for package @ui5/create-webcomponents-package
|
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# UI5 Web Components - Create Package
|
|
2
2
|
|
|
3
3
|
[](https://www.npmjs.com/package/@ui5/webcomponents)
|
|
4
4
|
|
|
@@ -38,16 +38,16 @@ The script creates a new directory, and fills it with a `package.json` file and
|
|
|
38
38
|
components package.
|
|
39
39
|
|
|
40
40
|
## Resources
|
|
41
|
-
- [UI5 Web Components - README.md](https://github.com/
|
|
42
|
-
- [UI5 Web Components - Home Page](https://
|
|
43
|
-
- [UI5 Web Components - Playground and API Reference](https://
|
|
41
|
+
- [UI5 Web Components - README.md](https://github.com/UI5/webcomponents/blob/main/README.md)
|
|
42
|
+
- [UI5 Web Components - Home Page](https://ui5.github.io/webcomponents)
|
|
43
|
+
- [UI5 Web Components - Playground and API Reference](https://ui5.github.io/webcomponents/play/)
|
|
44
44
|
|
|
45
45
|
## Support
|
|
46
|
-
We welcome all comments, suggestions, questions, and bug reports. Please follow our [Support Guidelines](https://github.com/
|
|
46
|
+
We welcome all comments, suggestions, questions, and bug reports. Please follow our [Support Guidelines](https://github.com/UI5/webcomponents/blob/main/SUPPORT.md#-content) on how to report an issue, or chat with us in the `#webcomponents` channel of the [OpenUI5 Community Slack](https://ui5-slack-invite.cfapps.eu10.hana.ondemand.com/).
|
|
47
47
|
|
|
48
48
|
## Contribute
|
|
49
|
-
Please check our [Contribution Guidelines](https://github.com/
|
|
49
|
+
Please check our [Contribution Guidelines](https://github.com/UI5/webcomponents/blob/main/docs/6-contributing/02-conventions-and-guidelines.md).
|
|
50
50
|
|
|
51
51
|
## License
|
|
52
52
|
Copyright (c) 2019 SAP SE or an SAP affiliate company. All rights reserved.
|
|
53
|
-
This file is licensed under the Apache Software License, Version 2.0 except as noted otherwise in the [LICENSE](https://github.com/
|
|
53
|
+
This file is licensed under the Apache Software License, Version 2.0 except as noted otherwise in the [LICENSE](https://github.com/UI5/webcomponents/blob/main/LICENSE.txt) file.
|
package/create-package.js
CHANGED
|
@@ -23,10 +23,11 @@ const DEST_DIR = process.cwd();
|
|
|
23
23
|
const FILES_TO_RENAME = {
|
|
24
24
|
[path.normalize("eslintignore")]: path.normalize(".eslintignore"),
|
|
25
25
|
[path.normalize("eslintrc.cjs")]: path.normalize(".eslintrc.cjs"),
|
|
26
|
+
[path.normalize("gitignore")]: path.normalize(".gitignore"),
|
|
27
|
+
[path.normalize("npmignore")]: path.normalize(".npmignore"),
|
|
26
28
|
[path.normalize("npsrc.json")]: path.normalize(".npsrc.json"),
|
|
27
29
|
[path.normalize("npmrc")]: path.normalize(".npmrc"),
|
|
28
30
|
[path.normalize("env")]: path.normalize(".env"),
|
|
29
|
-
[path.normalize("gitignore")]: path.normalize(".gitignore"),
|
|
30
31
|
[path.normalize("tsconfig.template.json")]: path.normalize("tsconfig.json"),
|
|
31
32
|
[path.normalize("cypress/tsconfig.template.json")]: path.normalize("cypress/tsconfig.json")
|
|
32
33
|
};
|
package/package.json
CHANGED
|
@@ -1,30 +1,28 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ui5/create-webcomponents-package",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.15.0-rc.2",
|
|
4
4
|
"description": "UI5 Web Components: create package",
|
|
5
5
|
"author": "SAP SE (https://www.sap.com)",
|
|
6
6
|
"license": "Apache-2.0",
|
|
7
7
|
"type": "module",
|
|
8
|
-
"private": false,
|
|
9
8
|
"keywords": [
|
|
10
9
|
"openui5",
|
|
11
10
|
"sapui5",
|
|
12
11
|
"ui5"
|
|
13
12
|
],
|
|
14
|
-
"bin":
|
|
15
|
-
"create-webcomponents-package": "create-package.js"
|
|
16
|
-
},
|
|
13
|
+
"bin": "create-package.js",
|
|
17
14
|
"repository": {
|
|
18
15
|
"type": "git",
|
|
19
|
-
"url": "https://github.com/
|
|
16
|
+
"url": "https://github.com/UI5/webcomponents.git",
|
|
20
17
|
"directory": "packages/create-package"
|
|
21
18
|
},
|
|
22
19
|
"dependencies": {
|
|
20
|
+
"chokidar-cli": "^3.0.0",
|
|
23
21
|
"mkdirp": "^1.0.4",
|
|
24
22
|
"npm-config-user-agent-parser": "^1.0.0",
|
|
25
23
|
"prettier": "^3.5.3",
|
|
26
24
|
"prompts": "^2.4.1",
|
|
27
25
|
"yargs": "^17.5.1"
|
|
28
26
|
},
|
|
29
|
-
"gitHead": "
|
|
27
|
+
"gitHead": "ed55cd91014aec191705b37b57e8cf5dc8cc95ce"
|
|
30
28
|
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import {{INIT_PACKAGE_VAR_CLASS_NAME}} from "../../src/{{INIT_PACKAGE_VAR_CLASS_NAME}}.js";
|
|
2
|
+
|
|
3
|
+
describe('{{INIT_PACKAGE_VAR_CLASS_NAME}}.cy.tsx', () => {
|
|
4
|
+
it('playground', () => {
|
|
5
|
+
cy.mount(<{{INIT_PACKAGE_VAR_CLASS_NAME}} />)
|
|
6
|
+
|
|
7
|
+
cy.get("[{{INIT_PACKAGE_VAR_TAG}}]")
|
|
8
|
+
.click();
|
|
9
|
+
|
|
10
|
+
cy.get("[{{INIT_PACKAGE_VAR_TAG}}]")
|
|
11
|
+
.should("have.prop", "count", 1)
|
|
12
|
+
})
|
|
13
|
+
})
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
/// <reference types="cypress" />
|
|
2
|
+
// ***********************************************
|
|
3
|
+
// This example commands.ts shows you how to
|
|
4
|
+
// create various custom commands and overwrite
|
|
5
|
+
// existing commands.
|
|
6
|
+
//
|
|
7
|
+
// For more comprehensive examples of custom
|
|
8
|
+
// commands please read more here:
|
|
9
|
+
// https://on.cypress.io/custom-commands
|
|
10
|
+
// ***********************************************
|
|
11
|
+
//
|
|
12
|
+
//
|
|
13
|
+
// -- This is a parent command --
|
|
14
|
+
// Cypress.Commands.add('login', (email, password) => { ... })
|
|
15
|
+
//
|
|
16
|
+
//
|
|
17
|
+
// -- This is a child command --
|
|
18
|
+
// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
|
|
19
|
+
//
|
|
20
|
+
//
|
|
21
|
+
// -- This is a dual command --
|
|
22
|
+
// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
|
|
23
|
+
//
|
|
24
|
+
//
|
|
25
|
+
// -- This will overwrite an existing command --
|
|
26
|
+
// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
|
|
27
|
+
//
|
|
28
|
+
// declare global {
|
|
29
|
+
// namespace Cypress {
|
|
30
|
+
// interface Chainable {
|
|
31
|
+
// login(email: string, password: string): Chainable<void>
|
|
32
|
+
// drag(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
|
|
33
|
+
// dismiss(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
|
|
34
|
+
// visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
|
|
35
|
+
// }
|
|
36
|
+
// }
|
|
37
|
+
// }
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html>
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="utf-8">
|
|
5
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
6
|
+
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
|
7
|
+
<title>Components App</title>
|
|
8
|
+
</head>
|
|
9
|
+
<body>
|
|
10
|
+
<div data-cy-root></div>
|
|
11
|
+
</body>
|
|
12
|
+
</html>
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
// ***********************************************************
|
|
2
|
+
// This example support/component.ts is processed and
|
|
3
|
+
// loaded automatically before your test files.
|
|
4
|
+
//
|
|
5
|
+
// This is a great place to put global configuration and
|
|
6
|
+
// behavior that modifies Cypress.
|
|
7
|
+
//
|
|
8
|
+
// You can change the location of this file or turn off
|
|
9
|
+
// automatically serving support files with the
|
|
10
|
+
// 'supportFile' configuration option.
|
|
11
|
+
//
|
|
12
|
+
// You can read more here:
|
|
13
|
+
// https://on.cypress.io/configuration
|
|
14
|
+
// ***********************************************************
|
|
15
|
+
|
|
16
|
+
// Import commands.js using ES2015 syntax:
|
|
17
|
+
import './commands'
|
|
18
|
+
|
|
19
|
+
import { mount } from '@ui5/cypress-ct-ui5-webc'
|
|
20
|
+
|
|
21
|
+
// Augment the Cypress namespace to include type definitions for
|
|
22
|
+
// your custom command.
|
|
23
|
+
// Alternatively, can be defined in cypress/support/component.d.ts
|
|
24
|
+
// with a <reference path="./component" /> at the top of your spec.
|
|
25
|
+
declare global {
|
|
26
|
+
namespace Cypress {
|
|
27
|
+
interface Chainable {
|
|
28
|
+
mount: typeof mount
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
Cypress.Commands.add('mount', mount)
|
|
34
|
+
|
|
35
|
+
// Example use:
|
|
36
|
+
// cy.mount(MyComponent)
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
{
|
|
2
|
+
"include": [
|
|
3
|
+
"./**/*"
|
|
4
|
+
],
|
|
5
|
+
"compilerOptions": {
|
|
6
|
+
"module": "NodeNext",
|
|
7
|
+
"moduleResolution": "nodenext",
|
|
8
|
+
"jsx": "react-jsx",
|
|
9
|
+
"jsxImportSource": "@ui5/webcomponents-base",
|
|
10
|
+
"types": [
|
|
11
|
+
"cypress"
|
|
12
|
+
]
|
|
13
|
+
},
|
|
14
|
+
"references": [
|
|
15
|
+
{
|
|
16
|
+
"path": "../"
|
|
17
|
+
}
|
|
18
|
+
]
|
|
19
|
+
}
|
|
@@ -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,89 @@
|
|
|
1
|
+
body {
|
|
2
|
+
color: var(--sapTextColor);
|
|
3
|
+
background-color: var(--sapBackgroundColor);
|
|
4
|
+
font-size: var(--sapFontSize);
|
|
5
|
+
font-family: var(--sapFontFamily);
|
|
6
|
+
padding: 2rem;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
h1 {
|
|
10
|
+
font-size: var(--sapFontHeader2Size);
|
|
11
|
+
margin-bottom: 0.5rem;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
h2 {
|
|
15
|
+
font-size: var(--sapFontHeader4Size);
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
a {
|
|
19
|
+
margin: 0.25rem;
|
|
20
|
+
padding: 0.5rem;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
a.link {
|
|
24
|
+
color: var(--sapLinkColor);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
a.theme-link {
|
|
28
|
+
color: var(--sapButton_Emphasized_TextColor);
|
|
29
|
+
background-color: var(--sapButton_Emphasized_Background);
|
|
30
|
+
text-decoration: none;
|
|
31
|
+
border-radius: 0.25rem;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
a.lang-link {
|
|
35
|
+
color: var(--sapButton_Attention_TextColor);
|
|
36
|
+
background-color: var(--sapButton_Attention_Background);
|
|
37
|
+
text-decoration: none;
|
|
38
|
+
border-radius: 0.25rem;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.app {
|
|
42
|
+
display: flex;
|
|
43
|
+
flex-direction: column;
|
|
44
|
+
align-items: center;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.app-nav {
|
|
48
|
+
display: flex;
|
|
49
|
+
width: 100%;
|
|
50
|
+
flex-direction: row;
|
|
51
|
+
justify-content: flex-end;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.app-logo {
|
|
55
|
+
height: 5rem;
|
|
56
|
+
width: 5rem;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.app-header {
|
|
60
|
+
display: flex;
|
|
61
|
+
flex-direction: row;
|
|
62
|
+
align-items: center;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
.app-main {
|
|
66
|
+
display: flex;
|
|
67
|
+
flex-direction: row;
|
|
68
|
+
align-items: flex-start;
|
|
69
|
+
padding-top: 2rem;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
.app-main-demo {
|
|
73
|
+
padding: 2rem;
|
|
74
|
+
border-radius: 0.5rem;
|
|
75
|
+
box-sizing: border-box;
|
|
76
|
+
background-color: var(--sapTile_Background);
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
.app-main-settings {
|
|
80
|
+
display: flex;
|
|
81
|
+
flex-direction: column;
|
|
82
|
+
padding: 0 2rem;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
@media (max-width: 768px) {
|
|
86
|
+
.app-main {
|
|
87
|
+
flex-direction: column;
|
|
88
|
+
}
|
|
89
|
+
}
|
|
Binary file
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
|
|
4
|
+
<head>
|
|
5
|
+
<meta charset="utf-8">
|
|
6
|
+
<title>UI5 Web Components</title>
|
|
7
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
8
|
+
<meta charset="utf-8">
|
|
9
|
+
<link rel="stylesheet" type="text/css" href="./css/index.css">
|
|
10
|
+
<script src="%VITE_BUNDLE_PATH%" type="module"></script>
|
|
11
|
+
</head>
|
|
12
|
+
|
|
13
|
+
<body>
|
|
14
|
+
<div class="app">
|
|
15
|
+
<nav class="app-nav">
|
|
16
|
+
<a class="link" href="https://ui5.github.io/webcomponents/">Website</a>
|
|
17
|
+
<a class="link" href="https://ui5.github.io/webcomponents/components/">Components</a>
|
|
18
|
+
<a class="link" href="https://ui5.github.io/webcomponents/docs/development/package/">Development</a>
|
|
19
|
+
</nav>
|
|
20
|
+
|
|
21
|
+
<header class="app-header">
|
|
22
|
+
<a href="https://ui5.github.io/webcomponents/" target="_blank"><img src="./img/logo.png" class="app-logo" alt="logo"/></a>
|
|
23
|
+
<h1>UI5 Web Components</h1>
|
|
24
|
+
</header>
|
|
25
|
+
|
|
26
|
+
<main class="app-main">
|
|
27
|
+
<div class="app-main-demo">
|
|
28
|
+
<h2>Congrats! It's your First Web Component 🎉</h2>
|
|
29
|
+
<div> <pre><{{INIT_PACKAGE_VAR_TAG}}></{{INIT_PACKAGE_VAR_TAG}}> </pre></div>
|
|
30
|
+
<{{INIT_PACKAGE_VAR_TAG}} id="myFirstComponent"></{{INIT_PACKAGE_VAR_TAG}}>
|
|
31
|
+
</div>
|
|
32
|
+
|
|
33
|
+
<div class="app-main-settings">
|
|
34
|
+
<h3>Switch theme</h3>
|
|
35
|
+
<div style="display: grid; grid-template-columns: 1fr 1fr;">
|
|
36
|
+
<a class="link theme-link" href="?sap-ui-theme=sap_horizon">Horizon Morning</a>
|
|
37
|
+
<a class="link theme-link" href="?sap-ui-theme=sap_horizon_dark">Horizon Evening</a>
|
|
38
|
+
<a class="link theme-link" href="?sap-ui-theme=sap_horizon_hcb">High Contrast Black</a>
|
|
39
|
+
<a class="link theme-link" href="?sap-ui-theme=sap_horizon_hcw">High Contrast White</a>
|
|
40
|
+
</div>
|
|
41
|
+
|
|
42
|
+
<h3>Switch language</h3>
|
|
43
|
+
<div style="display: grid; grid-template-columns: 1fr 1fr;">
|
|
44
|
+
<a class="link lang-link" href="?sap-ui-language=en">English</a>
|
|
45
|
+
<a class="link lang-link" href="?sap-ui-language=de">German</a>
|
|
46
|
+
<a class="link lang-link" href="?sap-ui-language=es">Spanish</a>
|
|
47
|
+
<a class="link lang-link" href="?sap-ui-language=fr">French</a>
|
|
48
|
+
</div>
|
|
49
|
+
</div>
|
|
50
|
+
</main>
|
|
51
|
+
</div>
|
|
52
|
+
</body>
|
|
53
|
+
</html>
|
|
File without changes
|