search

SAP / ui5-webcomponents-react

A wrapper implementation for React of the UI5 Web Components that are compliant with the SAP Fiori User Experience
https://sap.github.io/ui5-webcomponents-react/
Apache License 2.0
426 stars 94 forks source link

[DynamicPageTitle]: No Gap Between Buttons in Custom Actions Component in DynamicPageTitle #5873

Closed bomasap closed 1 month ago

bomasap commented 1 month ago

Describe the bug

There is an issue with the DynamicPageTitle component's actions property when using a custom actions component. The custom actions component, which includes two buttons, does not display a gap between the buttons when placed in the actions property. However, placing the two buttons directly in the actions property does result in the correct gap between them.

According to another related bug (https://github.com/SAP/ui5-webcomponents-react/issues/5863), this issue is mentioned in the context of a slot. However, the custom actions component does not have a slot in its props.

Isolated Example

https://stackblitz.com/edit/github-zwueh7-t5uuzk?file=src%2FApp.tsx,src%2FCustomActions.tsx

Reproduction steps

1.Place the custom actions component in the actions property of the DynamicPageTitle component. Observe the lack of gap between the two buttons. https://stackblitz.com/edit/github-zwueh7-t5uuzk?file=src%2FApp.tsx,src%2FCustomActions.tsx

  1. Place the two buttons directly in the actions property of the DynamicPageTitle component. Observe the presence of a gap between the buttons. https://stackblitz.com/edit/github-zwueh7-weexue?file=src%2FApp.tsx

Expected Behaviour

When the custom actions component is placed in the actions property of the DynamicPageTitle, there should be a gap between the buttons, similar to when the buttons are placed directly in the actions property.

Screenshots or Videos

Screenshot 2024-05-30 at 3 08 10 PM Screenshot 2024-05-30 at 3 08 05 PM

UI5 Web Components for React Version

1.28.0

UI5 Web Components Version

1.24.0

Browser

Chrome, Edge, Firefox, Safari

Operating System

No response

Additional Context

No response

Relevant log output

No response

Organization

No response

Declaration

Lukas742 commented 1 month ago

Hi @bomasap

custom components that render multiple elements are currently not supported as actions of the DynamicPageTitle. You can find out more about this here.

The linked PR will outline this in our docs. For updates please subscribe to the corresponding feature request.