@verdocs/web-sdk 4.2.43 → 4.2.47

package/dist/collection/components/fields/verdocs-field-radio-button-group/verdocs-field-radio-button.js

@@ -1,350 +0,0 @@
-import { getRGBA } from "@verdocs/js-sdk";
-import { h, Host, Fragment } from "@stencil/core";
-import { getRoleIndex, getTemplateRoleStore } from "../../../utils/TemplateRoleStore";
-import { getTemplateFieldStore } from "../../../utils/TemplateFieldStore";
-import { getFieldSettings } from "../../../utils/utils";
-import { SettingsIcon } from "../../../utils/Icons";
-const RadioIconUnselected = `<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"></path></svg>`;
-const RadioIconSelected = `<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24"><path d="M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"></path></svg>`;
-/**
- * Displays a radio button.
- */
-export class VerdocsFieldRadioButton {
-    constructor() {
-        this.fieldStore = null;
-        this.roleStore = null;
-        this.templateid = '';
-        this.fieldname = '';
-        this.option = 0;
-        this.disabled = false;
-        this.done = false;
-        this.editable = false;
-        this.moveable = false;
-        this.xscale = 1;
-        this.yscale = 1;
-        this.pagenumber = 1;
-        this.showingProperties = false;
-    }
-    async showSettingsPanel() {
-        const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`);
-        if (settingsPanel && settingsPanel.showPanel) {
-            settingsPanel.showPanel();
-        }
-    }
-    async hideSettingsPanel() {
-        const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`);
-        if (settingsPanel && settingsPanel.hidePanel) {
-            settingsPanel.hidePanel();
-        }
-    }
-    async componentWillLoad() {
-        this.fieldStore = getTemplateFieldStore(this.templateid);
-        this.roleStore = getTemplateRoleStore(this.templateid);
-    }
-    render() {
-        const { templateid, fieldname = '', option, editable = false, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
-        const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
-        const { required = false, role_name = '' } = field || {};
-        const { options = [] } = getFieldSettings(field);
-        const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
-        const { id = 'option1', selected = false } = options[option] || {};
-        const fieldId = `${fieldname}-${id}`;
-        if (done) {
-            return (h(Host, { class: { done }, style: { maxWidth: '10px' } }, h("span", { innerHTML: selected ? RadioIconSelected : RadioIconUnselected })));
-        }
-        return (h(Host, { class: { required, disabled, done }, style: { backgroundColor } }, h("input", { id: fieldId, type: "radio", name: fieldname, value: id, checked: !!selected, disabled: disabled, required: required }), h("label", { htmlFor: fieldId }), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
-                e.stopPropagation();
-                this.showingProperties = !this.showingProperties;
-            } }), this.showingProperties && (h("verdocs-portal", { anchor: `verdocs-settings-panel-trigger-${fieldname}`, onClickAway: () => (this.showingProperties = false) }, h("verdocs-template-field-properties", { templateId: templateid, fieldName: fieldname, onClose: () => (this.showingProperties = false), onDelete: () => {
-                var _a;
-                (_a = this.deleted) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: fieldname });
-                return this.hideSettingsPanel();
-            }, onSettingsChanged: e => {
-                var _a;
-                (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
-                return this.hideSettingsPanel();
-            }, helpText: "Radio buttons capture the recipient's selection of just one of several related (exclusive) options." })))))));
-    }
-    static get is() { return "verdocs-field-radio-button"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["verdocs-field-radio-button.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["verdocs-field-radio-button.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "templateid": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The template the field is for/from. Only required in Builder mode, to support the Field Properties dialog."
-                },
-                "attribute": "templateid",
-                "reflect": true,
-                "defaultValue": "''"
-            },
-            "fieldname": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The name of the field to display."
-                },
-                "attribute": "fieldname",
-                "reflect": true,
-                "defaultValue": "''"
-            },
-            "option": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The index of the settings option this particular checkbox is for"
-                },
-                "attribute": "option",
-                "reflect": true,
-                "defaultValue": "0"
-            },
-            "disabled": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled."
-                },
-                "attribute": "disabled",
-                "reflect": true,
-                "defaultValue": "false"
-            },
-            "done": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "If set, the field is considered \"done\" and is drawn in a display-final-value state."
-                },
-                "attribute": "done",
-                "reflect": true,
-                "defaultValue": "false"
-            },
-            "editable": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\nchanged, so it should typically only be enabled in the Builder."
-                },
-                "attribute": "editable",
-                "reflect": true,
-                "defaultValue": "false"
-            },
-            "moveable": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields."
-                },
-                "attribute": "moveable",
-                "reflect": true,
-                "defaultValue": "false"
-            },
-            "xscale": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "If set, the field will be be scaled horizontally by this factor."
-                },
-                "attribute": "xscale",
-                "reflect": true,
-                "defaultValue": "1"
-            },
-            "yscale": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "If set, the field will be be scaled vertically by this factor."
-                },
-                "attribute": "yscale",
-                "reflect": true,
-                "defaultValue": "1"
-            },
-            "pagenumber": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "The page the field is on"
-                },
-                "attribute": "pagenumber",
-                "reflect": true,
-                "defaultValue": "1"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "showingProperties": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "settingsChanged",
-                "name": "settingsChanged",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Event fired when the field's settings are changed."
-                },
-                "complexType": {
-                    "original": "{fieldName: string; settings: ITemplateFieldSetting; field: ITemplateField}",
-                    "resolved": "{ fieldName: string; settings: ITemplateFieldSetting; field: ITemplateField; }",
-                    "references": {
-                        "ITemplateFieldSetting": {
-                            "location": "import",
-                            "path": "@verdocs/js-sdk",
-                            "id": "node_modules::ITemplateFieldSetting"
-                        },
-                        "ITemplateField": {
-                            "location": "import",
-                            "path": "@verdocs/js-sdk",
-                            "id": "node_modules::ITemplateField"
-                        }
-                    }
-                }
-            }, {
-                "method": "deleted",
-                "name": "deleted",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Event fired when the field is deleted."
-                },
-                "complexType": {
-                    "original": "{fieldName: string}",
-                    "resolved": "{ fieldName: string; }",
-                    "references": {}
-                }
-            }];
-    }
-    static get methods() {
-        return {
-            "showSettingsPanel": {
-                "complexType": {
-                    "signature": "() => Promise<void>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<void>"
-                },
-                "docs": {
-                    "text": "",
-                    "tags": []
-                }
-            },
-            "hideSettingsPanel": {
-                "complexType": {
-                    "signature": "() => Promise<void>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<void>"
-                },
-                "docs": {
-                    "text": "",
-                    "tags": []
-                }
-            }
-        };
-    }
-}

package/dist/components/verdocs-activity-box.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface VerdocsActivityBox extends Components.VerdocsActivityBox, HTMLElement {}
-export const VerdocsActivityBox: {
-    prototype: VerdocsActivityBox;
-    new (): VerdocsActivityBox;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/verdocs-activity-box.js

@@ -1,118 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { VerdocsEndpoint, getEnvelopesSummary, integerSequence, formatShortTimeAgo } from '@verdocs/js-sdk';
-import { S as SDKError } from './errors.js';
-import { d as defineCustomElement$2 } from './verdocs-button2.js';
-
-const verdocsActivityBoxCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-activity-box{-ms-flex:1;flex:1;display:-ms-flexbox;display:flex;font-size:18px;min-width:300px;-ms-flex-wrap:nowrap;flex-wrap:nowrap;color:#33364b;-ms-flex-align:center;align-items:center;border:1px solid #ccc;-ms-flex-direction:column;flex-direction:column;font-family:\"Inter\", \"Barlow\", sans-serif;background:#ffffff;padding:20px 20px 8px 20px}verdocs-activity-box .box-title{width:100%;display:-ms-flexbox;display:flex;color:#33364b;font-size:20px;font-weight:600;-webkit-column-gap:10px;-moz-column-gap:10px;column-gap:10px;margin:0 0 20px 0;-ms-flex-align:center;align-items:center}verdocs-activity-box .box-title .count{margin:0 0 0 6px;font-weight:300}verdocs-activity-box .box-title verdocs-loader{margin:0 0 20px 0}@media screen and (max-width: 1200px){verdocs-activity-box .box-title{font-size:18px}verdocs-activity-box .box-title .count{display:none}}verdocs-activity-box .spacer{-ms-flex:1;flex:1}verdocs-activity-box .loading-placeholder{width:100%;height:62px;display:block;-ms-flex:0 0 62px;flex:0 0 62px;margin:0 0 10px 0;border-radius:6px;background-color:#f5f8f9}verdocs-activity-box .loading-placeholder .loading-placeholder-bg{height:62px;position:relative;background:#f5f8f9;-webkit-animation-duration:1.25s;animation-duration:1.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-name:loadingPlaceholderSwoop;animation-name:loadingPlaceholderSwoop;background:-webkit-gradient(linear, left top, right top, color-stop(10%, #f5f8f9), color-stop(18%, #eeeeee), color-stop(33%, #f5f8f9));background:linear-gradient(to right, #f5f8f9 10%, #eeeeee 18%, #f5f8f9 33%);background-size:800px 62px}verdocs-activity-box .activity-entry{width:100%;display:-ms-flexbox;display:flex;-ms-flex:0 0 62px;flex:0 0 62px;border-radius:6px;margin-bottom:10px;-ms-flex-direction:row;flex-direction:row;padding:0 16px 0 0;background:#f5f8f9;-ms-flex-align:center;align-items:center;border:1px solid #f5f8f9}verdocs-activity-box .activity-entry:hover{cursor:pointer;background:#f2f4f5;border:1px solid #ddd}verdocs-activity-box .activity-entry svg{width:32px;height:32px;margin-right:20px}@media screen and (max-width: 1300px){verdocs-activity-box .activity-entry svg{width:24px;height:24px;margin-right:15px}}verdocs-activity-box .activity-entry .title{-ms-flex:1;flex:1;color:black;font-size:16px;font-weight:500;margin-left:12px}@media screen and (max-width: 1300px){verdocs-activity-box .activity-entry .title{font-size:14px}}verdocs-activity-box .activity-entry .time-ago{height:24px;display:-ms-flexbox;display:flex;-ms-flex:0 0 24px;flex:0 0 24px;color:#7f8e92;font-size:16px;font-weight:500;padding-left:14px;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border-left:1px solid #d8e3e6}@media screen and (max-width: 1300px){verdocs-activity-box .activity-entry .time-ago{font-size:14px}}@-webkit-keyframes loadingPlaceholderSwoop{0%{background-position:-468px 0}100%{background-position:468px 0}}@keyframes loadingPlaceholderSwoop{0%{background-position:-468px 0}100%{background-position:468px 0}}";
-const VerdocsActivityBoxStyle0 = verdocsActivityBoxCss;
-
-const EmptyImage = 'https://verdocs-public-assets.s3.amazonaws.com/no-verdocs.png';
-const VerdocsActivityBox$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsActivityBox extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.sdkError = createEvent(this, "sdkError", 7);
-        this.viewEnvelope = createEvent(this, "viewEnvelope", 7);
-        this.viewAll = createEvent(this, "viewAll", 7);
-        this.endpoint = VerdocsEndpoint.getDefault();
-        this.items = 5;
-        this.view = undefined;
-        this.header = undefined;
-        this.title = '';
-        this.count = 0;
-        this.loading = true;
-        this.entries = [];
-    }
-    async componentWillLoad() {
-        var _a, _b, _c;
-        try {
-            this.endpoint.loadSession();
-            if (!this.endpoint.session) {
-                console.log('[ACTIVITIES] Must be authenticated');
-                return;
-            }
-            this.loadActivity();
-        }
-        catch (e) {
-            console.log('[ACTIVITIES] Error with preview session', e);
-            (_a = this.sdkError) === null || _a === void 0 ? void 0 : _a.emit(new SDKError(e.message, (_b = e.response) === null || _b === void 0 ? void 0 : _b.status, (_c = e.response) === null || _c === void 0 ? void 0 : _c.data));
-        }
-    }
-    handleItemsUpdated() {
-        return this.loadActivity();
-    }
-    handleViewUpdated() {
-        return this.loadActivity();
-    }
-    async loadActivity() {
-        this.loading = true;
-        const r = await getEnvelopesSummary(this.endpoint, 0);
-        let defaultHeader;
-        if (this.view === 'action') {
-            defaultHeader = 'Action Required';
-            this.entries = r.action_required.result;
-            this.count = r.action_required.total;
-        }
-        else if (this.view === 'waiting') {
-            defaultHeader = 'Waiting on Others';
-            this.entries = r.waiting_others.result;
-            this.count = r.waiting_others.total;
-        }
-        else if (this.view === 'completed') {
-            defaultHeader = 'Completed';
-            this.entries = r.completed.result;
-            this.count = r.completed.total;
-        }
-        this.title = this.header !== undefined ? this.header : defaultHeader;
-        this.loading = false;
-    }
-    render() {
-        if (this.loading) {
-            return (h(Host, { style: { minHeight: '300px' } }, this.title && (h("div", { class: "box-title" }, this.title, " ", h("span", { class: "count" }, "(0)"))), integerSequence(0, this.items).map(() => (h("div", { class: "loading-placeholder" }, h("div", { class: "loading-placeholder-bg" }))))));
-        }
-        return (h(Host, null, this.title && (h("div", { class: "box-title" }, this.title, " ", h("span", { class: "count" }, "(", this.count, ")"), h("div", { class: "spacer" }), h("verdocs-button", { label: "View All", size: "small", onClick: () => { var _a; return (_a = this.viewAll) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, view: this.view }); } }))), this.count > 0 ? (this.entries.slice(0, Math.max(this.items, 1)).map(entry => (h("div", { class: "activity-entry", onClick: () => {
-                var _a;
-                (_a = this.viewEnvelope) === null || _a === void 0 ? void 0 : _a.emit({ endpoint: this.endpoint, entry });
-            } }, h("div", { class: "title" }, entry.name), h("div", { class: "time-ago" }, formatShortTimeAgo(entry.updated_at)))))) : (h("img", { src: EmptyImage, alt: "No documents to show", style: { width: '190px', margin: '0 auto' } }))));
-    }
-    static get watchers() { return {
-        "items": ["handleItemsUpdated"],
-        "view": ["handleViewUpdated"]
-    }; }
-    static get style() { return VerdocsActivityBoxStyle0; }
-}, [0, "verdocs-activity-box", {
-        "endpoint": [16],
-        "items": [2],
-        "view": [1],
-        "header": [1],
-        "title": [32],
-        "count": [32],
-        "loading": [32],
-        "entries": [32]
-    }, undefined, {
-        "items": ["handleItemsUpdated"],
-        "view": ["handleViewUpdated"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["verdocs-activity-box", "verdocs-button"];
-    components.forEach(tagName => { switch (tagName) {
-        case "verdocs-activity-box":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, VerdocsActivityBox$1);
-            }
-            break;
-        case "verdocs-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const VerdocsActivityBox = VerdocsActivityBox$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { VerdocsActivityBox, defineCustomElement };

package/dist/components/verdocs-field-radio-button.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface VerdocsFieldRadioButton extends Components.VerdocsFieldRadioButton, HTMLElement {}
-export const VerdocsFieldRadioButton: {
-    prototype: VerdocsFieldRadioButton;
-    new (): VerdocsFieldRadioButton;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/verdocs-field-radio-button.js

@@ -1,6 +0,0 @@
-import { V as VerdocsFieldRadioButton$1, d as defineCustomElement$1 } from './verdocs-field-radio-button2.js';
-
-const VerdocsFieldRadioButton = VerdocsFieldRadioButton$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { VerdocsFieldRadioButton, defineCustomElement };

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

@@ -1,151 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from '@stencil/core/internal/client';
-import { getRGBA } from '@verdocs/js-sdk';
-import { g as getTemplateRoleStore, a as getRoleIndex } from './TemplateRoleStore.js';
-import { g as getTemplateFieldStore } from './TemplateFieldStore.js';
-import { g as getFieldSettings } from './utils.js';
-import { S as SettingsIcon } from './Icons.js';
-import { d as defineCustomElement$8 } from './verdocs-button2.js';
-import { d as defineCustomElement$7 } from './verdocs-checkbox2.js';
-import { d as defineCustomElement$6 } from './verdocs-component-error2.js';
-import { d as defineCustomElement$5 } from './verdocs-help-icon2.js';
-import { d as defineCustomElement$4 } from './verdocs-portal2.js';
-import { d as defineCustomElement$3 } from './verdocs-select-input2.js';
-import { d as defineCustomElement$2 } from './verdocs-template-field-properties2.js';
-import { d as defineCustomElement$1 } from './verdocs-text-input2.js';
-
-const verdocsFieldRadioButtonCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-field-radio-button{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:12px;height:12px;display:block;font-size:11px;position:relative;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left;border-radius:100%}verdocs-field-radio-button svg{margin-top:4px}verdocs-field-radio-button.disabled{opacity:0.5}verdocs-field-radio-button.disabled.done{opacity:1}verdocs-field-radio-button input{cursor:inherit}verdocs-field-radio-button.done input[type=radio]{margin:0;padding:0;width:10px;height:10px}verdocs-field-radio-button:not(.done) input[type=radio]{position:absolute;opacity:0}verdocs-field-radio-button:not(.done) input[type=radio]+label:before{content:\"\";border-radius:100%;border:1px solid rgba(0, 0, 0, 0.6);display:inline-block;width:10px;height:10px;position:absolute;left:1px;top:1px;cursor:pointer;text-align:center;-webkit-transition:all 250ms ease;transition:all 250ms ease}verdocs-field-radio-button:not(.done) input[type=radio]:checked+label:before{background-color:#55bc81;-webkit-box-shadow:inset 0 0 0 2px #f5f5fa;box-shadow:inset 0 0 0 2px #f5f5fa}verdocs-field-radio-button:not(.done) input[type=radio]:focus+label:before{outline:none;border-color:#55bc81}verdocs-field-radio-button:not(.done) input[type=radio]:disabled+label:before{-webkit-box-shadow:inset 0 0 0 4px #f5f5fa;box-shadow:inset 0 0 0 4px #f5f5fa;border-color:#a0a0d0;background:#a0a0d0}verdocs-field-radio-button:not(.done) input[type=radio]+label:empty:before{margin-right:0}verdocs-field-radio-button.required{border:1px solid #cc0000}verdocs-field-radio-button.hide{display:none}verdocs-field-radio-button.focused{-webkit-animation:verdocs-field-pulse 0.4s 1;animation:verdocs-field-pulse 0.4s 1}verdocs-field-radio-button verdocs-button-panel{margin-left:-20px;margin-top:-7px;-webkit-transform:scale(0.7);transform:scale(0.7)}verdocs-field-radio-button .settings-icon{position:absolute;top:-6px;left:-20px;display:inline-block;cursor:pointer;opacity:0.3}verdocs-field-radio-button .settings-icon svg{fill:#707ae5}verdocs-field-radio-button .settings-icon:hover{opacity:1}";
-const VerdocsFieldRadioButtonStyle0 = verdocsFieldRadioButtonCss;
-
-const RadioIconUnselected = `<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"></path></svg>`;
-const RadioIconSelected = `<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24"><path d="M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"></path></svg>`;
-const VerdocsFieldRadioButton = /*@__PURE__*/ proxyCustomElement(class VerdocsFieldRadioButton extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.settingsChanged = createEvent(this, "settingsChanged", 7);
-        this.deleted = createEvent(this, "deleted", 7);
-        this.fieldStore = null;
-        this.roleStore = null;
-        this.templateid = '';
-        this.fieldname = '';
-        this.option = 0;
-        this.disabled = false;
-        this.done = false;
-        this.editable = false;
-        this.moveable = false;
-        this.xscale = 1;
-        this.yscale = 1;
-        this.pagenumber = 1;
-        this.showingProperties = false;
-    }
-    async showSettingsPanel() {
-        const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`);
-        if (settingsPanel && settingsPanel.showPanel) {
-            settingsPanel.showPanel();
-        }
-    }
-    async hideSettingsPanel() {
-        const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`);
-        if (settingsPanel && settingsPanel.hidePanel) {
-            settingsPanel.hidePanel();
-        }
-    }
-    async componentWillLoad() {
-        this.fieldStore = getTemplateFieldStore(this.templateid);
-        this.roleStore = getTemplateRoleStore(this.templateid);
-    }
-    render() {
-        const { templateid, fieldname = '', option, editable = false, done = false, disabled = false, xscale = 1, yscale = 1 } = this;
-        const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
-        const { required = false, role_name = '' } = field || {};
-        const { options = [] } = getFieldSettings(field);
-        const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
-        const { id = 'option1', selected = false } = options[option] || {};
-        const fieldId = `${fieldname}-${id}`;
-        if (done) {
-            return (h(Host, { class: { done }, style: { maxWidth: '10px' } }, h("span", { innerHTML: selected ? RadioIconSelected : RadioIconUnselected })));
-        }
-        return (h(Host, { class: { required, disabled, done }, style: { backgroundColor } }, h("input", { id: fieldId, type: "radio", name: fieldname, value: id, checked: !!selected, disabled: disabled, required: required }), h("label", { htmlFor: fieldId }), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
-                e.stopPropagation();
-                this.showingProperties = !this.showingProperties;
-            } }), this.showingProperties && (h("verdocs-portal", { anchor: `verdocs-settings-panel-trigger-${fieldname}`, onClickAway: () => (this.showingProperties = false) }, h("verdocs-template-field-properties", { templateId: templateid, fieldName: fieldname, onClose: () => (this.showingProperties = false), onDelete: () => {
-                var _a;
-                (_a = this.deleted) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: fieldname });
-                return this.hideSettingsPanel();
-            }, onSettingsChanged: e => {
-                var _a;
-                (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit(e.detail);
-                return this.hideSettingsPanel();
-            }, helpText: "Radio buttons capture the recipient's selection of just one of several related (exclusive) options." })))))));
-    }
-    static get style() { return VerdocsFieldRadioButtonStyle0; }
-}, [0, "verdocs-field-radio-button", {
-        "templateid": [513],
-        "fieldname": [513],
-        "option": [514],
-        "disabled": [516],
-        "done": [516],
-        "editable": [516],
-        "moveable": [516],
-        "xscale": [514],
-        "yscale": [514],
-        "pagenumber": [514],
-        "showingProperties": [32],
-        "showSettingsPanel": [64],
-        "hideSettingsPanel": [64]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["verdocs-field-radio-button", "verdocs-button", "verdocs-checkbox", "verdocs-component-error", "verdocs-help-icon", "verdocs-portal", "verdocs-select-input", "verdocs-template-field-properties", "verdocs-text-input"];
-    components.forEach(tagName => { switch (tagName) {
-        case "verdocs-field-radio-button":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, VerdocsFieldRadioButton);
-            }
-            break;
-        case "verdocs-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$8();
-            }
-            break;
-        case "verdocs-checkbox":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "verdocs-component-error":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "verdocs-help-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "verdocs-portal":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "verdocs-select-input":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "verdocs-template-field-properties":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-        case "verdocs-text-input":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { VerdocsFieldRadioButton as V, defineCustomElement as d };