@verdocs/web-sdk 4.0.9 → 4.1.3

package/dist/cjs/verdocs-field-payment.cjs.entry.js

@@ -4,11 +4,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-cfdfab36.js');
 const jsSdk = require('@verdocs/js-sdk');
-const TemplateRoleStore = require('./TemplateRoleStore-06db6e56.js');
-const TemplateFieldStore = require('./TemplateFieldStore-6a79aae7.js');
+const TemplateRoleStore = require('./TemplateRoleStore-fb869e9a.js');
+const TemplateFieldStore = require('./TemplateFieldStore-2db70818.js');
 require('./index-3e4c5891.js');
 
-const verdocsFieldPaymentCss = "@-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-field-payment{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:24px;height:24px;display:block;font-size:11px;position:relative;border:1px solid #cfa;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left}verdocs-field-payment.disabled{opacity:0.5}verdocs-field-payment button,verdocs-field-payment div{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-field-payment button{color:rgba(0, 0, 0, 0.87);font-weight:500;-webkit-transform-origin:0 0;transform-origin:0 0;height:100%;width:100%;background:none;font-size:11px}verdocs-field-payment button.hide{display:none}verdocs-field-payment input{float:left;font-family:Arial, sans-serif}verdocs-field-payment select{position:absolute;font-family:Arial, sans-serif;background:linear-gradient(55deg, transparent 50%, #333 50%), linear-gradient(125deg, #333 50%, transparent 50%), linear-gradient(to right, transparent, transparent);background-position:calc(100% - 7px) 4px, calc(100% - 3px) 4px, 100% 0;background-size:5px 5px, 5px 5px, 2.5em 2.5em;background-repeat:no-repeat;-webkit-appearance:none;-moz-appearance:none;appearance:none}verdocs-field-payment .frame{width:100%;height:100%;background-size:contain;text-align:left}verdocs-field-payment .frame img{position:absolute;height:auto;width:100%}verdocs-field-payment.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}verdocs-field-payment .settings-icon{position:absolute;top:-3px;left:-20px;display:inline-block;cursor:pointer;opacity:0.3}verdocs-field-payment .settings-icon svg{fill:#707ae5}verdocs-field-payment .settings-icon:hover{opacity:1}";
+const verdocsFieldPaymentCss = "@-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-field-payment{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:24px;height:24px;display:block;font-size:11px;position:relative;border:1px solid #cfa;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left}verdocs-field-payment.disabled{opacity:0.5}verdocs-field-payment button,verdocs-field-payment div{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-field-payment button{color:rgba(0, 0, 0, 0.87);font-weight:500;-webkit-transform-origin:0 0;transform-origin:0 0;height:100%;width:100%;background:none;font-size:11px}verdocs-field-payment button.hide{display:none}verdocs-field-payment input{float:left;font-family:Arial, sans-serif}verdocs-field-payment select{position:absolute;font-family:Arial, sans-serif;background:linear-gradient(55deg, transparent 50%, #333 50%), linear-gradient(125deg, #333 50%, transparent 50%), linear-gradient(to right, transparent, transparent);background-position:calc(100% - 7px) 4px, calc(100% - 3px) 4px, 100% 0;background-size:5px 5px, 5px 5px, 2.5em 2.5em;background-repeat:no-repeat;-webkit-appearance:none;-moz-appearance:none;appearance:none}verdocs-field-payment .frame{width:100%;height:100%;background-size:contain;text-align:left}verdocs-field-payment .frame img{position:absolute;height:auto;width:100%}verdocs-field-payment.focused{-webkit-animation:verdocs-field-pulse 0.4s 1;animation:verdocs-field-pulse 0.4s 1}verdocs-field-payment .settings-icon{position:absolute;top:-3px;left:-20px;display:inline-block;cursor:pointer;opacity:0.3}verdocs-field-payment .settings-icon svg{fill:#707ae5}verdocs-field-payment .settings-icon:hover{opacity:1}";
 const VerdocsFieldPaymentStyle0 = verdocsFieldPaymentCss;
 
 const VerdocsFieldPayment = class {

package/dist/cjs/verdocs-file-chooser_2.cjs.entry.js

@@ -31,12 +31,12 @@ const VerdocsFileChooser = class {
     }
     render() {
         const buttonlabel = this.file ? 'Select a different file' : 'Select a file from your computer';
-        return (index.h(index.Host, { key: 'f8febf3e2ed17a5997e9e97aad97a83ecd5a0bb2' }, index.h("input", { key: 'b151b6e4a19521ecb95b40a7b414c6ffd3e7c74b', type: "file", multiple: true, id: "verdocs-file-chooser", accept: "application/pdf,.pdf,.doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document", style: { display: 'none' }, onChange: e => this.handleFileChanged(e) }), index.h("div", { key: '9aa5d9b06f54f4479afb9276702632c695d24d0f', class: "upload-box" }, index.h("div", { key: '769adcb7a66ae0357e581909978fc18e5cca75ab', class: "selected-filename" }, this.file ? this.file.name : 'Drag a file here'), index.h("div", { key: 'd50342ec030cf44a608b7e13e480015c63822ea7', class: "or-prefer" }, this.file ? Icons.unicodeNBSP : 'Or, if you prefer...'), index.h("verdocs-button", { key: 'd6a883649258392cb922a4b0a4901e526017bf5f', label: buttonlabel, size: "small", onClick: e => this.handleSelectFile(e) }))));
+        return (index.h(index.Host, { key: '501a0427992593169d853a8733d518a107dee390' }, index.h("input", { key: '7f5c18d4b35bfc90f82424ca0e9796076962a24f', type: "file", multiple: true, id: "verdocs-file-chooser", accept: "application/pdf,.pdf,.doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document", style: { display: 'none' }, onChange: e => this.handleFileChanged(e) }), index.h("div", { key: 'f534098c145b668763b59e4a0b69e644e4889006', class: "upload-box" }, index.h("div", { key: 'a080ece65752c1ee1e6faac36558b452d5204500', class: "selected-filename" }, this.file ? this.file.name : 'Drag a file here'), index.h("div", { key: 'cfa61e426da03bf930fefc41a1bcff3cdc8fd04a', class: "or-prefer" }, this.file ? Icons.unicodeNBSP : 'Or, if you prefer...'), index.h("verdocs-button", { key: '3683238282627a6e48e8666ba085bb40cfd2cd7c', label: buttonlabel, size: "small", onClick: e => this.handleSelectFile(e) }))));
     }
 };
 VerdocsFileChooser.style = VerdocsFileChooserStyle0;
 
-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 = class {
@@ -49,7 +49,7 @@ const VerdocsProgressBar = class {
     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 (index.h(index.Host, { key: '44ff05aec2048b9ed24847dc0b410f379f94bbc6' }, index.h("div", { key: '8706b9d902db9b9731a1d92744fa5cd071bdfca9', class: "labels" }, this.label && index.h("div", { key: 'b56b39c39a16f0316de5b3d15d4e0c130ab9d232', class: "label" }, this.label), this.showPercent && index.h("div", { key: '99ec3b060256124b4f49325c16ab3cd5ec6d0640', class: "label" }, this.percent, "%")), index.h("div", { key: '4cbd4ac85304f77d148ebecd339e9eb87d8e12b5', class: "bar" }, index.h("div", { key: '472a105258357d4ab398b69f4d75c39b089ade96', class: "slider", style: { width: `${widthPercent}%` } }))));
+        return (index.h(index.Host, { key: '7a7c98f373c3d1bd1f064d4e8802862fd42bca03' }, index.h("div", { key: '82117f7d403c8bb16cf8edc1a9b3de2eb0a35330', class: "labels" }, this.label && index.h("div", { key: '90aa3cefdf193d5ebf599c4c93abe1799c979db7', class: "label" }, this.label), this.showPercent && index.h("div", { key: '5fb5fe56f744a28963d98ad9990919f62a0092f5', class: "label" }, this.percent, "%")), index.h("div", { key: 'f91d4fd40eaef38f3a75f721b9de3be764c7c46b', class: "bar" }, index.h("div", { key: '2ecc62850384403a42338d98f4a03c40d717c59a', class: "slider", style: { width: `${widthPercent}%` } }))));
     }
 };
 VerdocsProgressBar.style = VerdocsProgressBarStyle0;

package/dist/cjs/verdocs-kba-dialog.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-cfdfab36.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>`;
@@ -15,8 +15,8 @@ const VerdocsKbaDialog = class {
         this.next = index.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...';
@@ -37,9 +37,9 @@ const VerdocsKbaDialog = class {
         this.next.emit(this.response);
     }
     render() {
-        return (index.h(index.Host, { key: 'b0ff245110f7b7ffa12929463ca2817f76168dca' }, index.h("div", { key: '1b7a0c4991a4d450dde99ad9b4be83f38ff21a4a', class: "background-overlay", onClick: e => this.handleDismiss(e) }, index.h("div", { key: '914c88c6709e6dc3a5638277ba7f1c9f9ba38d70', class: "dialog" }, index.h("div", { key: '4611fda838e96f34d03b59e61272209ad996cc3d', class: "heading" }, "Confirm Your Identity", this.steps > 1 ? (index.h("span", { class: "step" }, "(", this.step, "/", this.steps, ")")) : (index.h(index.Fragment, null))), index.h("div", { key: '0932233389d14ef824f95ea8dd7b5799c960e77b', class: "help-box" }, index.h("div", { key: 'cbb5fdb6d35911aa65ad46da2016e6dbc4209181', class: "help-icon", innerHTML: QuestionIcon }), index.h("div", { key: '29b4dac42074fcedebe9f63c409e4e838cec7477', class: "help-details" }, index.h("div", { key: 'f803eb449de8f352eed7caad0c2a22f0b8abe84b', class: "help-title" }, this.helptitle), index.h("div", { key: '7ca67ecd148312ef50d3257fbae7f7eb9f0cff1f', class: "help-text" }, this.helptext))), this.mode === 'choice' ? (index.h("div", { class: "choices" }, this.choices.map(choice => (index.h("div", { class: `choice ${choice === this.response ? 'selected' : ''}`, onClick: () => {
+        return (index.h(index.Host, { key: 'c82a5d8b5257732255861a67a51ed6a0b2675b77' }, index.h("div", { key: 'c102ab713567ed43cef7c344df8a0936274b6f6e', class: "background-overlay", onClick: e => this.handleDismiss(e) }, index.h("div", { key: 'e932de4a3ca2402a965744ab02f9d6c3b8f86645', class: "dialog" }, index.h("div", { key: '569f5420ada83b65ecc93147aed387086f659b34', class: "heading" }, "Confirm Your Identity", this.steps > 1 ? (index.h("span", { class: "step" }, "(", this.step, "/", this.steps, ")")) : (index.h(index.Fragment, null))), index.h("div", { key: '2ffd440933f4e7c44a72eab3fdfd36f8e8a630c8', class: "help-box" }, index.h("div", { key: '79b7cba2e72d7fd7e576b1f965014e67759727e5', class: "help-icon", innerHTML: QuestionIcon }), index.h("div", { key: '5ccf156e49de25f88804641ab4b67536838f2876', class: "help-details" }, index.h("div", { key: '857feb344fd1ba7fdabda6c090e64b03ea1150bb', class: "help-title" }, this.helptitle), index.h("div", { key: 'b0f0bde18492545dcb767a6a73b70fbebb497ecb', class: "help-text" }, this.helptext))), this.mode === 'choice' ? (index.h("div", { class: "choices" }, this.choices.map(choice => (index.h("div", { class: `choice ${choice === this.response ? 'selected' : ''}`, onClick: () => {
                 this.response = choice;
-            } }, choice))))) : (index.h("div", { class: "input" }, index.h("label", { htmlFor: "verdocs-kba-input" }, this.label), index.h("input", { type: "text", id: "verdocs-kba-input", name: "verdocs-kba-input", placeholder: this.placeholder }))), index.h("div", { key: 'ddb2c56c1cc829d255f0b32f4c76d7d7f19bc031', class: "buttons" }, index.h("verdocs-button", { key: '08d8db4183d65546d9e6240ed8b2fb610134efe3', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), index.h("verdocs-button", { key: '7a5fb7a4f4564df0ec083efa0d12d84b8ba253dd', label: "Done", onClick: () => this.handleDone(), disabled: !this.response }))))));
+            } }, choice))))) : (index.h("div", { class: "input" }, index.h("label", { htmlFor: "verdocs-kba-input" }, this.label), index.h("input", { type: "text", id: "verdocs-kba-input", name: "verdocs-kba-input", placeholder: this.placeholder }))), index.h("div", { key: 'b76320da31947aa982e3d93c766e395b4133d15f', class: "buttons" }, index.h("verdocs-button", { key: 'bc7c181fc05366341cc4c4e2e2f00749b5ac377e', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), index.h("verdocs-button", { key: 'dbd938075496f58916586ae1ab89290ab73d129a', label: "Done", onClick: () => this.handleDone(), disabled: !this.response }))))));
     }
 };
 VerdocsKbaDialog.style = VerdocsKbaDialogStyle0;

package/dist/cjs/verdocs-loader.cjs.entry.js

@@ -12,7 +12,7 @@ const VerdocsLoader = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return index.h(index.Host, { key: '763614c6e09e0271d2de5a1a35af44a19063919b' });
+        return index.h(index.Host, { key: 'd937a9cbfc21d5096d7040864b62b280c66ca994' });
     }
 };
 VerdocsLoader.style = VerdocsLoaderStyle0;

package/dist/cjs/verdocs-ok-dialog.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-cfdfab36.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 = class {
@@ -33,7 +33,7 @@ const VerdocsOkDialog = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'b565b03b79d3d488302e7a6a8f5a575950abcca0', class: this.closed ? 'closed' : '' }, index.h("div", { key: '23f7a3070728c903fd4baf9dcc210d39253d0b58', class: "background-overlay", onClick: e => this.handleDismiss(e) }, index.h("div", { key: '50496f7183e0198d4d44b3a06d7501c476d16e7e', class: "dialog" }, index.h("div", { key: 'b2861d6323ecd4c2b61684523514a8c916bec6dd', class: "heading" }, this.heading), index.h("div", { key: 'c7a66718867c5c5ce0f25bcb4b501832f5781721', class: "content" }, index.h("div", { key: '5f7f9d2c7c433379f705df507ec0f2bf3e3f5fb5', class: "message", innerHTML: this.message }), index.h("div", { key: '165ee314122090e4e3c96ef4e0afa78257ae2367', class: "buttons" }, this.showCancel ? index.h("verdocs-button", { label: "CANCEL", variant: "outline", onClick: () => this.handleCancel() }) : index.h("div", { style: { display: 'none' } }), index.h("verdocs-button", { key: '17151d759f01e51dc67e43ec22323a884a5ad4ec', label: this.buttonLabel, onClick: () => this.handleOk() })))))));
+        return (index.h(index.Host, { key: 'c1505d930741a4a0e1eb9a9832de8e55d09b207c', class: this.closed ? 'closed' : '' }, index.h("div", { key: 'f4c1ce92701f56a3b839bc49a0beb38665a65556', class: "background-overlay", onClick: e => this.handleDismiss(e) }, index.h("div", { key: '0fe99745209ca40287512f114122d1a0f0c4e597', class: "dialog" }, index.h("div", { key: '93deffa53c92913b65109f3c9826e61561f91c68', class: "heading" }, this.heading), index.h("div", { key: 'b0a64c6f2072655ce439d5008ecfe55651d48d8f', class: "content" }, index.h("div", { key: '3f89fd4b54dfa1c8437c2aa7dd21310827516004', class: "message", innerHTML: this.message }), index.h("div", { key: 'a86843d9915f72bcc00810c87f3311c77cf3b566', class: "buttons" }, this.showCancel ? index.h("verdocs-button", { label: "CANCEL", variant: "outline", onClick: () => this.handleCancel() }) : index.h("div", { style: { display: 'none' } }), index.h("verdocs-button", { key: 'd160170c8a58dde135ba4c5ae4dac35ac79c24a1', label: this.buttonLabel, onClick: () => this.handleOk() })))))));
     }
 };
 VerdocsOkDialog.style = VerdocsOkDialogStyle0;

package/dist/cjs/{verdocs-organization-card.cjs.entry.js → verdocs-organization-card_2.cjs.entry.js}

@@ -19270,25 +19270,105 @@ Object.keys(_index245).forEach(function (key) {
 });
 }(index.dateFns));
 
-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 = class {
     constructor(hostRef) {
         index$1.registerInstance(this, hostRef);
         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 (index$1.h(index$1.Host, { key: 'f76a55b62fb94a6d0214f535faac0dd1bc7a3d2c' }, this.organization.thumbnail_url ? index$1.h("img", { class: "icon", src: this.organization.thumbnail_url, alt: "Logo" }) : index$1.h("span", { class: "icon", innerHTML: fallbackIcon }), index$1.h("span", { key: '081b7de4929a689351b9097a5492854597a6a2e0', class: "content" }, (_b = this.organization) === null || _b === void 0 ? void 0 : _b.name), index$1.h("div", { key: '3d4f6d20995a9c192bd0022edf95cc89023457cd', class: "popup" }, this.organization.full_logo_url ? (index$1.h("div", { class: "popup-header-with-logo" }, index$1.h("img", { src: this.organization.full_logo_url, alt: "Logo" }), index$1.h("div", { class: "title" }, (_c = this.organization) === null || _c === void 0 ? void 0 : _c.name))) : (index$1.h("div", { class: "popup-header" }, index$1.h("span", { class: "status" }, index$1.h("span", { class: "icon", innerHTML: fallbackIcon })), index$1.h("span", { class: "title" }, (_d = this.organization) === null || _d === void 0 ? void 0 : _d.name))), index$1.h("div", { key: 'a17465bf3a71fc347699e749469209c43a643201', class: "popup-body" }, index$1.h("div", { key: '259540d41c8d257166a51139fdc29226ff3512ed', class: "field" }, index$1.h("strong", { key: 'c8d1a5abf7b48c5273e1f2d99ddffba71c528fb5' }, "Joined"), index.dateFns.format(new Date(((_e = this.organization) === null || _e === void 0 ? void 0 : _e.created_at) || undefined), 'LLL d, Y')), this.organization.url && (index$1.h("div", { key: 'fe16d86018dc1f186e777afeb77dc43c2f2b1c73', class: "field" }, index$1.h("strong", { key: '1d3af10be4c1a3382d2425e5c38ab25c48d47872' }, "Website"), index$1.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 (index$1.h(index$1.Host, { key: '66f8951a26e9d609f2988ddea15da056ba3d8d45', id: portalId }, this.organization.thumbnail_url ? index$1.h("img", { class: "icon", src: this.organization.thumbnail_url, alt: "Logo" }) : index$1.h("span", { class: "icon", innerHTML: fallbackIcon }), index$1.h("span", { key: 'a70fee0106bf1f74fa1e7a2b8fee074a3efb8825', class: "content" }, (_a = this.organization) === null || _a === void 0 ? void 0 : _a.name), index$1.h("verdocs-portal", { key: '7ce0f5e4e03e8c4917c63b156a66932b546dd074', anchor: portalId }, index$1.h("div", { key: 'f7d821664d642c90ef6b721b62add71c2fff0050', class: "verdocs-org-card-popup", style: { display: this.hovered ? 'block' : 'none' } }, this.organization.full_logo_url ? (index$1.h("div", { class: "popup-header-with-logo" }, index$1.h("img", { src: this.organization.full_logo_url, alt: "Logo" }), index$1.h("div", { class: "title" }, (_b = this.organization) === null || _b === void 0 ? void 0 : _b.name))) : (index$1.h("div", { class: "popup-header" }, index$1.h("span", { class: "status" }, index$1.h("span", { class: "icon", innerHTML: fallbackIcon })), index$1.h("span", { class: "title" }, (_c = this.organization) === null || _c === void 0 ? void 0 : _c.name))), index$1.h("div", { key: '2d5feaaaf1d9772f69ded7329bf0b987ff039358', class: "popup-body" }, index$1.h("div", { key: 'cde3c3b9ca27ed8d6b679390bd0d1355e0df8c54', class: "field" }, index$1.h("strong", { key: '27cf928ec22fcbab95bdbec161a3fc9e939170b7' }, "Joined"), index.dateFns.format(new Date(((_d = this.organization) === null || _d === void 0 ? void 0 : _d.created_at) || undefined), 'LLL d, Y')), this.organization.url && (index$1.h("div", { key: '124de4f60dae0d12b209004c71a8e1ad2964ba43', class: "field" }, index$1.h("strong", { key: '7940cbb7023281fa3b6ab4891ac2554fb78acb7a' }, "Website"), index$1.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))))))));
     }
 };
 VerdocsOrganizationCard.style = VerdocsOrganizationCardStyle0;
 
+const verdocsPortalCss = "@-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)}}";
+const VerdocsPortalStyle0 = verdocsPortalCss;
+
+const Z_INDEX = '10001';
+const VerdocsPortal = class {
+    constructor(hostRef) {
+        index$1.registerInstance(this, hostRef);
+        this.clickAway = index$1.createEvent(this, "clickAway", 7);
+        this.moved = false;
+        this.anchor = undefined;
+        this.voffset = 0;
+        this.align = 'left';
+    }
+    handleScroll() {
+        // this.calculatePosition();
+    }
+    handleResize() {
+        this.calculatePosition();
+    }
+    handleClick(e) {
+        var _a;
+        if (!this.element.contains(e.target)) {
+            (_a = this.clickAway) === null || _a === void 0 ? void 0 : _a.emit();
+        }
+    }
+    calculateLeft() {
+        const anchorEl = document.getElementById(this.anchor);
+        if (!anchorEl)
+            return 0;
+        const anchorRect = anchorEl.getBoundingClientRect();
+        if (this.align === 'left') {
+            return Math.max(anchorRect.left, 0);
+        }
+        if (this.align === 'right') {
+            return Math.max(anchorRect.left + anchorRect.width - this.portal.offsetWidth, 0);
+        }
+        return Math.max(anchorRect.left - this.portal.offsetWidth / 2 + anchorRect.width / 2, 0);
+    }
+    calculateTop() {
+        const anchorEl = document.getElementById(this.anchor);
+        if (!anchorEl)
+            return 0;
+        const anchorRect = anchorEl.getBoundingClientRect();
+        return anchorRect.bottom + this.voffset;
+    }
+    calculatePosition() {
+        this.portal.style.top = `${this.calculateTop()}px`;
+        this.portal.style.left = `${this.calculateLeft()}px`;
+    }
+    componentWillLoad() {
+        var _a;
+        const id = `${this.anchor}-portal`;
+        (_a = document.getElementById(id)) === null || _a === void 0 ? void 0 : _a.remove();
+        this.portal = document.createElement('div');
+        this.portal.setAttribute('id', id);
+        this.portal.style.zIndex = Z_INDEX;
+        this.portal.style.position = 'absolute';
+        document.body.append(this.portal);
+    }
+    componentDidLoad() {
+        this.portal.appendChild(this.element);
+        this.calculatePosition();
+    }
+    disconnectedCallback() {
+        this.moved ? this.portal.remove() : (this.moved = true);
+    }
+    render() {
+        return (index$1.h(index$1.Host, { key: 'd7a5de03169b16ea234b95e2a4baaea3640fd9f6', ref: el => (this.element = el) }, index$1.h("slot", { key: 'f727915cc6ebab778406e53142b416ef8131b45c' })));
+    }
+};
+VerdocsPortal.style = VerdocsPortalStyle0;
+
 exports.verdocs_organization_card = VerdocsOrganizationCard;
+exports.verdocs_portal = VerdocsPortal;

package/dist/cjs/verdocs-pagination_2.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-cfdfab36.js');
 const jsSdk = require('@verdocs/js-sdk');
-const utils = require('./utils-5eb11b46.js');
+const utils = require('./utils-d9ecd23d.js');
 const popper = require('./popper-31badbf8.js');
 require('./Types-db1bd1d8.js');
 require('./index-5f130ec0.js');
@@ -45,7 +45,7 @@ const VerdocsQuickFilter$1 = class {
         const firstPage = Math.max(0, this.selectedPage - 2);
         const numPages = this.itemCount > 0 ? Math.ceil(this.itemCount / this.perPage) : 0;
         const pagesToDisplay = jsSdk.integerSequence(0, Math.ceil(this.itemCount / this.perPage)).slice(firstPage, firstPage + VISIBLE_PAGES);
-        return (index.h(index.Host, { key: '35e9f8dee414ae4addb4a0615d41ac2f877d6185' }, this.selectedPage > 0 && index.h(PageButton, { key: 'e3ccf5d514ed45c2e279b6ace160fa5865132f7d', page: 'first', selected: this.selectedPage, onClick: () => this.handleSelectPage(0) }), firstPage > 0 && index.h("div", { key: '74d1aaa681f9b8f3baafc935758d6dcc723fcdac', class: "ellipsis" }, "..."), pagesToDisplay.map(pageNumber => (index.h(PageButton, { page: pageNumber, selected: this.selectedPage, onClick: page => this.handleSelectPage(+page) }))), this.selectedPage < numPages - 1 && index.h("div", { key: 'cb5d8461f4a33adffcb2a6df87f6ffcf66d08737', class: "ellipsis" }, "..."), this.selectedPage < numPages - 1 && index.h(PageButton, { key: 'c433baeead865058d66f4aa127a6ce1fcc28f3bc', page: 'last', selected: this.selectedPage, onClick: () => this.handleSelectPage(numPages - 1) })));
+        return (index.h(index.Host, { key: '618d88a5b4dae883914e939ef05456b9d44f2df3' }, this.selectedPage > 0 && index.h(PageButton, { key: 'eaff39fe466f9219173b52222eaf87f9dcb41272', page: 'first', selected: this.selectedPage, onClick: () => this.handleSelectPage(0) }), firstPage > 0 && index.h("div", { key: 'e37014eb7b3bad65cc940871c6fccc5e81cdb7bc', class: "ellipsis" }, "..."), pagesToDisplay.map(pageNumber => (index.h(PageButton, { page: pageNumber, selected: this.selectedPage, onClick: page => this.handleSelectPage(+page) }))), this.selectedPage < numPages - 1 && index.h("div", { key: 'c5575814246a760a87d9453422fda25cac2951bf', class: "ellipsis" }, "..."), this.selectedPage < numPages - 1 && index.h(PageButton, { key: '80c7278265cb970457cb23c6ca6f34a6b4af1888', page: 'last', selected: this.selectedPage, onClick: () => this.handleSelectPage(numPages - 1) })));
     }
     get el() { return index.getElement(this); }
 };
@@ -133,7 +133,7 @@ const VerdocsQuickFilter = class {
         const longestLabelWidth = utils.renderedTextWidth((longestOption === null || longestOption === void 0 ? void 0 : longestOption.label) || 'FILLER', '14px Inter, Barlow, sans-serif');
         const prefixWidth = utils.renderedTextWidth(this.label, '14px Inter, Barlow, sans-serif');
         const minWidth = `${longestLabelWidth + prefixWidth + 40}px`;
-        return (index.h(index.Host, { key: '1f334530a8ad36661234df13dfcded2b0578f6a0', class: { open: !!this.open }, style: { minWidth, display: 'inline-block' } }, index.h("div", { key: 'ca820c376c072a6de23e9bddf2255fd18d1423c6', class: "control", onClick: e => this.toggleDropdown(e), onBlur: e => this.handleHideDropdown(e) }, index.h("div", { key: '6b64609796a46da25d7fdcd4b0f667b010feaf5c', class: "title", ref: el => (this.dropdownButton = el) }, index.h("span", { key: 'da9dd1d6b822e26e478edef34127324a24c4fa46', class: "prefix" }, this.label, ":"), selectedOption ? selectedOption.label : this.placeholder), index.h("div", { key: 'c3e735e29d3a53780c94689502044af65df358da', style: { flex: '1' } }), index.h("div", { key: '7ea36915d9db4c97520486db47cb60f6b08ba868', class: "separator" }), index.h("div", { key: '32b41b27f18e34ab13c80af1562489df9c75edcc', class: "arrow", innerHTML: DropdownArrow, "aria-label": "Open Menu" })), index.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 ? (index.h("button", { onClick: e => this.handleSelectOption(e, option), class: `option ${option.value === this.value ? 'selected' : ''}`, disabled: option.disabled }, option.label)) : (index.h("div", { class: "separator" }))))));
+        return (index.h(index.Host, { key: 'ccc8423ebae51aa9c9523ae8ddb547b5ff33e85c', class: { open: !!this.open }, style: { minWidth, display: 'inline-block' } }, index.h("div", { key: '51edc34e8ff8916c206413a2a0006733df65a6ee', class: "control", onClick: e => this.toggleDropdown(e), onBlur: e => this.handleHideDropdown(e) }, index.h("div", { key: 'a58d23d6fb24512f2857b3f7b96fb1f29e3bb4da', class: "title", ref: el => (this.dropdownButton = el) }, index.h("span", { key: 'ec2639bb2800f5d1df9c024c7b35db9e178a1514', class: "prefix" }, this.label, ":"), selectedOption ? selectedOption.label : this.placeholder), index.h("div", { key: '11f5ed99195b02d467f7dcb38fe69a85ff6c166b', style: { flex: '1' } }), index.h("div", { key: 'b58e34715555bc873f0850c01f70a37593462cd1', class: "separator" }), index.h("div", { key: 'bc7618f508a8a5b9e4c27c7fa4a0203e96e12e3c', class: "arrow", innerHTML: DropdownArrow, "aria-label": "Open Menu" })), index.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 ? (index.h("button", { onClick: e => this.handleSelectOption(e, option), class: `option ${option.value === this.value ? 'selected' : ''}`, disabled: option.disabled }, option.label)) : (index.h("div", { class: "separator" }))))));
     }
     get el() { return index.getElement(this); }
 };