@mmlogic/components 0.1.7 → 0.1.9

package/dist/cjs/loader.cjs.js

@@ -6,7 +6,7 @@ var appGlobals = require('./app-globals-V2Kpy_OQ.js');
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["mrd-table.cjs",[[2,"mrd-table",{"columns":[16],"rows":[16],"locale":[1],"totalElements":[2,"total-elements"],"pageSize":[2,"page-size"],"rowHeight":[2,"row-height"],"tableHeight":[2,"table-height"],"defaultSort":[1,"default-sort"],"loadedPages":[32],"requestedPages":[32],"renderStart":[32],"renderEnd":[32],"colWidths":[32],"sortField":[32],"sortDir":[32],"init":[64],"setPage":[64]}]]],["mrd-boolean-field_16.cjs",[[2,"mrd-form",{"layout":[16],"locale":[1],"values":[16],"formValues":[32],"errors":[32],"submitted":[32],"setFieldValue":[64]},null,{"values":[{"valuesChanged":0}]}],[2,"mrd-field",{"item":[16],"locale":[1],"value":[16]}],[2,"mrd-boolean-field",{"name":[1],"label":[1],"value":[4],"required":[4],"disabled":[4],"locale":[1],"checked":[32]}],[2,"mrd-currency-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"amountDisplay":[32],"currency":[32],"error":[32]}],[2,"mrd-date-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-datetime-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-email-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-file-field",{"name":[1],"label":[1],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"fileName":[32],"isDragging":[32],"error":[32]}],[2,"mrd-hyperlink-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-image-field",{"name":[1],"label":[1],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"previewUrl":[32],"fileName":[32],"isDragging":[32],"error":[32]}],[2,"mrd-list-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"multiple":[4],"locale":[1],"listItems":[16],"error":[32],"selected":[32]}],[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]}],[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"],"multiple":[4],"dropdownValues":[16],"value":[1],"searchQuery":[32],"searchResults":[32],"isLoading":[32],"selectedItems":[32],"showResults":[32],"error":[32],"highlightedIndex":[32],"setSearchResults":[64],"setLoading":[64]}],[2,"mrd-text-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-textarea-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32],"editorReady":[32]}],[2,"mrd-time-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}]]]], options);
+  return index.bootstrapLazy([["mrd-table.cjs",[[2,"mrd-table",{"columns":[16],"rows":[16],"locale":[1],"totalElements":[2,"total-elements"],"pageSize":[2,"page-size"],"rowHeight":[2,"row-height"],"tableHeight":[2,"table-height"],"defaultSort":[1,"default-sort"],"loadedPages":[32],"requestedPages":[32],"renderStart":[32],"renderEnd":[32],"colWidths":[32],"sortField":[32],"sortDir":[32],"init":[64],"setPage":[64]}]]],["mrd-boolean-field_16.cjs",[[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]},null,{"values":[{"valuesChanged":0}]}],[2,"mrd-field",{"item":[16],"locale":[1],"value":[16]}],[2,"mrd-boolean-field",{"name":[1],"label":[1],"value":[4],"required":[4],"disabled":[4],"locale":[1],"checked":[32]}],[2,"mrd-currency-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"amountDisplay":[32],"currency":[32],"error":[32]}],[2,"mrd-date-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-datetime-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-email-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-file-field",{"name":[1],"label":[1],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"fileName":[32],"isDragging":[32],"error":[32]}],[2,"mrd-hyperlink-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-image-field",{"name":[1],"label":[1],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"previewUrl":[32],"fileName":[32],"isDragging":[32],"error":[32]}],[2,"mrd-list-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"multiple":[4],"locale":[1],"listItems":[16],"error":[32],"selected":[32]}],[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]}],[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]}],[2,"mrd-text-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-textarea-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32],"editorReady":[32]}],[2,"mrd-time-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/cjs/mosterdcomponents.cjs.js

@@ -19,7 +19,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["mrd-table.cjs",[[2,"mrd-table",{"columns":[16],"rows":[16],"locale":[1],"totalElements":[2,"total-elements"],"pageSize":[2,"page-size"],"rowHeight":[2,"row-height"],"tableHeight":[2,"table-height"],"defaultSort":[1,"default-sort"],"loadedPages":[32],"requestedPages":[32],"renderStart":[32],"renderEnd":[32],"colWidths":[32],"sortField":[32],"sortDir":[32],"init":[64],"setPage":[64]}]]],["mrd-boolean-field_16.cjs",[[2,"mrd-form",{"layout":[16],"locale":[1],"values":[16],"formValues":[32],"errors":[32],"submitted":[32],"setFieldValue":[64]},null,{"values":[{"valuesChanged":0}]}],[2,"mrd-field",{"item":[16],"locale":[1],"value":[16]}],[2,"mrd-boolean-field",{"name":[1],"label":[1],"value":[4],"required":[4],"disabled":[4],"locale":[1],"checked":[32]}],[2,"mrd-currency-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"amountDisplay":[32],"currency":[32],"error":[32]}],[2,"mrd-date-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-datetime-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-email-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-file-field",{"name":[1],"label":[1],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"fileName":[32],"isDragging":[32],"error":[32]}],[2,"mrd-hyperlink-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-image-field",{"name":[1],"label":[1],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"previewUrl":[32],"fileName":[32],"isDragging":[32],"error":[32]}],[2,"mrd-list-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"multiple":[4],"locale":[1],"listItems":[16],"error":[32],"selected":[32]}],[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]}],[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"],"multiple":[4],"dropdownValues":[16],"value":[1],"searchQuery":[32],"searchResults":[32],"isLoading":[32],"selectedItems":[32],"showResults":[32],"error":[32],"highlightedIndex":[32],"setSearchResults":[64],"setLoading":[64]}],[2,"mrd-text-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-textarea-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32],"editorReady":[32]}],[2,"mrd-time-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}]]]], options);
+  return index.bootstrapLazy([["mrd-table.cjs",[[2,"mrd-table",{"columns":[16],"rows":[16],"locale":[1],"totalElements":[2,"total-elements"],"pageSize":[2,"page-size"],"rowHeight":[2,"row-height"],"tableHeight":[2,"table-height"],"defaultSort":[1,"default-sort"],"loadedPages":[32],"requestedPages":[32],"renderStart":[32],"renderEnd":[32],"colWidths":[32],"sortField":[32],"sortDir":[32],"init":[64],"setPage":[64]}]]],["mrd-boolean-field_16.cjs",[[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]},null,{"values":[{"valuesChanged":0}]}],[2,"mrd-field",{"item":[16],"locale":[1],"value":[16]}],[2,"mrd-boolean-field",{"name":[1],"label":[1],"value":[4],"required":[4],"disabled":[4],"locale":[1],"checked":[32]}],[2,"mrd-currency-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"amountDisplay":[32],"currency":[32],"error":[32]}],[2,"mrd-date-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-datetime-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-email-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-file-field",{"name":[1],"label":[1],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"fileName":[32],"isDragging":[32],"error":[32]}],[2,"mrd-hyperlink-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-image-field",{"name":[1],"label":[1],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"previewUrl":[32],"fileName":[32],"isDragging":[32],"error":[32]}],[2,"mrd-list-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"multiple":[4],"locale":[1],"listItems":[16],"error":[32],"selected":[32]}],[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]}],[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]}],[2,"mrd-text-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-textarea-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32],"editorReady":[32]}],[2,"mrd-time-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/cjs/mrd-boolean-field_16.cjs.entry.js

@@ -336,6 +336,7 @@ const MrdField = class {
         this.mrdChange = index.createEvent(this, "mrdChange");
         this.mrdBlur = index.createEvent(this, "mrdBlur");
         this.mrdSearch = index.createEvent(this, "mrdSearch");
+        this.mrdFetchAll = index.createEvent(this, "mrdFetchAll");
         this.locale = navigator.language;
         this.handleChange = (e) => {
             e.stopPropagation();
@@ -349,13 +350,17 @@ const MrdField = class {
             e.stopPropagation();
             this.mrdSearch.emit(e.detail);
         };
+        this.handleFetchAll = (e) => {
+            e.stopPropagation();
+            this.mrdFetchAll.emit(e.detail);
+        };
     }
     render() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6;
         const { item, locale, value } = this;
         if (item.type === index$1.ClientLayoutItemType.RELATION && item.relation) {
             const rel = item.relation;
-            return (index.h(index.Host, null, index.h("mrd-relation-field", { name: rel.name, label: rel.label, required: rel.required, disabled: (_a = rel.disabled) !== null && _a !== void 0 ? _a : false, locale: locale, relatedClass: rel.relatedClass, mostSignificantClass: (_b = rel.mostSignificantClass) !== null && _b !== void 0 ? _b : '', displayType: (_c = rel.displayType) !== null && _c !== void 0 ? _c : index$1.ClientLayoutItemRelationDisplayType.SEARCH, multiple: (_d = rel.multiple) !== null && _d !== void 0 ? _d : false, dropdownValues: (_e = rel.dropdownValues) !== null && _e !== void 0 ? _e : [], value: value, onMrdChange: this.handleChange, onMrdBlur: this.handleBlur, onMrdSearch: this.handleSearch })));
+            return (index.h(index.Host, null, index.h("mrd-relation-field", { name: rel.name, label: rel.label, required: rel.required, disabled: (_a = rel.disabled) !== null && _a !== void 0 ? _a : false, locale: locale, relatedClass: rel.relatedClass, mostSignificantClass: (_b = rel.mostSignificantClass) !== null && _b !== void 0 ? _b : '', displayType: (_c = rel.displayType) !== null && _c !== void 0 ? _c : index$1.ClientLayoutItemRelationDisplayType.SEARCH, editBehavior: (_d = rel.editBehavior) !== null && _d !== void 0 ? _d : null, commonRelation: rel.commonRelation, multiple: (_e = rel.multiple) !== null && _e !== void 0 ? _e : false, dropdownValues: (_f = rel.dropdownValues) !== null && _f !== void 0 ? _f : [], value: value, onMrdChange: this.handleChange, onMrdBlur: this.handleBlur, onMrdSearch: this.handleSearch, onMrdFetchAll: this.handleFetchAll })));
         }
         if (item.type !== index$1.ClientLayoutItemType.FIELD || !item.field) {
             return index.h(index.Host, null);
@@ -365,40 +370,40 @@ const MrdField = class {
             name: field.name,
             label: field.label,
             required: field.required,
-            disabled: (_f = field.disabled) !== null && _f !== void 0 ? _f : false,
+            disabled: (_g = field.disabled) !== null && _g !== void 0 ? _g : false,
             locale,
             onMrdChange: this.handleChange,
             onMrdBlur: this.handleBlur,
         };
         switch (field.dataType) {
             case index$1.ClientLayoutItemFieldDataType.TEXT:
-                return (index.h(index.Host, null, index.h("mrd-text-field", Object.assign({}, commonProps, { value: (_g = value) !== null && _g !== void 0 ? _g : '', placeholder: (_h = field.placeholder) !== null && _h !== void 0 ? _h : '' }))));
+                return (index.h(index.Host, null, index.h("mrd-text-field", Object.assign({}, commonProps, { value: (_h = value) !== null && _h !== void 0 ? _h : '', placeholder: (_j = field.placeholder) !== null && _j !== void 0 ? _j : '' }))));
             case index$1.ClientLayoutItemFieldDataType.TEXTBLOCK:
-                return (index.h(index.Host, null, index.h("mrd-textarea-field", Object.assign({}, commonProps, { value: (_j = value) !== null && _j !== void 0 ? _j : '', placeholder: (_k = field.placeholder) !== null && _k !== void 0 ? _k : '' }))));
+                return (index.h(index.Host, null, index.h("mrd-textarea-field", Object.assign({}, commonProps, { value: (_k = value) !== null && _k !== void 0 ? _k : '', placeholder: (_l = field.placeholder) !== null && _l !== void 0 ? _l : '' }))));
             case index$1.ClientLayoutItemFieldDataType.INTEGER:
             case index$1.ClientLayoutItemFieldDataType.DECIMAL:
             case index$1.ClientLayoutItemFieldDataType.PERCENTAGE:
-                return (index.h(index.Host, null, index.h("mrd-number-field", Object.assign({}, commonProps, { value: (_l = value) !== null && _l !== void 0 ? _l : null, dataType: field.dataType, decimalPrecision: (_m = field.decimalPrecision) !== null && _m !== void 0 ? _m : 2, placeholder: (_o = field.placeholder) !== null && _o !== void 0 ? _o : '' }))));
+                return (index.h(index.Host, null, index.h("mrd-number-field", Object.assign({}, commonProps, { value: (_m = value) !== null && _m !== void 0 ? _m : null, dataType: field.dataType, decimalPrecision: (_o = field.decimalPrecision) !== null && _o !== void 0 ? _o : 2, placeholder: (_p = field.placeholder) !== null && _p !== void 0 ? _p : '' }))));
             case index$1.ClientLayoutItemFieldDataType.CURRENCY:
-                return (index.h(index.Host, null, index.h("mrd-currency-field", Object.assign({}, commonProps, { value: (_p = value) !== null && _p !== void 0 ? _p : { amount: null, currency: (_q = field.currencyCode) !== null && _q !== void 0 ? _q : 'EUR' } }))));
+                return (index.h(index.Host, null, index.h("mrd-currency-field", Object.assign({}, commonProps, { value: (_q = value) !== null && _q !== void 0 ? _q : { amount: null, currency: (_r = field.currencyCode) !== null && _r !== void 0 ? _r : 'EUR' } }))));
             case index$1.ClientLayoutItemFieldDataType.BOOLEAN:
-                return (index.h(index.Host, null, index.h("mrd-boolean-field", Object.assign({}, commonProps, { value: (_r = value) !== null && _r !== void 0 ? _r : false }))));
+                return (index.h(index.Host, null, index.h("mrd-boolean-field", Object.assign({}, commonProps, { value: (_s = value) !== null && _s !== void 0 ? _s : false }))));
             case index$1.ClientLayoutItemFieldDataType.DATE:
-                return (index.h(index.Host, null, index.h("mrd-date-field", Object.assign({}, commonProps, { value: (_s = value) !== null && _s !== void 0 ? _s : '' }))));
+                return (index.h(index.Host, null, index.h("mrd-date-field", Object.assign({}, commonProps, { value: (_t = value) !== null && _t !== void 0 ? _t : '' }))));
             case index$1.ClientLayoutItemFieldDataType.DATETIME:
-                return (index.h(index.Host, null, index.h("mrd-datetime-field", Object.assign({}, commonProps, { value: (_t = value) !== null && _t !== void 0 ? _t : '' }))));
+                return (index.h(index.Host, null, index.h("mrd-datetime-field", Object.assign({}, commonProps, { value: (_u = value) !== null && _u !== void 0 ? _u : '' }))));
             case index$1.ClientLayoutItemFieldDataType.TIME:
-                return (index.h(index.Host, null, index.h("mrd-time-field", Object.assign({}, commonProps, { value: (_u = value) !== null && _u !== void 0 ? _u : '' }))));
+                return (index.h(index.Host, null, index.h("mrd-time-field", Object.assign({}, commonProps, { value: (_v = value) !== null && _v !== void 0 ? _v : '' }))));
             case index$1.ClientLayoutItemFieldDataType.EMAIL:
-                return (index.h(index.Host, null, index.h("mrd-email-field", Object.assign({}, commonProps, { value: (_v = value) !== null && _v !== void 0 ? _v : '', placeholder: (_w = field.placeholder) !== null && _w !== void 0 ? _w : '' }))));
+                return (index.h(index.Host, null, index.h("mrd-email-field", Object.assign({}, commonProps, { value: (_w = value) !== null && _w !== void 0 ? _w : '', placeholder: (_x = field.placeholder) !== null && _x !== void 0 ? _x : '' }))));
             case index$1.ClientLayoutItemFieldDataType.HYPERLINK:
-                return (index.h(index.Host, null, index.h("mrd-hyperlink-field", Object.assign({}, commonProps, { value: (_x = value) !== null && _x !== void 0 ? _x : '', placeholder: (_y = field.placeholder) !== null && _y !== void 0 ? _y : '' }))));
+                return (index.h(index.Host, null, index.h("mrd-hyperlink-field", Object.assign({}, commonProps, { value: (_y = value) !== null && _y !== void 0 ? _y : '', placeholder: (_z = field.placeholder) !== null && _z !== void 0 ? _z : '' }))));
             case index$1.ClientLayoutItemFieldDataType.LIST:
-                return (index.h(index.Host, null, index.h("mrd-list-field", Object.assign({}, commonProps, { value: (_z = value) !== null && _z !== void 0 ? _z : '', multiple: (_0 = field.multiple) !== null && _0 !== void 0 ? _0 : false, listItems: (_1 = field.listItems) !== null && _1 !== void 0 ? _1 : [] }))));
+                return (index.h(index.Host, null, index.h("mrd-list-field", Object.assign({}, commonProps, { value: (_0 = value) !== null && _0 !== void 0 ? _0 : '', multiple: (_1 = field.multiple) !== null && _1 !== void 0 ? _1 : false, listItems: (_2 = field.listItems) !== null && _2 !== void 0 ? _2 : [] }))));
             case index$1.ClientLayoutItemFieldDataType.FILE:
-                return (index.h(index.Host, null, index.h("mrd-file-field", Object.assign({}, commonProps, { accept: (_2 = field.accept) !== null && _2 !== void 0 ? _2 : '', maxSize: (_3 = field.maxSize) !== null && _3 !== void 0 ? _3 : 0 }))));
+                return (index.h(index.Host, null, index.h("mrd-file-field", Object.assign({}, commonProps, { accept: (_3 = field.accept) !== null && _3 !== void 0 ? _3 : '', maxSize: (_4 = field.maxSize) !== null && _4 !== void 0 ? _4 : 0 }))));
             case index$1.ClientLayoutItemFieldDataType.IMAGE:
-                return (index.h(index.Host, null, index.h("mrd-image-field", Object.assign({}, commonProps, { accept: (_4 = field.accept) !== null && _4 !== void 0 ? _4 : 'image/*', maxSize: (_5 = field.maxSize) !== null && _5 !== void 0 ? _5 : 0 }))));
+                return (index.h(index.Host, null, index.h("mrd-image-field", Object.assign({}, commonProps, { accept: (_5 = field.accept) !== null && _5 !== void 0 ? _5 : 'image/*', maxSize: (_6 = field.maxSize) !== null && _6 !== void 0 ? _6 : 0 }))));
             default:
                 return index.h(index.Host, null);
         }
@@ -477,29 +482,78 @@ const MrdFileField = class {
 };
 MrdFileField.style = mrdFileFieldScss();
 
-const mrdFormScss = () => `.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}.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)}`;
+const mrdFormScss = () => `.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)}`;
 
 const MrdForm = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.mrdSubmit = index.createEvent(this, "mrdSubmit");
+        this.mrdCancel = index.createEvent(this, "mrdCancel");
         this.mrdSearch = index.createEvent(this, "mrdSearch");
+        this.mrdFetchAll = index.createEvent(this, "mrdFetchAll");
         this.locale = navigator.language;
         this.values = {};
+        /**
+         * Absolute href of the parent/reference object (e.g. the clientAgreement href
+         * when creating an invoice from within a client agreement).
+         * Combined with `referenceClass`, mrd-form will automatically pre-fill the
+         * matching relation field so dependent DROPDOWN fields can be fetched on load
+         * — without the host app needing to know anything about the form layout.
+         */
+        /**
+         * Absolute href of the parent/reference object (e.g. the clientAgreement href
+         * when creating an invoice from within a client agreement).
+         * Combined with `referenceClass`, mrd-form will automatically pre-fill the
+         * matching relation field so dependent DROPDOWN fields can be fetched on load.
+         */
+        this.referenceHref = '';
+        /**
+         * The `mostSignificantClass` of the parent/reference object
+         * (e.g. `'clientAgreements'`). Used to locate the matching RELATION field.
+         */
+        this.referenceClass = '';
+        /** When true, a cancel button is shown next to the submit button. */
+        this.showCancel = false;
         this.formValues = {};
         this.errors = {};
         this.submitted = false;
         this.handleFieldChange = (e) => {
             const { name, value } = e.detail;
+            const prevHref = this.getHref(this.formValues[name]);
             this.formValues = Object.assign(Object.assign({}, this.formValues), { [name]: value });
             if (this.errors[name]) {
                 this.errors = Object.assign(Object.assign({}, this.errors), { [name]: '' });
             }
+            // When a field changes, check if it is the commonRelation dependency for any
+            // DROPDOWN relation. If so, reset the dependent field and re-fetch its options.
+            // Skip when the effective href did not change (e.g. mrdBlur fires after mrdChange
+            // with the same value, which would otherwise trigger a duplicate fetch).
+            const newHref = this.getHref(value);
+            if (newHref === prevHref)
+                return;
+            for (const rel of this.collectDependentDropdowns()) {
+                if (rel.commonRelation !== name)
+                    continue;
+                // Clear the dependent field's current selection (options have changed)
+                this.formValues = Object.assign(Object.assign({}, this.formValues), { [rel.name]: null });
+                this.mrdFetchAll.emit({
+                    name: rel.name,
+                    relatedClass: rel.relatedClass,
+                    mostSignificantClass: rel.mostSignificantClass,
+                    commonRelation: rel.commonRelation,
+                    filter: rel.commonRelation,
+                    filterValue: newHref, // empty string when dependency was cleared → host should clear the list
+                });
+            }
         };
         this.handleSearch = (e) => {
             e.stopPropagation();
             this.mrdSearch.emit(e.detail);
         };
+        this.handleFetchAll = (e) => {
+            e.stopPropagation();
+            this.mrdFetchAll.emit(e.detail);
+        };
         this.handleSubmit = (e) => {
             e.preventDefault();
             this.submitted = true;
@@ -512,12 +566,71 @@ const MrdForm = class {
         var _a;
         this.formValues = Object.assign({}, ((_a = this.values) !== null && _a !== void 0 ? _a : {}));
     }
+    componentDidLoad() {
+        // Apply reference pre-fill and emit mrdFetchAll for dependent DROPDOWN fields.
+        // Deferred so Angular/host prop bindings are settled before we read them.
+        setTimeout(() => {
+            this.applyReferenceValue();
+            this.emitDependentFetchAll();
+        }, 0);
+    }
     /** Sync formValues when the values prop is set from outside after mount
      *  (e.g. when pre-filling an existing record in edit mode). */
     valuesChanged(newValues) {
         this.formValues = Object.assign({}, (newValues !== null && newValues !== void 0 ? newValues : {}));
+        this.applyReferenceValue();
         this.errors = {};
         this.submitted = false;
+        // Re-check DROPDOWN dependencies now that formValues are updated
+        setTimeout(() => this.emitDependentFetchAll(), 0);
+    }
+    /**
+     * When referenceHref + referenceClass are set, find the matching layout field
+     * and inject its value into formValues. This allows dependent DROPDOWN fields
+     * (those with commonRelation pointing to that field) to be fetched on load
+     * without the host app doing any form-domain logic.
+     *
+     * Two lookup strategies:
+     * 1. Find a RELATION whose mostSignificantClass matches referenceClass.
+     * 2. Fallback: find a DROPDOWN whose commonRelation field is absent from the
+     *    layout (API omitted it because it is implied by the reference context).
+     */
+    applyReferenceValue() {
+        if (!this.referenceHref || !this.referenceClass)
+            return;
+        const fieldName = this.resolveReferenceFieldName();
+        if (!fieldName)
+            return;
+        // Only set when not already present (don't overwrite an explicit value)
+        if (!this.formValues[fieldName]) {
+            this.formValues = Object.assign(Object.assign({}, this.formValues), { [fieldName]: this.referenceHref });
+        }
+    }
+    resolveReferenceFieldName() {
+        var _a, _b;
+        const allItems = this.collectFields((_b = (_a = this.layout) === null || _a === void 0 ? void 0 : _a.items) !== null && _b !== void 0 ? _b : []);
+        // Strategy 1: direct match on mostSignificantClass
+        const direct = allItems.find(item => {
+            var _a;
+            return item.type === index$1.ClientLayoutItemType.RELATION &&
+                ((_a = item.relation) === null || _a === void 0 ? void 0 : _a.mostSignificantClass) === this.referenceClass;
+        });
+        if (direct === null || direct === void 0 ? void 0 : direct.relation)
+            return direct.relation.name;
+        // Strategy 2: a DROPDOWN whose commonRelation field was omitted from the layout
+        const layoutRelationNames = new Set(allItems
+            .filter(item => item.type === index$1.ClientLayoutItemType.RELATION)
+            .map(item => item.relation.name));
+        for (const item of allItems) {
+            const rel = item.relation;
+            if (item.type === index$1.ClientLayoutItemType.RELATION &&
+                (rel === null || rel === void 0 ? void 0 : rel.editBehavior) === index$1.ClientLayoutItemRelationEditBehavior.DROPDOWN &&
+                rel.commonRelation &&
+                !layoutRelationNames.has(rel.commonRelation)) {
+                return rel.commonRelation;
+            }
+        }
+        return null;
     }
     async setFieldValue(name, value) {
         this.formValues = Object.assign(Object.assign({}, this.formValues), { [name]: value });
@@ -525,6 +638,45 @@ const MrdForm = class {
             this.errors = Object.assign(Object.assign({}, this.errors), { [name]: '' });
         }
     }
+    /** Collect all RELATION items that use editBehavior=DROPDOWN with a commonRelation. */
+    collectDependentDropdowns() {
+        var _a, _b;
+        return this.collectFields((_b = (_a = this.layout) === null || _a === void 0 ? void 0 : _a.items) !== null && _b !== void 0 ? _b : [])
+            .filter(item => {
+            var _a;
+            return item.type === index$1.ClientLayoutItemType.RELATION &&
+                ((_a = item.relation) === null || _a === void 0 ? void 0 : _a.editBehavior) === index$1.ClientLayoutItemRelationEditBehavior.DROPDOWN &&
+                !!item.relation.commonRelation;
+        })
+            .map(item => item.relation);
+    }
+    /** Emit mrdFetchAll for every dependent DROPDOWN whose filter value is currently set. */
+    emitDependentFetchAll() {
+        for (const rel of this.collectDependentDropdowns()) {
+            const filterValue = this.getHref(this.formValues[rel.commonRelation]);
+            if (filterValue) {
+                this.mrdFetchAll.emit({
+                    name: rel.name,
+                    relatedClass: rel.relatedClass,
+                    mostSignificantClass: rel.mostSignificantClass,
+                    commonRelation: rel.commonRelation,
+                    filter: rel.commonRelation,
+                    filterValue,
+                });
+            }
+        }
+    }
+    /** Extract a plain href string from a form value, which can be a string or
+     *  a RelationSearchResult-like object with an `id` field. */
+    getHref(value) {
+        if (!value)
+            return '';
+        if (typeof value === 'string')
+            return value;
+        if (typeof value === 'object' && 'id' in value)
+            return value.id;
+        return '';
+    }
     collectFields(items) {
         const fields = [];
         for (const item of items) {
@@ -594,7 +746,7 @@ const MrdForm = class {
             }
             const fieldName = (_d = (_b = (_a = item.field) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : (_c = item.relation) === null || _c === void 0 ? void 0 : _c.name) !== null && _d !== void 0 ? _d : '';
             const fieldValue = this.formValues[fieldName];
-            return (index.h("div", { class: "mrd-form__field" }, index.h("mrd-field", { item: item, locale: this.locale, value: fieldValue, onMrdChange: this.handleFieldChange, onMrdBlur: this.handleFieldChange, onMrdSearch: this.handleSearch }), this.errors[fieldName] && (index.h("span", { class: "mrd-form__field-error" }, this.errors[fieldName]))));
+            return (index.h("div", { class: "mrd-form__field" }, index.h("mrd-field", { item: item, locale: this.locale, value: fieldValue, onMrdChange: this.handleFieldChange, onMrdBlur: this.handleFieldChange, onMrdSearch: this.handleSearch, onMrdFetchAll: this.handleFetchAll }), this.errors[fieldName] && (index.h("span", { class: "mrd-form__field-error" }, this.errors[fieldName]))));
         });
     }
     render() {
@@ -602,7 +754,7 @@ const MrdForm = class {
             return index.h(index.Host, null);
         }
         const dir = this.locale.startsWith('ar') ? 'rtl' : 'ltr';
-        return (index.h(index.Host, null, index.h("form", { class: "mrd-form", dir: dir, onSubmit: this.handleSubmit, noValidate: true }, this.layout.title && index.h("h2", { class: "mrd-form__title" }, this.layout.title), index.h("div", { class: "mrd-form__body" }, this.renderItems(this.layout.items)), index.h("div", { class: "mrd-form__footer" }, index.h("button", { type: "submit", class: "mrd-form__submit" }, t('submit', this.locale))))));
+        return (index.h(index.Host, null, index.h("form", { class: "mrd-form", dir: dir, onSubmit: this.handleSubmit, noValidate: true }, this.layout.title && index.h("h2", { class: "mrd-form__title" }, this.layout.title), index.h("div", { class: "mrd-form__body" }, this.renderItems(this.layout.items)), index.h("div", { class: "mrd-form__footer" }, index.h("button", { type: "submit", class: "mrd-form__submit" }, t('submit', this.locale)), this.showCancel && (index.h("button", { type: "button", class: "mrd-form__cancel", onClick: () => this.mrdCancel.emit() }, t('cancel', this.locale)))))));
     }
     static get watchers() { return {
         "values": [{
@@ -918,6 +1070,7 @@ const MrdRelationField = class {
         this.mrdChange = index.createEvent(this, "mrdChange");
         this.mrdBlur = index.createEvent(this, "mrdBlur");
         this.mrdSearch = index.createEvent(this, "mrdSearch");
+        this.mrdFetchAll = index.createEvent(this, "mrdFetchAll");
         this.name = '';
         this.label = '';
         this.required = false;
@@ -933,6 +1086,7 @@ const MrdRelationField = class {
         this.value = null;
         this.searchQuery = '';
         this.searchResults = [];
+        this.allRecords = [];
         this.isLoading = false;
         this.selectedItems = [];
         this.showResults = false;
@@ -1041,6 +1195,9 @@ const MrdRelationField = class {
             this.mrdBlur.emit({ name: this.name, value: val });
         };
     }
+    async setAllRecords(records) {
+        this.allRecords = records;
+    }
     async setSearchResults(results) {
         this.searchResults = results;
         this.isLoading = false;
@@ -1054,24 +1211,41 @@ const MrdRelationField = class {
         var _a;
         // Pre-fill selectedItems when value is passed as { id, label } objects
         // (e.g. when editing an existing record fetched from the API).
-        if (!this.value)
-            return;
-        if (Array.isArray(this.value)) {
-            if (this.value.length > 0 && typeof this.value[0] === 'object') {
-                this.selectedItems = this.value;
-                this.searchQuery = '';
+        if (this.value) {
+            if (Array.isArray(this.value)) {
+                if (this.value.length > 0 && typeof this.value[0] === 'object') {
+                    this.selectedItems = this.value;
+                    this.searchQuery = '';
+                }
+            }
+            else if (typeof this.value === 'object') {
+                this.selectedItems = [this.value];
+                this.searchQuery = (_a = this.value.label) !== null && _a !== void 0 ? _a : '';
             }
         }
-        else if (typeof this.value === 'object') {
-            this.selectedItems = [this.value];
-            this.searchQuery = (_a = this.value.label) !== null && _a !== void 0 ? _a : '';
+    }
+    componentDidLoad() {
+        // Only emit when there is no commonRelation dependency — the form orchestrates those.
+        if (this.editBehavior === index$1.ClientLayoutItemRelationEditBehavior.DROPDOWN && !this.commonRelation) {
+            // Defer to next tick so parent event listeners are registered after DOM patching
+            setTimeout(() => {
+                this.mrdFetchAll.emit({
+                    name: this.name,
+                    relatedClass: this.relatedClass,
+                    mostSignificantClass: this.mostSignificantClass || undefined,
+                });
+            }, 0);
         }
     }
     render() {
-        var _a, _b;
+        var _a, _b, _c, _d;
         const hasError = !!this.error;
-        if (this.displayType === index$1.ClientLayoutItemRelationDisplayType.DROPDOWN) {
+        if (this.editBehavior === index$1.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 : '');
+            return (index.h(index.Host, null, index.h("div", { class: "mrd-relation-field" }, this.label && (index.h("label", { class: `mrd-relation-field__label${this.required ? ' mrd-relation-field__label--required' : ''}` }, this.label)), index.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 }, index.h("option", { value: "" }, t('select_placeholder', this.locale)), this.allRecords.map(record => (index.h("option", { key: record.id, value: record.id, selected: record.id === currentValue }, record.label)))), hasError && index.h("span", { class: "mrd-relation-field__error" }, this.error))));
+        }
+        if (this.displayType === index$1.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 : '');
             return (index.h(index.Host, null, index.h("div", { class: "mrd-relation-field" }, this.label && (index.h("label", { class: `mrd-relation-field__label${this.required ? ' mrd-relation-field__label--required' : ''}` }, this.label)), index.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 }, index.h("option", { value: "" }, t('select_placeholder', this.locale)), this.dropdownValues.map(dv => (index.h("option", { key: dv.key, value: dv.key, selected: dv.key === currentValue }, dv.label)))), hasError && index.h("span", { class: "mrd-relation-field__error" }, this.error))));
         }
         // SEARCH mode

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

@@ -15,13 +15,17 @@ export class MrdField {
             e.stopPropagation();
             this.mrdSearch.emit(e.detail);
         };
+        this.handleFetchAll = (e) => {
+            e.stopPropagation();
+            this.mrdFetchAll.emit(e.detail);
+        };
     }
     render() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6;
         const { item, locale, value } = this;
         if (item.type === ClientLayoutItemType.RELATION && item.relation) {
             const rel = item.relation;
-            return (h(Host, null, h("mrd-relation-field", { name: rel.name, label: rel.label, required: rel.required, disabled: (_a = rel.disabled) !== null && _a !== void 0 ? _a : false, locale: locale, relatedClass: rel.relatedClass, mostSignificantClass: (_b = rel.mostSignificantClass) !== null && _b !== void 0 ? _b : '', displayType: (_c = rel.displayType) !== null && _c !== void 0 ? _c : ClientLayoutItemRelationDisplayType.SEARCH, multiple: (_d = rel.multiple) !== null && _d !== void 0 ? _d : false, dropdownValues: (_e = rel.dropdownValues) !== null && _e !== void 0 ? _e : [], value: value, onMrdChange: this.handleChange, onMrdBlur: this.handleBlur, onMrdSearch: this.handleSearch })));
+            return (h(Host, null, h("mrd-relation-field", { name: rel.name, label: rel.label, required: rel.required, disabled: (_a = rel.disabled) !== null && _a !== void 0 ? _a : false, locale: locale, relatedClass: rel.relatedClass, mostSignificantClass: (_b = rel.mostSignificantClass) !== null && _b !== void 0 ? _b : '', displayType: (_c = rel.displayType) !== null && _c !== void 0 ? _c : ClientLayoutItemRelationDisplayType.SEARCH, editBehavior: (_d = rel.editBehavior) !== null && _d !== void 0 ? _d : null, commonRelation: rel.commonRelation, multiple: (_e = rel.multiple) !== null && _e !== void 0 ? _e : false, dropdownValues: (_f = rel.dropdownValues) !== null && _f !== void 0 ? _f : [], value: value, onMrdChange: this.handleChange, onMrdBlur: this.handleBlur, onMrdSearch: this.handleSearch, onMrdFetchAll: this.handleFetchAll })));
         }
         if (item.type !== ClientLayoutItemType.FIELD || !item.field) {
             return h(Host, null);
@@ -31,40 +35,40 @@ export class MrdField {
             name: field.name,
             label: field.label,
             required: field.required,
-            disabled: (_f = field.disabled) !== null && _f !== void 0 ? _f : false,
+            disabled: (_g = field.disabled) !== null && _g !== void 0 ? _g : false,
             locale,
             onMrdChange: this.handleChange,
             onMrdBlur: this.handleBlur,
         };
         switch (field.dataType) {
             case ClientLayoutItemFieldDataType.TEXT:
-                return (h(Host, null, h("mrd-text-field", Object.assign({}, commonProps, { value: (_g = value) !== null && _g !== void 0 ? _g : '', placeholder: (_h = field.placeholder) !== null && _h !== void 0 ? _h : '' }))));
+                return (h(Host, null, h("mrd-text-field", Object.assign({}, commonProps, { value: (_h = value) !== null && _h !== void 0 ? _h : '', placeholder: (_j = field.placeholder) !== null && _j !== void 0 ? _j : '' }))));
             case ClientLayoutItemFieldDataType.TEXTBLOCK:
-                return (h(Host, null, h("mrd-textarea-field", Object.assign({}, commonProps, { value: (_j = value) !== null && _j !== void 0 ? _j : '', placeholder: (_k = field.placeholder) !== null && _k !== void 0 ? _k : '' }))));
+                return (h(Host, null, h("mrd-textarea-field", Object.assign({}, commonProps, { value: (_k = value) !== null && _k !== void 0 ? _k : '', placeholder: (_l = field.placeholder) !== null && _l !== void 0 ? _l : '' }))));
             case ClientLayoutItemFieldDataType.INTEGER:
             case ClientLayoutItemFieldDataType.DECIMAL:
             case ClientLayoutItemFieldDataType.PERCENTAGE:
-                return (h(Host, null, h("mrd-number-field", Object.assign({}, commonProps, { value: (_l = value) !== null && _l !== void 0 ? _l : null, dataType: field.dataType, decimalPrecision: (_m = field.decimalPrecision) !== null && _m !== void 0 ? _m : 2, placeholder: (_o = field.placeholder) !== null && _o !== void 0 ? _o : '' }))));
+                return (h(Host, null, h("mrd-number-field", Object.assign({}, commonProps, { value: (_m = value) !== null && _m !== void 0 ? _m : null, dataType: field.dataType, decimalPrecision: (_o = field.decimalPrecision) !== null && _o !== void 0 ? _o : 2, placeholder: (_p = field.placeholder) !== null && _p !== void 0 ? _p : '' }))));
             case ClientLayoutItemFieldDataType.CURRENCY:
-                return (h(Host, null, h("mrd-currency-field", Object.assign({}, commonProps, { value: (_p = value) !== null && _p !== void 0 ? _p : { amount: null, currency: (_q = field.currencyCode) !== null && _q !== void 0 ? _q : 'EUR' } }))));
+                return (h(Host, null, h("mrd-currency-field", Object.assign({}, commonProps, { value: (_q = value) !== null && _q !== void 0 ? _q : { amount: null, currency: (_r = field.currencyCode) !== null && _r !== void 0 ? _r : 'EUR' } }))));
             case ClientLayoutItemFieldDataType.BOOLEAN:
-                return (h(Host, null, h("mrd-boolean-field", Object.assign({}, commonProps, { value: (_r = value) !== null && _r !== void 0 ? _r : false }))));
+                return (h(Host, null, h("mrd-boolean-field", Object.assign({}, commonProps, { value: (_s = value) !== null && _s !== void 0 ? _s : false }))));
             case ClientLayoutItemFieldDataType.DATE:
-                return (h(Host, null, h("mrd-date-field", Object.assign({}, commonProps, { value: (_s = value) !== null && _s !== void 0 ? _s : '' }))));
+                return (h(Host, null, h("mrd-date-field", Object.assign({}, commonProps, { value: (_t = value) !== null && _t !== void 0 ? _t : '' }))));
             case ClientLayoutItemFieldDataType.DATETIME:
-                return (h(Host, null, h("mrd-datetime-field", Object.assign({}, commonProps, { value: (_t = value) !== null && _t !== void 0 ? _t : '' }))));
+                return (h(Host, null, h("mrd-datetime-field", Object.assign({}, commonProps, { value: (_u = value) !== null && _u !== void 0 ? _u : '' }))));
             case ClientLayoutItemFieldDataType.TIME:
-                return (h(Host, null, h("mrd-time-field", Object.assign({}, commonProps, { value: (_u = value) !== null && _u !== void 0 ? _u : '' }))));
+                return (h(Host, null, h("mrd-time-field", Object.assign({}, commonProps, { value: (_v = value) !== null && _v !== void 0 ? _v : '' }))));
             case ClientLayoutItemFieldDataType.EMAIL:
-                return (h(Host, null, h("mrd-email-field", Object.assign({}, commonProps, { value: (_v = value) !== null && _v !== void 0 ? _v : '', placeholder: (_w = field.placeholder) !== null && _w !== void 0 ? _w : '' }))));
+                return (h(Host, null, h("mrd-email-field", Object.assign({}, commonProps, { value: (_w = value) !== null && _w !== void 0 ? _w : '', placeholder: (_x = field.placeholder) !== null && _x !== void 0 ? _x : '' }))));
             case ClientLayoutItemFieldDataType.HYPERLINK:
-                return (h(Host, null, h("mrd-hyperlink-field", Object.assign({}, commonProps, { value: (_x = value) !== null && _x !== void 0 ? _x : '', placeholder: (_y = field.placeholder) !== null && _y !== void 0 ? _y : '' }))));
+                return (h(Host, null, h("mrd-hyperlink-field", Object.assign({}, commonProps, { value: (_y = value) !== null && _y !== void 0 ? _y : '', placeholder: (_z = field.placeholder) !== null && _z !== void 0 ? _z : '' }))));
             case ClientLayoutItemFieldDataType.LIST:
-                return (h(Host, null, h("mrd-list-field", Object.assign({}, commonProps, { value: (_z = value) !== null && _z !== void 0 ? _z : '', multiple: (_0 = field.multiple) !== null && _0 !== void 0 ? _0 : false, listItems: (_1 = field.listItems) !== null && _1 !== void 0 ? _1 : [] }))));
+                return (h(Host, null, h("mrd-list-field", Object.assign({}, commonProps, { value: (_0 = value) !== null && _0 !== void 0 ? _0 : '', multiple: (_1 = field.multiple) !== null && _1 !== void 0 ? _1 : false, listItems: (_2 = field.listItems) !== null && _2 !== void 0 ? _2 : [] }))));
             case ClientLayoutItemFieldDataType.FILE:
-                return (h(Host, null, h("mrd-file-field", Object.assign({}, commonProps, { accept: (_2 = field.accept) !== null && _2 !== void 0 ? _2 : '', maxSize: (_3 = field.maxSize) !== null && _3 !== void 0 ? _3 : 0 }))));
+                return (h(Host, null, h("mrd-file-field", Object.assign({}, commonProps, { accept: (_3 = field.accept) !== null && _3 !== void 0 ? _3 : '', maxSize: (_4 = field.maxSize) !== null && _4 !== void 0 ? _4 : 0 }))));
             case ClientLayoutItemFieldDataType.IMAGE:
-                return (h(Host, null, h("mrd-image-field", Object.assign({}, commonProps, { accept: (_4 = field.accept) !== null && _4 !== void 0 ? _4 : 'image/*', maxSize: (_5 = field.maxSize) !== null && _5 !== void 0 ? _5 : 0 }))));
+                return (h(Host, null, h("mrd-image-field", Object.assign({}, commonProps, { accept: (_5 = field.accept) !== null && _5 !== void 0 ? _5 : 'image/*', maxSize: (_6 = field.maxSize) !== null && _6 !== void 0 ? _6 : 0 }))));
             default:
                 return h(Host, null);
         }
@@ -182,6 +186,21 @@ export class MrdField {
                     "resolved": "{ query: string; relatedClass: string; }",
                     "references": {}
                 }
+            }, {
+                "method": "mrdFetchAll",
+                "name": "mrdFetchAll",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{ name: string; relatedClass: string; mostSignificantClass?: string; commonRelation?: string; filter?: string; filterValue?: string }",
+                    "resolved": "{ name: string; relatedClass: string; mostSignificantClass?: string | undefined; commonRelation?: string | undefined; filter?: string | undefined; filterValue?: string | undefined; }",
+                    "references": {}
+                }
             }];
     }
 }