@mmlogic/components 0.1.22 → 0.1.24

package/dist/collection/components/mrd-relation-field/mrd-relation-field.js

@@ -131,18 +131,30 @@ export class MrdRelationField {
     async setAllRecords(records) {
         this.allRecords = records;
     }
-    allRecordsChanged() {
+    getValueHref() {
         var _a, _b, _c;
+        const v = Array.isArray(this.value) ? ((_a = this.value[0]) !== null && _a !== void 0 ? _a : '') : ((_b = this.value) !== null && _b !== void 0 ? _b : '');
+        if (!v)
+            return '';
+        if (typeof v === 'object')
+            return (_c = v.id) !== null && _c !== void 0 ? _c : '';
+        return v;
+    }
+    allRecordsChanged() {
         if (this.editBehavior !== ClientLayoutItemRelationEditBehavior.DROPDOWN)
             return;
-        // After async options load the browser may not update the select's displayed value
-        // from the `selected` attribute alone — set it imperatively.
-        const select = (_a = this.el) === null || _a === void 0 ? void 0 : _a.querySelector('select');
-        if (!select)
+        const current = this.getValueHref();
+        if (!current)
             return;
-        const current = Array.isArray(this.value) ? ((_b = this.value[0]) !== null && _b !== void 0 ? _b : '') : ((_c = this.value) !== null && _c !== void 0 ? _c : '');
-        if (current)
-            select.value = current;
+        // Defer past Stencil's async render cycle: options must exist in the DOM before
+        // select.value can be set. setAttribute('selected') alone is ignored by browsers
+        // when the select already has an established value.
+        setTimeout(() => {
+            var _a;
+            const select = (_a = this.el) === null || _a === void 0 ? void 0 : _a.querySelector('select');
+            if (select)
+                select.value = current;
+        }, 0);
     }
     async setSearchResults(results) {
         this.searchResults = results;
@@ -184,14 +196,14 @@ export class MrdRelationField {
         }
     }
     render() {
-        var _a, _b, _c, _d;
+        var _a, _b;
         const hasError = !!this.error;
         if (this.editBehavior === ClientLayoutItemRelationEditBehavior.DROPDOWN) {
-            const currentValue = Array.isArray(this.value) ? ((_a = this.value[0]) !== null && _a !== void 0 ? _a : '') : ((_b = this.value) !== null && _b !== void 0 ? _b : '');
+            const currentValue = this.getValueHref();
             return (h(Host, null, h("div", { class: "mrd-relation-field" }, this.label && (h("label", { class: `mrd-relation-field__label${this.required ? ' mrd-relation-field__label--required' : ''}` }, this.label)), h("select", { class: `mrd-relation-field__select${hasError ? ' mrd-relation-field__select--error' : ''}`, name: this.name, required: this.required, disabled: this.disabled, onChange: this.handleDropdownChange }, h("option", { value: "" }, t('select_placeholder', this.locale)), this.allRecords.map(record => (h("option", { key: record.id, value: record.id, selected: record.id === currentValue }, record.label)))), hasError && h("span", { class: "mrd-relation-field__error" }, this.error))));
         }
         if (this.displayType === ClientLayoutItemRelationDisplayType.DROPDOWN) {
-            const currentValue = Array.isArray(this.value) ? ((_c = this.value[0]) !== null && _c !== void 0 ? _c : '') : ((_d = this.value) !== null && _d !== void 0 ? _d : '');
+            const currentValue = Array.isArray(this.value) ? ((_a = this.value[0]) !== null && _a !== void 0 ? _a : '') : ((_b = this.value) !== null && _b !== void 0 ? _b : '');
             return (h(Host, null, h("div", { class: "mrd-relation-field" }, this.label && (h("label", { class: `mrd-relation-field__label${this.required ? ' mrd-relation-field__label--required' : ''}` }, this.label)), h("select", { class: `mrd-relation-field__select${hasError ? ' mrd-relation-field__select--error' : ''}`, name: this.name, required: this.required, disabled: this.disabled, onChange: this.handleDropdownChange }, h("option", { value: "" }, t('select_placeholder', this.locale)), this.dropdownValues.map(dv => (h("option", { key: dv.key, value: dv.key, selected: dv.key === currentValue }, dv.label)))), hasError && h("span", { class: "mrd-relation-field__error" }, this.error))));
         }
         // SEARCH mode

package/dist/collection/components/mrd-text-field/mrd-text-field.js

@@ -28,7 +28,7 @@ export class MrdTextField {
     }
     render() {
         const hasError = !!this.error;
-        return (h(Host, { key: '4ddbcb2f8915235631c6f66449b28e664c24c0a4' }, h("div", { key: '91dbb52ed715c92d4ef2bc0924fd378d0dc839a8', class: "mrd-text-field" }, this.label && (h("label", { key: 'cf3278503107d313c08034273916a4b84a16febd', class: `mrd-text-field__label${this.required ? ' mrd-text-field__label--required' : ''}` }, this.label)), h("input", { key: '9ab992213bfaa372e453331e1b1e12a853c3ae6e', class: `mrd-text-field__input${hasError ? ' mrd-text-field__input--error' : ''}`, type: "text", name: this.name, value: this.value, placeholder: this.placeholder, required: this.required, disabled: this.disabled, onInput: this.handleInput, onBlur: this.handleBlur }), hasError && h("span", { key: 'a4ff2fdd2490f644eb97f66f15edc5af0b22e823', class: "mrd-text-field__error" }, this.error))));
+        return (h(Host, { key: '8909be24f6452fd4f485b209b226edd4a7718d6b' }, h("div", { key: '18680ffdd64384b8725c408360da8f0f288ee6fc', class: "mrd-text-field" }, this.label && (h("label", { key: 'c4d014056181d4a92ca74a505ae48cb2cb81236d', class: `mrd-text-field__label${this.required ? ' mrd-text-field__label--required' : ''}` }, this.label)), h("input", { key: '76f862523928100f1f1089fc747b2964312d77a2', class: `mrd-text-field__input${hasError ? ' mrd-text-field__input--error' : ''}`, type: "text", name: this.name, value: this.value, placeholder: this.placeholder, required: this.required, disabled: this.disabled, onInput: this.handleInput, onBlur: this.handleBlur }), hasError && h("span", { key: 'd0a1e04caea7a2d5058bc753e0885f25db302575', class: "mrd-text-field__error" }, this.error))));
     }
     static get is() { return "mrd-text-field"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/mrd-textarea-field/mrd-textarea-field.js

@@ -66,7 +66,7 @@ export class MrdTextareaField {
         }
     }
     render() {
-        return (h(Host, { key: '8f7544745341ea2eca4450296db53ed8b41af0e2' }, h("div", { key: '62937448dd685071e0500b8f7f53fe22b10ffa15', class: "mrd-textarea-field" }, this.label && (h("label", { key: '4a7d807d78c2a9abeaf3ff94ee5e71b167475e25', class: `mrd-textarea-field__label${this.required ? ' mrd-textarea-field__label--required' : ''}` }, this.label)), h("div", { key: '599e28a45b1c161d7cfec3de138e386bf997f9b9', class: `mrd-textarea-field__container${this.error ? ' mrd-textarea-field__container--error' : ''}` }, h("div", { key: '5824a225fa6ea29bf02dfd8e4b27a71e853f059e', class: "mrd-textarea-field__editor" })), this.error && h("span", { key: '1c7693269df8f3fe112a6df419e6cbace75bdaa9', class: "mrd-textarea-field__error" }, this.error))));
+        return (h(Host, { key: '41b9f19dc589c26545a11db883c00b7ffe5d1c04' }, h("div", { key: '62b01e407efe1d5b8885e769f62705938f931817', class: "mrd-textarea-field" }, this.label && (h("label", { key: '284e3355dfe15c0aedcb9bafdd829269a0eea93a', class: `mrd-textarea-field__label${this.required ? ' mrd-textarea-field__label--required' : ''}` }, this.label)), h("div", { key: '0dba936a6eba64457f5cc69164d0f0eaf4563698', class: `mrd-textarea-field__container${this.error ? ' mrd-textarea-field__container--error' : ''}` }, h("div", { key: '0c47c25bd86d5002575a1f19848b0b0af2e87982', class: "mrd-textarea-field__editor" })), this.error && h("span", { key: 'e678046a6c27544dd9007a6c66083cce089cb991', class: "mrd-textarea-field__error" }, this.error))));
     }
     static get is() { return "mrd-textarea-field"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/mrd-time-field/mrd-time-field.js

@@ -27,7 +27,7 @@ export class MrdTimeField {
     }
     render() {
         const hasError = !!this.error;
-        return (h(Host, { key: '0a6e3047eb409b50a7dfa46c724e0d9824bdbad9' }, h("div", { key: '1fdcaa9cc0e44edd514d3453df0cfb264989cbca', class: "mrd-time-field" }, this.label && (h("label", { key: 'ae53864761258ae56e29474c2da68c852fe8db57', class: `mrd-time-field__label${this.required ? ' mrd-time-field__label--required' : ''}` }, this.label)), h("input", { key: '60336f497545b61656756790cfb5ec096034ecf7', class: `mrd-time-field__input${hasError ? ' mrd-time-field__input--error' : ''}`, type: "time", name: this.name, value: this.value, required: this.required, disabled: this.disabled, onChange: this.handleChange, onBlur: this.handleBlur }), hasError && h("span", { key: 'f8409b690c67873f6e4fe10f1d404b57005f0557', class: "mrd-time-field__error" }, this.error))));
+        return (h(Host, { key: 'f5325429315ff23757f2a575b8d317c76e23f579' }, h("div", { key: '2c2a4a49984d61cf62f94f1923d6a2a1e550fb1c', class: "mrd-time-field" }, this.label && (h("label", { key: '3ef4da8ecc8406eacf3e91e188a1ea20f8eb8779', class: `mrd-time-field__label${this.required ? ' mrd-time-field__label--required' : ''}` }, this.label)), h("input", { key: '284527457812d72f5341128d3ba7873f52d5694f', class: `mrd-time-field__input${hasError ? ' mrd-time-field__input--error' : ''}`, type: "time", name: this.name, value: this.value, required: this.required, disabled: this.disabled, onChange: this.handleChange, onBlur: this.handleBlur }), hasError && h("span", { key: '7563dcb10e813c583a0fb29e07f6e7f2340609bf', class: "mrd-time-field__error" }, this.error))));
     }
     static get is() { return "mrd-time-field"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/types/client-layout.js

@@ -45,6 +45,8 @@ export var ClientLayoutItemFieldDataType;
     ClientLayoutItemFieldDataType["LIST"] = "LIST";
     ClientLayoutItemFieldDataType["FILE"] = "FILE";
     ClientLayoutItemFieldDataType["IMAGE"] = "IMAGE";
+    ClientLayoutItemFieldDataType["LONGTEXT"] = "LONGTEXT";
+    ClientLayoutItemFieldDataType["JSON"] = "JSON";
 })(ClientLayoutItemFieldDataType || (ClientLayoutItemFieldDataType = {}));
 // ─── Relation display / edit behaviour ───────────────────────────────────────
 export var ClientLayoutItemRelationDisplayType;

package/dist/collection/utils/cell-renderer.js

@@ -62,6 +62,12 @@ export class CellRenderer {
                 txt.innerHTML = stripped;
                 return txt.value.trim();
             }
+            case 'LONGTEXT':
+                return String(value).replace(/[\r\n]+/g, ' ').trim();
+            case 'JSON': {
+                const str = typeof value === 'object' ? JSON.stringify(value) : String(value);
+                return str.replace(/[\r\n]+/g, ' ').trim();
+            }
             default:
                 return String(value);
         }

package/dist/components/client-layout.js

@@ -1 +1 @@
-var E,A,T,O,R;!function(E){E.OBJECT_FORM_DASHBOARD="OBJECT_FORM_DASHBOARD",E.CLASS_DASHBOARD="CLASS_DASHBOARD",E.GENERAL_DASHBOARD="GENERAL_DASHBOARD",E.NAVIGATION_PANE="NAVIGATION_PANE"}(E||(E={})),function(E){E.FIELD="FIELD",E.RELATION="RELATION",E.SECTION="SECTION",E.GROUP="GROUP",E.HEADER="HEADER",E.TEXT="TEXT",E.NAVIGATE="NAVIGATE",E.ACTION="ACTION",E.SEARCH="SEARCH",E.VIEW="VIEW",E.RELATED_VIEW="RELATED_VIEW",E.RELATED_OBJECT="RELATED_OBJECT"}(A||(A={})),function(E){E.TEXT="TEXT",E.TEXTBLOCK="TEXTBLOCK",E.INTEGER="INTEGER",E.DECIMAL="DECIMAL",E.PERCENTAGE="PERCENTAGE",E.CURRENCY="CURRENCY",E.BOOLEAN="BOOLEAN",E.DATE="DATE",E.DATETIME="DATETIME",E.TIME="TIME",E.EMAIL="EMAIL",E.HYPERLINK="HYPERLINK",E.LIST="LIST",E.FILE="FILE",E.IMAGE="IMAGE"}(T||(T={})),function(E){E.SEARCH="SEARCH",E.DROPDOWN="DROPDOWN",E.CHECKBOX="CHECKBOX"}(O||(O={})),function(E){E.SEARCH="SEARCH",E.DROPDOWN="DROPDOWN",E.CHECKBOX="CHECKBOX"}(R||(R={}));export{E as C,A as a,T as b,O as c,R as d}
+var E,A,T,O,R;!function(E){E.OBJECT_FORM_DASHBOARD="OBJECT_FORM_DASHBOARD",E.CLASS_DASHBOARD="CLASS_DASHBOARD",E.GENERAL_DASHBOARD="GENERAL_DASHBOARD",E.NAVIGATION_PANE="NAVIGATION_PANE"}(E||(E={})),function(E){E.FIELD="FIELD",E.RELATION="RELATION",E.SECTION="SECTION",E.GROUP="GROUP",E.HEADER="HEADER",E.TEXT="TEXT",E.NAVIGATE="NAVIGATE",E.ACTION="ACTION",E.SEARCH="SEARCH",E.VIEW="VIEW",E.RELATED_VIEW="RELATED_VIEW",E.RELATED_OBJECT="RELATED_OBJECT"}(A||(A={})),function(E){E.TEXT="TEXT",E.TEXTBLOCK="TEXTBLOCK",E.INTEGER="INTEGER",E.DECIMAL="DECIMAL",E.PERCENTAGE="PERCENTAGE",E.CURRENCY="CURRENCY",E.BOOLEAN="BOOLEAN",E.DATE="DATE",E.DATETIME="DATETIME",E.TIME="TIME",E.EMAIL="EMAIL",E.HYPERLINK="HYPERLINK",E.LIST="LIST",E.FILE="FILE",E.IMAGE="IMAGE",E.LONGTEXT="LONGTEXT",E.JSON="JSON"}(T||(T={})),function(E){E.SEARCH="SEARCH",E.DROPDOWN="DROPDOWN",E.CHECKBOX="CHECKBOX"}(O||(O={})),function(E){E.SEARCH="SEARCH",E.DROPDOWN="DROPDOWN",E.CHECKBOX="CHECKBOX"}(R||(R={}));export{E as C,A as a,T as b,O as c,R as d}

package/dist/components/mrd-field2.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as l,createEvent as d,h as r,Host as i,transformTag as t}from"@stencil/core/internal/client";import{a as m,c as a,b as s}from"./client-layout.js";import{d as n}from"./mrd-boolean-field2.js";import{d as o}from"./mrd-currency-field2.js";import{d as u}from"./mrd-date-field2.js";import{d as c}from"./mrd-datetime-field2.js";import{d as f}from"./mrd-email-field2.js";import{d as h}from"./mrd-file-field2.js";import{d as v}from"./mrd-hyperlink-field2.js";import{d as b}from"./mrd-image-field2.js";import{d as p}from"./mrd-list-field2.js";import{d as j}from"./mrd-number-field2.js";import{d as k}from"./mrd-relation-field2.js";import{d as E}from"./mrd-text-field2.js";import{d as y}from"./mrd-textarea-field2.js";import{d as O}from"./mrd-time-field2.js";const x=e(class extends l{constructor(e){super(),!1!==e&&this.__registerHost(),this.mrdChange=d(this,"mrdChange",7),this.mrdBlur=d(this,"mrdBlur",7),this.mrdSearch=d(this,"mrdSearch",7),this.mrdFetchAll=d(this,"mrdFetchAll",7),this.mrdUpload=d(this,"mrdUpload",7),this.locale=navigator.language,this.handleChange=e=>{e.stopPropagation(),this.mrdChange.emit(e.detail)},this.handleBlur=e=>{e.stopPropagation(),this.mrdBlur.emit(e.detail)},this.handleSearch=e=>{e.stopPropagation(),this.mrdSearch.emit(e.detail)},this.handleFetchAll=e=>{e.stopPropagation(),this.mrdFetchAll.emit(e.detail)},this.handleUpload=e=>{e.stopPropagation(),this.mrdUpload.emit(e.detail)}}render(){var e,l,d,t,n,o,u,c,f,h,v,b,p,j,k,E,y,O,x,g,M,C,S,B,U,w,q,z,A,F,R;const{item:T,locale:I,value:P}=this;if(T.type===m.RELATION&&T.relation){const m=T.relation;return r(i,null,r("mrd-relation-field",{name:m.name,label:m.label,required:m.required,disabled:null!==(e=m.disabled)&&void 0!==e&&e,locale:I,relatedClass:m.relatedClass,mostSignificantClass:null!==(l=m.mostSignificantClass)&&void 0!==l?l:"",displayType:null!==(d=m.displayType)&&void 0!==d?d:a.SEARCH,editBehavior:null!==(t=m.editBehavior)&&void 0!==t?t:null,commonRelation:m.commonRelation,multiple:null!==(n=m.multiple)&&void 0!==n&&n,dropdownValues:null!==(o=m.dropdownValues)&&void 0!==o?o:[],value:P,onMrdChange:this.handleChange,onMrdBlur:this.handleBlur,onMrdSearch:this.handleSearch,onMrdFetchAll:this.handleFetchAll}))}if(T.type!==m.FIELD||!T.field)return r(i,null);const V=T.field,D={name:V.name,label:V.label,required:V.required,disabled:null!==(u=V.disabled)&&void 0!==u&&u,locale:I,onMrdChange:this.handleChange,onMrdBlur:this.handleBlur};switch(V.dataType){case s.TEXT:return r(i,null,r("mrd-text-field",Object.assign({},D,{value:null!==(c=P)&&void 0!==c?c:"",placeholder:null!==(f=V.placeholder)&&void 0!==f?f:""})));case s.TEXTBLOCK:return r(i,null,r("mrd-textarea-field",Object.assign({},D,{value:null!==(h=P)&&void 0!==h?h:"",placeholder:null!==(v=V.placeholder)&&void 0!==v?v:""})));case s.INTEGER:case s.DECIMAL:case s.PERCENTAGE:return r(i,null,r("mrd-number-field",Object.assign({},D,{value:null!==(b=P)&&void 0!==b?b:null,dataType:V.dataType,decimalPrecision:null!==(p=V.decimalPrecision)&&void 0!==p?p:2,placeholder:null!==(j=V.placeholder)&&void 0!==j?j:""})));case s.CURRENCY:return r(i,null,r("mrd-currency-field",Object.assign({},D,{value:null!==(k=P)&&void 0!==k?k:{amount:null,currency:null!==(E=V.currencyCode)&&void 0!==E?E:"EUR"}})));case s.BOOLEAN:return r(i,null,r("mrd-boolean-field",Object.assign({},D,{value:null!==(y=P)&&void 0!==y&&y})));case s.DATE:return r(i,null,r("mrd-date-field",Object.assign({},D,{value:null!==(O=P)&&void 0!==O?O:""})));case s.DATETIME:return r(i,null,r("mrd-datetime-field",Object.assign({},D,{value:null!==(x=P)&&void 0!==x?x:""})));case s.TIME:return r(i,null,r("mrd-time-field",Object.assign({},D,{value:null!==(g=P)&&void 0!==g?g:""})));case s.EMAIL:return r(i,null,r("mrd-email-field",Object.assign({},D,{value:null!==(M=P)&&void 0!==M?M:"",placeholder:null!==(C=V.placeholder)&&void 0!==C?C:""})));case s.HYPERLINK:return r(i,null,r("mrd-hyperlink-field",Object.assign({},D,{value:null!==(S=P)&&void 0!==S?S:"",placeholder:null!==(B=V.placeholder)&&void 0!==B?B:""})));case s.LIST:return r(i,null,r("mrd-list-field",Object.assign({},D,{value:null!==(U=P)&&void 0!==U?U:"",multiple:null!==(w=V.multiple)&&void 0!==w&&w,listItems:null!==(q=V.listItems)&&void 0!==q?q:[]})));case s.FILE:return r(i,null,r("mrd-file-field",Object.assign({},D,{value:P,accept:null!==(z=V.accept)&&void 0!==z?z:"",maxSize:null!==(A=V.maxSize)&&void 0!==A?A:0,onMrdUpload:this.handleUpload})));case s.IMAGE:return r(i,null,r("mrd-image-field",Object.assign({},D,{value:P,accept:null!==(F=V.accept)&&void 0!==F?F:"image/*",maxSize:null!==(R=V.maxSize)&&void 0!==R?R:0,onMrdUpload:this.handleUpload})));default:return r(i,null)}}},[2,"mrd-field",{item:[16],locale:[1],value:[16]}]);function g(){"undefined"!=typeof customElements&&["mrd-field","mrd-boolean-field","mrd-currency-field","mrd-date-field","mrd-datetime-field","mrd-email-field","mrd-file-field","mrd-hyperlink-field","mrd-image-field","mrd-list-field","mrd-number-field","mrd-relation-field","mrd-text-field","mrd-textarea-field","mrd-time-field"].forEach((e=>{switch(e){case"mrd-field":customElements.get(t(e))||customElements.define(t(e),x);break;case"mrd-boolean-field":customElements.get(t(e))||n();break;case"mrd-currency-field":customElements.get(t(e))||o();break;case"mrd-date-field":customElements.get(t(e))||u();break;case"mrd-datetime-field":customElements.get(t(e))||c();break;case"mrd-email-field":customElements.get(t(e))||f();break;case"mrd-file-field":customElements.get(t(e))||h();break;case"mrd-hyperlink-field":customElements.get(t(e))||v();break;case"mrd-image-field":customElements.get(t(e))||b();break;case"mrd-list-field":customElements.get(t(e))||p();break;case"mrd-number-field":customElements.get(t(e))||j();break;case"mrd-relation-field":customElements.get(t(e))||k();break;case"mrd-text-field":customElements.get(t(e))||E();break;case"mrd-textarea-field":customElements.get(t(e))||y();break;case"mrd-time-field":customElements.get(t(e))||O()}}))}export{x as M,g as d}
+import{proxyCustomElement as e,HTMLElement as l,createEvent as d,h as r,Host as i,transformTag as t}from"@stencil/core/internal/client";import{a as m,c as a,b as s}from"./client-layout.js";import{d as n}from"./mrd-boolean-field2.js";import{d as o}from"./mrd-currency-field2.js";import{d as u}from"./mrd-date-field2.js";import{d as c}from"./mrd-datetime-field2.js";import{d as f}from"./mrd-email-field2.js";import{d as v}from"./mrd-file-field2.js";import{d as h}from"./mrd-hyperlink-field2.js";import{d as b}from"./mrd-image-field2.js";import{d as p}from"./mrd-list-field2.js";import{d as j}from"./mrd-longtext-field2.js";import{d as k}from"./mrd-number-field2.js";import{d as E}from"./mrd-relation-field2.js";import{d as x}from"./mrd-text-field2.js";import{d as g}from"./mrd-textarea-field2.js";import{d as y}from"./mrd-time-field2.js";const O=e(class extends l{constructor(e){super(),!1!==e&&this.__registerHost(),this.mrdChange=d(this,"mrdChange",7),this.mrdBlur=d(this,"mrdBlur",7),this.mrdSearch=d(this,"mrdSearch",7),this.mrdFetchAll=d(this,"mrdFetchAll",7),this.mrdUpload=d(this,"mrdUpload",7),this.locale=navigator.language,this.handleChange=e=>{e.stopPropagation(),this.mrdChange.emit(e.detail)},this.handleBlur=e=>{e.stopPropagation(),this.mrdBlur.emit(e.detail)},this.handleSearch=e=>{e.stopPropagation(),this.mrdSearch.emit(e.detail)},this.handleFetchAll=e=>{e.stopPropagation(),this.mrdFetchAll.emit(e.detail)},this.handleUpload=e=>{e.stopPropagation(),this.mrdUpload.emit(e.detail)}}render(){var e,l,d,t,n,o,u,c,f,v,h,b,p,j,k,E,x,g,y,O,M,C,S,B,U,w,q,z,A,F,R,T,I;const{item:P,locale:V,value:D}=this;if(P.type===m.RELATION&&P.relation){const m=P.relation;return r(i,null,r("mrd-relation-field",{name:m.name,label:m.label,required:m.required,disabled:null!==(e=m.disabled)&&void 0!==e&&e,locale:V,relatedClass:m.relatedClass,mostSignificantClass:null!==(l=m.mostSignificantClass)&&void 0!==l?l:"",displayType:null!==(d=m.displayType)&&void 0!==d?d:a.SEARCH,editBehavior:null!==(t=m.editBehavior)&&void 0!==t?t:null,commonRelation:m.commonRelation,multiple:null!==(n=m.multiple)&&void 0!==n&&n,dropdownValues:null!==(o=m.dropdownValues)&&void 0!==o?o:[],value:D,onMrdChange:this.handleChange,onMrdBlur:this.handleBlur,onMrdSearch:this.handleSearch,onMrdFetchAll:this.handleFetchAll}))}if(P.type!==m.FIELD||!P.field)return r(i,null);const G=P.field,H={name:G.name,label:G.label,required:G.required,disabled:null!==(u=G.disabled)&&void 0!==u&&u,locale:V,onMrdChange:this.handleChange,onMrdBlur:this.handleBlur};switch(G.dataType){case s.TEXT:return r(i,null,r("mrd-text-field",Object.assign({},H,{value:null!==(c=D)&&void 0!==c?c:"",placeholder:null!==(f=G.placeholder)&&void 0!==f?f:""})));case s.TEXTBLOCK:return r(i,null,r("mrd-textarea-field",Object.assign({},H,{value:null!==(v=D)&&void 0!==v?v:"",placeholder:null!==(h=G.placeholder)&&void 0!==h?h:""})));case s.INTEGER:case s.DECIMAL:case s.PERCENTAGE:return r(i,null,r("mrd-number-field",Object.assign({},H,{value:null!==(b=D)&&void 0!==b?b:null,dataType:G.dataType,decimalPrecision:null!==(p=G.decimalPrecision)&&void 0!==p?p:2,placeholder:null!==(j=G.placeholder)&&void 0!==j?j:""})));case s.CURRENCY:return r(i,null,r("mrd-currency-field",Object.assign({},H,{value:null!==(k=D)&&void 0!==k?k:{amount:null,currency:null!==(E=G.currencyCode)&&void 0!==E?E:"EUR"}})));case s.BOOLEAN:return r(i,null,r("mrd-boolean-field",Object.assign({},H,{value:null!==(x=D)&&void 0!==x&&x})));case s.DATE:return r(i,null,r("mrd-date-field",Object.assign({},H,{value:null!==(g=D)&&void 0!==g?g:""})));case s.DATETIME:return r(i,null,r("mrd-datetime-field",Object.assign({},H,{value:null!==(y=D)&&void 0!==y?y:""})));case s.TIME:return r(i,null,r("mrd-time-field",Object.assign({},H,{value:null!==(O=D)&&void 0!==O?O:""})));case s.EMAIL:return r(i,null,r("mrd-email-field",Object.assign({},H,{value:null!==(M=D)&&void 0!==M?M:"",placeholder:null!==(C=G.placeholder)&&void 0!==C?C:""})));case s.HYPERLINK:return r(i,null,r("mrd-hyperlink-field",Object.assign({},H,{value:null!==(S=D)&&void 0!==S?S:"",placeholder:null!==(B=G.placeholder)&&void 0!==B?B:""})));case s.LIST:return r(i,null,r("mrd-list-field",Object.assign({},H,{value:null!==(U=D)&&void 0!==U?U:"",multiple:null!==(w=G.multiple)&&void 0!==w&&w,listItems:null!==(q=G.listItems)&&void 0!==q?q:[]})));case s.FILE:return r(i,null,r("mrd-file-field",Object.assign({},H,{value:D,accept:null!==(z=G.accept)&&void 0!==z?z:"",maxSize:null!==(A=G.maxSize)&&void 0!==A?A:0,onMrdUpload:this.handleUpload})));case s.IMAGE:return r(i,null,r("mrd-image-field",Object.assign({},H,{value:D,accept:null!==(F=G.accept)&&void 0!==F?F:"image/*",maxSize:null!==(R=G.maxSize)&&void 0!==R?R:0,onMrdUpload:this.handleUpload})));case s.LONGTEXT:return r(i,null,r("mrd-longtext-field",Object.assign({},H,{value:null!==(T=D)&&void 0!==T?T:"",placeholder:null!==(I=G.placeholder)&&void 0!==I?I:""})));default:return r(i,null)}}},[2,"mrd-field",{item:[16],locale:[1],value:[16]}]);function M(){"undefined"!=typeof customElements&&["mrd-field","mrd-boolean-field","mrd-currency-field","mrd-date-field","mrd-datetime-field","mrd-email-field","mrd-file-field","mrd-hyperlink-field","mrd-image-field","mrd-list-field","mrd-longtext-field","mrd-number-field","mrd-relation-field","mrd-text-field","mrd-textarea-field","mrd-time-field"].forEach((e=>{switch(e){case"mrd-field":customElements.get(t(e))||customElements.define(t(e),O);break;case"mrd-boolean-field":customElements.get(t(e))||n();break;case"mrd-currency-field":customElements.get(t(e))||o();break;case"mrd-date-field":customElements.get(t(e))||u();break;case"mrd-datetime-field":customElements.get(t(e))||c();break;case"mrd-email-field":customElements.get(t(e))||f();break;case"mrd-file-field":customElements.get(t(e))||v();break;case"mrd-hyperlink-field":customElements.get(t(e))||h();break;case"mrd-image-field":customElements.get(t(e))||b();break;case"mrd-list-field":customElements.get(t(e))||p();break;case"mrd-longtext-field":customElements.get(t(e))||j();break;case"mrd-number-field":customElements.get(t(e))||k();break;case"mrd-relation-field":customElements.get(t(e))||E();break;case"mrd-text-field":customElements.get(t(e))||x();break;case"mrd-textarea-field":customElements.get(t(e))||g();break;case"mrd-time-field":customElements.get(t(e))||y()}}))}export{O as M,M as d}

package/dist/components/mrd-form.js

@@ -1 +1 @@
-import{proxyCustomElement as r,HTMLElement as e,createEvent as t,h as i,Host as o,transformTag as s}from"@stencil/core/internal/client";import{a as d,d as m}from"./client-layout.js";import{t as l}from"./i18n.js";import{v as a}from"./validation.js";import{d as n}from"./mrd-boolean-field2.js";import{d as c}from"./mrd-currency-field2.js";import{d as f}from"./mrd-date-field2.js";import{d as u}from"./mrd-datetime-field2.js";import{d as h}from"./mrd-email-field2.js";import{d as v}from"./mrd-field2.js";import{d as p}from"./mrd-file-field2.js";import{d as b}from"./mrd-hyperlink-field2.js";import{d as _}from"./mrd-image-field2.js";import{d as g}from"./mrd-list-field2.js";import{d as y}from"./mrd-number-field2.js";import{d as j}from"./mrd-relation-field2.js";import{d as k}from"./mrd-text-field2.js";import{d as x}from"./mrd-textarea-field2.js";import{d as w}from"./mrd-time-field2.js";const O=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdSubmit=t(this,"mrdSubmit",7),this.mrdCancel=t(this,"mrdCancel",7),this.mrdSearch=t(this,"mrdSearch",7),this.mrdFetchAll=t(this,"mrdFetchAll",7),this.mrdUpload=t(this,"mrdUpload",7),this.locale=navigator.language,this.values={},this.referenceHref="",this.referenceClass="",this.showCancel=!1,this.formValues={},this.errors={},this.submitted=!1,this.initialValues={},this.handleFieldChange=r=>{const{name:e,value:t}=r.detail,i=this.getHref(this.formValues[e]);this.formValues=Object.assign(Object.assign({},this.formValues),{[e]:t}),this.errors[e]&&(this.errors=Object.assign(Object.assign({},this.errors),{[e]:""}));const o=this.getHref(t);if(o!==i)for(const r of this.collectDependentDropdowns())r.commonRelation===e&&(this.formValues=Object.assign(Object.assign({},this.formValues),{[r.name]:null}),this.mrdFetchAll.emit({name:r.name,relatedClass:r.relatedClass,mostSignificantClass:r.mostSignificantClass,commonRelation:r.commonRelation,filter:r.commonRelation+"_href",filterValue:o}))},this.handleSearch=r=>{r.stopPropagation(),this.mrdSearch.emit(r.detail)},this.handleFetchAll=r=>{r.stopPropagation(),this.mrdFetchAll.emit(r.detail)},this.handleUpload=r=>{r.stopPropagation(),this.mrdUpload.emit(r.detail)},this.handleSubmit=r=>{r.preventDefault(),this.submitted=!0,this.validate()&&this.mrdSubmit.emit(this.buildSubmitPayload())}}componentWillLoad(){var r,e;this.initialValues=Object.assign({},null!==(r=this.values)&&void 0!==r?r:{}),this.formValues=Object.assign({},null!==(e=this.values)&&void 0!==e?e:{})}componentDidLoad(){setTimeout((()=>{this.applyReferenceValue(),this.emitDependentFetchAll()}),0)}valuesChanged(r){this.initialValues=Object.assign({},null!=r?r:{}),this.formValues=Object.assign({},null!=r?r:{}),this.applyReferenceValue(),this.errors={},this.submitted=!1,setTimeout((()=>this.emitDependentFetchAll()),0)}applyReferenceValue(){if(!this.referenceHref||!this.referenceClass)return;const r=this.resolveReferenceFieldName();r&&(this.formValues[r]||(this.formValues=Object.assign(Object.assign({},this.formValues),{[r]:this.referenceHref})))}resolveReferenceFieldName(){var r,e;const t=this.collectFields(null!==(e=null===(r=this.layout)||void 0===r?void 0:r.items)&&void 0!==e?e:[]),i=t.find((r=>{var e;return r.type===d.RELATION&&(null===(e=r.relation)||void 0===e?void 0:e.mostSignificantClass)===this.referenceClass}));if(null==i?void 0:i.relation)return i.relation.name;const o=new Set(t.filter((r=>r.type===d.RELATION)).map((r=>r.relation.name)));for(const r of t){const e=r.relation;if(r.type===d.RELATION&&(null==e?void 0:e.editBehavior)===m.DROPDOWN&&e.commonRelation&&!o.has(e.commonRelation))return e.commonRelation}return null}async setFieldValue(r,e){this.formValues=Object.assign(Object.assign({},this.formValues),{[r]:e}),this.errors[r]&&(this.errors=Object.assign(Object.assign({},this.errors),{[r]:""}))}collectDependentDropdowns(){var r,e;return this.collectFields(null!==(e=null===(r=this.layout)||void 0===r?void 0:r.items)&&void 0!==e?e:[]).filter((r=>{var e;return r.type===d.RELATION&&(null===(e=r.relation)||void 0===e?void 0:e.editBehavior)===m.DROPDOWN&&!!r.relation.commonRelation})).map((r=>r.relation))}emitDependentFetchAll(){for(const r of this.collectDependentDropdowns()){const e=this.getHref(this.formValues[r.commonRelation]);e&&this.mrdFetchAll.emit({name:r.name,relatedClass:r.relatedClass,mostSignificantClass:r.mostSignificantClass,commonRelation:r.commonRelation,filter:r.commonRelation+"_href",filterValue:e})}}getHref(r){return r?"string"==typeof r?r:"object"==typeof r&&"id"in r?r.id:"":""}collectFields(r){const e=[];for(const t of r)t.type!==d.FIELD&&t.type!==d.RELATION||e.push(t),t.items&&e.push(...this.collectFields(t.items));return e}validate(){var r,e,t;const i={},o=this.collectFields(null!==(e=null===(r=this.layout)||void 0===r?void 0:r.items)&&void 0!==e?e:[]);for(const r of o){const e=null!==(t=r.field)&&void 0!==t?t:r.relation;e&&e.required&&!a(this.formValues[e.name])&&(i[e.name]=l("required",this.locale))}return this.errors=i,0===Object.keys(i).length}normalizeFieldValue(r){return""===r||null==r?null:r}normalizeRelationValue(r){return null==r||""===r?null:"string"==typeof r?r||null:Array.isArray(r)?r.map((r=>"object"==typeof r&&null!==r&&"id"in r?r.id:r+"")):"object"==typeof r&&"id"in r&&r.id||null}deepEqual(r,e){if(r===e)return!0;if(null==r&&null==e)return!0;if(null==r||null==e)return!1;if(Array.isArray(r)&&Array.isArray(e)){if(r.length!==e.length)return!1;const t=[...r].sort(),i=[...e].sort();return JSON.stringify(t)===JSON.stringify(i)}return JSON.stringify(r)===JSON.stringify(e)}buildSubmitPayload(){var r,e;const t={},i=this.collectFields(null!==(e=null===(r=this.layout)||void 0===r?void 0:r.items)&&void 0!==e?e:[]);for(const r of i)if(r.type===d.FIELD&&r.field){const e=r.field.name,i=this.formValues[e];if(i instanceof File)continue;const o=this.normalizeFieldValue(i),s=this.normalizeFieldValue(this.initialValues[e]);if(this.deepEqual(o,s))continue;t[e]=o}else if(r.type===d.RELATION&&r.relation){const e=r.relation.name,i=this.normalizeRelationValue(this.formValues[e]),o=this.normalizeRelationValue(this.initialValues[e]);if(this.deepEqual(i,o))continue;t[e]=i}return t}renderItems(r){return r.map((r=>{var e,t,o,s;if(r.type===d.SECTION)return i("fieldset",{class:"mrd-form__section"},r.label&&i("legend",{class:"mrd-form__section-legend"},r.label),i("div",{class:"mrd-form__section-body"},r.items&&this.renderItems(r.items)));if(r.type===d.GROUP)return i("div",{class:"mrd-form__group"},r.label&&i("div",{class:"mrd-form__group-label"},r.label),i("div",{class:"mrd-form__group-body"},r.items&&this.renderItems(r.items)));const m=null!==(s=null!==(t=null===(e=r.field)||void 0===e?void 0:e.name)&&void 0!==t?t:null===(o=r.relation)||void 0===o?void 0:o.name)&&void 0!==s?s:"";return i("div",{class:"mrd-form__field"},i("mrd-field",{item:r,locale:this.locale,value:this.formValues[m],onMrdChange:this.handleFieldChange,onMrdBlur:this.handleFieldChange,onMrdSearch:this.handleSearch,onMrdFetchAll:this.handleFetchAll,onMrdUpload:this.handleUpload}),this.errors[m]&&i("span",{class:"mrd-form__field-error"},this.errors[m]))}))}render(){if(!this.layout)return i(o,null);const r=this.locale.startsWith("ar")?"rtl":"ltr";return i(o,null,i("form",{class:"mrd-form",dir:r,onSubmit:this.handleSubmit,noValidate:!0},this.layout.title&&i("h2",{class:"mrd-form__title"},this.layout.title),i("div",{class:"mrd-form__body"},this.renderItems(this.layout.items)),i("div",{class:"mrd-form__footer"},i("button",{type:"submit",class:"mrd-form__submit"},l("submit",this.locale)),this.showCancel&&i("button",{type:"button",class:"mrd-form__cancel",onClick:()=>this.mrdCancel.emit()},l("cancel",this.locale)))))}static get watchers(){return{values:[{valuesChanged:0}]}}static get style(){return".sc-mrd-form-h{display:block}.mrd-form.sc-mrd-form{font-family:var(--mrd-font-family);width:100%}.mrd-form__title.sc-mrd-form{font-size:var(--mrd-font-size-2xl);font-weight:var(--mrd-font-weight-bold);color:var(--mrd-color-neutral-900);margin:0 0 var(--mrd-space-6) 0}.mrd-form__body.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-5)}.mrd-form__field.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-1)}.mrd-form__field-error.sc-mrd-form{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}.mrd-form__section.sc-mrd-form{border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius-md);padding:var(--mrd-space-4) var(--mrd-space-5);margin:0}.mrd-form__section-legend.sc-mrd-form{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-neutral-700);padding:0 var(--mrd-space-2)}.mrd-form__section-body.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-4);margin-top:var(--mrd-space-2)}.mrd-form__group.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-2)}.mrd-form__group-label.sc-mrd-form{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-neutral-500);text-transform:uppercase;letter-spacing:0.05em}.mrd-form__group-body.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-4);padding-left:var(--mrd-space-4);border-left:3px solid var(--mrd-color-neutral-200)}.mrd-form__footer.sc-mrd-form{margin-top:var(--mrd-space-8);padding-top:var(--mrd-space-5);border-top:var(--mrd-border-width) solid var(--mrd-border-color);display:flex;justify-content:flex-end;gap:var(--mrd-space-3)}.mrd-form__submit.sc-mrd-form{display:inline-flex;align-items:center;justify-content:center;height:var(--mrd-input-height);padding:0 var(--mrd-space-6);background-color:var(--mrd-color-primary);color:var(--mrd-color-white);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);font-weight:var(--mrd-font-weight-medium);border:none;border-radius:var(--mrd-border-radius);cursor:pointer;transition:background-color var(--mrd-transition)}.mrd-form__submit.sc-mrd-form:hover{background-color:var(--mrd-color-primary-hover)}.mrd-form__submit.sc-mrd-form:focus{outline:none;box-shadow:var(--mrd-shadow-focus)}.mrd-form__submit.sc-mrd-form:active{background-color:var(--mrd-color-primary-dark)}.mrd-form__cancel.sc-mrd-form{display:inline-flex;align-items:center;justify-content:center;height:var(--mrd-input-height);padding:0 var(--mrd-space-6);background-color:transparent;color:var(--mrd-color-neutral-600);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);font-weight:var(--mrd-font-weight-medium);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);cursor:pointer;transition:background-color var(--mrd-transition), color var(--mrd-transition)}.mrd-form__cancel.sc-mrd-form:hover{background-color:var(--mrd-color-neutral-100);color:var(--mrd-color-neutral-800)}.mrd-form__cancel.sc-mrd-form:focus{outline:none;box-shadow:var(--mrd-shadow-focus)}.mrd-form__cancel.sc-mrd-form:active{background-color:var(--mrd-color-neutral-200)}"}},[2,"mrd-form",{layout:[16],locale:[1],values:[16],referenceHref:[1,"reference-href"],referenceClass:[1,"reference-class"],showCancel:[4,"show-cancel"],formValues:[32],errors:[32],submitted:[32],setFieldValue:[64]},void 0,{values:[{valuesChanged:0}]}]),E=O,z=function(){"undefined"!=typeof customElements&&["mrd-form","mrd-boolean-field","mrd-currency-field","mrd-date-field","mrd-datetime-field","mrd-email-field","mrd-field","mrd-file-field","mrd-hyperlink-field","mrd-image-field","mrd-list-field","mrd-number-field","mrd-relation-field","mrd-text-field","mrd-textarea-field","mrd-time-field"].forEach((r=>{switch(r){case"mrd-form":customElements.get(s(r))||customElements.define(s(r),O);break;case"mrd-boolean-field":customElements.get(s(r))||n();break;case"mrd-currency-field":customElements.get(s(r))||c();break;case"mrd-date-field":customElements.get(s(r))||f();break;case"mrd-datetime-field":customElements.get(s(r))||u();break;case"mrd-email-field":customElements.get(s(r))||h();break;case"mrd-field":customElements.get(s(r))||v();break;case"mrd-file-field":customElements.get(s(r))||p();break;case"mrd-hyperlink-field":customElements.get(s(r))||b();break;case"mrd-image-field":customElements.get(s(r))||_();break;case"mrd-list-field":customElements.get(s(r))||g();break;case"mrd-number-field":customElements.get(s(r))||y();break;case"mrd-relation-field":customElements.get(s(r))||j();break;case"mrd-text-field":customElements.get(s(r))||k();break;case"mrd-textarea-field":customElements.get(s(r))||x();break;case"mrd-time-field":customElements.get(s(r))||w()}}))};export{E as MrdForm,z as defineCustomElement}
+import{proxyCustomElement as r,HTMLElement as e,createEvent as t,h as i,Host as o,transformTag as s}from"@stencil/core/internal/client";import{a as d,d as m}from"./client-layout.js";import{t as l}from"./i18n.js";import{v as a}from"./validation.js";import{d as n}from"./mrd-boolean-field2.js";import{d as c}from"./mrd-currency-field2.js";import{d as f}from"./mrd-date-field2.js";import{d as u}from"./mrd-datetime-field2.js";import{d as h}from"./mrd-email-field2.js";import{d as v}from"./mrd-field2.js";import{d as p}from"./mrd-file-field2.js";import{d as b}from"./mrd-hyperlink-field2.js";import{d as g}from"./mrd-image-field2.js";import{d as _}from"./mrd-list-field2.js";import{d as y}from"./mrd-longtext-field2.js";import{d as j}from"./mrd-number-field2.js";import{d as k}from"./mrd-relation-field2.js";import{d as x}from"./mrd-text-field2.js";import{d as w}from"./mrd-textarea-field2.js";import{d as O}from"./mrd-time-field2.js";const E=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdSubmit=t(this,"mrdSubmit",7),this.mrdCancel=t(this,"mrdCancel",7),this.mrdSearch=t(this,"mrdSearch",7),this.mrdFetchAll=t(this,"mrdFetchAll",7),this.mrdUpload=t(this,"mrdUpload",7),this.locale=navigator.language,this.values={},this.referenceHref="",this.referenceClass="",this.showCancel=!1,this.formValues={},this.errors={},this.submitted=!1,this.initialValues={},this.handleFieldChange=r=>{const{name:e,value:t}=r.detail,i=this.getHref(this.formValues[e]);this.formValues=Object.assign(Object.assign({},this.formValues),{[e]:t}),this.errors[e]&&(this.errors=Object.assign(Object.assign({},this.errors),{[e]:""}));const o=this.getHref(t);if(o!==i)for(const r of this.collectDependentDropdowns())r.commonRelation===e&&(this.formValues=Object.assign(Object.assign({},this.formValues),{[r.name]:null}),this.mrdFetchAll.emit({name:r.name,relatedClass:r.relatedClass,mostSignificantClass:r.mostSignificantClass,commonRelation:r.commonRelation,filter:r.commonRelation+"_href",filterValue:o}))},this.handleSearch=r=>{r.stopPropagation(),this.mrdSearch.emit(r.detail)},this.handleFetchAll=r=>{r.stopPropagation(),this.mrdFetchAll.emit(r.detail)},this.handleUpload=r=>{r.stopPropagation(),this.mrdUpload.emit(r.detail)},this.handleSubmit=r=>{r.preventDefault(),this.submitted=!0,this.validate()&&this.mrdSubmit.emit(this.buildSubmitPayload())}}componentWillLoad(){var r,e;this.initialValues=Object.assign({},null!==(r=this.values)&&void 0!==r?r:{}),this.formValues=Object.assign({},null!==(e=this.values)&&void 0!==e?e:{})}componentDidLoad(){setTimeout((()=>{this.applyReferenceValue(),this.emitDependentFetchAll()}),0)}valuesChanged(r){this.initialValues=Object.assign({},null!=r?r:{}),this.formValues=Object.assign({},null!=r?r:{}),this.applyReferenceValue(),this.errors={},this.submitted=!1,setTimeout((()=>this.emitDependentFetchAll()),0)}applyReferenceValue(){if(!this.referenceHref||!this.referenceClass)return;const r=this.resolveReferenceFieldName();r&&(this.formValues[r]||(this.formValues=Object.assign(Object.assign({},this.formValues),{[r]:this.referenceHref})))}resolveReferenceFieldName(){var r,e;const t=this.collectFields(null!==(e=null===(r=this.layout)||void 0===r?void 0:r.items)&&void 0!==e?e:[]),i=t.find((r=>{var e;return r.type===d.RELATION&&(null===(e=r.relation)||void 0===e?void 0:e.mostSignificantClass)===this.referenceClass}));if(null==i?void 0:i.relation)return i.relation.name;const o=new Set(t.filter((r=>r.type===d.RELATION)).map((r=>r.relation.name)));for(const r of t){const e=r.relation;if(r.type===d.RELATION&&(null==e?void 0:e.editBehavior)===m.DROPDOWN&&e.commonRelation&&!o.has(e.commonRelation))return e.commonRelation}return null}async setFieldValue(r,e){this.formValues=Object.assign(Object.assign({},this.formValues),{[r]:e}),this.errors[r]&&(this.errors=Object.assign(Object.assign({},this.errors),{[r]:""}))}collectDependentDropdowns(){var r,e;return this.collectFields(null!==(e=null===(r=this.layout)||void 0===r?void 0:r.items)&&void 0!==e?e:[]).filter((r=>{var e;return r.type===d.RELATION&&(null===(e=r.relation)||void 0===e?void 0:e.editBehavior)===m.DROPDOWN&&!!r.relation.commonRelation})).map((r=>r.relation))}emitDependentFetchAll(){for(const r of this.collectDependentDropdowns()){const e=this.getHref(this.formValues[r.commonRelation]);e&&this.mrdFetchAll.emit({name:r.name,relatedClass:r.relatedClass,mostSignificantClass:r.mostSignificantClass,commonRelation:r.commonRelation,filter:r.commonRelation+"_href",filterValue:e})}}getHref(r){return r?"string"==typeof r?r:"object"==typeof r&&"id"in r?r.id:"":""}collectFields(r){const e=[];for(const t of r)t.type!==d.FIELD&&t.type!==d.RELATION||e.push(t),t.items&&e.push(...this.collectFields(t.items));return e}validate(){var r,e,t;const i={},o=this.collectFields(null!==(e=null===(r=this.layout)||void 0===r?void 0:r.items)&&void 0!==e?e:[]);for(const r of o){const e=null!==(t=r.field)&&void 0!==t?t:r.relation;e&&e.required&&!a(this.formValues[e.name])&&(i[e.name]=l("required",this.locale))}return this.errors=i,0===Object.keys(i).length}normalizeFieldValue(r){return""===r||null==r?null:r}normalizeRelationValue(r){return null==r||""===r?null:"string"==typeof r?r||null:Array.isArray(r)?r.map((r=>"object"==typeof r&&null!==r&&"id"in r?r.id:r+"")):"object"==typeof r&&"id"in r&&r.id||null}deepEqual(r,e){if(r===e)return!0;if(null==r&&null==e)return!0;if(null==r||null==e)return!1;if(Array.isArray(r)&&Array.isArray(e)){if(r.length!==e.length)return!1;const t=[...r].sort(),i=[...e].sort();return JSON.stringify(t)===JSON.stringify(i)}return JSON.stringify(r)===JSON.stringify(e)}buildSubmitPayload(){var r,e;const t={},i=this.collectFields(null!==(e=null===(r=this.layout)||void 0===r?void 0:r.items)&&void 0!==e?e:[]);for(const r of i)if(r.type===d.FIELD&&r.field){const e=r.field.name,i=this.formValues[e];if(i instanceof File)continue;const o=this.normalizeFieldValue(i),s=this.normalizeFieldValue(this.initialValues[e]);if(this.deepEqual(o,s))continue;t[e]=o}else if(r.type===d.RELATION&&r.relation){const e=r.relation.name,i=this.normalizeRelationValue(this.formValues[e]),o=this.normalizeRelationValue(this.initialValues[e]);if(this.deepEqual(i,o))continue;t[e]=i}return t}renderItems(r){return r.map((r=>{var e,t,o,s;if(r.type===d.SECTION)return i("fieldset",{class:"mrd-form__section"},r.label&&i("legend",{class:"mrd-form__section-legend"},r.label),i("div",{class:"mrd-form__section-body"},r.items&&this.renderItems(r.items)));if(r.type===d.GROUP)return i("div",{class:"mrd-form__group"},r.label&&i("div",{class:"mrd-form__group-label"},r.label),i("div",{class:"mrd-form__group-body"},r.items&&this.renderItems(r.items)));const m=null!==(s=null!==(t=null===(e=r.field)||void 0===e?void 0:e.name)&&void 0!==t?t:null===(o=r.relation)||void 0===o?void 0:o.name)&&void 0!==s?s:"";return i("div",{class:"mrd-form__field"},i("mrd-field",{item:r,locale:this.locale,value:this.formValues[m],onMrdChange:this.handleFieldChange,onMrdBlur:this.handleFieldChange,onMrdSearch:this.handleSearch,onMrdFetchAll:this.handleFetchAll,onMrdUpload:this.handleUpload}),this.errors[m]&&i("span",{class:"mrd-form__field-error"},this.errors[m]))}))}render(){if(!this.layout)return i(o,null);const r=this.locale.startsWith("ar")?"rtl":"ltr";return i(o,null,i("form",{class:"mrd-form",dir:r,onSubmit:this.handleSubmit,noValidate:!0},this.layout.title&&i("h2",{class:"mrd-form__title"},this.layout.title),i("div",{class:"mrd-form__body"},this.renderItems(this.layout.items)),i("div",{class:"mrd-form__footer"},i("button",{type:"submit",class:"mrd-form__submit"},l("submit",this.locale)),this.showCancel&&i("button",{type:"button",class:"mrd-form__cancel",onClick:()=>this.mrdCancel.emit()},l("cancel",this.locale)))))}static get watchers(){return{values:[{valuesChanged:0}]}}static get style(){return".sc-mrd-form-h{display:block}.mrd-form.sc-mrd-form{font-family:var(--mrd-font-family);width:100%}.mrd-form__title.sc-mrd-form{font-size:var(--mrd-font-size-2xl);font-weight:var(--mrd-font-weight-bold);color:var(--mrd-color-neutral-900);margin:0 0 var(--mrd-space-6) 0}.mrd-form__body.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-5)}.mrd-form__field.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-1)}.mrd-form__field-error.sc-mrd-form{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}.mrd-form__section.sc-mrd-form{border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius-md);padding:var(--mrd-space-4) var(--mrd-space-5);margin:0}.mrd-form__section-legend.sc-mrd-form{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-neutral-700);padding:0 var(--mrd-space-2)}.mrd-form__section-body.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-4);margin-top:var(--mrd-space-2)}.mrd-form__group.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-2)}.mrd-form__group-label.sc-mrd-form{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-neutral-500);text-transform:uppercase;letter-spacing:0.05em}.mrd-form__group-body.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-4);padding-left:var(--mrd-space-4);border-left:3px solid var(--mrd-color-neutral-200)}.mrd-form__footer.sc-mrd-form{margin-top:var(--mrd-space-8);padding-top:var(--mrd-space-5);border-top:var(--mrd-border-width) solid var(--mrd-border-color);display:flex;justify-content:flex-end;gap:var(--mrd-space-3)}.mrd-form__submit.sc-mrd-form{display:inline-flex;align-items:center;justify-content:center;height:var(--mrd-input-height);padding:0 var(--mrd-space-6);background-color:var(--mrd-color-primary);color:var(--mrd-color-white);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);font-weight:var(--mrd-font-weight-medium);border:none;border-radius:var(--mrd-border-radius);cursor:pointer;transition:background-color var(--mrd-transition)}.mrd-form__submit.sc-mrd-form:hover{background-color:var(--mrd-color-primary-hover)}.mrd-form__submit.sc-mrd-form:focus{outline:none;box-shadow:var(--mrd-shadow-focus)}.mrd-form__submit.sc-mrd-form:active{background-color:var(--mrd-color-primary-dark)}.mrd-form__cancel.sc-mrd-form{display:inline-flex;align-items:center;justify-content:center;height:var(--mrd-input-height);padding:0 var(--mrd-space-6);background-color:transparent;color:var(--mrd-color-neutral-600);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);font-weight:var(--mrd-font-weight-medium);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);cursor:pointer;transition:background-color var(--mrd-transition), color var(--mrd-transition)}.mrd-form__cancel.sc-mrd-form:hover{background-color:var(--mrd-color-neutral-100);color:var(--mrd-color-neutral-800)}.mrd-form__cancel.sc-mrd-form:focus{outline:none;box-shadow:var(--mrd-shadow-focus)}.mrd-form__cancel.sc-mrd-form:active{background-color:var(--mrd-color-neutral-200)}"}},[2,"mrd-form",{layout:[16],locale:[1],values:[16],referenceHref:[1,"reference-href"],referenceClass:[1,"reference-class"],showCancel:[4,"show-cancel"],formValues:[32],errors:[32],submitted:[32],setFieldValue:[64]},void 0,{values:[{valuesChanged:0}]}]),z=E,C=function(){"undefined"!=typeof customElements&&["mrd-form","mrd-boolean-field","mrd-currency-field","mrd-date-field","mrd-datetime-field","mrd-email-field","mrd-field","mrd-file-field","mrd-hyperlink-field","mrd-image-field","mrd-list-field","mrd-longtext-field","mrd-number-field","mrd-relation-field","mrd-text-field","mrd-textarea-field","mrd-time-field"].forEach((r=>{switch(r){case"mrd-form":customElements.get(s(r))||customElements.define(s(r),E);break;case"mrd-boolean-field":customElements.get(s(r))||n();break;case"mrd-currency-field":customElements.get(s(r))||c();break;case"mrd-date-field":customElements.get(s(r))||f();break;case"mrd-datetime-field":customElements.get(s(r))||u();break;case"mrd-email-field":customElements.get(s(r))||h();break;case"mrd-field":customElements.get(s(r))||v();break;case"mrd-file-field":customElements.get(s(r))||p();break;case"mrd-hyperlink-field":customElements.get(s(r))||b();break;case"mrd-image-field":customElements.get(s(r))||g();break;case"mrd-list-field":customElements.get(s(r))||_();break;case"mrd-longtext-field":customElements.get(s(r))||y();break;case"mrd-number-field":customElements.get(s(r))||j();break;case"mrd-relation-field":customElements.get(s(r))||k();break;case"mrd-text-field":customElements.get(s(r))||x();break;case"mrd-textarea-field":customElements.get(s(r))||w();break;case"mrd-time-field":customElements.get(s(r))||O()}}))};export{z as MrdForm,C as defineCustomElement}

package/dist/components/mrd-longtext-field.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdLongtextField extends Components.MrdLongtextField, HTMLElement {}
+export const MrdLongtextField: {
+    prototype: MrdLongtextField;
+    new (): MrdLongtextField;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-longtext-field.js

@@ -0,0 +1 @@
+import{M as o,d as t}from"./mrd-longtext-field2.js";const r=o,s=t;export{r as MrdLongtextField,s as defineCustomElement}

package/dist/components/mrd-longtext-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as r,HTMLElement as e,createEvent as t,h as d,Host as o,transformTag as i}from"@stencil/core/internal/client";import{t as l}from"./i18n.js";import{v as a}from"./validation.js";const n=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=t(this,"mrdChange",7),this.mrdBlur=t(this,"mrdBlur",7),this.name="",this.label="",this.value="",this.placeholder="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.error="",this.handleInput=r=>{this.mrdChange.emit({name:this.name,value:r.target.value})},this.handleBlur=r=>{const e=r.target.value;this.error=this.required&&!a(e)?l("required",this.locale):"",this.mrdBlur.emit({name:this.name,value:e})}}render(){const r=!!this.error;return d(o,{key:"0b1764adfb7ddce8c5e645a5d96c69c715652365"},d("div",{key:"3c0c6bf77bfcd3f1bc97103baf9e5f6588f541f2",class:"mrd-longtext-field"},this.label&&d("label",{key:"f096b24c785a8c4b473fe0491a8cfdd7da4770bc",class:"mrd-longtext-field__label"+(this.required?" mrd-longtext-field__label--required":"")},this.label),this.disabled?d("pre",{class:"mrd-longtext-field__content"},this.value):d("textarea",{class:"mrd-longtext-field__input"+(r?" mrd-longtext-field__input--error":""),name:this.name,placeholder:this.placeholder,required:this.required,rows:10,onInput:this.handleInput,onBlur:this.handleBlur},this.value),r&&d("span",{key:"74b6bcecf81ca86172015abd5e3512ad288ae88e",class:"mrd-longtext-field__error"},this.error)))}static get style(){return".sc-mrd-longtext-field-h{display:block}.mrd-longtext-field.sc-mrd-longtext-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-longtext-field__label.sc-mrd-longtext-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-longtext-field__label--required.sc-mrd-longtext-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-longtext-field__input.sc-mrd-longtext-field{display:block;width:100%;min-height:calc(var(--mrd-input-height) * 5);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition);outline:none;resize:vertical;box-sizing:border-box;line-height:1.5}.mrd-longtext-field__input.sc-mrd-longtext-field::placeholder{color:var(--mrd-input-placeholder-color)}.mrd-longtext-field__input.sc-mrd-longtext-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-longtext-field__input--error.sc-mrd-longtext-field{border-color:var(--mrd-border-color-error)}.mrd-longtext-field__input--error.sc-mrd-longtext-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-longtext-field__content.sc-mrd-longtext-field{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);white-space:pre-wrap;word-break:break-word;margin:0;padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);background-color:var(--mrd-input-bg-disabled);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);line-height:1.5}.mrd-longtext-field__error.sc-mrd-longtext-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-longtext-field",{name:[1],label:[1],value:[1],placeholder:[1],required:[4],disabled:[4],locale:[1],error:[32]}]);function s(){"undefined"!=typeof customElements&&["mrd-longtext-field"].forEach((r=>{"mrd-longtext-field"===r&&(customElements.get(i(r))||customElements.define(i(r),n))}))}export{n as M,s as d}

package/dist/components/mrd-number-field2.js

@@ -1 +1 @@
-import{proxyCustomElement as r,HTMLElement as i,createEvent as e,h as d,Host as t,transformTag as s}from"@stencil/core/internal/client";import{t as o}from"./i18n.js";import{c as a,v as l}from"./validation.js";import{p as n,f as m}from"./format.js";import{b as c}from"./client-layout.js";const u=r(class extends i{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=e(this,"mrdChange",7),this.mrdBlur=e(this,"mrdBlur",7),this.name="",this.label="",this.value=null,this.placeholder="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.dataType=c.INTEGER,this.decimalPrecision=2,this.displayValue="",this.error="",this.handleInput=r=>{this.displayValue=r.target.value},this.handleBlur=r=>{const i=r.target.value,e=n(i,this.locale);this.error=!this.required||null!==e&&""!==i?""===i||a(e,this.dataType)?"":o("invalid_number",this.locale):o("required",this.locale),null!==e&&l(i)&&(this.displayValue=this.formatForDisplay(e)),this.mrdChange.emit({name:this.name,value:e}),this.mrdBlur.emit({name:this.name,value:e})},this.handleFocus=()=>{if(null!=this.value){const r=String(this.value);this.displayValue=r}}}componentWillLoad(){null!=this.value&&(this.displayValue=this.formatForDisplay(this.value))}formatForDisplay(r){return this.dataType===c.PERCENTAGE?m(r,this.locale,{minimumFractionDigits:0,maximumFractionDigits:this.decimalPrecision})+"%":m(r,this.locale,this.dataType===c.DECIMAL?{minimumFractionDigits:this.decimalPrecision,maximumFractionDigits:this.decimalPrecision}:{maximumFractionDigits:0})}render(){const r=!!this.error,i=this.dataType===c.PERCENTAGE?"%":"";return d(t,{key:"68d81012d9180dde4160a507121b83f04698834a"},d("div",{key:"b8e46f6d23527b2c95ad2738fc63a07adfce4fda",class:"mrd-number-field"},this.label&&d("label",{key:"c3271c7a8adfd8bcb3b4f51e580239f928a354a5",class:"mrd-number-field__label"+(this.required?" mrd-number-field__label--required":"")},this.label),d("div",{key:"c46b69affd1e22c539511f6743b6d23fe73fb079",class:"mrd-number-field__input-wrapper"},d("input",{key:"e68188829c2e03c947c5605332a2681de550a0d5",class:"mrd-number-field__input"+(r?" mrd-number-field__input--error":""),type:"text",inputMode:"decimal",name:this.name,value:this.displayValue,placeholder:this.placeholder||(i?`0${i}`:"0"),required:this.required,disabled:this.disabled,onInput:this.handleInput,onBlur:this.handleBlur,onFocus:this.handleFocus})),r&&d("span",{key:"bdc2723e2547517765bd64ad70c5103c7a2b363c",class:"mrd-number-field__error"},this.error)))}static get style(){return".sc-mrd-number-field-h{display:block}.mrd-number-field.sc-mrd-number-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-number-field__label.sc-mrd-number-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-number-field__label--required.sc-mrd-number-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-number-field__input-wrapper.sc-mrd-number-field{position:relative;display:flex;align-items:center}.mrd-number-field__input.sc-mrd-number-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition);outline:none;appearance:none;box-sizing:border-box;text-align:right}.mrd-number-field__input.sc-mrd-number-field::placeholder{color:var(--mrd-input-placeholder-color);text-align:left}.mrd-number-field__input.sc-mrd-number-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-number-field__input.sc-mrd-number-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-number-field__input--error.sc-mrd-number-field{border-color:var(--mrd-border-color-error)}.mrd-number-field__input--error.sc-mrd-number-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-number-field__error.sc-mrd-number-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-number-field",{name:[1],label:[1],value:[2],placeholder:[1],required:[4],disabled:[4],locale:[1],dataType:[1,"data-type"],decimalPrecision:[2,"decimal-precision"],displayValue:[32],error:[32]}]);function f(){"undefined"!=typeof customElements&&["mrd-number-field"].forEach((r=>{"mrd-number-field"===r&&(customElements.get(s(r))||customElements.define(s(r),u))}))}export{u as M,f as d}
+import{proxyCustomElement as r,HTMLElement as i,createEvent as e,h as d,Host as t,transformTag as s}from"@stencil/core/internal/client";import{t as o}from"./i18n.js";import{c as a,v as l}from"./validation.js";import{p as n,f as m}from"./format.js";import{b as c}from"./client-layout.js";const u=r(class extends i{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=e(this,"mrdChange",7),this.mrdBlur=e(this,"mrdBlur",7),this.name="",this.label="",this.value=null,this.placeholder="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.dataType=c.INTEGER,this.decimalPrecision=2,this.displayValue="",this.error="",this.handleInput=r=>{this.displayValue=r.target.value},this.handleBlur=r=>{const i=r.target.value,e=n(i,this.locale);this.error=!this.required||null!==e&&""!==i?""===i||a(e,this.dataType)?"":o("invalid_number",this.locale):o("required",this.locale),null!==e&&l(i)&&(this.displayValue=this.formatForDisplay(e)),this.mrdChange.emit({name:this.name,value:e}),this.mrdBlur.emit({name:this.name,value:e})},this.handleFocus=()=>{if(null!=this.value){const r=String(this.value);this.displayValue=r}}}componentWillLoad(){null!=this.value&&(this.displayValue=this.formatForDisplay(this.value))}formatForDisplay(r){return this.dataType===c.PERCENTAGE?m(r,this.locale,{minimumFractionDigits:0,maximumFractionDigits:this.decimalPrecision})+"%":m(r,this.locale,this.dataType===c.DECIMAL?{minimumFractionDigits:this.decimalPrecision,maximumFractionDigits:this.decimalPrecision}:{maximumFractionDigits:0})}render(){const r=!!this.error,i=this.dataType===c.PERCENTAGE?"%":"";return d(t,{key:"676e773fd4cc22936e64626b16e58c76f74ad8a7"},d("div",{key:"c646eab29793326f439d9838ecdab68249c487f1",class:"mrd-number-field"},this.label&&d("label",{key:"fb4fdac8f71b513fed52262ed8f5b5a5258f8f0b",class:"mrd-number-field__label"+(this.required?" mrd-number-field__label--required":"")},this.label),d("div",{key:"5f7540318761da01f9793430ca709ba014204a11",class:"mrd-number-field__input-wrapper"},d("input",{key:"a102a89f9b7d91b29cf65afd5772552002d4c4cc",class:"mrd-number-field__input"+(r?" mrd-number-field__input--error":""),type:"text",inputMode:"decimal",name:this.name,value:this.displayValue,placeholder:this.placeholder||(i?`0${i}`:"0"),required:this.required,disabled:this.disabled,onInput:this.handleInput,onBlur:this.handleBlur,onFocus:this.handleFocus})),r&&d("span",{key:"eb00631f61d2c9ee6a94343a0c79847a21e8316c",class:"mrd-number-field__error"},this.error)))}static get style(){return".sc-mrd-number-field-h{display:block}.mrd-number-field.sc-mrd-number-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-number-field__label.sc-mrd-number-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-number-field__label--required.sc-mrd-number-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-number-field__input-wrapper.sc-mrd-number-field{position:relative;display:flex;align-items:center}.mrd-number-field__input.sc-mrd-number-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition);outline:none;appearance:none;box-sizing:border-box;text-align:right}.mrd-number-field__input.sc-mrd-number-field::placeholder{color:var(--mrd-input-placeholder-color);text-align:left}.mrd-number-field__input.sc-mrd-number-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-number-field__input.sc-mrd-number-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-number-field__input--error.sc-mrd-number-field{border-color:var(--mrd-border-color-error)}.mrd-number-field__input--error.sc-mrd-number-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-number-field__error.sc-mrd-number-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-number-field",{name:[1],label:[1],value:[2],placeholder:[1],required:[4],disabled:[4],locale:[1],dataType:[1,"data-type"],decimalPrecision:[2,"decimal-precision"],displayValue:[32],error:[32]}]);function f(){"undefined"!=typeof customElements&&["mrd-number-field"].forEach((r=>{"mrd-number-field"===r&&(customElements.get(s(r))||customElements.define(s(r),u))}))}export{u as M,f as d}

package/dist/components/mrd-relation-field2.js

@@ -1 +1 @@
-import{proxyCustomElement as r,HTMLElement as e,createEvent as i,h as t,Host as l,transformTag as o}from"@stencil/core/internal/client";import{t as s}from"./i18n.js";import{v as a}from"./validation.js";import{c as d,d as n}from"./client-layout.js";const m=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=i(this,"mrdChange",7),this.mrdBlur=i(this,"mrdBlur",7),this.mrdSearch=i(this,"mrdSearch",7),this.mrdFetchAll=i(this,"mrdFetchAll",7),this.name="",this.label="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.relatedClass="",this.mostSignificantClass="",this.displayType=d.SEARCH,this.multiple=!1,this.dropdownValues=[],this.value=null,this.searchQuery="",this.searchResults=[],this.allRecords=[],this.isLoading=!1,this.selectedItems=[],this.showResults=!1,this.error="",this.highlightedIndex=-1,this.searchDebounce=null,this.handleKeyDown=r=>{this.showResults&&0!==this.searchResults.length?"ArrowDown"===r.key?(r.preventDefault(),this.highlightedIndex=Math.min(this.highlightedIndex+1,this.searchResults.length-1)):"ArrowUp"===r.key?(r.preventDefault(),this.highlightedIndex=Math.max(this.highlightedIndex-1,0)):"Enter"===r.key?(r.preventDefault(),this.highlightedIndex>=0&&this.handleResultSelect(this.searchResults[this.highlightedIndex])):"Escape"===r.key&&(this.showResults=!1,this.highlightedIndex=-1):"Escape"===r.key&&(this.showResults=!1,this.highlightedIndex=-1)},this.clearSelection=()=>{this.selectedItems=[],this.searchQuery="",this.searchResults=[],this.showResults=!1,this.highlightedIndex=-1,this.mrdChange.emit({name:this.name,value:this.multiple?[]:null})},this.handleSearchInput=r=>{const e=r.target.value;this.searchQuery=e,this.searchDebounce&&clearTimeout(this.searchDebounce),e.trim().length>=2?(this.isLoading=!0,this.showResults=!0,this.searchDebounce=setTimeout((()=>{this.mrdSearch.emit({name:this.name,query:e,relatedClass:this.mostSignificantClass})}),300)):(this.searchResults=[],this.showResults=!1,this.isLoading=!1)},this.handleResultSelect=r=>{if(this.multiple){this.selectedItems.find((e=>e.id===r.id))||(this.selectedItems=[...this.selectedItems,r]),this.searchQuery="",this.searchResults=[],this.showResults=!1;const e=this.selectedItems.map((r=>r.id));this.mrdChange.emit({name:this.name,value:e})}else this.selectedItems=[r],this.searchQuery=r.label,this.showResults=!1,this.mrdChange.emit({name:this.name,value:r.id});this.error=this.required&&!a(this.selectedItems)?s("required",this.locale):""},this.handleRemoveSelected=r=>{this.selectedItems=this.selectedItems.filter((e=>e.id!==r));const e=this.selectedItems.map((r=>r.id));this.mrdChange.emit({name:this.name,value:this.multiple?e:null})},this.handleDropdownChange=r=>{const e=r.target.value;this.error=this.required&&!a(e)?s("required",this.locale):"",this.mrdChange.emit({name:this.name,value:e})},this.handleBlur=()=>{var r,e;setTimeout((()=>{this.showResults=!1,this.highlightedIndex=-1}),200);const i=this.multiple?this.selectedItems.map((r=>r.id)):null!==(e=null===(r=this.selectedItems[0])||void 0===r?void 0:r.id)&&void 0!==e?e:null;this.mrdBlur.emit({name:this.name,value:i})}}async setAllRecords(r){this.allRecords=r}allRecordsChanged(){var r,e,i;if(this.editBehavior!==n.DROPDOWN)return;const t=null===(r=this.el)||void 0===r?void 0:r.querySelector("select");if(!t)return;const l=Array.isArray(this.value)?null!==(e=this.value[0])&&void 0!==e?e:"":null!==(i=this.value)&&void 0!==i?i:"";l&&(t.value=l)}async setSearchResults(r){this.searchResults=r,this.isLoading=!1,this.showResults=!0,this.highlightedIndex=-1}async setLoading(r){this.isLoading=r}componentWillLoad(){var r;this.value&&(Array.isArray(this.value)?this.value.length>0&&"object"==typeof this.value[0]&&(this.selectedItems=this.value,this.searchQuery=""):"object"==typeof this.value&&(this.selectedItems=[this.value],this.searchQuery=null!==(r=this.value.label)&&void 0!==r?r:""))}componentDidLoad(){this.editBehavior!==n.DROPDOWN||this.commonRelation||setTimeout((()=>{this.mrdFetchAll.emit({name:this.name,relatedClass:this.relatedClass,mostSignificantClass:this.mostSignificantClass||void 0})}),0)}render(){var r,e,i,o;const a=!!this.error;if(this.editBehavior===n.DROPDOWN){const i=Array.isArray(this.value)?null!==(r=this.value[0])&&void 0!==r?r:"":null!==(e=this.value)&&void 0!==e?e:"";return t(l,null,t("div",{class:"mrd-relation-field"},this.label&&t("label",{class:"mrd-relation-field__label"+(this.required?" mrd-relation-field__label--required":"")},this.label),t("select",{class:"mrd-relation-field__select"+(a?" mrd-relation-field__select--error":""),name:this.name,required:this.required,disabled:this.disabled,onChange:this.handleDropdownChange},t("option",{value:""},s("select_placeholder",this.locale)),this.allRecords.map((r=>t("option",{key:r.id,value:r.id,selected:r.id===i},r.label)))),a&&t("span",{class:"mrd-relation-field__error"},this.error)))}if(this.displayType===d.DROPDOWN){const r=Array.isArray(this.value)?null!==(i=this.value[0])&&void 0!==i?i:"":null!==(o=this.value)&&void 0!==o?o:"";return t(l,null,t("div",{class:"mrd-relation-field"},this.label&&t("label",{class:"mrd-relation-field__label"+(this.required?" mrd-relation-field__label--required":"")},this.label),t("select",{class:"mrd-relation-field__select"+(a?" mrd-relation-field__select--error":""),name:this.name,required:this.required,disabled:this.disabled,onChange:this.handleDropdownChange},t("option",{value:""},s("select_placeholder",this.locale)),this.dropdownValues.map((e=>t("option",{key:e.key,value:e.key,selected:e.key===r},e.label)))),a&&t("span",{class:"mrd-relation-field__error"},this.error)))}const m=this.label&&t("label",{class:"mrd-relation-field__label"+(this.required?" mrd-relation-field__label--required":"")},this.label);return t(l,null,!this.multiple&&this.selectedItems.length>0?t("div",{class:"mrd-relation-field"},m,t("div",{class:"mrd-relation-field__selected-value"+(a?" mrd-relation-field__selected-value--error":"")},t("span",{class:"mrd-relation-field__selected-name"},this.selectedItems[0].label),t("button",{type:"button",class:"mrd-relation-field__selected-clear",onClick:this.clearSelection,"aria-label":s("remove",this.locale)},"✕")),a&&t("span",{class:"mrd-relation-field__error"},this.error)):t("div",{class:"mrd-relation-field"},m,this.multiple&&this.selectedItems.length>0&&t("div",{class:"mrd-relation-field__tags"},this.selectedItems.map((r=>t("span",{key:r.id,class:"mrd-relation-field__tag"},r.label,t("button",{type:"button",class:"mrd-relation-field__tag-remove",onClick:()=>this.handleRemoveSelected(r.id),"aria-label":s("remove",this.locale)},"✕"))))),t("div",{class:"mrd-relation-field__search-wrapper"},t("input",{class:"mrd-relation-field__search"+(a?" mrd-relation-field__search--error":""),type:"text",value:this.searchQuery,placeholder:s("search_placeholder",this.locale),disabled:this.disabled,onInput:this.handleSearchInput,onKeyDown:this.handleKeyDown,onBlur:this.handleBlur}),this.isLoading&&t("span",{class:"mrd-relation-field__spinner","aria-label":s("loading",this.locale)})),this.showResults&&t("div",{class:"mrd-relation-field__results"},0!==this.searchResults.length||this.isLoading?this.searchResults.map(((r,e)=>t("div",{key:r.id,class:"mrd-relation-field__result-item"+(e===this.highlightedIndex?" mrd-relation-field__result-item--highlighted":""),onMouseDown:()=>this.handleResultSelect(r)},t("span",{class:"mrd-relation-field__result-label"},r.label),r.description&&t("span",{class:"mrd-relation-field__result-desc"},r.description)))):t("div",{class:"mrd-relation-field__no-results"},s("no_results",this.locale))),a&&t("span",{class:"mrd-relation-field__error"},this.error)))}get el(){return this}static get watchers(){return{allRecords:[{allRecordsChanged:0}]}}static get style(){return".sc-mrd-relation-field-h{display:block}.mrd-relation-field.sc-mrd-relation-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%;position:relative}.mrd-relation-field__label.sc-mrd-relation-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-relation-field__label--required.sc-mrd-relation-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-relation-field__select.sc-mrd-relation-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);padding-right:calc(var(--mrd-input-padding-x) + 1.5rem);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right var(--mrd-space-3) center;border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);outline:none;appearance:none;cursor:pointer;box-sizing:border-box}.mrd-relation-field__select.sc-mrd-relation-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-relation-field__select.sc-mrd-relation-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-relation-field__select--error.sc-mrd-relation-field{border-color:var(--mrd-border-color-error)}.mrd-relation-field__select--error.sc-mrd-relation-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-relation-field__tags.sc-mrd-relation-field{display:flex;flex-wrap:wrap;gap:var(--mrd-space-1);margin-bottom:var(--mrd-space-1)}.mrd-relation-field__tag.sc-mrd-relation-field{display:inline-flex;align-items:center;gap:var(--mrd-space-1);padding:var(--mrd-space-1) var(--mrd-space-2);background-color:var(--mrd-color-primary-light);color:var(--mrd-color-primary-dark);border-radius:var(--mrd-border-radius-full);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-medium)}.mrd-relation-field__tag-remove.sc-mrd-relation-field{background:none;border:none;cursor:pointer;color:var(--mrd-color-primary-dark);font-size:var(--mrd-font-size-xs);padding:0;line-height:1;opacity:0.7}.mrd-relation-field__tag-remove.sc-mrd-relation-field:hover{opacity:1}.mrd-relation-field__search-wrapper.sc-mrd-relation-field{position:relative;display:flex;align-items:center}.mrd-relation-field__search.sc-mrd-relation-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);outline:none;appearance:none;box-sizing:border-box}.mrd-relation-field__search.sc-mrd-relation-field::placeholder{color:var(--mrd-input-placeholder-color)}.mrd-relation-field__search.sc-mrd-relation-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-relation-field__search.sc-mrd-relation-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-relation-field__search--error.sc-mrd-relation-field{border-color:var(--mrd-border-color-error)}.mrd-relation-field__search--error.sc-mrd-relation-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-relation-field__spinner.sc-mrd-relation-field{position:absolute;right:var(--mrd-space-3);width:16px;height:16px;border:2px solid var(--mrd-color-neutral-200);border-top-color:var(--mrd-color-primary);border-radius:50%;animation:mrd-spin 0.7s linear infinite}@keyframes mrd-spin{to{transform:rotate(360deg)}}.mrd-relation-field__results.sc-mrd-relation-field{position:absolute;top:calc(100% + var(--mrd-space-1));left:0;right:0;background-color:var(--mrd-color-white);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);box-shadow:var(--mrd-shadow-md);z-index:var(--mrd-z-dropdown);max-height:240px;overflow-y:auto}.mrd-relation-field__result-item.sc-mrd-relation-field{display:flex;flex-direction:column;padding:var(--mrd-space-2) var(--mrd-space-3);cursor:pointer;transition:background-color var(--mrd-transition-fast)}.mrd-relation-field__result-item.sc-mrd-relation-field:hover{background-color:var(--mrd-color-neutral-50)}.mrd-relation-field__result-item.sc-mrd-relation-field:not(:last-child){border-bottom:var(--mrd-border-width) solid var(--mrd-color-neutral-100)}.mrd-relation-field__result-label.sc-mrd-relation-field{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-color-neutral-800);font-weight:var(--mrd-font-weight-medium)}.mrd-relation-field__result-desc.sc-mrd-relation-field{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-xs);color:var(--mrd-color-neutral-500);margin-top:var(--mrd-space-1)}.mrd-relation-field__result-item--highlighted.sc-mrd-relation-field{background-color:var(--mrd-color-primary-light)}.mrd-relation-field__selected-value.sc-mrd-relation-field{display:flex;align-items:center;gap:var(--mrd-space-2);height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);background-color:var(--mrd-color-primary-light);border:var(--mrd-border-width) solid var(--mrd-color-primary);border-radius:var(--mrd-border-radius);box-sizing:border-box}.mrd-relation-field__selected-value--error.sc-mrd-relation-field{border-color:var(--mrd-border-color-error);background-color:var(--mrd-color-danger-light)}.mrd-relation-field__selected-name.sc-mrd-relation-field{flex:1;font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);font-weight:var(--mrd-font-weight-medium);color:var(--mrd-color-primary-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mrd-relation-field__selected-clear.sc-mrd-relation-field{flex-shrink:0;background:none;border:none;cursor:pointer;color:var(--mrd-color-primary-dark);font-size:var(--mrd-font-size-sm);padding:0;line-height:1;opacity:0.6;transition:opacity var(--mrd-transition-fast)}.mrd-relation-field__selected-clear.sc-mrd-relation-field:hover{opacity:1}.mrd-relation-field__no-results.sc-mrd-relation-field{padding:var(--mrd-space-4);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-500);text-align:center}.mrd-relation-field__error.sc-mrd-relation-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-relation-field",{name:[1],label:[1],required:[4],disabled:[4],locale:[1],relatedClass:[1,"related-class"],mostSignificantClass:[1,"most-significant-class"],displayType:[1,"display-type"],editBehavior:[1,"edit-behavior"],commonRelation:[1,"common-relation"],multiple:[4],dropdownValues:[16],value:[1],searchQuery:[32],searchResults:[32],allRecords:[32],isLoading:[32],selectedItems:[32],showResults:[32],error:[32],highlightedIndex:[32],setAllRecords:[64],setSearchResults:[64],setLoading:[64]},void 0,{allRecords:[{allRecordsChanged:0}]}]);function h(){"undefined"!=typeof customElements&&["mrd-relation-field"].forEach((r=>{"mrd-relation-field"===r&&(customElements.get(o(r))||customElements.define(o(r),m))}))}export{m as M,h as d}
+import{proxyCustomElement as r,HTMLElement as e,createEvent as i,h as t,Host as l,transformTag as o}from"@stencil/core/internal/client";import{t as s}from"./i18n.js";import{v as a}from"./validation.js";import{c as d,d as n}from"./client-layout.js";const m=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=i(this,"mrdChange",7),this.mrdBlur=i(this,"mrdBlur",7),this.mrdSearch=i(this,"mrdSearch",7),this.mrdFetchAll=i(this,"mrdFetchAll",7),this.name="",this.label="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.relatedClass="",this.mostSignificantClass="",this.displayType=d.SEARCH,this.multiple=!1,this.dropdownValues=[],this.value=null,this.searchQuery="",this.searchResults=[],this.allRecords=[],this.isLoading=!1,this.selectedItems=[],this.showResults=!1,this.error="",this.highlightedIndex=-1,this.searchDebounce=null,this.handleKeyDown=r=>{this.showResults&&0!==this.searchResults.length?"ArrowDown"===r.key?(r.preventDefault(),this.highlightedIndex=Math.min(this.highlightedIndex+1,this.searchResults.length-1)):"ArrowUp"===r.key?(r.preventDefault(),this.highlightedIndex=Math.max(this.highlightedIndex-1,0)):"Enter"===r.key?(r.preventDefault(),this.highlightedIndex>=0&&this.handleResultSelect(this.searchResults[this.highlightedIndex])):"Escape"===r.key&&(this.showResults=!1,this.highlightedIndex=-1):"Escape"===r.key&&(this.showResults=!1,this.highlightedIndex=-1)},this.clearSelection=()=>{this.selectedItems=[],this.searchQuery="",this.searchResults=[],this.showResults=!1,this.highlightedIndex=-1,this.mrdChange.emit({name:this.name,value:this.multiple?[]:null})},this.handleSearchInput=r=>{const e=r.target.value;this.searchQuery=e,this.searchDebounce&&clearTimeout(this.searchDebounce),e.trim().length>=2?(this.isLoading=!0,this.showResults=!0,this.searchDebounce=setTimeout((()=>{this.mrdSearch.emit({name:this.name,query:e,relatedClass:this.mostSignificantClass})}),300)):(this.searchResults=[],this.showResults=!1,this.isLoading=!1)},this.handleResultSelect=r=>{if(this.multiple){this.selectedItems.find((e=>e.id===r.id))||(this.selectedItems=[...this.selectedItems,r]),this.searchQuery="",this.searchResults=[],this.showResults=!1;const e=this.selectedItems.map((r=>r.id));this.mrdChange.emit({name:this.name,value:e})}else this.selectedItems=[r],this.searchQuery=r.label,this.showResults=!1,this.mrdChange.emit({name:this.name,value:r.id});this.error=this.required&&!a(this.selectedItems)?s("required",this.locale):""},this.handleRemoveSelected=r=>{this.selectedItems=this.selectedItems.filter((e=>e.id!==r));const e=this.selectedItems.map((r=>r.id));this.mrdChange.emit({name:this.name,value:this.multiple?e:null})},this.handleDropdownChange=r=>{const e=r.target.value;this.error=this.required&&!a(e)?s("required",this.locale):"",this.mrdChange.emit({name:this.name,value:e})},this.handleBlur=()=>{var r,e;setTimeout((()=>{this.showResults=!1,this.highlightedIndex=-1}),200);const i=this.multiple?this.selectedItems.map((r=>r.id)):null!==(e=null===(r=this.selectedItems[0])||void 0===r?void 0:r.id)&&void 0!==e?e:null;this.mrdBlur.emit({name:this.name,value:i})}}async setAllRecords(r){this.allRecords=r}getValueHref(){var r,e,i;const t=Array.isArray(this.value)?null!==(r=this.value[0])&&void 0!==r?r:"":null!==(e=this.value)&&void 0!==e?e:"";return t?"object"==typeof t?null!==(i=t.id)&&void 0!==i?i:"":t:""}allRecordsChanged(){if(this.editBehavior!==n.DROPDOWN)return;const r=this.getValueHref();r&&setTimeout((()=>{var e;const i=null===(e=this.el)||void 0===e?void 0:e.querySelector("select");i&&(i.value=r)}),0)}async setSearchResults(r){this.searchResults=r,this.isLoading=!1,this.showResults=!0,this.highlightedIndex=-1}async setLoading(r){this.isLoading=r}componentWillLoad(){var r;this.value&&(Array.isArray(this.value)?this.value.length>0&&"object"==typeof this.value[0]&&(this.selectedItems=this.value,this.searchQuery=""):"object"==typeof this.value&&(this.selectedItems=[this.value],this.searchQuery=null!==(r=this.value.label)&&void 0!==r?r:""))}componentDidLoad(){this.editBehavior!==n.DROPDOWN||this.commonRelation||setTimeout((()=>{this.mrdFetchAll.emit({name:this.name,relatedClass:this.relatedClass,mostSignificantClass:this.mostSignificantClass||void 0})}),0)}render(){var r,e;const i=!!this.error;if(this.editBehavior===n.DROPDOWN){const r=this.getValueHref();return t(l,null,t("div",{class:"mrd-relation-field"},this.label&&t("label",{class:"mrd-relation-field__label"+(this.required?" mrd-relation-field__label--required":"")},this.label),t("select",{class:"mrd-relation-field__select"+(i?" mrd-relation-field__select--error":""),name:this.name,required:this.required,disabled:this.disabled,onChange:this.handleDropdownChange},t("option",{value:""},s("select_placeholder",this.locale)),this.allRecords.map((e=>t("option",{key:e.id,value:e.id,selected:e.id===r},e.label)))),i&&t("span",{class:"mrd-relation-field__error"},this.error)))}if(this.displayType===d.DROPDOWN){const o=Array.isArray(this.value)?null!==(r=this.value[0])&&void 0!==r?r:"":null!==(e=this.value)&&void 0!==e?e:"";return t(l,null,t("div",{class:"mrd-relation-field"},this.label&&t("label",{class:"mrd-relation-field__label"+(this.required?" mrd-relation-field__label--required":"")},this.label),t("select",{class:"mrd-relation-field__select"+(i?" mrd-relation-field__select--error":""),name:this.name,required:this.required,disabled:this.disabled,onChange:this.handleDropdownChange},t("option",{value:""},s("select_placeholder",this.locale)),this.dropdownValues.map((r=>t("option",{key:r.key,value:r.key,selected:r.key===o},r.label)))),i&&t("span",{class:"mrd-relation-field__error"},this.error)))}const o=this.label&&t("label",{class:"mrd-relation-field__label"+(this.required?" mrd-relation-field__label--required":"")},this.label);return t(l,null,!this.multiple&&this.selectedItems.length>0?t("div",{class:"mrd-relation-field"},o,t("div",{class:"mrd-relation-field__selected-value"+(i?" mrd-relation-field__selected-value--error":"")},t("span",{class:"mrd-relation-field__selected-name"},this.selectedItems[0].label),t("button",{type:"button",class:"mrd-relation-field__selected-clear",onClick:this.clearSelection,"aria-label":s("remove",this.locale)},"✕")),i&&t("span",{class:"mrd-relation-field__error"},this.error)):t("div",{class:"mrd-relation-field"},o,this.multiple&&this.selectedItems.length>0&&t("div",{class:"mrd-relation-field__tags"},this.selectedItems.map((r=>t("span",{key:r.id,class:"mrd-relation-field__tag"},r.label,t("button",{type:"button",class:"mrd-relation-field__tag-remove",onClick:()=>this.handleRemoveSelected(r.id),"aria-label":s("remove",this.locale)},"✕"))))),t("div",{class:"mrd-relation-field__search-wrapper"},t("input",{class:"mrd-relation-field__search"+(i?" mrd-relation-field__search--error":""),type:"text",value:this.searchQuery,placeholder:s("search_placeholder",this.locale),disabled:this.disabled,onInput:this.handleSearchInput,onKeyDown:this.handleKeyDown,onBlur:this.handleBlur}),this.isLoading&&t("span",{class:"mrd-relation-field__spinner","aria-label":s("loading",this.locale)})),this.showResults&&t("div",{class:"mrd-relation-field__results"},0!==this.searchResults.length||this.isLoading?this.searchResults.map(((r,e)=>t("div",{key:r.id,class:"mrd-relation-field__result-item"+(e===this.highlightedIndex?" mrd-relation-field__result-item--highlighted":""),onMouseDown:()=>this.handleResultSelect(r)},t("span",{class:"mrd-relation-field__result-label"},r.label),r.description&&t("span",{class:"mrd-relation-field__result-desc"},r.description)))):t("div",{class:"mrd-relation-field__no-results"},s("no_results",this.locale))),i&&t("span",{class:"mrd-relation-field__error"},this.error)))}get el(){return this}static get watchers(){return{allRecords:[{allRecordsChanged:0}]}}static get style(){return".sc-mrd-relation-field-h{display:block}.mrd-relation-field.sc-mrd-relation-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%;position:relative}.mrd-relation-field__label.sc-mrd-relation-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-relation-field__label--required.sc-mrd-relation-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-relation-field__select.sc-mrd-relation-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);padding-right:calc(var(--mrd-input-padding-x) + 1.5rem);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right var(--mrd-space-3) center;border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);outline:none;appearance:none;cursor:pointer;box-sizing:border-box}.mrd-relation-field__select.sc-mrd-relation-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-relation-field__select.sc-mrd-relation-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-relation-field__select--error.sc-mrd-relation-field{border-color:var(--mrd-border-color-error)}.mrd-relation-field__select--error.sc-mrd-relation-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-relation-field__tags.sc-mrd-relation-field{display:flex;flex-wrap:wrap;gap:var(--mrd-space-1);margin-bottom:var(--mrd-space-1)}.mrd-relation-field__tag.sc-mrd-relation-field{display:inline-flex;align-items:center;gap:var(--mrd-space-1);padding:var(--mrd-space-1) var(--mrd-space-2);background-color:var(--mrd-color-primary-light);color:var(--mrd-color-primary-dark);border-radius:var(--mrd-border-radius-full);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-medium)}.mrd-relation-field__tag-remove.sc-mrd-relation-field{background:none;border:none;cursor:pointer;color:var(--mrd-color-primary-dark);font-size:var(--mrd-font-size-xs);padding:0;line-height:1;opacity:0.7}.mrd-relation-field__tag-remove.sc-mrd-relation-field:hover{opacity:1}.mrd-relation-field__search-wrapper.sc-mrd-relation-field{position:relative;display:flex;align-items:center}.mrd-relation-field__search.sc-mrd-relation-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);outline:none;appearance:none;box-sizing:border-box}.mrd-relation-field__search.sc-mrd-relation-field::placeholder{color:var(--mrd-input-placeholder-color)}.mrd-relation-field__search.sc-mrd-relation-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-relation-field__search.sc-mrd-relation-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-relation-field__search--error.sc-mrd-relation-field{border-color:var(--mrd-border-color-error)}.mrd-relation-field__search--error.sc-mrd-relation-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-relation-field__spinner.sc-mrd-relation-field{position:absolute;right:var(--mrd-space-3);width:16px;height:16px;border:2px solid var(--mrd-color-neutral-200);border-top-color:var(--mrd-color-primary);border-radius:50%;animation:mrd-spin 0.7s linear infinite}@keyframes mrd-spin{to{transform:rotate(360deg)}}.mrd-relation-field__results.sc-mrd-relation-field{position:absolute;top:calc(100% + var(--mrd-space-1));left:0;right:0;background-color:var(--mrd-color-white);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);box-shadow:var(--mrd-shadow-md);z-index:var(--mrd-z-dropdown);max-height:240px;overflow-y:auto}.mrd-relation-field__result-item.sc-mrd-relation-field{display:flex;flex-direction:column;padding:var(--mrd-space-2) var(--mrd-space-3);cursor:pointer;transition:background-color var(--mrd-transition-fast)}.mrd-relation-field__result-item.sc-mrd-relation-field:hover{background-color:var(--mrd-color-neutral-50)}.mrd-relation-field__result-item.sc-mrd-relation-field:not(:last-child){border-bottom:var(--mrd-border-width) solid var(--mrd-color-neutral-100)}.mrd-relation-field__result-label.sc-mrd-relation-field{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-color-neutral-800);font-weight:var(--mrd-font-weight-medium)}.mrd-relation-field__result-desc.sc-mrd-relation-field{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-xs);color:var(--mrd-color-neutral-500);margin-top:var(--mrd-space-1)}.mrd-relation-field__result-item--highlighted.sc-mrd-relation-field{background-color:var(--mrd-color-primary-light)}.mrd-relation-field__selected-value.sc-mrd-relation-field{display:flex;align-items:center;gap:var(--mrd-space-2);height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);background-color:var(--mrd-color-primary-light);border:var(--mrd-border-width) solid var(--mrd-color-primary);border-radius:var(--mrd-border-radius);box-sizing:border-box}.mrd-relation-field__selected-value--error.sc-mrd-relation-field{border-color:var(--mrd-border-color-error);background-color:var(--mrd-color-danger-light)}.mrd-relation-field__selected-name.sc-mrd-relation-field{flex:1;font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);font-weight:var(--mrd-font-weight-medium);color:var(--mrd-color-primary-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mrd-relation-field__selected-clear.sc-mrd-relation-field{flex-shrink:0;background:none;border:none;cursor:pointer;color:var(--mrd-color-primary-dark);font-size:var(--mrd-font-size-sm);padding:0;line-height:1;opacity:0.6;transition:opacity var(--mrd-transition-fast)}.mrd-relation-field__selected-clear.sc-mrd-relation-field:hover{opacity:1}.mrd-relation-field__no-results.sc-mrd-relation-field{padding:var(--mrd-space-4);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-500);text-align:center}.mrd-relation-field__error.sc-mrd-relation-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-relation-field",{name:[1],label:[1],required:[4],disabled:[4],locale:[1],relatedClass:[1,"related-class"],mostSignificantClass:[1,"most-significant-class"],displayType:[1,"display-type"],editBehavior:[1,"edit-behavior"],commonRelation:[1,"common-relation"],multiple:[4],dropdownValues:[16],value:[1],searchQuery:[32],searchResults:[32],allRecords:[32],isLoading:[32],selectedItems:[32],showResults:[32],error:[32],highlightedIndex:[32],setAllRecords:[64],setSearchResults:[64],setLoading:[64]},void 0,{allRecords:[{allRecordsChanged:0}]}]);function h(){"undefined"!=typeof customElements&&["mrd-relation-field"].forEach((r=>{"mrd-relation-field"===r&&(customElements.get(o(r))||customElements.define(o(r),m))}))}export{m as M,h as d}