[ui5-step-input] - too long value state messages are truncated if step input's width is small size

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.58k stars 269 forks source link

[ui5-step-input] - too long value state messages are truncated if step input's width is small size #10246

Open lyc489 opened 2 days ago

lyc489 commented 2 days ago

Bug Description

Too long value state messages are truncated if step input's width is small size, it should show Please provide valid value

Affected Component

ui5-step-input

Expected Behaviour

Should display the message as normal

Isolated Example

No response

Steps to Reproduce

1. 2. 3. ...

Log Output, Stack Trace or Screenshots

No response

Priority

None

UI5 Web Components Version

2.5.0-rc.1

Browser

Chrome

Operating System

No response

Additional Context

No response

Organization

No response

Declaration

[X] I’m not disclosing any internal or sensitive information.

s-todorova commented 1 day ago

Hello @SAP/ui5-webcomponents-topic-rl ,

The issue is reproducible as described: in playground, set small width on a ui5-step-input with a slotted valueStateMessage and observe how the text is cut off instead of truncated. For version 1.x the behavior we had was that the text wrapped instead. It seems that a "max-width" is being set in Input.ts, which is causing the cut off - I tested and if the styles are disabled, the popover renders normally. Could you please look into this?

Best Regards, Siyana

elenastoyanovaa commented 1 day ago

Hello @SAP/ui5-webcomponents-topic-b ,

The reported issue is related to the StepInput component, not an input component in our team. Could you please process further? If you think that the root cause of the issue is in the Input components, please isolate the issue with a ui5-input.

Kind Regards, Elena