npm - @verdocs/web-sdk - Versions diffs - 4.2.157 → 5.0.0 - Mend

@verdocs/web-sdk 4.2.157 → 5.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (514) hide show

package/dist/collection/components/fields/verdocs-field-payment/verdocs-field-payment.js CHANGED Viewed

@@ -1,18 +1,25 @@
 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 { SettingsIcon } from "../../../utils/Icons";
+import { Store } from "../../../utils/Datastore";
 /**
  * Displays a signature field. Various field types are supported, including traditional Signature and Initials types as well as
  * input types like text and checkbox.
  */
 export class VerdocsFieldPayment {
     constructor() {
-        this.fieldStore = null;
-        this.roleStore = null;
-        this.templateid = '';
+        this.source = 'template';
+        this.sourceid = '';
         this.fieldname = '';
         this.disabled = false;
+        this.done = false;
+        this.editable = false;
+        this.moveable = false;
+        this.xscale = 1;
+        this.yscale = 1;
+        this.pagenumber = 1;
+        this.showingProperties = false;
+        this.focused = false;
         this.fields = undefined;
         this.pageNum = undefined;
         this.roleName = undefined;
@@ -24,19 +31,12 @@ export class VerdocsFieldPayment {
         this.currentSignatureId = undefined;
         this.currentInitial = undefined;
         this.currentInitialId = undefined;
-        this.focused = false;
         this.signed = false;
-        this.xscale = 1;
-        this.yscale = 1;
-        this.pagenumber = 1;
         this.preparedMessage = undefined;
         this.signatureUrl = '';
         this.roleindex = 0;
-        this.showingProperties = false;
     }
     componentWillLoad() {
-        this.fieldStore = getTemplateFieldStore(this.templateid);
-        this.roleStore = getTemplateRoleStore(this.templateid);
         // Load validators
         // Load fields
         // Get role names
@@ -48,6 +48,13 @@ export class VerdocsFieldPayment {
             }
         }
     }
+    async focusField() {
+        // We don't have a visible input that we can actually focus on, so we fake it
+        this.focused = true;
+        setTimeout(() => {
+            this.focused = false;
+        }, 500);
+    }
     async showSettingsPanel() {
         const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`);
         if (settingsPanel && settingsPanel.showPanel) {
@@ -61,18 +68,27 @@ export class VerdocsFieldPayment {
         }
     }
     render() {
-        var _a;
-        const field = this.fieldStore.get('fields').find(field => field.name === this.fieldname);
-        const roleIndex = getRoleIndex(this.roleStore, field.role_name);
-        const backgroundColor = field['rgba'] || getRGBA(roleIndex);
+        const { source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1 } = this;
+        const { index, field } = Store.getField(source, sourceid, fieldname);
+        const backgroundColor = getRGBA(index);
         if (!field) {
             return h(Fragment, null);
         }
-        // TODO:
-        // const settings = getFieldSettings(field);
-        // const disabled = this.disabled ?? settings.disabled ?? false;
-        const disabled = (_a = this.disabled) !== null && _a !== void 0 ? _a : false;
-        return (h(Host, { class: { focused: this.focused, disabled }, style: { backgroundColor } }, h("button", { class: { hide: this.signed } }, "$"), this.signed ? h("div", { class: "frame" }) : h("div", { style: { display: 'none' } }), h("img", { width: "100%", height: "100%", src: this.signatureUrl, alt: "Payment Icon" })));
+        if (done) {
+            return h(Host, { class: { done } }, "$\u2713");
+        }
+        return (h(Host, { class: { focused, disabled }, style: { backgroundColor } }, h("button", { class: { hide: this.signed } }, "$"), this.signed ? h("div", { class: "frame" }) : h("div", { style: { display: 'none' } }), h("img", { width: "100%", height: "100%", src: this.signatureUrl, alt: "Payment Icon" }), 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-${field.name}`, onClickAway: () => (this.showingProperties = false) }, h("verdocs-template-field-properties", { templateId: sourceid, fieldName: field.name, 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: 'Check boxes allow the user to select one or more (non-exclusive) options.' })))))));
     }
     static get is() { return "verdocs-field-payment"; }
     static get originalStyleUrls() {
@@ -87,7 +103,25 @@ export class VerdocsFieldPayment {
     }
     static get properties() {
         return {
-            "templateid": {
+            "source": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'template' | 'envelope'",
+                    "resolved": "\"envelope\" | \"template\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Fields may be attached to templates or envelopes, but only template fields may be edited."
+                },
+                "attribute": "source",
+                "reflect": true,
+                "defaultValue": "'template'"
+            },
+            "sourceid": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -99,10 +133,10 @@ export class VerdocsFieldPayment {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "The template the field is for/from. Only required in Builder mode, to support the Field Properties dialog."
+                    "text": "The source template or envelope ID the field is found in."
                 },
-                "attribute": "templateid",
-                "reflect": false,
+                "attribute": "sourceid",
+                "reflect": true,
                 "defaultValue": "''"
             },
             "fieldname": {
@@ -120,7 +154,7 @@ export class VerdocsFieldPayment {
                     "text": "The name of the field to display."
                 },
                 "attribute": "fieldname",
-                "reflect": false,
+                "reflect": true,
                 "defaultValue": "''"
             },
             "disabled": {
@@ -138,9 +172,117 @@ export class VerdocsFieldPayment {
                     "text": "If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled."
                 },
                 "attribute": "disabled",
-                "reflect": false,
+                "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"
+            },
             "fields": {
                 "type": "unknown",
                 "mutable": false,
@@ -324,24 +466,6 @@ export class VerdocsFieldPayment {
                 "attribute": "current-initial-id",
                 "reflect": false
             },
-            "focused": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "attribute": "focused",
-                "reflect": false,
-                "defaultValue": "false"
-            },
             "signed": {
                 "type": "boolean",
                 "mutable": false,
@@ -360,60 +484,6 @@ export class VerdocsFieldPayment {
                 "reflect": false,
                 "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": false,
-                "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": false,
-                "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": false,
-                "defaultValue": "1"
-            },
             "roleindex": {
                 "type": "number",
                 "mutable": false,
@@ -436,43 +506,14 @@ export class VerdocsFieldPayment {
     }
     static get states() {
         return {
+            "showingProperties": {},
+            "focused": {},
             "preparedMessage": {},
-            "signatureUrl": {},
-            "showingProperties": {}
+            "signatureUrl": {}
         };
     }
     static get events() {
         return [{
-                "method": "signatureComplete",
-                "name": "signatureComplete",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                }
-            }, {
-                "method": "initialComplete",
-                "name": "initialComplete",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                }
-            }, {
                 "method": "settingsChanged",
                 "name": "settingsChanged",
                 "bubbles": true,
@@ -480,17 +521,12 @@ export class VerdocsFieldPayment {
                 "composed": true,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "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; }",
+                    "original": "{fieldName: string; field: ITemplateField}",
+                    "resolved": "{ fieldName: string; field: ITemplateField; }",
                     "references": {
-                        "ITemplateFieldSetting": {
-                            "location": "import",
-                            "path": "@verdocs/js-sdk",
-                            "id": "node_modules::ITemplateFieldSetting"
-                        },
                         "ITemplateField": {
                             "location": "import",
                             "path": "@verdocs/js-sdk",
@@ -517,6 +553,23 @@ export class VerdocsFieldPayment {
     }
     static get methods() {
         return {
+            "focusField": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            },
             "showSettingsPanel": {
                 "complexType": {
                     "signature": "() => Promise<void>",

package/dist/collection/components/fields/verdocs-field-radio/verdocs-field-radio.js CHANGED Viewed

@@ -1,8 +1,7 @@
 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 { SettingsIcon } from "../../../utils/Icons";
+import { Store } from "../../../utils/Datastore";
 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>`;
 /**
@@ -10,9 +9,8 @@ const RadioIconSelected = `<svg focusable="false" aria-hidden="true" viewBox="0
  */
 export class VerdocsFieldRadio {
     constructor() {
-        this.fieldStore = null;
-        this.roleStore = null;
-        this.templateid = '';
+        this.source = 'template';
+        this.sourceid = '';
         this.fieldname = '';
         this.disabled = false;
         this.required = false;
@@ -44,25 +42,19 @@ export class VerdocsFieldRadio {
             settingsPanel.hidePanel();
         }
     }
-    async componentWillLoad() {
-        this.fieldStore = getTemplateFieldStore(this.templateid);
-        this.roleStore = getTemplateRoleStore(this.templateid);
-    }
     render() {
-        const { templateid, fieldname = '', editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1 } = this;
-        const field = this.fieldStore.get('fields').find(field => field.name === fieldname);
-        const { name, required = false, role_name = '', label = '', group = '', value = false } = field || {};
-        const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
-        const fieldId = `${fieldname}`;
-        // const fieldId = `${fieldname}-${id}`;
+        const { source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1 } = this;
+        const { index, field } = Store.getField(source, sourceid, fieldname);
+        const { name, required = false, label = '', group = '', value = false } = field || {};
+        const backgroundColor = getRGBA(index);
         const selected = value === 'true';
         if (done) {
             return (h(Host, { class: { done }, style: { maxWidth: '10px' } }, h("span", { innerHTML: selected ? RadioIconSelected : RadioIconUnselected })));
         }
-        return (h(Host, { class: { required: this.required || required, disabled, done, focused }, style: { backgroundColor } }, label && h("div", { class: "label" }, label), editable && group && h("div", { class: "group" }, group), h("input", { id: fieldId, type: "radio", name: group || fieldname, value: name, 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) => {
+        return (h(Host, { class: { required: this.required || required, disabled, done, focused }, style: { backgroundColor } }, label && h("div", { class: "label" }, label), editable && group && h("div", { class: "group" }, group), h("input", { id: fieldname, type: "radio", name: group || fieldname, value: name, checked: !!selected, disabled: disabled, required: required }), h("label", { htmlFor: fieldname }), 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: () => {
+            } }), this.showingProperties && (h("verdocs-portal", { anchor: `verdocs-settings-panel-trigger-${fieldname}`, onClickAway: () => (this.showingProperties = false) }, h("verdocs-template-field-properties", { templateId: sourceid, 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();
@@ -85,7 +77,25 @@ export class VerdocsFieldRadio {
     }
     static get properties() {
         return {
-            "templateid": {
+            "source": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'template' | 'envelope'",
+                    "resolved": "\"envelope\" | \"template\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Fields may be attached to templates or envelopes, but only template fields may be edited."
+                },
+                "attribute": "source",
+                "reflect": true,
+                "defaultValue": "'template'"
+            },
+            "sourceid": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -97,9 +107,9 @@ export class VerdocsFieldRadio {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "The template the field is for/from. Only required in Builder mode, to support the Field Properties dialog."
+                    "text": "The source template or envelope ID the field is found in."
                 },
-                "attribute": "templateid",
+                "attribute": "sourceid",
                 "reflect": true,
                 "defaultValue": "''"
             },

package/dist/collection/components/fields/verdocs-field-signature/verdocs-field-signature.js CHANGED Viewed

@@ -1,8 +1,7 @@
 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 { SettingsIcon } from "../../../utils/Icons";
+import { Store } from "../../../utils/Datastore";
 /**
  * Displays a signature field. If a signature already exists, it will be displayed and the field
  * will be disabled. Otherwise, a placeholder button will be shown. Clicking the button will
@@ -14,9 +13,8 @@ import { SettingsIcon } from "../../../utils/Icons";
  */
 export class VerdocsFieldSignature {
     constructor() {
-        this.fieldStore = null;
-        this.roleStore = null;
-        this.templateid = '';
+        this.source = 'template';
+        this.sourceid = '';
         this.fieldname = '';
         this.name = '';
         this.disabled = false;
@@ -68,23 +66,19 @@ export class VerdocsFieldSignature {
         }
         this.showingProperties = false;
     }
-    async componentWillLoad() {
-        this.fieldStore = getTemplateFieldStore(this.templateid);
-        this.roleStore = getTemplateRoleStore(this.templateid);
-    }
     render() {
-        const { templateid, fieldname = '', editable = false, focused, 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 = '', value = '', label = '' } = field || {};
-        const { base64 } = field.settings || {};
-        const backgroundColor = getRGBA(getRoleIndex(this.roleStore, role_name));
+        const { source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1 } = this;
+        const { index, field } = Store.getField(source, sourceid, fieldname);
+        const { required = false, value = '', label = '', settings = {} } = field || {};
+        const { base64 } = settings;
+        const backgroundColor = getRGBA(index);
         if (done) {
             return h(Host, { class: { done } }, value && h("img", { src: base64, alt: "" }));
         }
         return (h(Host, { class: { required, disabled, done, focused }, style: { backgroundColor } }, label && h("label", null, label), base64 ? h("img", { src: base64, alt: "" }) : h("button", { onClick: () => !disabled && this.handleShow() }, "Signature"), 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.hideSettingsPanel(), onDelete: () => {
+            } }), this.showingProperties && (h("verdocs-portal", { anchor: `verdocs-settings-panel-trigger-${fieldname}`, onClickAway: () => (this.showingProperties = false) }, h("verdocs-template-field-properties", { templateId: sourceid, fieldName: fieldname, onClose: () => this.hideSettingsPanel(), onDelete: () => {
                 var _a;
                 (_a = this.deleted) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: fieldname });
                 return this.hideSettingsPanel();
@@ -107,7 +101,25 @@ export class VerdocsFieldSignature {
     }
     static get properties() {
         return {
-            "templateid": {
+            "source": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'template' | 'envelope'",
+                    "resolved": "\"envelope\" | \"template\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Fields may be attached to templates or envelopes, but only template fields may be edited."
+                },
+                "attribute": "source",
+                "reflect": true,
+                "defaultValue": "'template'"
+            },
+            "sourceid": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -119,9 +131,9 @@ export class VerdocsFieldSignature {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "The template the field is for/from. Only required in Builder mode, to support the Field Properties dialog."
+                    "text": "The source template or envelope ID the field is found in."
                 },
-                "attribute": "templateid",
+                "attribute": "sourceid",
                 "reflect": true,
                 "defaultValue": "''"
             },