@abraca/nuxt 1.6.0 → 1.8.0

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

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

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

@@ -5,6 +5,7 @@ import { useRendererBase } from "../../composables/useRendererBase";
 import { useNodePanel } from "../../composables/useNodePanel";
 import { useSpatialCamera } from "../../composables/useSpatialCamera";
 import { useSpatialDrag } from "../../composables/useSpatialDrag";
+import SpatialTransformInputs from "./spatial/SpatialTransformInputs.vue";
 const props = defineProps({
   docId: { type: String, required: true },
   childProvider: { type: null, required: true },
@@ -371,6 +372,21 @@ defineExpose({ connectedUsers });
             />
           </div>
 
+          <!-- Shape selector (hide for GLB — shape comes from the file) -->
+          <div
+            v-if="editable && selectedEntry.meta?.spShape !== 'glb'"
+            class="sp-prop-row"
+          >
+            <span class="sp-prop-label">Shape</span>
+            <USelectMenu
+              :model-value="selectedEntry.meta?.spShape ?? 'box'"
+              :items="shapes"
+              size="xs"
+              class="flex-1"
+              @update:model-value="tree.updateMeta(selectedEntry.id, { spShape: $event })"
+            />
+          </div>
+
           <div
             v-if="editable && selectedEntry.meta?.spShape !== 'glb'"
             class="sp-prop-row"
@@ -403,6 +419,13 @@ defineExpose({ connectedUsers });
             >
             <span class="text-[10px] w-7 text-right text-(--ui-text-dimmed)">{{ selectedEntry.meta?.spOpacity ?? 100 }}%</span>
           </div>
+
+          <!-- Transform inputs (Pos / Rot / Scale) -->
+          <SpatialTransformInputs
+            v-if="editable"
+            :entry="selectedEntry"
+            :tree="tree"
+          />
         </div>
 
         <!-- Connected users -->

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

@@ -2,12 +2,12 @@
 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 { useTableView } from "../../composables/useTableView";
 import { DEFAULT_LOCALE } from "../../locale";
 import ATableToolbar from "./table/ATableToolbar.vue";
 import ATableFlatMode from "./table/ATableFlatMode.vue";
+import ATableHierarchyMode from "./table/ATableHierarchyMode.vue";
 const props = defineProps({
   docId: { type: String, required: true },
   childProvider: { type: null, required: true },
@@ -36,215 +36,25 @@ const rowCount = computed(() => {
   if (tableView.effectiveMode.value === "flat") {
     return tree.childrenOf(null).length;
   }
-  const columns2 = tree.childrenOf(null);
-  return Math.max(0, ...columns2.map((c) => tree.childrenOf(c.id).length));
+  const columns = tree.childrenOf(null);
+  return Math.max(0, ...columns.map((c) => tree.childrenOf(c.id).length));
 });
 const flatRef = ref(null);
+const hierarchyRef = ref(null);
 function handleAddColumn() {
   if (tableView.effectiveMode.value === "hierarchy") {
-    addHierarchyColumn();
+    hierarchyRef.value?.addColumn();
   } else {
     flatRef.value?.addMetaColumn();
   }
 }
 function handleAddRow() {
   if (tableView.effectiveMode.value === "hierarchy") {
-    addHierarchyRow();
+    hierarchyRef.value?.addRow();
   } else {
     flatRef.value?.addRow();
   }
 }
-const INTERNAL_META_KEYS = /* @__PURE__ */ new Set([
-  "_metaFields",
-  "_metaInitialized",
-  "coverUploadId",
-  "coverDocId",
-  "coverMimeType",
-  "geoType",
-  "geoLat",
-  "geoLng",
-  "icon",
-  "color",
-  "geoDescription"
-]);
-const UUID_RE = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
-function camelToTitle(s) {
-  return s.replace(/([a-z])([A-Z])/g, "$1 $2").replace(/([A-Z]+)([A-Z][a-z])/g, "$1 $2").replace(/^./, (c) => c.toUpperCase());
-}
-const columns = computed(
-  () => tree.childrenOf(null).sort((a, b) => (a.order ?? 0) - (b.order ?? 0))
-);
-const colChildren = computed(() => {
-  const map = /* @__PURE__ */ new Map();
-  for (const col of columns.value) {
-    map.set(col.id, tree.childrenOf(col.id).sort((a, b) => (a.order ?? 0) - (b.order ?? 0)));
-  }
-  return map;
-});
-const hierarchyRowCount = computed(
-  () => Math.max(0, ...columns.value.map((c) => colChildren.value.get(c.id)?.length ?? 0))
-);
-function getCellEntry(colId, rowIdx) {
-  return colChildren.value.get(colId)?.[rowIdx];
-}
-function getRowRep(rowIdx) {
-  for (const col of columns.value) {
-    const entry = getCellEntry(col.id, rowIdx);
-    if (entry) return entry;
-  }
-  return void 0;
-}
-const metaColumns = computed(() => {
-  const colIds = new Set(columns.value.map((c) => c.id));
-  const keys = /* @__PURE__ */ new Set();
-  for (const col of columns.value) {
-    const children = colChildren.value.get(col.id) ?? [];
-    for (const cell of children) {
-      if (!cell.meta) continue;
-      for (const key of Object.keys(cell.meta)) {
-        if (INTERNAL_META_KEYS.has(key)) continue;
-        if (UUID_RE.test(key)) continue;
-        if (colIds.has(key)) continue;
-        keys.add(key);
-      }
-    }
-  }
-  return [...keys].sort().map((key) => ({
-    id: `__meta_${key}`,
-    label: camelToTitle(key),
-    metaKey: key
-  }));
-});
-function getCellValue(colId, rowIdx) {
-  const entry = getCellEntry(colId, rowIdx);
-  return entry?.label && entry.label !== "Untitled" ? entry.label : "";
-}
-function getMetaCellValue(rowIdx, metaKey) {
-  for (const col of columns.value) {
-    const entry = getCellEntry(col.id, rowIdx);
-    if (entry?.meta?.[metaKey] !== void 0) return String(entry.meta[metaKey]);
-  }
-  return "";
-}
-function setCellValue(colId, rowIdx, value) {
-  if (!props.editable) return;
-  const entry = getCellEntry(colId, rowIdx);
-  if (entry) {
-    tree.renameEntry(entry.id, value.trim() || "Untitled");
-  } else {
-    tree.createChild(colId, value.trim() || "Untitled");
-  }
-}
-function setMetaCellValue(rowIdx, metaKey, value) {
-  if (!props.editable) return;
-  const rep = getRowRep(rowIdx);
-  if (rep) tree.updateMeta(rep.id, { [metaKey]: value });
-}
-function addHierarchyColumn() {
-  if (!props.editable) return;
-  tree.createChild(null, "New Column");
-}
-function addHierarchyRow() {
-  if (!props.editable) return;
-  if (!columns.value[0]) return;
-  tree.createChild(columns.value[0].id, "");
-}
-function deleteColumn(col) {
-  if (!props.editable) return;
-  tree.deleteEntry(col.id);
-}
-function deleteMetaColumn(metaKey) {
-  if (!props.editable) return;
-  for (const col of columns.value) {
-    const children = colChildren.value.get(col.id) ?? [];
-    for (const cell of children) {
-      if (cell.meta?.[metaKey] !== void 0) {
-        const newMeta = { ...cell.meta };
-        delete newMeta[metaKey];
-        tree.treeMap.set(cell.id, { ...tree.treeMap.get(cell.id), meta: newMeta });
-      }
-    }
-  }
-}
-function deleteRow(rowIdx) {
-  if (!props.editable) return;
-  for (const col of columns.value) {
-    const entry = getCellEntry(col.id, rowIdx);
-    if (entry) tree.deleteEntry(entry.id);
-  }
-}
-const editingCell = ref(null);
-const editingValue = ref("");
-function startEditDocCol(rowIdx, col) {
-  if (!props.editable) return;
-  editingCell.value = { rowIdx, colId: col.id };
-  editingValue.value = getCellValue(col.id, rowIdx);
-  setLocalState({ "table:editing": { rowIdx, fieldId: col.id } });
-}
-function startEditMetaCol(rowIdx, mc) {
-  if (!props.editable) return;
-  editingCell.value = { rowIdx, colId: mc.id, metaKey: mc.metaKey };
-  editingValue.value = getMetaCellValue(rowIdx, mc.metaKey);
-  setLocalState({ "table:editing": { rowIdx, fieldId: mc.id } });
-}
-function commitEdit() {
-  if (!editingCell.value) return;
-  if (editingCell.value.metaKey) {
-    setMetaCellValue(editingCell.value.rowIdx, editingCell.value.metaKey, editingValue.value);
-  } else {
-    setCellValue(editingCell.value.colId, editingCell.value.rowIdx, editingValue.value);
-  }
-  editingCell.value = null;
-  setLocalState({ "table:editing": null });
-}
-const editingColId = ref(null);
-const editingColValue = ref("");
-function startRenameCol(col) {
-  if (!props.editable) return;
-  editingColId.value = col.id;
-  editingColValue.value = col.label;
-}
-function commitRenameCol() {
-  if (!props.editable) return;
-  if (editingColId.value && editingColValue.value.trim()) {
-    tree.renameEntry(editingColId.value, editingColValue.value.trim());
-  }
-  editingColId.value = null;
-}
-function rowIdxFromDragId(id) {
-  return Number.parseInt(id.replace("row-", ""), 10);
-}
-const {
-  dragId: rowDragId,
-  dragOverId: rowDragOverId,
-  handlePointerDown: handleRowPointerDown
-} = useTouchDrag({
-  idAttr: "data-drag-id",
-  onDrop: (srcDragId, targetDragId) => {
-    if (!props.editable) return;
-    const srcIdx = rowIdxFromDragId(srcDragId);
-    const targetIdx = rowIdxFromDragId(targetDragId);
-    if (srcIdx === targetIdx) return;
-    for (const col of columns.value) {
-      const children = colChildren.value.get(col.id) ?? [];
-      const srcEntry = children[srcIdx];
-      if (!srcEntry) continue;
-      const prev = children[targetIdx - (targetIdx > srcIdx ? 0 : 1)];
-      const next = children[targetIdx + (targetIdx > srcIdx ? 1 : 0)];
-      let newOrder;
-      if (!prev && !next) newOrder = Date.now();
-      else if (!prev) newOrder = next.order - 1e3;
-      else if (!next) newOrder = prev.order + 1e3;
-      else newOrder = (prev.order + next.order) / 2;
-      tree.moveEntry(srcEntry.id, col.id, newOrder);
-    }
-  }
-});
-function cellEditor(rowIdx, fieldId) {
-  return states.value.filter((s) => s.clientId !== myClientId.value).find(
-    (s) => s["table:editing"]?.rowIdx === rowIdx && s["table:editing"]?.fieldId === fieldId
-  );
-}
 function ensureTableStructure() {
   if (!childDoc.value) return;
   if (tableView.effectiveMode.value !== "hierarchy") return;
@@ -272,7 +82,7 @@ defineExpose({ connectedUsers });
     <!-- Toolbar -->
     <ATableToolbar
       :table-view="tableView"
-      :row-count="tableView.effectiveMode.value === 'flat' ? rowCount : hierarchyRowCount"
+      :row-count="rowCount"
       :editable="editable"
       :labels="locale"
       @add-column="handleAddColumn"
@@ -289,204 +99,23 @@ defineExpose({ connectedUsers });
       :my-client-id="myClientId"
       :set-local-state="setLocalState"
       :editable="editable"
+      :labels="locale"
       @open-node="(id, label) => openNode(id, label)"
     />
 
-    <!-- Hierarchy mode (kept inline for backward compatibility) -->
-    <div
+    <!-- Hierarchy mode -->
+    <ATableHierarchyMode
       v-else
-      class="flex-1 overflow-auto"
-    >
-      <div
-        v-if="columns.length === 0"
-        class="flex flex-col items-center justify-center h-full gap-3 text-center"
-      >
-        <UIcon
-          name="i-lucide-table"
-          class="size-10 text-(--ui-text-dimmed)"
-        />
-        <p class="text-sm text-(--ui-text-muted)">
-          {{ locale.noRows }}
-        </p>
-        <UButton
-          v-if="editable"
-          icon="i-lucide-plus"
-          :label="locale.addColumn"
-          size="sm"
-          @click="addHierarchyColumn"
-        />
-      </div>
-
-      <template v-else>
-        <table class="w-full text-sm border-collapse">
-          <thead class="sticky top-0 bg-(--ui-bg) z-10">
-            <tr class="border-b border-(--ui-border)">
-              <th class="w-6 px-1" />
-              <th class="text-left px-3 py-2 text-xs font-medium text-(--ui-text-muted) w-8">
-                #
-              </th>
-              <th
-                v-for="col in columns"
-                :key="col.id"
-                class="text-left px-3 py-2 text-xs font-medium text-(--ui-text-muted) min-w-32"
-              >
-                <div class="group flex items-center gap-1">
-                  <input
-                    v-if="editingColId === col.id"
-                    v-model="editingColValue"
-                    class="bg-transparent outline-none text-xs font-medium w-full"
-                    autofocus
-                    @keydown.enter="commitRenameCol"
-                    @keydown.escape="editingColId = null"
-                    @blur="commitRenameCol"
-                  >
-                  <span
-                    v-else
-                    class="cursor-text"
-                    @dblclick="startRenameCol(col)"
-                  >
-                    {{ col.label }}
-                  </span>
-                  <UButton
-                    v-if="editable"
-                    icon="i-lucide-x"
-                    size="xs"
-                    variant="ghost"
-                    color="neutral"
-                    class="opacity-0 group-hover:opacity-100"
-                    @click="deleteColumn(col)"
-                  />
-                </div>
-              </th>
-              <th
-                v-for="mc in metaColumns"
-                :key="mc.id"
-                class="text-left px-3 py-2 text-xs font-medium text-(--ui-text-muted) min-w-32"
-              >
-                <div class="group flex items-center gap-1">
-                  <span class="cursor-default">{{ mc.label }}</span>
-                  <UButton
-                    v-if="editable"
-                    icon="i-lucide-x"
-                    size="xs"
-                    variant="ghost"
-                    color="neutral"
-                    class="opacity-0 group-hover:opacity-100"
-                    @click="deleteMetaColumn(mc.metaKey)"
-                  />
-                </div>
-              </th>
-            </tr>
-          </thead>
-          <TransitionGroup
-            name="trow"
-            tag="tbody"
-          >
-            <tr
-              v-for="idx in hierarchyRowCount"
-              :key="getRowRep(idx - 1)?.id ?? `row-${idx}`"
-              :data-drag-id="`row-${idx - 1}`"
-              class="hover:bg-(--ui-bg-elevated) group"
-              :class="[
-  rowDragOverId === `row-${idx - 1}` ? 'border-t-2 border-(--ui-primary)' : 'border-b border-(--ui-border)',
-  rowDragId === `row-${idx - 1}` ? 'opacity-30' : ''
-]"
-            >
-              <td
-                class="px-1 py-1.5 text-(--ui-text-dimmed) w-6"
-                :class="editable ? 'opacity-0 group-hover:opacity-60 cursor-grab touch-none' : 'opacity-0'"
-                v-on="editable ? { pointerdown: ($event) => handleRowPointerDown($event, `row-${idx - 1}`) } : {}"
-              >
-                <UIcon
-                  v-if="editable"
-                  name="i-lucide-grip-vertical"
-                  class="size-4"
-                />
-              </td>
-              <td class="px-3 py-1.5 text-xs text-(--ui-text-dimmed) select-none">
-                <div class="flex items-center gap-0.5">
-                  <span class="w-4 text-center">{{ idx }}</span>
-                  <UButton
-                    v-if="getRowRep(idx - 1)"
-                    icon="i-lucide-external-link"
-                    size="xs"
-                    variant="ghost"
-                    color="neutral"
-                    class="opacity-0 group-hover:opacity-100"
-                    @click="openNode(getRowRep(idx - 1).id, getRowRep(idx - 1).label)"
-                  />
-                  <UButton
-                    v-if="editable"
-                    icon="i-lucide-trash-2"
-                    size="xs"
-                    variant="ghost"
-                    color="error"
-                    class="opacity-0 group-hover:opacity-100"
-                    @click="deleteRow(idx - 1)"
-                  />
-                </div>
-              </td>
-              <td
-                v-for="col in columns"
-                :key="col.id"
-                class="px-3 py-1.5 cursor-text"
-                :style="cellEditor(idx - 1, col.id) ? { outline: `2px solid ${cellEditor(idx - 1, col.id).user?.color}` } : {}"
-                @click="startEditDocCol(idx - 1, col)"
-              >
-                <input
-                  v-if="editingCell?.rowIdx === idx - 1 && editingCell?.colId === col.id"
-                  v-model="editingValue"
-                  class="w-full bg-transparent outline-none text-sm"
-                  autofocus
-                  @blur="commitEdit"
-                  @keydown.enter="commitEdit"
-                  @keydown.escape="editingCell = null"
-                  @click.stop
-                >
-                <span
-                  v-else
-                  class="block text-sm text-(--ui-text) min-h-5"
-                >
-                  {{ getCellValue(col.id, idx - 1) }}
-                </span>
-              </td>
-              <td
-                v-for="mc in metaColumns"
-                :key="mc.id"
-                class="px-3 py-1.5 cursor-text"
-                :style="cellEditor(idx - 1, mc.id) ? { outline: `2px solid ${cellEditor(idx - 1, mc.id).user?.color}` } : {}"
-                @click="startEditMetaCol(idx - 1, mc)"
-              >
-                <input
-                  v-if="editingCell?.rowIdx === idx - 1 && editingCell?.colId === mc.id"
-                  v-model="editingValue"
-                  class="w-full bg-transparent outline-none text-sm"
-                  autofocus
-                  @blur="commitEdit"
-                  @keydown.enter="commitEdit"
-                  @keydown.escape="editingCell = null"
-                  @click.stop
-                >
-                <span
-                  v-else
-                  class="block text-sm text-(--ui-text) min-h-5"
-                >
-                  {{ getMetaCellValue(idx - 1, mc.metaKey) }}
-                </span>
-              </td>
-            </tr>
-          </TransitionGroup>
-        </table>
-
-        <button
-          v-if="editable"
-          class="w-full text-left px-3 py-2 text-xs text-(--ui-text-dimmed) hover:bg-(--ui-bg-elevated) border-b border-(--ui-border) transition-colors"
-          @click="addHierarchyRow"
-        >
-          + {{ locale.addRow }}
-        </button>
-      </template>
-    </div>
+      ref="hierarchyRef"
+      :tree="tree"
+      :table-view="tableView"
+      :states="states"
+      :my-client-id="myClientId"
+      :set-local-state="setLocalState"
+      :editable="editable"
+      :labels="locale"
+      @open-node="(id, label) => openNode(id, label)"
+    />
 
     <!-- Node panel -->
     <ANodePanel

package/dist/runtime/components/renderers/gallery/AGalleryItemCard.d.vue.ts

@@ -0,0 +1,40 @@
+import type { TreeEntry } from '../../../composables/useChildTree.js';
+type __VLS_Props = {
+    item: TreeEntry;
+    galleryAspect: string;
+    cardStyle: string;
+    showLabels: boolean;
+    isDragging: boolean;
+    isDragOver: boolean;
+    focusers: Array<{
+        clientId: number;
+        user?: {
+            name?: string;
+            color?: string;
+        };
+    }>;
+    canWrite: boolean;
+    renameId: string | null;
+    renameValue: string;
+};
+declare var __VLS_62: {};
+type __VLS_Slots = {} & {
+    actions?: (props: typeof __VLS_62) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "commit-rename": () => any;
+    "cancel-rename": () => any;
+    "update:rename-value": (value: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onCommit-rename"?: (() => any) | undefined;
+    "onCancel-rename"?: (() => any) | undefined;
+    "onUpdate:rename-value"?: ((value: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};