@mmlogic/components 0.1.4 → 0.1.8

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"],"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],"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"],"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],"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;
+        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, displayType: (_b = rel.displayType) !== null && _b !== void 0 ? _b : index$1.ClientLayoutItemRelationDisplayType.SEARCH, multiple: (_c = rel.multiple) !== null && _c !== void 0 ? _c : false, dropdownValues: (_d = rel.dropdownValues) !== null && _d !== void 0 ? _d : [], 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: (_e = field.disabled) !== null && _e !== void 0 ? _e : 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: (_f = value) !== null && _f !== void 0 ? _f : '', placeholder: (_g = field.placeholder) !== null && _g !== void 0 ? _g : '' }))));
+                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: (_h = value) !== null && _h !== void 0 ? _h : '', placeholder: (_j = field.placeholder) !== null && _j !== void 0 ? _j : '' }))));
+                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: (_k = value) !== null && _k !== void 0 ? _k : null, dataType: field.dataType, decimalPrecision: (_l = field.decimalPrecision) !== null && _l !== void 0 ? _l : 2, placeholder: (_m = field.placeholder) !== null && _m !== void 0 ? _m : '' }))));
+                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: (_o = value) !== null && _o !== void 0 ? _o : { amount: null, currency: (_p = field.currencyCode) !== null && _p !== void 0 ? _p : '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: (_q = value) !== null && _q !== void 0 ? _q : 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: (_r = value) !== null && _r !== void 0 ? _r : '' }))));
+                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: (_s = value) !== null && _s !== void 0 ? _s : '' }))));
+                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: (_t = value) !== null && _t !== void 0 ? _t : '' }))));
+                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: (_u = value) !== null && _u !== void 0 ? _u : '', placeholder: (_v = field.placeholder) !== null && _v !== void 0 ? _v : '' }))));
+                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: (_w = value) !== null && _w !== void 0 ? _w : '', placeholder: (_x = field.placeholder) !== null && _x !== void 0 ? _x : '' }))));
+                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: (_y = value) !== null && _y !== void 0 ? _y : '', multiple: (_z = field.multiple) !== null && _z !== void 0 ? _z : false, listItems: (_0 = field.listItems) !== null && _0 !== void 0 ? _0 : [] }))));
+                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: (_1 = field.accept) !== null && _1 !== void 0 ? _1 : '', maxSize: (_2 = field.maxSize) !== null && _2 !== void 0 ? _2 : 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: (_3 = field.accept) !== null && _3 !== void 0 ? _3 : 'image/*', maxSize: (_4 = field.maxSize) !== null && _4 !== void 0 ? _4 : 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);
         }
@@ -484,6 +489,7 @@ const MrdForm = class {
         index.registerInstance(this, hostRef);
         this.mrdSubmit = index.createEvent(this, "mrdSubmit");
         this.mrdSearch = index.createEvent(this, "mrdSearch");
+        this.mrdFetchAll = index.createEvent(this, "mrdFetchAll");
         this.locale = navigator.language;
         this.values = {};
         this.formValues = {};
@@ -495,10 +501,32 @@ const MrdForm = class {
             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.
+            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 });
+                const filterValue = this.getHref(value);
+                this.mrdFetchAll.emit({
+                    name: rel.name,
+                    relatedClass: rel.relatedClass,
+                    mostSignificantClass: rel.mostSignificantClass,
+                    commonRelation: rel.commonRelation,
+                    filter: rel.commonRelation,
+                    filterValue, // 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;
@@ -511,12 +539,20 @@ const MrdForm = class {
         var _a;
         this.formValues = Object.assign({}, ((_a = this.values) !== null && _a !== void 0 ? _a : {}));
     }
+    componentDidLoad() {
+        // Emit mrdFetchAll for DROPDOWN fields with commonRelation whose dependency
+        // already has a value — this handles the edit-mode case where values are set
+        // as a prop before mount.
+        setTimeout(() => 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.errors = {};
         this.submitted = false;
+        // Re-check DROPDOWN dependencies now that formValues are updated
+        setTimeout(() => this.emitDependentFetchAll(), 0);
     }
     async setFieldValue(name, value) {
         this.formValues = Object.assign(Object.assign({}, this.formValues), { [name]: value });
@@ -524,6 +560,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) {
@@ -593,7 +668,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() {
@@ -917,12 +992,15 @@ 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;
         this.disabled = false;
         this.locale = navigator.language;
         this.relatedClass = '';
+        /** When set, used instead of relatedClass for search queries (mostSignificantClass from API). */
+        this.mostSignificantClass = '';
         this.displayType = index$1.ClientLayoutItemRelationDisplayType.SEARCH;
         this.multiple = false;
         this.dropdownValues = [];
@@ -930,6 +1008,7 @@ const MrdRelationField = class {
         this.value = null;
         this.searchQuery = '';
         this.searchResults = [];
+        this.allRecords = [];
         this.isLoading = false;
         this.selectedItems = [];
         this.showResults = false;
@@ -980,7 +1059,7 @@ const MrdRelationField = class {
                 this.isLoading = true;
                 this.showResults = true;
                 this.searchDebounce = setTimeout(() => {
-                    this.mrdSearch.emit({ query, relatedClass: this.relatedClass });
+                    this.mrdSearch.emit({ query, relatedClass: this.mostSignificantClass });
                 }, 300);
             }
             else {
@@ -1038,6 +1117,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;
@@ -1051,24 +1133,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;
+        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, displayType: (_b = rel.displayType) !== null && _b !== void 0 ? _b : ClientLayoutItemRelationDisplayType.SEARCH, multiple: (_c = rel.multiple) !== null && _c !== void 0 ? _c : false, dropdownValues: (_d = rel.dropdownValues) !== null && _d !== void 0 ? _d : [], 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: (_e = field.disabled) !== null && _e !== void 0 ? _e : 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: (_f = value) !== null && _f !== void 0 ? _f : '', placeholder: (_g = field.placeholder) !== null && _g !== void 0 ? _g : '' }))));
+                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: (_h = value) !== null && _h !== void 0 ? _h : '', placeholder: (_j = field.placeholder) !== null && _j !== void 0 ? _j : '' }))));
+                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: (_k = value) !== null && _k !== void 0 ? _k : null, dataType: field.dataType, decimalPrecision: (_l = field.decimalPrecision) !== null && _l !== void 0 ? _l : 2, placeholder: (_m = field.placeholder) !== null && _m !== void 0 ? _m : '' }))));
+                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: (_o = value) !== null && _o !== void 0 ? _o : { amount: null, currency: (_p = field.currencyCode) !== null && _p !== void 0 ? _p : '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: (_q = value) !== null && _q !== void 0 ? _q : 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: (_r = value) !== null && _r !== void 0 ? _r : '' }))));
+                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: (_s = value) !== null && _s !== void 0 ? _s : '' }))));
+                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: (_t = value) !== null && _t !== void 0 ? _t : '' }))));
+                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: (_u = value) !== null && _u !== void 0 ? _u : '', placeholder: (_v = field.placeholder) !== null && _v !== void 0 ? _v : '' }))));
+                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: (_w = value) !== null && _w !== void 0 ? _w : '', placeholder: (_x = field.placeholder) !== null && _x !== void 0 ? _x : '' }))));
+                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: (_y = value) !== null && _y !== void 0 ? _y : '', multiple: (_z = field.multiple) !== null && _z !== void 0 ? _z : false, listItems: (_0 = field.listItems) !== null && _0 !== void 0 ? _0 : [] }))));
+                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: (_1 = field.accept) !== null && _1 !== void 0 ? _1 : '', maxSize: (_2 = field.maxSize) !== null && _2 !== void 0 ? _2 : 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: (_3 = field.accept) !== null && _3 !== void 0 ? _3 : 'image/*', maxSize: (_4 = field.maxSize) !== null && _4 !== void 0 ? _4 : 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": {}
+                }
             }];
     }
 }

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

@@ -1,5 +1,5 @@
 import { Host, h } from "@stencil/core";
-import { ClientLayoutItemType } from "../../types";
+import { ClientLayoutItemType, ClientLayoutItemRelationEditBehavior } from "../../types";
 import { t } from "../../utils/i18n";
 import { validateRequired } from "../../utils/validation";
 export class MrdForm {
@@ -15,10 +15,32 @@ export class MrdForm {
             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.
+            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 });
+                const filterValue = this.getHref(value);
+                this.mrdFetchAll.emit({
+                    name: rel.name,
+                    relatedClass: rel.relatedClass,
+                    mostSignificantClass: rel.mostSignificantClass,
+                    commonRelation: rel.commonRelation,
+                    filter: rel.commonRelation,
+                    filterValue, // 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;
@@ -31,12 +53,20 @@ export class MrdForm {
         var _a;
         this.formValues = Object.assign({}, ((_a = this.values) !== null && _a !== void 0 ? _a : {}));
     }
+    componentDidLoad() {
+        // Emit mrdFetchAll for DROPDOWN fields with commonRelation whose dependency
+        // already has a value — this handles the edit-mode case where values are set
+        // as a prop before mount.
+        setTimeout(() => 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.errors = {};
         this.submitted = false;
+        // Re-check DROPDOWN dependencies now that formValues are updated
+        setTimeout(() => this.emitDependentFetchAll(), 0);
     }
     async setFieldValue(name, value) {
         this.formValues = Object.assign(Object.assign({}, this.formValues), { [name]: value });
@@ -44,6 +74,45 @@ export class MrdForm {
             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 === ClientLayoutItemType.RELATION &&
+                ((_a = item.relation) === null || _a === void 0 ? void 0 : _a.editBehavior) === 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) {
@@ -113,7 +182,7 @@ export class MrdForm {
             }
             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 (h("div", { class: "mrd-form__field" }, h("mrd-field", { item: item, locale: this.locale, value: fieldValue, onMrdChange: this.handleFieldChange, onMrdBlur: this.handleFieldChange, onMrdSearch: this.handleSearch }), this.errors[fieldName] && (h("span", { class: "mrd-form__field-error" }, this.errors[fieldName]))));
+            return (h("div", { class: "mrd-form__field" }, 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] && (h("span", { class: "mrd-form__field-error" }, this.errors[fieldName]))));
         });
     }
     render() {
@@ -249,6 +318,21 @@ export class MrdForm {
                     "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": {}
+                }
             }];
     }
     static get methods() {