@abraca/nuxt 0.3.0 → 1.5.0

package/dist/runtime/components/renderers/ADashboardRenderer.vue

@@ -1,5 +1,6 @@
 <script setup>
-import { ref, reactive, computed, watch, nextTick, onMounted, onBeforeUnmount, markRaw } from "vue";
+import { ref, reactive, computed, watch, nextTick, onMounted, onBeforeUnmount, onErrorCaptured, markRaw } from "vue";
+import { useRuntimeConfig } from "#imports";
 import { useRendererBase } from "../../composables/useRendererBase";
 import { useNodePanel } from "../../composables/useNodePanel";
 import { resolveDocType } from "../../utils/docTypes";
@@ -1105,16 +1106,17 @@ defineExpose({ connectedUsers });
                   >{{ u.name }}</span>
                 </div>
                 <!-- Resize handles (corners, visible on hover) -->
-                <div
-                  v-for="dir in ['se', 'sw', 'ne', 'nw']"
-                  v-if="editable"
-                  :key="dir"
-                  class="dw-resize dw-icon-resize opacity-0 group-hover:opacity-100 transition-opacity"
-                  :class="'dw-' + dir"
-                  @pointerdown.stop="onIconResizeStart($event, item.id, dir)"
-                  @pointermove="onWidgetResizeMove($event, item.id)"
-                  @pointerup="onWidgetResizeEnd($event, item.id)"
-                />
+                <template v-if="editable">
+                  <div
+                    v-for="dir in ['se', 'sw', 'ne', 'nw']"
+                    :key="dir"
+                    class="dw-resize dw-icon-resize opacity-0 group-hover:opacity-100 transition-opacity"
+                    :class="'dw-' + dir"
+                    @pointerdown.stop="onIconResizeStart($event, item.id, dir)"
+                    @pointermove="onWidgetResizeMove($event, item.id)"
+                    @pointerup="onWidgetResizeEnd($event, item.id)"
+                  />
+                </template>
               </div>
             </template>
 
@@ -1196,7 +1198,7 @@ defineExpose({ connectedUsers });
                     />
                     <span>{{ widgetErrors[item.id] }}</span>
                     <UButton
-                      size="2xs"
+                      size="xs"
                       variant="soft"
                       @click.stop="() => {
   delete widgetProviders[item.id];

package/dist/runtime/components/renderers/AGalleryRenderer.vue

@@ -1,8 +1,10 @@
 <script setup>
 import { ref, computed, onBeforeUnmount } from "vue";
+import { useRuntimeConfig } from "#imports";
 import { useRendererBase } from "../../composables/useRendererBase";
 import { useTouchDrag } from "../../composables/useTouchDrag";
 import { useNodePanel } from "../../composables/useNodePanel";
+import { getMetaColor } from "../../utils/getMetaColor";
 import { DEFAULT_LOCALE } from "../../locale";
 const props = defineProps({
   docId: { type: String, required: true },
@@ -96,6 +98,51 @@ function onItemPointerLeave() {
   setLocalState({ "gallery:focused": null });
 }
 onBeforeUnmount(() => setLocalState({ "gallery:focused": null }));
+const gridSize = ref("md");
+const gridClass = computed(() => {
+  switch (gridSize.value) {
+    case "sm":
+      return "grid-cols-3 sm:grid-cols-4 lg:grid-cols-6";
+    case "lg":
+      return "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3";
+    default:
+      return "grid-cols-2 sm:grid-cols-3 lg:grid-cols-4";
+  }
+});
+const gridSizeItems = computed(() => [
+  [
+    { label: "Small", icon: "i-lucide-grid-3x3", onSelect: () => {
+      gridSize.value = "sm";
+    } },
+    { label: "Medium", icon: "i-lucide-grid-2x2", onSelect: () => {
+      gridSize.value = "md";
+    } },
+    { label: "Large", icon: "i-lucide-layout-grid", onSelect: () => {
+      gridSize.value = "lg";
+    } }
+  ]
+]);
+const lightboxItem = ref(null);
+function openLightbox(item) {
+  const uploadId = item.meta?.coverUploadId;
+  if (!uploadId) {
+    openNode(item.id, item.label);
+    return;
+  }
+  lightboxItem.value = {
+    id: item.id,
+    label: item.label,
+    uploadId,
+    mimeType: item.meta?.coverMimeType
+  };
+}
+function closeLightbox() {
+  lightboxItem.value = null;
+}
+function itemBorderColor(item) {
+  const c = getMetaColor(item.meta);
+  return c ? `border-color: ${c}` : void 0;
+}
 defineExpose({ connectedUsers });
 </script>
 
@@ -106,15 +153,28 @@ defineExpose({ connectedUsers });
       <span class="text-xs text-(--ui-text-muted)">
         {{ items.length }} item{{ items.length !== 1 ? "s" : "" }}
       </span>
-      <UButton
-        v-if="editable"
-        icon="i-lucide-plus"
-        size="xs"
-        variant="ghost"
-        color="neutral"
-        :label="locale.addItem"
-        @click="addItem"
-      />
+      <div class="flex items-center gap-1">
+        <UDropdownMenu
+          :items="gridSizeItems"
+          :content="{ align: 'end' }"
+        >
+          <UButton
+            icon="i-lucide-layout-grid"
+            size="xs"
+            variant="ghost"
+            color="neutral"
+          />
+        </UDropdownMenu>
+        <UButton
+          v-if="editable"
+          icon="i-lucide-plus"
+          size="xs"
+          variant="ghost"
+          color="neutral"
+          :label="locale.addItem"
+          @click="addItem"
+        />
+      </div>
     </div>
 
     <!-- Content -->
@@ -144,7 +204,8 @@ defineExpose({ connectedUsers });
         v-else
         name="gallery"
         tag="div"
-        class="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-3"
+        class="grid gap-3"
+        :class="gridClass"
       >
         <UContextMenu
           v-for="item in items"
@@ -157,12 +218,15 @@ defineExpose({ connectedUsers });
   'opacity-40 scale-95': dragId === item.id,
   'ring-2 ring-(--ui-primary)/40': dragOverId === item.id
 }"
-            :style="itemFocusers(item.id).length ? `box-shadow: 0 0 0 2px ${itemFocusers(item.id)[0].user?.color ?? '#888'}` : void 0"
+            :style="[
+  itemFocusers(item.id).length ? `box-shadow: 0 0 0 2px ${itemFocusers(item.id)[0].user?.color ?? '#888'}` : void 0,
+  itemBorderColor(item)
+]"
             :data-drag-id="item.id"
             @pointerdown="editable && handlePointerDown($event, item.id)"
             @pointerenter="onItemPointerEnter(item.id)"
             @pointerleave="onItemPointerLeave"
-            @click="openNode(item.id, item.label)"
+            @click="openLightbox(item)"
           >
             <!-- Remote user badge -->
             <div
@@ -239,6 +303,50 @@ defineExpose({ connectedUsers });
       </TransitionGroup>
     </div>
 
+    <!-- Lightbox -->
+    <UModal
+      :open="!!lightboxItem"
+      @update:open="(v) => {
+  if (!v) closeLightbox();
+}"
+    >
+      <template #content>
+        <div
+          v-if="lightboxItem"
+          class="flex flex-col items-center"
+        >
+          <div class="flex items-center justify-between w-full p-3 border-b border-(--ui-border)">
+            <span class="text-sm font-medium truncate">{{ lightboxItem.label }}</span>
+            <div class="flex items-center gap-1">
+              <UButton
+                icon="i-lucide-external-link"
+                size="xs"
+                variant="ghost"
+                color="neutral"
+                @click="openNode(lightboxItem.id, lightboxItem.label);
+  closeLightbox()"
+              />
+              <UButton
+                icon="i-lucide-x"
+                size="xs"
+                variant="ghost"
+                color="neutral"
+                @click="closeLightbox"
+              />
+            </div>
+          </div>
+          <div class="p-4 flex items-center justify-center max-h-[80vh] overflow-auto">
+            <AGalleryCoverImage
+              :upload-id="lightboxItem.uploadId"
+              :doc-id="lightboxItem.id"
+              :mime-type="lightboxItem.mimeType"
+              class="max-w-full max-h-[70vh] object-contain rounded"
+            />
+          </div>
+        </div>
+      </template>
+    </UModal>
+
     <!-- Node panel -->
     <ANodePanel
       :node-id="openNodeId"

package/dist/runtime/components/renderers/AGraphRenderer.vue

@@ -1,5 +1,6 @@
 <script setup>
-import { ref, computed, watch, nextTick, onBeforeUnmount } from "vue";
+import { ref, computed, watch, nextTick, onMounted, onBeforeUnmount } from "vue";
+import { useRuntimeConfig } from "#imports";
 import { useRafFn, useEventListener } from "@vueuse/core";
 import { useRendererBase } from "../../composables/useRendererBase";
 import { useNodePanel } from "../../composables/useNodePanel";
@@ -169,7 +170,9 @@ function onSvgPointerUp(e) {
   } else if (activePointers.size === 1 && isPinching) {
     isPinching = false;
     pinchStart = null;
-    const [[, pt]] = activePointers.entries();
+    const _entry = [...activePointers.entries()][0];
+    if (!_entry) return;
+    const [, pt] = _entry;
     isPanning.value = true;
     panStart.value = { ex: pt.x, ey: pt.y, vx: vb.value.x, vy: vb.value.y };
   }

package/dist/runtime/components/renderers/AKanbanRenderer.vue

@@ -1,9 +1,11 @@
 <script setup>
 import { ref, computed, watch, onBeforeUnmount } from "vue";
+import { useRuntimeConfig } from "#imports";
 import { useRendererBase } from "../../composables/useRendererBase";
 import { useTouchDrag } from "../../composables/useTouchDrag";
 import { useNodePanel } from "../../composables/useNodePanel";
 import { DEFAULT_LOCALE } from "../../locale";
+import { getMetaColor } from "../../utils/getMetaColor";
 const props = defineProps({
   docId: { type: String, required: true },
   childProvider: { type: null, required: true },
@@ -23,7 +25,7 @@ const {
   openNodeId,
   openNodeLabel,
   openNodeProvider,
-  isLoading: nodePanelLoading,
+  isLoading: _nodePanelLoading,
   openNode,
   closePanel
 } = useNodePanel(childProviderRef);
@@ -143,6 +145,17 @@ function remoteHovers(cardId) {
   }
   return result;
 }
+function cardBorderStyle(card) {
+  const hovers = remoteHovers(card.id);
+  if (hovers.length > 0) return `border-left: 3px solid ${hovers[0].color}`;
+  const metaColor = getMetaColor(card.meta);
+  if (metaColor) return `border-left: 3px solid ${metaColor}`;
+  return void 0;
+}
+function columnTopBorder(col) {
+  const c = getMetaColor(col.meta);
+  return c ? `border-top: 3px solid ${c}` : void 0;
+}
 onBeforeUnmount(() => {
   setLocalState({ "kanban:dragging": null, "kanban:hovering": null });
 });
@@ -289,7 +302,7 @@ defineExpose({ connectedUsers });
 <template>
   <div class="flex-1 min-h-0 flex flex-col relative">
     <!-- Toolbar -->
-    <div class="flex items-center justify-between px-4 py-2 border-b border-(--ui-border) shrink-0">
+    <div class="flex items-center justify-between px-4 py-2 border-b border-(--ui-border) shrink-0 bg-elevated/40">
       <span class="text-xs text-(--ui-text-muted)">
         {{ columns.length }} column{{ columns.length !== 1 ? "s" : "" }}
       </span>
@@ -343,7 +356,10 @@ defineExpose({ connectedUsers });
   colDragOver === col.id ? 'border-l-4 border-l-(--ui-primary)' : '',
   colDragId === col.id ? 'opacity-40' : ''
 ]"
-          :style="remoteDragColor(col.id) && dragOverColumnId !== col.id ? `border-color: ${remoteDragColor(col.id)}` : void 0"
+          :style="[
+  remoteDragColor(col.id) && dragOverColumnId !== col.id ? `border-color: ${remoteDragColor(col.id)}` : void 0,
+  columnTopBorder(col)
+]"
           :data-drop-container="col.id"
         >
           <!-- Column header -->
@@ -413,10 +429,10 @@ defineExpose({ connectedUsers });
                 :class="{
   'opacity-30': dragCardId === card.id,
   'border-t-2 border-t-(--ui-primary)': dragOverCardId === card.id,
-  'border-(--ui-border)': remoteHovers(card.id).length === 0 && dragOverCardId !== card.id
+  'border-(--ui-border)': !cardBorderStyle(card) && dragOverCardId !== card.id
 }"
                 :style="[
-  remoteHovers(card.id).length > 0 ? `border-left: 3px solid ${remoteHovers(card.id)[0].color}` : void 0,
+  cardBorderStyle(card),
   editable ? 'touch-action: none' : ''
 ]"
                 @pointerdown="editable ? cardPointerDown($event, card.id) : void 0"

package/dist/runtime/components/renderers/AMapRenderer.vue

@@ -1,5 +1,7 @@
 <script setup>
 import { ref, computed, watch, shallowRef, onMounted, onBeforeUnmount, onUnmounted, defineAsyncComponent } from "vue";
+import { useRuntimeConfig, useColorMode } from "#imports";
+import { useAbracadabra } from "../../composables/useAbracadabra";
 import { useRendererBase } from "../../composables/useRendererBase";
 import { useNodePanel } from "../../composables/useNodePanel";
 import { DEFAULT_LOCALE } from "../../locale";

package/dist/runtime/components/renderers/AMediaRenderer.d.vue.ts

@@ -0,0 +1,19 @@
+import { type RendererBaseProps } from '../../composables/useRendererBase.js';
+import type { AbracadabraLocale } from '../../locale.js';
+type __VLS_Props = RendererBaseProps & {
+    labels?: Partial<AbracadabraLocale['renderers']>;
+    editable?: boolean;
+};
+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<{}>, {
+    editable: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/renderers/AMediaRenderer.vue

@@ -0,0 +1,224 @@
+<script setup>
+import { ref, computed, shallowRef, watch, onMounted, onBeforeUnmount } from "vue";
+import { useRuntimeConfig } from "#imports";
+import { useRendererBase } from "../../composables/useRendererBase";
+import { useNodePanel } from "../../composables/useNodePanel";
+import { useMediaExtractor } from "../../composables/useMediaExtractor";
+import { useMediaPlayback } from "../../composables/useMediaPlayback";
+import MediaPlaylist from "./media/MediaPlaylist.vue";
+import MediaTransportBar from "./media/MediaTransportBar.vue";
+import MediaSyncBar from "./media/MediaSyncBar.vue";
+const props = defineProps({
+  docId: { type: String, required: true },
+  childProvider: { type: null, required: true },
+  docLabel: { type: String, required: true },
+  pageTypes: { type: Array, required: false },
+  labels: { type: Object, required: false },
+  editable: { type: Boolean, required: false, default: true }
+});
+const config = useRuntimeConfig();
+const _locale = config.public;
+const {
+  tree,
+  childDoc,
+  childProviderRef,
+  states,
+  setLocalState,
+  connectedUsers
+} = useRendererBase(props);
+const {
+  openNodeId,
+  openNodeLabel,
+  openNodeProvider,
+  openNode,
+  closePanel
+} = useNodePanel(childProviderRef);
+const { mediaItems, groupedMedia } = useMediaExtractor(
+  tree,
+  props.docLabel
+);
+const mediaElementRef = shallowRef(null);
+const myClientId = computed(() => props.childProvider?.awareness?.clientID ?? 0);
+const getBlobUrl = async (_docId, _uploadId) => null;
+const useSyncedMapStub = (doc, mapName) => {
+  const shared = globalThis.__ABRACA_SHARED__ ?? {};
+  if (shared.useSyncedMap) return shared.useSyncedMap(doc, mapName);
+  return {
+    data: {},
+    yMap: ref(null),
+    set: (_k, _v) => {
+    },
+    lastUpdateLocal: ref(false)
+  };
+};
+const repeatMode = ref("off");
+const shuffleEnabled = ref(false);
+const playback = useMediaPlayback({
+  mediaElementRef,
+  childDoc,
+  playlist: mediaItems,
+  repeatMode,
+  shuffle: shuffleEnabled,
+  getBlobUrl,
+  useSyncedMap: useSyncedMapStub,
+  onTrackChange: (track) => {
+    setLocalState({ "media:trackId": track.id });
+  }
+});
+watch(mediaItems, (items, oldItems) => {
+  if (items.length > 0 && (!oldItems || oldItems.length === 0) && !playback.currentTrack.value) {
+    playback.playTrack(items[0]);
+  }
+});
+const remoteListeners = computed(
+  () => states.value.filter((s) => s.clientId !== myClientId.value && s["media:trackId"]).map((s) => ({
+    clientId: s.clientId,
+    name: s.user?.name ?? "User",
+    color: s.user?.color ?? "#888",
+    trackId: s["media:trackId"],
+    synced: !!s["media:synced"]
+  }))
+);
+const syncedUsers = computed(() => remoteListeners.value.filter((l) => l.synced));
+function handleJoinSync() {
+  playback.joinSync();
+  setLocalState({ "media:synced": true });
+}
+function handleLeaveSync() {
+  playback.leaveSync();
+  setLocalState({ "media:synced": false });
+}
+function handlePlayTrack(track) {
+  playback.playTrack(track);
+}
+function handleOpenTrack(track) {
+  openNode(track.id, track.label);
+}
+function onKeydown(e) {
+  if (e.target?.tagName === "INPUT" || e.target?.tagName === "TEXTAREA") return;
+  switch (e.code) {
+    case "Space":
+      e.preventDefault();
+      playback.togglePlay();
+      break;
+    case "ArrowLeft":
+      e.preventDefault();
+      playback.seek(Math.max(0, playback.currentTime.value - 5));
+      break;
+    case "ArrowRight":
+      e.preventDefault();
+      playback.seek(playback.currentTime.value + 5);
+      break;
+    case "KeyN":
+      if (!e.metaKey && !e.ctrlKey) {
+        e.preventDefault();
+        playback.nextTrack();
+      }
+      break;
+    case "KeyP":
+      if (!e.metaKey && !e.ctrlKey) {
+        e.preventDefault();
+        playback.prevTrack();
+      }
+      break;
+  }
+}
+onMounted(() => {
+  window.addEventListener("keydown", onKeydown);
+});
+onBeforeUnmount(() => {
+  window.removeEventListener("keydown", onKeydown);
+  setLocalState({ "media:trackId": null, "media:synced": false });
+});
+defineExpose({ connectedUsers });
+</script>
+
+<template>
+  <div class="flex-1 min-h-0 flex flex-col relative">
+    <!-- Toolbar -->
+    <div class="flex items-center justify-between px-4 py-2 border-b border-(--ui-border) shrink-0">
+      <span class="text-xs text-(--ui-text-muted)">
+        {{ mediaItems.length }} {{ mediaItems.length === 1 ? "track" : "tracks" }}
+      </span>
+      <div class="flex items-center gap-1">
+        <UButton
+          icon="i-lucide-shuffle"
+          variant="ghost"
+          :color="shuffleEnabled ? 'primary' : 'neutral'"
+          size="xs"
+          @click="shuffleEnabled = !shuffleEnabled"
+        />
+        <UButton
+          :icon="repeatMode === 'one' ? 'i-lucide-repeat-1' : 'i-lucide-repeat'"
+          variant="ghost"
+          :color="repeatMode !== 'off' ? 'primary' : 'neutral'"
+          size="xs"
+          @click="repeatMode = repeatMode === 'off' ? 'all' : repeatMode === 'all' ? 'one' : 'off'"
+        />
+      </div>
+    </div>
+
+    <!-- Track list -->
+    <div class="flex-1 overflow-y-auto">
+      <div
+        v-if="mediaItems.length === 0"
+        class="flex flex-col items-center justify-center h-full gap-3 text-center"
+      >
+        <UIcon
+          name="i-lucide-disc-3"
+          class="size-10 text-(--ui-text-dimmed)"
+        />
+        <p class="text-sm text-(--ui-text-muted)">
+          No tracks
+        </p>
+      </div>
+      <MediaPlaylist
+        v-else
+        :groups="groupedMedia"
+        :current-track-id="playback.currentTrack.value?.id ?? null"
+        :remote-listeners="remoteListeners"
+        @play-track="handlePlayTrack"
+        @open-track="handleOpenTrack"
+      />
+    </div>
+
+    <!-- Transport bar -->
+    <MediaTransportBar
+      v-if="playback.currentTrack.value"
+      :track="playback.currentTrack.value"
+      :is-playing="playback.isPlaying.value"
+      :current-time="playback.currentTime.value"
+      :total-duration="playback.totalDuration.value"
+      :progress-fraction="playback.progressFraction.value"
+      :is-loading="playback.isLoading.value"
+      @toggle-play="playback.togglePlay()"
+      @seek="playback.seek($event)"
+      @prev="playback.prevTrack()"
+      @next="playback.nextTrack()"
+    />
+
+    <!-- Sync bar -->
+    <MediaSyncBar
+      :is-synced="playback.isSynced.value"
+      :synced-users="syncedUsers"
+      @join-sync="handleJoinSync"
+      @leave-sync="handleLeaveSync"
+    />
+
+    <!-- Hidden audio element -->
+    <audio
+      ref="mediaElementRef"
+      preload="metadata"
+      @ended="playback.onTrackEnded()"
+      @loadedmetadata="playback.onLoadedMetadata()"
+    />
+
+    <!-- Node panel -->
+    <ANodePanel
+      :node-id="openNodeId"
+      :node-label="openNodeLabel"
+      :child-provider="openNodeProvider"
+      @close="closePanel"
+    />
+  </div>
+</template>

package/dist/runtime/components/renderers/AMediaRenderer.vue.d.ts

@@ -0,0 +1,19 @@
+import { type RendererBaseProps } from '../../composables/useRendererBase.js';
+import type { AbracadabraLocale } from '../../locale.js';
+type __VLS_Props = RendererBaseProps & {
+    labels?: Partial<AbracadabraLocale['renderers']>;
+    editable?: boolean;
+};
+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<{}>, {
+    editable: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/renderers/AOutlineRenderer.vue

@@ -1,5 +1,6 @@
 <script setup>
 import { ref, computed, nextTick, onBeforeUnmount } from "vue";
+import { useRuntimeConfig } from "#imports";
 import { useRendererBase } from "../../composables/useRendererBase";
 import { useTouchDrag } from "../../composables/useTouchDrag";
 import { useNodePanel } from "../../composables/useNodePanel";

package/dist/runtime/components/renderers/ASpatialRenderer.d.vue.ts

@@ -0,0 +1,19 @@
+import { type RendererBaseProps } from '../../composables/useRendererBase.js';
+import type { AbracadabraLocale } from '../../locale.js';
+type __VLS_Props = RendererBaseProps & {
+    labels?: Partial<AbracadabraLocale['renderers']>;
+    editable?: boolean;
+};
+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<{}>, {
+    editable: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;