FormItem: Unable to add a new line in label

[AndrianStoikov]

Describe the bug
We are unable to insert a new line to the label.
The Label component works as intended, however using the same component in the label prop does not allow us to add a new line.

Isolated Example
https://codesandbox.io/s/elegant-tesla-nwfmi?file=/src/App.js

To Reproduce
Steps to reproduce the behavior:

1. Go to the sandbox
2. You will see how the new line in the start label works, however it does not in the FormItem

Expected behavior
The label in FormItem should behave as the Label component

Screenshots

UI5 Web Components for React Information
"@ui5/webcomponents": "rc-15",
"@ui5/webcomponents-react": "0.18.11",
Operating System: Windows 10
Browser: Microsoft Edge, Version 94.0.992.50 (Official build) (64-bit)

Additional context
Since we are using the version of ui5-webcomponent-react 0.0.0-e5a9d54a. Is possible to make a release again with the latest development so we can benefit from the memory leak fix and at the same time get the latest changes in 0.18.11?

[Lukas742]

Hi @AndrianStoikov

it is not recommended passing anything else than a string to the Label component.

Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.

That said I looked into it anyway and it seems we have an unnecessary type conversion which will be removed in the linked PR. This should fix the problem.

For now you probably can use this approach:
codeSandbox

Additional context Since we are using the version of ui5-webcomponent-react 0.0.0-e5a9d54a. Is possible to make a release again with the latest development so we can benefit from the memory leak fix and at the same time get the latest changes in 0.18.11?

We currently have to wait for translations until we can release our main branch. I could offer you drafting another snapshot release with the latest changes (after the linked PR has been merged), but please be aware that if you are using the VariantManagement component you will have to deal with some breaking changes there.

[AndrianStoikov]

Hi @Lukas742,

Thanks for the fix. The snapshot release is what I meant and we do not use the VariantManagement so it is okay.

[AndrianStoikov]

Actually,

It will be perfect if we can get the latest changes after this PR is merged SAP/ui5-webcomponents#4138, so I think we can wait a bit.

[ilhan007]

Hello @AndrianStoikov @Lukas742 the PR SAP/ui5-webcomponents#4138 is released with 0.0.0-db2be6526 as "next" tag release.

Note: @Lukas742 please note the following BREAKING CHANGE if relevant for you (as it's part of the released version)
SAP/ui5-webcomponents#4133

[Lukas742]

Hi @AndrianStoikov

we just published a new snapshot release 0.0.0-2b98e0bb which includes the 0.0.0-db2be6526 version of @ui5/webcomponents and all commits of our main branch. Please be aware that there are some breaking changes for which you can find the unreleased migration guide here.

[AndrianStoikov]

Hi @Lukas742,

Thanks for the release. I tried it locally but I get the following error when I run npm start. I tried multiple times to delete node_modules and install the dependencies with npm ci.

./node_modules/@ui5/webcomponents-react/dist/VariantManagement.js
Module not found: Can't resolve '@ui5/webcomponents-react-base/hooks/useI18nBundle' in '...\node_modules\@ui5\webcomponents-react\dist'

Any idea if the problem is on my side or a problem with the library?

My package.json:
"@ui5/webcomponents": "0.0.0-db2be6526",
"@ui5/webcomponents-base": "0.0.0-db2be6526",
"@ui5/webcomponents-fiori": "0.0.0-db2be6526",
"@ui5/webcomponents-icons": "0.0.0-db2be6526",
"@ui5/webcomponents-react": "0.0.0-2b98e0bb",

[Lukas742]

Sorry for the inconvenience @AndrianStoikov, we shipped some bad imports in the snapshot that for some reason weren't caught beforehand. With 0.0.0-9bfd1300(@ui5/webcomponents-react) it should be working as intended now.

[AndrianStoikov]

Thanks @Lukas742,

I managed to start the snapshot and it looks good!

[ui5-webcomponents-react-bot]

🎉 This issue has been resolved in version v0.19.0 🎉

The release is available on v0.19.0

Your semantic-release bot 📦🚀