search

SAP / ui5-webcomponents

UI5 Web Components - the enterprise-flavored sugar on top of native APIs! Build SAP Fiori user interfaces with the technology of your choice.
https://sap.github.io/ui5-webcomponents/
Apache License 2.0
1.47k stars 254 forks source link

DynamicPage : Wizard steps area is within the same container as the page header. #9312

Open DikshaHub opened 1 week ago

DikshaHub commented 1 week ago

Feature Request Description

We are working on a dynamic page that includes a wizard. Our requirement is to have the page header and wizard steps within the same container. Please refer : https://stackblitz.com/edit/github-wcwdgu-svwpsw?file=src%2FApp.tsx Here is the current layout.

image

Proposed Solution

We expect the layout to look like the example below.

image

Refer https://wiki.one.int.sap/wiki/pages/viewpage.action?pageId=2697897301 .

The wizard step icon titles should be integrated into the header, and there should be no unnecessary padding visible between the wizard content block and the page border.

Proposed Alternatives

No response

Organization

No response

Additional Context

No response

Priority

None

Privacy Policy

kineticjs commented 1 week ago

Hi @DikshaHub,

Thank you for the sample of the issue. When inspecting the rendered HTML, however, I cannot see the ui5-dynamic-page component developed in this repo, see e.g.: https://sap.github.io/ui5-webcomponents/nightly/components/fiori/DynamicPage/

Maybe you are using a different DynamicPage component currently?

In our ui5-dynamic-page I was able to nest ui5-wizard in its "headerArea" slot, so probably the issue is specific to the component in your linked sample.

Thanks