🎨 https://github.com/siyuan-note/siyuan/issues/11569

app/src/config/image.ts

@@ -11,6 +11,8 @@ import * as path from "path";
 import {openBy} from "../editor/util";
 import {renderAssetsPreview} from "../asset/renderAssets";
 import {writeText} from "../protyle/util/compatibility";
+import {Constants} from "../constants";
+import {avRender} from "../protyle/render/av/render";
 
 export const image = {
     element: undefined as Element,
@@ -63,7 +65,7 @@ export const image = {
             <ul class="b3-list b3-list--background config-assets__list">
                 <li class="fn__loading"><img src="/stage/loading-pure.svg"></li>
             </ul>
-            <div class="config-assets__preview"></div>
+            <div class="config-assets__preview" style="display: block;padding: 8px;"></div>
         </div>
         <div class="fn__none config-assets${isM ? " b3-list--mobile" : ""}" data-type="missing">
             <div class="fn__hr"></div>
@@ -96,6 +98,9 @@ export const image = {
                             assetsListElement.nextElementSibling.innerHTML = "";
                         });
                     }, undefined, true);
+                    event.preventDefault();
+                    event.stopPropagation();
+                    break;
                 } else if (target.id === "removeAVAll") {
                     confirmDialog(window.siyuan.languages.deleteOpConfirm, `${window.siyuan.languages.clearAll}`, () => {
                         fetchPost("/api/av/removeUnusedAttributeViews", {}, () => {
@@ -103,6 +108,9 @@ export const image = {
                             avListElement.nextElementSibling.innerHTML = "";
                         });
                     }, undefined, true);
+                    event.preventDefault();
+                    event.stopPropagation();
+                    break;
                 } else if (target.classList.contains("item") && !target.classList.contains("item--focus")) {
                     image.element.querySelector(".layout-tab-bar .item--focus").classList.remove("item--focus");
                     target.classList.add("item--focus");
@@ -128,16 +136,28 @@ export const image = {
                     event.preventDefault();
                     event.stopPropagation();
                     break;
+                } else if (target.getAttribute("data-tab-type") === "unRefAV") {
+                    avListElement.nextElementSibling.innerHTML = `<div data-node-id="${Lute.NewNodeID()}" data-av-id="${target.querySelector(".b3-list-item__text").textContent}" data-type="NodeAttributeView" data-av-type="table"><div spellcheck="true"></div><div class="protyle-attr" contenteditable="false">${Constants.ZWSP}</div></div>`;
+                    avRender(avListElement.nextElementSibling.firstElementChild, null);
+                    event.preventDefault();
+                    event.stopPropagation();
+                    break;
                 } else if (type === "copy") {
                     if (target.parentElement.getAttribute("data-tab-type") === "unRefAV") {
                         writeText(`<div data-node-id="${Lute.NewNodeID()}" data-av-id="${target.previousElementSibling.textContent}" data-type="NodeAttributeView" data-av-type="table"></div>`);
                     } else {
                         writeText(target.parentElement.querySelector(".b3-list-item__text").textContent.trim().replace("assets/", ""));
                     }
+                    event.preventDefault();
+                    event.stopPropagation();
+                    break;
                 } else if (type === "open") {
                     /// #if !BROWSER
                     openBy(target.parentElement.getAttribute("data-path"), "folder");
                     /// #endif
+                    event.preventDefault();
+                    event.stopPropagation();
+                    break;
                 } else if (type === "clear") {
                     const pathString = target.parentElement.getAttribute("data-path");
                     confirmDialog(window.siyuan.languages.deleteOpConfirm, `${window.siyuan.languages.delete} <b>${pathPosix().basename(pathString)}</b>`, () => {

app/src/protyle/render/av/render.ts

@@ -270,7 +270,7 @@ const renderGroupTable = (options: ITableOptions) => {
     });
     if (options.renderAll) {
         options.blockElement.firstElementChild.outerHTML = `<div class="av__container">
-    ${genTabHeaderHTML(options.data, isSearching || !!query, !options.protyle.disabled && !hasClosestByAttribute(options.blockElement, "data-type", "NodeBlockQueryEmbed"))}
+    ${genTabHeaderHTML(options.data, isSearching || !!query, options.protyle ? (!options.protyle.disabled && !hasClosestByAttribute(options.blockElement, "data-type", "NodeBlockQueryEmbed")) : false)}
     <div class="av__scroll">
         ${avBodyHTML}
     </div>
@@ -290,13 +290,13 @@ const afterRenderTable = (options: ITableOptions) => {
     options.blockElement.setAttribute("data-render", "true");
     options.blockElement.querySelector(".av__scroll").scrollLeft = options.resetData.left;
     options.blockElement.style.alignSelf = options.resetData.alignSelf;
-    const editRect = options.protyle.contentElement.getBoundingClientRect();
+    const editRect = options.protyle ? options.protyle.contentElement.getBoundingClientRect() : null;
     if (options.resetData.headerTransform) {
         const headerTransformElement = options.blockElement.querySelector(`.av__body[data-group-id="${options.resetData.headerTransform.groupId}"] .av__row--header`) as HTMLElement;
         if (headerTransformElement) {
             headerTransformElement.style.transform = options.resetData.headerTransform.transform;
         }
-    } else {
+    } else if (editRect) {
         // 需等待渲染完，否则 getBoundingClientRect 错误 https://github.com/siyuan-note/siyuan/issues/13787
         setTimeout(() => {
             stickyRow(options.blockElement, editRect, "top");
@@ -307,7 +307,7 @@ const afterRenderTable = (options: ITableOptions) => {
         if (footerTransformElement) {
             footerTransformElement.style.transform = options.resetData.footerTransform.transform;
         }
-    } else {
+    } else if (editRect) {
         // 需等待渲染完，否则 getBoundingClientRect 错误 https://github.com/siyuan-note/siyuan/issues/13787
         setTimeout(() => {
             stickyRow(options.blockElement, editRect, "bottom");
@@ -549,11 +549,11 @@ export const avRender = async (element: Element, protyle: IProtyle, cb?: (data:
             });
             e.firstElementChild.innerHTML = html;
         }
-        const created = protyle.options.history?.created;
-        const snapshot = protyle.options.history?.snapshot;
         const avPageSize = getPageSize(e);
         let data: IAV;
         if (!avData) {
+            const created = protyle ? protyle.options.history?.created : false;
+            const snapshot = protyle ? protyle.options.history?.snapshot : false;
             const response = await fetchSyncPost(created ? "/api/av/renderHistoryAttributeView" : (snapshot ? "/api/av/renderSnapshotAttributeView" : "/api/av/renderAttributeView"), {
                 id: e.getAttribute("data-av-id"),
                 created,
@@ -588,7 +588,7 @@ export const avRender = async (element: Element, protyle: IProtyle, cb?: (data:
 </div>`;
         if (renderAll) {
             e.firstElementChild.outerHTML = `<div class="av__container">
-    ${genTabHeaderHTML(data, resetData.isSearching || !!resetData.query, !protyle.disabled && !hasClosestByAttribute(e, "data-type", "NodeBlockQueryEmbed"))}
+    ${genTabHeaderHTML(data, resetData.isSearching || !!resetData.query, protyle ? (!protyle.disabled && !hasClosestByAttribute(e, "data-type", "NodeBlockQueryEmbed")) : false)}
     <div class="av__scroll">
         ${avBodyHTML}
     </div>