@mmlogic/components 0.1.18 → 0.1.19

package/dist/cjs/{format-IFzg0q-6.js → format-DExY8_nu.js}

@@ -44,6 +44,7 @@ const translations = {
         filter_contains: 'Bevat',
         filter_starts_with: 'Begint met',
         filter_equals: 'Gelijk aan',
+        filter_has_value: 'Heeft waarde',
         filter_is_empty: 'Is leeg',
         filter_is_not_empty: 'Is niet leeg',
         filter_exact: 'Exact',
@@ -102,6 +103,7 @@ const translations = {
         filter_contains: 'Contains',
         filter_starts_with: 'Starts with',
         filter_equals: 'Equals',
+        filter_has_value: 'Has value',
         filter_is_empty: 'Is empty',
         filter_is_not_empty: 'Is not empty',
         filter_exact: 'Exact',
@@ -160,6 +162,7 @@ const translations = {
         filter_contains: 'يحتوي على',
         filter_starts_with: 'يبدأ بـ',
         filter_equals: 'يساوي',
+        filter_has_value: 'له قيمة',
         filter_is_empty: 'فارغ',
         filter_is_not_empty: 'ليس فارغاً',
         filter_exact: 'دقيق',
@@ -218,6 +221,7 @@ const translations = {
         filter_contains: 'Contient',
         filter_starts_with: 'Commence par',
         filter_equals: 'Égal à',
+        filter_has_value: 'A une valeur',
         filter_is_empty: 'Est vide',
         filter_is_not_empty: "N'est pas vide",
         filter_exact: 'Exact',

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

@@ -1,7 +1,7 @@
 'use strict';
 
 var index = require('./index-BPj2cBXs.js');
-var format = require('./format-IFzg0q-6.js');
+var format = require('./format-DExY8_nu.js');
 var index$1 = require('./index.cjs.js');
 
 const mrdBooleanFieldScss = () => `.sc-mrd-boolean-field-h{display:block}.mrd-boolean-field.sc-mrd-boolean-field{display:flex;align-items:center;width:100%}.mrd-boolean-field__toggle-label.sc-mrd-boolean-field{display:flex;align-items:center;gap:var(--mrd-space-3);cursor:pointer;user-select:none}.mrd-boolean-field__checkbox.sc-mrd-boolean-field{position:absolute;opacity:0;width:0;height:0;pointer-events:none}.mrd-boolean-field__checkbox.sc-mrd-boolean-field:checked+.mrd-boolean-field__toggle.sc-mrd-boolean-field{background-color:var(--mrd-color-primary)}.mrd-boolean-field__checkbox.sc-mrd-boolean-field:checked+.mrd-boolean-field__toggle.sc-mrd-boolean-field::after{transform:translateX(20px)}.mrd-boolean-field__checkbox.sc-mrd-boolean-field:focus+.mrd-boolean-field__toggle.sc-mrd-boolean-field{box-shadow:var(--mrd-shadow-focus)}.mrd-boolean-field__checkbox.sc-mrd-boolean-field:disabled+.mrd-boolean-field__toggle.sc-mrd-boolean-field{opacity:0.5;cursor:not-allowed}.mrd-boolean-field__toggle.sc-mrd-boolean-field{position:relative;display:inline-block;width:44px;height:24px;background-color:var(--mrd-color-neutral-300);border-radius:var(--mrd-border-radius-full);transition:background-color var(--mrd-transition);flex-shrink:0}.mrd-boolean-field__toggle.sc-mrd-boolean-field::after{content:'';position:absolute;top:2px;left:2px;width:20px;height:20px;background-color:var(--mrd-color-white);border-radius:50%;transition:transform var(--mrd-transition);box-shadow:var(--mrd-shadow-sm)}.mrd-boolean-field__text.sc-mrd-boolean-field{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-color-neutral-800)}.mrd-boolean-field__text--required.sc-mrd-boolean-field::after{content:' *';color:var(--mrd-color-danger)}`;
@@ -528,7 +528,7 @@ const MrdForm = class {
                     relatedClass: rel.relatedClass,
                     mostSignificantClass: rel.mostSignificantClass,
                     commonRelation: rel.commonRelation,
-                    filter: rel.commonRelation,
+                    filter: rel.commonRelation + '_href',
                     filterValue: newHref, // empty string when dependency was cleared → host should clear the list
                 });
             }
@@ -653,7 +653,7 @@ const MrdForm = class {
                     relatedClass: rel.relatedClass,
                     mostSignificantClass: rel.mostSignificantClass,
                     commonRelation: rel.commonRelation,
-                    filter: rel.commonRelation,
+                    filter: rel.commonRelation + '_href',
                     filterValue,
                 });
             }

package/dist/cjs/mrd-table.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var index$1 = require('./index-BPj2cBXs.js');
-var format = require('./format-IFzg0q-6.js');
+var format = require('./format-DExY8_nu.js');
 var index = require('./index.cjs.js');
 
 class CellRenderer {
@@ -413,7 +413,7 @@ const MrdTable = class {
         // "YYYY-MM-DD" dates so the date inputs show what the user originally entered.
         // If from and to cover the same local day it was an exact-date filter — restore
         // to exact mode so the user sees the single-date input again.
-        if (dataType === 'DATETIME' && existing) {
+        if (dataType === 'DATETIME' && existing && existing.operator !== 'isEmpty' && existing.operator !== 'isNotEmpty') {
             const display = Object.assign({}, existing);
             if (typeof display.from === 'string' && display.from)
                 display.from = this.utcISOToLocalDate(display.from);
@@ -533,7 +533,7 @@ const MrdTable = class {
         // Exact date → range covering the full local day (from = midnight, to = next midnight).
         // "to" is always the exclusive end (midnight of the next local day).
         let normalized = Object.assign({}, f);
-        if (f.dataType === 'DATETIME') {
+        if (f.dataType === 'DATETIME' && f.operator !== 'isEmpty' && f.operator !== 'isNotEmpty') {
             if (typeof normalized.value === 'string' && normalized.value) {
                 normalized.from = this.dateLocalToUTCStart(normalized.value);
                 normalized.to = this.dateLocalToUTCEndExclusive(normalized.value);
@@ -609,11 +609,13 @@ const MrdTable = class {
             return index$1.h("p", { class: "mrd-table__filter-no-support" }, format.t('filter_no_support', this.locale));
         }
         if (dataType === 'BOOLEAN') {
+            const boolOp = pf.operator;
+            const noValueOp = boolOp === 'isEmpty' || boolOp === 'isNotEmpty';
             return (index$1.h("div", { class: "mrd-table__filter-radio-group" }, [
                 { labelKey: 'filter_all', value: null },
                 { labelKey: 'yes', value: true },
                 { labelKey: 'no', value: false },
-            ].map(opt => (index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `bf-${this.openFilterCol}`, checked: pf.value === opt.value, onChange: () => this.setPending('value', opt.value) }), format.t(opt.labelKey, this.locale))))));
+            ].map(opt => (index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `bf-${this.openFilterCol}`, checked: !noValueOp && pf.value === opt.value, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: undefined, value: opt.value }); } }), format.t(opt.labelKey, this.locale)))), index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `bf-${this.openFilterCol}`, checked: boolOp === 'isEmpty', onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: 'isEmpty', value: undefined }); } }), format.t('filter_is_empty', this.locale)), index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `bf-${this.openFilterCol}`, checked: boolOp === 'isNotEmpty', onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: 'isNotEmpty', value: undefined }); } }), format.t('filter_is_not_empty', this.locale))));
         }
         if (dataType === 'LIST') {
             const items = (_c = (_b = col.field) === null || _b === void 0 ? void 0 : _b.listItems) !== null && _c !== void 0 ? _c : [];
@@ -631,17 +633,47 @@ const MrdTable = class {
             ].map(o => index$1.h("option", { value: o.val, selected: op === o.val }, format.t(o.labelKey, this.locale)))), !noInput && (index$1.h("input", { type: "text", class: "mrd-table__filter-input", value: String((_f = pf.value) !== null && _f !== void 0 ? _f : ''), placeholder: format.t('filter_search_value', this.locale), onInput: (e) => this.setPending('value', e.target.value) }))));
         }
         if (NUMERIC_TYPES.has(dataType)) {
-            const rangeMode = pf.from !== undefined || pf.to !== undefined;
-            return (index$1.h("div", { class: "mrd-table__filter-editor" }, index$1.h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `nm-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), format.t('filter_exact', this.locale)), index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `nm-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), format.t('filter_range', this.locale))), !rangeMode ? (index$1.h("input", { type: "number", class: "mrd-table__filter-input", value: pf.value != null ? String(pf.value) : '', onInput: (e) => this.setPending('value', e.target.value) })) : (index$1.h("div", { class: "mrd-table__filter-range" }, index$1.h("input", { type: "number", class: "mrd-table__filter-input", placeholder: format.t('filter_from', this.locale), value: pf.from != null ? String(pf.from) : '', onInput: (e) => this.setPending('from', e.target.value) }), index$1.h("span", { class: "mrd-table__filter-range-sep" }, "\u2013"), index$1.h("input", { type: "number", class: "mrd-table__filter-input", placeholder: format.t('filter_to', this.locale), value: pf.to != null ? String(pf.to) : '', onInput: (e) => this.setPending('to', e.target.value) })))));
+            const numOp = pf.operator;
+            const noInput = numOp === 'isEmpty' || numOp === 'isNotEmpty';
+            const rangeMode = !noInput && (pf.from !== undefined || pf.to !== undefined);
+            return (index$1.h("div", { class: "mrd-table__filter-editor" }, index$1.h("select", { class: "mrd-table__filter-select", onChange: (e) => {
+                    const val = e.target.value;
+                    if (val === 'isEmpty' || val === 'isNotEmpty') {
+                        this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: val, value: undefined, from: undefined, to: undefined });
+                    }
+                    else {
+                        this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: undefined });
+                    }
+                } }, index$1.h("option", { value: "", selected: !noInput }, format.t('filter_has_value', this.locale)), index$1.h("option", { value: "isEmpty", selected: numOp === 'isEmpty' }, format.t('filter_is_empty', this.locale)), index$1.h("option", { value: "isNotEmpty", selected: numOp === 'isNotEmpty' }, format.t('filter_is_not_empty', this.locale))), !noInput && (index$1.h("div", { class: "mrd-table__filter-editor" }, index$1.h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `nm-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), format.t('filter_exact', this.locale)), index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `nm-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), format.t('filter_range', this.locale))), !rangeMode ? (index$1.h("input", { type: "number", class: "mrd-table__filter-input", value: pf.value != null ? String(pf.value) : '', onInput: (e) => this.setPending('value', e.target.value) })) : (index$1.h("div", { class: "mrd-table__filter-range" }, index$1.h("input", { type: "number", class: "mrd-table__filter-input", placeholder: format.t('filter_from', this.locale), value: pf.from != null ? String(pf.from) : '', onInput: (e) => this.setPending('from', e.target.value) }), index$1.h("span", { class: "mrd-table__filter-range-sep" }, "\u2013"), index$1.h("input", { type: "number", class: "mrd-table__filter-input", placeholder: format.t('filter_to', this.locale), value: pf.to != null ? String(pf.to) : '', onInput: (e) => this.setPending('to', e.target.value) })))))));
         }
         if (dataType === 'DATETIME') {
-            const rangeMode = pf.from !== undefined || pf.to !== undefined;
-            return (index$1.h("div", { class: "mrd-table__filter-editor" }, index$1.h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), format.t('filter_exact', this.locale)), index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), format.t('filter_range', this.locale))), !rangeMode ? (index$1.h("input", { type: "date", class: "mrd-table__filter-input", value: String((_g = pf.value) !== null && _g !== void 0 ? _g : ''), onInput: (e) => this.setPending('value', e.target.value) })) : (index$1.h("div", { class: "mrd-table__filter-range mrd-table__filter-range--stacked" }, index$1.h("label", { class: "mrd-table__filter-range-label" }, format.t('filter_from', this.locale)), index$1.h("input", { type: "date", class: "mrd-table__filter-input", value: pf.from != null ? String(pf.from) : '', onInput: (e) => this.setPending('from', e.target.value) }), index$1.h("label", { class: "mrd-table__filter-range-label" }, format.t('filter_to', this.locale)), index$1.h("input", { type: "date", class: "mrd-table__filter-input", value: pf.to != null ? String(pf.to) : '', onInput: (e) => this.setPending('to', e.target.value) })))));
+            const dtOp = pf.operator;
+            const noInput = dtOp === 'isEmpty' || dtOp === 'isNotEmpty';
+            const rangeMode = !noInput && (pf.from !== undefined || pf.to !== undefined);
+            return (index$1.h("div", { class: "mrd-table__filter-editor" }, index$1.h("select", { class: "mrd-table__filter-select", onChange: (e) => {
+                    const val = e.target.value;
+                    if (val === 'isEmpty' || val === 'isNotEmpty') {
+                        this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: val, value: undefined, from: undefined, to: undefined });
+                    }
+                    else {
+                        this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: undefined });
+                    }
+                } }, index$1.h("option", { value: "", selected: !noInput }, format.t('filter_has_value', this.locale)), index$1.h("option", { value: "isEmpty", selected: dtOp === 'isEmpty' }, format.t('filter_is_empty', this.locale)), index$1.h("option", { value: "isNotEmpty", selected: dtOp === 'isNotEmpty' }, format.t('filter_is_not_empty', this.locale))), !noInput && (index$1.h("div", { class: "mrd-table__filter-editor" }, index$1.h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), format.t('filter_exact', this.locale)), index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), format.t('filter_range', this.locale))), !rangeMode ? (index$1.h("input", { type: "date", class: "mrd-table__filter-input", value: String((_g = pf.value) !== null && _g !== void 0 ? _g : ''), onInput: (e) => this.setPending('value', e.target.value) })) : (index$1.h("div", { class: "mrd-table__filter-range mrd-table__filter-range--stacked" }, index$1.h("label", { class: "mrd-table__filter-range-label" }, format.t('filter_from', this.locale)), index$1.h("input", { type: "date", class: "mrd-table__filter-input", value: pf.from != null ? String(pf.from) : '', onInput: (e) => this.setPending('from', e.target.value) }), index$1.h("label", { class: "mrd-table__filter-range-label" }, format.t('filter_to', this.locale)), index$1.h("input", { type: "date", class: "mrd-table__filter-input", value: pf.to != null ? String(pf.to) : '', onInput: (e) => this.setPending('to', e.target.value) })))))));
         }
         if (DATE_TYPES.has(dataType)) {
             const inputType = dataType === 'DATE' ? 'date' : 'time';
-            const rangeMode = pf.from !== undefined || pf.to !== undefined;
-            return (index$1.h("div", { class: "mrd-table__filter-editor" }, index$1.h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), format.t('filter_exact', this.locale)), index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), format.t('filter_range', this.locale))), !rangeMode ? (index$1.h("input", { type: inputType, class: "mrd-table__filter-input", value: String((_h = pf.value) !== null && _h !== void 0 ? _h : ''), onInput: (e) => this.setPending('value', e.target.value) })) : (index$1.h("div", { class: "mrd-table__filter-range" }, index$1.h("input", { type: inputType, class: "mrd-table__filter-input", placeholder: format.t('filter_from', this.locale), value: pf.from != null ? String(pf.from) : '', onInput: (e) => this.setPending('from', e.target.value) }), index$1.h("input", { type: inputType, class: "mrd-table__filter-input", placeholder: format.t('filter_to', this.locale), value: pf.to != null ? String(pf.to) : '', onInput: (e) => this.setPending('to', e.target.value) })))));
+            const dtdOp = pf.operator;
+            const noInput = dtdOp === 'isEmpty' || dtdOp === 'isNotEmpty';
+            const rangeMode = !noInput && (pf.from !== undefined || pf.to !== undefined);
+            return (index$1.h("div", { class: "mrd-table__filter-editor" }, index$1.h("select", { class: "mrd-table__filter-select", onChange: (e) => {
+                    const val = e.target.value;
+                    if (val === 'isEmpty' || val === 'isNotEmpty') {
+                        this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: val, value: undefined, from: undefined, to: undefined });
+                    }
+                    else {
+                        this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: undefined });
+                    }
+                } }, index$1.h("option", { value: "", selected: !noInput }, format.t('filter_has_value', this.locale)), index$1.h("option", { value: "isEmpty", selected: dtdOp === 'isEmpty' }, format.t('filter_is_empty', this.locale)), index$1.h("option", { value: "isNotEmpty", selected: dtdOp === 'isNotEmpty' }, format.t('filter_is_not_empty', this.locale))), !noInput && (index$1.h("div", { class: "mrd-table__filter-editor" }, index$1.h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), format.t('filter_exact', this.locale)), index$1.h("label", { class: "mrd-table__filter-radio-label" }, index$1.h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), format.t('filter_range', this.locale))), !rangeMode ? (index$1.h("input", { type: inputType, class: "mrd-table__filter-input", value: String((_h = pf.value) !== null && _h !== void 0 ? _h : ''), onInput: (e) => this.setPending('value', e.target.value) })) : (index$1.h("div", { class: "mrd-table__filter-range" }, index$1.h("input", { type: inputType, class: "mrd-table__filter-input", placeholder: format.t('filter_from', this.locale), value: pf.from != null ? String(pf.from) : '', onInput: (e) => this.setPending('from', e.target.value) }), index$1.h("input", { type: inputType, class: "mrd-table__filter-input", placeholder: format.t('filter_to', this.locale), value: pf.to != null ? String(pf.to) : '', onInput: (e) => this.setPending('to', e.target.value) })))))));
         }
         return null;
     }

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

@@ -55,7 +55,7 @@ export class MrdForm {
                     relatedClass: rel.relatedClass,
                     mostSignificantClass: rel.mostSignificantClass,
                     commonRelation: rel.commonRelation,
-                    filter: rel.commonRelation,
+                    filter: rel.commonRelation + '_href',
                     filterValue: newHref, // empty string when dependency was cleared → host should clear the list
                 });
             }
@@ -180,7 +180,7 @@ export class MrdForm {
                     relatedClass: rel.relatedClass,
                     mostSignificantClass: rel.mostSignificantClass,
                     commonRelation: rel.commonRelation,
-                    filter: rel.commonRelation,
+                    filter: rel.commonRelation + '_href',
                     filterValue,
                 });
             }

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

@@ -338,7 +338,7 @@ export class MrdTable {
         // "YYYY-MM-DD" dates so the date inputs show what the user originally entered.
         // If from and to cover the same local day it was an exact-date filter — restore
         // to exact mode so the user sees the single-date input again.
-        if (dataType === 'DATETIME' && existing) {
+        if (dataType === 'DATETIME' && existing && existing.operator !== 'isEmpty' && existing.operator !== 'isNotEmpty') {
             const display = Object.assign({}, existing);
             if (typeof display.from === 'string' && display.from)
                 display.from = this.utcISOToLocalDate(display.from);
@@ -458,7 +458,7 @@ export class MrdTable {
         // Exact date → range covering the full local day (from = midnight, to = next midnight).
         // "to" is always the exclusive end (midnight of the next local day).
         let normalized = Object.assign({}, f);
-        if (f.dataType === 'DATETIME') {
+        if (f.dataType === 'DATETIME' && f.operator !== 'isEmpty' && f.operator !== 'isNotEmpty') {
             if (typeof normalized.value === 'string' && normalized.value) {
                 normalized.from = this.dateLocalToUTCStart(normalized.value);
                 normalized.to = this.dateLocalToUTCEndExclusive(normalized.value);
@@ -534,11 +534,13 @@ export class MrdTable {
             return h("p", { class: "mrd-table__filter-no-support" }, t('filter_no_support', this.locale));
         }
         if (dataType === 'BOOLEAN') {
+            const boolOp = pf.operator;
+            const noValueOp = boolOp === 'isEmpty' || boolOp === 'isNotEmpty';
             return (h("div", { class: "mrd-table__filter-radio-group" }, [
                 { labelKey: 'filter_all', value: null },
                 { labelKey: 'yes', value: true },
                 { labelKey: 'no', value: false },
-            ].map(opt => (h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `bf-${this.openFilterCol}`, checked: pf.value === opt.value, onChange: () => this.setPending('value', opt.value) }), t(opt.labelKey, this.locale))))));
+            ].map(opt => (h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `bf-${this.openFilterCol}`, checked: !noValueOp && pf.value === opt.value, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: undefined, value: opt.value }); } }), t(opt.labelKey, this.locale)))), h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `bf-${this.openFilterCol}`, checked: boolOp === 'isEmpty', onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: 'isEmpty', value: undefined }); } }), t('filter_is_empty', this.locale)), h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `bf-${this.openFilterCol}`, checked: boolOp === 'isNotEmpty', onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: 'isNotEmpty', value: undefined }); } }), t('filter_is_not_empty', this.locale))));
         }
         if (dataType === 'LIST') {
             const items = (_c = (_b = col.field) === null || _b === void 0 ? void 0 : _b.listItems) !== null && _c !== void 0 ? _c : [];
@@ -556,17 +558,47 @@ export class MrdTable {
             ].map(o => h("option", { value: o.val, selected: op === o.val }, t(o.labelKey, this.locale)))), !noInput && (h("input", { type: "text", class: "mrd-table__filter-input", value: String((_f = pf.value) !== null && _f !== void 0 ? _f : ''), placeholder: t('filter_search_value', this.locale), onInput: (e) => this.setPending('value', e.target.value) }))));
         }
         if (NUMERIC_TYPES.has(dataType)) {
-            const rangeMode = pf.from !== undefined || pf.to !== undefined;
-            return (h("div", { class: "mrd-table__filter-editor" }, h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `nm-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), t('filter_exact', this.locale)), h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `nm-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), t('filter_range', this.locale))), !rangeMode ? (h("input", { type: "number", class: "mrd-table__filter-input", value: pf.value != null ? String(pf.value) : '', onInput: (e) => this.setPending('value', e.target.value) })) : (h("div", { class: "mrd-table__filter-range" }, h("input", { type: "number", class: "mrd-table__filter-input", placeholder: t('filter_from', this.locale), value: pf.from != null ? String(pf.from) : '', onInput: (e) => this.setPending('from', e.target.value) }), h("span", { class: "mrd-table__filter-range-sep" }, "\u2013"), h("input", { type: "number", class: "mrd-table__filter-input", placeholder: t('filter_to', this.locale), value: pf.to != null ? String(pf.to) : '', onInput: (e) => this.setPending('to', e.target.value) })))));
+            const numOp = pf.operator;
+            const noInput = numOp === 'isEmpty' || numOp === 'isNotEmpty';
+            const rangeMode = !noInput && (pf.from !== undefined || pf.to !== undefined);
+            return (h("div", { class: "mrd-table__filter-editor" }, h("select", { class: "mrd-table__filter-select", onChange: (e) => {
+                    const val = e.target.value;
+                    if (val === 'isEmpty' || val === 'isNotEmpty') {
+                        this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: val, value: undefined, from: undefined, to: undefined });
+                    }
+                    else {
+                        this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: undefined });
+                    }
+                } }, h("option", { value: "", selected: !noInput }, t('filter_has_value', this.locale)), h("option", { value: "isEmpty", selected: numOp === 'isEmpty' }, t('filter_is_empty', this.locale)), h("option", { value: "isNotEmpty", selected: numOp === 'isNotEmpty' }, t('filter_is_not_empty', this.locale))), !noInput && (h("div", { class: "mrd-table__filter-editor" }, h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `nm-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), t('filter_exact', this.locale)), h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `nm-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), t('filter_range', this.locale))), !rangeMode ? (h("input", { type: "number", class: "mrd-table__filter-input", value: pf.value != null ? String(pf.value) : '', onInput: (e) => this.setPending('value', e.target.value) })) : (h("div", { class: "mrd-table__filter-range" }, h("input", { type: "number", class: "mrd-table__filter-input", placeholder: t('filter_from', this.locale), value: pf.from != null ? String(pf.from) : '', onInput: (e) => this.setPending('from', e.target.value) }), h("span", { class: "mrd-table__filter-range-sep" }, "\u2013"), h("input", { type: "number", class: "mrd-table__filter-input", placeholder: t('filter_to', this.locale), value: pf.to != null ? String(pf.to) : '', onInput: (e) => this.setPending('to', e.target.value) })))))));
         }
         if (dataType === 'DATETIME') {
-            const rangeMode = pf.from !== undefined || pf.to !== undefined;
-            return (h("div", { class: "mrd-table__filter-editor" }, h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), t('filter_exact', this.locale)), h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), t('filter_range', this.locale))), !rangeMode ? (h("input", { type: "date", class: "mrd-table__filter-input", value: String((_g = pf.value) !== null && _g !== void 0 ? _g : ''), onInput: (e) => this.setPending('value', e.target.value) })) : (h("div", { class: "mrd-table__filter-range mrd-table__filter-range--stacked" }, h("label", { class: "mrd-table__filter-range-label" }, t('filter_from', this.locale)), h("input", { type: "date", class: "mrd-table__filter-input", value: pf.from != null ? String(pf.from) : '', onInput: (e) => this.setPending('from', e.target.value) }), h("label", { class: "mrd-table__filter-range-label" }, t('filter_to', this.locale)), h("input", { type: "date", class: "mrd-table__filter-input", value: pf.to != null ? String(pf.to) : '', onInput: (e) => this.setPending('to', e.target.value) })))));
+            const dtOp = pf.operator;
+            const noInput = dtOp === 'isEmpty' || dtOp === 'isNotEmpty';
+            const rangeMode = !noInput && (pf.from !== undefined || pf.to !== undefined);
+            return (h("div", { class: "mrd-table__filter-editor" }, h("select", { class: "mrd-table__filter-select", onChange: (e) => {
+                    const val = e.target.value;
+                    if (val === 'isEmpty' || val === 'isNotEmpty') {
+                        this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: val, value: undefined, from: undefined, to: undefined });
+                    }
+                    else {
+                        this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: undefined });
+                    }
+                } }, h("option", { value: "", selected: !noInput }, t('filter_has_value', this.locale)), h("option", { value: "isEmpty", selected: dtOp === 'isEmpty' }, t('filter_is_empty', this.locale)), h("option", { value: "isNotEmpty", selected: dtOp === 'isNotEmpty' }, t('filter_is_not_empty', this.locale))), !noInput && (h("div", { class: "mrd-table__filter-editor" }, h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), t('filter_exact', this.locale)), h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), t('filter_range', this.locale))), !rangeMode ? (h("input", { type: "date", class: "mrd-table__filter-input", value: String((_g = pf.value) !== null && _g !== void 0 ? _g : ''), onInput: (e) => this.setPending('value', e.target.value) })) : (h("div", { class: "mrd-table__filter-range mrd-table__filter-range--stacked" }, h("label", { class: "mrd-table__filter-range-label" }, t('filter_from', this.locale)), h("input", { type: "date", class: "mrd-table__filter-input", value: pf.from != null ? String(pf.from) : '', onInput: (e) => this.setPending('from', e.target.value) }), h("label", { class: "mrd-table__filter-range-label" }, t('filter_to', this.locale)), h("input", { type: "date", class: "mrd-table__filter-input", value: pf.to != null ? String(pf.to) : '', onInput: (e) => this.setPending('to', e.target.value) })))))));
         }
         if (DATE_TYPES.has(dataType)) {
             const inputType = dataType === 'DATE' ? 'date' : 'time';
-            const rangeMode = pf.from !== undefined || pf.to !== undefined;
-            return (h("div", { class: "mrd-table__filter-editor" }, h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), t('filter_exact', this.locale)), h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), t('filter_range', this.locale))), !rangeMode ? (h("input", { type: inputType, class: "mrd-table__filter-input", value: String((_h = pf.value) !== null && _h !== void 0 ? _h : ''), onInput: (e) => this.setPending('value', e.target.value) })) : (h("div", { class: "mrd-table__filter-range" }, h("input", { type: inputType, class: "mrd-table__filter-input", placeholder: t('filter_from', this.locale), value: pf.from != null ? String(pf.from) : '', onInput: (e) => this.setPending('from', e.target.value) }), h("input", { type: inputType, class: "mrd-table__filter-input", placeholder: t('filter_to', this.locale), value: pf.to != null ? String(pf.to) : '', onInput: (e) => this.setPending('to', e.target.value) })))));
+            const dtdOp = pf.operator;
+            const noInput = dtdOp === 'isEmpty' || dtdOp === 'isNotEmpty';
+            const rangeMode = !noInput && (pf.from !== undefined || pf.to !== undefined);
+            return (h("div", { class: "mrd-table__filter-editor" }, h("select", { class: "mrd-table__filter-select", onChange: (e) => {
+                    const val = e.target.value;
+                    if (val === 'isEmpty' || val === 'isNotEmpty') {
+                        this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: val, value: undefined, from: undefined, to: undefined });
+                    }
+                    else {
+                        this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: undefined });
+                    }
+                } }, h("option", { value: "", selected: !noInput }, t('filter_has_value', this.locale)), h("option", { value: "isEmpty", selected: dtdOp === 'isEmpty' }, t('filter_is_empty', this.locale)), h("option", { value: "isNotEmpty", selected: dtdOp === 'isNotEmpty' }, t('filter_is_not_empty', this.locale))), !noInput && (h("div", { class: "mrd-table__filter-editor" }, h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), t('filter_exact', this.locale)), h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), t('filter_range', this.locale))), !rangeMode ? (h("input", { type: inputType, class: "mrd-table__filter-input", value: String((_h = pf.value) !== null && _h !== void 0 ? _h : ''), onInput: (e) => this.setPending('value', e.target.value) })) : (h("div", { class: "mrd-table__filter-range" }, h("input", { type: inputType, class: "mrd-table__filter-input", placeholder: t('filter_from', this.locale), value: pf.from != null ? String(pf.from) : '', onInput: (e) => this.setPending('from', e.target.value) }), h("input", { type: inputType, class: "mrd-table__filter-input", placeholder: t('filter_to', this.locale), value: pf.to != null ? String(pf.to) : '', onInput: (e) => this.setPending('to', e.target.value) })))))));
         }
         return null;
     }

package/dist/collection/utils/i18n.js

@@ -42,6 +42,7 @@ const translations = {
         filter_contains: 'Bevat',
         filter_starts_with: 'Begint met',
         filter_equals: 'Gelijk aan',
+        filter_has_value: 'Heeft waarde',
         filter_is_empty: 'Is leeg',
         filter_is_not_empty: 'Is niet leeg',
         filter_exact: 'Exact',
@@ -100,6 +101,7 @@ const translations = {
         filter_contains: 'Contains',
         filter_starts_with: 'Starts with',
         filter_equals: 'Equals',
+        filter_has_value: 'Has value',
         filter_is_empty: 'Is empty',
         filter_is_not_empty: 'Is not empty',
         filter_exact: 'Exact',
@@ -158,6 +160,7 @@ const translations = {
         filter_contains: 'يحتوي على',
         filter_starts_with: 'يبدأ بـ',
         filter_equals: 'يساوي',
+        filter_has_value: 'له قيمة',
         filter_is_empty: 'فارغ',
         filter_is_not_empty: 'ليس فارغاً',
         filter_exact: 'دقيق',
@@ -216,6 +219,7 @@ const translations = {
         filter_contains: 'Contient',
         filter_starts_with: 'Commence par',
         filter_equals: 'Égal à',
+        filter_has_value: 'A une valeur',
         filter_is_empty: 'Est vide',
         filter_is_not_empty: "N'est pas vide",
         filter_exact: 'Exact',

package/dist/components/i18n.js

@@ -1 +1 @@
-const e={nl:{required:"Dit veld is verplicht",select_placeholder:"Selecteer een optie",search_placeholder:"Zoeken...",upload_file:"Bestand uploaden",choose_file:"Bestand kiezen",clear:"Wissen",today:"Vandaag",invalid_email:"Voer een geldig e-mailadres in",invalid_url:"Voer een geldige URL in",invalid_number:"Voer een geldig getal in",drop_file_here:"Sleep bestand hierheen of",browse:"bladeren",file_too_large:"Bestand is te groot",search_results:"Zoekresultaten",no_results:"Geen resultaten gevonden",loading:"Laden...",submit:"Opslaan",cancel:"Annuleren",remove:"Verwijderen",add:"Toevoegen",yes:"Ja",no:"Nee",table_of:"van",download:"Downloaden",table_filter:"Filteren",table_filter_hide:"Filter verbergen",table_filter_active:"actief",table_filter_clear_all:"Alle filters wissen",table_new_record:"Nieuw record",table_export_excel:"Exporteer naar Excel",filter_sorting:"Sortering",filter_ascending:"Oplopend",filter_descending:"Aflopend",filter_section:"Filter",filter_apply:"Toepassen",filter_clear:"Wissen",filter_contains:"Bevat",filter_starts_with:"Begint met",filter_equals:"Gelijk aan",filter_is_empty:"Is leeg",filter_is_not_empty:"Is niet leeg",filter_exact:"Exact",filter_range:"Bereik",filter_from:"Van",filter_to:"Tot",filter_all:"Alle",filter_select_all:"Alles",filter_select_none:"Geen",filter_search_value:"Zoekwaarde...",filter_no_support:"Geen filtering beschikbaar voor dit veldtype.",textblock_show_more:"Meer tonen",close:"Sluiten"},en:{required:"This field is required",select_placeholder:"Select an option",search_placeholder:"Search...",upload_file:"Upload file",choose_file:"Choose file",clear:"Clear",today:"Today",invalid_email:"Please enter a valid email address",invalid_url:"Please enter a valid URL",invalid_number:"Please enter a valid number",drop_file_here:"Drop file here or",browse:"browse",file_too_large:"File is too large",search_results:"Search results",no_results:"No results found",loading:"Loading...",submit:"Save",cancel:"Cancel",remove:"Remove",add:"Add",yes:"Yes",no:"No",table_of:"of",download:"Download",table_filter:"Filter",table_filter_hide:"Hide filter",table_filter_active:"active",table_filter_clear_all:"Clear all filters",table_new_record:"New record",table_export_excel:"Export to Excel",filter_sorting:"Sorting",filter_ascending:"Ascending",filter_descending:"Descending",filter_section:"Filter",filter_apply:"Apply",filter_clear:"Clear",filter_contains:"Contains",filter_starts_with:"Starts with",filter_equals:"Equals",filter_is_empty:"Is empty",filter_is_not_empty:"Is not empty",filter_exact:"Exact",filter_range:"Range",filter_from:"From",filter_to:"To",filter_all:"All",filter_select_all:"All",filter_select_none:"None",filter_search_value:"Search value...",filter_no_support:"Filtering is not available for this field type.",textblock_show_more:"Show more",close:"Close"},ar:{required:"هذا الحقل مطلوب",select_placeholder:"اختر خياراً",search_placeholder:"بحث...",upload_file:"رفع ملف",choose_file:"اختر ملفاً",clear:"مسح",today:"اليوم",invalid_email:"يرجى إدخال عنوان بريد إلكتروني صحيح",invalid_url:"يرجى إدخال رابط صحيح",invalid_number:"يرجى إدخال رقم صحيح",drop_file_here:"اسحب الملف هنا أو",browse:"تصفح",file_too_large:"الملف كبير جداً",search_results:"نتائج البحث",no_results:"لم يتم العثور على نتائج",loading:"جار التحميل...",submit:"حفظ",cancel:"إلغاء",remove:"إزالة",add:"إضافة",yes:"نعم",no:"لا",table_of:"من أصل",download:"تنزيل",table_filter:"تصفية",table_filter_hide:"إخفاء التصفية",table_filter_active:"نشط",table_filter_clear_all:"مسح جميع الفلاتر",table_new_record:"سجل جديد",table_export_excel:"تصدير إلى Excel",filter_sorting:"الترتيب",filter_ascending:"تصاعدي",filter_descending:"تنازلي",filter_section:"تصفية",filter_apply:"تطبيق",filter_clear:"مسح",filter_contains:"يحتوي على",filter_starts_with:"يبدأ بـ",filter_equals:"يساوي",filter_is_empty:"فارغ",filter_is_not_empty:"ليس فارغاً",filter_exact:"دقيق",filter_range:"نطاق",filter_from:"من",filter_to:"إلى",filter_all:"الكل",filter_select_all:"الكل",filter_select_none:"لا شيء",filter_search_value:"قيمة البحث...",filter_no_support:"التصفية غير متاحة لهذا النوع من الحقول.",textblock_show_more:"عرض المزيد",close:"إغلاق"},fr:{required:"Ce champ est obligatoire",select_placeholder:"Sélectionner une option",search_placeholder:"Rechercher...",upload_file:"Télécharger un fichier",choose_file:"Choisir un fichier",clear:"Effacer",today:"Aujourd'hui",invalid_email:"Veuillez saisir une adresse e-mail valide",invalid_url:"Veuillez saisir une URL valide",invalid_number:"Veuillez saisir un nombre valide",drop_file_here:"Déposez le fichier ici ou",browse:"parcourir",file_too_large:"Le fichier est trop volumineux",search_results:"Résultats de recherche",no_results:"Aucun résultat trouvé",loading:"Chargement...",submit:"Enregistrer",cancel:"Annuler",remove:"Supprimer",add:"Ajouter",yes:"Oui",no:"Non",table_of:"sur",download:"Télécharger",table_filter:"Filtrer",table_filter_hide:"Masquer le filtre",table_filter_active:"actif",table_filter_clear_all:"Effacer tous les filtres",table_new_record:"Nouvel enregistrement",table_export_excel:"Exporter vers Excel",filter_sorting:"Tri",filter_ascending:"Croissant",filter_descending:"Décroissant",filter_section:"Filtre",filter_apply:"Appliquer",filter_clear:"Effacer",filter_contains:"Contient",filter_starts_with:"Commence par",filter_equals:"Égal à",filter_is_empty:"Est vide",filter_is_not_empty:"N'est pas vide",filter_exact:"Exact",filter_range:"Plage",filter_from:"De",filter_to:"À",filter_all:"Tous",filter_select_all:"Tous",filter_select_none:"Aucun",filter_search_value:"Valeur de recherche...",filter_no_support:"Le filtrage n'est pas disponible pour ce type de champ.",textblock_show_more:"Voir plus",close:"Fermer"}};function l(l,r){var t,i,a;const _=r.split("-")[0].toLowerCase();return null!==(a=null!==(i=(null!==(t=e[_])&&void 0!==t?t:e.en)[l])&&void 0!==i?i:e.en[l])&&void 0!==a?a:l}export{l as t}
+const e={nl:{required:"Dit veld is verplicht",select_placeholder:"Selecteer een optie",search_placeholder:"Zoeken...",upload_file:"Bestand uploaden",choose_file:"Bestand kiezen",clear:"Wissen",today:"Vandaag",invalid_email:"Voer een geldig e-mailadres in",invalid_url:"Voer een geldige URL in",invalid_number:"Voer een geldig getal in",drop_file_here:"Sleep bestand hierheen of",browse:"bladeren",file_too_large:"Bestand is te groot",search_results:"Zoekresultaten",no_results:"Geen resultaten gevonden",loading:"Laden...",submit:"Opslaan",cancel:"Annuleren",remove:"Verwijderen",add:"Toevoegen",yes:"Ja",no:"Nee",table_of:"van",download:"Downloaden",table_filter:"Filteren",table_filter_hide:"Filter verbergen",table_filter_active:"actief",table_filter_clear_all:"Alle filters wissen",table_new_record:"Nieuw record",table_export_excel:"Exporteer naar Excel",filter_sorting:"Sortering",filter_ascending:"Oplopend",filter_descending:"Aflopend",filter_section:"Filter",filter_apply:"Toepassen",filter_clear:"Wissen",filter_contains:"Bevat",filter_starts_with:"Begint met",filter_equals:"Gelijk aan",filter_has_value:"Heeft waarde",filter_is_empty:"Is leeg",filter_is_not_empty:"Is niet leeg",filter_exact:"Exact",filter_range:"Bereik",filter_from:"Van",filter_to:"Tot",filter_all:"Alle",filter_select_all:"Alles",filter_select_none:"Geen",filter_search_value:"Zoekwaarde...",filter_no_support:"Geen filtering beschikbaar voor dit veldtype.",textblock_show_more:"Meer tonen",close:"Sluiten"},en:{required:"This field is required",select_placeholder:"Select an option",search_placeholder:"Search...",upload_file:"Upload file",choose_file:"Choose file",clear:"Clear",today:"Today",invalid_email:"Please enter a valid email address",invalid_url:"Please enter a valid URL",invalid_number:"Please enter a valid number",drop_file_here:"Drop file here or",browse:"browse",file_too_large:"File is too large",search_results:"Search results",no_results:"No results found",loading:"Loading...",submit:"Save",cancel:"Cancel",remove:"Remove",add:"Add",yes:"Yes",no:"No",table_of:"of",download:"Download",table_filter:"Filter",table_filter_hide:"Hide filter",table_filter_active:"active",table_filter_clear_all:"Clear all filters",table_new_record:"New record",table_export_excel:"Export to Excel",filter_sorting:"Sorting",filter_ascending:"Ascending",filter_descending:"Descending",filter_section:"Filter",filter_apply:"Apply",filter_clear:"Clear",filter_contains:"Contains",filter_starts_with:"Starts with",filter_equals:"Equals",filter_has_value:"Has value",filter_is_empty:"Is empty",filter_is_not_empty:"Is not empty",filter_exact:"Exact",filter_range:"Range",filter_from:"From",filter_to:"To",filter_all:"All",filter_select_all:"All",filter_select_none:"None",filter_search_value:"Search value...",filter_no_support:"Filtering is not available for this field type.",textblock_show_more:"Show more",close:"Close"},ar:{required:"هذا الحقل مطلوب",select_placeholder:"اختر خياراً",search_placeholder:"بحث...",upload_file:"رفع ملف",choose_file:"اختر ملفاً",clear:"مسح",today:"اليوم",invalid_email:"يرجى إدخال عنوان بريد إلكتروني صحيح",invalid_url:"يرجى إدخال رابط صحيح",invalid_number:"يرجى إدخال رقم صحيح",drop_file_here:"اسحب الملف هنا أو",browse:"تصفح",file_too_large:"الملف كبير جداً",search_results:"نتائج البحث",no_results:"لم يتم العثور على نتائج",loading:"جار التحميل...",submit:"حفظ",cancel:"إلغاء",remove:"إزالة",add:"إضافة",yes:"نعم",no:"لا",table_of:"من أصل",download:"تنزيل",table_filter:"تصفية",table_filter_hide:"إخفاء التصفية",table_filter_active:"نشط",table_filter_clear_all:"مسح جميع الفلاتر",table_new_record:"سجل جديد",table_export_excel:"تصدير إلى Excel",filter_sorting:"الترتيب",filter_ascending:"تصاعدي",filter_descending:"تنازلي",filter_section:"تصفية",filter_apply:"تطبيق",filter_clear:"مسح",filter_contains:"يحتوي على",filter_starts_with:"يبدأ بـ",filter_equals:"يساوي",filter_has_value:"له قيمة",filter_is_empty:"فارغ",filter_is_not_empty:"ليس فارغاً",filter_exact:"دقيق",filter_range:"نطاق",filter_from:"من",filter_to:"إلى",filter_all:"الكل",filter_select_all:"الكل",filter_select_none:"لا شيء",filter_search_value:"قيمة البحث...",filter_no_support:"التصفية غير متاحة لهذا النوع من الحقول.",textblock_show_more:"عرض المزيد",close:"إغلاق"},fr:{required:"Ce champ est obligatoire",select_placeholder:"Sélectionner une option",search_placeholder:"Rechercher...",upload_file:"Télécharger un fichier",choose_file:"Choisir un fichier",clear:"Effacer",today:"Aujourd'hui",invalid_email:"Veuillez saisir une adresse e-mail valide",invalid_url:"Veuillez saisir une URL valide",invalid_number:"Veuillez saisir un nombre valide",drop_file_here:"Déposez le fichier ici ou",browse:"parcourir",file_too_large:"Le fichier est trop volumineux",search_results:"Résultats de recherche",no_results:"Aucun résultat trouvé",loading:"Chargement...",submit:"Enregistrer",cancel:"Annuler",remove:"Supprimer",add:"Ajouter",yes:"Oui",no:"Non",table_of:"sur",download:"Télécharger",table_filter:"Filtrer",table_filter_hide:"Masquer le filtre",table_filter_active:"actif",table_filter_clear_all:"Effacer tous les filtres",table_new_record:"Nouvel enregistrement",table_export_excel:"Exporter vers Excel",filter_sorting:"Tri",filter_ascending:"Croissant",filter_descending:"Décroissant",filter_section:"Filtre",filter_apply:"Appliquer",filter_clear:"Effacer",filter_contains:"Contient",filter_starts_with:"Commence par",filter_equals:"Égal à",filter_has_value:"A une valeur",filter_is_empty:"Est vide",filter_is_not_empty:"N'est pas vide",filter_exact:"Exact",filter_range:"Plage",filter_from:"De",filter_to:"À",filter_all:"Tous",filter_select_all:"Tous",filter_select_none:"Aucun",filter_search_value:"Valeur de recherche...",filter_no_support:"Le filtrage n'est pas disponible pour ce type de champ.",textblock_show_more:"Voir plus",close:"Fermer"}};function l(l,r){var t,i,a;const _=r.split("-")[0].toLowerCase();return null!==(a=null!==(i=(null!==(t=e[_])&&void 0!==t?t:e.en)[l])&&void 0!==i?i:e.en[l])&&void 0!==a?a:l}export{l as t}

package/dist/components/mrd-form.js

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