npm - legalesign-document-viewer - Versions diffs - 0.3.7 → 0.3.8 - Mend

legalesign-document-viewer 0.3.7 → 0.3.8

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 (253) hide show

package/dist/collection/components/ls-toggle/ls-toggle.js CHANGED Viewed

@@ -7,9 +7,9 @@ export class LsToggle {
         this.valueChange.emit(value);
     }
     render() {
-        return (h(Host, { key: 'f95b58e542f2496d2c39f511dc923bfbfdc1fff2' }, h("label", { key: '3a39c582d63ed93e11b34783bda317690f0f7acf', class: "switch" }, h("input", { key: '1b4e3f1d450af82e99e3ec2d8e76ffb7ddf17e84', type: "checkbox", checked: this.checked, onChange: (e) => {
+        return (h(Host, { key: 'ed5c0cf6938343a75778033d857ed75d1dd71a16' }, h("label", { key: 'c61d2548ff81739a02d32e4f6ca726d0d7a2ba8d', class: "switch" }, h("input", { key: 'c1bb11a118c0eb16f3aa7ff9857e9326031066b5', type: "checkbox", checked: this.checked, onChange: (e) => {
                 this.changeHandler(e.target.checked);
-            } }), h("span", { key: 'a7fbe2ba77aa2042f8b303692ed7f20b2253b0d5', class: `${this.indeterminate ? 'indeterminate' : 'slider'} round` })), h("slot", { key: 'd3885d6b1389684b0d742303a079d6daea8ee635' })));
+            } }), h("span", { key: '42ca0de480283f08abcbf5107b4f4c96fa778224', class: `${this.indeterminate ? 'indeterminate' : 'slider'} round` })), h("slot", { key: '42962f9a09a41198c49673de78a4f80213b1347a' })));
     }
     static get is() { return "ls-toggle"; }
     static get originalStyleUrls() {

package/dist/collection/components/ls-toolbar/ls-toolbar.js CHANGED Viewed

@@ -35,7 +35,7 @@ export class LsToolbar {
         this.update.emit(diffs);
     }
     render() {
-        return (h(Host, { key: '0a4b38e454e6871a0aa7b24c47883d6f0392fbd4' }, this.dataItem && this.dataItem.length > 1 ? (h("div", { class: 'rowbox' }, h("ls-field-format", { dataItem: this?.dataItem }))) : (h("div", { class: 'rowbox' }, h("ls-field-format", { dataItem: this?.dataItem, style: { visibility: this.dataItem && this.dataItem.length === 1 ? 'visible' : 'hidden' } }), h("ls-participant-select", { id: "ls-participant-select", roles: this.template?.roles, style: { display: this.dataItem && this.dataItem.length === 1 ? 'none' : 'block' } }))), h("ls-tooltip", { key: '51ed0398daa63be12069124d2ac81c51effce0d7', id: "ls-tooltip-master" }), h("slot", { key: '628675be094e1c9249fb67607c0c2eb04cea1b49' })));
+        return (h(Host, { key: 'ee27c52d8ca9657be6664c031d4858595d4a8b95' }, this.dataItem && this.dataItem.length > 1 ? (h("div", { class: 'rowbox' }, h("ls-field-format", { dataItem: this?.dataItem }))) : (h("div", { class: 'rowbox' }, h("ls-field-format", { dataItem: this?.dataItem, style: { visibility: this.dataItem && this.dataItem.length === 1 ? 'visible' : 'hidden' } }), h("ls-participant-select", { id: "ls-participant-select", roles: this.template?.roles, style: { display: this.dataItem && this.dataItem.length === 1 ? 'none' : 'block' } }))), h("ls-tooltip", { key: '5d56e476a7d63e337af9e080ab9b886c603ccf54', id: "ls-tooltip-master" }), h("slot", { key: 'f35bcec2285a41a9dfa2682d29cc93f4677f268d' })));
     }
     static get is() { return "ls-toolbar"; }
     static get encapsulation() { return "shadow"; }

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

@@ -55,7 +55,7 @@ export class LsToolboxField {
         attachAllTooltips(this.component.shadowRoot);
     }
     render() {
-        return (h(Host, { key: '6de8f37030daba94c2e48cfa50d853ce05760302', draggable: "true" }, h("div", { key: '1705c6b5dd533e474d734a07ffbcc7f54ad5f5b8', class: 'ls-toolbox-field', style: this.isSelected && {
+        return (h(Host, { key: '7094166bd32eb9d04527a926e3b020bdafc82bc3', draggable: "true" }, h("div", { key: '7fea94dc210626234d86bc7cecc7156d07a50048', class: 'ls-toolbox-field', style: this.isSelected && {
                 background: defaultRolePalette[this.signer % 100].s10,
                 border: `1px solid ${defaultRolePalette[this.signer % 100].s60}`,
                 color: defaultRolePalette[this.signer % 100].s80,
@@ -69,9 +69,9 @@ export class LsToolboxField {
                     defaultHeight: this.defaultHeight,
                     defaultWidth: this.defaultWidth,
                 });
-            } }, h("div", { key: '69208e5e342623faf98170e18e8e371376ace090', class: "toolbox-field-icon", style: { '--signer-color-light': defaultRolePalette[this.signer % 100].s10, '--signer-color': defaultRolePalette[this.signer % 100].s60 }, "data-tooltip": this.tooltip, "data-tooltip-placement": "right" }, h("ls-icon", { key: 'e600ab045538f95fde540163fc858dce22ec7fd1', name: this.icon, size: "20" })), h("p", { key: 'e52b69e75a83ec6a7e890def976519949427fbfe', class: "toolbox-field-label", style: this.isSelected && {
+            } }, h("div", { key: '2f2ba6df62be6b201fba1ac90b35145647e7346f', class: "toolbox-field-icon", style: { '--signer-color-light': defaultRolePalette[this.signer % 100].s10, '--signer-color': defaultRolePalette[this.signer % 100].s60 }, "data-tooltip": this.tooltip, "data-tooltip-placement": "right" }, h("ls-icon", { key: '8ed6e2c6e3c0c3a62a2bba5ff6efcf6c5f783344', name: this.icon, size: "20" })), h("p", { key: '01dabb5cebe192350465635336c2ae84968e72d4', class: "toolbox-field-label", style: this.isSelected && {
                 color: defaultRolePalette[this.signer % 100].s80,
-            } }, this.label), h("ls-icon", { key: '24abe83ee86705a50eb47b8f6c2ce95b70ef88db', name: "drag-vertical", size: "16", color: "#787a80" })), h("ls-tooltip", { key: '6cb285f57f1ca9f65ecb5da5de04917820661565', id: "ls-tooltip-master", tooltipText: 'Something' })));
+            } }, this.label), h("ls-icon", { key: '8db0b1b8c88e22753cf11d2ada41ab150984f554', name: "drag-vertical", size: "16", color: "#787a80" })), h("ls-tooltip", { key: '97b49cb2cf9bbfaf61d34b2d2d4c7d9854d40bef', id: "ls-tooltip-master", tooltipText: 'Something' })));
     }
     static get is() { return "ls-toolbox-field"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ls-tooltip/ls-tooltip.js CHANGED Viewed

@@ -51,7 +51,7 @@ export class LsTooltip {
         innerTooltip.classList.add('hidden');
     }
     render() {
-        return (h("div", { key: '7d2b151a35ae84bfa25ff2d27b9fa76d2dd45d4a', id: "ls-tooltip-inner", class: "tooltip hidden", role: "tooltip" }, h("div", { key: 'f073ac2345096a57ec21d2afd415663834127785', id: "arrow" }), this.tooltipTitle && h("p", { key: 'b012f0ba9c38eb51d314526e2c4df680de6e2ab3', class: "tooltip-title" }, this.tooltipTitle), this.tooltipText, h("slot", { key: '017e306bbd2880220134a46c5284b05dedcf8a39' })));
+        return (h("div", { key: '127d6459d0353cfadb29fffd9b68eab3962d59c0', id: "ls-tooltip-inner", class: "tooltip hidden", role: "tooltip" }, h("div", { key: '347d0beb31c2a238ab18cc514bd64663a0f08787', id: "arrow" }), this.tooltipTitle && h("p", { key: 'dc214278f66826c46d6144939263ce4fdb7f7436', class: "tooltip-title" }, this.tooltipTitle), this.tooltipText, h("slot", { key: '6a47cab909c4d11182a8d6362826572a3798181e' })));
     }
     static get is() { return "ls-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ls-validation-tag/ls-validation-tag.js CHANGED Viewed

@@ -4,8 +4,9 @@ export class LsValidationTag {
     status = 'Invalid';
     validationErrors = [];
     isExpanded = false;
+    showDropDown = true;
     render() {
-        return (h(Host, { key: 'e9550ce2a25fecb9450646da2975ebc3ee2cc7d8' }, h("div", { key: '1029ed6832847a4d1de6d625a8826aff345a0582', class: `valid-label ${this.validationErrors.length === 0 ? 'valid' : 'invalid'}`, onClick: this.validationErrors.length && (() => (this.isExpanded = !this.isExpanded)) }, this.validationErrors.length === 0 ? 'Ready to Send' : `Requires Fields`, this.validationErrors.length > 0 && h("div", { key: '8f8c59ead9f8a4ca774d1726a780511425ce2d34', class: 'field-counter' }, this.validationErrors.length), this.validationErrors.length > 0 && (h("ls-icon", { key: 'fd05f640ad20f6063b7e66980b7f7362be663df1', name: this.isExpanded ? 'chevron-up' : 'chevron-down', style: { cursor: 'pointer', scale: '0.60', margin: '0 -0.25rem' } }))), this.isExpanded && this.validationErrors.length !== 0 && (h("div", { key: '32e9a993a48711b36861d80e9f86c37815b74772', class: 'field-dropdown' }, h("div", { key: '0c316ce402bed2bbc05eac98dba857f56beedfbc', class: 'dropdown-header' }, h("h2", { key: '706747fcd41484e6d94d2dfbb53caf3acd457b43' }, "Signature Fields Required"), h("p", { key: 'b9fa0d6fceb95df99a49843d6a9100877fd01d06' }, this.validationErrors.length, " ", this.validationErrors.length === 1 ? 'Recipient needs a Signature Field' : 'Recipients need Signature Fields', " placed for them")), this.validationErrors.map((field, idx) => {
+        return (h(Host, { key: '80c4337e973b7363bd965079b9218952ecf53383' }, h("div", { key: '11442ce3be3c956bdf11fd8b318c42eac0b4f8e7', class: `valid-label ${this.validationErrors.length === 0 ? 'valid' : 'invalid'}`, onClick: this.validationErrors.length && (() => (this.isExpanded = !this.isExpanded)) }, this.validationErrors.length === 0 ? 'Ready to Send' : `Requires Fields`, this.validationErrors.length > 0 && h("div", { key: '5ae8222218f9ff791f39cefc4f588288326452fc', class: 'field-counter' }, this.validationErrors.length), this.validationErrors.length > 0 && this.showDropDown && (h("ls-icon", { key: 'cb17df8b327c6705d623193d8cc5efef40752a41', name: this.isExpanded ? 'chevron-up' : 'chevron-down', style: { cursor: 'pointer', scale: '0.60', margin: '0 -0.25rem' } }))), this.isExpanded && this.validationErrors.length !== 0 && this.showDropDown && (h("div", { key: 'fc8da1953be35ddbaa67258ac0991f49b89e6e49', class: 'field-dropdown' }, h("div", { key: '90f9bbf3490e236f737de60256e98e3dbc36254f', class: 'dropdown-header' }, h("h2", { key: 'b3f1c0f9a47e2c609b5d5f1aefb3ab080718bacd' }, "Fields Required"), h("p", { key: 'e5684640e3b80bd19fa91fc65848cf4baefd2da2' }, this.validationErrors.length, " ", this.validationErrors.length === 1 ? 'Recipient needs a Signature Field' : 'Recipients need Signature Fields', " placed for them")), this.validationErrors.map((field, idx) => {
             const signerIndex = field?.role?.signerIndex ? field?.role?.signerIndex % 100 : null;
             const pallette = defaultRolePalette[signerIndex || field?.element?.signer || 0];
             return (h("div", { key: idx, class: 'required-field', style: {
@@ -96,6 +97,26 @@ export class LsValidationTag {
                 "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
+            },
+            "showDropDown": {
+                "type": "boolean",
+                "attribute": "show-drop-down",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "true"
             }
         };
     }

package/dist/collection/components/ls-validation-tag/ls-validation-tag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ls-validation-tag.js","sourceRoot":"","sources":["../../../src/components/ls-validation-tag/ls-validation-tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAQ1E,MAAM,OAAO,eAAe;IACD,MAAM,GAAW,SAAS,CAAC;IAC3B,gBAAgB,GAAsB,EAAE,CAAC;IACzC,UAAU,GAAY,KAAK,CAAC;~~IAErD~~,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DACE,KAAK,EAAE,eAAe,IAAI,CAAC,gBAAgB,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EAAE,EAChF,OAAO,EAAE,IAAI,CAAC,gBAAgB,CAAC,MAAM,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;gBAEpF,IAAI,CAAC,gBAAgB,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,iBAAiB;gBACxE,IAAI,CAAC,gBAAgB,CAAC,MAAM,GAAG,CAAC,IAAI,4DAAK,KAAK,EAAE,eAAe,IAAG,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAO;gBACrG,IAAI,CAAC,gBAAgB,CAAC,MAAM,GAAG,CAAC,IAAI,~~CACnC~~,gEAAS,IAAI,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,cAAc,EAAE,KAAK,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,GAAI,CACtI,CACG;YACL,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,gBAAgB,CAAC,MAAM,KAAK,CAAC,IAAI,~~CACxD~~,4DAAK,KAAK,EAAE,gBAAgB;gBAC1B,4DAAK,KAAK,EAAE,iBAAiB;oBAC3B~~,yFAAkC~~;~~oBAClC~~;wBACG,IAAI,CAAC,gBAAgB,CAAC,MAAM;;wBAAG,IAAI,CAAC,gBAAgB,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,mCAAmC,CAAC,CAAC,CAAC,kCAAkC;2CAC3I,CACA;gBACL,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;oBACxC,MAAM,WAAW,GAAG,KAAK,EAAE,IAAI,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,EAAE,IAAI,EAAE,WAAW,GAAG,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC;oBACrF,MAAM,QAAQ,GAAG,kBAAkB,CAAC,WAAW,IAAI,KAAK,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,CAAC,CAAC;oBAEhF,OAAO,CACL,WACE,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,gBAAgB,EACvB,KAAK,EAAE;4BACL,oBAAoB,EAAE,QAAQ,CAAC,GAAG;4BAClC,sBAAsB,EAAE,QAAQ,CAAC,GAAG;4BACpC,0BAA0B,EAAE,QAAQ,CAAC,GAAG;4BACxC,oBAAoB,EAAE,QAAQ,CAAC,GAAG;4BAClC,0BAA0B,EAAE,QAAQ,CAAC,GAAG;4BACxC,4BAA4B,EAAE,QAAQ,CAAC,GAAG;yBAC3C;wBAED,WAAK,KAAK,EAAE,2BAA2B;4BACrC,WAAK,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,CAAC,GAAG,EAAE,GAAI;4BACzD,KAAK,EAAE,IAAI,IAAI,CACd,WAAK,KAAK,EAAE,2BAA2B;gCACrC,SAAG,KAAK,EAAE,EAAE,KAAK,EAAE,QAAQ,CAAC,GAAG,EAAE,IAAG,KAAK,CAAC,IAAI,EAAE,IAAI,IAAI,UAAU,KAAK,EAAE,IAAI,EAAE,WAAW,GAAG,CAAC,EAAE,CAAK;gCACrG,WAAK,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,CAAC,GAAG,EAAE,KAAK,EAAE,QAAQ,CAAC,GAAG,EAAE,IAC/E,KAAK,CAAC,IAAI,EAAE,QAAQ,CAAC,WAAW,EAAE,IAAI,UAAU,KAAK,CAAC,IAAI,EAAE,WAAW,GAAG,CAAC,EAAE,CAC1E,CACF,CACP;4BACA,KAAK,EAAE,OAAO,IAAI,CACjB;gCACE,SAAG,KAAK,EAAE,EAAE,KAAK,EAAE,QAAQ,CAAC,GAAG,EAAE,IAAG,KAAK,CAAC,IAAI,EAAE,IAAI,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,eAAe,IAAI,KAAK,EAAE,OAAO,EAAE,KAAK,GAAG,CAAC,EAAE,CAAK;gCAC5H,WAAK,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,CAAC,GAAG,EAAE,KAAK,EAAE,QAAQ,CAAC,GAAG,EAAE,IAC/E,KAAK,CAAC,WAAW,CACd,CACL,CACJ,CACG,CACF,CACP,CAAC;gBACJ,CAAC,CAAC,CACE,CACP,CACI,CACR,CAAC;IACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\nimport { ValidationError } from '../../types/ValidationError';\n\n@Component({\n tag: 'ls-validation-tag',\n styleUrl: 'ls-validation-tag.css',\n shadow: true,\n})\nexport class LsValidationTag {\n @Prop({ mutable: true }) status: string = 'Invalid';\n @Prop({ mutable: true }) validationErrors: ValidationError[] = [];\n @Prop({ mutable: true }) isExpanded: boolean = false;\n\n render() {\n return (\n <Host>\n <div\n class={`valid-label ${this.validationErrors.length === 0 ? 'valid' : 'invalid'}`}\n onClick={this.validationErrors.length && (() => (this.isExpanded = !this.isExpanded))}\n >\n {this.validationErrors.length === 0 ? 'Ready to Send' : `Requires Fields`}\n {this.validationErrors.length > 0 && <div class={'field-counter'}>{this.validationErrors.length}</div>}\n {this.validationErrors.length > 0 && (\n <ls-icon name={this.isExpanded ? 'chevron-up' : 'chevron-down'} style={{ cursor: 'pointer', scale: '0.60', margin: '0 -0.25rem' }} />\n )}\n </div>\n {this.isExpanded && this.validationErrors.length !== 0 && (\n <div class={'field-dropdown'}>\n <div class={'dropdown-header'}>\n <h2>~~Signature~~ Fields Required</h2>\n <p>\n {this.validationErrors.length} {this.validationErrors.length === 1 ? 'Recipient needs a Signature Field' : 'Recipients need Signature Fields'} placed for them\n </p>\n </div>\n {this.validationErrors.map((field, idx) => {\n const signerIndex = field?.role?.signerIndex ? field?.role?.signerIndex % 100 : null;\n const pallette = defaultRolePalette[signerIndex \|\| field?.element?.signer \|\| 0];\n\n return (\n <div\n key={idx}\n class={'required-field'}\n style={{\n '--field-background': pallette.s10,\n '--field-border-color': pallette.s10,\n '--field-background-hover': pallette.s20,\n '--field-text-color': pallette.s70,\n '--field-text-color-hover': pallette.s80,\n '--field-border-color-hover': pallette.s60,\n }}\n >\n <div class={'required-field-items-left'}>\n <div class={'dot'} style={{ background: pallette.s60 }} />\n {field?.role && (\n <div class={'required-field-items-left'}>\n <p style={{ color: pallette.s80 }}>{field.role?.name \|\| `Signer ${field?.role?.signerIndex + 1}`}</p>\n <div class={'role-label'} style={{ background: pallette.s30, color: pallette.s70 }}>\n {field.role?.roleType.toLowerCase() \|\| `Signer ${field.role?.signerIndex + 1}`}\n </div>\n </div>\n )}\n {field?.element && (\n <>\n <p style={{ color: pallette.s80 }}>{field.role?.name \|\| `${field.element.formElementType} ${field?.element?.label + 1}`}</p>\n <div class={'role-label'} style={{ background: pallette.s30, color: pallette.s70 }}>\n {field.description}\n </div>\n </>\n )}\n </div>\n </div>\n );\n })}\n </div>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ls-validation-tag.js","sourceRoot":"","sources":["../../../src/components/ls-validation-tag/ls-validation-tag.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\nimport { ValidationError } from '../../types/ValidationError';\n\n@Component({\n tag: 'ls-validation-tag',\n styleUrl: 'ls-validation-tag.css',\n shadow: true,\n})\nexport class LsValidationTag {\n @Prop({ mutable: true }) status: string = 'Invalid';\n @Prop({ mutable: true }) validationErrors: ValidationError[] = [];\n @Prop({ mutable: true }) isExpanded: boolean = false;\n @Prop() showDropDown: boolean = true;\n\n render() {\n return (\n <Host>\n <div\n class={`valid-label ${this.validationErrors.length === 0 ? 'valid' : 'invalid'}`}\n onClick={this.validationErrors.length && (() => (this.isExpanded = !this.isExpanded))}\n >\n {this.validationErrors.length === 0 ? 'Ready to Send' : `Requires Fields`}\n {this.validationErrors.length > 0 && <div class={'field-counter'}>{this.validationErrors.length}</div>}\n {this.validationErrors.length > 0 && this.showDropDown && (\n <ls-icon name={this.isExpanded ? 'chevron-up' : 'chevron-down'} style={{ cursor: 'pointer', scale: '0.60', margin: '0 -0.25rem' }} />\n )}\n </div>\n {this.isExpanded && this.validationErrors.length !== 0 && this.showDropDown && (\n <div class={'field-dropdown'}>\n <div class={'dropdown-header'}>\n <h2>Fields Required</h2>\n <p>\n {this.validationErrors.length} {this.validationErrors.length === 1 ? 'Recipient needs a Signature Field' : 'Recipients need Signature Fields'} placed for them\n </p>\n </div>\n {this.validationErrors.map((field, idx) => {\n const signerIndex = field?.role?.signerIndex ? field?.role?.signerIndex % 100 : null;\n const pallette = defaultRolePalette[signerIndex \|\| field?.element?.signer \|\| 0];\n\n return (\n <div\n key={idx}\n class={'required-field'}\n style={{\n '--field-background': pallette.s10,\n '--field-border-color': pallette.s10,\n '--field-background-hover': pallette.s20,\n '--field-text-color': pallette.s70,\n '--field-text-color-hover': pallette.s80,\n '--field-border-color-hover': pallette.s60,\n }}\n >\n <div class={'required-field-items-left'}>\n <div class={'dot'} style={{ background: pallette.s60 }} />\n {field?.role && (\n <div class={'required-field-items-left'}>\n <p style={{ color: pallette.s80 }}>{field.role?.name \|\| `Signer ${field?.role?.signerIndex + 1}`}</p>\n <div class={'role-label'} style={{ background: pallette.s30, color: pallette.s70 }}>\n {field.role?.roleType.toLowerCase() \|\| `Signer ${field.role?.signerIndex + 1}`}\n </div>\n </div>\n )}\n {field?.element && (\n <>\n <p style={{ color: pallette.s80 }}>{field.role?.name \|\| `${field.element.formElementType} ${field?.element?.label + 1}`}</p>\n <div class={'role-label'} style={{ background: pallette.s30, color: pallette.s70 }}>\n {field.description}\n </div>\n </>\n )}\n </div>\n </div>\n );\n })}\n </div>\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/components/index.js CHANGED Viewed

@@ -1,4 +1,4 @@
-export { g as getAssetPath, r as render, s as setAssetPath, a as setNonce, b as setPlatformOptions } from './p-BvHSBTD8.js';
+export { g as getAssetPath, r as render, s as setAssetPath, a as setNonce, b as setPlatformOptions } from './p-CEhCcP_A.js';
 function format(first, middle, last) {
     return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');

package/dist/components/ls-compose-manager.d.ts ADDED Viewed

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

package/dist/components/ls-compose-manager.js ADDED Viewed

@@ -0,0 +1,47 @@
+import { p as proxyCustomElement, H, h, c as Host } from './p-CEhCcP_A.js';
+const lsComposeManagerCss = ":host{display:block}";
+const LsComposeManager$1 = /*@__PURE__*/ proxyCustomElement(class LsComposeManager extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+    }
+    /**
+     * The base template information (as JSON).
+     * {LSApiTemplate}
+     */
+    template;
+    render() {
+        return (h(Host, { key: '1dba0753733a9e01b75a9ede154ded5452da804b' }, h("div", { key: '74dc44ced7220ad9b0b5cc33faa0dc529f023068', class: "ls-editor-infobox" }, h("h2", { key: '9333d5ae196bbf0245f7ad45f54756e70e1bc7a6', class: "toolbox-section-title" }, "Recipient Fields"), h("p", { key: '4e1bb1fc4a733718fb1a1777a9d47dfc4bfd2bef', class: "toolbox-section-description" }, "Select and Click to place Signature fields where on the Document.")), h("div", { key: '30a4c2560eb66751f30da898598d4a867b423e21', class: "participant-list" }, this.template &&
+            this.template?.roles.map(() => {
+                return (h("div", null));
+            })), h("slot", { key: '51d70c91fb2eb7ebd2a0605797dacbcd03f0baa8' })));
+    }
+    static get style() { return lsComposeManagerCss; }
+}, [257, "ls-compose-manager", {
+        "template": [16]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ls-compose-manager"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ls-compose-manager":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, LsComposeManager$1);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+const LsComposeManager = LsComposeManager$1;
+const defineCustomElement = defineCustomElement$1;
+export { LsComposeManager, defineCustomElement };
+//# sourceMappingURL=ls-compose-manager.js.map
+//# sourceMappingURL=ls-compose-manager.js.map

package/dist/components/ls-compose-manager.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"ls-compose-manager.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,sBAAsB;;MCSrCA,kBAAgB,iBAAAC,kBAAA,CAAA,MAAA,gBAAA,SAAAC,CAAA,CAAA;;;;;;AAE3B;;;AAGG;AACK,IAAA,QAAQ;IAEhB,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACD,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAA,EAC9B,CAAI,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,uBAAuB,EAAsB,EAAA,kBAAA,CAAA,EACvD,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,KAAK,EAAC,6BAA6B,EAAA,EAAA,mEAAA,CAAsE,CACxG,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,kBAAkB,EAC1B,EAAA,IAAI,CAAC,QAAQ;YACZ,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC,GAAG,CAAC,MAAK;gBAC5B,QACE,CAAS,CAAA,KAAA,EAAA,IAAA,CAAA;AAEb,aAAC,CAAC,CACA,EACN,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["LsComposeManager","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-compose-manager/ls-compose-manager.css?tag=ls-compose-manager&encapsulation=shadow","src/components/ls-compose-manager/ls-compose-manager.tsx"],"sourcesContent":[":host {\n display: block;\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport { LSApiTemplate } from '../../types/LSApiTemplate';\n\n\n@Component({\n tag: 'ls-compose-manager',\n styleUrl: 'ls-compose-manager.css',\n shadow: true,\n})\nexport class LsComposeManager {\n\n /**\n * The base template information (as JSON).\n * {LSApiTemplate}\n */\n @Prop() template: LSApiTemplate;\n\n render() {\n return (\n <Host>\n <div class=\"ls-editor-infobox\">\n <h2 class=\"toolbox-section-title\">Recipient Fields</h2>\n <p class=\"toolbox-section-description\">Select and Click to place Signature fields where on the Document.</p>\n </div>\n <div class=\"participant-list\">\n {this.template &&\n this.template?.roles.map(() => {\n return (\n <div />\n );\n })}\n </div>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/ls-document-options.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { L as LsDocumentOptions$1, d as defineCustomElement$1 } from './p-DxIsh8n6.js';
+import { L as LsDocumentOptions$1, d as defineCustomElement$1 } from './p-BnRYK-C4.js';
 const LsDocumentOptions = LsDocumentOptions$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/ls-document-viewer.js CHANGED Viewed

@@ -1,46 +1,46 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-BvHSBTD8.js';
-import { a as alter, o as oob, f as findDimensions, r as recalculateCoordinates, b as findIn, u as updateTemplate, d as defineCustomElement$F, m as matchData, v as validate, c as moveField, g as getApiType, e as addField, h as getTemplate } from './p-DigkV_H3.js';
+import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-CEhCcP_A.js';
+import { a as alter, o as oob, f as findDimensions, r as recalculateCoordinates, b as findIn, u as updateTemplate, d as defineCustomElement$F, m as matchData, v as validate, c as moveField, g as getApiType, e as addField, h as getTemplate } from './p-CAbrMIbN.js';
 import { a as attachAllTooltips } from './p-Cb8nDMs-.js';
-import { d as defineCustomElement$G } from './p-DxIsh8n6.js';
-import { d as defineCustomElement$E } from './p-DPHDQvBy.js';
-import { d as defineCustomElement$D } from './p-DRlasxvX.js';
-import { d as defineCustomElement$C } from './p-C3Yf2XxL.js';
-import { d as defineCustomElement$B } from './p-BxdoHLJe.js';
-import { d as defineCustomElement$A } from './p-Ccn3ZZcu.js';
-import { d as defineCustomElement$z } from './p-DFgVwcWo.js';
-import { d as defineCustomElement$y } from './p-Jxy3zvjl.js';
-import { d as defineCustomElement$x } from './p-B-CwRcyM.js';
-import { d as defineCustomElement$w } from './p-CesULiVv.js';
-import { d as defineCustomElement$v } from './p-C26k_ME7.js';
-import { d as defineCustomElement$u } from './p-Pb_M5CHe.js';
-import { d as defineCustomElement$t } from './p-sXbu_0hu.js';
-import { d as defineCustomElement$s } from './p-ByytASxI.js';
-import { d as defineCustomElement$r } from './p-CoSuNdfC.js';
-import { d as defineCustomElement$q } from './p-DP1YK_3k.js';
-import { d as defineCustomElement$p } from './p-CBWx8ct9.js';
-import { d as defineCustomElement$o } from './p-_fAfVUvN.js';
-import { d as defineCustomElement$n } from './p-Dn74AhFZ.js';
-import { d as defineCustomElement$m } from './p-_TQhquWF.js';
-import { d as defineCustomElement$l } from './p-CAkGTlBm.js';
-import { d as defineCustomElement$k } from './p-WkfNRHiN.js';
-import { d as defineCustomElement$j } from './p-HL1D4YSy.js';
-import { d as defineCustomElement$i } from './p-CIaA9Qz9.js';
-import { d as defineCustomElement$h } from './p-D8-qPGsJ.js';
-import { d as defineCustomElement$g } from './p-Cvpba_Hj.js';
-import { d as defineCustomElement$f } from './p-DdA-gazu.js';
-import { d as defineCustomElement$e } from './p-ChsJHskx.js';
-import { d as defineCustomElement$d } from './p-DXhpjcQC.js';
-import { d as defineCustomElement$c } from './p-DmRC_Wu_.js';
-import { d as defineCustomElement$b } from './p-C0DxZPf7.js';
-import { d as defineCustomElement$a } from './p-BKpv-kC8.js';
-import { d as defineCustomElement$9 } from './p-D1G_SpA3.js';
-import { d as defineCustomElement$8 } from './p-DmpTMpIK.js';
-import { d as defineCustomElement$7 } from './p-DCgwsmkK.js';
-import { d as defineCustomElement$6 } from './p-DYigxUng.js';
-import { d as defineCustomElement$5 } from './p-BMoeVwvV.js';
-import { d as defineCustomElement$4 } from './p-CEfaqMjm.js';
-import { d as defineCustomElement$3 } from './p-CZoubBus.js';
-import { d as defineCustomElement$2 } from './p-Dns9yEdO.js';
+import { d as defineCustomElement$G } from './p-BnRYK-C4.js';
+import { d as defineCustomElement$E } from './p-BKPLevlT.js';
+import { d as defineCustomElement$D } from './p-IlkS4czy.js';
+import { d as defineCustomElement$C } from './p-Djqb_4PL.js';
+import { d as defineCustomElement$B } from './p-DrD5JKw9.js';
+import { d as defineCustomElement$A } from './p-CWMW0nzH.js';
+import { d as defineCustomElement$z } from './p-XF3M9gAr.js';
+import { d as defineCustomElement$y } from './p-CNX4llIr.js';
+import { d as defineCustomElement$x } from './p-CciiwtyT.js';
+import { d as defineCustomElement$w } from './p-yu8Gmj9y.js';
+import { d as defineCustomElement$v } from './p-CAWxK_LI.js';
+import { d as defineCustomElement$u } from './p-BvIKgXkH.js';
+import { d as defineCustomElement$t } from './p-DkCVXmg3.js';
+import { d as defineCustomElement$s } from './p-DfYmuFSx.js';
+import { d as defineCustomElement$r } from './p-BphT81GV.js';
+import { d as defineCustomElement$q } from './p-CeKcOUyM.js';
+import { d as defineCustomElement$p } from './p-B7dTg-FF.js';
+import { d as defineCustomElement$o } from './p-hHXffFw5.js';
+import { d as defineCustomElement$n } from './p-CSmx-jJT.js';
+import { d as defineCustomElement$m } from './p-B1U2Ui7F.js';
+import { d as defineCustomElement$l } from './p-1dvcNcdF.js';
+import { d as defineCustomElement$k } from './p-wgy1HDlb.js';
+import { d as defineCustomElement$j } from './p-D-OtQhJz.js';
+import { d as defineCustomElement$i } from './p-C7ohAVHE.js';
+import { d as defineCustomElement$h } from './p-BCoqHTq9.js';
+import { d as defineCustomElement$g } from './p-CdEPt9fv.js';
+import { d as defineCustomElement$f } from './p-CWfyjOto.js';
+import { d as defineCustomElement$e } from './p-gE1FA92I.js';
+import { d as defineCustomElement$d } from './p-sqcHMrnp.js';
+import { d as defineCustomElement$c } from './p-DKbeIqEX.js';
+import { d as defineCustomElement$b } from './p-BNC69LYf.js';
+import { d as defineCustomElement$a } from './p-C4YY0EyH.js';
+import { d as defineCustomElement$9 } from './p-Wuj0cujc.js';
+import { d as defineCustomElement$8 } from './p-Dk00ccBn.js';
+import { d as defineCustomElement$7 } from './p-5pLj6W__.js';
+import { d as defineCustomElement$6 } from './p-DZPnGx2N.js';
+import { d as defineCustomElement$5 } from './p-IpGJwBtp.js';
+import { d as defineCustomElement$4 } from './p-C28pfXKN.js';
+import { d as defineCustomElement$3 } from './p-XkANRt3Q.js';
+import { d as defineCustomElement$2 } from './p-BmEXSmLf.js';
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -24505,19 +24505,16 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
     modeHandler(_newMode, _oldMode) {
         if (_newMode === 'preview') {
             this.showtoolbar = false;
-            this.showtoolbox = false;
             this.showstatusbar = false;
             this.readonly = true;
         }
         else if (_newMode === 'editor') {
             this.showtoolbar = true;
-            this.showtoolbox = true;
             this.showstatusbar = true;
             this.readonly = false;
         }
         else if (_newMode === 'compose') {
             this.showtoolbar = true;
-            this.showtoolbox = true;
             this.showstatusbar = true;
             this.readonly = false;
         }
@@ -24542,10 +24539,10 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
      */
     displayTable = false;
     /**
-     * Whether the left hand toolbox is displayed.
-     * {boolean}
+     * Allows the selection of fields in the toolbox to be limited to a | (pipe) delimited list.
+     * {string}
      */
-    showtoolbox = false;
+    filterToolbox = null;
     /**
      * Whether the top toolbar is displayed.
      * {boolean}
@@ -24924,8 +24921,11 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
     componentDidLoad() {
         attachAllTooltips(this.component.shadowRoot);
     }
+    showTool(fieldFormType) {
+        return this.filterToolbox === null || this.filterToolbox.split('|').includes(fieldFormType);
+    }
     render() {
-        return (h(Host, { key: '39b2a1bd5d0d4db7c87040861ce1931f2b7483dc' }, h(h.Fragment, null, this.isLoading && h("ls-page-loader", { key: 'b7a6849536df3c66fa9e93d8fccbe80712aac1e5' }), h("div", { key: 'd494495a6ca72e9e4f404845b2d5a821f8a204ec', class: 'validation-tag-wrapper' }, h("ls-validation-tag", { key: 'b6c3c64e6692dc5dd4a876419fbd5ae8f4ccda37', validationErrors: this.validationErrors })), h("div", { key: 'f098651e16f3140342942729b3b6ca03b8caba2a', class: "page-header" }, h("p", { key: '392fe33aa0231d216191b2be88205a072392d4c3', class: "header-text-1" }, "Template Creation"), h("p", { key: '58925f464288b8f106caf2f272b3596a101267b0' }, "/"), h("p", { key: '62e8869f014241be74443f4559a7069d0ab04ac5', class: "header-text-2" }, this._template?.title)), h("form", { key: '0958428ddd28950578106aac940404640817bb17', id: "ls-editor-form" }, this.showtoolbox === true ? (h("div", { id: "ls-left-box", class: "leftBox" }, h("div", { class: !this.selected || this.selected.length === 0 ? 'left-box-inner' : 'hidden' }, h("ls-feature-column", { onManage: manager => {
+        return (h(Host, { key: 'd8ce0d70a58af99fdd2c409e4054b58b64e3cb03' }, h(h.Fragment, null, this.isLoading && h("ls-page-loader", { key: 'ab5e54ba96698f1013ecb180d238514722a64576' }), h("div", { key: '13ca00d49a5e90ccd87fd3848596b00da38f4de5', class: 'validation-tag-wrapper' }, h("ls-validation-tag", { key: '95f916a6ab5408b5464d041665d070cb03dd2a38', validationErrors: this.validationErrors, showDropDown: this.mode === "editor" })), h("div", { key: '3c4ab91e87f408ed58431b1f61d65598d82b302b', class: "page-header" }, h("p", { key: '9c83746dc708c3ce530530f853f89f7d048dc61c', class: "header-text-1" }, "Template Creation"), h("p", { key: 'bb7db7928e0116665762c8c9f4fa5dfc8490b86f' }, "/"), h("p", { key: 'b6e6c67e9f7078d792ec1fd52b0bb92035e5c30e', class: "header-text-2" }, this._template?.title)), h("form", { key: '5b4a2e3331860f327b4d027a6c4598ad5acf7a06', id: "ls-editor-form" }, this.mode !== "preview" ? (h("div", { id: "ls-left-box", class: "leftBox" }, h("div", { class: !this.selected || this.selected.length === 0 ? 'left-box-inner' : 'hidden' }, h("ls-feature-column", { mode: this.mode, onManage: manager => {
                 if (manager.detail === 'document') {
                     var documentManager = this.component.shadowRoot.getElementById('ls-document-options');
                     documentManager.template = this._template;
@@ -24935,10 +24935,10 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
                     participantManager.template = this._template;
                 }
                 this.manager = manager.detail;
-            } }), h("div", { id: "ls-toolbox", class: this.manager === 'toolbox' ? 'toolbox' : 'hidden' }, h("div", { class: "ls-editor-infobox" }, h("h2", { class: "toolbox-section-title" }, "Participant Fields"), h("p", { class: "toolbox-section-description" }, "Select and Click to place Signature fields where you\u2019d like on the Document.")), h("div", { class: "fields-box" }, h("ls-toolbox-field", { elementType: "signature", formElementType: "signature", label: "Signature", defaultHeight: 27, defaultWidth: 120, validation: 0, icon: "signature", tooltip: "Use this field to collect Signatures from Participants", signer: this.signer, style: this.signer > 0 ? { display: 'block' } : { display: 'none' } }), h("ls-toolbox-field", { elementType: "auto sign", formElementType: "auto sign", label: "Auto Sign", defaultHeight: 27, defaultWidth: 120, validation: 3000, icon: "auto-sign", tooltip: "Auto-Sign lets Senders add a Signature to the Document that will be automatically applied upon Sending", signer: this.signer, style: this.signer === 0 ? { display: 'block' } : { display: 'none' } }), h("ls-toolbox-field", { elementType: "text", formElementType: "text", label: "Text", defaultHeight: 27, defaultWidth: 100, validation: 0, icon: "text", tooltip: "A field for collecting any plain text values such as: names, addresses or descriptions", signer: this.signer }), this.signer > 0 && (h("ls-toolbox-field", { elementType: "signing date", formElementType: "signing date", label: "Signing Date", defaultHeight: 27, defaultWidth: 120, validation: 30, icon: "auto-date", tooltip: "Automatically inserts the date upon completion by the assigned Participant", signer: this.signer })), h("ls-toolbox-field", { elementType: "date", formElementType: "date", label: "Date", defaultHeight: 27, defaultWidth: 80, validation: 2, icon: "calender", tooltip: "A field for collecting dates with built-in date formatting options", signer: this.signer }), h("ls-toolbox-field", { elementType: "email", formElementType: "email", label: "Email", defaultHeight: 27, defaultWidth: 120, validation: 1, icon: "at-symbol", tooltip: "A Field to only accept entries formatted as an email address (e.g., example@example.com)", signer: this.signer }), h("ls-toolbox-field", { elementType: "initials", formElementType: "initials", label: "Initials", defaultHeight: 27, defaultWidth: 120, validation: 2000, icon: "initials", tooltip: "Use this field anywhere Participants are required to Initial your document", signer: this.signer }), h("ls-toolbox-field", { elementType: "number", formElementType: "number", label: "Number", defaultHeight: 27, defaultWidth: 80, validation: 50, icon: "hashtag", tooltip: "A Field to only accept entries in numerical format. Additional validations include character limit (1 to 12 digits), and currency format (2 decimal places)", signer: this.signer }), h("ls-toolbox-field", { elementType: "dropdown", formElementType: "dropdown", label: "Dropdown", defaultHeight: 27, defaultWidth: 80, validation: 20, icon: "dropdown", tooltip: "Use this field to create custom dropdown menus in your document, or place one of our handy presets for countries or prefixes", signer: this.signer }), h("ls-toolbox-field", { elementType: "checkbox", formElementType: "checkbox", label: "Checkbox", defaultHeight: 27, defaultWidth: 27, validation: 25, icon: "check", tooltip: "Places a checkbox on your document. Handy for T&Cs or  \u2714/\u2717 sections", signer: this.signer }), this.signer > 0 && (h("ls-toolbox-field", { elementType: "regex", formElementType: "regex", label: "Regex", defaultHeight: 27, defaultWidth: 120, validation: 93, icon: "code", tooltip: "Need a specific validation? Use this field to enter a custom RegEx and have Participants enter exactly what you need", signer: this.signer })), this.signer > 0 && (h("ls-toolbox-field", { elementType: "image", formElementType: "image", label: "Image", defaultHeight: 27, defaultWidth: 120, validation: 90, icon: "photograph", tooltip: "Use when you need Participants to upload their own images during the signing process", signer: this.signer })), this.signer > 0 && (h("ls-toolbox-field", { elementType: "file", formElementType: "file", label: "File", defaultHeight: 27, defaultWidth: 120, validation: 74, icon: "upload", tooltip: "Use when you need Participants to upload their own documents during the signing process", signer: this.signer })), this.signer > 0 && (h("ls-toolbox-field", { elementType: "drawn", formElementType: "drawn", label: "Drawn", defaultHeight: 120, defaultWidth: 120, validation: 90, icon: "pencil", tooltip: "Allow users to draw on the document using their mouse or touchscreen", signer: this.signer })))), h("ls-participant-manager", { id: "ls-participant-manager", class: this.manager === 'participant' ? 'toolbox' : 'hidden', editor: this }), h("ls-document-options", { id: "ls-document-options", class: this.manager === 'document' ? 'toolbox' : 'hidden' })), !this.displayTable && (h("div", { class: this.selected.length > 0 ? 'field-properties-outer' : 'hidden' }, h("div", { class: 'properties-header' }, h("div", { class: 'properties-header-icon' }, h("ls-icon", { name: "pre-filled-content" })), h("h1", { class: 'properties-header-title' }, "Field Properties"), h("button", { class: 'tertiaryGrey', onClick: e => {
+            } }), h("div", { id: "ls-toolbox", class: this.manager === 'toolbox' ? 'toolbox' : 'hidden' }, h("div", { class: "ls-editor-infobox" }, h("h2", { class: "toolbox-section-title" }, "Participant Fields"), h("p", { class: "toolbox-section-description" }, "Select and Click to place Signature fields where you\u2019d like on the Document.")), h("div", { class: "fields-box" }, this.signer > 0 && this.showTool('signature') && (h("ls-toolbox-field", { elementType: "signature", formElementType: "signature", label: "Signature", defaultHeight: 27, defaultWidth: 120, validation: 0, icon: "signature", tooltip: "Use this field to collect Signatures from Participants", signer: this.signer })), this.signer === 0 && this.showTool('auto sign') && (h("ls-toolbox-field", { elementType: "auto sign", formElementType: "auto sign", label: "Auto Sign", defaultHeight: 27, defaultWidth: 120, validation: 3000, icon: "auto-sign", tooltip: "Auto-Sign lets Senders add a Signature to the Document that will be automatically applied upon Sending", signer: this.signer })), this.showTool('text') && (h("ls-toolbox-field", { elementType: "text", formElementType: "text", label: "Text", defaultHeight: 27, defaultWidth: 100, validation: 0, icon: "text", tooltip: "A field for collecting any plain text values such as: names, addresses or descriptions", signer: this.signer })), this.signer > 0 && this.showTool('signing date') && (h("ls-toolbox-field", { elementType: "signing date", formElementType: "signing date", label: "Signing Date", defaultHeight: 27, defaultWidth: 120, validation: 30, icon: "auto-date", tooltip: "Automatically inserts the date upon completion by the assigned Participant", signer: this.signer })), this.showTool('date') && (h("ls-toolbox-field", { elementType: "date", formElementType: "date", label: "Date", defaultHeight: 27, defaultWidth: 80, validation: 2, icon: "calender", tooltip: "A field for collecting dates with built-in date formatting options", signer: this.signer })), this.showTool('email') && (h("ls-toolbox-field", { elementType: "email", formElementType: "email", label: "Email", defaultHeight: 27, defaultWidth: 120, validation: 1, icon: "at-symbol", tooltip: "A Field to only accept entries formatted as an email address (e.g., example@example.com)", signer: this.signer })), this.showTool('initials') && (h("ls-toolbox-field", { elementType: "initials", formElementType: "initials", label: "Initials", defaultHeight: 27, defaultWidth: 120, validation: 2000, icon: "initials", tooltip: "Use this field anywhere Participants are required to Initial your document", signer: this.signer })), this.showTool('number') && (h("ls-toolbox-field", { elementType: "number", formElementType: "number", label: "Number", defaultHeight: 27, defaultWidth: 80, validation: 50, icon: "hashtag", tooltip: "A Field to only accept entries in numerical format. Additional validations include character limit (1 to 12 digits), and currency format (2 decimal places)", signer: this.signer })), this.showTool('dropdown') && (h("ls-toolbox-field", { elementType: "dropdown", formElementType: "dropdown", label: "Dropdown", defaultHeight: 27, defaultWidth: 80, validation: 20, icon: "dropdown", tooltip: "Use this field to create custom dropdown menus in your document, or place one of our handy presets for countries or prefixes", signer: this.signer })), this.showTool('checkbox') && (h("ls-toolbox-field", { elementType: "checkbox", formElementType: "checkbox", label: "Checkbox", defaultHeight: 27, defaultWidth: 27, validation: 25, icon: "check", tooltip: "Places a checkbox on your document. Handy for T&Cs or  \u2714/\u2717 sections", signer: this.signer })), this.signer > 0 && this.showTool('regex') && (h("ls-toolbox-field", { elementType: "regex", formElementType: "regex", label: "Regex", defaultHeight: 27, defaultWidth: 120, validation: 93, icon: "code", tooltip: "Need a specific validation? Use this field to enter a custom RegEx and have Participants enter exactly what you need", signer: this.signer })), this.signer > 0 && this.showTool('image') && (h("ls-toolbox-field", { elementType: "image", formElementType: "image", label: "Image", defaultHeight: 27, defaultWidth: 120, validation: 90, icon: "photograph", tooltip: "Use when you need Participants to upload their own images during the signing process", signer: this.signer })), this.signer > 0 && this.showTool('file') && (h("ls-toolbox-field", { elementType: "file", formElementType: "file", label: "File", defaultHeight: 27, defaultWidth: 120, validation: 74, icon: "upload", tooltip: "Use when you need Participants to upload their own documents during the signing process", signer: this.signer })), this.signer > 0 && this.showTool('drawn') && (h("ls-toolbox-field", { elementType: "drawn", formElementType: "drawn", label: "Drawn", defaultHeight: 120, defaultWidth: 120, validation: 90, icon: "pencil", tooltip: "Allow users to draw on the document using their mouse or touchscreen", signer: this.signer })))), h("ls-participant-manager", { id: "ls-participant-manager", class: this.manager === 'participant' ? 'toolbox' : 'hidden', editor: this }), h("ls-document-options", { id: "ls-document-options", class: this.manager === 'document' ? 'toolbox' : 'hidden' })), !this.displayTable && (h("div", { class: this.selected.length > 0 ? 'field-properties-outer' : 'hidden' }, h("div", { class: 'properties-header' }, h("div", { class: 'properties-header-icon' }, h("ls-icon", { name: "pre-filled-content" })), h("h1", { class: 'properties-header-title' }, "Field Properties"), h("button", { class: 'tertiaryGrey', onClick: e => {
                 this.selected = [];
                 e.preventDefault();
-            }, "data-tooltip": "Close Properties Panel" }, h("ls-icon", { name: "x", size: "20" }))), h("ls-field-properties", { id: "my-field-panel" }), h("slot", null))))) : (h(h.Fragment, null)), h("ls-toolbar", { key: '7d13b89481e924a7f6523986528dcf27895add92', id: "ls-toolbar", template: this._template, editor: this, groupInfo: this.groupInfo }), h("div", { key: 'fe45c06a7d1e08b3ccb3b74a6935e70fedaeb34f', id: "ls-mid-area" }, h("div", { key: '5fbc5d27772a3843605c40ffbdd0c170931593c6', class: 'document-frame-wrapper', id: "document-frame-wrapper" }, h("div", { key: 'ccefa397f24b39c7a8aaf591fc946ebe4a29e917', id: "ls-document-frame" }, h("canvas", { key: '22143fcbb6f25c2380b96239f02596e08ce698a7', id: "pdf-canvas", class: this.displayTable || this.isLoading ? 'hidden' : '' }), h("ls-editor-table", { key: '44583076450e41e25f93444c3be95686ebf7cfd6', editor: this, class: this.displayTable ? '' : 'hidden' }), h("div", { key: '53033fd56beea01dc1666b05ba957f1a43f2f419', id: "ls-box-selector" }))), h("ls-statusbar", { key: '0458d3dc9740703c93f34ac095e1cee566bc561f', editor: this, page: this.pageNum, pageCount: this.pageCount })))), h("ls-tooltip", { key: '61ac52fbee6e14d82fa705fb5f565488e86feae8', id: "ls-tooltip-master" })));
+            }, "data-tooltip": "Close Properties Panel" }, h("ls-icon", { name: "x", size: "20" }))), h("ls-field-properties", { id: "my-field-panel" }), h("slot", null))))) : (h(h.Fragment, null)), h("ls-toolbar", { key: 'a6d8ef8362453c0b506bf15ef6e81ed28390a035', id: "ls-toolbar", template: this._template, editor: this, groupInfo: this.groupInfo }), h("div", { key: '2f087618c9a6459debbf38690f9ce2d936b6e7d3', id: "ls-mid-area" }, h("div", { key: 'a7883f796dcaa17d811ea02b3bf94dedd8460b98', class: 'document-frame-wrapper', id: "document-frame-wrapper" }, h("div", { key: '44dd3294c9f2fbd37e7237f4fa6cf2177d5fa997', id: "ls-document-frame" }, h("canvas", { key: 'e0c972f5f70a103c6fa7e2a7ae478b75b717d67e', id: "pdf-canvas", class: this.displayTable || this.isLoading ? 'hidden' : '' }), h("ls-editor-table", { key: 'f22926e764e4f0c13dff4e95777bf27adf5ced77', editor: this, class: this.displayTable ? '' : 'hidden' }), h("div", { key: '45a5db8db4fb77eef714516d292a40c884e46910', id: "ls-box-selector" }))), h("ls-statusbar", { key: '7a1ad3aa1c76b5287b43b91798cb3f89289267bd', editor: this, page: this.pageNum, pageCount: this.pageCount })))), h("ls-tooltip", { key: 'c4f1614420969b565b2962c385ff042df8e43e0d', id: "ls-tooltip-master" })));
     }
     static get watchers() { return {
         "mode": ["modeHandler"],
@@ -24960,7 +24960,7 @@ const LsDocumentViewer$1 = /*@__PURE__*/ proxyCustomElement(class LsDocumentView
         "mode": [1],
         "manager": [1025],
         "displayTable": [1028, "display-table"],
-        "showtoolbox": [4],
+        "filterToolbox": [1, "filter-toolbox"],
         "showtoolbar": [4],
         "showstatusbar": [4],
         "showpagepreview": [4],