legalesign-document-viewer 1.0.7 → 1.0.9

package/dist/esm/ls-document-viewer.entry.js

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, a as getElement, h, H as Host } from './index-CItPoq74.js';
-import { d as dvI18n } from './i18n-WVWIAGo_.js';
-import { o as oob, m as moveField, u as updateTemplate, r as recalculateCoordinates, s as syncRoles, b as matchData, v as validate, g as getInputType, c as getApiType, d as addField, e as getTemplate } from './editorUtils-DF1r6W-l.js';
+import { d as dvI18n } from './i18n-CTJakSNy.js';
+import { o as oob, m as moveField, u as updateTemplate, r as recalculateCoordinates, s as syncRoles, b as matchData, v as validate, g as getInputType, c as getApiType, d as addField, e as getTemplate } from './editorUtils-t6aFqPXA.js';
 import { D as DEFAULT_FONT_SIZE$1, a as DEFAULT_FONT_NAME, F as FIELD_DEFAULTS } from './fieldDefaults-04cXI5GQ.js';
-import { c as copySelected, a as cutSelected, p as pasteClipboard, u as updateSelectionBox, t as toolboxDragStart, m as mouseClick, b as mouseDown, d as mouseMove, e as mouseUp, f as mouseDoubleClick } from './mouseHandlers-Bwr3Oepx.js';
+import { c as copySelected, a as cutSelected, p as pasteClipboard, u as updateSelectionBox, t as toolboxDragStart, m as mouseClick, b as mouseDown, d as mouseMove, e as mouseUp, f as mouseDoubleClick } from './mouseHandlers-CXAZ6jqT.js';
 import { r as redo, a as undo, b as recordMutations, c as canRedo, d as canUndo, e as clearHistory } from './history-CmJjDhcp.js';
 import './defaultPalette-CwCWCxsI.js';
 
@@ -30468,7 +30468,7 @@ async function checkWitness(defaultExperience) {
     await Promise.all(witActions);
 }
 
-const lsDocumentViewerCss = () => `*,*::before,*::after{box-sizing:border-box}*{margin:0}@media (prefers-reduced-motion: no-preference){html{interpolate-size:allow-keywords}}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}#root,#__next{isolation:isolate}:host{display:flex;flex-direction:column;width:100%;height:100vh;position:relative;overflow:hidden;container-type:size;font-family:var(--font-family, "IBM Plex Sans", sans-serif);font-size:var(--text-sm);margin:0px;padding:0px}:host *{scrollbar-width:none}:host *::-webkit-scrollbar{display:none}.ls-dv-left-slot-wrapper{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);z-index:2000}slot{justify-content:center;align-items:center;border-radius:1rem;font-size:0.75rem;font-style:normal;font-weight:500;line-height:1.25rem;width:fit-content;background-color:var(--green-30, #9df5d4);color:var(--green-100, #125241)}.ls-dv-right-slot-wrapper{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);z-index:2000}.ls-dv-validation-tag-wrapper{position:absolute;top:1rem;right:1rem;z-index:2000;display:flex;width:100%;align-items:center;justify-content:center;padding:0.375rem;gap:0.5rem;width:fit-content;border-radius:1.25rem;border:1px solid var(--gray-20, #edeff2);background:var(--white, #ffffff);box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)}.ls-dv-page-loader{position:absolute;display:flex;top:0;left:0;align-items:center;justify-content:center;background-color:rgba(251, 251, 251, 0.3);backdrop-filter:blur(2px);height:100%;width:100%;z-index:4000}.ls-dv-custom-loader-slot{position:absolute;top:0;left:0;height:100%;width:100%;z-index:3999}#pdf-canvas{top:0px;left:0px;width:6.25rem;height:6.25rem;box-shadow:0 0.5rem 2rem 0 rgba(0, 0, 0, 0.12)}#ls-mid-area{position:absolute;top:0;left:0;display:flex;flex-direction:column;align-items:center;width:100%;height:100%;overflow:hidden}.ls-dv-document-frame-wrapper{display:flex;flex-direction:column;justify-content:start;align-items:start;overflow:visible;max-height:100%;width:100%;overflow:scroll;padding:5rem 23.75rem 2rem 23.75rem;position:relative;user-select:none;-webkit-user-select:none}.ls-dv-document-frame-wrapper--preview{align-items:center;padding:2rem}.ls-dv-select-menu-position{position:absolute;top:0;left:calc(100% + 0.5rem);z-index:999}.ls-dv-select-menu-floating{z-index:999;pointer-events:auto}#ls-document-frame{position:relative;height:98cqh;margin-right:auto;margin-left:auto}.ls-dv-prev-button{position:relative;bottom:1.875rem}.ls-dv-next-button{position:relative;bottom:1.875rem}.ls-dv-field-box{z-index:1000}#ls-box-selector{position:absolute;visibility:hidden;background-color:color-mix(in srgb, var(--primary-20, #c7ddff) 20%, transparent);border:1px dashed var(--primary-50, #5185ff)}#ls-drag-selector{position:absolute;visibility:hidden;background-color:color-mix(in srgb, var(--primary-20, #c7ddff) 20%, transparent);border:1px dashed var(--primary-50, #5185ff)}#ls-editor-form{display:flex;width:100%;height:calc(100cqh - 2.25rem);min-height:0;position:relative;overflow:hidden;background:var(--gray-10, #f7f8fa);box-shadow:0 2px 6px 0 rgba(0, 0, 0, 0.04) inset, 0 10px 15px 0 rgba(0, 0, 0, 0.04) inset}.ls-dv-hidden{visibility:hidden;display:none;width:0px}.ls-dv-page-header{position:relative;display:flex;height:2.25rem;gap:0.5rem;padding:0.25rem 0.75rem;justify-content:center;align-items:center}.ls-dv-header-text-1{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem}.ls-dv-header-text-2{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:400;line-height:1.25rem}.ls-dv-expand-fields-row{display:flex;align-items:center;gap:0.5rem;padding:0.5rem;cursor:pointer;color:var(--gray-80, #6f7176);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.ls-dv-expand-fields-row p{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem;}p{color:var(--gray-80, #6f7176);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.ls-dv-button-link,.ls-dv-button-link:hover{all:unset}select{appearance:none;height:2.25rem}.ls-dv-input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6f7176)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6f7176)}.ls-dv-has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.625rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #ffffff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #ffffff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type=checkbox]{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type=checkbox]:checked,input[type=checkbox].ls-dv-indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type=checkbox]:checked::after{content:"";position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type=checkbox].ls-dv-indeterminate::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type=checkbox]:checked:hover,input[type=checkbox].ls-dv-indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type=checkbox]:hover{border:1px solid #9ca3af}input[type=checkbox]:focus,input[type=checkbox]:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type=checkbox]:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type=checkbox]:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.ls-dv-checkbox-container{display:flex;gap:0.5rem;width:100%}.ls-dv-checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.ls-dv-form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.ls-dv-form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.ls-dv-loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100%;color:var(--primary-60, #4456f6)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.ls-dv-tertiary-grey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #6f7176)}button.ls-dv-tertiary-grey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.ls-dv-button-group{display:flex;border-radius:0.625rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.ls-dv-button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6f7176)}.ls-dv-button-group button:hover{background:var(--gray-10, #f7f8fa)}.ls-dv-button-group>:first-child{border-radius:0.625rem 0 0 0.625rem}.ls-dv-button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.ls-dv-button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}.ls-dv-error-state{position:absolute;display:flex;top:0;left:0;align-items:center;justify-content:center;height:100%;width:100%;z-index:4000;background-color:var(--gray-10, #f7f8fa)}.ls-dv-error-card{display:flex;flex-direction:column;align-items:center;gap:0.5rem;padding:2rem;border-radius:0.75rem;background:white;box-shadow:0 0.25rem 1rem rgba(0, 0, 0, 0.08);max-width:24rem;text-align:center;color:var(--gray-80, #6f7176)}.ls-dv-error-title{color:var(--gray-100, #45484d);font-size:1.125rem;font-weight:600;line-height:1.5rem}.ls-dv-error-message{color:var(--gray-80, #6f7176);font-size:0.875rem;line-height:1.25rem}`;
+const lsDocumentViewerCss = () => `*,*::before,*::after{box-sizing:border-box}*{margin:0}@media (prefers-reduced-motion: no-preference){html{interpolate-size:allow-keywords}}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}#root,#__next{isolation:isolate}:host{display:flex;flex-direction:column;width:100%;height:100vh;position:relative;overflow:hidden;container-type:size;font-family:var(--font-family, "IBM Plex Sans", sans-serif);font-size:var(--text-sm);margin:0px;padding:0px}:host *{scrollbar-width:none}:host *::-webkit-scrollbar{display:none}.ls-dv-left-slot-wrapper{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);z-index:2000}slot{justify-content:center;align-items:center;border-radius:1rem;font-size:0.75rem;font-style:normal;font-weight:500;line-height:1.25rem;width:fit-content;background-color:var(--green-30, #9df5d4);color:var(--green-100, #125241)}.ls-dv-right-slot-wrapper{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);z-index:2000}.ls-dv-validation-tag-wrapper{position:absolute;top:1rem;right:1rem;z-index:2000;display:flex;width:100%;align-items:center;justify-content:center;padding:0.375rem;gap:0.5rem;width:fit-content;border-radius:1.25rem;border:1px solid var(--gray-20, #edeff2);background:var(--white, #ffffff);box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)}.ls-dv-page-loader{position:absolute;display:flex;top:0;left:0;align-items:center;justify-content:center;background-color:rgba(251, 251, 251, 0.3);backdrop-filter:blur(2px);height:100%;width:100%;z-index:4000}.ls-dv-custom-loader-slot{position:absolute;top:0;left:0;height:100%;width:100%;z-index:3999}#pdf-canvas{top:0px;left:0px;width:6.25rem;height:6.25rem;box-shadow:0 0.5rem 2rem 0 rgba(0, 0, 0, 0.12)}#ls-mid-area{position:absolute;top:0;left:0;display:flex;flex-direction:column;align-items:center;width:100%;height:100%;overflow:hidden}.ls-dv-document-frame-wrapper{display:flex;flex-direction:column;justify-content:start;align-items:start;overflow:visible;max-height:100%;width:100%;overflow:scroll;padding:5rem 23.75rem 2rem 23.75rem;position:relative;user-select:none;-webkit-user-select:none}.ls-dv-document-frame-wrapper--preview{align-items:center;padding:0 2rem}:host(.ls-dv-preview-mode) #ls-editor-form{height:100cqh}.ls-dv-select-menu-position{position:absolute;top:0;left:calc(100% + 0.5rem);z-index:999}.ls-dv-select-menu-floating{z-index:999;pointer-events:auto}#ls-document-frame{position:relative;height:98cqh;margin-right:auto;margin-left:auto}.ls-dv-prev-button{position:relative;bottom:1.875rem}.ls-dv-next-button{position:relative;bottom:1.875rem}.ls-dv-field-box{z-index:1000}#ls-box-selector{position:absolute;visibility:hidden;background-color:color-mix(in srgb, var(--primary-20, #c7ddff) 20%, transparent);border:1px dashed var(--primary-50, #5185ff)}#ls-drag-selector{position:absolute;visibility:hidden;background-color:color-mix(in srgb, var(--primary-20, #c7ddff) 20%, transparent);border:1px dashed var(--primary-50, #5185ff)}#ls-editor-form{display:flex;width:100%;height:calc(100cqh - 2.25rem);min-height:0;position:relative;overflow:hidden;background:var(--gray-10, #f7f8fa);box-shadow:0 2px 6px 0 rgba(0, 0, 0, 0.04) inset, 0 10px 15px 0 rgba(0, 0, 0, 0.04) inset}.ls-dv-hidden{visibility:hidden;display:none;width:0px}.ls-dv-page-header{position:relative;display:flex;height:2.25rem;gap:0.5rem;padding:0.25rem 0.75rem;justify-content:center;align-items:center}.ls-dv-header-text-1{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem}.ls-dv-header-text-2{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:400;line-height:1.25rem}.ls-dv-expand-fields-row{display:flex;align-items:center;gap:0.5rem;padding:0.5rem;cursor:pointer;color:var(--gray-80, #6f7176);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.ls-dv-expand-fields-row p{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem;}p{color:var(--gray-80, #6f7176);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.ls-dv-button-link,.ls-dv-button-link:hover{all:unset}select{appearance:none;height:2.25rem}.ls-dv-input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6f7176)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6f7176)}.ls-dv-has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.625rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #ffffff)}input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #ffffff)}input:active,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}input[type=checkbox]{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type=checkbox]:checked,input[type=checkbox].ls-dv-indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type=checkbox]:checked::after{content:"";position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type=checkbox].ls-dv-indeterminate::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type=checkbox]:checked:hover,input[type=checkbox].ls-dv-indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type=checkbox]:hover{border:1px solid #9ca3af}input[type=checkbox]:focus,input[type=checkbox]:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type=checkbox]:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type=checkbox]:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.ls-dv-checkbox-container{display:flex;gap:0.5rem;width:100%}.ls-dv-checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.ls-dv-form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.ls-dv-form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.ls-dv-loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100%;color:var(--primary-60, #4456f6)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.ls-dv-tertiary-grey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #6f7176)}button.ls-dv-tertiary-grey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.ls-dv-button-group{display:flex;border-radius:0.625rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.ls-dv-button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6f7176)}.ls-dv-button-group button:hover{background:var(--gray-10, #f7f8fa)}.ls-dv-button-group>:first-child{border-radius:0.625rem 0 0 0.625rem}.ls-dv-button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.ls-dv-button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}.ls-dv-error-state{position:absolute;display:flex;top:0;left:0;align-items:center;justify-content:center;height:100%;width:100%;z-index:4000;background-color:var(--gray-10, #f7f8fa)}.ls-dv-error-card{display:flex;flex-direction:column;align-items:center;gap:0.5rem;padding:2rem;border-radius:0.75rem;background:white;box-shadow:0 0.25rem 1rem rgba(0, 0, 0, 0.08);max-width:24rem;text-align:center;color:var(--gray-80, #6f7176)}.ls-dv-error-title{color:var(--gray-100, #45484d);font-size:1.125rem;font-weight:600;line-height:1.5rem}.ls-dv-error-message{color:var(--gray-80, #6f7176);font-size:0.875rem;line-height:1.25rem}`;
 
 // Polyfill URL.parse for older browsers (used by pdfjs-dist)
 if (typeof URL.parse !== 'function') {
@@ -30592,6 +30592,7 @@ const LsDocumentViewer = class {
     selected = [];
     isLoading = true;
     isMutating = false;
+    loaderSize = 200;
     selectedDataItems = [];
     fieldTypeSelected = {
         label: 'Signature',
@@ -31403,7 +31404,17 @@ const LsDocumentViewer = class {
         if (this.token && !this._template)
             this.load();
     }
-    componentDidLoad() { }
+    _resizeObserver;
+    componentDidLoad() {
+        this._resizeObserver = new ResizeObserver(entries => {
+            const { width, height } = entries[0].contentRect;
+            this.loaderSize = Math.min(200, Math.floor(Math.min(width, height) * 0.4));
+        });
+        this._resizeObserver.observe(this.component);
+    }
+    disconnectedCallback() {
+        this._resizeObserver?.disconnect();
+    }
     handleManagerChange(manager) {
         this.manager = manager;
     }
@@ -31422,12 +31433,12 @@ const LsDocumentViewer = class {
             return false;
     }
     render() {
-        return (h(Host, { key: '1c9984bf147503f2979dc5591f140514f3a38d9f' }, h(h.Fragment, null, this.isLoading && (h(h.Fragment, null, h("div", { key: '7d33135c3fdf99a71d72f25b5c28e49ecc3867be', class: 'ls-dv-page-loader' }, h("ls-loading-logo", { key: '8990a520c84835b97b4d3cd4ea84a6f94968c45b', size: 200, colour: "var(--primary-60)" })), h("div", { key: '29641895ac2d52d69183a07123d27e6566c17d97', class: 'ls-dv-custom-loader-slot' }, h("slot", { key: '7bef6ef95e5d3e8792118288ad69d64ae6c883b3', name: "custom-loader" })), this.mode === 'compose' && h("ls-compose-loader", { key: '2c92baf059816aa925265f3a4c284d819ebb02e6' }))), this.error && (h("div", { key: 'ba8f19052b333c14077ba661b47141eedd751cc3', class: "ls-dv-error-state" }, h("div", { key: 'e7f5b45617ea473575c3999e610e8ac9d9a3e662', class: "ls-dv-error-card" }, h("ls-icon", { key: 'a0d262e3b0ac53362ff51476268a8046840b1069', name: "exclamation-circle-icon", size: 32, style: { color: 'var(--red-60, #dc2626)' } }), h("p", { key: 'e5b119fba5d291231791f9956d8304a3bebf3b05', class: "ls-dv-error-title" }, this.errorTitle), h("p", { key: 'e260583526bdc4ad7f7cb28601af606a50ee5037', class: "ls-dv-error-message" }, this.error)))), h("div", { key: 'ab6eae0fb397f32330b3bfb3c17f8297b0e14bdc', class: "ls-dv-page-header" }, h("div", { key: 'ac7d6391d6dc3e0c59550032c959ef10672f93e1', class: 'ls-dv-left-slot-wrapper' }, h("slot", { key: '3100fd24301ab2781ab3bbe63f3654d4475c4726', name: "left-button" })), h("div", { key: '3948a22df5ee5f8c1dde92645407ae6095a947c3', class: 'ls-dv-right-slot-wrapper' }, h("slot", { key: '06eb1fc89813e466a4752d355d21f55a3880c5f3', name: "right-button" })), this.mode === 'editor' && (h("div", { key: '7f3d54c519be843dcf5cd903ac85f8b5ff3017f5' }, h("span", { key: '626fef0097d482620b136eaba0f5a833d5e13ba5', class: "ls-dv-header-text-1" }, dvI18n.t('viewer.templatecreation')), h("span", { key: '53ea6ffbb0302a460980e332cee7e5540bed390d' }, "/"), h("span", { key: 'f2df918d17814b9ad977eb4865ac42b27ab67772', class: "ls-dv-header-text-2" }, this._template?.title))), this.mode === 'compose' && (h("div", { key: '8cdd65e6001ecb5b44a7b67849d44e358a7e5730', style: { display: 'flex', alignItems: 'center', gap: '0.25rem' } }, h("slot", { key: '40bb1ee712a356a4bfeac8da94e7fd8463a05285', name: "top-bar" })))), h("form", { key: '7f5299608155174f9db6625ca4d36678c8de4e62', id: "ls-editor-form" }, h("ls-left-bar", { key: '77e10b47bac609bc88e80c2f18c7e347329a31a3', mode: this.mode, selected: this.selected, manager: this.manager, signer: this.signer, filtertoolbox: this.filtertoolbox, template: this._template, recipients: this._recipients, validationErrors: this.validationErrors, fieldTypeSelected: this.fieldTypeSelected, displayTable: this.displayTable, selectedDataItems: this.selectedDataItems, busy: this.isMutating, onManagerChange: e => this.handleManagerChange(e.detail), onClearSelected: () => {
+        return (h(Host, { key: 'd734589f21701f8842ff21fd0ac3bc57910bd2c0', class: { 'ls-dv-preview-mode': this.mode === 'preview' } }, h(h.Fragment, null, this.isLoading && (h(h.Fragment, null, h("div", { key: '6b23095cce9f80d65cc87b4faf91026652f142cb', class: 'ls-dv-page-loader' }, h("ls-loading-logo", { key: 'eb04b9206ef97083fce40574ebb40a8edf43f9d1', size: this.loaderSize, colour: "var(--primary-60)" })), h("div", { key: '0af81d1b030f2400814b2d473723cb4363bb602d', class: 'ls-dv-custom-loader-slot' }, h("slot", { key: '799c57bd60af30258893249ad79e744f388e6dac', name: "custom-loader" })), this.mode === 'compose' && h("ls-compose-loader", { key: 'e74211a77b7ead319e51bcfc5afc28f25ed441a5' }))), this.error && (h("div", { key: 'd144ffbf258f67471a3e8586026539c9a2ec2a13', class: "ls-dv-error-state" }, h("div", { key: '3f079e5d855dd5f8eba85d3c16fe8f13a9e3e1fd', class: "ls-dv-error-card" }, h("ls-icon", { key: 'ab4e94ed151e1bc97525c0d411c184f19ed91568', name: "exclamation-circle-icon", size: 32, style: { color: 'var(--red-60, #dc2626)' } }), h("p", { key: 'aa24a956c9ebd3074855dbb242b3967282f0525c', class: "ls-dv-error-title" }, this.errorTitle), h("p", { key: '4e25d629fbc1fa4eae29e66a46787a60c8168862', class: "ls-dv-error-message" }, this.error)))), this.mode !== 'preview' && (h("div", { key: '789a5c3f027fad8525e1e78f9f6398669e8a4904', class: "ls-dv-page-header" }, h("div", { key: '5175792e24c98fa7f7a94fb0b659acf885d7d814', class: 'ls-dv-left-slot-wrapper' }, h("slot", { key: '64befda9960e0fd65cf6d2e00243ce7d3b4fb81c', name: "left-button" })), h("div", { key: '6e31a97e1d7cea55753e817989483a9c43dba7c1', class: 'ls-dv-right-slot-wrapper' }, h("slot", { key: '41643bf4389b31651e53ad5624329c31d30ea412', name: "right-button" })), this.mode === 'editor' && (h("div", { key: '3d29c1a560cc02004aad498b4cbe7bf89c4a9e50' }, h("span", { key: '64dfbc6b09d33376f8a6c260cff2388f3f0975c8', class: "ls-dv-header-text-1" }, dvI18n.t('viewer.templatecreation')), h("span", { key: 'e73339a4c2ed2e074ed005242c078504e5ce1157' }, "/"), h("span", { key: '5e710d23a37d8273c06734514aa7e2735fbb6c69', class: "ls-dv-header-text-2" }, this._template?.title))), this.mode === 'compose' && (h("div", { key: '2aded4d932f536ab2537638d77225a6891a2bf11', style: { display: 'flex', alignItems: 'center', gap: '0.25rem' } }, h("slot", { key: 'fb6aa36cc708ce2edb8fc757015abaa2b79b47f3', name: "top-bar" }))))), h("form", { key: 'bd78ca4c151d1d8a55adacf4f3700b9682cab687', id: "ls-editor-form" }, h("ls-left-bar", { key: '9099ccbcbb93d38e0b9b22f019dc7ef2ed92b053', mode: this.mode, selected: this.selected, manager: this.manager, signer: this.signer, filtertoolbox: this.filtertoolbox, template: this._template, recipients: this._recipients, validationErrors: this.validationErrors, fieldTypeSelected: this.fieldTypeSelected, displayTable: this.displayTable, selectedDataItems: this.selectedDataItems, busy: this.isMutating, onManagerChange: e => this.handleManagerChange(e.detail), onClearSelected: () => {
                 this.unselect();
                 const toolbar = this.component.shadowRoot.getElementById('ls-toolbar');
                 if (toolbar)
                     toolbar.dataItem = [];
-            } }, h("slot", { key: '0f1fa9523db6632cdd035684f091b8e45567bb83', name: "recipient-panel", slot: "recipient-panel" })), h("ls-toolbar", { key: '83744e49b7872db1c2d73ea5aa8c5d63c9081519', id: "ls-toolbar", template: this._template, editor: this, groupInfo: this.groupInfo, mode: this.mode, signer: this.signer, selected: this.selected, pageNum: this.pageNum }), h("div", { key: '886d632ca40c9bbecc176cf64e197c92cb1795ee', id: "ls-mid-area" }, h("div", { key: '5af07dd82b20bcc0e28e8c7e64a570b2cd5a0bf7', class: { 'ls-dv-document-frame-wrapper': true, 'ls-dv-document-frame-wrapper--preview': this.mode === 'preview' }, id: "document-frame-wrapper" }, h("div", { key: '3873b725f4a85956bd2191e92c18ce9f5c8d4756', id: "ls-document-frame" }, h("canvas", { key: 'ba49a53daecf0bba5dc836f6247059374656ed54', id: "pdf-canvas", class: this.displayTable || this.isLoading ? 'ls-dv-hidden' : '' }), h("ls-editor-table", { key: '6fdc6a2ddf91b8146689e708cffd70197f358d50', editor: this, class: this.displayTable ? '' : 'ls-dv-hidden' }), h("div", { key: '71247cc36b357ee37ebfb44c5e32bf63b0db9c75', id: "ls-box-selector" }), h("div", { key: '08a521f79281736b46a3a8f7fc5f56bfd7cae6f4', id: "ls-drag-selector" }), this.mode !== 'preview' && !this._template?.locked && !this.isLoading && this._template?.elementConnection?.templateElements?.length > 0 && (h("ls-select-menu", { key: '73529d16cbc7acec207429d0e2f04fcbb12851b5', class: "ls-dv-select-menu-position", selected: this.selected, pageNum: this.pageNum, editor: this })), this.mode !== 'preview' && !this._template?.locked && !this.isLoading && this._template?.elementConnection?.templateElements?.length > 0 && (h("ls-select-menu", { key: 'b73febb91ce6ecb8b2bbdf7ebeac096819adc2f6', class: "ls-dv-select-menu-floating", selected: this.selected, pageNum: this.pageNum, editor: this, floating: true })))), h("ls-statusbar", { key: '823577c9cc7ec7b87dab69ae131afddc0ffb4de8', editor: this, page: this.pageNum, pageCount: this.pageCount, mode: this.mode, canUndo: canUndo(), canRedo: canRedo() }), this.mode === 'editor' && (h("div", { key: 'b0a35c6102836f109c99f786181cdecbbc7f3b7f', class: 'ls-dv-validation-tag-wrapper' }, h("ls-validation-tag", { key: '8fa7669d0451d5a1a6736a537d8c4544656d4198', validationErrors: this.validationErrors }), h("slot", { key: '217e3a0a9ffd3ea623181529c558773315fa02ab', name: "next-button" })))))), h("ls-tooltip", { key: '1932ad5cd7739438055a03b30398fc17045216df', tooltipId: "ls-dv-tooltip" })));
+            } }, h("slot", { key: '37e04c506b0873adddea9c169c1a632a9ea9ede6', name: "recipient-panel", slot: "recipient-panel" })), h("ls-toolbar", { key: '9aa0ad70bb133613c365bf69798b5b27f51cbb27', id: "ls-toolbar", template: this._template, editor: this, groupInfo: this.groupInfo, mode: this.mode, signer: this.signer, selected: this.selected, pageNum: this.pageNum }), h("div", { key: '9c2eeaa67b5473208a9d5320b48ef604908c1df6', id: "ls-mid-area" }, h("div", { key: 'df4ba6a3410ff6edaa8538afd803dedd57fb02b9', class: { 'ls-dv-document-frame-wrapper': true, 'ls-dv-document-frame-wrapper--preview': this.mode === 'preview' }, id: "document-frame-wrapper" }, h("div", { key: 'bf48a7c3cf559b270df8864227a1d2a6a8d0143f', id: "ls-document-frame" }, h("canvas", { key: '4b7f07726adc44b8e27205ea15c08ed7087a78e0', id: "pdf-canvas", class: this.displayTable || this.isLoading ? 'ls-dv-hidden' : '' }), h("ls-editor-table", { key: 'f1eb1f06bca632256cfd867ccfb3530481221a22', editor: this, class: this.displayTable ? '' : 'ls-dv-hidden' }), h("div", { key: '4fa14c5ce6226b44c0ceb2f80b41a1d7532fd088', id: "ls-box-selector" }), h("div", { key: '9916c9ee0872f6c76618e48befa8719da3c7fb9b', id: "ls-drag-selector" }), this.mode !== 'preview' && !this._template?.locked && !this.isLoading && this._template?.elementConnection?.templateElements?.length > 0 && (h("ls-select-menu", { key: '14b56e30f7a303a73185c3ec7b9c92f3826919b3', class: "ls-dv-select-menu-position", selected: this.selected, pageNum: this.pageNum, editor: this })), this.mode !== 'preview' && !this._template?.locked && !this.isLoading && this._template?.elementConnection?.templateElements?.length > 0 && (h("ls-select-menu", { key: '40ece1aad83e25dff73755d84d113b832dc72916', class: "ls-dv-select-menu-floating", selected: this.selected, pageNum: this.pageNum, editor: this, floating: true })))), h("ls-statusbar", { key: '3c6edda9a51b4db3248e9edb9c543df4c69ee41b', editor: this, page: this.pageNum, pageCount: this.pageCount, mode: this.mode, canUndo: canUndo(), canRedo: canRedo() }), this.mode === 'editor' && (h("div", { key: '7fb7451962f8588877e98d9c7499adce82e0d008', class: 'ls-dv-validation-tag-wrapper' }, h("ls-validation-tag", { key: '6a7d69b7d842d9ce1f11fb55a3f1ec82d8971c65', validationErrors: this.validationErrors }), h("slot", { key: '55befd61a78b45f3ea6c47f79aa3153258943909', name: "next-button" })))))), h("ls-tooltip", { key: '3da47138b36d20a454b0fcd3e42d3fb439685cbd', tooltipId: "ls-dv-tooltip" })));
     }
     static get watchers() { return {
         "templateid": ["templateIdChanged"],