@mmlogic/components 0.1.24 → 0.1.26

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

@@ -1,886 +0,0 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-_tsCCkAi.js';
-import { f as formatTime, a as formatDateTime, b as formatDate, c as formatCurrency, d as formatNumber, e as formatPercentage, t } from './format-CcRjWvcb.js';
-import { ClientLayoutItemType } from './index.js';
-
-class CellRenderer {
-    static render(column, row, locale) {
-        var _a, _b, _c, _d;
-        if (column.type === ClientLayoutItemType.RELATION) {
-            const name = (_b = (_a = column.relation) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '';
-            const link = (_c = row === null || row === void 0 ? void 0 : row._links) === null || _c === void 0 ? void 0 : _c[name];
-            if (!link)
-                return '';
-            if (Array.isArray(link))
-                return link.map((l) => { var _a; return (_a = l.name) !== null && _a !== void 0 ? _a : ''; }).filter(Boolean).join(', ');
-            return (_d = link.name) !== null && _d !== void 0 ? _d : '';
-        }
-        if (column.type !== ClientLayoutItemType.FIELD || !column.field)
-            return '';
-        const { name, dataType, listItems } = column.field;
-        const raw = row === null || row === void 0 ? void 0 : row[name];
-        if (raw == null || raw === '')
-            return '';
-        const values = Array.isArray(raw) ? raw : [raw];
-        return values
-            .map(v => CellRenderer.renderValue(dataType !== null && dataType !== void 0 ? dataType : 'TEXT', v, listItems !== null && listItems !== void 0 ? listItems : [], locale))
-            .filter(s => s !== '')
-            .join(', ');
-    }
-    static renderValue(dataType, value, listItems, locale) {
-        var _a, _b;
-        switch (dataType) {
-            case 'INTEGER':
-                return formatNumber(Number(value), locale, { maximumFractionDigits: 0 });
-            case 'DECIMAL':
-                return formatNumber(Number(value), locale);
-            case 'PERCENTAGE':
-                return formatPercentage(Number(value), locale);
-            case 'CURRENCY': {
-                const { amount, currency } = typeof value === 'object' && value !== null
-                    ? value
-                    : { amount: value, currency: '' };
-                return currency
-                    ? formatCurrency(Number(amount), currency, locale)
-                    : formatNumber(Number(amount), locale);
-            }
-            case 'DATE':
-                return formatDate(value, locale);
-            case 'DATETIME':
-                return formatDateTime(value, locale);
-            case 'TIME':
-                return formatTime(value, locale);
-            case 'BOOLEAN':
-                return value ? '✓' : '';
-            case 'FILE':
-            case 'IMAGE':
-                return typeof value === 'object' && value !== null ? ((_a = value.fileName) !== null && _a !== void 0 ? _a : '') : '';
-            case 'LIST': {
-                const item = listItems.find(li => li.key === String(value));
-                return (_b = item === null || item === void 0 ? void 0 : item.label) !== null && _b !== void 0 ? _b : String(value);
-            }
-            case 'TEXTBLOCK': {
-                const stripped = String(value).replace(/<[^>]*>/g, '');
-                const txt = document.createElement('textarea');
-                txt.innerHTML = stripped;
-                return txt.value.trim();
-            }
-            case 'LONGTEXT':
-                return String(value).replace(/[\r\n]+/g, ' ').trim();
-            case 'JSON': {
-                const str = typeof value === 'object' ? JSON.stringify(value) : String(value);
-                return str.replace(/[\r\n]+/g, ' ').trim();
-            }
-            default:
-                return String(value);
-        }
-    }
-}
-
-const mrdTableScss = () => `.sc-mrd-table-h{display:block;width:100%}.mrd-table__scroll.sc-mrd-table{overflow-y:auto;overflow-x:auto;border:1px solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);overflow-anchor:none}.mrd-table.sc-mrd-table{overflow-x:auto}.mrd-table__table.sc-mrd-table{width:auto;min-width:100%;border-collapse:collapse;font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-900)}.mrd-table__scroll.sc-mrd-table .mrd-table__table.sc-mrd-table{min-width:max-content}.mrd-table__header.sc-mrd-table{position:sticky;top:0;z-index:1;background:var(--mrd-color-white);text-align:left;padding:var(--mrd-space-2) var(--mrd-space-4);border-bottom:2px solid var(--mrd-border-color);color:var(--mrd-color-neutral-600);font-weight:var(--mrd-font-weight-medium);white-space:nowrap;font-size:var(--mrd-font-size-xs);text-transform:uppercase;letter-spacing:0.04em}.mrd-table__header--sortable.sc-mrd-table{cursor:pointer;user-select:none}.mrd-table__header--sortable.sc-mrd-table:hover{background:var(--mrd-color-neutral-50);color:var(--mrd-color-neutral-800)}.mrd-table__header--sorted-asc.sc-mrd-table,.mrd-table__header--sorted-desc.sc-mrd-table{color:var(--mrd-color-primary);border-bottom-color:var(--mrd-color-primary)}.mrd-table__header-label.sc-mrd-table{margin-right:var(--mrd-space-1)}.mrd-table__sort-icon.sc-mrd-table{font-size:0.85rem;opacity:0.4;vertical-align:middle}.mrd-table__header--sorted-asc.sc-mrd-table .mrd-table__sort-icon.sc-mrd-table,.mrd-table__header--sorted-desc.sc-mrd-table .mrd-table__sort-icon.sc-mrd-table{opacity:1;color:var(--mrd-color-primary)}.mrd-table__filter-icon.sc-mrd-table{display:inline-flex;align-items:center;vertical-align:middle;margin-left:var(--mrd-space-1);color:var(--mrd-color-primary)}.mrd-table__row.sc-mrd-table{border-bottom:1px solid var(--mrd-border-color)}.mrd-table__row.sc-mrd-table:hover{background:var(--mrd-color-neutral-200) !important}.mrd-table__row--clickable.sc-mrd-table{cursor:pointer}.mrd-table__spacer.sc-mrd-table{border:none}.mrd-table__spacer.sc-mrd-table td.sc-mrd-table{padding:0;border:none}.mrd-table__cell.sc-mrd-table{padding:var(--mrd-space-2) var(--mrd-space-4);vertical-align:top;white-space:nowrap}.mrd-table__cell--numeric.sc-mrd-table{text-align:right;font-variant-numeric:tabular-nums}.mrd-table__row--loading.sc-mrd-table{background:transparent}.mrd-table__cell--placeholder.sc-mrd-table{padding:var(--mrd-space-2) var(--mrd-space-4);border-bottom:1px solid var(--mrd-border-color)}.mrd-table__placeholder-bar.sc-mrd-table{display:block;height:0.75rem;width:55%;border-radius:var(--mrd-border-radius-sm);background:linear-gradient(     90deg,     var(--mrd-color-neutral-200) 25%,     var(--mrd-color-neutral-100) 50%,     var(--mrd-color-neutral-200) 75%   );background-size:200% 100%;animation:mrd-shimmer 1.4s ease infinite}@keyframes mrd-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}.mrd-table__toolbar.sc-mrd-table{display:flex;align-items:center;justify-content:space-between;padding-bottom:var(--mrd-space-2)}.mrd-table__toolbar-left.sc-mrd-table,.mrd-table__toolbar-right.sc-mrd-table{display:flex;gap:var(--mrd-space-2);align-items:center}.mrd-table__toolbar-center.sc-mrd-table{flex:1;display:flex;justify-content:center;align-items:center;gap:var(--mrd-space-1)}.mrd-table__view-title.sc-mrd-table{font-size:var(--mrd-font-size-sm);font-weight:600;color:var(--mrd-color-neutral-800)}.mrd-table__view-switcher.sc-mrd-table{position:relative}.mrd-table__view-switcher-btn.sc-mrd-table{display:inline-flex;align-items:center;gap:var(--mrd-space-1);background:none;border:none;cursor:pointer;padding:var(--mrd-space-1) var(--mrd-space-2);color:var(--mrd-color-neutral-400);font-size:var(--mrd-font-size-sm);border-radius:var(--mrd-border-radius);transition:color 0.15s, background-color 0.15s;line-height:1.4}.mrd-table__view-switcher-btn.sc-mrd-table:hover{color:var(--mrd-color-neutral-700);background-color:var(--mrd-color-neutral-50)}.mrd-table__view-switcher-label.sc-mrd-table{font-weight:var(--mrd-font-weight-medium)}.mrd-table__view-switcher-chevron.sc-mrd-table{width:1.1rem;height:1.1rem;flex-shrink:0;transition:transform 0.15s}.mrd-table__view-switcher-btn--open.sc-mrd-table .mrd-table__view-switcher-chevron.sc-mrd-table{transform:rotate(180deg)}.mrd-table__view-switcher-dropdown.sc-mrd-table{position:absolute;top:calc(100% + 4px);left:50%;transform:translateX(-50%);min-width:160px;background:var(--mrd-color-white);border:1px solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);box-shadow:var(--mrd-shadow-md, 0 4px 12px rgba(0,0,0,.12));z-index:var(--mrd-z-dropdown, 200);overflow:hidden}.mrd-table__view-switcher-item.sc-mrd-table{display:block;width:100%;padding:var(--mrd-space-2) var(--mrd-space-3);background:none;border:none;text-align:left;cursor:pointer;font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-700);white-space:nowrap;transition:background-color 0.1s, color 0.1s}.mrd-table__view-switcher-item.sc-mrd-table:hover{background-color:var(--mrd-color-neutral-50);color:var(--mrd-color-neutral-900)}.mrd-table__action.sc-mrd-table{position:relative;display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;padding:0;background:transparent;border:1px solid transparent;border-radius:var(--mrd-border-radius);cursor:pointer;color:var(--mrd-color-neutral-400);transition:background-color 0.15s, border-color 0.15s, color 0.15s}.mrd-table__action.sc-mrd-table:hover{background-color:var(--mrd-color-neutral-100);border-color:var(--mrd-color-neutral-300);color:var(--mrd-color-neutral-700)}.mrd-table__action.sc-mrd-table:disabled{opacity:0.4;cursor:not-allowed}.mrd-table__action--primary.sc-mrd-table{color:var(--mrd-color-neutral-500)}.mrd-table__action--primary.sc-mrd-table:hover{background:var(--mrd-color-primary);border-color:var(--mrd-color-primary);color:var(--mrd-color-white)}.mrd-table__action--danger.sc-mrd-table{color:var(--mrd-color-error)}.mrd-table__action--danger.sc-mrd-table:hover{background-color:var(--mrd-color-error-light, #fef2f2);border-color:var(--mrd-color-error)}.mrd-table__action-icon.sc-mrd-table{width:1.25rem;height:1.25rem;pointer-events:none;fill:currentColor}.mrd-table__action-tooltip.sc-mrd-table{display:none;position:absolute;bottom:calc(100% + 6px);right:0;padding:var(--mrd-space-1) var(--mrd-space-2);font-size:var(--mrd-font-size-xs);white-space:nowrap;background:var(--mrd-color-tooltip, #fffce1);color:var(--mrd-color-neutral-900);border:1px solid var(--mrd-border-color);border-radius:var(--mrd-border-radius-sm, var(--mrd-border-radius));pointer-events:none;z-index:10}.mrd-table__action.sc-mrd-table:hover .mrd-table__action-tooltip.sc-mrd-table{display:block}.mrd-table__filter-toggle--active.sc-mrd-table{background:var(--mrd-color-primary);border-color:var(--mrd-color-primary);color:var(--mrd-color-white)}.mrd-table__filter-toggle--active.sc-mrd-table:hover{background:var(--mrd-color-primary-dark, var(--mrd-color-primary));border-color:var(--mrd-color-primary-dark, var(--mrd-color-primary));color:var(--mrd-color-white)}.mrd-table__filter-badge.sc-mrd-table{position:absolute;top:-6px;right:-6px;min-width:1.25rem;height:1.25rem;padding:0 3px;background:var(--mrd-color-error, #e53e3e);color:var(--mrd-color-white);border-radius:9999px;font-size:0.65rem;font-weight:var(--mrd-font-weight-medium);line-height:1.25rem;text-align:center;pointer-events:none}.mrd-table__header--filtered.sc-mrd-table{color:var(--mrd-color-primary);border-bottom-color:var(--mrd-color-primary)}.mrd-table__filter-popup.sc-mrd-table{position:fixed;width:280px;background:var(--mrd-color-white);border:1px solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);box-shadow:var(--mrd-shadow-md, 0 4px 12px rgba(0,0,0,.12));z-index:var(--mrd-z-dropdown, 200);font-size:var(--mrd-font-size-sm)}.mrd-table__filter-popup-header.sc-mrd-table{display:flex;align-items:center;justify-content:space-between;padding:var(--mrd-space-2) var(--mrd-space-3);border-bottom:1px solid var(--mrd-border-color)}.mrd-table__filter-popup-title.sc-mrd-table{font-weight:var(--mrd-font-weight-medium);color:var(--mrd-color-neutral-800);font-size:var(--mrd-font-size-sm)}.mrd-table__filter-close.sc-mrd-table{background:transparent;border:none;cursor:pointer;color:var(--mrd-color-neutral-500);font-size:0.9rem;padding:2px 4px;border-radius:3px;line-height:1}.mrd-table__filter-close.sc-mrd-table:hover{background:var(--mrd-color-neutral-100);color:var(--mrd-color-neutral-800)}.mrd-table__filter-section.sc-mrd-table{padding:var(--mrd-space-2) var(--mrd-space-3)}.mrd-table__filter-section-label.sc-mrd-table{font-size:var(--mrd-font-size-xs);font-weight:var(--mrd-font-weight-medium);text-transform:uppercase;letter-spacing:0.04em;color:var(--mrd-color-neutral-500);margin-bottom:var(--mrd-space-2)}.mrd-table__filter-sort-buttons.sc-mrd-table{display:flex;gap:var(--mrd-space-2)}.mrd-table__filter-sort-btn.sc-mrd-table{flex:1;padding:var(--mrd-space-1) var(--mrd-space-2);background:transparent;border:1px solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);cursor:pointer;font-size:var(--mrd-font-size-xs);color:var(--mrd-color-neutral-700)}.mrd-table__filter-sort-btn.sc-mrd-table:hover{background:var(--mrd-color-neutral-100)}.mrd-table__filter-sort-btn--active.sc-mrd-table{background:var(--mrd-color-primary);border-color:var(--mrd-color-primary);color:var(--mrd-color-white)}.mrd-table__filter-divider.sc-mrd-table{height:1px;background:var(--mrd-border-color);margin:0}.mrd-table__filter-editor.sc-mrd-table{display:flex;flex-direction:column;gap:var(--mrd-space-2)}.mrd-table__filter-select.sc-mrd-table,.mrd-table__filter-input.sc-mrd-table{width:100%;padding:var(--mrd-space-1) var(--mrd-space-2);border:1px solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-900);background:var(--mrd-color-white);box-sizing:border-box}.mrd-table__filter-select.sc-mrd-table:focus,.mrd-table__filter-input.sc-mrd-table:focus{outline:none;border-color:var(--mrd-color-primary);box-shadow:0 0 0 2px rgba(0,0,0,.06)}.mrd-table__filter-range.sc-mrd-table{display:flex;align-items:center;gap:var(--mrd-space-1)}.mrd-table__filter-range.sc-mrd-table .mrd-table__filter-input.sc-mrd-table{flex:1;min-width:0}.mrd-table__filter-range-sep.sc-mrd-table{color:var(--mrd-color-neutral-400);flex-shrink:0}.mrd-table__filter-range--stacked.sc-mrd-table{flex-direction:column;align-items:stretch;gap:var(--mrd-space-2)}.mrd-table__filter-range-label.sc-mrd-table{font-size:var(--mrd-font-size-xs);color:var(--mrd-color-neutral-500);margin-bottom:2px}.mrd-table__filter-radio-group.sc-mrd-table{display:flex;flex-direction:column;gap:var(--mrd-space-1)}.mrd-table__filter-radio-group--inline.sc-mrd-table{flex-direction:row;gap:var(--mrd-space-3)}.mrd-table__filter-radio-label.sc-mrd-table{display:flex;align-items:center;gap:var(--mrd-space-1);cursor:pointer;font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-800)}.mrd-table__filter-list.sc-mrd-table{display:flex;flex-direction:column;gap:var(--mrd-space-1);max-height:180px;overflow-y:auto}.mrd-table__filter-list-controls.sc-mrd-table{display:flex;gap:var(--mrd-space-2);margin-bottom:var(--mrd-space-1)}.mrd-table__filter-list-btn.sc-mrd-table{font-size:var(--mrd-font-size-xs);color:var(--mrd-color-primary);background:transparent;border:none;cursor:pointer;padding:0;text-decoration:underline}.mrd-table__filter-checkbox-label.sc-mrd-table{display:flex;align-items:center;gap:var(--mrd-space-1);cursor:pointer;font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-800)}.mrd-table__filter-no-support.sc-mrd-table{font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-500);margin:0;font-style:italic}.mrd-table__filter-popup-footer.sc-mrd-table{display:flex;justify-content:flex-end;gap:var(--mrd-space-2);padding:var(--mrd-space-2) var(--mrd-space-3);border-top:1px solid var(--mrd-border-color)}.mrd-table__filter-btn.sc-mrd-table{padding:var(--mrd-space-1) var(--mrd-space-3);border-radius:var(--mrd-border-radius);border:1px solid var(--mrd-border-color);font-size:var(--mrd-font-size-sm);cursor:pointer}.mrd-table__filter-btn--clear.sc-mrd-table{background:transparent;color:var(--mrd-color-neutral-600)}.mrd-table__filter-btn--clear.sc-mrd-table:hover{background:var(--mrd-color-neutral-100)}.mrd-table__filter-btn--apply.sc-mrd-table{background:var(--mrd-color-primary);border-color:var(--mrd-color-primary);color:var(--mrd-color-white)}.mrd-table__filter-btn--apply.sc-mrd-table:hover{background:var(--mrd-color-primary-dark, var(--mrd-color-primary));border-color:var(--mrd-color-primary-dark, var(--mrd-color-primary))}.mrd-table__totals-row.sc-mrd-table{border-top:2px solid var(--mrd-border-color)}.mrd-table__totals-cell.sc-mrd-table{position:sticky;bottom:0;z-index:2;padding:var(--mrd-space-2) var(--mrd-space-4);background:var(--mrd-color-white);font-weight:var(--mrd-font-weight-medium);font-variant-numeric:tabular-nums;white-space:nowrap;border-top:2px solid var(--mrd-border-color)}.mrd-table__totals-cell--numeric.sc-mrd-table{text-align:right}.mrd-table__footer.sc-mrd-table{padding:var(--mrd-space-1) var(--mrd-space-2);font-size:var(--mrd-font-size-xs);color:var(--mrd-color-neutral-500);text-align:right}.mrd-table__empty.sc-mrd-table{padding:var(--mrd-space-4) var(--mrd-space-3);color:var(--mrd-color-neutral-500);font-size:var(--mrd-font-size-sm);text-align:center;margin:0}.mrd-table__file-btn.sc-mrd-table{display:inline-flex;align-items:center;gap:var(--mrd-space-1);background:none;border:none;padding:0;cursor:pointer;color:var(--mrd-color-primary);font-size:var(--mrd-font-size-sm);font-family:inherit;max-width:100%;overflow:hidden}.mrd-table__file-btn.sc-mrd-table:hover{text-decoration:underline;color:var(--mrd-color-primary-dark)}.mrd-table__file-icon.sc-mrd-table{flex-shrink:0;width:1rem;height:1rem}.mrd-table__textblock-btn.sc-mrd-table{display:inline;background:none;border:none;padding:0 0 0 var(--mrd-space-1);cursor:pointer;color:var(--mrd-color-primary);font-size:var(--mrd-font-size-sm);font-family:inherit;line-height:inherit;vertical-align:middle}.mrd-table__textblock-btn.sc-mrd-table:hover{color:var(--mrd-color-primary-dark)}.mrd-table__modal-backdrop.sc-mrd-table{position:fixed;inset:0;background:rgba(0, 0, 0, 0.4);z-index:var(--mrd-z-modal, 300);display:flex;align-items:center;justify-content:center}.mrd-table__modal.sc-mrd-table{background:#fff;border-radius:var(--mrd-radius-md, 0.5rem);padding:var(--mrd-space-6);max-width:min(600px, 90vw);max-height:70vh;overflow-y:auto;position:relative;box-shadow:var(--mrd-shadow-lg)}.mrd-table__modal-close.sc-mrd-table{position:absolute;top:var(--mrd-space-3);right:var(--mrd-space-3);background:none;border:none;cursor:pointer;font-size:1.25rem;line-height:1;color:var(--mrd-color-text-muted, #6b7280);padding:0}.mrd-table__modal-close.sc-mrd-table:hover{color:var(--mrd-color-text, #111827)}.mrd-table__modal-text.sc-mrd-table{margin:0;padding-right:var(--mrd-space-6);white-space:pre-wrap;word-break:break-word;font-size:var(--mrd-font-size-sm);line-height:1.6}`;
-
-const BUFFER = 10;
-/** Wacht deze tijd (ms) na het laatste scroll-event voordat pagina's worden
- *  aangevraagd. Pagina's die de gebruiker snel voorbij scrollt worden zo geskipt. */
-const REQUEST_DEBOUNCE_MS = 150;
-/** Breedte van de filterpopup in px — voor overflow-correctie. */
-const POPUP_WIDTH = 280;
-const TEXT_TYPES = new Set(['TEXT', 'TEXTBLOCK', 'EMAIL', 'HYPERLINK']);
-const NUMERIC_TYPES = new Set(['INTEGER', 'DECIMAL', 'PERCENTAGE', 'CURRENCY']);
-const DATE_TYPES = new Set(['DATE', 'DATETIME', 'TIME']);
-const NO_FILTER_TYPES = new Set(['FILE', 'IMAGE']);
-const MrdTable = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.mrdLoadPage = createEvent(this, "mrdLoadPage");
-        this.mrdRowClick = createEvent(this, "mrdRowClick");
-        this.mrdAction = createEvent(this, "mrdAction");
-        this.mrdFilter = createEvent(this, "mrdFilter");
-        this.mrdDownload = createEvent(this, "mrdDownload");
-        this.mrdSwitchView = createEvent(this, "mrdSwitchView");
-        this.mrdLoadAggregations = createEvent(this, "mrdLoadAggregations");
-        // ── Non-state internals ────────────────────────────────────────────────────
-        this.pendingPages = new Set();
-        this.debounceTimer = null;
-        this.outsideClickHandler = null;
-        this.viewSwitcherClickHandler = null;
-        this.keydownHandler = null;
-        // ── Props ──────────────────────────────────────────────────────────────────
-        this.columns = [];
-        /** Direct rows (non-paginated mode, used when totalElements === 0). */
-        this.rows = [];
-        this.locale = navigator.language;
-        /** Total number of records across all pages. 0 = non-paginated mode. */
-        this.totalElements = 0;
-        /** Records per page (must match the API page size). */
-        this.pageSize = 20;
-        /** Row height in px — used for spacer and scroll-position maths. */
-        this.rowHeight = 36;
-        /** Height of the scroll container in px. */
-        this.tableHeight = 500;
-        /** Initial sort applied on load, e.g. "timestamp,desc" or "name".
-         *  Parsed by init() into sortField + sortDir. */
-        this.defaultSort = '';
-        /** Toolbar action buttons rendered above the table. */
-        this.actions = [];
-        /** Display label of the current view — shown in the toolbar center as a view picker trigger. */
-        this.viewLabel = '';
-        /** Alternative views available for this table; renders a dropdown when non-empty. */
-        this.alternativeViews = [];
-        // ── Internal state ─────────────────────────────────────────────────────────
-        this.loadedPages = new Map();
-        this.requestedPages = new Set();
-        this.renderStart = 0;
-        this.renderEnd = 0;
-        this.colWidths = [];
-        this.sortField = '';
-        this.sortDir = 'asc';
-        /** Whether the filter UI is visible on column headers. */
-        this.filterMode = false;
-        /** Active filters keyed by field name. */
-        this.activeFilters = new Map();
-        /** Field name of the currently open filter popup (null = closed). */
-        this.openFilterCol = null;
-        /** Filter state being edited in the open popup. */
-        this.pendingFilter = null;
-        /** Viewport-relative position for the filter popup. */
-        this.popupPos = { top: 0, left: 0 };
-        /** Current scroll offset of the scroll container — drives pagination footer. */
-        this.scrollTop = 0;
-        /** Full text shown in the TEXTBLOCK expand modal (null = closed). */
-        this.textblockModal = null;
-        /** Aggregation totals received from the host via setAggregations(). Null = not yet loaded. */
-        this.aggregations = null;
-        /** Whether the view switcher dropdown is open. */
-        this.viewSwitcherOpen = false;
-        this.handleScroll = (e) => {
-            const scroller = e.currentTarget;
-            const scrollTop = scroller.scrollTop;
-            const total = this.totalElements;
-            const visStart = Math.floor(scrollTop / this.rowHeight);
-            const visEnd = Math.min(visStart + this.visibleCount(), total - 1);
-            this.scrollTop = scrollTop;
-            this.renderStart = Math.max(0, visStart - BUFFER);
-            this.renderEnd = Math.min(total - 1, visEnd + BUFFER);
-            this.requestPagesForWindow(this.renderStart, this.renderEnd);
-        };
-    }
-    // ── Prop watchers ─────────────────────────────────────────────────────────
-    /** Clamp renderEnd when totalElements shrinks (e.g. after a filter is applied). */
-    totalElementsChanged(newVal) {
-        this.renderEnd = Math.min(this.renderEnd, Math.max(0, newVal - 1));
-    }
-    // ── Public API ─────────────────────────────────────────────────────────────
-    /**
-     * Initialise (or reset) the virtual scroll.
-     * Call after setting all props and registering the mrdLoadPage listener,
-     * but before calling setPage(0, rows).
-     */
-    async init() {
-        var _a;
-        if (this.debounceTimer !== null) {
-            clearTimeout(this.debounceTimer);
-            this.debounceTimer = null;
-        }
-        this.pendingPages.clear();
-        this.loadedPages = new Map();
-        this.requestedPages = new Set();
-        this.colWidths = [];
-        if (this.defaultSort) {
-            const parts = this.defaultSort.split(',');
-            this.sortField = parts[0].trim();
-            this.sortDir = ((_a = parts[1]) === null || _a === void 0 ? void 0 : _a.trim()) === 'desc' ? 'desc' : 'asc';
-        }
-        else {
-            this.sortField = '';
-            this.sortDir = 'asc';
-        }
-        this.scrollTop = 0;
-        this.renderStart = 0;
-        // No BUFFER on init — only request what fits the visible area (page 0).
-        // BUFFER is applied during scroll to pre-fetch the next page proactively.
-        this.renderEnd = Math.max(0, Math.min(this.visibleCount() - 1, this.totalElements - 1));
-        const scroller = this.el.querySelector('.mrd-table__scroll');
-        if (scroller)
-            scroller.scrollTop = 0;
-        this.aggregations = null;
-        this.emitLoadAggregations();
-    }
-    /**
-     * Inject the rows for a given page (0-based).
-     * Creates a new Map reference so Stencil detects the state change.
-     *
-     * When the page contains fewer rows than pageSize it is the last page.
-     * renderEnd is clamped immediately so no loading-placeholder rows appear
-     * beyond the actual data — without requiring the host to update totalElements.
-     */
-    async setPage(pageNumber, rows) {
-        if (rows.length < this.pageSize) {
-            // lastRowIdx is -1 when the page is empty; clamp renderEnd to -1 so the
-            // render loop does not execute and no shimmer rows appear.
-            const lastRowIdx = pageNumber * this.pageSize + rows.length - 1;
-            this.renderEnd = Math.min(this.renderEnd, lastRowIdx);
-        }
-        const next = new Map(this.loadedPages);
-        next.set(pageNumber, rows);
-        this.loadedPages = next;
-    }
-    /** Inject aggregation totals returned by the /aggregations endpoint. */
-    async setAggregations(data) {
-        this.aggregations = data;
-    }
-    // ── Lifecycle ──────────────────────────────────────────────────────────────
-    disconnectedCallback() {
-        if (this.outsideClickHandler) {
-            document.removeEventListener('click', this.outsideClickHandler);
-            this.outsideClickHandler = null;
-        }
-        if (this.viewSwitcherClickHandler) {
-            document.removeEventListener('click', this.viewSwitcherClickHandler);
-            this.viewSwitcherClickHandler = null;
-        }
-        if (this.keydownHandler) {
-            document.removeEventListener('keydown', this.keydownHandler);
-            this.keydownHandler = null;
-        }
-    }
-    componentDidRender() {
-        if (this.colWidths.length === 0 && this.loadedPages.size > 0 && this.totalElements > 0) {
-            const ths = this.el.querySelectorAll('.mrd-table__header');
-            if (ths.length > 0) {
-                this.colWidths = Array.from(ths).map(th => th.offsetWidth);
-            }
-        }
-    }
-    // ── Paging / scroll helpers ────────────────────────────────────────────────
-    visibleCount() {
-        return Math.ceil(this.tableHeight / this.rowHeight);
-    }
-    sortParam() {
-        if (!this.sortField)
-            return '';
-        return this.sortDir === 'desc' ? `${this.sortField},desc` : this.sortField;
-    }
-    colName(col) {
-        var _a, _b, _c, _d;
-        return (_d = (_b = (_a = col.field) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : (_c = col.relation) === null || _c === void 0 ? void 0 : _c.name) !== null && _d !== void 0 ? _d : '';
-    }
-    colDataType(col) {
-        var _a, _b;
-        if (col.type === 'RELATION')
-            return 'RELATION';
-        return (_b = (_a = col.field) === null || _a === void 0 ? void 0 : _a.dataType) !== null && _b !== void 0 ? _b : 'TEXT';
-    }
-    // ── Aggregation helpers ────────────────────────────────────────────────────
-    buildAggregationParams() {
-        var _a;
-        const groups = { sum: [], avg: [], count: [] };
-        for (const col of this.columns) {
-            if (col.type !== 'FIELD' || !((_a = col.field) === null || _a === void 0 ? void 0 : _a.aggregate))
-                continue;
-            const fn = col.field.aggregate.toLowerCase();
-            if (fn in groups)
-                groups[fn].push(col.field.name);
-        }
-        const params = {};
-        if (groups.sum.length)
-            params.sum = groups.sum;
-        if (groups.avg.length)
-            params.avg = groups.avg;
-        if (groups.count.length)
-            params.count = groups.count;
-        return Object.keys(params).length > 0 ? params : null;
-    }
-    emitLoadAggregations() {
-        const params = this.buildAggregationParams();
-        if (params)
-            this.mrdLoadAggregations.emit(params);
-    }
-    renderAggregationValue(col) {
-        var _a, _b;
-        if (col.type !== 'FIELD' || !((_a = col.field) === null || _a === void 0 ? void 0 : _a.aggregate) || !this.aggregations)
-            return '';
-        const fn = col.field.aggregate.toLowerCase();
-        const val = (_b = this.aggregations[fn]) === null || _b === void 0 ? void 0 : _b[col.field.name];
-        if (val == null)
-            return '';
-        const dt = col.field.dataType;
-        if (dt === 'INTEGER')
-            return formatNumber(val, this.locale, { maximumFractionDigits: 0 });
-        if (dt === 'PERCENTAGE')
-            return formatPercentage(val, this.locale);
-        if (dt === 'CURRENCY' && col.field.currencyCode)
-            return formatCurrency(val, col.field.currencyCode, this.locale);
-        return formatNumber(val, this.locale);
-    }
-    // ── Reset pagination ───────────────────────────────────────────────────────
-    /** Reset pagination state and scroll to top (used after sort or filter change). */
-    resetPages() {
-        if (this.debounceTimer !== null) {
-            clearTimeout(this.debounceTimer);
-            this.debounceTimer = null;
-        }
-        this.pendingPages.clear();
-        this.loadedPages = new Map();
-        this.requestedPages = new Set();
-        this.colWidths = [];
-        this.scrollTop = 0;
-        this.renderStart = 0;
-        // No BUFFER here — totalElements may be stale after a filter change.
-        // Only request what is visible; BUFFER kicks in during scroll as usual.
-        this.renderEnd = Math.max(0, Math.min(this.visibleCount() - 1, this.totalElements - 1));
-        const scroller = this.el.querySelector('.mrd-table__scroll');
-        if (scroller)
-            scroller.scrollTop = 0;
-    }
-    handleSortClick(col) {
-        const name = this.colName(col);
-        if (this.sortField === name) {
-            this.sortDir = this.sortDir === 'asc' ? 'desc' : 'asc';
-        }
-        else {
-            this.sortField = name;
-            this.sortDir = 'asc';
-        }
-        this.resetPages();
-        this.emitPagesForWindow(this.renderStart, this.renderEnd);
-    }
-    applySort(col, dir) {
-        this.sortField = this.colName(col);
-        this.sortDir = dir;
-        this.resetPages();
-        this.emitPagesForWindow(this.renderStart, this.renderEnd);
-    }
-    emitPagesForWindow(start, end) {
-        const firstPage = Math.floor(start / this.pageSize);
-        const lastPage = Math.floor(end / this.pageSize);
-        const next = new Set(this.requestedPages);
-        let changed = false;
-        for (let p = firstPage; p <= lastPage; p++) {
-            if (!this.loadedPages.has(p) && !next.has(p)) {
-                next.add(p);
-                this.mrdLoadPage.emit({ page: p, sort: this.sortParam() });
-                changed = true;
-            }
-        }
-        if (changed)
-            this.requestedPages = next;
-    }
-    getRow(i) {
-        var _a;
-        const page = this.loadedPages.get(Math.floor(i / this.pageSize));
-        return (_a = page === null || page === void 0 ? void 0 : page[i % this.pageSize]) !== null && _a !== void 0 ? _a : null;
-    }
-    requestPagesForWindow(start, end) {
-        const firstPage = Math.floor(start / this.pageSize);
-        const lastPage = Math.floor(end / this.pageSize);
-        let anyNew = false;
-        for (let p = firstPage; p <= lastPage; p++) {
-            if (!this.loadedPages.has(p) && !this.requestedPages.has(p) && !this.pendingPages.has(p)) {
-                this.pendingPages.add(p);
-                anyNew = true;
-            }
-        }
-        if (!anyNew)
-            return;
-        if (this.debounceTimer !== null)
-            clearTimeout(this.debounceTimer);
-        this.debounceTimer = setTimeout(() => this.flushPendingPages(), REQUEST_DEBOUNCE_MS);
-    }
-    flushPendingPages() {
-        this.debounceTimer = null;
-        if (this.pendingPages.size === 0)
-            return;
-        const next = new Set(this.requestedPages);
-        let changed = false;
-        for (const page of this.pendingPages) {
-            if (this.loadedPages.has(page) || next.has(page))
-                continue;
-            const pageStart = page * this.pageSize;
-            const pageEnd = pageStart + this.pageSize - 1;
-            if (pageEnd < this.renderStart || pageStart > this.renderEnd)
-                continue;
-            next.add(page);
-            this.mrdLoadPage.emit({ page, sort: this.sortParam() });
-            changed = true;
-        }
-        this.pendingPages.clear();
-        if (changed)
-            this.requestedPages = next;
-    }
-    // ── Filter helpers ─────────────────────────────────────────────────────────
-    handleFilterToggle() {
-        this.filterMode = !this.filterMode;
-        if (!this.filterMode)
-            this.closeFilterPopup();
-    }
-    handleFilterOpen(col, e) {
-        e.stopPropagation();
-        const btn = e.currentTarget;
-        const rect = btn.getBoundingClientRect();
-        let left = rect.left;
-        if (left + POPUP_WIDTH > window.innerWidth - 8)
-            left = rect.right - POPUP_WIDTH;
-        this.popupPos = { top: rect.bottom + 4, left: Math.max(8, left) };
-        const name = this.colName(col);
-        const dataType = this.colDataType(col);
-        const existing = this.activeFilters.get(name);
-        // Set the default operator explicitly so it is present in the ColumnFilter
-        // even when the user never touches the operator dropdown.
-        const defaultOperator = (TEXT_TYPES.has(dataType) || dataType === 'RELATION')
-            ? 'startsWith'
-            : undefined;
-        // For DATETIME, stored values are UTC ISO strings; convert back to local
-        // "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 && existing.operator !== 'isEmpty' && existing.operator !== 'isNotEmpty') {
-            const display = Object.assign({}, existing);
-            if (typeof display.from === 'string' && display.from)
-                display.from = this.utcISOToLocalDate(display.from);
-            if (typeof display.to === 'string' && display.to)
-                display.to = this.utcISOToLocalDateExclusiveEnd(display.to);
-            if (display.from && display.to && display.from === display.to) {
-                this.pendingFilter = Object.assign(Object.assign({}, display), { value: display.from, from: undefined, to: undefined });
-            }
-            else {
-                this.pendingFilter = display;
-            }
-        }
-        else {
-            this.pendingFilter = existing ? Object.assign({}, existing) : { field: name, dataType, operator: defaultOperator };
-        }
-        this.openFilterCol = name;
-        // Close on outside click — re-register to replace any stale handler
-        if (this.outsideClickHandler)
-            document.removeEventListener('click', this.outsideClickHandler);
-        this.outsideClickHandler = (ev) => {
-            const popup = this.el.querySelector('.mrd-table__filter-popup');
-            if (popup && !popup.contains(ev.target))
-                this.closeFilterPopup();
-        };
-        document.addEventListener('click', this.outsideClickHandler);
-    }
-    closeFilterPopup() {
-        this.openFilterCol = null;
-        this.pendingFilter = null;
-        if (this.outsideClickHandler) {
-            document.removeEventListener('click', this.outsideClickHandler);
-            this.outsideClickHandler = null;
-        }
-    }
-    openTextblockModal(text) {
-        this.textblockModal = text;
-        if (this.keydownHandler)
-            document.removeEventListener('keydown', this.keydownHandler);
-        this.keydownHandler = (ev) => {
-            if (ev.key === 'Escape')
-                this.closeTextblockModal();
-        };
-        document.addEventListener('keydown', this.keydownHandler);
-    }
-    closeTextblockModal() {
-        this.textblockModal = null;
-        if (this.keydownHandler) {
-            document.removeEventListener('keydown', this.keydownHandler);
-            this.keydownHandler = null;
-        }
-    }
-    setPending(key, val) {
-        this.pendingFilter = Object.assign(Object.assign({}, this.pendingFilter), { [key]: val });
-    }
-    togglePendingValue(key, checked) {
-        var _a, _b;
-        const current = (_b = (_a = this.pendingFilter) === null || _a === void 0 ? void 0 : _a.values) !== null && _b !== void 0 ? _b : [];
-        this.pendingFilter = Object.assign(Object.assign({}, this.pendingFilter), { values: checked ? [...current, key] : current.filter(k => k !== key) });
-    }
-    filterHasValue(f) {
-        if (f.operator === 'isEmpty' || f.operator === 'isNotEmpty')
-            return true;
-        if (f.values !== undefined && f.values.length > 0)
-            return true;
-        if (f.value != null && f.value !== '')
-            return true;
-        if (typeof f.value === 'boolean')
-            return true;
-        if (f.from != null && f.from !== '')
-            return true;
-        if (f.to != null && f.to !== '')
-            return true;
-        return false;
-    }
-    // Convert a local "YYYY-MM-DD" date string to the UTC ISO string at the
-    // start of that local day (midnight). new Date(y, m, d) uses local time.
-    dateLocalToUTCStart(dateStr) {
-        if (!dateStr)
-            return dateStr;
-        const [year, month, day] = dateStr.split('-').map(Number);
-        return new Date(year, month - 1, day).toISOString().replace(/\.\d{3}Z$/, 'Z');
-    }
-    // Start of the day AFTER the given local date (exclusive range end).
-    dateLocalToUTCEndExclusive(dateStr) {
-        if (!dateStr)
-            return dateStr;
-        const [year, month, day] = dateStr.split('-').map(Number);
-        return new Date(year, month - 1, day + 1).toISOString().replace(/\.\d{3}Z$/, 'Z');
-    }
-    // Convert a stored UTC ISO string back to the local "YYYY-MM-DD" date.
-    utcISOToLocalDate(utcStr) {
-        if (!utcStr)
-            return utcStr;
-        const d = new Date(utcStr);
-        if (isNaN(d.getTime()))
-            return utcStr;
-        return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
-    }
-    // The stored "to" value is the exclusive end (midnight of the next day).
-    // Subtract one day to recover the local date the user entered.
-    utcISOToLocalDateExclusiveEnd(utcStr) {
-        if (!utcStr)
-            return utcStr;
-        const d = new Date(utcStr);
-        if (isNaN(d.getTime()))
-            return utcStr;
-        d.setDate(d.getDate() - 1);
-        return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
-    }
-    applyFilter() {
-        const f = this.pendingFilter;
-        if (!(f === null || f === void 0 ? void 0 : f.field)) {
-            this.closeFilterPopup();
-            return;
-        }
-        // For DATETIME fields the user enters local dates; convert to UTC ISO strings.
-        // 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' && 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);
-                normalized.value = undefined;
-            }
-            else {
-                if (typeof normalized.from === 'string' && normalized.from)
-                    normalized.from = this.dateLocalToUTCStart(normalized.from);
-                if (typeof normalized.to === 'string' && normalized.to)
-                    normalized.to = this.dateLocalToUTCEndExclusive(normalized.to);
-            }
-        }
-        const next = new Map(this.activeFilters);
-        if (this.filterHasValue(normalized)) {
-            next.set(normalized.field, normalized);
-        }
-        else {
-            next.delete(normalized.field);
-        }
-        this.activeFilters = next;
-        this.closeFilterPopup();
-        this.mrdFilter.emit({ filters: Array.from(this.activeFilters.values()) });
-        this.aggregations = null;
-        this.emitLoadAggregations();
-        if (this.totalElements > 0) {
-            this.resetPages();
-            this.emitPagesForWindow(this.renderStart, this.renderEnd);
-        }
-    }
-    clearFilter() {
-        const name = this.openFilterCol;
-        const next = new Map(this.activeFilters);
-        if (name)
-            next.delete(name);
-        this.activeFilters = next;
-        this.closeFilterPopup();
-        this.mrdFilter.emit({ filters: Array.from(this.activeFilters.values()) });
-        this.aggregations = null;
-        this.emitLoadAggregations();
-        if (this.totalElements > 0) {
-            this.resetPages();
-            this.emitPagesForWindow(this.renderStart, this.renderEnd);
-        }
-    }
-    clearAllFilters() {
-        this.activeFilters = new Map();
-        this.mrdFilter.emit({ filters: [] });
-        this.aggregations = null;
-        this.emitLoadAggregations();
-        if (this.totalElements > 0) {
-            this.resetPages();
-            this.emitPagesForWindow(this.renderStart, this.renderEnd);
-        }
-    }
-    // ── View switcher ──────────────────────────────────────────────────────────
-    openViewSwitcher() {
-        this.viewSwitcherOpen = true;
-        if (this.viewSwitcherClickHandler)
-            document.removeEventListener('click', this.viewSwitcherClickHandler);
-        this.viewSwitcherClickHandler = (ev) => {
-            const wrapper = this.el.querySelector('.mrd-table__view-switcher');
-            if (wrapper && !wrapper.contains(ev.target))
-                this.closeViewSwitcher();
-        };
-        document.addEventListener('click', this.viewSwitcherClickHandler);
-    }
-    closeViewSwitcher() {
-        this.viewSwitcherOpen = false;
-        if (this.viewSwitcherClickHandler) {
-            document.removeEventListener('click', this.viewSwitcherClickHandler);
-            this.viewSwitcherClickHandler = null;
-        }
-    }
-    handleViewSwitch(view) {
-        this.closeViewSwitcher();
-        this.mrdSwitchView.emit({ name: view.name, class: view.class });
-    }
-    renderViewSwitcher() {
-        return (h("div", { class: "mrd-table__view-switcher" }, h("button", { class: `mrd-table__view-switcher-btn${this.viewSwitcherOpen ? ' mrd-table__view-switcher-btn--open' : ''}`, "aria-label": this.viewLabel, onClick: (e) => {
-                e.stopPropagation();
-                this.viewSwitcherOpen ? this.closeViewSwitcher() : this.openViewSwitcher();
-            } }, h("svg", { class: "mrd-table__view-switcher-chevron", viewBox: "0 0 24 24", "aria-hidden": "true" }, h("path", { fill: "currentColor", d: "M7 10l5 5 5-5z" }))), this.viewSwitcherOpen && (h("div", { class: "mrd-table__view-switcher-dropdown", onClick: (e) => e.stopPropagation() }, this.alternativeViews.map(view => {
-            var _a;
-            return (h("button", { class: "mrd-table__view-switcher-item", onClick: () => this.handleViewSwitch(view) }, (_a = view.label) !== null && _a !== void 0 ? _a : view.name));
-        })))));
-    }
-    // ── Render: toolbar ────────────────────────────────────────────────────────
-    renderToolbar() {
-        var _a, _b;
-        const filterCount = this.activeFilters.size;
-        const hasActions = ((_a = this.actions) === null || _a === void 0 ? void 0 : _a.length) > 0;
-        const hasViewSwitcher = !!this.viewLabel && ((_b = this.alternativeViews) === null || _b === void 0 ? void 0 : _b.length) > 0;
-        return (h("div", { class: "mrd-table__toolbar" }, h("div", { class: "mrd-table__toolbar-left" }, h("button", { class: `mrd-table__action mrd-table__action--secondary mrd-table__filter-toggle${this.filterMode ? ' mrd-table__filter-toggle--active' : ''}`, onClick: () => this.handleFilterToggle() }, h("svg", { class: "mrd-table__action-icon", viewBox: "0 0 24 24", "aria-hidden": "true" }, h("path", { fill: "currentColor", d: "M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z" })), filterCount > 0 && h("span", { class: "mrd-table__filter-badge" }, filterCount), h("span", { class: "mrd-table__action-tooltip" }, this.filterMode ? t('table_filter_hide', this.locale) : t('table_filter', this.locale), filterCount > 0 ? ` (${filterCount} ${t('table_filter_active', this.locale)})` : '')), filterCount > 0 && (h("button", { class: "mrd-table__action mrd-table__action--secondary", onClick: () => this.clearAllFilters() }, h("svg", { class: "mrd-table__action-icon", viewBox: "0 0 24 24", "aria-hidden": "true" }, h("path", { fill: "currentColor", d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" })), h("span", { class: "mrd-table__action-tooltip" }, t('table_filter_clear_all', this.locale))))), hasViewSwitcher && (h("div", { class: "mrd-table__toolbar-center" }, h("span", { class: "mrd-table__view-title" }, this.viewLabel), this.renderViewSwitcher())), hasActions && (h("div", { class: "mrd-table__toolbar-right" }, this.actions.map(a => {
-            var _a;
-            return (h("button", { class: `mrd-table__action mrd-table__action--${(_a = a.variant) !== null && _a !== void 0 ? _a : 'secondary'}`, disabled: a.disabled, onClick: () => this.mrdAction.emit({ action: a.action }) }, a.icon
-                ? h("svg", { class: "mrd-table__action-icon", "aria-hidden": "true" }, h("use", { href: a.icon }))
-                : a.label, h("span", { class: "mrd-table__action-tooltip" }, a.label)));
-        })))));
-    }
-    // ── Render: filter popup ───────────────────────────────────────────────────
-    renderFilterEditor(col) {
-        var _a, _b, _c, _d, _e, _f, _g, _h;
-        const pf = (_a = this.pendingFilter) !== null && _a !== void 0 ? _a : {};
-        const dataType = this.colDataType(col);
-        if (NO_FILTER_TYPES.has(dataType)) {
-            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: !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 : [];
-            const selected = (_d = pf.values) !== null && _d !== void 0 ? _d : [];
-            return (h("div", { class: "mrd-table__filter-list" }, h("div", { class: "mrd-table__filter-list-controls" }, h("button", { class: "mrd-table__filter-list-btn", onClick: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { values: items.map(i => i.key) }); } }, t('filter_select_all', this.locale)), h("button", { class: "mrd-table__filter-list-btn", onClick: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { values: [] }); } }, t('filter_select_none', this.locale))), items.map(item => (h("label", { class: "mrd-table__filter-checkbox-label" }, h("input", { type: "checkbox", checked: selected.includes(item.key), onChange: (e) => this.togglePendingValue(item.key, e.target.checked) }), item.label)))));
-        }
-        if (TEXT_TYPES.has(dataType) || dataType === 'RELATION') {
-            const op = (_e = pf.operator) !== null && _e !== void 0 ? _e : 'startsWith';
-            const noInput = op === 'isEmpty' || op === 'isNotEmpty';
-            return (h("div", { class: "mrd-table__filter-editor" }, h("select", { class: "mrd-table__filter-select", onChange: (e) => this.setPending('operator', e.target.value) }, [
-                { val: 'startsWith', labelKey: 'filter_starts_with' },
-                { val: 'equals', labelKey: 'filter_equals' },
-                { val: 'isEmpty', labelKey: 'filter_is_empty' },
-                { val: 'isNotEmpty', labelKey: 'filter_is_not_empty' },
-            ].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 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 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 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;
-    }
-    renderFilterPopup() {
-        var _a, _b, _c, _d;
-        if (!this.openFilterCol || !this.pendingFilter)
-            return null;
-        const col = this.columns.find(c => this.colName(c) === this.openFilterCol);
-        if (!col)
-            return null;
-        const label = (_d = (_b = (_a = col.field) === null || _a === void 0 ? void 0 : _a.label) !== null && _b !== void 0 ? _b : (_c = col.relation) === null || _c === void 0 ? void 0 : _c.label) !== null && _d !== void 0 ? _d : this.openFilterCol;
-        const sortActive = this.sortField === this.openFilterCol;
-        return (h("div", { class: "mrd-table__filter-popup", style: { top: `${this.popupPos.top}px`, left: `${this.popupPos.left}px` }, onClick: (e) => e.stopPropagation() }, h("div", { class: "mrd-table__filter-popup-header" }, h("span", { class: "mrd-table__filter-popup-title" }, label), h("button", { class: "mrd-table__filter-close", onClick: () => this.closeFilterPopup() }, "\u2715")), h("div", { class: "mrd-table__filter-section" }, h("div", { class: "mrd-table__filter-section-label" }, t('filter_sorting', this.locale)), h("div", { class: "mrd-table__filter-sort-buttons" }, h("button", { class: `mrd-table__filter-sort-btn${sortActive && this.sortDir === 'asc' ? ' mrd-table__filter-sort-btn--active' : ''}`, onClick: () => this.applySort(col, 'asc') }, "\u25B2 ", t('filter_ascending', this.locale)), h("button", { class: `mrd-table__filter-sort-btn${sortActive && this.sortDir === 'desc' ? ' mrd-table__filter-sort-btn--active' : ''}`, onClick: () => this.applySort(col, 'desc') }, "\u25BC ", t('filter_descending', this.locale)))), h("div", { class: "mrd-table__filter-divider" }), h("div", { class: "mrd-table__filter-section" }, h("div", { class: "mrd-table__filter-section-label" }, t('filter_section', this.locale)), this.renderFilterEditor(col)), h("div", { class: "mrd-table__filter-popup-footer" }, h("button", { class: "mrd-table__filter-btn mrd-table__filter-btn--clear", onClick: () => this.clearFilter() }, t('filter_clear', this.locale)), h("button", { class: "mrd-table__filter-btn mrd-table__filter-btn--apply", onClick: () => this.applyFilter() }, t('filter_apply', this.locale)))));
-    }
-    // ── Render: footer ────────────────────────────────────────────────────────
-    renderFooter(rowCount, effectiveTotal) {
-        const total = this.totalElements;
-        // Non-paginated mode: show plain row count
-        if (total === 0) {
-            const count = rowCount !== null && rowCount !== void 0 ? rowCount : 0;
-            if (count === 0)
-                return null;
-            return (h("div", { class: "mrd-table__footer" }, count, " ", t('table_of', this.locale), " ", count));
-        }
-        // Paginated mode: only show once page 0 has loaded (avoids stale total during filter reset)
-        if (!this.loadedPages.has(0))
-            return null;
-        // Use effectiveTotal (derived from actual page lengths) so the counter
-        // is correct even when the host has not yet updated totalElements.
-        const displayTotal = effectiveTotal !== null && effectiveTotal !== void 0 ? effectiveTotal : total;
-        // Compute from/to independently so partial rows at top/bottom are included.
-        const from = Math.min(Math.floor(this.scrollTop / this.rowHeight) + 1, displayTotal);
-        const to = Math.min(Math.ceil((this.scrollTop + this.tableHeight) / this.rowHeight), displayTotal);
-        return (h("div", { class: "mrd-table__footer" }, from, "\u2013", to, " ", t('table_of', this.locale), " ", displayTotal));
-    }
-    // ── Render: cell ──────────────────────────────────────────────────────────
-    renderCell(col, row) {
-        var _a, _b, _c, _d;
-        const numericTypes = new Set(['INTEGER', 'DECIMAL', 'PERCENTAGE', 'CURRENCY']);
-        const dataType = (_b = (_a = col.field) === null || _a === void 0 ? void 0 : _a.dataType) !== null && _b !== void 0 ? _b : '';
-        const isNumeric = col.type === 'FIELD' && numericTypes.has(dataType);
-        const isFile = col.type === 'FIELD' && (dataType === 'FILE' || dataType === 'IMAGE');
-        if (isFile) {
-            const name = (_d = (_c = col.field) === null || _c === void 0 ? void 0 : _c.name) !== null && _d !== void 0 ? _d : '';
-            const fileVal = row === null || row === void 0 ? void 0 : row[name];
-            const href = fileVal === null || fileVal === void 0 ? void 0 : fileVal.href;
-            const fileName = fileVal === null || fileVal === void 0 ? void 0 : fileVal.fileName;
-            return (h("td", { class: "mrd-table__cell" }, href && fileName ? (h("button", { class: "mrd-table__file-btn", title: fileName, onClick: (e) => {
-                    e.stopPropagation();
-                    this.mrdDownload.emit({ href, fileName });
-                } }, h("svg", { class: "mrd-table__file-icon", viewBox: "0 0 24 24", "aria-hidden": "true" }, h("path", { fill: "currentColor", d: "M14 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V8l-6-6zm-1 7V3.5L18.5 9H13zm-3 8l-3-3 1.41-1.41L10 14.17l4.59-4.58L16 11l-6 6z" })), t('download', this.locale))) : ''));
-        }
-        const TEXTBLOCK_MAX = 200;
-        if (dataType === 'TEXTBLOCK') {
-            const full = CellRenderer.render(col, row, this.locale);
-            if (full.length <= TEXTBLOCK_MAX) {
-                return h("td", { class: "mrd-table__cell" }, full);
-            }
-            const preview = full.slice(0, TEXTBLOCK_MAX) + '…';
-            return (h("td", { class: "mrd-table__cell" }, preview, h("button", { class: "mrd-table__textblock-btn", onClick: (e) => { e.stopPropagation(); this.openTextblockModal(full); }, "aria-label": t('textblock_show_more', this.locale) }, "\u22EF")));
-        }
-        const value = CellRenderer.render(col, row, this.locale);
-        return (h("td", { class: `mrd-table__cell${isNumeric ? ' mrd-table__cell--numeric' : ''}` }, value));
-    }
-    // ── Render: totals row ────────────────────────────────────────────────────
-    renderTotalsRow() {
-        if (!this.aggregations)
-            return null;
-        if (!this.columns.some(c => { var _a; return c.type === 'FIELD' && ((_a = c.field) === null || _a === void 0 ? void 0 : _a.aggregate); }))
-            return null;
-        return (h("tfoot", null, h("tr", { class: "mrd-table__totals-row" }, this.columns.map(col => {
-            var _a, _b;
-            const val = this.renderAggregationValue(col);
-            const isNumeric = col.type === 'FIELD' && NUMERIC_TYPES.has((_b = (_a = col.field) === null || _a === void 0 ? void 0 : _a.dataType) !== null && _b !== void 0 ? _b : '');
-            return (h("td", { class: `mrd-table__totals-cell${isNumeric ? ' mrd-table__totals-cell--numeric' : ''}` }, val));
-        }))));
-    }
-    // ── Render ─────────────────────────────────────────────────────────────────
-    render() {
-        var _a, _b, _c;
-        if (!((_a = this.columns) === null || _a === void 0 ? void 0 : _a.length))
-            return null;
-        // ── Non-paginated mode ──────────────────────────────────────────────────
-        if (this.totalElements === 0) {
-            return (h(Host, null, this.renderToolbar(), h("div", { class: "mrd-table" }, h("table", { class: "mrd-table__table" }, h("thead", null, h("tr", null, this.columns.map(col => {
-                var _a, _b, _c, _d;
-                const name = this.colName(col);
-                const isFiltered = this.activeFilters.has(name);
-                const cls = [
-                    'mrd-table__header',
-                    isFiltered ? 'mrd-table__header--filtered' : '',
-                    this.filterMode ? 'mrd-table__header--sortable' : '',
-                ].filter(Boolean).join(' ');
-                return (h("th", { class: cls, onClick: this.filterMode ? (e) => this.handleFilterOpen(col, e) : undefined }, h("span", { class: "mrd-table__header-label" }, (_d = (_b = (_a = col.field) === null || _a === void 0 ? void 0 : _a.label) !== null && _b !== void 0 ? _b : (_c = col.relation) === null || _c === void 0 ? void 0 : _c.label) !== null && _d !== void 0 ? _d : ''), isFiltered && this.renderFilterIcon()));
-            }))), h("tbody", null, (_b = this.rows) === null || _b === void 0 ? void 0 : _b.map((row, i) => (h("tr", { class: "mrd-table__row mrd-table__row--clickable", style: { background: i % 2 === 0 ? '' : 'var(--mrd-color-neutral-100)' }, onClick: () => this.mrdRowClick.emit(row) }, this.columns.map(col => this.renderCell(col, row)))))), this.renderTotalsRow()), (!this.rows || this.rows.length === 0) && (h("p", { class: "mrd-table__empty" }, t('no_results', this.locale)))), this.renderFooter((_c = this.rows) === null || _c === void 0 ? void 0 : _c.length), this.renderFilterPopup(), this.renderTextblockModal()));
-        }
-        // ── Paginated / virtual-scroll mode ────────────────────────────────────
-        // Derive the authoritative row count from loaded pages:
-        // if any loaded page is shorter than pageSize it is the last page,
-        // so the true total cannot exceed (pageNum * pageSize + pageRows.length).
-        // This self-corrects without requiring the host to update totalElements.
-        let effectiveTotal = this.totalElements;
-        for (const [pageNum, pageRows] of this.loadedPages) {
-            if (pageRows.length < this.pageSize) {
-                effectiveTotal = Math.min(effectiveTotal, pageNum * this.pageSize + pageRows.length);
-            }
-        }
-        // Clamp renderEnd to what we actually know exists (-1 when empty)
-        const clampedEnd = Math.min(this.renderEnd, effectiveTotal - 1);
-        const colCount = this.columns.length;
-        const topSpacerHeight = this.renderStart * this.rowHeight;
-        const bottomSpacerHeight = Math.max(0, (effectiveTotal - 1 - clampedEnd) * this.rowHeight);
-        const tableStyle = this.colWidths.length > 0
-            ? { tableLayout: 'fixed' }
-            : undefined;
-        const renderedRows = [];
-        for (let i = this.renderStart; i <= clampedEnd; i++) {
-            const row = this.getRow(i);
-            if (row === null) {
-                renderedRows.push(h("tr", { class: "mrd-table__row mrd-table__row--loading" }, h("td", { class: "mrd-table__cell--placeholder", colSpan: colCount }, h("span", { class: "mrd-table__placeholder-bar" }))));
-            }
-            else {
-                renderedRows.push(h("tr", { class: "mrd-table__row mrd-table__row--clickable", style: { background: i % 2 === 0 ? '' : 'var(--mrd-color-neutral-100)' }, onClick: () => this.mrdRowClick.emit(row) }, this.columns.map(col => this.renderCell(col, row))));
-            }
-        }
-        return (h(Host, null, this.renderToolbar(), h("div", { class: "mrd-table__scroll", style: { height: `${this.tableHeight}px` }, onScroll: this.handleScroll }, h("table", { class: "mrd-table__table", style: tableStyle }, h("thead", null, h("tr", null, this.columns.map((col, idx) => {
-            var _a, _b, _c, _d;
-            const name = this.colName(col);
-            const isActive = this.sortField === name;
-            const isFiltered = this.activeFilters.has(name);
-            const cls = [
-                'mrd-table__header',
-                'mrd-table__header--sortable',
-                isActive ? `mrd-table__header--sorted-${this.sortDir}` : '',
-                isFiltered ? 'mrd-table__header--filtered' : '',
-            ].filter(Boolean).join(' ');
-            return (h("th", { class: cls, style: this.colWidths[idx] ? { width: `${this.colWidths[idx]}px` } : undefined, onClick: (e) => this.filterMode ? this.handleFilterOpen(col, e) : this.handleSortClick(col) }, h("span", { class: "mrd-table__header-label" }, (_d = (_b = (_a = col.field) === null || _a === void 0 ? void 0 : _a.label) !== null && _b !== void 0 ? _b : (_c = col.relation) === null || _c === void 0 ? void 0 : _c.label) !== null && _d !== void 0 ? _d : ''), isActive && (h("span", { class: "mrd-table__sort-icon", "aria-hidden": "true" }, this.sortDir === 'asc' ? '▲' : '▼')), !isActive && !this.filterMode && (h("span", { class: "mrd-table__sort-icon", "aria-hidden": "true" }, "\u21C5")), isFiltered && this.renderFilterIcon()));
-        }))), h("tbody", null, topSpacerHeight > 0 && (h("tr", { class: "mrd-table__spacer", style: { height: `${topSpacerHeight}px` } }, h("td", { colSpan: colCount }))), renderedRows, bottomSpacerHeight > 0 && (h("tr", { class: "mrd-table__spacer", style: { height: `${bottomSpacerHeight}px` } }, h("td", { colSpan: colCount })))), this.renderTotalsRow())), effectiveTotal === 0 && this.loadedPages.has(0) && (h("p", { class: "mrd-table__empty" }, t('no_results', this.locale))), effectiveTotal > 0 && this.renderFooter(undefined, effectiveTotal), this.renderFilterPopup(), this.renderTextblockModal()));
-    }
-    renderFilterIcon() {
-        return (h("span", { class: "mrd-table__filter-icon", "aria-hidden": "true" }, h("svg", { viewBox: "0 0 24 24", width: "14", height: "14", fill: "currentColor" }, h("path", { d: "M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z" }))));
-    }
-    renderTextblockModal() {
-        if (this.textblockModal === null)
-            return null;
-        return (h("div", { class: "mrd-table__modal-backdrop", onClick: () => this.closeTextblockModal(), role: "dialog", "aria-modal": "true" }, h("div", { class: "mrd-table__modal", onClick: (e) => e.stopPropagation() }, h("button", { class: "mrd-table__modal-close", onClick: () => this.closeTextblockModal(), "aria-label": t('close', this.locale) }, "\u2715"), h("p", { class: "mrd-table__modal-text" }, this.textblockModal))));
-    }
-    get el() { return getElement(this); }
-    static get watchers() { return {
-        "totalElements": [{
-                "totalElementsChanged": 0
-            }]
-    }; }
-};
-MrdTable.style = mrdTableScss();
-
-export { MrdTable as mrd_table };