npm - @floegence/floe-webapp-core - Versions diffs - 0.35.44 → 0.35.45 - Mend

@floegence/floe-webapp-core 0.35.44 → 0.35.45

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (11) hide show

package/dist/components/notes/NotesContextMenu.js +17 -17
package/dist/components/notes/NotesEditorFlyout.js +4 -4
package/dist/components/notes/NotesOverlay.js +81 -65
package/dist/components/notes/NotesTrashFlyout.js +4 -4
package/dist/context/CommandContext.d.ts +2 -0
package/dist/context/CommandContext.js +47 -49
package/dist/context/ComponentRegistry.d.ts +1 -0
package/dist/context/ComponentRegistry.js +40 -39
package/dist/hooks/useOverlayMask.d.ts +4 -0
package/dist/hooks/useOverlayMask.js +37 -32
package/package.json +1 -1

package/dist/components/notes/NotesContextMenu.js CHANGED Viewed

@@ -1,43 +1,43 @@
-import { use as E, insert as i, createComponent as m, addEventListener as T, effect as v, className as f, setStyleProperty as d, template as s, delegateEvents as N } from "solid-js/web";
+import { use as f, insert as s, createComponent as m, addEventListener as E, effect as d, className as T, setStyleProperty as v, template as i, delegateEvents as N } from "solid-js/web";
 import { For as x } from "solid-js";
 import { cn as C } from "../../utils/cn.js";
-var O = /* @__PURE__ */ s('<div role=menu class="notes-context-menu notes-menu">'), h = /* @__PURE__ */ s("<div role=separator aria-orientation=horizontal class=notes-context-menu__separator>"), I = /* @__PURE__ */ s("<button type=button role=menuitem><span class=notes-context-menu__label>");
-const H = 188, M = 16, X = 32, P = 9;
-function S(t) {
+var O = /* @__PURE__ */ i('<div role=menu class="notes-context-menu notes-menu"data-floe-notes-boundary=true>'), h = /* @__PURE__ */ i("<div role=separator aria-orientation=horizontal class=notes-context-menu__separator>"), I = /* @__PURE__ */ i("<button type=button role=menuitem><span class=notes-context-menu__label>");
+const A = 188, M = 16, X = 32, b = 9;
+function P(t) {
   return t.kind === "action";
 }
-function y(t, n = 0) {
-  return M + Math.max(1, t) * X + Math.max(0, n) * P;
+function H(t, n = 0) {
+  return M + Math.max(1, t) * X + Math.max(0, n) * b;
 }
 function R(t) {
   return (() => {
     var n = O();
     n.$$contextmenu = (e) => e.preventDefault();
-    var c = t.menuRef;
-    return typeof c == "function" ? E(c, n) : t.menuRef = n, i(n, m(x, {
+    var u = t.menuRef;
+    return typeof u == "function" ? f(u, n) : t.menuRef = n, s(n, m(x, {
       get each() {
         return t.items;
       },
       children: (e) => {
-        if (!S(e))
+        if (!P(e))
           return h();
         const a = e.icon;
         return (() => {
-          var o = I(), u = o.firstChild;
-          return T(o, "click", e.onSelect, !0), i(o, m(a, {
+          var o = I(), c = o.firstChild;
+          return E(o, "click", e.onSelect, !0), s(o, m(a, {
             class: "h-3.5 w-3.5"
-          }), u), i(u, () => e.label), v((r) => {
+          }), c), s(c, () => e.label), d((r) => {
             var l = C("notes-context-menu__item notes-menu__item", e.destructive && "is-destructive is-danger"), _ = e.disabled;
-            return l !== r.e && f(o, r.e = l), _ !== r.t && (o.disabled = r.t = _), r;
+            return l !== r.e && T(o, r.e = l), _ !== r.t && (o.disabled = r.t = _), r;
           }, {
             e: void 0,
             t: void 0
           }), o;
         })();
       }
-    })), v((e) => {
+    })), d((e) => {
       var a = `${t.x}px`, o = `${t.y}px`;
-      return a !== e.e && d(n, "left", e.e = a), o !== e.t && d(n, "top", e.t = o), e;
+      return a !== e.e && v(n, "left", e.e = a), o !== e.t && v(n, "top", e.t = o), e;
     }, {
       e: void 0,
       t: void 0
@@ -46,7 +46,7 @@ function R(t) {
 }
 N(["contextmenu", "click"]);
 export {
-  H as NOTES_CONTEXT_MENU_WIDTH_PX,
+  A as NOTES_CONTEXT_MENU_WIDTH_PX,
   R as NotesContextMenu,
-  y as estimateNotesContextMenuHeight
+  H as estimateNotesContextMenuHeight
 };

package/dist/components/notes/NotesEditorFlyout.js CHANGED Viewed

@@ -6,10 +6,10 @@ import { noteColorClass as L } from "./notesOverlayHelpers.js";
 import { NOTE_COLOR_TOKENS as B } from "./types.js";
 import { Textarea as y } from "../ui/Input.js";
 import { Button as v } from "../ui/Button.js";
-var P = /* @__PURE__ */ f('<div class="notes-flyout notes-flyout--editor"><div class=notes-flyout__header><div><div class=notes-editor__label>Edit note</div><div class=notes-flyout__title></div></div><button type=button class=notes-flyout__close aria-label="Close editor"></button></div><div class=notes-editor><div class=notes-editor__palette><div class=notes-editor__label>Color</div><div class=notes-editor__swatches></div></div><div class=notes-editor__field><div class=notes-editor__label>Text</div></div></div><div class=notes-flyout__footer>'), F = /* @__PURE__ */ f("<button type=button><span>"), R = /* @__PURE__ */ f('<div class="notes-flyout notes-flyout--paste"><div class=notes-flyout__header><div><div class=notes-editor__label>Manual paste</div><div class=notes-flyout__title>Clipboard access was unavailable</div></div><button type=button class=notes-flyout__close aria-label="Close paste panel"></button></div><div class=notes-flyout__body></div><div class=notes-flyout__footer>');
+var P = /* @__PURE__ */ f('<div class="notes-flyout notes-flyout--editor"data-floe-notes-boundary=true><div class=notes-flyout__header><div><div class=notes-editor__label>Edit note</div><div class=notes-flyout__title></div></div><button type=button class=notes-flyout__close aria-label="Close editor"></button></div><div class=notes-editor><div class=notes-editor__palette><div class=notes-editor__label>Color</div><div class=notes-editor__swatches></div></div><div class=notes-editor__field><div class=notes-editor__label>Text</div></div></div><div class=notes-flyout__footer>'), F = /* @__PURE__ */ f("<button type=button><span>"), R = /* @__PURE__ */ f('<div class="notes-flyout notes-flyout--paste"data-floe-notes-boundary=true><div class=notes-flyout__header><div><div class=notes-editor__label>Manual paste</div><div class=notes-flyout__title>Clipboard access was unavailable</div></div><button type=button class=notes-flyout__close aria-label="Close paste panel"></button></div><div class=notes-flyout__body></div><div class=notes-flyout__footer>');
 function z(t) {
   return (() => {
-    var i = P(), r = i.firstChild, c = r.firstChild, u = c.firstChild, _ = u.nextSibling, a = c.nextSibling, n = r.nextSibling, C = n.firstChild, x = C.firstChild, S = x.nextSibling, h = C.nextSibling;
+    var i = P(), r = i.firstChild, u = r.firstChild, c = u.firstChild, _ = c.nextSibling, a = u.nextSibling, n = r.nextSibling, C = n.firstChild, x = C.firstChild, S = x.nextSibling, h = C.nextSibling;
     h.firstChild;
     var g = n.nextSibling;
     return i.$$pointerdown = (o) => o.stopPropagation(), e(_, () => t.note?.body.trim() ? "Refine note" : "Compose note"), a.$$click = () => t.onClose(), e(a, l(m, {
@@ -55,8 +55,8 @@ function G(t) {
       return t.open;
     },
     get children() {
-      var i = R(), r = i.firstChild, c = r.firstChild, u = c.nextSibling, _ = r.nextSibling, a = _.nextSibling;
-      return i.$$pointerdown = (n) => n.stopPropagation(), u.$$click = () => t.onClose(), e(u, l(m, {
+      var i = R(), r = i.firstChild, u = r.firstChild, c = u.nextSibling, _ = r.nextSibling, a = _.nextSibling;
+      return i.$$pointerdown = (n) => n.stopPropagation(), c.$$click = () => t.onClose(), e(c, l(m, {
         class: "w-4 h-4"
       })), e(_, l(y, {
         "data-floe-autofocus": !0,

package/dist/components/notes/NotesOverlay.js CHANGED Viewed

@@ -1,21 +1,28 @@
-import { createComponent as o, insert as a, addEventListener as m, effect as f, setAttribute as S, Portal as u, memo as $, template as c, delegateEvents as k } from "solid-js/web";
-import { Show as s } from "solid-js";
-import { Motion as _ } from "../../node_modules/.pnpm/solid-motionone@1.0.4_solid-js@1.9.11/node_modules/solid-motionone/dist/index.js";
-import { easing as O, duration as T } from "../../utils/animations.js";
-import { useOverlayMask as x } from "../../hooks/useOverlayMask.js";
-import { X as D } from "../icons/index.js";
-import { NotesBoard as I } from "./NotesBoard.js";
-import { NotesContextMenu as F } from "./NotesContextMenu.js";
-import { NotesEditorFlyout as R, NotesManualPasteFlyout as L } from "./NotesEditorFlyout.js";
-import { NotesOverviewPanel as C } from "./NotesOverviewPanel.js";
-import { NotesTopicRail as P } from "./NotesTopicRail.js";
-import { NotesTrashFlyout as B } from "./NotesTrashFlyout.js";
-import { NotesTrashCanIcon as E } from "./notesAppearance.js";
-import { useNotesOverlayModel as Z } from "./useNotesOverlayModel.js";
-var z = /* @__PURE__ */ c('<header class=notes-overlay__header data-floe-canvas-interactive=true><div class=notes-overlay__header-brand><div class=notes-overlay__header-title>Notes</div><div class=notes-overlay__header-separator></div><div class=notes-overlay__header-stat> topics</div><div class=notes-overlay__header-stat> live note</div><div class=notes-overlay__header-stat> trash</div></div><div class=notes-overlay__header-actions><button type=button class=notes-overlay__close aria-label="Close notes overlay"data-floe-overlay-close=true>'), W = /* @__PURE__ */ c("<button type=button class=notes-trash__toggle><div class=notes-trash__toggle-mark>"), q = /* @__PURE__ */ c("<div class=notes-overlay__body><div class=notes-trash data-floe-canvas-interactive=true>"), V = /* @__PURE__ */ c("<div class=notes-overview-backdrop>"), A = /* @__PURE__ */ c("<div class=notes-overview-flyout>"), H = /* @__PURE__ */ c("<div class=notes-menu-backdrop>");
-function X(l) {
-  return l === "floating" ? {
-    mode: l,
+import { createComponent as o, insert as i, addEventListener as p, effect as y, setAttribute as k, Portal as u, memo as $, template as c, delegateEvents as x } from "solid-js/web";
+import { createEffect as D, onCleanup as I, Show as s } from "solid-js";
+import { Motion as C } from "../../node_modules/.pnpm/solid-motionone@1.0.4_solid-js@1.9.11/node_modules/solid-motionone/dist/index.js";
+import { easing as E, duration as T } from "../../utils/animations.js";
+import { useOverlayMask as F } from "../../hooks/useOverlayMask.js";
+import { X as L } from "../icons/index.js";
+import { NotesBoard as R } from "./NotesBoard.js";
+import { NotesContextMenu as B } from "./NotesContextMenu.js";
+import { NotesEditorFlyout as P, NotesManualPasteFlyout as Z } from "./NotesEditorFlyout.js";
+import { NotesOverviewPanel as _ } from "./NotesOverviewPanel.js";
+import { NotesTopicRail as z } from "./NotesTopicRail.js";
+import { NotesTrashFlyout as W } from "./NotesTrashFlyout.js";
+import { NotesTrashCanIcon as q } from "./notesAppearance.js";
+import { useNotesOverlayModel as A } from "./useNotesOverlayModel.js";
+var V = /* @__PURE__ */ c('<header class=notes-overlay__header data-floe-canvas-interactive=true><div class=notes-overlay__header-brand><div class=notes-overlay__header-title>Notes</div><div class=notes-overlay__header-separator></div><div class=notes-overlay__header-stat> topics</div><div class=notes-overlay__header-stat> live note</div><div class=notes-overlay__header-stat> trash</div></div><div class=notes-overlay__header-actions><button type=button class=notes-overlay__close aria-label="Close notes overlay"data-floe-overlay-close=true>'), H = /* @__PURE__ */ c("<button type=button class=notes-trash__toggle><div class=notes-trash__toggle-mark>"), U = /* @__PURE__ */ c("<div class=notes-overlay__body><div class=notes-trash data-floe-canvas-interactive=true>"), X = /* @__PURE__ */ c("<div class=notes-overview-backdrop data-floe-notes-boundary=true>"), Y = /* @__PURE__ */ c("<div class=notes-overview-flyout data-floe-notes-boundary=true>"), j = /* @__PURE__ */ c("<div class=notes-menu-backdrop data-floe-notes-boundary=true>");
+const G = '[data-floe-notes-boundary="true"]';
+function J(r) {
+  return typeof Element < "u" && r instanceof Element ? r : typeof Node < "u" && r instanceof Node ? r.parentElement : null;
+}
+function w(r) {
+  return !!J(r)?.closest(G);
+}
+function K(r) {
+  return r === "floating" ? {
+    mode: r,
     ariaModal: void 0,
     lockBodyScroll: !1,
     trapFocus: !1,
@@ -36,28 +43,36 @@ function X(l) {
     }
   };
 }
-function le(l) {
-  const e = Z(l);
+function ge(r) {
+  const e = A(r);
   let v;
-  const i = () => X(l.interactionMode);
-  return x({
-    open: () => l.open,
+  const l = () => K(r.interactionMode), b = () => r.onClose();
+  return D(() => {
+    if (!r.open || l().mode !== "floating" || typeof document > "u") return;
+    const t = (n) => {
+      w(n.target) || queueMicrotask(b);
+    };
+    document.addEventListener("click", t, !0), I(() => document.removeEventListener("click", t, !0));
+  }), F({
+    open: () => r.open,
     root: () => v,
     onClose: () => e.handleCloseRequest(),
-    lockBodyScroll: i().lockBodyScroll,
-    trapFocus: i().trapFocus,
-    closeOnEscape: i().closeOnEscape,
+    onEscapeOutside: l().mode === "floating" ? b : void 0,
+    containsTarget: w,
+    lockBodyScroll: l().lockBodyScroll,
+    trapFocus: l().trapFocus,
+    closeOnEscape: l().closeOnEscape,
     blockHotkeys: !0,
-    blockWheel: i().blockWheel,
-    blockTouchMove: i().blockTouchMove,
-    autoFocus: i().autoFocus,
+    blockWheel: l().blockWheel,
+    blockTouchMove: l().blockTouchMove,
+    autoFocus: l().autoFocus,
     restoreFocus: !0
   }), o(s, {
     get when() {
-      return l.open;
+      return r.open;
     },
     get children() {
-      return o(_.section, {
+      return o(C.section, {
         ref(t) {
           var n = v;
           typeof n == "function" ? n(t) : v = t;
@@ -65,11 +80,11 @@ function le(l) {
         class: "notes-overlay",
         role: "dialog",
         get "aria-modal"() {
-          return i().ariaModal;
+          return l().ariaModal;
         },
         "aria-label": "Notes overlay",
         get "data-notes-interaction-mode"() {
-          return i().mode;
+          return l().mode;
         },
         tabIndex: -1,
         initial: {
@@ -84,8 +99,9 @@ function le(l) {
           };
         },
         get children() {
-          return [o(_.div, {
+          return [o(C.div, {
             class: "notes-overlay__frame",
+            "data-floe-notes-boundary": "true",
             initial: {
               opacity: 0,
               y: 18,
@@ -99,18 +115,18 @@ function le(l) {
             get transition() {
               return {
                 duration: T.normal,
-                easing: O.easeOut
+                easing: E.easeOut
               };
             },
             get children() {
               return [(() => {
-                var t = z(), n = t.firstChild, r = n.firstChild, g = r.nextSibling, p = g.nextSibling, y = p.firstChild, d = p.nextSibling, w = d.firstChild, b = d.nextSibling, M = b.firstChild, N = n.nextSibling, h = N.firstChild;
-                return a(p, () => e.header.topicCount(), y), a(d, () => e.header.totalLiveNotes(), w), a(d, () => e.header.totalLiveNotes() === 1 ? "" : "s", null), a(b, () => e.header.trashCount(), M), h.$$click = () => e.handleCloseRequest(), a(h, o(D, {
+                var t = V(), n = t.firstChild, a = n.firstChild, g = a.nextSibling, m = g.nextSibling, N = m.firstChild, d = m.nextSibling, M = d.firstChild, f = d.nextSibling, O = f.firstChild, S = n.nextSibling, h = S.firstChild;
+                return i(m, () => e.header.topicCount(), N), i(d, () => e.header.totalLiveNotes(), M), i(d, () => e.header.totalLiveNotes() === 1 ? "" : "s", null), i(f, () => e.header.trashCount(), O), h.$$click = () => e.handleCloseRequest(), i(h, o(L, {
                   class: "w-4 h-4"
                 })), t;
               })(), (() => {
-                var t = q(), n = t.firstChild;
-                return a(t, o(P, {
+                var t = U(), n = t.firstChild;
+                return i(t, o(z, {
                   get topics() {
                     return e.rail.topics();
                   },
@@ -150,10 +166,10 @@ function le(l) {
                   get onCancelRename() {
                     return e.rail.cancelTopicRename;
                   },
-                  onDeleteTopic: (r) => {
-                    e.rail.deleteTopic(r);
+                  onDeleteTopic: (a) => {
+                    e.rail.deleteTopic(a);
                   }
-                }), n), a(t, o(I, {
+                }), n), i(t, o(R, {
                   get activeTopic() {
                     return e.board.activeTopic();
                   },
@@ -217,8 +233,8 @@ function le(l) {
                   onMobilePaste: () => {
                     e.board.mobilePaste();
                   },
-                  onCopyNote: (r) => {
-                    e.board.copyNote(r);
+                  onCopyNote: (a) => {
+                    e.board.copyNote(a);
                   },
                   get onOpenNoteContextMenu() {
                     return e.board.openNoteContextMenu;
@@ -226,8 +242,8 @@ function le(l) {
                   get onOpenEditor() {
                     return e.board.openEditor;
                   },
-                  onMoveToTrash: (r) => {
-                    e.board.moveToTrash(r);
+                  onMoveToTrash: (a) => {
+                    e.board.moveToTrash(a);
                   },
                   get onStartOptimisticFront() {
                     return e.board.startOptimisticFront;
@@ -238,12 +254,12 @@ function le(l) {
                   get onCommitMove() {
                     return e.board.commitMove;
                   }
-                }), n), a(t, o(s, {
+                }), n), i(t, o(s, {
                   get when() {
                     return !e.board.isMobile();
                   },
                   get children() {
-                    return o(C, {
+                    return o(_, {
                       mode: "desktop",
                       get items() {
                         return e.overview.items();
@@ -268,17 +284,17 @@ function le(l) {
                       }
                     });
                   }
-                }), n), a(n, o(s, {
+                }), n), i(n, o(s, {
                   get when() {
                     return !e.trash.open();
                   },
                   get children() {
-                    var r = W(), g = r.firstChild;
-                    return m(r, "click", e.trash.openDock, !0), a(g, o(E, {
+                    var a = H(), g = a.firstChild;
+                    return p(a, "click", e.trash.openDock, !0), i(g, o(q, {
                       class: "notes-trash__toggle-icon"
-                    })), f(() => S(r, "aria-label", `Open trash dock${e.trash.count() > 0 ? `, ${e.trash.count()} items` : ""}`)), r;
+                    })), y(() => k(a, "aria-label", `Open trash dock${e.trash.count() > 0 ? `, ${e.trash.count()} items` : ""}`)), a;
                   }
-                })), f(() => n.classList.toggle("is-open", !!e.trash.open())), t;
+                })), y(() => n.classList.toggle("is-open", !!e.trash.open())), t;
               })()];
             }
           }), o(s, {
@@ -289,11 +305,11 @@ function le(l) {
               return o(u, {
                 get children() {
                   return [(() => {
-                    var t = V();
-                    return m(t, "click", e.overview.close, !0), t;
+                    var t = X();
+                    return p(t, "click", e.overview.close, !0), t;
                   })(), (() => {
-                    var t = A();
-                    return a(t, o(C, {
+                    var t = Y();
+                    return i(t, o(_, {
                       mode: "mobile",
                       get items() {
                         return e.overview.items();
@@ -326,7 +342,7 @@ function le(l) {
             }
           }), o(u, {
             get children() {
-              return o(B, {
+              return o(W, {
                 get open() {
                   return e.trash.open();
                 },
@@ -364,9 +380,9 @@ function le(l) {
               return o(u, {
                 get children() {
                   return [(() => {
-                    var t = H();
-                    return m(t, "click", e.contextMenu.close, !0), t;
-                  })(), o(F, {
+                    var t = j();
+                    return p(t, "click", e.contextMenu.close, !0), t;
+                  })(), o(B, {
                     get x() {
                       return e.contextMenu.position()?.left ?? 0;
                     },
@@ -387,7 +403,7 @@ function le(l) {
             get children() {
               return o(u, {
                 get children() {
-                  return o(R, {
+                  return o(P, {
                     get note() {
                       return e.editor.note();
                     },
@@ -415,7 +431,7 @@ function le(l) {
             }
           }), o(u, {
             get children() {
-              return o(L, {
+              return o(Z, {
                 get open() {
                   return e.manualPaste.open();
                 },
@@ -439,7 +455,7 @@ function le(l) {
     }
   });
 }
-k(["click"]);
+x(["click"]);
 export {
-  le as NotesOverlay
+  ge as NotesOverlay
 };

package/dist/components/notes/NotesTrashFlyout.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { Show as u, For as P } from "solid-js";
 import { X as U } from "../icons/index.js";
 import { NotesAnimalIcon as V, NotesTrashCanIcon as W } from "./notesAppearance.js";
 import { topicAccentClass as Y, notePreviewMetrics as Z, getNotePreviewText as tt, formatDeletedTimestamp as et, formatRemainingTrashTime as st, noteColorClass as nt } from "./notesOverlayHelpers.js";
-var it = /* @__PURE__ */ a("<div class=notes-trash-backdrop>"), lt = /* @__PURE__ */ a("<div class=notes-trash__sections>"), ot = /* @__PURE__ */ a('<div class=notes-trash__flyout><div class=notes-trash__panel><div class=notes-trash__panel-header><div class=notes-trash__panel-title-group><div class=notes-trash__panel-title-row><div class=notes-trash__panel-title>Trash Dock</div><div class=notes-trash__panel-header-actions><div class=notes-trash__panel-count> items</div><button type=button class=notes-trash__panel-close aria-label="Close trash dock"></button></div></div><div class=notes-trash__panel-body>Grouped by topic, sorted by latest deletion, and recoverable for 72 hours.'), rt = /* @__PURE__ */ a("<div class=notes-trash__empty><div><strong>Trash is empty</strong><span>Deleted notes from any topic will appear here."), at = /* @__PURE__ */ a("<section class=notes-trash-section><div class=notes-trash-section__header><div class=notes-trash-section__title-group><div class=notes-trash-section__title-line><div></div><div class=notes-trash-section__title></div></div><div class=notes-trash-section__meta> deleted note</div></div><button type=button class=notes-trash-section__clear>Clear topic trash</button></div><div class=notes-trash-section__grid>"), ct = /* @__PURE__ */ a("<button type=button class=is-danger>Delete now"), _t = /* @__PURE__ */ a("<article><div class=notes-note__surface><div class=notes-trash-note__meta><span></span><strong></strong></div><div class=notes-trash-note__body><span></span></div><div class=notes-trash-note__actions><button type=button>Restore");
+var it = /* @__PURE__ */ a("<div class=notes-trash-backdrop data-floe-notes-boundary=true>"), lt = /* @__PURE__ */ a("<div class=notes-trash__sections>"), ot = /* @__PURE__ */ a('<div class=notes-trash__flyout data-floe-notes-boundary=true><div class=notes-trash__panel><div class=notes-trash__panel-header><div class=notes-trash__panel-title-group><div class=notes-trash__panel-title-row><div class=notes-trash__panel-title>Trash Dock</div><div class=notes-trash__panel-header-actions><div class=notes-trash__panel-count> items</div><button type=button class=notes-trash__panel-close aria-label="Close trash dock"></button></div></div><div class=notes-trash__panel-body>Grouped by topic, sorted by latest deletion, and recoverable for 72 hours.'), rt = /* @__PURE__ */ a("<div class=notes-trash__empty><div><strong>Trash is empty</strong><span>Deleted notes from any topic will appear here."), at = /* @__PURE__ */ a("<section class=notes-trash-section><div class=notes-trash-section__header><div class=notes-trash-section__title-group><div class=notes-trash-section__title-line><div></div><div class=notes-trash-section__title></div></div><div class=notes-trash-section__meta> deleted note</div></div><button type=button class=notes-trash-section__clear>Clear topic trash</button></div><div class=notes-trash-section__grid>"), ct = /* @__PURE__ */ a("<button type=button class=is-danger>Delete now"), _t = /* @__PURE__ */ a("<article><div class=notes-note__surface><div class=notes-trash-note__meta><span></span><strong></strong></div><div class=notes-trash-note__body><span></span></div><div class=notes-trash-note__actions><button type=button>Restore");
 function mt(s) {
   return r(u, {
     get when() {
@@ -42,7 +42,7 @@ function mt(s) {
               children: (n) => {
                 const B = Y(n.topic_icon_accent);
                 return (() => {
-                  var p = at(), g = p.firstChild, f = g.firstChild, C = f.firstChild, h = C.firstChild, E = h.nextSibling, $ = C.nextSibling, G = $.firstChild, K = f.nextSibling, X = g.nextSibling;
+                  var p = at(), f = p.firstChild, g = f.firstChild, b = g.firstChild, h = b.firstChild, E = h.nextSibling, $ = b.nextSibling, G = $.firstChild, K = g.nextSibling, X = f.nextSibling;
                   return D(h, `notes-topic-mark notes-topic-mark--trash ${B}`), t(h, r(V, {
                     get iconKey() {
                       return n.topic_icon_key;
@@ -55,8 +55,8 @@ function mt(s) {
                     children: (o) => {
                       const v = Z(o), j = tt(o.body, v.preview_limit);
                       return (() => {
-                        var _ = _t(), q = _.firstChild, b = q.firstChild, w = b.firstChild, H = w.nextSibling, x = b.nextSibling, J = x.firstChild, y = x.nextSibling, L = y.firstChild;
-                        return t(w, () => et(o.deleted_at_unix_ms)), t(H, () => st(o.deleted_at_unix_ms, s.now)), t(J, j), L.$$click = () => s.onRestore(o.note_id), t(y, r(u, {
+                        var _ = _t(), q = _.firstChild, C = q.firstChild, y = C.firstChild, H = y.nextSibling, w = C.nextSibling, J = w.firstChild, x = w.nextSibling, L = x.firstChild;
+                        return t(y, () => et(o.deleted_at_unix_ms)), t(H, () => st(o.deleted_at_unix_ms, s.now)), t(J, j), L.$$click = () => s.onRestore(o.note_id), t(x, r(u, {
                           get when() {
                             return s.canDeleteNow;
                           },

package/dist/context/CommandContext.d.ts CHANGED Viewed

@@ -7,6 +7,8 @@ export interface Command {
         class?: string;
     }>;
     keybind?: string;
+    /** Allow this keybind even while the user is typing in an input/editor. */
+    allowWhileTyping?: boolean;
     category?: string;
     execute: () => void | Promise<void>;
 }

package/dist/context/CommandContext.js CHANGED Viewed

@@ -1,60 +1,58 @@
-import { createSignal as c, onCleanup as D, createEffect as L } from "solid-js";
-import { createSimpleContext as P } from "./createSimpleContext.js";
-import { useResolvedFloeConfig as S } from "./FloeConfigContext.js";
-import { formatKeybind as E, parseKeybind as k, matchKeybind as p } from "../utils/keybind.js";
+import { createSignal as c, onCleanup as L, createEffect as P } from "solid-js";
+import { createSimpleContext as S } from "./createSimpleContext.js";
+import { useResolvedFloeConfig as E } from "./FloeConfigContext.js";
+import { formatKeybind as T, parseKeybind as W, matchKeybind as u } from "../utils/keybind.js";
 import { deferAfterPaint as F, deferNonBlocking as m } from "../utils/defer.js";
 import { shouldIgnoreHotkeys as I } from "../utils/dom.js";
-function T() {
-  const x = S(), y = () => x.config.commands, r = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Map(), [v, s] = c(!1), [g, f] = c(""), [K, h] = c(""), [b, W] = c([]), a = () => {
-    W(Array.from(r.values()));
+function M() {
+  const x = E(), y = () => x.config.commands, r = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Map(), [v, s] = c(!1), [g, f] = c(""), [K, h] = c(""), [b, A] = c([]), l = () => {
+    A(Array.from(r.values()));
   };
   if (typeof window < "u" && y().enableGlobalKeybinds) {
     const t = (e) => {
-      const n = y();
-      if (n.save.enabled && p(e, n.save.keybind)) {
+      const n = y(), k = I(e, {
+        ignoreWhenTyping: n.ignoreWhenTyping,
+        allowWhenTypingWithin: n.allowWhenTypingWithin
+      });
+      if (n.save.enabled && u(e, n.save.keybind)) {
         const o = r.get(n.save.commandId);
         o ? (e.preventDefault(), m(() => {
           Promise.resolve(o.execute()).catch((d) => console.error(d));
         })) : n.save.preventDefaultWhenNoHandler && e.preventDefault();
         return;
       }
-      if (!I(e, {
-        ignoreWhenTyping: n.ignoreWhenTyping,
-        allowWhenTypingWithin: n.allowWhenTypingWithin
-      })) {
-        if (n.palette.enabled && p(e, n.palette.keybind)) {
-          e.preventDefault(), s((o) => !o);
-          return;
-        }
-        if (!v())
-          for (const o of r.values()) {
-            if (!o.keybind) continue;
-            const d = i.get(o.id);
-            if (d && p(e, d)) {
-              e.preventDefault(), m(() => {
-                Promise.resolve(o.execute()).catch((A) => console.error(A));
-              });
-              return;
-            }
-          }
+      if (!k && n.palette.enabled && u(e, n.palette.keybind)) {
+        e.preventDefault(), s((o) => !o);
+        return;
       }
+      if (!v())
+        for (const o of r.values()) {
+          if (!o.keybind || k && !o.allowWhileTyping) continue;
+          const d = i.get(o.id);
+          if (d && u(e, d)) {
+            e.preventDefault(), m(() => {
+              Promise.resolve(o.execute()).catch((D) => console.error(D));
+            });
+            return;
+          }
+        }
     };
-    window.addEventListener("keydown", t), D(() => window.removeEventListener("keydown", t));
+    window.addEventListener("keydown", t), L(() => window.removeEventListener("keydown", t));
   }
-  let u = 0;
-  L(() => {
+  let p = 0;
+  P(() => {
     const t = g().trim();
-    u += 1;
-    const e = u;
+    p += 1;
+    const e = p;
     if (!t) {
       h("");
       return;
     }
     F(() => {
-      e === u && h(t.toLowerCase());
+      e === p && h(t.toLowerCase());
     });
   });
-  let w = "", C = null, l = [];
+  let w = "", C = null, a = [];
   return {
     // State
     isOpen: v,
@@ -62,7 +60,7 @@ function T() {
     commands: b,
     filteredCommands: () => {
       const t = b(), e = K();
-      return t === C && e === w ? l : (C = t, w = e, e ? (l = t.filter((n) => n.title.toLowerCase().includes(e) || n.description?.toLowerCase().includes(e) || n.category?.toLowerCase().includes(e)), l) : (l = t, t));
+      return t === C && e === w ? a : (C = t, w = e, e ? (a = t.filter((n) => n.title.toLowerCase().includes(e) || n.description?.toLowerCase().includes(e) || n.category?.toLowerCase().includes(e)), a) : (a = t, t));
     },
     // Actions
     open: () => s(!0),
@@ -71,15 +69,15 @@ function T() {
     },
     toggle: () => s((t) => !t),
     setSearch: (t) => f(t),
-    register: (t) => (r.set(t.id, t), t.keybind && i.set(t.id, k(t.keybind)), a(), () => {
-      r.delete(t.id), i.delete(t.id), a();
+    register: (t) => (r.set(t.id, t), t.keybind && i.set(t.id, W(t.keybind)), l(), () => {
+      r.delete(t.id), i.delete(t.id), l();
     }),
     registerAll: (t) => (t.forEach((e) => {
-      r.set(e.id, e), e.keybind && i.set(e.id, k(e.keybind));
-    }), a(), () => {
+      r.set(e.id, e), e.keybind && i.set(e.id, W(e.keybind));
+    }), l(), () => {
       t.forEach((e) => {
         r.delete(e.id), i.delete(e.id);
-      }), a();
+      }), l();
     }),
     execute: (t) => {
       const e = r.get(t);
@@ -87,18 +85,18 @@ function T() {
         Promise.resolve(e.execute()).catch((n) => console.error(n));
       }));
     },
-    getKeybindDisplay: E
+    getKeybindDisplay: T
   };
 }
 const {
-  Provider: B,
-  use: G
-} = P({
+  Provider: G,
+  use: J
+} = S({
   name: "Command",
-  init: T
+  init: M
 });
 export {
-  B as CommandProvider,
-  T as createCommandService,
-  G as useCommand
+  G as CommandProvider,
+  M as createCommandService,
+  J as useCommand
 };

package/dist/context/ComponentRegistry.d.ts CHANGED Viewed

@@ -36,6 +36,7 @@ export interface CommandContribution<TProtocol = unknown> {
         class?: string;
     }>;
     keybind?: string;
+    allowWhileTyping?: boolean;
     category?: string;
     execute: (ctx: ComponentContext<TProtocol>) => void | Promise<void>;
 }

package/dist/context/ComponentRegistry.js CHANGED Viewed

@@ -7,16 +7,16 @@ import { useCommand as b } from "./CommandContext.js";
 import { useNotification as R } from "./NotificationContext.js";
 import { deferNonBlocking as M } from "../utils/defer.js";
 function S(r) {
-  const s = `[${r}]`;
+  const i = `[${r}]`;
   return {
-    debug: (...n) => console.debug(s, ...n),
-    info: (...n) => console.info(s, ...n),
-    warn: (...n) => console.warn(s, ...n),
-    error: (...n) => console.error(s, ...n)
+    debug: (...n) => console.debug(i, ...n),
+    info: (...n) => console.info(i, ...n),
+    warn: (...n) => console.warn(i, ...n),
+    error: (...n) => console.error(i, ...n)
   };
 }
-function A(r, s) {
-  const n = `component:${s}:`;
+function A(r, i) {
+  const n = `component:${i}:`;
   return {
     get: (a, m) => r.load(n + a, m),
     set: (a, m) => r.debouncedSave(n + a, m),
@@ -24,36 +24,36 @@ function A(r, s) {
   };
 }
 function D() {
-  const r = x(), s = v(), n = b(), a = R(), m = w();
-  return (f, p) => ({
+  const r = x(), i = v(), n = b(), a = R(), m = w();
+  return (l, p) => ({
     protocol: p?.protocol,
     theme: r,
-    layout: s,
+    layout: i,
     commands: n,
     notifications: a,
-    storage: A(m.persist, f),
-    logger: S(f)
+    storage: A(m.persist, l),
+    logger: S(l)
   });
 }
-const l = h({
+const f = h({
   name: "ComponentRegistry",
   init: B
-}), G = l.Provider;
+}), G = f.Provider;
 function H() {
-  return l.use();
+  return f.use();
 }
 function J() {
-  return l.useOptional();
+  return f.useOptional();
 }
 function K() {
-  return l.has();
+  return f.has();
 }
 function B() {
-  const [r, s] = C(/* @__PURE__ */ new Map()), [n, a] = C(/* @__PURE__ */ new Set()), m = /* @__PURE__ */ new Map(), f = (t) => {
-    s((e) => new Map(e).set(t.id, t));
+  const [r, i] = C(/* @__PURE__ */ new Map()), [n, a] = C(/* @__PURE__ */ new Set()), m = /* @__PURE__ */ new Map(), l = (t) => {
+    i((e) => new Map(e).set(t.id, t));
   }, p = (t) => {
     const e = t.map((o) => o.id).filter((o) => !!o);
-    return s((o) => {
+    return i((o) => {
       const c = new Map(o);
       return t.forEach((u) => c.set(u.id, u)), c;
     }), () => {
@@ -61,31 +61,32 @@ function B() {
         y(o);
       });
     };
-  }, g = async (t, e) => {
+  }, d = async (t, e) => {
     const o = r().get(t);
     if (!o || n().has(t)) return;
     const c = [];
     try {
       if (o.commands?.length) {
-        const u = o.commands.map((i) => ({
-          id: i.id,
-          title: i.title,
-          description: i.description,
-          icon: i.icon,
-          keybind: i.keybind,
-          category: i.category,
-          execute: () => i.execute(e)
+        const u = o.commands.map((s) => ({
+          id: s.id,
+          title: s.title,
+          description: s.description,
+          icon: s.icon,
+          keybind: s.keybind,
+          allowWhileTyping: s.allowWhileTyping,
+          category: s.category,
+          execute: () => s.execute(e)
         }));
         c.push(e.commands.registerAll(u));
       }
       await o.onMount?.(e), c.length && m.set(t, () => c.forEach((u) => u())), a((u) => {
-        const i = new Set(u);
-        return i.add(t), i;
+        const s = new Set(u);
+        return s.add(t), s;
       });
     } catch (u) {
-      throw c.forEach((i) => i()), u;
+      throw c.forEach((s) => s()), u;
     }
-  }, d = async (t) => {
+  }, g = async (t) => {
     const e = r().get(t);
     if (e && n().has(t))
       try {
@@ -97,24 +98,24 @@ function B() {
         });
       }
   }, y = async (t) => {
-    await d(t), s((e) => {
+    await g(t), i((e) => {
       const o = new Map(e);
       return o.delete(t), o;
     });
   };
   return {
-    register: f,
+    register: l,
     registerAll: p,
     unregister: y,
-    mount: g,
-    unmount: d,
+    mount: d,
+    unmount: g,
     mountAll: async (t) => {
       for (const e of r().keys())
-        await g(e, t(e));
+        await d(e, t(e));
     },
     unmountAll: async () => {
       for (const t of n())
-        await d(t);
+        await g(t);
     },
     components: r,
     mountedComponents: n,

package/dist/hooks/useOverlayMask.d.ts CHANGED Viewed

@@ -5,6 +5,10 @@ export interface UseOverlayMaskOptions {
     open: Accessor<boolean>;
     root: Accessor<HTMLElement | undefined>;
     onClose?: () => void;
+    /** Treat additional nodes as part of the overlay surface (e.g. portaled layers). */
+    containsTarget?: (target: EventTarget | null) => boolean;
+    /** Optional alternate close path for Escape pressed outside the overlay surface. */
+    onEscapeOutside?: () => void;
     /** Lock `document.body` scroll while the overlay is open (default: true). */
     lockBodyScroll?: boolean;
     /** Prevent scroll via wheel events (default: none). */

package/dist/hooks/useOverlayMask.js CHANGED Viewed

@@ -1,26 +1,29 @@
-import { createEffect as L, onCleanup as M } from "solid-js";
-import { lockBodyStyle as O } from "../utils/bodyStyleLock.js";
-import { deferAfterPaint as k } from "../utils/defer.js";
-import { getFocusableElements as T, getFirstFocusableElement as B } from "../utils/focus.js";
-function i(t) {
+import { createEffect as T, onCleanup as O } from "solid-js";
+import { lockBodyStyle as M } from "../utils/bodyStyleLock.js";
+import { deferAfterPaint as p } from "../utils/defer.js";
+import { getFocusableElements as B, getFirstFocusableElement as D } from "../utils/focus.js";
+function b(t) {
   return typeof Node < "u" && t instanceof Node;
 }
-function p(t, u, c) {
-  return c === "none" ? !1 : c === "all" || !t || !i(u) ? !0 : !t.contains(u);
+function i(t, c, r) {
+  return r ? r(c) : !t || !b(c) ? !1 : t.contains(c);
+}
+function k(t, c, r, u) {
+  return r === "none" ? !1 : r === "all" ? !0 : !i(t, c, u);
 }
 function H(t) {
-  const u = () => t.lockBodyScroll !== !1, c = () => t.trapFocus !== !1, s = () => t.closeOnEscape === !1 ? "none" : t.closeOnEscape === "inside" ? "inside" : t.closeOnEscape === "none" ? "none" : "always", b = () => t.blockHotkeys !== !1, w = () => t.restoreFocus !== !1;
-  L(() => {
+  const c = () => t.lockBodyScroll !== !1, r = () => t.trapFocus !== !1, u = () => t.closeOnEscape === !1 ? "none" : t.closeOnEscape === "inside" ? "inside" : t.closeOnEscape === "none" ? "none" : "always", g = () => t.blockHotkeys !== !1, w = () => t.restoreFocus !== !1;
+  T(() => {
     if (!t.open() || typeof document > "u") return;
-    const f = document.activeElement instanceof HTMLElement ? document.activeElement : null, g = u() ? O({ overflow: "hidden" }) : null;
-    k(() => {
+    const f = document.activeElement instanceof HTMLElement ? document.activeElement : null, L = c() ? M({ overflow: "hidden" }) : null;
+    p(() => {
       const e = t.root();
       if (!e) return;
       const n = t.autoFocus;
       if (n === !1) return;
-      const o = typeof n == "object" ? n.selector : void 0, a = (o ? e.querySelector(o) : null) ?? e.querySelector("[data-floe-autofocus]") ?? B(e) ?? e;
+      const o = typeof n == "object" ? n.selector : void 0, l = (o ? e.querySelector(o) : null) ?? e.querySelector("[data-floe-autofocus]") ?? D(e) ?? e;
       try {
-        a.focus();
+        l.focus();
       } catch {
       }
     });
@@ -28,7 +31,7 @@ function H(t) {
       if (e.key !== "Tab") return;
       const n = t.root();
       if (!n) return;
-      const o = T(n);
+      const o = B(n);
       if (!o.length) {
         e.preventDefault();
         try {
@@ -37,48 +40,50 @@ function H(t) {
         }
         return;
       }
-      const r = o[0], a = o[o.length - 1], l = document.activeElement instanceof HTMLElement ? document.activeElement : null;
+      const a = o[0], l = o[o.length - 1], s = document.activeElement instanceof HTMLElement ? document.activeElement : null;
       if (e.shiftKey) {
-        if (l === r || !l || !n.contains(l)) {
+        if (s === a || !s || !n.contains(s)) {
           e.preventDefault();
           try {
-            a.focus();
+            l.focus();
           } catch {
           }
         }
-      } else if (l === a) {
+      } else if (s === l) {
         e.preventDefault();
         try {
-          r.focus();
+          a.focus();
         } catch {
         }
       }
     }, m = (e) => {
       if (e.key !== "Escape") return;
-      const n = s();
-      if (n !== "none") {
-        if (n === "inside") {
-          const o = t.root();
-          if (!o) return;
-          const r = i(e.target) ? e.target : document.activeElement;
-          if (!r || !o.contains(r)) return;
+      const n = u();
+      if (n === "none") return;
+      const o = t.root(), a = i(o, b(e.target) ? e.target : document.activeElement, t.containsTarget);
+      if (n === "inside") {
+        if (a) {
+          e.preventDefault(), e.stopImmediatePropagation(), t.onClose?.();
+          return;
         }
-        e.preventDefault(), e.stopImmediatePropagation(), t.onClose?.();
+        t.onEscapeOutside && (e.preventDefault(), e.stopImmediatePropagation(), t.onEscapeOutside());
+        return;
       }
+      e.preventDefault(), e.stopImmediatePropagation(), t.onClose?.();
     }, v = (e) => {
       const n = t.root();
-      n && b() && i(e.target) && n.contains(e.target) && e.stopPropagation();
+      n && g() && i(n, e.target, t.containsTarget) && e.stopPropagation();
     }, y = (e) => {
       const n = t.blockWheel ?? "none", o = t.root();
-      p(o, e.target, n) && e.cancelable && e.preventDefault();
+      k(o, e.target, n, t.containsTarget) && e.cancelable && e.preventDefault();
     }, h = (e) => {
       e.stopPropagation();
     }, E = (e) => {
       const n = t.blockTouchMove ?? "none", o = t.root();
-      p(o, e.target, n) && e.cancelable && e.preventDefault();
+      k(o, e.target, n, t.containsTarget) && e.cancelable && e.preventDefault();
     };
-    c() && document.addEventListener("keydown", d, !0), s() !== "none" && window.addEventListener("keydown", m, !0), document.addEventListener("keydown", v), (t.blockWheel ?? "none") !== "none" && (document.addEventListener("wheel", y, { capture: !0, passive: !1 }), document.addEventListener("wheel", h)), (t.blockTouchMove ?? "none") !== "none" && document.addEventListener("touchmove", E, { capture: !0, passive: !1 }), M(() => {
-      c() && document.removeEventListener("keydown", d, !0), s() !== "none" && window.removeEventListener("keydown", m, !0), document.removeEventListener("keydown", v), (t.blockWheel ?? "none") !== "none" && (document.removeEventListener("wheel", y, !0), document.removeEventListener("wheel", h)), (t.blockTouchMove ?? "none") !== "none" && document.removeEventListener("touchmove", E, !0), g?.(), w() && f && f.isConnected && k(() => {
+    r() && document.addEventListener("keydown", d, !0), u() !== "none" && window.addEventListener("keydown", m, !0), document.addEventListener("keydown", v), (t.blockWheel ?? "none") !== "none" && (document.addEventListener("wheel", y, { capture: !0, passive: !1 }), document.addEventListener("wheel", h)), (t.blockTouchMove ?? "none") !== "none" && document.addEventListener("touchmove", E, { capture: !0, passive: !1 }), O(() => {
+      r() && document.removeEventListener("keydown", d, !0), u() !== "none" && window.removeEventListener("keydown", m, !0), document.removeEventListener("keydown", v), (t.blockWheel ?? "none") !== "none" && (document.removeEventListener("wheel", y, !0), document.removeEventListener("wheel", h)), (t.blockTouchMove ?? "none") !== "none" && document.removeEventListener("touchmove", E, !0), L?.(), w() && f && f.isConnected && p(() => {
         if (typeof document > "u") return;
         const e = document.activeElement;
         if (!(e && e !== document.body && e !== document.documentElement))

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@floegence/floe-webapp-core",
-  "version": "0.35.44",
+  "version": "0.35.45",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",