@oneflowui/ui 0.5.9 → 0.7.0

package/dist/components/database/DatabaseView.vue2.js

@@ -1,39 +1,39 @@
-import { defineComponent as Tt, ref as B, onMounted as Rt, onBeforeUnmount as Dt, computed as n, watch as F, openBlock as c, createElementBlock as w, mergeProps as Lt, createVNode as ae, unref as ie, createElementVNode as u, Fragment as le, createBlock as S, createCommentVNode as oe, withCtx as Et, toDisplayString as x, renderList as Ie } from "vue";
-import { Loader2 as Bt, AlertCircle as At, Database as Nt } from "lucide-vue-next";
-import Se from "../base/EmptyState.vue.js";
-import xt from "../table/FieldCell.vue.js";
-import Ut from "../table/DetailSheet.vue.js";
+import { defineComponent as Dt, ref as B, onMounted as Lt, onBeforeUnmount as Et, computed as s, watch as T, openBlock as c, createElementBlock as m, mergeProps as At, createVNode as W, unref as ie, createElementVNode as u, Fragment as le, createBlock as V, createCommentVNode as Te, withCtx as F, renderList as Re, toDisplayString as y } from "vue";
+import { Loader2 as Bt, AlertCircle as xt, Database as Nt } from "lucide-vue-next";
+import De from "../base/EmptyState.vue.js";
+import Le from "../table/FieldCell.vue.js";
+import Ee from "../detail/DetailLayout.vue.js";
+import Ut from "../overlay/Drawer.vue.js";
 import Kt from "../overlay/SidePanel.vue.js";
 import qt from "../table/TableToolbar.vue.js";
-import Gt from "../table/DataTable.vue.js";
-import Mt from "../kanban/KanbanBoard.vue.js";
-import Pt from "../gallery/GalleryView.vue.js";
-import Wt from "../timeline/GanttTimeline.vue.js";
-import { useMarkdown as Ot } from "../../composables/useMarkdown.js";
-import { useDatabaseView as $t } from "../../composables/useDatabaseView.js";
-import { buildGanttItems as zt } from "../../types/index.js";
-const jt = {
+import Wt from "../table/DataTable.vue.js";
+import $t from "../kanban/KanbanBoard.vue.js";
+import Gt from "../gallery/GalleryView.vue.js";
+import Pt from "../timeline/GanttTimeline.vue.js";
+import { useDatabaseView as jt } from "../../composables/useDatabaseView.js";
+import { buildGanttItems as Ot } from "../../types/index.js";
+const zt = {
   key: 0,
   class: "of-database-view__state of-database-view__state--loading",
   "data-role": "loading-state"
-}, Ht = {
+}, Mt = {
   key: 1,
   class: "of-database-view__state",
   "data-role": "error-state"
-}, Jt = {
+}, Ht = {
   key: 1,
   class: "of-database-view__state of-database-view__state--empty",
   "data-role": "empty-state"
-}, Xt = ["data-view"], Yt = {
+}, Jt = ["data-view"], Xt = {
   key: 4,
   class: "of-database-view__detail-anchor"
-}, Zt = ["data-record-id"], Qt = { class: "of-database-view__detail-workspace-header" }, ea = { class: "of-database-view__detail-workspace-heading" }, ta = { class: "of-database-view__detail-workspace-title" }, aa = { class: "of-database-view__detail-workspace-meta" }, ia = { class: "of-database-view__detail-workspace-id" }, la = { class: "of-database-view__detail-workspace-body" }, oa = { class: "of-database-view__detail-workspace-properties" }, ra = { class: "of-database-view__detail-workspace-label" }, na = { class: "of-database-view__detail-workspace-value" }, sa = {
+}, Yt = { class: "of-database-view__workspace-chip" }, Zt = { class: "of-database-view__workspace-chip" }, Qt = { class: "of-database-view__workspace-chip" }, ea = ["data-record-id"], ta = { class: "of-database-view__detail-workspace-properties" }, aa = { class: "of-database-view__detail-workspace-label" }, ia = { class: "of-database-view__detail-workspace-value" }, la = {
   key: 1,
   class: "of-database-view__detail-workspace-fallback"
-}, da = {
-  key: 0,
-  class: "of-database-view__detail-workspace-content"
-}, ua = { class: "of-database-view__detail-workspace-content-label" }, ca = ["innerHTML"], va = { class: "of-database-view__detail-workspace-footer" }, fa = ["disabled"], k = "detail", wa = "(max-width: 768px)", Ra = /* @__PURE__ */ Tt({
+}, oa = ["disabled"], sa = { class: "of-database-view__workspace-chip" }, ra = { class: "of-database-view__workspace-chip" }, na = { class: "of-database-view__workspace-chip" }, da = ["data-record-id"], ua = { class: "of-database-view__detail-workspace-properties" }, ca = { class: "of-database-view__detail-workspace-label" }, va = { class: "of-database-view__detail-workspace-value" }, fa = {
+  key: 1,
+  class: "of-database-view__detail-workspace-fallback"
+}, wa = ["disabled"], k = "detail", pa = "(max-width: 768px)", Da = /* @__PURE__ */ Dt({
   name: "DatabaseView",
   inheritAttrs: !1,
   __name: "DatabaseView",
@@ -69,36 +69,36 @@ const jt = {
     autoLoad: { type: Boolean, default: !0 }
   },
   emits: ["update:currentViewId", "update:selectedRecordId", "update:searchKeyword", "update:columns", "update:filterLogic", "update:records", "cell-edit", "select-record", "schema-add-field", "schema-rename-field", "schema-change-field-type", "schema-hide-field", "schema-delete-field", "schema-duplicate-field", "row-click", "card-click", "add", "add-column", "record-change", "load-view", "save-view", "sort", "group", "refresh"],
-  setup(T, { emit: Fe }) {
-    var ge, Ce;
-    const l = T, d = Fe, { renderMarkdown: Te } = Ot({ showCopyButton: !0 }), re = B(!1);
+  setup(S, { emit: Ae }) {
+    var Fe, Se;
+    const o = S, d = Ae, oe = B(!1);
     let g = null;
-    function O() {
-      re.value = (g == null ? void 0 : g.matches) ?? !1;
+    function J() {
+      oe.value = (g == null ? void 0 : g.matches) ?? !1;
     }
-    Rt(() => {
-      typeof window > "u" || typeof window.matchMedia != "function" || (g = window.matchMedia(wa), O(), g.addEventListener("change", O));
-    }), Dt(() => {
-      g == null || g.removeEventListener("change", O), g = null;
+    Lt(() => {
+      typeof window > "u" || typeof window.matchMedia != "function" || (g = window.matchMedia(pa), J(), g.addEventListener("change", J));
+    }), Et(() => {
+      g == null || g.removeEventListener("change", J), g = null;
     });
-    function ne(e) {
-      var t, a, i, o;
+    function se(e) {
+      var t, a, i, l;
       return {
         ...e,
         visibleFields: [...e.visibleFields],
         sorts: (t = e.sorts) == null ? void 0 : t.map((r) => ({ ...r })),
         groups: (a = e.groups) == null ? void 0 : a.map((r) => ({ ...r })),
         filters: (i = e.filters) == null ? void 0 : i.map((r) => ({ ...r })),
-        aggregations: (o = e.aggregations) == null ? void 0 : o.map((r) => ({ ...r })),
+        aggregations: (l = e.aggregations) == null ? void 0 : l.map((r) => ({ ...r })),
         fixedColumns: e.fixedColumns ? [...e.fixedColumns] : void 0,
         galleryCardFields: e.galleryCardFields ? [...e.galleryCardFields] : void 0
       };
     }
-    function Re(e) {
+    function Be(e) {
       const t = e[0];
       return t ? Object.keys(t.fields) : [];
     }
-    function se(e) {
+    function re(e) {
       switch (e) {
         case "kanban":
           return "columns-3";
@@ -113,8 +113,8 @@ const jt = {
           return "table-2";
       }
     }
-    function De(e, t = []) {
-      const a = R(e, t);
+    function xe(e, t = []) {
+      const a = D(e, t);
       return {
         viewId: "table",
         viewType: "table",
@@ -126,8 +126,8 @@ const jt = {
         fixedColumns: []
       };
     }
-    function Le(e, t = []) {
-      const a = R(e, t);
+    function Ne(e, t = []) {
+      const a = D(e, t);
       return {
         viewId: k,
         viewType: "detail",
@@ -139,11 +139,11 @@ const jt = {
         fixedColumns: []
       };
     }
-    function $(e, t) {
+    function X(e, t) {
       var a;
       return ((a = t == null ? void 0 : t.fields.find((i) => i.id === e)) == null ? void 0 : a.name) ?? e;
     }
-    function de(e) {
+    function ne(e) {
       switch (e == null ? void 0 : e.type) {
         case "number":
         case "currency":
@@ -159,7 +159,7 @@ const jt = {
           return "string";
       }
     }
-    function Ee(e) {
+    function Ue(e) {
       switch (e == null ? void 0 : e.type) {
         case "number":
           return "number";
@@ -202,79 +202,79 @@ const jt = {
           return "text";
       }
     }
-    function Be(e, t, a = []) {
-      var o;
-      return ((((o = e.visibleFields) == null ? void 0 : o.length) ?? 0) > 0 ? e.visibleFields : R(t, a)).map((r) => {
-        var I;
-        const v = (I = t == null ? void 0 : t.fields) == null ? void 0 : I.find((p) => p.id === r);
+    function Ke(e, t, a = []) {
+      var l;
+      return ((((l = e.visibleFields) == null ? void 0 : l.length) ?? 0) > 0 ? e.visibleFields : D(t, a)).map((r) => {
+        var q;
+        const v = (q = t == null ? void 0 : t.fields) == null ? void 0 : q.find((Rt) => Rt.id === r);
         return {
           key: r,
-          label: $(r, t),
-          type: de(v),
+          label: X(r, t),
+          type: ne(v),
           hidden: (v == null ? void 0 : v.hidden) ?? !1,
           width: v == null ? void 0 : v.width
         };
       });
     }
-    function Ae(e, t = []) {
-      return R(e, t).map((i) => {
+    function qe(e, t = []) {
+      return D(e, t).map((i) => {
         var r;
-        const o = (r = e == null ? void 0 : e.fields) == null ? void 0 : r.find((v) => v.id === i);
+        const l = (r = e == null ? void 0 : e.fields) == null ? void 0 : r.find((v) => v.id === i);
         return {
           key: i,
-          label: $(i, e),
-          type: de(o),
-          hidden: (o == null ? void 0 : o.hidden) ?? !1,
-          width: o == null ? void 0 : o.width
+          label: X(i, e),
+          type: ne(l),
+          hidden: (l == null ? void 0 : l.hidden) ?? !1,
+          width: l == null ? void 0 : l.width
         };
       });
     }
-    function Ne(e, t = []) {
-      return R(e, t).map((i) => {
+    function We(e, t = []) {
+      return D(e, t).map((i) => {
         var r;
-        const o = (r = e == null ? void 0 : e.fields) == null ? void 0 : r.find((v) => v.id === i);
+        const l = (r = e == null ? void 0 : e.fields) == null ? void 0 : r.find((v) => v.id === i);
         return {
           id: i,
-          type: Ee(o),
-          label: $(i, e)
+          type: Ue(l),
+          label: X(i, e)
         };
       });
     }
-    function U(e) {
+    function R(e) {
       return e == null ? "" : Array.isArray(e) ? e.map((t) => String(t)).join(", ") : String(e);
     }
-    function A(e, t) {
+    function x(e, t) {
       if (e == null && t == null) return 0;
       if (e == null) return -1;
       if (t == null) return 1;
-      const a = Number(e), i = Number(t), o = Number.isFinite(a) && `${e}`.trim() !== "", r = Number.isFinite(i) && `${t}`.trim() !== "";
-      if (o && r) return a - i;
-      const v = Date.parse(String(e)), I = Date.parse(String(t));
-      return Number.isFinite(v) && Number.isFinite(I) ? v - I : U(e).localeCompare(U(t), "zh-Hans-CN");
+      const a = Number(e), i = Number(t), l = Number.isFinite(a) && `${e}`.trim() !== "", r = Number.isFinite(i) && `${t}`.trim() !== "";
+      if (l && r) return a - i;
+      const v = Date.parse(String(e)), q = Date.parse(String(t));
+      return Number.isFinite(v) && Number.isFinite(q) ? v - q : R(e).localeCompare(R(t), "zh-Hans-CN");
     }
-    function xe(e, t) {
-      const a = U(e).trim(), i = (t.value ?? "").trim(), o = a.toLowerCase(), r = i.toLowerCase();
+    function $e(e, t) {
+      const a = R(e).trim(), i = (t.value ?? "").trim(), l = a.toLowerCase(), r = i.toLowerCase();
       switch (t.operator) {
         case "equals":
-          return o === r;
+          return l === r;
         case "not_equals":
-          return o !== r;
+          return l !== r;
         case "contains":
-          return o.includes(r);
+          return l.includes(r);
         case "not_contains":
-          return !o.includes(r);
+          return !l.includes(r);
         case "starts_with":
-          return o.startsWith(r);
+          return l.startsWith(r);
         case "ends_with":
-          return o.endsWith(r);
+          return l.endsWith(r);
         case "gt":
-          return A(e, i) > 0;
+          return x(e, i) > 0;
         case "gte":
-          return A(e, i) >= 0;
+          return x(e, i) >= 0;
         case "lt":
-          return A(e, i) < 0;
+          return x(e, i) < 0;
         case "lte":
-          return A(e, i) <= 0;
+          return x(e, i) <= 0;
         case "is_empty":
           return a === "";
         case "is_not_empty":
@@ -283,7 +283,7 @@ const jt = {
           return !0;
       }
     }
-    function Ue(e) {
+    function Ge(e) {
       return {
         id: `f_${Math.random().toString(36).slice(2, 8)}`,
         field: e,
@@ -291,7 +291,7 @@ const jt = {
         value: ""
       };
     }
-    function Ke(e = []) {
+    function Pe(e = []) {
       return e.map((t, a) => ({
         id: `f_${t.fieldId}_${a}`,
         field: t.fieldId,
@@ -317,7 +317,7 @@ const jt = {
         value: t.value == null ? "" : String(t.value)
       }));
     }
-    function qe(e) {
+    function je(e) {
       return e.filter((t) => t.field).map((t) => {
         let a;
         switch (t.operator) {
@@ -356,48 +356,48 @@ const jt = {
         };
       });
     }
-    function R(e, t = []) {
+    function D(e, t = []) {
       var i;
-      const a = (i = e == null ? void 0 : e.fields) == null ? void 0 : i.filter((o) => !o.hidden).map((o) => o.id);
-      return a != null && a.length ? a : Re(t);
+      const a = (i = e == null ? void 0 : e.fields) == null ? void 0 : i.filter((l) => !l.hidden).map((l) => l.id);
+      return a != null && a.length ? a : Be(t);
     }
-    function Ge(e) {
+    function Oe(e) {
       return e ? {
         id: e.id,
         ...e.fields
       } : { id: "__detail-empty__" };
     }
-    function Me(e) {
+    function ze(e) {
       if (e)
         return {
           label: "返回列表",
-          onClick: () => he(e)
+          onClick: () => _e(e)
         };
     }
-    const ue = n(() => l.schema ?? null), Pe = n(() => l.records ?? []), ce = n(() => {
-      var i, o;
-      const e = (l.views ?? []).map((r) => ne(r)), t = e.some((r) => r.viewType === "table") || (((i = l.schema) == null ? void 0 : i.views) ?? []).some((r) => r.viewType === "table"), a = e.some((r) => r.viewType === "detail") || (((o = l.schema) == null ? void 0 : o.views) ?? []).some((r) => r.viewType === "detail");
-      return t || e.unshift(De(l.schema, l.records ?? [])), a || e.push(Le(l.schema, l.records ?? [])), e;
-    }), s = $t({
-      tableId: l.tableId,
-      mode: l.mode,
-      schema: ue,
-      records: Pe,
-      views: ce,
-      provider: l.provider,
-      defaultView: l.defaultView,
-      initialViewId: l.currentViewId || l.initialViewId || ((ge = l.defaultView) == null ? void 0 : ge.viewId) || ((Ce = ce.value[0]) == null ? void 0 : Ce.viewId) || "",
-      initialSelectedRecordId: l.selectedRecordId ?? l.initialSelectedRecordId,
-      pageSize: l.pageSize,
-      autoLoad: l.autoLoad,
+    const de = s(() => o.schema ?? null), Me = s(() => o.records ?? []), ue = s(() => {
+      var i, l;
+      const e = (o.views ?? []).map((r) => se(r)), t = e.some((r) => r.viewType === "table") || (((i = o.schema) == null ? void 0 : i.views) ?? []).some((r) => r.viewType === "table"), a = e.some((r) => r.viewType === "detail") || (((l = o.schema) == null ? void 0 : l.views) ?? []).some((r) => r.viewType === "detail");
+      return t || e.unshift(xe(o.schema, o.records ?? [])), a || e.push(Ne(o.schema, o.records ?? [])), e;
+    }), n = jt({
+      tableId: o.tableId,
+      mode: o.mode,
+      schema: de,
+      records: Me,
+      views: ue,
+      provider: o.provider,
+      defaultView: o.defaultView,
+      initialViewId: o.currentViewId || o.initialViewId || ((Fe = o.defaultView) == null ? void 0 : Fe.viewId) || ((Se = ue.value[0]) == null ? void 0 : Se.viewId) || "",
+      initialSelectedRecordId: o.selectedRecordId ?? o.initialSelectedRecordId,
+      pageSize: o.pageSize,
+      autoLoad: o.autoLoad,
       actions: {
         onCellEdit: async (e) => {
           var t, a;
-          d("cell-edit", e), await ((a = (t = l.actions) == null ? void 0 : t.onCellEdit) == null ? void 0 : a.call(t, e));
+          d("cell-edit", e), await ((a = (t = o.actions) == null ? void 0 : t.onCellEdit) == null ? void 0 : a.call(t, e));
         },
         onSelectRecord: async (e) => {
           var t, a;
-          await ((a = (t = l.actions) == null ? void 0 : t.onSelectRecord) == null ? void 0 : a.call(t, e));
+          await ((a = (t = o.actions) == null ? void 0 : t.onSelectRecord) == null ? void 0 : a.call(t, e));
         },
         onSchemaEvent: async (e) => {
           var t, a;
@@ -421,499 +421,569 @@ const jt = {
               d("schema-duplicate-field", e.fieldId);
               break;
           }
-          await ((a = (t = l.actions) == null ? void 0 : t.onSchemaEvent) == null ? void 0 : a.call(t, e));
+          await ((a = (t = o.actions) == null ? void 0 : t.onSchemaEvent) == null ? void 0 : a.call(t, e));
         },
         onSaveView: async (e) => {
           var t, a;
-          d("save-view", e.name), await ((a = (t = l.actions) == null ? void 0 : t.onViewSave) == null ? void 0 : a.call(t, { tableId: l.tableId, viewId: e.viewId, name: e.name }));
+          d("save-view", e.name), await ((a = (t = o.actions) == null ? void 0 : t.onViewSave) == null ? void 0 : a.call(t, { tableId: o.tableId, viewId: e.viewId, name: e.name }));
         },
         onRefresh: async () => {
           var e, t;
-          d("refresh"), await ((t = (e = l.actions) == null ? void 0 : e.onRefresh) == null ? void 0 : t.call(e));
+          d("refresh"), await ((t = (e = o.actions) == null ? void 0 : e.onRefresh) == null ? void 0 : t.call(e));
         }
       }
-    }), b = n(() => s.activeView.value), z = n(() => s.activeViewId.value), h = n(() => s.selectedRecord.value), We = n(() => s.selectedRecordId.value), V = n(() => s.schema.value ?? ue.value), C = n(() => [...s.records.value]), m = n(() => b.value.viewType || "table"), f = B({}), D = B(l.searchKeyword ?? ""), j = B("and"), y = B([]), _ = B(
-      l.currentViewId === k || l.initialViewId === k || l.selectedRecordId != null || l.initialSelectedRecordId != null
+    }), b = s(() => n.activeView.value), Y = s(() => n.activeViewId.value), f = s(() => n.selectedRecord.value), He = s(() => n.selectedRecordId.value), I = s(() => n.schema.value ?? de.value), C = s(() => [...n.records.value]), w = s(() => b.value.viewType || "table"), p = B({}), L = B(o.searchKeyword ?? ""), Z = B("and"), h = B([]), _ = B(
+      o.currentViewId === k || o.initialViewId === k || o.selectedRecordId != null || o.initialSelectedRecordId != null
     );
-    F(
-      () => l.searchKeyword,
+    T(
+      () => o.searchKeyword,
       (e) => {
-        D.value = e ?? "";
+        L.value = e ?? "";
       },
       { immediate: !0 }
-    ), F(D, (e) => {
+    ), T(L, (e) => {
       d("update:searchKeyword", e);
-    }), F(
+    }), T(
       b,
       (e) => {
-        y.value = Ke(e.filters ?? []);
+        h.value = Pe(e.filters ?? []);
       },
       { immediate: !0 }
-    ), F(
-      () => l.currentViewId,
+    ), T(
+      () => o.currentViewId,
       (e) => {
-        !e || e === z.value || (s.setActiveViewId(e), e === k && (_.value = !0));
+        !e || e === Y.value || (n.setActiveViewId(e), e === k && (_.value = !0));
       },
       { immediate: !0 }
-    ), F(
-      () => l.selectedRecordId,
+    ), T(
+      () => o.selectedRecordId,
       (e) => {
         if (e !== void 0) {
           if (!e) {
-            _.value = !1, f.value = {}, s.clearSelectedRecord();
+            _.value = !1, p.value = {}, n.clearSelectedRecord();
             return;
           }
-          _.value = !0, f.value = {}, s.setSelectedRecord(e);
+          _.value = !0, p.value = {}, n.setSelectedRecord(e);
         }
       },
       { immediate: !0 }
-    ), F(
-      z,
+    ), T(
+      Y,
       (e, t) => {
         var a, i;
-        d("update:currentViewId", e), e === k && (_.value = !0), t !== void 0 && e !== t && ((i = (a = l.actions) == null ? void 0 : a.onViewChange) == null || i.call(a, { tableId: l.tableId, view: ne(b.value) }));
+        d("update:currentViewId", e), e === k && (_.value = !0), t !== void 0 && e !== t && ((i = (a = o.actions) == null ? void 0 : a.onViewChange) == null || i.call(a, { tableId: o.tableId, view: se(b.value) }));
       },
       { immediate: !0 }
-    ), F(
-      We,
+    ), T(
+      He,
       (e, t) => {
-        d("update:selectedRecordId", e), t !== void 0 && e !== t && d("select-record", h.value ?? null);
+        d("update:selectedRecordId", e), t !== void 0 && e !== t && d("select-record", f.value ?? null);
       },
       { immediate: !0 }
     );
-    const H = n(() => {
-      const e = l.viewTabs && l.viewTabs.length > 0 ? l.viewTabs.map((i) => ({ ...i })) : s.viewList.value.map((i) => ({
+    const Q = s(() => {
+      const e = o.viewTabs && o.viewTabs.length > 0 ? o.viewTabs.map((i) => ({ ...i })) : n.viewList.value.map((i) => ({
         value: i.id,
         label: i.name,
-        icon: se(i.type)
+        icon: re(i.type)
       })), t = [], a = /* @__PURE__ */ new Set();
       for (const i of e)
         a.has(i.value) || (a.add(i.value), t.push(i));
-      return a.has(k) || t.push({ value: k, label: "详情", icon: se("detail") }), t;
-    }), Oe = n(
-      () => s.viewList.value.map((e) => ({
+      return a.has(k) || t.push({ value: k, label: "详情", icon: re("detail") }), t;
+    }), Je = s(
+      () => n.viewList.value.map((e) => ({
         id: e.id,
         name: e.name
       }))
-    ), J = n(() => Be(b.value, V.value, C.value)), X = n(() => Ae(V.value, C.value)), K = n(() => Ne(V.value, C.value)), Y = n(() => Ge(h.value)), ve = n(() => ({
-      ...Y.value,
-      ...f.value
-    })), fe = n(
-      () => new Set(K.value.filter((e) => e.type === "richtext").map((e) => e.id))
-    ), $e = n(
-      () => X.value.filter((e) => !fe.value.has(e.key))
-    ), we = n(
-      () => X.value.filter((e) => fe.value.has(e.key))
-    ), ze = n(() => Object.keys(f.value).length > 0), je = n(() => R(V.value, C.value)), me = n(() => {
+    ), ee = s(() => Ke(b.value, I.value, C.value)), ce = s(() => qe(I.value, C.value)), $ = s(() => We(I.value, C.value)), ve = s(() => Oe(f.value)), G = s(() => ({
+      ...ve.value,
+      ...p.value
+    })), P = s(
+      () => {
+        var e, t, a, i, l, r, v;
+        return R(
+          ((t = (e = f.value) == null ? void 0 : e.fields) == null ? void 0 : t.title) ?? ((i = (a = f.value) == null ? void 0 : a.fields) == null ? void 0 : i.name) ?? ((r = (l = f.value) == null ? void 0 : l.fields) == null ? void 0 : r.subject) ?? ((v = f.value) == null ? void 0 : v.id) ?? "记录详情"
+        ) || "记录详情";
+      }
+    ), fe = s(
+      () => new Set($.value.filter((e) => e.type === "richtext").map((e) => e.id))
+    ), we = s(
+      () => ce.value.filter((e) => !fe.value.has(e.key))
+    ), Xe = s(
+      () => ce.value.filter((e) => fe.value.has(e.key))
+    ), pe = s(() => Xe.value.map((t) => {
+      const a = K(t.key), i = R(a).trim();
+      return i ? `## ${t.label}
+
+${i}` : "";
+    }).filter((t) => t.length > 0).join(`
+
+`)), me = s(() => Object.keys(p.value).length > 0), Ye = s(() => D(I.value, C.value)), be = s(() => {
       var t;
       const e = (t = b.value.sorts) == null ? void 0 : t[0];
       return {
         field: (e == null ? void 0 : e.fieldId) ?? null,
         order: (e == null ? void 0 : e.direction) ?? null
       };
-    }), He = n(() => {
+    }), Ze = s(() => {
       var e, t;
       return ((t = (e = b.value.groups) == null ? void 0 : e[0]) == null ? void 0 : t.fieldId) ?? void 0;
-    }), q = n(() => y.value), Je = n(() => q.value.length > 0), Xe = n(() => l.showToolbar !== !1), Ye = n(() => l.showViewSwitch !== !1 && H.value.length > 1), Ze = n(() => l.showFilter !== !1), Qe = n(() => l.showSort !== !1), et = n(() => l.showGroup !== !1), tt = n(() => l.showColumns !== !1), at = n(() => l.showSearch !== !1), N = n(() => _.value && !!h.value), pe = n(() => l.detailPresentation !== "auto" ? l.detailPresentation : re.value ? "sheet" : "side-panel"), it = n(() => l.loading ?? s.loading.value), G = n(() => l.error ?? s.error.value), L = n(() => {
+    }), j = s(() => h.value), Qe = s(() => j.value.length > 0), et = s(() => o.showToolbar !== !1), tt = s(() => o.showViewSwitch !== !1 && Q.value.length > 1), at = s(() => o.showFilter !== !1), it = s(() => o.showSort !== !1), lt = s(() => o.showGroup !== !1), ot = s(() => o.showColumns !== !1), st = s(() => o.showSearch !== !1), N = s(() => _.value && !!f.value), O = s(() => o.detailPresentation !== "auto" ? o.detailPresentation : oe.value ? "sheet" : "side-panel"), rt = s(() => o.loading ?? n.loading.value), z = s(() => o.error ?? n.error.value), E = s(() => {
       let e = [...C.value];
-      if (D.value.trim()) {
-        const a = D.value.trim().toLowerCase();
+      if (L.value.trim()) {
+        const a = L.value.trim().toLowerCase();
         e = e.filter(
-          (i) => je.value.some(
-            (o) => U(i.fields[o]).toLowerCase().includes(a)
+          (i) => Ye.value.some(
+            (l) => R(i.fields[l]).toLowerCase().includes(a)
           )
         );
       }
-      q.value.length > 0 && (e = e.filter((a) => {
-        const i = q.value.map((o) => {
-          const r = a.fields[o.field];
-          return xe(r, o);
+      j.value.length > 0 && (e = e.filter((a) => {
+        const i = j.value.map((l) => {
+          const r = a.fields[l.field];
+          return $e(r, l);
         });
-        return j.value === "and" ? i.every(Boolean) : i.some(Boolean);
+        return Z.value === "and" ? i.every(Boolean) : i.some(Boolean);
       }));
-      const t = me.value;
+      const t = be.value;
       return t.field && t.order && e.sort((a, i) => {
-        const o = A(
+        const l = x(
           a.fields[t.field],
           i.fields[t.field]
         );
-        return t.order === "desc" ? -o : o;
+        return t.order === "desc" ? -l : l;
       }), e;
-    }), lt = n(
-      () => zt(L.value, {
-        startFieldId: m.value === "timeline" ? "startDate" : void 0,
-        endFieldId: m.value === "timeline" ? "endDate" : void 0,
+    }), nt = s(
+      () => Ot(E.value, {
+        startFieldId: w.value === "timeline" ? "startDate" : void 0,
+        endFieldId: w.value === "timeline" ? "endDate" : void 0,
         labelFieldId: "title"
       })
-    ), Z = n(() => it.value ? "loading" : G.value ? "error" : m.value === "detail" ? N.value ? "normal" : "empty" : m.value === "timeline" ? lt.value.length > 0 ? "normal" : "empty" : L.value.length > 0 ? "normal" : "empty"), ot = n(() => {
+    ), te = s(() => rt.value ? "loading" : z.value ? "error" : w.value === "detail" ? N.value ? "normal" : "empty" : w.value === "timeline" ? nt.value.length > 0 ? "normal" : "empty" : E.value.length > 0 ? "normal" : "empty"), dt = s(() => {
       var a;
-      if (m.value !== "detail") return;
+      if (w.value !== "detail") return;
       const e = C.value[0];
       if (e)
         return {
           label: "打开第一条记录",
           onClick: () => M(e)
         };
-      const t = ((a = H.value.find((i) => i.value !== k)) == null ? void 0 : a.value) ?? null;
-      return Me(t);
+      const t = ((a = Q.value.find((i) => i.value !== k)) == null ? void 0 : a.value) ?? null;
+      return ze(t);
     });
-    function Q(e) {
-      s.setRecords(e), d("update:records", e);
+    function ae(e) {
+      n.setRecords(e), d("update:records", e);
     }
     function M(e) {
-      e && (_.value = !0, f.value = {}, s.setSelectedRecord(e));
+      e && (_.value = !0, p.value = {}, n.setSelectedRecord(e));
     }
-    function be(e) {
+    function he(e) {
       return e ? C.value.find((t) => t.id === e) ?? null : null;
     }
-    function he(e) {
-      s.viewList.value.some((t) => t.id === e) && (e === k && (_.value = !0), s.switchView(e));
+    function _e(e) {
+      n.viewList.value.some((t) => t.id === e) && (e === k && (_.value = !0), n.switchView(e));
     }
-    function rt(e) {
-      he(e);
+    function ut(e) {
+      _e(e);
     }
-    function nt(e) {
+    function ct(e) {
       var t, a;
-      s.viewList.value.some((i) => i.id === e) && (e === k && (_.value = !0), s.switchView(e), d("load-view", e), (a = (t = l.actions) == null ? void 0 : t.onViewLoad) == null || a.call(t, { tableId: l.tableId, viewId: e }));
+      n.viewList.value.some((i) => i.id === e) && (e === k && (_.value = !0), n.switchView(e), d("load-view", e), (a = (t = o.actions) == null ? void 0 : t.onViewLoad) == null || a.call(t, { tableId: o.tableId, viewId: e }));
     }
-    function st(e) {
-      s.saveView({ name: e });
+    function vt(e) {
+      n.saveView({ name: e });
     }
-    function P() {
-      s.updateActiveView({
-        filters: qe(y.value)
+    function H() {
+      n.updateActiveView({
+        filters: je(h.value)
       });
     }
-    function dt() {
+    function ft() {
       var t;
-      const e = ((t = J.value.find((a) => !a.hidden)) == null ? void 0 : t.key) ?? "";
-      e && (y.value = [...y.value, Ue(e)], P());
+      const e = ((t = ee.value.find((a) => !a.hidden)) == null ? void 0 : t.key) ?? "";
+      e && (h.value = [...h.value, Ge(e)], H());
     }
-    function ut(e) {
-      y.value = y.value.filter((t) => t.id !== e), P();
+    function wt(e) {
+      h.value = h.value.filter((t) => t.id !== e), H();
     }
-    function ct(e, t) {
-      y.value = y.value.map(
+    function pt(e, t) {
+      h.value = h.value.map(
         (a) => a.id === e ? { ...a, ...t } : a
-      ), P();
+      ), H();
     }
-    function vt() {
-      y.value = [], P();
+    function mt() {
+      h.value = [], H();
     }
-    function ft(e) {
-      j.value = e, d("update:filterLogic", e);
+    function bt(e) {
+      Z.value = e, d("update:filterLogic", e);
     }
-    function wt(e) {
-      d("update:columns", e), s.updateActiveView({
+    function ht(e) {
+      d("update:columns", e), n.updateActiveView({
         visibleFields: e.filter((t) => !t.hidden).map((t) => t.key)
       });
     }
-    function mt(e) {
+    function _t(e) {
       var i;
       if (!e) {
-        s.updateActiveView({ sorts: [] }), d("sort", e);
+        n.updateActiveView({ sorts: [] }), d("sort", e);
         return;
       }
       const t = (i = b.value.sorts) == null ? void 0 : i[0], a = (t == null ? void 0 : t.fieldId) === e && t.direction === "asc" ? "desc" : "asc";
-      s.updateActiveView({
+      n.updateActiveView({
         sorts: [{ fieldId: e, direction: a }]
       }), d("sort", e);
     }
-    function pt(e) {
-      s.updateActiveView({
+    function yt(e) {
+      n.updateActiveView({
         groups: e ? [{ fieldId: e }] : []
       }), d("group", e);
     }
-    function bt(e) {
-      D.value = e, d("update:searchKeyword", e);
+    function kt(e) {
+      L.value = e, d("update:searchKeyword", e);
     }
-    function E(e) {
-      s.emitSchemaEvent(e);
+    function A(e) {
+      n.emitSchemaEvent(e);
     }
-    function ht(e, t, a) {
-      const i = C.value.map((o) => o.id !== e ? o : {
-        ...o,
+    function gt(e, t, a) {
+      const i = C.value.map((l) => l.id !== e ? l : {
+        ...l,
         fields: {
-          ...o.fields,
+          ...l.fields,
           [t]: a
         }
       });
-      Q(i);
+      ae(i);
     }
-    function ee(e) {
-      ht(e.rowId, e.fieldId, e.value), s.emitCellEdit(e);
+    function ye(e) {
+      gt(e.rowId, e.fieldId, e.value), n.emitCellEdit(e);
     }
-    function yt(e) {
+    function Ct(e) {
       var t, a;
-      d("record-change", e), (a = (t = l.actions) == null ? void 0 : t.onRecordChange) == null || a.call(t, { tableId: l.tableId, ...e });
+      d("record-change", e), (a = (t = o.actions) == null ? void 0 : t.onRecordChange) == null || a.call(t, { tableId: o.tableId, ...e });
     }
-    function _t(e) {
-      Q(e);
+    function Vt(e) {
+      ae(e);
     }
-    function kt(e) {
+    function It(e) {
       M(e);
     }
-    function gt(e) {
+    function Ft(e) {
       d("row-click", e);
     }
-    function ye(e) {
-      d("card-click", e), M(be(e.id));
+    function ke(e) {
+      d("card-click", e), M(he(e.id));
     }
-    function Ct(e) {
-      d("row-click", e), M(be(e.sourceRecordId ?? e.id));
+    function St(e) {
+      d("row-click", e), M(he(e.sourceRecordId ?? e.id));
     }
-    function W() {
-      _.value = !1, f.value = {}, s.clearSelectedRecord();
+    function U() {
+      _.value = !1, p.value = {}, n.clearSelectedRecord();
     }
-    function _e(e) {
+    function Tt(e) {
       for (const [t, a] of Object.entries(e.fields))
-        ee({ rowId: e.rowId, fieldId: t, value: a });
-      f.value = {}, W();
+        ye({ rowId: e.rowId, fieldId: t, value: a });
+      p.value = {}, U();
     }
-    function ke(e) {
+    function ge(e) {
       const t = C.value.filter((a) => a.id !== e);
-      Q(t), _.value = !1, f.value = {}, s.clearSelectedRecord();
+      ae(t), _.value = !1, p.value = {}, n.clearSelectedRecord();
     }
-    function Vt(e) {
-      return K.value.find((t) => t.id === e) ?? {
+    function Ce(e) {
+      return $.value.find((t) => t.id === e) ?? {
         id: e,
         type: "text",
         label: e
       };
     }
-    function te(e) {
-      return Object.prototype.hasOwnProperty.call(f.value, e) ? f.value[e] : Y.value[e];
-    }
-    function It(e) {
-      const t = te(e);
-      return typeof t != "string" || !t ? "" : Te(t);
+    function K(e) {
+      return Object.prototype.hasOwnProperty.call(p.value, e) ? p.value[e] : ve.value[e];
     }
-    function St(e, t, a) {
-      f.value = {
-        ...f.value,
+    function Ve(e, t, a) {
+      p.value = {
+        ...p.value,
         [t]: a
       };
     }
-    function Ft() {
-      h.value && _e({
-        rowId: h.value.id,
-        fields: { ...f.value }
+    function Ie() {
+      f.value && Tt({
+        rowId: f.value.id,
+        fields: { ...p.value }
       });
     }
     return (e, t) => {
       var a;
-      return c(), w("section", Lt({
+      return c(), m("section", At({
         class: "of-database-view",
         "data-role": "database-view"
       }, e.$attrs), [
-        Z.value === "loading" ? (c(), w("div", jt, [
-          ae(ie(Bt), {
+        te.value === "loading" ? (c(), m("div", zt, [
+          W(ie(Bt), {
             class: "of-database-view__spinner",
             size: 20
           }),
-          t[10] || (t[10] = u("div", { class: "of-database-view__state-text" }, [
+          t[11] || (t[11] = u("div", { class: "of-database-view__state-text" }, [
             u("div", { class: "of-database-view__state-title" }, "正在加载数据视图"),
             u("div", { class: "of-database-view__state-description" }, "请稍候，页面级编排器正在准备当前视图。")
           ], -1))
-        ])) : Z.value === "error" ? (c(), w("div", Ht, [
-          ae(Se, {
-            icon: ie(At),
+        ])) : te.value === "error" ? (c(), m("div", Mt, [
+          W(De, {
+            icon: ie(xt),
             title: "数据视图加载失败",
-            description: G.value instanceof Error ? G.value.message : String(G.value)
+            description: z.value instanceof Error ? z.value.message : String(z.value)
           }, null, 8, ["icon", "description"])
-        ])) : (c(), w(le, { key: 2 }, [
-          Xe.value ? (c(), S(qt, {
+        ])) : (c(), m(le, { key: 2 }, [
+          et.value ? (c(), V(qt, {
             key: 0,
             class: "of-database-view__toolbar",
-            "current-view": z.value,
-            "view-tabs": H.value,
-            columns: J.value,
-            "filter-conditions": q.value,
-            "filter-logic": j.value,
-            "filter-active": Je.value,
-            "current-sort": me.value,
-            "current-group": He.value,
-            "search-keyword": D.value,
-            "show-view-switch": Ye.value,
-            "show-filter": Ze.value,
-            "show-sort": Qe.value,
-            "show-group": et.value,
-            "show-columns": tt.value,
-            "show-search": at.value,
-            "saved-views": Oe.value,
-            "onUpdate:currentView": rt,
-            "onUpdate:columns": wt,
-            "onUpdate:searchKeyword": bt,
-            onAddFilter: dt,
-            onRemoveFilter: ut,
-            onUpdateFilter: ct,
-            onClearFilters: vt,
-            "onUpdate:filterLogic": ft,
-            onSort: mt,
-            onGroup: pt,
-            onSaveView: st,
-            onLoadView: nt
-          }, null, 8, ["current-view", "view-tabs", "columns", "filter-conditions", "filter-logic", "filter-active", "current-sort", "current-group", "search-keyword", "show-view-switch", "show-filter", "show-sort", "show-group", "show-columns", "show-search", "saved-views"])) : oe("", !0),
-          Z.value === "empty" ? (c(), w("div", Jt, [
-            ae(Se, {
+            "current-view": Y.value,
+            "view-tabs": Q.value,
+            columns: ee.value,
+            "filter-conditions": j.value,
+            "filter-logic": Z.value,
+            "filter-active": Qe.value,
+            "current-sort": be.value,
+            "current-group": Ze.value,
+            "search-keyword": L.value,
+            "show-view-switch": tt.value,
+            "show-filter": at.value,
+            "show-sort": it.value,
+            "show-group": lt.value,
+            "show-columns": ot.value,
+            "show-search": st.value,
+            "saved-views": Je.value,
+            "onUpdate:currentView": ut,
+            "onUpdate:columns": ht,
+            "onUpdate:searchKeyword": kt,
+            onAddFilter: ft,
+            onRemoveFilter: wt,
+            onUpdateFilter: pt,
+            onClearFilters: mt,
+            "onUpdate:filterLogic": bt,
+            onSort: _t,
+            onGroup: yt,
+            onSaveView: vt,
+            onLoadView: ct
+          }, null, 8, ["current-view", "view-tabs", "columns", "filter-conditions", "filter-logic", "filter-active", "current-sort", "current-group", "search-keyword", "show-view-switch", "show-filter", "show-sort", "show-group", "show-columns", "show-search", "saved-views"])) : Te("", !0),
+          te.value === "empty" ? (c(), m("div", Ht, [
+            W(De, {
               icon: ie(Nt),
               title: "暂无记录",
-              description: m.value === "detail" ? "请选择一条记录，详情工作区会在这里打开。" : m.value === "timeline" ? "当前时间线没有可渲染的起止日期。" : "当前视图没有匹配的数据，或者被筛选条件过滤为空。",
-              action: ot.value
+              description: w.value === "detail" ? "请选择一条记录，详情工作区会在这里打开。" : w.value === "timeline" ? "当前时间线没有可渲染的起止日期。" : "当前视图没有匹配的数据，或者被筛选条件过滤为空。",
+              action: dt.value
             }, null, 8, ["icon", "description", "action"])
-          ])) : (c(), w("div", {
+          ])) : (c(), m("div", {
             key: 2,
             class: "of-database-view__content",
-            "data-view": m.value
+            "data-view": w.value
           }, [
-            m.value === "table" ? (c(), S(Gt, {
+            w.value === "table" ? (c(), V(Wt, {
               key: 0,
               class: "of-database-view__view of-database-view__view--table",
-              records: L.value,
-              schema: V.value ?? void 0,
+              records: E.value,
+              schema: I.value ?? void 0,
               view: b.value,
-              columns: J.value,
-              readonly: T.readonly,
-              "enable-field-management": ((a = T.ui) == null ? void 0 : a.enableFieldManagement) ?? !1,
-              onCellEdit: ee,
-              onSchemaAddField: t[0] || (t[0] = (i) => E({ type: "schema-add-field", fieldType: i })),
-              onSchemaRenameField: t[1] || (t[1] = ({ fieldId: i, newName: o }) => E({ type: "schema-rename-field", fieldId: i, newName: o })),
-              onSchemaChangeFieldType: t[2] || (t[2] = ({ fieldId: i, newType: o }) => E({ type: "schema-change-field-type", fieldId: i, newType: o })),
-              onSchemaHideField: t[3] || (t[3] = (i) => E({ type: "schema-hide-field", fieldId: i })),
-              onSchemaDeleteField: t[4] || (t[4] = (i) => E({ type: "schema-delete-field", fieldId: i })),
-              onSchemaDuplicateField: t[5] || (t[5] = (i) => E({ type: "schema-duplicate-field", fieldId: i })),
-              onRowClick: gt,
-              onRowClickRecord: kt
-            }, null, 8, ["records", "schema", "view", "columns", "readonly", "enable-field-management"])) : m.value === "kanban" ? (c(), S(Mt, {
+              columns: ee.value,
+              readonly: S.readonly,
+              "enable-field-management": ((a = S.ui) == null ? void 0 : a.enableFieldManagement) ?? !1,
+              onCellEdit: ye,
+              onSchemaAddField: t[0] || (t[0] = (i) => A({ type: "schema-add-field", fieldType: i })),
+              onSchemaRenameField: t[1] || (t[1] = ({ fieldId: i, newName: l }) => A({ type: "schema-rename-field", fieldId: i, newName: l })),
+              onSchemaChangeFieldType: t[2] || (t[2] = ({ fieldId: i, newType: l }) => A({ type: "schema-change-field-type", fieldId: i, newType: l })),
+              onSchemaHideField: t[3] || (t[3] = (i) => A({ type: "schema-hide-field", fieldId: i })),
+              onSchemaDeleteField: t[4] || (t[4] = (i) => A({ type: "schema-delete-field", fieldId: i })),
+              onSchemaDuplicateField: t[5] || (t[5] = (i) => A({ type: "schema-duplicate-field", fieldId: i })),
+              onRowClick: Ft,
+              onRowClickRecord: It
+            }, null, 8, ["records", "schema", "view", "columns", "readonly", "enable-field-management"])) : w.value === "kanban" ? (c(), V($t, {
               key: 1,
               class: "of-database-view__view of-database-view__view--kanban",
-              records: L.value,
-              schema: V.value ?? void 0,
+              records: E.value,
+              schema: I.value ?? void 0,
               view: b.value,
-              onCardClick: ye,
+              onCardClick: ke,
               "onUpdate:columns": t[6] || (t[6] = () => {
               }),
               onAddColumn: t[7] || (t[7] = () => d("add-column"))
-            }, null, 8, ["records", "schema", "view"])) : m.value === "gallery" ? (c(), S(Pt, {
+            }, null, 8, ["records", "schema", "view"])) : w.value === "gallery" ? (c(), V(Gt, {
               key: 2,
               class: "of-database-view__view of-database-view__view--gallery",
-              records: L.value,
-              schema: V.value ?? void 0,
+              records: E.value,
+              schema: I.value ?? void 0,
               view: b.value,
-              onCardClick: ye,
+              onCardClick: ke,
               onAdd: t[8] || (t[8] = () => d("add"))
-            }, null, 8, ["records", "schema", "view"])) : m.value === "timeline" ? (c(), S(Wt, {
+            }, null, 8, ["records", "schema", "view"])) : w.value === "timeline" ? (c(), V(Pt, {
               key: 3,
               class: "of-database-view__view of-database-view__view--timeline",
-              records: L.value,
-              schema: V.value ?? void 0,
+              records: E.value,
+              schema: I.value ?? void 0,
               "view-config": b.value,
-              onRowClick: Ct,
-              onRecordChange: yt,
-              "onUpdate:records": _t
-            }, null, 8, ["records", "schema", "view-config"])) : (c(), w("div", Yt))
-          ], 8, Xt))
+              onRowClick: St,
+              onRecordChange: Ct,
+              "onUpdate:records": Vt
+            }, null, 8, ["records", "schema", "view-config"])) : (c(), m("div", Xt))
+          ], 8, Jt))
         ], 64)),
-        N.value && pe.value === "side-panel" ? (c(), S(Kt, {
+        N.value && O.value === "side-panel" ? (c(), V(Kt, {
           key: 3,
           "model-value": N.value,
-          title: "记录详情",
-          width: 640,
+          title: P.value,
+          width: 720,
           mode: "persistent",
-          "onUpdate:modelValue": W
+          "onUpdate:modelValue": U
         }, {
-          default: Et(() => {
-            var i, o, r, v, I;
-            return [
-              u("div", {
-                class: "of-database-view__detail-workspace",
-                "data-record-id": ((i = h.value) == null ? void 0 : i.id) ?? ""
-              }, [
-                u("div", Qt, [
-                  u("div", ea, [
-                    t[11] || (t[11] = u("div", { class: "of-database-view__detail-workspace-kicker" }, "右侧工作区", -1)),
-                    u("h3", ta, x(((r = (o = h.value) == null ? void 0 : o.fields) == null ? void 0 : r.title) ?? ((v = h.value) == null ? void 0 : v.id) ?? "记录详情"), 1)
-                  ]),
-                  u("div", aa, [
-                    u("span", ia, x((I = h.value) == null ? void 0 : I.id), 1),
-                    t[12] || (t[12] = u("span", { class: "of-database-view__detail-workspace-mode" }, "side-panel", -1))
-                  ])
-                ]),
-                u("div", la, [
-                  u("section", oa, [
-                    (c(!0), w(le, null, Ie($e.value, (p) => (c(), w("div", {
-                      key: p.key,
-                      class: "of-database-view__detail-workspace-field"
-                    }, [
-                      u("span", ra, x(p.label), 1),
-                      u("div", na, [
-                        K.value.length > 0 ? (c(), S(xt, {
-                          key: 0,
-                          "row-id": ve.value.id,
-                          field: Vt(p.key),
-                          value: te(p.key),
-                          readonly: T.readonly,
-                          onCommit: St
-                        }, null, 8, ["row-id", "field", "value", "readonly"])) : (c(), w("span", sa, x(te(p.key) ?? "—"), 1))
-                      ])
-                    ]))), 128))
-                  ]),
-                  we.value.length > 0 ? (c(), w("section", da, [
-                    (c(!0), w(le, null, Ie(we.value, (p) => (c(), w("div", {
-                      key: p.key,
-                      class: "of-database-view__detail-workspace-content-block"
-                    }, [
-                      u("span", ua, x(p.label), 1),
-                      u("div", {
-                        class: "of-database-view__detail-workspace-markdown of-markdown",
-                        innerHTML: It(p.key)
-                      }, null, 8, ca)
-                    ]))), 128))
-                  ])) : oe("", !0)
-                ]),
-                u("div", va, [
-                  u("button", {
-                    class: "of-database-view__detail-workspace-btn of-database-view__detail-workspace-btn--delete",
-                    type: "button",
-                    onClick: t[9] || (t[9] = (p) => {
-                      var Ve;
-                      return ke(((Ve = h.value) == null ? void 0 : Ve.id) ?? ve.value.id);
-                    })
-                  }, " 删除 "),
-                  t[13] || (t[13] = u("div", { class: "of-database-view__detail-workspace-footer-spacer" }, null, -1)),
-                  u("button", {
-                    class: "of-database-view__detail-workspace-btn of-database-view__detail-workspace-btn--cancel",
-                    type: "button",
-                    onClick: W
-                  }, " 取消 "),
-                  u("button", {
-                    class: "of-database-view__detail-workspace-btn of-database-view__detail-workspace-btn--save",
-                    type: "button",
-                    disabled: T.readonly || !ze.value,
-                    onClick: Ft
-                  }, " 保存 ", 8, fa)
-                ])
-              ], 8, Zt)
-            ];
-          }),
+          default: F(() => [
+            W(Ee, {
+              title: P.value,
+              comments: [],
+              "description-content": pe.value,
+              "description-editable": !1
+            }, {
+              meta: F(() => {
+                var i;
+                return [
+                  u("span", Yt, y(((i = f.value) == null ? void 0 : i.id) ?? "record"), 1),
+                  u("span", Zt, y(w.value), 1),
+                  u("span", Qt, y(O.value), 1)
+                ];
+              }),
+              props: F(() => {
+                var i;
+                return [
+                  u("div", {
+                    class: "of-database-view__detail-workspace",
+                    "data-record-id": ((i = f.value) == null ? void 0 : i.id) ?? ""
+                  }, [
+                    u("section", ta, [
+                      (c(!0), m(le, null, Re(we.value, (l) => (c(), m("div", {
+                        key: l.key,
+                        class: "of-database-view__detail-workspace-field"
+                      }, [
+                        u("span", aa, y(l.label), 1),
+                        u("div", ia, [
+                          $.value.length > 0 ? (c(), V(Le, {
+                            key: 0,
+                            "row-id": G.value.id,
+                            field: Ce(l.key),
+                            value: K(l.key),
+                            readonly: S.readonly,
+                            onCommit: Ve
+                          }, null, 8, ["row-id", "field", "value", "readonly"])) : (c(), m("span", la, y(K(l.key) ?? "—"), 1))
+                        ])
+                      ]))), 128))
+                    ])
+                  ], 8, ea)
+                ];
+              }),
+              footer: F(() => [
+                u("button", {
+                  class: "of-database-view__detail-workspace-btn of-database-view__detail-workspace-btn--delete",
+                  type: "button",
+                  onClick: t[9] || (t[9] = (i) => {
+                    var l;
+                    return ge(((l = f.value) == null ? void 0 : l.id) ?? G.value.id);
+                  })
+                }, " 删除 "),
+                t[12] || (t[12] = u("div", { class: "of-database-view__detail-workspace-footer-spacer" }, null, -1)),
+                u("button", {
+                  class: "of-database-view__detail-workspace-btn of-database-view__detail-workspace-btn--cancel",
+                  type: "button",
+                  onClick: U
+                }, " 取消 "),
+                u("button", {
+                  class: "of-database-view__detail-workspace-btn of-database-view__detail-workspace-btn--save",
+                  type: "button",
+                  disabled: S.readonly || !me.value,
+                  onClick: Ie
+                }, " 保存 ", 8, oa)
+              ]),
+              _: 1
+            }, 8, ["title", "description-content"])
+          ]),
           _: 1
-        }, 8, ["model-value"])) : N.value ? (c(), S(Ut, {
+        }, 8, ["model-value", "title"])) : N.value ? (c(), V(Ut, {
           key: 4,
-          visible: N.value,
-          row: Y.value,
-          columns: X.value,
-          "field-defs": K.value,
-          "full-page": pe.value === "full-page",
-          readonly: T.readonly,
-          onClose: W,
-          onSave: _e,
-          onDelete: ke,
-          onCellEdit: ee
-        }, null, 8, ["visible", "row", "columns", "field-defs", "full-page", "readonly"])) : oe("", !0)
+          "model-value": N.value,
+          title: P.value,
+          width: 900,
+          fullscreen: O.value === "full-page",
+          "mask-closable": !0,
+          "onUpdate:modelValue": U
+        }, {
+          default: F(() => [
+            W(Ee, {
+              title: P.value,
+              comments: [],
+              "description-content": pe.value,
+              "description-editable": !1
+            }, {
+              meta: F(() => {
+                var i;
+                return [
+                  u("span", sa, y(((i = f.value) == null ? void 0 : i.id) ?? "record"), 1),
+                  u("span", ra, y(w.value), 1),
+                  u("span", na, y(O.value), 1)
+                ];
+              }),
+              props: F(() => {
+                var i;
+                return [
+                  u("div", {
+                    class: "of-database-view__detail-workspace",
+                    "data-record-id": ((i = f.value) == null ? void 0 : i.id) ?? ""
+                  }, [
+                    u("section", ua, [
+                      (c(!0), m(le, null, Re(we.value, (l) => (c(), m("div", {
+                        key: l.key,
+                        class: "of-database-view__detail-workspace-field"
+                      }, [
+                        u("span", ca, y(l.label), 1),
+                        u("div", va, [
+                          $.value.length > 0 ? (c(), V(Le, {
+                            key: 0,
+                            "row-id": G.value.id,
+                            field: Ce(l.key),
+                            value: K(l.key),
+                            readonly: S.readonly,
+                            onCommit: Ve
+                          }, null, 8, ["row-id", "field", "value", "readonly"])) : (c(), m("span", fa, y(K(l.key) ?? "—"), 1))
+                        ])
+                      ]))), 128))
+                    ])
+                  ], 8, da)
+                ];
+              }),
+              footer: F(() => [
+                u("button", {
+                  class: "of-database-view__detail-workspace-btn of-database-view__detail-workspace-btn--delete",
+                  type: "button",
+                  onClick: t[10] || (t[10] = (i) => {
+                    var l;
+                    return ge(((l = f.value) == null ? void 0 : l.id) ?? G.value.id);
+                  })
+                }, " 删除 "),
+                t[13] || (t[13] = u("div", { class: "of-database-view__detail-workspace-footer-spacer" }, null, -1)),
+                u("button", {
+                  class: "of-database-view__detail-workspace-btn of-database-view__detail-workspace-btn--cancel",
+                  type: "button",
+                  onClick: U
+                }, " 取消 "),
+                u("button", {
+                  class: "of-database-view__detail-workspace-btn of-database-view__detail-workspace-btn--save",
+                  type: "button",
+                  disabled: S.readonly || !me.value,
+                  onClick: Ie
+                }, " 保存 ", 8, wa)
+              ]),
+              _: 1
+            }, 8, ["title", "description-content"])
+          ]),
+          _: 1
+        }, 8, ["model-value", "title", "fullscreen"])) : Te("", !0)
       ], 16);
     };
   }
 });
 export {
-  Ra as default
+  Da as default
 };