@verdocs/web-sdk 6.5.0-beta.1 → 6.5.0-beta.2

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

@@ -0,0 +1,132 @@
+import { h } from "@stencil/core";
+export class VerdocsFlag {
+    constructor() {
+        /**
+         * The type of flag to display.
+         */
+        this.variant = 'fill';
+        /**
+         * The text label to display in the flag.
+         */
+        this.label = 'FILL';
+        /**
+         * If true, shows "or SKIP" link.
+         */
+        this.showSkip = false;
+    }
+    render() {
+        return (h("div", { key: 'd7b68c88995e873d32e16f80bf8c6046d137ae1d', class: { 'verdocs-flag': true, [`variant-${this.variant}`]: true }, onClick: () => this.flagClick.emit() }, h("div", { key: '28d9f9e249265bea51e820c2ebd48c99de3d7874', class: "label" }, this.label, this.showSkip && (h("span", { key: '45ee7333ba383fb710f523749bd7f814b5c40005' }, ' or ', h("span", { key: '56ff025a695c62c39e079364e6a2c57e795b7912', class: "link", onClick: e => {
+                e.stopPropagation();
+                this.skip.emit();
+            } }, "SKIP"))))));
+    }
+    static get is() { return "verdocs-flag"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["verdocs-flag.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["verdocs-flag.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "variant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'fill' | 'next'",
+                    "resolved": "\"fill\" | \"next\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The type of flag to display."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "variant",
+                "defaultValue": "'fill'"
+            },
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The text label to display in the flag."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "label",
+                "defaultValue": "'FILL'"
+            },
+            "showSkip": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "If true, shows \"or SKIP\" link."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "show-skip",
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "skip",
+                "name": "skip",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when the \"SKIP\" link is clicked."
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }, {
+                "method": "flagClick",
+                "name": "flagClick",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when the main flag body is clicked (e.g. to focus field)."
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }];
+    }
+}
+//# sourceMappingURL=verdocs-flag.js.map

package/dist/collection/components/controls/verdocs-flag/verdocs-flag.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"verdocs-flag.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-flag/verdocs-flag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAe,MAAM,eAAe,CAAC;AAOtE,MAAM,OAAO,WAAW;IALxB;QAME;;WAEG;QACK,YAAO,GAAoB,MAAM,CAAC;QAE1C;;WAEG;QACK,UAAK,GAAW,MAAM,CAAC;QAE/B;;WAEG;QACK,aAAQ,GAAY,KAAK,CAAC;KAmCnC;IAvBC,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAE,EAAC,cAAc,EAAE,IAAI,EAAE,CAAC,WAAW,IAAI,CAAC,OAAO,EAAE,CAAC,EAAE,IAAI,EAAC,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE;YACzG,4DAAK,KAAK,EAAC,OAAO;gBACf,IAAI,CAAC,KAAK;gBACV,IAAI,CAAC,QAAQ,IAAI,CAChB;oBACG,MAAM;oBACP,6DACE,KAAK,EAAC,MAAM,EACZ,OAAO,EAAE,CAAC,CAAC,EAAE;4BACX,CAAC,CAAC,eAAe,EAAE,CAAC;4BACpB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;wBACnB,CAAC,WAGI,CACF,CACR,CACG,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Prop, h, Event, EventEmitter} from '@stencil/core';\n\n@Component({\n  tag: 'verdocs-flag',\n  styleUrl: 'verdocs-flag.scss',\n  shadow: false,\n})\nexport class VerdocsFlag {\n  /**\n   * The type of flag to display.\n   */\n  @Prop() variant: 'fill' | 'next' = 'fill';\n\n  /**\n   * The text label to display in the flag.\n   */\n  @Prop() label: string = 'FILL';\n\n  /**\n   * If true, shows \"or SKIP\" link.\n   */\n  @Prop() showSkip: boolean = false;\n\n  /**\n   * Emitted when the \"SKIP\" link is clicked.\n   */\n  @Event() skip: EventEmitter<void>;\n\n  /**\n   * Emitted when the main flag body is clicked (e.g. to focus field).\n   */\n  @Event() flagClick: EventEmitter<void>;\n\n  render() {\n    return (\n      <div class={{'verdocs-flag': true, [`variant-${this.variant}`]: true}} onClick={() => this.flagClick.emit()}>\n        <div class=\"label\">\n          {this.label}\n          {this.showSkip && (\n            <span>\n              {' or '}\n              <span\n                class=\"link\"\n                onClick={e => {\n                  e.stopPropagation();\n                  this.skip.emit();\n                }}\n              >\n                SKIP\n              </span>\n            </span>\n          )}\n        </div>\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/controls/verdocs-help-icon/verdocs-help-icon.css

@@ -10,7 +10,7 @@
   }
 }
 verdocs-help-icon {
-  font-family: "Inter", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;
+  font-family: var(--verdocs-primary-font, "Inter", "Barlow", sans-serif);
   display: inline-block;
   opacity: 0.3;
   position: relative;

package/dist/collection/components/controls/verdocs-help-icon/verdocs-help-icon.js

@@ -42,7 +42,7 @@ export class VerdocsHelpIcon {
         (_a = this.tooltipEl) === null || _a === void 0 ? void 0 : _a.removeAttribute('data-show');
     }
     render() {
-        return (h(Host, { key: '0b905cfd95b07050b34bf1587736871a66637210', class: {} }, h("div", { key: '92a0c44d55c69d683c72b90ec8c309becde3a139', "aria-describedby": this.containerId, class: "icon", innerHTML: this.icon, onMouseEnter: () => this.show(), onFocus: () => this.show(), onMouseLeave: () => this.hide(), onBlur: () => this.hide(), ref: el => (this.iconEl = el) }), h("div", { key: 'f4de7382924d142eb17c4182ae62664840899b98', id: this.containerId, role: "tooltip", class: "tooltip", "data-popper-placement": "bottom", ref: el => (this.tooltipEl = el) }, h("span", { key: 'a234a362f265a9cf1bb5e80f2b2153bc0330bb84', innerHTML: this.text }), h("div", { key: 'cdb2986f346829a29dca06a63ae6c27b47361e9e', "data-popper-arrow": "true", class: "arrow" }))));
+        return (h(Host, { key: '01561bbac755654aad935cc091c5e90103581381', class: {} }, h("div", { key: '9dceac15cceec19da5a95c9a4f31f7f11b7666ba', "aria-describedby": this.containerId, class: "icon", innerHTML: this.icon, onMouseEnter: () => this.show(), onFocus: () => this.show(), onMouseLeave: () => this.hide(), onBlur: () => this.hide(), ref: el => (this.iconEl = el) }), h("div", { key: '5ed88cb901ccf283496e0920e73abdcd047f259d', id: this.containerId, role: "tooltip", class: "tooltip", "data-popper-placement": "bottom", ref: el => (this.tooltipEl = el) }, h("span", { key: 'a7c5ca9d7ce4c0224c8ae35c51fd52bf108f7851', innerHTML: this.text }), h("div", { key: 'b83b7a614b8c4523376b435fe8756037399209ba', "data-popper-arrow": "true", class: "arrow" }))));
     }
     static get is() { return "verdocs-help-icon"; }
     static get originalStyleUrls() {

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

@@ -8,7 +8,7 @@ import { h, Host } from "@stencil/core";
  */
 export class VerdocsLoader {
     render() {
-        return h(Host, { key: '07713ff1f27e7100abdddf4d8652d49fcf0d1c13' });
+        return h(Host, { key: 'e701f300af5b68d42a56e1162eccc3c45d511a5e' });
     }
     static get is() { return "verdocs-loader"; }
     static get originalStyleUrls() {

package/dist/collection/components/controls/verdocs-menu-panel/verdocs-menu-panel.css

@@ -25,7 +25,7 @@
   position: fixed;
   overflow-y: scroll;
   background-color: #ffffff;
-  font-family: "Inter", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;
+  font-family: var(--verdocs-primary-font, "Inter", "Barlow", sans-serif);
   -webkit-animation: showVerdocsMenuPanel 0.35s;
   -webkit-animation-fill-mode: forwards;
 }

package/dist/collection/components/controls/verdocs-menu-panel/verdocs-menu-panel.js

@@ -67,7 +67,7 @@ export class VerdocsMenuPanel {
         (_b = document.getElementById(this.panelId)) === null || _b === void 0 ? void 0 : _b.remove();
     }
     render() {
-        return (h(Host, { key: '433d003e79f33ac91e6535b34a7857520eba52a9', ref: el => (this.element = el) }, h("slot", { key: '349bf90ff34df330916d1aad0a40c79cce1c32bc' })));
+        return (h(Host, { key: 'd8b777eb6e71718b528f35525f1963fa6540abba', ref: el => (this.element = el) }, h("slot", { key: 'c058bb6646d247a152714f3763eda42c340969f0' })));
     }
     static get is() { return "verdocs-menu-panel"; }
     static get originalStyleUrls() {

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

@@ -25,7 +25,7 @@ export class VerdocsOrganizationCard {
         console.log('Rendering org card', this.organization.thumbnail_url, this.organization);
         const fallbackIcon = BusinessIcon;
         const portalId = `verdocs-org-card-${this.organization.id}`;
-        return (h(Host, { key: 'f714963eac994c9af17b768ceb22c66f90319bd6', id: portalId }, this.organization.thumbnail_url ? h("img", { class: "icon", src: this.organization.thumbnail_url, alt: "Logo" }) : h("span", { class: "icon", innerHTML: fallbackIcon }), h("span", { key: '641f1eb3669bce8066eb52974b490bf2f33480d3', class: "content" }, (_a = this.organization) === null || _a === void 0 ? void 0 : _a.name), h("verdocs-portal", { key: '57d1f15ad28798b414d6c7b0b9187d489501aae9', anchor: portalId }, h("div", { key: '3324ae37c0d8b818d5dab21b11693306d1dce6b3', class: "verdocs-org-card-popup", style: { display: this.hovered ? 'block' : 'none' } }, this.organization.full_logo_url ? (h("div", { class: "popup-header-with-logo" }, h("img", { src: this.organization.full_logo_url, alt: "Logo" }), h("div", { class: "title" }, (_b = this.organization) === null || _b === void 0 ? void 0 : _b.name))) : (h("div", { class: "popup-header" }, h("span", { class: "status" }, h("span", { class: "icon", innerHTML: fallbackIcon })), h("span", { class: "title" }, (_c = this.organization) === null || _c === void 0 ? void 0 : _c.name))), h("div", { key: '9fe15a204516ddfcc7f35cb7ee33bbb80b163260', class: "popup-body" }, h("div", { key: 'a7b6c6041e09759545403613b5388ba90f789acc', class: "field" }, h("strong", { key: 'e558409769026901dfc17a67f2d7d59582cd960e' }, "Joined"), format(new Date(((_d = this.organization) === null || _d === void 0 ? void 0 : _d.created_at) || undefined), 'LLL d, Y')), this.organization.url && (h("div", { key: '94e6ce975794db4f3c5201af902a93fe886c416e', class: "field" }, h("strong", { key: '3ec6bd5272f762065ab6c0b95301b77539e514ff' }, "Website"), h("a", { key: '44be7da94d554d4c75575e23d56143c2346637b9', href: (_e = this.organization) === null || _e === void 0 ? void 0 : _e.url, target: "_blank", rel: "nofollow" }, (_f = this.organization) === null || _f === void 0 ? void 0 : _f.url))))))));
+        return (h(Host, { key: 'afab00c0594b7f49114cb0cd6d0f35072a6557a9', id: portalId }, this.organization.thumbnail_url ? h("img", { class: "icon", src: this.organization.thumbnail_url, alt: "Logo" }) : h("span", { class: "icon", innerHTML: fallbackIcon }), h("span", { key: '820fee6596d9724cfa6628d1b820fccf8c448040', class: "content" }, (_a = this.organization) === null || _a === void 0 ? void 0 : _a.name), h("verdocs-portal", { key: '9d96819970166e1dba589b8e7bcfecb17302b642', anchor: portalId }, h("div", { key: '9afb356db5a41fab522196b24001079656895bb8', class: "verdocs-org-card-popup", style: { display: this.hovered ? 'block' : 'none' } }, this.organization.full_logo_url ? (h("div", { class: "popup-header-with-logo" }, h("img", { src: this.organization.full_logo_url, alt: "Logo" }), h("div", { class: "title" }, (_b = this.organization) === null || _b === void 0 ? void 0 : _b.name))) : (h("div", { class: "popup-header" }, h("span", { class: "status" }, h("span", { class: "icon", innerHTML: fallbackIcon })), h("span", { class: "title" }, (_c = this.organization) === null || _c === void 0 ? void 0 : _c.name))), h("div", { key: 'fbd533d1b9981ed1748426ca40cf2acef04b4516', class: "popup-body" }, h("div", { key: '5d9e78644cb47b61aaf86051aada3e6af888552a', class: "field" }, h("strong", { key: '6c734f2d6f847bd52dba49bd0d3d76765df30af9' }, "Joined"), format(new Date(((_d = this.organization) === null || _d === void 0 ? void 0 : _d.created_at) || undefined), 'LLL d, Y')), this.organization.url && (h("div", { key: 'e8a7221d73736f7832a2cc839a32efb9bcd50348', class: "field" }, h("strong", { key: '1aeb04edea44fb6db755a22a07ca34f22ad4f72d' }, "Website"), h("a", { key: '26c2d1306f50aa2560525415bb0874f5cb9e461d', href: (_e = this.organization) === null || _e === void 0 ? void 0 : _e.url, target: "_blank", rel: "nofollow" }, (_f = this.organization) === null || _f === void 0 ? void 0 : _f.url))))))));
     }
     static get is() { return "verdocs-organization-card"; }
     static get originalStyleUrls() {

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

@@ -53,7 +53,7 @@ export class VerdocsQuickFilter {
         const firstPage = Math.max(0, this.selectedPage - 2);
         const numPages = this.itemCount > 0 ? Math.ceil(this.itemCount / this.perPage) : 0;
         const pagesToDisplay = integerSequence(0, Math.ceil(this.itemCount / this.perPage)).slice(firstPage, firstPage + VISIBLE_PAGES);
-        return (h(Host, { key: 'be5c85f6d219c3589c3ef508e2305cbebea4f320' }, this.selectedPage > 0 && h(PageButton, { key: 'de0c9f90c0af7b77f6d9112c7e2d43978511d0d7', page: 'first', selected: this.selectedPage, onClick: () => this.handleSelectPage(0) }), firstPage > 0 && h("div", { key: 'f89043de5ca509613e85e3dc00abc8bd3450be6d', class: "ellipsis" }, "..."), pagesToDisplay.map(pageNumber => (h(PageButton, { page: pageNumber, selected: this.selectedPage, onClick: page => this.handleSelectPage(+page) }))), this.selectedPage < numPages - 1 && h("div", { key: '2ddedd7acfab567d550e77bc9471f35114d427de', class: "ellipsis" }, "..."), this.selectedPage < numPages - 1 && h(PageButton, { key: '64be509651e68b79bc0f1084eb2e0204d769dfef', page: 'last', selected: this.selectedPage, onClick: () => this.handleSelectPage(numPages - 1) })));
+        return (h(Host, { key: '03b57ea3a695b457ea3cc0aa2813e5419c8ad07b' }, this.selectedPage > 0 && h(PageButton, { key: '9003f2d2548624fc94bbbe35c734386e1936a951', page: 'first', selected: this.selectedPage, onClick: () => this.handleSelectPage(0) }), firstPage > 0 && h("div", { key: '2a08578f6970898bbe359d5aa7fb6eebd0b511cf', class: "ellipsis" }, "..."), pagesToDisplay.map(pageNumber => (h(PageButton, { page: pageNumber, selected: this.selectedPage, onClick: page => this.handleSelectPage(+page) }))), this.selectedPage < numPages - 1 && h("div", { key: '95d2ce1bac935f2d406601c8c719adb5bc441e10', class: "ellipsis" }, "..."), this.selectedPage < numPages - 1 && h(PageButton, { key: 'ecab7247dd0c2ea25c88413c63c48c82dc8888b2', page: 'last', selected: this.selectedPage, onClick: () => this.handleSelectPage(numPages - 1) })));
     }
     static get is() { return "verdocs-pagination"; }
     static get originalStyleUrls() {

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

@@ -94,7 +94,7 @@ export class VerdocsPortal {
         this.moved ? this.portal.remove() : (this.moved = true);
     }
     render() {
-        return (h(Host, { key: 'eeb176eb22239e9bd1859d87e50d9dba08a36c5a', ref: el => (this.element = el), class: "verdocs-portal" }, h("slot", { key: '0cc38913adf3b2d41e9d635a7c6bafac3e71fd8f' })));
+        return (h(Host, { key: '7665b2b43d8e3e12ee2220efa0bf3df23daa5c8c', ref: el => (this.element = el), class: "verdocs-portal" }, h("slot", { key: '0972e32632d3f59a1157c278f0ea54ac71eabbdf' })));
     }
     static get is() { return "verdocs-portal"; }
     static get originalStyleUrls() {

package/dist/collection/components/controls/verdocs-progress-bar/verdocs-progress-bar.js

@@ -24,7 +24,7 @@ export class VerdocsProgressBar {
     render() {
         const widthPercent = Math.ceil((100 * Math.min(this.percent, 100)) / 100);
         console.log('Rendering progress bar', { widthPercent, label: this.label, showPercent: this.showPercent, percent: this.percent });
-        return (h(Host, { key: 'cfccbd59016954d10782723bae6eb451ac8e3e30' }, h("div", { key: 'a0981e9257e56f6c1e207cda99c637bbff85227f', class: "labels" }, this.label && h("div", { key: '5d692917d2a9b0baf1802573e783fdae4efcc35b', class: "label" }, this.label), this.showPercent && h("div", { key: '14a507c2bc3a7474f1d9933fd87b52b8695a52a4', class: "label" }, this.percent, "%")), h("div", { key: '187e0efa73554e681d71bb1d26283e3ab226ca59', class: "bar" }, h("div", { key: '1ec5e3c55c52b0d88cc5da1cec57a24918d8e735', class: "slider", style: { width: `${widthPercent}%` } }))));
+        return (h(Host, { key: '0fccebe012d4176accce818db93549436353a12b' }, h("div", { key: '866545106432fe477688dbcff60c0416fe7f6eeb', class: "labels" }, this.label && h("div", { key: '8449f4aed2d3071f285dccb88fd05ce1c13e89e2', class: "label" }, this.label), this.showPercent && h("div", { key: '62c472c07786bb1251743554e543b0e64639449d', class: "label" }, this.percent, "%")), h("div", { key: '2eb42e0ebfeab8596a0c08f79b87d8ac132ee243', class: "bar" }, h("div", { key: 'ad6f73e950a0244ebd6b0e91f1846cb490f41767', class: "slider", style: { width: `${widthPercent}%` } }))));
     }
     static get is() { return "verdocs-progress-bar"; }
     static get originalStyleUrls() {

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

@@ -10,7 +10,7 @@
   }
 }
 verdocs-radio-button {
-  font-family: "Inter", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;
+  font-family: var(--verdocs-primary-font, "Inter", "Barlow", sans-serif);
   width: 20px;
   height: 20px;
   display: block;

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

@@ -37,7 +37,7 @@ export class VerdocsRadioButton {
         this.disabled = false;
     }
     render() {
-        return (h(Host, { key: '25dcdde1d8837e343002fb1ead236752099bef7a', class: { disabled: this.disabled } }, h("input", { key: '612b43c1693b5c50a56d8ec54d598a11822a6f82', type: "radio", value: this.value, name: this.name, id: `verdocs-radio-button-${this.name}-${this.value}`, checked: this.checked, disabled: this.disabled }), h("label", { key: '568e105e85565a22c766a823323d333202cc4386', htmlFor: `verdocs-radio-button-${this.name}-${this.value}` })));
+        return (h(Host, { key: '5b18b354b3f366588b927e86bc50c78823b0170a', class: { disabled: this.disabled } }, h("input", { key: '4ce54812b031e4c4834c120e1590182603a6c048', type: "radio", value: this.value, name: this.name, id: `verdocs-radio-button-${this.name}-${this.value}`, checked: this.checked, disabled: this.disabled }), h("label", { key: '01a9bc0b36ae4f7a6d3d9c5a6bc53b9c41881bc3', htmlFor: `verdocs-radio-button-${this.name}-${this.value}` })));
     }
     static get is() { return "verdocs-radio-button"; }
     static get originalStyleUrls() {

package/dist/collection/components/controls/verdocs-select-input/verdocs-select-input.js

@@ -24,7 +24,7 @@ export class VerdocsSelectInput {
         this.disabled = false;
     }
     render() {
-        return (h(Host, { key: 'c46f6b1366be359d88978c5972f25fd6c789af9b', class: "input-field" }, h("label", { key: '47408c05e2086310598ccbee67c90480f0e81059' }, this.label ? h("div", { class: "input-label" }, this.label + ':') : h("div", null), h("select", { key: '365a09cc6540276b90d51940b5ee1be042d9c563', class: "input-element", disabled: this.disabled }, this.options.map(option => (h("option", { value: option.value, selected: option.value === this.value }, option.label)))))));
+        return (h(Host, { key: '1a4acb909d78325f037d70f15b34a78d7002e42a', class: "input-field" }, h("label", { key: '264ee00bca9c235fb0d1900cbcc3ab0aed60bc86' }, this.label ? h("div", { class: "input-label" }, this.label + ':') : h("div", null), h("select", { key: 'e44f745698a81aa3eec6af69bf55c843ad53de0d', class: "input-element", disabled: this.disabled }, this.options.map(option => (h("option", { value: option.value, selected: option.value === this.value }, option.label)))))));
     }
     static get is() { return "verdocs-select-input"; }
     static get originalStyleUrls() {

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

@@ -14,7 +14,7 @@ export class VerdocsQuickFilter {
         this.mode = 'light';
     }
     render() {
-        return (h(Host, { key: '335641f6984681e976a14e02f973413eabb612c9', style: {
+        return (h(Host, { key: 'e6e3e9db3496ed8041e1a41e579b5352c8c3b4f3', style: {
                 width: `${this.size}px`, //
                 height: `${this.size}px`,
                 flex: `0 0 ${this.size}px`,

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

@@ -19,13 +19,13 @@ export class VerdocsSwitch {
         this.disabled = false;
     }
     render() {
-        return (h("button", { key: 'bde7a0db4ffaaadb079e90b4c31be3e34eda060b', value: "on", type: "button", role: "switch", class: `switch ${this.theme} ${this.disabled ? 'disabled' : ''}`, "data-state": this.checked ? 'checked' : 'unchecked', "aria-checked": this.checked ? 'checked' : 'unchecked', onClick: () => {
+        return (h("button", { key: 'bfd701b76d41a37203871c03710b39ed3574e3ad', value: "on", type: "button", role: "switch", class: `switch ${this.theme} ${this.disabled ? 'disabled' : ''}`, "data-state": this.checked ? 'checked' : 'unchecked', "aria-checked": this.checked ? 'checked' : 'unchecked', onClick: () => {
                 var _a;
                 if (!this.disabled) {
                     this.checked = !this.checked;
                     (_a = this.checkedChange) === null || _a === void 0 ? void 0 : _a.emit(this.checked);
                 }
-            } }, h("span", { key: '6a685215089a2df26bc6c9b90193b9708dc32034', "data-state": this.checked ? 'checked' : 'unchecked', class: "slider" })));
+            } }, h("span", { key: 'c2141bea94228cc6eff938b3ac9afdeb811e49cd', "data-state": this.checked ? 'checked' : 'unchecked', class: "slider" })));
     }
     static get is() { return "verdocs-switch"; }
     static get originalStyleUrls() {

package/dist/collection/components/controls/verdocs-text-input/verdocs-text-input.js

@@ -72,9 +72,9 @@ export class VerdocsTextInput {
             .catch(e => console.log('Error copying to clipboard', e));
     }
     render() {
-        return (h(Host, { key: '6a5812204aef54882702cc4ae774828a7a5f9d20', class: `input-field ${this.clearable ? 'clearable' : ''} ${this.copyable ? 'copyable' : ''}` }, h("label", { key: '66dff3172fe976cd4b59294a7aa866e9f5935ee8' }, this.label && (h("div", { key: '7ef33be8b4432f07d6b382b575abd4c517e4ac78', class: "input-label" }, this.label + ':', this.required && h("span", { key: '09efdde96e263b296a1456f5107c63eea666ceaf', class: "required" }, "*"))), h("div", { key: '98bd42333f58857908e1c942431d242846f3f7d7', class: "input-container" }, h("input", { key: '5878d99c2f683378d85122807b8fb72083285cc4', type: this.type === 'password' && this.showingPw ? 'text' : this.type, value: this.value, required: this.required, class: "input-element", "data-lpignore": "true", disabled: this.disabled, placeholder: this.placeholder, autoComplete: this.autocomplete,
+        return (h(Host, { key: '37856244423d55c7b0c03c259c1e1bf4940ede25', class: `input-field ${this.clearable ? 'clearable' : ''} ${this.copyable ? 'copyable' : ''}` }, h("label", { key: '22ff61e3f1c3f7230960a59f4c863a3f93ea78ce' }, this.label && (h("div", { key: '4a73bba334959de8519f16c476fa21a120b159ed', class: "input-label" }, this.label + ':', this.required && h("span", { key: 'ee4e71aae1ed34c428f7ec302c2e20ccc279bd3f', class: "required" }, "*"))), h("div", { key: '5c2554158428d37bbad9a932a80fdf03058f1668', class: "input-container" }, h("input", { key: 'efee03c66041a5023a2f6fcb9c11fc015acba876', type: this.type === 'password' && this.showingPw ? 'text' : this.type, value: this.value, required: this.required, class: "input-element", "data-lpignore": "true", disabled: this.disabled, placeholder: this.placeholder, autoComplete: this.autocomplete,
             // onBlur={(e: any) => this.blur?.emit(e.target.value)}
-            ref: el => (this.inputEl = el), onInput: (e) => (this.value = e.target.value) }), this.description && h("div", { key: 'e11f44395f7bce64bd22490ca4c705e75e299959', class: "description" }, this.description), this.clearable && this.value && (h("span", { key: 'c9c8ab86cfe0f8e094372671b058bf553c7b839d', innerHTML: ClearIcon, class: "clear", onClick: () => {
+            ref: el => (this.inputEl = el), onInput: (e) => (this.value = e.target.value) }), this.description && h("div", { key: 'ea41c1c59de322d77a1079fb169dac1b46c69f22', class: "description" }, this.description), this.clearable && this.value && (h("span", { key: 'ee8f307810fd0f120913d3e8413d4e2e8908cf0f', innerHTML: ClearIcon, class: "clear", onClick: () => {
                 // We need to allow the onInput event to fire first in case
                 // the user was focused on this field before clicking clear.
                 setTimeout(() => {
@@ -88,9 +88,9 @@ export class VerdocsTextInput {
                         (_b = this.inputEl) === null || _b === void 0 ? void 0 : _b.blur();
                     }, 50);
                 }, 50);
-            } })), this.type === 'password' && (h("span", { key: '47402b1fefd1716010d98cc48452b2f17a0cbf39', innerHTML: this.showingPw ? EyeIcon : EyeSlashIcon, class: "toggle-pw", onClick: () => {
+            } })), this.type === 'password' && (h("span", { key: '232118598f2cd2dfc3a3bd9b40fbef44f9aef124', innerHTML: this.showingPw ? EyeIcon : EyeSlashIcon, class: "toggle-pw", onClick: () => {
                 this.showingPw = !this.showingPw;
-            } })), !this.clearable && this.copyable && this.value && h("span", { key: 'eb9b9792a040a734109609f447afe65565b8d16e', innerHTML: CopyIcon, class: "copy", onClick: () => this.copyToClipboard() })), this.helpText && h("verdocs-help-icon", { key: 'aef7243d497bc4c4513fb6984eb8290df959f990', text: this.helpText }))));
+            } })), !this.clearable && this.copyable && this.value && h("span", { key: '0bc6196a6cc4eea8492f15a5a457a3fa641f6a60', innerHTML: CopyIcon, class: "copy", onClick: () => this.copyToClipboard() })), this.helpText && h("verdocs-help-icon", { key: '98092330afff1324449141e8c550384ae4a7a68f', text: this.helpText }))));
     }
     static get is() { return "verdocs-text-input"; }
     static get originalStyleUrls() {

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

@@ -34,7 +34,7 @@ export class VerdocsToggleButton {
         (_a = this.toggle) === null || _a === void 0 ? void 0 : _a.emit({ active: newState });
     }
     render() {
-        return (h(Host, { key: '264b52ad58934b71384400c222095e0239514874', class: `size-${this.size}` }, this.icon ? (h("button", { innerHTML: this.icon, class: { active: this._active }, onClick: e => this.handleToggle(e) })) : (h("button", { class: { active: this._active }, onClick: e => this.handleToggle(e) }, this.label))));
+        return (h(Host, { key: 'e92a8c60848ee1e3f93eba9e2e0cb4c47e3424db', class: `size-${this.size}` }, this.icon ? (h("button", { innerHTML: this.icon, class: { active: this._active }, onClick: e => this.handleToggle(e) })) : (h("button", { class: { active: this._active }, onClick: e => this.handleToggle(e) }, this.label))));
     }
     static get is() { return "verdocs-toggle-button"; }
     static get originalStyleUrls() {

package/dist/collection/components/controls/verdocs-toolbar-icon/verdocs-toolbar-icon.css

@@ -10,7 +10,7 @@
   }
 }
 verdocs-toolbar-icon {
-  font-family: "Inter", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;
+  font-family: var(--verdocs-primary-font, "Inter", "Barlow", sans-serif);
   display: flex;
   position: relative;
   align-items: center;

package/dist/collection/components/controls/verdocs-toolbar-icon/verdocs-toolbar-icon.js

@@ -56,7 +56,7 @@ export class VerdocsToolbarIcon {
     //   this.press?.emit();
     // }
     render() {
-        return (h(Host, { key: 'ecf1a0b23cc9d9dc6718a7869a3484ae9dbac3aa', class: {} }, h("div", { key: '9e20e5cc5cfc2f780a1858ce5f91f62dad404afc', "aria-describedby": this.containerId, class: "icon", innerHTML: this.icon, onMouseEnter: () => this.show(), onFocus: () => this.show(), onMouseLeave: () => this.hide(), onBlur: () => this.hide(), ref: el => (this.iconEl = el) }), h("div", { key: '24407135ffe2d3e35b981f992bdab26ab90be71a', id: this.containerId, role: "tooltip", class: "tooltip", "data-popper-placement": this.placement, ref: el => (this.tooltip = el) }, this.text, h("div", { key: '556a83011327de9271ba7f1a8e35999d72c5513e', "data-popper-arrow": "true", class: "arrow" }))));
+        return (h(Host, { key: 'f8516f47ac92cf82f1b833d76a8e13d819c597bd', class: {} }, h("div", { key: '1d7a381d4d662bfcad7519da73535151bb99ecd2', "aria-describedby": this.containerId, class: "icon", innerHTML: this.icon, onMouseEnter: () => this.show(), onFocus: () => this.show(), onMouseLeave: () => this.hide(), onBlur: () => this.hide(), ref: el => (this.iconEl = el) }), h("div", { key: 'c4704c4cd442985192999bf4a26307e43923a54c', id: this.containerId, role: "tooltip", class: "tooltip", "data-popper-placement": this.placement, ref: el => (this.tooltip = el) }, this.text, h("div", { key: '4e25e78425814b991913d1e537b9cf049053185f', "data-popper-arrow": "true", class: "arrow" }))));
     }
     static get is() { return "verdocs-toolbar-icon"; }
     static get originalStyleUrls() {

package/dist/collection/components/dialogs/verdocs-adopt-signature-dialog/verdocs-adopt-signature-dialog.css

@@ -154,18 +154,17 @@ verdocs-adopt-signature-dialog .upload .upload-actions {
   margin-top: 8px;
 }
 verdocs-adopt-signature-dialog .upload .upload-actions .upload-button {
-  border: 1px solid #55bc81;
-  background-color: #55bc81;
+  border: 1px solid var(--verdocs-primary-color, #1a73e8);
+  background-color: var(--verdocs-primary-color, #1a73e8);
   color: #ffffff;
   padding: 8px 20px;
   font-size: 13px;
   cursor: pointer;
-  border-radius: 4px;
+  border-radius: var(--verdocs-button-radius, 4px);
   transition: all 0.2s ease;
 }
 verdocs-adopt-signature-dialog .upload .upload-actions .upload-button:hover {
-  background-color: rgb(62.7594936709, 159.2405063291, 103.9746835443);
-  border-color: rgb(62.7594936709, 159.2405063291, 103.9746835443);
+  filter: brightness(0.9);
 }
 verdocs-adopt-signature-dialog .upload .upload-actions .clear-button {
   border: 1px solid #d0d0d0;
@@ -207,19 +206,32 @@ verdocs-adopt-signature-dialog .buttons button {
   border: 0;
   height: 38px;
   display: flex;
-  color: #ffffff;
   font-size: 14px;
+  font-weight: 500;
   cursor: pointer;
   align-items: center;
-  border-radius: 6px;
+  border-radius: var(--verdocs-button-radius, 6px);
   justify-content: center;
+  transition: all 0.2s ease;
 }
 verdocs-adopt-signature-dialog .buttons button.cancel {
-  background-color: #654dcb;
+  background-color: transparent;
+  border: 1px solid #d1d5db;
+  color: #374151;
+}
+verdocs-adopt-signature-dialog .buttons button.cancel:hover {
+  background-color: #f9fafb;
 }
 verdocs-adopt-signature-dialog .buttons button.proceed {
-  background-color: #55bc81;
+  background-color: var(--verdocs-primary-color, #1a73e8);
+  border: 1px solid transparent;
+  color: #ffffff;
+}
+verdocs-adopt-signature-dialog .buttons button.proceed:hover {
+  background-color: #1557b0;
 }
 verdocs-adopt-signature-dialog .buttons button:disabled {
-  background-color: #6c727f;
+  background-color: #e5e7eb;
+  color: #9ca3af;
+  cursor: not-allowed;
 }

package/dist/collection/components/dialogs/verdocs-adopt-signature-dialog/verdocs-adopt-signature-dialog.js

@@ -431,7 +431,7 @@ export class VerdocsAdoptSignatureDialog {
         };
     }
     render() {
-        return (h("verdocs-dialog", { key: 'e0e6f91846971ced0a1110d70575d0328d1df7f2' }, h("div", { key: 'c43c511d79afa5fcdb8dc0e2f2c1b3c475dbb24c', slot: "heading", class: "heading" }, "Adopt Your Signature"), h("div", { key: '4d41a510e27c7ecf47015c5c78f12e3ace24dfe0', slot: "content", class: "content" }, h("div", { key: 'cbb0bb88d87d07a84eeb0f3c5889aa9191d1db46', style: { fontWeight: '300', color: '#242424', fontSize: '13px' } }, "Confirm your name, initials, and signature."), h("div", { key: '153019386dbce3681ca90a5878e8062d5ebd629f', class: { type: true, active: this.mode === 'type' } }, h("verdocs-text-input", { key: '21997a21554a74bf5f6664e18962e151b696977e', label: "Full Name", value: this.enteredName, onInput: e => this.handleNameChange(e), onClick: e => e.stopPropagation() })), h("div", { key: '74f5a84db5ae90e063f85a80e86d4b995e516a0c', style: { fontWeight: '400', color: '#242424', fontSize: '13px' } }, "Select a signature style"), h("div", { key: '05a83923186b180cc32a7060ddcf30e8f78aaeae', style: { display: 'flex', flexDirection: 'row', gap: '10px', marginBottom: '6px', alignItems: 'center', fontSize: '13px' } }, h("verdocs-radio-button", { key: '2475dd5c213b45339996799282a1b650cd9f4416', checked: this.mode === 'type', value: "type", name: "mode", onClick: () => (this.mode = 'type') }), h("label", { key: '84426bebb6184f146a82ca3df75afb377d57dc1e' }, "Typed with a keyboard")), h("div", { key: '299feecf4b50ffaeb6bbac8349adc90872acb3d0', style: { display: 'flex', flexDirection: 'row', gap: '10px', marginBottom: '6px', alignItems: 'center', fontSize: '13px' } }, h("verdocs-radio-button", { key: '7fc2262551d100b509065e3e61cb2606c3ee3ce4', checked: this.mode === 'draw', value: "draw", name: "mode", onClick: () => (this.mode = 'draw') }), h("label", { key: '6f6c89fedb6fdbef092dd0300945bc0ba723ecc9' }, "Drawn with touch, mouse, or stylus")), h("div", { key: 'd46dfe69a754bb9db55798af1918426ee1ed41d0', style: { fontSize: '13px', fontWeight: '400', marginTop: '8px' } }, "Signature Preview"), h("canvas", { key: 'b32ad9debae275905b188f50c747fb9100dc6915', ref: el => (this.signatureElement = el), width: "300", height: "79", onPointerDown: this.handleSigPointerDown, onPointerMove: this.handleSigPointerMove, onPointerUp: this.handleSigPointerUp, onPointerCancel: this.handleSigPointerCancel, style: { touchAction: 'none', cursor: 'crosshair' } }), h("div", { key: 'f86ac5d3273319bc6dbd573e8fe203819c4b2f47', style: { fontSize: '13px', fontWeight: '400', marginTop: '8px' } }, "Initials Preview"), h("canvas", { key: 'e989b879e932fe17ef4263b887841fb57bbc2307', ref: el => (this.initialsElement = el), width: "300", height: "79", onPointerDown: this.handleInitialsPointerDown, onPointerMove: this.handleInitialsPointerMove, onPointerUp: this.handleInitialsPointerUp, onPointerCancel: this.handleInitialsPointerCancel, style: { touchAction: 'none', cursor: 'crosshair' } }), h("div", { key: 'a5245a28f5d9c2b75e8a6033ae0f43935af3d8ab', class: "disclaimer" }, "By clicking \u00ABAdopt Signature\u00BB, I agree that the signature and initials above will be the electronic representation of my signature and initials for all purposes when I use them to sign documents. Applying them to a document is legally equivalent to signing with a pen on paper.")), h("div", { key: 'ca0a22af2bcac343af88ccc2a1bac7785ee26213', class: "footer", slot: "footer" }, h("div", { key: '4aa605c10723fff6cc5589f4a602d89e9ecd4ec6', class: "buttons" }, h("button", { key: '18fff440c52c241cb6c17cb095ee7fdb805172a0', class: "cancel", onClick: e => this.handleCancel(e) }, "Cancel"), h("button", { key: '1375add10925435c0ad870e3eea330edc202fb24', class: "proceed", onClick: e => this.handleAdopt(e), disabled: this.isAdoptButtonDisabled() }, "Adopt & Sign")))));
+        return (h("verdocs-dialog", { key: 'f2cee2f94f64c69a4472b5aa5bd15194d9a6978a' }, h("div", { key: '8b9c40b0dcaaab0dfb45aab6d0304a78f4c1e959', slot: "heading", class: "heading" }, "Adopt Your Signature"), h("div", { key: '2a7f79b3f11b92f3e3f28990acdfcba2f708a87d', slot: "content", class: "content" }, h("div", { key: '7b2ec6bc9f1610169af50799ed7075c25dc3a869', style: { fontWeight: '300', color: '#242424', fontSize: '13px' } }, "Confirm your name, initials, and signature."), h("div", { key: '1a16357eecf76cdb198af28e93dd3ae4e5b67a34', class: { type: true, active: this.mode === 'type' } }, h("verdocs-text-input", { key: 'e7839c01da21aed0c1e9fff1d5c7a5c4c9061b01', label: "Full Name", value: this.enteredName, onInput: e => this.handleNameChange(e), onClick: e => e.stopPropagation() })), h("div", { key: 'cda2dd5e3fa360dbd95b68e736d83bc6c1c0f984', style: { fontWeight: '400', color: '#242424', fontSize: '13px' } }, "Select a signature style"), h("div", { key: '5f585dcfda7ba1d9faa32230c2537106033f43ae', style: { display: 'flex', flexDirection: 'row', gap: '10px', marginBottom: '6px', alignItems: 'center', fontSize: '13px' } }, h("verdocs-radio-button", { key: '4b8355294d55d2f6756b59612f82fd61dd73c8ab', checked: this.mode === 'type', value: "type", name: "mode", onClick: () => (this.mode = 'type') }), h("label", { key: '3568c15533e2bcc638102e6a7af2e99f637e53ba' }, "Typed with a keyboard")), h("div", { key: 'a228649422e16268ab7276c33a9155640b34c0bd', style: { display: 'flex', flexDirection: 'row', gap: '10px', marginBottom: '6px', alignItems: 'center', fontSize: '13px' } }, h("verdocs-radio-button", { key: '622475863bddb2ffbf492c0f692b3cee1c99b3f8', checked: this.mode === 'draw', value: "draw", name: "mode", onClick: () => (this.mode = 'draw') }), h("label", { key: 'b875f51c08157205a4c5b5c58101560fda054764' }, "Drawn with touch, mouse, or stylus")), h("div", { key: '7c1f203aee570e6b649d649625c22b13dca3ddf2', class: "draw-actions" }, h("button", { key: 'e0241a06c87912d9c21a2a95b16c3b653b97cc1b', class: "clear-button", onClick: e => this.handleClearDrawing(e), disabled: !this.hasDrawnSignature }, "Clear")), h("div", { key: 'eab1ce8340712dfe289d3458040c4b9ed57c0ee8', style: { fontSize: '13px', fontWeight: '400', marginTop: '8px' } }, "Signature Preview"), h("canvas", { key: '3c49dfc917a9665a9623078d4dc92195125db602', ref: el => (this.signatureElement = el), width: "300", height: "79", onPointerDown: this.handleSigPointerDown, onPointerMove: this.handleSigPointerMove, onPointerUp: this.handleSigPointerUp, onPointerCancel: this.handleSigPointerCancel, style: { touchAction: 'none', cursor: 'crosshair' } }), h("div", { key: '853673011f0f7d3ab7b9b83fe0150e238113121a', style: { fontSize: '13px', fontWeight: '400', marginTop: '8px' } }, "Initials Preview"), h("canvas", { key: 'da5734e05959680323d4939218128bf2131a57df', ref: el => (this.initialsElement = el), width: "300", height: "79", onPointerDown: this.handleInitialsPointerDown, onPointerMove: this.handleInitialsPointerMove, onPointerUp: this.handleInitialsPointerUp, onPointerCancel: this.handleInitialsPointerCancel, style: { touchAction: 'none', cursor: 'crosshair' } }), h("div", { key: 'e717761cd09caa1188b2788155571564811e0f15', class: "disclaimer" }, "By clicking \u00ABAdopt Signature\u00BB, I agree that the signature and initials above will be the electronic representation of my signature and initials for all purposes when I use them to sign documents. Applying them to a document is legally equivalent to signing with a pen on paper.")), h("div", { key: '7c8f9ffb84f847e6e5d8537bbd01228d1f708ec1', class: "footer", slot: "footer" }, h("div", { key: 'b20eb672d5cf8b116025dd5d4c70a2965f404e8e', class: "buttons" }, h("button", { key: '49d9d118ff485a65bf165bd859cd2c43e58a7d12', class: "cancel", onClick: e => this.handleCancel(e) }, "Cancel"), h("button", { key: '7053f2fd53893c25fbf0678cd59862a20dc88e44', class: "proceed", onClick: e => this.handleAdopt(e), disabled: this.isAdoptButtonDisabled() }, "Adopt & Sign")))));
     }
     static get is() { return "verdocs-adopt-signature-dialog"; }
     static get originalStyleUrls() {