mirror of
https://github.com/webstudio-is/webstudio.git
synced 2026-11-08 04:55:06 +09:00
Ivan Starkov
4753c2ac46
## Description Shared link name is not editable because every input change closes popover with the input. Here is the fix and the explanation. This is already fixed in rc radix versions and will be in the next stable release https://github.com/radix-ui/primitives/blob/28bebf2c6992d056244845c898abeff45dec2871/packages/react/focus-scope/src/FocusScope.tsx#L115 Without this PR the issue looks: Editing input <img width="353" alt="image" src="https://github.com/webstudio-is/webstudio/assets/5077042/b6ba547c-4286-45f2-b351-9122780cb482"> cause this button <img width="216" alt="image" src="https://github.com/webstudio-is/webstudio/assets/5077042/4d6a26c3-3336-4995-b0b4-c38200e34e07"> to switch onto `pending` state <img width="211" alt="image" src="https://github.com/webstudio-is/webstudio/assets/5077042/f214d9a9-3454-4b1b-8603-48224fa370d1"> what cause handleMutations to move focus onto parent popover Child popover lost focus and closes. ## Steps for reproduction Click Share, Edit link name, see it works ## Code Review - [ ] hi @kof, I need you to do - conceptual review (architecture, feature-correctness) - detailed review (read every line) - test it on preview ## Before requesting a review - [ ] made a self-review - [ ] added inline comments where things may be not obvious (the "why", not "what") ## Before merging - [ ] tested locally and on preview environment (preview dev login: 5de6) - [ ] updated [test cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md) document - [ ] added tests - [ ] if any new env variables are added, added them to `.env.example` and the `builder/env-check.js` if mandatory
24 lines
1.5 KiB
Diff
24 lines
1.5 KiB
Diff
diff --git a/dist/index.js b/dist/index.js
|
|
index 0a98b8ec8f2a6d1160d035174c8979a4d0445863..6793b5290ece1c13cfb2af565899d9da810f9ede 100644
|
|
--- a/dist/index.js
|
|
+++ b/dist/index.js
|
|
@@ -76,6 +76,7 @@ const $2bc01e66e04aa9ed$export$20e40289641fbbb6 = /*#__PURE__*/ $buum9$react.for
|
|
// to keep focus trapped correctly.
|
|
function handleMutations(mutations) {
|
|
const focusedElement = document.activeElement;
|
|
+ if (focusedElement !== document.body) return;
|
|
for (const mutation of mutations){
|
|
if (mutation.removedNodes.length > 0) {
|
|
if (!(container1 !== null && container1 !== void 0 && container1.contains(focusedElement))) $2bc01e66e04aa9ed$var$focus(container1);
|
|
diff --git a/dist/index.mjs b/dist/index.mjs
|
|
index 4a8b11cc2eb38b397590f20f819b6599e4d78e7d..f30c37a232e93be17e4247ada404d5160a916cc3 100644
|
|
--- a/dist/index.mjs
|
|
+++ b/dist/index.mjs
|
|
@@ -67,6 +67,7 @@ const $d3863c46a17e8a28$export$20e40289641fbbb6 = /*#__PURE__*/ $45QHv$forwardRe
|
|
// to keep focus trapped correctly.
|
|
function handleMutations(mutations) {
|
|
const focusedElement = document.activeElement;
|
|
+ if (focusedElement !== document.body) return;
|
|
for (const mutation of mutations){
|
|
if (mutation.removedNodes.length > 0) {
|
|
if (!(container1 !== null && container1 !== void 0 && container1.contains(focusedElement))) $d3863c46a17e8a28$var$focus(container1);
|