SAP/ui5-webcomponents-react

[ObjectPage/DynamicPage]: subparts have to be provided inline

rvsia opened this issue · 1 comments

rvsia commented

Describe the bug

When using subparts of DynamicPage/ObjectPage we have to provide elements inline, otherwise the functionality and styling is broken. This prevents splitting components into subcomponents.

This happens to actions, headerContent and other elements.

Isolated Example

https://codesandbox.io/p/sandbox/hopeful-silence-drhkd8?file=%2Fpackage.json%3A12%2C28-12%2C35

Reproduction steps

  1. put a component into "actions" section of dynamic page title
<DynamicPageTitle
            actions={<Actions />}
  1. check difference to
<DynamicPageTitle
            actions={<> ... </>}

Expected Behaviour

It shouldn't matter if we provide component inline or not

Screenshots or Videos

Snímek obrazovky 2023-06-23 v 11 00 16

UI5 Web Components for React Version

~1.16.0

UI5 Web Components Version

~1.14.0

Browser

Edge

Operating System

MacOS

Additional Context

No response

Relevant log output

No response

Declaration

  • I’m not disclosing any internal or sensitive information.

Hi @rvsia

unfortunately it's currently not planned to refactor this behavior for the action props. Under the hood, the actions are extended with events (by the DynamicPageTitle component) and to achieve the overflow behavior furthermore extended and wrapped by the Toolbar. Since you're passing a component we have no way of splitting the children of the custom components again, since there is no way to retrieve them.

For the headerContent it's only supported to pass the DynamicPageHeader component and there you can define the children as you feel fit.

Maybe this will change once the OverflowToolbar is available as web-component, but since the API will most likely be much different to our implementation, we have to check if we can integrate it without a breaking change.