npm - legalesign-document-viewer - Versions diffs - 0.3.9 → 0.4.0 - Mend

legalesign-document-viewer 0.3.9 → 0.4.0

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

Files changed (284) hide show

package/dist/collection/components/ls-participant-card/ls-participant-card.js CHANGED Viewed

@@ -52,36 +52,36 @@ export class LsParticipantCard {
     render() {
         const participantFields = this.template.elementConnection.templateElements.filter(f => f.signer === this.signer.signerIndex) || [];
         const child = this.template.roles.find(r => r.signerParent === this.signer.id);
-        return (h(Host, { key: '193ab16b3138128aa0189425fefa39cf2b9ad79f' }, h("div", { key: 'bfa6a04e87a51a7d03e6d51b3b1f8bb4db4a19f3', class: 'participant-card' + (child ? ' top-card' : this.signer?.signerParent ? ' bottom-card' : ' full-card'), style: {
+        return (h(Host, { key: '2b4e3a4c3bd2c5bc3908c1d11b0b49e8138cec49' }, h("div", { key: 'fbc94f4ad0c46dc6346272666f6f2f34a3f202cc', class: 'participant-card' + (child ? ' top-card' : this.signer?.signerParent ? ' bottom-card' : ' full-card'), style: {
                 background: defaultRolePalette[this.signer?.signerIndex % 100].s10,
                 border: `1px solid ${defaultRolePalette[this.signer?.signerIndex % 100].s60}`,
                 marginTop: this.signer.roleType === 'WITNESS' ? '-0.813rem' : '0',
             }, onMouseEnter: e => e.currentTarget.querySelector('.button-set')?.classList.remove('hidden'), onMouseLeave: e => e.currentTarget.querySelector('.button-set')?.classList.add('hidden'), onDblClick: () => {
                 this.editable = true;
-            } }, h("div", { key: '3558c205c0f18e2ed13700d77f56c92e839fdd18', class: 'participant-card-inner' }, h("div", { key: 'd04865fa396c3e022b2ec117853c350f15eb14c7', class: 'participant-card-top-items' }, h("div", { key: 'cae6185c8253919171ffdc76e19a5b562d8bd494', class: 'role-label', style: {
+            } }, h("div", { key: '1aa2feb5931882e6862f015d37b14ba16bb16c52', class: 'participant-card-inner' }, h("div", { key: '9f5ad57fba0aa164307f1ddd4daed0782e8d8b90', class: 'participant-card-top-items' }, h("div", { key: 'a3f08034448f710acda8d236ba2d25d7549b180a', class: 'role-label', style: {
                 background: defaultRolePalette[this.signer?.signerIndex % 100].s20,
                 color: defaultRolePalette[this.signer?.signerIndex % 100].s90,
-            } }, h("ls-icon", { key: 'ef7370224b3a852b7f55a4f84e2956907d1239ec', name: this.signer?.roleType === 'APPROVER' ? 'check-circle' : this.signer?.roleType === 'SIGNER' ? 'signature' : 'eye' }), (this.signer?.ordinal || '')), h("div", { key: 'e0011bca5db2d10ab1e32aca66a4db6e13639b92', class: 'button-set hidden' }, this.index > 0 && this.signer.roleType !== 'WITNESS' && (h("div", { key: '802bf584b98322c169fbd2c70cd77b074a95fcf7', class: "innerButton", onClick: () => {
+            } }, h("ls-icon", { key: 'e68c931605093aafd7ee6c85983c6953bb51f72e', name: this.signer?.roleType === 'APPROVER' ? 'check-circle' : this.signer?.roleType === 'SIGNER' ? 'signature' : 'eye' }), (this.signer?.ordinal || '')), h("div", { key: '36b5b61f2595fcb071a171ea152c16a720d51deb', class: 'button-set hidden' }, this.index > 0 && this.signer.roleType !== 'WITNESS' && (h("div", { key: '925046ae9d136e15209770573189579cb4cbec75', class: "innerButton", onClick: () => {
                 this.swapHandler(this.signer, this.template.roles[this.index - 1]);
             }, style: {
                 '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,
                 '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,
-            }, "data-tooltip": "Move Up" }, h("ls-icon", { key: '62e67f1cfa7aabdf098f34152ecc059786434dda', name: "arrow-up", size: "18" }))), this.signer.signerIndex !== this.template.roles.length && this.signer.roleType !== 'WITNESS' && (h("div", { key: '7a971a5d299649f9c05de0ff6d875c9fbeca9002', class: "innerButton", onClick: () => {
+            }, "data-tooltip": "Move Up" }, h("ls-icon", { key: '0f6fb5636c2e36af3bcd90b8932d36e6c3672861', name: "arrow-up", size: "18" }))), this.signer.signerIndex !== this.template.roles.length && this.signer.roleType !== 'WITNESS' && (h("div", { key: '2660e5e1c2aeb94f45fea38f529b72df34f0fcae', class: "innerButton", onClick: () => {
                 this.swapHandler(this.signer, this.template.roles[this.index + 1]);
             }, style: {
                 '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,
                 '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,
-            }, "data-tooltip": "Move Down" }, h("ls-icon", { key: '926113ba707781b8c2fe82ccfaeb4ac3ead0e8de', name: "arrow-down", size: "18" }))), h("div", { key: '689f20287f1c78092e97345f8d6a00785f89db64', class: "innerButton", onClick: () => {
+            }, "data-tooltip": "Move Down" }, h("ls-icon", { key: 'c88c5b8056858178d68c972ef6cbd8b81fb00c8c', name: "arrow-down", size: "18" }))), h("div", { key: 'd850fd3cd0945da23a0117218d91171fa8e49275', class: "innerButton", onClick: () => {
                 this.editable = !this.editable;
             }, style: {
                 '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,
                 '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,
-            } }, h("ls-icon", { key: '3693150068e61de8c9bf92ecc8e3363bc1c157f3', name: this.editable ? 'check' : 'pencil-alt', size: "18", "data-tooltip": this.editable ? "Save Changes" : "Edit Participant" })), h("div", { key: 'f4c2268648e86745709f1da8c75ad04e5edc64d8', class: "innerButton", onClick: () => {
+            } }, h("ls-icon", { key: 'a85deb356240d02ec3d89fcc262363d737204026', name: this.editable ? 'check' : 'pencil-alt', size: "18", "data-tooltip": this.editable ? "Save Changes" : "Edit Participant" })), h("div", { key: 'bc844e7e4f2ace59d871c3c0260dbae729135d88', class: "innerButton", onClick: () => {
                 this.deleteHandler(this.signer);
             }, style: {
                 '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,
                 '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,
-            }, "data-tooltip": "Delete Participant", "data-tooltip-placement": "top-end" }, h("ls-icon", { key: '849df0b6286c7d7652065e8255232e62e48ec089', name: "trash", size: "18" })))), this.editable ? (h("div", { class: 'participant-card-inner' }, this.signer?.roleType !== 'WITNESS' ? (h("ls-input-wrapper", { select: true, leadingIcon: this.signer?.roleType === 'APPROVER' ? 'check-circle' : 'signature' }, h("select", { name: "roleType", id: "role-type", class: 'has-leading-icon', onChange: e => this.alter({ roleType: e.target.value }), disabled: child ? true : false }, h("option", { value: "APPROVER", selected: this.signer?.roleType === 'APPROVER' }, "Approver"), h("option", { value: "SIGNER", selected: this.signer?.roleType === 'SIGNER' }, "Signer")))) : (h("ls-input-wrapper", { leadingIcon: "eye" }, h("input", { name: "roleType", id: "role-type", class: 'has-leading-icon', disabled: true, value: "Witness" }))), h("input", { type: "text", id: "participant-description", name: "participantDescription", placeholder: "Description, eg. Tenant 1, Agent", defaultValue: this.signer.name, onInput: e => this.alter({ name: e.target.value }), onKeyUp: e => {
+            }, "data-tooltip": "Delete Participant", "data-tooltip-placement": "top-end" }, h("ls-icon", { key: '380c5238d2314c85294aed33da90db3c59ba0078', name: "trash", size: "18" })))), this.editable ? (h("div", { class: 'participant-card-inner' }, this.signer?.roleType !== 'WITNESS' ? (h("ls-input-wrapper", { select: true, leadingIcon: this.signer?.roleType === 'APPROVER' ? 'check-circle' : 'signature' }, h("select", { name: "roleType", id: "role-type", class: 'has-leading-icon', onChange: e => this.alter({ roleType: e.target.value }), disabled: child ? true : false }, h("option", { value: "APPROVER", selected: this.signer?.roleType === 'APPROVER' }, "Approver"), h("option", { value: "SIGNER", selected: this.signer?.roleType === 'SIGNER' }, "Signer")))) : (h("ls-input-wrapper", { leadingIcon: "eye" }, h("input", { name: "roleType", id: "role-type", class: 'has-leading-icon', disabled: true, value: "Witness" }))), h("input", { type: "text", id: "participant-description", name: "participantDescription", placeholder: "Description, eg. Tenant 1, Agent", defaultValue: this.signer.name, onInput: e => this.alter({ name: e.target.value }), onKeyUp: e => {
                 if (e.key === 'Enter' || e.keyCode === 13)
                     this.editable = false;
             } }), this.signer?.roleType === 'SIGNER' && !child ? (h("button", { class: 'tertiary', onClick: () => this.addParticipant.emit({ type: 'WITNESS', parent: this.signer.id }) }, h("ls-icon", { name: "plus", style: { marginRight: '0.25rem' } }), "Add Witness")) : this.signer?.roleType === 'SIGNER' && child ? (h("button", { class: 'destructive', onClick: () => {
@@ -96,7 +96,7 @@ export class LsParticipantCard {
             } }, this.signer.roleType.toLowerCase()), this.signer?.roleType !== 'APPROVER' && (h("div", { class: 'role-label fields', style: {
                 background: participantFields.length === 0 ? defaultRolePalette[this.signer?.signerIndex % 100].s60 : defaultRolePalette[this.signer?.signerIndex % 100].s20,
                 color: participantFields.length === 0 ? 'white' : defaultRolePalette[this.signer?.signerIndex % 100].s90,
-            } }, participantFields.length === 0 && h("ls-icon", { name: "exclamation-circle", size: "16", style: { marginRight: '0.125rem' } }), participantFields.length === 0 ? 'Signature Required' : `${participantFields.length} ${participantFields.length === 1 ? 'Field' : 'Fields'}`)))))), h("slot", { key: '9cf9de9051772ee2bd4efe15d38bad3a6d45010a' }), h("ls-tooltip", { key: 'd15f5f8501565d49901e0c4d5a8299021c3818ff', id: "ls-tooltip-master" })));
+            } }, participantFields.length === 0 && h("ls-icon", { name: "exclamation-circle", size: "16", style: { marginRight: '0.125rem' } }), participantFields.length === 0 ? 'Signature Required' : `${participantFields.length} ${participantFields.length === 1 ? 'Field' : 'Fields'}`)))))), h("slot", { key: 'db4945ff58266e518041602472ce226d058a50fb' }), h("ls-tooltip", { key: '897496ea12a921bd0206a0f97b4b691e718b2533', id: "ls-tooltip-master" })));
     }
     static get is() { return "ls-participant-card"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ls-participant-manager/ls-participant-manager.js CHANGED Viewed

@@ -50,12 +50,12 @@ export class LsParticipantManager {
         observer.observe(this.element.shadowRoot, { childList: true, subtree: true });
     }
     render() {
-        return (h(Host, { key: 'eba5ba53247193aa6b2dbcee6eb42d643e542dd7' }, h("div", { key: '93704824644f50b9f8fec1bca116b09956063e99', class: "ls-editor-infobox" }, h("h2", { key: '1df8d83c3ee438cc0795db0119cc416ea1497507', class: "toolbox-section-title" }, "Participants"), h("p", { key: 'a8f07c887f2826e59062eb471b85eee16b7aacea', class: "toolbox-section-description" }, "Select and Click to place Signature fields where you\u2019d like on the Document.")), h("div", { key: 'd7fd1b255863b9a135481870ac3b9917c9a0f0eb', class: "participant-list" }, this.template &&
+        return (h(Host, { key: 'da7d0e060d5b5f843f65937a902ad8c1b3791ac4' }, h("div", { key: 'f7004930e8dc41b523228fba254e17ec4b332ba1', class: "ls-editor-infobox" }, h("h2", { key: 'd7d3dc58a739e9e8ef4a16667d28dc7c9c0044c9', class: "toolbox-section-title" }, "Participants"), h("p", { key: '6918b5cc04cea91f0e2e6e988f952a6bd27e04fb', class: "toolbox-section-description" }, "Select and Click to place Signature fields where you\u2019d like on the Document.")), h("div", { key: 'f298dcd70c59c9cfea217b743c2622288e1db3b9', class: "participant-list" }, this.template &&
             this.template?.roles.map((r, index) => {
                 return (h("ls-participant-card", { signer: r, index: index, template: this.template, onOpened: event => {
                         this.handleOpened.bind(this)(event);
                     }, onAddParticipant: event => this.handleOpenNewWitness(event) }));
-            })), h("div", { key: 'fbca0e24a09f918f1401db1ecb09ac5e72d47d41', class: 'add-participant-button' }, h("button", { key: '7c2cdd0e863005bf49e5ce3fb3aafdd45f1a2180', onClick: () => this.addParticipant.emit({ type: 'SIGNER' }) }, h("ls-icon", { key: '2354b322a51d159e096bab4959d496fc69661fdf', name: "user-add", size: "20", color: "var(--gray-100, #45484D);" }), h("p", { key: '38931a77714e9b6ea37d65ea33515149544985af' }, "Add Participant"))), h("slot", { key: '7e65218d2cefe2e47361ea2e32a9e2055ed6b94e' })));
+            })), h("div", { key: '497f0dc32f959d13479a80d8a5937260115b4123', class: 'add-participant-button' }, h("button", { key: 'd7c12c8a608f2e6b869a5a00a1454d55aaddb379', onClick: () => this.addParticipant.emit({ type: 'SIGNER' }) }, h("ls-icon", { key: 'b094c35047b8e5779931c1c3f00af8cef9ebcf16', name: "user-add", size: "20", color: "var(--gray-100, #45484D);" }), h("p", { key: '919fffddfd800b27eaea14bd9d14ef796c7106a4' }, "Add Participant"))), h("slot", { key: '85f31e1970f6733cae4e5d4dd3870b1d19313eac' })));
     }
     static get is() { return "ls-participant-manager"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ls-participant-select/ls-participant-select.js CHANGED Viewed

@@ -47,27 +47,27 @@ export class LsParticipantSelect {
         this.addParticipant.emit({ type: 'SIGNER' });
     }
     render() {
-        return (h(Host, { key: '6950867b21eacab043f109294e8a86799250af52' }, h("div", { key: '6cee0c1c2ff0ad81b3568c1e293d3f0b5c72129c', class: "dropdown" }, h("div", { key: 'dedfefa95a9e146fb01c4bc1d8b0ac0d4720a3a0', class: "dropdown-header", onClick: this.toggleDropdown }, h("svg", { key: '6b8caf619b3b5e8e1556fb2168c995d0420662dd', width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'bc74e68f08b0e45cdb363bf20ce363e27250887a', d: "M4 0.5H6.5C8.433 0.5 10 2.067 10 4V6.5C10 8.433 8.433 10 6.5 10H4C2.067 10 0.5 8.433 0.5 6.5V4C0.5 2.067 2.067 0.5 4 0.5Z", fill: "#78A3FA", stroke: "#F7F8FA" }), h("path", { key: '7f5cea5ce53fa5fa26f7075e2b00e00f09d40cb8', d: "M13.5 0.5H16C17.933 0.5 19.5 2.067 19.5 4V6.5C19.5 8.433 17.933 10 16 10H13.5C11.567 10 10 8.433 10 6.5V4C10 2.067 11.567 0.5 13.5 0.5Z", fill: "#46DBAA", stroke: "#F7F8FA" }), h("path", { key: '4a5281cf601d6646e74c52280a998922a7e79dea', d: "M4 10H6.5C8.433 10 10 11.567 10 13.5V16C10 17.933 8.433 19.5 6.5 19.5H4C2.067 19.5 0.5 17.933 0.5 16V13.5C0.5 11.567 2.067 10 4 10Z", fill: "#FAD232", stroke: "#F7F8FA" }), h("path", { key: '159757d502e8a56e1dec57be8787dbf9f2d2f5c8', d: "M14.75 12.125V14.75M14.75 14.75V17.375M14.75 14.75H17.375M14.75 14.75L12.125 14.75", stroke: "#939599", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })), h("p", { key: '34e4eeb7da4c01b54a8cb0678c7647e70398b8cd', class: 'placing-fields-text' }, "Placing Fields for"), h("div", { key: 'e0d9e844f6ee5becf6897a191949cf162461d479', class: 'selected-role-label', style: {
+        return (h(Host, { key: 'b6c0fe3713f4066979f39e806b3d831796bb9e6f' }, h("div", { key: '6684803372e06f0827bbd07fed402828c9670ce0', class: "dropdown" }, h("div", { key: 'ff72caf21ba3b5e45bc9315f0909ed56046beedf', class: "dropdown-header", onClick: this.toggleDropdown }, h("svg", { key: '31cefa8af5b2eb5dc31ab9547a9872377b9df296', width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '78c2462779dbd4252725d45d5a35d6fb5f7e4833', d: "M4 0.5H6.5C8.433 0.5 10 2.067 10 4V6.5C10 8.433 8.433 10 6.5 10H4C2.067 10 0.5 8.433 0.5 6.5V4C0.5 2.067 2.067 0.5 4 0.5Z", fill: "#78A3FA", stroke: "#F7F8FA" }), h("path", { key: '56b16b54f0836e2ec2d4b9accde5256e9532c3d8', d: "M13.5 0.5H16C17.933 0.5 19.5 2.067 19.5 4V6.5C19.5 8.433 17.933 10 16 10H13.5C11.567 10 10 8.433 10 6.5V4C10 2.067 11.567 0.5 13.5 0.5Z", fill: "#46DBAA", stroke: "#F7F8FA" }), h("path", { key: '0404d8cda835b8f574384de4d265142b9325d746', d: "M4 10H6.5C8.433 10 10 11.567 10 13.5V16C10 17.933 8.433 19.5 6.5 19.5H4C2.067 19.5 0.5 17.933 0.5 16V13.5C0.5 11.567 2.067 10 4 10Z", fill: "#FAD232", stroke: "#F7F8FA" }), h("path", { key: 'af5be968a65b3c1034b2b97707c05adb7ce80877', d: "M14.75 12.125V14.75M14.75 14.75V17.375M14.75 14.75H17.375M14.75 14.75L12.125 14.75", stroke: "#939599", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })), h("p", { key: 'e328a10bb25020af396b2b0aba5a2dbac304aada', class: 'placing-fields-text' }, "Placing Fields for"), h("div", { key: 'f8a60e17703428f1d5e90b52cfca3aeea581a1c5', class: 'selected-role-label', style: {
                 background: defaultRolePalette[this.selectedRole?.signerIndex % 100].s20,
                 color: defaultRolePalette[this.selectedRole?.signerIndex % 100].s80,
-            } }, h("ls-icon", { key: '07a439019eb0f4b0d0bf6d43a446b71116724ea1', size: "18", name: this.selectedRole?.roleType === 'SENDER'
+            } }, h("ls-icon", { key: '31fa0da404dbafc3964f77a62df9742c62710096', size: "18", name: this.selectedRole?.roleType === 'SENDER'
                 ? 'user'
                 : this.selectedRole?.roleType === 'APPROVER'
                     ? 'check-circle'
                     : this.selectedRole?.roleType === 'WITNESS'
                         ? 'eye'
                         : 'signature' }), this.selectedRole.name ||
-            (this.selectedRole.roleType === 'WITNESS' ? `Witness` : `Participant ${this.selectedRole.signerIndex}`)), h("button", { key: '55b83958886fde359391eac13b951c4226155285', class: 'tertiaryGrey expand-button', "aria-haspopup": "listbox", "aria-expanded": this.isOpen }, h("ls-icon", { key: '03ef16af766f7e9d78379ad2d25b7dde1686de29', name: "chevron-down" }))), this.isOpen && (h("div", { key: '6375a9abb38c053c79651202055edb2f0679d21f', class: "dropdown-list" }, h("div", { key: '4d36e35c8f847ee31f54510d8b881e007a810408', class: this.selectedRole?.signerIndex === 0 ? 'dropdown-item selected' : 'dropdown-item', style: {
+            (this.selectedRole.roleType === 'WITNESS' ? `Witness` : `Participant ${this.selectedRole.signerIndex}`)), h("button", { key: 'a9f377a6742a1a2bb6d66578f3e1b1c7363aa250', class: 'tertiaryGrey expand-button', "aria-haspopup": "listbox", "aria-expanded": this.isOpen }, h("ls-icon", { key: '5c40923b17ab05ad55440bbb82c0786d03b05c20', name: "chevron-down" }))), this.isOpen && (h("div", { key: '28ad84cd3055cbc866588a70fe4cd1ecbcb8ee2d', class: "dropdown-list" }, h("div", { key: '2aaeb0f6d717c690328cd713cb5baded276244bb', class: this.selectedRole?.signerIndex === 0 ? 'dropdown-item selected' : 'dropdown-item', style: {
                 '--background-selected': defaultRolePalette[0].s10,
                 '--check-icon-selected': defaultRolePalette[0].s50,
-            }, onClick: () => this.selectRole({ signerIndex: 0, name: 'Sender', roleType: 'SENDER' }), onMouseEnter: e => e.currentTarget.querySelector('.check-icon')?.setAttribute('name', 'check-circle'), onMouseLeave: e => e.currentTarget.querySelector('.check-icon')?.setAttribute('name', this.selectedRole?.signerIndex !== 0 ? 'base-circle' : 'check-circle') }, h("div", { key: '26c2d2f51b74420957e21259f1db70a8fc808023', class: 'role-icon', style: {
+            }, onClick: () => this.selectRole({ signerIndex: 0, name: 'Sender', roleType: 'SENDER' }), onMouseEnter: e => e.currentTarget.querySelector('.check-icon')?.setAttribute('name', 'check-circle'), onMouseLeave: e => e.currentTarget.querySelector('.check-icon')?.setAttribute('name', this.selectedRole?.signerIndex !== 0 ? 'base-circle' : 'check-circle') }, h("div", { key: 'd1848d2ade27865d3a4025bea1d7fd5b42ac0cec', class: 'role-icon', style: {
                 background: defaultRolePalette[0].s50,
                 color: defaultRolePalette[0].s80,
-            } }, h("ls-icon", { key: '7e9c1cf311546bb1be6b417dda61c8524bea0df7', name: "user" })), h("div", { key: '5a73cf2f66ea7d04a11668fc6b7b34d5c06153f3', class: 'role-text' }, h("p", { key: '576c6bfdb5c061125efb1a65ae711fe561bcf3cb', class: 'role-name', style: {
+            } }, h("ls-icon", { key: '080041a7a5ec70813a0ec797c163c1c976227023', name: "user" })), h("div", { key: 'd2291d454de4996e30b167e64362d7855f7bf736', class: 'role-text' }, h("p", { key: '690278a956444279820baf964c2991822882f442', class: 'role-name', style: {
                 '--role-name-selected': defaultRolePalette[0].s80,
-            } }, 'Sender'), h("p", { key: '10637213ff3f04c71bcc2c1de6fe7c1bb07bb9ef', class: 'role-type', style: {
+            } }, 'Sender'), h("p", { key: 'd247fcfd3b2f8f128214052b2b813d3cc84537d7', class: 'role-type', style: {
                 '--role-type-selected': defaultRolePalette[0].s80,
-            } }, "You")), h("ls-icon", { key: 'c5b79d6c8ed58a671870ee52f35a9463817ea1c4', class: 'check-icon', name: this.selectedRole?.signerIndex === 0 ? 'check-circle' : 'base-circle', solid: this.selectedRole?.signerIndex === 0 })), this.roles.map(r => (h("div", { class: r.signerIndex === this.selectedRole?.signerIndex ? 'dropdown-item selected' : 'dropdown-item', style: {
+            } }, "You")), h("ls-icon", { key: 'ddd63ed355d0f76cdb850cf53fc93e5ae9910885', class: 'check-icon', name: this.selectedRole?.signerIndex === 0 ? 'check-circle' : 'base-circle', solid: this.selectedRole?.signerIndex === 0 })), this.roles.map(r => (h("div", { class: r.signerIndex === this.selectedRole?.signerIndex ? 'dropdown-item selected' : 'dropdown-item', style: {
                 '--background-selected': defaultRolePalette[r?.signerIndex % 100].s10,
                 '--check-icon-selected': defaultRolePalette[r?.signerIndex % 100].s50,
             }, onClick: () => this.selectRole(r), onMouseEnter: e => e.currentTarget.querySelector('.check-icon')?.setAttribute('name', 'check-circle'), onMouseLeave: e => e.currentTarget
@@ -79,10 +79,10 @@ export class LsParticipantSelect {
                 '--role-name-selected': defaultRolePalette[r?.signerIndex % 100].s100,
             } }, r.name || (r.signerIndex > 100 ? `Participant ${r.signerIndex - 100} Witness` : `Participant ${r.signerIndex}`)), h("p", { class: 'role-type', style: {
                 '--role-type-selected': defaultRolePalette[r?.signerIndex % 100].s80,
-            } }, r.roleType === 'WITNESS' ? 'Witness' : r.roleType === 'APPROVER' ? 'Approver' : 'Signer')), h("ls-icon", { class: 'check-icon', name: r.signerIndex === this.selectedRole?.signerIndex ? 'check-circle' : 'base-circle', solid: r.signerIndex === this.selectedRole?.signerIndex })))), h("button", { key: '5e1d3ea35554d21b1b79adac1fd0b643ea04c6ab', onClick: () => this.createHandler(), class: 'add-participant-row', style: {
+            } }, r.roleType === 'WITNESS' ? 'Witness' : r.roleType === 'APPROVER' ? 'Approver' : 'Signer')), h("ls-icon", { class: 'check-icon', name: r.signerIndex === this.selectedRole?.signerIndex ? 'check-circle' : 'base-circle', solid: r.signerIndex === this.selectedRole?.signerIndex })))), h("button", { key: 'c963c8aac2d93651b44e243a56f88c747e43afb4', onClick: () => this.createHandler(), class: 'add-participant-row', style: {
                 '--background-selected': defaultRolePalette[1].s10,
                 '--check-icon-selected': defaultRolePalette[1].s50,
-            } }, h("div", { key: '5f042ef7e7ce1308ff2e3be58a66e027774ae243', class: 'add-participant-icon' }, h("ls-icon", { key: 'f9411fcf6cb31280ff2ea5e05f486620292634e7', name: "user-add" })), h("div", { key: '234565ae06381fd6c08d03b084f6ea193b755b1e', class: 'role-text' }, h("p", { key: '91fde75b433331bb60de99ce58034e35b43f09c2', class: 'role-name' }, "Add Participant"), h("p", { key: 'fcb5102922c7ab16c87d1107e918ecd9bd66da29', class: 'role-type' }, "Add a new Signer")), h("ls-icon", { key: '9faa007755606250e0cabc95221f13d544da02d7', class: 'plus-icon', name: "plus" }))))), h("slot", { key: '168f7f30718c349a2117b18fe63911f74d7236db' })));
+            } }, h("div", { key: 'f4dc88196a4c4031a666a321f9f878ed53608bb0', class: 'add-participant-icon' }, h("ls-icon", { key: 'da7f76f0162eab462a062f34e4eeedd0e4fa854f', name: "user-add" })), h("div", { key: '16a8dfcdfa518553575bf5f77b626ab9524be97f', class: 'role-text' }, h("p", { key: '253139c492b6196657c86fc0e0522ea8af096dd4', class: 'role-name' }, "Add Participant"), h("p", { key: '50f7e648640b120ef1fccee7f9faff3813cf7c5a', class: 'role-type' }, "Add a new Signer")), h("ls-icon", { key: 'ea077f3f7ad79f2592f03940290732b7e97be12c', class: 'plus-icon', name: "plus" }))))), h("slot", { key: '492e7c7bbedbb5a651120406ef143e9d3b9e8d09' })));
     }
     static get is() { return "ls-participant-select"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ls-participant-select/ls-participant-select.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ls-participant-select.js","sourceRoot":"","sources":["../../../src/components/ls-participant-select/ls-participant-select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, Event, EventEmitter, State, Watch } from '@stencil/core';\nimport { LSApiRole, LSApiRoleType } from '../../types/LSApiRole';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\n\n@Component({\n tag: 'ls-participant-select',\n styleUrl: 'ls-participant-select.css',\n shadow: true,\n})\nexport class LsParticipantSelect {\n /*\n The id of the currently selected role.\n * {string}\n /\n @Prop({ mutable: true}) selected: string;\n \n /\n The currently selected role.\n * {number}\n /\n @State() selectedRole: { signerIndex: number; name: string; roleType?: string; default: boolean } = { signerIndex: 0, name: 'Sender', roleType: 'SENDER', default: true };\n\n @Watch('roles')\n handleRoleLoad() {\n if(this.selectedRole.default) {\n if(this.roles.length > 0) {\n const initialRole = this.roles.find(r => r.signerIndex === 1);\n if(initialRole) {\n this.selectedRole = { ...initialRole, default: false };\n }\n }\n } else {\n const updatedRole = this.roles.find(r => r.signerIndex === this.selectedRole.signerIndex);\n if(updatedRole) {\n this.selectedRole = { ...updatedRole, default: false };\n }\n }\n }\n /\n The current template roles.\n * {LSApiRole}\n */\n @Prop() roles?: LSApiRole[] = [];\n\n @State() isOpen: boolean = false;\n\n\n toggleDropdown = () => {\n this.isOpen = !this.isOpen;\n };\n\n @Event() roleChange: EventEmitter<number>;\n\n @Event({\n bubbles: true,\n composed: true,\n }) addParticipant: EventEmitter<{type: LSApiRoleType, parent?: string \| null}>;\n\n\n selectRole(role: { signerIndex: number; name: string; roleType?: string }) {\n this.selectedRole = { ...role, default: false };\n this.isOpen = false;\n this.roleChange.emit(role.signerIndex);\n }\n\n createHandler() {\n this.addParticipant.emit({type: 'SIGNER'});\n }\n\n render() {\n return (\n <Host>\n <div class=\"dropdown\">\n <div class=\"dropdown-header\" onClick={this.toggleDropdown}>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 0.5H6.5C8.433 0.5 10 2.067 10 4V6.5C10 8.433 8.433 10 6.5 10H4C2.067 10 0.5 8.433 0.5 6.5V4C0.5 2.067 2.067 0.5 4 0.5Z\" fill=\"#78A3FA\" stroke=\"#F7F8FA\" />\n <path\n d=\"M13.5 0.5H16C17.933 0.5 19.5 2.067 19.5 4V6.5C19.5 8.433 17.933 10 16 10H13.5C11.567 10 10 8.433 10 6.5V4C10 2.067 11.567 0.5 13.5 0.5Z\"\n fill=\"#46DBAA\"\n stroke=\"#F7F8FA\"\n />\n <path\n d=\"M4 10H6.5C8.433 10 10 11.567 10 13.5V16C10 17.933 8.433 19.5 6.5 19.5H4C2.067 19.5 0.5 17.933 0.5 16V13.5C0.5 11.567 2.067 10 4 10Z\"\n fill=\"#FAD232\"\n stroke=\"#F7F8FA\"\n />\n <path\n d=\"M14.75 12.125V14.75M14.75 14.75V17.375M14.75 14.75H17.375M14.75 14.75L12.125 14.75\"\n stroke=\"#939599\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n <p class={'placing-fields-text'}>Placing Fields for</p>\n <div\n class={'selected-role-label'}\n style={{\n background: defaultRolePalette[this.selectedRole?.signerIndex % 100].s20,\n color: defaultRolePalette[this.selectedRole?.signerIndex % 100].s80,\n }}\n >\n <ls-icon\n size=\"18\"\n name={\n this.selectedRole?.roleType === 'SENDER'\n ? 'user'\n : this.selectedRole?.roleType === 'APPROVER'\n ? 'check-circle'\n : this.selectedRole?.roleType === 'WITNESS'\n ? 'eye'\n : 'signature'\n }\n />\n {this.selectedRole.name \|\|\n (this.selectedRole.roleType === 'WITNESS' ? `Witness` : `Participant ${this.selectedRole.signerIndex}`)}\n </div>\n <button class={'tertiaryGrey expand-button'} aria-haspopup=\"listbox\" aria-expanded={this.isOpen}>\n <ls-icon name=\"chevron-down\"></ls-icon>\n </button>\n </div>\n {this.isOpen && (\n <div class=\"dropdown-list\">\n <div\n class={this.selectedRole?.signerIndex === 0 ? 'dropdown-item selected' : 'dropdown-item'}\n style={{\n '--background-selected': defaultRolePalette[0].s10,\n '--check-icon-selected': defaultRolePalette[0].s50,\n }}\n onClick={() => this.selectRole({ signerIndex: 0, name: 'Sender', roleType: 'SENDER' })}\n onMouseEnter={e => (e.currentTarget as HTMLElement).querySelector('.check-icon')?.setAttribute('name', 'check-circle')}\n onMouseLeave={e =>\n (e.currentTarget as HTMLElement).querySelector('.check-icon')?.setAttribute('name', this.selectedRole?.signerIndex !== 0 ? 'base-circle' : 'check-circle')\n }\n >\n <div\n class={'role-icon'}\n style={{\n background: defaultRolePalette[0].s50,\n color: defaultRolePalette[0].s80,\n }}\n >\n <ls-icon name=\"user\" />\n </div>\n <div class={'role-text'}>\n <p\n class={'role-name'}\n style={{\n '--role-name-selected': defaultRolePalette[0].s80,\n }}\n >\n {'Sender'}\n </p>\n <p\n class={'role-type'}\n style={{\n '--role-type-selected': defaultRolePalette[0].s80,\n }}\n >\n You\n </p>\n </div>\n\n <ls-icon class={'check-icon'} name={this.selectedRole?.signerIndex === 0 ? 'check-circle' : 'base-circle'} solid={this.selectedRole?.signerIndex === 0} />\n </div>\n {this.roles.map(r => (\n <div\n class={r.signerIndex === this.selectedRole?.signerIndex ? 'dropdown-item selected' : 'dropdown-item'}\n style={{\n '--background-selected': defaultRolePalette[r?.signerIndex % 100].s10,\n '--check-icon-selected': defaultRolePalette[r?.signerIndex % 100].s50,\n }}\n onClick={() => this.selectRole(r)}\n onMouseEnter={e => (e.currentTarget as HTMLElement).querySelector('.check-icon')?.setAttribute('name', 'check-circle')}\n onMouseLeave={e =>\n (e.currentTarget as HTMLElement)\n .querySelector('.check-icon')\n ?.setAttribute('name', r.signerIndex !== this.selectedRole?.signerIndex ? 'base-circle' : 'check-circle')\n }\n >\n <div\n class={'role-icon'}\n style={{\n background: r.signerIndex > 100 ? defaultRolePalette[r?.signerIndex % 100].s30 : defaultRolePalette[r?.signerIndex % 100].s40,\n color: defaultRolePalette[r?.signerIndex % 100].s90,\n }}\n >\n <ls-icon name={r.roleType === 'WITNESS' ? 'eye' : r.roleType === 'APPROVER' ? 'check-circle' : 'signature'} />\n </div>\n <div class={'role-text'}>\n <p\n class={'role-name'}\n style={{\n '--role-name-selected': defaultRolePalette[r?.signerIndex % 100].s100,\n }}\n >\n {r.name \|\| (r.signerIndex > 100 ? `Participant ${r.signerIndex - 100} Witness` : `Participant ${r.signerIndex}`)}\n </p>\n <p\n class={'role-type'}\n style={{\n '--role-type-selected': defaultRolePalette[r?.signerIndex % 100].s80,\n }}\n >\n {r.roleType === 'WITNESS' ? 'Witness' : r.roleType === 'APPROVER' ? 'Approver' : 'Signer'}\n </p>\n </div>\n <ls-icon\n class={'check-icon'}\n name={r.signerIndex === this.selectedRole?.signerIndex ? 'check-circle' : 'base-circle'}\n solid={r.signerIndex === this.selectedRole?.signerIndex}\n />\n </div>\n ))}\n <button\n onClick={() => this.createHandler()}\n class={'add-participant-row'}\n style={{\n '--background-selected': defaultRolePalette[1].s10,\n '--check-icon-selected': defaultRolePalette[1].s50,\n }}\n >\n <div\n class={'add-participant-icon'}\n >\n <ls-icon name=\"user-add\" />\n </div>\n <div class={'role-text'}>\n <p class={'role-name'}>Add Participant</p>\n <p class={'role-type'}>Add a new Signer</p>\n </div>\n <ls-icon class={'plus-icon'} name=\"plus\" />\n </button>\n </div>\n )}\n </div>\n <slot></slot>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ls-participant-select.js","sourceRoot":"","sources":["../../../src/components/ls-participant-select/ls-participant-select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, Event, EventEmitter, State, Watch } from '@stencil/core';\nimport { LSApiRole, LSApiRoleType } from '../../types/LSApiRole';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\n\n@Component({\n tag: 'ls-participant-select',\n styleUrl: 'ls-participant-select.css',\n shadow: true,\n})\nexport class LsParticipantSelect {\n /*\n The id of the currently selected role.\n * {string}\n /\n @Prop({ mutable: true}) selected: string;\n \n /\n The currently selected role.\n * {number}\n /\n @State() selectedRole: { signerIndex: number; name: string; roleType?: string; default: boolean } = { signerIndex: 0, name: 'Sender', roleType: 'SENDER', default: true };\n\n @Watch('roles')\n handleRoleLoad() {\n if(this.selectedRole.default) {\n if(this.roles.length > 0) {\n const initialRole = this.roles.find(r => r.signerIndex === 1);\n if(initialRole) {\n this.selectedRole = { ...initialRole, default: false };\n }\n }\n } else {\n const updatedRole = this.roles.find(r => r.signerIndex === this.selectedRole.signerIndex);\n if(updatedRole) {\n this.selectedRole = { ...updatedRole, default: false };\n }\n }\n }\n /\n The current template roles.\n * {LSApiRole}\n */\n @Prop() roles?: LSApiRole[] = [];\n\n @State() isOpen: boolean = false;\n\n\n toggleDropdown = () => {\n this.isOpen = !this.isOpen;\n };\n\n @Event() roleChange: EventEmitter<number>;\n\n @Event({\n bubbles: true,\n composed: true,\n }) addParticipant: EventEmitter<{type: LSApiRoleType, parent?: string \| null}>;\n\n\n selectRole(role: { signerIndex: number; name: string; roleType?: string }) {\n this.selectedRole = { ...role, default: false };\n this.isOpen = false;\n this.roleChange.emit(role.signerIndex);\n }\n\n createHandler() {\n this.addParticipant.emit({type: 'SIGNER'});\n }\n\n render() {\n return (\n <Host>\n <div class=\"dropdown\">\n <div class=\"dropdown-header\" onClick={this.toggleDropdown}>\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M4 0.5H6.5C8.433 0.5 10 2.067 10 4V6.5C10 8.433 8.433 10 6.5 10H4C2.067 10 0.5 8.433 0.5 6.5V4C0.5 2.067 2.067 0.5 4 0.5Z\" fill=\"#78A3FA\" stroke=\"#F7F8FA\" />\n <path\n d=\"M13.5 0.5H16C17.933 0.5 19.5 2.067 19.5 4V6.5C19.5 8.433 17.933 10 16 10H13.5C11.567 10 10 8.433 10 6.5V4C10 2.067 11.567 0.5 13.5 0.5Z\"\n fill=\"#46DBAA\"\n stroke=\"#F7F8FA\"\n />\n <path\n d=\"M4 10H6.5C8.433 10 10 11.567 10 13.5V16C10 17.933 8.433 19.5 6.5 19.5H4C2.067 19.5 0.5 17.933 0.5 16V13.5C0.5 11.567 2.067 10 4 10Z\"\n fill=\"#FAD232\"\n stroke=\"#F7F8FA\"\n />\n <path\n d=\"M14.75 12.125V14.75M14.75 14.75V17.375M14.75 14.75H17.375M14.75 14.75L12.125 14.75\"\n stroke=\"#939599\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n <p class={'placing-fields-text'}>Placing Fields for</p>\n <div\n class={'selected-role-label'}\n style={{\n background: defaultRolePalette[this.selectedRole?.signerIndex % 100].s20,\n color: defaultRolePalette[this.selectedRole?.signerIndex % 100].s80,\n }}\n >\n <ls-icon\n size=\"18\"\n name={\n this.selectedRole?.roleType === 'SENDER'\n ? 'user'\n : this.selectedRole?.roleType === 'APPROVER'\n ? 'check-circle'\n : this.selectedRole?.roleType === 'WITNESS'\n ? 'eye'\n : 'signature'\n }\n />\n {this.selectedRole.name \|\|\n (this.selectedRole.roleType === 'WITNESS' ? `Witness` : `Participant ${this.selectedRole.signerIndex}`)}\n </div>\n <button class={'tertiaryGrey expand-button'} aria-haspopup=\"listbox\" aria-expanded={this.isOpen}>\n <ls-icon name=\"chevron-down\"></ls-icon>\n </button>\n </div>\n {this.isOpen && (\n <div class=\"dropdown-list\">\n \n <div\n class={this.selectedRole?.signerIndex === 0 ? 'dropdown-item selected' : 'dropdown-item'}\n style={{\n '--background-selected': defaultRolePalette[0].s10,\n '--check-icon-selected': defaultRolePalette[0].s50,\n }}\n onClick={() => this.selectRole({ signerIndex: 0, name: 'Sender', roleType: 'SENDER' })}\n onMouseEnter={e => (e.currentTarget as HTMLElement).querySelector('.check-icon')?.setAttribute('name', 'check-circle')}\n onMouseLeave={e =>\n (e.currentTarget as HTMLElement).querySelector('.check-icon')?.setAttribute('name', this.selectedRole?.signerIndex !== 0 ? 'base-circle' : 'check-circle')\n }\n >\n <div\n class={'role-icon'}\n style={{\n background: defaultRolePalette[0].s50,\n color: defaultRolePalette[0].s80,\n }}\n >\n <ls-icon name=\"user\" />\n </div>\n <div class={'role-text'}>\n <p\n class={'role-name'}\n style={{\n '--role-name-selected': defaultRolePalette[0].s80,\n }}\n >\n {'Sender'}\n </p>\n <p\n class={'role-type'}\n style={{\n '--role-type-selected': defaultRolePalette[0].s80,\n }}\n >\n You\n </p>\n </div>\n\n <ls-icon class={'check-icon'} name={this.selectedRole?.signerIndex === 0 ? 'check-circle' : 'base-circle'} solid={this.selectedRole?.signerIndex === 0} />\n </div>\n {this.roles.map(r => (\n <div\n class={r.signerIndex === this.selectedRole?.signerIndex ? 'dropdown-item selected' : 'dropdown-item'}\n style={{\n '--background-selected': defaultRolePalette[r?.signerIndex % 100].s10,\n '--check-icon-selected': defaultRolePalette[r?.signerIndex % 100].s50,\n }}\n onClick={() => this.selectRole(r)}\n onMouseEnter={e => (e.currentTarget as HTMLElement).querySelector('.check-icon')?.setAttribute('name', 'check-circle')}\n onMouseLeave={e =>\n (e.currentTarget as HTMLElement)\n .querySelector('.check-icon')\n ?.setAttribute('name', r.signerIndex !== this.selectedRole?.signerIndex ? 'base-circle' : 'check-circle')\n }\n >\n <div\n class={'role-icon'}\n style={{\n background: r.signerIndex > 100 ? defaultRolePalette[r?.signerIndex % 100].s30 : defaultRolePalette[r?.signerIndex % 100].s40,\n color: defaultRolePalette[r?.signerIndex % 100].s90,\n }}\n >\n <ls-icon name={r.roleType === 'WITNESS' ? 'eye' : r.roleType === 'APPROVER' ? 'check-circle' : 'signature'} />\n </div>\n <div class={'role-text'}>\n <p\n class={'role-name'}\n style={{\n '--role-name-selected': defaultRolePalette[r?.signerIndex % 100].s100,\n }}\n >\n {r.name \|\| (r.signerIndex > 100 ? `Participant ${r.signerIndex - 100} Witness` : `Participant ${r.signerIndex}`)}\n </p>\n <p\n class={'role-type'}\n style={{\n '--role-type-selected': defaultRolePalette[r?.signerIndex % 100].s80,\n }}\n >\n {r.roleType === 'WITNESS' ? 'Witness' : r.roleType === 'APPROVER' ? 'Approver' : 'Signer'}\n </p>\n </div>\n <ls-icon\n class={'check-icon'}\n name={r.signerIndex === this.selectedRole?.signerIndex ? 'check-circle' : 'base-circle'}\n solid={r.signerIndex === this.selectedRole?.signerIndex}\n />\n </div>\n ))}\n <button\n onClick={() => this.createHandler()}\n class={'add-participant-row'}\n style={{\n '--background-selected': defaultRolePalette[1].s10,\n '--check-icon-selected': defaultRolePalette[1].s50,\n }}\n >\n <div\n class={'add-participant-icon'}\n >\n <ls-icon name=\"user-add\" />\n </div>\n <div class={'role-text'}>\n <p class={'role-name'}>Add Participant</p>\n <p class={'role-type'}>Add a new Signer</p>\n </div>\n <ls-icon class={'plus-icon'} name=\"plus\" />\n </button>\n </div>\n )}\n </div>\n <slot></slot>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/ls-props-section/ls-props-section.js CHANGED Viewed

@@ -4,7 +4,7 @@ export class LsPropsSection {
     sectionDescription;
     row = false;
     render() {
-        return (h(Host, { key: '2e9bc93a39de751b09f7f15424e053f087e732ee' }, h("div", { key: 'bc9a664955b8b7bac5fcee4b4b89897c7dc5b7ab', class: this.row ? 'ls-field-properties-section row' : 'ls-field-properties-section' }, h("div", { key: '23e4dfdf4bb9d5e1d7590445394149b6a805faeb', class: 'ls-field-properties-section-text' }, h("p", { key: '127b7257f2386f0ab2b7832f4ea6a0836408a2fd', class: 'ls-field-properties-section-title' }, this.sectionTitle), this.sectionDescription && h("p", { key: 'a76879fb1266dad048c3a4769e840b78c78f549e', class: 'ls-field-properties-section-description' }, this.sectionDescription)), h("slot", { key: '3927e8b73f16ef502a2e3c63dd27435a90e736f8' }))));
+        return (h(Host, { key: '03cb2954b250c40b4316dffb5d7707c71a7f38e7' }, h("div", { key: 'b92f18b35e488f24328e8441a95a3ed08557db0b', class: this.row ? 'ls-field-properties-section row' : 'ls-field-properties-section' }, h("div", { key: '5c733fd7aaa6bdf26f50def47486bc8229d7f543', class: 'ls-field-properties-section-text' }, h("p", { key: '7602d822b7e2ddff83eba8445990c0ee2fa5358c', class: 'ls-field-properties-section-title' }, this.sectionTitle), this.sectionDescription && h("p", { key: '40fac820efd6753b9044bac5eefa3bd46275e446', class: 'ls-field-properties-section-description' }, this.sectionDescription)), h("slot", { key: 'ee974bae93182ff5f774edf9dc7bed797b59339a' }))));
     }
     static get is() { return "ls-props-section"; }
     static get encapsulation() { return "shadow"; }