freshworks / crayons

🖍️ Crayons - A UI Kit comprising of web components for building Freshworks Apps!

Home Page:https://crayons.freshworks.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

[Enhancement] - Option to choose the element to focus on opening modal

thamotharan-karuppaiah opened this issue · comments

Component
fw-modal

Describe the bug
I'm using fw-modal. In the modal popup, the secondary button "Cancel" is automatically focused whenever the modal is opened. However, our designer doesn't want this specific behaviour of the secondary button being highlighted automatically. I have checked the documentation but couldn't find anything on how to disable this behaviour.

To Reproduce
Steps to reproduce the current behaviour:

  1. Create an fm-modal and open it.
  2. Secondary button (i.e. Cancel) is getting highlighted(i.e focused) automatically.

Expected behaviour
Do not want to focus the secondary button by default

Screenshots
image

Additional context
Add any other context about the bug here.

Hi @thamotharan-karuppaiah , this is not a bug. It is the expected behaviour to highlight the first focusable element in the modal on opening the modal.

Currently, there is no way to change the behaviour. We can take this up as a feature request.

To fix this temporarily, we can maybe change the order of the buttons in the footer by adding custom footer buttons like in example here.
https://codesandbox.io/s/zen-stonebraker-mfzyqz?file=/index.html