search

innovaccer / design-system

Masala Design System (MDS) is an open-source design system built at Innovaccer. Figma file : https://www.figma.com/community/file/974368355920553546/masala-design-system-web-guidelines
https://mds.innovaccer.com
MIT License
84 stars 79 forks source link

EditableChipInput: text inside fluctuates on changing focus. #918

Closed satyamyadav closed 2 years ago

satyamyadav commented 2 years ago

Description

When we click into the input it gets focussed properly but the placeholder text shifts its position to bottom left.

Steps to reproduce

  1. Open the example of component (story) https://innovaccer.github.io/design-system/?path=/docs/components-editablechipinput-all--all
  2. Click into the input box to start typing.
  3. Press check or cancel button.
  4. Repeat steps 2 and 3 till you identify it.

Expected result

The placeholder should not move its position irrespective of the state of the component.

Actual result

The placeholder text shifted bottom left.

https://user-images.githubusercontent.com/3583587/137596331-60969d56-4079-44e7-ae33-3af1a0867775.mov

heytulsiprasad commented 2 years ago

Hey @satyamyadav, just came across MDS and ought to say it's really amazing.

I can take a look at this issue, probably it's to do with CSS, as I'm new to TypeScript I might need some help perusing through the code. :)

innosatyam commented 2 years ago

Closing due to inactivity.