legalesign-document-viewer 0.9.7 → 0.9.9

package/dist/components/p-Cgka-t2t.js

@@ -1,48 +0,0 @@
-import { t as transformTag, p as proxyCustomElement, H, h, c as Host } from './p-BhZ5Udbm.js';
-
-const lsFieldPropertiesContainerCss = () => `*{margin:0;box-sizing:border-box}:host{display:flex;flex-direction:column;gap:1rem;width:100%;height:calc(100% - 7.25rem);position:relative}.tabs-container{display:grid;width:100%;gap:0.125rem;padding:0.125rem;border:1px solid var(--gray-30, #e0e2e5);border-radius:0.75rem;background:var(--white, #ffffff)}.ls-tab{all:unset;display:flex;justify-content:center;align-items:center;cursor:pointer;padding:0.5rem;border-radius:0.625rem;font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;color:var(--gray-80, #6c6e73);text-transform:capitalize}.ls-tab.active{background:var(--primary-10, #eff4ff);color:var(--primary-60, #4456f6)}.ls-tab:not(.active):hover{background:var(--gray-10, #f7f8fa)}.button-footer{display:flex;padding-top:1rem;border-top:1px solid var(--gray-20, #f0f1f2);flex-direction:column;justify-content:flex-end;gap:0.75rem;margin-top:auto}.scrolling-container{overflow-y:auto;padding:0 1rem;margin:0 -1rem;height:100%}`;
-
-const LsFieldPropertiesContainer = /*@__PURE__*/ proxyCustomElement(class LsFieldPropertiesContainer extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-    }
-    dataItem;
-    tabs = [];
-    selectedTab;
-    componentWillLoad() {
-        if (!this.selectedTab) {
-            this.selectedTab = this.tabs[0] || '';
-        }
-    }
-    render() {
-        return (h(Host, { key: '9009382a58eb30ebe1ffc13060d9001481d8b8b5' }, this.tabs.length > 1 && (h("div", { key: 'ef0943872c89cc6bc86d752aa9743f64b4139939', class: 'tabs-container', style: { gridTemplateColumns: `repeat(${this.tabs.length}, 1fr)` } }, this.tabs.map(tab => (h("button", { class: tab === this.selectedTab ? 'ls-tab active' : 'ls-tab', onClick: () => (this.selectedTab = tab) }, tab))))), h("div", { key: 'fe920b3237cf04435c8449f6f724cd7924c92d03', class: 'scrolling-container' }, h("slot", { key: '788460da3efa41452f89c6c62c4c86d111f4acfe', name: this.selectedTab }))));
-    }
-    static get style() { return lsFieldPropertiesContainerCss(); }
-}, [769, "ls-field-properties-container", {
-        "dataItem": [16],
-        "tabs": [16],
-        "selectedTab": [1537, "selected-tab"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ls-field-properties-container"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ls-field-properties-container":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), LsFieldPropertiesContainer);
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { LsFieldPropertiesContainer as L, defineCustomElement as d };
-//# sourceMappingURL=p-Cgka-t2t.js.map
-
-//# sourceMappingURL=p-Cgka-t2t.js.map

package/dist/components/p-Cgka-t2t.js.map

@@ -1 +0,0 @@
-{"file":"p-Cgka-t2t.js","mappings":";;AAAA,MAAM,6BAA6B,GAAG,MAAM,CAAC,y7BAAy7B,CAAC;;MCQ19B,0BAA0B,iBAAAA,kBAAA,CAAA,MAAA,0BAAA,SAAAC,CAAA,CAAA;;;;;;;;AAC7B,IAAA,QAAQ;IACR,IAAI,GAAa,EAAE;AACY,IAAA,WAAW;IAElD,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;YACrB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE;;;IAIzC,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACF,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,KACnB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,EAAE,mBAAmB,EAAE,CAAU,OAAA,EAAA,IAAI,CAAC,IAAI,CAAC,MAAM,CAAQ,MAAA,CAAA,EAAE,EAC7F,EAAA,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,KAChB,CAAQ,CAAA,QAAA,EAAA,EAAA,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC,WAAW,GAAG,eAAe,GAAG,QAAQ,EAAE,OAAO,EAAE,OAAO,IAAI,CAAC,WAAW,GAAG,GAAG,CAAC,IAC1G,GAAG,CACG,CACV,CAAC,CACE,CACP,EACD,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,qBAAqB,EAAA,EAC/B,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,IAAI,CAAC,WAAW,EAAS,CAAA,CACjC,CACD;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-properties-container/ls-field-properties-container.css?tag=ls-field-properties-container&encapsulation=shadow","src/components/ls-field-properties-container/ls-field-properties-container.tsx"],"sourcesContent":["* {\n  margin: 0;\n  box-sizing: border-box;\n}\n\n:host {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n  width: 100%;\n  height: calc(100% - 7.25rem);\n  position: relative;\n}\n\n.tabs-container {\n  display: grid;\n  width: 100%;\n  gap: 0.125rem;\n  padding: 0.125rem;\n  border: 1px solid var(--gray-30, #e0e2e5);\n  border-radius: 0.75rem;\n  background: var(--white, #ffffff);\n}\n\n.ls-tab {\n  all: unset;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  padding: 0.5rem;\n  border-radius: 0.625rem;\n  font-size: 0.875rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.25rem; /* 142.857% */\n  color: var(--gray-80, #6c6e73);\n  text-transform: capitalize;\n}\n\n.ls-tab.active {\n  background: var(--primary-10, #eff4ff);\n  color: var(--primary-60, #4456f6);\n}\n\n.ls-tab:not(.active):hover {\n  background: var(--gray-10, #f7f8fa);\n}\n\n.button-footer {\n  display: flex;\n  padding-top: 1rem;\n  border-top: 1px solid var(--gray-20, #f0f1f2);\n  flex-direction: column;\n  justify-content: flex-end;\n  gap: 0.75rem;\n  margin-top: auto;\n}\n\n.scrolling-container {\n  overflow-y: auto;\n  padding: 0 1rem;\n  margin: 0 -1rem;\n  height: 100%;\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { LSApiElement } from '../../components';\n\n@Component({\n  tag: 'ls-field-properties-container',\n  styleUrl: 'ls-field-properties-container.css',\n  shadow: true,\n})\nexport class LsFieldPropertiesContainer {\n  @Prop() dataItem: LSApiElement;\n  @Prop() tabs: string[] = [];\n  @Prop({ mutable: true, reflect: true}) selectedTab: string;\n\n  componentWillLoad() {\n    if (!this.selectedTab) {\n      this.selectedTab = this.tabs[0] || '';\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.tabs.length > 1 && (\n          <div class={'tabs-container'} style={{ gridTemplateColumns: `repeat(${this.tabs.length}, 1fr)` }}>\n            {this.tabs.map(tab => (\n              <button class={tab === this.selectedTab ? 'ls-tab active' : 'ls-tab'} onClick={() => (this.selectedTab = tab)}>\n                {tab}\n              </button>\n            ))}\n          </div>\n        )}\n        <div class={'scrolling-container'}>\n          <slot name={this.selectedTab}></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/p-CnaE4qFc.js

@@ -1,73 +0,0 @@
-import { t as transformTag, p as proxyCustomElement, H, h, c as Host } from './p-BhZ5Udbm.js';
-import { d as defaultRolePalette } from './p-BKrsDBDB.js';
-import { d as defineCustomElement$3 } from './p-CQL30SR-.js';
-import { d as defineCustomElement$2 } from './p-DcCalxAf.js';
-import { d as defineCustomElement$1 } from './p-EiDqqBpE.js';
-
-const lsValidationManagerCss = () => `:host{display:block}*{box-sizing:border-box;margin:0}.toolbox-section-description{color:var(--gray-80, #5e6066);font-size:0.75rem;font-style:normal;font-weight:400;line-height:1rem}.validation-section-title{color:var(--gray-100, #45484d);font-size:1.125rem;font-style:normal;font-weight:500;line-height:1.75rem;}.valid-label{display:flex;padding:0.125rem 0.5rem;justify-content:center;align-items:center;gap:0.25rem;border-radius:1rem;font-size:0.75rem;font-style:normal;font-weight:500;line-height:1.25rem;width:fit-content}.valid{background-color:var(--green-30, #9df5d4);color:var(--green-100, #125241)}.invalid{background:var(--yellow-20, #fff3c2);color:var(--yellow-90, #8a3f0e)}.field-counter{display:flex;padding:0.125rem;justify-content:center;align-items:center;border-radius:1rem;font-size:0.625rem;line-height:0.75rem;font-style:normal;font-weight:500;color:var(--yellow-20, #fff3c2);background:#e17100;min-width:1rem}.field-dropdown{position:absolute;top:2rem;right:0;background:white;display:flex;flex-direction:column;gap:0.75rem;width:20rem;padding:1rem;border-radius:1rem;border:1px solid #e5e7eb;background:#fff;box-shadow:0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);max-height:20rem;overflow-y:auto;flex-direction:column;align-items:flex-start;z-index:1000}.required-field{position:relative;display:flex;width:100%;justify-content:space-between;align-items:center;gap:0.5rem;border-radius:0.75rem;padding:0.5rem 0.5rem 0.5rem 1rem;background:var(--field-background);color:var(--field-text-color);border:1px solid var(--field-border-color);transition:all 0.1s ease-in-out}.required-field:hover{background:var(--field-background-hover);color:var(--field-text-color-hover);border:1px solid var(--field-border-color-hover);box-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)}.required-field-items-left{display:flex;gap:0.5rem;align-items:center;width:100%}.required-field-items-left p{font-size:0.875rem;font-style:normal;font-weight:500;line-height:0.875rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dot{height:0.5rem;width:0.5rem;border-radius:50%}.role-label{display:flex;padding:0.125rem 0.1875rem;justify-content:center;align-items:center;border-radius:0.25rem;font-size:0.75rem;font-style:normal;font-weight:400;line-height:1rem;text-transform:capitalize}.dropdown-header h2{color:var(--gray-100, #45484d);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;margin-bottom:0.125rem}.dropdown-header p{color:var(--gray-80, #6c6e73);font-size:0.75rem;font-style:normal;font-weight:400;line-height:1rem;}`;
-
-const LsValidationManager = /*@__PURE__*/ proxyCustomElement(class LsValidationManager extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-    }
-    /**
-     * The template information (as JSON).
-     * {LSApiTemplate}
-     */
-    validationErrors;
-    render() {
-        return (h(Host, { key: '49827093e4f6fec8de62c8958cb4a6b292451db4' }, h("div", { key: '3b17161f5236220388247cf791f5f08384b811d7' }, h("div", { key: '2e3bb75420ac76bd29e0d367ee430e9e24a47fde' }, h("div", { key: '49d1ae1ee37e38cd8a254327ffceeb47d3cb8a7f', class: 'validation-section-title' }, "Action Required"), h("p", { key: '2e86fc391ee470451911b89760d547938f4e940b', class: "toolbox-section-description" }, "This document needs fields added or corrected before it can be sent.")), this.validationErrors && this.validationErrors.map((field, idx) => {
-            const signerIndex = field?.role?.signerIndex ? field?.role?.signerIndex % 100 : null;
-            const pallette = defaultRolePalette[signerIndex || field?.element?.signer || 0];
-            return (h("div", { key: idx, class: 'required-field', style: {
-                    '--field-background': pallette.s10,
-                    '--field-border-color': pallette.s10,
-                    '--field-background-hover': pallette.s20,
-                    '--field-text-color': pallette.s70,
-                    '--field-text-color-hover': pallette.s80,
-                    '--field-border-color-hover': pallette.s60,
-                } }, h("div", { class: 'required-field-items-left' }, h("div", { class: 'dot', style: { background: pallette.s60 } }), field?.role && (h("div", { class: 'required-field-items-left' }, h("p", { style: { color: pallette.s80 } }, field.role?.name || `Signer ${field?.role?.signerIndex + 1}`), h("div", { class: 'role-label', style: { background: pallette.s30, color: pallette.s70 } }, field.role?.roleType.toLowerCase() || `Signer ${field.role?.signerIndex + 1}`))), field?.element && (h(h.Fragment, null, h("ls-toolbox-field", { elementType: "signature", formElementType: "signature", label: "Signature", defaultHeight: 27, defaultWidth: 120, validation: 0, icon: "signature", tooltip: "Use this field to collect Signatures from Participants", signer: field.element.signer }), h("p", { style: { color: pallette.s80 } }, field.role?.name || `${field.element.formElementType} ${field?.element?.label + 1}`), h("div", { class: 'role-label', style: { background: pallette.s30, color: pallette.s70 } }, field.description))))));
-        })), h("slot", { key: '1651057b64794a24a09bb13800fac90cadbccc72' })));
-    }
-    static get style() { return lsValidationManagerCss(); }
-}, [769, "ls-validation-manager", {
-        "validationErrors": [16]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ls-validation-manager", "ls-icon", "ls-toolbox-field", "ls-tooltip"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ls-validation-manager":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), LsValidationManager);
-            }
-            break;
-        case "ls-icon":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$3();
-            }
-            break;
-        case "ls-toolbox-field":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$2();
-            }
-            break;
-        case "ls-tooltip":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { LsValidationManager as L, defineCustomElement as d };
-//# sourceMappingURL=p-CnaE4qFc.js.map
-
-//# sourceMappingURL=p-CnaE4qFc.js.map

package/dist/components/p-CnaE4qFc.js.map

@@ -1 +0,0 @@
-{"file":"p-CnaE4qFc.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-validation-manager/ls-validation-manager.css?tag=ls-validation-manager&encapsulation=shadow","src/components/ls-validation-manager/ls-validation-manager.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n* {\n  box-sizing: border-box;\n  margin: 0;\n}\n\n.toolbox-section-description {\n  color: var(--gray-80, #5e6066);\n  font-size: 0.75rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1rem;\n}\n\n.validation-section-title {\n  color: var(--gray-100, #45484d);\n  font-size: 1.125rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.75rem; /* 155.556% */\n}\n\n.valid-label {\n  display: flex;\n  padding: 0.125rem 0.5rem;\n  justify-content: center;\n  align-items: center;\n  gap: 0.25rem;\n  border-radius: 1rem;\n  font-size: 0.75rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.25rem; /* 142.857% */\n  width: fit-content;\n}\n\n.valid {\n  background-color: var(--green-30, #9df5d4);\n  color: var(--green-100, #125241);\n}\n\n.invalid {\n  background: var(--yellow-20, #fff3c2);\n  color: var(--yellow-90, #8a3f0e);\n}\n\n.field-counter {\n  display: flex;\n  padding: 0.125rem;\n  justify-content: center;\n  align-items: center;\n  border-radius: 1rem;\n  font-size: 0.625rem;\n  line-height: 0.75rem;\n  font-style: normal;\n  font-weight: 500;\n  color: var(--yellow-20, #fff3c2);\n  background: #e17100;\n  min-width: 1rem;\n}\n\n.field-dropdown {\n  position: absolute;\n  top: 2rem;\n  right: 0;\n  background: white;\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  width: 20rem;\n  padding: 1rem;\n  border-radius: 1rem;\n  border: 1px solid #e5e7eb;\n  background: #fff;\n  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);\n  max-height: 20rem;\n  overflow-y: auto;\n  flex-direction: column;\n  align-items: flex-start;\n  z-index: 1000;\n}\n\n.required-field {\n  position: relative;\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n  align-items: center;\n  gap: 0.5rem;\n  border-radius: 0.75rem;\n  padding: 0.5rem 0.5rem 0.5rem 1rem;\n  background: var(--field-background);\n  color: var(--field-text-color);\n  border: 1px solid var(--field-border-color);\n  transition: all 0.1s ease-in-out;\n}\n\n.required-field:hover {\n  background: var(--field-background-hover);\n  color: var(--field-text-color-hover);\n  border: 1px solid var(--field-border-color-hover);\n  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n}\n\n.required-field-items-left {\n  display: flex;\n  gap: 0.5rem;\n  align-items: center;\n  width: 100%;\n}\n\n.required-field-items-left p {\n  font-size: 0.875rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 0.875rem; /* 142.857% */\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.dot {\n  height: 0.5rem;\n  width: 0.5rem;\n  border-radius: 50%;\n}\n\n.role-label {\n  display: flex;\n  padding: 0.125rem 0.1875rem;\n  justify-content: center;\n  align-items: center;\n  border-radius: 0.25rem;\n  font-size: 0.75rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1rem; /* 133.333% */\n  text-transform: capitalize;\n}\n\n.dropdown-header h2 {\n  color: var(--gray-100, #45484d);\n  font-size: 0.875rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.25rem; /* 142.857% */\n  margin-bottom: 0.125rem;\n}\n\n.dropdown-header p {\n  color: var(--gray-80, #6c6e73);\n  font-size: 0.75rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1rem; /* 133.333% */\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { ValidationError } from '../../types/ValidationError';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\n\n@Component({\n  tag: 'ls-validation-manager',\n  styleUrl: 'ls-validation-manager.css',\n  shadow: true,\n})\n\nexport class LsValidationManager {\n\n  /**\n   * The template information (as JSON).\n   * {LSApiTemplate}\n   */\n  @Prop() validationErrors: ValidationError[];\n\n  render() {\n    return (\n      <Host>\n        <div>\n          <div>\n            <div class={'validation-section-title'}>Action Required</div>\n            <p class=\"toolbox-section-description\">\n              This document needs fields added or corrected before it can be sent.\n            </p>\n          </div>\n          {this.validationErrors && this.validationErrors.map((field, idx) => {\n            const signerIndex = field?.role?.signerIndex ? field?.role?.signerIndex % 100 : null;\n            const pallette = defaultRolePalette[signerIndex || field?.element?.signer || 0];\n\n            return (\n              <div\n                key={idx}\n                class={'required-field'}\n                style={{\n                  '--field-background': pallette.s10,\n                  '--field-border-color': pallette.s10,\n                  '--field-background-hover': pallette.s20,\n                  '--field-text-color': pallette.s70,\n                  '--field-text-color-hover': pallette.s80,\n                  '--field-border-color-hover': pallette.s60,\n                }}\n              >\n                <div class={'required-field-items-left'}>\n                  <div class={'dot'} style={{ background: pallette.s60 }} />\n                  {field?.role && (\n                    <div class={'required-field-items-left'}>\n                      <p style={{ color: pallette.s80 }}>{field.role?.name || `Signer ${field?.role?.signerIndex + 1}`}</p>\n                      <div class={'role-label'} style={{ background: pallette.s30, color: pallette.s70 }}>\n                        {field.role?.roleType.toLowerCase() || `Signer ${field.role?.signerIndex + 1}`}\n                      </div>\n                    </div>\n                  )}\n                  {field?.element && (\n                    <>\n                     <ls-toolbox-field\n                          elementType=\"signature\"\n                          formElementType=\"signature\"\n                          label=\"Signature\"\n                          defaultHeight={27}\n                          defaultWidth={120}\n                          validation={0}\n                          icon=\"signature\"\n                          tooltip=\"Use this field to collect Signatures from Participants\"\n                          signer={field.element.signer}\n                        />\n\n                      <p style={{ color: pallette.s80 }}>{field.role?.name || `${field.element.formElementType} ${field?.element?.label + 1}`}</p>\n                      <div class={'role-label'} style={{ background: pallette.s30, color: pallette.s70 }}>\n                        {field.description}\n                      </div>\n                    </>\n                  )}\n                </div>\n              </div>\n            );\n          })}\n        </div>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/p-CnuQZry1.js.map

@@ -1 +0,0 @@
-{"file":"p-CnuQZry1.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-properties/ls-field-properties.css?tag=ls-field-properties&encapsulation=shadow","src/components/ls-field-properties/ls-field-properties.tsx"],"sourcesContent":[":host {\n  display: block;\n  width: 100%;\n  padding: 1rem;\n}\n\n\n/* Global Styles */\n\np {\n  color: var(--gray-80, #6c6e73);\n  font-family: var(--font-family);\n  font-size: var(--text-sm);\n  font-style: normal;\n  font-weight: 400;\n  line-height: var(--text-sm-line-height);\n}\n\na {\n  color: var(--primary-60, #4456f6);\n  font-size: var(--text-sm);\n  font-style: normal;\n  font-weight: 400;\n  line-height: var(--text-sm-line-height);\n  cursor: pointer;\n}\n\na:hover {\n  text-decoration: underline;\n  color: var(--primary-70, #2134dc);\n}\n\n.button-link,\n.button-link:hover {\n  all: unset;\n}\n\nselect {\n  appearance: none;\n  height: 2.25rem;\n}\n\n.input-wrapper {\n  position: relative;\n  width: fit-content;\n}\n\n#selectorIcon {\n  position: absolute;\n  top: 50%;\n  right: 0.675rem;\n  transform: translateY(-50%);\n  pointer-events: none;\n  color: var(--gray-80, #6c6e73);\n}\n\n#selectLeadingIcon {\n  position: absolute;\n  top: 50%;\n  left: 0.675rem;\n  transform: translateY(-50%);\n  pointer-events: none;\n  color: var(--gray-80, #6c6e73);\n}\n\n.has-leading-icon {\n  padding-left: 2.5rem;\n}\n\ninput,\nselect,\ntextarea {\n  border: 1px solid var(--gray-40, #d8d9dc);\n  box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);\n  padding: 0.5rem 0.75rem;\n  font-family: var(--font-family);\n  font-size: var(--text-sm);\n  border-radius: 0.5rem;\n  color: var(--gray-100, #45484d);\n  font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n  color: var(--gray-60, #afb0b2);\n}\n\ninput:hover,\nselect:hover,\ntextarea:hover {\n  border-color: var(--gray-50, #c8c9cc);\n  background-color: var(--white, #fff);\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n  outline: none;\n  box-shadow: 0 0 0 0.25rem var(--primary-40, #79adfc);\n  border-color: var(--primary-60, #4456f6);\n  background-color: var(--white, #fff);\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n  border-color: var(--primary-50, #5185ff);\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n  cursor: not-allowed;\n  background-color: var(--gray-10, #f7f8fa);\n}\n\ninput[type='checkbox'] {\n  appearance: none;\n  position: relative;\n  height: 1rem;\n  width: 1rem;\n  padding: 0.25rem;\n  border-radius: var(--radius-sm);\n  border: 1px solid #d1d5db;\n  background-color: #ffffff;\n  cursor: pointer;\n}\n\ninput[type='checkbox']:checked,\ninput[type='checkbox'].indeterminate {\n  background-color: var(--primary-60, #4456f6);\n  border: none;\n}\n\ninput[type='checkbox']:checked::after {\n  content: '';\n  position: absolute;\n  top: 45%;\n  left: 50%;\n  transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);\n  width: 0.5rem;\n  height: 0.25rem;\n  border-bottom: 0.125rem solid white;\n  border-right: 0.125rem solid white;\n}\n\ninput[type='checkbox'].indeterminate::after {\n  content: '';\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 0.5rem;\n  height: 0.125rem;\n  background-color: white;\n}\n\ninput[type='checkbox']:checked:hover,\ninput[type='checkbox'].indeterminate:hover {\n  background-color: var(--primary-70, #2134dc);\n  border: none;\n}\n\ninput[type='checkbox']:hover {\n  border: 1px solid #9ca3af;\n}\n\ninput[type='checkbox']:focus,\ninput[type='checkbox']:active {\n  outline: none;\n  box-shadow: 0 0 0 0.25rem var(--primary-20, #c7ddff);\n  background-color: #f0f4f8;\n}\n\ninput[type='checkbox']:disabled {\n  background-color: #f3f4f6;\n  outline: none;\n  cursor: not-allowed;\n}\n\ninput[type='checkbox']:disabled:checked {\n  background-color: #e5e7eb;\n  border: none;\n  outline: none;\n  cursor: not-allowed;\n}\n\n.checkbox-container {\n  display: flex;\n  gap: 0.5rem;\n  width: 100%;\n}\n\n.checkbox-label {\n  color: var(--gray-100, #45484d);\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1rem;\n}\n\n.form-label {\n  color: var(--gray-100, #45484d);\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.5rem;\n}\n\n.form-field {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n  width: 100%;\n}\n\n.loading-box {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100vh;\n  color: var(--primary-60, #0c7cba);\n}\n\nbutton {\n  border: 0;\n  appearance: button;\n  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: var(--radius-lg);\n  background-color: var(--primary-60, #4456f6);\n  color: white;\n  text-transform: capitalize;\n  min-height: 2.25rem;\n  min-width: 2.25rem;\n}\n\nbutton.tertiaryGrey {\n  border: 1px solid var(--gray-40, #d8d9dc);\n  background-color: white;\n  color: var(--gray-80, #787a80);\n}\n\nbutton.tertiaryGrey:hover {\n  border: 1px solid var(--gray-50, #c8c9cc);\n  background: var(--gray-10, #f7f8fa);\n}\n\n.button-group {\n  display: flex;\n  border-radius: 0.5rem;\n  border: 1px solid var(--gray-30, #e0e2e5);\n  background: var(--white, #ffffff);\n  overflow: clip;\n}\n\n.button-group button {\n  display: flex;\n  background: transparent;\n  border-radius: unset;\n  padding: 0.25rem 0.75rem;\n  min-width: 2.156rem;\n  min-height: unset;\n  color: var(--gray-80, #6c6e73);\n}\n\n.button-group button:hover {\n  background: var(--gray-10, #f7f8fa);\n}\n\n.button-group > :first-child {\n  border-radius: 0.5rem 0 0 0.5rem;\n}\n\n.button-group > :last-child {\n  border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.button-group > :not(:first-child) {\n  border-left: 1px solid var(--gray-30, #e0e2e5);\n}\n\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { LSApiElement } from '../../types/LSApiElement';\n\n@Component({\n  tag: 'ls-field-properties',\n  styleUrl: 'ls-field-properties.css',\n  shadow: true,\n})\nexport class LsFieldProperties {\n  @Prop() dataItem: LSApiElement[];\n\n  renderFields() {\n    if (this.dataItem && this.dataItem?.length === 1) {\n      switch (this.dataItem[0].formElementType) {\n        case 'signature':\n          return <ls-field-properties-signature dataItem={this.dataItem[0]} />\n        case 'date':\n          return <ls-field-properties-date dataItem={this.dataItem[0]} />\n        case 'signing date':\n          return <ls-field-properties-date dataItem={this.dataItem[0]} />\n        case 'text':\n          return <ls-field-properties-text dataItem={this.dataItem[0]} />\n        case 'number':\n          return <ls-field-properties-number dataItem={this.dataItem[0]} />\n        case 'autosign':\n          return <ls-field-properties-autosign dataItem={this.dataItem[0]} />\n        case 'email':\n          return <ls-field-properties-email dataItem={this.dataItem[0]} />\n        case 'image':\n          return <ls-field-properties-image dataItem={this.dataItem[0]} />\n        case 'file':\n          return <ls-field-properties-file dataItem={this.dataItem[0]} />\n        case 'dropdown':\n          return <ls-field-properties-file dataItem={this.dataItem[0]} />\n        default:\n          return <ls-field-properties-general dataItem={this.dataItem[0]} />\n\n      }\n    } else if (this.dataItem && this.dataItem?.length > 1)\n      return <ls-field-properties-multiple dataItem={this.dataItem} />\n\n  }\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    event.stopPropagation();\n  }\n\n  private handleKeyUp = (event: KeyboardEvent) => {\n    event.stopPropagation();\n  }\n\n  render() {\n    return (\n      <Host onKeyDown={this.handleKeyDown} onKeyUp={this.handleKeyUp}>\n        {this.dataItem && this.renderFields()}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/p-CqZsDpTG.js

@@ -1,135 +0,0 @@
-import { t as transformTag, p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-BhZ5Udbm.js';
-import { d as defaultRolePalette } from './p-BKrsDBDB.js';
-import { d as defineCustomElement$1 } from './p-CQL30SR-.js';
-
-const lsParticipantSelectCss = () => `:host{display:inline-block}*{margin:0}.dropdown{display:flex;align-items:center;position:relative}.dropdown-header{border-radius:0.625rem;border:1px solid var(--gray-20, #edeff2);background:var(--gray-10, #f7f8fa);display:flex;padding:0.125rem 0.125rem 0.125rem 0.5rem;align-items:center;gap:0.5rem}.placing-fields-text{color:var(--gray-90, #5e6066);text-align:center;font-size:0.875rem;font-style:normal;font-weight:500;margin:0}.selected-role-label{display:flex;padding:0.125rem 0.375rem;justify-content:center;align-items:center;gap:0.25rem;border-radius:0.25rem;font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.dropdown-list{position:absolute;top:3rem;left:50%;transform:translateX(-50%);display:flex;width:18.5625rem;padding:0.25rem;flex-direction:column;gap:0.25rem;border-radius:0.75rem;border:1px solid var(--gray-30, #e0e2e5);background:white;box-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);max-height:40vh;overflow-y:auto}.dropdown-item{display:flex;padding:0.5rem 0.875rem 0.5rem 0.5rem;align-items:center;gap:0.75rem;align-self:stretch;border-radius:0.5rem}.dropdown-item.selected,.dropdown-item.selected:hover{background:var(--background-selected, #e0e2e5)}.dropdown-item:hover{background:var(--gray-10, #f7f8fa)}.add-participant-row{all:unset;display:flex;padding:0.5rem 0.875rem 0.5rem 0.5rem;align-items:center;gap:0.75rem;align-self:stretch;border-radius:0.5rem;border:1px dashed var(--gray-30, #e0e2e5);cursor:pointer}.add-participant-row:hover{background:var(--gray-10, #f7f8fa)}.plus-icon{color:var(--gray-40, #d8d9dc)}.role-icon{display:flex;padding:0.5rem;border-radius:0.625rem}.add-participant-icon{display:flex;padding:0.5rem;border-radius:0.625rem;color:white;background:var(--primary-60, #4456f6)}.role-text{display:flex;flex-direction:column;width:100%}.dropdown-item .check-icon{color:var(--gray-40, #d8d9dc)}.dropdown-item.selected .check-icon{color:var(--check-icon-selected)}.role-name{color:var(--gray-100, #45484d);font-size:0.75rem;font-style:normal;font-weight:500;line-height:1rem;}.role-type{color:var(--gray-80, #787a80);font-size:0.75rem;font-style:normal;font-weight:400;line-height:1rem;}.dropdown-item.selected .role-name{color:var(--role-name-selected)}.dropdown-item.selected .role-type{color:var(--role-type-selected)}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:2.25rem}.input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6c6e73)}.has-leading-icon{padding-left:2.5rem}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,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{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,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}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)}.expand-button{border:0;cursor:pointer;display:inline-flex;align-items:center;border-radius:0.5rem;justify-content:center;text-transform:capitalize;min-height:2rem;min-width:2rem;max-height:2rem;max-width:2rem}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}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}`;
-
-const LsParticipantSelect = /*@__PURE__*/ proxyCustomElement(class LsParticipantSelect extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.roleChange = createEvent(this, "roleChange", 7);
-        this.addParticipant = createEvent(this, "addParticipant", 7);
-    }
-    /**
-   * The id of the currently selected role.
-   * {string}
-   */
-    selected;
-    /**
-     * The currently selected role.
-     * {number}
-     */
-    selectedRole = { signerIndex: 0, name: 'Sender', roleType: 'SENDER', default: true };
-    handleRoleLoad() {
-        if (this.selectedRole.default) {
-            if (this.roles.length > 0) {
-                const initialRole = this.roles.find(r => r.signerIndex === 1);
-                if (initialRole) {
-                    this.selectedRole = { ...initialRole, default: false };
-                }
-            }
-        }
-        else {
-            const updatedRole = this.roles.find(r => r.signerIndex === this.selectedRole.signerIndex);
-            if (updatedRole) {
-                this.selectedRole = { ...updatedRole, default: false };
-            }
-        }
-    }
-    /**
-     * The current template roles.
-     * {LSApiRole}
-     */
-    roles = [];
-    isOpen = false;
-    toggleDropdown = () => {
-        this.isOpen = !this.isOpen;
-    };
-    roleChange;
-    addParticipant;
-    selectRole(role) {
-        this.selectedRole = { ...role, default: false };
-        this.isOpen = false;
-        this.roleChange.emit(role.signerIndex);
-    }
-    createHandler() {
-        this.addParticipant.emit({ type: 'SIGNER' });
-    }
-    render() {
-        return (h(Host, { key: 'c141766f1eb5c4b043fe9e6cccf73d68ad5a9f37' }, h("div", { key: 'b4524f25d68a5a715ece2cee78e09b47b6c0241b', class: "dropdown" }, h("div", { key: '81099026f34762dfe3e5073cf35b143590649879', class: "dropdown-header", onClick: this.toggleDropdown }, h("svg", { key: 'e4a18cb2949cb87ece3fc31771f592b3a5b291ce', width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '3d3b48a2741681b7a1c24ad018e6077badbdbc53', 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: 'b572e561374421a6f4712cd495c4eb2f8dee9d8b', 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: 'b44f5beb1ece1c918921d547823c30b0fb3700c6', 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: '3f174e6df96be1bb6e3479b653bdb1e8968d8c2d', 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: '2c121f619fababc6f2063406e142bcd6aa93879c', class: 'placing-fields-text' }, "Placing Fields for"), h("div", { key: '62fb1e6f88acdd44eaffc6f27d18959891f0a35e', class: 'selected-role-label', style: {
-                background: defaultRolePalette[this.selectedRole?.signerIndex % 100].s20,
-                color: defaultRolePalette[this.selectedRole?.signerIndex % 100].s80,
-            } }, h("ls-icon", { key: 'd0ad93cd6345f998fbe43fc9ffed8638861f84a2', size: "1.125rem", 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: 'ccf21bb38feec686b6d8d5e2832e508b6f415256', class: 'tertiaryGrey expand-button', "aria-haspopup": "listbox", "aria-expanded": this.isOpen }, h("ls-icon", { key: 'f89863173df88aa55e363f5dd9f2ad145cb33d12', name: "chevron-down" }))), this.isOpen && (h("div", { key: '78da1100aabb62f5ad6d5f294b1aab9d5547e1e6', class: "dropdown-list" }, h("div", { key: '136ce701994a107daa5c0786dddcd476574cef31', 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: '283ca0d9fdd21a5e7a18273319e6af0d2ddf2886', class: 'role-icon', style: {
-                background: defaultRolePalette[0].s50,
-                color: defaultRolePalette[0].s80,
-            } }, h("ls-icon", { key: '07a6bcd8180da7fbc10f74974d054c4b8931430f', name: "user" })), h("div", { key: '512c4f3fe266d71acb906349b27f5591074bd504', class: 'role-text' }, h("p", { key: 'bab252d2494e47ccf85c67af43452dac7153828f', class: 'role-name', style: {
-                '--role-name-selected': defaultRolePalette[0].s80,
-            } }, 'Sender'), h("p", { key: 'eaaa3335214cdd4f1c4a33322ef6856eec60b8ae', class: 'role-type', style: {
-                '--role-type-selected': defaultRolePalette[0].s80,
-            } }, "You")), h("ls-icon", { key: 'fd6a73b8395974ec0fd7354729decfb89834fef6', 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
-                .querySelector('.check-icon')
-                ?.setAttribute('name', r.signerIndex !== this.selectedRole?.signerIndex ? 'base-circle' : 'check-circle') }, h("div", { class: 'role-icon', style: {
-                background: r.signerIndex > 100 ? defaultRolePalette[r?.signerIndex % 100].s30 : defaultRolePalette[r?.signerIndex % 100].s40,
-                color: defaultRolePalette[r?.signerIndex % 100].s90,
-            } }, h("ls-icon", { name: r.roleType === 'WITNESS' ? 'eye' : r.roleType === 'APPROVER' ? 'check-circle' : 'signature' })), h("div", { class: 'role-text' }, h("p", { class: 'role-name', style: {
-                '--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: 'f4258f3b7b58f99612391bdf1af167a7ac9e9e39', onClick: () => this.createHandler(), class: 'add-participant-row', style: {
-                '--background-selected': defaultRolePalette[1].s10,
-                '--check-icon-selected': defaultRolePalette[1].s50,
-            } }, h("div", { key: 'cd4f50c0aa9b9da2cb182625ed0aa4dc03f6aade', class: 'add-participant-icon' }, h("ls-icon", { key: 'a836beba284e419d48c4e49a831dcd8e35636c95', name: "user-add" })), h("div", { key: '867fa31f01ce54f54ec77a018d6998496470ac39', class: 'role-text' }, h("p", { key: '545385488508f94bd10875e6d299a979b65f218c', class: 'role-name' }, "Add Participant"), h("p", { key: 'c721a5c2b58ff972cd4854bfc797556ce0de20e7', class: 'role-type' }, "Add a new Signer")), h("ls-icon", { key: '0fc515b652f7bebf60e93e08674d540e17bf6a0c', class: 'plus-icon', name: "plus" }))))), h("slot", { key: '6f18592b6d1d532ad5079237e5c065127437ebce' })));
-    }
-    static get watchers() { return {
-        "roles": ["handleRoleLoad"]
-    }; }
-    static get style() { return lsParticipantSelectCss(); }
-}, [769, "ls-participant-select", {
-        "selected": [1025],
-        "roles": [16],
-        "selectedRole": [32],
-        "isOpen": [32]
-    }, undefined, {
-        "roles": ["handleRoleLoad"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ls-participant-select", "ls-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ls-participant-select":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), LsParticipantSelect);
-            }
-            break;
-        case "ls-icon":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { LsParticipantSelect as L, defineCustomElement as d };
-//# sourceMappingURL=p-CqZsDpTG.js.map
-
-//# sourceMappingURL=p-CqZsDpTG.js.map

package/dist/components/p-CqZsDpTG.js.map

@@ -1 +0,0 @@
-{"file":"p-CqZsDpTG.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-participant-select/ls-participant-select.css?tag=ls-participant-select&encapsulation=shadow","src/components/ls-participant-select/ls-participant-select.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n}\n\n* {\n  margin: 0;\n}\n\n.dropdown {\n  display: flex;\n  align-items: center;\n  position: relative;\n}\n\n.dropdown-header {\n  border-radius: 0.625rem;\n  border: 1px solid var(--gray-20, #edeff2);\n  background: var(--gray-10, #f7f8fa);\n  display: flex;\n  padding: 0.125rem 0.125rem 0.125rem 0.5rem;\n  align-items: center;\n  gap: 0.5rem;\n}\n\n.placing-fields-text {\n  color: var(--gray-90, #5e6066);\n  text-align: center;\n  font-size: 0.875rem;\n  font-style: normal;\n  font-weight: 500;\n  margin: 0;\n}\n\n.selected-role-label {\n  display: flex;\n  padding: 0.125rem 0.375rem;\n  justify-content: center;\n  align-items: center;\n  gap: 0.25rem;\n  border-radius: 0.25rem;\n  font-size: 0.875rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.25rem; /* 142.857% */\n}\n\n.dropdown-list {\n  position: absolute;\n  top: 3rem;\n  left: 50%;\n  transform: translateX(-50%);\n  display: flex;\n  width: 18.5625rem;\n  padding: 0.25rem;\n  flex-direction: column;\n  gap: 0.25rem;\n  border-radius: 0.75rem;\n  border: 1px solid var(--gray-30, #e0e2e5);\n  background: white;\n  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n  max-height: 40vh;\n  overflow-y: auto;\n}\n\n.dropdown-item {\n  display: flex;\n  padding: 0.5rem 0.875rem 0.5rem 0.5rem;\n  align-items: center;\n  gap: 0.75rem;\n  align-self: stretch;\n  border-radius: 0.5rem;\n}\n\n.dropdown-item.selected,\n.dropdown-item.selected:hover {\n  background: var(--background-selected, #e0e2e5);\n}\n\n.dropdown-item:hover {\n  background: var(--gray-10, #f7f8fa);\n}\n\n.add-participant-row {\n  all: unset;\n  display: flex;\n  padding: 0.5rem 0.875rem 0.5rem 0.5rem;\n  align-items: center;\n  gap: 0.75rem;\n  align-self: stretch;\n  border-radius: 0.5rem;\n  border: 1px dashed var(--gray-30, #e0e2e5);\n  cursor: pointer;\n}\n\n.add-participant-row:hover {\n  background: var(--gray-10, #f7f8fa);\n}\n\n.plus-icon {\n  color: var(--gray-40, #d8d9dc);\n}\n\n.role-icon {\n  display: flex;\n  padding: 0.5rem;\n  border-radius: 0.625rem;\n}\n\n.add-participant-icon {\n  display: flex;\n  padding: 0.5rem;\n  border-radius: 0.625rem;\n  color: white;\n  background: var(--primary-60, #4456f6);\n}\n\n.role-text {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n}\n\n.dropdown-item .check-icon {\n  color: var(--gray-40, #d8d9dc);\n}\n\n.dropdown-item.selected .check-icon {\n  color: var(--check-icon-selected);\n}\n\n.role-name {\n  color: var(--gray-100, #45484d);\n  font-size: 0.75rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1rem; /* 133.333% */\n}\n\n.role-type {\n  color: var(--gray-80, #787a80);\n  font-size: 0.75rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1rem; /* 133.333% */\n}\n\n.dropdown-item.selected .role-name {\n  color: var(--role-name-selected);\n}\n\n.dropdown-item.selected .role-type {\n  color: var(--role-type-selected);\n}\n\n/* Global Styles */\n\np {\n  color: var(--gray-80, #6c6e73);\n  font-family: var(--font-family);\n  font-size: var(--text-sm);\n  font-style: normal;\n  font-weight: 400;\n  line-height: var(--text-sm-line-height);\n}\n\na {\n  color: var(--primary-60, #4456f6);\n  font-size: var(--text-sm);\n  font-style: normal;\n  font-weight: 400;\n  line-height: var(--text-sm-line-height);\n  cursor: pointer;\n}\n\na:hover {\n  text-decoration: underline;\n  color: var(--primary-70, #2134dc);\n}\n\n.button-link,\n.button-link:hover {\n  all: unset;\n}\n\nselect {\n  appearance: none;\n  height: 2.25rem;\n}\n\n.input-wrapper {\n  position: relative;\n  width: fit-content;\n}\n\n#selectorIcon {\n  position: absolute;\n  top: 50%;\n  right: 0.675rem;\n  transform: translateY(-50%);\n  pointer-events: none;\n  color: var(--gray-80, #6c6e73);\n}\n\n#selectLeadingIcon {\n  position: absolute;\n  top: 50%;\n  left: 0.675rem;\n  transform: translateY(-50%);\n  pointer-events: none;\n  color: var(--gray-80, #6c6e73);\n}\n\n.has-leading-icon {\n  padding-left: 2.5rem;\n}\n\ninput,\nselect,\ntextarea {\n  border: 1px solid var(--gray-40, #d8d9dc);\n  box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);\n  padding: 0.5rem 0.75rem;\n  font-family: var(--font-family);\n  font-size: var(--text-sm);\n  border-radius: 0.5rem;\n  color: var(--gray-100, #45484d);\n  font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n  color: var(--gray-60, #afb0b2);\n}\n\ninput:hover,\nselect:hover,\ntextarea:hover {\n  border-color: var(--gray-50, #c8c9cc);\n  background-color: var(--white, #fff);\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n  outline: none;\n  box-shadow: 0 0 0 0.25rem var(--primary-40, #79adfc);\n  border-color: var(--primary-60, #4456f6);\n  background-color: var(--white, #fff);\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n  border-color: var(--primary-50, #5185ff);\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n  cursor: not-allowed;\n  background-color: var(--gray-10, #f7f8fa);\n}\n\ninput[type='checkbox'] {\n  appearance: none;\n  position: relative;\n  height: 1rem;\n  width: 1rem;\n  padding: 0.25rem;\n  border-radius: var(--radius-sm);\n  border: 1px solid #d1d5db;\n  background-color: #ffffff;\n  cursor: pointer;\n}\n\ninput[type='checkbox']:checked,\ninput[type='checkbox'].indeterminate {\n  background-color: var(--primary-60, #4456f6);\n  border: none;\n}\n\ninput[type='checkbox']:checked::after {\n  content: '';\n  position: absolute;\n  top: 45%;\n  left: 50%;\n  transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);\n  width: 0.5rem;\n  height: 0.25rem;\n  border-bottom: 0.125rem solid white;\n  border-right: 0.125rem solid white;\n}\n\ninput[type='checkbox'].indeterminate::after {\n  content: '';\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 0.5rem;\n  height: 0.125rem;\n  background-color: white;\n}\n\ninput[type='checkbox']:checked:hover,\ninput[type='checkbox'].indeterminate:hover {\n  background-color: var(--primary-70, #2134dc);\n  border: none;\n}\n\ninput[type='checkbox']:hover {\n  border: 1px solid #9ca3af;\n}\n\ninput[type='checkbox']:focus,\ninput[type='checkbox']:active {\n  outline: none;\n  box-shadow: 0 0 0 0.25rem var(--primary-20, #c7ddff);\n  background-color: #f0f4f8;\n}\n\ninput[type='checkbox']:disabled {\n  background-color: #f3f4f6;\n  outline: none;\n  cursor: not-allowed;\n}\n\ninput[type='checkbox']:disabled:checked {\n  background-color: #e5e7eb;\n  border: none;\n  outline: none;\n  cursor: not-allowed;\n}\n\n.checkbox-container {\n  display: flex;\n  gap: 0.5rem;\n  width: 100%;\n}\n\n.checkbox-label {\n  color: var(--gray-100, #45484d);\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1rem;\n}\n\n.form-label {\n  color: var(--gray-100, #45484d);\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.5rem;\n}\n\n.form-field {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n  width: 100%;\n}\n\n.loading-box {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100vh;\n  color: var(--primary-60, #0c7cba);\n}\n\n.expand-button {\n  border: 0;\n  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  border-radius: 0.5rem;\n  justify-content: center;\n  text-transform: capitalize;\n  min-height: 2rem;\n  min-width: 2rem;\n  max-height: 2rem;\n  max-width: 2rem;\n}\n\nbutton.tertiaryGrey {\n  border: 1px solid var(--gray-40, #d8d9dc);\n  background-color: white;\n  color: var(--gray-80, #787a80);\n}\n\nbutton.tertiaryGrey:hover {\n  border: 1px solid var(--gray-50, #c8c9cc);\n  background: var(--gray-10, #f7f8fa);\n}\n\n.button-group {\n  display: flex;\n  border-radius: 0.5rem;\n  border: 1px solid var(--gray-30, #e0e2e5);\n  background: var(--white, #ffffff);\n  overflow: clip;\n}\n\n.button-group button {\n  display: flex;\n  background: transparent;\n  border-radius: unset;\n  padding: 0.25rem 0.75rem;\n  min-width: 2.156rem;\n  min-height: unset;\n  color: var(--gray-80, #6c6e73);\n}\n\n.button-group button:hover {\n  background: var(--gray-10, #f7f8fa);\n}\n\n.button-group > :first-child {\n  border-radius: 0.5rem 0 0 0.5rem;\n}\n\n.button-group > :last-child {\n  border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.button-group > :not(:first-child) {\n  border-left: 1px solid var(--gray-30, #e0e2e5);\n}\n","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=\"1.125rem\"\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"],"version":3}

package/dist/components/p-Czlhifa9.js

@@ -1,59 +0,0 @@
-import { t as transformTag, p as proxyCustomElement, H, h } from './p-BhZ5Udbm.js';
-import { c as clsx } from './p-ChV9xqsO.js';
-import { d as defineCustomElement$1 } from './p-CQL30SR-.js';
-
-const lsRadioInputCss = () => `.radioLabel{display:flex;align-items:center;gap:0.75rem;border-radius:0.5rem;padding:0.5rem 0.75rem}.radioLabel.checked{background-color:var(--primary-10);border-color:var(--primary-20);color:var(--primary-90)}.radioLabel:not(checked){color:var(--gray-90);background-color:var(--gray-10);border:1px solid var(--gray-20)}.radioLabel.checked:hover{border-color:var(--primary-30);color:var(--primary-100)}.radioLabel:not(.checked):not(.disabled):hover{border-color:var(--gray-50);color:var(--gray-100)}.radioLabel:focus:not(.disabled){box-shadow:var(--focus-box-shadow);outline-offset:var(--focus-outline-offset);outline:none}.radioLabel.disabled{cursor:not-allowed}.radioLabel.disabled.checked{background-color:var(--primary-10);color:var(--primary-40);border-color:var(--primary-40)}.radioLabel.disabled:not(.checked){background-color:var(--gray-10);color:var(--gray-60)}.inputClass{margin-top:0px}.inputClass:focus{outline:none}.inputClass:disabled{cursor:not-allowed}.spanContainer{display:flex;gap:0.25rem;align-items:center}`;
-
-const LsRadioInput = /*@__PURE__*/ proxyCustomElement(class LsRadioInput extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-    }
-    radioId;
-    label;
-    icon;
-    name = 'name';
-    checked = false;
-    disabled = false;
-    customStyle;
-    render() {
-        const { label, radioId, icon, name, disabled, checked, customStyle, } = this;
-        const radioLabelClass = clsx('radioLabel', disabled && 'disabled', checked && 'checked');
-        return (h("label", { key: 'b0bfe57cbbe4021b0e05adaeddd45a5e3733a0e9', htmlFor: radioId, tabIndex: 0, class: radioLabelClass, style: customStyle }, h("input", { key: '5a2841e892763953a7b04ccb868f7b621808cb57', type: 'radio', class: 'inputClass', id: radioId, name: name, value: label, disabled: disabled, tabIndex: 0, checked: checked }), h("div", { key: '1a5d4aab50813cea85662a9bbe706db5688a521b', class: 'spanContainer' }, h("span", { key: 'd37ebe931692ed543284dd96d47371af369a23ca' }, icon && h("ls-icon", { key: '6361c2d3f46d553e6a79964536e433f4768879fd', name: icon, size: "16" })), h("span", { key: 'b824adb5f5634230aa43741105e855f6a4df8c67' }, label))));
-    }
-    static get style() { return lsRadioInputCss(); }
-}, [768, "ls-radio-input", {
-        "radioId": [1, "radio-id"],
-        "label": [1],
-        "icon": [1],
-        "name": [1],
-        "checked": [4],
-        "disabled": [4],
-        "customStyle": [16]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ls-radio-input", "ls-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ls-radio-input":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), LsRadioInput);
-            }
-            break;
-        case "ls-icon":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { LsRadioInput as L, defineCustomElement as d };
-//# sourceMappingURL=p-Czlhifa9.js.map
-
-//# sourceMappingURL=p-Czlhifa9.js.map

package/dist/components/p-Czlhifa9.js.map

@@ -1 +0,0 @@
-{"file":"p-Czlhifa9.js","mappings":";;;;AAAA,MAAM,eAAe,GAAG,MAAM,CAAC,mgCAAmgC,CAAC;;MCSthC,YAAY,iBAAAA,kBAAA,CAAA,MAAA,YAAA,SAAAC,CAAA,CAAA;;;;;;;AACf,IAAA,OAAO;AACP,IAAA,KAAK;AACL,IAAA,IAAI;IACJ,IAAI,GAAY,MAAM;IACtB,OAAO,GAAY,KAAK;IACxB,QAAQ,GAAa,KAAK;AAC1B,IAAA,WAAW;IAEnB,MAAM,GAAA;AACJ,QAAA,MAAM,EACJ,KAAK,EACL,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,WAAW,GACZ,GAAG,IAAI;AACR,QAAA,MAAM,eAAe,GAAG,IAAI,CAC1B,YAAY,EACZ,QAAQ,IAAI,UAAU,EACtB,OAAO,IAAI,SAAS,CACrB;AAED,QAAA,QACE,CACE,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,CAAC,EACX,KAAK,EAAE,eAAe,EACtB,KAAK,EAAE,WAAW,EAAA,EAElB,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,YAAY,EAClB,EAAE,EAAE,OAAO,EACX,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,CAAC,EACX,OAAO,EAAE,OAAO,EAChB,CAAA,EACF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,eAAe,EAAA,EACxB,CAAO,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAA,IAAI,IAAI,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAA,CAAY,CAAQ,EAClE,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAO,KAAK,CAAQ,CAChB,CACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-formfield/inputs/ls-radio-input/ls-radio-input.css?tag=ls-radio-input","src/components/ls-formfield/inputs/ls-radio-input/ls-radio-input.tsx"],"sourcesContent":[".radioLabel{\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  border-radius: 0.5rem;\n  padding: 0.5rem 0.75rem;\n}\n\n.radioLabel.checked {\n  background-color: var(--primary-10);\n  border-color: var(--primary-20);\n  color: var(--primary-90)\n}\n\n.radioLabel:not(checked) {\n  color: var(--gray-90);\n  background-color: var(--gray-10);\n  border: 1px solid var(--gray-20);\n}\n\n.radioLabel.checked:hover {\n  border-color: var(--primary-30);\n  color: var(--primary-100);\n  \n}\n\n.radioLabel:not(.checked):not(.disabled):hover {\n  border-color: var(--gray-50);\n  color: var(--gray-100);\n}\n\n.radioLabel:focus:not(.disabled) {\n  box-shadow: var(--focus-box-shadow);\n  outline-offset: var(--focus-outline-offset);\n  outline: none;\n}\n\n.radioLabel.disabled {\n  cursor: not-allowed;\n}\n\n.radioLabel.disabled.checked {\n  background-color: var(--primary-10);\n  color: var(--primary-40);\n  border-color: var(--primary-40);\n}\n\n.radioLabel.disabled:not(.checked) {\n  background-color: var(--gray-10);\n  color: var(--gray-60);\n}\n\n.inputClass {\n  margin-top: 0px;\n}\n\n.inputClass:focus {\n  outline: none;\n}\n\n.inputClass:disabled {\n  cursor: not-allowed;\n}\n\n.spanContainer {\n  display: flex;\n  gap: 0.25rem;\n  align-items: center;\n}","import { Component, Prop, h } from '@stencil/core';\nimport { Icon } from '../../../../types/Icon';\nimport clsx from 'clsx';\n\n@Component({\n  tag: 'ls-radio-input',\n  styleUrl: 'ls-radio-input.css',\n  shadow: false,\n})\nexport class LsRadioInput {\n  @Prop() radioId: string;\n  @Prop() label: string;\n  @Prop() icon?: Icon;\n  @Prop() name?: string = 'name';\n  @Prop() checked: boolean = false;\n  @Prop() disabled?: boolean = false;\n  @Prop() customStyle?: { [key: string]: string };\n\n  render() {\n    const {\n      label,\n      radioId,\n      icon,\n      name,\n      disabled,\n      checked,\n      customStyle,\n    } = this;\n    const radioLabelClass = clsx(\n      'radioLabel',\n      disabled && 'disabled',\n      checked && 'checked',\n    );\n\n    return (\n      <label\n        htmlFor={radioId}\n        tabIndex={0}\n        class={radioLabelClass}\n        style={customStyle}\n      >\n        <input\n          type='radio'\n          class='inputClass'\n          id={radioId}\n          name={name}\n          value={label}\n          disabled={disabled}\n          tabIndex={0}\n          checked={checked}\n        />\n        <div class='spanContainer'>\n          <span>{icon && <ls-icon name={icon} size={\"16\"}></ls-icon>}</span>\n          <span>{label}</span>\n        </div>\n      </label>\n    );\n  }\n}\n"],"version":3}

package/dist/components/p-DET7mO8t.js

@@ -1,117 +0,0 @@
-import { t as transformTag, p as proxyCustomElement, H, h, c as Host } from './p-BhZ5Udbm.js';
-import { d as defineCustomElement$d } from './p-LsRvuNhk.js';
-import { d as defineCustomElement$c } from './p-CbC-aTzj.js';
-import { d as defineCustomElement$b } from './p-DhSQ43wj.js';
-import { d as defineCustomElement$a } from './p-BvxhmYtv.js';
-import { d as defineCustomElement$9 } from './p-CT3XMXW6.js';
-import { d as defineCustomElement$8 } from './p-BlbYremm.js';
-import { d as defineCustomElement$7 } from './p-Cgka-t2t.js';
-import { d as defineCustomElement$6 } from './p-DOn32rOe.js';
-import { d as defineCustomElement$5 } from './p-CQL30SR-.js';
-import { d as defineCustomElement$4 } from './p-VCYab8gJ.js';
-import { d as defineCustomElement$3 } from './p-IdvWNLco.js';
-import { d as defineCustomElement$2 } from './p-DLZDxSn0.js';
-import { d as defineCustomElement$1 } from './p-EiDqqBpE.js';
-
-const lsFieldPropertiesImageCss = () => `:host{display:flex;flex-direction:column;gap:1rem;width:100%;height:100%;position:relative}*{margin:0}.field-set{display:flex;flex-direction:column;gap:1rem;width:100%}p{color:var(--gray-80, #6c6e73);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.button-link,.button-link:hover{all:unset}select{appearance:none;height:2.25rem;width:100%}.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,select:hover,textarea:hover{border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #fff)}input:focus,select:focus,textarea:focus{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,select:active,textarea:active{border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa)}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{display:flex;gap:0.5rem;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;font-weight:500;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.secondary{border:1px solid var(--gray-50, #c8c9cc);background:var(--white, #fff);color:var(--gray-90, #5e6066);box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1)}button.secondary:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}button.destructive{border:1px solid var(--red-60, #f04438);background-color:white;color:var(--red-60)}button.destructive:hover{border:1px solid var(--red-70, #d92d20);background:var(--red-10, #fff1f0)}.button-group{display:flex;border-radius:0.5rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6c6e73)}.button-group button:hover{background:var(--gray-10, #f7f8fa)}.button-group>:first-child{border-radius:0.5rem 0 0 0.5rem}.button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}`;
-
-const LsFieldPropertiesImage = /*@__PURE__*/ proxyCustomElement(class LsFieldPropertiesImage extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-    }
-    dataItem;
-    render() {
-        return (h(Host, { key: '19e453913867728f5187e4b6d1abecff0bc6946c' }, h("ls-field-properties-container", { key: '0f1b92cc4bc2866dff8c8c69ce952bf170960530', tabs: ['content', 'placement', 'dimensions'] }, h("div", { key: 'aef6c386771d0127d9ea3124113635f43136c036', class: 'field-set', slot: "content" }, h("ls-field-content", { key: '8cfa4fcc5da1bfe43546c013634c734c4de2416a', dataItem: this.dataItem }), h("ls-field-properties-advanced", { key: '5f2b51764ed736302e402352cb842583eaf59554', dataItem: this.dataItem })), h("div", { key: '3933a4a2e966683573e5bf58f1f95899807f8377', class: 'field-set', slot: "dimensions" }, h("ls-field-dimensions", { key: '829b4b5882ea2ba71b4c3c91e144c2d3474f9358', dataItem: this.dataItem })), h("div", { key: 'e6a4c5345278b69126230edb3fda1cbbed030457', class: 'field-set', slot: "placement" }, h("ls-field-placement", { key: 'c0e93df6cc265c053d16dccd89d05fda907adf2e', dataItem: this.dataItem }))), h("ls-field-footer", { key: '4f17de4e79d781f2aae86073e3b5421304e39fdf', dataItem: this.dataItem })));
-    }
-    static get style() { return lsFieldPropertiesImageCss(); }
-}, [769, "ls-field-properties-image", {
-        "dataItem": [16]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ls-field-properties-image", "ls-editor-field", "ls-field-content", "ls-field-dimensions", "ls-field-footer", "ls-field-placement", "ls-field-properties-advanced", "ls-field-properties-container", "ls-field-type-display", "ls-icon", "ls-input-wrapper", "ls-props-section", "ls-toggle", "ls-tooltip"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ls-field-properties-image":
-            if (!customElements.get(transformTag(tagName))) {
-                customElements.define(transformTag(tagName), LsFieldPropertiesImage);
-            }
-            break;
-        case "ls-editor-field":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$d();
-            }
-            break;
-        case "ls-field-content":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$c();
-            }
-            break;
-        case "ls-field-dimensions":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$b();
-            }
-            break;
-        case "ls-field-footer":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$a();
-            }
-            break;
-        case "ls-field-placement":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$9();
-            }
-            break;
-        case "ls-field-properties-advanced":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$8();
-            }
-            break;
-        case "ls-field-properties-container":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$7();
-            }
-            break;
-        case "ls-field-type-display":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$6();
-            }
-            break;
-        case "ls-icon":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$5();
-            }
-            break;
-        case "ls-input-wrapper":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$4();
-            }
-            break;
-        case "ls-props-section":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$3();
-            }
-            break;
-        case "ls-toggle":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$2();
-            }
-            break;
-        case "ls-tooltip":
-            if (!customElements.get(transformTag(tagName))) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { LsFieldPropertiesImage as L, defineCustomElement as d };
-//# sourceMappingURL=p-DET7mO8t.js.map
-
-//# sourceMappingURL=p-DET7mO8t.js.map