@abraca/nuxt 1.8.2 → 2.0.0

package/dist/runtime/extensions/views/FigureView.vue

@@ -0,0 +1,122 @@
+<script setup>
+import { ref, computed, watch } from "vue";
+import { NodeViewWrapper } from "@tiptap/vue-3";
+import ANodeInlineLabel from "../../components/editor/ANodeInlineLabel.vue";
+const props = defineProps({
+  decorations: { type: Array, required: true },
+  selected: { type: Boolean, required: true },
+  updateAttributes: { type: Function, required: true },
+  deleteNode: { type: Function, required: true },
+  node: { type: null, required: true },
+  view: { type: null, required: true },
+  getPos: { type: null, required: true },
+  innerDecorations: { type: null, required: true },
+  editor: { type: Object, required: true },
+  extension: { type: Object, required: true },
+  HTMLAttributes: { type: Object, required: true }
+});
+const src = computed(() => props.node.attrs.src || "");
+const alt = computed(() => props.node.attrs.alt || "");
+const caption = computed(() => props.node.attrs.caption || "");
+const srcPopoverOpen = ref(false);
+const srcDraft = ref("");
+const altDraft = ref("");
+watch(srcPopoverOpen, (open) => {
+  if (open) {
+    srcDraft.value = src.value;
+    altDraft.value = alt.value;
+  }
+});
+function saveSrc() {
+  props.updateAttributes({ src: srcDraft.value.trim(), alt: altDraft.value.trim() });
+  srcPopoverOpen.value = false;
+}
+function setCaption(v) {
+  props.updateAttributes({ caption: v });
+}
+function onSrcKeydown(e) {
+  if (e.key === "Enter") {
+    e.preventDefault();
+    saveSrc();
+  }
+}
+</script>
+
+<template>
+  <NodeViewWrapper
+    as="figure"
+    class="my-5 flex flex-col items-center gap-2"
+    contenteditable="false"
+  >
+    <UPopover
+      v-model:open="srcPopoverOpen"
+      :content="{ align: 'center' }"
+    >
+      <div class="relative w-full group/figure cursor-pointer">
+        <img
+          v-if="src"
+          :src="src"
+          :alt="alt"
+          class="max-w-full h-auto rounded-md mx-auto"
+        >
+        <div
+          v-else
+          class="aspect-video w-full bg-(--ui-bg-elevated) rounded-md border border-dashed border-(--ui-border) flex flex-col items-center justify-center gap-2 text-(--ui-text-muted) hover:border-(--ui-border-accented) hover:text-(--ui-text) transition-colors"
+        >
+          <UIcon
+            name="i-lucide-image"
+            class="size-8"
+          />
+          <span class="text-sm">Click to add image URL</span>
+        </div>
+        <div
+          v-if="src"
+          class="absolute top-2 right-2 opacity-0 group-hover/figure:opacity-100 transition-opacity"
+        >
+          <UButton
+            size="xs"
+            color="neutral"
+            variant="solid"
+            icon="i-lucide-pencil"
+            label="Replace"
+          />
+        </div>
+      </div>
+      <template #content>
+        <div class="p-2 w-96 flex flex-col gap-2">
+          <UInput
+            v-model="srcDraft"
+            autofocus
+            size="sm"
+            placeholder="Image URL (https://…)"
+            icon="i-lucide-link"
+            @keydown="onSrcKeydown"
+          />
+          <UInput
+            v-model="altDraft"
+            size="sm"
+            placeholder="Alt text (for accessibility)"
+            icon="i-lucide-text"
+            @keydown="onSrcKeydown"
+          />
+          <div class="flex justify-end">
+            <UButton
+              size="sm"
+              @click="saveSrc"
+            >
+              Save
+            </UButton>
+          </div>
+        </div>
+      </template>
+    </UPopover>
+    <figcaption class="text-sm text-(--ui-text-muted) text-center">
+      <ANodeInlineLabel
+        :model-value="caption"
+        placeholder="Add caption"
+        variant="label"
+        @update:model-value="setCaption"
+      />
+    </figcaption>
+  </NodeViewWrapper>
+</template>

package/dist/runtime/extensions/views/FigureView.vue.d.ts

@@ -0,0 +1,4 @@
+import type { NodeViewProps } from '@tiptap/vue-3';
+declare const __VLS_export: import("vue").DefineComponent<NodeViewProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NodeViewProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/extensions/views/FileNodeView.vue

@@ -1,7 +1,12 @@
 <script setup>
-import { computed, ref, watch, onMounted } from "vue";
+import { computed, ref, watch, onMounted, defineAsyncComponent } from "vue";
 import { useAbracadabra, useFileBlobStore } from "#imports";
 import { NodeViewWrapper } from "@tiptap/vue-3";
+import AFileVideoPlayer from "../../components/editor/AFileVideoPlayer.vue";
+import AFileAudioPlayer from "../../components/editor/AFileAudioPlayer.vue";
+const AFileGlbViewer = defineAsyncComponent(
+  () => import("../../components/editor/AFileGlbViewer.vue")
+);
 const props = defineProps({
   decorations: { type: Array, required: true },
   selected: { type: Boolean, required: true },
@@ -26,6 +31,8 @@ const loading = ref(true);
 const error = ref(null);
 const fileCategory = computed(() => {
   const mt = mimeType.value || "";
+  const fn = filename.value?.toLowerCase() || "";
+  if (mt === "model/gltf-binary" || mt === "model/gltf+json" || fn.endsWith(".glb") || fn.endsWith(".gltf")) return "glb";
   if (mt.startsWith("image/")) return "image";
   if (mt.startsWith("video/")) return "video";
   if (mt.startsWith("audio/")) return "audio";
@@ -110,35 +117,25 @@ watch(client, (c) => {
       >
 
       <!-- Video -->
-      <video
+      <AFileVideoPlayer
         v-else-if="fileCategory === 'video'"
         :src="blobUrl"
-        controls
-        class="block w-full"
-        :aria-label="filename"
+        :filename="filename"
       />
 
       <!-- Audio -->
-      <div
+      <AFileAudioPlayer
         v-else-if="fileCategory === 'audio'"
-        class="flex items-center gap-3 p-4"
-      >
-        <UIcon
-          name="i-lucide-music-2"
-          class="text-(--ui-primary) text-2xl shrink-0"
-        />
-        <div class="flex-1 min-w-0">
-          <p class="text-sm font-medium text-(--ui-text) truncate mb-1.5">
-            {{ filename }}
-          </p>
-          <audio
-            :src="blobUrl"
-            controls
-            class="w-full"
-            style="height:36px"
-          />
-        </div>
-      </div>
+        :src="blobUrl"
+        :filename="filename"
+      />
+
+      <!-- GLB / glTF — three.js peer dep loaded async -->
+      <AFileGlbViewer
+        v-else-if="fileCategory === 'glb'"
+        :url="blobUrl"
+        :object-id="`${docId}/${uploadId}`"
+      />
 
       <!-- Generic file (download) -->
       <a

package/dist/runtime/extensions/views/MathBlockView.d.vue.ts

@@ -0,0 +1,4 @@
+import type { NodeViewProps } from '@tiptap/vue-3';
+declare const __VLS_export: import("vue").DefineComponent<NodeViewProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NodeViewProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/extensions/views/MathBlockView.vue

@@ -0,0 +1,151 @@
+<script setup>
+import { ref, computed, watch, onMounted } from "vue";
+import { NodeViewWrapper } from "@tiptap/vue-3";
+import { loadKatex } from "../../utils/loadKatex";
+const props = defineProps({
+  decorations: { type: Array, required: true },
+  selected: { type: Boolean, required: true },
+  updateAttributes: { type: Function, required: true },
+  deleteNode: { type: Function, required: true },
+  node: { type: null, required: true },
+  view: { type: null, required: true },
+  getPos: { type: null, required: true },
+  innerDecorations: { type: null, required: true },
+  editor: { type: Object, required: true },
+  extension: { type: Object, required: true },
+  HTMLAttributes: { type: Object, required: true }
+});
+const expression = computed(() => props.node.attrs.expression || "");
+const popoverOpen = ref(false);
+const draft = ref("");
+const katexRef = ref(null);
+watch(popoverOpen, (open) => {
+  if (open) draft.value = expression.value;
+});
+onMounted(async () => {
+  katexRef.value = await loadKatex();
+});
+function render(src) {
+  if (!src) return { html: "", error: "" };
+  if (!katexRef.value) {
+    return { html: "", error: "" };
+  }
+  try {
+    return {
+      html: katexRef.value.renderToString(src, {
+        displayMode: true,
+        throwOnError: false,
+        strict: "ignore"
+      }),
+      error: ""
+    };
+  } catch (err) {
+    return { html: "", error: err instanceof Error ? err.message : String(err) };
+  }
+}
+const rendered = computed(() => render(expression.value));
+const preview = computed(() => render(draft.value));
+function commit() {
+  props.updateAttributes({ expression: draft.value });
+}
+function onKeydown(e) {
+  if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) {
+    e.preventDefault();
+    commit();
+    popoverOpen.value = false;
+  }
+}
+</script>
+
+<template>
+  <NodeViewWrapper
+    as="div"
+    class="my-5"
+    contenteditable="false"
+  >
+    <UPopover
+      v-model:open="popoverOpen"
+      :content="{ align: 'center' }"
+    >
+      <button
+        class="w-full rounded-md border border-(--ui-border) bg-(--ui-bg) hover:border-(--ui-border-accented) transition-colors p-4 flex items-center justify-center min-h-[64px]"
+        type="button"
+      >
+        <div
+          v-if="rendered.html"
+          class="overflow-x-auto"
+          v-html="rendered.html"
+        />
+        <div
+          v-else-if="rendered.error"
+          class="text-(--ui-error) font-mono text-sm"
+        >
+          {{ rendered.error }}
+        </div>
+        <pre
+          v-else-if="expression && !katexRef"
+          class="text-(--ui-text-muted) font-mono text-sm m-0 whitespace-pre-wrap"
+        >$$ {{ expression }} $$</pre>
+        <div
+          v-else
+          class="text-(--ui-text-muted) text-sm flex items-center gap-2"
+        >
+          <UIcon
+            name="i-lucide-square-sigma"
+            class="size-5"
+          />
+          Click to add math expression
+        </div>
+      </button>
+      <template #content>
+        <div class="p-2 w-[480px] flex flex-col gap-2">
+          <textarea
+            v-model="draft"
+            autofocus
+            class="p-2 font-mono text-sm bg-(--ui-bg) border border-(--ui-border) rounded-md outline-none focus:border-(--ui-primary) resize-none min-h-[100px]"
+            placeholder="\sum_{i=0}^n i = \frac{n(n+1)}{2}"
+            spellcheck="false"
+            @keydown="onKeydown"
+            @blur="commit"
+          />
+          <div class="rounded-md border border-(--ui-border-muted) bg-(--ui-bg-elevated)/30 p-3 min-h-[80px] flex items-center justify-center overflow-x-auto">
+            <div
+              v-if="preview.html"
+              v-html="preview.html"
+            />
+            <div
+              v-else-if="preview.error"
+              class="text-(--ui-error) font-mono text-xs"
+            >
+              {{ preview.error }}
+            </div>
+            <div
+              v-else-if="!katexRef"
+              class="text-(--ui-text-dimmed) text-xs italic"
+            >
+              KaTeX not installed — install <code class="font-mono">katex</code> to preview.
+            </div>
+            <div
+              v-else
+              class="text-(--ui-text-muted) text-sm"
+            >
+              Preview
+            </div>
+          </div>
+          <div class="text-xs text-(--ui-text-muted) flex items-center justify-between">
+            <span>Tip: ⌘/Ctrl + Enter to save</span>
+            <UButton
+              size="xs"
+              @click="() => {
+  commit();
+  popoverOpen = false;
+}"
+            >
+              Save
+            </UButton>
+          </div>
+        </div>
+      </template>
+    </UPopover>
+  </NodeViewWrapper>
+</template>

package/dist/runtime/extensions/views/MathBlockView.vue.d.ts

@@ -0,0 +1,4 @@
+import type { NodeViewProps } from '@tiptap/vue-3';
+declare const __VLS_export: import("vue").DefineComponent<NodeViewProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NodeViewProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/extensions/views/MathInlineView.d.vue.ts

@@ -0,0 +1,4 @@
+import type { NodeViewProps } from '@tiptap/vue-3';
+declare const __VLS_export: import("vue").DefineComponent<NodeViewProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NodeViewProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/extensions/views/MathInlineView.vue

@@ -0,0 +1,149 @@
+<script setup>
+import { ref, computed, watch, onMounted } from "vue";
+import { NodeViewWrapper } from "@tiptap/vue-3";
+import { loadKatex } from "../../utils/loadKatex";
+const props = defineProps({
+  decorations: { type: Array, required: true },
+  selected: { type: Boolean, required: true },
+  updateAttributes: { type: Function, required: true },
+  deleteNode: { type: Function, required: true },
+  node: { type: null, required: true },
+  view: { type: null, required: true },
+  getPos: { type: null, required: true },
+  innerDecorations: { type: null, required: true },
+  editor: { type: Object, required: true },
+  extension: { type: Object, required: true },
+  HTMLAttributes: { type: Object, required: true }
+});
+const expression = computed(() => props.node.attrs.expression || "");
+const popoverOpen = ref(false);
+const draft = ref("");
+const katexRef = ref(null);
+watch(popoverOpen, (open) => {
+  if (open) draft.value = expression.value;
+});
+onMounted(async () => {
+  katexRef.value = await loadKatex();
+});
+function render(src) {
+  if (!src) return { html: "", error: "" };
+  if (!katexRef.value) return { html: "", error: "" };
+  try {
+    return {
+      html: katexRef.value.renderToString(src, {
+        displayMode: false,
+        throwOnError: false,
+        strict: "ignore"
+      }),
+      error: ""
+    };
+  } catch (err) {
+    return { html: "", error: err instanceof Error ? err.message : String(err) };
+  }
+}
+const rendered = computed(() => render(expression.value));
+const preview = computed(() => render(draft.value));
+function commit() {
+  props.updateAttributes({ expression: draft.value });
+}
+function onKeydown(e) {
+  if (e.key === "Enter") {
+    e.preventDefault();
+    commit();
+    popoverOpen.value = false;
+  } else if (e.key === "Escape") {
+    e.preventDefault();
+    popoverOpen.value = false;
+  }
+}
+function remove() {
+  const pos = props.getPos();
+  if (pos === void 0) return;
+  props.editor.chain().focus().deleteRange({ from: pos, to: pos + 1 }).run();
+  popoverOpen.value = false;
+}
+</script>
+
+<template>
+  <NodeViewWrapper
+    as="span"
+    class="inline"
+  >
+    <UPopover
+      v-model:open="popoverOpen"
+      :content="{ align: 'start' }"
+    >
+      <button
+        class="inline align-baseline rounded-sm px-1 hover:bg-(--ui-bg-elevated)/60 focus:outline-none focus-visible:ring-2 focus-visible:ring-(--ui-primary) cursor-pointer"
+        type="button"
+      >
+        <span
+          v-if="rendered.html"
+          v-html="rendered.html"
+        />
+        <span
+          v-else-if="rendered.error"
+          class="text-(--ui-error) font-mono text-sm"
+        >
+          ${{ expression }}$
+        </span>
+        <span
+          v-else-if="expression && !katexRef"
+          class="text-(--ui-text-muted) font-mono text-sm"
+        >
+          ${{ expression }}$
+        </span>
+        <span
+          v-else
+          class="text-(--ui-text-muted) font-mono text-sm italic"
+        >
+          $\text{add}$
+        </span>
+      </button>
+      <template #content>
+        <div class="p-2 w-80 flex flex-col gap-2">
+          <UInput
+            v-model="draft"
+            autofocus
+            size="sm"
+            placeholder="e^{i\pi} + 1 = 0"
+            class="font-mono"
+            @keydown="onKeydown"
+          />
+          <div class="rounded-md border border-(--ui-border-muted) bg-(--ui-bg-elevated)/30 px-3 py-2 min-h-[36px] flex items-center">
+            <span
+              v-if="preview.html"
+              v-html="preview.html"
+            />
+            <span
+              v-else-if="preview.error"
+              class="text-(--ui-error) font-mono text-xs"
+            >
+              {{ preview.error }}
+            </span>
+            <span
+              v-else-if="!katexRef"
+              class="text-(--ui-text-dimmed) text-xs italic"
+            >
+              KaTeX not installed
+            </span>
+            <span
+              v-else
+              class="text-(--ui-text-muted) text-sm"
+            >Preview</span>
+          </div>
+          <UButton
+            size="sm"
+            color="neutral"
+            variant="ghost"
+            icon="i-lucide-trash"
+            block
+            @click="remove"
+          >
+            Remove
+          </UButton>
+        </div>
+      </template>
+    </UPopover>
+  </NodeViewWrapper>
+</template>

package/dist/runtime/extensions/views/MathInlineView.vue.d.ts

@@ -0,0 +1,4 @@
+import type { NodeViewProps } from '@tiptap/vue-3';
+declare const __VLS_export: import("vue").DefineComponent<NodeViewProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NodeViewProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;