Skip to content

Commit c1eafa5

Browse files
Lukas742MarcusNotheis
Lukas742
and
MarcusNotheis
authored
feat: update to @ui5/[email protected] (#5205)
Co-authored-by: Marcus Notheis <[email protected]>
1 parent 8ba09dd commit c1eafa5

File tree

39 files changed

+144
-452
lines changed

39 files changed

+144
-452
lines changed

‎.storybook/manager-head.html

Lines changed: 2 additions & 77 deletions
Original file line numberDiff line numberDiff line change
@@ -1,78 +1,5 @@
11
<style>
2-
@font-face {
3-
font-family: '72';
4-
font-style: normal;
5-
font-weight: 400;
6-
src: local('72'),
7-
url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular.woff2?ui5-webcomponents)
8-
format('woff2');
9-
}
10-
11-
@font-face {
12-
font-family: '72full';
13-
font-style: normal;
14-
font-weight: 400;
15-
src: local('72-full'),
16-
url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular-full.woff2?ui5-webcomponents)
17-
format('woff2');
18-
}
19-
20-
@font-face {
21-
font-family: '72';
22-
font-style: normal;
23-
font-weight: 700;
24-
src: local('72-Bold'),
25-
url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff2?ui5-webcomponents)
26-
format('woff2');
27-
}
28-
29-
@font-face {
30-
font-family: '72full';
31-
font-style: normal;
32-
font-weight: 700;
33-
src: local('72-Bold-full'),
34-
url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff2?ui5-webcomponents)
35-
format('woff2');
36-
}
37-
38-
@font-face {
39-
font-family: '72-Bold';
40-
font-style: normal;
41-
src: local('72-Bold'),
42-
url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff2?ui5-webcomponents)
43-
format('woff2');
44-
}
45-
46-
@font-face {
47-
font-family: '72-Boldfull';
48-
font-style: normal;
49-
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff2?ui5-webcomponents)
50-
format('woff2');
51-
}
52-
53-
@font-face {
54-
font-family: '72-Light';
55-
font-style: normal;
56-
src: local('72-Light'),
57-
url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Light.woff2?ui5-webcomponents)
58-
format('woff2');
59-
}
60-
61-
@font-face {
62-
font-family: '72-Lightfull';
63-
font-style: normal;
64-
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Light-full.woff2?ui5-webcomponents)
65-
format('woff2');
66-
}
67-
68-
@font-face {
69-
font-family: '72Black';
70-
font-style: bold;
71-
font-weight: 900;
72-
src: local('72Black'),
73-
url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72-Black.woff2?ui5-webcomponents)
74-
format('woff2');
75-
}
2+
@import url('@ui5/webcomponents-base/dist/css/FontFace.css');
763

774
body {
785
font-family: '72', Arial, Helvetica, sans-serif;
@@ -97,9 +24,7 @@
9724

9825
<script data-ui5-config type="application/json">
9926
{
100-
"theme": "sap_fiori_3"
27+
"theme": "sap_horizon"
10128
}
10229
</script>
10330
<link rel="icon" href="favicon.ico" />
104-
105-
<!--<script src="/custom-elements-es5-adapter.js"></script>-->

‎.storybook/preview-head.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -97,6 +97,6 @@
9797
</style>
9898
<script data-ui5-config type="application/json">
9999
{
100-
"theme": "sap_fiori_3"
100+
"theme": "sap_horizon"
101101
}
102102
</script>

‎docs/Welcome.mdx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -117,17 +117,17 @@ import '@ui5/webcomponents-react/dist/Assets';
117117
You can now change the Theme by calling `setTheme` with a string parameter of the new theme.<br />
118118
Available Themes:
119119

120-
- `sap_fiori_3` (default)
120+
- `sap_horizon` (default)
121+
- `sap_horizon_dark`
122+
- `sap_horizon_hcb`
123+
- `sap_horizon_hcw`
124+
125+
- `sap_fiori_3`
121126
- `sap_fiori_dark`
122127
- `sap_belize`
123128
- `sap_belize_hcb`
124129
- `sap_belize_hcw`
125130

126-
- `sap_horizon`
127-
- `sap_horizon_dark`
128-
- `sap_horizon_hcb`
129-
- `sap_horizon_hcw`
130-
131131
### Configure Compact/Cozy setting
132132

133133
UI5 Web Components supports `Compact` and `Cozy` mode. It is set to `Cozy` by default. To enable `Compact`, provide the css class `ui5-content-density-compact` to any of your HTML elements and it apply compact size to all of its children.

‎package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -37,9 +37,9 @@
3737
"@storybook/react": "7.5.2",
3838
"@storybook/react-vite": "7.5.2",
3939
"@storybook/theming": "7.5.2",
40-
"@ui5/webcomponents": "1.18.0",
41-
"@ui5/webcomponents-fiori": "1.18.0",
42-
"@ui5/webcomponents-icons": "1.18.0",
40+
"@ui5/webcomponents": "1.19.0",
41+
"@ui5/webcomponents-fiori": "1.19.0",
42+
"@ui5/webcomponents-icons": "1.19.0",
4343
"react": "18.2.0",
4444
"react-dom": "18.2.0",
4545
"remark-gfm": "^3.0.1",
@@ -59,7 +59,7 @@
5959
"@types/react-dom": "^18.2.7",
6060
"@typescript-eslint/eslint-plugin": "^6.0.0",
6161
"@typescript-eslint/parser": "^6.0.0",
62-
"@ui5/webcomponents-tools": "1.18.0",
62+
"@ui5/webcomponents-tools": "1.19.0",
6363
"@vitejs/plugin-react": "^4.0.0",
6464
"chromatic": "^7.0.0",
6565
"cssnano": "^6.0.1",

‎packages/base/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@
3030
},
3131
"peerDependencies": {
3232
"@types/react": "*",
33-
"@ui5/webcomponents-base": "~1.18.0",
33+
"@ui5/webcomponents-base": "~1.19.0",
3434
"react": "^16.14.0 || ^17.0.0 || ^18.0.0"
3535
},
3636
"peerDependenciesMeta": {

‎packages/charts/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,8 +34,8 @@
3434
"recharts": "2.9.2"
3535
},
3636
"peerDependencies": {
37-
"@ui5/webcomponents-react": "~1.21.0",
38-
"@ui5/webcomponents-react-base": "~1.20.0",
37+
"@ui5/webcomponents-react": "~1.22.0",
38+
"@ui5/webcomponents-react-base": "~1.22.0",
3939
"react": "^16.14.0 || ^17.0.0 || ^18.0.0",
4040
"react-jss": "^10.10.0"
4141
},

‎packages/cra-template-seed/template.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
{
22
"package": {
33
"dependencies": {
4-
"@ui5/webcomponents": "~1.18.0",
5-
"@ui5/webcomponents-fiori": "~1.18.0",
6-
"@ui5/webcomponents-icons": "~1.18.0",
4+
"@ui5/webcomponents": "~1.19.0",
5+
"@ui5/webcomponents-fiori": "~1.19.0",
6+
"@ui5/webcomponents-icons": "~1.19.0",
77
"@ui5/webcomponents-react": "latest",
88
"axios": "^0.27.2",
99
"formik": "^2.2.9",

‎packages/cra-template/template.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
{
22
"package": {
33
"dependencies": {
4-
"@ui5/webcomponents": "~1.18.0",
5-
"@ui5/webcomponents-fiori": "~1.18.0",
6-
"@ui5/webcomponents-icons": "~1.18.0",
4+
"@ui5/webcomponents": "~1.19.0",
5+
"@ui5/webcomponents-fiori": "~1.19.0",
6+
"@ui5/webcomponents-icons": "~1.19.0",
77
"@ui5/webcomponents-react": "latest",
88
"web-vitals": "^2.1.0"
99
},

‎packages/main/package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -61,10 +61,10 @@
6161
"peerDependencies": {
6262
"@types/react": "*",
6363
"@types/react-dom": "*",
64-
"@ui5/webcomponents": "~1.18.0",
65-
"@ui5/webcomponents-base": "~1.18.0",
66-
"@ui5/webcomponents-fiori": "~1.18.0",
67-
"@ui5/webcomponents-icons": "~1.18.0",
64+
"@ui5/webcomponents": "~1.19.0",
65+
"@ui5/webcomponents-base": "~1.19.0",
66+
"@ui5/webcomponents-fiori": "~1.19.0",
67+
"@ui5/webcomponents-icons": "~1.19.0",
6868
"react": "^16.14.0 || ^17.0.0 || ^18.0.0",
6969
"react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0"
7070
},

‎packages/main/src/components/AnalyticalTable/AnalyticalTable.cy.tsx

Lines changed: 18 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -347,11 +347,14 @@ describe('AnalyticalTable', () => {
347347
// expand
348348
cy.findByText('Robin Moreno').should('not.exist', { timeout: 100 });
349349
cy.findByText('Judith Mathews').should('not.exist', { timeout: 100 });
350-
cy.get('[aria-rowindex="1"] > [aria-colindex="2"] > [title="Expand Node"] > ui5-icon').click();
350+
cy.get('[aria-rowindex="1"] > [aria-colindex="2"] > [title="Expand Node"] > [ui5-button]').click();
351351
cy.findByText('Robin Moreno').should('be.visible');
352-
cy.get('[aria-rowindex="4"] > [aria-colindex="2"] > [title="Expand Node"] > ui5-icon').trigger('keydown', {
353-
key: 'Enter'
354-
});
352+
cy.get('[aria-rowindex="4"] > [aria-colindex="2"] > [title="Expand Node"] > [ui5-button]')
353+
.shadow()
354+
.find('button')
355+
.focus();
356+
cy.realPress('Enter');
357+
355358
cy.findByText('Judith Mathews').should('be.visible');
356359

357360
// select
@@ -703,9 +706,9 @@ describe('AnalyticalTable', () => {
703706
);
704707

705708
// expand
706-
cy.get('[aria-rowindex="2"] > [aria-colindex="2"] > [title="Expand Node"] > [ui5-icon]').click();
707-
cy.get('[aria-rowindex="3"] > [aria-colindex="2"] > [title="Expand Node"] > [ui5-icon]').click();
708-
cy.get('[aria-rowindex="4"] > [aria-colindex="2"] > [title="Expand Node"] > [ui5-icon]').click();
709+
cy.get('[aria-rowindex="2"] > [aria-colindex="2"] > [title="Expand Node"] > [ui5-button]').click();
710+
cy.get('[aria-rowindex="3"] > [aria-colindex="2"] > [title="Expand Node"] > [ui5-button]').click();
711+
cy.get('[aria-rowindex="4"] > [aria-colindex="2"] > [title="Expand Node"] > [ui5-button]').click();
709712

710713
// deselect row
711714
cy.findByText('Wiggins Cotton').click();
@@ -796,9 +799,9 @@ describe('AnalyticalTable', () => {
796799
cy.get('[data-column-id="__ui5wcr__internal_selection_column"]').click();
797800

798801
// expand
799-
cy.get('[aria-rowindex="2"] > [aria-colindex="2"] > [title="Expand Node"] > [ui5-icon]').click();
800-
cy.get('[aria-rowindex="3"] > [aria-colindex="2"] > [title="Expand Node"] > [ui5-icon]').click();
801-
cy.get('[aria-rowindex="4"] > [aria-colindex="2"] > [title="Expand Node"] > [ui5-icon]').click();
802+
cy.get('[aria-rowindex="2"] > [aria-colindex="2"] > [title="Expand Node"] > [ui5-button]').click();
803+
cy.get('[aria-rowindex="3"] > [aria-colindex="2"] > [title="Expand Node"] > [ui5-button]').click();
804+
cy.get('[aria-rowindex="4"] > [aria-colindex="2"] > [title="Expand Node"] > [ui5-button]').click();
802805

803806
// deselect row
804807
cy.findByText('Wiggins Cotton').click();
@@ -887,7 +890,7 @@ describe('AnalyticalTable', () => {
887890
cy.get('[data-column-id="name"]').invoke('outerWidth').should('equal', 700);
888891

889892
cy.findByText('Custom maxWidth').click();
890-
cy.get('[data-column-id="name"]').invoke('outerWidth').should('equal', 3824);
893+
cy.get('[data-column-id="name"]').invoke('outerWidth').should('equal', 4120);
891894
});
892895

893896
it('Column Scaling: programatically change cols', () => {
@@ -1558,13 +1561,13 @@ describe('AnalyticalTable', () => {
15581561
cy.findAllByTitle('Expand Node').should('have.length', 4);
15591562
cy.findAllByTitle('Collapse Node').should('not.exist');
15601563

1561-
cy.get('[aria-rowindex="1"] > [aria-colindex="1"] > [title="Expand Node"] > [ui5-icon]').click();
1564+
cy.get('[aria-rowindex="1"] > [aria-colindex="1"] > [title="Expand Node"] > [ui5-button]').click();
15621565

15631566
cy.findAllByTitle('Expand Node').should('have.length', 3);
15641567
cy.findAllByTitle('Collapse Node').should('have.length', 1);
15651568
cy.findByText('SubComponent').should('be.visible');
15661569

1567-
cy.get('[aria-rowindex="2"] > [aria-colindex="1"] > [title="Expand Node"] > [ui5-icon]').click();
1570+
cy.get('[aria-rowindex="2"] > [aria-colindex="1"] > [title="Expand Node"] > [ui5-button]').click();
15681571

15691572
cy.findAllByTitle('Expand Node').should('have.length', 2);
15701573
cy.findAllByTitle('Collapse Node').should('have.length', 2);
@@ -1575,12 +1578,12 @@ describe('AnalyticalTable', () => {
15751578
cy.findAllByTitle('Expand Node').should('have.length', 1);
15761579
cy.findAllByTitle('Collapse Node').should('not.exist');
15771580

1578-
cy.get('[aria-rowindex="1"] > [aria-colindex="1"] > [title="Expand Node"] > [ui5-icon]').click();
1581+
cy.get('[aria-rowindex="1"] > [aria-colindex="1"] > [title="Expand Node"] > [ui5-button]').click();
15791582

15801583
cy.findAllByTitle('Expand Node').should('not.exist');
15811584
cy.findAllByTitle('Collapse Node').should('have.length', 1);
15821585
cy.findByText('SingleSubComponent').should('be.visible');
1583-
cy.get('[aria-rowindex="2"] > [aria-colindex="1"] > [title="Expand Node"] > [ui5-icon]').should('not.exist');
1586+
cy.get('[aria-rowindex="2"] > [aria-colindex="1"] > [title="Expand Node"] > [ui5-button]').should('not.exist');
15841587

15851588
cy.mount(
15861589
<AnalyticalTable

‎packages/main/src/components/AnalyticalTable/hooks/usePopIn.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ const popInVisibleColumns = (cols, { instance }) => {
44
const { state, dispatch } = instance;
55

66
const tableClientWidth = state.isScrollable
7-
? state?.tableClientWidth + 14 /*scrollbar width*/
7+
? state?.tableClientWidth + 13 /*scrollbar width*/
88
: state?.tableClientWidth;
99

1010
const popInColumns = cols

‎packages/main/src/components/FilterBar/FilterBar.cy.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -319,7 +319,7 @@ describe('FilterBar.cy.tsx', () => {
319319
// no border for table rows within panel - `getComputedStyle` returns the default value (`separate`) for `unset`
320320
cy.get('table').should('have.css', 'border-collapse', 'separate');
321321
// no bottom border for table within panel - `getComputedStyle` sets the border-width to 0 for `none`
322-
cy.get('.ui5-table-root').should('have.css', 'border-bottom', '0px none rgb(50, 54, 58)');
322+
cy.get('.ui5-table-root').should('have.css', 'border-bottom', '0px none rgb(29, 45, 62)');
323323
// no select-all checkbox (header row is hidden)
324324
cy.get('thead th.ui5-table-select-all-column').should('not.be.visible');
325325
});

‎packages/main/src/components/ObjectPage/ObjectPage.cy.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -390,19 +390,19 @@ describe('ObjectPage', () => {
390390
[ObjectPageMode.Default, ObjectPageMode.IconTabBar].forEach((item) => {
391391
cy.mount(<TestComp height="2000px" mode={item} />);
392392
cy.findByText('Update Heights').click();
393-
cy.findByText('{"offset":1080,"scroll":2240}').should('exist');
393+
cy.findByText('{"offset":1080,"scroll":2260}').should('exist');
394394

395395
cy.findByTestId('op').scrollTo('bottom');
396396
cy.findByText('Update Heights').click({ force: true });
397-
cy.findByText('{"offset":1080,"scroll":2240}').should('exist');
397+
cy.findByText('{"offset":1080,"scroll":2260}').should('exist');
398398

399399
cy.mount(<TestComp height="2000px" withFooter mode={item} />);
400400
cy.findByText('Update Heights').click();
401-
cy.findByText('{"offset":1080,"scroll":2300}').should('exist');
401+
cy.findByText('{"offset":1080,"scroll":2320}').should('exist');
402402

403403
cy.findByTestId('op').scrollTo('bottom');
404404
cy.findByText('Update Heights').click({ force: true });
405-
cy.findByText('{"offset":1080,"scroll":2300}').should('exist');
405+
cy.findByText('{"offset":1080,"scroll":2320}').should('exist');
406406

407407
cy.mount(<TestComp height="400px" mode={item} />);
408408
cy.findByText('Update Heights').click();

0 commit comments

Comments
 (0)