legalesign-document-viewer 0.3.3 → 0.3.5

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

@@ -1,291 +0,0 @@
-import { Host, h } from "@stencil/core";
-import { defaultRolePalette } from "../ls-document-viewer/defaultPalette";
-export class LsParticipantCard {
-    component;
-    signer;
-    index;
-    editable = false;
-    template;
-    mutate;
-    update;
-    opened;
-    // Send one or more mutations up the chain
-    // The source of the chain fires the mutation
-    // NOTE this alter is debounced to account for typing
-    alter(diff) {
-        this.signer = { ...this.signer, ...diff };
-        this.debounce(this.signer, 500);
-    }
-    labeltimer;
-    debounce(data, delay) {
-        if (this.labeltimer)
-            clearTimeout(this.labeltimer);
-        this.labeltimer = setTimeout(() => {
-            const diffs = [{ action: 'update', data }];
-            this.mutate.emit(diffs);
-            this.update.emit(diffs);
-        }, delay);
-    }
-    deleteHandler(role) {
-        this.update.emit([{ action: 'delete', data: role }]);
-        this.mutate.emit([{ action: 'delete', data: role }]);
-    }
-    swapHandler(role1, role2) {
-        this.update.emit([{ action: 'swap', data: role1, data2: role2 }]);
-        this.mutate.emit([{ action: 'swap', data: role1, data2: role2 }]);
-    }
-    modeHandler(_editable) {
-        // When opened fire an event to let the parent handle closing other controls
-        if (_editable) {
-            this.opened.emit(this.signer);
-        }
-    }
-    addParticipant;
-    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: 'e948d8be468f8e81b0ea752b8c37aef7e83d5227' }, h("div", { key: '445aea342b4e4397bc4e6eb8c20e171bd853d59f', 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: 'b9e87febf6217ffb40c228e67dccc59a4e0a79ea', class: 'participant-card-inner' }, h("div", { key: '930e5dd57d2dba41214d4ae86b4520aec572e92a', class: 'participant-card-top-items' }, h("div", { key: '5cea99ed2038b51441e34c3be9510f7163b27e56', class: 'role-label', style: {
-                background: defaultRolePalette[this.signer?.signerIndex % 100].s20,
-                color: defaultRolePalette[this.signer?.signerIndex % 100].s90,
-            } }, h("ls-icon", { key: 'b8bb19361e0cef64eae9bebf01a0fe73ade6be99', name: this.signer?.roleType === 'APPROVER' ? 'check-circle' : this.signer?.roleType === 'SIGNER' ? 'signature' : 'eye' }), 'Participant ' + (this.signer?.signerIndex || '')), h("div", { key: '14bb3077badecdd639ca9221db8ff8135072f008', class: 'button-set hidden' }, this.index > 0 && this.signer.roleType !== 'WITNESS' && (h("div", { key: 'eaf07f2aca39b4666ee36ed50023b198cc6695a9', 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,
-            } }, h("ls-icon", { key: '48f6736e9f88b03b71dc0836141f2dce10c592da', name: "arrow-up", size: "18" }))), this.signer.signerIndex !== this.template.roles.length && this.signer.roleType !== 'WITNESS' && (h("div", { key: 'f1df1663aba7445c3998a10388054c38202a45d7', 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,
-            } }, h("ls-icon", { key: '21f3302957048e5c218f04e6da680a5be3ac55ba', name: "arrow-down", size: "18" }))), h("div", { key: '4b59e37058412bbd8d04deb4418fb3f764dbf360', 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: 'ab068a9b7832b9387a006230231970dd425ae739', name: this.editable ? 'check' : 'pencil-alt', size: "18" })), h("div", { key: 'acede95c9e80168f22b08e24602ade0b1fe1fdb7', 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,
-            } }, h("ls-icon", { key: 'd72ebe8b0544eee194842f91f5d449d20ed1da56', 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: () => {
-                this.deleteHandler(child);
-            } }, h("ls-icon", { name: "minus-sm", style: { marginRight: '0.25rem' } }), "Remove Witness")) : this.signer?.roleType === 'WITNESS' ? (h("button", { class: 'destructive', onClick: () => {
-                this.deleteHandler(this.signer);
-            } }, h("ls-icon", { name: "minus-sm", style: { marginRight: '0.25rem' } }), "Remove Witness")) : null)) : (h("div", { class: 'participant-card-text' }, h("p", { class: "participant-text-description", style: {
-                color: defaultRolePalette[this.signer?.signerIndex % 100].s100,
-            } }, this.signer.name || `${this.signer.signerIndex > 100 ? 'Witness' : 'Signer'} ${this.signer.signerIndex + 1}`), h("p", { class: "participant-text-type", style: {
-                color: defaultRolePalette[this.signer?.signerIndex % 100].s80,
-                textTransform: 'capitalize',
-            } }, 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: '8059f6c9ce00424f838f1c073ec9b3bf62d1f25d' })));
-    }
-    static get is() { return "ls-participant-card"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["ls-participant-card.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["ls-participant-card.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "signer": {
-                "type": "unknown",
-                "attribute": "signer",
-                "mutable": false,
-                "complexType": {
-                    "original": "LSApiRole",
-                    "resolved": "{ children?: LSApiRole[]; id: string; name: string; roleType: LSApiRoleType; signerIndex: number; ordinal: number; signerParent?: string; experience: string; templateId?: string; }",
-                    "references": {
-                        "LSApiRole": {
-                            "location": "import",
-                            "path": "../../types/LSApiRole",
-                            "id": "src/types/LSApiRole.ts::LSApiRole"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false
-            },
-            "index": {
-                "type": "number",
-                "attribute": "index",
-                "mutable": false,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false
-            },
-            "editable": {
-                "type": "boolean",
-                "attribute": "editable",
-                "mutable": true,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "template": {
-                "type": "unknown",
-                "attribute": "template",
-                "mutable": false,
-                "complexType": {
-                    "original": "LSApiTemplate",
-                    "resolved": "{ id: string; title: string; pageCount: number; fileName: string; link: string; autoArchive: boolean; valid: boolean; locked: boolean; tags: string[]; groupId: string; roles: LSApiRole[]; canOpenSign: boolean; directLinks: []; elementConnection: { templateElements: LSApiElement[]; totalCount: number; }; elements: LSApiElement[]; createdBy: string; created: Date; modified: Date; lastSent: Date; pageDimensionArray: [number, number][]; pageDimensions: string; fixSignatureScale?: boolean; }",
-                    "references": {
-                        "LSApiTemplate": {
-                            "location": "import",
-                            "path": "../../types/LSApiTemplate",
-                            "id": "src/types/LSApiTemplate.ts::LSApiTemplate"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false
-            }
-        };
-    }
-    static get events() {
-        return [{
-                "method": "mutate",
-                "name": "mutate",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "LSMutateEvent[]",
-                    "resolved": "LSMutateEvent[]",
-                    "references": {
-                        "LSMutateEvent": {
-                            "location": "import",
-                            "path": "../../types/LSMutateEvent",
-                            "id": "src/types/LSMutateEvent.ts::LSMutateEvent"
-                        }
-                    }
-                }
-            }, {
-                "method": "update",
-                "name": "update",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "LSMutateEvent[]",
-                    "resolved": "LSMutateEvent[]",
-                    "references": {
-                        "LSMutateEvent": {
-                            "location": "import",
-                            "path": "../../types/LSMutateEvent",
-                            "id": "src/types/LSMutateEvent.ts::LSMutateEvent"
-                        }
-                    }
-                }
-            }, {
-                "method": "opened",
-                "name": "opened",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "LSApiRole",
-                    "resolved": "{ children?: LSApiRole[]; id: string; name: string; roleType: LSApiRoleType; signerIndex: number; ordinal: number; signerParent?: string; experience: string; templateId?: string; }",
-                    "references": {
-                        "LSApiRole": {
-                            "location": "import",
-                            "path": "../../types/LSApiRole",
-                            "id": "src/types/LSApiRole.ts::LSApiRole"
-                        }
-                    }
-                }
-            }, {
-                "method": "addParticipant",
-                "name": "addParticipant",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "{ type: LSApiRoleType; parent?: string | null }",
-                    "resolved": "{ type: LSApiRoleType; parent?: string; }",
-                    "references": {
-                        "LSApiRoleType": {
-                            "location": "import",
-                            "path": "../../types/LSApiRole",
-                            "id": "src/types/LSApiRole.ts::LSApiRoleType"
-                        }
-                    }
-                }
-            }];
-    }
-    static get elementRef() { return "component"; }
-    static get watchers() {
-        return [{
-                "propName": "editable",
-                "methodName": "modeHandler"
-            }];
-    }
-}
-//# sourceMappingURL=ls-participant-card.js.map

package/dist/collection/components/ls-participant-card/ls-participant-card.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ls-participant-card.js","sourceRoot":"","sources":["../../../src/components/ls-participant-card/ls-participant-card.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, h, Event, EventEmitter, Watch, Element } from '@stencil/core';\nimport { LSApiRole, LSApiRoleType } from '../../types/LSApiRole';\nimport { LSApiTemplate } from '../../types/LSApiTemplate';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\nimport { LSMutateEvent } from '../../types/LSMutateEvent';\n\n@Component({\n  tag: 'ls-participant-card',\n  styleUrl: 'ls-participant-card.css',\n  shadow: true,\n})\nexport class LsParticipantCard {\n  @Element() component: HTMLElement;\n  @Prop() signer: LSApiRole;\n  @Prop() index: number;\n  @Prop({ mutable: true }) editable: boolean = false;\n  @Prop() template: LSApiTemplate;\n\n  @Event({\n    bubbles: true,\n    cancelable: true,\n    composed: true,\n  })\n  mutate: EventEmitter<LSMutateEvent[]>;\n\n  @Event({\n    bubbles: true,\n    cancelable: true,\n    composed: true,\n  })\n  update: EventEmitter<LSMutateEvent[]>;\n\n  @Event({\n    bubbles: true,\n    cancelable: true,\n    composed: true,\n  })\n  opened: EventEmitter<LSApiRole>;\n\n  // Send one or more mutations up the chain\n  // The source of the chain fires the mutation\n  // NOTE this alter is debounced to account for typing\n  alter(diff: object) {\n    this.signer = { ...this.signer, ...diff };\n    this.debounce(this.signer, 500);\n  }\n\n  private labeltimer;\n\n  debounce(data, delay) {\n    if (this.labeltimer) clearTimeout(this.labeltimer);\n\n    this.labeltimer = setTimeout(() => {\n      const diffs: LSMutateEvent[] = [{ action: 'update', data }];\n      this.mutate.emit(diffs);\n      this.update.emit(diffs);\n    }, delay);\n  }\n\n  deleteHandler(role: LSApiRole) {\n    this.update.emit([{ action: 'delete', data: role }]);\n    this.mutate.emit([{ action: 'delete', data: role }]);\n  }\n\n  swapHandler(role1, role2) {\n    this.update.emit([{ action: 'swap', data: role1, data2: role2 }]);\n    this.mutate.emit([{ action: 'swap', data: role1, data2: role2 }]);\n  }\n\n  @Watch('editable')\n  modeHandler(_editable) {\n    // When opened fire an event to let the parent handle closing other controls\n    if (_editable) {\n      this.opened.emit(this.signer);\n    }\n  }\n\n  @Event({\n    bubbles: true,\n    composed: true,\n  })\n  addParticipant: EventEmitter<{ type: LSApiRoleType; parent?: string | null }>;\n\n  render() {\n    const participantFields = this.template.elementConnection.templateElements.filter(f => f.signer === this.signer.signerIndex) || [];\n    const child = this.template.roles.find(r => r.signerParent === this.signer.id);\n\n    return (\n      <Host>\n        <div\n          class={'participant-card' + (child ? ' top-card' : this.signer?.signerParent ? ' bottom-card' : ' full-card')}\n          style={{\n            background: defaultRolePalette[this.signer?.signerIndex % 100].s10,\n            border: `1px solid ${defaultRolePalette[this.signer?.signerIndex % 100].s60}`,\n            marginTop: this.signer.roleType === 'WITNESS' ? '-0.813rem' : '0',\n          }}\n          onMouseEnter={e => (e.currentTarget as HTMLElement).querySelector('.button-set')?.classList.remove('hidden')}\n          onMouseLeave={e => (e.currentTarget as HTMLElement).querySelector('.button-set')?.classList.add('hidden')}\n          onDblClick={() => {\n            this.editable = true;\n          }}\n        >\n          <div class={'participant-card-inner'}>\n            <div class={'participant-card-top-items'}>\n              <div\n                class={'role-label'}\n                style={{\n                  background: defaultRolePalette[this.signer?.signerIndex % 100].s20,\n                  color: defaultRolePalette[this.signer?.signerIndex % 100].s90,\n                }}\n              >\n                <ls-icon name={this.signer?.roleType === 'APPROVER' ? 'check-circle' : this.signer?.roleType === 'SIGNER' ? 'signature' : 'eye'} />\n                {'Participant ' + (this.signer?.signerIndex || '')}\n              </div>\n              <div class={'button-set hidden'}>\n                {this.index > 0 && this.signer.roleType !== 'WITNESS' && (\n                  <div\n                    class=\"innerButton\"\n                    onClick={() => {\n                      this.swapHandler(this.signer, this.template.roles[this.index - 1]);\n                    }}\n                    style={{\n                      '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,\n                      '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,\n                    }}\n                  >\n                    <ls-icon name=\"arrow-up\" size=\"18\" />\n                  </div>\n                )}\n                {this.signer.signerIndex !== this.template.roles.length && this.signer.roleType !== 'WITNESS' && (\n                  <div\n                    class=\"innerButton\"\n                    onClick={() => {\n                      this.swapHandler(this.signer, this.template.roles[this.index + 1]);\n                    }}\n                    style={{\n                      '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,\n                      '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,\n                    }}\n                  >\n                    <ls-icon name=\"arrow-down\" size=\"18\" />\n                  </div>\n                )}\n                <div\n                  class=\"innerButton\"\n                  onClick={() => {\n                    this.editable = !this.editable;\n                  }}\n                  style={{\n                    '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,\n                    '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,\n                  }}\n                >\n                  <ls-icon name={this.editable ? 'check' : 'pencil-alt'} size=\"18\" />\n                </div>\n                <div\n                  class=\"innerButton\"\n                  onClick={() => {\n                    this.deleteHandler(this.signer);\n                  }}\n                  style={{\n                    '--default-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s40,\n                    '--hover-button-colour': defaultRolePalette[this.signer?.signerIndex % 100].s60,\n                  }}\n                >\n                  <ls-icon name=\"trash\" size=\"18\" />\n                </div>\n              </div>\n            </div>\n            {this.editable ? (\n              <div class={'participant-card-inner'}>\n                {this.signer?.roleType !== 'WITNESS' ? (\n                  <ls-input-wrapper select leadingIcon={this.signer?.roleType === 'APPROVER' ? 'check-circle' : 'signature'}>\n                    <select\n                      name=\"roleType\"\n                      id=\"role-type\"\n                      class={'has-leading-icon'}\n                      onChange={e => this.alter({ roleType: (e.target as HTMLSelectElement).value })}\n                      disabled={child ? true : false}\n                    >\n                      <option value=\"APPROVER\" selected={this.signer?.roleType === 'APPROVER'}>\n                        Approver\n                      </option>\n                      <option value=\"SIGNER\" selected={this.signer?.roleType === 'SIGNER'}>\n                        Signer\n                      </option>\n                    </select>\n                  </ls-input-wrapper>\n                ) : (\n                  <ls-input-wrapper leadingIcon=\"eye\">\n                    <input name=\"roleType\" id=\"role-type\" class={'has-leading-icon'} disabled value=\"Witness\" />\n                  </ls-input-wrapper>\n                )}\n                <input\n                  type=\"text\"\n                  id=\"participant-description\"\n                  name=\"participantDescription\"\n                  placeholder=\"Description, eg. Tenant 1, Agent\"\n                  defaultValue={this.signer.name}\n                  onInput={e => this.alter({ name: (e.target as HTMLInputElement).value })}\n                  onKeyUp={e => {\n                    if (e.key === 'Enter' || e.keyCode === 13) this.editable = false;\n                  }}\n                />\n                {this.signer?.roleType === 'SIGNER' && !child ? (\n                  <button class={'tertiary'} onClick={() => this.addParticipant.emit({ type: 'WITNESS', parent: this.signer.id })}>\n                    <ls-icon name=\"plus\" style={{ marginRight: '0.25rem' }} />\n                    Add Witness\n                  </button>\n                ) : this.signer?.roleType === 'SIGNER' && child ? (\n                  <button\n                    class={'destructive'}\n                    onClick={() => {\n                      this.deleteHandler(child);\n                    }}\n                  >\n                    <ls-icon name=\"minus-sm\" style={{ marginRight: '0.25rem' }} />\n                    Remove Witness\n                  </button>\n                ) : this.signer?.roleType === 'WITNESS' ? (\n                  <button\n                    class={'destructive'}\n                    onClick={() => {\n                      this.deleteHandler(this.signer);\n                    }}\n                  >\n                    <ls-icon name=\"minus-sm\" style={{ marginRight: '0.25rem' }} />\n                    Remove Witness\n                  </button>\n                ) : null}\n              </div>\n            ) : (\n              <div class={'participant-card-text'}>\n                <p\n                  class=\"participant-text-description\"\n                  style={{\n                    color: defaultRolePalette[this.signer?.signerIndex % 100].s100,\n                  }}\n                >\n                  {this.signer.name || `${this.signer.signerIndex > 100 ? 'Witness' : 'Signer'} ${this.signer.signerIndex + 1}`}\n                </p>\n                <p\n                  class=\"participant-text-type\"\n                  style={{\n                    color: defaultRolePalette[this.signer?.signerIndex % 100].s80,\n                    textTransform: 'capitalize',\n                  }}\n                >\n                  {this.signer.roleType.toLowerCase()}\n                </p>\n                {this.signer?.roleType !== 'APPROVER' && (\n                  <div\n                    class={'role-label fields'}\n                    style={{\n                      background: participantFields.length === 0 ? defaultRolePalette[this.signer?.signerIndex % 100].s60 : defaultRolePalette[this.signer?.signerIndex % 100].s20,\n                      color: participantFields.length === 0 ? 'white' : defaultRolePalette[this.signer?.signerIndex % 100].s90,\n                    }}\n                  >\n                    {participantFields.length === 0 && <ls-icon name=\"exclamation-circle\" size=\"16\" style={{ marginRight: '0.125rem' }} />}\n                    {participantFields.length === 0 ? 'Signature Required' : `${participantFields.length} ${participantFields.length === 1 ? 'Field' : 'Fields'}`}\n                  </div>\n                )}\n              </div>\n            )}\n          </div>\n        </div>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}