@abraca/nuxt 2.10.0 → 2.13.0

package/dist/runtime/components/chat/AChatInput.vue.d.ts

@@ -1,14 +1,14 @@
-/**
- * Chat message input with @mention autocomplete and document drop support.
- *
- * Ported from cou-sh/app/components/chat/ChatInput.vue — decoupled from
- * useChat/useChatUsers/usePermissions. App provides handlers via emits.
- */
 export interface ChatMentionUser {
     id: string;
     name: string;
     isAgent?: boolean;
 }
+/** Minimal shape of the message being replied to (for the draft chip). */
+export interface ReplyTarget {
+    id: string;
+    senderName?: string;
+    content?: string;
+}
 type __VLS_Props = {
     /** Whether to auto-focus the input on mount */
     autofocus?: boolean;
@@ -17,6 +17,8 @@ type __VLS_Props = {
     canSend?: boolean;
     /** Online users for @mention autocomplete */
     mentionUsers?: ChatMentionUser[];
+    /** Message being replied to — shows a draft chip above the composer. */
+    replyTo?: ReplyTarget | null;
 };
 declare function focus(): void;
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
@@ -28,6 +30,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
         docId: string;
         label: string;
     }) => any;
+    "cancel-reply": () => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onSend?: ((content: string) => any) | undefined;
     onTyping?: (() => any) | undefined;
@@ -35,7 +38,9 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
         docId: string;
         label: string;
     }) => any) | undefined;
+    "onCancel-reply"?: (() => any) | undefined;
 }>, {
+    replyTo: ReplyTarget | null;
     placeholder: string;
     autofocus: boolean;
     canSend: boolean;

package/dist/runtime/components/chat/AChatList.d.vue.ts

@@ -32,28 +32,40 @@ type __VLS_Props = {
     channels?: ChatChannelItem[];
     notifications?: NotificationItem[];
     notificationUnreadCount?: number;
+    /** Ids of muted channels (shown dimmed; right-click to toggle). */
+    mutedIds?: string[];
+    /** Ids of pinned channels (shown with a pin; right-click to toggle). */
+    pinnedIds?: string[];
 };
 type __VLS_ModelProps = {
     'selectedChannelId'?: string | null;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    hide: (channelId: string) => any;
     "select-channel": (channelId: string) => any;
     "select-notification": (notification: NotificationItem) => any;
     "mark-all-read": () => any;
     "load-more": () => any;
+    "toggle-mute": (channelId: string) => any;
+    "toggle-pin": (channelId: string) => any;
     "update:selectedChannelId": (value: string | null) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onHide?: ((channelId: string) => any) | undefined;
     "onSelect-channel"?: ((channelId: string) => any) | undefined;
     "onSelect-notification"?: ((notification: NotificationItem) => any) | undefined;
     "onMark-all-read"?: (() => any) | undefined;
     "onLoad-more"?: (() => any) | undefined;
+    "onToggle-mute"?: ((channelId: string) => any) | undefined;
+    "onToggle-pin"?: ((channelId: string) => any) | undefined;
     "onUpdate:selectedChannelId"?: ((value: string | null) => any) | undefined;
 }>, {
     notifications: NotificationItem[];
     mode: "chat" | "notifications";
     channels: ChatChannelItem[];
     notificationUnreadCount: number;
+    mutedIds: string[];
+    pinnedIds: string[];
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/chat/AChatList.vue

@@ -1,15 +1,44 @@
 <script setup>
-const _props = defineProps({
+const props = defineProps({
   mode: { type: String, required: false, default: "chat" },
   channels: { type: Array, required: false, default: () => [] },
   notifications: { type: Array, required: false, default: () => [] },
-  notificationUnreadCount: { type: Number, required: false, default: 0 }
+  notificationUnreadCount: { type: Number, required: false, default: 0 },
+  mutedIds: { type: Array, required: false, default: () => [] },
+  pinnedIds: { type: Array, required: false, default: () => [] }
 });
-const emit = defineEmits(["select-channel", "select-notification", "mark-all-read", "load-more"]);
+const emit = defineEmits(["select-channel", "select-notification", "mark-all-read", "load-more", "toggle-mute", "toggle-pin", "hide"]);
 const selectedChannelId = defineModel("selectedChannelId", { type: [String, null], ...{ default: null } });
 function channelIcon(ch) {
   return ch.type === "dm" ? "i-lucide-user" : "i-lucide-users";
 }
+function isMutedItem(id) {
+  return props.mutedIds.includes(id);
+}
+function isPinnedItem(id) {
+  return props.pinnedIds.includes(id);
+}
+function channelMenuItems(ch) {
+  return [[
+    {
+      label: isPinnedItem(ch.id) ? "Unpin" : "Pin",
+      icon: isPinnedItem(ch.id) ? "i-lucide-pin-off" : "i-lucide-pin",
+      onSelect: () => emit("toggle-pin", ch.id)
+    },
+    {
+      label: isMutedItem(ch.id) ? "Unmute" : "Mute",
+      icon: isMutedItem(ch.id) ? "i-lucide-bell" : "i-lucide-bell-off",
+      onSelect: () => emit("toggle-mute", ch.id)
+    }
+  ], [
+    {
+      label: "Hide",
+      icon: "i-lucide-eye-off",
+      color: "error",
+      onSelect: () => emit("hide", ch.id)
+    }
+  ]];
+}
 function formatTimestamp(ts) {
   if (!ts) return "";
   const d = new Date(ts);
@@ -142,43 +171,58 @@ function onClickNotification(n) {
       </p>
     </div>
 
-    <div
+    <UContextMenu
       v-for="ch in channels"
       :key="ch.id"
-      class="p-4 sm:px-6 text-sm cursor-pointer border-l-2 transition-colors"
-      :class="[
+      :items="channelMenuItems(ch)"
+    >
+      <div
+        class="p-4 sm:px-6 text-sm cursor-pointer border-l-2 transition-colors"
+        :class="[
   ch.unreadCount > 0 ? 'text-(--ui-text-highlighted)' : 'text-(--ui-text-muted)',
+  isMutedItem(ch.id) ? 'opacity-60' : '',
   selectedChannelId === ch.id ? 'border-(--ui-color-primary-500) bg-(--ui-color-primary-500)/10' : 'border-transparent hover:border-(--ui-color-primary-500) hover:bg-(--ui-color-primary-500)/5'
 ]"
-      @click="selectedChannelId = ch.id;
+        @click="selectedChannelId = ch.id;
   emit('select-channel', ch.id)"
-    >
-      <div
-        class="flex items-center justify-between"
-        :class="[ch.unreadCount > 0 && 'font-semibold']"
       >
-        <div class="flex items-center gap-2.5">
-          <UIcon
-            :name="channelIcon(ch)"
-            class="size-4 text-(--ui-text-dimmed) shrink-0"
-          />
-          <span class="truncate">{{ ch.label }}</span>
-          <span
-            v-if="ch.unreadCount > 0"
-            class="inline-flex items-center justify-center min-w-5 h-5 px-1.5 rounded-full bg-(--ui-color-error-500) text-white text-[11px] font-bold leading-none"
-          >{{ ch.unreadCount }}</span>
+        <div
+          class="flex items-center justify-between"
+          :class="[ch.unreadCount > 0 && 'font-semibold']"
+        >
+          <div class="flex items-center gap-2.5 min-w-0">
+            <UIcon
+              :name="channelIcon(ch)"
+              class="size-4 text-(--ui-text-dimmed) shrink-0"
+            />
+            <span class="truncate">{{ ch.label }}</span>
+            <UIcon
+              v-if="isPinnedItem(ch.id)"
+              name="i-lucide-pin"
+              class="size-3 text-(--ui-text-dimmed) shrink-0"
+            />
+            <UIcon
+              v-if="isMutedItem(ch.id)"
+              name="i-lucide-bell-off"
+              class="size-3 text-(--ui-text-dimmed) shrink-0"
+            />
+            <span
+              v-if="ch.unreadCount > 0 && !isMutedItem(ch.id)"
+              class="inline-flex items-center justify-center min-w-5 h-5 px-1.5 rounded-full bg-(--ui-color-error-500) text-white text-[11px] font-bold leading-none"
+            >{{ ch.unreadCount }}</span>
+          </div>
+          <span class="text-xs text-(--ui-text-dimmed) shrink-0">
+            {{ formatTimestamp(ch.lastMessage?.createdAt) }}
+          </span>
+        </div>
+        <div
+          v-if="ch.lastMessage"
+          class="flex items-center gap-1 mt-0.5 pl-6.5 min-w-0"
+        >
+          <span class="text-xs text-(--ui-text-dimmed) font-medium shrink-0">{{ ch.lastMessage.senderName }}:</span>
+          <span class="text-xs text-(--ui-text-dimmed) truncate flex-1">{{ ch.lastMessage.content }}</span>
         </div>
-        <span class="text-xs text-(--ui-text-dimmed) shrink-0">
-          {{ formatTimestamp(ch.lastMessage?.createdAt) }}
-        </span>
-      </div>
-      <div
-        v-if="ch.lastMessage"
-        class="flex items-center gap-1 mt-0.5 pl-6.5 min-w-0"
-      >
-        <span class="text-xs text-(--ui-text-dimmed) font-medium shrink-0">{{ ch.lastMessage.senderName }}:</span>
-        <span class="text-xs text-(--ui-text-dimmed) truncate flex-1">{{ ch.lastMessage.content }}</span>
       </div>
-    </div>
+    </UContextMenu>
   </div>
 </template>

package/dist/runtime/components/chat/AChatList.vue.d.ts

@@ -32,28 +32,40 @@ type __VLS_Props = {
     channels?: ChatChannelItem[];
     notifications?: NotificationItem[];
     notificationUnreadCount?: number;
+    /** Ids of muted channels (shown dimmed; right-click to toggle). */
+    mutedIds?: string[];
+    /** Ids of pinned channels (shown with a pin; right-click to toggle). */
+    pinnedIds?: string[];
 };
 type __VLS_ModelProps = {
     'selectedChannelId'?: string | null;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    hide: (channelId: string) => any;
     "select-channel": (channelId: string) => any;
     "select-notification": (notification: NotificationItem) => any;
     "mark-all-read": () => any;
     "load-more": () => any;
+    "toggle-mute": (channelId: string) => any;
+    "toggle-pin": (channelId: string) => any;
     "update:selectedChannelId": (value: string | null) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onHide?: ((channelId: string) => any) | undefined;
     "onSelect-channel"?: ((channelId: string) => any) | undefined;
     "onSelect-notification"?: ((notification: NotificationItem) => any) | undefined;
     "onMark-all-read"?: (() => any) | undefined;
     "onLoad-more"?: (() => any) | undefined;
+    "onToggle-mute"?: ((channelId: string) => any) | undefined;
+    "onToggle-pin"?: ((channelId: string) => any) | undefined;
     "onUpdate:selectedChannelId"?: ((value: string | null) => any) | undefined;
 }>, {
     notifications: NotificationItem[];
     mode: "chat" | "notifications";
     channels: ChatChannelItem[];
     notificationUnreadCount: number;
+    mutedIds: string[];
+    pinnedIds: string[];
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/chat/AChatMessages.d.vue.ts

@@ -6,6 +6,8 @@ export interface ChatMessage {
     createdAt: number;
     /** 'sending' | 'delivered' | 'read' */
     readState?: string;
+    /** Id of the message this one replies to (threaded reply). */
+    replyTo?: string;
 }
 type __VLS_Props = {
     messages: ChatMessage[];
@@ -16,9 +18,11 @@ type __VLS_Props = {
     emptySubtext?: string;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    reply: (message: ChatMessage) => any;
     "open-doc": (docId: string) => any;
     "jump-to-quote": (docId: string, from: number, to: number) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onReply?: ((message: ChatMessage) => any) | undefined;
     "onOpen-doc"?: ((docId: string) => any) | undefined;
     "onJump-to-quote"?: ((docId: string, from: number, to: number) => any) | undefined;
 }>, {

package/dist/runtime/components/chat/AChatMessages.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { computed } from "vue";
-import { parseMessageContent, renderMessageSegments } from "../../utils/chatContent";
+import { hasRichText, parseMessageContent, previewMessageContent, renderMessageSegments } from "../../utils/chatContent";
 const props = defineProps({
   messages: { type: Array, required: true },
   currentUserId: { type: String, required: false, default: "" },
@@ -8,7 +8,15 @@ const props = defineProps({
   emptyText: { type: String, required: false, default: "No messages yet" },
   emptySubtext: { type: String, required: false, default: "Be the first to send a message" }
 });
-const emit = defineEmits(["open-doc", "jump-to-quote"]);
+const emit = defineEmits(["open-doc", "jump-to-quote", "reply"]);
+const messageById = computed(() => {
+  const map = /* @__PURE__ */ new Map();
+  for (const m of props.messages) map.set(m.id, m);
+  return map;
+});
+function repliedTo(msg) {
+  return msg.replyTo ? messageById.value.get(msg.replyTo) : void 0;
+}
 const groupedMessages = computed(() => {
   return props.messages.map((msg, i) => {
     const prev = props.messages[i - 1];
@@ -27,7 +35,7 @@ function isSelf(senderId) {
   return senderId === props.currentUserId;
 }
 function hasRichContent(text) {
-  return /@\w+/.test(text) || /https?:\/\//.test(text);
+  return hasRichText(text);
 }
 </script>
 
@@ -70,12 +78,44 @@ function hasRichContent(text) {
     </div>
 
     <div
-      class="max-w-[75%] rounded-xl px-3 py-2"
+      class="group relative max-w-[75%] rounded-xl px-3 py-2"
       :class="[
   isSelf(msg.senderId) ? 'bg-(--ui-color-primary-100) dark:bg-(--ui-color-primary-900)/30' : 'bg-(--ui-bg-elevated)',
   msg.isFirstInGroup ? '' : isSelf(msg.senderId) ? 'rounded-tr-sm' : 'rounded-tl-sm'
 ]"
     >
+      <!-- Reply affordance — appears on hover -->
+      <UButton
+        icon="i-lucide-reply"
+        size="xs"
+        color="neutral"
+        variant="ghost"
+        class="absolute -top-2 opacity-0 group-hover:opacity-100 transition-opacity bg-(--ui-bg-elevated) ring-1 ring-(--ui-border)"
+        :class="isSelf(msg.senderId) ? '-left-2' : '-right-2'"
+        :aria-label="`Reply to ${msg.senderName}`"
+        @click="emit('reply', msg)"
+      />
+
+      <!-- Quoted preview of the message being replied to -->
+      <button
+        v-if="msg.replyTo"
+        type="button"
+        class="flex items-center gap-1.5 w-full mb-1 px-2 py-1 rounded-md bg-(--ui-bg)/50 border-l-2 border-(--ui-primary) text-left"
+        @click="repliedTo(msg) && emit('reply', repliedTo(msg))"
+      >
+        <UIcon
+          name="i-lucide-reply"
+          class="size-3 shrink-0 text-(--ui-text-dimmed)"
+        />
+        <span class="text-[11px] text-(--ui-text-muted) truncate">
+          <template v-if="repliedTo(msg)">
+            <span class="font-medium">{{ repliedTo(msg).senderName || "message" }}</span>
+            · {{ previewMessageContent(repliedTo(msg).content) }}
+          </template>
+          <template v-else>Replied to an earlier message</template>
+        </span>
+      </button>
+
       <!-- Name + time: first in group -->
       <div
         v-if="msg.isFirstInGroup"
@@ -123,6 +163,19 @@ function hasRichContent(text) {
             v-else-if="seg.type === 'mention'"
             class="text-(--ui-color-primary-500) font-medium"
           >@{{ seg.name }}</span>
+          <strong
+            v-else-if="seg.type === 'bold'"
+            class="font-semibold"
+          >{{ seg.value }}</strong>
+          <em v-else-if="seg.type === 'italic'">{{ seg.value }}</em>
+          <span
+            v-else-if="seg.type === 'strike'"
+            class="line-through"
+          >{{ seg.value }}</span>
+          <code
+            v-else-if="seg.type === 'code'"
+            class="px-1 py-0.5 rounded bg-(--ui-bg-accented) font-mono text-[0.85em]"
+          >{{ seg.value }}</code>
           <template v-else>
             {{ seg.value }}
           </template>

package/dist/runtime/components/chat/AChatMessages.vue.d.ts

@@ -6,6 +6,8 @@ export interface ChatMessage {
     createdAt: number;
     /** 'sending' | 'delivered' | 'read' */
     readState?: string;
+    /** Id of the message this one replies to (threaded reply). */
+    replyTo?: string;
 }
 type __VLS_Props = {
     messages: ChatMessage[];
@@ -16,9 +18,11 @@ type __VLS_Props = {
     emptySubtext?: string;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    reply: (message: ChatMessage) => any;
     "open-doc": (docId: string) => any;
     "jump-to-quote": (docId: string, from: number, to: number) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onReply?: ((message: ChatMessage) => any) | undefined;
     "onOpen-doc"?: ((docId: string) => any) | undefined;
     "onJump-to-quote"?: ((docId: string, from: number, to: number) => any) | undefined;
 }>, {

package/dist/runtime/components/chat/AChatPanel.d.vue.ts

@@ -44,7 +44,9 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     focus: () => void | undefined;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: () => any;
-    send: (content: string) => any;
+    send: (content: string, opts?: {
+        replyTo?: string;
+    } | undefined) => any;
     "open-doc": (docId: string) => any;
     "jump-to-quote": (docId: string, from: number, to: number) => any;
     typing: () => any;
@@ -54,7 +56,9 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     }) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onClose?: (() => any) | undefined;
-    onSend?: ((content: string) => any) | undefined;
+    onSend?: ((content: string, opts?: {
+        replyTo?: string;
+    } | undefined) => any) | undefined;
     "onOpen-doc"?: ((docId: string) => any) | undefined;
     "onJump-to-quote"?: ((docId: string, from: number, to: number) => any) | undefined;
     onTyping?: (() => any) | undefined;

package/dist/runtime/components/chat/AChatPanel.vue

@@ -17,6 +17,19 @@ const props = defineProps({
 const emit = defineEmits(["send", "typing", "doc-drop", "open-doc", "jump-to-quote", "close"]);
 const messagesContainer = ref(null);
 const chatInputRef = ref(null);
+const replyingTo = ref(null);
+function startReply(message) {
+  replyingTo.value = message;
+  nextTick(() => chatInputRef.value?.focus());
+}
+function cancelReply() {
+  replyingTo.value = null;
+}
+function onSend(content) {
+  const replyTo = replyingTo.value?.id;
+  emit("send", content, replyTo ? { replyTo } : void 0);
+  replyingTo.value = null;
+}
 function scrollToBottom() {
   if (messagesContainer.value) {
     messagesContainer.value.scrollTop = messagesContainer.value.scrollHeight;
@@ -68,6 +81,7 @@ defineExpose({
         :empty-subtext="emptySubtext"
         @open-doc="(docId) => emit('open-doc', docId)"
         @jump-to-quote="(docId, from, to) => emit('jump-to-quote', docId, from, to)"
+        @reply="startReply"
       />
 
       <AChatAgentStatus :agents="activeAgents" />
@@ -81,9 +95,11 @@ defineExpose({
       :can-send="canSend"
       :placeholder="placeholder"
       :mention-users="mentionUsers"
-      @send="(content) => emit('send', content)"
+      :reply-to="replyingTo"
+      @send="onSend"
       @typing="emit('typing')"
       @doc-drop="(payload) => emit('doc-drop', payload)"
+      @cancel-reply="cancelReply"
     />
   </div>
 </template>

package/dist/runtime/components/chat/AChatPanel.vue.d.ts

@@ -44,7 +44,9 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     focus: () => void | undefined;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: () => any;
-    send: (content: string) => any;
+    send: (content: string, opts?: {
+        replyTo?: string;
+    } | undefined) => any;
     "open-doc": (docId: string) => any;
     "jump-to-quote": (docId: string, from: number, to: number) => any;
     typing: () => any;
@@ -54,7 +56,9 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     }) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onClose?: (() => any) | undefined;
-    onSend?: ((content: string) => any) | undefined;
+    onSend?: ((content: string, opts?: {
+        replyTo?: string;
+    } | undefined) => any) | undefined;
     "onOpen-doc"?: ((docId: string) => any) | undefined;
     "onJump-to-quote"?: ((docId: string, from: number, to: number) => any) | undefined;
     onTyping?: (() => any) | undefined;

package/dist/runtime/components/chat/ANodeChatPanel.vue

@@ -38,7 +38,7 @@ const typingUsersAdapted = computed(
     :empty-text="emptyText"
     :empty-subtext="emptySubtext"
     can-send
-    @send="(content) => send(content)"
+    @send="(content, opts) => send(content, opts)"
     @typing="typing"
     @open-doc="(id) => emit('open-doc', id)"
     @jump-to-quote="(id, from, to) => emit('jump-to-quote', id, from, to)"

package/dist/runtime/components/docs/ADocsSearch.d.vue.ts

@@ -238,9 +238,9 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<import
     transition: boolean;
     autofocus: boolean;
     loading: boolean;
+    dismissible: boolean;
     colorMode: boolean;
     overlay: boolean;
-    dismissible: boolean;
     fullscreen: boolean;
     modal: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, __VLS_Slots>;

package/dist/runtime/components/docs/ADocsSearch.vue.d.ts

@@ -238,9 +238,9 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<import
     transition: boolean;
     autofocus: boolean;
     loading: boolean;
+    dismissible: boolean;
     colorMode: boolean;
     overlay: boolean;
-    dismissible: boolean;
     fullscreen: boolean;
     modal: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, __VLS_Slots>;

package/dist/runtime/components/editor/ALocationPickerPopover.vue

@@ -1,17 +1,28 @@
 <script setup>
 import { ref, watch, nextTick, onUnmounted } from "vue";
-import mapboxgl from "mapbox-gl";
 import { useRuntimeConfig } from "#imports";
-if (typeof window !== "undefined") {
-  import("mapbox-gl/dist/mapbox-gl.css");
-}
 const props = defineProps({
   latValue: { type: Number, required: false },
   lngValue: { type: Number, required: false },
   open: { type: Boolean, required: true }
 });
 const emit = defineEmits(["update:lat", "update:lng", "update:open", "clear"]);
-mapboxgl.accessToken = useRuntimeConfig().public.mapboxAccessToken;
+const mapboxAccessToken = useRuntimeConfig().public?.abracadabra?.mapboxToken;
+let mapboxgl = null;
+const mapboxError = ref(null);
+async function loadMapbox() {
+  if (mapboxgl) return true;
+  try {
+    const mod = await import("mapbox-gl");
+    mapboxgl = mod.default || mod;
+    await import("mapbox-gl/dist/mapbox-gl.css");
+    mapboxgl.accessToken = mapboxAccessToken;
+    return true;
+  } catch {
+    mapboxError.value = "Location picker requires mapbox-gl. Install it with: pnpm add mapbox-gl";
+    return false;
+  }
+}
 const mapContainer = ref(null);
 let map = null;
 let marker = null;
@@ -37,9 +48,11 @@ function destroyMap() {
   map = null;
   marker = null;
 }
-function initMap() {
+async function initMap() {
   const el = mapContainer.value;
   if (!el || map) return;
+  if (!await loadMapbox()) return;
+  if (!mapContainer.value || !props.open || map) return;
   const center = hasCoords() ? [props.lngValue, props.latValue] : [0, 20];
   const zoom = hasCoords() ? 10 : 1;
   map = new mapboxgl.Map({
@@ -110,7 +123,7 @@ async function doSearch(q) {
   if (!q.trim()) return;
   searching.value = true;
   try {
-    const url = `https://api.mapbox.com/search/geocode/v6/forward?q=${encodeURIComponent(q)}&limit=5&access_token=${mapboxgl.accessToken}`;
+    const url = `https://api.mapbox.com/search/geocode/v6/forward?q=${encodeURIComponent(q)}&limit=5&access_token=${mapboxAccessToken}`;
     const res = await fetch(url);
     const data = await res.json();
     searchResults.value = (data.features ?? []).map((f) => ({
@@ -195,10 +208,18 @@ function useMyPosition() {
 
         <!-- Map -->
         <div
+          v-show="!mapboxError"
           ref="mapContainer"
           class="w-full rounded-md overflow-hidden"
           style="height: 220px;"
         />
+        <div
+          v-if="mapboxError"
+          class="w-full rounded-md border border-(--ui-border) bg-(--ui-bg-elevated) flex items-center justify-center p-3 text-center text-xs text-(--ui-text-muted)"
+          style="height: 220px;"
+        >
+          {{ mapboxError }}
+        </div>
 
         <!-- Footer -->
         <div class="flex items-center justify-between">

package/dist/runtime/components/registry/APluginDetail.d.vue.ts

@@ -6,13 +6,13 @@ declare const __VLS_export: import("vue").DefineComponent<{
     /** See `<APluginBrowser>` — same fallback chain. */
     serverUrl?: string;
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    installed: (detail: CatalogVersionDetail) => any;
     back: () => any;
+    installed: (detail: CatalogVersionDetail) => any;
 }, string, import("vue").PublicProps, Readonly<{
     id: string;
     /** See `<APluginBrowser>` — same fallback chain. */
     serverUrl?: string;
 }> & Readonly<{
-    onInstalled?: ((detail: CatalogVersionDetail) => any) | undefined;
     onBack?: (() => any) | undefined;
+    onInstalled?: ((detail: CatalogVersionDetail) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/registry/APluginDetail.vue.d.ts

@@ -6,13 +6,13 @@ declare const __VLS_export: import("vue").DefineComponent<{
     /** See `<APluginBrowser>` — same fallback chain. */
     serverUrl?: string;
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    installed: (detail: CatalogVersionDetail) => any;
     back: () => any;
+    installed: (detail: CatalogVersionDetail) => any;
 }, string, import("vue").PublicProps, Readonly<{
     id: string;
     /** See `<APluginBrowser>` — same fallback chain. */
     serverUrl?: string;
 }> & Readonly<{
-    onInstalled?: ((detail: CatalogVersionDetail) => any) | undefined;
     onBack?: (() => any) | undefined;
+    onInstalled?: ((detail: CatalogVersionDetail) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/renderers/AChartRenderer.client.d.vue.ts

@@ -0,0 +1,17 @@
+import { type RendererBaseProps } from '../../composables/useRendererBase.js';
+type __VLS_Props = RendererBaseProps & {
+    followingUser?: string | null;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
+    connectedUsers: import("vue").ComputedRef<{
+        clientId: number;
+        name: string;
+        color: string;
+        avatar: string | undefined;
+        publicKey: any;
+    }[]>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    followingUser: string | null;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;