legalesign-document-viewer 0.8.1 → 0.8.3
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.
- package/dist/cjs/ls-document-options_45.cjs.entry.js +20 -18
- package/dist/cjs/ls-title-input.cjs.entry.js +1 -1
- package/dist/collection/components/ls-document-viewer/ls-document-viewer.js +5 -3
- package/dist/collection/components/ls-document-viewer/ls-document-viewer.js.map +1 -1
- package/dist/collection/components/ls-statusbar/ls-statusbar.css +9 -0
- package/dist/collection/components/ls-statusbar/ls-statusbar.js +3 -3
- package/dist/collection/components/ls-statusbar/ls-statusbar.js.map +1 -1
- package/dist/collection/components/ls-title-input/ls-title-input.js +1 -1
- package/dist/collection/components/ls-toggle/ls-toggle.js +2 -2
- package/dist/collection/components/ls-toolbar/ls-toolbar.js +1 -1
- package/dist/collection/components/ls-toolbox-field/ls-toolbox-field.js +3 -3
- package/dist/collection/components/ls-tooltip/ls-tooltip.js +1 -1
- package/dist/collection/components/ls-validation-manager/ls-validation-manager.js +2 -2
- package/dist/collection/components/ls-validation-tag/ls-validation-tag.js +2 -2
- package/dist/components/ls-document-options.js +1 -1
- package/dist/components/ls-document-viewer.js +36 -34
- package/dist/components/ls-document-viewer.js.map +1 -1
- package/dist/components/ls-feature-column.js +1 -1
- package/dist/components/ls-field-alignment.js +1 -1
- package/dist/components/ls-field-content.js +1 -1
- package/dist/components/ls-field-dimensions.js +1 -1
- package/dist/components/ls-field-distribute.js +1 -1
- package/dist/components/ls-field-format.js +1 -1
- package/dist/components/ls-field-placement.js +1 -1
- package/dist/components/ls-field-properties-autosign.js +1 -1
- package/dist/components/ls-field-properties-date.js +1 -1
- package/dist/components/ls-field-properties-dropdown.js +5 -5
- package/dist/components/ls-field-properties-email.js +1 -1
- package/dist/components/ls-field-properties-file.js +1 -1
- package/dist/components/ls-field-properties-general.js +1 -1
- package/dist/components/ls-field-properties-image.js +1 -1
- package/dist/components/ls-field-properties-multiple.js +1 -1
- package/dist/components/ls-field-properties-number.js +1 -1
- package/dist/components/ls-field-properties-signature.js +1 -1
- package/dist/components/ls-field-properties-text.js +1 -1
- package/dist/components/ls-field-properties.js +1 -1
- package/dist/components/ls-field-size.js +1 -1
- package/dist/components/ls-helper-bar.js +1 -1
- package/dist/components/ls-participant-card.js +1 -1
- package/dist/components/ls-participant-manager.js +1 -1
- package/dist/components/ls-recipient-card.js +1 -1
- package/dist/components/ls-statusbar.js +1 -1
- package/dist/components/ls-title-input.js +1 -1
- package/dist/components/ls-toggle.js +1 -1
- package/dist/components/ls-toolbar.js +1 -1
- package/dist/components/ls-toolbox-field.js +1 -1
- package/dist/components/ls-tooltip.js +1 -1
- package/dist/components/ls-validation-manager.js +1 -1
- package/dist/components/ls-validation-tag.js +1 -1
- package/dist/components/{p-UffBQXtF.js → p--qr5lGNY.js} +3 -3
- package/dist/components/{p-UffBQXtF.js.map → p--qr5lGNY.js.map} +1 -1
- package/dist/components/{p-CbSH7gJL.js → p-31_kIRrf.js} +4 -4
- package/dist/components/{p-CbSH7gJL.js.map → p-31_kIRrf.js.map} +1 -1
- package/dist/components/{p-BAymEMIj.js → p-7LDqIwha.js} +7 -7
- package/dist/components/{p-BAymEMIj.js.map → p-7LDqIwha.js.map} +1 -1
- package/dist/components/{p-DBZFz4Ni.js → p-B7KXdlje.js} +3 -3
- package/dist/components/{p-DBZFz4Ni.js.map → p-B7KXdlje.js.map} +1 -1
- package/dist/components/{p-B4_-Y3Tc.js → p-BJ7yOIyE.js} +3 -3
- package/dist/components/{p-B4_-Y3Tc.js.map → p-BJ7yOIyE.js.map} +1 -1
- package/dist/components/{p-D9j4pLd9.js → p-BKOeRUOu.js} +3 -3
- package/dist/components/{p-D9j4pLd9.js.map → p-BKOeRUOu.js.map} +1 -1
- package/dist/components/{p-DITPG6N0.js → p-BOAC0sYV.js} +7 -7
- package/dist/components/{p-DITPG6N0.js.map → p-BOAC0sYV.js.map} +1 -1
- package/dist/components/{p-T6MZpv4Y.js → p-BXfcykrF.js} +6 -6
- package/dist/components/{p-T6MZpv4Y.js.map → p-BXfcykrF.js.map} +1 -1
- package/dist/components/{p-R0F2oK5i.js → p-Bjme23Em.js} +7 -7
- package/dist/components/{p-R0F2oK5i.js.map → p-Bjme23Em.js.map} +1 -1
- package/dist/components/{p-Cx-QcGQg.js → p-Blb81186.js} +4 -4
- package/dist/components/{p-Cx-QcGQg.js.map → p-Blb81186.js.map} +1 -1
- package/dist/components/{p-DirhmWEt.js → p-Bn1chQoV.js} +3 -3
- package/dist/components/{p-DirhmWEt.js.map → p-Bn1chQoV.js.map} +1 -1
- package/dist/components/{p-pumCOAgo.js → p-Btdky3D0.js} +5 -5
- package/dist/components/{p-pumCOAgo.js.map → p-Btdky3D0.js.map} +1 -1
- package/dist/components/{p-DdAAJAZW.js → p-ByDuIxaT.js} +4 -4
- package/dist/components/{p-DdAAJAZW.js.map → p-ByDuIxaT.js.map} +1 -1
- package/dist/components/{p-enO8g-4z.js → p-C0XLyJU6.js} +4 -4
- package/dist/components/{p-enO8g-4z.js.map → p-C0XLyJU6.js.map} +1 -1
- package/dist/components/{p-Ch9RTQWk.js → p-C0tCxLWg.js} +3 -3
- package/dist/components/{p-Ch9RTQWk.js.map → p-C0tCxLWg.js.map} +1 -1
- package/dist/components/{p-DK0tSZn5.js → p-CGMmdPSj.js} +7 -7
- package/dist/components/{p-DK0tSZn5.js.map → p-CGMmdPSj.js.map} +1 -1
- package/dist/components/{p-Bw19bxna.js → p-CS2kp32x.js} +8 -8
- package/dist/components/p-CS2kp32x.js.map +1 -0
- package/dist/components/{p-Cjf_s_q3.js → p-CSaCBjPB.js} +9 -9
- package/dist/components/{p-Cjf_s_q3.js.map → p-CSaCBjPB.js.map} +1 -1
- package/dist/components/{p-CN4S8Tr6.js → p-D-Po_O4q.js} +3 -3
- package/dist/components/{p-CN4S8Tr6.js.map → p-D-Po_O4q.js.map} +1 -1
- package/dist/components/{p-BYUkB1P9.js → p-D0jShtlT.js} +7 -7
- package/dist/components/{p-BYUkB1P9.js.map → p-D0jShtlT.js.map} +1 -1
- package/dist/components/{p-W2Qt6RP_.js → p-D9_mPO8b.js} +7 -7
- package/dist/components/{p-W2Qt6RP_.js.map → p-D9_mPO8b.js.map} +1 -1
- package/dist/components/{p-CYMm2d62.js → p-DMouWW6g.js} +3 -3
- package/dist/components/{p-CYMm2d62.js.map → p-DMouWW6g.js.map} +1 -1
- package/dist/components/{p-BrZ4IiB4.js → p-DQwcm5uO.js} +20 -20
- package/dist/components/{p-BrZ4IiB4.js.map → p-DQwcm5uO.js.map} +1 -1
- package/dist/components/{p-faUZy676.js → p-DgBorjUn.js} +3 -3
- package/dist/components/{p-faUZy676.js.map → p-DgBorjUn.js.map} +1 -1
- package/dist/components/{p-CqoSApFn.js → p-DmB2p8tl.js} +3 -3
- package/dist/components/{p-CqoSApFn.js.map → p-DmB2p8tl.js.map} +1 -1
- package/dist/components/{p-BOCKD59H.js → p-Dvud8Dd4.js} +3 -3
- package/dist/components/{p-BOCKD59H.js.map → p-Dvud8Dd4.js.map} +1 -1
- package/dist/components/{p-CIqGtFUm.js → p-GWxxs_94.js} +7 -7
- package/dist/components/{p-CIqGtFUm.js.map → p-GWxxs_94.js.map} +1 -1
- package/dist/components/{p-mm_laW9q.js → p-HkpFYlqx.js} +4 -4
- package/dist/components/{p-mm_laW9q.js.map → p-HkpFYlqx.js.map} +1 -1
- package/dist/components/{p-Bd5hHfVU.js → p-_bLkvYzd.js} +4 -4
- package/dist/components/{p-Bd5hHfVU.js.map → p-_bLkvYzd.js.map} +1 -1
- package/dist/components/{p-CVmZ7Xxm.js → p-u1NMaOAu.js} +7 -7
- package/dist/components/{p-CVmZ7Xxm.js.map → p-u1NMaOAu.js.map} +1 -1
- package/dist/components/{p-CI3IFKqK.js → p-uTta1-6-.js} +6 -6
- package/dist/components/{p-CI3IFKqK.js.map → p-uTta1-6-.js.map} +1 -1
- package/dist/esm/ls-document-options_45.entry.js +20 -18
- package/dist/esm/ls-title-input.entry.js +1 -1
- package/dist/ls-document-viewer/ls-document-viewer.esm.js +1 -1
- package/dist/ls-document-viewer/{p-6674838a.entry.js → p-19b7c532.entry.js} +3 -3
- package/dist/ls-document-viewer/{p-6674838a.entry.js.map → p-19b7c532.entry.js.map} +1 -1
- package/dist/ls-document-viewer/{p-bd532735.entry.js → p-8a2d6dc1.entry.js} +2 -2
- package/package.json +1 -1
- package/dist/components/p-Bw19bxna.js.map +0 -1
- /package/dist/ls-document-viewer/{p-bd532735.entry.js.map → p-8a2d6dc1.entry.js.map} +0 -0
|
@@ -40751,6 +40751,7 @@ const LsDocumentViewer = class {
|
|
|
40751
40751
|
}
|
|
40752
40752
|
//Revalidate
|
|
40753
40753
|
this.validationErrors = validate.bind(this)(this._template);
|
|
40754
|
+
this.validate.emit({ valid: this.validationErrors.length === 0 });
|
|
40754
40755
|
this.pageCount = this._template.pageCount;
|
|
40755
40756
|
this.selected = [];
|
|
40756
40757
|
this.setZoom(1.0);
|
|
@@ -40783,7 +40784,7 @@ const LsDocumentViewer = class {
|
|
|
40783
40784
|
return this.filtertoolbox === null || this.filtertoolbox.split('|').includes(fieldFormType);
|
|
40784
40785
|
}
|
|
40785
40786
|
render() {
|
|
40786
|
-
return (index.h(index.Host, { key: '
|
|
40787
|
+
return (index.h(index.Host, { key: 'c3461010d7281609a38b2702cfe20c4bfad6cf30' }, index.h(index.h.Fragment, null, this.isLoading && index.h("ls-page-loader", { key: '9cab48ca8ea92850bca36c5506e3fd69792ec9db' }), index.h("div", { key: 'f8d67b0017a7ea73b43437d5fc0947ebab946c62', class: "page-header" }, index.h("div", { key: '17795fd432f0d9a7cc1b4b6905c799bacea4c952', class: 'left-slot-wrapper' }, index.h("slot", { key: 'f43073007e0f46c0854f2ea2605977858b9236b7', name: "left-button" })), index.h("div", { key: '6498fa7f4c22148f22e26705f3e276cc58db5bdc', class: 'right-slot-wrapper' }, index.h("slot", { key: '72608dc87f9066c27a59bf9bdfe7ec587bd8abe5', name: "right-button" })), this.mode === 'editor' && (index.h("div", { key: '1ba1d165aa53af0cbddbdac599cabe2ad1a1279f' }, index.h("span", { key: '97447fbd057120eab0801095737260dda779d377', class: "header-text-1" }, "Template Creation"), index.h("span", { key: '678fce46c4c83d4a30d2d9ff3412438f112ef45f' }, "/"), index.h("span", { key: 'eb97171df2dcc2e26c663c9618f007d44b1cab5f', class: "header-text-2" }, this._template?.title))), this.mode === 'compose' && (index.h("div", { key: '3a7338c7e0a5d2e44f4965963c42f04ac98d0b4b', style: { display: 'flex', alignItems: 'center', gap: '0.25rem' } }, index.h("slot", { key: '3272758e5fa878bfa9ae0fd67d1213f22bebc956', name: "top-bar" })))), this.mode === 'editor' && (index.h("div", { key: '8c59b792553ab22bf109b1a8d599c017fe583b90', class: 'validation-tag-wrapper' }, index.h("ls-validation-tag", { key: '25a3e3a6b442a1fff5a986fd1641e0d2e6a5dede', validationErrors: this.validationErrors }))), index.h("form", { key: 'c586460b54c4cec8fb487b71a0dab935878f98ca', id: "ls-editor-form" }, this.mode !== 'preview' ? (index.h("div", { id: "ls-left-box", class: "leftBox", style: this.mode === 'compose' ? { borderRadius: '1.75rem' } : {} }, index.h("div", { class: !this.selected || this.selected.length === 0 ? 'left-box-inner' : 'hidden' }, this.mode === 'editor' && (index.h("ls-feature-column", { mode: this.mode, onManage: manager => {
|
|
40787
40788
|
if (manager.detail === 'document') {
|
|
40788
40789
|
var documentManager = this.component.shadowRoot.getElementById('ls-document-options');
|
|
40789
40790
|
documentManager.template = this._template;
|
|
@@ -40798,10 +40799,11 @@ const LsDocumentViewer = class {
|
|
|
40798
40799
|
}
|
|
40799
40800
|
this.manager = manager.detail;
|
|
40800
40801
|
} })), index.h("div", { id: "ls-toolbox", class: this.manager === 'toolbox' ? 'toolbox' : 'hidden' }, index.h("div", { class: "ls-editor-infobox" }, index.h("h2", { class: "toolbox-section-title" }, "Fields"), index.h("p", { class: "toolbox-section-description" }, "Drag and drop, or select and double click, to place fields on the Document.")), index.h("div", { class: "fields-box" }, this.signer > 0 && this.showTool('signature') && (index.h("ls-toolbox-field", { elementType: "signature", formElementType: "signature", label: "Signature", defaultHeight: 25, defaultWidth: 97, validation: 0, icon: "signature", tooltip: "Use this field to collect Signatures from Participants", signer: this.signer })), this.signer === 0 && this.showTool('auto sign') && (index.h("ls-toolbox-field", { elementType: "auto sign", formElementType: "auto sign", label: "Auto Sign", defaultHeight: 25, defaultWidth: 97, 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') && (index.h("ls-toolbox-field", { elementType: "text", formElementType: "text", label: "Text", defaultHeight: 16, defaultWidth: 150, 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') && (index.h("ls-toolbox-field", { elementType: "signing date", formElementType: "signing date", label: "Signing Date", defaultHeight: 16, defaultWidth: 100, validation: 30, icon: "auto-date", tooltip: "Automatically inserts the date upon completion by the assigned Participant", signer: this.signer })), this.showTool('date') && (index.h("ls-toolbox-field", { elementType: "date", formElementType: "date", label: "Date", defaultHeight: 16, defaultWidth: 100, validation: 2, icon: "calender", tooltip: "A field for collecting dates with built-in date formatting options", signer: this.signer })), this.showTool('email') && (index.h("ls-toolbox-field", { elementType: "email", formElementType: "email", label: "Email", defaultHeight: 16, defaultWidth: 150, 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') && (index.h("ls-toolbox-field", { elementType: "initials", formElementType: "initials", label: "Initials", defaultHeight: 25, defaultWidth: 70, validation: 2000, icon: "initials", tooltip: "Use this field anywhere Participants are required to Initial your document", signer: this.signer })), this.showTool('number') && (index.h("ls-toolbox-field", { elementType: "number", formElementType: "number", label: "Number", defaultHeight: 16, defaultWidth: 150, 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') && (index.h("ls-toolbox-field", { elementType: "dropdown", formElementType: "dropdown", label: "Dropdown", defaultHeight: 16, defaultWidth: 100, 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') && (index.h("ls-toolbox-field", { elementType: "checkbox", formElementType: "checkbox", label: "Checkbox", defaultHeight: 16, defaultWidth: 16, 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') && (index.h("ls-toolbox-field", { elementType: "regex", formElementType: "regex", label: "Regex", defaultHeight: 16, defaultWidth: 150, 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') && (index.h("ls-toolbox-field", { elementType: "image", formElementType: "image", label: "Image", defaultHeight: 16, defaultWidth: 100, 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') && (index.h("ls-toolbox-field", { elementType: "file", formElementType: "file", label: "File", defaultHeight: 16, defaultWidth: 100, 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') && (index.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 })))), index.h("ls-participant-manager", { id: "ls-participant-manager", class: this.manager === 'participant' ? 'toolbox' : 'hidden', editor: this }), index.h("ls-document-options", { id: "ls-document-options", class: this.manager === 'document' ? 'toolbox' : 'hidden' }), index.h("ls-validation-manager", { id: "ls-validation-manager", class: this.manager === 'validation' ? 'toolbox' : 'hidden' }), index.h("ls-recipient-manager", { id: "ls-recipient-manager", class: this.manager === 'recipient' ? 'compose-toolbox' : 'hidden' }, index.h("div", { class: 'scroll-gradient-top' }), index.h("div", { class: 'scroll-gradient-bottom' }), index.h("ls-validation-tag", { validationErrors: this.validationErrors, style: { position: 'absolute', top: '1.125rem', right: '1rem' }, type: "compose" }), index.h("div", { class: 'recipients-box' }, this._recipients &&
|
|
40801
|
-
this._recipients.
|
|
40802
|
+
this._recipients.sort((a, b) => (a.signerIndex % 100) - (b.signerIndex % 100 + 1 / a.signerIndex))
|
|
40803
|
+
.map(recipient => (index.h("ls-recipient-card", { recipient: recipient, activeRecipient: this.signer, filtertoolbox: this.filtertoolbox, template: this._template, validationErrors: this.validationErrors, fieldTypeSelected: this.fieldTypeSelected, "data-signer-index": recipient.signerIndex }))), index.h("slot", { name: 'recipient-panel' })))), !this.displayTable && (index.h("div", { class: this.selected.length > 0 ? 'field-properties-outer' : 'hidden' }, index.h("div", { class: 'properties-header' }, index.h("div", { class: 'properties-header-icon' }, index.h("ls-icon", { name: "pre-filled-content" })), index.h("h1", { class: 'properties-header-title' }, "Field Properties"), index.h("button", { class: 'tertiaryGrey', onClick: e => {
|
|
40802
40804
|
this.selected = [];
|
|
40803
40805
|
e.preventDefault();
|
|
40804
|
-
}, "data-tooltip": "Close Properties Panel" }, index.h("ls-icon", { name: "x", size: "1.25rem" }))), index.h("ls-field-properties", { id: "my-field-panel" })
|
|
40806
|
+
}, "data-tooltip": "Close Properties Panel" }, index.h("ls-icon", { name: "x", size: "1.25rem" }))), index.h("ls-field-properties", { id: "my-field-panel" }))))) : (index.h(index.h.Fragment, null)), index.h("ls-toolbar", { key: 'f5cfb5a4ff3cf812c1bd60ba3e4da3e115180c4d', id: "ls-toolbar", template: this._template, editor: this, groupInfo: this.groupInfo, mode: this.mode }), index.h("div", { key: '0752ceffba42e6000f44aed4cf3914096f802302', id: "ls-mid-area" }, index.h("div", { key: '0a30a6a08141940c854ca424c0705e420492c750', class: 'document-frame-wrapper', id: "document-frame-wrapper" }, index.h("div", { key: '6457ca4b35779357272116b2d18649a71495a812', id: "ls-document-frame" }, index.h("canvas", { key: '3ac01f0277113bb0e245fe67b314afe90a5304f5', id: "pdf-canvas", class: this.displayTable || this.isLoading ? 'hidden' : '' }), index.h("ls-editor-table", { key: 'cd478a5b0e173ae967b5e8a4ad583d2efdaacd60', editor: this, class: this.displayTable ? '' : 'hidden' }), index.h("div", { key: 'f773cf62b9148b9caeab5c028664490ee7608085', id: "ls-box-selector" }))), index.h("ls-statusbar", { key: '5aa588e08b2dc3a59845e9af0707f47d464bc6ac', editor: this, page: this.pageNum, pageCount: this.pageCount })))), index.h("ls-tooltip", { key: 'b50db93b79c2ad28f0a87da91f9244324c829cd5', id: "ls-tooltip-master" })));
|
|
40805
40807
|
}
|
|
40806
40808
|
static get watchers() { return {
|
|
40807
40809
|
"mode": ["modeHandler"],
|
|
@@ -49887,7 +49889,7 @@ const LsRecipientManager = class {
|
|
|
49887
49889
|
};
|
|
49888
49890
|
LsRecipientManager.style = lsRecipientManagerCss();
|
|
49889
49891
|
|
|
49890
|
-
const lsStatusbarCss = () => `:host{position:fixed;z-index:1000;right:1rem;bottom:1rem;display:flex;flex-direction:row;gap:0.5rem;align-items:end;height:2.25rem;overflow:visible}.controls-bar{display:flex;flex-direction:row;background-color:white;border:1px solid var(--gray-30, #e0e2e5);box-shadow:0px 4px 16px rgba(0, 0, 0, 0.1);border-radius:1rem}*{margin:0;padding:0;box-sizing:border-box}.status-bar-section{display:flex;flex-direction:row;align-items:center;gap:0.75rem;padding:0.5rem 0.75rem}.controls-bar>:not(:nth-child(1)){border-left:1px solid var(--gray-30, #e0e2e5)}button{border:0}button:hover{color:var(--gray-100, #45484d);border-radius:0.5rem}button:disabled{color:var(--gray-40, #c1c4c8);cursor:not-allowed}input[type="range"]{-webkit-appearance:none;width:100%;height:0.5rem;background:var(--gray-20, #EDEFF2);border-radius:0.25rem;outline:none}input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:0.5rem;height:0.5rem;background:var(--gray-70, #4a4c51);border-radius:50%;cursor:pointer}input[type="range"]::-moz-range-thumb{width:0.5rem;height:0.5rem;background:var(--gray-70, #4a4c51);border:none;border-radius:50%;cursor:pointer}input[type="range"]::-moz-range-track{background:var(--gray-20, #EDEFF2);height:0.5rem;border-radius:0.25rem}input[type="range"]::-webkit-slider-runnable-track{background:var(--gray-20, #EDEFF2);height:0.5rem;border-radius:0.25rem}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:2.25rem}.input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}button{all:unset;border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;color:var(--gray-80, #6c6e73);text-transform:capitalize}button.tertiaryGrey:hover{background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}`;
|
|
49892
|
+
const lsStatusbarCss = () => `:host{position:fixed;z-index:1000;right:1rem;bottom:1rem;display:flex;flex-direction:row;gap:0.5rem;align-items:end;height:2.25rem;overflow:visible}.controls-bar{display:flex;flex-direction:row;background-color:white;border:1px solid var(--gray-30, #e0e2e5);box-shadow:0px 4px 16px rgba(0, 0, 0, 0.1);border-radius:1rem}*{margin:0;padding:0;box-sizing:border-box}.status-bar-section{display:flex;flex-direction:row;align-items:center;gap:0.75rem;padding:0.5rem 0.75rem}.controls-bar>:not(:nth-child(1)){border-left:1px solid var(--gray-30, #e0e2e5)}button{border:0}button:hover{color:var(--gray-100, #45484d);border-radius:0.5rem}button:disabled{color:var(--gray-40, #c1c4c8);cursor:not-allowed}input[type="range"]{-webkit-appearance:none;width:100%;height:0.5rem;background:var(--gray-20, #EDEFF2);border-radius:0.25rem;outline:none}input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:0.5rem;height:0.5rem;background:var(--gray-70, #4a4c51);border-radius:50%;cursor:pointer}input[type="range"]::-moz-range-thumb{width:0.5rem;height:0.5rem;background:var(--gray-70, #4a4c51);border:none;border-radius:50%;cursor:pointer}input[type="range"]::-moz-range-track{background:var(--gray-20, #EDEFF2);height:0.5rem;border-radius:0.25rem}input[type="range"]::-webkit-slider-runnable-track{background:var(--gray-20, #EDEFF2);height:0.5rem;border-radius:0.25rem}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}span{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:2.25rem}.input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}button{all:unset;border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;color:var(--gray-80, #6c6e73);text-transform:capitalize}button.tertiaryGrey:hover{background:var(--gray-10, #f7f8fa)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}`;
|
|
49891
49893
|
|
|
49892
49894
|
const LsStatusbar = class {
|
|
49893
49895
|
constructor(hostRef) {
|
|
@@ -49928,11 +49930,11 @@ const LsStatusbar = class {
|
|
|
49928
49930
|
this.zoom = this.editor.zoom;
|
|
49929
49931
|
}
|
|
49930
49932
|
render() {
|
|
49931
|
-
return (index.h(index.Host, { key: '69daa9251f31cf28501fd47c5536a3a0e76d48cf' }, index.h("div", { key: 'f1204ff3c369c48389df4ed8c5cb45457bb087a4', class: 'controls-bar' }, index.h("div", { key: '268b93d93af4689dbd477e292db3dbb45c88e40c', class: 'status-bar-section' }, index.h("button", { key: '50ed0b096d871252132eb8315d7b667ff2c1dbed', onClick: () => this.setZoom(this.editor.zoom * 0.8), id: "zoom-out-btn", "data-tooltip": "Zoom Out" }, index.h("ls-icon", { key: '278a53a799c94c202b1167ea4ee4ac2d93f69907', name: "zoom-out" })), index.h("button", { key: '
|
|
49933
|
+
return (index.h(index.Host, { key: '69daa9251f31cf28501fd47c5536a3a0e76d48cf' }, index.h("div", { key: 'f1204ff3c369c48389df4ed8c5cb45457bb087a4', class: 'controls-bar' }, index.h("div", { key: '268b93d93af4689dbd477e292db3dbb45c88e40c', class: 'status-bar-section' }, index.h("button", { key: '50ed0b096d871252132eb8315d7b667ff2c1dbed', onClick: () => this.setZoom(this.editor.zoom * 0.8), id: "zoom-out-btn", "data-tooltip": "Zoom Out" }, index.h("ls-icon", { key: '278a53a799c94c202b1167ea4ee4ac2d93f69907', name: "zoom-out" })), index.h("span", { key: 'dd193206fa1b631d5fe2bfa12602b487a68257aa' }, this.zoom * 100, "%"), index.h("button", { key: 'bf6497f21fec6c3812a69bfe3dbbab62e4b1effe', onClick: () => this.setZoom(this.editor.zoom / 0.8), id: "zoom-in-btn", "data-tooltip": "Zoom In" }, index.h("ls-icon", { key: '39fd393977c209d0239d1b3339d08962fdbc35e5', name: "zoom-in" }))), index.h("div", { key: '126ce0cb4ea1329e335b518a25ca0ab2c0644ec8', class: 'status-bar-section' }, index.h("button", { key: '80776f2d451229e30d56fcac69d0cb77098a2e2b', onClick: () => this.fitWidth(), id: "fit-width-btn", "data-tooltip": "Fit Width" }, index.h("ls-icon", { key: '03d7f0dc1530ac7f4af504f66155606947d10ed2', name: "fit-width" })), index.h("button", { key: '894f6345c8bfc2b9d4b9099c4a55699fae4bd4fb', onClick: () => this.fitHeight(), id: "fit-height-btn", "data-tooltip": "Fit Height" }, index.h("ls-icon", { key: '57190255defd19c83a116ed4f55f2a78df6e4a69', name: "fit-height" }))), index.h("div", { key: 'bede0606ba0d39f26a9f289c08df0375fc38b9a8', class: 'status-bar-section', style: this.pageCount === 1 && { display: 'none' } }, index.h("button", { key: '7c8311a8bf55a0d08a1c6db631012b5c38a722b6', onClick: () => {
|
|
49932
49934
|
this.editor.pagePrev();
|
|
49933
|
-
}, disabled: this.page === 1, id: "prev-page-btn", "data-tooltip": this.page === 1 ? 'No Previous Page' : 'Previous Page' }, index.h("ls-icon", { key: '
|
|
49935
|
+
}, disabled: this.page === 1, id: "prev-page-btn", "data-tooltip": this.page === 1 ? 'No Previous Page' : 'Previous Page' }, index.h("ls-icon", { key: '685cb321a20bf5592cf23a51c2c112aafd4367b2', name: "chevron-left" })), index.h("p", { key: '170f89f79ec952c49934513c33b97f7177fd0ca4' }, this.page, " / ", this.pageCount), index.h("button", { key: '204a9749a3b806432506d6a061e6864a32646bbd', onClick: () => {
|
|
49934
49936
|
this.editor.pageNext();
|
|
49935
|
-
}, disabled: this.page === this.pageCount, id: "next-page-btn", "data-tooltip": this.page === this.pageCount ? 'No Next Page' : 'Next Page' }, index.h("ls-icon", { key: '
|
|
49937
|
+
}, disabled: this.page === this.pageCount, id: "next-page-btn", "data-tooltip": this.page === this.pageCount ? 'No Next Page' : 'Next Page' }, index.h("ls-icon", { key: '9cbb0f59d39de6e322eb86b3992eb123d4ebcd95', name: "chevron-right" })))), index.h("ls-helper-bar", { key: '1ea0213defc6aef3ba7db15d7772b78ff37cff0a' }), index.h("ls-tooltip", { key: '303608ac7cf60dcd55a07f5035048e346c12b658', id: "ls-tooltip-master" }), index.h("slot", { key: '314e1b74316d6138cbee406a40569630cae567ce' })));
|
|
49936
49938
|
}
|
|
49937
49939
|
};
|
|
49938
49940
|
LsStatusbar.style = lsStatusbarCss();
|
|
@@ -49951,9 +49953,9 @@ const LsToggle = class {
|
|
|
49951
49953
|
this.valueChange.emit(value);
|
|
49952
49954
|
}
|
|
49953
49955
|
render() {
|
|
49954
|
-
return (index.h(index.Host, { key: '
|
|
49956
|
+
return (index.h(index.Host, { key: '91d2c230ac9e7b1be54bd5ea1f1c718c904fbaaf' }, index.h("label", { key: '899453f557690f36dad194370fdb4d346aaff3e6', class: "switch" }, index.h("input", { key: '4d1ef316817bb4c919bc0a0552623e9ff7e70021', type: "checkbox", checked: this.checked, onChange: (e) => {
|
|
49955
49957
|
this.changeHandler(e.target.checked);
|
|
49956
|
-
} }), index.h("span", { key: '
|
|
49958
|
+
} }), index.h("span", { key: 'c7b08ede9203cfbd5cf33884e33b313ed6c175da', class: `${this.indeterminate ? 'indeterminate' : 'slider'} round` })), index.h("slot", { key: '93c0556c2aea1cf9edfa7bf6ccb7489e461c1967' })));
|
|
49957
49959
|
}
|
|
49958
49960
|
};
|
|
49959
49961
|
LsToggle.style = lsToggleCss();
|
|
@@ -50008,7 +50010,7 @@ const LsToolbar = class {
|
|
|
50008
50010
|
});
|
|
50009
50011
|
}
|
|
50010
50012
|
render() {
|
|
50011
|
-
return (index.h("div", { key: '
|
|
50013
|
+
return (index.h("div", { key: '3477bb7fb66ee4d1ad1991b413aa7c2020893f09', class: this.mode !== 'compose' || (this.mode === 'compose' && this.dataItem && this.dataItem.length > 0) ? 'ls-toolbar' : '' }, this.dataItem && this.dataItem.length > 1 ? (index.h("div", { class: 'rowbox' }, index.h("ls-field-format", { dataItem: this?.dataItem }))) : (index.h("div", { class: 'rowbox' }, index.h("ls-field-format", { dataItem: this?.dataItem }), index.h("ls-participant-select", { id: "ls-participant-select", roles: this.template?.roles, style: { display: (this.dataItem && this.dataItem.length === 1) || this.mode === 'compose' ? 'none' : 'block' } }))), index.h("ls-tooltip", { key: 'eb2ba5d8db7b4b76ff17ea1d3de4cd7888549caf', id: "ls-tooltip-master" }), index.h("slot", { key: '5d0d978634949c9d2964d5581c78192a79f9e95c' })));
|
|
50012
50014
|
}
|
|
50013
50015
|
};
|
|
50014
50016
|
LsToolbar.style = lsToolbarCss();
|
|
@@ -50087,7 +50089,7 @@ const LsToolboxField = class {
|
|
|
50087
50089
|
attachAllTooltips(this.component.shadowRoot);
|
|
50088
50090
|
}
|
|
50089
50091
|
render() {
|
|
50090
|
-
return (index.h(index.Host, { key: '
|
|
50092
|
+
return (index.h(index.Host, { key: '77296119c7cc3a53ab32af75c1c4baba251eaa6b', draggable: "true" }, index.h("div", { key: 'e9c0777cef53c701538dd33dd717634cd20b3ff4', class: 'ls-toolbox-field', style: this.isSelected && {
|
|
50091
50093
|
background: defaultRolePalette[this.signer % 100].s10,
|
|
50092
50094
|
border: `1px solid ${defaultRolePalette[this.signer % 100].s60}`,
|
|
50093
50095
|
color: defaultRolePalette[this.signer % 100].s80,
|
|
@@ -50102,9 +50104,9 @@ const LsToolboxField = class {
|
|
|
50102
50104
|
defaultWidth: this.defaultWidth,
|
|
50103
50105
|
fixedAspect: this.fixedAspect,
|
|
50104
50106
|
});
|
|
50105
|
-
} }, index.h("div", { key: '
|
|
50107
|
+
} }, index.h("div", { key: 'c4fbfcf7d1078842b3e8ca2a1b6ec4e54e9e4101', 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" }, index.h("ls-icon", { key: 'a195a58a24e46596063d64da1e03f793aa14348d', name: this.icon, size: "1.25rem" })), index.h("p", { key: '32b107023aa04497579befe8bfac27bcc10a6631', class: "toolbox-field-label", style: this.isSelected && {
|
|
50106
50108
|
color: defaultRolePalette[this.signer % 100].s80,
|
|
50107
|
-
} }, this.label), this.redDot && (index.h("div", { key: '
|
|
50109
|
+
} }, this.label), this.redDot && (index.h("div", { key: '90386897b58bab0f43c7bd182663e2408b88ab44', class: 'warning-box', "data-tooltip": `${this.label} Field Required`, "data-tooltip-placement": "left" }, index.h("ls-icon", { key: '507cf1478e0c88b09fd660f05839c336e84f5ea2', name: "exclamation-circle", size: "1.125rem", solid: true }))), index.h("ls-icon", { key: '72acf8eb2d7e8125eb4728ac5e00b6751b784dae', name: "drag-vertical", size: "1rem", color: "#787a80" })), index.h("ls-tooltip", { key: '1fee79b7bca43779697023eb09eff7ac156c8b46', id: "ls-tooltip-master", tooltipText: "Something" })));
|
|
50108
50110
|
}
|
|
50109
50111
|
};
|
|
50110
50112
|
LsToolboxField.style = lsToolboxFieldCss();
|
|
@@ -51600,7 +51602,7 @@ const LsTooltip = class {
|
|
|
51600
51602
|
innerTooltip.classList.add('hidden');
|
|
51601
51603
|
}
|
|
51602
51604
|
render() {
|
|
51603
|
-
return (index.h("div", { key: '
|
|
51605
|
+
return (index.h("div", { key: 'a106501022ef9124b63305316dcc6f49ba372d7f', id: "ls-tooltip-inner", class: "tooltip hidden", role: "tooltip" }, index.h("div", { key: 'b8c148bcbe685610dfbc0f9a55934177c43c2614', id: "arrow" }), this.tooltipTitle && index.h("p", { key: '93c8d9def677ef26c92387ffffa04e58979b0254', class: "tooltip-title" }, this.tooltipTitle), this.tooltipText, index.h("slot", { key: '0842397d43135a9891f9432ce4fab5f39b523cc6' })));
|
|
51604
51606
|
}
|
|
51605
51607
|
static get watchers() { return {
|
|
51606
51608
|
"referenceElement": ["updateReferenceHandler"]
|
|
@@ -51620,7 +51622,7 @@ const LsValidationManager = class {
|
|
|
51620
51622
|
*/
|
|
51621
51623
|
validationErrors;
|
|
51622
51624
|
render() {
|
|
51623
|
-
return (index.h(index.Host, { key: '
|
|
51625
|
+
return (index.h(index.Host, { key: 'f10380cb4a0a843d064808fb338d137a97873948' }, index.h("div", { key: '35b5a5bcc88617a13d97e913d8beda262fbc2452' }, index.h("div", { key: '84691c010291c4b7af6fde4c39ab43540a2168ce' }, index.h("div", { key: '8b23a67ee51d0db638820caf25e03a9429e3d476', class: 'validation-section-title' }, "Action Required"), index.h("p", { key: '49540ae1ad474d0952a7949cad25e36f438352bd', class: "toolbox-section-description" }, "This document needs fields added or corrected before it can be sent.")), this.validationErrors && this.validationErrors.map((field, idx) => {
|
|
51624
51626
|
const signerIndex = field?.role?.signerIndex ? field?.role?.signerIndex % 100 : null;
|
|
51625
51627
|
const pallette = defaultRolePalette[signerIndex || field?.element?.signer || 0];
|
|
51626
51628
|
return (index.h("div", { key: idx, class: 'required-field', style: {
|
|
@@ -51631,7 +51633,7 @@ const LsValidationManager = class {
|
|
|
51631
51633
|
'--field-text-color-hover': pallette.s80,
|
|
51632
51634
|
'--field-border-color-hover': pallette.s60,
|
|
51633
51635
|
} }, index.h("div", { class: 'required-field-items-left' }, index.h("div", { class: 'dot', style: { background: pallette.s60 } }), field?.role && (index.h("div", { class: 'required-field-items-left' }, index.h("p", { style: { color: pallette.s80 } }, field.role?.name || `Signer ${field?.role?.signerIndex + 1}`), index.h("div", { class: 'role-label', style: { background: pallette.s30, color: pallette.s70 } }, field.role?.roleType.toLowerCase() || `Signer ${field.role?.signerIndex + 1}`))), field?.element && (index.h(index.h.Fragment, null, index.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: field.element.signer }), index.h("p", { style: { color: pallette.s80 } }, field.role?.name || `${field.element.formElementType} ${field?.element?.label + 1}`), index.h("div", { class: 'role-label', style: { background: pallette.s30, color: pallette.s70 } }, field.description))))));
|
|
51634
|
-
})), index.h("slot", { key: '
|
|
51636
|
+
})), index.h("slot", { key: 'c88294ec996efc283688d5745ac4dcb878db2b9c' })));
|
|
51635
51637
|
}
|
|
51636
51638
|
};
|
|
51637
51639
|
LsValidationManager.style = lsValidationManagerCss();
|
|
@@ -51650,7 +51652,7 @@ const LsValidationTag = class {
|
|
|
51650
51652
|
showDropDown = true;
|
|
51651
51653
|
changeSigner;
|
|
51652
51654
|
render() {
|
|
51653
|
-
return (index.h(index.Host, { key: '
|
|
51655
|
+
return (index.h(index.Host, { key: '9191757a34d8a7813a749fa1c0b7e27df2e27d60' }, index.h("div", { key: '2a6ec1131030ac4165e304d884eba5b96cbf036d', class: `valid-label ${this.validationErrors.length === 0 ? 'valid' : 'invalid'} ${this.type === 'compose' ? 'compose' : 'default'}`, onClick: this.validationErrors.length && (() => (this.isExpanded = !this.isExpanded)) }, this.validationErrors.length > 0 && index.h("div", { key: 'ad7b81418f694dc46d25e89fa762ad3d80522f5d', class: `field-counter ${this.type === 'compose' ? 'compose' : 'default'}` }, this.validationErrors.length), this.type === 'compose' ? (this.validationErrors.length === 0 ? 'Ready' : `Required`) : this.validationErrors.length === 0 ? 'Ready to Send' : `Requires Fields`, this.validationErrors.length > 0 && this.showDropDown && this.type !== 'compose' && (index.h("ls-icon", { key: '6020d6a8b86cbab6f3f3b34fc103b80c58bc695c', name: this.isExpanded ? 'chevron-up' : 'chevron-down', style: { cursor: 'pointer', scale: '0.60', margin: '0 -0.25rem' } })), this.validationErrors.length > 0 && this.type === 'compose' && index.h("ls-icon", { key: '6146f0c011a291d677ae0803a81979984bac0301', name: "cursor-click", solid: true, size: "1rem", customStyle: { color: 'var(--red-70, #DC2721);' } })), this.isExpanded && this.validationErrors.length !== 0 && this.showDropDown && this.type !== 'compose' && (index.h("div", { key: 'a7b41d956b7cfe58cd9bd1ce72592a695028c654', class: 'field-dropdown' }, index.h("div", { key: '9b656836563d46ce16fccf40e7ecff77d2ec8be0', class: 'dropdown-header' }, index.h("h2", { key: '4bed2f9bfe918e74e892f7e35b8d5795fda176df' }, "Fields Required"), index.h("p", { key: '229510fe40dedb15934382ff18e9d3414bb004c9' }, this.validationErrors.length, " ", this.validationErrors.length === 1 ? 'Recipient needs a Signature Field' : 'Recipients need Signature Fields', " placed for them")), this.validationErrors.map((field, idx) => {
|
|
51654
51656
|
const signerIndex = field?.role?.signerIndex ? field?.role?.signerIndex % 100 : null;
|
|
51655
51657
|
const pallette = defaultRolePalette[signerIndex || field?.element?.signer || 0];
|
|
51656
51658
|
return (index.h("div", { key: idx, class: 'required-field', style: {
|
|
@@ -51661,7 +51663,7 @@ const LsValidationTag = class {
|
|
|
51661
51663
|
'--field-text-color-hover': pallette.s80,
|
|
51662
51664
|
'--field-border-color-hover': pallette.s60,
|
|
51663
51665
|
} }, index.h("div", { class: 'required-field-items-left' }, index.h("div", { class: 'dot', style: { background: pallette.s60 } }), field?.role && (index.h("div", { class: 'required-field-items-left' }, index.h("p", { style: { color: pallette.s80 } }, field.role?.name || `Signer ${field?.role?.signerIndex + 1}`), index.h("div", { class: 'role-label', style: { background: pallette.s30, color: pallette.s70 } }, field.role?.roleType.toLowerCase() || `Signer ${field.role?.signerIndex + 1}`))), field?.element && (index.h(index.h.Fragment, null, index.h("p", { style: { color: pallette.s80 } }, field.role?.name || `${field.element.formElementType} ${field?.element?.label + 1}`), index.h("div", { class: 'role-label', style: { background: pallette.s30, color: pallette.s70 } }, field.description))))));
|
|
51664
|
-
}))), this.isExpanded && this.validationErrors.length !== 0 && this.showDropDown && this.type === 'compose' && (index.h("div", { key: '
|
|
51666
|
+
}))), this.isExpanded && this.validationErrors.length !== 0 && this.showDropDown && this.type === 'compose' && (index.h("div", { key: '377954e29cdb89201e3736276eb933c1afe5a993', class: 'field-dropdown compose' }, index.h("div", { key: '3d1db2e874681a10164505a8e61c95a2af67b979', class: "validation-tag-header" }, index.h("p", { key: '652613711f5343477c5aa777d117f0cdba6608cd', class: "validation-tag-title" }, "Recipients Missing Signature")), this.validationErrors.map((field, idx) => {
|
|
51665
51667
|
const signerIndex = field?.role?.signerIndex ? field?.role?.signerIndex % 100 : null;
|
|
51666
51668
|
const pallette = defaultRolePalette[signerIndex || field?.element?.signer || 0];
|
|
51667
51669
|
return (index.h("div", { class: "validation-tag-row", key: idx, onClick: () => {
|
|
@@ -30,7 +30,7 @@ const LsTitleInput = class {
|
|
|
30
30
|
}, delay);
|
|
31
31
|
}
|
|
32
32
|
render() {
|
|
33
|
-
return (index.h(index.Host, { key: '
|
|
33
|
+
return (index.h(index.Host, { key: '398645fc19bc8f75d414c6e18a6c3f33711652e7' }, this.editTitle ? (index.h("div", { style: { display: 'flex', gap: '0.5rem', alignItems: 'center' } }, index.h("input", { value: this.template?.title, style: { height: '1.25rem', padding: '0 0.25rem', width: 'fit-content' }, onInput: e => {
|
|
34
34
|
e.preventDefault();
|
|
35
35
|
this.alter({ title: e.target.value });
|
|
36
36
|
}, onKeyUp: e => {
|
|
@@ -530,6 +530,7 @@ export class LsDocumentViewer {
|
|
|
530
530
|
}
|
|
531
531
|
//Revalidate
|
|
532
532
|
this.validationErrors = validate.bind(this)(this._template);
|
|
533
|
+
this.validate.emit({ valid: this.validationErrors.length === 0 });
|
|
533
534
|
this.pageCount = this._template.pageCount;
|
|
534
535
|
this.selected = [];
|
|
535
536
|
this.setZoom(1.0);
|
|
@@ -562,7 +563,7 @@ export class LsDocumentViewer {
|
|
|
562
563
|
return this.filtertoolbox === null || this.filtertoolbox.split('|').includes(fieldFormType);
|
|
563
564
|
}
|
|
564
565
|
render() {
|
|
565
|
-
return (h(Host, { key: '
|
|
566
|
+
return (h(Host, { key: 'c3461010d7281609a38b2702cfe20c4bfad6cf30' }, h(h.Fragment, null, this.isLoading && h("ls-page-loader", { key: '9cab48ca8ea92850bca36c5506e3fd69792ec9db' }), h("div", { key: 'f8d67b0017a7ea73b43437d5fc0947ebab946c62', class: "page-header" }, h("div", { key: '17795fd432f0d9a7cc1b4b6905c799bacea4c952', class: 'left-slot-wrapper' }, h("slot", { key: 'f43073007e0f46c0854f2ea2605977858b9236b7', name: "left-button" })), h("div", { key: '6498fa7f4c22148f22e26705f3e276cc58db5bdc', class: 'right-slot-wrapper' }, h("slot", { key: '72608dc87f9066c27a59bf9bdfe7ec587bd8abe5', name: "right-button" })), this.mode === 'editor' && (h("div", { key: '1ba1d165aa53af0cbddbdac599cabe2ad1a1279f' }, h("span", { key: '97447fbd057120eab0801095737260dda779d377', class: "header-text-1" }, "Template Creation"), h("span", { key: '678fce46c4c83d4a30d2d9ff3412438f112ef45f' }, "/"), h("span", { key: 'eb97171df2dcc2e26c663c9618f007d44b1cab5f', class: "header-text-2" }, this._template?.title))), this.mode === 'compose' && (h("div", { key: '3a7338c7e0a5d2e44f4965963c42f04ac98d0b4b', style: { display: 'flex', alignItems: 'center', gap: '0.25rem' } }, h("slot", { key: '3272758e5fa878bfa9ae0fd67d1213f22bebc956', name: "top-bar" })))), this.mode === 'editor' && (h("div", { key: '8c59b792553ab22bf109b1a8d599c017fe583b90', class: 'validation-tag-wrapper' }, h("ls-validation-tag", { key: '25a3e3a6b442a1fff5a986fd1641e0d2e6a5dede', validationErrors: this.validationErrors }))), h("form", { key: 'c586460b54c4cec8fb487b71a0dab935878f98ca', id: "ls-editor-form" }, this.mode !== 'preview' ? (h("div", { id: "ls-left-box", class: "leftBox", style: this.mode === 'compose' ? { borderRadius: '1.75rem' } : {} }, h("div", { class: !this.selected || this.selected.length === 0 ? 'left-box-inner' : 'hidden' }, this.mode === 'editor' && (h("ls-feature-column", { mode: this.mode, onManage: manager => {
|
|
566
567
|
if (manager.detail === 'document') {
|
|
567
568
|
var documentManager = this.component.shadowRoot.getElementById('ls-document-options');
|
|
568
569
|
documentManager.template = this._template;
|
|
@@ -577,10 +578,11 @@ export class LsDocumentViewer {
|
|
|
577
578
|
}
|
|
578
579
|
this.manager = manager.detail;
|
|
579
580
|
} })), h("div", { id: "ls-toolbox", class: this.manager === 'toolbox' ? 'toolbox' : 'hidden' }, h("div", { class: "ls-editor-infobox" }, h("h2", { class: "toolbox-section-title" }, "Fields"), h("p", { class: "toolbox-section-description" }, "Drag and drop, or select and double click, to place fields 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: 25, defaultWidth: 97, 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: 25, defaultWidth: 97, 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: 16, defaultWidth: 150, 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: 16, defaultWidth: 100, 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: 16, defaultWidth: 100, 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: 16, defaultWidth: 150, 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: 25, defaultWidth: 70, 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: 16, defaultWidth: 150, 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: 16, defaultWidth: 100, 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: 16, defaultWidth: 16, 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: 16, defaultWidth: 150, 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: 16, defaultWidth: 100, 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: 16, defaultWidth: 100, 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' }), h("ls-validation-manager", { id: "ls-validation-manager", class: this.manager === 'validation' ? 'toolbox' : 'hidden' }), h("ls-recipient-manager", { id: "ls-recipient-manager", class: this.manager === 'recipient' ? 'compose-toolbox' : 'hidden' }, h("div", { class: 'scroll-gradient-top' }), h("div", { class: 'scroll-gradient-bottom' }), h("ls-validation-tag", { validationErrors: this.validationErrors, style: { position: 'absolute', top: '1.125rem', right: '1rem' }, type: "compose" }), h("div", { class: 'recipients-box' }, this._recipients &&
|
|
580
|
-
this._recipients.
|
|
581
|
+
this._recipients.sort((a, b) => (a.signerIndex % 100) - (b.signerIndex % 100 + 1 / a.signerIndex))
|
|
582
|
+
.map(recipient => (h("ls-recipient-card", { recipient: recipient, activeRecipient: this.signer, filtertoolbox: this.filtertoolbox, template: this._template, validationErrors: this.validationErrors, fieldTypeSelected: this.fieldTypeSelected, "data-signer-index": recipient.signerIndex }))), h("slot", { name: 'recipient-panel' })))), !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 => {
|
|
581
583
|
this.selected = [];
|
|
582
584
|
e.preventDefault();
|
|
583
|
-
}, "data-tooltip": "Close Properties Panel" }, h("ls-icon", { name: "x", size: "1.25rem" }))), h("ls-field-properties", { id: "my-field-panel" })
|
|
585
|
+
}, "data-tooltip": "Close Properties Panel" }, h("ls-icon", { name: "x", size: "1.25rem" }))), h("ls-field-properties", { id: "my-field-panel" }))))) : (h(h.Fragment, null)), h("ls-toolbar", { key: 'f5cfb5a4ff3cf812c1bd60ba3e4da3e115180c4d', id: "ls-toolbar", template: this._template, editor: this, groupInfo: this.groupInfo, mode: this.mode }), h("div", { key: '0752ceffba42e6000f44aed4cf3914096f802302', id: "ls-mid-area" }, h("div", { key: '0a30a6a08141940c854ca424c0705e420492c750', class: 'document-frame-wrapper', id: "document-frame-wrapper" }, h("div", { key: '6457ca4b35779357272116b2d18649a71495a812', id: "ls-document-frame" }, h("canvas", { key: '3ac01f0277113bb0e245fe67b314afe90a5304f5', id: "pdf-canvas", class: this.displayTable || this.isLoading ? 'hidden' : '' }), h("ls-editor-table", { key: 'cd478a5b0e173ae967b5e8a4ad583d2efdaacd60', editor: this, class: this.displayTable ? '' : 'hidden' }), h("div", { key: 'f773cf62b9148b9caeab5c028664490ee7608085', id: "ls-box-selector" }))), h("ls-statusbar", { key: '5aa588e08b2dc3a59845e9af0707f47d464bc6ac', editor: this, page: this.pageNum, pageCount: this.pageCount })))), h("ls-tooltip", { key: 'b50db93b79c2ad28f0a87da91f9244324c829cd5', id: "ls-tooltip-master" })));
|
|
584
586
|
}
|
|
585
587
|
static get is() { return "ls-document-viewer"; }
|
|
586
588
|
static get encapsulation() { return "shadow"; }
|