legalesign-document-viewer 0.9.7 → 0.9.9

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

@@ -1,50 +1,51 @@
 import { t as transformTag, p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-BhZ5Udbm.js';
-import { a as alter, o as oob, u as updateTemplate, r as recalculateCoordinates, s as syncRoles, d as defineCustomElement$I, m as matchData, v as validate, b as moveField, g as getApiType, c as addField, e as getTemplate } from './p-LsRvuNhk.js';
-import { d as defineCustomElement$C, m as mouseClick, a as mouseDown, b as mouseMove, c as mouseUp, e as mouseDoubleClick, f as mouseDrop } from './p-AOEX3hUX.js';
+import { a as alter, o as oob, u as updateTemplate, r as recalculateCoordinates, s as syncRoles, d as defineCustomElement$J, m as matchData, v as validate, b as moveField, g as getApiType, c as addField, e as getTemplate } from './p-nI-Ai-EP.js';
+import { d as defineCustomElement$D, m as mouseClick, a as mouseDown, b as mouseMove, c as mouseUp, e as mouseDoubleClick, f as mouseDrop } from './p-Bvtx16Bo.js';
 import { a as attachAllTooltips } from './p-Cb8nDMs-.js';
-import { d as defineCustomElement$K } from './p-WuO25l6V.js';
-import { d as defineCustomElement$J } from './p-B-H4NDHf.js';
-import { d as defineCustomElement$H } from './p-BuAA5rzh.js';
-import { d as defineCustomElement$G } from './p-ubk149vz.js';
-import { d as defineCustomElement$F } from './p-BwFteKUm.js';
-import { d as defineCustomElement$E } from './p-CbC-aTzj.js';
-import { d as defineCustomElement$D } from './p-DhSQ43wj.js';
-import { d as defineCustomElement$B } from './p-BvxhmYtv.js';
-import { d as defineCustomElement$A } from './p-BK_zV12S.js';
-import { d as defineCustomElement$z } from './p-CT3XMXW6.js';
-import { d as defineCustomElement$y } from './p-CnuQZry1.js';
-import { d as defineCustomElement$x } from './p-BlbYremm.js';
-import { d as defineCustomElement$w } from './p-3NwX2usU.js';
-import { d as defineCustomElement$v } from './p-Cgka-t2t.js';
-import { d as defineCustomElement$u } from './p-CFozLtG0.js';
-import { d as defineCustomElement$t } from './p-CNG_YE4L.js';
-import { d as defineCustomElement$s } from './p-DwpENz_F.js';
-import { d as defineCustomElement$r } from './p-Rnmk1CqZ.js';
-import { d as defineCustomElement$q } from './p-DET7mO8t.js';
-import { d as defineCustomElement$p } from './p-0Sscmvi5.js';
-import { d as defineCustomElement$o } from './p-BOB6nH9k.js';
-import { d as defineCustomElement$n } from './p-Dob20T4O.js';
-import { d as defineCustomElement$m } from './p-BGqmdXkA.js';
-import { d as defineCustomElement$l } from './p-DX2yeFia.js';
-import { d as defineCustomElement$k } from './p-DOn32rOe.js';
-import { d as defineCustomElement$j } from './p-DFXzftOm.js';
-import { d as defineCustomElement$i } from './p-CQL30SR-.js';
-import { d as defineCustomElement$h } from './p-VCYab8gJ.js';
-import { d as defineCustomElement$g } from './p-DVRkdKN3.js';
-import { d as defineCustomElement$f } from './p-CKxcuSAi.js';
-import { d as defineCustomElement$e } from './p-CUcbIC8s.js';
-import { d as defineCustomElement$d } from './p-BMKypEGZ.js';
-import { d as defineCustomElement$c } from './p-CqZsDpTG.js';
-import { d as defineCustomElement$b } from './p-IdvWNLco.js';
-import { d as defineCustomElement$a } from './p-BqmdQiz2.js';
-import { d as defineCustomElement$9 } from './p-CWBxF2ec.js';
-import { d as defineCustomElement$8 } from './p-vDRagogD.js';
-import { d as defineCustomElement$7 } from './p-DLZDxSn0.js';
-import { d as defineCustomElement$6 } from './p-DTboT7Yx.js';
-import { d as defineCustomElement$5 } from './p-DcCalxAf.js';
-import { d as defineCustomElement$4 } from './p-EiDqqBpE.js';
-import { d as defineCustomElement$3 } from './p-CnaE4qFc.js';
-import { d as defineCustomElement$2 } from './p-BfGmXXb3.js';
+import { d as defineCustomElement$L } from './p-YD4Bakxe.js';
+import { d as defineCustomElement$K } from './p-BxFFKKBV.js';
+import { d as defineCustomElement$I } from './p-4ZzOgvxr.js';
+import { d as defineCustomElement$H } from './p-RsH48e52.js';
+import { d as defineCustomElement$G } from './p-C875TNEf.js';
+import { d as defineCustomElement$F } from './p-mlgxtxvQ.js';
+import { d as defineCustomElement$E } from './p-CjyuB3m8.js';
+import { d as defineCustomElement$C } from './p-DbfkETsr.js';
+import { d as defineCustomElement$B } from './p-Be5CKqu1.js';
+import { d as defineCustomElement$A } from './p-Cxl5cc-7.js';
+import { d as defineCustomElement$z } from './p-wzFlqO4T.js';
+import { d as defineCustomElement$y } from './p-CdThcAPH.js';
+import { d as defineCustomElement$x } from './p-rw74yErL.js';
+import { d as defineCustomElement$w } from './p-csQ0C6zE.js';
+import { d as defineCustomElement$v } from './p-ChxQBrfn.js';
+import { d as defineCustomElement$u } from './p-CdWpDwHq.js';
+import { d as defineCustomElement$t } from './p-DULymkT9.js';
+import { d as defineCustomElement$s } from './p-D4TN_vTG.js';
+import { d as defineCustomElement$r } from './p-YLs5dFjd.js';
+import { d as defineCustomElement$q } from './p-BzPeOeYU.js';
+import { d as defineCustomElement$p } from './p-2-WpcyBs.js';
+import { d as defineCustomElement$o } from './p-DuZQc5pI.js';
+import { d as defineCustomElement$n } from './p-BRnLu4rA.js';
+import { d as defineCustomElement$m } from './p-DraXDtkk.js';
+import { d as defineCustomElement$l } from './p-CPAt_lYg.js';
+import { d as defineCustomElement$k } from './p-Cy48WN3f.js';
+import { d as defineCustomElement$j } from './p-C6Xh997j.js';
+import { d as defineCustomElement$i } from './p-BPU5lYEx.js';
+import { d as defineCustomElement$h } from './p-Dr-jwOWv.js';
+import { d as defineCustomElement$g } from './p-D--_zaSS.js';
+import { d as defineCustomElement$f } from './p-D8rDyFQ1.js';
+import { d as defineCustomElement$e } from './p-DQM5v3We.js';
+import { d as defineCustomElement$d } from './p-CnF0KNjR.js';
+import { d as defineCustomElement$c } from './p-BolLGyZr.js';
+import { d as defineCustomElement$b } from './p-D_vziSXg.js';
+import { d as defineCustomElement$a } from './p-DOlb65kw.js';
+import { d as defineCustomElement$9 } from './p-CSHGWlYo.js';
+import { d as defineCustomElement$8 } from './p-D5JI9_ok.js';
+import { d as defineCustomElement$7 } from './p-DW3YwzWQ.js';
+import { d as defineCustomElement$6 } from './p-BlMFCkuT.js';
+import { d as defineCustomElement$5 } from './p-Bvl107Bs.js';
+import { d as defineCustomElement$4 } from './p-r-WjsApf.js';
+import { d as defineCustomElement$3 } from './p-MnmZGRfs.js';
+import { d as defineCustomElement$2 } from './p-BPdSuUDG.js';
 
 /**
  * @licstart The following is the entire license notice for the
@@ -39444,7 +39445,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:row;width:100vw;height:100vh;margin:0px;padding:0px}.left-slot-wrapper{position:fixed;top:0.375rem;left:0.675rem;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)}.right-slot-wrapper{position:fixed;top:0.375rem;right:0.675rem;z-index:2000}.validation-tag-wrapper{position:fixed;top:0.375rem;right:0.375rem;z-index:2000}#my-field-panel{position:relative;height:calc(100% - 4.313rem)}.leftBox{position:relative;border-radius:1rem;border:1px solid var(--gray-30, #edeff2);background:var(--white, #fff);box-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);width:21.25rem;margin:1rem;min-width:21.25rem;max-height:100%;z-index:1000;left:0;top:0}.left-box-inner{position:relative;display:flex;height:100%;padding:0.75rem;gap:0.75rem}.rightBox{border:1px gray solid;width:29.375rem;min-width:24.375rem;padding:0.25rem;font-family:inherit}.toolbox{display:flex;flex-direction:column;width:100%;height:100%;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--gray-10, #f7f8fa);padding:0.75rem;gap:1rem;overflow-y:auto}.compose-toolbox{display:flex;flex-direction:column;width:100%;height:100%;overflow:none;border-radius:0;border:none;background:white;padding:0.25rem}.custom-loader-slot{position:absolute;top:0;left:0;height:100%;width:100%;z-index:3999}.recipients-box{position:relative;display:flex;flex-direction:column;gap:0.75rem;overflow-y:auto;padding:0.75rem 0.25rem 0.25rem 0.25rem;height:100%}.scroll-gradient-top{position:absolute;top:5.9375rem;left:0;width:100%;height:1rem;background:linear-gradient(to bottom, white, rgba(255, 255, 255, 0));pointer-events:none;z-index:100}.scroll-gradient-bottom{position:absolute;bottom:1rem;left:0.75rem;width:calc(100% - 1.5rem);height:1rem;background:linear-gradient(to top, white, rgba(255, 255, 255, 0));pointer-events:none;z-index:100}.ls-editor-infobox{padding:0.125rem 0.5rem 0.125rem 0.5rem}#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%}.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}.prevButton{position:relative;bottom:1.875rem}.nextButton{position:relative;bottom:1.875rem}.fieldBox{z-index:1000}#ls-box-selector{position:absolute;visibility:hidden;background-color:transparent;border:1px rgba(71, 71, 71, 0.716) dashed}#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}.hidden{visibility:hidden;display:none;width:0px}.toolbox-section-title{color:var(--gray-100, #45484d);font-size:1.125rem;font-style:normal;font-weight:500;line-height:1.75rem;}.toolbox-section-description{color:var(--gray-80, #5e6066);font-size:0.75rem;font-style:normal;font-weight:400;line-height:1rem}.fields-box{display:flex;flex-direction:column;gap:0.75rem}.page-header{display:flex;height:2.25rem;gap:0.5rem;padding:0.25rem 0.75rem;justify-content:center;align-items:center}.header-text-1{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem}.header-text-2{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:400;line-height:1.25rem}.properties-header{display:flex;padding:1rem;gap:0.75rem;align-items:center;border-bottom:1px solid var(--gray-20, #edeff2)}.properties-header-title{color:var(--gray-100, #45484d);width:100%;font-size:1.5rem;font-style:normal;font-weight:500;line-height:2rem;}.properties-header-icon{display:flex;padding:0.5rem;border-radius:0.625rem;background:var(--primary-10, #eff4ff);color:var(--primary-60, #4456f6)}.expand-fields-row{display:flex;align-items:center;gap:0.5rem;padding:0.5rem;cursor:pointer;color:var(--gray-80, #6c6e73);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.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, #6c6e73);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)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:2.25rem}.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, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.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.5rem;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, #fff)}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, #fff)}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'].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'].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'].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}.checkbox-container{display:flex;gap:0.5rem;width:100%}.checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.field-properties-outer{position:relative;height:100%}.loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #0c7cba)}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.tertiaryGrey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #787a80)}button.tertiaryGrey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.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, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}`;
+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:row;width:100vw;height:100vh;margin:0px;padding:0px}.ls-dv-left-slot-wrapper{position:fixed;top:0.375rem;left:0.675rem;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:fixed;top:0.375rem;right:0.675rem;z-index:2000}.ls-dv-validation-tag-wrapper{position:absolute;top:0.375rem;right:0.375rem;z-index:2000}.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:transparent;border:1px rgba(71, 71, 71, 0.716) dashed}#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{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, #6c6e73);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, #6c6e73);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, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.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, #fff)}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, #fff)}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, #0c7cba)}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, #787a80)}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, #6c6e73)}.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)}`;
 
 GlobalWorkerOptions.workerSrc = `https://unpkg.com/pdfjs-dist@5.4.449/build/pdf.worker.min.mjs`;
 const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentViewer extends H {
@@ -39538,6 +39539,7 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
     fontFamily = 'arial';
     selected = [];
     isLoading = true;
+    selectedDataItems = [];
     fieldTypeSelected = {
         label: 'Signature',
         formElementType: 'signature',
@@ -39673,22 +39675,6 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
     updateSigner(event) {
         if (event.detail) {
             this.signer = event.detail;
-            try {
-                const leftBox = this.component.shadowRoot?.getElementById('ls-recipient-manager');
-                if (leftBox) {
-                    const recipientsBox = leftBox.querySelector('.recipients-box');
-                    const card = recipientsBox?.querySelector(`ls-recipient-card[data-signer-index="${event.detail}"]`);
-                    if (card && recipientsBox) {
-                        recipientsBox.scrollTo({
-                            top: 0,
-                            behavior: 'smooth',
-                        });
-                    }
-                }
-            }
-            catch (e) {
-                // fail silently
-            }
         }
     }
     // Send selection changes to bars and panels if in use.
@@ -39703,13 +39689,12 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
         if (toolbar) {
             toolbar.dataItem = event.detail;
         }
-        var propPanel = this.component.shadowRoot.getElementById('my-field-panel');
         if (event.detail.length === 0) {
             this.selected = [];
         }
         else {
             console.log(event.detail, 'selected');
-            propPanel.dataItem = event.detail;
+            this.selectedDataItems = event.detail;
         }
         // change style of selected fields
         event.detail.forEach(fc => {
@@ -39738,6 +39723,7 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
         this.pageNum += 1;
         this.queueRenderPage(this.pageNum);
         this.showPageFields(this.pageNum);
+        this.pageResize();
     }
     /**
      * Page backward
@@ -39750,6 +39736,7 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
         this.pageNum -= 1;
         this.queueRenderPage(this.pageNum);
         this.showPageFields(this.pageNum);
+        this.pageResize();
     }
     /**
      * Unselect all fields
@@ -39761,19 +39748,22 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
         });
         this.selected = [];
     }
+    pageResize() {
+        this.canvas = this.component.shadowRoot.getElementById('pdf-canvas');
+        const frame = this.component.shadowRoot.getElementById('ls-document-frame');
+        // const wrapper = this.component.shadowRoot.getElementById('document-frame-wrapper') as HTMLDivElement;
+        this.canvas.style.height = this.pageDimensions[this.pageNum - 1].height * this.zoom + 'px';
+        this.canvas.style.width = this.pageDimensions[this.pageNum - 1].width * this.zoom + 'px';
+        frame.style.height = this.pageDimensions[this.pageNum - 1].height * this.zoom + 'px';
+        frame.style.width = this.pageDimensions[this.pageNum - 1].width * this.zoom + 'px';
+    }
     /**
      * Page and field resize on zoom change
      *
      */
     async setZoom(z) {
         this.zoom = z;
-        this.canvas = this.component.shadowRoot.getElementById('pdf-canvas');
-        const frame = this.component.shadowRoot.getElementById('ls-document-frame');
-        // const wrapper = this.component.shadowRoot.getElementById('document-frame-wrapper') as HTMLDivElement;
-        this.canvas.style.height = this.pageDimensions[this.pageNum - 1].height * z + 'px';
-        this.canvas.style.width = this.pageDimensions[this.pageNum - 1].width * z + 'px';
-        frame.style.height = this.pageDimensions[this.pageNum - 1].height * z + 'px';
-        frame.style.width = this.pageDimensions[this.pageNum - 1].width * z + 'px';
+        this.pageResize();
         // wrapper.style.height = this.pageDimensions[this.pageNum - 1].height * z + 200 + 'px';
         // wrapper.style.width = this.pageDimensions[this.pageNum - 1].width * z + 600 + 'px';
         // place all fields at new zoom level
@@ -39825,14 +39815,16 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
      * Render the page based on pageNumber
      * {number} pageNumber
      */
+    RENDER_SCALE = 2;
     renderPage(pageNumber) {
         this.isPageRendering = true;
         if (this.pdfDocument !== undefined && this.pdfDocument !== null) {
             this.pdfDocument.getPage(pageNumber).then((page) => {
-                const viewport = page.getViewport({ scale: this.zoom });
+                const viewport = page.getViewport({ scale: this.zoom * this.RENDER_SCALE });
                 this.canvas.height = Math.floor(viewport.height);
                 this.canvas.width = Math.floor(viewport.width);
-                // Render PDF page into canvas context
+                this.canvas.style.width = Math.floor(this.pageDimensions[this.pageNum - 1].width * this.zoom) + 'px';
+                this.canvas.style.height = Math.floor(this.pageDimensions[this.pageNum - 1].height * this.zoom) + 'px';
                 const renderContext = {
                     canvasContext: this.ctx,
                     viewport,
@@ -39955,7 +39947,7 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
     showPageFields(page) {
         const fields = this.component.shadowRoot.querySelectorAll('ls-editor-field');
         Array.from(fields).forEach(fx => {
-            fx.className = fx.dataItem.page === page ? '' : 'hidden';
+            fx.className = fx.dataItem.page === page ? '' : 'ls-dv-hidden';
             // Find assignee for this field
             const data = fx.dataItem;
             const assignee = this.mode === 'compose' ? this._recipients?.find(r => r.signerIndex === data.signer) : this._template.roles.find(r => r.signerIndex === data.signer);
@@ -40013,25 +40005,16 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
     }
     componentDidLoad() {
         attachAllTooltips(this.component.shadowRoot);
-        const leftBox = this.component.shadowRoot.getElementById('ls-left-box');
-        if (leftBox) {
-            leftBox.addEventListener('mousedown', e => {
-                e.stopPropagation();
-            });
-            leftBox.addEventListener('mouseup', e => {
-                e.stopPropagation();
-            });
-            leftBox.addEventListener('mousemove', e => {
-                e.stopPropagation();
-            });
-        }
+    }
+    handleManagerChange(manager) {
+        this.manager = manager;
     }
     showTool(fieldFormType) {
         return this.filtertoolbox === null || this.filtertoolbox.split('|').includes(fieldFormType);
     }
     /// Check if the current signer has a role of the specified type
     checkType(type) {
-        if (this.mode === "compose" && this._recipients) {
+        if (this.mode === 'compose' && this._recipients) {
             return this._recipients.find(r => r.roleType === type && r.signerIndex === this.signer) !== undefined;
         }
         else if (this._template) {
@@ -40041,25 +40024,9 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
             return false;
     }
     render() {
-        return (h(Host, { key: 'b2430be0f9a0dedc4e6b14d249aca4d3afae75a1' }, h(h.Fragment, null, this.isLoading && (h(h.Fragment, null, h("ls-page-loader", { key: 'd8ec9bc54cd3e29b3ae33f99754da38b689920ad' }), h("div", { key: 'e50783ed9890b223e15fce16365f6f9d4a614e4a', class: 'custom-loader-slot' }, h("slot", { key: '5a84d4336a02643f73e239368306d29df6444885', name: 'custom-loader' })), this.mode === 'compose' && h("ls-compose-loader", { key: '3c89269bbc4648803af0eca6bd29170617c5d71f' }))), h("div", { key: '54afd06b1cda797d7dc9f25d8ac91eee9f75cbaf', class: "page-header" }, h("div", { key: 'f221198846cf0998325936916db945ae382b55a4', class: 'left-slot-wrapper' }, h("slot", { key: '763a53dd797d5aa48b7f337abf3c0819343fe96e', name: "left-button" })), h("div", { key: '5084c268d77adaf5f2150e38a18f43ae0c1fdcca', class: 'right-slot-wrapper' }, h("slot", { key: '2a81cb4feb5c979880a5ccfb106bad9d1c6130d6', name: "right-button" })), this.mode === 'editor' && (h("div", { key: '4aceb5a48fbe917c461ea8e1086d75e81a895edd' }, h("span", { key: '262c584d97229ea01b73be5e24fb59c47a442693', class: "header-text-1" }, "Template Creation"), h("span", { key: '11230f28b68245c85585981d0b7d96ad585b2d1c' }, "/"), h("span", { key: '209c453820be213fc99396cffe85d4f850fc2a9a', class: "header-text-2" }, this._template?.title))), this.mode === 'compose' && (h("div", { key: '691154c519d45bb86b6d66281c2265e6ddfd9082', style: { display: 'flex', alignItems: 'center', gap: '0.25rem' } }, h("slot", { key: 'e1dbf3867713fc17be2a33f4349566dc4f7217e0', name: "top-bar" })))), this.mode === 'editor' && (h("div", { key: 'ba38673b32778024cbfec99944a40cdf89e2bd76', class: 'validation-tag-wrapper' }, h("ls-validation-tag", { key: 'c0c7205d8492dfb60c454470993e8ccbd5e22a33', validationErrors: this.validationErrors }))), h("form", { key: '0ee013c3287d17abfdd655bae1bd4e145e13dc5b', id: "ls-editor-form" }, this.mode !== 'preview' ? (h("div", { id: "ls-left-box", class: "leftBox", style: this.mode === 'compose' ? { borderRadius: '1.75rem' } : {} }, h("div", { class: !this.selected || this.selected.length === 0 ? 'left-box-inner' : 'hidden' }, this.mode === 'editor' && (h("ls-feature-column", { mode: this.mode, onManage: manager => {
-                if (manager.detail === 'document') {
-                    var documentManager = this.component.shadowRoot.getElementById('ls-document-options');
-                    documentManager.template = this._template;
-                }
-                else if (manager.detail === 'participant') {
-                    var participantManager = this.component.shadowRoot.getElementById('ls-participant-manager');
-                    participantManager.template = this._template;
-                }
-                else if (manager.detail === 'validation') {
-                    var validationManager = this.component.shadowRoot.getElementById('ls-validation-manager');
-                    validationManager.validationErrors = this.validationErrors;
-                }
-                this.manager = manager.detail;
-            } })), h("div", { id: "ls-toolbox", class: this.manager === 'toolbox' ? 'toolbox' : 'hidden' }, h("div", { class: "ls-editor-infobox" }, h("h2", { class: "toolbox-section-title" }, "Fields"), h("p", { class: "toolbox-section-description" }, "Drag and drop, or select and double click, to place fields on the Document.")), h("div", { class: "fields-box" }, (this.signer > 0 && this.showTool('signature') && !this.checkType('APPROVER')) && (h("ls-toolbox-field", { elementType: "signature", formElementType: "signature", label: "Signature", defaultHeight: 25, defaultWidth: 97, validation: 0, icon: "signature", tooltip: "Use this field to collect Signatures from Participants", signer: this.signer })), this.signer === 0 && this.showTool('auto sign') && (h("ls-toolbox-field", { elementType: "admin", formElementType: "auto sign", label: "Auto Sign", defaultHeight: 25, defaultWidth: 97, validation: 3000, icon: "auto-sign", tooltip: "Auto-Sign lets Senders add a Signature to the Document that will be automatically applied upon Sending", signer: this.signer })), this.showTool('text') && (h("ls-toolbox-field", { elementType: "text", formElementType: "text", label: "Text", defaultHeight: 16, defaultWidth: 150, validation: 0, icon: "text", tooltip: "A field for collecting any plain text values such as: names, addresses or descriptions", signer: this.signer })), this.signer > 0 && this.showTool('signing date') && (h("ls-toolbox-field", { elementType: "text", formElementType: "signing date", label: "Signing Date", defaultHeight: 16, defaultWidth: 100, validation: 32, icon: "auto-date", tooltip: "Automatically inserts the date upon completion by the assigned Participant", signer: this.signer })), this.showTool('date') && (h("ls-toolbox-field", { elementType: "text", formElementType: "date", label: "Date", defaultHeight: 16, defaultWidth: 100, validation: 4, icon: "calender", tooltip: "A field for collecting dates with built-in date formatting options", signer: this.signer })), this.showTool('email') && (h("ls-toolbox-field", { elementType: "text", formElementType: "email", label: "Email", defaultHeight: 16, defaultWidth: 150, validation: 1, icon: "at-symbol", tooltip: "A Field to only accept entries formatted as an email address (e.g., example@example.com)", signer: this.signer })), this.showTool('initials') && (h("ls-toolbox-field", { elementType: "initials", formElementType: "initials", label: "Initials", defaultHeight: 25, defaultWidth: 70, validation: 2000, icon: "initials", tooltip: "Use this field anywhere Participants are required to Initial your document", signer: this.signer })), this.showTool('number') && (h("ls-toolbox-field", { elementType: "text", formElementType: "number", label: "Number", defaultHeight: 16, defaultWidth: 150, validation: 50, icon: "hashtag", tooltip: "A Field to only accept entries in numerical format. Additional validations include character limit (1 to 12 digits), and currency format (2 decimal places)", signer: this.signer })), this.showTool('dropdown') && (h("ls-toolbox-field", { elementType: "text", formElementType: "dropdown", label: "Dropdown", defaultHeight: 16, defaultWidth: 100, validation: 20, icon: "dropdown", tooltip: "Use this field to create custom dropdown menus in your document, or place one of our handy presets for countries or prefixes", signer: this.signer })), this.showTool('checkbox') && (h("ls-toolbox-field", { elementType: "text", formElementType: "checkbox", label: "Checkbox", defaultHeight: 16, defaultWidth: 16, validation: 25, icon: "check", tooltip: "Places a checkbox on your document. Handy for T&Cs or  \u2714/\u2717 sections", signer: this.signer })), this.signer > 0 && this.showTool('regex') && (h("ls-toolbox-field", { elementType: "text", formElementType: "regex", label: "Regex", defaultHeight: 16, defaultWidth: 150, validation: 93, icon: "code", tooltip: "Need a specific validation? Use this field to enter a custom RegEx and have Participants enter exactly what you need", signer: this.signer })), this.signer > 0 && this.showTool('image') && (h("ls-toolbox-field", { elementType: "text", formElementType: "image", label: "Image", defaultHeight: 16, defaultWidth: 100, validation: 90, icon: "photograph", tooltip: "Use when you need Participants to upload their own images during the signing process", signer: this.signer })), this.signer > 0 && this.showTool('file') && (h("ls-toolbox-field", { elementType: "text", formElementType: "file", label: "File", defaultHeight: 16, defaultWidth: 100, validation: 74, icon: "upload", tooltip: "Use when you need Participants to upload their own documents during the signing process", signer: this.signer })), this.signer > 0 && this.showTool('drawn') && (h("ls-toolbox-field", { elementType: "text", formElementType: "drawn", label: "Drawn", defaultHeight: 120, defaultWidth: 120, validation: 90, icon: "pencil", tooltip: "Allow users to draw on the document using their mouse or touchscreen", signer: this.signer })))), h("ls-participant-manager", { id: "ls-participant-manager", class: this.manager === 'participant' ? 'toolbox' : 'hidden', editor: this }), h("ls-document-options", { id: "ls-document-options", class: this.manager === 'document' ? 'toolbox' : 'hidden' }), h("ls-validation-manager", { id: "ls-validation-manager", class: this.manager === 'validation' ? 'toolbox' : 'hidden' }), h("ls-recipient-manager", { id: "ls-recipient-manager", class: this.manager === 'recipient' ? 'compose-toolbox' : 'hidden' }, h("div", { class: 'scroll-gradient-top' }), h("div", { class: 'scroll-gradient-bottom' }), h("ls-validation-tag", { validationErrors: this.validationErrors, style: { position: 'absolute', top: '1.125rem', right: '1rem' }, type: "compose" }), h("div", { class: 'recipients-box' }, this._recipients &&
-            this._recipients.map(recipient => (h("ls-recipient-card", { recipient: recipient, activeRecipient: this.signer, filtertoolbox: this.filtertoolbox, template: this._template, validationErrors: this.validationErrors, fieldTypeSelected: this.fieldTypeSelected, "data-signer-index": recipient.signerIndex })))), h("slot", { name: "recipient-panel" }))), !this.displayTable && (h("div", { class: this.selected.length > 0 ? 'field-properties-outer' : 'hidden' }, h("div", { class: 'properties-header' }, h("div", { class: 'properties-header-icon' }, h("ls-icon", { name: "pre-filled-content" })), h("h1", { class: 'properties-header-title' }, "Field Properties"), h("button", { class: 'tertiaryGrey', onClick: e => {
+        return (h(Host, { key: '02da3c452cfeb24a4ad8479d071ad3d5a20be6e0' }, h(h.Fragment, null, this.isLoading && (h(h.Fragment, null, h("ls-page-loader", { key: 'fee68d81c0ed812b4be117137978874e831391a6' }), h("div", { key: 'be3cf89474cde9f3483476a42ec099f6dccb7da0', class: 'ls-dv-custom-loader-slot' }, h("slot", { key: 'afa88745a03c7b4f0d09edbf752366091f06fbb0', name: "custom-loader" })), this.mode === 'compose' && h("ls-compose-loader", { key: 'ed3bf0da3873932607875904c602ce6acc8c13e8' }))), h("div", { key: 'd369df97ed79e78b29a890b24756cc72e2c576e5', class: "ls-dv-page-header" }, h("div", { key: '1836c3d96971e3555e5c7db2668a564ee603a488', class: 'ls-dv-left-slot-wrapper' }, h("slot", { key: 'f6f4c4047518b9e325b4a8b8965176c362fae3e4', name: "left-button" })), h("div", { key: '2484fb083b507e830c7642adae27840ca70eb641', class: 'ls-dv-right-slot-wrapper' }, h("slot", { key: 'f6c17eea7106d75517dbef34ced68e424335287b', name: "right-button" })), this.mode === 'editor' && (h("div", { key: 'ed30a792545b418ab323d3c6ef05acb652ad4c53' }, h("span", { key: 'd6f128f8c0ed1d17075bb5d451cfbac4c2dae3dd', class: "ls-dv-header-text-1" }, "Template Creation"), h("span", { key: '24b58673f06946a13a19184879608a961c40bf3c' }, "/"), h("span", { key: '0ee1f52dab005d35622d518030d98f551ee16b3a', class: "ls-dv-header-text-2" }, this._template?.title), h("div", { key: 'd34d25338ae0c0dc10f85a8742dd9180029c0676', class: 'ls-dv-validation-tag-wrapper' }, h("ls-validation-tag", { key: '554d7a84279c909e23bab720e7e07612de8a123f', validationErrors: this.validationErrors })))), this.mode === 'compose' && (h("div", { key: 'd88148ab87e64f987f37070972f176fcbf7cb723', style: { display: 'flex', alignItems: 'center', gap: '0.25rem' } }, h("slot", { key: 'e660b065f829e81f76f4679de972ae5901b7421f', name: "top-bar" })))), h("form", { key: 'fcd21d3f8584cc1d89452a2b5152b35e2cbe4cf5', id: "ls-editor-form" }, h("ls-left-bar", { key: '7dc6296656e27c6dda8a8a36df5c719a2e8a34f6', 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, onManagerChange: e => this.handleManagerChange(e.detail), onClearSelected: () => {
                 this.selected = [];
-                e.preventDefault();
-            }, "data-tooltip": "Close Properties Panel" }, h("ls-icon", { name: "x", size: "1.25rem" }))), h("ls-field-properties", { id: "my-field-panel" }))))) : (h(h.Fragment, null)), h("ls-toolbar", { key: '059e306bf7d59490030398c498e44aef1f891992', id: "ls-toolbar", template: this._template, editor: this, groupInfo: this.groupInfo, mode: this.mode }), h("div", { key: '003adfd32a2f6fd02257826ba5826b68bcc15b05', id: "ls-mid-area" }, h("div", { key: '852b51e47f7d6e3e06b2644335a92726cd458cf8', class: 'document-frame-wrapper', id: "document-frame-wrapper" }, h("div", { key: 'd2cb3653efdfaedc8fee4a96a407c563f678f0e3', id: "ls-document-frame" }, h("canvas", { key: '558f3c84823275f4a2c7693ebd73315f3c1f3f93', id: "pdf-canvas", class: this.displayTable || this.isLoading ? 'hidden' : '' }), h("ls-editor-table", { key: '642765f3948a7fd6756c59f41758797b5bde7c7b', editor: this, class: this.displayTable ? '' : 'hidden' }), h("div", { key: '778eeb602a57b5d6e768b807c5e1ddc4011bd0d8', id: "ls-box-selector" }))), h("ls-statusbar", { key: 'a5ca94194901243659d177fbe6017ec725f91f9f', editor: this, page: this.pageNum, pageCount: this.pageCount })))), h("ls-tooltip", { key: '1e4670e522a5f86485421778e9bba1d80761e810', id: "ls-tooltip-master" })));
+            } }, h("slot", { key: '7930f988674b6f725dc2e817b216cd39da898d51', name: "recipient-panel", slot: "recipient-panel" })), h("ls-toolbar", { key: 'a0afc22d546f1c10241805c8c91d1bf2637488ba', id: "ls-toolbar", template: this._template, editor: this, groupInfo: this.groupInfo, mode: this.mode }), h("div", { key: '7f345e4965e464ff7b1d57c542a6c7b8ef21c453', id: "ls-mid-area" }, h("div", { key: '2e29144820b0ea4d56403d25d872da076f365dcf', class: 'ls-dv-document-frame-wrapper', id: "document-frame-wrapper" }, h("div", { key: 'b641631ee3ab558a501be1746d6026429b42a36e', id: "ls-document-frame" }, h("canvas", { key: 'c8a792c723f9a63849886d1aff2e81495c992b95', id: "pdf-canvas", class: this.displayTable || this.isLoading ? 'ls-dv-hidden' : '' }), h("ls-editor-table", { key: 'f6ce169f1d48721bbfa2e20946b9f5f56b8b06eb', editor: this, class: this.displayTable ? '' : 'ls-dv-hidden' }), h("div", { key: 'a83fd68cba81fd9c65bab731955004c5229efd45', id: "ls-box-selector" }))), h("ls-statusbar", { key: '37aec8475d024dd8127b37aee6f6f31681e9a4d2', editor: this, page: this.pageNum, pageCount: this.pageCount })))), h("ls-tooltip", { key: '7c8ed1007f10c52aec943c005e7c1671397ac9a7', id: "ls-tooltip-master" })));
     }
     static get watchers() { return {
         "mode": ["modeHandler"],
@@ -40095,6 +40062,7 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
         "fontFamily": [32],
         "selected": [32],
         "isLoading": [32],
+        "selectedDataItems": [32],
         "fieldTypeSelected": [32],
         "pageNext": [64],
         "pagePrev": [64],
@@ -40108,7 +40076,7 @@ function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["ls-document-viewer", "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-page-loader", "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-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-page-loader", "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))) {
@@ -40117,155 +40085,160 @@ function defineCustomElement$1() {
             break;
         case "ls-compose-loader":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$K();
+                defineCustomElement$L();
             }
             break;
         case "ls-document-options":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$J();
+                defineCustomElement$K();
             }
             break;
         case "ls-editor-field":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$I();
+                defineCustomElement$J();
             }
             break;
         case "ls-editor-table":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$H();
+                defineCustomElement$I();
             }
             break;
         case "ls-feature-column":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$G();
+                defineCustomElement$H();
             }
             break;
         case "ls-field-alignment":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$F();
+                defineCustomElement$G();
             }
             break;
         case "ls-field-content":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$E();
+                defineCustomElement$F();
             }
             break;
         case "ls-field-dimensions":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$D();
+                defineCustomElement$E();
             }
             break;
         case "ls-field-distribute":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$C();
+                defineCustomElement$D();
             }
             break;
         case "ls-field-footer":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$B();
+                defineCustomElement$C();
             }
             break;
         case "ls-field-format":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$A();
+                defineCustomElement$B();
             }
             break;
         case "ls-field-placement":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$z();
+                defineCustomElement$A();
             }
             break;
         case "ls-field-properties":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$y();
+                defineCustomElement$z();
             }
             break;
         case "ls-field-properties-advanced":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$x();
+                defineCustomElement$y();
             }
             break;
         case "ls-field-properties-autosign":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$w();
+                defineCustomElement$x();
             }
             break;
         case "ls-field-properties-container":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$v();
+                defineCustomElement$w();
             }
             break;
         case "ls-field-properties-date":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$u();
+                defineCustomElement$v();
             }
             break;
         case "ls-field-properties-email":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$t();
+                defineCustomElement$u();
             }
             break;
         case "ls-field-properties-file":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$s();
+                defineCustomElement$t();
             }
             break;
         case "ls-field-properties-general":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$r();
+                defineCustomElement$s();
             }
             break;
         case "ls-field-properties-image":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$q();
+                defineCustomElement$r();
             }
             break;
         case "ls-field-properties-multiple":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$p();
+                defineCustomElement$q();
             }
             break;
         case "ls-field-properties-number":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$o();
+                defineCustomElement$p();
             }
             break;
         case "ls-field-properties-signature":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$n();
+                defineCustomElement$o();
             }
             break;
         case "ls-field-properties-text":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$m();
+                defineCustomElement$n();
             }
             break;
         case "ls-field-size":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$l();
+                defineCustomElement$m();
             }
             break;
         case "ls-field-type-display":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$k();
+                defineCustomElement$l();
             }
             break;
         case "ls-helper-bar":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$j();
+                defineCustomElement$k();
             }
             break;
         case "ls-icon":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$i();
+                defineCustomElement$j();
             }
             break;
         case "ls-input-wrapper":
             if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$h();
+                defineCustomElement$i();
             }
             break;
         case "ls-keyboard-shortcuts":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$h();
+            }
+            break;
+        case "ls-left-bar":
             if (!customElements.get(transformTag(tagName))) {
                 defineCustomElement$g();
             }