npm - legalesign-document-viewer - Versions diffs - 0.4.9 → 0.5.0 - Mend

legalesign-document-viewer 0.4.9 → 0.5.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 (432) hide show

package/dist/collection/components/ls-editor-field/ls-editor-field.js CHANGED Viewed

@@ -34,6 +34,7 @@ export class LsEditorField {
             this.isEditing = false;
             this.sizeObserver.observe(this.component.shadowRoot.getElementById('field-info'));
         }
+        e.stopPropagation();
     }
     handleMouseMove(e) {
         if (this.readonly)
@@ -57,8 +58,8 @@ export class LsEditorField {
             this.component.style.cursor = 'move';
         }
     }
-    handleDoubleClick() {
-        if (this.readonly)
+    handleDoubleClick(e) {
+        if (this.readonly || this.dataItem.formElementType === 'signature' || this.dataItem.formElementType === 'initials')
             return;
         this.isEditing = true;
         this.heldEdge = null;
@@ -71,6 +72,8 @@ export class LsEditorField {
             editbox.className = 'ls-editor-field-editable';
             editbox.focus();
         }
+        e.preventDefault();
+        e.stopPropagation();
     }
     handleDragStart(event) {
         // Add the target element's id to the data transfer object
@@ -128,7 +131,6 @@ export class LsEditorField {
         this.labeltimer = setTimeout(() => {
             const diffs = [{ action: 'update', data }];
             this.mutate.emit(diffs);
-            this.update.emit(diffs);
         }, delay);
     }
     hexToRgba(hex, alpha) {
@@ -143,11 +145,10 @@ export class LsEditorField {
             ? { border: `2px ${defaultRolePalette[this.dataItem?.signer % 100].s60} solid`, boxShadow: '0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06)' }
             : { border: `2px ${defaultRolePalette[this.dataItem?.signer % 100].s60} solid` };
         const zoomValue = parseFloat(this.zoom) || 1;
-        console.log('Zoom value in field:', zoomValue);
-        return (h(Host, { key: 'a4f5875c197571704825a994065e5c11f5138a1e', id: this.dataItem ? 'ls-field-' + this.dataItem.id : undefined, style: hostStyle, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("div", { key: '8385e522e50335d6c5ab517bbf782f964683ca6b', class: {
+        return (h(Host, { key: '89a2f93e5353a2660bb262af4830b6911bd7ee64', id: this.dataItem ? 'ls-field-' + this.dataItem.id : undefined, style: hostStyle, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("div", { key: '95decbf8fee094a5ac8e7f3e7314374b659b6579', class: {
                 'ls-editor-field': true,
                 'is-selected': this.selected,
-            } }, !this.dataItem?.optional && h("ls-icon", { key: '902e5a17e75945c13b06eab2c003488f2e9a90fe', name: "required", size: `${0.75 * zoomValue}rem`, class: "required-icon", customStyle: { position: 'absolute', verticalAlign: 'top', top: `${0.125 * zoomValue}rem`, right: `${0.125 * zoomValue}rem` } }), h("input", { key: 'f4ee949c3c00671241433f80244a502cabf404bf', id: "editing-input", class: this.isEditing ? 'ls-editor-field-editable' : 'hidden-field', type: getInputType(this.dataItem.validation).inputType, value: this.dataItem?.value, checked: this.dataItem?.value ? true : false, onInput: e => this.alter({ value: e.target.value }) }), h("div", { key: '680784b3c815ae5a3a53d291466dd58d3d9045cf', id: "field-info", class: this.isEditing ? 'hidden-field' : 'ls-editor-field-draggable', style: { color: `${defaultRolePalette[this.dataItem?.signer % 100].s100}` } }, (this.dataItem.value.length && this.dataItem.value) || this.dataItem?.formElementType), (this.floatingActive || this.selected) && this.dataItem?.label && (h("div", { key: '1a597889f65850e1b0437f1cc259e3aa965888c0', style: {
+            } }, !this.dataItem?.optional && h("ls-icon", { key: '14b5c38881517f955428bf35d31f4282aae1e286', name: "required", size: `${0.75 * zoomValue}rem`, class: "required-icon", customStyle: { position: 'absolute', verticalAlign: 'top', top: `${0.125 * zoomValue}rem`, right: `${0.125 * zoomValue}rem` } }), h("input", { key: '404b2803acd1c74cfd8a8853623dad2c3ca74b20', id: "editing-input", class: this.isEditing ? 'ls-editor-field-editable' : 'hidden-field', type: getInputType(this.dataItem.validation).inputType, value: this.dataItem?.value, checked: this.dataItem?.value ? true : false, onInput: e => this.alter({ value: e.target.value }) }), h("div", { key: 'bb8c8de6ac5c3bce79b6bbf7df9a86da5084c572', id: "field-info", class: this.isEditing ? 'hidden-field' : 'ls-editor-field-draggable', style: { color: `${defaultRolePalette[this.dataItem?.signer % 100].s100}` } }, (this.dataItem.value.length && this.dataItem.value) || this.dataItem?.formElementType), (this.floatingActive || this.selected) && this.dataItem?.label && (h("div", { key: '21ebed73fd616a3655d55c10e3625592bdc6de64', style: {
                 position: 'absolute',
                 background: `${defaultRolePalette[this.dataItem?.signer % 100].s20}`,
                 color: `${defaultRolePalette[this.dataItem?.signer % 100].s80}`,
@@ -158,7 +159,7 @@ export class LsEditorField {
                 left: `-${2 * zoomValue}px`,
                 whiteSpace: 'nowrap',
                 width: 'fit-content',
-            } }, this.dataItem?.label)), (this.floatingActive || this.selected) && (h("p", { key: '3ffbb7becbcb267715b0f1e9ac3dbf10c1be53ef', style: {
+            } }, this.dataItem?.label)), (this.floatingActive || this.selected) && (h("p", { key: 'e14e6cce83af912df7de7464dca48f8a55c2867f', style: {
                 position: 'absolute',
                 color: 'var(--gray-80, #3a3a3a)',
                 bottom: `-${1.75 * zoomValue}rem`,
@@ -166,9 +167,9 @@ export class LsEditorField {
                 left: '0',
                 whiteSpace: 'nowrap',
                 width: 'fit-content',
-            } }, "Assigned to: ", this.assignee)), this.floatingActive && (h("button", { key: '9e9d0eb0e0f6addcab70db80f94e49fb0cc768e2', class: 'x-button', style: {
+            } }, "Assigned to: ", this.assignee)), this.floatingActive && (h("button", { key: '5e4ed8ed5bd08c555f203708544d24ac6a847f2d', class: 'x-button', style: {
                 padding: `${0.125 * zoomValue}rem`,
-            }, onClick: () => this.deleteField() }, h("ls-icon", { key: '0df2ef57c7cdf417e98810d673d3e8f42df43d3c', name: "x", size: `${0.625 * zoomValue}rem` }))))));
+            }, onClick: () => this.deleteField() }, h("ls-icon", { key: 'c63cbfd8a4c71b8dfc6693a5bdd339e37414774a', name: "x", size: `${0.625 * zoomValue}rem` }))))));
     }
     static get is() { return "ls-editor-field"; }
     static get encapsulation() { return "shadow"; }
@@ -186,7 +187,6 @@ export class LsEditorField {
         return {
             "assignee": {
                 "type": "string",
-                "attribute": "assignee",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -201,11 +201,11 @@ export class LsEditorField {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "assignee"
             },
             "dataItem": {
                 "type": "unknown",
-                "attribute": "data-item",
                 "mutable": true,
                 "complexType": {
                     "original": "LSApiElement",
@@ -229,7 +229,6 @@ export class LsEditorField {
             },
             "selected": {
                 "type": "boolean",
-                "attribute": "selected",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -245,11 +244,11 @@ export class LsEditorField {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "selected",
                 "defaultValue": "false"
             },
             "readonly": {
                 "type": "boolean",
-                "attribute": "readonly",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -264,11 +263,11 @@ export class LsEditorField {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "readonly"
             },
             "type": {
                 "type": "string",
-                "attribute": "type",
                 "mutable": false,
                 "complexType": {
                     "original": "'text' | 'signature' | 'date' | 'regex' | 'file' | 'number' | 'autodate'",
@@ -283,11 +282,11 @@ export class LsEditorField {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "type"
             },
             "page": {
                 "type": "unknown",
-                "attribute": "page",
                 "mutable": false,
                 "complexType": {
                     "original": "{ height: number; width: number }",
@@ -305,7 +304,6 @@ export class LsEditorField {
             },
             "fixedAspect": {
                 "type": "number",
-                "attribute": "fixed-aspect",
                 "mutable": false,
                 "complexType": {
                     "original": "number | null",
@@ -321,11 +319,11 @@ export class LsEditorField {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "fixed-aspect",
                 "defaultValue": "null"
             },
             "zoom": {
                 "type": "string",
-                "attribute": "zoom",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -340,11 +338,11 @@ export class LsEditorField {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "zoom"
             },
             "floatingActive": {
                 "type": "boolean",
-                "attribute": "floating-active",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -360,6 +358,7 @@ export class LsEditorField {
                 "getter": false,
                 "setter": false,
                 "reflect": true,
+                "attribute": "floating-active",
                 "defaultValue": "false"
             }
         };

package/dist/collection/components/ls-editor-field/ls-editor-field.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ls-editor-field.js","sourceRoot":"","sources":["../../../src/components/ls-editor-field/ls-editor-field.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAG7G,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AACjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAO1E,MAAM,OAAO,aAAa;IACb,SAAS,CAAc;IAC1B,QAAQ,CAAS;IACA,QAAQ,CAAe;IACxC,QAAQ,GAAY,KAAK,CAAC;IAC1B,QAAQ,CAAU;IAClB,IAAI,CAA2E;IAC/E,IAAI,CAAoC;IACxC,WAAW,GAAkB,IAAI,CAAC;IACjC,SAAS,GAAY,KAAK,CAAC;IAC3B,QAAQ,GAAW,IAAI,CAAC;IACxB,cAAc,GAAY,KAAK,CAAC;IAChC,UAAU,CAAS;IACpB,IAAI,CAAS;IAEb,YAAY,CAAiB;IAOrC,MAAM,CAAgC;IAOtC,MAAM,CAAgC;IAEtC;;OAEG;IACqC,cAAc,GAAY,KAAK,CAAC;IAExE,+DAA+D;IACvD,gBAAgB,GAAG,GAAG,EAAE;QAC9B,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;IAC7B,CAAC,CAAC;IAEM,gBAAgB,GAAG,GAAG,EAAE;QAC9B,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;IAC9B,CAAC,CAAC;IAGF,WAAW,CAAC,CAAgB;QAC1B,IAAI,CAAC,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;YACvB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;YACvB,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC,CAAC;QACpF,CAAC;IACH,CAAC;IAGD,eAAe,CAAC,CAAC;QACf,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAI,CAAC,CAAC,CAAC,OAAO;YAAE,OAAO;QAEvB,oEAAoE;QACpE,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC;YAC5B,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,WAAW,CAAC;QAC5C,CAAC;aAAM,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,CAAC;YAChE,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,WAAW,CAAC;QAC5C,CAAC;aAAM,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC;YACnC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,WAAW,CAAC;QAC5C,CAAC;aAAM,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC;YACjE,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,WAAW,CAAC;QAC5C,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;QACvC,CAAC;IACH,CAAC;IAGD,iBAAiB;QACf,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;QACtB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;QACrB,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAC5B,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,CAAC;QAC/B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC;QAE3E,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,eAAe,CAAqB,CAAC;QAC9F,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAE3B,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,SAAS,GAAG,0BAA0B,CAAC;YAC/C,OAAO,CAAC,KAAK,EAAE,CAAC;QAClB,CAAC;IACH,CAAC;IAGD,eAAe,CAAC,KAAK;QACnB,0DAA0D;QAC1D,KAAK,CAAC,YAAY,CAAC,OAAO,CACxB,kBAAkB,EAClB,IAAI,CAAC,SAAS,CAAC;YACb,IAAI,EAAE,IAAI,CAAC,IAAI;SAChB,CAAC,CACH,CAAC;QACF,KAAK,CAAC,YAAY,CAAC,UAAU,GAAG,MAAM,CAAC;IACzC,CAAC;IAGD,oBAAoB,CAAC,SAAkB,EAAE,SAAkB;QACzD,IAAI,SAAS,EAAE,CAAC;YACd,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;YAC3G,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,wEAAwE,CAAC;QAC5G,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,UAAU,GAAG,uBAAuB,CAAC;YAC1D,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;QAC1C,CAAC;IACH,CAAC;IAED,WAAW,GAAG,GAAG,EAAE;QACjB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC;QAC9D,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC;IAChE,CAAC,CAAC;IAEF,gBAAgB;QACd,IAAI,CAAC,YAAY,GAAG,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;YAC/C,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE,CAAC;gBAC5B,IAAI,KAAK,CAAC,WAAW,EAAE,CAAC;oBACtB,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,YAAY,CAAgB,CAAC;oBAEtF,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,WAAW,CAAC,MAAM,GAAG,IAAI,CAAC;oBACvD,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,GAAG,IAAI,CAAC;gBACvD,CAAC;YACH,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAE1C,uDAAuD;QACvD,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;YAC3G,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,wEAAwE,CAAC;QAC5G,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;YAChE,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;QAC1C,CAAC;IACH,CAAC;IAED,0CAA0C;IAC1C,6CAA6C;IAC7C,qDAAqD;IACrD,KAAK,CAAC,IAAY;QAChB,IAAI,CAAC,QAAQ,GAAG,EAAE,GAAG,IAAI,CAAC,QAAQ,EAAE,GAAG,IAAI,EAAE,CAAC;QAC9C,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;IACpC,CAAC;IAEO,UAAU,CAAC;IAEnB,QAAQ,CAAC,IAAI,EAAE,KAAK;QAClB,IAAI,IAAI,CAAC,UAAU;YAAE,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAEnD,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC,GAAG,EAAE;YAChC,MAAM,KAAK,GAAoB,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;YAC5D,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YACxB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1B,CAAC,EAAE,KAAK,CAAC,CAAC;IACZ,CAAC;IAED,SAAS,CAAC,GAAW,EAAE,KAAa;QAClC,GAAG,GAAG,GAAG,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;QAC3B,MAAM,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;QAC5C,MAAM,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;QAC5C,MAAM,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;QAC5C,OAAO,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,KAAK,GAAG,CAAC;IACzC,CAAC;IAED,MAAM;QACJ,MAAM,SAAS,GAAG,IAAI,CAAC,cAAc;YACnC,CAAC,CAAC,EAAE,MAAM,EAAE,OAAO,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,QAAQ,EAAE,SAAS,EAAE,wEAAwE,EAAE;YACrK,CAAC,CAAC,EAAE,MAAM,EAAE,OAAO,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,QAAQ,EAAE,CAAC;QAEnF,MAAM,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC7C,OAAO,CAAC,GAAG,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC;QAE/C,OAAO,CACL,EAAC,IAAI,qDAAC,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,CAAC,gBAAgB,EAAE,YAAY,EAAE,IAAI,CAAC,gBAAgB;YAC9J,4DACE,KAAK,EAAE;oBACL,iBAAiB,EAAE,IAAI;oBACvB,aAAa,EAAE,IAAI,CAAC,QAAQ;iBAC7B;gBAEA,CAAC,IAAI,CAAC,QAAQ,EAAE,QAAQ,IAAI,gEAAS,IAAI,EAAC,UAAU,EAAC,IAAI,EAAE,GAAG,IAAI,GAAG,SAAS,KAAK,EAAE,KAAK,EAAC,eAAe,EAAC,WAAW,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,aAAa,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,KAAK,GAAG,SAAS,KAAK,EAAE,KAAK,EAAE,GAAG,KAAK,GAAG,SAAS,KAAK,EAAE,GAAI;gBAC7O,8DACE,EAAE,EAAC,eAAe,EAClB,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,cAAc,EACnE,IAAI,EAAE,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC,SAAS,EACtD,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAC3B,OAAO,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,EAC5C,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,KAAK,EAAG,CAAC,CAAC,MAA2B,CAAC,KAAK,EAAE,CAAC,GACzE;gBAEF,4DAAK,EAAE,EAAC,YAAY,EAAC,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,2BAA2B,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,IACnK,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,IAAI,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE,eAAe,CAClF;gBACL,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE,KAAK,IAAI,CACjE,4DACE,KAAK,EAAE;wBACL,QAAQ,EAAE,UAAU;wBACpB,UAAU,EAAE,GAAG,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE;wBACpE,KAAK,EAAE,GAAG,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE;wBAC/D,YAAY,EAAE,GAAG,IAAI,GAAG,SAAS,KAAK;wBACtC,OAAO,EAAE,GAAG,KAAK,GAAG,SAAS,OAAO,IAAI,GAAG,SAAS,KAAK;wBACzD,GAAG,EAAE,IAAI,KAAK,GAAG,SAAS,KAAK;wBAC/B,UAAU,EAAE,KAAK;wBACjB,IAAI,EAAE,IAAI,CAAC,GAAG,SAAS,IAAI;wBAC3B,UAAU,EAAE,QAAQ;wBACpB,KAAK,EAAE,aAAa;qBACrB,IAEA,IAAI,CAAC,QAAQ,EAAE,KAAK,CACjB,CACP;gBACA,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,CACzC,0DACE,KAAK,EAAE;wBACL,QAAQ,EAAE,UAAU;wBACpB,KAAK,EAAE,yBAAyB;wBAChC,MAAM,EAAE,IAAI,IAAI,GAAG,SAAS,KAAK;wBACjC,QAAQ,EAAE,GAAG,KAAK,GAAG,SAAS,KAAK;wBACnC,IAAI,EAAE,GAAG;wBACT,UAAU,EAAE,QAAQ;wBACpB,KAAK,EAAE,aAAa;qBACrB;;oBAEa,IAAI,CAAC,QAAQ,CACzB,CACL;gBACA,IAAI,CAAC,cAAc,IAAI,CACtB,+DACE,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE;wBACL,OAAO,EAAE,GAAG,KAAK,GAAG,SAAS,KAAK;qBACnC,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE;oBAEjC,gEAAS,IAAI,EAAC,GAAG,EAAC,IAAI,EAAE,GAAG,KAAK,GAAG,SAAS,KAAK,GAAI,CAC9C,CACV,CACG,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Element, State, Prop, Watch, Listen, Event, EventEmitter } from '@stencil/core';\nimport { LSApiElement } from '../../components';\nimport { LSMutateEvent } from '../../types/LSMutateEvent';\nimport { getInputType } from '../ls-document-viewer/editorUtils';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\n\n@Component({\n tag: 'ls-editor-field',\n styleUrl: 'ls-editor-field.css',\n shadow: true,\n})\nexport class LsEditorField {\n @Element() component: HTMLElement;\n @Prop() assignee: string;\n @Prop({ mutable: true }) dataItem: LSApiElement;\n @Prop() selected: boolean = false;\n @Prop() readonly: boolean;\n @Prop() type: 'text' \| 'signature' \| 'date' \| 'regex' \| 'file' \| 'number' \| 'autodate';\n @Prop() page: { height: number; width: number };\n @Prop() fixedAspect: number \| null = null;\n @State() isEditing: boolean = false;\n @State() heldEdge: string = null;\n @State() isEdgeDragging: boolean = false;\n @State() innerValue: string;\n @Prop() zoom: string;\n \n private sizeObserver: ResizeObserver;\n\n @Event({\n bubbles: true,\n cancelable: false,\n composed: true,\n })\n mutate: EventEmitter<LSMutateEvent[]>;\n\n @Event({\n bubbles: true,\n cancelable: false,\n composed: true,\n })\n update: EventEmitter<LSMutateEvent[]>;\n\n /*\n Controls whether floating elements are visible. Set by mouse enter/leave events.\n /\n @Prop({ mutable: true, reflect: true }) floatingActive: boolean = false;\n\n // Set floatingActive true on mouse enter, false on mouse leave\n private handleMouseEnter = () => {\n this.floatingActive = true;\n };\n\n private handleMouseLeave = () => {\n this.floatingActive = false;\n };\n\n @Listen('keydown')\n handleInput(e: KeyboardEvent) {\n if (e.code === 'Enter') {\n this.isEditing = false;\n this.sizeObserver.observe(this.component.shadowRoot.getElementById('field-info'));\n }\n }\n\n @Listen('mousemove', { capture: true })\n handleMouseMove(e) {\n if (this.readonly) return;\n if (!e.clientX) return;\n\n // Determine which edge is being moved over and what cursor to show.\n if (Math.abs(e.offsetX) < 5) {\n this.component.style.cursor = 'ew-resize';\n } else if (Math.abs(e.offsetX - this.component.clientWidth) < 5) {\n this.component.style.cursor = 'ew-resize';\n } else if (Math.abs(e.offsetY) < 5) {\n this.component.style.cursor = 'ns-resize';\n } else if (Math.abs(e.offsetY - this.component.clientHeight) < 5) {\n this.component.style.cursor = 'ns-resize';\n } else {\n this.component.style.cursor = 'move';\n }\n }\n\n @Listen('dblclick', { capture: true })\n handleDoubleClick() {\n if (this.readonly) return;\n this.isEditing = true;\n this.heldEdge = null;\n this.isEdgeDragging = false;\n this.sizeObserver.disconnect();\n this.innerValue = this.innerValue ? this.innerValue : this.dataItem?.value;\n\n const editbox = this.component.shadowRoot.getElementById('editing-input') as HTMLInputElement;\n console.log(this.dataItem);\n\n if (editbox) {\n editbox.className = 'ls-editor-field-editable';\n editbox.focus();\n }\n }\n\n @Listen('dragstart', { capture: false, passive: false })\n handleDragStart(event) {\n // Add the target element's id to the data transfer object\n event.dataTransfer.setData(\n 'application/json',\n JSON.stringify({\n type: this.type,\n }),\n );\n event.dataTransfer.dropEffect = 'move';\n }\n\n @Watch('selected')\n watchSelectedHandler(_newValue: boolean, _oldValue: boolean) {\n if (_newValue) {\n this.component.style.background = this.hexToRgba(defaultRolePalette[this.dataItem?.signer % 100].s20, 0.5);\n this.component.style.boxShadow = '0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06)';\n } else {\n this.component.style.background = 'rgba(255,255,255,0.5)';\n this.component.style.boxShadow = 'none';\n }\n }\n\n deleteField = () => {\n this.mutate.emit([{ action: 'delete', data: this.dataItem }]);\n this.update.emit([{ action: 'delete', data: this.dataItem }]);\n };\n\n componentDidLoad() {\n this.sizeObserver = new ResizeObserver(entries => {\n for (const entry of entries) {\n if (entry.contentRect) {\n const movebox = this.component.shadowRoot.getElementById('field-info') as HTMLElement;\n\n movebox.style.height = entry.contentRect.height + 'px';\n movebox.style.width = entry.contentRect.width + 'px';\n }\n }\n });\n\n this.sizeObserver.observe(this.component);\n\n // New dropped components automatically need selecting.\n if (this.selected) {\n this.component.style.background = this.hexToRgba(defaultRolePalette[this.dataItem?.signer % 100].s20, 0.5);\n this.component.style.boxShadow = '0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06)';\n } else {\n this.component.style.background = this.hexToRgba('ffffff', 0.7);\n this.component.style.boxShadow = 'none';\n }\n }\n\n // Send one or more mutations up the chain\n // The source of the chain fires the mutation\n // NOTE this alter is debounced to account for typing\n alter(diff: object) {\n this.dataItem = { ...this.dataItem, ...diff };\n this.debounce(this.dataItem, 900);\n }\n\n private labeltimer;\n\n debounce(data, delay) {\n if (this.labeltimer) clearTimeout(this.labeltimer);\n\n this.labeltimer = setTimeout(() => {\n const diffs: LSMutateEvent[] = [{ action: 'update', data }];\n this.mutate.emit(diffs);\n this.update.emit(diffs);\n }, delay);\n }\n\n hexToRgba(hex: string, alpha: number): string {\n hex = hex.replace('#', '');\n const r = parseInt(hex.substring(0, 2), 16);\n const g = parseInt(hex.substring(2, 4), 16);\n const b = parseInt(hex.substring(4, 6), 16);\n return `rgba(${r},${g},${b},${alpha})`;\n }\n\n render() {\n const hostStyle = this.floatingActive\n ? { border: `2px ${defaultRolePalette[this.dataItem?.signer % 100].s60} solid`, boxShadow: '0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06)' }\n : { border: `2px ${defaultRolePalette[this.dataItem?.signer % 100].s60} solid` };\n\n const zoomValue = parseFloat(this.zoom) \|\| 1;\n console.log('Zoom value in field:', zoomValue);\n\n return (\n <Host id={this.dataItem ? 'ls-field-' + this.dataItem.id : undefined} style={hostStyle} onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave}>\n <div\n class={{\n 'ls-editor-field': true,\n 'is-selected': this.selected,\n }}\n >\n {!this.dataItem?.optional && <ls-icon name=\"required\" size={`${0.75 zoomValue}rem`} class=\"required-icon\" customStyle={{ position: 'absolute', verticalAlign: 'top', top: `${0.125 * zoomValue}rem`, right: `${0.125 * zoomValue}rem` }} />}\n <input\n id=\"editing-input\"\n class={this.isEditing ? 'ls-editor-field-editable' : 'hidden-field'}\n type={getInputType(this.dataItem.validation).inputType}\n value={this.dataItem?.value}\n checked={this.dataItem?.value ? true : false}\n onInput={e => this.alter({ value: (e.target as HTMLInputElement).value })}\n />\n\n <div id=\"field-info\" class={this.isEditing ? 'hidden-field' : 'ls-editor-field-draggable'} style={{ color: `${defaultRolePalette[this.dataItem?.signer % 100].s100}` }}>\n {(this.dataItem.value.length && this.dataItem.value) \|\| this.dataItem?.formElementType}\n </div>\n {(this.floatingActive \|\| this.selected) && this.dataItem?.label && (\n <div\n style={{\n position: 'absolute',\n background: `${defaultRolePalette[this.dataItem?.signer % 100].s20}`,\n color: `${defaultRolePalette[this.dataItem?.signer % 100].s80}`,\n borderRadius: `${0.25 * zoomValue}rem`,\n padding: `${0.125 * zoomValue}rem ${0.25 * zoomValue}rem`,\n top: `-${1.375 * zoomValue}rem`,\n fontWeight: '500',\n left: `-${2 * zoomValue}px`,\n whiteSpace: 'nowrap',\n width: 'fit-content',\n }}\n >\n {this.dataItem?.label}\n </div>\n )}\n {(this.floatingActive \|\| this.selected) && (\n <p\n style={{\n position: 'absolute',\n color: 'var(--gray-80, #3a3a3a)',\n bottom: `-${1.75 * zoomValue}rem`,\n fontSize: `${0.625 * zoomValue}rem`,\n left: '0',\n whiteSpace: 'nowrap',\n width: 'fit-content',\n }}\n >\n Assigned to: {this.assignee}\n </p>\n )}\n {this.floatingActive && (\n <button\n class={'x-button'}\n style={{\n padding: `${0.125 * zoomValue}rem`,\n }}\n onClick={() => this.deleteField()}\n >\n <ls-icon name=\"x\" size={`${0.625 * zoomValue}rem`} />\n </button>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ls-editor-field.js","sourceRoot":"","sources":["../../../src/components/ls-editor-field/ls-editor-field.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAG7G,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AACjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAO1E,MAAM,OAAO,aAAa;IACb,SAAS,CAAc;IAC1B,QAAQ,CAAS;IACA,QAAQ,CAAe;IACxC,QAAQ,GAAY,KAAK,CAAC;IAC1B,QAAQ,CAAU;IAClB,IAAI,CAA2E;IAC/E,IAAI,CAAoC;IACxC,WAAW,GAAkB,IAAI,CAAC;IACjC,SAAS,GAAY,KAAK,CAAC;IAC3B,QAAQ,GAAW,IAAI,CAAC;IACxB,cAAc,GAAY,KAAK,CAAC;IAChC,UAAU,CAAS;IACpB,IAAI,CAAS;IAEb,YAAY,CAAiB;IAOrC,MAAM,CAAgC;IAOtC,MAAM,CAAgC;IAEtC;;OAEG;IACqC,cAAc,GAAY,KAAK,CAAC;IAExE,+DAA+D;IACvD,gBAAgB,GAAG,GAAG,EAAE;QAC9B,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;IAC7B,CAAC,CAAC;IAEM,gBAAgB,GAAG,GAAG,EAAE;QAC9B,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;IAC9B,CAAC,CAAC;IAGF,WAAW,CAAC,CAAgB;QAC1B,IAAI,CAAC,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;YACvB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;YACvB,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC,CAAC;QACpF,CAAC;QAED,CAAC,CAAC,eAAe,EAAE,CAAC;IACtB,CAAC;IAGD,eAAe,CAAC,CAAC;QACf,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAI,CAAC,CAAC,CAAC,OAAO;YAAE,OAAO;QAEvB,oEAAoE;QACpE,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC;YAC5B,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,WAAW,CAAC;QAC5C,CAAC;aAAM,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,CAAC;YAChE,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,WAAW,CAAC;QAC5C,CAAC;aAAM,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC;YACnC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,WAAW,CAAC;QAC5C,CAAC;aAAM,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC;YACjE,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,WAAW,CAAC;QAC5C,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;QACvC,CAAC;IACH,CAAC;IAGD,iBAAiB,CAAC,CAAa;QAC7B,IAAI,IAAI,CAAC,QAAQ,IAAK,IAAI,CAAC,QAAQ,CAAC,eAAe,KAAK,WAAW,IAAI,IAAI,CAAC,QAAQ,CAAC,eAAe,KAAK,UAAU;YAAE,OAAO;QAC5H,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;QACtB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;QACrB,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAC5B,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,CAAC;QAC/B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC;QAE3E,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,eAAe,CAAqB,CAAC;QAC9F,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAE3B,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,SAAS,GAAG,0BAA0B,CAAC;YAC/C,OAAO,CAAC,KAAK,EAAE,CAAC;QAClB,CAAC;QACD,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,CAAC,CAAC,eAAe,EAAE,CAAC;IACtB,CAAC;IAGD,eAAe,CAAC,KAAK;QACnB,0DAA0D;QAC1D,KAAK,CAAC,YAAY,CAAC,OAAO,CACxB,kBAAkB,EAClB,IAAI,CAAC,SAAS,CAAC;YACb,IAAI,EAAE,IAAI,CAAC,IAAI;SAChB,CAAC,CACH,CAAC;QACF,KAAK,CAAC,YAAY,CAAC,UAAU,GAAG,MAAM,CAAC;IACzC,CAAC;IAGD,oBAAoB,CAAC,SAAkB,EAAE,SAAkB;QACzD,IAAI,SAAS,EAAE,CAAC;YACd,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;YAC3G,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,wEAAwE,CAAC;QAC5G,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,UAAU,GAAG,uBAAuB,CAAC;YAC1D,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;QAC1C,CAAC;IACH,CAAC;IAED,WAAW,GAAG,GAAG,EAAE;QACjB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC;QAC9D,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC;IAChE,CAAC,CAAC;IAEF,gBAAgB;QACd,IAAI,CAAC,YAAY,GAAG,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;YAC/C,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE,CAAC;gBAC5B,IAAI,KAAK,CAAC,WAAW,EAAE,CAAC;oBACtB,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,YAAY,CAAgB,CAAC;oBAEtF,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,WAAW,CAAC,MAAM,GAAG,IAAI,CAAC;oBACvD,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,GAAG,IAAI,CAAC;gBACvD,CAAC;YACH,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAE1C,uDAAuD;QACvD,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;YAC3G,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,wEAAwE,CAAC;QAC5G,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;YAChE,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;QAC1C,CAAC;IACH,CAAC;IAED,0CAA0C;IAC1C,6CAA6C;IAC7C,qDAAqD;IACrD,KAAK,CAAC,IAAY;QAChB,IAAI,CAAC,QAAQ,GAAG,EAAE,GAAG,IAAI,CAAC,QAAQ,EAAE,GAAG,IAAI,EAAE,CAAC;QAC9C,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;IACpC,CAAC;IAEO,UAAU,CAAC;IAEnB,QAAQ,CAAC,IAAI,EAAE,KAAK;QAClB,IAAI,IAAI,CAAC,UAAU;YAAE,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAEnD,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC,GAAG,EAAE;YAChC,MAAM,KAAK,GAAoB,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;YAC5D,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1B,CAAC,EAAE,KAAK,CAAC,CAAC;IACZ,CAAC;IAED,SAAS,CAAC,GAAW,EAAE,KAAa;QAClC,GAAG,GAAG,GAAG,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;QAC3B,MAAM,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;QAC5C,MAAM,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;QAC5C,MAAM,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;QAC5C,OAAO,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,KAAK,GAAG,CAAC;IACzC,CAAC;IAED,MAAM;QACJ,MAAM,SAAS,GAAG,IAAI,CAAC,cAAc;YACnC,CAAC,CAAC,EAAE,MAAM,EAAE,OAAO,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,QAAQ,EAAE,SAAS,EAAE,wEAAwE,EAAE;YACrK,CAAC,CAAC,EAAE,MAAM,EAAE,OAAO,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,QAAQ,EAAE,CAAC;QAEnF,MAAM,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAE7C,OAAO,CACL,EAAC,IAAI,qDAAC,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,CAAC,gBAAgB,EAAE,YAAY,EAAE,IAAI,CAAC,gBAAgB;YAC9J,4DACE,KAAK,EAAE;oBACL,iBAAiB,EAAE,IAAI;oBACvB,aAAa,EAAE,IAAI,CAAC,QAAQ;iBAC7B;gBAEA,CAAC,IAAI,CAAC,QAAQ,EAAE,QAAQ,IAAI,gEAAS,IAAI,EAAC,UAAU,EAAC,IAAI,EAAE,GAAG,IAAI,GAAG,SAAS,KAAK,EAAE,KAAK,EAAC,eAAe,EAAC,WAAW,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,aAAa,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,KAAK,GAAG,SAAS,KAAK,EAAE,KAAK,EAAE,GAAG,KAAK,GAAG,SAAS,KAAK,EAAE,GAAI;gBAC7O,8DACE,EAAE,EAAC,eAAe,EAClB,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,cAAc,EACnE,IAAI,EAAE,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC,SAAS,EACtD,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAC3B,OAAO,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,EAC5C,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,KAAK,EAAG,CAAC,CAAC,MAA2B,CAAC,KAAK,EAAE,CAAC,GACzE;gBAEF,4DAAK,EAAE,EAAC,YAAY,EAAC,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,2BAA2B,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,IACnK,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,IAAI,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE,eAAe,CAClF;gBACL,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE,KAAK,IAAI,CACjE,4DACE,KAAK,EAAE;wBACL,QAAQ,EAAE,UAAU;wBACpB,UAAU,EAAE,GAAG,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE;wBACpE,KAAK,EAAE,GAAG,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE;wBAC/D,YAAY,EAAE,GAAG,IAAI,GAAG,SAAS,KAAK;wBACtC,OAAO,EAAE,GAAG,KAAK,GAAG,SAAS,OAAO,IAAI,GAAG,SAAS,KAAK;wBACzD,GAAG,EAAE,IAAI,KAAK,GAAG,SAAS,KAAK;wBAC/B,UAAU,EAAE,KAAK;wBACjB,IAAI,EAAE,IAAI,CAAC,GAAG,SAAS,IAAI;wBAC3B,UAAU,EAAE,QAAQ;wBACpB,KAAK,EAAE,aAAa;qBACrB,IAEA,IAAI,CAAC,QAAQ,EAAE,KAAK,CACjB,CACP;gBACA,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,CACzC,0DACE,KAAK,EAAE;wBACL,QAAQ,EAAE,UAAU;wBACpB,KAAK,EAAE,yBAAyB;wBAChC,MAAM,EAAE,IAAI,IAAI,GAAG,SAAS,KAAK;wBACjC,QAAQ,EAAE,GAAG,KAAK,GAAG,SAAS,KAAK;wBACnC,IAAI,EAAE,GAAG;wBACT,UAAU,EAAE,QAAQ;wBACpB,KAAK,EAAE,aAAa;qBACrB;;oBAEa,IAAI,CAAC,QAAQ,CACzB,CACL;gBACA,IAAI,CAAC,cAAc,IAAI,CACtB,+DACE,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE;wBACL,OAAO,EAAE,GAAG,KAAK,GAAG,SAAS,KAAK;qBACnC,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE;oBAEjC,gEAAS,IAAI,EAAC,GAAG,EAAC,IAAI,EAAE,GAAG,KAAK,GAAG,SAAS,KAAK,GAAI,CAC9C,CACV,CACG,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Element, State, Prop, Watch, Listen, Event, EventEmitter } from '@stencil/core';\nimport { LSApiElement } from '../../components';\nimport { LSMutateEvent } from '../../types/LSMutateEvent';\nimport { getInputType } from '../ls-document-viewer/editorUtils';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\n\n@Component({\n tag: 'ls-editor-field',\n styleUrl: 'ls-editor-field.css',\n shadow: true,\n})\nexport class LsEditorField {\n @Element() component: HTMLElement;\n @Prop() assignee: string;\n @Prop({ mutable: true }) dataItem: LSApiElement;\n @Prop() selected: boolean = false;\n @Prop() readonly: boolean;\n @Prop() type: 'text' \| 'signature' \| 'date' \| 'regex' \| 'file' \| 'number' \| 'autodate';\n @Prop() page: { height: number; width: number };\n @Prop() fixedAspect: number \| null = null;\n @State() isEditing: boolean = false;\n @State() heldEdge: string = null;\n @State() isEdgeDragging: boolean = false;\n @State() innerValue: string;\n @Prop() zoom: string;\n \n private sizeObserver: ResizeObserver;\n\n @Event({\n bubbles: true,\n cancelable: false,\n composed: true,\n })\n mutate: EventEmitter<LSMutateEvent[]>;\n\n @Event({\n bubbles: true,\n cancelable: false,\n composed: true,\n })\n update: EventEmitter<LSMutateEvent[]>;\n\n /*\n Controls whether floating elements are visible. Set by mouse enter/leave events.\n /\n @Prop({ mutable: true, reflect: true }) floatingActive: boolean = false;\n\n // Set floatingActive true on mouse enter, false on mouse leave\n private handleMouseEnter = () => {\n this.floatingActive = true;\n };\n\n private handleMouseLeave = () => {\n this.floatingActive = false;\n };\n\n @Listen('keydown')\n handleInput(e: KeyboardEvent) {\n if (e.code === 'Enter') {\n this.isEditing = false;\n this.sizeObserver.observe(this.component.shadowRoot.getElementById('field-info'));\n }\n\n e.stopPropagation();\n }\n\n @Listen('mousemove', { capture: true })\n handleMouseMove(e) {\n if (this.readonly) return;\n if (!e.clientX) return;\n\n // Determine which edge is being moved over and what cursor to show.\n if (Math.abs(e.offsetX) < 5) {\n this.component.style.cursor = 'ew-resize';\n } else if (Math.abs(e.offsetX - this.component.clientWidth) < 5) {\n this.component.style.cursor = 'ew-resize';\n } else if (Math.abs(e.offsetY) < 5) {\n this.component.style.cursor = 'ns-resize';\n } else if (Math.abs(e.offsetY - this.component.clientHeight) < 5) {\n this.component.style.cursor = 'ns-resize';\n } else {\n this.component.style.cursor = 'move';\n }\n }\n\n @Listen('dblclick', { capture: true })\n handleDoubleClick(e: MouseEvent) {\n if (this.readonly \|\| this.dataItem.formElementType === 'signature' \|\| this.dataItem.formElementType === 'initials') return;\n this.isEditing = true;\n this.heldEdge = null;\n this.isEdgeDragging = false;\n this.sizeObserver.disconnect();\n this.innerValue = this.innerValue ? this.innerValue : this.dataItem?.value;\n\n const editbox = this.component.shadowRoot.getElementById('editing-input') as HTMLInputElement;\n console.log(this.dataItem);\n\n if (editbox) {\n editbox.className = 'ls-editor-field-editable';\n editbox.focus();\n }\n e.preventDefault();\n e.stopPropagation();\n }\n\n @Listen('dragstart', { capture: false, passive: false })\n handleDragStart(event) {\n // Add the target element's id to the data transfer object\n event.dataTransfer.setData(\n 'application/json',\n JSON.stringify({\n type: this.type,\n }),\n );\n event.dataTransfer.dropEffect = 'move';\n }\n\n @Watch('selected')\n watchSelectedHandler(_newValue: boolean, _oldValue: boolean) {\n if (_newValue) {\n this.component.style.background = this.hexToRgba(defaultRolePalette[this.dataItem?.signer % 100].s20, 0.5);\n this.component.style.boxShadow = '0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06)';\n } else {\n this.component.style.background = 'rgba(255,255,255,0.5)';\n this.component.style.boxShadow = 'none';\n }\n }\n\n deleteField = () => {\n this.mutate.emit([{ action: 'delete', data: this.dataItem }]);\n this.update.emit([{ action: 'delete', data: this.dataItem }]);\n };\n\n componentDidLoad() {\n this.sizeObserver = new ResizeObserver(entries => {\n for (const entry of entries) {\n if (entry.contentRect) {\n const movebox = this.component.shadowRoot.getElementById('field-info') as HTMLElement;\n\n movebox.style.height = entry.contentRect.height + 'px';\n movebox.style.width = entry.contentRect.width + 'px';\n }\n }\n });\n\n this.sizeObserver.observe(this.component);\n\n // New dropped components automatically need selecting.\n if (this.selected) {\n this.component.style.background = this.hexToRgba(defaultRolePalette[this.dataItem?.signer % 100].s20, 0.5);\n this.component.style.boxShadow = '0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06)';\n } else {\n this.component.style.background = this.hexToRgba('ffffff', 0.7);\n this.component.style.boxShadow = 'none';\n }\n }\n\n // Send one or more mutations up the chain\n // The source of the chain fires the mutation\n // NOTE this alter is debounced to account for typing\n alter(diff: object) {\n this.dataItem = { ...this.dataItem, ...diff };\n this.debounce(this.dataItem, 900);\n }\n\n private labeltimer;\n\n debounce(data, delay) {\n if (this.labeltimer) clearTimeout(this.labeltimer);\n\n this.labeltimer = setTimeout(() => {\n const diffs: LSMutateEvent[] = [{ action: 'update', data }];\n this.mutate.emit(diffs);\n }, delay);\n }\n\n hexToRgba(hex: string, alpha: number): string {\n hex = hex.replace('#', '');\n const r = parseInt(hex.substring(0, 2), 16);\n const g = parseInt(hex.substring(2, 4), 16);\n const b = parseInt(hex.substring(4, 6), 16);\n return `rgba(${r},${g},${b},${alpha})`;\n }\n\n render() {\n const hostStyle = this.floatingActive\n ? { border: `2px ${defaultRolePalette[this.dataItem?.signer % 100].s60} solid`, boxShadow: '0 4px 6px -1px rgba(0, 0, 0, 0.10), 0 2px 4px -1px rgba(0, 0, 0, 0.06)' }\n : { border: `2px ${defaultRolePalette[this.dataItem?.signer % 100].s60} solid` };\n\n const zoomValue = parseFloat(this.zoom) \|\| 1;\n\n return (\n <Host id={this.dataItem ? 'ls-field-' + this.dataItem.id : undefined} style={hostStyle} onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave}>\n <div\n class={{\n 'ls-editor-field': true,\n 'is-selected': this.selected,\n }}\n >\n {!this.dataItem?.optional && <ls-icon name=\"required\" size={`${0.75 zoomValue}rem`} class=\"required-icon\" customStyle={{ position: 'absolute', verticalAlign: 'top', top: `${0.125 * zoomValue}rem`, right: `${0.125 * zoomValue}rem` }} />}\n <input\n id=\"editing-input\"\n class={this.isEditing ? 'ls-editor-field-editable' : 'hidden-field'}\n type={getInputType(this.dataItem.validation).inputType}\n value={this.dataItem?.value}\n checked={this.dataItem?.value ? true : false}\n onInput={e => this.alter({ value: (e.target as HTMLInputElement).value })}\n />\n\n <div id=\"field-info\" class={this.isEditing ? 'hidden-field' : 'ls-editor-field-draggable'} style={{ color: `${defaultRolePalette[this.dataItem?.signer % 100].s100}` }}>\n {(this.dataItem.value.length && this.dataItem.value) \|\| this.dataItem?.formElementType}\n </div>\n {(this.floatingActive \|\| this.selected) && this.dataItem?.label && (\n <div\n style={{\n position: 'absolute',\n background: `${defaultRolePalette[this.dataItem?.signer % 100].s20}`,\n color: `${defaultRolePalette[this.dataItem?.signer % 100].s80}`,\n borderRadius: `${0.25 * zoomValue}rem`,\n padding: `${0.125 * zoomValue}rem ${0.25 * zoomValue}rem`,\n top: `-${1.375 * zoomValue}rem`,\n fontWeight: '500',\n left: `-${2 * zoomValue}px`,\n whiteSpace: 'nowrap',\n width: 'fit-content',\n }}\n >\n {this.dataItem?.label}\n </div>\n )}\n {(this.floatingActive \|\| this.selected) && (\n <p\n style={{\n position: 'absolute',\n color: 'var(--gray-80, #3a3a3a)',\n bottom: `-${1.75 * zoomValue}rem`,\n fontSize: `${0.625 * zoomValue}rem`,\n left: '0',\n whiteSpace: 'nowrap',\n width: 'fit-content',\n }}\n >\n Assigned to: {this.assignee}\n </p>\n )}\n {this.floatingActive && (\n <button\n class={'x-button'}\n style={{\n padding: `${0.125 * zoomValue}rem`,\n }}\n onClick={() => this.deleteField()}\n >\n <ls-icon name=\"x\" size={`${0.625 * zoomValue}rem`} />\n </button>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/ls-editor-table/ls-editor-table.js CHANGED Viewed

@@ -41,7 +41,6 @@ export class LsEditorTable {
         return {
             "editor": {
                 "type": "unknown",
-                "attribute": "editor",
                 "mutable": false,
                 "complexType": {
                     "original": "LsDocumentViewer",

package/dist/collection/components/ls-editor-table/ls-editor-table.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ls-editor-table.js","sourceRoot":"","sources":["../../../src/components/ls-editor-table/ls-editor-table.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAQlE,MAAM,OAAO,aAAa;IACb,SAAS,CAAc;IAClC;;;IAGA;IACQ,MAAM,CAAmB;IAEjC,gBAAgB;QACd,IAAI,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,iBAAiB,CAAsB,CAAC;QACjG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,gBAAgB,CAAC,iBAAiB,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;YAE5F,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;YAC7C,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;YAChD,UAAU,CAAC,SAAS,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAA;YACrC,OAAO,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;YAEhC,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;YACnD,aAAa,CAAC,SAAS,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAA;YAC3C,OAAO,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC;YAEnC,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;YACnD,aAAa,CAAC,SAAS,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAA;YAC3C,OAAO,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC;YAEnC,SAAS,CAAC,WAAW,CAAC,OAAO,CAAC,CAAA;QAChC,CAAC,CAAC,CAAA;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,8DAAO,EAAE,EAAC,iBAAiB,GACnB;YACR,8DAAa,CACR,CACR,CAAC;IACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import { Component, Host, Prop, h, Element } from '@stencil/core';\nimport { LsDocumentViewer } from '../ls-document-viewer/ls-document-viewer';\n\n@Component({\n tag: 'ls-editor-table',\n styleUrl: 'ls-editor-table.css',\n shadow: true,\n})\nexport class LsEditorTable {\n @Element() component: HTMLElement;\n /*\n The parent editor control.\n* {LsDocumentViewer}\n*/\n @Prop() editor: LsDocumentViewer;\n\n componentDidLoad() {\n var dataTable = this.component.shadowRoot.getElementById('ls-editor-table') as HTMLCanvasElement;\n Array.from(this.editor.component.shadowRoot.querySelectorAll('ls-editor-field')).forEach(fx => {\n\n const rowNode = document.createElement('tr');\n const idCellNode = document.createElement('td');\n idCellNode.innerText = fx.dataItem.id\n rowNode.appendChild(idCellNode);\n\n const valueCellNode = document.createElement('td');\n valueCellNode.innerText = fx.dataItem.value\n rowNode.appendChild(valueCellNode);\n\n const labelCellNode = document.createElement('td');\n labelCellNode.innerText = fx.dataItem.label\n rowNode.appendChild(labelCellNode);\n\n dataTable.appendChild(rowNode)\n })\n }\n\n render() {\n return (\n <Host>\n <table id=\"ls-editor-table\">\n </table>\n <slot></slot>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ls-editor-table.js","sourceRoot":"","sources":["../../../src/components/ls-editor-table/ls-editor-table.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAQlE,MAAM,OAAO,aAAa;IACb,SAAS,CAAc;IAClC;;;IAGA;IACQ,MAAM,CAAmB;IAEjC,gBAAgB;QACd,IAAI,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,iBAAiB,CAAsB,CAAC;QACjG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,gBAAgB,CAAC,iBAAiB,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;YAE5F,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;YAC7C,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;YAChD,UAAU,CAAC,SAAS,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAA;YACrC,OAAO,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;YAEhC,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;YACnD,aAAa,CAAC,SAAS,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAA;YAC3C,OAAO,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC;YAEnC,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;YACnD,aAAa,CAAC,SAAS,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAA;YAC3C,OAAO,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC;YAEnC,SAAS,CAAC,WAAW,CAAC,OAAO,CAAC,CAAA;QAChC,CAAC,CAAC,CAAA;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,8DAAO,EAAE,EAAC,iBAAiB,GACnB;YACR,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h, Element } from '@stencil/core';\nimport { LsDocumentViewer } from '../ls-document-viewer/ls-document-viewer';\n\n@Component({\n tag: 'ls-editor-table',\n styleUrl: 'ls-editor-table.css',\n shadow: true,\n})\nexport class LsEditorTable {\n @Element() component: HTMLElement;\n /*\n The parent editor control.\n* {LsDocumentViewer}\n*/\n @Prop() editor: LsDocumentViewer;\n\n componentDidLoad() {\n var dataTable = this.component.shadowRoot.getElementById('ls-editor-table') as HTMLCanvasElement;\n Array.from(this.editor.component.shadowRoot.querySelectorAll('ls-editor-field')).forEach(fx => {\n\n const rowNode = document.createElement('tr');\n const idCellNode = document.createElement('td');\n idCellNode.innerText = fx.dataItem.id\n rowNode.appendChild(idCellNode);\n\n const valueCellNode = document.createElement('td');\n valueCellNode.innerText = fx.dataItem.value\n rowNode.appendChild(valueCellNode);\n\n const labelCellNode = document.createElement('td');\n labelCellNode.innerText = fx.dataItem.label\n rowNode.appendChild(labelCellNode);\n\n dataTable.appendChild(rowNode)\n })\n }\n\n render() {\n return (\n <Host>\n <table id=\"ls-editor-table\">\n </table>\n <slot></slot>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/ls-feature-column/ls-feature-column.js CHANGED Viewed

@@ -51,7 +51,6 @@ export class LsFeatureColoumn {
         return {
             "manager": {
                 "type": "string",
-                "attribute": "manager",
                 "mutable": true,
                 "complexType": {
                     "original": "'document' | 'toolbox' | 'participant'| 'recipient' | 'validation'",
@@ -67,11 +66,11 @@ export class LsFeatureColoumn {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "manager",
                 "defaultValue": "'toolbox'"
             },
             "mode": {
                 "type": "string",
-                "attribute": "mode",
                 "mutable": false,
                 "complexType": {
                     "original": "'preview' | 'editor' | 'compose'",
@@ -87,6 +86,7 @@ export class LsFeatureColoumn {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "mode",
                 "defaultValue": "'editor'"
             }
         };

package/dist/collection/components/ls-field-alignment/ls-field-alignment.js CHANGED Viewed

@@ -14,7 +14,6 @@ export class LsFieldAlignment {
         });
         this.dataItem = diffs.map(d => d.data);
         this.mutate.emit(diffs);
-        this.update.emit(diffs);
     }
     right() {
         const rightmost = this.dataItem.reduce((rightmost, current) => {
@@ -35,7 +34,6 @@ export class LsFieldAlignment {
         });
         this.dataItem = diffs.map(d => d.data);
         this.mutate.emit(diffs);
-        this.update.emit(diffs);
     }
     center() {
         const addcentres = this.dataItem.reduce((total, current) => {
@@ -60,7 +58,6 @@ export class LsFieldAlignment {
         console.log(diffs);
         this.dataItem = diffs.map(d => d.data);
         this.mutate.emit(diffs);
-        this.update.emit(diffs);
     }
     top() {
         const topmost = this.dataItem.reduce((most, current) => {
@@ -94,7 +91,6 @@ export class LsFieldAlignment {
         });
         this.dataItem = diffs.map(d => d.data);
         this.mutate.emit(diffs);
-        this.update.emit(diffs);
     }
     bottom() {
         const lowest = this.dataItem.reduce((acc, current) => {
@@ -114,15 +110,14 @@ export class LsFieldAlignment {
         });
         this.dataItem = diffs.map(d => d.data);
         this.mutate.emit(diffs);
-        this.update.emit(diffs);
     }
     componentDidLoad() {
         attachAllTooltips(this.component.shadowRoot);
     }
     render() {
-        return (h(Host, { key: '63398a2ccc1bc4cbd98d2858c2e2557cc7b37890' }, h("div", { key: '9e18ed6648be04c04c8d31a2141c282f95405e0b', class: 'ls-field-properties-section' }, h("div", { key: 'cdc65651627eab57be294950db80971aac9ab633', class: 'ls-field-properties-section-text' }, h("p", { key: 'ea997551b75b54f994a2b099369926183dfb164c', class: 'ls-field-properties-section-title' }, "Alignment"), h("p", { key: 'fef2f6130de37727e29ffbdd8e6c1d39347758ea', class: 'ls-field-properties-section-description' }, "Align your Fields relative to the page or multi-select and align then to each other.")), h("div", { key: '58f910381243daf9987373ca73cb850643457fae', class: 'multi-button-group-row' }, h("div", { key: 'a928ef05dc1a41bf172854be6de6e43d754ff215', class: 'button-group' }, h("button", { key: '0fd393359c52d53fc5acf0148cf45c35ff9a787f', onClick: () => this.left(), "aria-label": "Align selected fields vertically about their left edge.", "data-tooltip": "Align Left" }, h("ls-icon", { key: 'eb751025f62ce1482974e5244d36560ef6d652e2', name: "field-alignment-left" })), h("button", { key: '2ea4e049759d7bab322b09bf37006c9aca7d550a', onClick: () => this.center(), "aria-label": "Align selected fields vertically about their centre.", "data-tooltip": "Align Center" }, h("ls-icon", { key: '12e1e084e55992e5e8dcb3c616d354e813db4bc2', name: "field-alignment-centre" })), h("button", { key: '50820a4dbb9fe2ee520e6bfd18cd5c3c8798e485', onClick: () => {
+        return (h(Host, { key: '400db25c25a36e1c2556bb4ec06724864b9bf83d' }, h("div", { key: '47e10979f5e40df74c8ee295f2e0f3c24f026215', class: 'ls-field-properties-section' }, h("div", { key: '9c101afb5812f8958f420f9e3f2b180085156f0c', class: 'ls-field-properties-section-text' }, h("p", { key: 'd2f6af742ae404699954d0a038e98553ca6de830', class: 'ls-field-properties-section-title' }, "Alignment"), h("p", { key: '1ad0db4521681851ad7d2ea04b54714033f8983e', class: 'ls-field-properties-section-description' }, "Align your Fields relative to the page or multi-select and align then to each other.")), h("div", { key: 'c8aa1676673aa7dd6272fe215c2b932c3cf7b31e', class: 'multi-button-group-row' }, h("div", { key: '0fdba69a2964a55718efd5d7c0c8084fbb3f3c5b', class: 'button-group' }, h("button", { key: 'bce8132bc2b3d2c932312b5f5ce7202936ba0372', onClick: () => this.left(), "aria-label": "Align selected fields vertically about their left edge.", "data-tooltip": "Align Left" }, h("ls-icon", { key: '4ecde43b70300205a93860415001744d24e9e31f', name: "field-alignment-left" })), h("button", { key: 'd7b62d1433ab7d98573774b2e8ba11dfc933f09e', onClick: () => this.center(), "aria-label": "Align selected fields vertically about their centre.", "data-tooltip": "Align Center" }, h("ls-icon", { key: '88af50eb18c0e5c9759c38785374a080e0c68889', name: "field-alignment-centre" })), h("button", { key: 'f6567ecc6bcf13c853a92985a6c8892fbf9e2360', onClick: () => {
                 this.right();
-            }, "aria-label": "Align selected fields vertically about their right edge.", "data-tooltip": "Align Right" }, h("ls-icon", { key: '020ce69f599c1dd7ca53f00b48dd605c0c85da08', name: "field-alignment-right" }))), h("div", { key: '6b89b279eb02636d907dccc34c14a346850d774e', class: 'button-group' }, h("button", { key: '49a49d4ec2b27337b8e094926cdef9961c13d848', onClick: () => this.top(), "aria-label": "Align selected fields by their top.", "data-tooltip": "Align Top" }, h("ls-icon", { key: '1821a377171df23e2fa3d62204370023e03231eb', name: "field-alignment-top" })), h("button", { key: '03f2aac11c4c379782e3ec9b557ad9f76a8bb756', onClick: () => this.middle(), "aria-label": "Align selected fields by their middles.", "data-tooltip": "Align Middle" }, h("ls-icon", { key: 'df0d8013b46142216c431b5b13d3f329cf3f2bd2', name: "field-alignment-middle" })), h("button", { key: '122cdaa9caf98cc3d0bd06ed4cefb670c6095053', onClick: () => this.bottom(), "aria-label": "Align selected fields by their bottoms.", "data-tooltip": "Align Bottom" }, h("ls-icon", { key: 'a516854348931f5c64a52f3fc4ee9b902378c916', name: "field-alignment-bottom" }))))), h("slot", { key: 'a21b40bc260e0516f212908b6fdf37984f1e6303' }), h("ls-tooltip", { key: 'd2b66a3db33c6bb4b092a306326d9881c51eb05e', id: "ls-tooltip-master" })));
+            }, "aria-label": "Align selected fields vertically about their right edge.", "data-tooltip": "Align Right" }, h("ls-icon", { key: 'b4a316f3b22d598206e53b0aadc152af935a6c92', name: "field-alignment-right" }))), h("div", { key: 'ee1b1aaa94d60b6f8599c48cd41485699eaf8ec1', class: 'button-group' }, h("button", { key: '0533eb85453764ca44a586c7d189d09b9222fd03', onClick: () => this.top(), "aria-label": "Align selected fields by their top.", "data-tooltip": "Align Top" }, h("ls-icon", { key: '6baca0ef2df8e60749ca46f26fa614675aaabdaa', name: "field-alignment-top" })), h("button", { key: '1e2ef35fbe0f0b520091e40c3120ea6112f9b8b7', onClick: () => this.middle(), "aria-label": "Align selected fields by their middles.", "data-tooltip": "Align Middle" }, h("ls-icon", { key: 'b91876a9aec1e5c3f528ee679ac468298e8922f4', name: "field-alignment-middle" })), h("button", { key: 'ef6d7f773708d14ba4621ca900204dda6b5fb016', onClick: () => this.bottom(), "aria-label": "Align selected fields by their bottoms.", "data-tooltip": "Align Bottom" }, h("ls-icon", { key: 'b35d93c535bb179901af3c0a1fbb25a69bde5579', name: "field-alignment-bottom" }))))), h("slot", { key: 'be48e72ff93e6490eae685759d20d21cc0944745' }), h("ls-tooltip", { key: '8fe30e3b47397e4d9bdab32cce7629450bf4123e', id: "ls-tooltip-master" })));
     }
     static get is() { return "ls-field-alignment"; }
     static get encapsulation() { return "shadow"; }
@@ -140,7 +135,6 @@ export class LsFieldAlignment {
         return {
             "dataItem": {
                 "type": "unknown",
-                "attribute": "data-item",
                 "mutable": true,
                 "complexType": {
                     "original": "LSApiElement[]",

package/dist/collection/components/ls-field-alignment/ls-field-alignment.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ls-field-alignment.js","sourceRoot":"","sources":["../../../src/components/ls-field-alignment/ls-field-alignment.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, h, Event, EventEmitter, Element } from '@stencil/core';\nimport { LSApiElement, LSMutateEvent } from '../../components';\nimport { attachAllTooltips } from '../../utils/tooltip';\n\n@Component({\n tag: 'ls-field-alignment',\n styleUrl: 'ls-field-alignment.css',\n shadow: true,\n})\nexport class LsFieldAlignment {\n @Element() component: HTMLElement;\n @Prop({ mutable: true }) dataItem: LSApiElement[];\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n mutate: EventEmitter<LSMutateEvent[]>;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n update: EventEmitter<LSMutateEvent[]>;\n\n // Send one or more mutations up the chain\n // The source of the chain fires the mutation\n alter(diff: object) {\n console.log(diff);\n\n const diffs: LSMutateEvent[] = this.dataItem.map(c => {\n return { action: 'update', data: { ...c, ...diff } as LSApiElement };\n });\n\n this.dataItem = diffs.map(d => d.data as LSApiElement);\n this.mutate.emit(diffs);\n this.update.emit(diffs);\n }\n\n right() {\n const rightmost = this.dataItem.reduce((rightmost, current) => {\n return current.left + current.width < rightmost ? rightmost : current.left + current.width;\n }, 0);\n\n console.log(rightmost);\n\n const diffs: LSMutateEvent[] = this.dataItem.map(c => {\n const newLeft = rightmost - c.width;\n\n return {\n action: 'update',\n data: {\n ...c,\n left: newLeft,\n ax: newLeft,\n bx: newLeft + c.width,\n } as LSApiElement,\n };\n });\n\n this.dataItem = diffs.map(d => d.data as LSApiElement);\n this.mutate.emit(diffs);\n this.update.emit(diffs);\n }\n\n center() {\n const addcentres = this.dataItem.reduce((total, current) => {\n console.log(total + (current.left + current.width / 2));\n return total + (current.left + current.width / 2);\n }, 0);\n console.log(addcentres);\n\n const cp = addcentres / this.dataItem.length;\n console.log('centerposition', cp);\n\n const diffs: LSMutateEvent[] = this.dataItem.map(c => {\n const newLeft = c.left + (cp - (c.left + c.width / 2));\n return {\n action: 'update',\n data: {\n ...c,\n left: newLeft,\n ax: newLeft,\n bx: newLeft + c.width,\n } as LSApiElement,\n };\n });\n console.log(diffs);\n this.dataItem = diffs.map(d => d.data as LSApiElement);\n this.mutate.emit(diffs);\n this.update.emit(diffs);\n }\n\n top() {\n const topmost = this.dataItem.reduce((most, current) => {\n return current.top < most ? most : current.top;\n }, 0);\n\n this.alter({ top: topmost });\n }\n\n left() {\n const leftmost = this.dataItem.reduce((least, current) => {\n return current.left < least ? current.left : least;\n }, this.dataItem[0].left);\n\n this.alter({ left: leftmost });\n }\n\n middle() {\n const addmiddles = this.dataItem.reduce((total, current) => {\n console.log(total + (current.top + current.height / 2));\n return total + (current.top + current.height / 2);\n }, 0);\n\n const cp = addmiddles / this.dataItem.length;\n\n const diffs: LSMutateEvent[] = this.dataItem.map(c => {\n const newTop = c.top + (cp - (c.top + c.height / 2));\n return {\n action: 'update',\n data: {\n ...c,\n top: newTop,\n ay: newTop,\n by: newTop + c.height,\n } as LSApiElement,\n };\n });\n this.dataItem = diffs.map(d => d.data as LSApiElement);\n this.mutate.emit(diffs);\n this.update.emit(diffs);\n }\n\n bottom() {\n const lowest = this.dataItem.reduce((acc, current) => {\n return acc > current.top + current.height ? acc : current.top + current.height;\n }, 0);\n\n const diffs: LSMutateEvent[] = this.dataItem.map(c => {\n const newTop = lowest - c.height;\n return {\n action: 'update',\n data: {\n ...c,\n top: newTop,\n ay: newTop,\n by: newTop + c.height,\n } as LSApiElement,\n };\n });\n this.dataItem = diffs.map(d => d.data as LSApiElement);\n this.mutate.emit(diffs);\n this.update.emit(diffs);\n }\n\n componentDidLoad() {\n attachAllTooltips(this.component.shadowRoot);\n }\n\n render() {\n return (\n <Host>\n <div class={'ls-field-properties-section'}>\n <div class={'ls-field-properties-section-text'}>\n <p class={'ls-field-properties-section-title'}>Alignment</p>\n <p class={'ls-field-properties-section-description'}>Align your Fields relative to the page or multi-select and align then to each other.</p>\n </div>\n <div class={'multi-button-group-row'}>\n <div class={'button-group'}>\n <button onClick={() => this.left()} aria-label=\"Align selected fields vertically about their left edge.\" data-tooltip=\"Align Left\">\n <ls-icon name=\"field-alignment-left\"></ls-icon>\n </button>\n <button onClick={() => this.center()} aria-label=\"Align selected fields vertically about their centre.\" data-tooltip=\"Align Center\">\n <ls-icon name=\"field-alignment-centre\"></ls-icon>\n </button>\n <button\n onClick={() => {\n this.right();\n }}\n aria-label=\"Align selected fields vertically about their right edge.\"\n data-tooltip=\"Align Right\"\n >\n <ls-icon name=\"field-alignment-right\"></ls-icon>\n </button>\n </div>\n <div class={'button-group'}>\n <button onClick={() => this.top()} aria-label=\"Align selected fields by their top.\" data-tooltip=\"Align Top\">\n <ls-icon name=\"field-alignment-top\"></ls-icon>\n </button>\n <button onClick={() => this.middle()} aria-label=\"Align selected fields by their middles.\" data-tooltip=\"Align Middle\">\n <ls-icon name=\"field-alignment-middle\"></ls-icon>\n </button>\n <button onClick={() => this.bottom()} aria-label=\"Align selected fields by their bottoms.\" data-tooltip=\"Align Bottom\">\n <ls-icon name=\"field-alignment-bottom\"></ls-icon>\n </button>\n </div>\n </div>\n </div>\n\n <slot></slot>\n <ls-tooltip id=\"ls-tooltip-master\" />\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ls-field-alignment.js","sourceRoot":"","sources":["../../../src/components/ls-field-alignment/ls-field-alignment.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, h, Event, EventEmitter, Element } from '@stencil/core';\nimport { LSApiElement, LSMutateEvent } from '../../components';\nimport { attachAllTooltips } from '../../utils/tooltip';\n\n@Component({\n tag: 'ls-field-alignment',\n styleUrl: 'ls-field-alignment.css',\n shadow: true,\n})\nexport class LsFieldAlignment {\n @Element() component: HTMLElement;\n @Prop({ mutable: true }) dataItem: LSApiElement[];\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n mutate: EventEmitter<LSMutateEvent[]>;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n update: EventEmitter<LSMutateEvent[]>;\n\n // Send one or more mutations up the chain\n // The source of the chain fires the mutation\n alter(diff: object) {\n console.log(diff);\n\n const diffs: LSMutateEvent[] = this.dataItem.map(c => {\n return { action: 'update', data: { ...c, ...diff } as LSApiElement };\n });\n\n this.dataItem = diffs.map(d => d.data as LSApiElement);\n this.mutate.emit(diffs);\n }\n\n right() {\n const rightmost = this.dataItem.reduce((rightmost, current) => {\n return current.left + current.width < rightmost ? rightmost : current.left + current.width;\n }, 0);\n\n console.log(rightmost);\n\n const diffs: LSMutateEvent[] = this.dataItem.map(c => {\n const newLeft = rightmost - c.width;\n\n return {\n action: 'update',\n data: {\n ...c,\n left: newLeft,\n ax: newLeft,\n bx: newLeft + c.width,\n } as LSApiElement,\n };\n });\n\n this.dataItem = diffs.map(d => d.data as LSApiElement);\n this.mutate.emit(diffs);\n }\n\n center() {\n const addcentres = this.dataItem.reduce((total, current) => {\n console.log(total + (current.left + current.width / 2));\n return total + (current.left + current.width / 2);\n }, 0);\n console.log(addcentres);\n\n const cp = addcentres / this.dataItem.length;\n console.log('centerposition', cp);\n\n const diffs: LSMutateEvent[] = this.dataItem.map(c => {\n const newLeft = c.left + (cp - (c.left + c.width / 2));\n return {\n action: 'update',\n data: {\n ...c,\n left: newLeft,\n ax: newLeft,\n bx: newLeft + c.width,\n } as LSApiElement,\n };\n });\n console.log(diffs);\n this.dataItem = diffs.map(d => d.data as LSApiElement);\n this.mutate.emit(diffs);\n }\n\n top() {\n const topmost = this.dataItem.reduce((most, current) => {\n return current.top < most ? most : current.top;\n }, 0);\n\n this.alter({ top: topmost });\n }\n\n left() {\n const leftmost = this.dataItem.reduce((least, current) => {\n return current.left < least ? current.left : least;\n }, this.dataItem[0].left);\n\n this.alter({ left: leftmost });\n }\n\n middle() {\n const addmiddles = this.dataItem.reduce((total, current) => {\n console.log(total + (current.top + current.height / 2));\n return total + (current.top + current.height / 2);\n }, 0);\n\n const cp = addmiddles / this.dataItem.length;\n\n const diffs: LSMutateEvent[] = this.dataItem.map(c => {\n const newTop = c.top + (cp - (c.top + c.height / 2));\n return {\n action: 'update',\n data: {\n ...c,\n top: newTop,\n ay: newTop,\n by: newTop + c.height,\n } as LSApiElement,\n };\n });\n this.dataItem = diffs.map(d => d.data as LSApiElement);\n this.mutate.emit(diffs);\n }\n\n bottom() {\n const lowest = this.dataItem.reduce((acc, current) => {\n return acc > current.top + current.height ? acc : current.top + current.height;\n }, 0);\n\n const diffs: LSMutateEvent[] = this.dataItem.map(c => {\n const newTop = lowest - c.height;\n return {\n action: 'update',\n data: {\n ...c,\n top: newTop,\n ay: newTop,\n by: newTop + c.height,\n } as LSApiElement,\n };\n });\n this.dataItem = diffs.map(d => d.data as LSApiElement);\n this.mutate.emit(diffs);\n }\n\n componentDidLoad() {\n attachAllTooltips(this.component.shadowRoot);\n }\n\n render() {\n return (\n <Host>\n <div class={'ls-field-properties-section'}>\n <div class={'ls-field-properties-section-text'}>\n <p class={'ls-field-properties-section-title'}>Alignment</p>\n <p class={'ls-field-properties-section-description'}>Align your Fields relative to the page or multi-select and align then to each other.</p>\n </div>\n <div class={'multi-button-group-row'}>\n <div class={'button-group'}>\n <button onClick={() => this.left()} aria-label=\"Align selected fields vertically about their left edge.\" data-tooltip=\"Align Left\">\n <ls-icon name=\"field-alignment-left\"></ls-icon>\n </button>\n <button onClick={() => this.center()} aria-label=\"Align selected fields vertically about their centre.\" data-tooltip=\"Align Center\">\n <ls-icon name=\"field-alignment-centre\"></ls-icon>\n </button>\n <button\n onClick={() => {\n this.right();\n }}\n aria-label=\"Align selected fields vertically about their right edge.\"\n data-tooltip=\"Align Right\"\n >\n <ls-icon name=\"field-alignment-right\"></ls-icon>\n </button>\n </div>\n <div class={'button-group'}>\n <button onClick={() => this.top()} aria-label=\"Align selected fields by their top.\" data-tooltip=\"Align Top\">\n <ls-icon name=\"field-alignment-top\"></ls-icon>\n </button>\n <button onClick={() => this.middle()} aria-label=\"Align selected fields by their middles.\" data-tooltip=\"Align Middle\">\n <ls-icon name=\"field-alignment-middle\"></ls-icon>\n </button>\n <button onClick={() => this.bottom()} aria-label=\"Align selected fields by their bottoms.\" data-tooltip=\"Align Bottom\">\n <ls-icon name=\"field-alignment-bottom\"></ls-icon>\n </button>\n </div>\n </div>\n </div>\n\n <slot></slot>\n <ls-tooltip id=\"ls-tooltip-master\" />\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/ls-field-content/ls-field-content.js CHANGED Viewed

@@ -20,7 +20,6 @@ export class LsFieldContent {
         this.labeltimer = setTimeout(() => {
             const diffs = [{ action: 'update', data }];
             this.mutate.emit(diffs);
-            this.update.emit(diffs);
         }, delay);
     }
     supportsValue() {
@@ -28,9 +27,9 @@ export class LsFieldContent {
         return !typesWithValue.includes(this.dataItem?.elementType);
     }
     render() {
-        return (h(Host, { key: '734ec935c3012ca203927537a917e43bbf51bd29' }, h("ls-props-section", { key: '8e9b9f1cc340517f3b7f3255dc87e8801d73b5ec', sectionTitle: "Field Type", sectionDescription: "The Field you currently have selected" }, h("ls-field-type-display", { key: '9b01edd6f83f4a060d00bb780322ce138fb7dea4', fieldType: this.dataItem?.elementType, assignee: this.dataItem?.signer })), h("ls-props-section", { key: '3e3995526461f108576b7d22cbb1b2846d995e27', sectionTitle: "Required Field", row: true }, h("ls-toggle", { key: 'bec526155b82b50a64f9b1b5b74aadb7e3c6abad', id: "toggle-required", checked: !this.dataItem?.optional, onValueChange: (ev) => this.alter({ optional: !ev.detail }) })), h("ls-props-section", { key: '1575b64c8c8381205c13c3fe70a32b97699b595f', sectionTitle: "Field Label", sectionDescription: "Add a label to clarify the information required from the Recipient." }, h("input", { key: '320dd9b0427f7ca277134c1d0739a82a5e155f27', value: this.dataItem?.label, placeholder: "eg. Sign Here", onInput: (e) => this.alter({ label: e.target.value }) })), this.supportsValue() && (h("ls-props-section", { key: 'aa879cb5deca3ce965dc998116966ef77e118a89', sectionTitle: "Value", sectionDescription: "A prefilled value that can be altered by the signer." }, h("input", { key: 'd6c22af8098d61cc7af5e8abb9e23b9d046771d6', value: this.dataItem?.value, placeholder: "e.g. Gordon Smith", onInput: (e) => this.alter({ value: e.target.value }) }))), this.dataItem.validation === 20 && (h("ls-props-section", { key: '2ef0f7da035529ce618803d0c6b74b447b922555', sectionTitle: "Options", sectionDescription: "Define the options available in the dropdown. One option per line." }, h("textarea", { key: 'ce22a03c08f2d1f98feb0125912e053ef62c7226', value: this.dataItem?.options, placeholder: "Option 1\nOption 2\nOption 3", onInput: (e) => this.alter({ options: e.target.value }) }))), this.showValidationTypes && (h("ls-props-section", { key: '0f6e53e8261eb4c6b8db6fd5f828a42724f27ffd', sectionTitle: "Content Format", sectionDescription: "Select the specific format you want the Recipient to enter." }, h("ls-input-wrapper", { key: '3005c64a70fd13264666ad5e4e014000d820c630', select: true }, h("select", { key: 'f319bc0e3d1987ff3bebe363051c6756cb1b56cf', onChange: (ev) => this.alter({ validation: parseInt(ev.target.value) }) }, validationTypes
+        return (h(Host, { key: '3aa145da2c93db6900ba96388d86c72472686aa3' }, h("ls-props-section", { key: '4d08885c91a113e3c58b79046abc18e0b57ac1e4', sectionTitle: "Field Type", sectionDescription: "The Field you currently have selected" }, h("ls-field-type-display", { key: '166c7438df51abd4ee13952444a9e0996dd3d1ac', fieldType: this.dataItem?.elementType, assignee: this.dataItem?.signer })), h("ls-props-section", { key: '7a8f379af5a5bcfd3317dcd143129e493e963b08', sectionTitle: "Required Field", row: true }, h("ls-toggle", { key: '48ff9c0929d5cc38303b33423c8af14ef41d402a', id: "toggle-required", checked: !this.dataItem?.optional, onValueChange: (ev) => this.alter({ optional: !ev.detail }) })), h("ls-props-section", { key: '589a7bf1ff07a9c0cccfc347d0d8e2ccd4292629', sectionTitle: "Field Label", sectionDescription: "Add a label to clarify the information required from the Recipient." }, h("input", { key: 'bfd8071a1f1f54b9b1c1ee7a44b29c126b8f481b', value: this.dataItem?.label, placeholder: "eg. Sign Here", onInput: (e) => this.alter({ label: e.target.value }) })), this.supportsValue() && (h("ls-props-section", { key: '1fc16d46a133d7f8724b7e89fec0430908a5d440', sectionTitle: "Value", sectionDescription: "A prefilled value that can be altered by the signer." }, h("input", { key: '5c891526edb6a685222cfbc8f322a089e7cd5279', value: this.dataItem?.value, placeholder: "e.g. Gordon Smith", onInput: (e) => this.alter({ value: e.target.value }) }))), this.dataItem.validation === 20 && (h("ls-props-section", { key: '681316a7a8e67745fd9bf1735dc5d282ce62e756', sectionTitle: "Options", sectionDescription: "Define the options available in the dropdown. One option per line." }, h("textarea", { key: 'c919685a5b466e8ff6fd4d7ee4dbbcf9c66bfcee', value: this.dataItem?.options, placeholder: "Option 1\nOption 2\nOption 3", onInput: (e) => this.alter({ options: e.target.value }) }))), this.showValidationTypes && (h("ls-props-section", { key: '21d860e34e7a1715a5618b375c57c979acfb5dcb', sectionTitle: "Content Format", sectionDescription: "Select the specific format you want the Recipient to enter." }, h("ls-input-wrapper", { key: 'e4cc5533901b4a0842ea97bb6a97f4f55816d1cb', select: true }, h("select", { key: '4875147dbdcfdeadf4485f2b283bed89fe43c083', onChange: (ev) => this.alter({ validation: parseInt(ev.target.value) }) }, validationTypes
             .filter(type => type.formType === this.dataItem?.elementType)
-            .map(type => (h("option", { selected: this.dataItem?.validation === type.id, value: type.id }, type.description))))))), h("slot", { key: 'c8983032bdf7d1ec86416810de22445987bd75b5' })));
+            .map(type => (h("option", { selected: this.dataItem?.validation === type.id, value: type.id }, type.description))))))), h("slot", { key: 'de3eef5f0ea1297b43c3e92851935552f1fdcef9' })));
     }
     static get is() { return "ls-field-content"; }
     static get encapsulation() { return "shadow"; }
@@ -48,7 +47,6 @@ export class LsFieldContent {
         return {
             "dataItem": {
                 "type": "unknown",
-                "attribute": "data-item",
                 "mutable": true,
                 "complexType": {
                     "original": "LSApiElement",
@@ -72,7 +70,6 @@ export class LsFieldContent {
             },
             "showValidationTypes": {
                 "type": "boolean",
-                "attribute": "show-validation-types",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -88,6 +85,7 @@ export class LsFieldContent {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "show-validation-types",
                 "defaultValue": "true"
             }
         };

package/dist/collection/components/ls-field-content/ls-field-content.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ls-field-content.js","sourceRoot":"","sources":["../../../src/components/ls-field-content/ls-field-content.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAgB,OAAO,EAAE,MAAM,eAAe,CAAC;AAEvF,OAAO,EAAE,eAAe,EAAE,MAAM,mCAAmC,CAAC;AAOpE,MAAM,OAAO,cAAc;IACd,SAAS,CAAc;IACT,QAAQ,CAAe;IACxC,mBAAmB,GAAY,IAAI,CAAC;IAO5C,MAAM,CAAgC;IAOtC,MAAM,CAAgC;IAEtC,0CAA0C;IAC1C,6CAA6C;IAC7C,qDAAqD;IACrD,KAAK,CAAC,IAAY;QAChB,IAAI,CAAC,QAAQ,GAAG,EAAE,GAAG,IAAI,CAAC,QAAQ,EAAE,GAAG,IAAI,EAAE,CAAC;QAC9C,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;IACpC,CAAC;IAEO,UAAU,CAAC;IAEnB,QAAQ,CAAC,IAAI,EAAE,KAAK;QAClB,IAAI,IAAI,CAAC,UAAU;YAAE,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAEnD,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC,GAAG,EAAE;YAChC,MAAM,KAAK,GAAoB,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;YAC5D,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;~~YACxB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;~~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~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import { Component, Host, Prop, h, Event, EventEmitter, Element } from '@stencil/core';\nimport { LSApiElement, LSMutateEvent } from '../../components';\nimport { validationTypes } from '../ls-document-viewer/editorUtils';\n\n@Component({\n tag: 'ls-field-content',\n styleUrl: 'ls-field-content.css',\n shadow: true,\n})\nexport class LsFieldContent {\n @Element() component: HTMLElement;\n @Prop({ mutable: true }) dataItem: LSApiElement;\n @Prop() showValidationTypes: boolean = true;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n mutate: EventEmitter<LSMutateEvent[]>;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n update: EventEmitter<LSMutateEvent[]>;\n\n // Send one or more mutations up the chain\n // The source of the chain fires the mutation\n // NOTE this alter is debounced to account for typing\n alter(diff: object) {\n this.dataItem = { ...this.dataItem, ...diff };\n this.debounce(this.dataItem, 500);\n }\n\n private labeltimer;\n\n debounce(data, delay) {\n if (this.labeltimer) clearTimeout(this.labeltimer);\n\n this.labeltimer = setTimeout(() => {\n const diffs: LSMutateEvent[] = [{ action: 'update', data }];\n this.mutate.emit(diffs);\n ~~this.update.emit(diffs);\n~~ }, delay);\n }\n\n supportsValue() {\n const typesWithValue = [\"signature\", \"intials\", \"image\", \"file\", \"signing\", \"date\", \"autosign\", \"regex\"];\n \n return !typesWithValue.includes(this.dataItem?.elementType);\n }\n\n render() {\n return (\n <Host>\n <ls-props-section sectionTitle=\"Field Type\" sectionDescription=\"The Field you currently have selected\">\n <ls-field-type-display fieldType={this.dataItem?.elementType} assignee={this.dataItem?.signer} />\n </ls-props-section>\n <ls-props-section sectionTitle=\"Required Field\" row={true}>\n <ls-toggle id=\"toggle-required\" checked={!this.dataItem?.optional} onValueChange={(ev) => this.alter({ optional: !ev.detail })} />\n </ls-props-section>\n <ls-props-section sectionTitle=\"Field Label\" sectionDescription=\"Add a label to clarify the information required from the Recipient.\">\n <input value={this.dataItem?.label} placeholder=\"eg. Sign Here\" onInput={(e) => this.alter({ label: (e.target as HTMLInputElement).value })} />\n </ls-props-section>\n {this.supportsValue() && (\n <ls-props-section sectionTitle=\"Value\" sectionDescription=\"A prefilled value that can be altered by the signer.\">\n <input value={this.dataItem?.value} placeholder=\"e.g. Gordon Smith\" onInput={(e) => this.alter({ value: (e.target as HTMLInputElement).value })} />\n </ls-props-section>\n )}\n {this.dataItem.validation === 20 && (\n <ls-props-section sectionTitle=\"Options\" sectionDescription=\"Define the options available in the dropdown. One option per line.\">\n <textarea value={this.dataItem?.options} placeholder=\"Option 1 Option 2 Option 3\" onInput={(e) => this.alter({ options: (e.target as HTMLTextAreaElement).value })} />\n </ls-props-section>\n )}\n\n {this.showValidationTypes && (\n <ls-props-section sectionTitle=\"Content Format\" sectionDescription=\"Select the specific format you want the Recipient to enter.\">\n <ls-input-wrapper select>\n <select onChange={(ev) => this.alter({ validation: parseInt((ev.target as HTMLSelectElement).value) })} >\n {validationTypes\n .filter(type => type.formType === this.dataItem?.elementType)\n .map(type => (\n <option selected={this.dataItem?.validation === type.id} value={type.id}>\n {type.description}\n </option>\n ))}\n </select>\n </ls-input-wrapper>\n </ls-props-section>\n )}\n <slot></slot>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ls-field-content.js","sourceRoot":"","sources":["../../../src/components/ls-field-content/ls-field-content.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, h, Event, EventEmitter, Element } from '@stencil/core';\nimport { LSApiElement, LSMutateEvent } from '../../components';\nimport { validationTypes } from '../ls-document-viewer/editorUtils';\n\n@Component({\n tag: 'ls-field-content',\n styleUrl: 'ls-field-content.css',\n shadow: true,\n})\nexport class LsFieldContent {\n @Element() component: HTMLElement;\n @Prop({ mutable: true }) dataItem: LSApiElement;\n @Prop() showValidationTypes: boolean = true;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n mutate: EventEmitter<LSMutateEvent[]>;\n\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true,\n })\n update: EventEmitter<LSMutateEvent[]>;\n\n // Send one or more mutations up the chain\n // The source of the chain fires the mutation\n // NOTE this alter is debounced to account for typing\n alter(diff: object) {\n this.dataItem = { ...this.dataItem, ...diff };\n this.debounce(this.dataItem, 500);\n }\n\n private labeltimer;\n\n debounce(data, delay) {\n if (this.labeltimer) clearTimeout(this.labeltimer);\n\n this.labeltimer = setTimeout(() => {\n const diffs: LSMutateEvent[] = [{ action: 'update', data }];\n this.mutate.emit(diffs);\n }, delay);\n }\n\n supportsValue() {\n const typesWithValue = [\"signature\", \"intials\", \"image\", \"file\", \"signing\", \"date\", \"autosign\", \"regex\"];\n \n return !typesWithValue.includes(this.dataItem?.elementType);\n }\n\n render() {\n return (\n <Host>\n <ls-props-section sectionTitle=\"Field Type\" sectionDescription=\"The Field you currently have selected\">\n <ls-field-type-display fieldType={this.dataItem?.elementType} assignee={this.dataItem?.signer} />\n </ls-props-section>\n <ls-props-section sectionTitle=\"Required Field\" row={true}>\n <ls-toggle id=\"toggle-required\" checked={!this.dataItem?.optional} onValueChange={(ev) => this.alter({ optional: !ev.detail })} />\n </ls-props-section>\n <ls-props-section sectionTitle=\"Field Label\" sectionDescription=\"Add a label to clarify the information required from the Recipient.\">\n <input value={this.dataItem?.label} placeholder=\"eg. Sign Here\" onInput={(e) => this.alter({ label: (e.target as HTMLInputElement).value })} />\n </ls-props-section>\n {this.supportsValue() && (\n <ls-props-section sectionTitle=\"Value\" sectionDescription=\"A prefilled value that can be altered by the signer.\">\n <input value={this.dataItem?.value} placeholder=\"e.g. Gordon Smith\" onInput={(e) => this.alter({ value: (e.target as HTMLInputElement).value })} />\n </ls-props-section>\n )}\n {this.dataItem.validation === 20 && (\n <ls-props-section sectionTitle=\"Options\" sectionDescription=\"Define the options available in the dropdown. One option per line.\">\n <textarea value={this.dataItem?.options} placeholder=\"Option 1 Option 2 Option 3\" onInput={(e) => this.alter({ options: (e.target as HTMLTextAreaElement).value })} />\n </ls-props-section>\n )}\n\n {this.showValidationTypes && (\n <ls-props-section sectionTitle=\"Content Format\" sectionDescription=\"Select the specific format you want the Recipient to enter.\">\n <ls-input-wrapper select>\n <select onChange={(ev) => this.alter({ validation: parseInt((ev.target as HTMLSelectElement).value) })} >\n {validationTypes\n .filter(type => type.formType === this.dataItem?.elementType)\n .map(type => (\n <option selected={this.dataItem?.validation === type.id} value={type.id}>\n {type.description}\n </option>\n ))}\n </select>\n </ls-input-wrapper>\n </ls-props-section>\n )}\n <slot></slot>\n </Host>\n );\n }\n}\n"]}