@verdocs/web-sdk 4.2.24 → 4.2.25

package/dist/collection/components/embeds/verdocs-auth/verdocs-auth.css

@@ -12,24 +12,25 @@
 verdocs-auth {
   font-family: "Inter", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;
   display: flex;
-  flex-direction: column;
   align-items: center;
+  flex-direction: column;
   justify-content: center;
 }
 verdocs-auth .form {
-  background: #ffffff;
-  align-items: center;
-  justify-content: center;
-  flex-direction: column;
+  width: 320px;
   display: flex;
   padding: 20px;
-  width: 320px;
-  max-width: 100%;
+  max-width: 90%;
+  align-items: center;
+  flex-direction: column;
+  box-sizing: border-box;
+  justify-content: center;
+  background: #ffffff;
 }
 verdocs-auth .logo {
-  margin: 20px 0 30px;
   width: 128px;
   max-width: 100%;
+  margin: 20px 0 30px;
 }
 verdocs-auth h3 {
   text-align: center;
@@ -91,7 +92,7 @@ verdocs-auth .account-option {
   flex-direction: row;
 }
 verdocs-auth p {
-  margin: 1em 0 0;
+  margin: 0 0 1em 0;
 }
 verdocs-auth p + p {
   margin-top: 0;

package/dist/collection/components/embeds/verdocs-auth/verdocs-auth.js

@@ -23,11 +23,13 @@ export class VerdocsAuth {
         // We can't instantly log in on the default endpoint because other listeners might see
         // its events and incorrectly trigger before we're done. So we manage our own temp
         // endpoint and pass the final tokens to the default once we're ready.
-        this.tempAuthEndpoint = new VerdocsEndpoint();
+        this.tempAuthEndpoint = new VerdocsEndpoint({
+            baseURL: VerdocsEndpoint.getDefault().getBaseURL(),
+            persist: false,
+        });
         this.endpoint = VerdocsEndpoint.getDefault();
         this.visible = true;
         this.logo = 'https://app.verdocs.com/assets/blue-logo.svg';
-        this.isAuthenticated = false;
         this.displayMode = 'login';
         this.org_name = '';
         this.first_name = '';
@@ -35,8 +37,8 @@ export class VerdocsAuth {
         this.email = '';
         this.verificationCode = '';
         this.password = '';
+        this.confirmpass = '';
         this.submitting = false;
-        this.activeSession = null;
         this.resendDisabled = false;
     }
     componentWillLoad() {
@@ -44,8 +46,6 @@ export class VerdocsAuth {
         this.endpoint.loadSession();
         if (this.endpoint.session) {
             console.log('[AUTH] Authenticated');
-            this.isAuthenticated = true;
-            this.activeSession = this.endpoint.session;
             (_a = this.authenticated) === null || _a === void 0 ? void 0 : _a.emit({ authenticated: true, session: this.endpoint.session });
         }
         else {
@@ -70,12 +70,16 @@ export class VerdocsAuth {
         return password.length >= 8 && countOfLowerCase > 0 && countOfUpperCase > 0 && countOfSpecialChar > 0;
     }
     handleSignup() {
-        this.submitting = true;
-        this.tempAuthEndpoint.clearSession();
         if (!this.isPasswordComplex(this.password)) {
-            window.alert('Password must be at least 8 characters long and contain at least one uppercase, one lowercase, and one special character.');
+            VerdocsToast('Password must be at least 8 characters long and contain at least one uppercase, one lowercase, and one special character.', { style: 'error' });
+            return;
+        }
+        if (this.password !== this.confirmpass) {
+            VerdocsToast('Passwords do not match.', { style: 'error' });
             return;
         }
+        this.submitting = true;
+        this.tempAuthEndpoint.clearSession();
         createProfile(this.tempAuthEndpoint, {
             email: this.email,
             password: this.password,
@@ -86,13 +90,13 @@ export class VerdocsAuth {
             .then(r => {
             console.log('Profile creation result', r);
             this.tempAuthEndpoint.setToken(r.access_token);
+            this.clearForms();
             this.displayMode = 'verify';
         })
             .catch(e => {
             var _a, _b, _c, _d, _e, _f;
             console.log('[AUTH] Signup error', e.response);
             this.submitting = false;
-            this.activeSession = null;
             (_a = this.authenticated) === null || _a === void 0 ? void 0 : _a.emit({ authenticated: false, session: null });
             (_b = this.sdkError) === null || _b === void 0 ? void 0 : _b.emit(new SDKError(e.message, (_c = e.response) === null || _c === void 0 ? void 0 : _c.status, (_d = e.response) === null || _d === void 0 ? void 0 : _d.data));
             VerdocsToast('Signup failed: ' + ((_f = (_e = e.response) === null || _e === void 0 ? void 0 : _e.data) === null || _f === void 0 ? void 0 : _f.message) || 'Unknown Error', { style: 'error' });
@@ -102,8 +106,8 @@ export class VerdocsAuth {
         this.submitting = true;
         try {
             this.submitting = false;
-            const verificationResult = await verifyEmail(this.endpoint, { email: this.email, token: this.verificationCode });
-            console.log('Verification result', verificationResult);
+            const verificationResult = await verifyEmail(this.tempAuthEndpoint, { email: this.email, token: this.verificationCode });
+            VerdocsToast('Thank you for verifying your email address.', { style: 'success' });
             this.completeLogin(verificationResult);
         }
         catch (e) {
@@ -114,18 +118,19 @@ export class VerdocsAuth {
     }
     completeLogin(result) {
         var _a;
+        this.clearForms();
+        this.tempAuthEndpoint.clearSession();
         this.endpoint.setToken(result.access_token);
-        this.activeSession = this.endpoint.session;
-        this.isAuthenticated = true;
         (_a = this.authenticated) === null || _a === void 0 ? void 0 : _a.emit({ authenticated: true, session: this.endpoint.session });
     }
     async loginAndCheckVerification() {
+        var _a;
         this.submitting = true;
         this.tempAuthEndpoint.clearSession();
         try {
             this.submitting = false;
-            const authResult = await authenticate(this.endpoint, { username: this.email, password: this.password, grant_type: 'password' });
-            console.log('[AUTH] Authenticated', authResult.access_token);
+            const authResult = await authenticate(this.tempAuthEndpoint, { username: this.email, password: this.password, grant_type: 'password' });
+            console.log('[AUTH] Authenticated, checking email verification');
             this.tempAuthEndpoint.setToken(authResult.access_token);
             const user = await getMyUser(this.tempAuthEndpoint);
             console.log('Got user', user);
@@ -140,14 +145,29 @@ export class VerdocsAuth {
         }
         catch (e) {
             this.submitting = false;
+            console.log('[AUTH] Auth failure', ((_a = e.response) === null || _a === void 0 ? void 0 : _a.data) || e);
+            VerdocsToast('Login failed. Please check your credentials and try again.', { style: 'error' });
         }
     }
+    clearForms() {
+        this.submitting = false;
+        this.resendDisabled = false;
+        this.email = '';
+        this.password = '';
+        this.confirmpass = '';
+        this.verificationCode = '';
+        this.first_name = '';
+        this.last_name = '';
+        this.org_name = '';
+    }
     handleLogout() {
         var _a;
+        console.log('logging out');
         this.endpoint.clearSession();
         this.tempAuthEndpoint.clearSession();
-        this.isAuthenticated = false;
         (_a = this.authenticated) === null || _a === void 0 ? void 0 : _a.emit({ authenticated: false, session: null });
+        this.clearForms();
+        this.displayMode = 'login';
     }
     handleResend() {
         // Avoid the user just click-spamming this pathway. The server rate-limits this anyway so it's not a
@@ -160,10 +180,11 @@ export class VerdocsAuth {
         resendVerification(this.tempAuthEndpoint)
             .then(r => {
             console.log('[AUTH] Verification request resent', r);
-            VerdocsToast('Please check your email for a message with verification instructions.', { style: 'info' });
+            VerdocsToast('Please check your email for a verification code.', { style: 'info' });
         })
             .catch((e) => {
             console.log('[AUTH] Unable to resend verification', e);
+            VerdocsToast('Unable to resend code. Please try again later.', { style: 'error' });
         });
     }
     async handleReset() {
@@ -185,20 +206,15 @@ export class VerdocsAuth {
         if (!this.visible) {
             return h("div", { style: { display: 'none' } }, "Authenticated");
         }
-        if (this.isAuthenticated) {
+        if (this.endpoint.session) {
             return (h("verdocs-button", { label: "Sign Out", disabled: this.submitting, onClick: () => this.handleLogout(), style: { display: 'flex', justifyContent: 'center', margin: '30px auto 0' } }));
         }
         if (this.displayMode === 'signup') {
-            const invalid = this.submitting || !this.first_name || !this.last_name || !this.email || !this.password || !this.org_name;
-            return (h("div", { class: "form" }, h("a", { href: "https://verdocs.com/en/" }, h("img", { src: this.logo, alt: "Verdocs Logo", class: "logo" })), h("h3", null, "Sign up for a free account"), h("h5", null, "Already have an account?", h("verdocs-button", { label: "Log In", variant: "text", onClick: () => (this.displayMode = 'login'), disabled: this.submitting })), h("form", { onSubmit: () => this.handleSignup() }, h("div", { style: { display: 'flex', flexDirection: 'row', columnGap: '20px' } }, h("verdocs-text-input", { label: "First Name", autocomplete: "first", required: true, value: this.first_name, onInput: (e) => (this.first_name = e.target.value), disabled: this.submitting }), h("verdocs-text-input", { label: "Last Name", autocomplete: "last", required: true, value: this.last_name, onInput: (e) => (this.last_name = e.target.value), disabled: this.submitting })), h("verdocs-text-input", { label: "Email Address", autocomplete: "email", required: true, value: this.email, onInput: (e) => (this.email = e.target.value), disabled: this.submitting }), h("verdocs-text-input", { label: "Password", type: "password", required: true, autocomplete: "current-password", value: this.password, onInput: (e) => (this.password = e.target.value), disabled: this.submitting }), h("verdocs-text-input", { label: "Organization Name", autocomplete: "org", required: true, value: this.org_name, onInput: (e) => (this.org_name = e.target.value), disabled: this.submitting, style: { flex: '1' } }), h("div", { style: { marginTop: '30px' } }), h("verdocs-button", { label: "Next", disabled: invalid, onClick: () => this.handleSignup(), style: { display: 'flex', justifyContent: 'center', margin: '30px auto 0' } }))));
+            const invalid = this.submitting || !this.first_name || !this.last_name || !this.email || !this.password || !this.confirmpass || !this.org_name;
+            return (h("div", { class: "form" }, h("a", { href: "https://verdocs.com/en/" }, h("img", { src: this.logo, alt: "Verdocs Logo", class: "logo" })), h("h3", null, "Sign up for a free account"), h("h5", null, "Already have an account?", h("verdocs-button", { label: "Log In", variant: "text", onClick: () => (this.displayMode = 'login'), disabled: this.submitting })), h("form", { onSubmit: () => this.handleSignup() }, h("div", { style: { display: 'flex', flexDirection: 'row', columnGap: '20px' } }, h("verdocs-text-input", { label: "First Name", autocomplete: "first", required: true, value: this.first_name, onInput: (e) => (this.first_name = e.target.value), disabled: this.submitting }), h("verdocs-text-input", { label: "Last Name", autocomplete: "last", required: true, value: this.last_name, onInput: (e) => (this.last_name = e.target.value), disabled: this.submitting })), h("verdocs-text-input", { label: "Email Address", autocomplete: "email", required: true, value: this.email, onInput: (e) => (this.email = e.target.value), disabled: this.submitting }), h("verdocs-text-input", { label: "Password", type: "password", required: true, autocomplete: "new-password", value: this.password, onInput: (e) => (this.password = e.target.value), disabled: this.submitting }), h("verdocs-text-input", { label: "Confirm Password", type: "password", required: true, autocomplete: "off", value: this.confirmpass, onInput: (e) => (this.confirmpass = e.target.value), disabled: this.submitting }), h("verdocs-text-input", { label: "Organization Name", autocomplete: "org", required: true, value: this.org_name, onInput: (e) => (this.org_name = e.target.value), disabled: this.submitting, style: { flex: '1' } }), h("div", { style: { marginTop: '30px' } }), h("verdocs-button", { label: "Next", disabled: invalid, onClick: invalid ? () => { } : () => this.handleSignup(), style: { display: 'flex', justifyContent: 'center', margin: '30px auto 0' } }))));
         }
         if (this.displayMode === 'verify') {
-            return (h("form", { onSubmit: () => this.handleSignup() }, h("p", null, "Please check your e-mail inbox for a verification code and follow the instructions provided."), h("p", null, h("em", null, "Verification messages may take up to 1 hour to arrive. If you do not receive the invitation, ", h("a", { href: "#" }, "Click Here"), " to resend it. Be sure to check your spam folder.")), h("verdocs-text-input", { label: "Verification Code", required: true, value: this.verificationCode, onInput: (e) => (this.verificationCode = e.target.value), disabled: this.submitting }), h("div", { style: { display: 'flex', flexDirection: 'row', gap: '20px' } }, h("verdocs-button", { label: "Verify", disabled: this.submitting, onClick: () => this.handleVerification(), style: { display: 'flex', justifyContent: 'center', margin: '10px auto 0' } }), h("verdocs-button", { variant: "outline", label: "Resend Code", disabled: this.resendDisabled, onClick: () => this.handleResend() }), h("verdocs-button", { label: "Sign Out", variant: "text", disabled: this.submitting, onClick: () => {
-                    this.tempAuthEndpoint.clearSession();
-                    this.email = '';
-                    this.password = '';
-                    this.displayMode = 'login';
-                } }))));
+            return (h("div", { class: "form" }, h("form", { onSubmit: () => this.handleVerification() }, h("p", null, "Please check your e-mail inbox for a verification code and enter it below."), h("verdocs-text-input", { label: "Verification Code", required: true, value: this.verificationCode, onInput: (e) => (this.verificationCode = e.target.value), disabled: this.submitting }), h("div", { class: "buttons" }, h("verdocs-button", { label: "Sign Out", variant: "outline", disabled: this.submitting, onClick: () => this.handleLogout() }), h("verdocs-button", { label: "Verify", disabled: this.submitting || !this.verificationCode || this.verificationCode.length !== 6, onClick: () => this.handleVerification() })), h("div", { class: "buttons" }, h("verdocs-button", { variant: "text", label: "Resend Code", disabled: this.resendDisabled || this.submitting, onClick: () => this.handleResend() })))));
         }
         if (this.displayMode === 'forgot') {
             return (h("div", { class: "form" }, h("a", { href: "https://verdocs.com/en/" }, h("img", { src: this.logo, alt: "Verdocs Logo", class: "logo" })), h("h3", null, "Forgot your password?"), h("p", null, "Enter your e-mail address below, and reset instructions will be sent to your Inbox. Please allow up to 15 minutes to arrive. Check your spam folder if you do not receive the message."), h("form", { onSubmit: () => this.handleSignup() }, h("verdocs-text-input", { label: "Email Address", autocomplete: "email", required: true, value: this.email, onInput: (e) => (this.email = e.target.value), disabled: this.submitting }), h("div", { style: { marginTop: '30px' } }), h("div", { class: "buttons" }, h("verdocs-button", { label: "Cancel", variant: "outline", disabled: this.submitting, onClick: () => (this.displayMode = 'login') }), h("verdocs-button", { label: "Reset", disabled: this.submitting, onClick: () => this.handleReset() })))));
@@ -280,7 +296,6 @@ export class VerdocsAuth {
     }
     static get states() {
         return {
-            "isAuthenticated": {},
             "displayMode": {},
             "org_name": {},
             "first_name": {},
@@ -288,8 +303,8 @@ export class VerdocsAuth {
             "email": {},
             "verificationCode": {},
             "password": {},
+            "confirmpass": {},
             "submitting": {},
-            "activeSession": {},
             "resendDisabled": {}
         };
     }

package/dist/collection/components/embeds/verdocs-search/verdocs-search.js

@@ -5,7 +5,7 @@ export class VerdocsSearch {
         this.endpoint = VerdocsEndpoint.getDefault();
     }
     render() {
-        return (h("div", { key: '5494b903b38da3f8695866720032ae5664885e5a', class: "container" }, h("verdocs-search-box", { key: '2985fc2bbe16dfe08f400cabb2299f5732ef2967', endpoint: this.endpoint }), h("div", { key: '564828ab1a9fa57b3e2555441862cd4fcd80fbf0', class: "boxes" }, h("verdocs-search-activity", { key: 'f7c560b1e8c9cfc394133e317b894c8d5e3b7f8b', type: "recent", endpoint: this.endpoint }), h("verdocs-search-activity", { key: '1faf9b5b1ff51c9654678738448bf4be85b1d58c', type: "saved", endpoint: this.endpoint }), h("verdocs-search-activity", { key: '7763f2600598f258ba21003e89b3b709f07448c6', type: "starred", endpoint: this.endpoint }), h("verdocs-quick-functions", { key: '4ef3c0faaee2cb381cef414b558c8b69b7f32a75', 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 is() { return "verdocs-search"; }
     static get originalStyleUrls() {

package/dist/collection/components/envelopes/verdocs-envelope-document-page/verdocs-envelope-document-page.js

@@ -75,7 +75,7 @@ export class VerdocsEnvelopeDocumentPage {
     }
     render() {
         const height = `${this.renderedHeight}px`;
-        return (h(Host, { key: '0d7e99a76f94df20aa1245b384a50e51daf8498b', id: `${this.containerId}`, style: { height, flex: `0 0 ${height}` } }, this.layers.map(layer => layer.type === 'div' ? (h("div", { class: "verdocs-envelope-document-page-layer", id: `${this.containerId}-${layer.name}`, style: { height } })) : this.pageDisplayUri ? (h("img", { class: "verdocs-envelope-document-page-layer img", id: `${this.containerId}-${layer.name}`, src: this.pageDisplayUri, alt: `Page ${this.pageNumber}`, "aria-hidden": true, loading: "lazy", onLoad: (e) => {
+        return (h(Host, { key: '1626cbea713462254f8d518479181a39156fd599', id: `${this.containerId}`, style: { height, flex: `0 0 ${height}` } }, this.layers.map(layer => layer.type === 'div' ? (h("div", { class: "verdocs-envelope-document-page-layer", id: `${this.containerId}-${layer.name}`, style: { height } })) : this.pageDisplayUri ? (h("img", { class: "verdocs-envelope-document-page-layer img", id: `${this.containerId}-${layer.name}`, src: this.pageDisplayUri, alt: `Page ${this.pageNumber}`, "aria-hidden": true, loading: "lazy", onLoad: (e) => {
                 // Note that all we really care about is the aspect ratio. We track the natural Width and Height but they aren't really that
                 // useful as individual values. The image will already have been scaled down to fit a DIV for display (100%, auto height).
                 // Builder places fields offset into the rendered display area, not the original document's dimensions. So its X/Y values

package/dist/collection/components/envelopes/verdocs-envelopes-list/verdocs-envelopes-list.js

@@ -191,18 +191,18 @@ export class VerdocsEnvelopesList {
         });
     }
     render() {
-        return (h(Host, { key: 'd4376bc5804b00acaf916e9c8b2a7ada6136d815' }, h("div", { key: 'cc459ff3e86b3ff69f44c0183760cffdcc66ce05', class: "header" }, h("div", { key: '0fe7ea1fd4c72069c7769125c1d85f97ccca4c68', class: "filter" }, h("verdocs-text-input", { key: 'acf0938c03d4cd334c1aa55e7175e1ee32b7b839', id: "verdocs-filter-name", value: this.match, clearable: true, autocomplete: "off", placeholder: "Filter by Name, Recipient, or Field...", onFocusout: (e) => {
+        return (h(Host, { key: 'c97d8d4415fb171c1335d3fbef9a885329740613' }, h("div", { key: 'dc0117f6476648985fdad07525e3c10c0a4542d3', class: "header" }, h("div", { key: 'ebd6521d3e9afd5ff9883829c7f66c55f31e7659', class: "filter" }, h("verdocs-text-input", { key: 'a5c15206146898551ac7ec9e22385335d1215d0a', id: "verdocs-filter-name", value: this.match, clearable: true, autocomplete: "off", placeholder: "Filter by Name, Recipient, or Field...", onFocusout: (e) => {
                 var _a;
                 // We don't locally filter envelopes because there are too many fields to match against efficiently.
                 this.match = e.target.value.trim();
                 (_a = this.changeMatch) === null || _a === void 0 ? void 0 : _a.emit(this.match);
-            } })), h("verdocs-quick-filter", { key: '3eb1c2303641b9d40d062be7f3cd284d85a964f8', label: "View", value: this.view, options: ViewFilters, onOptionSelected: e => {
+            } })), h("verdocs-quick-filter", { key: '497b419b0789a338264523b52e6c2f15de6d02fe', label: "View", value: this.view, options: ViewFilters, onOptionSelected: e => {
                 this.view = e.detail.value;
-            } }), this.view === 'all' && (h("verdocs-quick-filter", { key: 'eb998a048a18e45f0dc7285ccaebde3e68144197', label: "Status", value: this.status, options: StatusFilters, onOptionSelected: e => {
+            } }), this.view === 'all' && (h("verdocs-quick-filter", { key: 'ca4c1472e25cf458699a5b3cbd7bd55156938a59', label: "Status", value: this.status, options: StatusFilters, onOptionSelected: e => {
                 this.status = e.detail.value;
-            } })), this.view === 'all' && (h("verdocs-quick-filter", { key: 'cd05ac9a66127ccd23bbadb16e5bfa154b2e97c2', label: "Sort By", value: this.sort, options: SortFilters, onOptionSelected: e => {
+            } })), this.view === 'all' && (h("verdocs-quick-filter", { key: '232cacdc7d067961da8d1c9482d07c6e76b84d38', label: "Sort By", value: this.sort, options: SortFilters, onOptionSelected: e => {
                 this.sort = e.detail.value;
-            } })), this.loading && h("verdocs-spinner", { key: '7531bf499f830af651c3b9507ca9bd9dbcbec236', mode: "dark", size: 24 }), h("div", { key: '43abd416e136338f3c6189e086a461e0f9ba160b', style: { display: 'flex', flex: '1' } }), this.selectedEnvelopes.length > 0 && h("verdocs-button", { key: 'c54021bbf6ea0bddf03b51f31444c693e25f6a1a', label: `Download (${this.selectedEnvelopes.length})`, onClick: () => this.handleDownload() })), this.envelopes.map(envelope => {
+            } })), this.loading && h("verdocs-spinner", { key: '44c39036f7ac8358a9c8b658e533c393413dc4db', mode: "dark", size: 24 }), h("div", { key: 'f5b8246bf8cdfa9737b8675b59e44fc45df3cc06', style: { display: 'flex', flex: '1' } }), this.selectedEnvelopes.length > 0 && h("verdocs-button", { key: '9c6f32a107c15af7173ae4fd2ac16265bcc8be6f', label: `Download (${this.selectedEnvelopes.length})`, onClick: () => this.handleDownload() })), this.envelopes.map(envelope => {
             var _a;
             const recipientsWithActions = getRecipientsWithActions(envelope);
             const userCanCancel = userCanCancelEnvelope(this.endpoint.profile, envelope);
@@ -243,7 +243,7 @@ export class VerdocsEnvelopesList {
                             break;
                     }
                 } }))));
-        }), !this.initiallyLoaded && (h("div", { key: '7d72106e9315ef78e1e310da22744126599b8017', style: { width: '100%' } }, integerSequence(0, this.rowsPerPage).map(() => (h("div", { class: "envelope-placeholder" }))))), this.initiallyLoaded && !this.envelopes.length && h("div", { key: 'b2228f90e7414cace475ab71854a690112b696b3', class: "empty-text" }, "No matching envelopes found. Please adjust your filters and try again."), this.initiallyLoaded && this.envelopes.length && this.showPagination ? (h("div", { style: { marginTop: '20px' } }, h("verdocs-pagination", { selectedPage: this.selectedPage, perPage: this.rowsPerPage, itemCount: this.count, onSelectPage: e => {
+        }), !this.initiallyLoaded && (h("div", { key: '3008dcd8a557d2f47041455cf9fa554bbcc0b229', style: { width: '100%' } }, integerSequence(0, this.rowsPerPage).map(() => (h("div", { class: "envelope-placeholder" }))))), this.initiallyLoaded && !this.envelopes.length && h("div", { key: 'f1e6ffe23cd5c2d9cf18bafadbf0b61e70984f4d', class: "empty-text" }, "No matching envelopes found. Please adjust your filters and try again."), this.initiallyLoaded && this.envelopes.length && this.showPagination ? (h("div", { style: { marginTop: '20px' } }, h("verdocs-pagination", { selectedPage: this.selectedPage, perPage: this.rowsPerPage, itemCount: this.count, onSelectPage: e => {
                 this.selectedPage = e.detail.selectedPage;
             } }))) : (h("div", null))));
     }

package/dist/collection/components/envelopes/verdocs-status-indicator/verdocs-status-indicator.js

@@ -238,11 +238,11 @@ export class VerdocsStatusIndicator {
         }
         const icon = this.getStatusIcon(status);
         const statusMessage = this.getStatusMessage(status);
-        return (h(Host, { key: 'fcc8a478464db1633c71b87cc0b3ed19026c20c8', ref: el => (this.summaryComponent = el), class: `${this.theme} ${this.size} ${this.envelope ? 'has-document' : ''}`, "aria-label": "Click to View Details", onClick: e => {
+        return (h(Host, { key: '2f8dd56b30f867568973f33f2459fe8492fe046c', ref: el => (this.summaryComponent = el), class: `${this.theme} ${this.size} ${this.envelope ? 'has-document' : ''}`, "aria-label": "Click to View Details", onClick: e => {
                 e.stopPropagation();
                 e.preventDefault();
                 this.envelope && this.toggleDropdown();
-            }, onBlur: e => this.envelope && this.handleHideDropdown(e) }, h("span", { key: 'c025fd8df675cbbf5709a4fe5657052514100533', class: "icon", innerHTML: icon }), h("span", { key: '7cdb668dce2dd652f472350fb045acff590a8ed6', class: "content" }, statusMessage), h("div", { key: 'a10adafb40c56cad07bf0944671620c1425c6e84', class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { key: 'c05c0f501964b5ee5050d6314e52d539738993fe', id: `${this.containerId}` }), this.recipientStatusIcons.map(icon => (h("span", { innerHTML: icon.icon, style: { position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px` } }))))));
+            }, onBlur: e => this.envelope && this.handleHideDropdown(e) }, h("span", { key: '19a3fe86138e330435d14d4c8ca9db6021bb7bdc', class: "icon", innerHTML: icon }), h("span", { key: 'f7599f2ac78da17f85348dd67330abb3c6bd071c', class: "content" }, statusMessage), h("div", { key: '57be3fce89a8345d37f4599439e7641cbad6dd07', class: "detail-panel", ref: el => (this.detailPanel = el) }, h("div", { key: 'f1962e7251f027ddf9905516ba4136543d382197', id: `${this.containerId}` }), this.recipientStatusIcons.map(icon => (h("span", { innerHTML: icon.icon, style: { position: 'absolute', top: `${icon.y}px`, left: `${icon.x}px` } }))))));
     }
     static get is() { return "verdocs-status-indicator"; }
     static get originalStyleUrls() {

package/dist/collection/components/templates/verdocs-template-card/verdocs-template-card.js

@@ -12,7 +12,7 @@ export class VerdocsTemplateCard {
     }
     render() {
         var _a, _b, _c, _d;
-        return (h(Host, { key: 'b5bcce45639a644e66e263a09329e8f345bb51e4' }, h("span", { key: 'db094c3a8e429af167b56da7df97cdb0d35f5ff7', class: "name" }, this.template.name), h("span", { key: '153ce6c4aab0beb2cd5f012bbe58b8d4fc700b1f', class: "org-name" }, ((_a = this.template.organization) === null || _a === void 0 ? void 0 : _a.name) || 'Public'), h("hr", { key: '709fbc0c993eb1b54ff6568fc4c639aea696d6f6' }), h("div", { key: 'd7d1bda1d9e6ac5aab6cae62503fe5dfa2e040ca', class: "controls" }, h("div", { key: '5dddc88cea131c3bee2d4fa9a3e2f1522fe3593a', class: "control" }, h("span", { key: 'e114a05a3cdf3176aa453ca845f7dc2ff1f2b7bb', class: "icon", innerHTML: StarIcon }), h("span", { key: '3a2ccb4728c0129fb182efc3e763075e8a923768', class: "value" }, this.template.star_counter)), h("div", { key: 'a9bfe80a726cfeb90338d0add15f99acd5ca2cae', class: "control secondary" }, h("span", { key: '67b8a3b64f5d40a79e35cc2ca229123c90dad701', class: "icon", innerHTML: PagesIcon }), h("span", { key: '3459e3e3dac0596876ec2905b6668813d986aee9', class: "value" }, ((_d = (_c = (_b = this.template) === null || _b === void 0 ? void 0 : _b.documents) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.pages) || 1)), h("div", { key: 'f3a2d438d3b748061cfcf16028e352ca6337eb04', class: "control secondary" }, h("span", { key: '17d0a3ad7050436ccda2da74120c2348fcfa4fd7', class: "icon", innerHTML: EmailIcon }), h("span", { key: '6737878e795f633feb30ae0d28fc4b0c90f122eb', class: "value" }, this.template.counter)), h("span", { key: 'cbfde7c6ac4860d9b0720b458bf210194c25ebe0', class: "additional-controls", innerHTML: ActionsIcon }))));
+        return (h(Host, { key: '92db1527b29db1accce1236ad170c1d071bd9af9' }, h("span", { key: '6df84f4e3f47f2a3bde4de1aaeb55cfdaaf24cec', class: "name" }, this.template.name), h("span", { key: '6be1cd61a1496fa579f25ff06fcd5295149aada1', class: "org-name" }, ((_a = this.template.organization) === null || _a === void 0 ? void 0 : _a.name) || 'Public'), h("hr", { key: '8f95b065445cf18ec71b2976c5c75d7335857f1a' }), h("div", { key: 'cce4e78b58f924de6b68bcf947af20dbed74ae15', class: "controls" }, h("div", { key: '124cf87ac1ab5f25d505004ebba55c0ad00d3b34', class: "control" }, h("span", { key: 'b39885d89f97c7f29077f5a0e8e943c2fd74e8a0', class: "icon", innerHTML: StarIcon }), h("span", { key: '7fa8e32525ed221d9907e658ca6f982fed16dba6', class: "value" }, this.template.star_counter)), h("div", { key: '37fb74c5e9302e8c310e2052b725183bac587c3d', class: "control secondary" }, h("span", { key: 'bef0ebc42c5f9062bf67d86a097dd0d4a8e03e11', class: "icon", innerHTML: PagesIcon }), h("span", { key: '3763e7ec4ac4e73ce712c460101223d6f8663b2a', class: "value" }, ((_d = (_c = (_b = this.template) === null || _b === void 0 ? void 0 : _b.documents) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.pages) || 1)), h("div", { key: 'e4f9d35db361036a46297e82ecf1528058e214bc', class: "control secondary" }, h("span", { key: '985da1d76dfeecb4e57e440fbf788c18453696a1', class: "icon", innerHTML: EmailIcon }), h("span", { key: 'f098866929e19bf47e30a660aba05a3e508561ed', class: "value" }, this.template.counter)), h("span", { key: 'c742e5c6e1087a9b0f1a8b037476759274838c42', class: "additional-controls", innerHTML: ActionsIcon }))));
     }
     static get is() { return "verdocs-template-card"; }
     static get originalStyleUrls() {

package/dist/collection/components/templates/verdocs-template-document-page/verdocs-template-document-page.js

@@ -93,7 +93,7 @@ export class VerdocsTemplateDocumentPage {
     }
     render() {
         const height = `${this.renderedHeight}px`;
-        return (h(Host, { key: 'a332323d7adc14d79884131c20d41dfddcb03ac5', id: `${this.containerId}`, style: { height, flex: `0 0 ${height}` } }, this.layers.map(layer => layer.type === 'div' ? (h("div", { class: "verdocs-template-document-page-layer", id: `${this.containerId}-${layer.name}`, style: { height } }, layer.name === 'controls' &&
+        return (h(Host, { key: '6fabe54a0840385228e13a0e61f7748d41fbcf17', id: `${this.containerId}`, style: { height, flex: `0 0 ${height}` } }, this.layers.map(layer => layer.type === 'div' ? (h("div", { class: "verdocs-template-document-page-layer", id: `${this.containerId}-${layer.name}`, style: { height } }, layer.name === 'controls' &&
             this.fieldStore
                 .get('fields')
                 .filter(field => field && field.page === this.pageNumber)

package/dist/collection/components/templates/verdocs-template-role-properties/verdocs-template-role-properties.js

@@ -118,31 +118,31 @@ export class VerdocsTemplateRoleProperties {
     }
     render() {
         const hasFields = this.fieldStore.get('fields').some(field => field.role_name === this.roleName);
-        return (h(Host, { key: 'd3988edb91247f2dd580645350c7c5641d21c61a' }, h("div", { key: '912555974fc01f6b5dbd37173217a17e1e6cc756', class: "background-overlay", onClick: e => this.handleCancel(e) }, h("div", { key: 'e6d8172451f3fe78fd4b932039b15615f4b4c843', class: "dialog" }, h("form", { key: '0d0519144c0de4813a664a2345a85a7da15606c9', onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("verdocs-text-input", { key: '9169dd76bf19c5f809b78bdef9a20511d21cbdcc', id: "verdocs-role-name", label: "Role Name", value: this.name, autocomplete: "off", disabled: hasFields, helpText: hasFields
+        return (h(Host, { key: 'c2728e2fb47306d99d3eebaaa38130322d37ad64' }, h("div", { key: 'a329fa189219f99c747e915ee2f0a41de978474f', class: "background-overlay", onClick: e => this.handleCancel(e) }, h("div", { key: 'a0325d8949c173d73ba2a48af5924d015e746266', class: "dialog" }, h("form", { key: '378e17dc270ae28779557793f6669143c86a41a3', onSubmit: e => e.preventDefault(), onClick: e => e.stopPropagation(), autocomplete: "off" }, h("verdocs-text-input", { key: '20f8de0856c8e5c847b7e1852edc437a8c6427fb', id: "verdocs-role-name", label: "Role Name", value: this.name, autocomplete: "off", disabled: hasFields, helpText: hasFields
                 ? 'This role has fields assigned and can no longer be renamed.'
                 : 'A unique name to identify the role in the workflow. Submitted data will also be tagged with this value.', placeholder: "Role Name...", onInput: (e) => {
                 this.name = e.target.value;
                 this.dirty = true;
-            } }), h("div", { key: 'fba0622ed18d69ae13c2dc6dbc4f3c2230fb72d5', class: "row" }, h("div", { key: 'db653736e1e1b32a58ea8df1d5f9f58928ca7047', class: "input-label" }, "Type:"), h("verdocs-select-input", { key: '7199410b3a1598e9fc74b6bcd42b58458e7c0ad7', value: this.type, options: [
+            } }), h("div", { key: '35310c43c72be59031d74995d5e4e08fd74b34bd', class: "row" }, h("div", { key: '4b47e8595ad1119d4027049b56acd43443a4b09a', class: "input-label" }, "Type:"), h("verdocs-select-input", { key: '97f18bfb8052d6f0690bf2d570a42a0a604556b9', value: this.type, options: [
                 { label: 'Signer', value: 'signer' },
                 { label: 'CC', value: 'cc' },
                 { label: 'Approver', value: 'approver' },
             ], onInput: (e) => {
                 this.type = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-help-icon", { key: '8e553f8d63d8d57022d449b9db08d8ab0bbdd48c', text: "Most participants are Signers. CC roles are notified when documents are signed, but have no other actions. Approvers get notified when signing is completed to perform a final review." })), h("verdocs-text-input", { key: 'da8fae069e9a65a8fbe41c926a4aabc2af0816f2', id: "verdocs-recipient-email", label: "Full Name", value: this.full_name, autocomplete: "off", helpText: "The recipient's full name, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Full Name...", onInput: (e) => {
+            } }), h("verdocs-help-icon", { key: '3f4059c1a1232aa08449e4518ccd9473066430df', text: "Most participants are Signers. CC roles are notified when documents are signed, but have no other actions. Approvers get notified when signing is completed to perform a final review." })), h("verdocs-text-input", { key: 'df9c1439da6894608dad4ef81dddf21e2591115f', id: "verdocs-recipient-email", label: "Full Name", value: this.full_name, autocomplete: "off", helpText: "The recipient's full name, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Full Name...", onInput: (e) => {
                 this.full_name = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-text-input", { key: '5c2818a8b37c6fdef9dfd4a9a64bbb2c66216ca9', id: "verdocs-recipient-email", label: "Email", value: this.email, autocomplete: "off", helpText: "The recipient's email address, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Email Address...", onInput: (e) => {
+            } }), h("verdocs-text-input", { key: 'af0ac9644670cb4b3e5607eb75e6c0aa9746ed76', id: "verdocs-recipient-email", label: "Email", value: this.email, autocomplete: "off", helpText: "The recipient's email address, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Email Address...", onInput: (e) => {
                 this.email = e.target.value;
                 this.dirty = true;
-            } }), h("verdocs-text-input", { key: '4230659800aac4470c96d411436434511a208015', id: "verdocs-recipient-phone", label: "Phone", value: this.phone, autocomplete: "off", helpText: "The recipient's phone number, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Phone Number...", onInput: (e) => {
+            } }), h("verdocs-text-input", { key: 'f7055746726c2d199beac4206847bc1534de5601', id: "verdocs-recipient-phone", label: "Phone", value: this.phone, autocomplete: "off", helpText: "The recipient's phone number, if it will always stay the same. Leave blank to supply this value later, when each new envelope is created from the template.", placeholder: "Phone Number...", onInput: (e) => {
                 this.phone = e.target.value;
                 this.dirty = true;
-            } }), h("div", { key: '2a675d0120b3cbeff8af790260578126d3cf46ce', class: "row" }, h("div", { key: '66c007c4d9ea713f5a399186e144d7445797765a', class: "input-label" }, "May Delegate:"), h("div", { key: 'ab88572b986a7c5def40a9c1e084fe3c62a766bf', class: "checkbox-wrapper" }, h("verdocs-checkbox", { key: 'b1ca8f96ffd71843beecdc349d86bf3d8cc35708', checked: this.delegator, onInput: (e) => {
+            } }), h("div", { key: '12903a2f12f8f750cecaf0332a69099f67b4d530', class: "row" }, h("div", { key: '9959973a48e154155cc6b5892ae81a5105d62d33', class: "input-label" }, "May Delegate:"), h("div", { key: '0dd8af27a2fd4cf6c8a641a39ea3332887b1f71a', class: "checkbox-wrapper" }, h("verdocs-checkbox", { key: '8a145a05207fc1cae42d5c3e4596c2d673ecc097', checked: this.delegator, onInput: (e) => {
                 this.delegator = e.target.checked;
                 this.dirty = true;
-            } })), h("verdocs-help-icon", { key: 'de1d5f121299c133edcc8001a9b6a6b63ff9b739', text: "If enabled, this recipient may delegate their actions to another individual." })), h("div", { key: '79869b6fb38187967ca3550284e4d25f63884fd0', class: "buttons" }, h("button", { key: 'e58733c07c6793e2c454e5f68c5ffc8907cec1f1', class: "delete-button", disabled: this.dirty, onClick: e => this.handleDelete(e), innerHTML: TrashIcon }), h("div", { key: '55f4478946d4675a17055be652e19eb377ae5437', style: { flex: '1' } }), h("verdocs-button", { key: 'f67fa328ee71a14f0bd1ba049ffddf228841eb67', size: "small", variant: "outline", label: "Cancel", disabled: !this.dirty, onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: '690bc539949328f6130e4d8da5db97ed1b355992', size: "small", label: "Save", disabled: !this.dirty, onClick: e => this.handleSave(e) })))))));
+            } })), h("verdocs-help-icon", { key: 'd725f8446967e2c145e0e5ecad8416ee7e368bc8', text: "If enabled, this recipient may delegate their actions to another individual." })), h("div", { key: 'eae241c53cc8213d5c14bb213b41923620e17be3', class: "buttons" }, h("button", { key: '5eb5792ff0f79aab12bcfbb20ffdf58d431f4103', class: "delete-button", disabled: this.dirty, onClick: e => this.handleDelete(e), innerHTML: TrashIcon }), h("div", { key: 'bca3f871c37e1a346d98620ee0fd1dd0dfce9917', style: { flex: '1' } }), h("verdocs-button", { key: 'b40fb1ff70cb3cce19b793f940fc0038d12490ea', size: "small", variant: "outline", label: "Cancel", disabled: !this.dirty, onClick: e => this.handleCancel(e) }), h("verdocs-button", { key: '51270815757b0fd6803d527ac3388f1e2af16b25', size: "small", label: "Save", disabled: !this.dirty, onClick: e => this.handleSave(e) })))))));
     }
     static get is() { return "verdocs-template-role-properties"; }
     static get originalStyleUrls() {

package/dist/collection/components/templates/verdocs-template-sender/verdocs-template-sender.js

@@ -61,7 +61,7 @@ export class VerdocsTemplateSender {
         });
     }
     render() {
-        return (h(Host, { key: '092c9e3593fffb0559c72fab66510070e73d7c05' }, h("div", { key: '666b71a674030a3541138d6dd07a04ec2f352e20', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: 'fcabfd99d07d0f72a874fd2ff32a7f72cda51d86', class: "dialog" }, h("div", { key: '1098b307a0f787d282ae423f273f02231524598a', class: "options" }, h("div", { key: 'bb2bd6a5c6f338a955d0e38ddd72be127a908ea7', class: "option" }, h("verdocs-radio-button", { key: '47ef7fa0ea436b284f76f8507ecf66ff098a3021', name: "template-sender", value: 'everyone', checked: this.sender === 'everyone', onInput: () => this.handleSelectSetting('everyone') }), h("div", { key: '8dcc183312a85bf6bb0145a55933842951c859c4', class: "description" }, h("div", { key: 'c3e41eff5d8353846d5fe62e9739864743936d5d', class: "name" }, "Anyone on the Web"), h("verdocs-help-icon", { key: 'b3b965183887842c7f3434afc9602ca8d67de419', text: "Anyone can use this template. (Make its visibility is set to to 'Public' or 'Shared'.)" }))), h("div", { key: '4fa78b48a79fc3932a02553e9360fb656c735493', class: "option" }, h("verdocs-radio-button", { key: '40429f3fbaa48e0515d4f1e860d0a256df551fb4', name: "template-sender", value: 'everyone_as_creator', checked: this.sender === 'everyone_as_creator', onInput: () => this.handleSelectSetting('everyone_as_creator') }), h("div", { key: '5add2c44aac55f11094780c82ff6006b4b48ca8e', class: "description" }, h("div", { key: 'ac8e1c67ab3614b8e5dd3a255c0d71c1820ba83b', class: "name" }, "Anyone on the Web as me"), h("verdocs-help-icon", { key: '4d2172b0dcef9cd3e46095e8337aa3c1b8e06523', text: "Anyone can use this template on my behalf. (Make sure its visibility is set to 'Public' or 'Shared'.)" }))), h("div", { key: '36970f9e7c4be312447a36c4a63b470ea85cddf8', class: "option" }, h("verdocs-radio-button", { key: 'b2fd0896b2bee7243450d6a50cc65fe96e98ab20', name: "template-sender", value: 'organization_member', checked: this.sender === 'organization_member', onInput: () => this.handleSelectSetting('organization_member') }), h("div", { key: '0bbfeeaf609aa3106df12bf34ef778891e83d0df', class: "description" }, h("div", { key: 'bb62d9eece8db82b8ef071c0c24127086a89dccc', class: "name" }, "Anyone in my organization"), h("verdocs-help-icon", { key: '73d7fa4b6f4b4896d778f3fbc165de2d7b6b2c87', text: "Anyone in my organization can use this template. (Make sure its visibility is set to 'Shared')" }))), h("div", { key: 'e1eca6d0234cf0d01ee8d30690248eec07912d3c', class: "option" }, h("verdocs-radio-button", { key: 'f31029edc86697d113fc37f55c0a94bcc4a35f68', name: "template-sender", value: 'organization_member_as_creator', checked: this.sender === 'organization_member_as_creator', onInput: () => this.handleSelectSetting('organization_member_as_creator') }), h("div", { key: '5a0f46208920de20dd725f4e16c5de556260d7cb', class: "description" }, h("div", { key: '9bfd1c74d34afe93d4a0e11b0877ff7dadf19f83', class: "name" }, "Anyone in my organization as me"), h("verdocs-help-icon", { key: 'd72a7899414895b1637186c4f731be73cc786eb9', text: "Anyone in my organization can use this template on my behalf. (Make sure its visibility is set to to 'Shared'.)" }))), h("div", { key: '5e55d764e9040fb7b87e0456c2809286835b89e3', class: "option" }, h("verdocs-radio-button", { key: '2309a84ec1b4487619f932e8a2316f51c331a13d', name: "template-sender", value: 'creator', checked: this.sender === 'creator', onInput: () => this.handleSelectSetting('creator') }), h("div", { key: 'f3bd9236d0b692415c5a39687c35ba71cf245703', class: "description" }, h("div", { key: '8aa05e4b9f42d4febf3c3b28f53dec9de2e0c64d', class: "name" }, "Me"), h("verdocs-help-icon", { key: 'e79cb02b13641acd64983b91e8de6eb6284a8ee7', text: "Only I can use this template." })))), h("div", { key: 'd4b7c6ee528df1ee7f7ec952e80826a20c29ff6c', class: "buttons" }, h("verdocs-button", { key: '024ba9b87fc9131db993ecafd76105be0959df47', label: "Close", onClick: () => this.handleClose() }))))));
+        return (h(Host, { key: 'f8d8cca0bfceaf4770487a2013d8b4719236ddf4' }, h("div", { key: '2f3adaefa9ee3dcbac271ee02d76fa46bbe58e10', class: "background-overlay", onClick: e => this.handleDismiss(e) }, h("div", { key: '659f51292068e189d9c995db643fae5c2acb15b3', class: "dialog" }, h("div", { key: '3015a1be71fe71983fce44357433b5e2186c4946', class: "options" }, h("div", { key: 'ce818b1d25630a8f487fbaff0c5db38119a6f824', class: "option" }, h("verdocs-radio-button", { key: '8a4d98f6553248a88a024c1d024d3a4145a202ed', name: "template-sender", value: 'everyone', checked: this.sender === 'everyone', onInput: () => this.handleSelectSetting('everyone') }), h("div", { key: 'e2924ad4589dfcdca2ad342852f517f919e99914', class: "description" }, h("div", { key: '6bf123474dc857917dd84c971bb3e634eecc8868', class: "name" }, "Anyone on the Web"), h("verdocs-help-icon", { key: '53129fa609dcb99cf6f1ddc76867c09a90359973', text: "Anyone can use this template. (Make its visibility is set to to 'Public' or 'Shared'.)" }))), h("div", { key: '4b566084de0d35ade13b0d82354ddfab42fb4be2', class: "option" }, h("verdocs-radio-button", { key: '3704512d6d38faf3f275fb039a1c97cf2464b0e2', name: "template-sender", value: 'everyone_as_creator', checked: this.sender === 'everyone_as_creator', onInput: () => this.handleSelectSetting('everyone_as_creator') }), h("div", { key: '8dd4ffbcc1727fb28bec4e404dcc1a4a7cec9431', class: "description" }, h("div", { key: '2c4093c5ecff6192c6ec94ffa0a32ae516a4d13d', class: "name" }, "Anyone on the Web as me"), h("verdocs-help-icon", { key: '73b99113cd11ac40ef3784fe23b523e54f2a8d5a', text: "Anyone can use this template on my behalf. (Make sure its visibility is set to 'Public' or 'Shared'.)" }))), h("div", { key: '528f64ff348386c14b0cea7d4983bccd664a0645', class: "option" }, h("verdocs-radio-button", { key: 'f1538d9c86ad7f2dc337a42f53f49f86faa3a469', name: "template-sender", value: 'organization_member', checked: this.sender === 'organization_member', onInput: () => this.handleSelectSetting('organization_member') }), h("div", { key: 'ddd5129726d3b2a0786341c2df2f8012e783d643', class: "description" }, h("div", { key: '449c1a5eb124b7006f319f96ff617d6480cab3a9', class: "name" }, "Anyone in my organization"), h("verdocs-help-icon", { key: '8d01e0fba4bfb8b5d12390b5c138b19d6362a055', text: "Anyone in my organization can use this template. (Make sure its visibility is set to 'Shared')" }))), h("div", { key: '76f686a2976749ffa02be5b95d9d61ded315714c', class: "option" }, h("verdocs-radio-button", { key: '00c5b5d78a7c380665abc3157403f597cbcaabc9', name: "template-sender", value: 'organization_member_as_creator', checked: this.sender === 'organization_member_as_creator', onInput: () => this.handleSelectSetting('organization_member_as_creator') }), h("div", { key: '7eaf1cce0528f17359b19320ba0e10311ec34821', class: "description" }, h("div", { key: '4bd0b1b35504afa1c67566ac8cd589041958de41', class: "name" }, "Anyone in my organization as me"), h("verdocs-help-icon", { key: 'cfe825b414ef5a0c4ddd33e3de621629cc92149e', text: "Anyone in my organization can use this template on my behalf. (Make sure its visibility is set to to 'Shared'.)" }))), h("div", { key: 'f86771d023449f505a45f07b73e505a7c481bdf0', class: "option" }, h("verdocs-radio-button", { key: '039f5bb7b444f942fb609ad1ef5fda0d5f160083', name: "template-sender", value: 'creator', checked: this.sender === 'creator', onInput: () => this.handleSelectSetting('creator') }), h("div", { key: 'b7ecd4a8e68ac17e9ba116a6f8f2dcf84ff92c56', class: "description" }, h("div", { key: 'ca006222ed947daf96a22425fe7dbc1dd809aef5', class: "name" }, "Me"), h("verdocs-help-icon", { key: 'fec5c4aeb7285eaa3a22d238208e2072b17a14b0', text: "Only I can use this template." })))), h("div", { key: '1344c8e35ee75f17f5a035ba93e770958b1fcba0', class: "buttons" }, h("verdocs-button", { key: '6d2e2796fd3464440662e8dd5dba2ae273aab02e', label: "Close", onClick: () => this.handleClose() }))))));
     }
     static get is() { return "verdocs-template-sender"; }
     static get originalStyleUrls() {

package/dist/collection/components/templates/verdocs-template-star/verdocs-template-star.js

@@ -38,7 +38,7 @@ export class VerdocsTemplateStar {
         });
     }
     render() {
-        return (h(Host, { key: 'f72b055ab1619cc45511d468dd1b115509c59272' }, h("div", { key: 'dd925ee5060a57ab6a89d4045bef645035f1c731', class: `star ${this.updating ? 'updating' : ''}`, innerHTML: this.template.star_counter ? SolidStarIcon : OutlineStarIcon, onClick: e => this.toggle(e) }), h("div", { key: 'f0003f728db6cee4cd17eb7025e2a82f768fa8c3', class: "count" }, this.template.star_counter || '--')));
+        return (h(Host, { key: '96d245ead9fb7891ab0f497b37b306b379a20abc' }, h("div", { key: '67ceace21c9957fbb27a05a527ef1b7847ac33a9', class: `star ${this.updating ? 'updating' : ''}`, innerHTML: this.template.star_counter ? SolidStarIcon : OutlineStarIcon, onClick: e => this.toggle(e) }), h("div", { key: '3a76f28df10bb79ffb87ca8a046a6ec4e04dc49b', class: "count" }, this.template.star_counter || '--')));
     }
     static get is() { return "verdocs-template-star"; }
     static get originalStyleUrls() {

package/dist/collection/components/templates/verdocs-template-tags/verdocs-template-tags.js

@@ -8,7 +8,7 @@ export class VerdocsTemplateTags {
     }
     render() {
         var _a;
-        return (h(Host, { key: '537d0786deea45df3bc938eabb4db09b3532d5cb' }, (_a = this.tags) === null || _a === void 0 ? void 0 : _a.map(tag => (h("span", null, tag)))));
+        return (h(Host, { key: 'e754a66c64713a7b01c072b1becd919d9768ac66' }, (_a = this.tags) === null || _a === void 0 ? void 0 : _a.map(tag => (h("span", null, tag)))));
     }
     static get is() { return "verdocs-template-tags"; }
     static get originalStyleUrls() {

package/dist/collection/utils/Toast.js

@@ -44,7 +44,7 @@ export const VerdocsToast = (text, config = {}) => {
     const icon = Icons[style] || Icons.default;
     const toastBody = `
     ${icon}
-    <div class="verdocs-toast-text" style="padding: 12px 12px 12px 0;">${text}</div>
+    <div class="verdocs-toast-text" style="padding: 12px 12px 12px 0; display: flex; flex: 1">${text}</div>
     <div class="verdocs-toast-close" style="padding: 12px 10px; background: rgba(0, 0, 0, 0.2); cursor: pointer;">✕</div>
   `;
     const toast = document.createElement('div');
@@ -52,7 +52,7 @@ export const VerdocsToast = (text, config = {}) => {
     toast.innerHTML = toastBody;
     toast.style.cssText = `
 display: flex; flex-direction: row; gap: 10px; align-items: center;
-position: fixed; top: 20px; right: 20px; z-index: 2147483647; max-width: calc(50% - 20px);
+position: fixed; top: 20px; right: 20px; z-index: 2147483647; width: 80%; max-width: calc(100% - 40px);
 color: #ffffff; background: ${color}; font-family: 'Barlow', sans-serif;
 border-radius: 2px; padding-left: 10px;
 box-shadow: 0 3px 7px 2px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(77, 96, 232, 0.3);`;

package/dist/components/Toast.js

@@ -44,7 +44,7 @@ const VerdocsToast = (text, config = {}) => {
     const icon = Icons[style] || Icons.default;
     const toastBody = `
     ${icon}
-    <div class="verdocs-toast-text" style="padding: 12px 12px 12px 0;">${text}</div>
+    <div class="verdocs-toast-text" style="padding: 12px 12px 12px 0; display: flex; flex: 1">${text}</div>
     <div class="verdocs-toast-close" style="padding: 12px 10px; background: rgba(0, 0, 0, 0.2); cursor: pointer;">✕</div>
   `;
     const toast = document.createElement('div');
@@ -52,7 +52,7 @@ const VerdocsToast = (text, config = {}) => {
     toast.innerHTML = toastBody;
     toast.style.cssText = `
 display: flex; flex-direction: row; gap: 10px; align-items: center;
-position: fixed; top: 20px; right: 20px; z-index: 2147483647; max-width: calc(50% - 20px);
+position: fixed; top: 20px; right: 20px; z-index: 2147483647; width: 80%; max-width: calc(100% - 40px);
 color: #ffffff; background: ${color}; font-family: 'Barlow', sans-serif;
 border-radius: 2px; padding-left: 10px;
 box-shadow: 0 3px 7px 2px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(77, 96, 232, 0.3);`;