legalesign-document-viewer 0.7.2 → 0.7.3

package/dist/collection/components/ls-field-size/ls-field-size.css

@@ -1,376 +0,0 @@
-:host {
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-  width: 100%;
-  position: relative;
-}
-
-.ls-toolbar-numeric {
-  width: 2.813rem;
-  max-height: 1.25rem;
-  margin: 0px;
-  padding: 0px;
-}
-
-* {
-  margin: 0;
-  box-sizing: border-box;
-}
-
-.field-set {
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-  width: 100%;
-}
-
-.ls-field-properties-section {
-  display: flex;
-  position: relative;
-  flex-direction: column;
-  gap: 0.5rem;
-}
-
-.row {
-  flex-direction: row;
-  align-items: center;
-  justify-content: space-between;
-}
-
-.multi-button-group-row {
-  display: flex;
-  gap: 0.5rem;
-}
-
-.ls-field-properties-section-text {
-  display: flex;
-  flex-direction: column;
-  gap: 0.25rem;
-  padding: 0.25rem;
-}
-
-.ls-field-properties-section-title {
-  color: var(--gray-90, #5e6066);
-  font-size: 1rem;
-  font-style: normal;
-  font-weight: 500;
-  line-height: 1.25rem; /* 142.857% */
-}
-
-.ls-field-properties-section-description {
-  overflow: hidden;
-  color: var(--gray-80, #6c6e73);
-  text-overflow: ellipsis;
-  font-size: 0.75rem;
-  font-style: normal;
-  font-weight: 400;
-  line-height: 0.75rem; /* 120% */
-}
-
-.input-row {
-  display: flex;
-  gap: 0.5rem;
-}
-
-.input-row .input-wrapper input {
-  width: 9.313rem;
-  max-width: 9.313rem;
-}
-
-/* Global Styles */
-
-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: 36px;
-}
-
-.input-wrapper {
-  position: relative;
-  width: 100%;
-}
-
-#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);
-}
-
-#selectLeadingIconDisabled {
-  position: absolute;
-  top: 50%;
-  left: 0.675rem;
-  transform: translateY(-50%);
-  pointer-events: none;
-  color: var(--gray-50, #d8d9dc);
-}
-
-.has-leading-icon {
-  padding-left: 2.5rem;
-}
-
-input,
-select,
-textarea {
-  border: 1px solid var(--gray-40, #d8d9dc);
-  box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);
-  padding: 0.5rem 0.75rem;
-  font-family: var(--font-family);
-  font-size: var(--text-sm);
-  border-radius: 0.5rem;
-  color: var(--gray-100, #45484d);
-  font-weight: 400;
-}
-
-input::placeholder,
-select::placeholder,
-textarea::placeholder {
-  color: var(--gray-60, #afb0b2);
-}
-
-input:hover:not(:disabled),
-select:hover:not(:disabled),
-textarea:hover:not(:disabled) {
-  border-color: var(--gray-50, #c8c9cc);
-  background-color: var(--white, #fff);
-}
-
-input:focus:not(:disabled),
-select:focus:not(:disabled),
-textarea:focus:not(:disabled) {
-  outline: none;
-  box-shadow: 0 0 0 0.25rem var(--primary-40, #79adfc);
-  border-color: var(--primary-60, #4456f6);
-  background-color: var(--white, #fff);
-}
-
-input:active:not(:disabled),
-select:active:not(:disabled),
-textarea:active:not(:disabled) {
-  border-color: var(--primary-50, #5185ff);
-}
-
-input:disabled,
-select:disabled,
-textarea:disabled {
-  cursor: not-allowed;
-  background-color: var(--gray-10, #f7f8fa);
-  color: var(--gray-50, #d8d9dc);
-  box-shadow: none;
-}
-
-input[type='checkbox'] {
-  appearance: none;
-  position: relative;
-  height: 1rem;
-  width: 1rem;
-  padding: 0.25rem;
-  border-radius: var(--radius-sm);
-  border: 1px solid #d1d5db;
-  background-color: #ffffff;
-  cursor: pointer;
-}
-
-input[type='checkbox']:checked,
-input[type='checkbox'].indeterminate {
-  background-color: var(--primary-60, #4456f6);
-  border: none;
-}
-
-input[type='checkbox']:checked::after {
-  content: '';
-  position: absolute;
-  top: 45%;
-  left: 50%;
-  transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);
-  width: 0.5rem;
-  height: 0.25rem;
-  border-bottom: 0.125rem solid white;
-  border-right: 0.125rem solid white;
-}
-
-input[type='checkbox'].indeterminate::after {
-  content: '';
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  width: 0.5rem;
-  height: 0.125rem;
-  background-color: white;
-}
-
-input[type='checkbox']:checked:hover,
-input[type='checkbox'].indeterminate:hover {
-  background-color: var(--primary-70, #2134dc);
-  border: none;
-}
-
-input[type='checkbox']:hover {
-  border: 1px solid #9ca3af;
-}
-
-input[type='checkbox']:focus,
-input[type='checkbox']:active {
-  outline: none;
-  box-shadow: 0 0 0 0.25rem var(--primary-20, #c7ddff);
-  background-color: #f0f4f8;
-}
-
-input[type='checkbox']:disabled {
-  background-color: #f3f4f6;
-  outline: none;
-  cursor: not-allowed;
-}
-
-input[type='checkbox']:disabled:checked {
-  background-color: #e5e7eb;
-  border: none;
-  outline: none;
-  cursor: not-allowed;
-}
-
-.checkbox-container {
-  display: flex;
-  gap: 0.5rem;
-  width: 100%;
-}
-
-.checkbox-label {
-  color: var(--gray-100, #45484d);
-  font-size: 1rem;
-  font-style: normal;
-  font-weight: 400;
-  line-height: 1rem;
-}
-
-.form-label {
-  color: var(--gray-100, #45484d);
-  font-size: 1rem;
-  font-style: normal;
-  font-weight: 500;
-  line-height: 1.5rem;
-}
-
-.form-field {
-  display: flex;
-  flex-direction: column;
-  gap: 0.25rem;
-  width: 100%;
-}
-
-.loading-box {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  height: 100vh;
-  color: var(--primary-60, #0c7cba);
-}
-
-button {
-  border: 0;
-  appearance: button;
-  cursor: pointer;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: var(--radius-lg);
-  background-color: var(--primary-60, #4456f6);
-  color: white;
-  text-transform: capitalize;
-  min-height: 2.25rem;
-  min-width: 2.25rem;
-}
-
-button.tertiaryGrey {
-  border: 1px solid var(--gray-40, #d8d9dc);
-  background-color: white;
-  color: var(--gray-80, #787a80);
-}
-
-button.tertiaryGrey:hover {
-  border: 1px solid var(--gray-50, #c8c9cc);
-  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;
-  width: 100%;
-}
-
-.button-group button {
-  display: flex;
-  width: 100%;
-  background: transparent;
-  border-radius: unset;
-  padding: 0.25rem 0.75rem;
-  min-width: 2.156rem;
-  color: var(--gray-80, #6c6e73);
-}
-
-.button-group button:disabled {
-  background: var(--gray-10, #f7f8fa);
-  cursor: not-allowed;
-  color: var(--gray-50, #d8d9dc);
-}
-
-.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);
-}

package/dist/collection/components/ls-field-size/ls-field-size.js

@@ -1,87 +0,0 @@
-import { Host, h } from "@stencil/core";
-import { attachAllTooltips } from "../../utils/tooltip";
-export class LsFieldSize {
-    component;
-    dataItem;
-    mutate;
-    // Send one or more mutations up the chain
-    // The source of the chain fires the mutation
-    alter(diff) {
-        const diffs = this.dataItem.map(c => {
-            return { action: 'update', data: { ...c, ...diff } };
-        });
-        this.dataItem = diffs.map(d => d.data);
-        this.mutate.emit(diffs);
-    }
-    componentDidLoad() {
-        attachAllTooltips(this.component.shadowRoot);
-    }
-    render() {
-        return (h(Host, { key: 'c64b1112e2549d2dc89f41b34d950817df6d182a' }, h("div", { key: '15a9ce2865a2490b02a2fdfcccd6e2a3d2f20811', class: 'ls-field-properties-section' }, h("div", { key: 'c89d71391e4591fcebed9e9e8a73db018893fd1d', class: 'ls-field-properties-section-text' }, h("p", { key: 'e68285c80aa1dd10719fe57476ec6e5bec647723', class: 'ls-field-properties-section-title' }, "Scale and Resize"), h("p", { key: '37548247f6afa990a5674a94c9e867f7474f8bf7', class: 'ls-field-properties-section-description' }, "Multi-select fields and match their dimensions")), h("div", { key: 'a4d8ab5f836596f233b7675fb45baf082e62b80c', class: 'button-group' }, h("button", { key: 'f9511e04d4972a6e853bf054cd8c36a29d917488', onClick: () => this.alter({ width: this.dataItem[0].width, height: this.dataItem[0].height }), "aria-label": "Make selected fields the same height and width as the first selected field.", "data-tooltip": "Make selected fields the same height and width as the first selected field" }, h("ls-icon", { key: 'b3fcb08b7a9da2c12ba4a9789e65d1a977b7baa6', name: "field-scale" })), h("button", { key: 'c1a278fd2478160d534793a55de977ba76d0b394', "aria-label": "Make selected fields the same width as the first selected field", onClick: () => this.alter({ width: this.dataItem[0].width }), "data-tooltip": "Make selected fields the same width as the first selected field" }, h("ls-icon", { key: '73157241ffe55cbfc3b9cd8801c5dbd543998946', name: "field-match-width" })), h("button", { key: '796d1ebe732b4b0537161549b7f8b0f38afab823', onClick: () => this.alter({ height: this.dataItem[0].height }), "aria-label": "Make selected fields the same height as the first selected field.", "data-tooltip": "Make selected fields the same height as the first selected field" }, h("ls-icon", { key: 'd1df875b9623562891ef01f5b53b343be85b51bc', name: "field-match-height" })))), h("slot", { key: '51d72c8def0e4eac4527ffadedb6496d078337a7' }), h("ls-tooltip", { key: 'aa62235c7cd42b985fd24d15aa5036334e87bcad', id: "ls-tooltip-master" })));
-    }
-    static get is() { return "ls-field-size"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["ls-field-size.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["ls-field-size.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "dataItem": {
-                "type": "unknown",
-                "mutable": true,
-                "complexType": {
-                    "original": "LSApiElement[]",
-                    "resolved": "LSApiElement[]",
-                    "references": {
-                        "LSApiElement": {
-                            "location": "import",
-                            "path": "../../components",
-                            "id": "src/components.d.ts::LSApiElement"
-                        }
-                    }
-                },
-                "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": "../../components",
-                            "id": "src/components.d.ts::LSMutateEvent"
-                        }
-                    }
-                }
-            }];
-    }
-    static get elementRef() { return "component"; }
-}
-//# sourceMappingURL=ls-field-size.js.map

package/dist/collection/components/ls-field-size/ls-field-size.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ls-field-size.js","sourceRoot":"","sources":["../../../src/components/ls-field-size/ls-field-size.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAgB,OAAO,EAAE,MAAM,eAAe,CAAC;AAEvF,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAOxD,MAAM,OAAO,WAAW;IACX,SAAS,CAAc;IACT,QAAQ,CAAiB;IAOlD,MAAM,CAAgC;IAEtC,0CAA0C;IAC1C,6CAA6C;IAC7C,KAAK,CAAC,IAAY;QAChB,MAAM,KAAK,GAAoB,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE;YACnD,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE,GAAG,CAAC,EAAE,GAAG,IAAI,EAAkB,EAAE,CAAC;QACvE,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAoB,CAAC,CAAC;QACvD,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;IAED,gBAAgB;QACd,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;IAC/C,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,6BAA6B;gBACvC,4DAAK,KAAK,EAAE,kCAAkC;oBAC5C,0DAAG,KAAK,EAAE,mCAAmC,uBAAsB;oBACnE,0DAAG,KAAK,EAAE,yCAAyC,qDAAoD,CACnG;gBACN,4DAAK,KAAK,EAAE,cAAc;oBACxB,+DACE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC,gBAClF,6EAA6E,kBAC3E,4EAA4E;wBAEzF,gEAAS,IAAI,EAAC,aAAa,GAAW,CAC/B;oBACT,6EACa,iEAAiE,EAC5E,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,kBAC/C,iEAAiE;wBAE9E,gEAAS,IAAI,EAAC,mBAAmB,GAAW,CACrC;oBACT,+DACE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC,gBACnD,mEAAmE,kBACjE,kEAAkE;wBAE/E,gEAAS,IAAI,EAAC,oBAAoB,GAAW,CACtC,CACL,CACF;YAEN,8DAAa;YACb,mEAAY,EAAE,EAAC,mBAAmB,GAAc,CAC3C,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h, Event, EventEmitter, Element } from '@stencil/core';\nimport { LSApiElement, LSMutateEvent } from '../../components';\nimport { attachAllTooltips } from '../../utils/tooltip';\n\n@Component({\n  tag: 'ls-field-size',\n  styleUrl: 'ls-field-size.css',\n  shadow: true,\n})\nexport class LsFieldSize {\n  @Element() component: HTMLElement;\n  @Prop({ mutable: true }) dataItem: LSApiElement[];\n\n  @Event({\n    bubbles: true,\n    cancelable: true,\n    composed: true,\n  })\n  mutate: EventEmitter<LSMutateEvent[]>;\n\n  // Send one or more mutations up the chain\n  // The source of the chain fires the mutation\n  alter(diff: object) {\n    const diffs: LSMutateEvent[] = this.dataItem.map(c => {\n      return { action: 'update', data: { ...c, ...diff } as LSApiElement };\n    });\n\n    this.dataItem = diffs.map(d => d.data as LSApiElement);\n    this.mutate.emit(diffs);\n  }\n\n  componentDidLoad() {\n    attachAllTooltips(this.component.shadowRoot);\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={'ls-field-properties-section'}>\n          <div class={'ls-field-properties-section-text'}>\n            <p class={'ls-field-properties-section-title'}>Scale and Resize</p>\n            <p class={'ls-field-properties-section-description'}>Multi-select fields and match their dimensions</p>\n          </div>\n          <div class={'button-group'}>\n            <button\n              onClick={() => this.alter({ width: this.dataItem[0].width, height: this.dataItem[0].height })}\n              aria-label=\"Make selected fields the same height and width as the first selected field.\"\n              data-tooltip=\"Make selected fields the same height and width as the first selected field\"\n            >\n              <ls-icon name=\"field-scale\"></ls-icon>\n            </button>\n            <button\n              aria-label=\"Make selected fields the same width as the first selected field\"\n              onClick={() => this.alter({ width: this.dataItem[0].width })}\n              data-tooltip=\"Make selected fields the same width as the first selected field\"\n            >\n              <ls-icon name=\"field-match-width\"></ls-icon>\n            </button>\n            <button\n              onClick={() => this.alter({ height: this.dataItem[0].height })}\n              aria-label=\"Make selected fields the same height as the first selected field.\"\n              data-tooltip=\"Make selected fields the same height as the first selected field\"\n            >\n              <ls-icon name=\"field-match-height\"></ls-icon>\n            </button>\n          </div>\n        </div>\n\n        <slot></slot>\n        <ls-tooltip id=\"ls-tooltip-master\"></ls-tooltip>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/ls-field-type-display/ls-field-type-display.css

@@ -1,35 +0,0 @@
-:host {
-  position: relative;
-  border-radius: 0.875rem;
-  padding: 0.25rem;
-}
-
-* {
-  margin: 0;
-}
-
-.ls-field-type-inner {
-  border-radius: 0.625rem;
-  background: var(--white, #fff);
-  display: flex;
-  padding: 0.25rem 0.5rem 0.25rem 0.25rem;
-  align-items: center;
-  gap: 0.875rem;
-  align-self: stretch;
-}
-
-.ls-field-type-icon {
-  display: flex;
-  padding: 0.5rem;
-  align-items: center;
-  border-radius: 0.5rem;
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);
-}
-
-.ls-field-type-name {
-  color: var(--gray-100, #45484d);
-  font-size: 1rem;
-  font-style: normal;
-  font-weight: 400;
-  line-height: 1.5rem; /* 150% */
-}

package/dist/collection/components/ls-field-type-display/ls-field-type-display.js

@@ -1,75 +0,0 @@
-import { Host, h } from "@stencil/core";
-import { defaultRolePalette } from "../ls-document-viewer/defaultPalette";
-import { getFieldLabel } from "../ls-document-viewer/defaultFieldLabels";
-import { getFieldIcon } from "../ls-document-viewer/defaultFieldIcons";
-export class LsFieldTypeDisplay {
-    assignee;
-    fieldType = 'signature';
-    render() {
-        const color = defaultRolePalette[this.assignee % 100];
-        return (h(Host, { key: 'a6789ca82e6e4261c1193f6db019733d34904f14', class: 'ls-field-type-wrapper', style: {
-                border: `1px dashed ${color.s30}`,
-                background: color.s10,
-            } }, h("div", { key: 'a95e889ef2e532547ac9879dbba7a5d2d00a86c7', class: 'ls-field-type-inner' }, h("div", { key: '9762ab0e1daa88b474caff3cc1f527642d746473', class: 'ls-field-type-icon', style: {
-                border: `1px solid ${color.s60}`,
-                color: color.s60,
-                background: color.s10,
-            } }, h("ls-icon", { key: '26e53ab3b01fe6657f670f173238b07a0e0c5698', name: getFieldIcon(this.fieldType), size: "1.25rem" })), h("p", { key: '756ae8d043fd195e0d8258f5feb31a76105d817b', class: 'ls-field-type-name' }, getFieldLabel(this.fieldType)))));
-    }
-    static get is() { return "ls-field-type-display"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["ls-field-type-display.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["ls-field-type-display.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "assignee": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "assignee"
-            },
-            "fieldType": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "field-type",
-                "defaultValue": "'signature'"
-            }
-        };
-    }
-}
-//# sourceMappingURL=ls-field-type-display.js.map

package/dist/collection/components/ls-field-type-display/ls-field-type-display.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ls-field-type-display.js","sourceRoot":"","sources":["../../../src/components/ls-field-type-display/ls-field-type-display.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAC1E,OAAO,EAAE,aAAa,EAAE,MAAM,0CAA0C,CAAC;AACzE,OAAO,EAAE,YAAY,EAAE,MAAM,yCAAyC,CAAC;AAOvE,MAAM,OAAO,kBAAkB;IACrB,QAAQ,CAAS;IACjB,SAAS,GAAW,WAAW,CAAC;IAExC,MAAM;QACJ,MAAM,KAAK,GAAG,kBAAkB,CAAC,IAAI,CAAC,QAAQ,GAAG,GAAG,CAAC,CAAC;QACtD,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE,uBAAuB,EAC9B,KAAK,EAAE;gBACL,MAAM,EAAE,cAAc,KAAK,CAAC,GAAG,EAAE;gBACjC,UAAU,EAAE,KAAK,CAAC,GAAG;aACtB;YAED,4DAAK,KAAK,EAAE,qBAAqB;gBAC/B,4DACE,KAAK,EAAE,oBAAoB,EAC3B,KAAK,EAAE;wBACL,MAAM,EAAE,aAAa,KAAK,CAAC,GAAG,EAAE;wBAChC,KAAK,EAAE,KAAK,CAAC,GAAG;wBAChB,UAAU,EAAE,KAAK,CAAC,GAAG;qBACtB;oBAED,gEAAS,IAAI,EAAE,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE,IAAI,EAAC,SAAS,GAAG,CAC1D;gBACN,0DAAG,KAAK,EAAE,oBAAoB,IAAG,aAAa,CAAC,IAAI,CAAC,SAAS,CAAC,CAAK,CAC/D,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\nimport { getFieldLabel } from '../ls-document-viewer/defaultFieldLabels';\nimport { getFieldIcon } from '../ls-document-viewer/defaultFieldIcons';\n\n@Component({\n  tag: 'ls-field-type-display',\n  styleUrl: 'ls-field-type-display.css',\n  shadow: true,\n})\nexport class LsFieldTypeDisplay {\n  @Prop() assignee: number;\n  @Prop() fieldType: string = 'signature';\n\n  render() {\n    const color = defaultRolePalette[this.assignee % 100];\n    return (\n      <Host\n        class={'ls-field-type-wrapper'}\n        style={{\n          border: `1px dashed ${color.s30}`,\n          background: color.s10,\n        }}\n      >\n        <div class={'ls-field-type-inner'}>\n          <div\n            class={'ls-field-type-icon'}\n            style={{\n              border: `1px solid ${color.s60}`,\n              color: color.s60,\n              background: color.s10,\n            }}\n          >\n            <ls-icon name={getFieldIcon(this.fieldType)} size=\"1.25rem\" />\n          </div>\n          <p class={'ls-field-type-name'}>{getFieldLabel(this.fieldType)}</p>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}