@verdocs/web-sdk 1.1.0 → 1.4.2

package/dist/cjs/verdocs-template-card.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-6fc067b7.js');
+const index = require('./index-589f3be8.js');
 
 const ActionsIcon = `<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/></svg>`;
 
@@ -22,9 +22,9 @@ const StarIcon = `<svg width="31" height="29" viewBox="0 0 31 29" fill="none" xm
 </svg>
 `;
 
-const verdocsTemplateCardCss = "verdocs-template-card{font-family:sans-serif;font-family:var(--verdocs-font);width:320px;height:320px;display:-ms-flexbox;display:flex;padding:25px;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-direction:column;flex-direction:column;background-color:#ffffff;-webkit-box-shadow:2px 2px 5px rgba(51, 54, 75, 0.05);box-shadow:2px 2px 5px rgba(51, 54, 75, 0.05)}verdocs-template-card .thumbnail{width:272px;height:158px;-o-object-fit:cover;object-fit:cover;margin-bottom:22px;-o-object-position:-20% 0;object-position:-20% 0}verdocs-template-card .name{font-size:18px;font-weight:700;margin-bottom:7px}verdocs-template-card .org-name{font-size:14px;font-weight:700;margin-bottom:6px}verdocs-template-card hr{width:100%;margin-bottom:17px;background-color:var(--verdocs-icon-color)}verdocs-template-card .controls{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-pack:justify;justify-content:space-between;text-align:center;font-size:16px}verdocs-template-card .controls .control{-ms-flex:1;flex:1;display:-ms-flexbox;display:flex;margin-right:8px;-ms-flex-align:start;align-items:flex-start;border-right:1px solid var(--verdocs-icon-color)}verdocs-template-card .controls .control.secondary{-ms-flex-pack:center;justify-content:center}verdocs-template-card .controls .control svg{fill:#adb6bd;height:16px;max-width:16px;margin:0 8px -2px 0}verdocs-template-card .additional-controls svg{margin-right:0;fill:#6c7de2}";
+const verdocsTemplateCardCss = "verdocs-template-card{font-family:\"Barlow\", sans-serif;width:320px;height:320px;display:-ms-flexbox;display:flex;padding:25px;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-direction:column;flex-direction:column;background-color:#ffffff;-webkit-box-shadow:2px 2px 5px rgba(51, 54, 75, 0.05);box-shadow:2px 2px 5px rgba(51, 54, 75, 0.05)}verdocs-template-card .thumbnail{width:272px;height:158px;-o-object-fit:cover;object-fit:cover;margin-bottom:22px;-o-object-position:-20% 0;object-position:-20% 0}verdocs-template-card .name{font-size:18px;font-weight:700;margin-bottom:7px}verdocs-template-card .org-name{font-size:14px;font-weight:700;margin-bottom:6px}verdocs-template-card hr{width:100%;margin-bottom:17px;background-color:#aeb4bf}verdocs-template-card .controls{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-pack:justify;justify-content:space-between;text-align:center;font-size:16px}verdocs-template-card .controls .control{-ms-flex:1;flex:1;display:-ms-flexbox;display:flex;margin-right:8px;-ms-flex-align:start;align-items:flex-start;border-right:1px solid #aeb4bf}verdocs-template-card .controls .control.secondary{-ms-flex-pack:center;justify-content:center}verdocs-template-card .controls .control svg{fill:#aeb4bf;height:16px;max-width:16px;margin:0 8px -2px 0}verdocs-template-card .additional-controls svg{margin-right:0;fill:#654dcb}";
 
-let VerdocsTemplateCard = class {
+const VerdocsTemplateCard = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }

package/dist/cjs/verdocs-template-tags.cjs.entry.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-6fc067b7.js');
+const index = require('./index-589f3be8.js');
 
-const verdocsTemplateTagsCss = "verdocs-template-tags{font-family:sans-serif;font-family:var(--verdocs-font)}verdocs-template-tags span{margin:0 4px;height:28px;font-size:12px;font-weight:600;padding:7px 12px;border-radius:5px;display:inline-block;-webkit-box-sizing:border-box;box-sizing:border-box;text-transform:uppercase;color:var(--verdocs-label-color);border:1px solid var(--verdocs-container-border-color);background-color:var(--verdocs-container-background-color)}";
+const verdocsTemplateTagsCss = "verdocs-template-tags{font-family:\"Barlow\", sans-serif}verdocs-template-tags span{margin:0 4px;height:28px;font-size:12px;font-weight:600;padding:5px 12px 7px;border-radius:5px;display:inline-block;-webkit-box-sizing:border-box;box-sizing:border-box;text-transform:uppercase;color:#33364b;border:1px solid #707ae5;background-color:#f5f5fa}";
 
-let VerdocsTemplateTags = class {
+const VerdocsTemplateTags = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }

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

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-6fc067b7.js');
+const index = require('./index-589f3be8.js');
 
-const verdocsToggleCss = "verdocs-toggle{font-family:sans-serif;font-family:var(--verdocs-font)}verdocs-toggle .container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap;background-color:#f2f5fa}verdocs-toggle .label{font-size:24px;font-weight:700;color:#33364b;-ms-flex-item-align:center;align-self:center;margin-right:27px;font-family:sans-serif}verdocs-toggle .buttons{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap}verdocs-toggle .buttons button{width:60px;height:60px;border:2px solid #654dcb;border-radius:5px;cursor:pointer}verdocs-toggle .buttons button:not(:last-child){margin-right:11px}verdocs-toggle .buttons svg{width:30px;height:30px}verdocs-toggle .buttons button:hover{background-color:#654dcb;-webkit-transition:0.25s;transition:0.25s}verdocs-toggle .buttons button:hover svg{fill:#f2f5fa;-webkit-transition:0.25s;transition:0.25s}verdocs-toggle .selected{background-color:#707ae5;-webkit-transition:0.25s;transition:0.25s}verdocs-toggle .selected svg{fill:#ffffff;-webkit-transition:0.25s;transition:0.25s}";
+const verdocsToggleCss = "verdocs-toggle{font-family:\"Barlow\", sans-serif}verdocs-toggle .container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap;background-color:#f5f5fa}verdocs-toggle .label{font-size:24px;font-weight:700;color:#33354c;-ms-flex-item-align:center;align-self:center;margin-right:27px;font-family:sans-serif}verdocs-toggle .buttons{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap}verdocs-toggle .buttons button{width:60px;height:60px;border:2px solid #654dcb;border-radius:5px;cursor:pointer}verdocs-toggle .buttons button:not(:last-child){margin-right:11px}verdocs-toggle .buttons svg{width:30px;height:30px}verdocs-toggle .buttons button:hover{background-color:#654dcb;-webkit-transition:0.25s;transition:0.25s}verdocs-toggle .buttons button:hover svg{fill:#f5f5fa;-webkit-transition:0.25s;transition:0.25s}verdocs-toggle .selected{background-color:#707ae5;-webkit-transition:0.25s;transition:0.25s}verdocs-toggle .selected svg{fill:#ffffff;-webkit-transition:0.25s;transition:0.25s}";
 
-let VerdocsToggle = class {
+const VerdocsToggle = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-6fc067b7.js');
+const index = require('./index-589f3be8.js');
 
 /**
  * Given a File, extract the file's content as a base64 encoded data URL. The response will have a prefix that
@@ -40,9 +40,9 @@ const Trash = `<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="non
 </svg>
 `;
 
-const verdocsUploadDialogCss = "verdocs-upload-dialog{font-family:sans-serif;font-family:var(--verdocs-font);-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-upload-dialog div{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-upload-dialog .background-overlay{position:absolute;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:#0000007f}verdocs-upload-dialog .dialog{width:300px;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-upload-dialog .heading{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;font-size:20px;font-weight:500}verdocs-upload-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-upload-dialog .buttons verdocs-button{margin-left:16px}verdocs-upload-dialog .drop-target{padding:30px 15px;width:100%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;background-color:#f5f5f5;border:2px dashed #979797;min-height:260px;text-align:center;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;color:rgba(0, 0, 0, 0.54);opacity:1;margin:20px 0}verdocs-upload-dialog .drop-target p{margin:12px 0}verdocs-upload-dialog .drop-target.dragging-over{border:5px solid blue}verdocs-upload-dialog .drop-target>verdocs-button{margin:12px 0;display:inline-block}verdocs-upload-dialog .attachments{height:56px;font-size:0;margin:20px 0;padding:0 16px;line-height:56px;white-space:normal;-webkit-box-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.14);box-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.14)}verdocs-upload-dialog .attachments .attachment{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}verdocs-upload-dialog .attachments .attachment .icon{width:18px;height:18px;line-height:18px}verdocs-upload-dialog .attachments .attachment .icon.trash{cursor:pointer}verdocs-upload-dialog .attachments .attachment .name{-ms-flex:1;flex:1;display:-ms-flexbox;display:flex;padding:0 8px;font-size:14px;font-weight:400}";
+const verdocsUploadDialogCss = "verdocs-upload-dialog{font-family:\"Barlow\", sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-upload-dialog div{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-upload-dialog .background-overlay{position:absolute;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:#0000007f}verdocs-upload-dialog .dialog{width:300px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;border-radius:4px;overflow:hidden;background:#ffffff;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-upload-dialog .heading{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;font-size:20px;font-weight:500}verdocs-upload-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-upload-dialog .buttons verdocs-button{margin-left:16px}verdocs-upload-dialog .drop-target{padding:30px 15px;width:100%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;background-color:#f5f5f5;border:2px dashed #979797;min-height:260px;text-align:center;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;color:rgba(0, 0, 0, 0.54);opacity:1;margin:20px 0}verdocs-upload-dialog .drop-target p{margin:12px 0}verdocs-upload-dialog .drop-target.dragging-over{border:5px solid #4c56cb}verdocs-upload-dialog .drop-target>verdocs-button{margin:12px 0;display:inline-block}verdocs-upload-dialog .attachments{height:56px;font-size:0;margin:20px 0;padding:0 16px;line-height:56px;white-space:normal;-webkit-box-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.14);box-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.14)}verdocs-upload-dialog .attachments .attachment{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}verdocs-upload-dialog .attachments .attachment .icon{width:18px;height:18px;line-height:18px}verdocs-upload-dialog .attachments .attachment .icon.trash{cursor:pointer}verdocs-upload-dialog .attachments .attachment .name{-ms-flex:1;flex:1;display:-ms-flexbox;display:flex;padding:0 8px;font-size:14px;font-weight:400}";
 
-let VerdocsUploadDialog = class {
+const VerdocsUploadDialog = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.cancel = index.createEvent(this, "cancel", 7);

package/dist/cjs/verdocs-web-sdk.cjs.js

@@ -1,9 +1,9 @@
 'use strict';
 
-const index = require('./index-6fc067b7.js');
+const index = require('./index-589f3be8.js');
 
 /*
- Stencil Client Patch Browser v2.12.1 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v2.17.1 | MIT Licensed | https://stenciljs.com
  */
 const patchBrowser = () => {
     const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('verdocs-web-sdk.cjs.js', document.baseURI).href));
@@ -15,5 +15,5 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return index.bootstrapLazy([["verdocs-sign.cjs",[[0,"verdocs-sign",{"documentid":[1],"roleid":[1],"invitecode":[1],"endpoint":[32],"recipient":[32],"signerToken":[32],"pdfUrl":[32],"recipientIndex":[32],"document":[32],"fields":[32],"pdfPageInfo":[32],"hasSignature":[32],"nextButtonLabel":[32],"focusedField":[32]}]]],["verdocs-search.cjs",[[0,"verdocs-search"]]],["verdocs-auth.cjs",[[0,"verdocs-auth",{"visible":[4],"logo":[1],"debug":[4],"isAuthenticated":[32],"displayMode":[32],"username":[32],"password":[32],"loggingIn":[32],"activeSession":[32],"loginError":[32]}]]],["search-tabs.cjs",[[4,"search-tabs",{"selected":[32]}]]],["verdocs-document-status.cjs",[[0,"verdocs-document-status",{"status":[1]}]]],["verdocs-organization-card.cjs",[[0,"verdocs-organization-card",{"organization":[16]}]]],["verdocs-template-card.cjs",[[0,"verdocs-template-card",{"template":[16]}]]],["verdocs-template-tags.cjs",[[0,"verdocs-template-tags",{"tags":[16]}]]],["verdocs-toggle.cjs",[[0,"verdocs-toggle",{"options":[16],"theme":[1]},[[6,"click","handleClick"]]]]],["verdocs-button_2.cjs",[[0,"verdocs-text-input",{"value":[1],"label":[1],"placeholder":[1],"autocomplete":[1],"type":[1],"disabled":[4],"_value":[32]}],[0,"verdocs-button",{"label":[1],"type":[1],"variant":[1],"disabled":[4]}]]],["verdocs-ok-dialog.cjs",[[0,"verdocs-ok-dialog",{"heading":[1],"message":[1],"open":[4],"cancel":[4]}]]],["verdocs-initial-dialog.cjs",[[0,"verdocs-initial-dialog",{"fullname":[1],"open":[4],"fontLoaded":[32],"enteredInitials":[32],"mode":[32]}]]],["verdocs-signature-dialog.cjs",[[0,"verdocs-signature-dialog",{"fullname":[1],"open":[4],"fontLoaded":[32],"enteredName":[32],"mode":[32]}]]],["verdocs-upload-dialog.cjs",[[0,"verdocs-upload-dialog",{"open":[4],"draggingOver":[32],"decodedFiles":[32]}]]],["verdocs-loader.cjs",[[0,"verdocs-loader"]]],["search-box_5.cjs",[[0,"search-box",{"placeholder":[1],"type":[1],"query":[1]}],[0,"search-quick-functions"],[0,"search-recent",{"limit":[2],"recent":[32],"emptyMessage":[32]}],[0,"search-saved",{"limit":[2],"saved":[32],"emptyMessage":[32]}],[0,"search-starred",{"options":[8],"emptyMessage":[32]}]]],["verdocs-dropdown_12.cjs",[[0,"verdocs-field-initial",{"required":[4],"fullName":[1,"full-name"],"value":[1],"focusField":[64]}],[0,"verdocs-field-signature",{"required":[4],"fullName":[1,"full-name"],"value":[1],"focusField":[64]}],[0,"verdocs-field-attachment",{"order":[2],"value":[1],"required":[4],"disabled":[4],"focusField":[64]}],[0,"verdocs-view",{"rotation":[2],"source":[1],"token":[1],"loadProgress":[32]}],[0,"verdocs-dropdown",{"options":[16],"open":[4],"isOpen":[32]}],[0,"verdocs-field-checkbox",{"order":[2],"value":[4],"required":[4],"disabled":[4]}],[0,"verdocs-field-date",{"placeholder":[1],"order":[2],"value":[1],"required":[4],"disabled":[4],"focused":[32],"focusField":[64]}],[0,"verdocs-field-dropdown",{"options":[16],"required":[4],"order":[2],"disabled":[4],"value":[1],"focused":[32],"focusField":[64]}],[0,"verdocs-field-payment",{"field":[16],"fields":[16],"pageNum":[2,"page-num"],"roleName":[1,"role-name"],"fieldId":[1,"field-id"],"recipients":[8],"selectedRoleName":[1,"selected-role-name"],"pdfPages":[16],"currentSignature":[1,"current-signature"],"currentSignatureId":[1,"current-signature-id"],"currentInitial":[1,"current-initial"],"currentInitialId":[1,"current-initial-id"],"focused":[4],"signed":[4],"preparedMessage":[32],"signatureUrl":[32]}],[0,"verdocs-field-radio-button",{"order":[2],"checked":[4],"value":[1],"name":[1],"required":[4],"disabled":[4]}],[0,"verdocs-field-textarea",{"placeholder":[1],"order":[2],"value":[1],"required":[4],"disabled":[4],"focused":[32],"focusField":[64]}],[0,"verdocs-field-textbox",{"placeholder":[1],"order":[2],"value":[1],"required":[4],"disabled":[4],"focused":[32],"focusField":[64]}]]]], options);
+  return index.bootstrapLazy([["verdocs-sign.cjs",[[0,"verdocs-sign",{"documentid":[1],"roleid":[1],"invitecode":[1],"endpoint":[32],"recipient":[32],"signerToken":[32],"pdfUrl":[32],"recipientIndex":[32],"document":[32],"fields":[32],"pdfPageInfo":[32],"hasSignature":[32],"nextButtonLabel":[32],"focusedField":[32]}]]],["verdocs-auth.cjs",[[0,"verdocs-auth",{"visible":[4],"logo":[1],"debug":[4],"isAuthenticated":[32],"displayMode":[32],"username":[32],"password":[32],"loggingIn":[32],"activeSession":[32],"loginError":[32]}]]],["verdocs-search.cjs",[[0,"verdocs-search"]]],["verdocs-kba-dialog.cjs",[[0,"verdocs-kba-dialog",{"step":[2],"steps":[2],"helptitle":[1],"helptext":[1],"mode":[1],"label":[1],"placeholder":[1],"choices":[16],"open":[4],"response":[32]}]]],["verdocs-organization-card.cjs",[[0,"verdocs-organization-card",{"organization":[16]}]]],["verdocs-quick-functions.cjs",[[0,"verdocs-quick-functions"]]],["verdocs-search-tabs.cjs",[[0,"verdocs-search-tabs",{"selected":[32]}]]],["verdocs-status-indicator.cjs",[[0,"verdocs-status-indicator",{"size":[1],"theme":[1],"status":[1],"document":[16],"isOpen":[32],"recipientStatusIcons":[32]}]]],["verdocs-template-card.cjs",[[0,"verdocs-template-card",{"template":[16]}]]],["verdocs-template-tags.cjs",[[0,"verdocs-template-tags",{"tags":[16]}]]],["verdocs-toggle.cjs",[[0,"verdocs-toggle",{"options":[16],"theme":[1]},[[6,"click","handleClick"]]]]],["verdocs-button_2.cjs",[[0,"verdocs-text-input",{"value":[1],"label":[1],"placeholder":[1],"autocomplete":[1],"type":[1],"disabled":[4],"_value":[32]}],[0,"verdocs-button",{"label":[1],"startIcon":[1,"start-icon"],"endIcon":[1,"end-icon"],"size":[1],"type":[1],"variant":[1],"disabled":[4]}]]],["verdocs-ok-dialog.cjs",[[0,"verdocs-ok-dialog",{"heading":[1],"message":[1],"open":[4],"cancel":[4]}]]],["verdocs-initial-dialog.cjs",[[0,"verdocs-initial-dialog",{"fullname":[1],"open":[4],"fontLoaded":[32],"enteredInitials":[32],"mode":[32]}]]],["verdocs-signature-dialog.cjs",[[0,"verdocs-signature-dialog",{"fullname":[1],"open":[4],"fontLoaded":[32],"enteredName":[32],"mode":[32]}]]],["verdocs-upload-dialog.cjs",[[0,"verdocs-upload-dialog",{"open":[4],"draggingOver":[32],"decodedFiles":[32]}]]],["verdocs-search-activity_2.cjs",[[0,"verdocs-search-activity",{"type":[1],"options":[8],"emptyMessage":[32],"authFailure":[32],"title":[32],"recent":[32],"saved":[32],"starred":[32]}],[0,"verdocs-search-box",{"placeholder":[1],"type":[1],"query":[1]}]]],["verdocs-loader.cjs",[[0,"verdocs-loader"]]],["verdocs-dropdown_12.cjs",[[0,"verdocs-field-initial",{"required":[4],"fullName":[1,"full-name"],"value":[1],"focusField":[64]}],[0,"verdocs-field-signature",{"required":[4],"fullName":[1,"full-name"],"value":[1],"focusField":[64]}],[0,"verdocs-field-attachment",{"order":[2],"value":[1],"required":[4],"disabled":[4],"focusField":[64]}],[0,"verdocs-view",{"rotation":[2],"source":[1],"token":[1],"loadProgress":[32]}],[0,"verdocs-dropdown",{"options":[16],"open":[4],"isOpen":[32]}],[0,"verdocs-field-checkbox",{"order":[2],"value":[4],"required":[4],"disabled":[4]}],[0,"verdocs-field-date",{"placeholder":[1],"order":[2],"value":[1],"required":[4],"disabled":[4],"focused":[32],"focusField":[64]}],[0,"verdocs-field-dropdown",{"options":[16],"required":[4],"order":[2],"disabled":[4],"value":[1],"focused":[32],"focusField":[64]}],[0,"verdocs-field-payment",{"field":[16],"fields":[16],"pageNum":[2,"page-num"],"roleName":[1,"role-name"],"fieldId":[1,"field-id"],"recipients":[8],"selectedRoleName":[1,"selected-role-name"],"pdfPages":[16],"currentSignature":[1,"current-signature"],"currentSignatureId":[1,"current-signature-id"],"currentInitial":[1,"current-initial"],"currentInitialId":[1,"current-initial-id"],"focused":[4],"signed":[4],"preparedMessage":[32],"signatureUrl":[32]}],[0,"verdocs-field-radio-button",{"order":[2],"checked":[4],"value":[1],"name":[1],"required":[4],"disabled":[4]}],[0,"verdocs-field-textarea",{"placeholder":[1],"order":[2],"value":[1],"required":[4],"disabled":[4],"focused":[32],"focusField":[64]}],[0,"verdocs-field-textbox",{"placeholder":[1],"order":[2],"value":[1],"required":[4],"disabled":[4],"focused":[32],"focusField":[64]}]]]], options);
 });

package/dist/collection/collection-manifest.json

@@ -1,26 +1,22 @@
 {
   "entries": [
-    "./components/elements/search-box/search-box.js",
     "./components/embeds/verdocs-auth/verdocs-auth.js",
     "./components/controls/verdocs-dropdown/verdocs-dropdown.js",
+    "./components/elements/verdocs-search-box/verdocs-search-box.js",
     "./components/controls/verdocs-toggle/verdocs-toggle.js",
     "./components/embeds/verdocs-view/verdocs-view.js",
     "./components/controls/verdocs-button/verdocs-button.js",
-    "./components/controls/verdocs-document-status/verdocs-document-status.js",
     "./components/controls/verdocs-loader/verdocs-loader.js",
     "./components/controls/verdocs-organization-card/verdocs-organization-card.js",
+    "./components/controls/verdocs-status-indicator/verdocs-status-indicator.js",
     "./components/controls/verdocs-template-card/verdocs-template-card.js",
     "./components/controls/verdocs-template-tags/verdocs-template-tags.js",
     "./components/controls/verdocs-text-input/verdocs-text-input.js",
     "./components/dialogs/verdocs-initial-dialog/verdocs-initial-dialog.js",
+    "./components/dialogs/verdocs-kba-dialog/verdocs-kba-dialog.js",
     "./components/dialogs/verdocs-ok-dialog/verdocs-ok-dialog.js",
     "./components/dialogs/verdocs-signature-dialog/verdocs-signature-dialog.js",
     "./components/dialogs/verdocs-upload-dialog/verdocs-upload-dialog.js",
-    "./components/elements/search-quick-functions/search-quick-functions.js",
-    "./components/elements/search-recent/search-recent.js",
-    "./components/elements/search-saved/search-saved.js",
-    "./components/elements/search-starred/search-starred.js",
-    "./components/elements/search-tabs/search-tabs.js",
     "./components/elements/verdocs-field-attachment/verdocs-field-attachment.js",
     "./components/elements/verdocs-field-checkbox-group/verdocs-field-checkbox.js",
     "./components/elements/verdocs-field-date/verdocs-field-date.js",
@@ -31,13 +27,16 @@
     "./components/elements/verdocs-field-signature/verdocs-field-signature.js",
     "./components/elements/verdocs-field-textarea/verdocs-field-textarea.js",
     "./components/elements/verdocs-field-textbox/verdocs-field-textbox.js",
+    "./components/elements/verdocs-quick-functions/verdocs-quick-functions.js",
+    "./components/elements/verdocs-search-activity/verdocs-search-activity.js",
+    "./components/elements/verdocs-search-tabs/verdocs-search-tabs.js",
     "./components/embeds/verdocs-search/verdocs-search.js",
     "./components/embeds/verdocs-sign/verdocs-sign.js"
   ],
   "compiler": {
     "name": "@stencil/core",
-    "version": "2.12.1",
-    "typescriptVersion": "4.3.5"
+    "version": "2.17.1",
+    "typescriptVersion": "4.5.4"
   },
   "collections": [],
   "bundles": []

package/dist/collection/components/controls/verdocs-button/verdocs-button.css

@@ -1,64 +1,140 @@
 verdocs-button button {
-  font-family: sans-serif;
-  font-family: var(--verdocs-font);
+  font-family: "Barlow", sans-serif;
   text-transform: uppercase;
+  justify-content: center;
+  display: inline-flex;
+  align-items: center;
+  font-weight: 700;
   cursor: pointer;
-  font-weight: 500;
+  margin: 0;
+}
+verdocs-button button .icon {
+  margin: 0 12px;
+}
+verdocs-button button .icon svg {
+  fill: #ffffff;
+  display: block;
+}
+verdocs-button button .label {
+  padding: 0 12px;
 }
 verdocs-button button:disabled {
   cursor: none;
 }
-verdocs-button.standard button {
-  background: var(--verdocs-primary-color);
-  border-radius: 4px;
+verdocs-button button.small {
+  height: 34px;
+  font-size: 13px;
+}
+verdocs-button button.small .icon {
+  margin: 0 4px;
+}
+verdocs-button button.small .icon svg {
+  margin: 2px 0 0 0;
+  height: 20px;
+}
+verdocs-button button.small .label {
+  padding: 0 4px;
+}
+verdocs-button button.normal {
+  height: 44px;
   font-size: 14px;
-  color: white;
-  border: none;
-  outline: none;
-  height: 32px;
-  margin: 0;
-  display: block;
+}
+verdocs-button button.normal .icon.start {
+  margin: 0 4px 0 8px;
+}
+verdocs-button button.normal .icon.end {
+  margin: 0 8px 0 4px;
+}
+verdocs-button button.normal .icon svg {
+  margin: 2px 0 0 0;
+  height: 22px;
+}
+verdocs-button button.normal .label {
+  padding: 0 10px;
+}
+verdocs-button button.medium {
+  height: 52px;
+  font-size: 16px;
+}
+verdocs-button button.medium .icon.start {
+  margin: 0 0 0 18px;
+}
+verdocs-button button.medium .icon.end {
+  margin: 0 18px 0 0;
+}
+verdocs-button button.medium .icon svg {
+  margin: 2px 0 0 0;
+  height: 26px;
+}
+verdocs-button button.medium .label {
   padding: 0 20px;
 }
-verdocs-button.standard button:disabled {
-  background-color: #999;
+verdocs-button button.large {
+  height: 60px;
+  font-size: 20px;
+}
+verdocs-button button.large .icon.start {
+  margin: 0 0 0 24px;
+}
+verdocs-button button.large .icon.end {
+  margin: 0 24px 0 0;
+}
+verdocs-button button.large .icon svg {
+  margin: 2px 0 0 0;
+  height: 32px;
+}
+verdocs-button button.large .label {
+  padding: 0 34px;
+}
+verdocs-button button.standard {
+  background: #55bc81;
+  border-radius: 4px;
+  outline: none;
+  border: none;
+  color: white;
+}
+verdocs-button button.standard:disabled {
+  background-color: #999999;
   cursor: default;
 }
-verdocs-button.standard button:active {
+verdocs-button button.standard:active:not([disabled]) {
   filter: brightness(110%);
 }
-verdocs-button.text button {
-  border: none;
-  font-size: 14px;
-  color: var(--verdocs-secondary-color);
-  font-weight: 400;
-  outline: none;
+verdocs-button button.text {
+  color: #4c56cb;
   background: transparent;
+  font-weight: 500;
   padding: 0 4px;
+  outline: none;
+  border: none;
 }
-verdocs-button.text button:disabled {
-  color: #999;
+verdocs-button button.text:disabled {
+  color: #999999;
   cursor: none;
 }
-verdocs-button.text button:active {
+verdocs-button button.text:active:not([disabled]) {
   filter: brightness(130%);
 }
-verdocs-button.outline button {
-  font-size: 14px;
-  border: 1px solid var(--verdocs-secondary-color);
-  color: var(--verdocs-secondary-color);
+verdocs-button button.text .icon svg {
+  fill: #4c56cb;
+}
+verdocs-button button.outline {
+  border: 1px solid #4c56cb;
+  color: #4c56cb;
   outline: none;
   background: transparent;
-  height: 32px;
   border-radius: 4px;
   padding: 0 20px;
 }
-verdocs-button.outline button:disabled {
-  color: #999;
+verdocs-button button.outline:disabled {
+  color: #999999;
   cursor: none;
-  border: 1px solid #999;
+  border: 1px solid #999999;
 }
-verdocs-button.outline button:active {
-  background: var(--verdocs-secondary-color);
+verdocs-button button.outline:active {
+  background: #4c56cb;
   color: white;
+}
+verdocs-button button.outline .icon svg {
+  fill: #4c56cb;
 }

package/dist/collection/components/controls/verdocs-button/verdocs-button.js

@@ -1,15 +1,33 @@
-import { Component, Prop, h, Host, Event } from '@stencil/core';
+import { Component, Prop, h, Event } from '@stencil/core';
 /**
- * Display a simple button. Three variants are supported. Standard and Outline buttons look like traditional form buttons and are
- * ideal candidates for 'Ok' and 'Cancel' options in most cases. Text buttons are intended to be used inline in content blocks or
- * for more subtle button options. (Auth uses text buttons for the Forgot Password and Sign Up options.)
+ * Display a simple button.
+ *
+ * Three variants are supported. `standard` and `outline` buttons look like traditional form buttons and are ideal candidates for 'Ok' and
+ * 'Cancel' options in most cases. `text` buttons are intended to be used inline in content blocks or for more subtle button options.
+ * (Auth uses text buttons for the Forgot Password and Sign Up options.)
+ *
+ * Four sizes are also supported. Most use cases will call for the `normal` size, but a `small` size is ideal for more subtle controls, such
+ * as pagination or other secondary functions. `medium` buttons are slightly larger to provide balance in forms where other items are also
+ * bigger, and `large` buttons are for cases where the page has mostly white-space and the buttons need to fill more space.
+ *
+ * Icons may be placed either before ("start") or after ("end") the button label. Icons should be SVG objects passed as strings and will
+ * be rendered as HTML inside the button label area. It is important that the root <SVG> tag contains a default `fill="#ffffff"` setting
+ * for the base color, and that child elements below it do not. This allows the button color to carry into the icon properly.
  */
 export class VerdocsButton {
   constructor() {
     /**
-     * The label for the  button.
+     * If desired, a prefix icon for the button
      */
-    this.label = '';
+    this.startIcon = null;
+    /**
+     * If desired, a suffix icon for the button
+     */
+    this.endIcon = null;
+    /**
+     * The size (height) of the button.
+     */
+    this.size = 'normal';
     /**
      * The type of the button.
      */
@@ -23,15 +41,16 @@ export class VerdocsButton {
      */
     this.disabled = false;
   }
-  componentWillLoad() { }
-  componentDidLoad() { }
   handleClick(e) {
     e.preventDefault();
     this.press.emit();
   }
   render() {
-    return (h(Host, { class: `${this.variant}` },
-      h("button", { disabled: this.disabled, type: this.type, onClick: e => this.handleClick(e) }, this.label)));
+    console.log('Rendering button', this.startIcon);
+    return (h("button", { disabled: this.disabled, type: this.type, onClick: e => this.handleClick(e), class: `${this.variant} ${this.size} ${this.type}` },
+      this.startIcon ? h("span", { class: "icon start", innerHTML: this.startIcon }) : null,
+      h("span", { class: "label" }, this.label),
+      this.endIcon ? h("span", { class: "icon end", innerHTML: this.endIcon }) : null));
   }
   static get is() { return "verdocs-button"; }
   static get originalStyleUrls() { return {
@@ -49,15 +68,68 @@ export class VerdocsButton {
         "resolved": "string",
         "references": {}
       },
-      "required": false,
+      "required": true,
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "The label for the  button."
+        "text": "The label for the button."
       },
       "attribute": "label",
+      "reflect": false
+    },
+    "startIcon": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string | null",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "If desired, a prefix icon for the button"
+      },
+      "attribute": "start-icon",
+      "reflect": false,
+      "defaultValue": "null"
+    },
+    "endIcon": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string | null",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "If desired, a suffix icon for the button"
+      },
+      "attribute": "end-icon",
+      "reflect": false,
+      "defaultValue": "null"
+    },
+    "size": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "'small' | 'normal' | 'medium' | 'large'",
+        "resolved": "\"large\" | \"medium\" | \"normal\" | \"small\"",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "The size (height) of the button."
+      },
+      "attribute": "size",
       "reflect": false,
-      "defaultValue": "''"
+      "defaultValue": "'normal'"
     },
     "type": {
       "type": "string",

package/dist/collection/components/controls/verdocs-button/verdocs-button.stories.js

@@ -1,14 +1,45 @@
 import { html } from 'lit-html';
+// Circle with three dots in it
+const CircleIcon = `
+  <svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#ffffff">
+    <g>
+      <rect fill="none" height="24" width="24"/>
+    </g>
+    <g>
+      <g>
+        <path d="M12,2C6.48,2,2,6.48,2,12c0,5.52,4.48,10,10,10s10-4.48,10-10C22,6.48,17.52,2,12,2z M12,20c-4.42,0-8-3.58-8-8 c0-4.42,3.58-8,8-8s8,3.58,8,8C20,16.42,16.42,20,12,20z"/>
+        <circle cx="7" cy="12" r="1.5"/>
+        <circle cx="12" cy="12" r="1.5"/>
+        <circle cx="17" cy="12" r="1.5"/>
+      </g>
+    </g>
+  </svg>
+`;
+const ArrowIcon = `
+<svg width="10" height="26" viewBox="0 0 10 26" fill="#ffffff" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_31568_3647)">
+<path d="M9.64682 13.431L2.10645 20.9466C1.86503 21.1853 1.47466 21.1853 1.23324 20.9466L0.216218 19.9411C-0.0251976 19.7025 -0.0251976 19.3165 0.216218 19.0778L6.30296 12.9993L0.216218 6.9208C-0.0251976 6.68213 -0.0251976 6.29619 0.216218 6.05752L1.23324 5.05205C1.47466 4.81338 1.86503 4.81338 2.10645 5.05205L9.64682 12.5677C9.88824 12.8064 9.88824 13.1923 9.64682 13.431Z"/>
+</g>
+<defs>
+<clipPath id="clip0_31568_3647">
+<rect width="9.86207" height="26"/>
+</clipPath>
+</defs>
+</svg>
+`;
 export default {
   title: 'Controls/Button',
   component: 'verdocs-button',
   args: {
     label: 'Click Me',
     type: 'button',
+    size: 'normal',
+    variant: 'standard',
     disabled: false,
   },
   argTypes: {
-    variant: { defaultValue: 'standard' },
+    startIcon: { defaultValue: false, control: { type: 'boolean' } },
+    endIcon: { defaultValue: false, control: { type: 'boolean' } },
     press: {
       action: 'press',
       table: {
@@ -17,4 +48,12 @@ export default {
     },
   },
 };
-export const Button = ({ label, variant, disabled, press }) => html `<verdocs-button .label=${label} .variant=${variant} .disabled=${disabled} @press=${press} />`;
+export const Button = ({ label, size, variant, disabled, startIcon, endIcon, press }) => html `<verdocs-button
+    .label=${label}
+    .startIcon=${startIcon ? CircleIcon : null}
+    .endIcon=${endIcon ? ArrowIcon : null}
+    .size=${size}
+    .variant=${variant}
+    .disabled=${disabled}
+    @press=${press}
+  />`;

package/dist/collection/components/controls/verdocs-dropdown/verdocs-dropdown.css

@@ -1,7 +1,5 @@
 verdocs-dropdown {
-  /* Fallback font for old browsers */
-  font-family: sans-serif;
-  font-family: var(--verdocs-font);
+  font-family: "Barlow", sans-serif;
   display: block;
 }
 verdocs-dropdown .arrow {
@@ -12,11 +10,11 @@ verdocs-dropdown .arrow {
   border-radius: 4px;
   align-items: center;
   display: inline-flex;
-  border: 1px solid #ccc;
+  border: 1px solid #cccccc;
   justify-content: center;
 }
 verdocs-dropdown .arrow svg {
-  fill: var(--verdocs-primary-color);
+  fill: #55bc81;
   transition: 0.3s;
 }
 verdocs-dropdown .items {
@@ -24,7 +22,7 @@ verdocs-dropdown .items {
   display: none;
   z-index: 10000;
   border-radius: 5px;
-  background: #33364b;
+  background: #33354c;
   border: 1px solid #654dcb;
 }
 verdocs-dropdown .items[data-show] {
@@ -41,13 +39,13 @@ verdocs-dropdown .option {
 }
 verdocs-dropdown .option:hover {
   cursor: pointer;
-  background: var(--verdocs-primary-color);
+  background: #55bc81;
 }
 verdocs-dropdown .option[disabled] {
-  color: #aaa;
+  color: #aaaaaa;
 }
 verdocs-dropdown .option[disabled]:hover {
-  color: #aaa;
+  color: #aaaaaa;
   cursor: inherit;
   background: transparent;
 }
@@ -59,7 +57,6 @@ verdocs-dropdown.open .arrow {
   border: 1px solid #707ae5;
 }
 verdocs-dropdown.open .arrow svg {
-  /*transform: rotate(180deg);*/
   transform: scaleY(-1);
   fill: #fff;
 }

package/dist/collection/components/controls/verdocs-dropdown/verdocs-dropdown.js

@@ -5,20 +5,6 @@ import SortDown from './down-arrow.svg';
 /**
  * Display a drop-down menu button. A menu of the specified options will be displayed when the button is pressed. The menu will be hidden
  * when the button is pressed again, or an option is selected.
- *
- * ```typescript
- * interface IMenuOption {
- *   // The label to display on the menu option.
- *   label: string;
- *   // Optional icon to display next to the option's label. Specify icons as SVG strings.
- *   icon?: string;
- *   // If true, the option will be shown disabled (dimmed and not clickable).
- *   disabled?: boolean;
- *   // Optional additional fields such as IDs or other data. When a menu option is clicked/tapped, the associated
- *   // IMenuOptionwill be passed to the event handler. This data may be used to help identify the option selected.
- *   [key: string]: any;
- * }
- * ```
  */
 export class VerdocsDropdown {
   constructor() {
@@ -31,7 +17,7 @@ export class VerdocsDropdown {
     this.isOpen = !!this.open;
   }
   componentDidLoad() {
-    this.popper = createPopper(this.dropdownButton, this.dropdownMenu, { placement: 'bottom-start', modifiers: [{ name: 'offset', options: { offset: [0, 10] } }] });
+    this.popper = createPopper(this.dropdownButton, this.dropdownMenu, { placement: 'bottom-start', modifiers: [{ name: 'offset', options: { offset: [0, 6] } }] });
   }
   handleSelectOption(option) {
     this.isOpen = false;

package/dist/collection/components/controls/verdocs-loader/verdocs-loader.js

@@ -1,4 +1,7 @@
 import { Component, h, Host } from '@stencil/core';
+/**
+ * Animated loader placeholder. There are currently no configuration options for this control.
+ */
 export class VerdocsLoader {
   render() {
     return h(Host, null);