fix: clicking a select when editing a color token now keeps the modal open

cuserox commented 2 weeks ago

Why does this PR exist?

When editing a color token, specifically the Modify operations, when clicking outside either of the Select components - still within the Dialog - it would close the whole modal!

What does this pull request do?

Sets the EditTokenFormModal to be a true Dialog by reverting this line (now modal={true} as per Radix's Dialog default prop)
Fixes when both components are closed (Select contained in a Dialog) seems to dees the underlying layer unresponsive due to pointer-events: none remaining in the <body> = Radix bug! This mitigates it as a temporary fix on the EditTokenFormModal.tsx. Some thoughts:
- 🧐 Could be related to the mismatching dependencies as discussed here
- 🤕 Some users reported that this was not fixed after upgrading DropdownMenus / Select & Dialog to the latest Radix UI versions - then they went for a temporary fix:
  - 🎁 Fix for now: set pointer-events to auto (Community suggestions: https://github.com/radix-ui/primitives/issues/1241#issuecomment-1734547434 & https://github.com/radix-ui/primitives/issues/1241#issuecomment-2048551011)
  - 🔜 Fix for the future: upgrade Radix components safely in the DS (https://github.com/tokens-studio/ds/issues/220, https://github.com/tokens-studio/ds/issues/219)

Testing this change

In the Tokens tab, edit or duplicate any color token, and see a Modal appear
Add a (+) Modify to set an Operation or Space (see 2 Select components)
Click outside any Select, still inside the Modal
The Modal now stays open!

Before	After

changeset-bot[bot] commented 2 weeks ago

⚠️ No Changeset found

Latest commit: 2d30fad9b51948fd9b04a275e150da4ab45d9010

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

cuserox commented 1 week ago

🥼 Closing in favour of more testing on the DS: https://github.com/tokens-studio/ds/pull/222 🔜 Next up: overriding clashing versions of resolved packages

tokens-studio / figma-plugin