@verdocs/web-sdk 4.0.9 → 4.1.3

package/dist/components/verdocs-kba-dialog.js

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from '@stencil/core/internal/client';
 import { d as defineCustomElement$2 } from './verdocs-button2.js';
 
-const verdocsKbaDialogCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-kba-dialog{font-family:\"Inter\", \"Barlow\", sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-kba-dialog div{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-kba-dialog .background-overlay{position:fixed;z-index:10000;top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background:rgba(0, 0, 0, 0.4980392157)}verdocs-kba-dialog .dialog{width:440px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;border-radius:4px;overflow:hidden;background:#fff;padding:16px;-webkit-box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4);box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4)}verdocs-kba-dialog .heading{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;font-size:20px;font-weight:500}verdocs-kba-dialog .step{margin-left:6px;color:#666}verdocs-kba-dialog .help-box{background-color:#707ae5;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;margin:14px 0;padding:14px;-ms-flex-align:center;align-items:center;color:white}verdocs-kba-dialog .help-details{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin-left:15px;font-size:14px}verdocs-kba-dialog .help-icon{width:40px;height:40px}verdocs-kba-dialog .help-title{font-weight:600;margin-bottom:4px}verdocs-kba-dialog .help-text{font-weight:400}verdocs-kba-dialog .choices{display:grid;gap:15px;grid-template-columns:repeat(auto-fill, minmax(100px, 1fr));margin:0 0 15px 0}verdocs-kba-dialog .choice{border:1px solid #707ae5;border-radius:5px;display:-ms-flexbox;display:flex;height:60px;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;text-align:center;color:#5c6575;cursor:pointer}verdocs-kba-dialog .choice.selected{background-color:#707ae5;color:#ffffff}verdocs-kba-dialog .buttons{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end}verdocs-kba-dialog .buttons verdocs-button{margin-left:16px}";
+const verdocsKbaDialogCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-kba-dialog{font-family:\"Inter\", \"Barlow\", sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-kba-dialog div{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-kba-dialog .background-overlay{position:fixed;z-index:10000;top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background:rgba(0, 0, 0, 0.4980392157)}verdocs-kba-dialog .dialog{width:440px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;border-radius:4px;overflow:hidden;background:#fff;padding:16px;-webkit-box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4);box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4)}verdocs-kba-dialog .heading{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;font-size:20px;font-weight:500}verdocs-kba-dialog .step{margin-left:6px;color:#666}verdocs-kba-dialog .help-box{background-color:#707ae5;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;margin:14px 0;padding:14px;-ms-flex-align:center;align-items:center;color:white}verdocs-kba-dialog .help-details{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin-left:15px;font-size:14px}verdocs-kba-dialog .help-icon{width:40px;height:40px}verdocs-kba-dialog .help-title{font-weight:600;margin-bottom:4px}verdocs-kba-dialog .help-text{font-weight:400}verdocs-kba-dialog .input{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;gap:10px;-ms-flex-align:center;align-items:center;margin:16px 0 32px}verdocs-kba-dialog .input label{line-height:10px;font-weight:500}verdocs-kba-dialog .choices{display:grid;gap:15px;grid-template-columns:repeat(auto-fill, minmax(100px, 1fr));margin:0 0 15px 0}verdocs-kba-dialog .choice{border:1px solid #707ae5;border-radius:5px;display:-ms-flexbox;display:flex;height:60px;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;text-align:center;color:#5c6575;cursor:pointer}verdocs-kba-dialog .choice.selected{background-color:#707ae5;color:#ffffff}verdocs-kba-dialog .buttons{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end}verdocs-kba-dialog .buttons verdocs-button{margin-left:16px}";
 const VerdocsKbaDialogStyle0 = verdocsKbaDialogCss;
 
 const QuestionIcon = `<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20 0C8.95313 0 0 8.95313 0 20C0 31.0469 8.95313 40 20 40C31.0469 40 40 31.0469 40 20C40 8.95313 31.0469 0 20 0ZM20 36.25C11.0391 36.25 3.75 28.9602 3.75 20C3.75 11.0398 11.0391 3.75 20 3.75C28.9609 3.75 36.25 11.0398 36.25 20C36.25 28.9602 28.9609 36.25 20 36.25Z" fill="white"/><path d="M20 26.25C18.5938 26.25 17.5 27.3438 17.5 28.75C17.5 30.1562 18.5234 31.25 20 31.25C21.3359 31.25 22.5 30.1562 22.5 28.75C22.5 27.3438 21.3359 26.25 20 26.25ZM22.5859 10H18.5938C15.5469 10 13.125 12.4219 13.125 15.4688C13.125 16.4844 13.9844 17.3438 15 17.3438C16.0156 17.3438 16.875 16.4844 16.875 15.4688C16.875 14.5312 17.5859 13.75 18.5234 13.75H22.5156C23.5234 13.75 24.375 14.5312 24.375 15.4688C24.375 16.0938 24.0625 16.5703 23.5156 16.8828L19.0625 19.6094C18.4375 20 18.125 20.625 18.125 21.25V22.5C18.125 23.5156 18.9844 24.375 20 24.375C21.0156 24.375 21.875 23.5156 21.875 22.5V22.3438L25.3984 20.1562C27.0391 19.1406 28.0547 17.3438 28.0547 15.4688C28.125 12.4219 25.7031 10 22.5859 10Z" fill="#E7E7E7"/></svg>`;
@@ -13,8 +13,8 @@ const VerdocsKbaDialog$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsKbaDial
         this.next = createEvent(this, "next", 7);
         this.step = 1;
         this.steps = 3;
-        this.helptitle = 'One Time Code';
-        this.helptext = 'Please check your text messages for a security code, and enter the code below.';
+        this.helptitle = 'Previous Addresses';
+        this.helptext = 'Please select the address below that you have most recently lived at.';
         this.mode = 'choice';
         this.label = 'PIN';
         this.placeholder = 'Enter your PIN...';
@@ -35,9 +35,9 @@ const VerdocsKbaDialog$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsKbaDial
         this.next.emit(this.response);
     }
     render() {
-        return (h(Host, { key: 'b0ff245110f7b7ffa12929463ca2817f76168dca' }, h("div", { key: '1b7a0c4991a4d450dde99ad9b4be83f38ff21a4a', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '914c88c6709e6dc3a5638277ba7f1c9f9ba38d70', class: "dialog" }, h("div", { key: '4611fda838e96f34d03b59e61272209ad996cc3d', class: "heading" }, "Confirm Your Identity", this.steps > 1 ? (h("span", { class: "step" }, "(", this.step, "/", this.steps, ")")) : (h(Fragment, null))), h("div", { key: '0932233389d14ef824f95ea8dd7b5799c960e77b', class: "help-box" }, h("div", { key: 'cbb5fdb6d35911aa65ad46da2016e6dbc4209181', class: "help-icon", innerHTML: QuestionIcon }), h("div", { key: '29b4dac42074fcedebe9f63c409e4e838cec7477', class: "help-details" }, h("div", { key: 'f803eb449de8f352eed7caad0c2a22f0b8abe84b', class: "help-title" }, this.helptitle), h("div", { key: '7ca67ecd148312ef50d3257fbae7f7eb9f0cff1f', class: "help-text" }, this.helptext))), this.mode === 'choice' ? (h("div", { class: "choices" }, this.choices.map(choice => (h("div", { class: `choice ${choice === this.response ? 'selected' : ''}`, onClick: () => {
+        return (h(Host, { key: 'c82a5d8b5257732255861a67a51ed6a0b2675b77' }, h("div", { key: 'c102ab713567ed43cef7c344df8a0936274b6f6e', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: 'e932de4a3ca2402a965744ab02f9d6c3b8f86645', class: "dialog" }, h("div", { key: '569f5420ada83b65ecc93147aed387086f659b34', class: "heading" }, "Confirm Your Identity", this.steps > 1 ? (h("span", { class: "step" }, "(", this.step, "/", this.steps, ")")) : (h(Fragment, null))), h("div", { key: '2ffd440933f4e7c44a72eab3fdfd36f8e8a630c8', class: "help-box" }, h("div", { key: '79b7cba2e72d7fd7e576b1f965014e67759727e5', class: "help-icon", innerHTML: QuestionIcon }), h("div", { key: '5ccf156e49de25f88804641ab4b67536838f2876', class: "help-details" }, h("div", { key: '857feb344fd1ba7fdabda6c090e64b03ea1150bb', class: "help-title" }, this.helptitle), h("div", { key: 'b0f0bde18492545dcb767a6a73b70fbebb497ecb', class: "help-text" }, this.helptext))), this.mode === 'choice' ? (h("div", { class: "choices" }, this.choices.map(choice => (h("div", { class: `choice ${choice === this.response ? 'selected' : ''}`, onClick: () => {
                 this.response = choice;
-            } }, choice))))) : (h("div", { class: "input" }, h("label", { htmlFor: "verdocs-kba-input" }, this.label), h("input", { type: "text", id: "verdocs-kba-input", name: "verdocs-kba-input", placeholder: this.placeholder }))), h("div", { key: 'ddb2c56c1cc829d255f0b32f4c76d7d7f19bc031', class: "buttons" }, h("verdocs-button", { key: '08d8db4183d65546d9e6240ed8b2fb610134efe3', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), h("verdocs-button", { key: '7a5fb7a4f4564df0ec083efa0d12d84b8ba253dd', label: "Done", onClick: () => this.handleDone(), disabled: !this.response }))))));
+            } }, choice))))) : (h("div", { class: "input" }, h("label", { htmlFor: "verdocs-kba-input" }, this.label), h("input", { type: "text", id: "verdocs-kba-input", name: "verdocs-kba-input", placeholder: this.placeholder }))), h("div", { key: 'b76320da31947aa982e3d93c766e395b4133d15f', class: "buttons" }, h("verdocs-button", { key: 'bc7c181fc05366341cc4c4e2e2f00749b5ac377e', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), h("verdocs-button", { key: 'dbd938075496f58916586ae1ab89290ab73d129a', label: "Done", onClick: () => this.handleDone(), disabled: !this.response }))))));
     }
     static get style() { return VerdocsKbaDialogStyle0; }
 }, [0, "verdocs-kba-dialog", {

package/dist/components/verdocs-loader2.js

@@ -9,7 +9,7 @@ const VerdocsLoader = /*@__PURE__*/ proxyCustomElement(class VerdocsLoader exten
         this.__registerHost();
     }
     render() {
-        return h(Host, { key: '763614c6e09e0271d2de5a1a35af44a19063919b' });
+        return h(Host, { key: 'd937a9cbfc21d5096d7040864b62b280c66ca994' });
     }
     static get style() { return VerdocsLoaderStyle0; }
 }, [0, "verdocs-loader"]);

package/dist/components/verdocs-ok-dialog2.js

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { d as defineCustomElement$1 } from './verdocs-button2.js';
 
-const verdocsOkDialogCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-ok-dialog{font-family:\"Inter\", \"Barlow\", sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-ok-dialog.closed{display:none}verdocs-ok-dialog .background-overlay{position:fixed;z-index:10000;top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background:rgba(0, 0, 0, 0.4980392157)}verdocs-ok-dialog .dialog{max-width:50%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;border-radius:4px;overflow:hidden;-webkit-box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4);box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4)}verdocs-ok-dialog .heading{display:-ms-flexbox;display:flex;font-size:16px;-ms-flex-direction:row;flex-direction:row;padding:8px 16px;font-weight:bold;color:#ffffff;background:#46497d}verdocs-ok-dialog .content{font-size:16px;background:#ffffff;padding:20px}verdocs-ok-dialog .buttons{display:-ms-flexbox;display:flex;margin:30px 0 0 0;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}verdocs-ok-dialog .buttons verdocs-button{margin-left:16px}";
+const verdocsOkDialogCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-ok-dialog{font-family:\"Inter\", \"Barlow\", sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-ok-dialog.closed{display:none}verdocs-ok-dialog .background-overlay{position:fixed;z-index:10000;top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background:rgba(0, 0, 0, 0.4980392157)}verdocs-ok-dialog .dialog{max-width:60%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;border-radius:4px;overflow:hidden;-webkit-box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4);box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4)}verdocs-ok-dialog .heading{display:-ms-flexbox;display:flex;font-size:16px;-ms-flex-direction:row;flex-direction:row;padding:8px 16px;font-weight:bold;color:#ffffff;background:#46497d}verdocs-ok-dialog .content{font-size:16px;background:#ffffff;padding:20px}verdocs-ok-dialog .buttons{display:-ms-flexbox;display:flex;margin:30px 0 0 0;padding:0 20px;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}verdocs-ok-dialog .buttons verdocs-button{margin-left:16px}";
 const VerdocsOkDialogStyle0 = verdocsOkDialogCss;
 
 const VerdocsOkDialog = /*@__PURE__*/ proxyCustomElement(class VerdocsOkDialog extends HTMLElement {
@@ -31,7 +31,7 @@ const VerdocsOkDialog = /*@__PURE__*/ proxyCustomElement(class VerdocsOkDialog e
         }
     }
     render() {
-        return (h(Host, { key: 'b565b03b79d3d488302e7a6a8f5a575950abcca0', class: this.closed ? 'closed' : '' }, h("div", { key: '23f7a3070728c903fd4baf9dcc210d39253d0b58', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '50496f7183e0198d4d44b3a06d7501c476d16e7e', class: "dialog" }, h("div", { key: 'b2861d6323ecd4c2b61684523514a8c916bec6dd', class: "heading" }, this.heading), h("div", { key: 'c7a66718867c5c5ce0f25bcb4b501832f5781721', class: "content" }, h("div", { key: '5f7f9d2c7c433379f705df507ec0f2bf3e3f5fb5', class: "message", innerHTML: this.message }), h("div", { key: '165ee314122090e4e3c96ef4e0afa78257ae2367', class: "buttons" }, this.showCancel ? h("verdocs-button", { label: "CANCEL", variant: "outline", onClick: () => this.handleCancel() }) : h("div", { style: { display: 'none' } }), h("verdocs-button", { key: '17151d759f01e51dc67e43ec22323a884a5ad4ec', label: this.buttonLabel, onClick: () => this.handleOk() })))))));
+        return (h(Host, { key: 'c1505d930741a4a0e1eb9a9832de8e55d09b207c', class: this.closed ? 'closed' : '' }, h("div", { key: 'f4c1ce92701f56a3b839bc49a0beb38665a65556', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '0fe99745209ca40287512f114122d1a0f0c4e597', class: "dialog" }, h("div", { key: '93deffa53c92913b65109f3c9826e61561f91c68', class: "heading" }, this.heading), h("div", { key: 'b0a64c6f2072655ce439d5008ecfe55651d48d8f', class: "content" }, h("div", { key: '3f89fd4b54dfa1c8437c2aa7dd21310827516004', class: "message", innerHTML: this.message }), h("div", { key: 'a86843d9915f72bcc00810c87f3311c77cf3b566', class: "buttons" }, this.showCancel ? h("verdocs-button", { label: "CANCEL", variant: "outline", onClick: () => this.handleCancel() }) : h("div", { style: { display: 'none' } }), h("verdocs-button", { key: 'd160170c8a58dde135ba4c5ae4dac35ac79c24a1', label: this.buttonLabel, onClick: () => this.handleOk() })))))));
     }
     static get style() { return VerdocsOkDialogStyle0; }
 }, [0, "verdocs-ok-dialog", {

package/dist/components/verdocs-organization-card.js

@@ -1,40 +1,54 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { d as defineCustomElement$2 } from './verdocs-portal2.js';
 import { d as dateFns } from './index2.js';
 
-const verdocsOrganizationCardCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-organization-card{font-family:\"Inter\", \"Barlow\", sans-serif;position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;border:1px solid #cccccc;background:#ffffff;border-radius:8px;padding:7px 15px}verdocs-organization-card:hover>.popup{display:-ms-flexbox;display:flex;background:#ffffff;color:#33354c}verdocs-organization-card .icon{-ms-flex:0;flex:0;height:24px;width:24px;margin:0 14px 0 0}verdocs-organization-card .icon svg{fill:#aeb4bf;height:24px;width:24px}verdocs-organization-card .content{margin-top:2px}verdocs-organization-card .popup{position:absolute;top:-1px;left:-4px;display:none;border:1px solid #cccccc;border-radius:10px;width:326px;padding:20px 40px 0 40px;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;font-family:sans-serif}verdocs-organization-card .popup-header-with-logo{display:-ms-flexbox;display:flex;-ms-flex:0;flex:0;gap:20px;-ms-flex-direction:column;flex-direction:column;margin:0 0 20px 0;font-size:21px;line-height:16px;color:#4c56cb}verdocs-organization-card .popup-header-with-logo img{max-width:300px;max-height:50px}verdocs-organization-card .popup-header{display:-ms-flexbox;display:flex;-ms-flex:0;flex:0;gap:20px;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:end;align-items:flex-end;margin:0 0 20px 0;font-size:21px;line-height:16px;color:#4c56cb}verdocs-organization-card .popup-body{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:14px;text-transform:uppercase}verdocs-organization-card .status{-webkit-transform:scale(1.5);transform:scale(1.5);width:24px;height:24px}verdocs-organization-card .field{margin:0 0 20px 0}verdocs-organization-card .field strong{color:#7b7b9a;display:block;margin:0 0 5px 0}verdocs-organization-card .field a{color:#654dcb;text-transform:uppercase}";
+const verdocsOrganizationCardCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-organization-card{font-family:\"Inter\", \"Barlow\", sans-serif;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;border:1px solid #cccccc;background:#ffffff;border-radius:8px;padding:7px 15px}verdocs-organization-card .icon{-ms-flex:0;flex:0;height:24px;width:24px;margin:0 14px 0 0}verdocs-organization-card .icon svg{fill:#aeb4bf;height:24px;width:24px}verdocs-organization-card .content{margin-top:2px}.verdocs-org-card-popup{font-family:\"Inter\", \"Barlow\", sans-serif;background:#ffffff;border-radius:10px;width:326px;padding:20px 40px 0 40px;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;border:1px solid #cccccc}.verdocs-org-card-popup .popup-header-with-logo{display:-ms-flexbox;display:flex;-ms-flex:0;flex:0;gap:20px;-ms-flex-direction:column;flex-direction:column;margin:0 0 20px 0;font-size:21px;line-height:16px;color:#4c56cb}.verdocs-org-card-popup .popup-header-with-logo img{max-width:300px;max-height:50px}.verdocs-org-card-popup .popup-header{display:-ms-flexbox;display:flex;-ms-flex:0;flex:0;gap:20px;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:end;align-items:flex-end;margin:0 0 20px 0;font-size:21px;line-height:16px;color:#4c56cb}.verdocs-org-card-popup .popup-body{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:14px;text-transform:uppercase}.verdocs-org-card-popup .status{-webkit-transform:scale(1.5);transform:scale(1.5);width:24px;height:24px}.verdocs-org-card-popup .field{margin:0 0 20px 0}.verdocs-org-card-popup .field strong{color:#7b7b9a;display:block;margin:0 0 5px 0}.verdocs-org-card-popup .field a{color:#654dcb;text-transform:uppercase}";
 const VerdocsOrganizationCardStyle0 = verdocsOrganizationCardCss;
 
 // TODO: See what was done in Storybook. Move all SVG icons to a common file that both projects can share
 //  and reduce duplication between components for re-used icons. Also bring icons into Figma for reuse there.
-const UserIcon = '<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"><rect fill="none" height="24" width="24"/><g><path d="M4,13c1.1,0,2-0.9,2-2c0-1.1-0.9-2-2-2s-2,0.9-2,2C2,12.1,2.9,13,4,13z M5.13,14.1C4.76,14.04,4.39,14,4,14 c-0.99,0-1.93,0.21-2.78,0.58C0.48,14.9,0,15.62,0,16.43V18l4.5,0v-1.61C4.5,15.56,4.73,14.78,5.13,14.1z M20,13c1.1,0,2-0.9,2-2 c0-1.1-0.9-2-2-2s-2,0.9-2,2C18,12.1,18.9,13,20,13z M24,16.43c0-0.81-0.48-1.53-1.22-1.85C21.93,14.21,20.99,14,20,14 c-0.39,0-0.76,0.04-1.13,0.1c0.4,0.68,0.63,1.46,0.63,2.29V18l4.5,0V16.43z M16.24,13.65c-1.17-0.52-2.61-0.9-4.24-0.9 c-1.63,0-3.07,0.39-4.24,0.9C6.68,14.13,6,15.21,6,16.39V18h12v-1.61C18,15.21,17.32,14.13,16.24,13.65z M8.07,16 c0.09-0.23,0.13-0.39,0.91-0.69c0.97-0.38,1.99-0.56,3.02-0.56s2.05,0.18,3.02,0.56c0.77,0.3,0.81,0.46,0.91,0.69H8.07z M12,8 c0.55,0,1,0.45,1,1s-0.45,1-1,1s-1-0.45-1-1S11.45,8,12,8 M12,6c-1.66,0-3,1.34-3,3c0,1.66,1.34,3,3,3s3-1.34,3-3 C15,7.34,13.66,6,12,6L12,6z"/></g></svg>';
 const BusinessIcon = '<svg xmlns="http://www.w3.org/2000/svg"  focusable="false" aria-hidden="true" height="24px" viewBox="0 0 24 24" width="24px"><path d="M12 7V3H2v18h20V7H12zM6 19H4v-2h2v2zm0-4H4v-2h2v2zm0-4H4V9h2v2zm0-4H4V5h2v2zm4 12H8v-2h2v2zm0-4H8v-2h2v2zm0-4H8V9h2v2zm0-4H8V5h2v2zm10 12h-8v-2h2v-2h-2v-2h2v-2h-2V9h8v10zm-2-8h-2v2h2v-2zm0 4h-2v2h2v-2z"></path></svg>';
 const VerdocsOrganizationCard$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsOrganizationCard extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
         this.organization = undefined;
+        this.hovered = false;
+    }
+    onMouseOver() {
+        this.hovered = true;
+    }
+    onMouseOut() {
+        this.hovered = false;
     }
     render() {
-        var _a, _b, _c, _d, _e, _f, _g;
+        var _a, _b, _c, _d, _e, _f;
         console.log('Rendering org card', this.organization.thumbnail_url, this.organization);
-        const fallbackIcon = ((_a = this.organization) === null || _a === void 0 ? void 0 : _a.is_business) ? BusinessIcon : UserIcon;
-        return (h(Host, { key: 'f76a55b62fb94a6d0214f535faac0dd1bc7a3d2c' }, this.organization.thumbnail_url ? h("img", { class: "icon", src: this.organization.thumbnail_url, alt: "Logo" }) : h("span", { class: "icon", innerHTML: fallbackIcon }), h("span", { key: '081b7de4929a689351b9097a5492854597a6a2e0', class: "content" }, (_b = this.organization) === null || _b === void 0 ? void 0 : _b.name), h("div", { key: '3d4f6d20995a9c192bd0022edf95cc89023457cd', class: "popup" }, this.organization.full_logo_url ? (h("div", { class: "popup-header-with-logo" }, h("img", { src: this.organization.full_logo_url, alt: "Logo" }), h("div", { class: "title" }, (_c = this.organization) === null || _c === void 0 ? void 0 : _c.name))) : (h("div", { class: "popup-header" }, h("span", { class: "status" }, h("span", { class: "icon", innerHTML: fallbackIcon })), h("span", { class: "title" }, (_d = this.organization) === null || _d === void 0 ? void 0 : _d.name))), h("div", { key: 'a17465bf3a71fc347699e749469209c43a643201', class: "popup-body" }, h("div", { key: '259540d41c8d257166a51139fdc29226ff3512ed', class: "field" }, h("strong", { key: 'c8d1a5abf7b48c5273e1f2d99ddffba71c528fb5' }, "Joined"), dateFns.format(new Date(((_e = this.organization) === null || _e === void 0 ? void 0 : _e.created_at) || undefined), 'LLL d, Y')), this.organization.url && (h("div", { key: 'fe16d86018dc1f186e777afeb77dc43c2f2b1c73', class: "field" }, h("strong", { key: '1d3af10be4c1a3382d2425e5c38ab25c48d47872' }, "Website"), h("a", { key: 'cdd718f3d639015ce644b10a1c73f69c938e1426', href: (_f = this.organization) === null || _f === void 0 ? void 0 : _f.url, target: "_blank", rel: "nofollow" }, (_g = this.organization) === null || _g === void 0 ? void 0 : _g.url)))))));
+        const fallbackIcon = BusinessIcon;
+        const portalId = `verdocs-org-card-${this.organization.id}`;
+        return (h(Host, { key: '66f8951a26e9d609f2988ddea15da056ba3d8d45', id: portalId }, this.organization.thumbnail_url ? h("img", { class: "icon", src: this.organization.thumbnail_url, alt: "Logo" }) : h("span", { class: "icon", innerHTML: fallbackIcon }), h("span", { key: 'a70fee0106bf1f74fa1e7a2b8fee074a3efb8825', class: "content" }, (_a = this.organization) === null || _a === void 0 ? void 0 : _a.name), h("verdocs-portal", { key: '7ce0f5e4e03e8c4917c63b156a66932b546dd074', anchor: portalId }, h("div", { key: 'f7d821664d642c90ef6b721b62add71c2fff0050', class: "verdocs-org-card-popup", style: { display: this.hovered ? 'block' : 'none' } }, this.organization.full_logo_url ? (h("div", { class: "popup-header-with-logo" }, h("img", { src: this.organization.full_logo_url, alt: "Logo" }), h("div", { class: "title" }, (_b = this.organization) === null || _b === void 0 ? void 0 : _b.name))) : (h("div", { class: "popup-header" }, h("span", { class: "status" }, h("span", { class: "icon", innerHTML: fallbackIcon })), h("span", { class: "title" }, (_c = this.organization) === null || _c === void 0 ? void 0 : _c.name))), h("div", { key: '2d5feaaaf1d9772f69ded7329bf0b987ff039358', class: "popup-body" }, h("div", { key: 'cde3c3b9ca27ed8d6b679390bd0d1355e0df8c54', class: "field" }, h("strong", { key: '27cf928ec22fcbab95bdbec161a3fc9e939170b7' }, "Joined"), dateFns.format(new Date(((_d = this.organization) === null || _d === void 0 ? void 0 : _d.created_at) || undefined), 'LLL d, Y')), this.organization.url && (h("div", { key: '124de4f60dae0d12b209004c71a8e1ad2964ba43', class: "field" }, h("strong", { key: '7940cbb7023281fa3b6ab4891ac2554fb78acb7a' }, "Website"), h("a", { key: '76b506a873b1683686dda0f12dd1e888a3c3e0c8', href: (_e = this.organization) === null || _e === void 0 ? void 0 : _e.url, target: "_blank", rel: "nofollow" }, (_f = this.organization) === null || _f === void 0 ? void 0 : _f.url))))))));
     }
     static get style() { return VerdocsOrganizationCardStyle0; }
 }, [0, "verdocs-organization-card", {
-        "organization": [16]
-    }]);
+        "organization": [16],
+        "hovered": [32]
+    }, [[1, "mouseover", "onMouseOver"], [1, "mouseout", "onMouseOut"]]]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["verdocs-organization-card"];
+    const components = ["verdocs-organization-card", "verdocs-portal"];
     components.forEach(tagName => { switch (tagName) {
         case "verdocs-organization-card":
             if (!customElements.get(tagName)) {
                 customElements.define(tagName, VerdocsOrganizationCard$1);
             }
             break;
+        case "verdocs-portal":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
     } });
 }
 

package/dist/components/verdocs-pagination2.js

@@ -38,7 +38,7 @@ const VerdocsQuickFilter = /*@__PURE__*/ proxyCustomElement(class VerdocsQuickFi
         const firstPage = Math.max(0, this.selectedPage - 2);
         const numPages = this.itemCount > 0 ? Math.ceil(this.itemCount / this.perPage) : 0;
         const pagesToDisplay = integerSequence(0, Math.ceil(this.itemCount / this.perPage)).slice(firstPage, firstPage + VISIBLE_PAGES);
-        return (h(Host, { key: '35e9f8dee414ae4addb4a0615d41ac2f877d6185' }, this.selectedPage > 0 && h(PageButton, { key: 'e3ccf5d514ed45c2e279b6ace160fa5865132f7d', page: 'first', selected: this.selectedPage, onClick: () => this.handleSelectPage(0) }), firstPage > 0 && h("div", { key: '74d1aaa681f9b8f3baafc935758d6dcc723fcdac', class: "ellipsis" }, "..."), pagesToDisplay.map(pageNumber => (h(PageButton, { page: pageNumber, selected: this.selectedPage, onClick: page => this.handleSelectPage(+page) }))), this.selectedPage < numPages - 1 && h("div", { key: 'cb5d8461f4a33adffcb2a6df87f6ffcf66d08737', class: "ellipsis" }, "..."), this.selectedPage < numPages - 1 && h(PageButton, { key: 'c433baeead865058d66f4aa127a6ce1fcc28f3bc', page: 'last', selected: this.selectedPage, onClick: () => this.handleSelectPage(numPages - 1) })));
+        return (h(Host, { key: '618d88a5b4dae883914e939ef05456b9d44f2df3' }, this.selectedPage > 0 && h(PageButton, { key: 'eaff39fe466f9219173b52222eaf87f9dcb41272', page: 'first', selected: this.selectedPage, onClick: () => this.handleSelectPage(0) }), firstPage > 0 && h("div", { key: 'e37014eb7b3bad65cc940871c6fccc5e81cdb7bc', class: "ellipsis" }, "..."), pagesToDisplay.map(pageNumber => (h(PageButton, { page: pageNumber, selected: this.selectedPage, onClick: page => this.handleSelectPage(+page) }))), this.selectedPage < numPages - 1 && h("div", { key: 'c5575814246a760a87d9453422fda25cac2951bf', class: "ellipsis" }, "..."), this.selectedPage < numPages - 1 && h(PageButton, { key: '80c7278265cb970457cb23c6ca6f34a6b4af1888', page: 'last', selected: this.selectedPage, onClick: () => this.handleSelectPage(numPages - 1) })));
     }
     get el() { return this; }
     static get style() { return VerdocsPaginationStyle0; }

package/dist/components/verdocs-portal2.js

@@ -15,7 +15,7 @@ const VerdocsPortal = /*@__PURE__*/ proxyCustomElement(class VerdocsPortal exten
         this.align = 'left';
     }
     handleScroll() {
-        this.calculatePosition();
+        // this.calculatePosition();
     }
     handleResize() {
         this.calculatePosition();
@@ -68,7 +68,7 @@ const VerdocsPortal = /*@__PURE__*/ proxyCustomElement(class VerdocsPortal exten
         this.moved ? this.portal.remove() : (this.moved = true);
     }
     render() {
-        return (h(Host, { key: 'bca4c2bfa7c2f16dcfd4046e66cf8011207c4902', ref: el => (this.element = el) }, h("slot", { key: '8e451491ccd52c55d08621198d916dc991487bfc' })));
+        return (h(Host, { key: 'd7a5de03169b16ea234b95e2a4baaea3640fd9f6', ref: el => (this.element = el) }, h("slot", { key: 'f727915cc6ebab778406e53142b416ef8131b45c' })));
     }
     static get style() { return VerdocsPortalStyle0; }
 }, [4, "verdocs-portal", {

package/dist/components/verdocs-preview2.js

@@ -44,41 +44,54 @@ const VerdocsPreview = /*@__PURE__*/ proxyCustomElement(class VerdocsPreview ext
         this.templateId = null;
         this.loading = true;
     }
+    onTemplateIdChanged(newTemplateId) {
+        console.log('[PREVIEW] Template ID changed', newTemplateId);
+        this.loadTemplate(newTemplateId).catch((e) => console.log('Unknown Error', e));
+    }
     async componentWillLoad() {
-        var _a, _b, _c;
+        var _a, _b, _c, _d, _e, _f;
         try {
             this.endpoint.loadSession();
+            if (!this.endpoint.session) {
+                console.log('[PREVIEW] Unable to start builder session, must be authenticated');
+                return;
+            }
             if (!this.templateId) {
                 console.log(`[PREVIEW] Missing required template ID ${this.templateId}`);
                 return;
             }
-            if (!this.endpoint.session) {
-                console.log('[PREVIEW] Unable to start builder session, must be authenticated');
-                return;
+            try {
+                getTemplateStore(this.endpoint, this.templateId, true)
+                    .then(ts => {
+                    this.templateStore = ts;
+                    this.fieldStore = getTemplateFieldStore(this.templateId);
+                    this.roleStore = getTemplateRoleStore(this.templateId);
+                    this.loading = false;
+                })
+                    .catch(e => {
+                    console.log(e);
+                });
+            }
+            catch (e) {
+                console.log('[PREVIEW] Error with preview session', e);
+                (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(new SDKError(e.message, (_b = e.response) === null || _b === void 0 ? void 0 : _b.status, (_c = e.response) === null || _c === void 0 ? void 0 : _c.data));
             }
-            getTemplateStore(this.endpoint, this.templateId, true)
-                .then(ts => {
-                this.templateStore = ts;
-                console.log('[PREVIEW] Loaded Template Store', ts.state);
-                this.fieldStore = getTemplateFieldStore(this.templateId);
-                this.roleStore = getTemplateRoleStore(this.templateId);
-                console.log('[PREVIEW] Loaded template', this.templateStore.state, this.roleStore.get('roles'), this.fieldStore.get('fields'));
-                this.loading = false;
-            })
-                .catch(e => {
-                console.log(e);
-            });
         }
         catch (e) {
             console.log('[PREVIEW] Error with preview session', e);
-            (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(new SDKError(e.message, (_b = e.response) === null || _b === void 0 ? void 0 : _b.status, (_c = e.response) === null || _c === void 0 ? void 0 : _c.data));
+            (_d = this.sdkError) === null || _d === void 0 ? void 0 : _d.emit(new SDKError(e.message, (_e = e.response) === null || _e === void 0 ? void 0 : _e.status, (_f = e.response) === null || _f === void 0 ? void 0 : _f.data));
+        }
+    }
+    async loadTemplate(templateId) {
+        if (templateId) {
+            this.templateStore = await getTemplateStore(this.endpoint, templateId, false);
         }
     }
     handlePageRendered(e) {
         var _a, _b;
         const pageInfo = e.detail;
         const fields = (_b = (_a = this.templateStore) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.fields.filter(field => field.page === pageInfo.pageNumber);
-        console.log('[PREVIEW] Page rendered', pageInfo, fields);
+        // console.log('[PREVIEW] Page rendered', pageInfo, fields);
         fields.forEach(field => renderDocumentField(field, pageInfo, { disabled: true, editable: false, draggable: false }));
     }
     render() {
@@ -88,17 +101,22 @@ const VerdocsPreview = /*@__PURE__*/ proxyCustomElement(class VerdocsPreview ext
         }
         return (h(Host, null, (((_b = (_a = this.templateStore) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.documents) || []).map(document => {
             const pageNumbers = integerSequence(1, document.pages);
-            return (h(Fragment, null, pageNumbers.map(pageNumber => (h("verdocs-template-document-page", { templateId: document.template_id, documentId: document.id, pageNumber: pageNumber, disabled: true, editable: true, done: false, virtualWidth: 612, virtualHeight: 792, onPageRendered: e => this.handlePageRendered(e), layers: [
+            return (h(Fragment, null, pageNumbers.map(pageNumber => (h("verdocs-template-document-page", { templateId: document.template_id, documentId: document.id, pageNumber: pageNumber, disabled: true, editable: false, done: false, virtualWidth: 612, virtualHeight: 792, onPageRendered: e => this.handlePageRendered(e), layers: [
                     { name: 'page', type: 'canvas' },
                     { name: 'controls', type: 'div' },
                 ] })))));
         })));
     }
+    static get watchers() { return {
+        "templateId": ["onTemplateIdChanged"]
+    }; }
     static get style() { return VerdocsPreviewStyle0; }
 }, [0, "verdocs-preview", {
         "endpoint": [16],
         "templateId": [1, "template-id"],
         "loading": [32]
+    }, undefined, {
+        "templateId": ["onTemplateIdChanged"]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

package/dist/components/verdocs-progress-bar2.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 
-const verdocsProgressBarCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-progress-bar{font-family:\"Inter\", \"Barlow\", sans-serif;width:100%;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-direction:column;flex-direction:column}verdocs-progress-bar .labels{display:-ms-flexbox;display:flex;margin:0 0 8px 0;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between}verdocs-progress-bar .labels .label{display:-ms-flexbox;display:flex;font-size:14px;font-weight:600;color:#33364b}verdocs-progress-bar .bar{display:-ms-flexbox;display:flex;-ms-flex:0 0 10px;flex:0 0 10px;border-radius:5px;background-color:#cccccc}verdocs-progress-bar .bar .slider{display:-ms-flexbox;display:flex;border-radius:5px;background-color:#55bc81}";
+const verdocsProgressBarCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-progress-bar{font-family:\"Inter\", \"Barlow\", sans-serif;width:100%;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-direction:column;flex-direction:column}verdocs-progress-bar .labels{display:-ms-flexbox;display:flex;margin:0 0 8px 0;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between}verdocs-progress-bar .labels .label{display:-ms-flexbox;display:flex;font-size:14px;font-weight:600;margin-right:8px;color:#33364b}verdocs-progress-bar .bar{display:-ms-flexbox;display:flex;-ms-flex:0 0 10px;flex:0 0 10px;border-radius:5px;background-color:#cccccc}verdocs-progress-bar .bar .slider{display:-ms-flexbox;display:flex;border-radius:5px;background-color:#55bc81}";
 const VerdocsProgressBarStyle0 = verdocsProgressBarCss;
 
 const VerdocsProgressBar = /*@__PURE__*/ proxyCustomElement(class VerdocsProgressBar extends HTMLElement {
@@ -14,7 +14,7 @@ const VerdocsProgressBar = /*@__PURE__*/ proxyCustomElement(class VerdocsProgres
     render() {
         const widthPercent = Math.ceil((100 * Math.min(this.percent, 100)) / 100);
         console.log('Rendering progress bar', { widthPercent, label: this.label, showPercent: this.showPercent, percent: this.percent });
-        return (h(Host, { key: '44ff05aec2048b9ed24847dc0b410f379f94bbc6' }, h("div", { key: '8706b9d902db9b9731a1d92744fa5cd071bdfca9', class: "labels" }, this.label && h("div", { key: 'b56b39c39a16f0316de5b3d15d4e0c130ab9d232', class: "label" }, this.label), this.showPercent && h("div", { key: '99ec3b060256124b4f49325c16ab3cd5ec6d0640', class: "label" }, this.percent, "%")), h("div", { key: '4cbd4ac85304f77d148ebecd339e9eb87d8e12b5', class: "bar" }, h("div", { key: '472a105258357d4ab398b69f4d75c39b089ade96', class: "slider", style: { width: `${widthPercent}%` } }))));
+        return (h(Host, { key: '7a7c98f373c3d1bd1f064d4e8802862fd42bca03' }, h("div", { key: '82117f7d403c8bb16cf8edc1a9b3de2eb0a35330', class: "labels" }, this.label && h("div", { key: '90aa3cefdf193d5ebf599c4c93abe1799c979db7', class: "label" }, this.label), this.showPercent && h("div", { key: '5fb5fe56f744a28963d98ad9990919f62a0092f5', class: "label" }, this.percent, "%")), h("div", { key: 'f91d4fd40eaef38f3a75f721b9de3be764c7c46b', class: "bar" }, h("div", { key: '2ecc62850384403a42338d98f4a03c40d717c59a', class: "slider", style: { width: `${widthPercent}%` } }))));
     }
     static get style() { return VerdocsProgressBarStyle0; }
 }, [0, "verdocs-progress-bar", {

package/dist/components/verdocs-quick-filter2.js

@@ -85,7 +85,7 @@ const VerdocsQuickFilter = /*@__PURE__*/ proxyCustomElement(class VerdocsQuickFi
         const longestLabelWidth = renderedTextWidth((longestOption === null || longestOption === void 0 ? void 0 : longestOption.label) || 'FILLER', '14px Inter, Barlow, sans-serif');
         const prefixWidth = renderedTextWidth(this.label, '14px Inter, Barlow, sans-serif');
         const minWidth = `${longestLabelWidth + prefixWidth + 40}px`;
-        return (h(Host, { key: '1f334530a8ad36661234df13dfcded2b0578f6a0', class: { open: !!this.open }, style: { minWidth, display: 'inline-block' } }, h("div", { key: 'ca820c376c072a6de23e9bddf2255fd18d1423c6', class: "control", onClick: e => this.toggleDropdown(e), onBlur: e => this.handleHideDropdown(e) }, h("div", { key: '6b64609796a46da25d7fdcd4b0f667b010feaf5c', class: "title", ref: el => (this.dropdownButton = el) }, h("span", { key: 'da9dd1d6b822e26e478edef34127324a24c4fa46', class: "prefix" }, this.label, ":"), selectedOption ? selectedOption.label : this.placeholder), h("div", { key: 'c3e735e29d3a53780c94689502044af65df358da', style: { flex: '1' } }), h("div", { key: '7ea36915d9db4c97520486db47cb60f6b08ba868', class: "separator" }), h("div", { key: '32b41b27f18e34ab13c80af1562489df9c75edcc', class: "arrow", innerHTML: DropdownArrow, "aria-label": "Open Menu" })), h("div", { key: 'f9c2a98829e67f30cd2234ce5532684f4ca45ce1', class: "items", "aria-hidden": !this.open, ref: el => (this.dropdownMenu = el), style: { minWidth } }, (_c = this.options) === null || _c === void 0 ? void 0 : _c.map(option => option.label ? (h("button", { onClick: e => this.handleSelectOption(e, option), class: `option ${option.value === this.value ? 'selected' : ''}`, disabled: option.disabled }, option.label)) : (h("div", { class: "separator" }))))));
+        return (h(Host, { key: 'ccc8423ebae51aa9c9523ae8ddb547b5ff33e85c', class: { open: !!this.open }, style: { minWidth, display: 'inline-block' } }, h("div", { key: '51edc34e8ff8916c206413a2a0006733df65a6ee', class: "control", onClick: e => this.toggleDropdown(e), onBlur: e => this.handleHideDropdown(e) }, h("div", { key: 'a58d23d6fb24512f2857b3f7b96fb1f29e3bb4da', class: "title", ref: el => (this.dropdownButton = el) }, h("span", { key: 'ec2639bb2800f5d1df9c024c7b35db9e178a1514', class: "prefix" }, this.label, ":"), selectedOption ? selectedOption.label : this.placeholder), h("div", { key: '11f5ed99195b02d467f7dcb38fe69a85ff6c166b', style: { flex: '1' } }), h("div", { key: 'b58e34715555bc873f0850c01f70a37593462cd1', class: "separator" }), h("div", { key: 'bc7618f508a8a5b9e4c27c7fa4a0203e96e12e3c', class: "arrow", innerHTML: DropdownArrow, "aria-label": "Open Menu" })), h("div", { key: '27aa83763ec9cd0ce52d221254acfb7d00a4cda3', class: "items", "aria-hidden": !this.open, ref: el => (this.dropdownMenu = el), style: { minWidth } }, (_c = this.options) === null || _c === void 0 ? void 0 : _c.map(option => option.label ? (h("button", { onClick: e => this.handleSelectOption(e, option), class: `option ${option.value === this.value ? 'selected' : ''}`, disabled: option.disabled }, option.label)) : (h("div", { class: "separator" }))))));
     }
     get el() { return this; }
     static get style() { return VerdocsQuickFilterStyle0; }

package/dist/components/verdocs-quick-functions2.js

@@ -21,7 +21,7 @@ const VerdocsQuickFunctions = /*@__PURE__*/ proxyCustomElement(class VerdocsQuic
         this.createDocument.emit();
     }
     render() {
-        return (h("div", { key: 'e7d2ca753e83c18c1ca85aedcbe277db1488ab63', class: "container" }, h("p", { key: 'b5e1a9ff78f3fb76eacb96c8168f094f41f8d877', class: "title" }, "Quick Create"), h("button", { key: 'ac967b777b02f6d6155798ddd015de9eeafadd6f', onClick: () => this.handleCreateTemplate(), innerHTML: TemplateIcon }, "Template"), h("button", { key: 'e36d5ac7e47e8e0d943b3722820fc994e0cad625', onClick: () => this.handleCreateDocument(), innerHTML: DocumentIcon }, "Document")));
+        return (h("div", { key: '8732c14ba59bc441cdc1b164832ef66b5c7842bb', class: "container" }, h("p", { key: 'f6909de1cfed09c6514bd0d6530a380ad62aff85', class: "title" }, "Quick Create"), h("button", { key: 'e95f2fc551ad5342a4ceef8995c11b5b56a0e12a', onClick: () => this.handleCreateTemplate(), innerHTML: TemplateIcon }, "Template"), h("button", { key: '6707f329d007c1027d159c5b928a124fb41b6f73', onClick: () => this.handleCreateDocument(), innerHTML: DocumentIcon }, "Document")));
     }
     static get style() { return VerdocsQuickFunctionsStyle0; }
 }, [0, "verdocs-quick-functions", {

package/dist/components/verdocs-radio-button2.js

@@ -13,7 +13,7 @@ const VerdocsRadioButton = /*@__PURE__*/ proxyCustomElement(class VerdocsRadioBu
         this.disabled = false;
     }
     render() {
-        return (h(Host, { key: '08503221049dbcdb5ad6d8804576bd302437a784', class: { disabled: this.disabled } }, h("input", { key: '649115f2c5d916fbec807ab0566ec3352abe6afd', type: "radio", value: this.value, name: this.name, id: `verdocs-radio-button-${this.name}-${this.value}`, checked: this.checked, disabled: this.disabled }), h("label", { key: '597495b414c518d808f241cea9c3c66b0fabdf63', htmlFor: `verdocs-radio-button-${this.name}-${this.value}` })));
+        return (h(Host, { key: '75bec4ec1ed0b9f7683a6b3c43c987c5f8c01539', class: { disabled: this.disabled } }, h("input", { key: '7493bdafdaef15d48696a51c4d1e9a7c162bdf8f', type: "radio", value: this.value, name: this.name, id: `verdocs-radio-button-${this.name}-${this.value}`, checked: this.checked, disabled: this.disabled }), h("label", { key: 'c0d1aa6861cb76ec86f5995a047e9d923e9a951e', htmlFor: `verdocs-radio-button-${this.name}-${this.value}` })));
     }
     static get style() { return VerdocsRadioButtonStyle0; }
 }, [0, "verdocs-radio-button", {

package/dist/components/verdocs-search-box2.js

@@ -44,7 +44,7 @@ const VerdocsSearchBox = /*@__PURE__*/ proxyCustomElement(class VerdocsSearchBox
         }
     }
     render() {
-        return (h("form", { key: 'd134a33663d3e85c469534b154b211f9ab8c4a51', onSubmit: e => this.handleSearch(e) }, this.type !== undefined && this.type !== 'all' && (h("span", { key: 'c9993bcc9112ac432b780216fbf29adfceded0e5', class: "type" }, this.type, "s ", h("button", { key: 'b9a8ac4bd299fafe0cccee64e4b50d4cbbcef863', class: "remove", innerHTML: CloseIcon, onClick: () => this.handleClearFilter() }))), h("input", { key: 'bcd7f9c630d41b0a1dc3eed8400c44c2a81ffc79', type: "text", value: this.query, placeholder: this.placeholder, onInput: e => this.handleChange(e), onKeyUp: e => this.handleKeyUp(e), ref: el => (this.inputEl = el) }), h("button", { key: '546ceb6ef7b4b47dcc82e6409052838c980c2889', onClick: e => this.handleSearch(e), class: "search" }, h("span", { key: '585037b13dee3865890a4a8ffe919a45bcbc9fbf', innerHTML: SearchIcon }), "Search")));
+        return (h("form", { key: 'bd9ecc80b3c557f27328777c4518ca86e0012f57', onSubmit: e => this.handleSearch(e) }, this.type !== undefined && this.type !== 'all' && (h("span", { key: 'e6db2d986dd0bef76717be89f4bbf0f4713cd49b', class: "type" }, this.type, "s ", h("button", { key: '859a75c3372ab7518497cdda018857c9305a0d19', class: "remove", innerHTML: CloseIcon, onClick: () => this.handleClearFilter() }))), h("input", { key: 'd2b2716fb4d2e6c9fc7a9c6c2912319f04dcf275', type: "text", value: this.query, placeholder: this.placeholder, onInput: e => this.handleChange(e), onKeyUp: e => this.handleKeyUp(e), ref: el => (this.inputEl = el) }), h("button", { key: '575626601e59c2020f7ec18d7fa7a667870fda2b', onClick: e => this.handleSearch(e), class: "search" }, h("span", { key: '035b6b114e0327df6cb6940265337ce8f8ddfc83', innerHTML: SearchIcon }), "Search")));
     }
     static get style() { return VerdocsSearchBoxStyle0; }
 }, [0, "verdocs-search-box", {

package/dist/components/verdocs-search-tabs.js

@@ -10,7 +10,7 @@ const VerdocsSearchTabs$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSearch
         this.selected = 'all';
     }
     render() {
-        return h("div", { key: 'b5bf8a69699b2d55bd2c744dc2c96ec09e185351' }, "\u00A0");
+        return h("div", { key: '16e93641cee94ed98e3c8de50222fb41f5dbfb90' }, "\u00A0");
     }
     static get style() { return VerdocsSearchTabsStyle0; }
 }, [0, "verdocs-search-tabs", {

package/dist/components/verdocs-search.js

@@ -13,7 +13,7 @@ const VerdocsSearch$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSearch ext
         this.endpoint = VerdocsEndpoint.getDefault();
     }
     render() {
-        return (h("div", { key: '1bdc73f6b69fdaf197b4d228c36ac28a4de147c8', class: "container" }, h("verdocs-search-box", { key: 'd5305d39714c09a83dca8d87282fe3bec40491f0', endpoint: this.endpoint }), h("div", { key: '6f333add2936ca54994f0ec4e33023fa2b196b07', class: "boxes" }, h("verdocs-search-activity", { key: '2c49e617f5bbb0337a3e48a18b2687478f512847', type: "recent", endpoint: this.endpoint }), h("verdocs-search-activity", { key: '3ee0c69f75e839459c63f33bf24302e3cc277adf', type: "saved", endpoint: this.endpoint }), h("verdocs-search-activity", { key: '1f78fdc2d68b97a24a37ba544bd2d49d49d43b32', type: "starred", endpoint: this.endpoint }), h("verdocs-quick-functions", { key: '789f6170d2f7e0b17da045d4c2350c69a7e9588b', endpoint: this.endpoint }))));
+        return (h("div", { key: '200d955b8750bfb853a491a39d2614f65c3dae2e', class: "container" }, h("verdocs-search-box", { key: '55db0748ab0102d71235903b1c668587e45ad527', endpoint: this.endpoint }), h("div", { key: '88ca9f594578f71b8abfb1fcbd1e31d455bcfb46', class: "boxes" }, h("verdocs-search-activity", { key: '7d95bd072f011865207fc0365e18d82b7875fd6a', type: "recent", endpoint: this.endpoint }), h("verdocs-search-activity", { key: 'f2f364ddb7347b7479aa5fd54d2519f7f96628ac', type: "saved", endpoint: this.endpoint }), h("verdocs-search-activity", { key: 'd504730b955a6c14cdf5d77eba96d3bb35eaf876', type: "starred", endpoint: this.endpoint }), h("verdocs-quick-functions", { key: 'dd543a416a6aab58e7566e320a20ea73f0313bce', endpoint: this.endpoint }))));
     }
     static get style() { return VerdocsSearchStyle0; }
 }, [0, "verdocs-search", {

package/dist/components/verdocs-select-input2.js

@@ -13,7 +13,7 @@ const VerdocsSelectInput = /*@__PURE__*/ proxyCustomElement(class VerdocsSelectI
         this.disabled = false;
     }
     render() {
-        return (h(Host, { key: 'f4ed5ac0b8cd5321d4dc378dfb4118bd55993c6b', class: "input-field" }, h("label", { key: '0c46eaac6ae1e9044d477ee4e41cbb8ddf79ae91' }, this.label ? h("div", { class: "input-label" }, this.label + ':') : h("div", null), h("select", { key: '983b8be81f9c017acb69a8d23560b72a0f0bf729', class: "input-element", disabled: this.disabled }, this.options.map(option => (h("option", { value: option.value, selected: option.value === this.value }, option.label)))))));
+        return (h(Host, { key: 'f2a13ba2272aa0e1379ce935b8fa89329f1c657e', class: "input-field" }, h("label", { key: 'cdbbe67f3ade5be5e44ff16436091bce7c4a9732' }, this.label ? h("div", { class: "input-label" }, this.label + ':') : h("div", null), h("select", { key: '8c0404328b52edfb3d99416abb0dc2c53e20fb63', class: "input-element", disabled: this.disabled }, this.options.map(option => (h("option", { value: option.value, selected: option.value === this.value }, option.label)))))));
     }
     static get style() { return VerdocsSelectInputStyle0; }
 }, [0, "verdocs-select-input", {