@mmlogic/components 0.1.17 → 0.1.18
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/loader.cjs.js +1 -1
- package/dist/cjs/mosterdcomponents.cjs.js +1 -1
- package/dist/cjs/mrd-table.cjs.entry.js +74 -3
- package/dist/collection/components/mrd-table/mrd-table.js +117 -3
- package/dist/collection/components/mrd-table/mrd-table.scss +21 -0
- package/dist/collection/dev/api.js +1 -0
- package/dist/collection/dev/app.js +25 -0
- package/dist/components/mrd-table.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/mosterdcomponents.js +1 -1
- package/dist/esm/mrd-table.entry.js +74 -3
- package/dist/mosterdcomponents/mosterdcomponents.esm.js +1 -1
- package/dist/mosterdcomponents/p-05b585bb.entry.js +1 -0
- package/dist/types/components/mrd-table/mrd-table.d.ts +17 -0
- package/dist/types/components.d.ts +11 -0
- package/dist/types/types/client-layout.d.ts +8 -0
- package/package.json +1 -1
- package/dist/mosterdcomponents/p-829b9b6f.entry.js +0 -1
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -6,7 +6,7 @@ var appGlobals = require('./app-globals-V2Kpy_OQ.js');
|
|
|
6
6
|
const defineCustomElements = async (win, options) => {
|
|
7
7
|
if (typeof window === 'undefined') return undefined;
|
|
8
8
|
await appGlobals.globalScripts();
|
|
9
|
-
return index.bootstrapLazy([["mrd-table.cjs",[[2,"mrd-table",{"columns":[16],"rows":[16],"locale":[1],"totalElements":[2,"total-elements"],"pageSize":[2,"page-size"],"rowHeight":[2,"row-height"],"tableHeight":[2,"table-height"],"defaultSort":[1,"default-sort"],"actions":[16],"loadedPages":[32],"requestedPages":[32],"renderStart":[32],"renderEnd":[32],"colWidths":[32],"sortField":[32],"sortDir":[32],"filterMode":[32],"activeFilters":[32],"openFilterCol":[32],"pendingFilter":[32],"popupPos":[32],"scrollTop":[32],"textblockModal":[32],"init":[64],"setPage":[64]},null,{"totalElements":[{"totalElementsChanged":0}]}]]],["mrd-boolean-field_16.cjs",[[2,"mrd-form",{"layout":[16],"locale":[1],"values":[16],"referenceHref":[1,"reference-href"],"referenceClass":[1,"reference-class"],"showCancel":[4,"show-cancel"],"formValues":[32],"errors":[32],"submitted":[32],"setFieldValue":[64]},null,{"values":[{"valuesChanged":0}]}],[2,"mrd-field",{"item":[16],"locale":[1],"value":[16]}],[2,"mrd-boolean-field",{"name":[1],"label":[1],"value":[4],"required":[4],"disabled":[4],"locale":[1],"checked":[32]}],[2,"mrd-currency-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"amountDisplay":[32],"currency":[32],"error":[32]}],[2,"mrd-date-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-datetime-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32],"localValue":[32]},null,{"value":[{"valueChanged":0}]}],[2,"mrd-email-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-file-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"fileName":[32],"isDragging":[32],"uploading":[32],"error":[32]},null,{"value":[{"valueChanged":0}]}],[2,"mrd-hyperlink-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-image-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"previewUrl":[32],"fileName":[32],"isDragging":[32],"uploading":[32],"error":[32]},null,{"value":[{"valueChanged":0}]}],[2,"mrd-list-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"multiple":[4],"locale":[1],"listItems":[16],"error":[32],"selected":[32]}],[2,"mrd-number-field",{"name":[1],"label":[1],"value":[2],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"dataType":[1,"data-type"],"decimalPrecision":[2,"decimal-precision"],"displayValue":[32],"error":[32]}],[2,"mrd-relation-field",{"name":[1],"label":[1],"required":[4],"disabled":[4],"locale":[1],"relatedClass":[1,"related-class"],"mostSignificantClass":[1,"most-significant-class"],"displayType":[1,"display-type"],"editBehavior":[1,"edit-behavior"],"commonRelation":[1,"common-relation"],"multiple":[4],"dropdownValues":[16],"value":[1],"searchQuery":[32],"searchResults":[32],"allRecords":[32],"isLoading":[32],"selectedItems":[32],"showResults":[32],"error":[32],"highlightedIndex":[32],"setAllRecords":[64],"setSearchResults":[64],"setLoading":[64]}],[2,"mrd-text-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-textarea-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32],"editorReady":[32]}],[2,"mrd-time-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}]]]], options);
|
|
9
|
+
return index.bootstrapLazy([["mrd-table.cjs",[[2,"mrd-table",{"columns":[16],"rows":[16],"locale":[1],"totalElements":[2,"total-elements"],"pageSize":[2,"page-size"],"rowHeight":[2,"row-height"],"tableHeight":[2,"table-height"],"defaultSort":[1,"default-sort"],"actions":[16],"loadedPages":[32],"requestedPages":[32],"renderStart":[32],"renderEnd":[32],"colWidths":[32],"sortField":[32],"sortDir":[32],"filterMode":[32],"activeFilters":[32],"openFilterCol":[32],"pendingFilter":[32],"popupPos":[32],"scrollTop":[32],"textblockModal":[32],"aggregations":[32],"init":[64],"setPage":[64],"setAggregations":[64]},null,{"totalElements":[{"totalElementsChanged":0}]}]]],["mrd-boolean-field_16.cjs",[[2,"mrd-form",{"layout":[16],"locale":[1],"values":[16],"referenceHref":[1,"reference-href"],"referenceClass":[1,"reference-class"],"showCancel":[4,"show-cancel"],"formValues":[32],"errors":[32],"submitted":[32],"setFieldValue":[64]},null,{"values":[{"valuesChanged":0}]}],[2,"mrd-field",{"item":[16],"locale":[1],"value":[16]}],[2,"mrd-boolean-field",{"name":[1],"label":[1],"value":[4],"required":[4],"disabled":[4],"locale":[1],"checked":[32]}],[2,"mrd-currency-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"amountDisplay":[32],"currency":[32],"error":[32]}],[2,"mrd-date-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-datetime-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32],"localValue":[32]},null,{"value":[{"valueChanged":0}]}],[2,"mrd-email-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-file-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"fileName":[32],"isDragging":[32],"uploading":[32],"error":[32]},null,{"value":[{"valueChanged":0}]}],[2,"mrd-hyperlink-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-image-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"previewUrl":[32],"fileName":[32],"isDragging":[32],"uploading":[32],"error":[32]},null,{"value":[{"valueChanged":0}]}],[2,"mrd-list-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"multiple":[4],"locale":[1],"listItems":[16],"error":[32],"selected":[32]}],[2,"mrd-number-field",{"name":[1],"label":[1],"value":[2],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"dataType":[1,"data-type"],"decimalPrecision":[2,"decimal-precision"],"displayValue":[32],"error":[32]}],[2,"mrd-relation-field",{"name":[1],"label":[1],"required":[4],"disabled":[4],"locale":[1],"relatedClass":[1,"related-class"],"mostSignificantClass":[1,"most-significant-class"],"displayType":[1,"display-type"],"editBehavior":[1,"edit-behavior"],"commonRelation":[1,"common-relation"],"multiple":[4],"dropdownValues":[16],"value":[1],"searchQuery":[32],"searchResults":[32],"allRecords":[32],"isLoading":[32],"selectedItems":[32],"showResults":[32],"error":[32],"highlightedIndex":[32],"setAllRecords":[64],"setSearchResults":[64],"setLoading":[64]}],[2,"mrd-text-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-textarea-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32],"editorReady":[32]}],[2,"mrd-time-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}]]]], options);
|
|
10
10
|
};
|
|
11
11
|
|
|
12
12
|
exports.setNonce = index.setNonce;
|
|
@@ -19,7 +19,7 @@ var patchBrowser = () => {
|
|
|
19
19
|
|
|
20
20
|
patchBrowser().then(async (options) => {
|
|
21
21
|
await appGlobals.globalScripts();
|
|
22
|
-
return index.bootstrapLazy([["mrd-table.cjs",[[2,"mrd-table",{"columns":[16],"rows":[16],"locale":[1],"totalElements":[2,"total-elements"],"pageSize":[2,"page-size"],"rowHeight":[2,"row-height"],"tableHeight":[2,"table-height"],"defaultSort":[1,"default-sort"],"actions":[16],"loadedPages":[32],"requestedPages":[32],"renderStart":[32],"renderEnd":[32],"colWidths":[32],"sortField":[32],"sortDir":[32],"filterMode":[32],"activeFilters":[32],"openFilterCol":[32],"pendingFilter":[32],"popupPos":[32],"scrollTop":[32],"textblockModal":[32],"init":[64],"setPage":[64]},null,{"totalElements":[{"totalElementsChanged":0}]}]]],["mrd-boolean-field_16.cjs",[[2,"mrd-form",{"layout":[16],"locale":[1],"values":[16],"referenceHref":[1,"reference-href"],"referenceClass":[1,"reference-class"],"showCancel":[4,"show-cancel"],"formValues":[32],"errors":[32],"submitted":[32],"setFieldValue":[64]},null,{"values":[{"valuesChanged":0}]}],[2,"mrd-field",{"item":[16],"locale":[1],"value":[16]}],[2,"mrd-boolean-field",{"name":[1],"label":[1],"value":[4],"required":[4],"disabled":[4],"locale":[1],"checked":[32]}],[2,"mrd-currency-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"amountDisplay":[32],"currency":[32],"error":[32]}],[2,"mrd-date-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-datetime-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32],"localValue":[32]},null,{"value":[{"valueChanged":0}]}],[2,"mrd-email-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-file-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"fileName":[32],"isDragging":[32],"uploading":[32],"error":[32]},null,{"value":[{"valueChanged":0}]}],[2,"mrd-hyperlink-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-image-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"previewUrl":[32],"fileName":[32],"isDragging":[32],"uploading":[32],"error":[32]},null,{"value":[{"valueChanged":0}]}],[2,"mrd-list-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"multiple":[4],"locale":[1],"listItems":[16],"error":[32],"selected":[32]}],[2,"mrd-number-field",{"name":[1],"label":[1],"value":[2],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"dataType":[1,"data-type"],"decimalPrecision":[2,"decimal-precision"],"displayValue":[32],"error":[32]}],[2,"mrd-relation-field",{"name":[1],"label":[1],"required":[4],"disabled":[4],"locale":[1],"relatedClass":[1,"related-class"],"mostSignificantClass":[1,"most-significant-class"],"displayType":[1,"display-type"],"editBehavior":[1,"edit-behavior"],"commonRelation":[1,"common-relation"],"multiple":[4],"dropdownValues":[16],"value":[1],"searchQuery":[32],"searchResults":[32],"allRecords":[32],"isLoading":[32],"selectedItems":[32],"showResults":[32],"error":[32],"highlightedIndex":[32],"setAllRecords":[64],"setSearchResults":[64],"setLoading":[64]}],[2,"mrd-text-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-textarea-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32],"editorReady":[32]}],[2,"mrd-time-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}]]]], options);
|
|
22
|
+
return index.bootstrapLazy([["mrd-table.cjs",[[2,"mrd-table",{"columns":[16],"rows":[16],"locale":[1],"totalElements":[2,"total-elements"],"pageSize":[2,"page-size"],"rowHeight":[2,"row-height"],"tableHeight":[2,"table-height"],"defaultSort":[1,"default-sort"],"actions":[16],"loadedPages":[32],"requestedPages":[32],"renderStart":[32],"renderEnd":[32],"colWidths":[32],"sortField":[32],"sortDir":[32],"filterMode":[32],"activeFilters":[32],"openFilterCol":[32],"pendingFilter":[32],"popupPos":[32],"scrollTop":[32],"textblockModal":[32],"aggregations":[32],"init":[64],"setPage":[64],"setAggregations":[64]},null,{"totalElements":[{"totalElementsChanged":0}]}]]],["mrd-boolean-field_16.cjs",[[2,"mrd-form",{"layout":[16],"locale":[1],"values":[16],"referenceHref":[1,"reference-href"],"referenceClass":[1,"reference-class"],"showCancel":[4,"show-cancel"],"formValues":[32],"errors":[32],"submitted":[32],"setFieldValue":[64]},null,{"values":[{"valuesChanged":0}]}],[2,"mrd-field",{"item":[16],"locale":[1],"value":[16]}],[2,"mrd-boolean-field",{"name":[1],"label":[1],"value":[4],"required":[4],"disabled":[4],"locale":[1],"checked":[32]}],[2,"mrd-currency-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"amountDisplay":[32],"currency":[32],"error":[32]}],[2,"mrd-date-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-datetime-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32],"localValue":[32]},null,{"value":[{"valueChanged":0}]}],[2,"mrd-email-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-file-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"fileName":[32],"isDragging":[32],"uploading":[32],"error":[32]},null,{"value":[{"valueChanged":0}]}],[2,"mrd-hyperlink-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-image-field",{"name":[1],"label":[1],"value":[16],"required":[4],"disabled":[4],"locale":[1],"accept":[1],"maxSize":[2,"max-size"],"previewUrl":[32],"fileName":[32],"isDragging":[32],"uploading":[32],"error":[32]},null,{"value":[{"valueChanged":0}]}],[2,"mrd-list-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"multiple":[4],"locale":[1],"listItems":[16],"error":[32],"selected":[32]}],[2,"mrd-number-field",{"name":[1],"label":[1],"value":[2],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"dataType":[1,"data-type"],"decimalPrecision":[2,"decimal-precision"],"displayValue":[32],"error":[32]}],[2,"mrd-relation-field",{"name":[1],"label":[1],"required":[4],"disabled":[4],"locale":[1],"relatedClass":[1,"related-class"],"mostSignificantClass":[1,"most-significant-class"],"displayType":[1,"display-type"],"editBehavior":[1,"edit-behavior"],"commonRelation":[1,"common-relation"],"multiple":[4],"dropdownValues":[16],"value":[1],"searchQuery":[32],"searchResults":[32],"allRecords":[32],"isLoading":[32],"selectedItems":[32],"showResults":[32],"error":[32],"highlightedIndex":[32],"setAllRecords":[64],"setSearchResults":[64],"setLoading":[64]}],[2,"mrd-text-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}],[2,"mrd-textarea-field",{"name":[1],"label":[1],"value":[1],"placeholder":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32],"editorReady":[32]}],[2,"mrd-time-field",{"name":[1],"label":[1],"value":[1],"required":[4],"disabled":[4],"locale":[1],"error":[32]}]]]], options);
|
|
23
23
|
});
|
|
24
24
|
|
|
25
25
|
exports.setNonce = index.setNonce;
|
|
@@ -68,7 +68,7 @@ class CellRenderer {
|
|
|
68
68
|
}
|
|
69
69
|
}
|
|
70
70
|
|
|
71
|
-
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__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__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}`;
|
|
71
|
+
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__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}`;
|
|
72
72
|
|
|
73
73
|
const BUFFER = 10;
|
|
74
74
|
/** Wacht deze tijd (ms) na het laatste scroll-event voordat pagina's worden
|
|
@@ -88,6 +88,7 @@ const MrdTable = class {
|
|
|
88
88
|
this.mrdAction = index$1.createEvent(this, "mrdAction");
|
|
89
89
|
this.mrdFilter = index$1.createEvent(this, "mrdFilter");
|
|
90
90
|
this.mrdDownload = index$1.createEvent(this, "mrdDownload");
|
|
91
|
+
this.mrdLoadAggregations = index$1.createEvent(this, "mrdLoadAggregations");
|
|
91
92
|
// ── Non-state internals ────────────────────────────────────────────────────
|
|
92
93
|
this.pendingPages = new Set();
|
|
93
94
|
this.debounceTimer = null;
|
|
@@ -133,6 +134,8 @@ const MrdTable = class {
|
|
|
133
134
|
this.scrollTop = 0;
|
|
134
135
|
/** Full text shown in the TEXTBLOCK expand modal (null = closed). */
|
|
135
136
|
this.textblockModal = null;
|
|
137
|
+
/** Aggregation totals received from the host via setAggregations(). Null = not yet loaded. */
|
|
138
|
+
this.aggregations = null;
|
|
136
139
|
this.handleScroll = (e) => {
|
|
137
140
|
const scroller = e.currentTarget;
|
|
138
141
|
const scrollTop = scroller.scrollTop;
|
|
@@ -183,6 +186,8 @@ const MrdTable = class {
|
|
|
183
186
|
const scroller = this.el.querySelector('.mrd-table__scroll');
|
|
184
187
|
if (scroller)
|
|
185
188
|
scroller.scrollTop = 0;
|
|
189
|
+
this.aggregations = null;
|
|
190
|
+
this.emitLoadAggregations();
|
|
186
191
|
}
|
|
187
192
|
/**
|
|
188
193
|
* Inject the rows for a given page (0-based).
|
|
@@ -203,6 +208,10 @@ const MrdTable = class {
|
|
|
203
208
|
next.set(pageNumber, rows);
|
|
204
209
|
this.loadedPages = next;
|
|
205
210
|
}
|
|
211
|
+
/** Inject aggregation totals returned by the /aggregations endpoint. */
|
|
212
|
+
async setAggregations(data) {
|
|
213
|
+
this.aggregations = data;
|
|
214
|
+
}
|
|
206
215
|
// ── Lifecycle ──────────────────────────────────────────────────────────────
|
|
207
216
|
disconnectedCallback() {
|
|
208
217
|
if (this.outsideClickHandler) {
|
|
@@ -241,6 +250,49 @@ const MrdTable = class {
|
|
|
241
250
|
return 'RELATION';
|
|
242
251
|
return (_b = (_a = col.field) === null || _a === void 0 ? void 0 : _a.dataType) !== null && _b !== void 0 ? _b : 'TEXT';
|
|
243
252
|
}
|
|
253
|
+
// ── Aggregation helpers ────────────────────────────────────────────────────
|
|
254
|
+
buildAggregationParams() {
|
|
255
|
+
var _a;
|
|
256
|
+
const groups = { sum: [], avg: [], count: [] };
|
|
257
|
+
for (const col of this.columns) {
|
|
258
|
+
if (col.type !== 'FIELD' || !((_a = col.field) === null || _a === void 0 ? void 0 : _a.aggregate))
|
|
259
|
+
continue;
|
|
260
|
+
const fn = col.field.aggregate.toLowerCase();
|
|
261
|
+
if (fn in groups)
|
|
262
|
+
groups[fn].push(col.field.name);
|
|
263
|
+
}
|
|
264
|
+
const params = {};
|
|
265
|
+
if (groups.sum.length)
|
|
266
|
+
params.sum = groups.sum;
|
|
267
|
+
if (groups.avg.length)
|
|
268
|
+
params.avg = groups.avg;
|
|
269
|
+
if (groups.count.length)
|
|
270
|
+
params.count = groups.count;
|
|
271
|
+
return Object.keys(params).length > 0 ? params : null;
|
|
272
|
+
}
|
|
273
|
+
emitLoadAggregations() {
|
|
274
|
+
const params = this.buildAggregationParams();
|
|
275
|
+
if (params)
|
|
276
|
+
this.mrdLoadAggregations.emit(params);
|
|
277
|
+
}
|
|
278
|
+
renderAggregationValue(col) {
|
|
279
|
+
var _a, _b;
|
|
280
|
+
if (col.type !== 'FIELD' || !((_a = col.field) === null || _a === void 0 ? void 0 : _a.aggregate) || !this.aggregations)
|
|
281
|
+
return '';
|
|
282
|
+
const fn = col.field.aggregate.toLowerCase();
|
|
283
|
+
const val = (_b = this.aggregations[fn]) === null || _b === void 0 ? void 0 : _b[col.field.name];
|
|
284
|
+
if (val == null)
|
|
285
|
+
return '';
|
|
286
|
+
const dt = col.field.dataType;
|
|
287
|
+
if (dt === 'INTEGER')
|
|
288
|
+
return format.formatNumber(val, this.locale, { maximumFractionDigits: 0 });
|
|
289
|
+
if (dt === 'PERCENTAGE')
|
|
290
|
+
return format.formatPercentage(val, this.locale);
|
|
291
|
+
if (dt === 'CURRENCY' && col.field.currencyCode)
|
|
292
|
+
return format.formatCurrency(val, col.field.currencyCode, this.locale);
|
|
293
|
+
return format.formatNumber(val, this.locale);
|
|
294
|
+
}
|
|
295
|
+
// ── Reset pagination ───────────────────────────────────────────────────────
|
|
244
296
|
/** Reset pagination state and scroll to top (used after sort or filter change). */
|
|
245
297
|
resetPages() {
|
|
246
298
|
if (this.debounceTimer !== null) {
|
|
@@ -504,6 +556,8 @@ const MrdTable = class {
|
|
|
504
556
|
this.activeFilters = next;
|
|
505
557
|
this.closeFilterPopup();
|
|
506
558
|
this.mrdFilter.emit({ filters: Array.from(this.activeFilters.values()) });
|
|
559
|
+
this.aggregations = null;
|
|
560
|
+
this.emitLoadAggregations();
|
|
507
561
|
if (this.totalElements > 0) {
|
|
508
562
|
this.resetPages();
|
|
509
563
|
this.emitPagesForWindow(this.renderStart, this.renderEnd);
|
|
@@ -517,6 +571,8 @@ const MrdTable = class {
|
|
|
517
571
|
this.activeFilters = next;
|
|
518
572
|
this.closeFilterPopup();
|
|
519
573
|
this.mrdFilter.emit({ filters: Array.from(this.activeFilters.values()) });
|
|
574
|
+
this.aggregations = null;
|
|
575
|
+
this.emitLoadAggregations();
|
|
520
576
|
if (this.totalElements > 0) {
|
|
521
577
|
this.resetPages();
|
|
522
578
|
this.emitPagesForWindow(this.renderStart, this.renderEnd);
|
|
@@ -525,6 +581,8 @@ const MrdTable = class {
|
|
|
525
581
|
clearAllFilters() {
|
|
526
582
|
this.activeFilters = new Map();
|
|
527
583
|
this.mrdFilter.emit({ filters: [] });
|
|
584
|
+
this.aggregations = null;
|
|
585
|
+
this.emitLoadAggregations();
|
|
528
586
|
if (this.totalElements > 0) {
|
|
529
587
|
this.resetPages();
|
|
530
588
|
this.emitPagesForWindow(this.renderStart, this.renderEnd);
|
|
@@ -648,6 +706,19 @@ const MrdTable = class {
|
|
|
648
706
|
const value = CellRenderer.render(col, row, this.locale);
|
|
649
707
|
return (index$1.h("td", { class: `mrd-table__cell${isNumeric ? ' mrd-table__cell--numeric' : ''}` }, value));
|
|
650
708
|
}
|
|
709
|
+
// ── Render: totals row ────────────────────────────────────────────────────
|
|
710
|
+
renderTotalsRow() {
|
|
711
|
+
if (!this.aggregations)
|
|
712
|
+
return null;
|
|
713
|
+
if (!this.columns.some(c => { var _a; return c.type === 'FIELD' && ((_a = c.field) === null || _a === void 0 ? void 0 : _a.aggregate); }))
|
|
714
|
+
return null;
|
|
715
|
+
return (index$1.h("tfoot", null, index$1.h("tr", { class: "mrd-table__totals-row" }, this.columns.map(col => {
|
|
716
|
+
var _a, _b;
|
|
717
|
+
const val = this.renderAggregationValue(col);
|
|
718
|
+
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 : '');
|
|
719
|
+
return (index$1.h("td", { class: `mrd-table__totals-cell${isNumeric ? ' mrd-table__totals-cell--numeric' : ''}` }, val));
|
|
720
|
+
}))));
|
|
721
|
+
}
|
|
651
722
|
// ── Render ─────────────────────────────────────────────────────────────────
|
|
652
723
|
render() {
|
|
653
724
|
var _a, _b, _c;
|
|
@@ -665,7 +736,7 @@ const MrdTable = class {
|
|
|
665
736
|
this.filterMode ? 'mrd-table__header--sortable' : '',
|
|
666
737
|
].filter(Boolean).join(' ');
|
|
667
738
|
return (index$1.h("th", { class: cls, onClick: this.filterMode ? (e) => this.handleFilterOpen(col, e) : undefined }, index$1.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()));
|
|
668
|
-
}))), index$1.h("tbody", null, (_b = this.rows) === null || _b === void 0 ? void 0 : _b.map((row, i) => (index$1.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.rows || this.rows.length === 0) && (index$1.h("p", { class: "mrd-table__empty" }, format.t('no_results', this.locale)))), this.renderFooter((_c = this.rows) === null || _c === void 0 ? void 0 : _c.length), this.renderFilterPopup(), this.renderTextblockModal()));
|
|
739
|
+
}))), index$1.h("tbody", null, (_b = this.rows) === null || _b === void 0 ? void 0 : _b.map((row, i) => (index$1.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$1.h("p", { class: "mrd-table__empty" }, format.t('no_results', this.locale)))), this.renderFooter((_c = this.rows) === null || _c === void 0 ? void 0 : _c.length), this.renderFilterPopup(), this.renderTextblockModal()));
|
|
669
740
|
}
|
|
670
741
|
// ── Paginated / virtual-scroll mode ────────────────────────────────────
|
|
671
742
|
// Derive the authoritative row count from loaded pages:
|
|
@@ -708,7 +779,7 @@ const MrdTable = class {
|
|
|
708
779
|
isFiltered ? 'mrd-table__header--filtered' : '',
|
|
709
780
|
].filter(Boolean).join(' ');
|
|
710
781
|
return (index$1.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) }, index$1.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 && (index$1.h("span", { class: "mrd-table__sort-icon", "aria-hidden": "true" }, this.sortDir === 'asc' ? '▲' : '▼')), !isActive && !this.filterMode && (index$1.h("span", { class: "mrd-table__sort-icon", "aria-hidden": "true" }, "\u21C5")), isFiltered && this.renderFilterIcon()));
|
|
711
|
-
}))), index$1.h("tbody", null, topSpacerHeight > 0 && (index$1.h("tr", { class: "mrd-table__spacer", style: { height: `${topSpacerHeight}px` } }, index$1.h("td", { colSpan: colCount }))), renderedRows, bottomSpacerHeight > 0 && (index$1.h("tr", { class: "mrd-table__spacer", style: { height: `${bottomSpacerHeight}px` } }, index$1.h("td", { colSpan: colCount })))))), effectiveTotal === 0 && this.loadedPages.has(0) && (index$1.h("p", { class: "mrd-table__empty" }, format.t('no_results', this.locale))), effectiveTotal > 0 && this.renderFooter(undefined, effectiveTotal), this.renderFilterPopup(), this.renderTextblockModal()));
|
|
782
|
+
}))), index$1.h("tbody", null, topSpacerHeight > 0 && (index$1.h("tr", { class: "mrd-table__spacer", style: { height: `${topSpacerHeight}px` } }, index$1.h("td", { colSpan: colCount }))), renderedRows, bottomSpacerHeight > 0 && (index$1.h("tr", { class: "mrd-table__spacer", style: { height: `${bottomSpacerHeight}px` } }, index$1.h("td", { colSpan: colCount })))), this.renderTotalsRow())), effectiveTotal === 0 && this.loadedPages.has(0) && (index$1.h("p", { class: "mrd-table__empty" }, format.t('no_results', this.locale))), effectiveTotal > 0 && this.renderFooter(undefined, effectiveTotal), this.renderFilterPopup(), this.renderTextblockModal()));
|
|
712
783
|
}
|
|
713
784
|
renderFilterIcon() {
|
|
714
785
|
return (index$1.h("span", { class: "mrd-table__filter-icon", "aria-hidden": "true" }, index$1.h("svg", { viewBox: "0 0 24 24", width: "14", height: "14", fill: "currentColor" }, index$1.h("path", { d: "M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z" }))));
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { h, Host } from "@stencil/core";
|
|
2
2
|
import { CellRenderer } from "../../utils/cell-renderer";
|
|
3
3
|
import { t } from "../../utils/i18n";
|
|
4
|
+
import { formatNumber, formatPercentage, formatCurrency } from "../../utils/format";
|
|
4
5
|
const BUFFER = 10;
|
|
5
6
|
/** Wacht deze tijd (ms) na het laatste scroll-event voordat pagina's worden
|
|
6
7
|
* aangevraagd. Pagina's die de gebruiker snel voorbij scrollt worden zo geskipt. */
|
|
@@ -58,6 +59,8 @@ export class MrdTable {
|
|
|
58
59
|
this.scrollTop = 0;
|
|
59
60
|
/** Full text shown in the TEXTBLOCK expand modal (null = closed). */
|
|
60
61
|
this.textblockModal = null;
|
|
62
|
+
/** Aggregation totals received from the host via setAggregations(). Null = not yet loaded. */
|
|
63
|
+
this.aggregations = null;
|
|
61
64
|
this.handleScroll = (e) => {
|
|
62
65
|
const scroller = e.currentTarget;
|
|
63
66
|
const scrollTop = scroller.scrollTop;
|
|
@@ -108,6 +111,8 @@ export class MrdTable {
|
|
|
108
111
|
const scroller = this.el.querySelector('.mrd-table__scroll');
|
|
109
112
|
if (scroller)
|
|
110
113
|
scroller.scrollTop = 0;
|
|
114
|
+
this.aggregations = null;
|
|
115
|
+
this.emitLoadAggregations();
|
|
111
116
|
}
|
|
112
117
|
/**
|
|
113
118
|
* Inject the rows for a given page (0-based).
|
|
@@ -128,6 +133,10 @@ export class MrdTable {
|
|
|
128
133
|
next.set(pageNumber, rows);
|
|
129
134
|
this.loadedPages = next;
|
|
130
135
|
}
|
|
136
|
+
/** Inject aggregation totals returned by the /aggregations endpoint. */
|
|
137
|
+
async setAggregations(data) {
|
|
138
|
+
this.aggregations = data;
|
|
139
|
+
}
|
|
131
140
|
// ── Lifecycle ──────────────────────────────────────────────────────────────
|
|
132
141
|
disconnectedCallback() {
|
|
133
142
|
if (this.outsideClickHandler) {
|
|
@@ -166,6 +175,49 @@ export class MrdTable {
|
|
|
166
175
|
return 'RELATION';
|
|
167
176
|
return (_b = (_a = col.field) === null || _a === void 0 ? void 0 : _a.dataType) !== null && _b !== void 0 ? _b : 'TEXT';
|
|
168
177
|
}
|
|
178
|
+
// ── Aggregation helpers ────────────────────────────────────────────────────
|
|
179
|
+
buildAggregationParams() {
|
|
180
|
+
var _a;
|
|
181
|
+
const groups = { sum: [], avg: [], count: [] };
|
|
182
|
+
for (const col of this.columns) {
|
|
183
|
+
if (col.type !== 'FIELD' || !((_a = col.field) === null || _a === void 0 ? void 0 : _a.aggregate))
|
|
184
|
+
continue;
|
|
185
|
+
const fn = col.field.aggregate.toLowerCase();
|
|
186
|
+
if (fn in groups)
|
|
187
|
+
groups[fn].push(col.field.name);
|
|
188
|
+
}
|
|
189
|
+
const params = {};
|
|
190
|
+
if (groups.sum.length)
|
|
191
|
+
params.sum = groups.sum;
|
|
192
|
+
if (groups.avg.length)
|
|
193
|
+
params.avg = groups.avg;
|
|
194
|
+
if (groups.count.length)
|
|
195
|
+
params.count = groups.count;
|
|
196
|
+
return Object.keys(params).length > 0 ? params : null;
|
|
197
|
+
}
|
|
198
|
+
emitLoadAggregations() {
|
|
199
|
+
const params = this.buildAggregationParams();
|
|
200
|
+
if (params)
|
|
201
|
+
this.mrdLoadAggregations.emit(params);
|
|
202
|
+
}
|
|
203
|
+
renderAggregationValue(col) {
|
|
204
|
+
var _a, _b;
|
|
205
|
+
if (col.type !== 'FIELD' || !((_a = col.field) === null || _a === void 0 ? void 0 : _a.aggregate) || !this.aggregations)
|
|
206
|
+
return '';
|
|
207
|
+
const fn = col.field.aggregate.toLowerCase();
|
|
208
|
+
const val = (_b = this.aggregations[fn]) === null || _b === void 0 ? void 0 : _b[col.field.name];
|
|
209
|
+
if (val == null)
|
|
210
|
+
return '';
|
|
211
|
+
const dt = col.field.dataType;
|
|
212
|
+
if (dt === 'INTEGER')
|
|
213
|
+
return formatNumber(val, this.locale, { maximumFractionDigits: 0 });
|
|
214
|
+
if (dt === 'PERCENTAGE')
|
|
215
|
+
return formatPercentage(val, this.locale);
|
|
216
|
+
if (dt === 'CURRENCY' && col.field.currencyCode)
|
|
217
|
+
return formatCurrency(val, col.field.currencyCode, this.locale);
|
|
218
|
+
return formatNumber(val, this.locale);
|
|
219
|
+
}
|
|
220
|
+
// ── Reset pagination ───────────────────────────────────────────────────────
|
|
169
221
|
/** Reset pagination state and scroll to top (used after sort or filter change). */
|
|
170
222
|
resetPages() {
|
|
171
223
|
if (this.debounceTimer !== null) {
|
|
@@ -429,6 +481,8 @@ export class MrdTable {
|
|
|
429
481
|
this.activeFilters = next;
|
|
430
482
|
this.closeFilterPopup();
|
|
431
483
|
this.mrdFilter.emit({ filters: Array.from(this.activeFilters.values()) });
|
|
484
|
+
this.aggregations = null;
|
|
485
|
+
this.emitLoadAggregations();
|
|
432
486
|
if (this.totalElements > 0) {
|
|
433
487
|
this.resetPages();
|
|
434
488
|
this.emitPagesForWindow(this.renderStart, this.renderEnd);
|
|
@@ -442,6 +496,8 @@ export class MrdTable {
|
|
|
442
496
|
this.activeFilters = next;
|
|
443
497
|
this.closeFilterPopup();
|
|
444
498
|
this.mrdFilter.emit({ filters: Array.from(this.activeFilters.values()) });
|
|
499
|
+
this.aggregations = null;
|
|
500
|
+
this.emitLoadAggregations();
|
|
445
501
|
if (this.totalElements > 0) {
|
|
446
502
|
this.resetPages();
|
|
447
503
|
this.emitPagesForWindow(this.renderStart, this.renderEnd);
|
|
@@ -450,6 +506,8 @@ export class MrdTable {
|
|
|
450
506
|
clearAllFilters() {
|
|
451
507
|
this.activeFilters = new Map();
|
|
452
508
|
this.mrdFilter.emit({ filters: [] });
|
|
509
|
+
this.aggregations = null;
|
|
510
|
+
this.emitLoadAggregations();
|
|
453
511
|
if (this.totalElements > 0) {
|
|
454
512
|
this.resetPages();
|
|
455
513
|
this.emitPagesForWindow(this.renderStart, this.renderEnd);
|
|
@@ -573,6 +631,19 @@ export class MrdTable {
|
|
|
573
631
|
const value = CellRenderer.render(col, row, this.locale);
|
|
574
632
|
return (h("td", { class: `mrd-table__cell${isNumeric ? ' mrd-table__cell--numeric' : ''}` }, value));
|
|
575
633
|
}
|
|
634
|
+
// ── Render: totals row ────────────────────────────────────────────────────
|
|
635
|
+
renderTotalsRow() {
|
|
636
|
+
if (!this.aggregations)
|
|
637
|
+
return null;
|
|
638
|
+
if (!this.columns.some(c => { var _a; return c.type === 'FIELD' && ((_a = c.field) === null || _a === void 0 ? void 0 : _a.aggregate); }))
|
|
639
|
+
return null;
|
|
640
|
+
return (h("tfoot", null, h("tr", { class: "mrd-table__totals-row" }, this.columns.map(col => {
|
|
641
|
+
var _a, _b;
|
|
642
|
+
const val = this.renderAggregationValue(col);
|
|
643
|
+
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 : '');
|
|
644
|
+
return (h("td", { class: `mrd-table__totals-cell${isNumeric ? ' mrd-table__totals-cell--numeric' : ''}` }, val));
|
|
645
|
+
}))));
|
|
646
|
+
}
|
|
576
647
|
// ── Render ─────────────────────────────────────────────────────────────────
|
|
577
648
|
render() {
|
|
578
649
|
var _a, _b, _c;
|
|
@@ -590,7 +661,7 @@ export class MrdTable {
|
|
|
590
661
|
this.filterMode ? 'mrd-table__header--sortable' : '',
|
|
591
662
|
].filter(Boolean).join(' ');
|
|
592
663
|
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()));
|
|
593
|
-
}))), 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.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()));
|
|
664
|
+
}))), 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()));
|
|
594
665
|
}
|
|
595
666
|
// ── Paginated / virtual-scroll mode ────────────────────────────────────
|
|
596
667
|
// Derive the authoritative row count from loaded pages:
|
|
@@ -633,7 +704,7 @@ export class MrdTable {
|
|
|
633
704
|
isFiltered ? 'mrd-table__header--filtered' : '',
|
|
634
705
|
].filter(Boolean).join(' ');
|
|
635
706
|
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()));
|
|
636
|
-
}))), 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 })))))), 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()));
|
|
707
|
+
}))), 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()));
|
|
637
708
|
}
|
|
638
709
|
renderFilterIcon() {
|
|
639
710
|
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" }))));
|
|
@@ -867,7 +938,8 @@ export class MrdTable {
|
|
|
867
938
|
"pendingFilter": {},
|
|
868
939
|
"popupPos": {},
|
|
869
940
|
"scrollTop": {},
|
|
870
|
-
"textblockModal": {}
|
|
941
|
+
"textblockModal": {},
|
|
942
|
+
"aggregations": {}
|
|
871
943
|
};
|
|
872
944
|
}
|
|
873
945
|
static get events() {
|
|
@@ -958,6 +1030,21 @@ export class MrdTable {
|
|
|
958
1030
|
"resolved": "{ href: string; fileName: string; }",
|
|
959
1031
|
"references": {}
|
|
960
1032
|
}
|
|
1033
|
+
}, {
|
|
1034
|
+
"method": "mrdLoadAggregations",
|
|
1035
|
+
"name": "mrdLoadAggregations",
|
|
1036
|
+
"bubbles": true,
|
|
1037
|
+
"cancelable": true,
|
|
1038
|
+
"composed": true,
|
|
1039
|
+
"docs": {
|
|
1040
|
+
"tags": [],
|
|
1041
|
+
"text": "Fired when aggregation totals need to be (re-)fetched.\nDetail contains the fields grouped by aggregate function.\nHost calls the /aggregations endpoint and passes the result to setAggregations()."
|
|
1042
|
+
},
|
|
1043
|
+
"complexType": {
|
|
1044
|
+
"original": "{ sum?: string[]; avg?: string[]; count?: string[] }",
|
|
1045
|
+
"resolved": "{ sum?: string[] | undefined; avg?: string[] | undefined; count?: string[] | undefined; }",
|
|
1046
|
+
"references": {}
|
|
1047
|
+
}
|
|
961
1048
|
}];
|
|
962
1049
|
}
|
|
963
1050
|
static get methods() {
|
|
@@ -1011,6 +1098,33 @@ export class MrdTable {
|
|
|
1011
1098
|
"text": "Inject the rows for a given page (0-based).\nCreates a new Map reference so Stencil detects the state change.\n\nWhen the page contains fewer rows than pageSize it is the last page.\nrenderEnd is clamped immediately so no loading-placeholder rows appear\nbeyond the actual data \u2014 without requiring the host to update totalElements.",
|
|
1012
1099
|
"tags": []
|
|
1013
1100
|
}
|
|
1101
|
+
},
|
|
1102
|
+
"setAggregations": {
|
|
1103
|
+
"complexType": {
|
|
1104
|
+
"signature": "(data: AggregationResult) => Promise<void>",
|
|
1105
|
+
"parameters": [{
|
|
1106
|
+
"name": "data",
|
|
1107
|
+
"type": "AggregationResult",
|
|
1108
|
+
"docs": ""
|
|
1109
|
+
}],
|
|
1110
|
+
"references": {
|
|
1111
|
+
"Promise": {
|
|
1112
|
+
"location": "global",
|
|
1113
|
+
"id": "global::Promise"
|
|
1114
|
+
},
|
|
1115
|
+
"AggregationResult": {
|
|
1116
|
+
"location": "import",
|
|
1117
|
+
"path": "../../types/client-layout",
|
|
1118
|
+
"id": "src/types/client-layout.ts::AggregationResult",
|
|
1119
|
+
"referenceLocation": "AggregationResult"
|
|
1120
|
+
}
|
|
1121
|
+
},
|
|
1122
|
+
"return": "Promise<void>"
|
|
1123
|
+
},
|
|
1124
|
+
"docs": {
|
|
1125
|
+
"text": "Inject aggregation totals returned by the /aggregations endpoint.",
|
|
1126
|
+
"tags": []
|
|
1127
|
+
}
|
|
1014
1128
|
}
|
|
1015
1129
|
};
|
|
1016
1130
|
}
|
|
@@ -527,6 +527,27 @@
|
|
|
527
527
|
border-color: var(--mrd-color-primary-dark, var(--mrd-color-primary));
|
|
528
528
|
}
|
|
529
529
|
|
|
530
|
+
/* ── Totals row ─────────────────────────────────────────────────────────── */
|
|
531
|
+
.mrd-table__totals-row {
|
|
532
|
+
border-top: 2px solid var(--mrd-border-color);
|
|
533
|
+
}
|
|
534
|
+
|
|
535
|
+
.mrd-table__totals-cell {
|
|
536
|
+
position: sticky;
|
|
537
|
+
bottom: 0;
|
|
538
|
+
z-index: 2;
|
|
539
|
+
padding: var(--mrd-space-2) var(--mrd-space-4);
|
|
540
|
+
background: var(--mrd-color-white);
|
|
541
|
+
font-weight: var(--mrd-font-weight-medium);
|
|
542
|
+
font-variant-numeric: tabular-nums;
|
|
543
|
+
white-space: nowrap;
|
|
544
|
+
border-top: 2px solid var(--mrd-border-color);
|
|
545
|
+
}
|
|
546
|
+
|
|
547
|
+
.mrd-table__totals-cell--numeric {
|
|
548
|
+
text-align: right;
|
|
549
|
+
}
|
|
550
|
+
|
|
530
551
|
/* ── Pagination footer ─────────────────────────────────────────────────── */
|
|
531
552
|
.mrd-table__footer {
|
|
532
553
|
padding: var(--mrd-space-1) var(--mrd-space-2);
|
|
@@ -252,6 +252,31 @@ function renderTable(columns, totalElements, pageSize, page0Rows, dataHref, defa
|
|
|
252
252
|
_activeFilters = e.detail.filters;
|
|
253
253
|
});
|
|
254
254
|
|
|
255
|
+
// Fetch aggregation totals from /aggregations endpoint with same filter params
|
|
256
|
+
table.addEventListener('mrdLoadAggregations', async (e) => {
|
|
257
|
+
const { sum, avg, count } = e.detail;
|
|
258
|
+
try {
|
|
259
|
+
const aggUrl = dataHref.split('?')[0] + '/aggregations';
|
|
260
|
+
const params = new URLSearchParams();
|
|
261
|
+
if (sum?.length) params.set('sum', sum.join(','));
|
|
262
|
+
if (avg?.length) params.set('avg', avg.join(','));
|
|
263
|
+
if (count?.length) params.set('count', count.join(','));
|
|
264
|
+
_activeFilters.forEach(f => {
|
|
265
|
+
if (f.operator === 'isEmpty') { params.set(f.field, ''); return; }
|
|
266
|
+
if (f.operator === 'isNotEmpty') { params.set(f.field + '_notempty', 'true'); return; }
|
|
267
|
+
if (f.values?.length) { params.set(f.field, f.values.join(',')); return; }
|
|
268
|
+
if (f.value != null && f.value !== '') params.set(f.field, String(f.value));
|
|
269
|
+
if (f.from != null && f.from !== '') params.set(f.field + '_from', String(f.from));
|
|
270
|
+
if (f.to != null && f.to !== '') params.set(f.field + '_to', String(f.to));
|
|
271
|
+
});
|
|
272
|
+
const qs = params.toString();
|
|
273
|
+
const result = await apiRequest('GET', qs ? `${aggUrl}?${qs}` : aggUrl, authGetToken());
|
|
274
|
+
if (result.ok) await table.setAggregations(result.body);
|
|
275
|
+
} catch (err) {
|
|
276
|
+
console.error('[mrdLoadAggregations] mislukt', err);
|
|
277
|
+
}
|
|
278
|
+
});
|
|
279
|
+
|
|
255
280
|
await table.init();
|
|
256
281
|
await table.setPage(0, page0Rows); // inject pre-fetched page 0 — no extra request
|
|
257
282
|
});
|