@stnd/ui 0.7.3 → 0.8.0

package/AlertDialog.svelte

@@ -1,4 +1,5 @@
 <script>
+  import { tick } from "svelte";
   /**
    * @component AlertDialog
    * @description A native `<dialog>`-based confirmation modal. Used
@@ -26,12 +27,28 @@
   } = $props();
 
   let dialog = $state();
+  /** @type {Element | null} */
+  let opener = null;
 
   $effect(() => {
     if (open && dialog && !dialog.open) {
+      opener = document.activeElement;
       dialog.showModal();
     } else if (!open && dialog && dialog.open) {
       dialog.close();
+      // Hand focus back. A closed <dialog> is display:none, but the button
+      // the user just pressed stays `document.activeElement` — and this
+      // dialog swallows keydown (below), so until something else took focus
+      // every key, Escape and the app's shortcuts included, went to a hidden
+      // button and died there. `Dialog` restores focus; this one did not.
+      const back = opener;
+      opener = null;
+      tick().then(() => {
+        if (back?.isConnected) /** @type {HTMLElement} */ (back).focus?.();
+        // The opener may be disabled by now (a busy "Clear" button) and refuse
+        // focus; never leave it on the dialog we just closed.
+        if (dialog?.contains(document.activeElement)) /** @type {HTMLElement} */ (document.activeElement).blur();
+      });
     }
   });
 

package/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @stnd/ui
 
+## 0.8.0
+
+### Minor Changes
+
+- Auto-bumped @stnd/ui due to modified code.
+
+### Patch Changes
+
+- Updated dependencies
+  - @stnd/icon@0.4.0
+
 ## 0.7.3
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stnd/ui",
-  "version": "0.7.3",
+  "version": "0.8.0",
   "type": "module",
   "svelte": "./Combobox.svelte",
   "exports": {
@@ -30,7 +30,7 @@
   },
   "dependencies": {
     "wrangler": "^4.129.0",
-    "@stnd/icon": "0.3.1",
+    "@stnd/icon": "0.4.0",
     "@stnd/store": "0.5.1",
     "@stnd/utils": "0.6.1"
   },