@lavalogic/scoria 0.37.36 → 0.37.37

package/dist/Helpers/dropdownPortal.d.ts

@@ -10,9 +10,12 @@
  *
  * This helper sidesteps all of that:
  *
- *   1. On open, it reparents the dropdown to `document.body` (saving
- *      the original parent + next-sibling so it can be restored on
- *      close).
+ *   1. On first open, it reparents the dropdown to `document.body` (or
+ *      to the nearest open `<dialog>` ancestor) ONCE and leaves it
+ *      there for the lifetime of the SingleSelect. Moving the element
+ *      on every open / close raced with the user's mouse click and
+ *      broke Svelte 5's per-component event delegation, so options
+ *      could only be selected with the keyboard.
  *   2. It switches the dropdown to `position: fixed` and sets
  *      `top` / `left` / `width` / `bottom` from the trigger's
  *      `getBoundingClientRect()`.
@@ -23,9 +26,10 @@
  *      `resize` events so the position tracks the trigger while the
  *      dropdown is open. Repositioning is rAF-throttled to keep the
  *      cost off the scroll-event hot path.
- *   5. On close, the dropdown is moved back to its original DOM slot
- *      and the inline positioning styles are cleared, so Svelecte's
- *      next open re-runs the same flow on a clean element.
+ *   5. On close, the inline positioning styles are cleared and the
+ *      dropdown is hidden with `display: none` (Svelecte will restore
+ *      its own display rule on the next open via the class flip). The
+ *      dropdown is NOT moved back to its original parent.
  *
  * The helper deliberately does NOT add the `is-open` class or fight
  * Svelecte's own state machine. Svelecte still owns open / closed

package/dist/Helpers/dropdownPortal.js

@@ -10,9 +10,12 @@
  *
  * This helper sidesteps all of that:
  *
- *   1. On open, it reparents the dropdown to `document.body` (saving
- *      the original parent + next-sibling so it can be restored on
- *      close).
+ *   1. On first open, it reparents the dropdown to `document.body` (or
+ *      to the nearest open `<dialog>` ancestor) ONCE and leaves it
+ *      there for the lifetime of the SingleSelect. Moving the element
+ *      on every open / close raced with the user's mouse click and
+ *      broke Svelte 5's per-component event delegation, so options
+ *      could only be selected with the keyboard.
  *   2. It switches the dropdown to `position: fixed` and sets
  *      `top` / `left` / `width` / `bottom` from the trigger's
  *      `getBoundingClientRect()`.
@@ -23,9 +26,10 @@
  *      `resize` events so the position tracks the trigger while the
  *      dropdown is open. Repositioning is rAF-throttled to keep the
  *      cost off the scroll-event hot path.
- *   5. On close, the dropdown is moved back to its original DOM slot
- *      and the inline positioning styles are cleared, so Svelecte's
- *      next open re-runs the same flow on a clean element.
+ *   5. On close, the inline positioning styles are cleared and the
+ *      dropdown is hidden with `display: none` (Svelecte will restore
+ *      its own display rule on the next open via the class flip). The
+ *      dropdown is NOT moved back to its original parent.
  *
  * The helper deliberately does NOT add the `is-open` class or fight
  * Svelecte's own state machine. Svelecte still owns open / closed
@@ -139,28 +143,26 @@ export function attachDropdownPortal(options) {
         throttled.schedule();
     };
     // Track whether the dropdown has been moved to the portal target
-    // at least once. We move it AT MOUNT and leave it there for the
-    // lifetime of the SingleSelect, regardless of open / close. This
-    // avoids two bugs the older "move on every open, move back on every
-    // close" implementation suffered from:
+    // at least once. We move it AT FIRST OPEN and leave it there for
+    // the lifetime of the SingleSelect, regardless of open / close.
+    // This avoids two bugs the older "move on every open, move back on
+    // every close" implementation suffered from:
     //   1. Svelte 5's per-component event delegation walks the live
     //      DOM parentNode chain at dispatch time; moving the dropdown
     //      mid-click left the chain pointing at the old parent and
-    //      Svelecte's `on_click` selection handler never ran, so mouse
-    //      clicks did not select an option (keyboard Enter did,
+    //      Svelecte's `on_click` selection handler never ran, so
+    //      mouse clicks did not select an option (keyboard Enter did,
     //      because keydown is wired on the input, not the dropdown).
     //   2. The MutationObserver that toggled the move based on the
     //      `is-open` class fired between `mousedown` and `click`. The
     //      observer's microtask moved the dropdown back to its
-    //      original parent before the `click` event reached an option,
-    //      so the click resolved against `body` instead of the
-    //      dropdown item.
+    //      original parent before the `click` event reached an
+    //      option, so the click resolved against `body` instead of
+    //      the dropdown item.
     // Keeping the element in the portal target the whole time also
     // puts the dropdown in the body's stacking context unconditionally,
     // which means a `z-index: 10000` actually wins against the table's
-    // own sticky-footer / pinned-column stacking contexts (the
-    // `position: fixed`-only variant suffered from that footer being
-    // painted ABOVE the open option list).
+    // own sticky-footer / pinned-column stacking contexts.
     let didMoveToPortalTarget = false;
     const moveToPortalTargetOnce = () => {
         if (didMoveToPortalTarget) {
@@ -222,18 +224,19 @@ export function attachDropdownPortal(options) {
         // Defensive: if Svelecte left the dropdown without its own
         // `display: none` (transition-cancel race paths where the
         // open/close class flip and the inline style update arrive
-        // out of order), the dropdown would otherwise stay `position:
-        // static; display: block` in `document.body` and contribute
-        // its option-list height to the body scroll size, surfacing
-        // as a stray page-level scrollbar after toggling a select.
+        // out of order), the dropdown would otherwise stay
+        // `position: static; display: block` in the portal target
+        // and contribute its option-list height to the page scroll
+        // size, surfacing as a stray page-level scrollbar after
+        // toggling a select.
         if (!dropdown.classList.contains('is-open')) {
             dropdown.style.display = 'none';
         }
         // Note: we do NOT move the dropdown back to its original
-        // parent. Moving mid-click races with the click event (see the
-        // `moveToPortalTargetOnce` comment above). The dropdown stays
-        // in the portal target for the rest of its lifetime and is
-        // removed on component unmount.
+        // parent. Moving mid-click races with the click event (see
+        // the `moveToPortalTargetOnce` comment above). The dropdown
+        // stays in the portal target for the rest of its lifetime
+        // and is removed on component unmount.
         isPortalled = false;
     };
     // Apply / unapply the portal whenever Svelecte toggles the
@@ -262,45 +265,12 @@ export function attachDropdownPortal(options) {
         observer.disconnect();
         portalIn();
         // Final cleanup: the dropdown was moved to the portal target
-        // at first open and stayed there for the component's lifetime
-        // (see `moveToPortalTargetOnce`). When the SingleSelect
-        // unmounts, take the dropdown out of the portal target so it
-        // is not orphaned in the document.
+        // at first open and stayed there for the component's
+        // lifetime. When the SingleSelect unmounts, take the dropdown
+        // out of the portal target so it is not orphaned in the
+        // document.
         if (didMoveToPortalTarget && dropdown.parentNode) {
             dropdown.parentNode.removeChild(dropdown);
         }
     };
 }
-tion;
-of;
-mutations;
-{
-    if (mutation.attributeName !== 'class') {
-        continue;
-    }
-    if (dropdown.classList.contains('is-open')) {
-        portalOut();
-    }
-    else {
-        portalIn();
-    }
-}
-;
-observer.observe(dropdown, { attributes: true, attributeFilter: ['class'] });
-// Honour the dropdown's initial state in case it mounted already
-// open (e.g. `focusOnLoad`).
-if (dropdown.classList.contains('is-open')) {
-    portalOut();
-}
-return () => {
-    observer.disconnect();
-    portalIn();
-    // Final cleanup: the dropdown was moved to the portal target
-    // at first open and stayed there for the component's lifetime
-    // (see `moveToPortalTargetOnce`). When the SingleSelect
-    // unmounts, take the dropdown out of the portal target so it
-    // is not orphaned in the document.
-    if (didMoveToPortalTarget && dropdown.parentNode) {
-        dropdown.parentNode.removeChild(dropdown);
-    }
-};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@lavalogic/scoria",
   "description": "Svelte components used for the FloWMS Web Frontend",
-  "version": "0.37.36",
+  "version": "0.37.37",
   "publishConfig": {
     "access": "restricted"
   },