legalesign-document-viewer 0.10.2 → 0.10.4

package/dist/components/ls-document-viewer.js

@@ -1,56 +1,57 @@
-import { t as transformTag, p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-CLbfAJ0X.js';
-import { d as dvI18n } from './p-B8VmBxFg.js';
-import { o as oob, m as moveField, u as updateTemplate, r as recalculateCoordinates, s as syncRoles, d as defineCustomElement$L, a as matchData, g as getInputType, v as validate, b as getApiType, c as addField, e as getTemplate } from './p-MG59mYF3.js';
+import { t as transformTag, p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-DffaAVW4.js';
+import { d as dvI18n } from './p-Bp8hmhrC.js';
+import { o as oob, m as moveField, u as updateTemplate, r as recalculateCoordinates, s as syncRoles, d as defineCustomElement$M, a as matchData, g as getInputType, v as validate, b as getApiType, c as addField, e as getTemplate } from './p-C6Wto5hV.js';
 import { D as DEFAULT_FONT_SIZE$1, a as DEFAULT_FONT_NAME, F as FIELD_DEFAULTS } from './p-B3gB_457.js';
-import { u as updateSelectionBox, d as defineCustomElement$F, t as toolboxDragStart, m as mouseClick, a as mouseDown, b as mouseMove, c as mouseUp, e as mouseDoubleClick } from './p-j1rAIT-X.js';
-import { d as defineCustomElement$P } from './p-BYHrh00m.js';
-import { d as defineCustomElement$O } from './p-DLtUiUbu.js';
-import { d as defineCustomElement$N } from './p-D-mPHPaO.js';
-import { d as defineCustomElement$M } from './p-CYBhiXXl.js';
-import { d as defineCustomElement$K } from './p-DlEh2FKG.js';
-import { d as defineCustomElement$J } from './p-C5iOpglg.js';
-import { d as defineCustomElement$I } from './p-D_u1HxMf.js';
-import { d as defineCustomElement$H } from './p-DVKeLLVk.js';
-import { d as defineCustomElement$G } from './p-C0RAZYKW.js';
-import { d as defineCustomElement$E } from './p-CyQvboOz.js';
-import { d as defineCustomElement$D } from './p-DvVSXyfE.js';
-import { d as defineCustomElement$C } from './p-CQVcPp7I.js';
-import { d as defineCustomElement$B } from './p-BnrAwLD3.js';
-import { d as defineCustomElement$A } from './p-Ci6AP0jT.js';
-import { d as defineCustomElement$z } from './p-Cm69fGZy.js';
-import { d as defineCustomElement$y } from './p-DRcpbaNd.js';
-import { d as defineCustomElement$x } from './p-Ciap_aJy.js';
-import { d as defineCustomElement$w } from './p-Iy7DUSnq.js';
-import { d as defineCustomElement$v } from './p-B_88roRV.js';
-import { d as defineCustomElement$u } from './p-DPZ4R8tR.js';
-import { d as defineCustomElement$t } from './p-C5Jz_eCB.js';
-import { d as defineCustomElement$s } from './p-DdS3vht-.js';
-import { d as defineCustomElement$r } from './p-lImp2h8Q.js';
-import { d as defineCustomElement$q } from './p-CItLrDhm.js';
-import { d as defineCustomElement$p } from './p-s20HlPHN.js';
-import { d as defineCustomElement$o } from './p-C09xOzQ6.js';
-import { d as defineCustomElement$n } from './p-DvzrSyuS.js';
-import { d as defineCustomElement$m } from './p-1ddWJmvW.js';
-import { d as defineCustomElement$l } from './p-CB9tEjJy.js';
-import { d as defineCustomElement$k } from './p-CyKYlaAh.js';
-import { d as defineCustomElement$j } from './p-DdCwAPae.js';
-import { d as defineCustomElement$i } from './p-DKbMooLM.js';
-import { d as defineCustomElement$h } from './p-CoUvqjky.js';
-import { d as defineCustomElement$g } from './p-i4y_Venf.js';
-import { d as defineCustomElement$f } from './p-CczRGS7Y.js';
-import { d as defineCustomElement$e } from './p-DKhDOvYu.js';
-import { d as defineCustomElement$d } from './p-Ak82LNyC.js';
-import { d as defineCustomElement$c } from './p-1e4klocT.js';
-import { d as defineCustomElement$b } from './p-B9uklVCX.js';
-import { d as defineCustomElement$a } from './p-DYJoT5OC.js';
-import { d as defineCustomElement$9 } from './p-CF3y5NYY.js';
-import { d as defineCustomElement$8 } from './p-BKHg_nvO.js';
-import { d as defineCustomElement$7 } from './p-1dutDvgl.js';
-import { d as defineCustomElement$6 } from './p-DVM-djDm.js';
-import { d as defineCustomElement$5 } from './p-5bn-NO5u.js';
-import { d as defineCustomElement$4 } from './p-BsreOXdY.js';
-import { d as defineCustomElement$3 } from './p-CDEEN7tu.js';
-import { d as defineCustomElement$2 } from './p-BsVEdJSl.js';
+import { u as updateSelectionBox, d as defineCustomElement$G, t as toolboxDragStart, m as mouseClick, a as mouseDown, b as mouseMove, c as mouseUp, e as mouseDoubleClick } from './p-BQ7lEZmO.js';
+import { d as defineCustomElement$Q } from './p-Dw_QK-he.js';
+import { d as defineCustomElement$P } from './p-wijn7N4I.js';
+import { d as defineCustomElement$O } from './p-OiC5NHtc.js';
+import { d as defineCustomElement$N } from './p-CXxS70Mm.js';
+import { d as defineCustomElement$L } from './p-B7x-6bu5.js';
+import { d as defineCustomElement$K } from './p-BieB5Yv4.js';
+import { d as defineCustomElement$J } from './p-BNtgCuBd.js';
+import { d as defineCustomElement$I } from './p-BwJElhYd.js';
+import { d as defineCustomElement$H } from './p-rE7Q2Ue3.js';
+import { d as defineCustomElement$F } from './p-CQx0j-F_.js';
+import { d as defineCustomElement$E } from './p-K7KaIE1v.js';
+import { d as defineCustomElement$D } from './p-Ij6Uu9h8.js';
+import { d as defineCustomElement$C } from './p-uXv5wPjh.js';
+import { d as defineCustomElement$B } from './p-B4nern9h.js';
+import { d as defineCustomElement$A } from './p-COX6-Qb4.js';
+import { d as defineCustomElement$z } from './p-DwKK-L0J.js';
+import { d as defineCustomElement$y } from './p-BCNmvVjK.js';
+import { d as defineCustomElement$x } from './p-C_A1TQER.js';
+import { d as defineCustomElement$w } from './p-DYzmbr8y.js';
+import { d as defineCustomElement$v } from './p-D0k1Pz_A.js';
+import { d as defineCustomElement$u } from './p-4SVN50rZ.js';
+import { d as defineCustomElement$t } from './p-UwE-6cC0.js';
+import { d as defineCustomElement$s } from './p-COkDTfhY.js';
+import { d as defineCustomElement$r } from './p-7tNxs8No.js';
+import { d as defineCustomElement$q } from './p-BBevdiks.js';
+import { d as defineCustomElement$p } from './p-D1L3-Uvq.js';
+import { d as defineCustomElement$o } from './p-BNihuKsl.js';
+import { d as defineCustomElement$n } from './p-DVBhtEXS.js';
+import { d as defineCustomElement$m } from './p-BT5rCW3w.js';
+import { d as defineCustomElement$l } from './p-CKZG8VvW.js';
+import { d as defineCustomElement$k } from './p-lphkmIXU.js';
+import { d as defineCustomElement$j } from './p-84KTjgkl.js';
+import { d as defineCustomElement$i } from './p-DCexcYIP.js';
+import { d as defineCustomElement$h } from './p-CZF2_NGo.js';
+import { d as defineCustomElement$g } from './p-DKo99Z43.js';
+import { d as defineCustomElement$f } from './p-CuKQ9tEk.js';
+import { d as defineCustomElement$e } from './p-BnDS-Vxn.js';
+import { d as defineCustomElement$d } from './p-DqCMV_MY.js';
+import { d as defineCustomElement$c } from './p-DdsRqtRd.js';
+import { d as defineCustomElement$b } from './p-CbaxmrLQ.js';
+import { d as defineCustomElement$a } from './p-B6iYKtGO.js';
+import { d as defineCustomElement$9 } from './p-DG4uEGCg.js';
+import { d as defineCustomElement$8 } from './p-x_ncrpeq.js';
+import { d as defineCustomElement$7 } from './p-C7ZEYzas.js';
+import { d as defineCustomElement$6 } from './p-Ck-idhcY.js';
+import { d as defineCustomElement$5 } from './p-_YEZiLlm.js';
+import { d as defineCustomElement$4 } from './p-DZP-fvPJ.js';
+import { d as defineCustomElement$3 } from './p-ZtMRKgam.js';
+import { d as defineCustomElement$2 } from './p-CMop5vLm.js';
 
 /**
  * @licstart The following is the entire license notice for the
@@ -30072,7 +30073,7 @@ const Parameters = {
     endpoints: {
         graphQL: "https://dypxviim4zgwtpev7valhchaem.appsync-api.eu-west-2.amazonaws.com/graphql"}};
 
-// Construct all mutations for a template element.
+// Construct all mutations for a template element. ADMIN is for sender fields
 const createElement = element => {
     return `
   mutation AddField {
@@ -30449,7 +30450,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:100vw;height:100vh;font-family:var(--font-family, "IBM Plex Sans", sans-serif);font-size:var(--text-sm);margin:0px;padding:0px}.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:fixed;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:100vw;height:100%}.ls-dv-document-frame-wrapper{display:flex;flex-direction:column;justify-content:start;align-items:start;overflow:visible;max-height:100%;width:100vw;overflow:scroll;padding:5rem 23.75rem 2rem 23.75rem}#ls-document-frame{position:relative;height:98vh;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-editor-form{display:flex;width:100vw;height:calc(100vh - 2.25rem);position:relative;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:100vh;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:fixed;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:100vw;height:100vh;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:fixed;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:100vw;height:100%}.ls-dv-document-frame-wrapper{display:flex;flex-direction:column;justify-content:start;align-items:start;overflow:visible;max-height:100%;width:100vw;overflow:scroll;padding:5rem 23.75rem 2rem 23.75rem}#ls-document-frame{position:relative;height:98vh;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-editor-form{display:flex;width:100vw;height:calc(100vh - 2.25rem);position:relative;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:100vh;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:fixed;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') {
@@ -30609,6 +30610,9 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
     zoomChanged(newZoom) {
         const fields = this.component.shadowRoot.querySelectorAll('ls-editor-field');
         fields.forEach(f => f.setAttribute('zoom', String(newZoom)));
+        const statusbar = this.component.shadowRoot.querySelector('ls-statusbar');
+        if (statusbar)
+            statusbar.zoom = newZoom;
     }
     /**
      * Determines / sets which of the far left 'managers' is active.
@@ -30701,6 +30705,13 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
         const defaultExperience = this.groupInfo.experienceConnection.experiences.find(x => x.defaultExperience === true);
         const parent = event.detail.signerIndex > 99 ? this._template.roles.find(r => r.signerIndex === event.detail.signerIndex % 100) : null;
         const newSignerIndex = event.detail.type === 'WITNESS' ? parent.signerIndex + 100 : Math.max(...this._template.roles.filter(r => r.roleType !== 'WITNESS').map(r => r.signerIndex)) + 1;
+        const resolvedSignerIndex = event.detail.signerIndex
+            ? event.detail.signerIndex
+            : event.detail.type === 'WITNESS'
+                ? 100 + parent?.signerIndex
+                : this._template.roles.length === 0
+                    ? 1
+                    : newSignerIndex;
         const data = [
             {
                 action: 'create',
@@ -30708,13 +30719,7 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
                     id: btoa('rol' + crypto.randomUUID()),
                     name: event.detail.name ? event.detail.name : 'Signer ' + (this._template.roles.length + 1),
                     roleType: event.detail.type,
-                    signerIndex: event.detail.signerIndex
-                        ? event.detail.signerIndex
-                        : event.detail.type === 'WITNESS'
-                            ? 100 + parent?.signerIndex
-                            : this._template.roles.length === 0
-                                ? 1
-                                : newSignerIndex,
+                    signerIndex: resolvedSignerIndex,
                     ordinal: event.detail.type === 'WITNESS' ? parent?.ordinal + 1 : this._template.roles.length + 1,
                     signerParent: event.detail.parent,
                     experience: defaultExperience.id,
@@ -30723,6 +30728,8 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
             },
         ];
         this.mutate.emit(data);
+        // Auto-select the newly created participant
+        this.signer = resolvedSignerIndex;
     }
     // change the signer selected
     updateSigner(event) {
@@ -30790,16 +30797,15 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
         }
         // change style of selected fields
         const isMulti = event.detail.length > 1;
+        fields.forEach(f => f.selected = false);
         event.detail.forEach(fc => {
             const fu = this.component.shadowRoot.getElementById('ls-field-' + fc.id);
-            fu.selected = true;
-            fu.multiSelected = isMulti;
-        });
-        this.selected.forEach(s => {
-            const isSelected = event.detail.map(d => d.id).includes(s.dataItem.id);
-            s.selected = isSelected;
-            s.multiSelected = isSelected ? isMulti : false;
+            if (fu) {
+                fu.selected = true;
+                fu.multiSelected = isMulti;
+            }
         });
+        this.selected = fields.filter(fx => fx.selected);
         // Open date picker only when exactly one date field is selected
         if (event.detail.length === 1) {
             const field = this.component.shadowRoot.getElementById('ls-field-' + event.detail[0].id);
@@ -30879,6 +30885,7 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
         this.component.shadowRoot.querySelectorAll('ls-editor-field').forEach(fx => moveField.bind(this)(fx, fx.dataItem));
         this.queueRenderPage(this.pageNum);
         this.showPageFields(this.pageNum);
+        updateSelectionBox.bind(this)();
     }
     /**
      * Ensure broken or misplaced fields are put onto the page.
@@ -30913,7 +30920,11 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
         const preparedRoles = newTemplate.roles.map((ro) => {
             return { ...ro, templateId: newTemplate.id };
         });
-        this.signer = preparedRoles.length > 0 ? 1 : 0;
+        // Only set signer on initial load or if current signer no longer exists
+        const signerExistsInRoles = preparedRoles.some(r => r.signerIndex === this.signer);
+        if (!signerExistsInRoles) {
+            this.signer = preparedRoles.length > 0 ? 1 : 0;
+        }
         this._template = {
             ...newTemplate,
             elementConnection: { ...newTemplate.elementConnection, templateElements: fields },
@@ -30990,10 +31001,6 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
                 const fi = this.component.shadowRoot.getElementById('ls-field-' + update.data.id);
                 if (fi) {
                     moveField.bind(this)(fi, update.data);
-                    // const fu = this.component.shadowRoot.getElementById('ls-field-' + update.data.id) as HTMLLsEditorFieldElement;
-                    // fu.dataItem = update.data as LSApiElement;
-                    // Refresh the selected array
-                    this.selectFields.emit(this.selected.map(sf => sf.dataItem));
                     this.selected = this.selected.map(s => (s.dataItem.id === update.data.id ? fi : s));
                 }
                 // Reselect the fields - this updates the dataItem value passed to child controls
@@ -31034,6 +31041,24 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
             dropTarget.addEventListener('dblclick', mouseDoubleClick.bind(this));
             document.addEventListener('keydown', keyDown.bind(this));
         }
+        // Pinch-to-zoom (trackpad) and Ctrl/Cmd+scroll zoom
+        const wrapper = this.component.shadowRoot.getElementById('document-frame-wrapper');
+        wrapper.addEventListener('wheel', (e) => {
+            if (!e.ctrlKey && !e.metaKey)
+                return;
+            e.preventDefault();
+            const factor = e.deltaY > 0 ? 0.95 : 1.05;
+            const newZoom = Math.min(Math.max(this.zoom * factor, 0.25), 5);
+            const scale = newZoom / this.zoom;
+            // Cursor position relative to wrapper viewport
+            const rect = wrapper.getBoundingClientRect();
+            const cursorX = e.clientX - rect.left;
+            const cursorY = e.clientY - rect.top;
+            // Adjust scroll so the point under cursor stays fixed
+            wrapper.scrollLeft = (wrapper.scrollLeft + cursorX) * scale - cursorX;
+            wrapper.scrollTop = (wrapper.scrollTop + cursorY) * scale - cursorY;
+            this.setZoom(Math.round(newZoom * 1e2) / 1e2);
+        }, { passive: false });
         this.generateFields();
     }
     // Generate all the field HTML elements that are required (for every page)
@@ -31074,6 +31099,9 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
             this.initViewer();
             if (this.mode === 'compose') {
                 this.manager = 'recipient';
+                if (!this.recipients) {
+                    throw new Error('Compose mode requires a "recipients" attribute. See documentation for the expected JSON format.');
+                }
                 this._recipients = JSON.parse(this.recipients.replace('\u0022', '"')).sort((a, b) => {
                     // Signers (signerIndex < 100) come before witnesses (signerIndex >= 100) for the same base index
                     const aBase = a.signerIndex % 100 || 100;
@@ -31108,7 +31136,7 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
                 this.error = dvI18n.t('viewer.autherrormessage');
             }
             else {
-                console.error('Failed to load template.', e);
+                console.error('Failed to load template.', e?.message || e);
                 this.errorTitle = dvI18n.t('viewer.loaderror');
                 this.error = dvI18n.t('viewer.loaderrormessage');
             }
@@ -31140,9 +31168,12 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
             return false;
     }
     render() {
-        return (h(Host, { key: 'f10b1e4387e1d74b9e0f99105bbcdea5f55ed6af' }, h(h.Fragment, null, this.isLoading && (h(h.Fragment, null, h("div", { key: '65f07481274f2a39cfcc3dce4c8f253509fd53f4', class: 'ls-dv-page-loader' }, h("ls-loading-logo", { key: '27da559ff3cbfd7577b92f2644eec35704cd1df2', size: 200, colour: "var(--primary-60)" })), h("div", { key: '507790c868f9b5d34646387c797a5da78bad5e95', class: 'ls-dv-custom-loader-slot' }, h("slot", { key: '85ff564f9492b1dda01c7711c39c6bd9caf05820', name: "custom-loader" })), this.mode === 'compose' && h("ls-compose-loader", { key: '298aa4b5d120044a13c33f53eb3e51ff3380c274' }))), this.error && (h("div", { key: '75a053bcb718110b013f98973a5959b94d272bfa', class: "ls-dv-error-state" }, h("div", { key: 'b3106e8ac320801a85d66a6b0b08d5106e7854f9', class: "ls-dv-error-card" }, h("ls-icon", { key: 'b713ac66235f6e41a3832b7b78a940e6a4e3aaf3', name: "exclamation-circle-icon", size: 32, style: { color: 'var(--red-60, #dc2626)' } }), h("p", { key: 'f07cdcf105801f5e9c5e89925c863d12c80892dc', class: "ls-dv-error-title" }, this.errorTitle), h("p", { key: 'a1bc4c6681e883b128047846f55b803d4784923a', class: "ls-dv-error-message" }, this.error)))), h("div", { key: 'e0fe943901c1f7d3a583627bbe0464504087bb8d', class: "ls-dv-page-header" }, h("div", { key: 'd9ddafd019cea1656146b26dd9da05a6c3969dca', class: 'ls-dv-left-slot-wrapper' }, h("slot", { key: '52aa2936a196c30898e116914fb44f101bc94b08', name: "left-button" })), h("div", { key: '1245ab18082f53cc3c0f2b089e6375ade4257f74', class: 'ls-dv-right-slot-wrapper' }, h("slot", { key: '03604b808bb3cb063d04b398516cc085ef8d017e', name: "right-button" })), this.mode === 'editor' && (h("div", { key: '058ca32c61297803162a8c16f68031a24b069cb3' }, h("span", { key: '99ea4b4427647fefd7b209e0d3c576d92b3c4578', class: "ls-dv-header-text-1" }, dvI18n.t('viewer.templatecreation')), h("span", { key: 'ac58e45c28a5607382134ca4c316120bce089c5e' }, "/"), h("span", { key: '20240c5c1168dadd2c52d642eb4d878aab212de7', class: "ls-dv-header-text-2" }, this._template?.title))), this.mode === 'compose' && (h("div", { key: '8a456ae2999a11e1418907b34ff30460ec984f72', style: { display: 'flex', alignItems: 'center', gap: '0.25rem' } }, h("slot", { key: 'f110462c71ea578eab9e566185d11342b902b805', name: "top-bar" })))), h("form", { key: 'f420512a546ab5bee466a8fa9e7b52c9119464c1', id: "ls-editor-form" }, h("ls-left-bar", { key: 'a4bdbc5a02f2881d4936de11ffd8f142a52058f4', 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.selected = [];
-            } }, h("slot", { key: 'a92e4a6b8cd103412dadb3b32966be17e5b3cb2d', name: "recipient-panel", slot: "recipient-panel" })), h("ls-toolbar", { key: 'c6b49659874ed1f97f279b1003f0d165adc26363', id: "ls-toolbar", template: this._template, editor: this, groupInfo: this.groupInfo, mode: this.mode, signer: this.signer }), h("div", { key: 'db67e426f45ed8b886e18b42e3aaee831119ffec', id: "ls-mid-area" }, h("div", { key: 'a13cff692ecc5c0a2202a2856ec524a0baa56690', class: 'ls-dv-document-frame-wrapper', id: "document-frame-wrapper" }, h("div", { key: '222ae5f7d59c3471a78335f88b48637b413230ad', id: "ls-document-frame" }, h("canvas", { key: '90cd9b347e847f749826ca0c2ce9caee752b9988', id: "pdf-canvas", class: this.displayTable || this.isLoading ? 'ls-dv-hidden' : '' }), h("ls-editor-table", { key: '03f8360a3472a703f0902fd82faf276e1b888e7e', editor: this, class: this.displayTable ? '' : 'ls-dv-hidden' }), h("div", { key: '52f17155dad030843b99659edd358ebdb1ea98cd', id: "ls-box-selector" }))), h("ls-statusbar", { key: '98134dccb1d27c2601ca56adf5ad46014c17b4b5', editor: this, page: this.pageNum, pageCount: this.pageCount }), this.mode === 'editor' && (h("div", { key: 'dae6be50004d7e45940dde13115471c9da2705f3', class: 'ls-dv-validation-tag-wrapper' }, h("ls-validation-tag", { key: 'b5715d772d166ea5c0a03145a9443c6d8df6522a', validationErrors: this.validationErrors }), h("slot", { key: '877d71337044b6844819e0010448024b537656c8', name: "next-button" })))))), h("ls-tooltip", { key: 'b6e76a44e6db5b990eae222adeb1542982749a5f', tooltipId: "ls-dv-tooltip" })));
+        return (h(Host, { key: '77b41076a0e68016c718f4f88fdea8960ac5d58a' }, h(h.Fragment, null, this.isLoading && (h(h.Fragment, null, h("div", { key: '7043f238d43315668909e8556c060cf5ac3c6c6d', class: 'ls-dv-page-loader' }, h("ls-loading-logo", { key: 'd70a110ca68503acc7e6c41fb1c305a6e2525d21', size: 200, colour: "var(--primary-60)" })), h("div", { key: 'd25a2d7f12a3988a2eca190905587e637f60af83', class: 'ls-dv-custom-loader-slot' }, h("slot", { key: '1a801790368f6ae58837975beb9887e1514994ab', name: "custom-loader" })), this.mode === 'compose' && h("ls-compose-loader", { key: 'a99100f0ff332e5cc5e88c36c12edd2dad76a87f' }))), this.error && (h("div", { key: '0eedbf76de53076dd978574d959879c3734e86d5', class: "ls-dv-error-state" }, h("div", { key: '055099c99381b9476a20931641fd796a85ed0e8a', class: "ls-dv-error-card" }, h("ls-icon", { key: '2f44588fabb24b99ade4c32c8c98e3ef256440fe', name: "exclamation-circle-icon", size: 32, style: { color: 'var(--red-60, #dc2626)' } }), h("p", { key: '35953a684ce63dcd2149e5cd05cf2e5940d820c1', class: "ls-dv-error-title" }, this.errorTitle), h("p", { key: '6dd082db889ae6eb6c1d61696979d496ef9dff6b', class: "ls-dv-error-message" }, this.error)))), h("div", { key: '364cd5463a3ee2cef26dee987c058576d8b87f5c', class: "ls-dv-page-header" }, h("div", { key: '0eb38e1378f77331ade0eee698d8b583ec828e4f', class: 'ls-dv-left-slot-wrapper' }, h("slot", { key: '805d33e8dd45514de76e71e3409fd0f29c08e183', name: "left-button" })), h("div", { key: '88a6e659e6dd94531a4479168bc871eb5a9a789c', class: 'ls-dv-right-slot-wrapper' }, h("slot", { key: '80b80914d547a4a407b3337896b8a6d4ad9bbae2', name: "right-button" })), this.mode === 'editor' && (h("div", { key: '58babf2af10a617fb0f163e107a16ee5f2b7cc75' }, h("span", { key: '2a371774a217bdf5e2a1cf527998c265af56744d', class: "ls-dv-header-text-1" }, dvI18n.t('viewer.templatecreation')), h("span", { key: '4f4100943b3418f3d1d7398717672112667df3c4' }, "/"), h("span", { key: 'e9dd35d329e5078b0f117afac841a473b30bfa7b', class: "ls-dv-header-text-2" }, this._template?.title))), this.mode === 'compose' && (h("div", { key: '35390eead3d5b9a13e53a16d6a582e028f70b19c', style: { display: 'flex', alignItems: 'center', gap: '0.25rem' } }, h("slot", { key: 'ed69077d7ba46308616fe112716310681710e5e4', name: "top-bar" })))), h("form", { key: '34363c8d8c647b4f58719761169a7fb0065f19b9', id: "ls-editor-form" }, h("ls-left-bar", { key: 'fb3d7b7247852074b6187b81790f864dc3395469', 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: 'b5d7da082810e62465411943f347111f2609aa21', name: "recipient-panel", slot: "recipient-panel" })), h("ls-toolbar", { key: '15f5211f968144d837bf7606cb00686f41114d2e', id: "ls-toolbar", template: this._template, editor: this, groupInfo: this.groupInfo, mode: this.mode, signer: this.signer }), h("div", { key: '12c9b45ae1da1a8b1e3e161d43430d60bf9aa60d', id: "ls-mid-area" }, h("div", { key: '18ec4128885175b28a1cae0bd461f61d546bd8df', class: 'ls-dv-document-frame-wrapper', id: "document-frame-wrapper" }, h("div", { key: '7d7ce7bbcf0f3988c75d7bb2c22efcc9b53cce9f', id: "ls-document-frame" }, h("canvas", { key: '8af912eee34f36e46c60d3bac5c491e77a29dab6', id: "pdf-canvas", class: this.displayTable || this.isLoading ? 'ls-dv-hidden' : '' }), h("ls-editor-table", { key: '99200a6be0254fc49fdd5f2843f5ff069f73a3f7', editor: this, class: this.displayTable ? '' : 'ls-dv-hidden' }), h("div", { key: '06932cd2939fb999e73cb980045f9aa031e2b9ae', id: "ls-box-selector" }))), h("ls-statusbar", { key: '2562352c9961868fc05e8a9bc9fcaff15e550112', editor: this, page: this.pageNum, pageCount: this.pageCount }), this.mode === 'editor' && (h("div", { key: '554eb3146a15900333f5f956304d6799a87467de', class: 'ls-dv-validation-tag-wrapper' }, h("ls-validation-tag", { key: '8e00b63d05cfb9a392222c9424cf9481d2a11329', validationErrors: this.validationErrors }), h("slot", { key: '752849f06a35195f683b6b451d6aac20abc87acd', name: "next-button" })))))), h("ls-tooltip", { key: '2b6579a63680125000988a4708418ee1625b8c24', tooltipId: "ls-dv-tooltip" })));
     }
     static get watchers() { return {
         "language": ["languageChanged"],
@@ -31198,7 +31229,7 @@ function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["ls-document-viewer", "ls-add-new-button", "ls-button", "ls-compose-loader", "ls-document-options", "ls-editor-field", "ls-editor-table", "ls-feature-column", "ls-field-alignment", "ls-field-content", "ls-field-dimensions", "ls-field-distribute", "ls-field-footer", "ls-field-format", "ls-field-placement", "ls-field-properties", "ls-field-properties-advanced", "ls-field-properties-autosign", "ls-field-properties-container", "ls-field-properties-date", "ls-field-properties-email", "ls-field-properties-file", "ls-field-properties-general", "ls-field-properties-image", "ls-field-properties-multiple", "ls-field-properties-number", "ls-field-properties-signature", "ls-field-properties-text", "ls-field-size", "ls-field-type-display", "ls-helper-bar", "ls-icon", "ls-input-wrapper", "ls-keyboard-shortcuts", "ls-left-bar", "ls-loading", "ls-loading-icon", "ls-loading-logo", "ls-participant-card", "ls-participant-manager", "ls-participant-select", "ls-props-section", "ls-recipient-card", "ls-recipient-manager", "ls-statusbar", "ls-toggle", "ls-toolbar", "ls-toolbox-field", "ls-tooltip", "ls-validation-manager", "ls-validation-tag"];
+    const components = ["ls-document-viewer", "ls-add-new-button", "ls-button", "ls-compose-loader", "ls-document-options", "ls-editor-field", "ls-editor-table", "ls-feature-column", "ls-field-alignment", "ls-field-content", "ls-field-dimensions", "ls-field-distribute", "ls-field-footer", "ls-field-format", "ls-field-placement", "ls-field-properties", "ls-field-properties-advanced", "ls-field-properties-autosign", "ls-field-properties-container", "ls-field-properties-date", "ls-field-properties-email", "ls-field-properties-file", "ls-field-properties-general", "ls-field-properties-image", "ls-field-properties-multiple", "ls-field-properties-number", "ls-field-properties-signature", "ls-field-properties-text", "ls-field-size", "ls-field-type-display", "ls-helper-bar", "ls-icon", "ls-input-wrapper", "ls-keyboard-shortcuts", "ls-label", "ls-left-bar", "ls-loading", "ls-loading-icon", "ls-loading-logo", "ls-participant-card", "ls-participant-manager", "ls-participant-select", "ls-props-section", "ls-recipient-card", "ls-recipient-manager", "ls-statusbar", "ls-toggle", "ls-toolbar", "ls-toolbox-field", "ls-tooltip", "ls-validation-manager", "ls-validation-tag"];
     components.forEach(tagName => { switch (tagName) {
         case "ls-document-viewer":
             if (!customElements.get(transformTag(tagName))) {
@@ -31207,165 +31238,170 @@ function defineCustomElement$1() {
             break;
         case "ls-add-new-button":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$P();
+                defineCustomElement$Q();
             }
             break;
         case "ls-button":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$O();
+                defineCustomElement$P();
             }
             break;
         case "ls-compose-loader":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$N();
+                defineCustomElement$O();
             }
             break;
         case "ls-document-options":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$M();
+                defineCustomElement$N();
             }
             break;
         case "ls-editor-field":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$L();
+                defineCustomElement$M();
             }
             break;
         case "ls-editor-table":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$K();
+                defineCustomElement$L();
             }
             break;
         case "ls-feature-column":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$J();
+                defineCustomElement$K();
             }
             break;
         case "ls-field-alignment":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$I();
+                defineCustomElement$J();
             }
             break;
         case "ls-field-content":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$H();
+                defineCustomElement$I();
             }
             break;
         case "ls-field-dimensions":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$G();
+                defineCustomElement$H();
             }
             break;
         case "ls-field-distribute":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$F();
+                defineCustomElement$G();
             }
             break;
         case "ls-field-footer":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$E();
+                defineCustomElement$F();
             }
             break;
         case "ls-field-format":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$D();
+                defineCustomElement$E();
             }
             break;
         case "ls-field-placement":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$C();
+                defineCustomElement$D();
             }
             break;
         case "ls-field-properties":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$B();
+                defineCustomElement$C();
             }
             break;
         case "ls-field-properties-advanced":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$A();
+                defineCustomElement$B();
             }
             break;
         case "ls-field-properties-autosign":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$z();
+                defineCustomElement$A();
             }
             break;
         case "ls-field-properties-container":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$y();
+                defineCustomElement$z();
             }
             break;
         case "ls-field-properties-date":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$x();
+                defineCustomElement$y();
             }
             break;
         case "ls-field-properties-email":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$w();
+                defineCustomElement$x();
             }
             break;
         case "ls-field-properties-file":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$v();
+                defineCustomElement$w();
             }
             break;
         case "ls-field-properties-general":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$u();
+                defineCustomElement$v();
             }
             break;
         case "ls-field-properties-image":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$t();
+                defineCustomElement$u();
             }
             break;
         case "ls-field-properties-multiple":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$s();
+                defineCustomElement$t();
             }
             break;
         case "ls-field-properties-number":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$r();
+                defineCustomElement$s();
             }
             break;
         case "ls-field-properties-signature":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$q();
+                defineCustomElement$r();
             }
             break;
         case "ls-field-properties-text":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$p();
+                defineCustomElement$q();
             }
             break;
         case "ls-field-size":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$o();
+                defineCustomElement$p();
             }
             break;
         case "ls-field-type-display":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$n();
+                defineCustomElement$o();
             }
             break;
         case "ls-helper-bar":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$m();
+                defineCustomElement$n();
             }
             break;
         case "ls-icon":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$l();
+                defineCustomElement$m();
             }
             break;
         case "ls-input-wrapper":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$k();
+                defineCustomElement$l();
             }
             break;
         case "ls-keyboard-shortcuts":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$k();
+            }
+            break;
+        case "ls-label":
             if (!customElements.get(transformTag(tagName))) {
                 defineCustomElement$j();
             }