@unhingged/vizu-core 0.1.14 → 0.1.16

package/dist/index.d.cts

@@ -319,6 +319,16 @@ interface VizuOptions {
      */
     onCommentAdded?: (c: VizuComment) => void;
     onCommentRemoved?: (id: string) => void;
+    /**
+     * Optional override for the @ mention picker's member list. When set,
+     * the popover dropdown calls this instead of going to the cloud
+     * `/api/workspaces/[slug]/mentionable` route. Useful for non-cloud
+     * hosts (local / memory storage) that still want @-mentions, and for
+     * tests / playgrounds that need a static teammate list.
+     *
+     * Return an empty array to suppress the dropdown.
+     */
+    mentionable?: () => MentionableUser[] | Promise<MentionableUser[]>;
 }
 /**
  * Typed event map. Every event payload is an object (never bare values) so the
@@ -680,8 +690,13 @@ declare class Vizu {
     /**
      * Fetch the list of users who can be @-mentioned on the current
      * workspace. Used by the popover's mention dropdown; hosts can also
-     * call this directly to build their own picker. Returns [] for
-     * non-cloud adapters (no workspace, no member list to fetch from).
+     * call this directly to build their own picker.
+     *
+     * Resolution order:
+     *   1. `options.mentionable` if provided — host-supplied static or
+     *      custom resolver. Wins over everything else.
+     *   2. Cloud adapter's API call if running cloud mode.
+     *   3. Empty array (non-cloud, no override).
      */
     searchMentionable(): Promise<MentionableUser[]>;
     /**

package/dist/index.d.ts

@@ -319,6 +319,16 @@ interface VizuOptions {
      */
     onCommentAdded?: (c: VizuComment) => void;
     onCommentRemoved?: (id: string) => void;
+    /**
+     * Optional override for the @ mention picker's member list. When set,
+     * the popover dropdown calls this instead of going to the cloud
+     * `/api/workspaces/[slug]/mentionable` route. Useful for non-cloud
+     * hosts (local / memory storage) that still want @-mentions, and for
+     * tests / playgrounds that need a static teammate list.
+     *
+     * Return an empty array to suppress the dropdown.
+     */
+    mentionable?: () => MentionableUser[] | Promise<MentionableUser[]>;
 }
 /**
  * Typed event map. Every event payload is an object (never bare values) so the
@@ -680,8 +690,13 @@ declare class Vizu {
     /**
      * Fetch the list of users who can be @-mentioned on the current
      * workspace. Used by the popover's mention dropdown; hosts can also
-     * call this directly to build their own picker. Returns [] for
-     * non-cloud adapters (no workspace, no member list to fetch from).
+     * call this directly to build their own picker.
+     *
+     * Resolution order:
+     *   1. `options.mentionable` if provided — host-supplied static or
+     *      custom resolver. Wins over everything else.
+     *   2. Cloud adapter's API call if running cloud mode.
+     *   3. Empty array (non-cloud, no override).
      */
     searchMentionable(): Promise<MentionableUser[]>;
     /**

package/dist/index.js

@@ -3236,7 +3236,9 @@ var STYLES = `
 .vz-ref:hover { background: color-mix(in srgb, var(--vz-accent) 30%, var(--vz-bg-hover)); transform: translateY(-1px); }
 .vz-ref::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--vz-accent); flex-shrink: 0; }
 
-/* Inline @mention chip (rendered inside displayed comments) */
+/* Inline @mention chip (rendered inside displayed comments). user-select
+ * prevents the user from selecting the chip's text and editing it; the
+ * displayed comment is intentionally read-only after save. */
 .vz-mention {
   display: inline-flex; align-items: center;
   padding: 1px 8px 1px 8px;
@@ -3246,13 +3248,21 @@ var STYLES = `
   font-size: 12px; font-weight: 600;
   vertical-align: baseline;
   margin: 0 1px;
+  user-select: none;
+  -webkit-user-select: none;
+  cursor: default;
 }
 
-/* Mention chip inside the editor (contenteditable=false token) */
+/* Mention chip inside the editor (contenteditable=false token). Same
+ * non-selection rules as .vz-mention so the chip stays atomic even
+ * inside the editable surface \u2014 caret can land before/after but not
+ * inside, no partial-text edit. */
 .vz-chip-mention {
   background: color-mix(in srgb, var(--vz-accent) 16%, var(--vz-bg-hover));
   color: var(--vz-accent);
   font-weight: 600;
+  user-select: none;
+  -webkit-user-select: none;
 }
 .vz-chip-mention::before { display: none; }
 
@@ -3332,6 +3342,10 @@ var STYLES = `
   pointer-events: none;
   z-index: 1;
 }
+/* Opt-in only during an active dragover. The explicit display:flex
+ * above out-specifics the browser default for [hidden], so we restate
+ * the hide rule here to make the attribute toggle effective. */
+.vz-attachment-drop-hint[hidden] { display: none; }
 
 /* Pending attachments (uploaded but not yet saved) */
 .vz-attachment-list {
@@ -3728,10 +3742,25 @@ var Vizu = class {
   /**
    * Fetch the list of users who can be @-mentioned on the current
    * workspace. Used by the popover's mention dropdown; hosts can also
-   * call this directly to build their own picker. Returns [] for
-   * non-cloud adapters (no workspace, no member list to fetch from).
+   * call this directly to build their own picker.
+   *
+   * Resolution order:
+   *   1. `options.mentionable` if provided — host-supplied static or
+   *      custom resolver. Wins over everything else.
+   *   2. Cloud adapter's API call if running cloud mode.
+   *   3. Empty array (non-cloud, no override).
    */
   async searchMentionable() {
+    if (this.opts.mentionable) {
+      try {
+        return await this.opts.mentionable();
+      } catch (err) {
+        if (typeof console !== "undefined") {
+          console.warn("[vizu] options.mentionable threw", err);
+        }
+        return [];
+      }
+    }
     if (this.storage instanceof CloudStorageAdapter) {
       return this.storage.searchMentionable();
     }
@@ -3946,10 +3975,29 @@ var Vizu = class {
       replies: [...this.comments[idx].replies ?? [], reply]
     };
     this.comments[idx] = updated;
-    if (this.storage.addReply) {
-      await this.storage.addReply(this.opts.namespace, commentId, reply);
-    } else {
-      await this.storage.updateComment(this.opts.namespace, commentId, { replies: updated.replies });
+    try {
+      if (this.storage.addReply) {
+        await this.storage.addReply(this.opts.namespace, commentId, reply);
+      } else {
+        await this.storage.updateComment(this.opts.namespace, commentId, { replies: updated.replies });
+      }
+    } catch (err) {
+      const cur = this.comments[idx];
+      this.comments[idx] = {
+        ...cur,
+        replies: (cur.replies ?? []).filter((r) => r.id !== reply.id)
+      };
+      const code = err?.code ?? "";
+      const status = err?.status;
+      const msg = status === 403 || code === "forbidden" ? "Reply failed \u2014 you don't have permission." : status === 401 || code === "auth_required" ? "Reply failed \u2014 please sign in again." : "Reply failed. Please try again.";
+      this.pill?.toast(msg);
+      this.refreshUi();
+      if (this.popover?.isOpen()) {
+        const anchors = this.popover.getAnchors();
+        if (anchors[0]) this.popover.update(this.commentsForElement(anchors[0]));
+      }
+      if (typeof console !== "undefined") console.warn("[vizu] addReply failed", err);
+      return null;
     }
     this.bus.emit("comment:updated", { comment: updated });
     this.refreshUi();