@mmlogic/components 0.5.6 → 0.5.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{cell-renderer-Coy-aD3k.js → cell-renderer-pwUGEDql.js} +8 -24
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/mosterdcomponents.cjs.js +1 -1
- package/dist/cjs/mrd-boolean-field_25.cjs.entry.js +195 -52
- package/dist/cjs/mrd-merge-view.cjs.entry.js +1 -1
- package/dist/collection/components/table/mrd-table/mrd-table.css +52 -22
- package/dist/collection/components/table/mrd-table/mrd-table.js +180 -45
- package/dist/collection/components/table/mrd-table/table-parts.js +6 -3
- package/dist/collection/components/table/mrd-table/virtual-scroll.js +8 -3
- package/dist/collection/utils/i18n.js +8 -24
- package/dist/components/i18n.js +1 -1
- package/dist/components/mrd-table2.js +1 -1
- package/dist/esm/{cell-renderer-Dd_PKH0_.js → cell-renderer-B8rJpnq8.js} +8 -24
- package/dist/esm/loader.js +1 -1
- package/dist/esm/mosterdcomponents.js +1 -1
- package/dist/esm/mrd-boolean-field_25.entry.js +195 -52
- package/dist/esm/mrd-merge-view.entry.js +1 -1
- package/dist/mosterdcomponents/cell-renderer-B8u5BCK-.js.map +1 -0
- package/dist/mosterdcomponents/client-layout-Bc42CfJB.js.map +1 -0
- package/dist/mosterdcomponents/document-attachments-BufPmMRv.js.map +1 -0
- package/dist/mosterdcomponents/field-helpers-CUJsHr1V.js.map +1 -0
- package/dist/mosterdcomponents/file-upload-common-DdTDuxEU.js.map +1 -0
- package/dist/mosterdcomponents/format-gcecItcD.js.map +1 -0
- package/dist/mosterdcomponents/i18n-Ba7_jO9I.js.map +1 -0
- package/dist/mosterdcomponents/index-1ayBojyN.js.map +1 -0
- package/dist/mosterdcomponents/index-DhffneUF.js.map +1 -0
- package/dist/mosterdcomponents/index.esm.js.map +1 -0
- package/dist/mosterdcomponents/mosterdcomponents.esm.js +1 -1
- package/dist/mosterdcomponents/mosterdcomponents.esm.js.map +1 -0
- package/dist/mosterdcomponents/{p-53b00783.entry.js → p-6f6c8e53.entry.js} +2 -2
- package/dist/mosterdcomponents/{p-1fc897f4.entry.js → p-e540de6a.entry.js} +1 -1
- package/dist/mosterdcomponents/p-rTM1tU_M.js +1 -0
- package/dist/mosterdcomponents/purify.es-_duHfPgC.js.map +1 -0
- package/dist/mosterdcomponents/query-params-BZbQoeYF.js.map +1 -0
- package/dist/mosterdcomponents/quill-C9pgw_k-.js.map +1 -0
- package/dist/mosterdcomponents/validation-CjjTt66G.js.map +1 -0
- package/dist/types/components/table/mrd-table/mrd-table.d.ts +53 -5
- package/dist/types/components/table/mrd-table/table-parts.d.ts +0 -2
- package/dist/types/components/table/mrd-table/virtual-scroll.d.ts +6 -1
- package/package.json +1 -1
- package/dist/mosterdcomponents/p-CGm4ff1O.js +0 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var index = require('./index-DVbdkYO3.js');
|
|
4
|
-
var cellRenderer = require('./cell-renderer-
|
|
4
|
+
var cellRenderer = require('./cell-renderer-pwUGEDql.js');
|
|
5
5
|
var clientLayout = require('./client-layout-CqVuJumR.js');
|
|
6
6
|
|
|
7
7
|
const mrdBooleanFieldCss = () => `.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)}`;
|
|
@@ -6375,7 +6375,10 @@ const TableCell = ({ col, row, locale, onDownload, onOpenTextblock, onOpenJson }
|
|
|
6375
6375
|
return (index.h("td", { class: "mrd-table__cell" }, preview, index.h("button", { class: "mrd-table__textblock-btn", onClick: (e) => { e.stopPropagation(); onOpenTextblock(full); }, "aria-label": cellRenderer.t('textblock_show_more', locale) }, "\u22EF")));
|
|
6376
6376
|
}
|
|
6377
6377
|
const value = cellRenderer.CellRenderer.render(col, row, locale);
|
|
6378
|
-
return (
|
|
6378
|
+
return (
|
|
6379
|
+
// title: columns are locked to the width measured on page 0, so a longer value on a
|
|
6380
|
+
// later page is ellipsised rather than widening the column — the tooltip keeps it readable.
|
|
6381
|
+
index.h("td", { class: `mrd-table__cell${isNumeric ? ' mrd-table__cell--numeric' : ''}`, title: value || undefined }, value));
|
|
6379
6382
|
};
|
|
6380
6383
|
/** Formats the aggregation total for one column, '' when not applicable. */
|
|
6381
6384
|
function formatAggregationValue(col, aggregations, locale) {
|
|
@@ -6417,11 +6420,11 @@ const JsonModal = ({ html, locale, onClose }) => {
|
|
|
6417
6420
|
return null;
|
|
6418
6421
|
return (index.h("div", { class: "mrd-table__modal-backdrop", onClick: onClose, role: "dialog", "aria-modal": "true" }, index.h("div", { class: "mrd-table__modal", onClick: (e) => e.stopPropagation() }, index.h("button", { class: "mrd-table__modal-close", onClick: onClose, "aria-label": cellRenderer.t('close', locale) }, "\u2715"), index.h("pre", { class: "mrd-table__modal-json", innerHTML: html }))));
|
|
6419
6422
|
};
|
|
6420
|
-
const Toolbar = ({ locale,
|
|
6423
|
+
const Toolbar = ({ locale, filterCount, actions, views, activeViewIdx, viewPopoverOpen, createPickerOpen, createTypes, cb }) => {
|
|
6421
6424
|
var _a;
|
|
6422
6425
|
const hasActions = actions.length > 0;
|
|
6423
6426
|
const hasViewSwitcher = views.length > 1;
|
|
6424
|
-
return (index.h("div", { class: "mrd-table__toolbar" }, index.h("div", { class: "mrd-table__toolbar-left" },
|
|
6427
|
+
return (index.h("div", { class: "mrd-table__toolbar" }, index.h("div", { class: "mrd-table__toolbar-left" }, filterCount > 0 && (index.h("button", { class: "mrd-table__action mrd-table__action--secondary mrd-table__filter-clear", onClick: cb.onClearAllFilters }, index.h("svg", { class: "mrd-table__action-icon", viewBox: "0 0 24 24", "aria-hidden": "true" }, index.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" })), index.h("span", { class: "mrd-table__filter-clear-label" }, cellRenderer.t('table_filter_clear_all', locale), " (", filterCount, ")")))), hasViewSwitcher && (index.h("div", { class: "mrd-table__toolbar-center" }, index.h("div", { class: "mrd-table__view-switcher" }, index.h("button", { class: "mrd-table__view-arrow", "aria-label": "Previous view", onClick: () => cb.onViewSwitch((activeViewIdx - 1 + views.length) % views.length) }, "\u25C0"), index.h("div", { class: "mrd-table__view-title-wrap" }, index.h("button", { class: "mrd-table__view-title", onClick: (e) => cb.onToggleViewPopover(e) }, (_a = views[activeViewIdx]) === null || _a === void 0 ? void 0 : _a.label), viewPopoverOpen && (index.h("div", { class: "mrd-table__view-popover", onClick: (e) => e.stopPropagation() }, views.map((v, i) => (index.h("button", { key: String(i), class: `mrd-table__view-popover-item${i === activeViewIdx ? ' mrd-table__view-popover-item--active' : ''}`, onClick: () => {
|
|
6425
6428
|
if (i !== activeViewIdx)
|
|
6426
6429
|
cb.onViewSwitch(i);
|
|
6427
6430
|
cb.onCloseViewPopover();
|
|
@@ -6538,13 +6541,18 @@ const MAX_RETRY_ATTEMPTS = 3;
|
|
|
6538
6541
|
function visibleCount(tableHeight, rowHeight) {
|
|
6539
6542
|
return Math.ceil(tableHeight / rowHeight);
|
|
6540
6543
|
}
|
|
6541
|
-
/** Render window (with buffer) for the given scroll offset.
|
|
6544
|
+
/** Render window (with buffer) for the given scroll offset.
|
|
6545
|
+
* total <= 0 means "not known yet" (no totalElements prop, no aggregation total and no page
|
|
6546
|
+
* loaded — e.g. right after a filter reset), *not* "no rows". Clamping to total - 1 would
|
|
6547
|
+
* collapse the window to renderEnd = -1, so nothing renders and no page is ever requested;
|
|
6548
|
+
* the window is left unclamped instead and the render pass clamps it against
|
|
6549
|
+
* effectiveTotal once real data has landed. */
|
|
6542
6550
|
function computeWindow(scrollTop, rowHeight, tableHeight, total) {
|
|
6543
6551
|
const visStart = Math.floor(scrollTop / rowHeight);
|
|
6544
|
-
const
|
|
6552
|
+
const unclamped = visStart + visibleCount(tableHeight, rowHeight) + BUFFER;
|
|
6545
6553
|
return {
|
|
6546
6554
|
renderStart: Math.max(0, visStart - BUFFER),
|
|
6547
|
-
renderEnd: Math.min(total - 1,
|
|
6555
|
+
renderEnd: total > 0 ? Math.min(total - 1, unclamped) : unclamped,
|
|
6548
6556
|
};
|
|
6549
6557
|
}
|
|
6550
6558
|
/** First/last page (0-based) covering the given row window. */
|
|
@@ -6586,12 +6594,16 @@ function getStalePages(requestedAt, now, timeoutMs) {
|
|
|
6586
6594
|
return stale;
|
|
6587
6595
|
}
|
|
6588
6596
|
|
|
6589
|
-
const mrdTableCss = () => `.sc-mrd-table-h{display:block;width:100%}.mrd-table.sc-mrd-table{overflow-x:auto}.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__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--filtered.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__row--loading.sc-mrd-table{background:transparent}.mrd-table__row--failed.sc-mrd-table{background:transparent}.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__cell--placeholder.sc-mrd-table{padding:var(--mrd-space-2) var(--mrd-space-4);border-bottom:1px solid var(--mrd-border-color)}.mrd-table__cell--failed.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}.mrd-table__retry-button.sc-mrd-table{border:none;background:none;padding:0;color:var(--mrd-color-danger);font-size:inherit;cursor:pointer;text-decoration:underline}.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-switcher.sc-mrd-table{display:flex;align-items:center;gap:var(--mrd-space-1)}.mrd-table__view-arrow.sc-mrd-table{background:none;border:none;cursor:pointer;padding:0 var(--mrd-space-1);color:var(--mrd-color-neutral-500);font-size:var(--mrd-font-size-xs);line-height:1}.mrd-table__view-arrow.sc-mrd-table:hover{color:var(--mrd-color-neutral-800)}.mrd-table__view-title-wrap.sc-mrd-table{position:relative}.mrd-table__view-title.sc-mrd-table{font-size:var(--mrd-font-size-sm);font-weight:600;color:var(--mrd-color-neutral-800);font-family:var(--mrd-font-family);background:none;border:none;outline:none;cursor:pointer;padding:0 var(--mrd-space-1);max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mrd-table__view-title.sc-mrd-table:hover{color:var(--mrd-color-primary)}.mrd-table__view-popover.sc-mrd-table{position:absolute;top:calc(100% + var(--mrd-space-1));left:50%;transform:translateX(-50%);background:var(--mrd-color-white);border:1px solid var(--mrd-color-neutral-200);border-radius:var(--mrd-radius-md);box-shadow:var(--mrd-shadow-md);z-index:100;min-width:160px;padding:var(--mrd-space-1) 0}.mrd-table__view-popover-item.sc-mrd-table{display:block;width:100%;text-align:left;background:none;border:none;cursor:pointer;padding:var(--mrd-space-2) var(--mrd-space-3);font-size:var(--mrd-font-size-sm);font-family:var(--mrd-font-family);color:var(--mrd-color-neutral-700);white-space:nowrap}.mrd-table__view-popover-item.sc-mrd-table:hover{background:var(--mrd-color-neutral-50)}.mrd-table__view-popover-item--active.sc-mrd-table{font-weight:600;color:var(--mrd-color-primary)}.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:hover .mrd-table__action-tooltip.sc-mrd-table{display:block}.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__create-picker-wrap.sc-mrd-table{position:relative}.mrd-table__create-picker.sc-mrd-table{position:absolute;right:0;top:calc(100% + 4px);background:var(--mrd-color-white, #fff);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, 0.12));z-index:10;min-width:10rem;padding:var(--mrd-space-1) 0}.mrd-table__create-picker-item.sc-mrd-table{display:block;width:100%;text-align:left;padding:var(--mrd-space-2) var(--mrd-space-3);background:none;border:none;cursor:pointer;font-size:var(--mrd-font-size-sm);font-family:var(--mrd-font-family);color:var(--mrd-color-neutral-800)}.mrd-table__create-picker-item.sc-mrd-table:hover{background:var(--mrd-color-neutral-50);color:var(--mrd-color-neutral-900)}.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__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, 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, 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--stacked.sc-mrd-table{flex-direction:column;align-items:stretch;gap:var(--mrd-space-2)}.mrd-table__filter-range-sep.sc-mrd-table{color:var(--mrd-color-neutral-400);flex-shrink:0}.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}.mrd-table__json-preview.sc-mrd-table{font-family:var(--mrd-font-family-mono);font-size:var(--mrd-font-size-xs);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:inline-block;max-width:calc(100% - 1.5rem);vertical-align:middle}.mrd-table__modal-json.sc-mrd-table{margin:0;padding-right:var(--mrd-space-6);font-family:var(--mrd-font-family-mono);font-size:var(--mrd-font-size-xs);white-space:pre-wrap;word-break:break-word;line-height:1.6;background:none;border:none}@keyframes mrd-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}`;
|
|
6597
|
+
const mrdTableCss = () => `.sc-mrd-table-h{display:block;width:100%}.mrd-table.sc-mrd-table{overflow-x:auto}.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__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;overflow:hidden;text-overflow:ellipsis;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--filtered.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__col-resizer.sc-mrd-table{position:absolute;top:0;right:0;width:9px;height:100%;cursor:col-resize;touch-action:none;user-select:none}.mrd-table__col-resizer.sc-mrd-table::after{content:"";position:absolute;top:25%;right:4px;width:1px;height:50%;background:var(--mrd-border-color)}.mrd-table__col-resizer.sc-mrd-table:hover::after{width:2px;right:3px;background:var(--mrd-color-primary)}.mrd-table__col-resizer--active.sc-mrd-table::after{width:2px;right:3px;height:100%;top:0;background:var(--mrd-color-primary)}.mrd-table--resizing.sc-mrd-table{cursor:col-resize;user-select:none}.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__row--loading.sc-mrd-table{background:transparent}.mrd-table__row--failed.sc-mrd-table{background:transparent}.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;overflow:hidden;text-overflow:ellipsis}.mrd-table__cell--numeric.sc-mrd-table{text-align:right;font-variant-numeric:tabular-nums}.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__cell--failed.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}.mrd-table__retry-button.sc-mrd-table{border:none;background:none;padding:0;color:var(--mrd-color-danger);font-size:inherit;cursor:pointer;text-decoration:underline}.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-switcher.sc-mrd-table{display:flex;align-items:center;gap:var(--mrd-space-1)}.mrd-table__view-arrow.sc-mrd-table{background:none;border:none;cursor:pointer;padding:0 var(--mrd-space-1);color:var(--mrd-color-neutral-500);font-size:var(--mrd-font-size-xs);line-height:1}.mrd-table__view-arrow.sc-mrd-table:hover{color:var(--mrd-color-neutral-800)}.mrd-table__view-title-wrap.sc-mrd-table{position:relative}.mrd-table__view-title.sc-mrd-table{font-size:var(--mrd-font-size-sm);font-weight:600;color:var(--mrd-color-neutral-800);font-family:var(--mrd-font-family);background:none;border:none;outline:none;cursor:pointer;padding:0 var(--mrd-space-1);max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mrd-table__view-title.sc-mrd-table:hover{color:var(--mrd-color-primary)}.mrd-table__view-popover.sc-mrd-table{position:absolute;top:calc(100% + var(--mrd-space-1));left:50%;transform:translateX(-50%);background:var(--mrd-color-white);border:1px solid var(--mrd-color-neutral-200);border-radius:var(--mrd-radius-md);box-shadow:var(--mrd-shadow-md);z-index:100;min-width:160px;padding:var(--mrd-space-1) 0}.mrd-table__view-popover-item.sc-mrd-table{display:block;width:100%;text-align:left;background:none;border:none;cursor:pointer;padding:var(--mrd-space-2) var(--mrd-space-3);font-size:var(--mrd-font-size-sm);font-family:var(--mrd-font-family);color:var(--mrd-color-neutral-700);white-space:nowrap}.mrd-table__view-popover-item.sc-mrd-table:hover{background:var(--mrd-color-neutral-50)}.mrd-table__view-popover-item--active.sc-mrd-table{font-weight:600;color:var(--mrd-color-primary)}.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:hover .mrd-table__action-tooltip.sc-mrd-table{display:block}.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__create-picker-wrap.sc-mrd-table{position:relative}.mrd-table__create-picker.sc-mrd-table{position:absolute;right:0;top:calc(100% + 4px);background:var(--mrd-color-white, #fff);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, 0.12));z-index:10;min-width:10rem;padding:var(--mrd-space-1) 0}.mrd-table__create-picker-item.sc-mrd-table{display:block;width:100%;text-align:left;padding:var(--mrd-space-2) var(--mrd-space-3);background:none;border:none;cursor:pointer;font-size:var(--mrd-font-size-sm);font-family:var(--mrd-font-family);color:var(--mrd-color-neutral-800)}.mrd-table__create-picker-item.sc-mrd-table:hover{background:var(--mrd-color-neutral-50);color:var(--mrd-color-neutral-900)}.mrd-table__filter-clear.sc-mrd-table{width:auto;gap:var(--mrd-space-1);padding:0 var(--mrd-space-2);color:var(--mrd-color-primary);border-color:var(--mrd-color-primary)}.mrd-table__filter-clear.sc-mrd-table:hover{color:var(--mrd-color-primary);border-color:var(--mrd-color-primary)}.mrd-table__filter-clear-label.sc-mrd-table{font-size:var(--mrd-font-size-sm);white-space:nowrap}.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, 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, 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--stacked.sc-mrd-table{flex-direction:column;align-items:stretch;gap:var(--mrd-space-2)}.mrd-table__filter-range-sep.sc-mrd-table{color:var(--mrd-color-neutral-400);flex-shrink:0}.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;overflow:hidden;text-overflow:ellipsis;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}.mrd-table__json-preview.sc-mrd-table{font-family:var(--mrd-font-family-mono);font-size:var(--mrd-font-size-xs);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:inline-block;max-width:calc(100% - 1.5rem);vertical-align:middle}.mrd-table__modal-json.sc-mrd-table{margin:0;padding-right:var(--mrd-space-6);font-family:var(--mrd-font-family-mono);font-size:var(--mrd-font-size-xs);white-space:pre-wrap;word-break:break-word;line-height:1.6;background:none;border:none}@keyframes mrd-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}`;
|
|
6590
6598
|
|
|
6591
6599
|
/** How often (ms) to scan outstanding page requests for staleness. */
|
|
6592
6600
|
const STALE_CHECK_INTERVAL_MS = 2000;
|
|
6593
6601
|
/** Breedte van de filterpopup in px — voor overflow-correctie. */
|
|
6594
6602
|
const POPUP_WIDTH = 280;
|
|
6603
|
+
/** Smallest column width (px) a user can drag a column down to. */
|
|
6604
|
+
const MIN_COL_WIDTH = 48;
|
|
6605
|
+
/** Upper bound (px) for a double-click auto-fit, so one huge value can't blow up the layout. */
|
|
6606
|
+
const MAX_AUTOFIT_WIDTH = 600;
|
|
6595
6607
|
const MrdTable = class {
|
|
6596
6608
|
constructor(hostRef) {
|
|
6597
6609
|
index.registerInstance(this, hostRef);
|
|
@@ -6615,6 +6627,13 @@ const MrdTable = class {
|
|
|
6615
6627
|
this.viewPopoverClickHandler = null;
|
|
6616
6628
|
/** Guards against scheduling more than one column-width measurement per freeze. */
|
|
6617
6629
|
this.colWidthMeasureScheduled = false;
|
|
6630
|
+
/** Drag origin of the running column resize (null = no drag in progress). */
|
|
6631
|
+
this.resizeOrigin = null;
|
|
6632
|
+
/** True once the user has dragged (or auto-fitted) a column — see colWidthsUserSet usages. */
|
|
6633
|
+
this.colWidthsUserSet = false;
|
|
6634
|
+
/** Set once the host drives this table through init()/setPage(). Never cleared: it has to
|
|
6635
|
+
* survive resetPages(), which empties loadedPages — see the isPaginated getter. */
|
|
6636
|
+
this.paginationActivated = false;
|
|
6618
6637
|
// ── Props ──────────────────────────────────────────────────────────────────
|
|
6619
6638
|
/** The VIEW or RELATED_VIEW layout item. Contains view config, dataClass, fromClass, actions etc. */
|
|
6620
6639
|
this.item = null;
|
|
@@ -6644,10 +6663,10 @@ const MrdTable = class {
|
|
|
6644
6663
|
this.renderStart = 0;
|
|
6645
6664
|
this.renderEnd = 0;
|
|
6646
6665
|
this.colWidths = [];
|
|
6666
|
+
/** Index of the column currently being dragged by its resize handle (null = not resizing). */
|
|
6667
|
+
this.resizingCol = null;
|
|
6647
6668
|
this.sortField = '';
|
|
6648
6669
|
this.sortDir = 'asc';
|
|
6649
|
-
/** Whether the filter UI is visible on column headers. */
|
|
6650
|
-
this.filterMode = false;
|
|
6651
6670
|
/** Active filters keyed by field name. */
|
|
6652
6671
|
this.activeFilters = new Map();
|
|
6653
6672
|
/** Field name of the currently open filter popup (null = closed). */
|
|
@@ -6684,15 +6703,24 @@ const MrdTable = class {
|
|
|
6684
6703
|
};
|
|
6685
6704
|
}
|
|
6686
6705
|
// ── Prop watchers ─────────────────────────────────────────────────────────
|
|
6687
|
-
/** Clamp renderEnd when totalElements shrinks (e.g. after a filter is applied).
|
|
6706
|
+
/** Clamp renderEnd when totalElements shrinks (e.g. after a filter is applied).
|
|
6707
|
+
* 0 means "unknown" (hosts that rely on minKnownTotal never set it, and some reset it
|
|
6708
|
+
* while a filter is being applied) — clamping to it would collapse the window to a
|
|
6709
|
+
* single row, so leave the window alone and let the render pass clamp it. */
|
|
6688
6710
|
totalElementsChanged(newVal) {
|
|
6689
|
-
|
|
6711
|
+
if (newVal > 0)
|
|
6712
|
+
this.renderEnd = Math.min(this.renderEnd, newVal - 1);
|
|
6690
6713
|
}
|
|
6691
6714
|
/** Reset to primary view when the item prop is replaced from outside. */
|
|
6692
6715
|
itemChanged(newVal) {
|
|
6693
6716
|
var _a, _b;
|
|
6694
6717
|
this.activeViewIdx = 0;
|
|
6695
6718
|
this.applyDefaultSort((_b = (_a = newVal === null || newVal === void 0 ? void 0 : newVal.view) === null || _a === void 0 ? void 0 : _a.defaultSort) !== null && _b !== void 0 ? _b : '');
|
|
6719
|
+
// The columns getter derives from item/activeViewIdx: locked widths belong to the old
|
|
6720
|
+
// column set and would otherwise be applied by index to the new one.
|
|
6721
|
+
this.colWidths = [];
|
|
6722
|
+
this.colWidthMeasureScheduled = false;
|
|
6723
|
+
this.colWidthsUserSet = false;
|
|
6696
6724
|
}
|
|
6697
6725
|
// ── Lifecycle ──────────────────────────────────────────────────────────────
|
|
6698
6726
|
componentWillLoad() {
|
|
@@ -6727,6 +6755,7 @@ const MrdTable = class {
|
|
|
6727
6755
|
this.retryAttempts.clear();
|
|
6728
6756
|
this.colWidths = [];
|
|
6729
6757
|
this.colWidthMeasureScheduled = false;
|
|
6758
|
+
this.colWidthsUserSet = false;
|
|
6730
6759
|
this.scrollTop = 0;
|
|
6731
6760
|
this.renderStart = 0;
|
|
6732
6761
|
// Always fill the visible viewport on init — totalElements may be stale from a
|
|
@@ -6739,6 +6768,7 @@ const MrdTable = class {
|
|
|
6739
6768
|
this.aggregationsTotal = null;
|
|
6740
6769
|
this.aggregationsPending = true;
|
|
6741
6770
|
this.minKnownTotal = 0;
|
|
6771
|
+
this.paginationActivated = true;
|
|
6742
6772
|
// Always request page 0 — totalElements may be unknown (0) on first load.
|
|
6743
6773
|
this.emitLoadPage(0);
|
|
6744
6774
|
this.requestedPages = new Set([0]);
|
|
@@ -6755,6 +6785,7 @@ const MrdTable = class {
|
|
|
6755
6785
|
* detection even when rows.length === pageSize (exact multiple of page size).
|
|
6756
6786
|
*/
|
|
6757
6787
|
async setPage(pageNumber, rows, hasNext) {
|
|
6788
|
+
this.paginationActivated = true;
|
|
6758
6789
|
const isLastPage = hasNext !== undefined ? !hasNext : rows.length < this.pageSize;
|
|
6759
6790
|
if (isLastPage) {
|
|
6760
6791
|
// lastRowIdx is -1 when the page is empty; clamp renderEnd to -1 so the
|
|
@@ -6771,6 +6802,13 @@ const MrdTable = class {
|
|
|
6771
6802
|
const next = new Map(this.loadedPages);
|
|
6772
6803
|
next.set(pageNumber, rows);
|
|
6773
6804
|
this.loadedPages = next;
|
|
6805
|
+
// Repair a window that renders nothing. renderEnd is only ever clamped *down* (here and
|
|
6806
|
+
// in totalElementsChanged), so a window computed while the total was still unknown stays
|
|
6807
|
+
// collapsed and the rows sit in loadedPages without ever reaching the screen until the
|
|
6808
|
+
// user scrolls. Stays collapsed when the data really is empty (minKnownTotal 0).
|
|
6809
|
+
if (this.renderEnd < this.renderStart) {
|
|
6810
|
+
this.renderEnd = Math.min(this.renderStart + this.visibleCount() - 1, this.minKnownTotal - 1);
|
|
6811
|
+
}
|
|
6774
6812
|
this.requestedAt.delete(pageNumber);
|
|
6775
6813
|
this.retryAttempts.delete(pageNumber);
|
|
6776
6814
|
if (this.failedPages.has(pageNumber)) {
|
|
@@ -6821,23 +6859,123 @@ const MrdTable = class {
|
|
|
6821
6859
|
// re-render *during* the render cycle if done synchronously here. Defer it to a
|
|
6822
6860
|
// writeTask so the state mutation happens outside the render pass (avoids the
|
|
6823
6861
|
// Stencil "state/prop changed during rendering" warning and potential loops).
|
|
6862
|
+
// NB: the freeze must not depend on the totalElements prop — hosts may omit it
|
|
6863
|
+
// and rely on minKnownTotal, in which case the widths would never be locked and
|
|
6864
|
+
// every incoming page would re-flow all columns.
|
|
6824
6865
|
if (this.colWidths.length === 0 &&
|
|
6825
6866
|
!this.colWidthMeasureScheduled &&
|
|
6826
|
-
this.loadedPages.size > 0
|
|
6827
|
-
this.totalElements > 0) {
|
|
6867
|
+
this.loadedPages.size > 0) {
|
|
6828
6868
|
this.colWidthMeasureScheduled = true;
|
|
6829
6869
|
index.writeTask(() => {
|
|
6830
6870
|
this.colWidthMeasureScheduled = false;
|
|
6831
6871
|
// Re-check: state may have changed (e.g. a reset) between scheduling and running.
|
|
6832
6872
|
if (this.colWidths.length !== 0)
|
|
6833
6873
|
return;
|
|
6834
|
-
const
|
|
6835
|
-
if (
|
|
6836
|
-
this.colWidths =
|
|
6837
|
-
}
|
|
6874
|
+
const measured = this.measureColWidths();
|
|
6875
|
+
if (measured)
|
|
6876
|
+
this.colWidths = measured;
|
|
6838
6877
|
});
|
|
6839
6878
|
}
|
|
6840
6879
|
}
|
|
6880
|
+
// ── Column resizing (drag the header border, Excel-style) ──────────────────
|
|
6881
|
+
/** Current rendered header widths, or null when they can't be trusted (header not laid out yet). */
|
|
6882
|
+
measureColWidths() {
|
|
6883
|
+
const ths = this.el.querySelectorAll('.mrd-table__header');
|
|
6884
|
+
if (ths.length === 0 || ths.length !== this.columns.length)
|
|
6885
|
+
return null;
|
|
6886
|
+
return Array.from(ths).map(th => Math.round(th.getBoundingClientRect().width));
|
|
6887
|
+
}
|
|
6888
|
+
/** Re-reads the rendered header widths into colWidths so a drag starts from what is
|
|
6889
|
+
* actually on screen — and locks the columns if they weren't locked yet.
|
|
6890
|
+
*
|
|
6891
|
+
* A table narrower than its container is stretched by `minWidth: 100%`, so the rendered
|
|
6892
|
+
* columns are wider than the auto-measured values held in colWidths. Dragging from those
|
|
6893
|
+
* stale values moved the grabbed column to the wrong width, and dropping the stretch (which
|
|
6894
|
+
* a hand-set width does) then re-laid out every other column at once. */
|
|
6895
|
+
syncColWidths() {
|
|
6896
|
+
const measured = this.measureColWidths();
|
|
6897
|
+
if (measured) {
|
|
6898
|
+
this.colWidths = measured;
|
|
6899
|
+
return true;
|
|
6900
|
+
}
|
|
6901
|
+
return this.colWidths.length === this.columns.length;
|
|
6902
|
+
}
|
|
6903
|
+
setColWidth(idx, width) {
|
|
6904
|
+
const next = [...this.colWidths];
|
|
6905
|
+
next[idx] = Math.max(MIN_COL_WIDTH, Math.round(width));
|
|
6906
|
+
this.colWidths = next;
|
|
6907
|
+
this.colWidthsUserSet = true;
|
|
6908
|
+
}
|
|
6909
|
+
handleResizeStart(e, idx) {
|
|
6910
|
+
var _a, _b;
|
|
6911
|
+
// Stop the header's own click/sort handling; the drag owns this gesture.
|
|
6912
|
+
e.preventDefault();
|
|
6913
|
+
e.stopPropagation();
|
|
6914
|
+
if (!this.syncColWidths())
|
|
6915
|
+
return;
|
|
6916
|
+
this.resizeOrigin = { idx, startX: e.clientX, startWidth: this.colWidths[idx] };
|
|
6917
|
+
this.resizingCol = idx;
|
|
6918
|
+
// Pointer capture keeps move/up events on the handle even when the cursor runs
|
|
6919
|
+
// ahead of it — no document-level listeners to register and clean up.
|
|
6920
|
+
(_b = (_a = e.currentTarget).setPointerCapture) === null || _b === void 0 ? void 0 : _b.call(_a, e.pointerId);
|
|
6921
|
+
}
|
|
6922
|
+
handleResizeMove(e) {
|
|
6923
|
+
if (!this.resizeOrigin)
|
|
6924
|
+
return;
|
|
6925
|
+
const { idx, startX, startWidth } = this.resizeOrigin;
|
|
6926
|
+
this.setColWidth(idx, startWidth + (e.clientX - startX));
|
|
6927
|
+
}
|
|
6928
|
+
handleResizeEnd(e) {
|
|
6929
|
+
var _a, _b;
|
|
6930
|
+
if (!this.resizeOrigin)
|
|
6931
|
+
return;
|
|
6932
|
+
this.resizeOrigin = null;
|
|
6933
|
+
this.resizingCol = null;
|
|
6934
|
+
(_b = (_a = e.currentTarget).releasePointerCapture) === null || _b === void 0 ? void 0 : _b.call(_a, e.pointerId);
|
|
6935
|
+
}
|
|
6936
|
+
/** Double-click on the handle: widen the column to fit its widest *rendered* cell.
|
|
6937
|
+
* Only rows currently in the virtual-scroll window are measured — off-screen pages
|
|
6938
|
+
* aren't in the DOM at all, so this is "fit what you can see", not "fit all data". */
|
|
6939
|
+
handleResizeAutoFit(e, idx) {
|
|
6940
|
+
e.preventDefault();
|
|
6941
|
+
e.stopPropagation();
|
|
6942
|
+
if (!this.syncColWidths())
|
|
6943
|
+
return;
|
|
6944
|
+
// .mrd-table__cell only matches real data cells — the shimmer/retry rows render a single
|
|
6945
|
+
// colSpan cell (without that class) which would otherwise measure as the full table width.
|
|
6946
|
+
const cells = this.el.querySelectorAll(`.mrd-table__header:nth-child(${idx + 1}), .mrd-table__cell:nth-child(${idx + 1})`);
|
|
6947
|
+
let widest = 0;
|
|
6948
|
+
cells.forEach(cell => {
|
|
6949
|
+
// scrollWidth is the untruncated content width; cells clip with overflow: hidden.
|
|
6950
|
+
const style = getComputedStyle(cell);
|
|
6951
|
+
const padding = parseFloat(style.paddingLeft || '0') + parseFloat(style.paddingRight || '0');
|
|
6952
|
+
widest = Math.max(widest, cell.scrollWidth + padding);
|
|
6953
|
+
});
|
|
6954
|
+
if (widest > 0)
|
|
6955
|
+
this.setColWidth(idx, Math.min(widest, MAX_AUTOFIT_WIDTH));
|
|
6956
|
+
}
|
|
6957
|
+
/** Inline table style once the column widths are locked, undefined while still auto-layout.
|
|
6958
|
+
* Once locked the table gets an explicit pixel width (the sum of the columns) instead of
|
|
6959
|
+
* the stylesheet's `min-width: max-content`. max-content is re-derived from the cell
|
|
6960
|
+
* contents, so every page that scrolled in with a longer value widened the table and
|
|
6961
|
+
* re-proportioned all columns — the jitter this replaces.
|
|
6962
|
+
* `minWidth: 100%` keeps an auto-measured table stretched to its container, but is dropped
|
|
6963
|
+
* once the user resizes by hand: with it, the space freed by narrowing a column is
|
|
6964
|
+
* redistributed over all columns, so a drag would partly spring back. */
|
|
6965
|
+
lockedTableStyle() {
|
|
6966
|
+
if (this.colWidths.length === 0)
|
|
6967
|
+
return undefined;
|
|
6968
|
+
const total = this.colWidths.reduce((sum, w) => sum + (w || 0), 0);
|
|
6969
|
+
return Object.assign({ tableLayout: 'fixed', width: `${total}px` }, (this.colWidthsUserSet ? {} : { minWidth: '100%' }));
|
|
6970
|
+
}
|
|
6971
|
+
/** The resize handle rendered in the right edge of every header cell. */
|
|
6972
|
+
renderColResizer(idx) {
|
|
6973
|
+
const cls = 'mrd-table__col-resizer' + (this.resizingCol === idx ? ' mrd-table__col-resizer--active' : '');
|
|
6974
|
+
return (index.h("span", { class: cls, role: "separator", "aria-orientation": "vertical", title: cellRenderer.t('column_resize', this.locale), "on-pointerdown": (e) => this.handleResizeStart(e, idx), "on-pointermove": (e) => this.handleResizeMove(e), "on-pointerup": (e) => this.handleResizeEnd(e), "on-pointercancel": (e) => this.handleResizeEnd(e), "on-dblclick": (e) => this.handleResizeAutoFit(e, idx),
|
|
6975
|
+
// The click that follows the drag targets this handle; swallow it so it never
|
|
6976
|
+
// bubbles to the header and triggers a sort or the filter popup.
|
|
6977
|
+
onClick: (e) => e.stopPropagation() }));
|
|
6978
|
+
}
|
|
6841
6979
|
// ── Paging / scroll helpers ────────────────────────────────────────────────
|
|
6842
6980
|
visibleCount() {
|
|
6843
6981
|
return visibleCount(this.tableHeight, this.rowHeight);
|
|
@@ -6921,6 +7059,17 @@ const MrdTable = class {
|
|
|
6921
7059
|
activeFilters: this.activeFilters.values(),
|
|
6922
7060
|
});
|
|
6923
7061
|
}
|
|
7062
|
+
/** True when the table is in paginated / virtual-scroll mode rather than driven by the
|
|
7063
|
+
* rows prop. Mirrors the branch taken in render().
|
|
7064
|
+
*
|
|
7065
|
+
* The filter handlers gate their reload on this. They used to test minKnownTotal, which is
|
|
7066
|
+
* 0 after a filter returned no rows at all — so clearing that filter reloaded nothing and
|
|
7067
|
+
* the table stayed empty. Hosts that omit totalElements have the same problem, hence the
|
|
7068
|
+
* sticky flag rather than loadedPages.size: resetPages() clears the loaded pages, and the
|
|
7069
|
+
* mode must not flip back to the rows prop (and its "no results") while page 0 is in flight. */
|
|
7070
|
+
get isPaginated() {
|
|
7071
|
+
return this.totalElements > 0 || this.paginationActivated;
|
|
7072
|
+
}
|
|
6924
7073
|
get columns() {
|
|
6925
7074
|
var _a, _b, _c;
|
|
6926
7075
|
return ((_c = (_b = (_a = this.allViews[this.activeViewIdx]) === null || _a === void 0 ? void 0 : _a.view) === null || _b === void 0 ? void 0 : _b.values) !== null && _c !== void 0 ? _c : []);
|
|
@@ -7002,8 +7151,13 @@ const MrdTable = class {
|
|
|
7002
7151
|
this.failedPages = new Set();
|
|
7003
7152
|
this.requestedAt.clear();
|
|
7004
7153
|
this.retryAttempts.clear();
|
|
7005
|
-
|
|
7006
|
-
|
|
7154
|
+
// A sort or filter change keeps the same columns, so hand-set widths survive it —
|
|
7155
|
+
// re-measuring would throw away what the user just dragged. Auto-measured widths are
|
|
7156
|
+
// dropped so they can be re-derived from the new first page.
|
|
7157
|
+
if (!this.colWidthsUserSet) {
|
|
7158
|
+
this.colWidths = [];
|
|
7159
|
+
this.colWidthMeasureScheduled = false;
|
|
7160
|
+
}
|
|
7007
7161
|
this.scrollTop = 0;
|
|
7008
7162
|
this.renderStart = 0;
|
|
7009
7163
|
this.minKnownTotal = 0;
|
|
@@ -7014,18 +7168,8 @@ const MrdTable = class {
|
|
|
7014
7168
|
if (scroller)
|
|
7015
7169
|
scroller.scrollTop = 0;
|
|
7016
7170
|
}
|
|
7017
|
-
|
|
7018
|
-
|
|
7019
|
-
if (this.sortField === name) {
|
|
7020
|
-
this.sortDir = this.sortDir === 'asc' ? 'desc' : 'asc';
|
|
7021
|
-
}
|
|
7022
|
-
else {
|
|
7023
|
-
this.sortField = name;
|
|
7024
|
-
this.sortDir = 'asc';
|
|
7025
|
-
}
|
|
7026
|
-
this.resetPages();
|
|
7027
|
-
this.emitPagesForWindow(this.renderStart, this.renderEnd);
|
|
7028
|
-
}
|
|
7171
|
+
/** Sorting runs through the column popup's sort section (applySort); there is no
|
|
7172
|
+
* separate click-to-sort mode any more. */
|
|
7029
7173
|
applySort(col, dir) {
|
|
7030
7174
|
this.sortField = this.colName(col);
|
|
7031
7175
|
this.sortDir = dir;
|
|
@@ -7131,11 +7275,6 @@ const MrdTable = class {
|
|
|
7131
7275
|
this.requestedPages = requested;
|
|
7132
7276
|
}
|
|
7133
7277
|
// ── Filter helpers ─────────────────────────────────────────────────────────
|
|
7134
|
-
handleFilterToggle() {
|
|
7135
|
-
this.filterMode = !this.filterMode;
|
|
7136
|
-
if (!this.filterMode)
|
|
7137
|
-
this.closeFilterPopup();
|
|
7138
|
-
}
|
|
7139
7278
|
handleFilterOpen(col, e) {
|
|
7140
7279
|
e.stopPropagation();
|
|
7141
7280
|
const btn = e.currentTarget;
|
|
@@ -7242,7 +7381,7 @@ const MrdTable = class {
|
|
|
7242
7381
|
this.aggregations = null;
|
|
7243
7382
|
this.aggregationsTotal = null;
|
|
7244
7383
|
this.aggregationsPending = true;
|
|
7245
|
-
if (this.
|
|
7384
|
+
if (this.isPaginated) {
|
|
7246
7385
|
this.resetPages();
|
|
7247
7386
|
this.emitPagesForWindow(this.renderStart, this.renderEnd);
|
|
7248
7387
|
}
|
|
@@ -7257,7 +7396,7 @@ const MrdTable = class {
|
|
|
7257
7396
|
this.aggregations = null;
|
|
7258
7397
|
this.aggregationsTotal = null;
|
|
7259
7398
|
this.aggregationsPending = true;
|
|
7260
|
-
if (this.
|
|
7399
|
+
if (this.isPaginated) {
|
|
7261
7400
|
this.resetPages();
|
|
7262
7401
|
this.emitPagesForWindow(this.renderStart, this.renderEnd);
|
|
7263
7402
|
}
|
|
@@ -7267,7 +7406,7 @@ const MrdTable = class {
|
|
|
7267
7406
|
this.aggregations = null;
|
|
7268
7407
|
this.aggregationsTotal = null;
|
|
7269
7408
|
this.aggregationsPending = true;
|
|
7270
|
-
if (this.
|
|
7409
|
+
if (this.isPaginated) {
|
|
7271
7410
|
this.resetPages();
|
|
7272
7411
|
this.emitPagesForWindow(this.renderStart, this.renderEnd);
|
|
7273
7412
|
}
|
|
@@ -7303,8 +7442,7 @@ const MrdTable = class {
|
|
|
7303
7442
|
// ── Render: toolbar ────────────────────────────────────────────────────────
|
|
7304
7443
|
renderToolbar() {
|
|
7305
7444
|
var _a;
|
|
7306
|
-
return (index.h(Toolbar, { locale: this.locale,
|
|
7307
|
-
onFilterToggle: () => this.handleFilterToggle(),
|
|
7445
|
+
return (index.h(Toolbar, { locale: this.locale, filterCount: this.activeFilters.size, actions: this.tableActions, views: this.allViews, activeViewIdx: this.activeViewIdx, viewPopoverOpen: this.viewPopoverOpen, createPickerOpen: this.createPickerOpen, createTypes: (_a = this.item) === null || _a === void 0 ? void 0 : _a.createTypes, cb: {
|
|
7308
7446
|
onClearAllFilters: () => this.clearAllFilters(),
|
|
7309
7447
|
onViewSwitch: idx => this.handleViewSwitch(idx),
|
|
7310
7448
|
onToggleViewPopover: e => this.toggleViewPopover(e),
|
|
@@ -7337,7 +7475,7 @@ const MrdTable = class {
|
|
|
7337
7475
|
// ── Render: footer ────────────────────────────────────────────────────────
|
|
7338
7476
|
renderFooter(rowCount, effectiveTotal, isTotalKnown = true) {
|
|
7339
7477
|
// Non-paginated mode: totalElements=0 and no paginated data loaded yet
|
|
7340
|
-
if (this.
|
|
7478
|
+
if (!this.isPaginated) {
|
|
7341
7479
|
const count = rowCount !== null && rowCount !== void 0 ? rowCount : 0;
|
|
7342
7480
|
if (count === 0)
|
|
7343
7481
|
return null;
|
|
@@ -7371,17 +7509,18 @@ const MrdTable = class {
|
|
|
7371
7509
|
// ── Non-paginated mode ──────────────────────────────────────────────────
|
|
7372
7510
|
// Only enter non-paginated mode when totalElements is 0 AND no paginated data
|
|
7373
7511
|
// has been loaded yet — prevents the wrong branch when the host omits totalElements.
|
|
7374
|
-
if (this.
|
|
7375
|
-
return (index.h(index.Host, null, this.renderToolbar(), index.h("div", { class: "mrd-table" }, index.h("table", { class: "mrd-table__table" }, index.h("thead", null, index.h("tr", null, this.columns.map(col => {
|
|
7512
|
+
if (!this.isPaginated) {
|
|
7513
|
+
return (index.h(index.Host, { class: { 'mrd-table--resizing': this.resizingCol !== null } }, this.renderToolbar(), index.h("div", { class: "mrd-table" }, index.h("table", { class: "mrd-table__table", style: this.lockedTableStyle() }, index.h("thead", null, index.h("tr", null, this.columns.map((col, idx) => {
|
|
7376
7514
|
var _a;
|
|
7377
7515
|
const name = this.colName(col);
|
|
7378
7516
|
const isFiltered = this.activeFilters.has(name);
|
|
7517
|
+
const isInteractive = !NON_INTERACTIVE_TYPES.has(this.colDataType(col));
|
|
7379
7518
|
const cls = [
|
|
7380
7519
|
'mrd-table__header',
|
|
7381
7520
|
isFiltered ? 'mrd-table__header--filtered' : '',
|
|
7382
|
-
|
|
7521
|
+
isInteractive ? 'mrd-table__header--sortable' : '',
|
|
7383
7522
|
].filter(Boolean).join(' ');
|
|
7384
|
-
return (index.h("th", { class: cls,
|
|
7523
|
+
return (index.h("th", { class: cls, style: this.colWidths[idx] ? { width: `${this.colWidths[idx]}px` } : undefined, onClick: isInteractive ? (e) => this.handleFilterOpen(col, e) : undefined }, index.h("span", { class: "mrd-table__header-label" }, (_a = col.label) !== null && _a !== void 0 ? _a : ''), isFiltered && index.h(FilterIcon, null), this.renderColResizer(idx)));
|
|
7385
7524
|
}))), index.h("tbody", null, (_b = this.rows) === null || _b === void 0 ? void 0 : _b.map((row, i) => (index.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) && (index.h("p", { class: "mrd-table__empty" }, cellRenderer.t('no_results', this.locale)))), this.renderFooter((_c = this.rows) === null || _c === void 0 ? void 0 : _c.length), this.renderFilterPopup(), this.renderTextblockModal(), this.renderJsonModal()));
|
|
7386
7525
|
}
|
|
7387
7526
|
// ── Paginated / virtual-scroll mode ────────────────────────────────────
|
|
@@ -7395,9 +7534,13 @@ const MrdTable = class {
|
|
|
7395
7534
|
const colCount = this.columns.length;
|
|
7396
7535
|
const topSpacerHeight = this.renderStart * this.rowHeight;
|
|
7397
7536
|
const bottomSpacerHeight = Math.max(0, (effectiveTotal - 1 - clampedEnd) * this.rowHeight);
|
|
7398
|
-
|
|
7399
|
-
|
|
7400
|
-
|
|
7537
|
+
// Once the widths are frozen the table gets an explicit pixel width (the sum of the
|
|
7538
|
+
// locked columns) instead of the stylesheet's `min-width: max-content`. max-content is
|
|
7539
|
+
// re-derived from the cell contents, so every page that scrolled in with a longer value
|
|
7540
|
+
// widened the table and re-proportioned all columns — the jitter this replaces.
|
|
7541
|
+
// `minWidth: 100%` keeps a narrow table stretched to the container (and still responsive
|
|
7542
|
+
// to container resizes) without ever consulting the content again.
|
|
7543
|
+
const tableStyle = this.lockedTableStyle();
|
|
7401
7544
|
const renderedRows = [];
|
|
7402
7545
|
for (let i = this.renderStart; i <= clampedEnd; i++) {
|
|
7403
7546
|
const row = this.getRow(i);
|
|
@@ -7422,7 +7565,7 @@ const MrdTable = class {
|
|
|
7422
7565
|
}) }, this.columns.map(col => this.renderCell(col, row))));
|
|
7423
7566
|
}
|
|
7424
7567
|
}
|
|
7425
|
-
return (index.h(index.Host, null, this.renderToolbar(), index.h("div", { class: "mrd-table__scroll", style: { height: `${this.tableHeight}px` }, onScroll: this.handleScroll }, index.h("table", { class: "mrd-table__table", style: tableStyle }, index.h("thead", null, index.h("tr", null, this.columns.map((col, idx) => {
|
|
7568
|
+
return (index.h(index.Host, { class: { 'mrd-table--resizing': this.resizingCol !== null } }, this.renderToolbar(), index.h("div", { class: "mrd-table__scroll", style: { height: `${this.tableHeight}px` }, onScroll: this.handleScroll }, index.h("table", { class: "mrd-table__table", style: tableStyle }, index.h("thead", null, index.h("tr", null, this.columns.map((col, idx) => {
|
|
7426
7569
|
var _a;
|
|
7427
7570
|
const name = this.colName(col);
|
|
7428
7571
|
const isActive = this.sortField === name;
|
|
@@ -7434,7 +7577,7 @@ const MrdTable = class {
|
|
|
7434
7577
|
isActive ? `mrd-table__header--sorted-${this.sortDir}` : '',
|
|
7435
7578
|
isFiltered ? 'mrd-table__header--filtered' : '',
|
|
7436
7579
|
].filter(Boolean).join(' ');
|
|
7437
|
-
return (index.h("th", { class: cls, style: this.colWidths[idx] ? { width: `${this.colWidths[idx]}px` } : undefined, onClick: isInteractive ? ((e) => this.
|
|
7580
|
+
return (index.h("th", { class: cls, style: this.colWidths[idx] ? { width: `${this.colWidths[idx]}px` } : undefined, onClick: isInteractive ? ((e) => this.handleFilterOpen(col, e)) : undefined }, index.h("span", { class: "mrd-table__header-label" }, (_a = col.label) !== null && _a !== void 0 ? _a : ''), isInteractive && isActive && (index.h("span", { class: "mrd-table__sort-icon", "aria-hidden": "true" }, this.sortDir === 'asc' ? '▲' : '▼')), isInteractive && !isActive && (index.h("span", { class: "mrd-table__sort-icon", "aria-hidden": "true" }, "\u21C5")), isInteractive && isFiltered && index.h(FilterIcon, null), this.renderColResizer(idx)));
|
|
7438
7581
|
}))), index.h("tbody", null, topSpacerHeight > 0 && (index.h("tr", { class: "mrd-table__spacer", style: { height: `${topSpacerHeight}px` } }, index.h("td", { colSpan: colCount }))), renderedRows, bottomSpacerHeight > 0 && (index.h("tr", { class: "mrd-table__spacer", style: { height: `${bottomSpacerHeight}px` } }, index.h("td", { colSpan: colCount })))), this.renderTotalsRow())), effectiveTotal === 0 && this.loadedPages.has(0) && (index.h("p", { class: "mrd-table__empty" }, cellRenderer.t('no_results', this.locale))), effectiveTotal > 0 && this.renderFooter(undefined, effectiveTotal, this.isTotalKnown()), this.renderFilterPopup(), this.renderTextblockModal(), this.renderJsonModal()));
|
|
7439
7582
|
}
|
|
7440
7583
|
renderTextblockModal() {
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
var index = require('./index-DVbdkYO3.js');
|
|
4
4
|
var clientLayout = require('./client-layout-CqVuJumR.js');
|
|
5
|
-
var cellRenderer = require('./cell-renderer-
|
|
5
|
+
var cellRenderer = require('./cell-renderer-pwUGEDql.js');
|
|
6
6
|
|
|
7
7
|
/**
|
|
8
8
|
* Whether a layout item can appear in the merge diff at all. m-n relations
|