@harbour-enterprises/superdoc 0.23.0-next.6 → 0.23.0-next.8

package/dist/chunks/{PdfViewer-D89-VJvM.cjs → PdfViewer-CqRCWGPC.cjs}

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const vue = require("./vue-DKMj1I9B.cjs");
-const superdoc = require("./index-9hY1WuxT.cjs");
+const superdoc = require("./index-Mh8HFZBp.cjs");
 function self(vars) {
   const {
     opacityDisabled,

package/dist/chunks/{PdfViewer-BlOezZGN.es.js → PdfViewer-fqIBzqak.es.js}

@@ -1,5 +1,5 @@
 import { m as defineComponent, B as h, O as Transition, $ as process$1, I as watchEffect, d as computed, r as ref, j as onMounted, W as onUnmounted, c as createElementBlock, o as openBlock, a as createBaseVNode, f as createCommentVNode, v as createVNode, x as unref } from "./vue-ZWZLQtoU.es.js";
-import { d as derived, c, a as cB, f as fadeInTransition, b as cM, N as NBaseLoading, w as warnOnce, u as useConfig, e as useTheme, p as pxfy, g as createKey, h as useThemeClass, i as useCompitable, _ as _export_sfc, j as useSuperdocStore, s as storeToRefs, k as useSelection } from "./index-DTw4eF5D.es.js";
+import { d as derived, c, a as cB, f as fadeInTransition, b as cM, N as NBaseLoading, w as warnOnce, u as useConfig, e as useTheme, p as pxfy, g as createKey, h as useThemeClass, i as useCompitable, _ as _export_sfc, j as useSuperdocStore, s as storeToRefs, k as useSelection } from "./index-CPu7VToO.es.js";
 function self(vars) {
   const {
     opacityDisabled,

package/dist/chunks/{index-DTw4eF5D.es.js → index-CPu7VToO.es.js}

@@ -1,4 +1,4 @@
-import { q as index$1, C as CommentsPluginKey, h as TrackChangesBasePluginKey, E as Editor, n as getRichTextExtensions, f as SuperInput, e as SuperEditor, A as AIWriter, g as SuperToolbar, i as createZip } from "./super-editor.es-C9Ql0kHS.es.js";
+import { q as index$1, C as CommentsPluginKey, h as TrackChangesBasePluginKey, E as Editor, n as getRichTextExtensions, f as SuperInput, e as SuperEditor, A as AIWriter, g as SuperToolbar, i as createZip } from "./super-editor.es-CINrYeD9.es.js";
 import { a0 as effectScope, r as ref, _ as markRaw, $ as process$1, a1 as toRaw, d as computed, a2 as isRef, a3 as isReactive, C as toRef, i as inject, p as getCurrentInstance, l as watch, x as unref, a4 as hasInjectionContext, M as reactive, s as nextTick, a5 as getCurrentScope, a6 as onScopeDispose, a7 as toRefs, g as global$1, J as shallowRef, N as readonly, j as onMounted, k as onBeforeUnmount, h as onBeforeMount, S as onActivated, q as onDeactivated, z as createTextVNode, F as Fragment, Q as Comment, m as defineComponent, D as provide, H as withDirectives, B as h, U as Teleport, R as renderSlot, V as isVNode, I as watchEffect, O as Transition, a8 as TransitionGroup, E as mergeProps, P as vShow, G as cloneVNode, T as Text, c as createElementBlock, o as openBlock, t as toDisplayString, v as createVNode, y as withCtx, a as createBaseVNode, A as normalizeStyle, f as createCommentVNode, u as createBlock, w as withModifiers, n as normalizeClass, a9 as resolveDirective, e as renderList, b as createApp, X as resolveDynamicComponent, aa as defineAsyncComponent } from "./vue-ZWZLQtoU.es.js";
 import { B as Buffer$2 } from "./jszip-DAXEPCUv.es.js";
 import { B as BlankDOCX } from "./blank-docx-iwdyG9RH.es.js";
@@ -17400,7 +17400,7 @@ const _sfc_main = {
   __name: "SuperDoc",
   emits: ["selection-update"],
   setup(__props, { emit: __emit }) {
-    const PdfViewer = defineAsyncComponent(() => import("./PdfViewer-BlOezZGN.es.js"));
+    const PdfViewer = defineAsyncComponent(() => import("./PdfViewer-fqIBzqak.es.js"));
     const superdocStore = useSuperdocStore();
     const commentsStore = useCommentsStore();
     const {

package/dist/chunks/{index-9hY1WuxT.cjs → index-Mh8HFZBp.cjs}

@@ -1,5 +1,5 @@
 "use strict";
-const superEditor_es = require("./super-editor.es-C8gNFcB_.cjs");
+const superEditor_es = require("./super-editor.es-COK5ynTl.cjs");
 const vue = require("./vue-DKMj1I9B.cjs");
 const jszip = require("./jszip-B4LDL19y.cjs");
 const blankDocx = require("./blank-docx-CPqX9RF5.cjs");
@@ -17417,7 +17417,7 @@ const _sfc_main = {
   __name: "SuperDoc",
   emits: ["selection-update"],
   setup(__props, { emit: __emit }) {
-    const PdfViewer = vue.defineAsyncComponent(() => Promise.resolve().then(() => require("./PdfViewer-D89-VJvM.cjs")));
+    const PdfViewer = vue.defineAsyncComponent(() => Promise.resolve().then(() => require("./PdfViewer-CqRCWGPC.cjs")));
     const superdocStore = useSuperdocStore();
     const commentsStore = useCommentsStore();
     const {

package/dist/chunks/{super-editor.es-C9Ql0kHS.es.js → super-editor.es-CINrYeD9.es.js}

@@ -54386,7 +54386,7 @@ const StructuredContentCommands = Extension.create({
        * This will update every field that matches the given alias.
        * If any updated node does not match the schema, no updates will be applied.
        * @category Command
-       * @param {string} alias - Shared identifier for fields (e.g., "customer_name")
+       * @param {string | string[]} alias - Shared identifier for fields (e.g., "customer_name")
        * @param {StructuredContentUpdate} options
        */
       updateStructuredContentByAlias: (alias, options = {}) => ({ editor, dispatch, state: state2, tr }) => {
@@ -54395,35 +54395,39 @@ const StructuredContentCommands = Extension.create({
           return true;
         }
         const { schema } = editor;
-        const updates = [];
-        for (const { pos, node } of structuredContentTags) {
-          let content = null;
+        const createContent = (node) => {
           if (options.text) {
-            content = schema.text(options.text);
+            return schema.text(options.text);
           }
           if (options.html) {
             const html = htmlHandler(options.html, editor);
             const doc2 = DOMParser$1.fromSchema(schema).parse(html);
-            content = doc2.content;
+            return doc2.content;
           }
           if (options.json) {
-            content = schema.nodeFromJSON(options.json);
-          }
-          if (!content) {
-            content = node.content;
+            return schema.nodeFromJSON(options.json);
           }
+          return node.content;
+        };
+        for (const { node } of structuredContentTags) {
+          const content = createContent(node);
           const updatedNode = node.type.create({ ...node.attrs, ...options.attrs }, content, node.marks);
           try {
             updatedNode.check();
-            updates.push({ pos, node: updatedNode, size: node.nodeSize });
           } catch {
             console.error("Updated node does not conform to the schema");
             return false;
           }
         }
         if (dispatch) {
-          updates.reverse().forEach(({ pos, node, size: size2 }) => {
-            tr.replaceWith(pos, pos + size2, node);
+          structuredContentTags.forEach(({ pos, node }) => {
+            const mappedPos = tr.mapping.map(pos);
+            const currentNode = tr.doc.nodeAt(mappedPos);
+            if (currentNode && node.eq(currentNode)) {
+              const content = createContent(node);
+              const updatedNode = node.type.create({ ...node.attrs, ...options.attrs }, content, node.marks);
+              tr.replaceWith(mappedPos, mappedPos + node.nodeSize, updatedNode);
+            }
           });
         }
         return true;
@@ -71369,7 +71373,7 @@ const _sfc_main$4$1 = {
     };
     const handleInputSubmit = () => {
       const value = inlineTextInput.value;
-      const cleanValue = value.replace(/[^0-9]/g, "");
+      const cleanValue = value.match(/^\d+(\.5)?$/) ? value : Math.floor(parseFloat(value)).toString();
       emit("textSubmit", cleanValue);
       inlineTextInput.value = cleanValue;
     };
@@ -71451,7 +71455,7 @@ const _sfc_main$4$1 = {
     };
   }
 };
-const ToolbarButton = /* @__PURE__ */ _export_sfc(_sfc_main$4$1, [["__scopeId", "data-v-303b3245"]]);
+const ToolbarButton = /* @__PURE__ */ _export_sfc(_sfc_main$4$1, [["__scopeId", "data-v-cea02a58"]]);
 const _hoisted_1$2$1 = {
   class: "toolbar-separator",
   role: "separator",

package/dist/chunks/{super-editor.es-C8gNFcB_.cjs → super-editor.es-COK5ynTl.cjs}

@@ -54403,7 +54403,7 @@ const StructuredContentCommands = Extension.create({
        * This will update every field that matches the given alias.
        * If any updated node does not match the schema, no updates will be applied.
        * @category Command
-       * @param {string} alias - Shared identifier for fields (e.g., "customer_name")
+       * @param {string | string[]} alias - Shared identifier for fields (e.g., "customer_name")
        * @param {StructuredContentUpdate} options
        */
       updateStructuredContentByAlias: (alias, options = {}) => ({ editor, dispatch, state: state2, tr }) => {
@@ -54412,35 +54412,39 @@ const StructuredContentCommands = Extension.create({
           return true;
         }
         const { schema } = editor;
-        const updates = [];
-        for (const { pos, node } of structuredContentTags) {
-          let content = null;
+        const createContent = (node) => {
           if (options.text) {
-            content = schema.text(options.text);
+            return schema.text(options.text);
           }
           if (options.html) {
             const html = htmlHandler(options.html, editor);
             const doc2 = DOMParser$1.fromSchema(schema).parse(html);
-            content = doc2.content;
+            return doc2.content;
           }
           if (options.json) {
-            content = schema.nodeFromJSON(options.json);
-          }
-          if (!content) {
-            content = node.content;
+            return schema.nodeFromJSON(options.json);
           }
+          return node.content;
+        };
+        for (const { node } of structuredContentTags) {
+          const content = createContent(node);
           const updatedNode = node.type.create({ ...node.attrs, ...options.attrs }, content, node.marks);
           try {
             updatedNode.check();
-            updates.push({ pos, node: updatedNode, size: node.nodeSize });
           } catch {
             console.error("Updated node does not conform to the schema");
             return false;
           }
         }
         if (dispatch) {
-          updates.reverse().forEach(({ pos, node, size: size2 }) => {
-            tr.replaceWith(pos, pos + size2, node);
+          structuredContentTags.forEach(({ pos, node }) => {
+            const mappedPos = tr.mapping.map(pos);
+            const currentNode = tr.doc.nodeAt(mappedPos);
+            if (currentNode && node.eq(currentNode)) {
+              const content = createContent(node);
+              const updatedNode = node.type.create({ ...node.attrs, ...options.attrs }, content, node.marks);
+              tr.replaceWith(mappedPos, mappedPos + node.nodeSize, updatedNode);
+            }
           });
         }
         return true;
@@ -71386,7 +71390,7 @@ const _sfc_main$4$1 = {
     };
     const handleInputSubmit = () => {
       const value = inlineTextInput.value;
-      const cleanValue = value.replace(/[^0-9]/g, "");
+      const cleanValue = value.match(/^\d+(\.5)?$/) ? value : Math.floor(parseFloat(value)).toString();
       emit("textSubmit", cleanValue);
       inlineTextInput.value = cleanValue;
     };
@@ -71468,7 +71472,7 @@ const _sfc_main$4$1 = {
     };
   }
 };
-const ToolbarButton = /* @__PURE__ */ _export_sfc(_sfc_main$4$1, [["__scopeId", "data-v-303b3245"]]);
+const ToolbarButton = /* @__PURE__ */ _export_sfc(_sfc_main$4$1, [["__scopeId", "data-v-cea02a58"]]);
 const _hoisted_1$2$1 = {
   class: "toolbar-separator",
   role: "separator",

package/dist/style.css

@@ -438,20 +438,20 @@ span[data-v-53e13009] {
   width: 16px;
 }
 
-.toolbar-item[data-v-303b3245] {
+.toolbar-item[data-v-cea02a58] {
   position: relative;
   z-index: 1;
   min-width: 30px;
   margin: 0 1px;
 }
-.visually-hidden[data-v-303b3245] {
+.visually-hidden[data-v-cea02a58] {
   position: absolute;
   left: -9999px;
   height: 1px;
   width: 1px;
   overflow: hidden;
 }
-.toolbar-button[data-v-303b3245] {
+.toolbar-button[data-v-cea02a58] {
   padding: 5px;
   height: 32px;
   max-height: 32px;
@@ -467,21 +467,21 @@ span[data-v-53e13009] {
   position: relative;
   box-sizing: border-box;
 }
-.toolbar-button[data-v-303b3245]:hover {
+.toolbar-button[data-v-cea02a58]:hover {
   background-color: #dbdbdb;
 }
-.toolbar-button:hover .toolbar-icon.high-contrast[data-v-303b3245] {
+.toolbar-button:hover .toolbar-icon.high-contrast[data-v-cea02a58] {
       color: #fff;
 }
-.toolbar-button:hover.high-contrast[data-v-303b3245] {
+.toolbar-button:hover.high-contrast[data-v-cea02a58] {
     background-color: #000;
     color: #fff;
 }
-.toolbar-button[data-v-303b3245]:active,
-.active[data-v-303b3245] {
+.toolbar-button[data-v-cea02a58]:active,
+.active[data-v-cea02a58] {
   background-color: #c8d0d8;
 }
-.button-label[data-v-303b3245] {
+.button-label[data-v-cea02a58] {
   overflow: hidden;
   width: 100%;
   text-align: center;
@@ -491,37 +491,37 @@ span[data-v-53e13009] {
   font-size: 15px;
   margin: 5px;
 }
-.toolbar-icon + .dropdown-caret[data-v-303b3245] {
+.toolbar-icon + .dropdown-caret[data-v-cea02a58] {
   margin-left: 4px;
 }
-.left[data-v-303b3245],
-.right[data-v-303b3245] {
+.left[data-v-cea02a58],
+.right[data-v-cea02a58] {
   width: 50%;
   height: 100%;
   background-color: #dbdbdb;
   border-radius: 60%;
 }
-.has-inline-text-input[data-v-303b3245]:hover {
+.has-inline-text-input[data-v-cea02a58]:hover {
   cursor: text;
 }
-.disabled[data-v-303b3245] {
+.disabled[data-v-cea02a58] {
   cursor: default;
 }
-.disabled[data-v-303b3245]:hover {
+.disabled[data-v-cea02a58]:hover {
   cursor: default;
   background-color: initial;
 }
-.disabled .toolbar-icon[data-v-303b3245],
-.disabled .caret[data-v-303b3245],
-.disabled .button-label[data-v-303b3245] {
+.disabled .toolbar-icon[data-v-cea02a58],
+.disabled .caret[data-v-cea02a58],
+.disabled .button-label[data-v-cea02a58] {
   opacity: 0.35;
 }
-.caret[data-v-303b3245] {
+.caret[data-v-cea02a58] {
   font-size: 1em;
   padding-left: 2px;
   padding-right: 2px;
 }
-.button-text-input[data-v-303b3245] {
+.button-text-input[data-v-cea02a58] {
   color: #47484a;
   border-radius: 4px;
   text-align: center;
@@ -535,13 +535,13 @@ span[data-v-53e13009] {
   border: 1px solid #d8dee5;
   box-sizing: border-box;
 }
-.button-text-input.high-contrast[data-v-303b3245] {
+.button-text-input.high-contrast[data-v-cea02a58] {
     background-color: #fff;
 }
-.button-text-input[data-v-303b3245]::placeholder {
+.button-text-input[data-v-cea02a58]::placeholder {
   color: #47484a;
 }
-.dropdown-caret[data-v-303b3245] {
+.dropdown-caret[data-v-cea02a58] {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -551,16 +551,16 @@ span[data-v-53e13009] {
   height: 10px;
 }
 @media (max-width: 1280px) {
-.toolbar-item--doc-mode .button-label[data-v-303b3245] {
+.toolbar-item--doc-mode .button-label[data-v-cea02a58] {
     display: none;
 }
-.toolbar-item--doc-mode .toolbar-icon[data-v-303b3245] {
+.toolbar-item--doc-mode .toolbar-icon[data-v-cea02a58] {
     margin-right: 5px;
 }
-.toolbar-item--linked-styles[data-v-303b3245] {
+.toolbar-item--linked-styles[data-v-cea02a58] {
     width: auto !important;
 }
-.toolbar-item--linked-styles .button-label[data-v-303b3245] {
+.toolbar-item--linked-styles .button-label[data-v-cea02a58] {
     display: none;
 }
 }
@@ -1497,6 +1497,13 @@ on the right if it is inside shape textbox.
   white-space: nowrap;
   text-overflow: ellipsis;
 }
+.ProseMirror.view-mode .sd-document-section-block {
+  background: none;
+  border: none;
+}
+.ProseMirror.view-mode .sd-document-section-block-info {
+  display: none;
+}
 .sd-structured-content,
 .sd-structured-content-block {
   padding: 1px;
@@ -1540,6 +1547,14 @@ on the right if it is inside shape textbox.
 .sd-structured-content-block:hover .sd-structured-content-draggable {
   display: inline-flex;
 }
+.ProseMirror.view-mode .sd-structured-content,
+.ProseMirror.view-mode .sd-structured-content-block {
+  padding: 0;
+  border: none;
+}
+.ProseMirror.view-mode .sd-structured-content-draggable {
+  display: none;
+}
 
 .alignment-buttons[data-v-d84f57b6] {
   display: flex;

package/dist/super-editor/ai-writer.es.js

@@ -1,6 +1,6 @@
 import { ref, onMounted, onUnmounted, computed, createElementBlock, openBlock, withModifiers, createElementVNode, withDirectives, unref, vModelText, createCommentVNode, nextTick } from "vue";
 import { T as TextSelection } from "./chunks/converter-ClnqoStR.js";
-import { _ as _export_sfc } from "./chunks/editor-DLan-MJ6.js";
+import { _ as _export_sfc } from "./chunks/editor-Co2_vpme.js";
 const DEFAULT_API_ENDPOINT = "https://sd-dev-express-gateway-i6xtm.ondigitalocean.app/insights";
 const SYSTEM_PROMPT = "You are an expert copywriter and you are immersed in a document editor. You are to provide document related text responses based on the user prompts. Only write what is asked for. Do not provide explanations. Try to keep placeholders as short as possible. Do not output your prompt. Your instructions are: ";
 async function baseInsightsFetch(payload, options = {}) {

package/dist/super-editor/chunks/{editor-DLan-MJ6.js → editor-Co2_vpme.js}

@@ -17525,7 +17525,7 @@ const StructuredContentCommands = Extension.create({
        * This will update every field that matches the given alias.
        * If any updated node does not match the schema, no updates will be applied.
        * @category Command
-       * @param {string} alias - Shared identifier for fields (e.g., "customer_name")
+       * @param {string | string[]} alias - Shared identifier for fields (e.g., "customer_name")
        * @param {StructuredContentUpdate} options
        */
       updateStructuredContentByAlias: (alias, options = {}) => ({ editor, dispatch, state, tr }) => {
@@ -17534,35 +17534,39 @@ const StructuredContentCommands = Extension.create({
           return true;
         }
         const { schema } = editor;
-        const updates = [];
-        for (const { pos, node } of structuredContentTags) {
-          let content = null;
+        const createContent = (node) => {
           if (options.text) {
-            content = schema.text(options.text);
+            return schema.text(options.text);
           }
           if (options.html) {
             const html = htmlHandler(options.html, editor);
             const doc2 = DOMParser$1.fromSchema(schema).parse(html);
-            content = doc2.content;
+            return doc2.content;
           }
           if (options.json) {
-            content = schema.nodeFromJSON(options.json);
-          }
-          if (!content) {
-            content = node.content;
+            return schema.nodeFromJSON(options.json);
           }
+          return node.content;
+        };
+        for (const { node } of structuredContentTags) {
+          const content = createContent(node);
           const updatedNode = node.type.create({ ...node.attrs, ...options.attrs }, content, node.marks);
           try {
             updatedNode.check();
-            updates.push({ pos, node: updatedNode, size: node.nodeSize });
           } catch {
             console.error("Updated node does not conform to the schema");
             return false;
           }
         }
         if (dispatch) {
-          updates.reverse().forEach(({ pos, node, size }) => {
-            tr.replaceWith(pos, pos + size, node);
+          structuredContentTags.forEach(({ pos, node }) => {
+            const mappedPos = tr.mapping.map(pos);
+            const currentNode = tr.doc.nodeAt(mappedPos);
+            if (currentNode && node.eq(currentNode)) {
+              const content = createContent(node);
+              const updatedNode = node.type.create({ ...node.attrs, ...options.attrs }, content, node.marks);
+              tr.replaceWith(mappedPos, mappedPos + node.nodeSize, updatedNode);
+            }
           });
         }
         return true;

package/dist/super-editor/chunks/{toolbar-CekMv4Mk.js → toolbar-Bevq4gO1.js}

@@ -1,6 +1,6 @@
 import { computed, createElementBlock, openBlock, createElementVNode, createCommentVNode, normalizeClass, normalizeStyle, ref, withKeys, unref, withModifiers, createBlock, toDisplayString, withDirectives, vModelText, nextTick, getCurrentInstance, createVNode, readonly, watch, onMounted, onBeforeUnmount, reactive, onBeforeMount, inject, onActivated, onDeactivated, createTextVNode, Fragment, Comment, defineComponent, provide, h, Teleport, toRef, renderSlot, isVNode, shallowRef, watchEffect, mergeProps, Transition, vShow, cloneVNode, Text, renderList, withCtx } from "vue";
 import { p as process$1 } from "./converter-ClnqoStR.js";
-import { _ as _export_sfc, u as useHighContrastMode, g as global$1 } from "./editor-DLan-MJ6.js";
+import { _ as _export_sfc, u as useHighContrastMode, g as global$1 } from "./editor-Co2_vpme.js";
 const sanitizeNumber = (value, defaultNumber) => {
   let sanitized = value.replace(/[^0-9.]/g, "");
   sanitized = parseFloat(sanitized);
@@ -278,7 +278,7 @@ const _sfc_main$4 = {
     };
     const handleInputSubmit = () => {
       const value = inlineTextInput.value;
-      const cleanValue = value.replace(/[^0-9]/g, "");
+      const cleanValue = value.match(/^\d+(\.5)?$/) ? value : Math.floor(parseFloat(value)).toString();
       emit("textSubmit", cleanValue);
       inlineTextInput.value = cleanValue;
     };
@@ -360,7 +360,7 @@ const _sfc_main$4 = {
     };
   }
 };
-const ToolbarButton = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-303b3245"]]);
+const ToolbarButton = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-cea02a58"]]);
 const _hoisted_1$2 = {
   class: "toolbar-separator",
   role: "separator",

package/dist/super-editor/editor.es.js

@@ -1,4 +1,4 @@
-import { E } from "./chunks/editor-DLan-MJ6.js";
+import { E } from "./chunks/editor-Co2_vpme.js";
 import "./chunks/converter-ClnqoStR.js";
 import "./chunks/docx-zipper-DC28ucAi.js";
 export {

package/dist/super-editor/style.css

@@ -64,20 +64,20 @@
   width: 16px;
 }
 
-.toolbar-item[data-v-303b3245] {
+.toolbar-item[data-v-cea02a58] {
   position: relative;
   z-index: 1;
   min-width: 30px;
   margin: 0 1px;
 }
-.visually-hidden[data-v-303b3245] {
+.visually-hidden[data-v-cea02a58] {
   position: absolute;
   left: -9999px;
   height: 1px;
   width: 1px;
   overflow: hidden;
 }
-.toolbar-button[data-v-303b3245] {
+.toolbar-button[data-v-cea02a58] {
   padding: 5px;
   height: 32px;
   max-height: 32px;
@@ -93,21 +93,21 @@
   position: relative;
   box-sizing: border-box;
 }
-.toolbar-button[data-v-303b3245]:hover {
+.toolbar-button[data-v-cea02a58]:hover {
   background-color: #dbdbdb;
 }
-.toolbar-button:hover .toolbar-icon.high-contrast[data-v-303b3245] {
+.toolbar-button:hover .toolbar-icon.high-contrast[data-v-cea02a58] {
       color: #fff;
 }
-.toolbar-button:hover.high-contrast[data-v-303b3245] {
+.toolbar-button:hover.high-contrast[data-v-cea02a58] {
     background-color: #000;
     color: #fff;
 }
-.toolbar-button[data-v-303b3245]:active,
-.active[data-v-303b3245] {
+.toolbar-button[data-v-cea02a58]:active,
+.active[data-v-cea02a58] {
   background-color: #c8d0d8;
 }
-.button-label[data-v-303b3245] {
+.button-label[data-v-cea02a58] {
   overflow: hidden;
   width: 100%;
   text-align: center;
@@ -117,37 +117,37 @@
   font-size: 15px;
   margin: 5px;
 }
-.toolbar-icon + .dropdown-caret[data-v-303b3245] {
+.toolbar-icon + .dropdown-caret[data-v-cea02a58] {
   margin-left: 4px;
 }
-.left[data-v-303b3245],
-.right[data-v-303b3245] {
+.left[data-v-cea02a58],
+.right[data-v-cea02a58] {
   width: 50%;
   height: 100%;
   background-color: #dbdbdb;
   border-radius: 60%;
 }
-.has-inline-text-input[data-v-303b3245]:hover {
+.has-inline-text-input[data-v-cea02a58]:hover {
   cursor: text;
 }
-.disabled[data-v-303b3245] {
+.disabled[data-v-cea02a58] {
   cursor: default;
 }
-.disabled[data-v-303b3245]:hover {
+.disabled[data-v-cea02a58]:hover {
   cursor: default;
   background-color: initial;
 }
-.disabled .toolbar-icon[data-v-303b3245],
-.disabled .caret[data-v-303b3245],
-.disabled .button-label[data-v-303b3245] {
+.disabled .toolbar-icon[data-v-cea02a58],
+.disabled .caret[data-v-cea02a58],
+.disabled .button-label[data-v-cea02a58] {
   opacity: 0.35;
 }
-.caret[data-v-303b3245] {
+.caret[data-v-cea02a58] {
   font-size: 1em;
   padding-left: 2px;
   padding-right: 2px;
 }
-.button-text-input[data-v-303b3245] {
+.button-text-input[data-v-cea02a58] {
   color: #47484a;
   border-radius: 4px;
   text-align: center;
@@ -161,13 +161,13 @@
   border: 1px solid #d8dee5;
   box-sizing: border-box;
 }
-.button-text-input.high-contrast[data-v-303b3245] {
+.button-text-input.high-contrast[data-v-cea02a58] {
     background-color: #fff;
 }
-.button-text-input[data-v-303b3245]::placeholder {
+.button-text-input[data-v-cea02a58]::placeholder {
   color: #47484a;
 }
-.dropdown-caret[data-v-303b3245] {
+.dropdown-caret[data-v-cea02a58] {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -177,16 +177,16 @@
   height: 10px;
 }
 @media (max-width: 1280px) {
-.toolbar-item--doc-mode .button-label[data-v-303b3245] {
+.toolbar-item--doc-mode .button-label[data-v-cea02a58] {
     display: none;
 }
-.toolbar-item--doc-mode .toolbar-icon[data-v-303b3245] {
+.toolbar-item--doc-mode .toolbar-icon[data-v-cea02a58] {
     margin-right: 5px;
 }
-.toolbar-item--linked-styles[data-v-303b3245] {
+.toolbar-item--linked-styles[data-v-cea02a58] {
     width: auto !important;
 }
-.toolbar-item--linked-styles .button-label[data-v-303b3245] {
+.toolbar-item--linked-styles .button-label[data-v-cea02a58] {
     display: none;
 }
 }
@@ -1123,6 +1123,13 @@ on the right if it is inside shape textbox.
   white-space: nowrap;
   text-overflow: ellipsis;
 }
+.ProseMirror.view-mode .sd-document-section-block {
+  background: none;
+  border: none;
+}
+.ProseMirror.view-mode .sd-document-section-block-info {
+  display: none;
+}
 .sd-structured-content,
 .sd-structured-content-block {
   padding: 1px;
@@ -1166,6 +1173,14 @@ on the right if it is inside shape textbox.
 .sd-structured-content-block:hover .sd-structured-content-draggable {
   display: inline-flex;
 }
+.ProseMirror.view-mode .sd-structured-content,
+.ProseMirror.view-mode .sd-structured-content-block {
+  padding: 0;
+  border: none;
+}
+.ProseMirror.view-mode .sd-structured-content-draggable {
+  display: none;
+}
 
 .alignment-buttons[data-v-d84f57b6] {
   display: flex;