legalesign-document-viewer 0.10.2 → 0.10.4

package/dist/components/p-CMop5vLm.js

@@ -0,0 +1,150 @@
+import { t as transformTag, p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-DffaAVW4.js';
+import { d as defaultRolePalette } from './p-BKrsDBDB.js';
+import { d as dvI18n } from './p-Bp8hmhrC.js';
+import { d as defineCustomElement$2 } from './p-BT5rCW3w.js';
+import { d as defineCustomElement$1 } from './p-84KTjgkl.js';
+
+const lsValidationTagCss = () => `:host{position:relative}*{box-sizing:border-box;margin:0}.ls-dv-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}.ls-dv-valid-label-wrapper{display:flex;padding:0.25rem;border-radius:0.5rem;border:1px solid var(--gray-20, #edeff2);justify-content:center;align-items:center;border-radius:0.825rem;font-size:0.75rem;font-style:normal;font-weight:500;line-height:1.25rem;width:fit-content;gap:0.25rem}.ls-dv-valid-label-wrapper:hover{background:var(--gray-10, #f7f8fa);border:1px solid var(--gray-30, #e0e2e5)}.ls-dv-valid-label-icon-only{display:flex;padding:0.25rem;justify-content:center;align-items:center;border-radius:0.625rem}.ls-dv-valid{background-color:var(--green-30, #9df5d4);color:var(--green-100, #125241)}.ls-dv-valid.ls-dv-compose{border:1px solid var(--green-50, #57e5b1)}.ls-dv-valid.ls-dv-compose:hover{box-shadow:none}.ls-dv-invalid.ls-dv-default{background:var(--yellow-20, #fff3c2);color:var(--yellow-90, #8a3f0e)}.ls-dv-invalid.ls-dv-compose{border:1px solid var(--red-40, #ffa19e);background:var(--red-10, #fff0f0);color:var(--red-80, #c1140e)}.ls-dv-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}.ls-field-counter-floating{position:absolute;top:-0.125rem;right:-0.125rem}.ls-dv-field-counter.ls-dv-compose{color:var(--red-10, #fff0f0);background:var(--red-60, #f64a44)}.ls-dv-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}.ls-dv-field-dropdown.ls-dv-field-dropdown-success{background:linear-gradient(var(--green-10, #effff9) 0%, rgb(255, 255, 255) 100%);width:fit-content;padding:2rem;align-items:center;justify-content:center}.ls-dv-field-dropdown.ls-dv-field-dropdown-success *{text-align:center;white-space:nowrap}.ls-dv-dropdown-success-icon-outer{display:flex;justify-content:center;align-items:center;border-radius:9999px;background:var(--green-20, #c5fde8);padding:0.5rem}.ls-dv-dropdown-success-icon-inner{display:flex;justify-content:center;align-items:center;border-radius:9999px;background:var(--green-40, #72f0c2);padding:0.75rem;color:var(--green-100, #125241)}.ls-dv-field-dropdown.ls-dv-compose{width:14rem;padding:0.75rem;gap:0.5rem}.ls-dv-field-dropdown.ls-dv-compose>*{width:100%}.ls-dv-validation-section{width:100%;display:flex;flex-direction:column;gap:0.5rem}.ls-dv-required-field{position:relative;display:flex;width:100%;justify-content:space-between;align-items:center;gap:0.5rem;border-radius:0.625rem;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;cursor:pointer}.ls-dv-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)}.ls-dv-required-field-items-left{display:flex;gap:0.5rem;align-items:center;width:100%}.ls-dv-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}.ls-dv-dot{height:0.5rem;width:0.5rem;border-radius:50%}.ls-dv-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}.ls-dv-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}.ls-dv-dropdown-header p{color:var(--gray-80, #6f7176);font-size:0.75rem;font-style:normal;font-weight:400;line-height:1rem;}.ls-dv-validation-tag-container{padding:0.75rem;display:flex;flex-direction:column;gap:0.5rem}.ls-dv-validation-tag-header{padding-bottom:0.5rem;border-bottom:1px solid #edeff2}.ls-dv-validation-tag-title{font-family:"IBM Plex Sans Medium", "IBM Plex Sans", sans-serif;font-size:0.875rem;color:#45484d;line-height:1.5rem}.ls-dv-validation-tag-row{display:flex;align-items:center;gap:0.5rem;padding:0.5rem;border-radius:0.625rem;cursor:pointer;transition:background-color 0.2s}.ls-dv-validation-tag-row:hover{background-color:var(--gray-10, #f7f8fa)}.ls-dv-validation-tag-bar{width:0.25rem;height:2rem;border-radius:9999px;flex-shrink:0}.ls-dv-validation-tag-details{flex:1 1 0%;min-width:0}.ls-dv-validation-tag-name{font-family:"IBM Plex Sans Medium", "IBM Plex Sans", sans-serif;font-size:0.875rem;color:#45484d;line-height:1.5rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ls-dv-validation-tag-email{font-family:"IBM Plex Sans Light", "IBM Plex Sans", sans-serif;font-size:0.75rem;color:#5e6066;line-height:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}`;
+
+const LsValidationTag = /*@__PURE__*/ proxyCustomElement(class LsValidationTag extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        this.changeSigner = createEvent(this, "changeSigner", 7);
+        this.selectFieldForPlacement = createEvent(this, "selectFieldForPlacement", 7);
+        this.selectFields = createEvent(this, "selectFields", 7);
+    }
+    status = 'Invalid';
+    validationErrors = [];
+    isExpanded = false;
+    type = 'default';
+    showDropDown = true;
+    changeSigner;
+    selectFieldForPlacement;
+    selectFields;
+    handleClickOutside = (event) => {
+        const path = event.composedPath();
+        if (path.includes(this.el))
+            return;
+        if (this.isExpanded) {
+            this.isExpanded = false;
+        }
+    };
+    el;
+    componentDidLoad() {
+        this.el = this.host || this.el || this.component;
+        document.addEventListener('mousedown', this.handleClickOutside);
+    }
+    disconnectedCallback() {
+        document.removeEventListener('mousedown', this.handleClickOutside);
+    }
+    render() {
+        return (h(Host, { key: '0a288719fe0c4633f25add33194bb00600c3a184', ref: el => (this.el = el) }, this.type === 'compose' ? (h("div", { class: `ls-dv-valid-label ls-dv-compose ${this.validationErrors.length === 0 ? 'ls-dv-valid' : 'ls-dv-invalid'}`, onClick: this.validationErrors.length && (() => (this.isExpanded = !this.isExpanded)) }, this.validationErrors.length > 0 && h("div", { class: "ls-dv-field-counter ls-dv-compose" }, this.validationErrors.length), this.validationErrors.length === 0 ? dvI18n.t('common.ready') : dvI18n.t('common.required'), this.validationErrors.length > 0 && h("ls-icon", { name: "cursor-click-icon", solid: true, size: 16, customStyle: { color: 'var(--red-70, #DC2721);' } }), this.validationErrors.length === 0 && h("ls-icon", { name: "check-icon", solid: true, size: 16, customStyle: { marginRight: '-0.125rem' } }))) : (h("div", { class: `ls-dv-valid-label-wrapper`, onClick: () => (this.isExpanded = !this.isExpanded) }, h("div", { class: `ls-dv-valid-label-icon-only ls-dv-default ${this.validationErrors.length === 0 ? 'ls-dv-valid' : 'ls-dv-invalid'}` }, h("ls-icon", { name: this.validationErrors.length > 0 ? 'clipboard-list-icon' : 'check-icon', size: 20 })), this.validationErrors.length > 0 && h("div", { class: "ls-dv-field-counter ls-field-counter-floating ls-dv-default" }, this.validationErrors.length), this.validationErrors.length > 0 && this.showDropDown && (h("ls-icon", { name: this.isExpanded ? 'chevron-up-icon' : 'chevron-down-icon', customStyle: { color: 'var(--gray-70, #4B5563)', marginRight: '0.25rem' } })))), this.isExpanded && this.validationErrors.length !== 0 && this.showDropDown && this.type !== 'compose' && (h("div", { key: '2da705d7b851a26d66c6877602d5488c8bf54ca6', class: 'ls-dv-field-dropdown', style: { top: '3.5rem' } }, (() => {
+            const signatureErrors = this.validationErrors.filter(f => f?.role && !f?.element);
+            const elementErrors = this.validationErrors.filter(f => f?.element);
+            return [
+                signatureErrors.length > 0 && (h("div", { class: "ls-dv-validation-section" }, h("div", { class: 'ls-dv-dropdown-header' }, h("h2", null, dvI18n.t('common.fieldsrequired')), h("p", null, signatureErrors.length, " ", signatureErrors.length === 1 ? dvI18n.t('validation.recipientneedsignature') : dvI18n.t('validation.recipientsneedsignatures'))), signatureErrors.map((field, idx) => {
+                    const signerIndex = field?.role?.signerIndex ? field?.role?.signerIndex % 100 : null;
+                    const pallette = defaultRolePalette[signerIndex || 0];
+                    return (h("div", { key: `sig-${idx}`, class: 'ls-dv-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,
+                        }, onMouseDown: e => {
+                            e.preventDefault();
+                            e.stopPropagation();
+                            const fieldType = field?.element?.formElementType || 'signature';
+                            this.selectFieldForPlacement.emit({
+                                signerIndex: field.role.signerIndex,
+                                fieldType: fieldType,
+                            });
+                            this.isExpanded = false;
+                        } }, h("div", { class: 'ls-dv-required-field-items-left' }, h("div", { class: 'ls-dv-dot', style: { background: pallette.s60 } }), h("div", { class: 'ls-dv-required-field-items-left' }, h("p", { style: { color: pallette.s80 } }, field.role?.name || `Signer ${field?.role?.signerIndex + 1}`), h("ls-label", { text: field.role?.roleType ? dvI18n.t(`participants.${field.role.roleType.toLowerCase()}`) : `Signer ${field.role?.signerIndex + 1}`, colour: pallette.description, type: "low", size: "sm" })))));
+                }))),
+                elementErrors.length > 0 && (h("div", { class: "ls-dv-validation-section" }, h("div", { class: 'ls-dv-dropdown-header' }, h("h2", null, dvI18n.t('validation.optionsrequired')), h("p", null, elementErrors.length, " ", elementErrors.length === 1 ? dvI18n.t('validation.fieldneedsoptions') : dvI18n.t('validation.fieldsneedoptions'))), elementErrors.map((field, idx) => {
+                    const signerIndex = field?.element?.signer ? field?.element?.signer % 100 : 0;
+                    const pallette = defaultRolePalette[signerIndex];
+                    return (h("div", { key: `el-${idx}`, class: 'ls-dv-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,
+                        }, onMouseDown: e => {
+                            e.preventDefault();
+                            e.stopPropagation();
+                            this.selectFields.emit([field.element]);
+                            this.isExpanded = false;
+                        } }, h("div", { class: 'ls-dv-required-field-items-left' }, h("div", { class: 'ls-dv-dot', style: { background: pallette.s60 } }), h("div", { class: 'ls-dv-required-field-items-left' }, h("p", { style: { color: pallette.s80 } }, field.title), h("ls-label", { text: field.description, colour: pallette.description, type: "low", size: "sm" })))));
+                }))),
+            ];
+        })())), this.isExpanded && this.validationErrors.length === 0 && this.type !== 'compose' && this.showDropDown && (h("div", { key: 'bec5c70a45c0a8e48d52b23d6468376347229f3a', class: 'ls-dv-field-dropdown ls-dv-field-dropdown-success', style: { top: '3.5rem' } }, h("div", { key: 'a681ac7256b1b19a00e9fb3b2b595235c104a610', class: "ls-dv-dropdown-success-icon-outer" }, h("div", { key: '059b00d57cb5f42172b3a942001e889e66af6627', class: "ls-dv-dropdown-success-icon-inner" }, h("ls-icon", { key: '4dc815096c6dfb2200cc8700f9ea383953952a01', name: "check-icon", solid: true, size: 28 }))), h("div", { key: '5e644880c37ef41aa1f00263603861084945bd2b', class: 'ls-dv-dropdown-header' }, h("h2", { key: '4d9a95e4310b92d4c69ba560bc420943e5db926b' }, dvI18n.t('common.templatereadytosend')), h("p", { key: 'c5f2d24f36bcc7d934798ef2c612c231e8e90b33' }, dvI18n.t('common.allfieldsplaced'))))), this.isExpanded && this.validationErrors.length !== 0 && this.showDropDown && this.type === 'compose' && (h("div", { key: '3852a720b5d8469d9e24da056798fca55f36715b', class: 'ls-dv-field-dropdown ls-dv-compose' }, (() => {
+            const signatureErrors = this.validationErrors.filter(f => f?.role && !f?.element);
+            const elementErrors = this.validationErrors.filter(f => f?.element);
+            return [
+                signatureErrors.length > 0 && (h("div", { class: "ls-dv-validation-section" }, h("div", { class: "ls-dv-validation-tag-header" }, h("p", { class: "ls-dv-validation-tag-title" }, dvI18n.t('common.fieldsrequired'))), signatureErrors.map((field, idx) => {
+                    const signerIndex = field?.role?.signerIndex ? field?.role?.signerIndex % 100 : null;
+                    const pallette = defaultRolePalette[signerIndex || 0];
+                    return (h("div", { class: "ls-dv-validation-tag-row", key: `sig-${idx}`, onClick: () => {
+                            this.selectFieldForPlacement.emit({
+                                signerIndex: field.role.signerIndex,
+                                fieldType: 'signature',
+                            });
+                            this.isExpanded = false;
+                        } }, h("div", { class: "ls-dv-validation-tag-bar", style: { background: pallette.s60 } }), h("div", { class: "ls-dv-validation-tag-details" }, h("p", { class: "ls-dv-validation-tag-name" }, field?.role?.previousRecipientDecides ? `Recipient ${field?.role?.signerIndex + 1}` : `${field?.role?.firstName} ${field?.role?.lastName}`), h("p", { class: "ls-dv-validation-tag-email" }, field?.role?.previousRecipientDecides ? dvI18n.t('common.detailstobedecided') : field?.role?.email))));
+                }))),
+                elementErrors.length > 0 && (h("div", { class: "ls-dv-validation-section" }, h("div", { class: "ls-dv-validation-tag-header" }, h("p", { class: "ls-dv-validation-tag-title" }, dvI18n.t('validation.optionsrequired'))), elementErrors.map((field, idx) => {
+                    const signerIndex = field?.element?.signer ? field?.element?.signer % 100 : 0;
+                    const pallette = defaultRolePalette[signerIndex];
+                    return (h("div", { class: "ls-dv-validation-tag-row", key: `el-${idx}`, onClick: () => {
+                            this.selectFields.emit([field.element]);
+                            this.isExpanded = false;
+                        } }, h("div", { class: "ls-dv-validation-tag-bar", style: { background: pallette.s60 } }), h("div", { class: "ls-dv-validation-tag-details" }, h("p", { class: "ls-dv-validation-tag-name" }, field.title), h("p", { class: "ls-dv-validation-tag-email" }, field.description))));
+                }))),
+            ];
+        })()))));
+    }
+    static get style() { return lsValidationTagCss(); }
+}, [769, "ls-validation-tag", {
+        "status": [1025],
+        "validationErrors": [1040],
+        "isExpanded": [1028, "is-expanded"],
+        "type": [1],
+        "showDropDown": [4, "show-drop-down"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ls-validation-tag", "ls-icon", "ls-label"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ls-validation-tag":
+            if (!customElements.get(transformTag(tagName))) {
+                customElements.define(transformTag(tagName), LsValidationTag);
+            }
+            break;
+        case "ls-icon":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$2();
+            }
+            break;
+        case "ls-label":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+defineCustomElement();
+
+export { LsValidationTag as L, defineCustomElement as d };
+//# sourceMappingURL=p-CMop5vLm.js.map
+
+//# sourceMappingURL=p-CMop5vLm.js.map

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

@@ -0,0 +1 @@
+{"file":"p-CMop5vLm.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-validation-tag/ls-validation-tag.scss?tag=ls-validation-tag&encapsulation=shadow","src/components/ls-validation-tag/ls-validation-tag.tsx"],"sourcesContent":[":host {\n  position: relative;\n}\n\n* {\n  box-sizing: border-box;\n  margin: 0;\n}\n\n.ls-dv-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.ls-dv-valid-label-wrapper {\n  display: flex;\n  padding: 0.25rem;\n  border-radius: 0.5rem;\n  border: 1px solid $gray-20;\n  justify-content: center;\n  align-items: center;\n  border-radius: 0.825rem;\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  gap: 0.25rem;\n\n  &:hover {\n    background: $gray-10;\n    border: 1px solid $gray-30;\n  }\n}\n\n.ls-dv-valid-label-icon-only {\n  display: flex;\n  padding: 0.25rem;\n  justify-content: center;\n  align-items: center;\n  border-radius: 0.625rem;\n}\n\n.ls-dv-valid {\n  background-color: $green-30;\n  color: $green-100;\n}\n\n.ls-dv-valid.ls-dv-compose {\n  border: 1px solid $green-50;\n}\n\n.ls-dv-valid.ls-dv-compose:hover {\n  box-shadow: none;\n}\n\n.ls-dv-invalid.ls-dv-default {\n  background: $yellow-20;\n  color: $yellow-90;\n}\n\n.ls-dv-invalid.ls-dv-compose {\n  border: 1px solid $red-40;\n  background: $red-10;\n  color: $red-80;\n}\n\n.ls-dv-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: $yellow-20;\n  background: #e17100;\n  min-width: 1rem;\n}\n\n.ls-field-counter-floating {\n  position: absolute;\n  top: -0.125rem;\n  right: -0.125rem;\n}\n\n.ls-dv-field-counter.ls-dv-compose {\n  color: $red-10;\n  background: $red-60;\n}\n\n.ls-dv-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:\n    0 20px 25px -5px rgba(0, 0, 0, 0.1),\n    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.ls-dv-field-dropdown.ls-dv-field-dropdown-success {\n  background: linear-gradient($green-10 0%, rgba(255, 255, 255, 1) 100%);\n  width: fit-content;\n  padding: 2rem;\n  align-items: center;\n  justify-content: center;\n\n  * {\n    text-align: center;\n    white-space: nowrap;\n  }\n}\n\n.ls-dv-dropdown-success-icon-outer {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 9999px;\n  background: $green-20;\n  padding: 0.5rem;\n}\n\n.ls-dv-dropdown-success-icon-inner {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 9999px;\n  background: $green-40;\n  padding: 0.75rem;\n  color: $green-100;\n}\n\n.ls-dv-field-dropdown.ls-dv-compose {\n  width: 14rem;\n  padding: 0.75rem;\n  gap: 0.5rem;\n}\n\n.ls-dv-field-dropdown.ls-dv-compose > * {\n  width: 100%;\n}\n\n.ls-dv-validation-section {\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n.ls-dv-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.625rem;\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  cursor: pointer;\n}\n\n.ls-dv-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:\n    0 10px 15px -3px rgba(0, 0, 0, 0.1),\n    0 4px 6px -2px rgba(0, 0, 0, 0.05);\n}\n\n.ls-dv-required-field-items-left {\n  display: flex;\n  gap: 0.5rem;\n  align-items: center;\n  width: 100%;\n}\n\n.ls-dv-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.ls-dv-dot {\n  height: 0.5rem;\n  width: 0.5rem;\n  border-radius: 50%;\n}\n\n.ls-dv-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.ls-dv-dropdown-header h2 {\n  color: $gray-100;\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.ls-dv-dropdown-header p {\n  color: $gray-80;\n  font-size: 0.75rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1rem; /* 133.333% */\n}\n\n.ls-dv-validation-tag-container {\n  padding: 0.75rem;\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n\n.ls-dv-validation-tag-header {\n  padding-bottom: 0.5rem;\n  border-bottom: 1px solid #edeff2;\n}\n\n.ls-dv-validation-tag-title {\n  font-family: 'IBM Plex Sans Medium', 'IBM Plex Sans', sans-serif;\n  font-size: 0.875rem;\n  color: #45484d;\n  line-height: 1.5rem;\n}\n\n.ls-dv-validation-tag-row {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  padding: 0.5rem;\n  border-radius: 0.625rem;\n  cursor: pointer;\n  transition: background-color 0.2s;\n}\n\n.ls-dv-validation-tag-row:hover {\n  background-color: $gray-10;\n}\n\n.ls-dv-validation-tag-bar {\n  width: 0.25rem;\n  height: 2rem;\n  border-radius: 9999px;\n  flex-shrink: 0;\n}\n\n.ls-dv-validation-tag-details {\n  flex: 1 1 0%;\n  min-width: 0;\n}\n\n.ls-dv-validation-tag-name {\n  font-family: 'IBM Plex Sans Medium', 'IBM Plex Sans', sans-serif;\n  font-size: 0.875rem;\n  color: #45484d;\n  line-height: 1.5rem;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.ls-dv-validation-tag-email {\n  font-family: 'IBM Plex Sans Light', 'IBM Plex Sans', sans-serif;\n  font-size: 0.75rem;\n  color: #5e6066;\n  line-height: 1rem;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n","import { Component, Host, Prop, h, Event, EventEmitter } from '@stencil/core';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\nimport { ValidationError } from '../../types/ValidationError';\nimport { LSApiElement } from '../../types/LSApiElement';\nimport { dvI18n } from '../../i18n/i18n';\n\n@Component({\n  tag: 'ls-validation-tag',\n  styleUrl: 'ls-validation-tag.scss',\n  shadow: true,\n})\nexport class LsValidationTag {\n  @Prop({ mutable: true }) status: string = 'Invalid';\n  @Prop({ mutable: true }) validationErrors: ValidationError[] = [];\n  @Prop({ mutable: true }) isExpanded: boolean = false;\n  @Prop() type: 'compose' | 'default' = 'default';\n  @Prop() showDropDown: boolean = true;\n\n  @Event() changeSigner: EventEmitter<number>;\n  @Event() selectFieldForPlacement: EventEmitter<{ signerIndex: number; fieldType: string }>;\n  @Event({ bubbles: true, composed: true }) selectFields: EventEmitter<LSApiElement[]>;\n\n  private handleClickOutside = (event: MouseEvent) => {\n    const path = event.composedPath();\n    if (path.includes(this.el)) return;\n    if (this.isExpanded) {\n      this.isExpanded = false;\n    }\n  };\n\n  private el: HTMLElement;\n\n  componentDidLoad() {\n    this.el = (this as any).host || (this as any).el || (this as any).component;\n    document.addEventListener('mousedown', this.handleClickOutside);\n  }\n\n  disconnectedCallback() {\n    document.removeEventListener('mousedown', this.handleClickOutside);\n  }\n\n  render() {\n    return (\n      <Host ref={el => (this.el = el as HTMLElement)}>\n        {this.type === 'compose' ? (\n          <div\n            class={`ls-dv-valid-label ls-dv-compose ${this.validationErrors.length === 0 ? 'ls-dv-valid' : 'ls-dv-invalid'}`}\n            onClick={this.validationErrors.length && (() => (this.isExpanded = !this.isExpanded))}\n          >\n            {this.validationErrors.length > 0 && <div class=\"ls-dv-field-counter ls-dv-compose\">{this.validationErrors.length}</div>}\n            {this.validationErrors.length === 0 ? dvI18n.t('common.ready') : dvI18n.t('common.required')}\n            {this.validationErrors.length > 0 && <ls-icon name=\"cursor-click-icon\" solid size={16} customStyle={{ color: 'var(--red-70, #DC2721);' }} />}\n            {this.validationErrors.length === 0 && <ls-icon name=\"check-icon\" solid size={16} customStyle={{ marginRight: '-0.125rem' }} />}\n          </div>\n        ) : (\n          <div class={`ls-dv-valid-label-wrapper`} onClick={() => (this.isExpanded = !this.isExpanded)}>\n            <div class={`ls-dv-valid-label-icon-only ls-dv-default ${this.validationErrors.length === 0 ? 'ls-dv-valid' : 'ls-dv-invalid'}`}>\n              <ls-icon name={this.validationErrors.length > 0 ? 'clipboard-list-icon' : 'check-icon'} size={20} />\n            </div>\n            {this.validationErrors.length > 0 && <div class=\"ls-dv-field-counter ls-field-counter-floating ls-dv-default\">{this.validationErrors.length}</div>}\n            {this.validationErrors.length > 0 && this.showDropDown && (\n              <ls-icon name={this.isExpanded ? 'chevron-up-icon' : 'chevron-down-icon'} customStyle={{ color: 'var(--gray-70, #4B5563)', marginRight: '0.25rem' }} />\n            )}\n          </div>\n        )}\n        {this.isExpanded && this.validationErrors.length !== 0 && this.showDropDown && this.type !== 'compose' && (\n          <div class={'ls-dv-field-dropdown'} style={{ top: '3.5rem' }}>\n            {(() => {\n              const signatureErrors = this.validationErrors.filter(f => f?.role && !f?.element);\n              const elementErrors = this.validationErrors.filter(f => f?.element);\n              return [\n                signatureErrors.length > 0 && (\n                  <div class=\"ls-dv-validation-section\">\n                    <div class={'ls-dv-dropdown-header'}>\n                      <h2>{dvI18n.t('common.fieldsrequired')}</h2>\n                      <p>\n                        {signatureErrors.length} {signatureErrors.length === 1 ? dvI18n.t('validation.recipientneedsignature') : dvI18n.t('validation.recipientsneedsignatures')}\n                      </p>\n                    </div>\n                    {signatureErrors.map((field, idx) => {\n                      const signerIndex = field?.role?.signerIndex ? field?.role?.signerIndex % 100 : null;\n                      const pallette = defaultRolePalette[signerIndex || 0];\n                      return (\n                        <div\n                          key={`sig-${idx}`}\n                          class={'ls-dv-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                          onMouseDown={e => {\n                            e.preventDefault();\n                            e.stopPropagation();\n                            const fieldType = field?.element?.formElementType || 'signature';\n                            this.selectFieldForPlacement.emit({\n                              signerIndex: field.role.signerIndex,\n                              fieldType: fieldType,\n                            });\n                            this.isExpanded = false;\n                          }}\n                        >\n                          <div class={'ls-dv-required-field-items-left'}>\n                            <div class={'ls-dv-dot'} style={{ background: pallette.s60 }} />\n                            <div class={'ls-dv-required-field-items-left'}>\n                              <p style={{ color: pallette.s80 }}>{field.role?.name || `Signer ${field?.role?.signerIndex + 1}`}</p>\n                              <ls-label\n                                text={field.role?.roleType ? dvI18n.t(`participants.${field.role.roleType.toLowerCase()}`) : `Signer ${field.role?.signerIndex + 1}`}\n                                colour={pallette.description as any}\n                                type=\"low\"\n                                size=\"sm\"\n                              />\n                            </div>\n                          </div>\n                        </div>\n                      );\n                    })}\n                  </div>\n                ),\n                elementErrors.length > 0 && (\n                  <div class=\"ls-dv-validation-section\">\n                    <div class={'ls-dv-dropdown-header'}>\n                      <h2>{dvI18n.t('validation.optionsrequired')}</h2>\n                      <p>\n                        {elementErrors.length} {elementErrors.length === 1 ? dvI18n.t('validation.fieldneedsoptions') : dvI18n.t('validation.fieldsneedoptions')}\n                      </p>\n                    </div>\n                    {elementErrors.map((field, idx) => {\n                      const signerIndex = field?.element?.signer ? field?.element?.signer % 100 : 0;\n                      const pallette = defaultRolePalette[signerIndex];\n                      return (\n                        <div\n                          key={`el-${idx}`}\n                          class={'ls-dv-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                          onMouseDown={e => {\n                            e.preventDefault();\n                            e.stopPropagation();\n                            this.selectFields.emit([field.element]);\n                            this.isExpanded = false;\n                          }}\n                        >\n                          <div class={'ls-dv-required-field-items-left'}>\n                            <div class={'ls-dv-dot'} style={{ background: pallette.s60 }} />\n                            <div class={'ls-dv-required-field-items-left'}>\n                              <p style={{ color: pallette.s80 }}>{field.title}</p>\n                              <ls-label text={field.description} colour={pallette.description as any} type=\"low\" size=\"sm\" />\n                            </div>\n                          </div>\n                        </div>\n                      );\n                    })}\n                  </div>\n                ),\n              ];\n            })()}\n          </div>\n        )}\n        {this.isExpanded && this.validationErrors.length === 0 && this.type !== 'compose' && this.showDropDown && (\n          <div class={'ls-dv-field-dropdown ls-dv-field-dropdown-success'} style={{ top: '3.5rem' }}>\n            <div class=\"ls-dv-dropdown-success-icon-outer\">\n              <div class=\"ls-dv-dropdown-success-icon-inner\">\n                <ls-icon name=\"check-icon\" solid size={28} />\n              </div>\n            </div>\n            <div class={'ls-dv-dropdown-header'}>\n              <h2>{dvI18n.t('common.templatereadytosend')}</h2>\n              <p>{dvI18n.t('common.allfieldsplaced')}</p>\n            </div>\n          </div>\n        )}\n        {this.isExpanded && this.validationErrors.length !== 0 && this.showDropDown && this.type === 'compose' && (\n          <div class={'ls-dv-field-dropdown ls-dv-compose'}>\n            {(() => {\n              const signatureErrors = this.validationErrors.filter(f => f?.role && !f?.element);\n              const elementErrors = this.validationErrors.filter(f => f?.element);\n              return [\n                signatureErrors.length > 0 && (\n                  <div class=\"ls-dv-validation-section\">\n                    <div class=\"ls-dv-validation-tag-header\">\n                      <p class=\"ls-dv-validation-tag-title\">{dvI18n.t('common.fieldsrequired')}</p>\n                    </div>\n                    {signatureErrors.map((field, idx) => {\n                      const signerIndex = field?.role?.signerIndex ? field?.role?.signerIndex % 100 : null;\n                      const pallette = defaultRolePalette[signerIndex || 0];\n                      return (\n                        <div\n                          class=\"ls-dv-validation-tag-row\"\n                          key={`sig-${idx}`}\n                          onClick={() => {\n                            this.selectFieldForPlacement.emit({\n                              signerIndex: field.role.signerIndex,\n                              fieldType: 'signature',\n                            });\n                            this.isExpanded = false;\n                          }}\n                        >\n                          <div class=\"ls-dv-validation-tag-bar\" style={{ background: pallette.s60 }}></div>\n                          <div class=\"ls-dv-validation-tag-details\">\n                            <p class=\"ls-dv-validation-tag-name\">\n                              {field?.role?.previousRecipientDecides ? `Recipient ${field?.role?.signerIndex + 1}` : `${field?.role?.firstName} ${field?.role?.lastName}`}\n                            </p>\n                            <p class=\"ls-dv-validation-tag-email\">{field?.role?.previousRecipientDecides ? dvI18n.t('common.detailstobedecided') : field?.role?.email}</p>\n                          </div>\n                        </div>\n                      );\n                    })}\n                  </div>\n                ),\n                elementErrors.length > 0 && (\n                  <div class=\"ls-dv-validation-section\">\n                    <div class=\"ls-dv-validation-tag-header\">\n                      <p class=\"ls-dv-validation-tag-title\">{dvI18n.t('validation.optionsrequired')}</p>\n                    </div>\n                    {elementErrors.map((field, idx) => {\n                      const signerIndex = field?.element?.signer ? field?.element?.signer % 100 : 0;\n                      const pallette = defaultRolePalette[signerIndex];\n                      return (\n                        <div\n                          class=\"ls-dv-validation-tag-row\"\n                          key={`el-${idx}`}\n                          onClick={() => {\n                            this.selectFields.emit([field.element]);\n                            this.isExpanded = false;\n                          }}\n                        >\n                          <div class=\"ls-dv-validation-tag-bar\" style={{ background: pallette.s60 }}></div>\n                          <div class=\"ls-dv-validation-tag-details\">\n                            <p class=\"ls-dv-validation-tag-name\">{field.title}</p>\n                            <p class=\"ls-dv-validation-tag-email\">{field.description}</p>\n                          </div>\n                        </div>\n                      );\n                    })}\n                  </div>\n                ),\n              ];\n            })()}\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-Cm69fGZy.js → p-COX6-Qb4.js}

@@ -1,10 +1,10 @@
-import { t as transformTag, p as proxyCustomElement, H, h, c as Host } from './p-CLbfAJ0X.js';
-import { d as defineCustomElement$6 } from './p-C0RAZYKW.js';
-import { d as defineCustomElement$5 } from './p-CyQvboOz.js';
-import { d as defineCustomElement$4 } from './p-Ci6AP0jT.js';
-import { d as defineCustomElement$3 } from './p-CB9tEjJy.js';
-import { d as defineCustomElement$2 } from './p-B9uklVCX.js';
-import { d as defineCustomElement$1 } from './p-BsreOXdY.js';
+import { t as transformTag, p as proxyCustomElement, H, h, c as Host } from './p-DffaAVW4.js';
+import { d as defineCustomElement$6 } from './p-rE7Q2Ue3.js';
+import { d as defineCustomElement$5 } from './p-CQx0j-F_.js';
+import { d as defineCustomElement$4 } from './p-B4nern9h.js';
+import { d as defineCustomElement$3 } from './p-BT5rCW3w.js';
+import { d as defineCustomElement$2 } from './p-CbaxmrLQ.js';
+import { d as defineCustomElement$1 } from './p-DZP-fvPJ.js';
 
 const lsFieldPropertiesAutosignCss = () => `:host{display:block}p{color:var(--gray-80, #6f7176);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)}.ls-dv-button-link,.ls-dv-button-link:hover{all:unset}select{appearance:none;height:2.25rem}.ls-dv-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, #6f7176)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6f7176)}.ls-dv-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.625rem;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, #ffffff)}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, #ffffff)}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].ls-dv-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].ls-dv-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].ls-dv-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}.ls-dv-checkbox-container{display:flex;gap:0.5rem;width:100%}.ls-dv-checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.ls-dv-form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.ls-dv-form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.ls-dv-loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #4456f6)}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.ls-dv-tertiary-grey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #6f7176)}button.ls-dv-tertiary-grey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.ls-dv-button-group{display:flex;border-radius:0.625rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.ls-dv-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, #6f7176)}.ls-dv-button-group button:hover{background:var(--gray-10, #f7f8fa)}.ls-dv-button-group>:first-child{border-radius:0.625rem 0 0 0.625rem}.ls-dv-button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.ls-dv-button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}`;
 
@@ -19,7 +19,7 @@ const LsFieldPropertiesAutosign = /*@__PURE__*/ proxyCustomElement(class LsField
     dataItem;
     readonly = false;
     render() {
-        return (h(Host, { key: 'c39568edf65ebc0c4c69a496f8b6fe616e981fa8' }, h("div", { key: 'faa85c8c4e302ea39aabf291efd698200b24bbd6', class: "ls-dv-field-properties-section" }, "Self Sign Field"), h("div", { key: '679dfc8734eb1d576b98cd65e7856968da7b2d56' }, "Label: ", h("input", { key: '12ca369c7a67cf3deab78f4200d5d96272aa9c3a', value: this.dataItem?.label, width: "30" })), h("ls-field-dimensions", { key: 'a6bb8fa83af8cdc3cf8f290d281f0c86c018b6f3', dataItem: this.dataItem, readonly: this.readonly }), h("ls-field-properties-advanced", { key: 'db629b693c78b1761187de035f5077558fcfbc12', dataItem: this.dataItem, readonly: this.readonly }), h("ls-field-footer", { key: 'e65c9141e98f54121892747dfe79135530bb5705', dataItem: this.dataItem, readonly: this.readonly }), h("slot", { key: '476b0e51a3b23d7903f62acc1a7a16a9d5585aab' })));
+        return (h(Host, { key: '796d793a5890e9c1ba9a1ab8ead252129a2d6567' }, h("div", { key: '4b4e6361dfba1c768e87d4eed987e86ad81f9046', class: "ls-dv-field-properties-section" }, "Self Sign Field"), h("div", { key: '6a239ae5e86d40da6af79b9bedcbda082fe0b8e3' }, "Label: ", h("input", { key: '320f6751bbf1c10cd29f147bcbe974f233a5a538', value: this.dataItem?.label, width: "30" })), h("ls-field-dimensions", { key: 'a3ac441f17dcfa1f57aa7d7014153289495f4406', dataItem: this.dataItem, readonly: this.readonly }), h("ls-field-properties-advanced", { key: 'fa3573d8ff9ba637fa5dd658dd2b2b5cf7eb392b', dataItem: this.dataItem, readonly: this.readonly }), h("ls-field-footer", { key: 'd33377ecafc922d8d115c539e557fd39b0c75804', dataItem: this.dataItem, readonly: this.readonly }), h("slot", { key: 'fb402b881e4089672c6fcdfb5db64db8b4c5e73d' })));
     }
     static get style() { return lsFieldPropertiesAutosignCss(); }
 }, [769, "ls-field-properties-autosign", {
@@ -72,6 +72,6 @@ function defineCustomElement() {
 defineCustomElement();
 
 export { LsFieldPropertiesAutosign as L, defineCustomElement as d };
-//# sourceMappingURL=p-Cm69fGZy.js.map
+//# sourceMappingURL=p-COX6-Qb4.js.map
 
-//# sourceMappingURL=p-Cm69fGZy.js.map
+//# sourceMappingURL=p-COX6-Qb4.js.map

package/dist/components/{p-Cm69fGZy.js.map → p-COX6-Qb4.js.map}

@@ -1 +1 @@
-{"file":"p-Cm69fGZy.js","mappings":";;;;;;;;AAAA,MAAM,4BAA4B,GAAG,MAAM,CAAC,88IAA88I,CAAC;;MCQ9+I,yBAAyB,iBAAAA,kBAAA,CAAA,MAAA,yBAAA,SAAAC,CAAA,CAAA;;;;;;;;AAC5B,IAAA,QAAQ;IACR,QAAQ,GAAY,KAAK;IAEhC,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,gCAAgC,EAAuB,EAAA,iBAAA,CAAA,EACnE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,aAAY,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAC,IAAI,EAAA,CAAE,CAAM,EAClE,CAAqB,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,EACzE,CAA8B,CAAA,8BAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,EAEjF,CAAiB,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,EACtE,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-properties-autosign/ls-field-properties-autosign.scss?tag=ls-field-properties-autosign&encapsulation=shadow","src/components/ls-field-properties-autosign/ls-field-properties-autosign.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n/* Global Styles */\n\np {\n  color: $gray-80;\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: $primary-60;\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: $primary-70;\n}\n\n.ls-dv-button-link,\n.ls-dv-button-link:hover {\n  all: unset;\n}\n\nselect {\n  appearance: none;\n  height: 2.25rem;\n}\n\n.ls-dv-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: $gray-80;\n}\n\n#selectLeadingIcon {\n  position: absolute;\n  top: 50%;\n  left: 0.675rem;\n  transform: translateY(-50%);\n  pointer-events: none;\n  color: $gray-80;\n}\n\n.ls-dv-has-leading-icon {\n  padding-left: 2.5rem;\n}\n\ninput,\nselect,\ntextarea {\n  border: 1px solid $gray-40;\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.625rem;\n  color: $gray-100;\n  font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n  color: $gray-60;\n}\n\ninput:hover,\nselect:hover,\ntextarea:hover {\n  border-color: $gray-50;\n  background-color: $white;\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n  outline: none;\n  box-shadow: 0 0 0 0.25rem $primary-40;\n  border-color: $primary-60;\n  background-color: $white;\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n  border-color: $primary-50;\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n  cursor: not-allowed;\n  background-color: $gray-10;\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'].ls-dv-indeterminate {\n  background-color: $primary-60;\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'].ls-dv-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'].ls-dv-indeterminate:hover {\n  background-color: $primary-70;\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 $primary-20;\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.ls-dv-checkbox-container {\n  display: flex;\n  gap: 0.5rem;\n  width: 100%;\n}\n\n.ls-dv-checkbox-label {\n  color: $gray-100;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1rem;\n}\n\n.ls-dv-form-label {\n  color: $gray-100;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.5rem;\n}\n\n.ls-dv-form-field {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n  width: 100%;\n}\n\n.ls-dv-loading-box {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100vh;\n  color: $primary-60;\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: $primary-60;\n  color: white;\n  text-transform: capitalize;\n  min-height: 2.25rem;\n  min-width: 2.25rem;\n}\n\nbutton.ls-dv-tertiary-grey {\n  border: 1px solid $gray-40;\n  background-color: white;\n  color: $gray-80;\n}\n\nbutton.ls-dv-tertiary-grey:hover {\n  border: 1px solid $gray-50;\n  background: $gray-10;\n}\n\n.ls-dv-button-group {\n  display: flex;\n  border-radius: 0.625rem;\n  border: 1px solid $gray-30;\n  background: $white;\n  overflow: clip;\n}\n\n.ls-dv-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: $gray-80;\n}\n\n.ls-dv-button-group button:hover {\n  background: $gray-10;\n}\n\n.ls-dv-button-group > :first-child {\n  border-radius: 0.625rem 0 0 0.625rem;\n}\n\n.ls-dv-button-group > :last-child {\n  border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.ls-dv-button-group > :not(:first-child) {\n  border-left: 1px solid $gray-30;\n}\n\n\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { LSApiElement } from '../../components';\n\n@Component({\n  tag: 'ls-field-properties-autosign',\n  styleUrl: 'ls-field-properties-autosign.scss',\n  shadow: true,\n})\nexport class LsFieldPropertiesAutosign {\n  @Prop() dataItem: LSApiElement;\n  @Prop() readonly: boolean = false;\n \n   render() {\n     return (\n       <Host>\n         <div class={\"ls-dv-field-properties-section\"}>Self Sign Field</div>\n         <div>Label: <input value={this.dataItem?.label} width=\"30\"/></div>\n         <ls-field-dimensions dataItem={this.dataItem} readonly={this.readonly} />\n         <ls-field-properties-advanced dataItem={this.dataItem} readonly={this.readonly} />\n\n          <ls-field-footer dataItem={this.dataItem} readonly={this.readonly} />\n         <slot></slot>\n       </Host>\n     );\n   }\n}\n"],"version":3}
+{"file":"p-COX6-Qb4.js","mappings":";;;;;;;;AAAA,MAAM,4BAA4B,GAAG,MAAM,CAAC,88IAA88I,CAAC;;MCQ9+I,yBAAyB,iBAAAA,kBAAA,CAAA,MAAA,yBAAA,SAAAC,CAAA,CAAA;;;;;;;;AAC5B,IAAA,QAAQ;IACR,QAAQ,GAAY,KAAK;IAEhC,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,gCAAgC,EAAuB,EAAA,iBAAA,CAAA,EACnE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,aAAY,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAC,IAAI,EAAA,CAAE,CAAM,EAClE,CAAqB,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,EACzE,CAA8B,CAAA,8BAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,EAEjF,CAAiB,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,EACtE,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-properties-autosign/ls-field-properties-autosign.scss?tag=ls-field-properties-autosign&encapsulation=shadow","src/components/ls-field-properties-autosign/ls-field-properties-autosign.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n/* Global Styles */\n\np {\n  color: $gray-80;\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: $primary-60;\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: $primary-70;\n}\n\n.ls-dv-button-link,\n.ls-dv-button-link:hover {\n  all: unset;\n}\n\nselect {\n  appearance: none;\n  height: 2.25rem;\n}\n\n.ls-dv-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: $gray-80;\n}\n\n#selectLeadingIcon {\n  position: absolute;\n  top: 50%;\n  left: 0.675rem;\n  transform: translateY(-50%);\n  pointer-events: none;\n  color: $gray-80;\n}\n\n.ls-dv-has-leading-icon {\n  padding-left: 2.5rem;\n}\n\ninput,\nselect,\ntextarea {\n  border: 1px solid $gray-40;\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.625rem;\n  color: $gray-100;\n  font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n  color: $gray-60;\n}\n\ninput:hover,\nselect:hover,\ntextarea:hover {\n  border-color: $gray-50;\n  background-color: $white;\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n  outline: none;\n  box-shadow: 0 0 0 0.25rem $primary-40;\n  border-color: $primary-60;\n  background-color: $white;\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n  border-color: $primary-50;\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n  cursor: not-allowed;\n  background-color: $gray-10;\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'].ls-dv-indeterminate {\n  background-color: $primary-60;\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'].ls-dv-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'].ls-dv-indeterminate:hover {\n  background-color: $primary-70;\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 $primary-20;\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.ls-dv-checkbox-container {\n  display: flex;\n  gap: 0.5rem;\n  width: 100%;\n}\n\n.ls-dv-checkbox-label {\n  color: $gray-100;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1rem;\n}\n\n.ls-dv-form-label {\n  color: $gray-100;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.5rem;\n}\n\n.ls-dv-form-field {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n  width: 100%;\n}\n\n.ls-dv-loading-box {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100vh;\n  color: $primary-60;\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: $primary-60;\n  color: white;\n  text-transform: capitalize;\n  min-height: 2.25rem;\n  min-width: 2.25rem;\n}\n\nbutton.ls-dv-tertiary-grey {\n  border: 1px solid $gray-40;\n  background-color: white;\n  color: $gray-80;\n}\n\nbutton.ls-dv-tertiary-grey:hover {\n  border: 1px solid $gray-50;\n  background: $gray-10;\n}\n\n.ls-dv-button-group {\n  display: flex;\n  border-radius: 0.625rem;\n  border: 1px solid $gray-30;\n  background: $white;\n  overflow: clip;\n}\n\n.ls-dv-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: $gray-80;\n}\n\n.ls-dv-button-group button:hover {\n  background: $gray-10;\n}\n\n.ls-dv-button-group > :first-child {\n  border-radius: 0.625rem 0 0 0.625rem;\n}\n\n.ls-dv-button-group > :last-child {\n  border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.ls-dv-button-group > :not(:first-child) {\n  border-left: 1px solid $gray-30;\n}\n\n\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { LSApiElement } from '../../components';\n\n@Component({\n  tag: 'ls-field-properties-autosign',\n  styleUrl: 'ls-field-properties-autosign.scss',\n  shadow: true,\n})\nexport class LsFieldPropertiesAutosign {\n  @Prop() dataItem: LSApiElement;\n  @Prop() readonly: boolean = false;\n \n   render() {\n     return (\n       <Host>\n         <div class={\"ls-dv-field-properties-section\"}>Self Sign Field</div>\n         <div>Label: <input value={this.dataItem?.label} width=\"30\"/></div>\n         <ls-field-dimensions dataItem={this.dataItem} readonly={this.readonly} />\n         <ls-field-properties-advanced dataItem={this.dataItem} readonly={this.readonly} />\n\n          <ls-field-footer dataItem={this.dataItem} readonly={this.readonly} />\n         <slot></slot>\n       </Host>\n     );\n   }\n}\n"],"version":3}

package/dist/components/{p-lImp2h8Q.js → p-COkDTfhY.js}

@@ -1,17 +1,17 @@
-import { t as transformTag, p as proxyCustomElement, H, h, c as Host } from './p-CLbfAJ0X.js';
-import { d as defineCustomElement$d } from './p-MG59mYF3.js';
-import { d as defineCustomElement$c } from './p-DVKeLLVk.js';
-import { d as defineCustomElement$b } from './p-C0RAZYKW.js';
-import { d as defineCustomElement$a } from './p-CyQvboOz.js';
-import { d as defineCustomElement$9 } from './p-CQVcPp7I.js';
-import { d as defineCustomElement$8 } from './p-Ci6AP0jT.js';
-import { d as defineCustomElement$7 } from './p-DRcpbaNd.js';
-import { d as defineCustomElement$6 } from './p-DvzrSyuS.js';
-import { d as defineCustomElement$5 } from './p-CB9tEjJy.js';
-import { d as defineCustomElement$4 } from './p-CyKYlaAh.js';
-import { d as defineCustomElement$3 } from './p-B9uklVCX.js';
-import { d as defineCustomElement$2 } from './p-1dutDvgl.js';
-import { d as defineCustomElement$1 } from './p-BsreOXdY.js';
+import { t as transformTag, p as proxyCustomElement, H, h, c as Host } from './p-DffaAVW4.js';
+import { d as defineCustomElement$d } from './p-C6Wto5hV.js';
+import { d as defineCustomElement$c } from './p-BwJElhYd.js';
+import { d as defineCustomElement$b } from './p-rE7Q2Ue3.js';
+import { d as defineCustomElement$a } from './p-CQx0j-F_.js';
+import { d as defineCustomElement$9 } from './p-Ij6Uu9h8.js';
+import { d as defineCustomElement$8 } from './p-B4nern9h.js';
+import { d as defineCustomElement$7 } from './p-DwKK-L0J.js';
+import { d as defineCustomElement$6 } from './p-BNihuKsl.js';
+import { d as defineCustomElement$5 } from './p-BT5rCW3w.js';
+import { d as defineCustomElement$4 } from './p-CKZG8VvW.js';
+import { d as defineCustomElement$3 } from './p-CbaxmrLQ.js';
+import { d as defineCustomElement$2 } from './p-C7ZEYzas.js';
+import { d as defineCustomElement$1 } from './p-DZP-fvPJ.js';
 
 const lsFieldPropertiesNumberCss = () => `:host{display:flex;flex-direction:column;gap:1rem;width:100%;height:100%;position:relative}*{margin:0}.ls-dv-field-set{display:flex;flex-direction:column;gap:1rem;width:100%}p{color:var(--gray-80, #6f7176);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)}.ls-dv-button-link,.ls-dv-button-link:hover{all:unset}select{appearance:none;height:2.25rem;width:100%}.ls-dv-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.625rem;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, #ffffff)}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, #ffffff)}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].ls-dv-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].ls-dv-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].ls-dv-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}.ls-dv-checkbox-container{display:flex;gap:0.5rem;width:100%}.ls-dv-checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.ls-dv-form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.ls-dv-form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.ls-dv-loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #4456f6)}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.ls-dv-tertiary-grey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #6f7176)}button.ls-dv-tertiary-grey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}button.ls-dv-secondary{border:1px solid var(--gray-50, #c8c9cc);background:var(--white, #ffffff);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.ls-dv-secondary:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}button.ls-dv-destructive{border:1px solid var(--red-60, #f64a44);background-color:white;color:var(--red-60, #f64a44)}button.ls-dv-destructive:hover{border:1px solid var(--red-70, #dc2721);background:var(--red-10, #fff0f0)}.ls-dv-button-group{display:flex;border-radius:0.625rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.ls-dv-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, #6f7176)}.ls-dv-button-group button:hover{background:var(--gray-10, #f7f8fa)}.ls-dv-button-group>:first-child{border-radius:0.625rem 0 0 0.625rem}.ls-dv-button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.ls-dv-button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}`;
 
@@ -26,7 +26,7 @@ const LsFieldPropertiesNumber = /*@__PURE__*/ proxyCustomElement(class LsFieldPr
     dataItem;
     readonly = false;
     render() {
-        return (h(Host, { key: '24614b5d11f2b4f0ea3a78c0da8a68e632fbca39' }, h("ls-field-properties-container", { key: '0dd7722083567393b24ebc33f7be70c2f3b3da2f', tabs: ['content', 'placement', 'dimensions'] }, h("div", { key: '35cfd9644344e859cd78181eb5173af88da245b7', class: 'ls-dv-field-set', slot: "content" }, h("ls-field-content", { key: '924a1a4438deae52686dd58fd99fca3ac155b637', dataItem: this.dataItem, readonly: this.readonly }), h("ls-field-properties-advanced", { key: 'bbb6cafe09b49474d931d413f9c73ed5a21e11e1', dataItem: this.dataItem, readonly: this.readonly })), h("div", { key: 'c00aa795be3bf97629abb3ea5650322918f48d7a', class: 'ls-dv-field-set', slot: "dimensions" }, h("ls-field-dimensions", { key: '3d4d171ae6c4d0883f4d7c6bf1fe2d14faff1a96', dataItem: this.dataItem, readonly: this.readonly })), h("div", { key: '8d100d887e82dcb27fa517f13be58ec603503464', class: 'ls-dv-field-set', slot: "placement" }, h("ls-field-placement", { key: '6c65f56e22a8820537efcd2f7f58adf69ab64e58', dataItem: this.dataItem, readonly: this.readonly }))), h("ls-field-footer", { key: 'b95e2b6829fbc49e563c30c484364f5494923fe1', dataItem: this.dataItem, readonly: this.readonly })));
+        return (h(Host, { key: '5544d8eb23254af289b388dee34d8a592bb7f4b6' }, h("ls-field-properties-container", { key: 'b0d84298e9b5c5812e80114676c3818fc6a084b3', tabs: ['content', 'placement', 'dimensions'] }, h("div", { key: '83aa4a8b80d717a979c7e971b22ac5f7464bb71b', class: 'ls-dv-field-set', slot: "content" }, h("ls-field-content", { key: '8aed8b9920fa2cc940babdf791db98873407470a', dataItem: this.dataItem, readonly: this.readonly }), h("ls-field-properties-advanced", { key: '5319a3c09c2989825f39c7a74866ad7d57aa3f81', dataItem: this.dataItem, readonly: this.readonly })), h("div", { key: '5abbb75f57a91561e928e7fe852ce24510fcdafc', class: 'ls-dv-field-set', slot: "dimensions" }, h("ls-field-dimensions", { key: 'be91cbce65ad4b7383c7b9f5ec9fde98bae4f5c4', dataItem: this.dataItem, readonly: this.readonly })), h("div", { key: '4dbdd4f74ac3c6497dff88ce5bc20d1d47e7d284', class: 'ls-dv-field-set', slot: "placement" }, h("ls-field-placement", { key: '68fdecac847c636ed8e428a1ddcb29f4140f9837', dataItem: this.dataItem, readonly: this.readonly }))), h("ls-field-footer", { key: 'c63e164173ae3be09a68b6d166d3277ad405e443', dataItem: this.dataItem, readonly: this.readonly })));
     }
     static get style() { return lsFieldPropertiesNumberCss(); }
 }, [769, "ls-field-properties-number", {
@@ -114,6 +114,6 @@ function defineCustomElement() {
 defineCustomElement();
 
 export { LsFieldPropertiesNumber as L, defineCustomElement as d };
-//# sourceMappingURL=p-lImp2h8Q.js.map
+//# sourceMappingURL=p-COkDTfhY.js.map
 
-//# sourceMappingURL=p-lImp2h8Q.js.map
+//# sourceMappingURL=p-COkDTfhY.js.map

package/dist/components/{p-lImp2h8Q.js.map → p-COkDTfhY.js.map}

@@ -1 +1 @@
-{"file":"p-lImp2h8Q.js","mappings":";;;;;;;;;;;;;;;AAAA,MAAM,0BAA0B,GAAG,MAAM,CAAC,u2JAAu2J,CAAC;;MCQr4J,uBAAuB,iBAAAA,kBAAA,CAAA,MAAA,uBAAA,SAAAC,CAAA,CAAA;;;;;;;;AAC1B,IAAA,QAAQ;IACR,QAAQ,GAAY,KAAK;IAE7B,MAAM,GAAA;QACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAA+B,CAAA,+BAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,YAAY,CAAC,EAAA,EACzE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,iBAAiB,EAAE,IAAI,EAAC,SAAS,EAAA,EAC3C,CAAkB,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,EACtE,CAAA,CAAA,8BAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAA8B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,CAAI,CAC9E,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,iBAAiB,EAAE,IAAI,EAAC,YAAY,EAAA,EAC9C,CAAA,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAqB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,CAAI,CACrE,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,iBAAiB,EAAE,IAAI,EAAC,WAAW,EAAA,EAC7C,CAAA,CAAA,oBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAoB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,CAAI,CACpE,CACwB,EAChC,CAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAiB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,CAChE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-properties-number/ls-field-properties-number.scss?tag=ls-field-properties-number&encapsulation=shadow","src/components/ls-field-properties-number/ls-field-properties-number.tsx"],"sourcesContent":[":host {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n  width: 100%;\n  height: 100%;\n  position: relative;\n}\n\n* {\n  margin: 0;\n}\n\n.ls-dv-field-set {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n  width: 100%;\n}\n\n/* Global Styles */\n\np {\n  color: $gray-80;\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: $primary-60;\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: $primary-70;\n}\n\n.ls-dv-button-link,\n.ls-dv-button-link:hover {\n  all: unset;\n}\n\nselect {\n  appearance: none;\n  height: 2.25rem;\n  width: 100%;\n}\n.ls-dv-has-leading-icon {\n  padding-left: 2.5rem;\n}\n\n\ninput,\nselect,\ntextarea {\n  border: 1px solid $gray-40;\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.625rem;\n  color: $gray-100;\n  font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n  color: $gray-60;\n}\n\ninput:hover,\nselect:hover,\ntextarea:hover {\n  border-color: $gray-50;\n  background-color: $white;\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n  outline: none;\n  box-shadow: 0 0 0 0.25rem $primary-40;\n  border-color: $primary-60;\n  background-color: $white;\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n  border-color: $primary-50;\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n  cursor: not-allowed;\n  background-color: $gray-10;\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'].ls-dv-indeterminate {\n  background-color: $primary-60;\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'].ls-dv-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'].ls-dv-indeterminate:hover {\n  background-color: $primary-70;\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 $primary-20;\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.ls-dv-checkbox-container {\n  display: flex;\n  gap: 0.5rem;\n  width: 100%;\n}\n\n.ls-dv-checkbox-label {\n  color: $gray-100;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1rem;\n}\n\n.ls-dv-form-label {\n  color: $gray-100;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.5rem;\n}\n\n.ls-dv-form-field {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n  width: 100%;\n}\n\n.ls-dv-loading-box {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100vh;\n  color: $primary-60;\n}\n\nbutton {\n  display: flex;\n  gap: 0.5rem;\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: $primary-60;\n  color: white;\n  font-weight: 500;\n  text-transform: capitalize;\n  min-height: 2.25rem;\n  min-width: 2.25rem;\n}\n\nbutton.ls-dv-tertiary-grey {\n  border: 1px solid $gray-40;\n  background-color: white;\n  color: $gray-80;\n}\n\nbutton.ls-dv-tertiary-grey:hover {\n  border: 1px solid $gray-50;\n  background: $gray-10;\n}\n\nbutton.ls-dv-secondary {\n  border: 1px solid $gray-50;\n  background: $white;\n  color: $gray-90;\n  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n}\n\nbutton.ls-dv-secondary:hover {\n  border: 1px solid $gray-50;\n  background: $gray-10;\n}\n\nbutton.ls-dv-destructive {\n  border: 1px solid $red-60;\n  background-color: white;\n  color: $red-60;\n}\n\nbutton.ls-dv-destructive:hover {\n  border: 1px solid $red-70;\n  background: $red-10;\n}\n\n\n\n.ls-dv-button-group {\n  display: flex;\n  border-radius: 0.625rem;\n  border: 1px solid $gray-30;\n  background: $white;\n  overflow: clip;\n}\n\n.ls-dv-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: $gray-80;\n}\n\n.ls-dv-button-group button:hover {\n  background: $gray-10;\n}\n\n.ls-dv-button-group > :first-child {\n  border-radius: 0.625rem 0 0 0.625rem;\n}\n\n.ls-dv-button-group > :last-child {\n  border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.ls-dv-button-group > :not(:first-child) {\n  border-left: 1px solid $gray-30;\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { LSApiElement } from '../../components';\n\n@Component({\n  tag: 'ls-field-properties-number',\n  styleUrl: 'ls-field-properties-number.scss',\n  shadow: true,\n})\nexport class LsFieldPropertiesNumber {\n  @Prop() dataItem: LSApiElement;\n  @Prop() readonly: boolean = false;\n    \n      render() {\n        return (\n          <Host>\n            <ls-field-properties-container tabs={['content', 'placement', 'dimensions']}>\n              <div class={'ls-dv-field-set'} slot=\"content\">\n                <ls-field-content dataItem={this.dataItem} readonly={this.readonly} />\n                <ls-field-properties-advanced dataItem={this.dataItem} readonly={this.readonly} />\n              </div>\n              <div class={'ls-dv-field-set'} slot=\"dimensions\">\n                <ls-field-dimensions dataItem={this.dataItem} readonly={this.readonly} />\n              </div>\n              <div class={'ls-dv-field-set'} slot=\"placement\">\n                <ls-field-placement dataItem={this.dataItem} readonly={this.readonly} />\n              </div>\n            </ls-field-properties-container>\n            <ls-field-footer dataItem={this.dataItem} readonly={this.readonly} />\n          </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-COkDTfhY.js","mappings":";;;;;;;;;;;;;;;AAAA,MAAM,0BAA0B,GAAG,MAAM,CAAC,u2JAAu2J,CAAC;;MCQr4J,uBAAuB,iBAAAA,kBAAA,CAAA,MAAA,uBAAA,SAAAC,CAAA,CAAA;;;;;;;;AAC1B,IAAA,QAAQ;IACR,QAAQ,GAAY,KAAK;IAE7B,MAAM,GAAA;QACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAA+B,CAAA,+BAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,YAAY,CAAC,EAAA,EACzE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,iBAAiB,EAAE,IAAI,EAAC,SAAS,EAAA,EAC3C,CAAkB,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,EACtE,CAAA,CAAA,8BAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAA8B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,CAAI,CAC9E,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,iBAAiB,EAAE,IAAI,EAAC,YAAY,EAAA,EAC9C,CAAA,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAqB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,CAAI,CACrE,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,iBAAiB,EAAE,IAAI,EAAC,WAAW,EAAA,EAC7C,CAAA,CAAA,oBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAoB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,CAAI,CACpE,CACwB,EAChC,CAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAiB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA,CAChE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-properties-number/ls-field-properties-number.scss?tag=ls-field-properties-number&encapsulation=shadow","src/components/ls-field-properties-number/ls-field-properties-number.tsx"],"sourcesContent":[":host {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n  width: 100%;\n  height: 100%;\n  position: relative;\n}\n\n* {\n  margin: 0;\n}\n\n.ls-dv-field-set {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n  width: 100%;\n}\n\n/* Global Styles */\n\np {\n  color: $gray-80;\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: $primary-60;\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: $primary-70;\n}\n\n.ls-dv-button-link,\n.ls-dv-button-link:hover {\n  all: unset;\n}\n\nselect {\n  appearance: none;\n  height: 2.25rem;\n  width: 100%;\n}\n.ls-dv-has-leading-icon {\n  padding-left: 2.5rem;\n}\n\n\ninput,\nselect,\ntextarea {\n  border: 1px solid $gray-40;\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.625rem;\n  color: $gray-100;\n  font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n  color: $gray-60;\n}\n\ninput:hover,\nselect:hover,\ntextarea:hover {\n  border-color: $gray-50;\n  background-color: $white;\n}\n\ninput:focus,\nselect:focus,\ntextarea:focus {\n  outline: none;\n  box-shadow: 0 0 0 0.25rem $primary-40;\n  border-color: $primary-60;\n  background-color: $white;\n}\n\ninput:active,\nselect:active,\ntextarea:active {\n  border-color: $primary-50;\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n  cursor: not-allowed;\n  background-color: $gray-10;\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'].ls-dv-indeterminate {\n  background-color: $primary-60;\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'].ls-dv-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'].ls-dv-indeterminate:hover {\n  background-color: $primary-70;\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 $primary-20;\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.ls-dv-checkbox-container {\n  display: flex;\n  gap: 0.5rem;\n  width: 100%;\n}\n\n.ls-dv-checkbox-label {\n  color: $gray-100;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1rem;\n}\n\n.ls-dv-form-label {\n  color: $gray-100;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.5rem;\n}\n\n.ls-dv-form-field {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n  width: 100%;\n}\n\n.ls-dv-loading-box {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100vh;\n  color: $primary-60;\n}\n\nbutton {\n  display: flex;\n  gap: 0.5rem;\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: $primary-60;\n  color: white;\n  font-weight: 500;\n  text-transform: capitalize;\n  min-height: 2.25rem;\n  min-width: 2.25rem;\n}\n\nbutton.ls-dv-tertiary-grey {\n  border: 1px solid $gray-40;\n  background-color: white;\n  color: $gray-80;\n}\n\nbutton.ls-dv-tertiary-grey:hover {\n  border: 1px solid $gray-50;\n  background: $gray-10;\n}\n\nbutton.ls-dv-secondary {\n  border: 1px solid $gray-50;\n  background: $white;\n  color: $gray-90;\n  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n}\n\nbutton.ls-dv-secondary:hover {\n  border: 1px solid $gray-50;\n  background: $gray-10;\n}\n\nbutton.ls-dv-destructive {\n  border: 1px solid $red-60;\n  background-color: white;\n  color: $red-60;\n}\n\nbutton.ls-dv-destructive:hover {\n  border: 1px solid $red-70;\n  background: $red-10;\n}\n\n\n\n.ls-dv-button-group {\n  display: flex;\n  border-radius: 0.625rem;\n  border: 1px solid $gray-30;\n  background: $white;\n  overflow: clip;\n}\n\n.ls-dv-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: $gray-80;\n}\n\n.ls-dv-button-group button:hover {\n  background: $gray-10;\n}\n\n.ls-dv-button-group > :first-child {\n  border-radius: 0.625rem 0 0 0.625rem;\n}\n\n.ls-dv-button-group > :last-child {\n  border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.ls-dv-button-group > :not(:first-child) {\n  border-left: 1px solid $gray-30;\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\nimport { LSApiElement } from '../../components';\n\n@Component({\n  tag: 'ls-field-properties-number',\n  styleUrl: 'ls-field-properties-number.scss',\n  shadow: true,\n})\nexport class LsFieldPropertiesNumber {\n  @Prop() dataItem: LSApiElement;\n  @Prop() readonly: boolean = false;\n    \n      render() {\n        return (\n          <Host>\n            <ls-field-properties-container tabs={['content', 'placement', 'dimensions']}>\n              <div class={'ls-dv-field-set'} slot=\"content\">\n                <ls-field-content dataItem={this.dataItem} readonly={this.readonly} />\n                <ls-field-properties-advanced dataItem={this.dataItem} readonly={this.readonly} />\n              </div>\n              <div class={'ls-dv-field-set'} slot=\"dimensions\">\n                <ls-field-dimensions dataItem={this.dataItem} readonly={this.readonly} />\n              </div>\n              <div class={'ls-dv-field-set'} slot=\"placement\">\n                <ls-field-placement dataItem={this.dataItem} readonly={this.readonly} />\n              </div>\n            </ls-field-properties-container>\n            <ls-field-footer dataItem={this.dataItem} readonly={this.readonly} />\n          </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-CyQvboOz.js → p-CQx0j-F_.js}

@@ -1,6 +1,6 @@
-import { t as transformTag, p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-CLbfAJ0X.js';
-import { d as dvI18n } from './p-B8VmBxFg.js';
-import { d as defineCustomElement$1 } from './p-CB9tEjJy.js';
+import { t as transformTag, p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-DffaAVW4.js';
+import { d as dvI18n } from './p-Bp8hmhrC.js';
+import { d as defineCustomElement$1 } from './p-BT5rCW3w.js';
 
 const lsFieldFooterCss = () => `:host{display:block}.ls-dv-button-footer{display:flex;padding-top:1rem;border-top:1px solid var(--gray-20, #edeff2);flex-direction:column;justify-content:flex-end;gap:0.75rem;margin-top:auto}button.ls-dv-secondary{border:1px solid var(--gray-50, #c8c9cc);background:var(--white, #ffffff);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.ls-dv-secondary:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}button.ls-dv-destructive{border:1px solid var(--red-60, #f64a44);background-color:white;color:var(--red-60, #f64a44)}button.ls-dv-destructive:hover{border:1px solid var(--red-70, #dc2721);background:var(--red-10, #fff0f0)}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}.ls-dv-full-rounded{border-radius:calc(infinity * 1px)}`;
 
@@ -52,7 +52,7 @@ const LsFieldFooter = /*@__PURE__*/ proxyCustomElement(class LsFieldFooter exten
         });
     };
     render() {
-        return (h(Host, { key: '0234dcfe5318429120a2fc6bce988d405b8938d4' }, h("div", { key: '3b5779763220a4653a7b30d7b3086b31bc97c980', class: 'ls-dv-button-footer' }, h("button", { key: '557652e16f12606ca92f739aad9e120be73b2c01', class: 'ls-dv-secondary ls-dv-full-rounded', onClick: () => this.duplicateField(), disabled: this.readonly }, h("ls-icon", { key: '57082810a2b2103ee3afa8e932e3963ed5095b8d', name: "field-duplicate-icon", size: 20 }), dvI18n.t('common.duplicate')), h("button", { key: 'ae638c316fc63374a652fac57ea7a87b52f4a29d', class: 'ls-dv-destructive ls-dv-full-rounded', onClick: () => this.deleteField(), disabled: this.readonly }, h("ls-icon", { key: '202808f59c505de059dbd30f57a5cee596ea984c', name: "trash-icon", size: 20 }), dvI18n.t('common.delete'))), h("slot", { key: '74e920edba1f1dd3a3d877b54b92b33a1a4b7b18' })));
+        return (h(Host, { key: 'aa2114ec49122c9b4fc4dc52b872615e7aac9298' }, h("div", { key: 'fb73920bea0d61e8c480fa4c6fd01114f538f61d', class: 'ls-dv-button-footer' }, h("button", { key: '421ec450379a914374935eb3ae0c6754b56e4218', class: 'ls-dv-secondary ls-dv-full-rounded', onClick: () => this.duplicateField(), disabled: this.readonly }, h("ls-icon", { key: '00fb2e23a64f767198f87bd0a9bb50b55caa6a7f', name: "field-duplicate-icon", size: 20 }), dvI18n.t('common.duplicate')), h("button", { key: '714d2d886a01eabbfef26b52a501b9db3262fc4c', class: 'ls-dv-destructive ls-dv-full-rounded', onClick: () => this.deleteField(), disabled: this.readonly }, h("ls-icon", { key: '84995d30a3835bca5d227f948f6d771715504b09', name: "trash-icon", size: 20 }), dvI18n.t('common.delete'))), h("slot", { key: 'be10131be2d81b0f18d1114939edf4f4f3d32c60' })));
     }
     static get style() { return lsFieldFooterCss(); }
 }, [769, "ls-field-footer", {
@@ -80,6 +80,6 @@ function defineCustomElement() {
 defineCustomElement();
 
 export { LsFieldFooter as L, defineCustomElement as d };
-//# sourceMappingURL=p-CyQvboOz.js.map
+//# sourceMappingURL=p-CQx0j-F_.js.map
 
-//# sourceMappingURL=p-CyQvboOz.js.map
+//# sourceMappingURL=p-CQx0j-F_.js.map

package/dist/components/{p-CyQvboOz.js.map → p-CQx0j-F_.js.map}

@@ -1 +1 @@
-{"file":"p-CyQvboOz.js","mappings":";;;;AAAA,MAAM,gBAAgB,GAAG,MAAM,CAAC,ojCAAojC,CAAC;;MCSxkC,aAAa,iBAAAA,kBAAA,CAAA,MAAA,aAAA,SAAAC,CAAA,CAAA;;;;;;;;;;;AACxB;;;AAGG;AAIH,IAAA,QAAQ;IACA,QAAQ,GAAY,KAAK;AAMjC,IAAA,MAAM;AAON,IAAA,MAAM;AAON,IAAA,YAAY;AAEZ,IAAA,QAAQ,CAAC,EAAiC,EAAA;AACxC,QAAA,OAAQ,EAAqB,CAAC,MAAM,KAAK,SAAS;;AAGpD,IAAA,UAAU,CAAC,EAAiC,EAAA;AAC1C,QAAA,OAAO,OAAQ,EAAqB,CAAC,MAAM,KAAK,QAAQ;;IAG1D,QAAQ,GAAA;QACN,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;AAChC,YAAA,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC;;QAExB,OAAO,IAAI,CAAC,QAAQ;;IAGtB,WAAW,GAAG,MAAK;AACjB,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CACd,IAAI,CAAC,QAAQ,EAAE,CAAC,GAAG,CAAC,EAAE,IAAG;YACvB,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE,EAAE;SACtC,CAAC,CACH;AACH,KAAC;IAED,cAAc,GAAG,MAAK;QACpB,IAAI,CAAC,QAAQ,EAAE,CAAC,OAAO,CAAC,OAAO,IAAG;AAChC,YAAA,MAAM,OAAO,GAAG,EAAE,GAAG,OAAO,EAAE,EAAE,EAAE,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,UAAU,EAAE,CAAC,EAAE;YACrE,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,GAAG,OAAO,CAAC,MAAM;AAC3C,YAAA,IAAI,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,OAAO,CAAC,cAAc,CAAC,MAAM,EAAE;AAC3D,gBAAA,OAAO,CAAC,GAAG,GAAG,MAAM;;YAEtB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,CAAC;AAC1E,SAAC,CAAC;AACJ,KAAC;IAED,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,qBAAqB,EAAA,EAC/B,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAE,oCAAoC,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,cAAc,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,EAChH,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAC,sBAAsB,EAAC,IAAI,EAAE,EAAE,EAAI,CAAA,EAChD,MAAM,CAAC,CAAC,CAAC,kBAAkB,CAAC,CACtB,EACT,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAE,sCAAsC,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,EAC/G,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAC,YAAY,EAAC,IAAI,EAAE,EAAE,EAAI,CAAA,EACtC,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,CACnB,CACL,EACN,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-footer/ls-field-footer.scss?tag=ls-field-footer&encapsulation=shadow","src/components/ls-field-footer/ls-field-footer.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.ls-dv-button-footer {\n  display: flex;\n  padding-top: 1rem;\n  border-top: 1px solid $gray-20;\n  flex-direction: column;\n  justify-content: flex-end;\n  gap: 0.75rem;\n  margin-top: auto;\n}\n\n\nbutton.ls-dv-secondary {\n  border: 1px solid $gray-50;\n  background: $white;\n  color: $gray-90;\n  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n}\n\nbutton.ls-dv-secondary:hover {\n  border: 1px solid $gray-50;\n  background: $gray-10;\n}\n\nbutton.ls-dv-destructive {\n  border: 1px solid $red-60;\n  background-color: white;\n  color: $red-60;\n}\n\nbutton.ls-dv-destructive:hover {\n  border: 1px solid $red-70;\n  background: $red-10;\n}\n\nbutton {\n  display: flex;\n  gap: 0.5rem;\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: $primary-60;\n  color: white;\n  font-weight: 500;\n  text-transform: capitalize;\n  min-height: 2.25rem;\n  min-width: 2.25rem;\n}\n\n.ls-dv-full-rounded {\n  border-radius: calc(infinity * 1px);\n}\n","import { Component, Host, Prop, h, Event, EventEmitter } from '@stencil/core';\nimport { LSApiElement, LSMutateEvent } from '../../components';\nimport { dvI18n } from '../../i18n/i18n';\n\n@Component({\n  tag: 'ls-field-footer',\n  styleUrl: 'ls-field-footer.scss',\n  shadow: true,\n})\nexport class LsFieldFooter {\n  /**\n   * The selected items information (as JSON).\n   * {LSApiElement[]}\n   */\n  @Prop({\n    mutable: true,\n  })\n  dataItem: LSApiElement | LSApiElement[];\n  @Prop() readonly: boolean = false;\n  @Event({\n    bubbles: true,\n    cancelable: true,\n    composed: true,\n  })\n  mutate: EventEmitter<LSMutateEvent[]>;\n\n  @Event({\n    bubbles: true,\n    cancelable: true,\n    composed: true,\n  })\n  update: EventEmitter<LSMutateEvent[]>;\n\n  @Event({\n    bubbles: true,\n    cancelable: true,\n    composed: true,\n  })\n  selectFields: EventEmitter<LSApiElement[]>;\n\n  isSingle(dt: LSApiElement | LSApiElement[]): dt is LSApiElement {\n    return (dt as LSApiElement[]).length === undefined;\n  }\n\n  isMultiple(dt: LSApiElement | LSApiElement[]): dt is LSApiElement[] {\n    return typeof (dt as LSApiElement[]).length === 'number';\n  }\n\n  getItems(): LSApiElement[] {\n    if (this.isSingle(this.dataItem)) {\n      return [this.dataItem];\n    }\n    return this.dataItem;\n  }\n\n  deleteField = () => {\n    this.mutate.emit(\n      this.getItems().map(di => {\n        return { action: 'delete', data: di };\n      }),\n    );\n  };\n\n  duplicateField = () => {\n    this.getItems().forEach(current => {\n      const newItem = { ...current, id: btoa('ele' + crypto.randomUUID()) };\n      const newTop = current.top + current.height;\n      if (newTop + current.height < current.pageDimensions.height) {\n        newItem.top = newTop;\n      }\n      this.mutate.emit([{ action: 'create', data: newItem, select: 'clear' }]);\n    });\n  };\n\n  render() {\n    return (\n      <Host>\n        <div class={'ls-dv-button-footer'}>\n          <button class={'ls-dv-secondary ls-dv-full-rounded'} onClick={() => this.duplicateField()} disabled={this.readonly}>\n            <ls-icon name=\"field-duplicate-icon\" size={20} />\n            {dvI18n.t('common.duplicate')}\n          </button>\n          <button class={'ls-dv-destructive ls-dv-full-rounded'} onClick={() => this.deleteField()} disabled={this.readonly}>\n            <ls-icon name=\"trash-icon\" size={20} />\n            {dvI18n.t('common.delete')}\n          </button>\n        </div>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-CQx0j-F_.js","mappings":";;;;AAAA,MAAM,gBAAgB,GAAG,MAAM,CAAC,ojCAAojC,CAAC;;MCSxkC,aAAa,iBAAAA,kBAAA,CAAA,MAAA,aAAA,SAAAC,CAAA,CAAA;;;;;;;;;;;AACxB;;;AAGG;AAIH,IAAA,QAAQ;IACA,QAAQ,GAAY,KAAK;AAMjC,IAAA,MAAM;AAON,IAAA,MAAM;AAON,IAAA,YAAY;AAEZ,IAAA,QAAQ,CAAC,EAAiC,EAAA;AACxC,QAAA,OAAQ,EAAqB,CAAC,MAAM,KAAK,SAAS;;AAGpD,IAAA,UAAU,CAAC,EAAiC,EAAA;AAC1C,QAAA,OAAO,OAAQ,EAAqB,CAAC,MAAM,KAAK,QAAQ;;IAG1D,QAAQ,GAAA;QACN,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;AAChC,YAAA,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC;;QAExB,OAAO,IAAI,CAAC,QAAQ;;IAGtB,WAAW,GAAG,MAAK;AACjB,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CACd,IAAI,CAAC,QAAQ,EAAE,CAAC,GAAG,CAAC,EAAE,IAAG;YACvB,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE,EAAE;SACtC,CAAC,CACH;AACH,KAAC;IAED,cAAc,GAAG,MAAK;QACpB,IAAI,CAAC,QAAQ,EAAE,CAAC,OAAO,CAAC,OAAO,IAAG;AAChC,YAAA,MAAM,OAAO,GAAG,EAAE,GAAG,OAAO,EAAE,EAAE,EAAE,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,UAAU,EAAE,CAAC,EAAE;YACrE,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,GAAG,OAAO,CAAC,MAAM;AAC3C,YAAA,IAAI,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,OAAO,CAAC,cAAc,CAAC,MAAM,EAAE;AAC3D,gBAAA,OAAO,CAAC,GAAG,GAAG,MAAM;;YAEtB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,CAAC;AAC1E,SAAC,CAAC;AACJ,KAAC;IAED,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,qBAAqB,EAAA,EAC/B,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAE,oCAAoC,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,cAAc,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,EAChH,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAC,sBAAsB,EAAC,IAAI,EAAE,EAAE,EAAI,CAAA,EAChD,MAAM,CAAC,CAAC,CAAC,kBAAkB,CAAC,CACtB,EACT,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAE,sCAAsC,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,EAC/G,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAC,YAAY,EAAC,IAAI,EAAE,EAAE,EAAI,CAAA,EACtC,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,CACnB,CACL,EACN,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-footer/ls-field-footer.scss?tag=ls-field-footer&encapsulation=shadow","src/components/ls-field-footer/ls-field-footer.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.ls-dv-button-footer {\n  display: flex;\n  padding-top: 1rem;\n  border-top: 1px solid $gray-20;\n  flex-direction: column;\n  justify-content: flex-end;\n  gap: 0.75rem;\n  margin-top: auto;\n}\n\n\nbutton.ls-dv-secondary {\n  border: 1px solid $gray-50;\n  background: $white;\n  color: $gray-90;\n  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);\n}\n\nbutton.ls-dv-secondary:hover {\n  border: 1px solid $gray-50;\n  background: $gray-10;\n}\n\nbutton.ls-dv-destructive {\n  border: 1px solid $red-60;\n  background-color: white;\n  color: $red-60;\n}\n\nbutton.ls-dv-destructive:hover {\n  border: 1px solid $red-70;\n  background: $red-10;\n}\n\nbutton {\n  display: flex;\n  gap: 0.5rem;\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: $primary-60;\n  color: white;\n  font-weight: 500;\n  text-transform: capitalize;\n  min-height: 2.25rem;\n  min-width: 2.25rem;\n}\n\n.ls-dv-full-rounded {\n  border-radius: calc(infinity * 1px);\n}\n","import { Component, Host, Prop, h, Event, EventEmitter } from '@stencil/core';\nimport { LSApiElement, LSMutateEvent } from '../../components';\nimport { dvI18n } from '../../i18n/i18n';\n\n@Component({\n  tag: 'ls-field-footer',\n  styleUrl: 'ls-field-footer.scss',\n  shadow: true,\n})\nexport class LsFieldFooter {\n  /**\n   * The selected items information (as JSON).\n   * {LSApiElement[]}\n   */\n  @Prop({\n    mutable: true,\n  })\n  dataItem: LSApiElement | LSApiElement[];\n  @Prop() readonly: boolean = false;\n  @Event({\n    bubbles: true,\n    cancelable: true,\n    composed: true,\n  })\n  mutate: EventEmitter<LSMutateEvent[]>;\n\n  @Event({\n    bubbles: true,\n    cancelable: true,\n    composed: true,\n  })\n  update: EventEmitter<LSMutateEvent[]>;\n\n  @Event({\n    bubbles: true,\n    cancelable: true,\n    composed: true,\n  })\n  selectFields: EventEmitter<LSApiElement[]>;\n\n  isSingle(dt: LSApiElement | LSApiElement[]): dt is LSApiElement {\n    return (dt as LSApiElement[]).length === undefined;\n  }\n\n  isMultiple(dt: LSApiElement | LSApiElement[]): dt is LSApiElement[] {\n    return typeof (dt as LSApiElement[]).length === 'number';\n  }\n\n  getItems(): LSApiElement[] {\n    if (this.isSingle(this.dataItem)) {\n      return [this.dataItem];\n    }\n    return this.dataItem;\n  }\n\n  deleteField = () => {\n    this.mutate.emit(\n      this.getItems().map(di => {\n        return { action: 'delete', data: di };\n      }),\n    );\n  };\n\n  duplicateField = () => {\n    this.getItems().forEach(current => {\n      const newItem = { ...current, id: btoa('ele' + crypto.randomUUID()) };\n      const newTop = current.top + current.height;\n      if (newTop + current.height < current.pageDimensions.height) {\n        newItem.top = newTop;\n      }\n      this.mutate.emit([{ action: 'create', data: newItem, select: 'clear' }]);\n    });\n  };\n\n  render() {\n    return (\n      <Host>\n        <div class={'ls-dv-button-footer'}>\n          <button class={'ls-dv-secondary ls-dv-full-rounded'} onClick={() => this.duplicateField()} disabled={this.readonly}>\n            <ls-icon name=\"field-duplicate-icon\" size={20} />\n            {dvI18n.t('common.duplicate')}\n          </button>\n          <button class={'ls-dv-destructive ls-dv-full-rounded'} onClick={() => this.deleteField()} disabled={this.readonly}>\n            <ls-icon name=\"trash-icon\" size={20} />\n            {dvI18n.t('common.delete')}\n          </button>\n        </div>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-CYBhiXXl.js → p-CXxS70Mm.js}

@@ -1,8 +1,8 @@
-import { t as transformTag, p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-CLbfAJ0X.js';
-import { d as dvI18n } from './p-B8VmBxFg.js';
-import { d as defineCustomElement$3 } from './p-CB9tEjJy.js';
-import { d as defineCustomElement$2 } from './p-1dutDvgl.js';
-import { d as defineCustomElement$1 } from './p-BsreOXdY.js';
+import { t as transformTag, p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-DffaAVW4.js';
+import { d as dvI18n } from './p-Bp8hmhrC.js';
+import { d as defineCustomElement$3 } from './p-BT5rCW3w.js';
+import { d as defineCustomElement$2 } from './p-C7ZEYzas.js';
+import { d as defineCustomElement$1 } from './p-DZP-fvPJ.js';
 
 const lsDocumentOptionsCss = () => `*{box-sizing:border-box;margin:0;padding:0}:host{display:block}.ls-dv-editor-infobox{padding:0.125rem 0.5rem 0.125rem 0.5rem}.ls-dv-toolbox-section-title{color:var(--gray-100, #45484d);font-size:1.125rem;font-style:normal;font-weight:500;line-height:1.75rem;}.ls-dv-toolbox-section-description{color:var(--gray-80, #6f7176);font-size:0.75rem;font-style:normal;font-weight:400;line-height:1rem}.ls-dv-template-details{display:flex;flex-direction:column;gap:0.75rem}.ls-dv-template-detail-section{position:relative;display:flex;padding:0.75rem;align-items:center;gap:0.5rem;border-radius:1rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff)}.ls-dv-template-detail-section-title{color:var(--gray-80, #6f7176);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;width:100%}.ls-dv-template-detail-section-info{color:var(--gray-70, #939599);font-size:0.75rem;font-style:normal;font-weight:400;line-height:1rem;width:100%}.ls-dv-template-title{border-radius:0.625rem;padding:0.25rem;color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem;cursor:pointer;width:100%;margin-top:-0.125rem}.ls-dv-template-title:hover{background:var(--gray-10, #f7f8fa)}.ls-dv-column{display:flex;flex-direction:column;align-items:flex-start}.ls-dv-edit-button{position:absolute;top:0.75rem;right:0.75rem;margin:0px;padding:0px;max-height:1.25rem !important;max-width:1.25rem !important;background-color:transparent;border:none;cursor:pointer;color:var(--gray-70, #939599)}.ls-dv-edit-button:hover{color:var(--gray-80, #6f7176)}p{color:var(--gray-80, #6f7176);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)}.ls-dv-button-link,.ls-dv-button-link:hover{all:unset}select{appearance:none;height:2.25rem}.ls-dv-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, #6f7176)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6f7176)}.ls-dv-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.625rem;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, #ffffff)}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, #ffffff)}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].ls-dv-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].ls-dv-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].ls-dv-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}.ls-dv-checkbox-container{display:flex;gap:0.5rem;width:100%}.ls-dv-checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.ls-dv-form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.ls-dv-form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.ls-dv-loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #4456f6)}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.ls-dv-tertiary-grey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #6f7176)}button.ls-dv-tertiary-grey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.ls-dv-button-group{display:flex;border-radius:0.625rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.ls-dv-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, #6f7176)}.ls-dv-button-group button:hover{background:var(--gray-10, #f7f8fa)}.ls-dv-button-group>:first-child{border-radius:0.625rem 0 0 0.625rem}.ls-dv-button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.ls-dv-button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}`;
 
@@ -118,6 +118,6 @@ function defineCustomElement() {
 defineCustomElement();
 
 export { LsDocumentOptions as L, defineCustomElement as d };
-//# sourceMappingURL=p-CYBhiXXl.js.map
+//# sourceMappingURL=p-CXxS70Mm.js.map
 
-//# sourceMappingURL=p-CYBhiXXl.js.map
+//# sourceMappingURL=p-CXxS70Mm.js.map