@supersuit/artifacts 0.44.2 → 0.44.3

package/CHANGELOG.md

@@ -17,6 +17,16 @@ early. A page carrying four embeds ran about sixty words ahead by its end. The e
 - Tests: "an embed block is not read aloud" in render.test.tsx, both kinds, with and without a
   player, the wrapped words equal the narrated words.
 
+## 0.44.3
+
+**Escape closes a comment card.** Pressing Escape cancels the comment being written (nothing is
+saved), or closes the open thread, or the comments panel, topmost first. It ignores an Escape
+another layer already handled, so the definition popover and page menu keep theirs.
+
+- DETECTOR: select text, press Comment, press Escape. Before, the card stayed open.
+- REMEDY: update the dependency.
+- Tests: comment-layer.test.tsx, "Escape cancels the comment being written, saving nothing".
+
 ## 0.44.1
 
 **Highlighting text works like any page again.** A press in the gap between paragraphs, in a line's

package/lib/reader/comment-layer.js

@@ -251,6 +251,27 @@ export function CommentLayer({ artifactId, rootId, ownerName, comments, canShare
             ro.observe(root);
         return () => { live = false; window.removeEventListener('resize', relayout); ro?.disconnect(); };
     }, [artifactId, comments, signedIn, stateUrl, personalUrl, rootId, call, refreshDevice, host, audioDb]);
+    // Escape closes the top card: the comment being written, else the open thread, else the panel.
+    // Writing a comment is a draft nobody has saved, so Escape is its Cancel.
+    useEffect(() => {
+        if (!draft && !thread && !panel)
+            return;
+        const onKey = (e) => {
+            if (e.key !== 'Escape' || e.defaultPrevented)
+                return;
+            e.preventDefault();
+            if (draft)
+                setDraft(null);
+            else if (thread) {
+                setThread(null);
+                setExpanded(null);
+            }
+            else
+                setPanel(false);
+        };
+        document.addEventListener('keydown', onKey);
+        return () => document.removeEventListener('keydown', onKey);
+    }, [draft, thread, panel]);
     // Text selection inside the page shows the Comment chip.
     useEffect(() => {
         const root = document.getElementById(rootId);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@supersuit/artifacts",
-  "version": "0.44.2",
+  "version": "0.44.3",
   "description": "Publish markdown as branded, read-aloud pages from a Next.js app: the artifacts store, the route factory, the read-along reader, brand packs, password and confidential pages, and share cards.",
   "license": "MIT",
   "type": "module",