@ornery/ui-grid-vanilla 1.0.4 → 1.0.6
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/demo/main.ts +1 -2
- package/dist/index.d.mts +40 -2
- package/dist/index.d.ts +40 -2
- package/dist/index.js +263 -100
- package/dist/index.mjs +263 -102
- package/package.json +6 -5
- package/src/cell-state-management.test.ts +419 -0
- package/src/events.ts +77 -26
- package/src/framework-slots.ts +18 -0
- package/src/grid-controller.ts +142 -98
- package/src/index.integration.test.ts +27 -10
- package/src/index.test.ts +0 -4
- package/src/index.ts +6 -9
- package/src/keyboard-navigation.test.ts +1 -7
- package/src/patch.ts +118 -1
- package/src/row-edit.test.ts +1 -1
- package/src/ui-grid-standalone.element.ts +79 -1
- package/vitest.config.ts +30 -0
package/dist/index.js
CHANGED
|
@@ -29,7 +29,6 @@ __export(index_exports, {
|
|
|
29
29
|
registerVanillaUiGridRustModule: () => registerVanillaUiGridRustModule
|
|
30
30
|
});
|
|
31
31
|
module.exports = __toCommonJS(index_exports);
|
|
32
|
-
var import_ui_grid_core7 = require("@ornery/ui-grid-core");
|
|
33
32
|
|
|
34
33
|
// src/ui-grid-standalone.element.ts
|
|
35
34
|
var import_ui_grid_core6 = require("@ornery/ui-grid-core");
|
|
@@ -154,6 +153,23 @@ var FrameworkSlotBridge = class {
|
|
|
154
153
|
}
|
|
155
154
|
});
|
|
156
155
|
}
|
|
156
|
+
/**
|
|
157
|
+
* Carry forward every previously-known cell slot for `rowId` into the
|
|
158
|
+
* current pending set. Used by the structural patch path when a row's
|
|
159
|
+
* fingerprint matches the previous render's: `stageCell` would normally
|
|
160
|
+
* re-record the slot during cell rendering, but the fingerprint
|
|
161
|
+
* short-circuit skips the render pass for unchanged rows. Without this,
|
|
162
|
+
* `flush()` would diff pending (missing the row's slots) against last
|
|
163
|
+
* (containing them) and emit a spurious `removed` for every cell of the
|
|
164
|
+
* unchanged row, destroying the framework wrappers' projected content.
|
|
165
|
+
*/
|
|
166
|
+
carryRowCells(rowId) {
|
|
167
|
+
for (const [slotName, slot] of this.lastCellSlots) {
|
|
168
|
+
if (slot.rowId === rowId) {
|
|
169
|
+
this.pendingCellSlots.set(slotName, slot);
|
|
170
|
+
}
|
|
171
|
+
}
|
|
172
|
+
}
|
|
157
173
|
stageExpandableRow(row, rowIndex) {
|
|
158
174
|
const slotName = expandableRowSlotName(row);
|
|
159
175
|
this.pendingExpandableRowSlots.set(slotName, {
|
|
@@ -1126,6 +1142,17 @@ function patchBodyRegion(el, root, snapshot, options, labels, templateColumns, v
|
|
|
1126
1142
|
bodyContainer.innerHTML = bodyContent;
|
|
1127
1143
|
}
|
|
1128
1144
|
el.lastItemsFingerprint = itemsFingerprint;
|
|
1145
|
+
el.lastRowStateFingerprints.clear();
|
|
1146
|
+
for (let i = 0; i < itemsToRender.length; i++) {
|
|
1147
|
+
const item = itemsToRender[i];
|
|
1148
|
+
if (!isRowItem(item)) continue;
|
|
1149
|
+
el.lastRowStateFingerprints.set(item.row.id, {
|
|
1150
|
+
fingerprint: buildRowFingerprint(item.row, startIndex + i, snapshot.visibleColumns),
|
|
1151
|
+
entity: item.row.entity
|
|
1152
|
+
});
|
|
1153
|
+
}
|
|
1154
|
+
el.lastEditingCellKey = el.controller?.getEditingCellKey() ?? null;
|
|
1155
|
+
el.lastFocusedCellKey = el.focusedCell ? `${el.focusedCell.rowId} ${el.focusedCell.columnName}` : null;
|
|
1129
1156
|
}
|
|
1130
1157
|
function fingerprintItems(items) {
|
|
1131
1158
|
const parts = [];
|
|
@@ -1144,7 +1171,6 @@ function fingerprintItems(items) {
|
|
|
1144
1171
|
}
|
|
1145
1172
|
function patchExistingRows(el, bodyContainer, snapshot, itemsToRender, startIndex) {
|
|
1146
1173
|
const controller = el.controller;
|
|
1147
|
-
void controller;
|
|
1148
1174
|
const columns = snapshot.visibleColumns;
|
|
1149
1175
|
const groupEls = /* @__PURE__ */ new Map();
|
|
1150
1176
|
const cellEls = /* @__PURE__ */ new Map();
|
|
@@ -1174,6 +1200,11 @@ function patchExistingRows(el, bodyContainer, snapshot, itemsToRender, startInde
|
|
|
1174
1200
|
for (const col of columns) {
|
|
1175
1201
|
templateMarkupMap.set(col.name, getTemplateMarkup2(el, `cell-${col.name}`));
|
|
1176
1202
|
}
|
|
1203
|
+
const visitedRowIds = /* @__PURE__ */ new Set();
|
|
1204
|
+
const editingCellKey = controller.getEditingCellKey();
|
|
1205
|
+
const focusedCellKey = el.focusedCell ? `${el.focusedCell.rowId} ${el.focusedCell.columnName}` : null;
|
|
1206
|
+
const editingMoved = editingCellKey !== el.lastEditingCellKey;
|
|
1207
|
+
const focusedMoved = focusedCellKey !== el.lastFocusedCellKey;
|
|
1177
1208
|
let expandableIndex = 0;
|
|
1178
1209
|
for (let i = 0; i < itemsToRender.length; i++) {
|
|
1179
1210
|
const item = itemsToRender[i];
|
|
@@ -1199,14 +1230,48 @@ function patchExistingRows(el, bodyContainer, snapshot, itemsToRender, startInde
|
|
|
1199
1230
|
}
|
|
1200
1231
|
if (!isRowItem(item)) continue;
|
|
1201
1232
|
const row = item.row;
|
|
1233
|
+
visitedRowIds.add(row.id);
|
|
1202
1234
|
const rowCells = cellEls.get(row.id);
|
|
1203
1235
|
if (!rowCells) continue;
|
|
1236
|
+
const rowFingerprint = buildRowFingerprint(row, displayIndex, columns);
|
|
1237
|
+
const lastEntry = el.lastRowStateFingerprints.get(row.id);
|
|
1238
|
+
const editingTouchesRow = editingCellKey !== null && editingCellKey.startsWith(`${row.id} `) || el.lastEditingCellKey !== null && el.lastEditingCellKey.startsWith(`${row.id} `);
|
|
1239
|
+
const focusedTouchesRow = focusedCellKey !== null && focusedCellKey.startsWith(`${row.id} `) || el.lastFocusedCellKey !== null && el.lastFocusedCellKey.startsWith(`${row.id} `);
|
|
1240
|
+
const canSkip = lastEntry !== void 0 && lastEntry.fingerprint === rowFingerprint && lastEntry.entity === row.entity && !(editingMoved && editingTouchesRow) && !(focusedMoved && focusedTouchesRow);
|
|
1241
|
+
if (canSkip) {
|
|
1242
|
+
el.frameworkSlots.carryRowCells(row.id);
|
|
1243
|
+
continue;
|
|
1244
|
+
}
|
|
1245
|
+
el.lastRowStateFingerprints.set(row.id, { fingerprint: rowFingerprint, entity: row.entity });
|
|
1204
1246
|
for (const column of columns) {
|
|
1205
1247
|
const target = rowCells.get(column.name);
|
|
1206
1248
|
if (!target) continue;
|
|
1207
1249
|
patchBodyCell(el, target, row, column, displayIndex, templateMarkupMap);
|
|
1208
1250
|
}
|
|
1209
1251
|
}
|
|
1252
|
+
if (el.lastRowStateFingerprints.size > visitedRowIds.size) {
|
|
1253
|
+
for (const id of el.lastRowStateFingerprints.keys()) {
|
|
1254
|
+
if (!visitedRowIds.has(id)) el.lastRowStateFingerprints.delete(id);
|
|
1255
|
+
}
|
|
1256
|
+
}
|
|
1257
|
+
el.lastEditingCellKey = editingCellKey;
|
|
1258
|
+
el.lastFocusedCellKey = focusedCellKey;
|
|
1259
|
+
}
|
|
1260
|
+
function buildRowFingerprint(row, displayIndex, visibleColumns) {
|
|
1261
|
+
let flags = 0;
|
|
1262
|
+
if (row.isSelected) flags |= 1;
|
|
1263
|
+
if (row.isFocused) flags |= 2;
|
|
1264
|
+
if (row.expanded) flags |= 4;
|
|
1265
|
+
if (row.isDirty) flags |= 8;
|
|
1266
|
+
if (row.isSaving) flags |= 16;
|
|
1267
|
+
if (row.isError) flags |= 32;
|
|
1268
|
+
if (row.visible) flags |= 64;
|
|
1269
|
+
let invalidBits = "";
|
|
1270
|
+
const entity = row.entity;
|
|
1271
|
+
for (const col of visibleColumns) {
|
|
1272
|
+
invalidBits += entity[`$$invalid${col.name}`] ? "1" : "0";
|
|
1273
|
+
}
|
|
1274
|
+
return `${displayIndex}|${flags}|${row.treeLevel}|${row.height}|${row.expandedRowHeight}|${invalidBits}`;
|
|
1210
1275
|
}
|
|
1211
1276
|
function patchGroupRow(el, target, group) {
|
|
1212
1277
|
const snapshot = el.snapshot;
|
|
@@ -1537,9 +1602,21 @@ function measureAutoColumnWidth(el, columnName) {
|
|
|
1537
1602
|
|
|
1538
1603
|
// src/events.ts
|
|
1539
1604
|
var import_ui_grid_core4 = require("@ornery/ui-grid-core");
|
|
1605
|
+
function bodyCellFromEvent(event) {
|
|
1606
|
+
const path = event.composedPath();
|
|
1607
|
+
for (const node of path) {
|
|
1608
|
+
if (node instanceof HTMLElement && node.classList.contains("body-cell")) {
|
|
1609
|
+
if (node.dataset["row"] && node.dataset["column"]) return node;
|
|
1610
|
+
}
|
|
1611
|
+
}
|
|
1612
|
+
return null;
|
|
1613
|
+
}
|
|
1540
1614
|
function observeTemplateSlots(el) {
|
|
1541
1615
|
if (el.templateObserver) return;
|
|
1542
|
-
el.templateObserver = new MutationObserver(() => {
|
|
1616
|
+
el.templateObserver = new MutationObserver((mutations) => {
|
|
1617
|
+
const involvesTemplate = mutationsTouchTemplateSlot(mutations);
|
|
1618
|
+
if (!involvesTemplate) return;
|
|
1619
|
+
el.lastRowStateFingerprints.clear();
|
|
1543
1620
|
if (el.activeOptions) {
|
|
1544
1621
|
el.ensureController(el.buildEffectiveOptions(el.activeOptions));
|
|
1545
1622
|
} else {
|
|
@@ -1553,6 +1630,22 @@ function observeTemplateSlots(el) {
|
|
|
1553
1630
|
attributeFilter: ["slot"]
|
|
1554
1631
|
});
|
|
1555
1632
|
}
|
|
1633
|
+
function mutationsTouchTemplateSlot(mutations) {
|
|
1634
|
+
for (const m of mutations) {
|
|
1635
|
+
if (m.type === "attributes" && m.target instanceof HTMLTemplateElement) {
|
|
1636
|
+
return true;
|
|
1637
|
+
}
|
|
1638
|
+
if (m.type === "childList") {
|
|
1639
|
+
for (const node of m.addedNodes) {
|
|
1640
|
+
if (node instanceof HTMLTemplateElement && node.hasAttribute("slot")) return true;
|
|
1641
|
+
}
|
|
1642
|
+
for (const node of m.removedNodes) {
|
|
1643
|
+
if (node instanceof HTMLTemplateElement && node.hasAttribute("slot")) return true;
|
|
1644
|
+
}
|
|
1645
|
+
}
|
|
1646
|
+
}
|
|
1647
|
+
return false;
|
|
1648
|
+
}
|
|
1556
1649
|
function syncHeaderHorizontalScroll(el, scrollLeft) {
|
|
1557
1650
|
const root = el.shadowRoot;
|
|
1558
1651
|
if (!root) return;
|
|
@@ -1583,7 +1676,7 @@ function bindEvents(el) {
|
|
|
1583
1676
|
root.addEventListener("click", (event) => {
|
|
1584
1677
|
const realTarget = event.composedPath()[0] ?? event.target;
|
|
1585
1678
|
if (!realTarget || !el.controller || !el.snapshot) return;
|
|
1586
|
-
const clickedCell =
|
|
1679
|
+
const clickedCell = bodyCellFromEvent(event);
|
|
1587
1680
|
if (clickedCell && !realTarget.closest('[data-role="editor"]')) {
|
|
1588
1681
|
const rowId = clickedCell.dataset["row"];
|
|
1589
1682
|
const columnName = clickedCell.dataset["column"];
|
|
@@ -1604,11 +1697,8 @@ function bindEvents(el) {
|
|
|
1604
1697
|
handleRowSelectionClick(el, rowId, columnName, event);
|
|
1605
1698
|
}
|
|
1606
1699
|
}
|
|
1607
|
-
|
|
1608
|
-
|
|
1609
|
-
);
|
|
1610
|
-
if (checkboxNode) {
|
|
1611
|
-
const rowId = checkboxNode.dataset["row"];
|
|
1700
|
+
if (clickedCell?.dataset["column"] === "selectionRowHeaderCol") {
|
|
1701
|
+
const rowId = clickedCell.dataset["row"];
|
|
1612
1702
|
if (rowId) {
|
|
1613
1703
|
event.stopPropagation();
|
|
1614
1704
|
handleRowHeaderCheckboxClick(el, rowId, event);
|
|
@@ -1700,9 +1790,10 @@ function bindEvents(el) {
|
|
|
1700
1790
|
return;
|
|
1701
1791
|
}
|
|
1702
1792
|
if (action === "benchmark") {
|
|
1703
|
-
|
|
1704
|
-
|
|
1705
|
-
|
|
1793
|
+
void el.controller.gridApi.core.benchmark().then((result) => {
|
|
1794
|
+
el.benchmarkAverage = result.averageMs.toFixed(2);
|
|
1795
|
+
el.render();
|
|
1796
|
+
});
|
|
1706
1797
|
return;
|
|
1707
1798
|
}
|
|
1708
1799
|
if (action === "export-csv") {
|
|
@@ -1710,13 +1801,16 @@ function bindEvents(el) {
|
|
|
1710
1801
|
}
|
|
1711
1802
|
});
|
|
1712
1803
|
root.addEventListener("focusin", (event) => {
|
|
1713
|
-
const
|
|
1714
|
-
if (!target) return;
|
|
1715
|
-
const cell = target.closest(".body-cell[data-row][data-column]");
|
|
1804
|
+
const cell = bodyCellFromEvent(event);
|
|
1716
1805
|
const rowId = cell?.dataset["row"];
|
|
1717
1806
|
const columnName = cell?.dataset["column"];
|
|
1718
1807
|
if (rowId && columnName) {
|
|
1719
|
-
el.focusedCell
|
|
1808
|
+
const previous = el.focusedCell;
|
|
1809
|
+
const next = { rowId, columnName };
|
|
1810
|
+
if (!previous || previous.rowId !== rowId || previous.columnName !== columnName) {
|
|
1811
|
+
el.focusedCell = next;
|
|
1812
|
+
applyFocusedCellClass(el, previous, next);
|
|
1813
|
+
}
|
|
1720
1814
|
}
|
|
1721
1815
|
});
|
|
1722
1816
|
root.addEventListener("focusout", (event) => {
|
|
@@ -1750,7 +1844,7 @@ function bindEvents(el) {
|
|
|
1750
1844
|
if (realTarget.closest(".filter-cell")) return;
|
|
1751
1845
|
const resolved = el.controller.getResolvedSelectionOptions();
|
|
1752
1846
|
if (!resolved.enableRowSelection || !resolved.multiSelect) return;
|
|
1753
|
-
const startCell =
|
|
1847
|
+
const startCell = bodyCellFromEvent(event);
|
|
1754
1848
|
if (!startCell) return;
|
|
1755
1849
|
const startRowId = startCell.dataset["row"];
|
|
1756
1850
|
if (!startRowId) return;
|
|
@@ -1772,9 +1866,7 @@ function bindEvents(el) {
|
|
|
1772
1866
|
else el.controller.unSelectRow(row.entity, event);
|
|
1773
1867
|
};
|
|
1774
1868
|
const handleMove = (moveEvent) => {
|
|
1775
|
-
const
|
|
1776
|
-
const firstEl = path[0];
|
|
1777
|
-
const cell = firstEl?.closest?.(".body-cell[data-row][data-column]");
|
|
1869
|
+
const cell = bodyCellFromEvent(moveEvent);
|
|
1778
1870
|
if (!cell) return;
|
|
1779
1871
|
const rowId = cell.dataset["row"];
|
|
1780
1872
|
if (!rowId) return;
|
|
@@ -1843,7 +1935,7 @@ function bindEvents(el) {
|
|
|
1843
1935
|
return;
|
|
1844
1936
|
}
|
|
1845
1937
|
}
|
|
1846
|
-
const cell =
|
|
1938
|
+
const cell = bodyCellFromEvent(event);
|
|
1847
1939
|
if (!cell) return;
|
|
1848
1940
|
const rowId = cell.dataset["row"];
|
|
1849
1941
|
const columnName = cell.dataset["column"];
|
|
@@ -1855,8 +1947,9 @@ function bindEvents(el) {
|
|
|
1855
1947
|
const keyboardEvent = event;
|
|
1856
1948
|
const target = event.target;
|
|
1857
1949
|
if (!target || !el.controller) return;
|
|
1950
|
+
const onBodyCell = bodyCellFromEvent(event);
|
|
1858
1951
|
const overrides = el.controller.getOptions().keyDownOverrides ?? [];
|
|
1859
|
-
if (overrides.length &&
|
|
1952
|
+
if (overrides.length && onBodyCell) {
|
|
1860
1953
|
for (const override of overrides) {
|
|
1861
1954
|
if (matchesKeyOverride(override, keyboardEvent)) {
|
|
1862
1955
|
el.controller.raiseCellNavKeyEvent("keydown", keyboardEvent);
|
|
@@ -1864,7 +1957,7 @@ function bindEvents(el) {
|
|
|
1864
1957
|
}
|
|
1865
1958
|
}
|
|
1866
1959
|
}
|
|
1867
|
-
if ((keyboardEvent.ctrlKey || keyboardEvent.metaKey) && (keyboardEvent.key === "a" || keyboardEvent.key === "A") &&
|
|
1960
|
+
if ((keyboardEvent.ctrlKey || keyboardEvent.metaKey) && (keyboardEvent.key === "a" || keyboardEvent.key === "A") && onBodyCell) {
|
|
1868
1961
|
const resolved = el.controller.getResolvedSelectionOptions();
|
|
1869
1962
|
if (resolved.enableRowSelection && resolved.multiSelect) {
|
|
1870
1963
|
event.preventDefault();
|
|
@@ -1873,10 +1966,10 @@ function bindEvents(el) {
|
|
|
1873
1966
|
}
|
|
1874
1967
|
}
|
|
1875
1968
|
if (keyboardEvent.key === " " || keyboardEvent.key === "Spacebar") {
|
|
1876
|
-
const
|
|
1877
|
-
const rowId2 =
|
|
1878
|
-
const columnName2 =
|
|
1879
|
-
if (
|
|
1969
|
+
const cell = onBodyCell;
|
|
1970
|
+
const rowId2 = cell?.dataset["row"];
|
|
1971
|
+
const columnName2 = cell?.dataset["column"];
|
|
1972
|
+
if (cell && rowId2 && columnName2) {
|
|
1880
1973
|
const resolved = el.controller.getResolvedSelectionOptions();
|
|
1881
1974
|
if (resolved.enableRowSelection) {
|
|
1882
1975
|
const onCheckboxCol = columnName2 === "selectionRowHeaderCol";
|
|
@@ -1929,10 +2022,9 @@ function bindEvents(el) {
|
|
|
1929
2022
|
}
|
|
1930
2023
|
let rowId;
|
|
1931
2024
|
let columnName;
|
|
1932
|
-
|
|
1933
|
-
|
|
1934
|
-
|
|
1935
|
-
columnName = cell.dataset["column"];
|
|
2025
|
+
if (onBodyCell) {
|
|
2026
|
+
rowId = onBodyCell.dataset["row"];
|
|
2027
|
+
columnName = onBodyCell.dataset["column"];
|
|
1936
2028
|
} else if (el.focusedCell) {
|
|
1937
2029
|
rowId = el.focusedCell.rowId;
|
|
1938
2030
|
columnName = el.focusedCell.columnName;
|
|
@@ -2289,7 +2381,9 @@ var VanillaGridController = class {
|
|
|
2289
2381
|
this.groupByColumns = options.grouping?.groupBy ? [...options.grouping.groupBy] : [];
|
|
2290
2382
|
this.lastOptionsGroupBy = options.grouping?.groupBy ? [...options.grouping.groupBy] : void 0;
|
|
2291
2383
|
this.pinnedColumns = (0, import_ui_grid_core5.buildInitialPinnedState)(options.columnDefs);
|
|
2292
|
-
const declaresPin = options.columnDefs.some(
|
|
2384
|
+
const declaresPin = options.columnDefs.some(
|
|
2385
|
+
(col) => col.pinnedLeft === true || col.pinnedRight === true
|
|
2386
|
+
);
|
|
2293
2387
|
this.lastOptionsPinnedState = declaresPin ? { ...this.pinnedColumns } : void 0;
|
|
2294
2388
|
this.lastOptionsInfiniteScrollUp = options.infiniteScrollUp;
|
|
2295
2389
|
this.lastOptionsInfiniteScrollDown = options.infiniteScrollDown;
|
|
@@ -2331,7 +2425,10 @@ var VanillaGridController = class {
|
|
|
2331
2425
|
excelExport: (rowType, colType) => this.exportExcel(rowType, colType),
|
|
2332
2426
|
buildExcelSheetData: (rowType, colType) => this.buildExcelSheetData(rowType, colType),
|
|
2333
2427
|
getExporterMenuItems: () => this.buildExporterMenuItems(),
|
|
2334
|
-
getExporterOptions: () => ({
|
|
2428
|
+
getExporterOptions: () => ({
|
|
2429
|
+
...this.exporterOverrides,
|
|
2430
|
+
...(0, import_ui_grid_core5.resolveGridExporterOptions)(this.options)
|
|
2431
|
+
}),
|
|
2335
2432
|
setExporterOptions: (overrides) => {
|
|
2336
2433
|
this.exporterOverrides = { ...this.exporterOverrides, ...overrides };
|
|
2337
2434
|
},
|
|
@@ -3191,10 +3288,7 @@ var VanillaGridController = class {
|
|
|
3191
3288
|
return Promise.resolve();
|
|
3192
3289
|
}
|
|
3193
3290
|
infiniteScrollResetScroll(scrollUp, scrollDown) {
|
|
3194
|
-
this.infiniteScrollState = (0, import_ui_grid_core5.resetInfiniteScrollState)(
|
|
3195
|
-
scrollUp ?? false,
|
|
3196
|
-
scrollDown ?? true
|
|
3197
|
-
);
|
|
3291
|
+
this.infiniteScrollState = (0, import_ui_grid_core5.resetInfiniteScrollState)(scrollUp ?? false, scrollDown ?? true);
|
|
3198
3292
|
this.infiniteScrollScrollToTopRequest?.();
|
|
3199
3293
|
}
|
|
3200
3294
|
infiniteScrollSavePercentage() {
|
|
@@ -3232,6 +3326,13 @@ var VanillaGridController = class {
|
|
|
3232
3326
|
setInfiniteScrollResetHandler(handler) {
|
|
3233
3327
|
this.infiniteScrollScrollToTopRequest = handler;
|
|
3234
3328
|
}
|
|
3329
|
+
/** Element-owned render benchmark. When present, `core.benchmark()`
|
|
3330
|
+
* measures the actual render path instead of the controller-only
|
|
3331
|
+
* pipeline builder. */
|
|
3332
|
+
benchmarkRequest = null;
|
|
3333
|
+
setBenchmarkHandler(handler) {
|
|
3334
|
+
this.benchmarkRequest = handler;
|
|
3335
|
+
}
|
|
3235
3336
|
getInfiniteScrollState() {
|
|
3236
3337
|
return this.infiniteScrollState;
|
|
3237
3338
|
}
|
|
@@ -3240,7 +3341,8 @@ var VanillaGridController = class {
|
|
|
3240
3341
|
return this.options.enableColumnResizing !== false;
|
|
3241
3342
|
}
|
|
3242
3343
|
setViewportWidth(width) {
|
|
3243
|
-
|
|
3344
|
+
const adjusted = Math.max(0, Math.floor(width) - 2);
|
|
3345
|
+
this.viewportWidth = adjusted;
|
|
3244
3346
|
}
|
|
3245
3347
|
getViewportWidth() {
|
|
3246
3348
|
return this.viewportWidth;
|
|
@@ -3255,9 +3357,7 @@ var VanillaGridController = class {
|
|
|
3255
3357
|
buildTemplateColumnsWithOverride(columnName, widthPx) {
|
|
3256
3358
|
const widthStr = `${Math.max(88, Math.round(widthPx))}px`;
|
|
3257
3359
|
return buildGridTemplateColumns(
|
|
3258
|
-
this.visibleColumns.map(
|
|
3259
|
-
(c) => c.name === columnName ? { ...c, width: widthStr } : c
|
|
3260
|
-
),
|
|
3360
|
+
this.visibleColumns.map((c) => c.name === columnName ? { ...c, width: widthStr } : c),
|
|
3261
3361
|
this.viewportWidth
|
|
3262
3362
|
);
|
|
3263
3363
|
}
|
|
@@ -3369,6 +3469,12 @@ var VanillaGridController = class {
|
|
|
3369
3469
|
isEditingCell(rowId, columnName) {
|
|
3370
3470
|
return this.editingCell?.rowId === rowId && this.editingCell?.columnName === columnName;
|
|
3371
3471
|
}
|
|
3472
|
+
/** Compact key for the editing cell, or null when no edit is in flight.
|
|
3473
|
+
* Used by the patch path to detect when the editing position moves so it
|
|
3474
|
+
* can force the affected cells through the slow rebuild path. */
|
|
3475
|
+
getEditingCellKey() {
|
|
3476
|
+
return this.editingCell ? `${this.editingCell.rowId} ${this.editingCell.columnName}` : null;
|
|
3477
|
+
}
|
|
3372
3478
|
/**
|
|
3373
3479
|
* Serialise the current grid state. Mirrors `ui.grid.saveState.save`:
|
|
3374
3480
|
* every field is gated by an `options.save*` flag with the old grid's
|
|
@@ -3436,7 +3542,8 @@ var VanillaGridController = class {
|
|
|
3436
3542
|
if (state.collapsedGroups !== void 0) this.collapsedGroups = { ...state.collapsedGroups };
|
|
3437
3543
|
if (state.pinnedColumns !== void 0) this.pinnedColumns = { ...state.pinnedColumns };
|
|
3438
3544
|
if (state.columnOrder !== void 0) this.columnOrder = [...state.columnOrder];
|
|
3439
|
-
if (state.columnWidthOverrides !== void 0)
|
|
3545
|
+
if (state.columnWidthOverrides !== void 0)
|
|
3546
|
+
this.columnWidthOverrides = { ...state.columnWidthOverrides };
|
|
3440
3547
|
if (state.currentPage !== void 0) this.currentPage = state.currentPage;
|
|
3441
3548
|
if (state.pageSize !== void 0) this.pageSize = state.pageSize;
|
|
3442
3549
|
if (state.expandedRows !== void 0) this.expandedRows = { ...state.expandedRows };
|
|
@@ -3624,35 +3731,40 @@ var VanillaGridController = class {
|
|
|
3624
3731
|
this.hiddenRowReasons = next;
|
|
3625
3732
|
this.refresh();
|
|
3626
3733
|
}
|
|
3627
|
-
benchmark(iterations) {
|
|
3734
|
+
async benchmark(iterations) {
|
|
3628
3735
|
const now = () => typeof performance === "undefined" ? Date.now() : performance.now();
|
|
3629
|
-
|
|
3630
|
-
|
|
3631
|
-
|
|
3632
|
-
|
|
3633
|
-
|
|
3634
|
-
|
|
3635
|
-
|
|
3636
|
-
|
|
3637
|
-
|
|
3638
|
-
|
|
3639
|
-
|
|
3640
|
-
|
|
3641
|
-
|
|
3642
|
-
|
|
3643
|
-
|
|
3644
|
-
|
|
3645
|
-
|
|
3646
|
-
|
|
3736
|
+
let result;
|
|
3737
|
+
if (this.benchmarkRequest) {
|
|
3738
|
+
result = await this.benchmarkRequest(iterations);
|
|
3739
|
+
} else {
|
|
3740
|
+
const loops = Math.max(1, iterations ?? this.options.benchmark?.iterations ?? 25);
|
|
3741
|
+
const started = now();
|
|
3742
|
+
let lastResult = this.pipeline;
|
|
3743
|
+
for (let index = 0; index < loops; index += 1) {
|
|
3744
|
+
lastResult = import_ui_grid_core5.defaultGridEngine.buildPipeline({
|
|
3745
|
+
options: this.options,
|
|
3746
|
+
columns: this.visibleColumns,
|
|
3747
|
+
activeFilters: this.activeFilters,
|
|
3748
|
+
sortState: this.sortState,
|
|
3749
|
+
groupByColumns: this.groupByColumns,
|
|
3750
|
+
collapsedGroups: this.collapsedGroups,
|
|
3751
|
+
hiddenRowReasons: this.hiddenRowReasons,
|
|
3752
|
+
expandedRows: this.expandedRows,
|
|
3753
|
+
expandedTreeRows: this.expandedTreeRows,
|
|
3754
|
+
currentPage: this.currentPage,
|
|
3755
|
+
pageSize: this.pageSize,
|
|
3756
|
+
rowSize: this.getRowSize()
|
|
3757
|
+
});
|
|
3758
|
+
}
|
|
3759
|
+
const elapsedMs = now() - started;
|
|
3760
|
+
result = {
|
|
3761
|
+
iterations: loops,
|
|
3762
|
+
totalMs: elapsedMs,
|
|
3763
|
+
averageMs: elapsedMs / loops,
|
|
3764
|
+
visibleRows: lastResult.visibleRows.length,
|
|
3765
|
+
renderedItems: lastResult.displayItems.length
|
|
3766
|
+
};
|
|
3647
3767
|
}
|
|
3648
|
-
const elapsedMs = now() - started;
|
|
3649
|
-
const result = {
|
|
3650
|
-
iterations: loops,
|
|
3651
|
-
totalMs: elapsedMs,
|
|
3652
|
-
averageMs: elapsedMs / loops,
|
|
3653
|
-
visibleRows: lastResult.visibleRows.length,
|
|
3654
|
-
renderedItems: lastResult.displayItems.length
|
|
3655
|
-
};
|
|
3656
3768
|
this.gridApi.core.raise.benchmarkComplete(result);
|
|
3657
3769
|
return result;
|
|
3658
3770
|
}
|
|
@@ -3699,12 +3811,7 @@ var VanillaGridController = class {
|
|
|
3699
3811
|
if (win?.pdfMake) {
|
|
3700
3812
|
const resolved = this.resolveExporterOptions();
|
|
3701
3813
|
const pdfOpts = (0, import_ui_grid_core5.resolveGridExporterPdfOptions)(this.options);
|
|
3702
|
-
const filename = (0, import_ui_grid_core5.resolveExporterFilename)(
|
|
3703
|
-
pdfOpts.filename,
|
|
3704
|
-
"download.pdf",
|
|
3705
|
-
rowType,
|
|
3706
|
-
colType
|
|
3707
|
-
);
|
|
3814
|
+
const filename = (0, import_ui_grid_core5.resolveExporterFilename)(pdfOpts.filename, "download.pdf", rowType, colType);
|
|
3708
3815
|
const pdf = win.pdfMake.createPdf(doc);
|
|
3709
3816
|
if (resolved.csvFilename || pdfOpts.filename) {
|
|
3710
3817
|
pdf.download(filename);
|
|
@@ -3717,7 +3824,12 @@ var VanillaGridController = class {
|
|
|
3717
3824
|
buildExcelSheetData(rowType = "visible", colType = "visible") {
|
|
3718
3825
|
const exporterOptions = this.resolveExporterOptions();
|
|
3719
3826
|
const columns = colType === "all" ? this.options.columnDefs : this.visibleColumns;
|
|
3720
|
-
return (0, import_ui_grid_core5.buildGridExcelSheetData)(
|
|
3827
|
+
return (0, import_ui_grid_core5.buildGridExcelSheetData)(
|
|
3828
|
+
columns,
|
|
3829
|
+
this.exporterRowsFor(rowType),
|
|
3830
|
+
exporterOptions,
|
|
3831
|
+
colType
|
|
3832
|
+
);
|
|
3721
3833
|
}
|
|
3722
3834
|
exportExcel(rowType = "visible", colType = "visible") {
|
|
3723
3835
|
const sheetData = this.buildExcelSheetData(rowType, colType);
|
|
@@ -3774,11 +3886,7 @@ var VanillaGridController = class {
|
|
|
3774
3886
|
return [this.labels.validateError, ...errors].join("\n");
|
|
3775
3887
|
}
|
|
3776
3888
|
async validateGetInvalidRows() {
|
|
3777
|
-
return (0, import_ui_grid_core5.validateAllGridRows)(
|
|
3778
|
-
this.options.data,
|
|
3779
|
-
this.options.columnDefs,
|
|
3780
|
-
this.validatorRegistry
|
|
3781
|
-
);
|
|
3889
|
+
return (0, import_ui_grid_core5.validateAllGridRows)(this.options.data, this.options.columnDefs, this.validatorRegistry);
|
|
3782
3890
|
}
|
|
3783
3891
|
/** Test hook — exposes the validator registry so consumers can inspect or
|
|
3784
3892
|
* extend it outside of the gridApi surface (e.g. from a controller-level
|
|
@@ -3814,7 +3922,9 @@ var VanillaGridController = class {
|
|
|
3814
3922
|
}
|
|
3815
3923
|
importerImportText(text, type) {
|
|
3816
3924
|
const opts = this.resolveImporterOptions();
|
|
3817
|
-
const asJson = type === "csv" ? null : (0, import_ui_grid_core5.parseGridImporterJson)(text, {
|
|
3925
|
+
const asJson = type === "csv" ? null : (0, import_ui_grid_core5.parseGridImporterJson)(text, {
|
|
3926
|
+
errorCallback: type === "json" ? opts.errorCallback : void 0
|
|
3927
|
+
});
|
|
3818
3928
|
if (asJson && asJson.length > 0) {
|
|
3819
3929
|
const objects2 = (0, import_ui_grid_core5.buildGridImporterObjectsFromJson)(asJson, opts);
|
|
3820
3930
|
this.importerDispatchObjects(objects2);
|
|
@@ -3877,11 +3987,9 @@ var VanillaGridController = class {
|
|
|
3877
3987
|
/** Menu items the importer contributes. Just the single "Import"
|
|
3878
3988
|
* entry when the feature is enabled; returns an empty array otherwise. */
|
|
3879
3989
|
buildImporterMenuItems() {
|
|
3880
|
-
return (0, import_ui_grid_core5.buildGridImporterMenuItems)(
|
|
3881
|
-
this.
|
|
3882
|
-
|
|
3883
|
-
{ importAFile: () => this.importerRequestFile() }
|
|
3884
|
-
);
|
|
3990
|
+
return (0, import_ui_grid_core5.buildGridImporterMenuItems)(this.options, this.labels, {
|
|
3991
|
+
importAFile: () => this.importerRequestFile()
|
|
3992
|
+
});
|
|
3885
3993
|
}
|
|
3886
3994
|
/** Menu items row-edit contributes: "Save changes" + "Retry errored
|
|
3887
3995
|
* rows". Each entry is gated by both a gridOption flag and a runtime
|
|
@@ -3907,14 +4015,10 @@ var VanillaGridController = class {
|
|
|
3907
4015
|
this.rowEditSavePromiseOverrides.set(rowId, savePromise);
|
|
3908
4016
|
}
|
|
3909
4017
|
rowEditGetDirtyRows() {
|
|
3910
|
-
return this.pipeline.visibleRows.filter(
|
|
3911
|
-
(row) => this.rowEditState.dirtyRowIds.has(row.id)
|
|
3912
|
-
);
|
|
4018
|
+
return this.pipeline.visibleRows.filter((row) => this.rowEditState.dirtyRowIds.has(row.id));
|
|
3913
4019
|
}
|
|
3914
4020
|
rowEditGetErrorRows() {
|
|
3915
|
-
return this.pipeline.visibleRows.filter(
|
|
3916
|
-
(row) => this.rowEditState.errorRowIds.has(row.id)
|
|
3917
|
-
);
|
|
4021
|
+
return this.pipeline.visibleRows.filter((row) => this.rowEditState.errorRowIds.has(row.id));
|
|
3918
4022
|
}
|
|
3919
4023
|
rowEditFlushDirtyRows() {
|
|
3920
4024
|
const dirty = [...this.rowEditState.dirtyRowIds].map((id) => this.findRowById(id)).filter((row) => row !== void 0);
|
|
@@ -4000,7 +4104,7 @@ function createVanillaGridController(options) {
|
|
|
4000
4104
|
}
|
|
4001
4105
|
|
|
4002
4106
|
// scss-inline:/home/runner/work/uiGrid/uiGrid/projects/ui-grid-vanilla/src/ui-grid-shell.scss
|
|
4003
|
-
var ui_grid_shell_default = ':host{--_ui-grid-border-color: var(--ui-grid-border-color, var(--app-ui-grid-border-color, #d4d4d8));--_ui-grid-header-background: var( --ui-grid-header-background, var(--app-ui-grid-header-background, #f3f4f6) );--_ui-grid-row-odd: var(--ui-grid-row-odd, var(--app-ui-grid-row-odd, #fcfcfd));--_ui-grid-row-even: var(--ui-grid-row-even, var(--app-ui-grid-row-even, #f7f7f8));--_ui-grid-row-hover: var( --ui-grid-row-hover, var( --app-ui-grid-row-hover, color-mix(in srgb, var(--_ui-grid-accent) 4%, var(--_ui-grid-surface)) ) );--_ui-grid-row-focus-background: var( --ui-grid-row-focus-background, var( --app-ui-grid-row-focus-background, color-mix(in srgb, var(--_ui-grid-accent) 9%, var(--_ui-grid-surface)) ) );--_ui-grid-cell-color: var(--ui-grid-cell-color, var(--app-ui-grid-cell-color, #111827));--_ui-grid-muted-color: var(--ui-grid-muted-color, var(--app-ui-grid-muted-color, #6b7280));--_ui-grid-surface: var(--ui-grid-surface, var(--app-ui-grid-surface, #ffffff));--_ui-grid-radius: var(--ui-grid-radius, var(--app-ui-grid-radius, 4px));--_ui-grid-shadow: var( --ui-grid-shadow, var(--app-ui-grid-shadow, 0 10px 24px rgba(15, 23, 42, 0.08)) );--_ui-grid-header-weight: var(--ui-grid-header-weight, var(--app-ui-grid-header-weight, 700));--_ui-grid-accent: var(--ui-grid-accent, var(--app-ui-grid-accent, #2563eb));--_ui-grid-group-background: var( --ui-grid-group-background, var(--app-ui-grid-group-background, #eceff3) );--_ui-grid-status-active-bg: var( --ui-grid-status-active-bg, var(--app-ui-grid-status-active-bg, rgba(22, 163, 74, 0.14)) );--_ui-grid-status-active-color: var( --ui-grid-status-active-color, var(--app-ui-grid-status-active-color, #166534) );--_ui-grid-status-expansion-bg: var( --ui-grid-status-expansion-bg, var(--app-ui-grid-status-expansion-bg, rgba(37, 99, 235, 0.14)) );--_ui-grid-status-expansion-color: var( --ui-grid-status-expansion-color, var(--app-ui-grid-status-expansion-color, #1d4ed8) );--_ui-grid-status-enterprise-bg: var( --ui-grid-status-enterprise-bg, var(--app-ui-grid-status-enterprise-bg, rgba(15, 118, 110, 0.14)) );--_ui-grid-status-enterprise-color: var( --ui-grid-status-enterprise-color, var(--app-ui-grid-status-enterprise-color, #115e59) );--_ui-grid-status-pilot-bg: var( --ui-grid-status-pilot-bg, var(--app-ui-grid-status-pilot-bg, rgba(234, 88, 12, 0.14)) );--_ui-grid-status-pilot-color: var( --ui-grid-status-pilot-color, var(--app-ui-grid-status-pilot-color, #c2410c) );--_ui-grid-shell-gap: var(--ui-grid-shell-gap, var(--app-ui-grid-shell-gap, 1.5rem));--_ui-grid-hero-gap: var(--ui-grid-hero-gap, var(--app-ui-grid-hero-gap, 1.5rem));--_ui-grid-hero-padding-block: var( --ui-grid-hero-padding-block, var(--app-ui-grid-hero-padding-block, 1rem) );--_ui-grid-eyebrow-margin-block-end: var( --ui-grid-eyebrow-margin-block-end, var(--app-ui-grid-eyebrow-margin-block-end, 0.5rem) );--_ui-grid-eyebrow-letter-spacing: var( --ui-grid-eyebrow-letter-spacing, var(--app-ui-grid-eyebrow-letter-spacing, 0.18em) );--_ui-grid-eyebrow-font-size: var( --ui-grid-eyebrow-font-size, var(--app-ui-grid-eyebrow-font-size, 0.72rem) );--_ui-grid-hero-title-font-size: var( --ui-grid-hero-title-font-size, var(--app-ui-grid-hero-title-font-size, clamp(1.4rem, 2vw, 2rem)) );--_ui-grid-hero-title-line-height: var( --ui-grid-hero-title-line-height, var(--app-ui-grid-hero-title-line-height, 1.1) );--_ui-grid-hero-deck-max-width: var( --ui-grid-hero-deck-max-width, var(--app-ui-grid-hero-deck-max-width, 56ch) );--_ui-grid-hero-deck-margin-block-start: var( --ui-grid-hero-deck-margin-block-start, var(--app-ui-grid-hero-deck-margin-block-start, 0.75rem) );--_ui-grid-hero-actions-gap: var( --ui-grid-hero-actions-gap, var(--app-ui-grid-hero-actions-gap, 1rem) );--_ui-grid-action-radius: var(--ui-grid-action-radius, var(--app-ui-grid-action-radius, 999px));--_ui-grid-action-padding-block: var( --ui-grid-action-padding-block, var(--app-ui-grid-action-padding-block, 0.8rem) );--_ui-grid-action-padding-inline: var( --ui-grid-action-padding-inline, var(--app-ui-grid-action-padding-inline, 1.1rem) );--_ui-grid-stats-card-min-width: var( --ui-grid-stats-card-min-width, var(--app-ui-grid-stats-card-min-width, 8rem) );--_ui-grid-stats-card-padding-block: var( --ui-grid-stats-card-padding-block, var(--app-ui-grid-stats-card-padding-block, 0.85rem) );--_ui-grid-stats-card-padding-inline: var( --ui-grid-stats-card-padding-inline, var(--app-ui-grid-stats-card-padding-inline, 1rem) );--_ui-grid-stats-card-value-font-size: var( --ui-grid-stats-card-value-font-size, var(--app-ui-grid-stats-card-value-font-size, 1.9rem) );--_ui-grid-metrics-gap: var(--ui-grid-metrics-gap, var(--app-ui-grid-metrics-gap, 1rem));--_ui-grid-metric-card-padding-block: var( --ui-grid-metric-card-padding-block, var(--app-ui-grid-metric-card-padding-block, 1rem) );--_ui-grid-metric-card-padding-inline: var( --ui-grid-metric-card-padding-inline, var(--app-ui-grid-metric-card-padding-inline, 1.1rem) );--_ui-grid-metric-value-font-size: var( --ui-grid-metric-value-font-size, var(--app-ui-grid-metric-value-font-size, 1.3rem) );--_ui-grid-toolbar-gap: var(--ui-grid-toolbar-gap, var(--app-ui-grid-toolbar-gap, 1rem));--_ui-grid-toolbar-padding-block: var( --ui-grid-toolbar-padding-block, var(--app-ui-grid-toolbar-padding-block, 1rem) );--_ui-grid-toolbar-padding-inline: var( --ui-grid-toolbar-padding-inline, var(--app-ui-grid-toolbar-padding-inline, 1.25rem) );--_ui-grid-toolbar-inline-gap: var( --ui-grid-toolbar-inline-gap, var(--app-ui-grid-toolbar-inline-gap, 0.4rem) );--_ui-grid-overflow-x: var(--ui-grid-overflow-x, var(--app-ui-grid-overflow-x, auto));--_ui-grid-overflow-y: var(--ui-grid-overflow-y, var(--app-ui-grid-overflow-y, auto));--_ui-grid-header-z-index: var(--ui-grid-header-z-index, var(--app-ui-grid-header-z-index, 3));--_ui-grid-pinned-cell-z-index: var( --ui-grid-pinned-cell-z-index, var(--app-ui-grid-pinned-cell-z-index, 2) );--_ui-grid-pin-menu-open-z-index: var( --ui-grid-pin-menu-open-z-index, var(--app-ui-grid-pin-menu-open-z-index, 8) );--_ui-grid-pin-menu-z-index: var(--ui-grid-pin-menu-z-index, var(--app-ui-grid-pin-menu-z-index, 20));--_ui-grid-header-cell-gap: var( --ui-grid-header-cell-gap, var(--app-ui-grid-header-cell-gap, 0.75rem) );--_ui-grid-header-cell-padding-block: var( --ui-grid-header-cell-padding-block, var(--app-ui-grid-header-cell-padding-block, 0.85rem) );--_ui-grid-header-cell-padding-inline: var( --ui-grid-header-cell-padding-inline, var(--app-ui-grid-header-cell-padding-inline, 1rem) );--_ui-grid-header-cell-background-active: var( --ui-grid-header-cell-background-active, var( --app-ui-grid-header-cell-background-active, color-mix(in srgb, var(--_ui-grid-accent) 8%, var(--_ui-grid-header-background)) ) );--_ui-grid-pinned-divider-shadow-left: var( --ui-grid-pinned-divider-shadow-left, var( --app-ui-grid-pinned-divider-shadow-left, 2px 0 4px rgba(0, 0, 0, 0.06) ) );--_ui-grid-pinned-divider-shadow-right: var( --ui-grid-pinned-divider-shadow-right, var( --app-ui-grid-pinned-divider-shadow-right, -2px 0 4px rgba(0, 0, 0, 0.06) ) );--_ui-grid-pinned-divider-clip-left: var( --ui-grid-pinned-divider-clip-left, var(--app-ui-grid-pinned-divider-clip-left, inset(0 -4px 0 0)) );--_ui-grid-pinned-divider-clip-right: var( --ui-grid-pinned-divider-clip-right, var(--app-ui-grid-pinned-divider-clip-right, inset(0 0 0 -4px)) );--_ui-grid-header-actions-gap: var( --ui-grid-header-actions-gap, var(--app-ui-grid-header-actions-gap, 0.4rem) );--_ui-grid-control-size: var(--ui-grid-control-size, var(--app-ui-grid-control-size, 2rem));--_ui-grid-control-radius: var( --ui-grid-control-radius, var(--app-ui-grid-control-radius, 999px) );--_ui-grid-control-icon-size: var( --ui-grid-control-icon-size, var(--app-ui-grid-control-icon-size, 1rem) );--_ui-grid-control-background: var( --ui-grid-control-background, var(--app-ui-grid-control-background, var(--_ui-grid-surface)) );--_ui-grid-control-border-color: var( --ui-grid-control-border-color, var(--app-ui-grid-control-border-color, var(--_ui-grid-border-color)) );--_ui-grid-control-color: var( --ui-grid-control-color, var(--app-ui-grid-control-color, var(--_ui-grid-muted-color)) );--_ui-grid-control-background-active: var( --ui-grid-control-background-active, var( --app-ui-grid-control-background-active, color-mix(in srgb, var(--_ui-grid-accent) 12%, var(--_ui-grid-surface)) ) );--_ui-grid-control-border-color-active: var( --ui-grid-control-border-color-active, var( --app-ui-grid-control-border-color-active, color-mix(in srgb, var(--_ui-grid-accent) 35%, var(--_ui-grid-border-color)) ) );--_ui-grid-control-color-active: var( --ui-grid-control-color-active, var(--app-ui-grid-control-color-active, var(--_ui-grid-accent)) );--_ui-grid-pin-menu-offset-block-start: var( --ui-grid-pin-menu-offset-block-start, var(--app-ui-grid-pin-menu-offset-block-start, 0.35rem) );--_ui-grid-pin-menu-gap: var(--ui-grid-pin-menu-gap, var(--app-ui-grid-pin-menu-gap, 0.25rem));--_ui-grid-pin-menu-padding: var( --ui-grid-pin-menu-padding, var(--app-ui-grid-pin-menu-padding, 0.25rem) );--_ui-grid-pin-menu-radius: var(--ui-grid-pin-menu-radius, var(--app-ui-grid-pin-menu-radius, 999px));--_ui-grid-pin-menu-shadow: var( --ui-grid-pin-menu-shadow, var( --app-ui-grid-pin-menu-shadow, 0 10px 24px color-mix(in srgb, var(--_ui-grid-cell-color) 10%, transparent) ) );--_ui-grid-pin-menu-action-size: var( --ui-grid-pin-menu-action-size, var(--app-ui-grid-pin-menu-action-size, 1.75rem) );--_ui-grid-pin-control-collapsed-size: var( --ui-grid-pin-control-collapsed-size, var(--app-ui-grid-pin-control-collapsed-size, 1px) );--_ui-grid-pin-control-transition-duration: var( --ui-grid-pin-control-transition-duration, var(--app-ui-grid-pin-control-transition-duration, 160ms) );--_ui-grid-pin-control-transition-easing: var( --ui-grid-pin-control-transition-easing, var(--app-ui-grid-pin-control-transition-easing, cubic-bezier(0.22, 1, 0.36, 1)) );--_ui-grid-pin-menu-scale-closed: var( --ui-grid-pin-menu-scale-closed, var(--app-ui-grid-pin-menu-scale-closed, 0.72) );--_ui-grid-filter-cell-padding-block-start: var( --ui-grid-filter-cell-padding-block-start, var(--app-ui-grid-filter-cell-padding-block-start, 0.75rem) );--_ui-grid-filter-cell-padding-block-end: var( --ui-grid-filter-cell-padding-block-end, var(--app-ui-grid-filter-cell-padding-block-end, 1rem) );--_ui-grid-filter-cell-padding-inline: var( --ui-grid-filter-cell-padding-inline, var(--app-ui-grid-filter-cell-padding-inline, 1rem) );--_ui-grid-filter-input-padding-block: var( --ui-grid-filter-input-padding-block, var(--app-ui-grid-filter-input-padding-block, 0.55rem) );--_ui-grid-filter-input-padding-inline: var( --ui-grid-filter-input-padding-inline, var(--app-ui-grid-filter-input-padding-inline, 0.7rem) );--_ui-grid-filter-input-focus-outline: var( --ui-grid-filter-input-focus-outline, var( --app-ui-grid-filter-input-focus-outline, 2px solid color-mix(in srgb, var(--_ui-grid-accent) 18%, transparent) ) );--_ui-grid-body-cell-padding-block: var( --ui-grid-body-cell-padding-block, var(--app-ui-grid-body-cell-padding-block, 0.95rem) );--_ui-grid-body-cell-padding-inline: var( --ui-grid-body-cell-padding-inline, var(--app-ui-grid-body-cell-padding-inline, 1rem) );--_ui-grid-cell-shell-gap: var(--ui-grid-cell-shell-gap, var(--app-ui-grid-cell-shell-gap, 0.55rem));--_ui-grid-row-toggle-size: var(--ui-grid-row-toggle-size, var(--app-ui-grid-row-toggle-size, 1.55rem));--_ui-grid-row-toggle-radius: var( --ui-grid-row-toggle-radius, var(--app-ui-grid-row-toggle-radius, 999px) );--_ui-grid-toggle-icon-size: var( --ui-grid-toggle-icon-size, var(--app-ui-grid-toggle-icon-size, 1.1rem) );--_ui-grid-group-disclosure-icon-size: var( --ui-grid-group-disclosure-icon-size, var(--app-ui-grid-group-disclosure-icon-size, 0.9rem) );--_ui-grid-pagination-icon-size: var( --ui-grid-pagination-icon-size, var(--app-ui-grid-pagination-icon-size, 1.2rem) );--_ui-grid-expandable-row-padding-block: var( --ui-grid-expandable-row-padding-block, var(--app-ui-grid-expandable-row-padding-block, 1rem) );--_ui-grid-expandable-row-padding-inline: var( --ui-grid-expandable-row-padding-inline, var(--app-ui-grid-expandable-row-padding-inline, 1.25rem) );--_ui-grid-expandable-row-background: var( --ui-grid-expandable-row-background, var( --app-ui-grid-expandable-row-background, color-mix(in srgb, var(--_ui-grid-accent) 4%, var(--_ui-grid-surface)) ) );--_ui-grid-cell-focus-background: var( --ui-grid-cell-focus-background, var( --app-ui-grid-cell-focus-background, color-mix(in srgb, var(--_ui-grid-accent) 14%, var(--_ui-grid-surface)) ) );--_ui-grid-cell-focus-ring: var( --ui-grid-cell-focus-ring, var( --app-ui-grid-cell-focus-ring, inset 0 0 0 1px color-mix(in srgb, var(--_ui-grid-accent) 28%, transparent) ) );--_ui-grid-cell-editing-background: var( --ui-grid-cell-editing-background, var( --app-ui-grid-cell-editing-background, color-mix(in srgb, var(--_ui-grid-accent) 7%, var(--_ui-grid-surface)) ) );--_ui-grid-cell-editor-border-color: var( --ui-grid-cell-editor-border-color, var( --app-ui-grid-cell-editor-border-color, color-mix(in srgb, var(--_ui-grid-accent) 45%, var(--_ui-grid-border-color)) ) );--_ui-grid-cell-editor-radius: var( --ui-grid-cell-editor-radius, var(--app-ui-grid-cell-editor-radius, calc(var(--_ui-grid-radius) - 1px)) );--_ui-grid-cell-editor-padding-block: var( --ui-grid-cell-editor-padding-block, var(--app-ui-grid-cell-editor-padding-block, 0.45rem) );--_ui-grid-cell-editor-padding-inline: var( --ui-grid-cell-editor-padding-inline, var(--app-ui-grid-cell-editor-padding-inline, 0.55rem) );--_ui-grid-cell-editor-focus-outline: var( --ui-grid-cell-editor-focus-outline, var( --app-ui-grid-cell-editor-focus-outline, 2px solid color-mix(in srgb, var(--_ui-grid-accent) 18%, transparent) ) );--_ui-grid-group-row-gap: var(--ui-grid-group-row-gap, var(--app-ui-grid-group-row-gap, 0.9rem));--_ui-grid-group-row-padding-block: var( --ui-grid-group-row-padding-block, var(--app-ui-grid-group-row-padding-block, 0.9rem) );--_ui-grid-group-row-padding-inline: var( --ui-grid-group-row-padding-inline, var(--app-ui-grid-group-row-padding-inline, 1rem) );--_ui-grid-drag-preview-shadow: var( --ui-grid-drag-preview-shadow, var(--app-ui-grid-drag-preview-shadow, 0 12px 30px rgba(15, 23, 42, 0.16)) );--_ui-grid-drag-preview-radius: var( --ui-grid-drag-preview-radius, var(--app-ui-grid-drag-preview-radius, 0.9rem) );--_ui-grid-drag-placeholder-opacity: var( --ui-grid-drag-placeholder-opacity, var(--app-ui-grid-drag-placeholder-opacity, 0.3) );--_ui-grid-drag-placeholder-background: var( --ui-grid-drag-placeholder-background, var( --app-ui-grid-drag-placeholder-background, color-mix(in srgb, var(--_ui-grid-accent) 9%, var(--_ui-grid-header-background)) ) );--_ui-grid-drag-placeholder-border: var( --ui-grid-drag-placeholder-border, var( --app-ui-grid-drag-placeholder-border, 1px dashed color-mix(in srgb, var(--_ui-grid-accent) 45%, var(--_ui-grid-border-color)) ) );--_ui-grid-drag-placeholder-shadow: var( --ui-grid-drag-placeholder-shadow, var( --app-ui-grid-drag-placeholder-shadow, inset 0 0 0 1px color-mix(in srgb, var(--_ui-grid-accent) 18%, transparent) ) );--_ui-grid-empty-state-gap: var( --ui-grid-empty-state-gap, var(--app-ui-grid-empty-state-gap, 0.35rem) );--_ui-grid-empty-state-min-height: var( --ui-grid-empty-state-min-height, var(--app-ui-grid-empty-state-min-height, 16rem) );--_ui-grid-empty-state-padding: var( --ui-grid-empty-state-padding, var(--app-ui-grid-empty-state-padding, 2rem) );--_ui-grid-pagination-gap: var(--ui-grid-pagination-gap, var(--app-ui-grid-pagination-gap, 1rem));--_ui-grid-pagination-padding-block: var( --ui-grid-pagination-padding-block, var(--app-ui-grid-pagination-padding-block, 0.85rem) );--_ui-grid-pagination-padding-inline: var( --ui-grid-pagination-padding-inline, var(--app-ui-grid-pagination-padding-inline, 1.25rem) );--_ui-grid-pagination-controls-gap: var( --ui-grid-pagination-controls-gap, var(--app-ui-grid-pagination-controls-gap, 0.75rem) );--_ui-grid-pagination-size-gap: var( --ui-grid-pagination-size-gap, var(--app-ui-grid-pagination-size-gap, 0.4rem) );--_ui-grid-pagination-button-padding-block: var( --ui-grid-pagination-button-padding-block, var(--app-ui-grid-pagination-button-padding-block, 0.45rem) );--_ui-grid-pagination-button-padding-inline: var( --ui-grid-pagination-button-padding-inline, var(--app-ui-grid-pagination-button-padding-inline, 0.8rem) );--_ui-grid-pagination-select-padding-block: var( --ui-grid-pagination-select-padding-block, var(--app-ui-grid-pagination-select-padding-block, 0.35rem) );--_ui-grid-pagination-select-padding-inline: var( --ui-grid-pagination-select-padding-inline, var(--app-ui-grid-pagination-select-padding-inline, 0.55rem) );--_ui-grid-status-pill-padding-block: var( --ui-grid-status-pill-padding-block, var(--app-ui-grid-status-pill-padding-block, 0.2rem) );--_ui-grid-status-pill-padding-inline: var( --ui-grid-status-pill-padding-inline, var(--app-ui-grid-status-pill-padding-inline, 0.55rem) );--_ui-grid-status-pill-radius: var( --ui-grid-status-pill-radius, var(--app-ui-grid-status-pill-radius, 999px) );--_ui-grid-status-pill-font-size: var( --ui-grid-status-pill-font-size, var(--app-ui-grid-status-pill-font-size, 0.85rem) );--_ui-grid-status-pill-default-bg: var( --ui-grid-status-pill-default-bg, var(--app-ui-grid-status-pill-default-bg, rgba(15, 23, 42, 0.07)) );display:block;color:var(--_ui-grid-cell-color)}:host *,:host *::before,:host *::after{--ui-grid-border-color: var(--_ui-grid-border-color);--ui-grid-header-background: var(--_ui-grid-header-background);--ui-grid-row-odd: var(--_ui-grid-row-odd);--ui-grid-row-even: var(--_ui-grid-row-even);--ui-grid-row-hover: var(--_ui-grid-row-hover);--ui-grid-row-focus-background: var(--_ui-grid-row-focus-background);--ui-grid-cell-color: var(--_ui-grid-cell-color);--ui-grid-muted-color: var(--_ui-grid-muted-color);--ui-grid-surface: var(--_ui-grid-surface);--ui-grid-radius: var(--_ui-grid-radius);--ui-grid-shadow: var(--_ui-grid-shadow);--ui-grid-header-weight: var(--_ui-grid-header-weight);--ui-grid-accent: var(--_ui-grid-accent);--ui-grid-group-background: var(--_ui-grid-group-background);--ui-grid-status-active-bg: var(--_ui-grid-status-active-bg);--ui-grid-status-active-color: var(--_ui-grid-status-active-color);--ui-grid-status-expansion-bg: var(--_ui-grid-status-expansion-bg);--ui-grid-status-expansion-color: var(--_ui-grid-status-expansion-color);--ui-grid-status-enterprise-bg: var(--_ui-grid-status-enterprise-bg);--ui-grid-status-enterprise-color: var(--_ui-grid-status-enterprise-color);--ui-grid-status-pilot-bg: var(--_ui-grid-status-pilot-bg);--ui-grid-status-pilot-color: var(--_ui-grid-status-pilot-color);--ui-grid-shell-gap: var(--_ui-grid-shell-gap);--ui-grid-hero-gap: var(--_ui-grid-hero-gap);--ui-grid-hero-padding-block: var(--_ui-grid-hero-padding-block);--ui-grid-eyebrow-margin-block-end: var(--_ui-grid-eyebrow-margin-block-end);--ui-grid-eyebrow-letter-spacing: var(--_ui-grid-eyebrow-letter-spacing);--ui-grid-eyebrow-font-size: var(--_ui-grid-eyebrow-font-size);--ui-grid-hero-title-font-size: var(--_ui-grid-hero-title-font-size);--ui-grid-hero-title-line-height: var(--_ui-grid-hero-title-line-height);--ui-grid-hero-deck-max-width: var(--_ui-grid-hero-deck-max-width);--ui-grid-hero-deck-margin-block-start: var(--_ui-grid-hero-deck-margin-block-start);--ui-grid-hero-actions-gap: var(--_ui-grid-hero-actions-gap);--ui-grid-action-radius: var(--_ui-grid-action-radius);--ui-grid-action-padding-block: var(--_ui-grid-action-padding-block);--ui-grid-action-padding-inline: var(--_ui-grid-action-padding-inline);--ui-grid-stats-card-min-width: var(--_ui-grid-stats-card-min-width);--ui-grid-stats-card-padding-block: var(--_ui-grid-stats-card-padding-block);--ui-grid-stats-card-padding-inline: var(--_ui-grid-stats-card-padding-inline);--ui-grid-stats-card-value-font-size: var(--_ui-grid-stats-card-value-font-size);--ui-grid-metrics-gap: var(--_ui-grid-metrics-gap);--ui-grid-metric-card-padding-block: var(--_ui-grid-metric-card-padding-block);--ui-grid-metric-card-padding-inline: var(--_ui-grid-metric-card-padding-inline);--ui-grid-metric-value-font-size: var(--_ui-grid-metric-value-font-size);--ui-grid-toolbar-gap: var(--_ui-grid-toolbar-gap);--ui-grid-toolbar-padding-block: var(--_ui-grid-toolbar-padding-block);--ui-grid-toolbar-padding-inline: var(--_ui-grid-toolbar-padding-inline);--ui-grid-toolbar-inline-gap: var(--_ui-grid-toolbar-inline-gap);--ui-grid-overflow-x: var(--_ui-grid-overflow-x);--ui-grid-overflow-y: var(--_ui-grid-overflow-y);--ui-grid-header-z-index: var(--_ui-grid-header-z-index);--ui-grid-pinned-cell-z-index: var(--_ui-grid-pinned-cell-z-index);--ui-grid-pin-menu-open-z-index: var(--_ui-grid-pin-menu-open-z-index);--ui-grid-pin-menu-z-index: var(--_ui-grid-pin-menu-z-index);--ui-grid-header-cell-gap: var(--_ui-grid-header-cell-gap);--ui-grid-header-cell-padding-block: var(--_ui-grid-header-cell-padding-block);--ui-grid-header-cell-padding-inline: var(--_ui-grid-header-cell-padding-inline);--ui-grid-header-cell-background-active: var(--_ui-grid-header-cell-background-active);--ui-grid-pinned-divider-shadow-left: var(--_ui-grid-pinned-divider-shadow-left);--ui-grid-pinned-divider-shadow-right: var(--_ui-grid-pinned-divider-shadow-right);--ui-grid-pinned-divider-clip-left: var(--_ui-grid-pinned-divider-clip-left);--ui-grid-pinned-divider-clip-right: var(--_ui-grid-pinned-divider-clip-right);--ui-grid-header-actions-gap: var(--_ui-grid-header-actions-gap);--ui-grid-control-size: var(--_ui-grid-control-size);--ui-grid-control-radius: var(--_ui-grid-control-radius);--ui-grid-control-icon-size: var(--_ui-grid-control-icon-size);--ui-grid-control-background: var(--_ui-grid-control-background);--ui-grid-control-border-color: var(--_ui-grid-control-border-color);--ui-grid-control-color: var(--_ui-grid-control-color);--ui-grid-control-background-active: var(--_ui-grid-control-background-active);--ui-grid-control-border-color-active: var(--_ui-grid-control-border-color-active);--ui-grid-control-color-active: var(--_ui-grid-control-color-active);--ui-grid-pin-menu-offset-block-start: var(--_ui-grid-pin-menu-offset-block-start);--ui-grid-pin-menu-gap: var(--_ui-grid-pin-menu-gap);--ui-grid-pin-menu-padding: var(--_ui-grid-pin-menu-padding);--ui-grid-pin-menu-radius: var(--_ui-grid-pin-menu-radius);--ui-grid-pin-menu-shadow: var(--_ui-grid-pin-menu-shadow);--ui-grid-pin-menu-action-size: var(--_ui-grid-pin-menu-action-size);--ui-grid-pin-control-collapsed-size: var(--_ui-grid-pin-control-collapsed-size);--ui-grid-pin-control-transition-duration: var(--_ui-grid-pin-control-transition-duration);--ui-grid-pin-control-transition-easing: var(--_ui-grid-pin-control-transition-easing);--ui-grid-pin-menu-scale-closed: var(--_ui-grid-pin-menu-scale-closed);--ui-grid-filter-cell-padding-block-start: var(--_ui-grid-filter-cell-padding-block-start);--ui-grid-filter-cell-padding-block-end: var(--_ui-grid-filter-cell-padding-block-end);--ui-grid-filter-cell-padding-inline: var(--_ui-grid-filter-cell-padding-inline);--ui-grid-filter-input-padding-block: var(--_ui-grid-filter-input-padding-block);--ui-grid-filter-input-padding-inline: var(--_ui-grid-filter-input-padding-inline);--ui-grid-filter-input-focus-outline: var(--_ui-grid-filter-input-focus-outline);--ui-grid-body-cell-padding-block: var(--_ui-grid-body-cell-padding-block);--ui-grid-body-cell-padding-inline: var(--_ui-grid-body-cell-padding-inline);--ui-grid-cell-shell-gap: var(--_ui-grid-cell-shell-gap);--ui-grid-row-toggle-size: var(--_ui-grid-row-toggle-size);--ui-grid-row-toggle-radius: var(--_ui-grid-row-toggle-radius);--ui-grid-toggle-icon-size: var(--_ui-grid-toggle-icon-size);--ui-grid-group-disclosure-icon-size: var(--_ui-grid-group-disclosure-icon-size);--ui-grid-pagination-icon-size: var(--_ui-grid-pagination-icon-size);--ui-grid-expandable-row-padding-block: var(--_ui-grid-expandable-row-padding-block);--ui-grid-expandable-row-padding-inline: var(--_ui-grid-expandable-row-padding-inline);--ui-grid-expandable-row-background: var(--_ui-grid-expandable-row-background);--ui-grid-cell-focus-background: var(--_ui-grid-cell-focus-background);--ui-grid-cell-focus-ring: var(--_ui-grid-cell-focus-ring);--ui-grid-cell-editing-background: var(--_ui-grid-cell-editing-background);--ui-grid-cell-editor-border-color: var(--_ui-grid-cell-editor-border-color);--ui-grid-cell-editor-radius: var(--_ui-grid-cell-editor-radius);--ui-grid-cell-editor-padding-block: var(--_ui-grid-cell-editor-padding-block);--ui-grid-cell-editor-padding-inline: var(--_ui-grid-cell-editor-padding-inline);--ui-grid-cell-editor-focus-outline: var(--_ui-grid-cell-editor-focus-outline);--ui-grid-group-row-gap: var(--_ui-grid-group-row-gap);--ui-grid-group-row-padding-block: var(--_ui-grid-group-row-padding-block);--ui-grid-group-row-padding-inline: var(--_ui-grid-group-row-padding-inline);--ui-grid-drag-preview-shadow: var(--_ui-grid-drag-preview-shadow);--ui-grid-drag-preview-radius: var(--_ui-grid-drag-preview-radius);--ui-grid-drag-placeholder-opacity: var(--_ui-grid-drag-placeholder-opacity);--ui-grid-drag-placeholder-background: var(--_ui-grid-drag-placeholder-background);--ui-grid-drag-placeholder-border: var(--_ui-grid-drag-placeholder-border);--ui-grid-drag-placeholder-shadow: var(--_ui-grid-drag-placeholder-shadow);--ui-grid-empty-state-gap: var(--_ui-grid-empty-state-gap);--ui-grid-empty-state-min-height: var(--_ui-grid-empty-state-min-height);--ui-grid-empty-state-padding: var(--_ui-grid-empty-state-padding);--ui-grid-pagination-gap: var(--_ui-grid-pagination-gap);--ui-grid-pagination-padding-block: var(--_ui-grid-pagination-padding-block);--ui-grid-pagination-padding-inline: var(--_ui-grid-pagination-padding-inline);--ui-grid-pagination-controls-gap: var(--_ui-grid-pagination-controls-gap);--ui-grid-pagination-size-gap: var(--_ui-grid-pagination-size-gap);--ui-grid-pagination-button-padding-block: var(--_ui-grid-pagination-button-padding-block);--ui-grid-pagination-button-padding-inline: var(--_ui-grid-pagination-button-padding-inline);--ui-grid-pagination-select-padding-block: var(--_ui-grid-pagination-select-padding-block);--ui-grid-pagination-select-padding-inline: var(--_ui-grid-pagination-select-padding-inline);--ui-grid-status-pill-padding-block: var(--_ui-grid-status-pill-padding-block);--ui-grid-status-pill-padding-inline: var(--_ui-grid-status-pill-padding-inline);--ui-grid-status-pill-radius: var(--_ui-grid-status-pill-radius);--ui-grid-status-pill-font-size: var(--_ui-grid-status-pill-font-size);--ui-grid-status-pill-default-bg: var(--_ui-grid-status-pill-default-bg);box-sizing:border-box}.grid-shell{display:grid;gap:var(--ui-grid-shell-gap)}.grid-hero{display:flex;justify-content:space-between;gap:var(--ui-grid-hero-gap);align-items:end;padding:var(--ui-grid-hero-padding-block) 0;color:var(--ui-grid-cell-color)}.eyebrow{margin:0 0 var(--ui-grid-eyebrow-margin-block-end);text-transform:uppercase;letter-spacing:var(--ui-grid-eyebrow-letter-spacing);font-size:var(--ui-grid-eyebrow-font-size);color:var(--ui-grid-muted-color)}h1{margin:0;font-size:var(--ui-grid-hero-title-font-size);line-height:var(--ui-grid-hero-title-line-height)}.deck{max-width:var(--ui-grid-hero-deck-max-width);margin:var(--ui-grid-hero-deck-margin-block-start) 0 0;color:var(--ui-grid-muted-color)}.hero-actions{display:flex;gap:var(--ui-grid-hero-actions-gap);align-items:center;flex-wrap:wrap}.action{border:0;border-radius:var(--ui-grid-action-radius);padding:var(--ui-grid-action-padding-block) var(--ui-grid-action-padding-inline);font:inherit;cursor:pointer}.action-secondary{background:var(--ui-grid-surface);color:var(--ui-grid-cell-color);border:1px solid var(--ui-grid-border-color)}.stats-card{min-width:var(--ui-grid-stats-card-min-width);padding:var(--ui-grid-stats-card-padding-block) var(--ui-grid-stats-card-padding-inline);border-radius:var(--ui-grid-radius);background:var(--ui-grid-surface);border:1px solid var(--ui-grid-border-color);display:grid}.stats-card span{font-size:var(--ui-grid-stats-card-value-font-size);font-weight:700}.stats-card small{color:var(--ui-grid-muted-color)}.grid-frame{display:grid;grid-template-rows:auto minmax(0, 1fr) auto;height:100%;min-height:0;border-radius:var(--ui-grid-radius);background:var(--ui-grid-surface);border:1px solid var(--ui-grid-border-color);box-shadow:var(--ui-grid-shadow);overflow:hidden}.metrics-strip{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:var(--ui-grid-metrics-gap)}.metrics-strip article{padding:var(--ui-grid-metric-card-padding-block) var(--ui-grid-metric-card-padding-inline);border-radius:var(--ui-grid-radius);background:var(--ui-grid-surface);border:1px solid var(--ui-grid-border-color);display:grid}.metrics-strip strong{font-size:var(--ui-grid-metric-value-font-size)}.metrics-strip span{color:var(--ui-grid-muted-color)}.grid-toolbar{display:flex;justify-content:space-between;gap:var(--ui-grid-toolbar-gap);padding:var(--ui-grid-toolbar-padding-block) var(--ui-grid-toolbar-padding-inline);align-items:center;background:var(--ui-grid-header-background);border-bottom:1px solid var(--ui-grid-border-color)}.grid-toolbar div{display:flex;gap:var(--ui-grid-toolbar-inline-gap);align-items:baseline}.grid-toolbar p{margin:0;color:var(--ui-grid-muted-color)}.grid-table{position:relative;height:100%;min-height:0;width:100%;min-width:0;display:flex;flex-direction:column;background:var(--ui-grid-surface);overflow-anchor:none}.grid-header-strip,.grid-filter-strip{flex:0 0 auto;position:sticky;z-index:var(--ui-grid-header-z-index);background:var(--ui-grid-surface);overflow:hidden}.grid-header-strip{top:0}.grid-filter-strip{top:var(--ui-grid-header-sticky-top, 0px)}.grid-body-viewport{flex:1 1 auto;min-height:0;overflow-x:auto;overflow-anchor:none;overscroll-behavior-x:none}.header-grid,.filter-grid,.body-grid{display:grid;width:100%;min-width:max-content}.header-cell,.filter-cell,.body-cell,.group-row{min-width:0}.header-cell{display:grid;grid-template-columns:minmax(0, 1fr) auto;gap:var(--ui-grid-header-cell-gap);padding:var(--ui-grid-header-cell-padding-block) var(--ui-grid-header-cell-padding-inline);border-bottom:1px solid var(--ui-grid-border-color);background:var(--ui-grid-header-background);font-weight:var(--ui-grid-header-weight);align-items:center;position:relative}.header-cell.is-active{background:var(--ui-grid-header-cell-background-active)}.header-cell[draggable=true]{cursor:grab}.header-cell.is-dragging{opacity:.6}.header-cell.is-drag-target{background:color-mix(in srgb, var(--ui-grid-accent) 9%, var(--ui-grid-header-background));border:1px dashed color-mix(in srgb, var(--ui-grid-accent) 45%, var(--ui-grid-border-color));box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ui-grid-accent) 18%, transparent)}.header-cell.is-pin-menu-open{z-index:var(--ui-grid-pin-menu-open-z-index)}.header-cell.is-pinned,.filter-cell.is-pinned,.body-cell.is-pinned{position:sticky;z-index:var(--ui-grid-pinned-cell-z-index);background:var(--ui-grid-surface)}.header-cell.is-pinned{background:var(--ui-grid-header-background)}.body-cell.is-pinned.body-cell-odd{background:var(--ui-grid-row-odd)}.body-cell.is-pinned:not(.body-cell-odd){background:var(--ui-grid-row-even)}.header-cell.is-pinned-left-last,.filter-cell.is-pinned-left-last,.body-cell.is-pinned-left-last{box-shadow:var(--ui-grid-pinned-divider-shadow-left);clip-path:var(--ui-grid-pinned-divider-clip-left)}.header-cell.is-pinned-right-first,.filter-cell.is-pinned-right-first,.body-cell.is-pinned-right-first{box-shadow:var(--ui-grid-pinned-divider-shadow-right);clip-path:var(--ui-grid-pinned-divider-clip-right)}.header-label{min-width:0;display:block;white-space:nowrap;overflow:hidden;text-overflow:clip;hyphens:none}.header-actions{display:inline-flex;align-items:center;gap:var(--ui-grid-header-actions-gap);justify-self:end}.column-resizer{position:absolute;top:0;right:-4px;width:8px;height:100%;padding:0;border:0;background:rgba(0,0,0,0);cursor:col-resize;z-index:5}.column-resizer::after{content:"";position:absolute;top:20%;bottom:20%;left:50%;width:2px;transform:translateX(-50%);border-radius:999px;background:color-mix(in srgb, var(--_ui-grid-border-color) 80%, transparent);opacity:0;transition:opacity 120ms ease}.header-cell:hover .column-resizer::after,.column-resizer:focus-visible::after{opacity:1}.pin-control{position:relative;display:inline-grid;place-items:center;justify-items:center;min-width:var(--ui-grid-control-size);overflow:hidden}.header-action,.chip-action{display:inline-flex;align-items:center;justify-content:center;width:var(--ui-grid-control-size);height:var(--ui-grid-control-size);display:flex;border:0;background:var(--ui-grid-control-background);padding:0;font:inherit;border-radius:var(--ui-grid-control-radius);cursor:pointer}.header-action-disabled{cursor:default}.header-action svg,.chip-action svg{width:var(--ui-grid-control-icon-size);height:var(--ui-grid-control-icon-size);fill:currentColor}.header-action{color:var(--ui-grid-control-color);border:1px solid var(--ui-grid-control-border-color)}.header-cell.is-active .header-action{color:var(--ui-grid-control-color-active);border-color:var(--ui-grid-control-border-color-active)}.chip-action{border:1px solid var(--ui-grid-control-border-color);color:var(--ui-grid-control-color)}.chip-action-active{background:var(--ui-grid-control-background-active);border-color:var(--ui-grid-control-border-color-active);color:var(--ui-grid-control-color-active)}.pin-trigger{grid-area:1/1;transform-origin:center;transition:width var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),height var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),opacity var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),transform var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),border-color var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),background-color var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),color var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing)}.pin-menu{grid-area:1/1;z-index:var(--ui-grid-pin-menu-z-index);display:grid;grid-auto-rows:var(--ui-grid-pin-menu-action-size);gap:var(--ui-grid-pin-menu-gap);padding:var(--ui-grid-pin-menu-padding);border:1px solid var(--ui-grid-border-color);border-radius:var(--ui-grid-pin-menu-radius);background:var(--ui-grid-surface);box-shadow:var(--ui-grid-pin-menu-shadow);justify-items:center;align-items:center;width:var(--ui-grid-control-size);max-height:var(--ui-grid-pin-control-collapsed-size);opacity:0;pointer-events:none;transform:scale(var(--ui-grid-pin-menu-scale-closed));transform-origin:center;transition:max-height var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),opacity var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),transform var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),padding var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),border-color var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),box-shadow var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing)}.pin-control-open{align-items:start}.pin-control-open .pin-trigger{width:var(--ui-grid-pin-control-collapsed-size);height:var(--ui-grid-pin-control-collapsed-size);opacity:0;transform:scale(0.72);pointer-events:none}.pin-control-open .pin-menu{max-height:calc(var(--ui-grid-pin-menu-action-size)*2 + var(--ui-grid-pin-menu-gap) + var(--ui-grid-pin-menu-padding)*2);opacity:1;pointer-events:auto;transform:scale(1)}.pin-menu-action{display:inline-flex;align-items:center;justify-content:center;width:var(--ui-grid-pin-menu-action-size);height:var(--ui-grid-pin-menu-action-size);border:0;border-radius:var(--ui-grid-control-radius);background:rgba(0,0,0,0);color:var(--ui-grid-control-color);cursor:pointer}.pin-menu-action:hover,.pin-menu-action:focus-visible{outline:0;background:var(--ui-grid-control-background-active);color:var(--ui-grid-control-color-active)}.pin-menu-action svg{width:var(--ui-grid-control-icon-size);height:var(--ui-grid-control-icon-size);fill:currentColor}.header-cell.cdk-drag-placeholder{background:var(--ui-grid-drag-placeholder-background);border:var(--ui-grid-drag-placeholder-border);box-shadow:var(--ui-grid-drag-placeholder-shadow);opacity:.9}.header-grid.cdk-drop-list-dragging .header-cell:not(.cdk-drag-placeholder){transition:transform 120ms ease,background-color 120ms ease}.body-cell{padding:var(--ui-grid-body-cell-padding-block) var(--ui-grid-body-cell-padding-inline);border-bottom:1px solid var(--ui-grid-border-color);color:var(--ui-grid-cell-color);background:var(--ui-grid-row-even);outline:0}.body-cell.body-cell-odd{background:var(--ui-grid-row-odd)}.cell-shell{display:flex;align-items:center;gap:var(--ui-grid-cell-shell-gap);min-width:0}.cell-value{min-width:0;flex:1 1 auto}.row-toggle{border:1px solid var(--ui-grid-border-color);background:var(--ui-grid-surface);color:var(--ui-grid-cell-color);width:var(--ui-grid-row-toggle-size);height:var(--ui-grid-row-toggle-size);border-radius:var(--ui-grid-row-toggle-radius);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto;padding:0;font:inherit}.toggle-icon{width:var(--ui-grid-toggle-icon-size);height:var(--ui-grid-toggle-icon-size);fill:currentColor;pointer-events:none}.group-disclosure-icon{width:var(--ui-grid-group-disclosure-icon-size);height:var(--ui-grid-group-disclosure-icon-size)}.pagination-icon{width:var(--ui-grid-pagination-icon-size);height:var(--ui-grid-pagination-icon-size);fill:currentColor}.expandable-row{padding:var(--ui-grid-expandable-row-padding-block) var(--ui-grid-expandable-row-padding-inline);border-bottom:1px solid var(--ui-grid-border-color);background:var(--ui-grid-expandable-row-background)}.body-grid>.body-cell:hover:not(.row-focused):not(.cell-focused):not(.cell-editing){background:var(--ui-grid-row-hover);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ui-grid-accent) 10%, transparent)}.body-cell.row-focused,.body-grid>.body-cell.row-focused{background:var(--ui-grid-row-focus-background)}.body-cell.cell-focused,.body-grid>.body-cell.cell-focused{background:var(--ui-grid-cell-focus-background);box-shadow:var(--ui-grid-cell-focus-ring)}.body-cell.cell-editing,.body-grid>.body-cell.cell-editing{background:var(--ui-grid-cell-editing-background)}.cell-editor{display:block;width:100%;min-width:0;max-width:100%;border:1px solid var(--ui-grid-cell-editor-border-color);border-radius:var(--ui-grid-cell-editor-radius);background:var(--ui-grid-surface);color:var(--ui-grid-cell-color);padding:var(--ui-grid-cell-editor-padding-block) var(--ui-grid-cell-editor-padding-inline);font:inherit}.cell-editor:focus{outline:var(--ui-grid-cell-editor-focus-outline)}.grid-viewport{width:100%}.grid-virtual-spacer{position:relative;width:max-content;min-width:100%}.grid-virtual-body{position:absolute;left:0}.cdk-drag-preview{box-shadow:var(--ui-grid-drag-preview-shadow);border-radius:var(--ui-grid-drag-preview-radius)}.cdk-drag-placeholder{opacity:var(--ui-grid-drag-placeholder-opacity)}.body-cell.align-center{text-align:center}.body-cell.align-end{text-align:right}.empty-state{display:grid;place-items:center;gap:var(--ui-grid-empty-state-gap);min-height:var(--ui-grid-empty-state-min-height);text-align:center;padding:var(--ui-grid-empty-state-padding);color:var(--ui-grid-muted-color);background:var(--ui-grid-surface)}.empty-state p,.empty-state strong{margin:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.status-pill{display:inline-flex;align-items:center;justify-content:center;padding:var(--ui-grid-status-pill-padding-block) var(--ui-grid-status-pill-padding-inline);border-radius:var(--ui-grid-status-pill-radius);background:var(--ui-grid-status-pill-default-bg);color:var(--ui-grid-cell-color);font-size:var(--ui-grid-status-pill-font-size);font-weight:700}.status-pill-enterprise{background:var(--ui-grid-status-enterprise-bg);color:var(--ui-grid-status-enterprise-color)}.status-pill-active{background:var(--ui-grid-status-active-bg);color:var(--ui-grid-status-active-color)}.status-pill-expansion{background:var(--ui-grid-status-expansion-bg);color:var(--ui-grid-status-expansion-color)}.status-pill-pilot{background:var(--ui-grid-status-pilot-bg);color:var(--ui-grid-status-pilot-color)}@media(max-width: 900px){.metrics-strip{grid-template-columns:repeat(2, minmax(0, 1fr))}.grid-hero,.grid-toolbar{grid-template-columns:1fr;display:grid}.hero-actions{justify-content:space-between}}@media(max-width: 640px){.metrics-strip{grid-template-columns:1fr}}.ui-grid-row-selected,.body-cell.ui-grid-row-selected{background:var(--ui-grid-row-selected-bg, var(--app-ui-grid-row-selected-bg, color-mix(in srgb, var(--ui-grid-accent, #2563eb) 22%, var(--ui-grid-surface, #ffffff))));color:var(--ui-grid-row-selected-color, var(--app-ui-grid-row-selected-color, var(--ui-grid-cell-color)))}.body-cell.ui-grid-row-selected.body-cell-odd{background:var(--ui-grid-row-selected-bg-odd, var(--app-ui-grid-row-selected-bg-odd, color-mix(in srgb, var(--ui-grid-accent, #2563eb) 26%, var(--ui-grid-surface, #ffffff))))}.ui-grid-row-focused,.body-cell.ui-grid-row-focused{outline:1px dashed var(--ui-grid-accent, #2563eb);outline-offset:-1px}.body-cell[data-column=selectionRowHeaderCol],.header-cell[data-column=selectionRowHeaderCol],.filter-cell[data-column=selectionRowHeaderCol]{padding:0 !important;cursor:pointer;user-select:none;-webkit-user-select:none;display:flex;align-items:center;justify-content:center}.body-cell[data-column=selectionRowHeaderCol]>.cell-shell,.body-cell[data-column=selectionRowHeaderCol]>.cell-shell>.cell-content{padding:0 !important;padding-inline-start:0 !important;margin:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.filter-cell[data-column=selectionRowHeaderCol]{padding:0;background:var(--_ui-grid-header-background, var(--ui-grid-header-background, transparent));border-bottom:1px solid var(--_ui-grid-border-color, var(--ui-grid-border-color, transparent))}.ui-grid-selection-row-header-buttons{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;cursor:pointer}.ui-grid-selection-checkbox{display:inline-block;width:16px;height:16px;box-sizing:border-box;border:2px solid currentColor;border-radius:3px;background:rgba(0,0,0,0);color:var(--ui-grid-cell-color, currentColor);position:relative;transition:background 120ms ease,border-color 120ms ease,color 120ms ease;opacity:.7}.ui-grid-selection-row-header-buttons:hover .ui-grid-selection-checkbox{opacity:1;color:var(--ui-grid-accent, var(--_ui-grid-accent, #2563eb))}.ui-grid-selection-checkbox-checked{background:var(--ui-grid-accent, var(--_ui-grid-accent, #2563eb));color:var(--ui-grid-accent, var(--_ui-grid-accent, #2563eb));border-color:var(--ui-grid-accent, var(--_ui-grid-accent, #2563eb));opacity:1}.ui-grid-selection-checkbox-checked::after{content:"";position:absolute;left:3px;top:0;width:5px;height:9px;border:2px solid var(--ui-grid-surface, var(--_ui-grid-surface, #ffffff));border-top:0;border-left:0;transform:rotate(45deg)}.ui-grid-selection-checkbox-disabled{opacity:.3;cursor:not-allowed}.ui-grid-selection-select-all{display:inline-flex;align-items:center;justify-content:center;background:rgba(0,0,0,0);border:0;padding:0;margin:0;cursor:pointer;width:100%;height:100%}.ui-grid-selection-select-all:focus-visible{outline:2px solid var(--_ui-grid-accent, var(--ui-grid-accent, #2563eb));outline-offset:-2px}.grid-body-viewport:has([data-column=selectionRowHeaderCol]){user-select:none;-webkit-user-select:none}.body-cell.ui-grid-row-dirty{color:var(--ui-grid-row-dirty-color, var(--app-ui-grid-row-dirty-color, #610B38));background:var(--ui-grid-row-dirty-bg, var(--app-ui-grid-row-dirty-bg, color-mix(in srgb, var(--ui-grid-accent, #2563eb) 8%, var(--ui-grid-surface, #ffffff))))}.body-cell.ui-grid-row-saving{color:var(--ui-grid-row-saving-color, var(--app-ui-grid-row-saving-color, #848484)) !important;opacity:var(--ui-grid-row-saving-opacity, 0.75);cursor:progress}.body-cell.ui-grid-row-error{color:var(--ui-grid-row-error-color, var(--app-ui-grid-row-error-color, #FF0000)) !important;background:var(--ui-grid-row-error-bg, var(--app-ui-grid-row-error-bg, color-mix(in srgb, #ff0000 14%, var(--ui-grid-surface, #ffffff))))}.body-cell.ui-grid-cell-invalid{position:relative;background:var(--ui-grid-cell-invalid-bg, var(--app-ui-grid-cell-invalid-bg, color-mix(in srgb, #ff0000 10%, var(--ui-grid-surface, #ffffff))))}.body-cell.ui-grid-cell-invalid::after{content:"";position:absolute;top:0;right:0;width:0;height:0;border-style:solid;border-width:0 var(--ui-grid-cell-invalid-marker-size, 8px) var(--ui-grid-cell-invalid-marker-size, 8px) 0;border-color:rgba(0,0,0,0) var(--ui-grid-cell-invalid-marker-color, #ff0000) rgba(0,0,0,0) rgba(0,0,0,0);pointer-events:none}.filter-cell{padding:var(--ui-grid-filter-cell-padding-block-start) var(--ui-grid-filter-cell-padding-inline) var(--ui-grid-filter-cell-padding-block-end);border-bottom:1px solid var(--ui-grid-border-color);background:var(--ui-grid-header-background)}.filter-cell input{width:100%;min-width:0;box-sizing:border-box;border:1px solid var(--ui-grid-border-color);border-radius:var(--ui-grid-radius);background:var(--ui-grid-surface);padding:var(--ui-grid-filter-input-padding-block) var(--ui-grid-filter-input-padding-inline);font:inherit}.filter-cell input:focus{outline:var(--ui-grid-filter-input-focus-outline);border-color:var(--ui-grid-accent)}.group-row{display:flex;align-items:center;gap:var(--ui-grid-group-row-gap);border:0;width:100%;padding:var(--ui-grid-group-row-padding-block) var(--ui-grid-group-row-padding-inline);background:var(--ui-grid-group-background);border-bottom:1px solid var(--ui-grid-border-color);color:var(--ui-grid-cell-color);cursor:pointer;text-align:left}.group-row span,.group-row small{color:var(--ui-grid-muted-color)}.pagination-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--ui-grid-pagination-gap);padding:var(--ui-grid-pagination-padding-block) var(--ui-grid-pagination-padding-inline);border-top:1px solid var(--ui-grid-border-color);background:var(--ui-grid-header-background)}.pagination-bar p{margin:0;color:var(--ui-grid-muted-color)}.pagination-controls{display:flex;align-items:center;gap:var(--ui-grid-pagination-controls-gap);flex-wrap:wrap}.pagination-button{padding:var(--ui-grid-pagination-button-padding-block) var(--ui-grid-pagination-button-padding-inline)}.pagination-size{display:inline-flex;align-items:center;gap:var(--ui-grid-pagination-size-gap)}.pagination-size select{border:1px solid var(--ui-grid-border-color);border-radius:var(--ui-grid-radius);background:var(--ui-grid-surface);padding:var(--ui-grid-pagination-select-padding-block) var(--ui-grid-pagination-select-padding-inline);font:inherit}';
|
|
4107
|
+
var ui_grid_shell_default = ':host{--_ui-grid-border-color: var(--ui-grid-border-color, var(--app-ui-grid-border-color, #d4d4d8));--_ui-grid-header-background: var( --ui-grid-header-background, var(--app-ui-grid-header-background, #f3f4f6) );--_ui-grid-row-odd: var(--ui-grid-row-odd, var(--app-ui-grid-row-odd, #fcfcfd));--_ui-grid-row-even: var(--ui-grid-row-even, var(--app-ui-grid-row-even, #f7f7f8));--_ui-grid-row-hover: var( --ui-grid-row-hover, var( --app-ui-grid-row-hover, color-mix(in srgb, var(--_ui-grid-accent) 4%, var(--_ui-grid-surface)) ) );--_ui-grid-row-focus-background: var( --ui-grid-row-focus-background, var( --app-ui-grid-row-focus-background, color-mix(in srgb, var(--_ui-grid-accent) 9%, var(--_ui-grid-surface)) ) );--_ui-grid-cell-color: var(--ui-grid-cell-color, var(--app-ui-grid-cell-color, #111827));--_ui-grid-muted-color: var(--ui-grid-muted-color, var(--app-ui-grid-muted-color, #6b7280));--_ui-grid-surface: var(--ui-grid-surface, var(--app-ui-grid-surface, #ffffff));--_ui-grid-radius: var(--ui-grid-radius, var(--app-ui-grid-radius, 4px));--_ui-grid-shadow: var( --ui-grid-shadow, var(--app-ui-grid-shadow, 0 10px 24px rgba(15, 23, 42, 0.08)) );--_ui-grid-header-weight: var(--ui-grid-header-weight, var(--app-ui-grid-header-weight, 700));--_ui-grid-accent: var(--ui-grid-accent, var(--app-ui-grid-accent, #2563eb));--_ui-grid-group-background: var( --ui-grid-group-background, var(--app-ui-grid-group-background, #eceff3) );--_ui-grid-status-active-bg: var( --ui-grid-status-active-bg, var(--app-ui-grid-status-active-bg, rgba(22, 163, 74, 0.14)) );--_ui-grid-status-active-color: var( --ui-grid-status-active-color, var(--app-ui-grid-status-active-color, #166534) );--_ui-grid-status-expansion-bg: var( --ui-grid-status-expansion-bg, var(--app-ui-grid-status-expansion-bg, rgba(37, 99, 235, 0.14)) );--_ui-grid-status-expansion-color: var( --ui-grid-status-expansion-color, var(--app-ui-grid-status-expansion-color, #1d4ed8) );--_ui-grid-status-enterprise-bg: var( --ui-grid-status-enterprise-bg, var(--app-ui-grid-status-enterprise-bg, rgba(15, 118, 110, 0.14)) );--_ui-grid-status-enterprise-color: var( --ui-grid-status-enterprise-color, var(--app-ui-grid-status-enterprise-color, #115e59) );--_ui-grid-status-pilot-bg: var( --ui-grid-status-pilot-bg, var(--app-ui-grid-status-pilot-bg, rgba(234, 88, 12, 0.14)) );--_ui-grid-status-pilot-color: var( --ui-grid-status-pilot-color, var(--app-ui-grid-status-pilot-color, #c2410c) );--_ui-grid-shell-gap: var(--ui-grid-shell-gap, var(--app-ui-grid-shell-gap, 1.5rem));--_ui-grid-hero-gap: var(--ui-grid-hero-gap, var(--app-ui-grid-hero-gap, 1.5rem));--_ui-grid-hero-padding-block: var( --ui-grid-hero-padding-block, var(--app-ui-grid-hero-padding-block, 1rem) );--_ui-grid-eyebrow-margin-block-end: var( --ui-grid-eyebrow-margin-block-end, var(--app-ui-grid-eyebrow-margin-block-end, 0.5rem) );--_ui-grid-eyebrow-letter-spacing: var( --ui-grid-eyebrow-letter-spacing, var(--app-ui-grid-eyebrow-letter-spacing, 0.18em) );--_ui-grid-eyebrow-font-size: var( --ui-grid-eyebrow-font-size, var(--app-ui-grid-eyebrow-font-size, 0.72rem) );--_ui-grid-hero-title-font-size: var( --ui-grid-hero-title-font-size, var(--app-ui-grid-hero-title-font-size, clamp(1.4rem, 2vw, 2rem)) );--_ui-grid-hero-title-line-height: var( --ui-grid-hero-title-line-height, var(--app-ui-grid-hero-title-line-height, 1.1) );--_ui-grid-hero-deck-max-width: var( --ui-grid-hero-deck-max-width, var(--app-ui-grid-hero-deck-max-width, 56ch) );--_ui-grid-hero-deck-margin-block-start: var( --ui-grid-hero-deck-margin-block-start, var(--app-ui-grid-hero-deck-margin-block-start, 0.75rem) );--_ui-grid-hero-actions-gap: var( --ui-grid-hero-actions-gap, var(--app-ui-grid-hero-actions-gap, 1rem) );--_ui-grid-action-radius: var(--ui-grid-action-radius, var(--app-ui-grid-action-radius, 999px));--_ui-grid-action-padding-block: var( --ui-grid-action-padding-block, var(--app-ui-grid-action-padding-block, 0.8rem) );--_ui-grid-action-padding-inline: var( --ui-grid-action-padding-inline, var(--app-ui-grid-action-padding-inline, 1.1rem) );--_ui-grid-stats-card-min-width: var( --ui-grid-stats-card-min-width, var(--app-ui-grid-stats-card-min-width, 8rem) );--_ui-grid-stats-card-padding-block: var( --ui-grid-stats-card-padding-block, var(--app-ui-grid-stats-card-padding-block, 0.85rem) );--_ui-grid-stats-card-padding-inline: var( --ui-grid-stats-card-padding-inline, var(--app-ui-grid-stats-card-padding-inline, 1rem) );--_ui-grid-stats-card-value-font-size: var( --ui-grid-stats-card-value-font-size, var(--app-ui-grid-stats-card-value-font-size, 1.9rem) );--_ui-grid-metrics-gap: var(--ui-grid-metrics-gap, var(--app-ui-grid-metrics-gap, 1rem));--_ui-grid-metric-card-padding-block: var( --ui-grid-metric-card-padding-block, var(--app-ui-grid-metric-card-padding-block, 1rem) );--_ui-grid-metric-card-padding-inline: var( --ui-grid-metric-card-padding-inline, var(--app-ui-grid-metric-card-padding-inline, 1.1rem) );--_ui-grid-metric-value-font-size: var( --ui-grid-metric-value-font-size, var(--app-ui-grid-metric-value-font-size, 1.3rem) );--_ui-grid-toolbar-gap: var(--ui-grid-toolbar-gap, var(--app-ui-grid-toolbar-gap, 1rem));--_ui-grid-toolbar-padding-block: var( --ui-grid-toolbar-padding-block, var(--app-ui-grid-toolbar-padding-block, 1rem) );--_ui-grid-toolbar-padding-inline: var( --ui-grid-toolbar-padding-inline, var(--app-ui-grid-toolbar-padding-inline, 1.25rem) );--_ui-grid-toolbar-inline-gap: var( --ui-grid-toolbar-inline-gap, var(--app-ui-grid-toolbar-inline-gap, 0.4rem) );--_ui-grid-overflow-x: var(--ui-grid-overflow-x, var(--app-ui-grid-overflow-x, auto));--_ui-grid-overflow-y: var(--ui-grid-overflow-y, var(--app-ui-grid-overflow-y, auto));--_ui-grid-header-z-index: var(--ui-grid-header-z-index, var(--app-ui-grid-header-z-index, 3));--_ui-grid-pinned-cell-z-index: var( --ui-grid-pinned-cell-z-index, var(--app-ui-grid-pinned-cell-z-index, 2) );--_ui-grid-pin-menu-open-z-index: var( --ui-grid-pin-menu-open-z-index, var(--app-ui-grid-pin-menu-open-z-index, 8) );--_ui-grid-pin-menu-z-index: var(--ui-grid-pin-menu-z-index, var(--app-ui-grid-pin-menu-z-index, 20));--_ui-grid-header-cell-gap: var( --ui-grid-header-cell-gap, var(--app-ui-grid-header-cell-gap, 0.75rem) );--_ui-grid-header-cell-padding-block: var( --ui-grid-header-cell-padding-block, var(--app-ui-grid-header-cell-padding-block, 0.85rem) );--_ui-grid-header-cell-padding-inline: var( --ui-grid-header-cell-padding-inline, var(--app-ui-grid-header-cell-padding-inline, 1rem) );--_ui-grid-header-cell-background-active: var( --ui-grid-header-cell-background-active, var( --app-ui-grid-header-cell-background-active, color-mix(in srgb, var(--_ui-grid-accent) 8%, var(--_ui-grid-header-background)) ) );--_ui-grid-pinned-divider-shadow-left: var( --ui-grid-pinned-divider-shadow-left, var( --app-ui-grid-pinned-divider-shadow-left, 2px 0 4px rgba(0, 0, 0, 0.06) ) );--_ui-grid-pinned-divider-shadow-right: var( --ui-grid-pinned-divider-shadow-right, var( --app-ui-grid-pinned-divider-shadow-right, -2px 0 4px rgba(0, 0, 0, 0.06) ) );--_ui-grid-pinned-divider-clip-left: var( --ui-grid-pinned-divider-clip-left, var(--app-ui-grid-pinned-divider-clip-left, inset(0 -4px 0 0)) );--_ui-grid-pinned-divider-clip-right: var( --ui-grid-pinned-divider-clip-right, var(--app-ui-grid-pinned-divider-clip-right, inset(0 0 0 -4px)) );--_ui-grid-header-actions-gap: var( --ui-grid-header-actions-gap, var(--app-ui-grid-header-actions-gap, 0.4rem) );--_ui-grid-control-size: var(--ui-grid-control-size, var(--app-ui-grid-control-size, 2rem));--_ui-grid-control-radius: var( --ui-grid-control-radius, var(--app-ui-grid-control-radius, 999px) );--_ui-grid-control-icon-size: var( --ui-grid-control-icon-size, var(--app-ui-grid-control-icon-size, 1rem) );--_ui-grid-control-background: var( --ui-grid-control-background, var(--app-ui-grid-control-background, var(--_ui-grid-surface)) );--_ui-grid-control-border-color: var( --ui-grid-control-border-color, var(--app-ui-grid-control-border-color, var(--_ui-grid-border-color)) );--_ui-grid-control-color: var( --ui-grid-control-color, var(--app-ui-grid-control-color, var(--_ui-grid-muted-color)) );--_ui-grid-control-background-active: var( --ui-grid-control-background-active, var( --app-ui-grid-control-background-active, color-mix(in srgb, var(--_ui-grid-accent) 12%, var(--_ui-grid-surface)) ) );--_ui-grid-control-border-color-active: var( --ui-grid-control-border-color-active, var( --app-ui-grid-control-border-color-active, color-mix(in srgb, var(--_ui-grid-accent) 35%, var(--_ui-grid-border-color)) ) );--_ui-grid-control-color-active: var( --ui-grid-control-color-active, var(--app-ui-grid-control-color-active, var(--_ui-grid-accent)) );--_ui-grid-pin-menu-offset-block-start: var( --ui-grid-pin-menu-offset-block-start, var(--app-ui-grid-pin-menu-offset-block-start, 0.35rem) );--_ui-grid-pin-menu-gap: var(--ui-grid-pin-menu-gap, var(--app-ui-grid-pin-menu-gap, 0.25rem));--_ui-grid-pin-menu-padding: var( --ui-grid-pin-menu-padding, var(--app-ui-grid-pin-menu-padding, 0.25rem) );--_ui-grid-pin-menu-radius: var(--ui-grid-pin-menu-radius, var(--app-ui-grid-pin-menu-radius, 999px));--_ui-grid-pin-menu-shadow: var( --ui-grid-pin-menu-shadow, var( --app-ui-grid-pin-menu-shadow, 0 10px 24px color-mix(in srgb, var(--_ui-grid-cell-color) 10%, transparent) ) );--_ui-grid-pin-menu-action-size: var( --ui-grid-pin-menu-action-size, var(--app-ui-grid-pin-menu-action-size, 1.75rem) );--_ui-grid-pin-control-collapsed-size: var( --ui-grid-pin-control-collapsed-size, var(--app-ui-grid-pin-control-collapsed-size, 1px) );--_ui-grid-pin-control-transition-duration: var( --ui-grid-pin-control-transition-duration, var(--app-ui-grid-pin-control-transition-duration, 160ms) );--_ui-grid-pin-control-transition-easing: var( --ui-grid-pin-control-transition-easing, var(--app-ui-grid-pin-control-transition-easing, cubic-bezier(0.22, 1, 0.36, 1)) );--_ui-grid-pin-menu-scale-closed: var( --ui-grid-pin-menu-scale-closed, var(--app-ui-grid-pin-menu-scale-closed, 0.72) );--_ui-grid-filter-cell-padding-block-start: var( --ui-grid-filter-cell-padding-block-start, var(--app-ui-grid-filter-cell-padding-block-start, 0.75rem) );--_ui-grid-filter-cell-padding-block-end: var( --ui-grid-filter-cell-padding-block-end, var(--app-ui-grid-filter-cell-padding-block-end, 1rem) );--_ui-grid-filter-cell-padding-inline: var( --ui-grid-filter-cell-padding-inline, var(--app-ui-grid-filter-cell-padding-inline, 1rem) );--_ui-grid-filter-input-padding-block: var( --ui-grid-filter-input-padding-block, var(--app-ui-grid-filter-input-padding-block, 0.55rem) );--_ui-grid-filter-input-padding-inline: var( --ui-grid-filter-input-padding-inline, var(--app-ui-grid-filter-input-padding-inline, 0.7rem) );--_ui-grid-filter-input-focus-outline: var( --ui-grid-filter-input-focus-outline, var( --app-ui-grid-filter-input-focus-outline, 2px solid color-mix(in srgb, var(--_ui-grid-accent) 18%, transparent) ) );--_ui-grid-body-cell-padding-block: var( --ui-grid-body-cell-padding-block, var(--app-ui-grid-body-cell-padding-block, 0.95rem) );--_ui-grid-body-cell-padding-inline: var( --ui-grid-body-cell-padding-inline, var(--app-ui-grid-body-cell-padding-inline, 1rem) );--_ui-grid-cell-shell-gap: var(--ui-grid-cell-shell-gap, var(--app-ui-grid-cell-shell-gap, 0.55rem));--_ui-grid-row-toggle-size: var(--ui-grid-row-toggle-size, var(--app-ui-grid-row-toggle-size, 1.55rem));--_ui-grid-row-toggle-radius: var( --ui-grid-row-toggle-radius, var(--app-ui-grid-row-toggle-radius, 999px) );--_ui-grid-toggle-icon-size: var( --ui-grid-toggle-icon-size, var(--app-ui-grid-toggle-icon-size, 1.1rem) );--_ui-grid-group-disclosure-icon-size: var( --ui-grid-group-disclosure-icon-size, var(--app-ui-grid-group-disclosure-icon-size, 0.9rem) );--_ui-grid-pagination-icon-size: var( --ui-grid-pagination-icon-size, var(--app-ui-grid-pagination-icon-size, 1.2rem) );--_ui-grid-expandable-row-padding-block: var( --ui-grid-expandable-row-padding-block, var(--app-ui-grid-expandable-row-padding-block, 1rem) );--_ui-grid-expandable-row-padding-inline: var( --ui-grid-expandable-row-padding-inline, var(--app-ui-grid-expandable-row-padding-inline, 1.25rem) );--_ui-grid-expandable-row-background: var( --ui-grid-expandable-row-background, var( --app-ui-grid-expandable-row-background, color-mix(in srgb, var(--_ui-grid-accent) 4%, var(--_ui-grid-surface)) ) );--_ui-grid-cell-focus-background: var( --ui-grid-cell-focus-background, var( --app-ui-grid-cell-focus-background, color-mix(in srgb, var(--_ui-grid-accent) 14%, var(--_ui-grid-surface)) ) );--_ui-grid-cell-focus-ring: var( --ui-grid-cell-focus-ring, var( --app-ui-grid-cell-focus-ring, inset 0 0 0 1px color-mix(in srgb, var(--_ui-grid-accent) 28%, transparent) ) );--_ui-grid-cell-editing-background: var( --ui-grid-cell-editing-background, var( --app-ui-grid-cell-editing-background, color-mix(in srgb, var(--_ui-grid-accent) 7%, var(--_ui-grid-surface)) ) );--_ui-grid-cell-editor-border-color: var( --ui-grid-cell-editor-border-color, var( --app-ui-grid-cell-editor-border-color, color-mix(in srgb, var(--_ui-grid-accent) 45%, var(--_ui-grid-border-color)) ) );--_ui-grid-cell-editor-radius: var( --ui-grid-cell-editor-radius, var(--app-ui-grid-cell-editor-radius, calc(var(--_ui-grid-radius) - 1px)) );--_ui-grid-cell-editor-padding-block: var( --ui-grid-cell-editor-padding-block, var(--app-ui-grid-cell-editor-padding-block, 0.45rem) );--_ui-grid-cell-editor-padding-inline: var( --ui-grid-cell-editor-padding-inline, var(--app-ui-grid-cell-editor-padding-inline, 0.55rem) );--_ui-grid-cell-editor-focus-outline: var( --ui-grid-cell-editor-focus-outline, var( --app-ui-grid-cell-editor-focus-outline, 2px solid color-mix(in srgb, var(--_ui-grid-accent) 18%, transparent) ) );--_ui-grid-group-row-gap: var(--ui-grid-group-row-gap, var(--app-ui-grid-group-row-gap, 0.9rem));--_ui-grid-group-row-padding-block: var( --ui-grid-group-row-padding-block, var(--app-ui-grid-group-row-padding-block, 0.9rem) );--_ui-grid-group-row-padding-inline: var( --ui-grid-group-row-padding-inline, var(--app-ui-grid-group-row-padding-inline, 1rem) );--_ui-grid-drag-preview-shadow: var( --ui-grid-drag-preview-shadow, var(--app-ui-grid-drag-preview-shadow, 0 12px 30px rgba(15, 23, 42, 0.16)) );--_ui-grid-drag-preview-radius: var( --ui-grid-drag-preview-radius, var(--app-ui-grid-drag-preview-radius, 0.9rem) );--_ui-grid-drag-placeholder-opacity: var( --ui-grid-drag-placeholder-opacity, var(--app-ui-grid-drag-placeholder-opacity, 0.3) );--_ui-grid-drag-placeholder-background: var( --ui-grid-drag-placeholder-background, var( --app-ui-grid-drag-placeholder-background, color-mix(in srgb, var(--_ui-grid-accent) 9%, var(--_ui-grid-header-background)) ) );--_ui-grid-drag-placeholder-border: var( --ui-grid-drag-placeholder-border, var( --app-ui-grid-drag-placeholder-border, 1px dashed color-mix(in srgb, var(--_ui-grid-accent) 45%, var(--_ui-grid-border-color)) ) );--_ui-grid-drag-placeholder-shadow: var( --ui-grid-drag-placeholder-shadow, var( --app-ui-grid-drag-placeholder-shadow, inset 0 0 0 1px color-mix(in srgb, var(--_ui-grid-accent) 18%, transparent) ) );--_ui-grid-empty-state-gap: var( --ui-grid-empty-state-gap, var(--app-ui-grid-empty-state-gap, 0.35rem) );--_ui-grid-empty-state-min-height: var( --ui-grid-empty-state-min-height, var(--app-ui-grid-empty-state-min-height, 16rem) );--_ui-grid-empty-state-padding: var( --ui-grid-empty-state-padding, var(--app-ui-grid-empty-state-padding, 2rem) );--_ui-grid-pagination-gap: var(--ui-grid-pagination-gap, var(--app-ui-grid-pagination-gap, 1rem));--_ui-grid-pagination-padding-block: var( --ui-grid-pagination-padding-block, var(--app-ui-grid-pagination-padding-block, 0.85rem) );--_ui-grid-pagination-padding-inline: var( --ui-grid-pagination-padding-inline, var(--app-ui-grid-pagination-padding-inline, 1.25rem) );--_ui-grid-pagination-controls-gap: var( --ui-grid-pagination-controls-gap, var(--app-ui-grid-pagination-controls-gap, 0.75rem) );--_ui-grid-pagination-size-gap: var( --ui-grid-pagination-size-gap, var(--app-ui-grid-pagination-size-gap, 0.4rem) );--_ui-grid-pagination-button-padding-block: var( --ui-grid-pagination-button-padding-block, var(--app-ui-grid-pagination-button-padding-block, 0.45rem) );--_ui-grid-pagination-button-padding-inline: var( --ui-grid-pagination-button-padding-inline, var(--app-ui-grid-pagination-button-padding-inline, 0.8rem) );--_ui-grid-pagination-select-padding-block: var( --ui-grid-pagination-select-padding-block, var(--app-ui-grid-pagination-select-padding-block, 0.35rem) );--_ui-grid-pagination-select-padding-inline: var( --ui-grid-pagination-select-padding-inline, var(--app-ui-grid-pagination-select-padding-inline, 0.55rem) );--_ui-grid-status-pill-padding-block: var( --ui-grid-status-pill-padding-block, var(--app-ui-grid-status-pill-padding-block, 0.2rem) );--_ui-grid-status-pill-padding-inline: var( --ui-grid-status-pill-padding-inline, var(--app-ui-grid-status-pill-padding-inline, 0.55rem) );--_ui-grid-status-pill-radius: var( --ui-grid-status-pill-radius, var(--app-ui-grid-status-pill-radius, 999px) );--_ui-grid-status-pill-font-size: var( --ui-grid-status-pill-font-size, var(--app-ui-grid-status-pill-font-size, 0.85rem) );--_ui-grid-status-pill-default-bg: var( --ui-grid-status-pill-default-bg, var(--app-ui-grid-status-pill-default-bg, rgba(15, 23, 42, 0.07)) );display:block;color:var(--_ui-grid-cell-color)}:host *,:host *::before,:host *::after{--ui-grid-border-color: var(--_ui-grid-border-color);--ui-grid-header-background: var(--_ui-grid-header-background);--ui-grid-row-odd: var(--_ui-grid-row-odd);--ui-grid-row-even: var(--_ui-grid-row-even);--ui-grid-row-hover: var(--_ui-grid-row-hover);--ui-grid-row-focus-background: var(--_ui-grid-row-focus-background);--ui-grid-cell-color: var(--_ui-grid-cell-color);--ui-grid-muted-color: var(--_ui-grid-muted-color);--ui-grid-surface: var(--_ui-grid-surface);--ui-grid-radius: var(--_ui-grid-radius);--ui-grid-shadow: var(--_ui-grid-shadow);--ui-grid-header-weight: var(--_ui-grid-header-weight);--ui-grid-accent: var(--_ui-grid-accent);--ui-grid-group-background: var(--_ui-grid-group-background);--ui-grid-status-active-bg: var(--_ui-grid-status-active-bg);--ui-grid-status-active-color: var(--_ui-grid-status-active-color);--ui-grid-status-expansion-bg: var(--_ui-grid-status-expansion-bg);--ui-grid-status-expansion-color: var(--_ui-grid-status-expansion-color);--ui-grid-status-enterprise-bg: var(--_ui-grid-status-enterprise-bg);--ui-grid-status-enterprise-color: var(--_ui-grid-status-enterprise-color);--ui-grid-status-pilot-bg: var(--_ui-grid-status-pilot-bg);--ui-grid-status-pilot-color: var(--_ui-grid-status-pilot-color);--ui-grid-shell-gap: var(--_ui-grid-shell-gap);--ui-grid-hero-gap: var(--_ui-grid-hero-gap);--ui-grid-hero-padding-block: var(--_ui-grid-hero-padding-block);--ui-grid-eyebrow-margin-block-end: var(--_ui-grid-eyebrow-margin-block-end);--ui-grid-eyebrow-letter-spacing: var(--_ui-grid-eyebrow-letter-spacing);--ui-grid-eyebrow-font-size: var(--_ui-grid-eyebrow-font-size);--ui-grid-hero-title-font-size: var(--_ui-grid-hero-title-font-size);--ui-grid-hero-title-line-height: var(--_ui-grid-hero-title-line-height);--ui-grid-hero-deck-max-width: var(--_ui-grid-hero-deck-max-width);--ui-grid-hero-deck-margin-block-start: var(--_ui-grid-hero-deck-margin-block-start);--ui-grid-hero-actions-gap: var(--_ui-grid-hero-actions-gap);--ui-grid-action-radius: var(--_ui-grid-action-radius);--ui-grid-action-padding-block: var(--_ui-grid-action-padding-block);--ui-grid-action-padding-inline: var(--_ui-grid-action-padding-inline);--ui-grid-stats-card-min-width: var(--_ui-grid-stats-card-min-width);--ui-grid-stats-card-padding-block: var(--_ui-grid-stats-card-padding-block);--ui-grid-stats-card-padding-inline: var(--_ui-grid-stats-card-padding-inline);--ui-grid-stats-card-value-font-size: var(--_ui-grid-stats-card-value-font-size);--ui-grid-metrics-gap: var(--_ui-grid-metrics-gap);--ui-grid-metric-card-padding-block: var(--_ui-grid-metric-card-padding-block);--ui-grid-metric-card-padding-inline: var(--_ui-grid-metric-card-padding-inline);--ui-grid-metric-value-font-size: var(--_ui-grid-metric-value-font-size);--ui-grid-toolbar-gap: var(--_ui-grid-toolbar-gap);--ui-grid-toolbar-padding-block: var(--_ui-grid-toolbar-padding-block);--ui-grid-toolbar-padding-inline: var(--_ui-grid-toolbar-padding-inline);--ui-grid-toolbar-inline-gap: var(--_ui-grid-toolbar-inline-gap);--ui-grid-overflow-x: var(--_ui-grid-overflow-x);--ui-grid-overflow-y: var(--_ui-grid-overflow-y);--ui-grid-header-z-index: var(--_ui-grid-header-z-index);--ui-grid-pinned-cell-z-index: var(--_ui-grid-pinned-cell-z-index);--ui-grid-pin-menu-open-z-index: var(--_ui-grid-pin-menu-open-z-index);--ui-grid-pin-menu-z-index: var(--_ui-grid-pin-menu-z-index);--ui-grid-header-cell-gap: var(--_ui-grid-header-cell-gap);--ui-grid-header-cell-padding-block: var(--_ui-grid-header-cell-padding-block);--ui-grid-header-cell-padding-inline: var(--_ui-grid-header-cell-padding-inline);--ui-grid-header-cell-background-active: var(--_ui-grid-header-cell-background-active);--ui-grid-pinned-divider-shadow-left: var(--_ui-grid-pinned-divider-shadow-left);--ui-grid-pinned-divider-shadow-right: var(--_ui-grid-pinned-divider-shadow-right);--ui-grid-pinned-divider-clip-left: var(--_ui-grid-pinned-divider-clip-left);--ui-grid-pinned-divider-clip-right: var(--_ui-grid-pinned-divider-clip-right);--ui-grid-header-actions-gap: var(--_ui-grid-header-actions-gap);--ui-grid-control-size: var(--_ui-grid-control-size);--ui-grid-control-radius: var(--_ui-grid-control-radius);--ui-grid-control-icon-size: var(--_ui-grid-control-icon-size);--ui-grid-control-background: var(--_ui-grid-control-background);--ui-grid-control-border-color: var(--_ui-grid-control-border-color);--ui-grid-control-color: var(--_ui-grid-control-color);--ui-grid-control-background-active: var(--_ui-grid-control-background-active);--ui-grid-control-border-color-active: var(--_ui-grid-control-border-color-active);--ui-grid-control-color-active: var(--_ui-grid-control-color-active);--ui-grid-pin-menu-offset-block-start: var(--_ui-grid-pin-menu-offset-block-start);--ui-grid-pin-menu-gap: var(--_ui-grid-pin-menu-gap);--ui-grid-pin-menu-padding: var(--_ui-grid-pin-menu-padding);--ui-grid-pin-menu-radius: var(--_ui-grid-pin-menu-radius);--ui-grid-pin-menu-shadow: var(--_ui-grid-pin-menu-shadow);--ui-grid-pin-menu-action-size: var(--_ui-grid-pin-menu-action-size);--ui-grid-pin-control-collapsed-size: var(--_ui-grid-pin-control-collapsed-size);--ui-grid-pin-control-transition-duration: var(--_ui-grid-pin-control-transition-duration);--ui-grid-pin-control-transition-easing: var(--_ui-grid-pin-control-transition-easing);--ui-grid-pin-menu-scale-closed: var(--_ui-grid-pin-menu-scale-closed);--ui-grid-filter-cell-padding-block-start: var(--_ui-grid-filter-cell-padding-block-start);--ui-grid-filter-cell-padding-block-end: var(--_ui-grid-filter-cell-padding-block-end);--ui-grid-filter-cell-padding-inline: var(--_ui-grid-filter-cell-padding-inline);--ui-grid-filter-input-padding-block: var(--_ui-grid-filter-input-padding-block);--ui-grid-filter-input-padding-inline: var(--_ui-grid-filter-input-padding-inline);--ui-grid-filter-input-focus-outline: var(--_ui-grid-filter-input-focus-outline);--ui-grid-body-cell-padding-block: var(--_ui-grid-body-cell-padding-block);--ui-grid-body-cell-padding-inline: var(--_ui-grid-body-cell-padding-inline);--ui-grid-cell-shell-gap: var(--_ui-grid-cell-shell-gap);--ui-grid-row-toggle-size: var(--_ui-grid-row-toggle-size);--ui-grid-row-toggle-radius: var(--_ui-grid-row-toggle-radius);--ui-grid-toggle-icon-size: var(--_ui-grid-toggle-icon-size);--ui-grid-group-disclosure-icon-size: var(--_ui-grid-group-disclosure-icon-size);--ui-grid-pagination-icon-size: var(--_ui-grid-pagination-icon-size);--ui-grid-expandable-row-padding-block: var(--_ui-grid-expandable-row-padding-block);--ui-grid-expandable-row-padding-inline: var(--_ui-grid-expandable-row-padding-inline);--ui-grid-expandable-row-background: var(--_ui-grid-expandable-row-background);--ui-grid-cell-focus-background: var(--_ui-grid-cell-focus-background);--ui-grid-cell-focus-ring: var(--_ui-grid-cell-focus-ring);--ui-grid-cell-editing-background: var(--_ui-grid-cell-editing-background);--ui-grid-cell-editor-border-color: var(--_ui-grid-cell-editor-border-color);--ui-grid-cell-editor-radius: var(--_ui-grid-cell-editor-radius);--ui-grid-cell-editor-padding-block: var(--_ui-grid-cell-editor-padding-block);--ui-grid-cell-editor-padding-inline: var(--_ui-grid-cell-editor-padding-inline);--ui-grid-cell-editor-focus-outline: var(--_ui-grid-cell-editor-focus-outline);--ui-grid-group-row-gap: var(--_ui-grid-group-row-gap);--ui-grid-group-row-padding-block: var(--_ui-grid-group-row-padding-block);--ui-grid-group-row-padding-inline: var(--_ui-grid-group-row-padding-inline);--ui-grid-drag-preview-shadow: var(--_ui-grid-drag-preview-shadow);--ui-grid-drag-preview-radius: var(--_ui-grid-drag-preview-radius);--ui-grid-drag-placeholder-opacity: var(--_ui-grid-drag-placeholder-opacity);--ui-grid-drag-placeholder-background: var(--_ui-grid-drag-placeholder-background);--ui-grid-drag-placeholder-border: var(--_ui-grid-drag-placeholder-border);--ui-grid-drag-placeholder-shadow: var(--_ui-grid-drag-placeholder-shadow);--ui-grid-empty-state-gap: var(--_ui-grid-empty-state-gap);--ui-grid-empty-state-min-height: var(--_ui-grid-empty-state-min-height);--ui-grid-empty-state-padding: var(--_ui-grid-empty-state-padding);--ui-grid-pagination-gap: var(--_ui-grid-pagination-gap);--ui-grid-pagination-padding-block: var(--_ui-grid-pagination-padding-block);--ui-grid-pagination-padding-inline: var(--_ui-grid-pagination-padding-inline);--ui-grid-pagination-controls-gap: var(--_ui-grid-pagination-controls-gap);--ui-grid-pagination-size-gap: var(--_ui-grid-pagination-size-gap);--ui-grid-pagination-button-padding-block: var(--_ui-grid-pagination-button-padding-block);--ui-grid-pagination-button-padding-inline: var(--_ui-grid-pagination-button-padding-inline);--ui-grid-pagination-select-padding-block: var(--_ui-grid-pagination-select-padding-block);--ui-grid-pagination-select-padding-inline: var(--_ui-grid-pagination-select-padding-inline);--ui-grid-status-pill-padding-block: var(--_ui-grid-status-pill-padding-block);--ui-grid-status-pill-padding-inline: var(--_ui-grid-status-pill-padding-inline);--ui-grid-status-pill-radius: var(--_ui-grid-status-pill-radius);--ui-grid-status-pill-font-size: var(--_ui-grid-status-pill-font-size);--ui-grid-status-pill-default-bg: var(--_ui-grid-status-pill-default-bg);box-sizing:border-box}:host{isolation:isolate;contain:layout paint}.grid-shell{display:grid;gap:var(--ui-grid-shell-gap)}.grid-hero{display:flex;justify-content:space-between;gap:var(--ui-grid-hero-gap);align-items:end;padding:var(--ui-grid-hero-padding-block) 0;color:var(--ui-grid-cell-color)}.eyebrow{margin:0 0 var(--ui-grid-eyebrow-margin-block-end);text-transform:uppercase;letter-spacing:var(--ui-grid-eyebrow-letter-spacing);font-size:var(--ui-grid-eyebrow-font-size);color:var(--ui-grid-muted-color)}h1{margin:0;font-size:var(--ui-grid-hero-title-font-size);line-height:var(--ui-grid-hero-title-line-height)}.deck{max-width:var(--ui-grid-hero-deck-max-width);margin:var(--ui-grid-hero-deck-margin-block-start) 0 0;color:var(--ui-grid-muted-color)}.hero-actions{display:flex;gap:var(--ui-grid-hero-actions-gap);align-items:center;flex-wrap:wrap}.action{border:0;border-radius:var(--ui-grid-action-radius);padding:var(--ui-grid-action-padding-block) var(--ui-grid-action-padding-inline);font:inherit;cursor:pointer}.action-secondary{background:var(--ui-grid-surface);color:var(--ui-grid-cell-color);border:1px solid var(--ui-grid-border-color)}.stats-card{min-width:var(--ui-grid-stats-card-min-width);padding:var(--ui-grid-stats-card-padding-block) var(--ui-grid-stats-card-padding-inline);border-radius:var(--ui-grid-radius);background:var(--ui-grid-surface);border:1px solid var(--ui-grid-border-color);display:grid}.stats-card span{font-size:var(--ui-grid-stats-card-value-font-size);font-weight:700}.stats-card small{color:var(--ui-grid-muted-color)}.grid-frame{display:grid;grid-template-rows:auto minmax(0, 1fr) auto;height:100%;min-height:0;border-radius:var(--ui-grid-radius);background:var(--ui-grid-surface);border:1px solid var(--ui-grid-border-color);box-shadow:var(--ui-grid-shadow);overflow:hidden}.metrics-strip{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:var(--ui-grid-metrics-gap)}.metrics-strip article{padding:var(--ui-grid-metric-card-padding-block) var(--ui-grid-metric-card-padding-inline);border-radius:var(--ui-grid-radius);background:var(--ui-grid-surface);border:1px solid var(--ui-grid-border-color);display:grid}.metrics-strip strong{font-size:var(--ui-grid-metric-value-font-size)}.metrics-strip span{color:var(--ui-grid-muted-color)}.grid-toolbar{display:flex;justify-content:space-between;gap:var(--ui-grid-toolbar-gap);padding:var(--ui-grid-toolbar-padding-block) var(--ui-grid-toolbar-padding-inline);align-items:center;background:var(--ui-grid-header-background);border-bottom:1px solid var(--ui-grid-border-color)}.grid-toolbar div{display:flex;gap:var(--ui-grid-toolbar-inline-gap);align-items:baseline}.grid-toolbar p{margin:0;color:var(--ui-grid-muted-color)}.grid-table{position:relative;height:100%;min-height:0;width:100%;min-width:0;display:flex;flex-direction:column;background:var(--ui-grid-surface);overflow-anchor:none}.grid-header-strip,.grid-filter-strip{flex:0 0 auto;position:sticky;z-index:var(--ui-grid-header-z-index);background:var(--ui-grid-surface);overflow:hidden}.grid-header-strip{top:0}.grid-filter-strip{top:var(--ui-grid-header-sticky-top, 0px)}.grid-body-viewport{flex:1 1 auto;min-height:0;overflow-x:auto;overflow-anchor:none;overscroll-behavior-x:none}.header-grid,.filter-grid,.body-grid{display:grid;width:100%;min-width:max-content}.header-cell,.filter-cell,.body-cell,.group-row{min-width:0}.header-cell{display:grid;grid-template-columns:minmax(0, 1fr) auto;gap:var(--ui-grid-header-cell-gap);padding:var(--ui-grid-header-cell-padding-block) var(--ui-grid-header-cell-padding-inline);border-bottom:1px solid var(--ui-grid-border-color);background:var(--ui-grid-header-background);font-weight:var(--ui-grid-header-weight);align-items:center;position:relative}.header-cell.is-active{background:var(--ui-grid-header-cell-background-active)}.header-cell[draggable=true]{cursor:grab}.header-cell.is-dragging{opacity:.6}.header-cell.is-drag-target{background:color-mix(in srgb, var(--ui-grid-accent) 9%, var(--ui-grid-header-background));border:1px dashed color-mix(in srgb, var(--ui-grid-accent) 45%, var(--ui-grid-border-color));box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ui-grid-accent) 18%, transparent)}.header-cell.is-pin-menu-open{z-index:var(--ui-grid-pin-menu-open-z-index)}.header-cell.is-pinned,.filter-cell.is-pinned,.body-cell.is-pinned{position:sticky;z-index:var(--ui-grid-pinned-cell-z-index);background:var(--ui-grid-surface)}.header-cell.is-pinned{background:var(--ui-grid-header-background)}.body-cell.is-pinned.body-cell-odd{background:var(--ui-grid-row-odd)}.body-cell.is-pinned:not(.body-cell-odd){background:var(--ui-grid-row-even)}.header-cell.is-pinned-left-last,.filter-cell.is-pinned-left-last,.body-cell.is-pinned-left-last{box-shadow:var(--ui-grid-pinned-divider-shadow-left);clip-path:var(--ui-grid-pinned-divider-clip-left)}.header-cell.is-pinned-right-first,.filter-cell.is-pinned-right-first,.body-cell.is-pinned-right-first{box-shadow:var(--ui-grid-pinned-divider-shadow-right);clip-path:var(--ui-grid-pinned-divider-clip-right)}.header-label{min-width:0;display:block;white-space:nowrap;overflow:hidden;text-overflow:clip;hyphens:none}.header-actions{display:inline-flex;align-items:center;gap:var(--ui-grid-header-actions-gap);justify-self:end}.column-resizer{position:absolute;top:0;right:-4px;width:8px;height:100%;padding:0;border:0;background:rgba(0,0,0,0);cursor:col-resize;z-index:5}.column-resizer::after{content:"";position:absolute;top:20%;bottom:20%;left:50%;width:2px;transform:translateX(-50%);border-radius:999px;background:color-mix(in srgb, var(--_ui-grid-border-color) 80%, transparent);opacity:0;transition:opacity 120ms ease}.header-cell:hover .column-resizer::after,.column-resizer:focus-visible::after{opacity:1}.pin-control{position:relative;display:inline-grid;place-items:center;justify-items:center;min-width:var(--ui-grid-control-size);overflow:hidden}.header-action,.chip-action{display:inline-flex;align-items:center;justify-content:center;width:var(--ui-grid-control-size);height:var(--ui-grid-control-size);display:flex;border:0;background:var(--ui-grid-control-background);padding:0;font:inherit;border-radius:var(--ui-grid-control-radius);cursor:pointer}.header-action-disabled{cursor:default}.header-action svg,.chip-action svg{width:var(--ui-grid-control-icon-size);height:var(--ui-grid-control-icon-size);fill:currentColor}.header-action{color:var(--ui-grid-control-color);border:1px solid var(--ui-grid-control-border-color)}.header-cell.is-active .header-action{color:var(--ui-grid-control-color-active);border-color:var(--ui-grid-control-border-color-active)}.chip-action{border:1px solid var(--ui-grid-control-border-color);color:var(--ui-grid-control-color)}.chip-action-active{background:var(--ui-grid-control-background-active);border-color:var(--ui-grid-control-border-color-active);color:var(--ui-grid-control-color-active)}.pin-trigger{grid-area:1/1;transform-origin:center;transition:width var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),height var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),opacity var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),transform var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),border-color var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),background-color var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),color var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing)}.pin-menu{grid-area:1/1;z-index:var(--ui-grid-pin-menu-z-index);display:grid;grid-auto-rows:var(--ui-grid-pin-menu-action-size);gap:var(--ui-grid-pin-menu-gap);padding:var(--ui-grid-pin-menu-padding);border:1px solid var(--ui-grid-border-color);border-radius:var(--ui-grid-pin-menu-radius);background:var(--ui-grid-surface);box-shadow:var(--ui-grid-pin-menu-shadow);justify-items:center;align-items:center;width:var(--ui-grid-control-size);max-height:var(--ui-grid-pin-control-collapsed-size);opacity:0;pointer-events:none;transform:scale(var(--ui-grid-pin-menu-scale-closed));transform-origin:center;transition:max-height var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),opacity var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),transform var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),padding var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),border-color var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing),box-shadow var(--ui-grid-pin-control-transition-duration) var(--ui-grid-pin-control-transition-easing)}.pin-control-open{align-items:start}.pin-control-open .pin-trigger{width:var(--ui-grid-pin-control-collapsed-size);height:var(--ui-grid-pin-control-collapsed-size);opacity:0;transform:scale(0.72);pointer-events:none}.pin-control-open .pin-menu{max-height:calc(var(--ui-grid-pin-menu-action-size)*2 + var(--ui-grid-pin-menu-gap) + var(--ui-grid-pin-menu-padding)*2);opacity:1;pointer-events:auto;transform:scale(1)}.pin-menu-action{display:inline-flex;align-items:center;justify-content:center;width:var(--ui-grid-pin-menu-action-size);height:var(--ui-grid-pin-menu-action-size);border:0;border-radius:var(--ui-grid-control-radius);background:rgba(0,0,0,0);color:var(--ui-grid-control-color);cursor:pointer}.pin-menu-action:hover,.pin-menu-action:focus-visible{outline:0;background:var(--ui-grid-control-background-active);color:var(--ui-grid-control-color-active)}.pin-menu-action svg{width:var(--ui-grid-control-icon-size);height:var(--ui-grid-control-icon-size);fill:currentColor}.body-cell{padding:var(--ui-grid-body-cell-padding-block) var(--ui-grid-body-cell-padding-inline);border-bottom:1px solid var(--ui-grid-border-color);color:var(--ui-grid-cell-color);background:var(--ui-grid-row-even);outline:0}.body-cell.body-cell-odd{background:var(--ui-grid-row-odd)}.cell-shell{display:flex;align-items:center;gap:var(--ui-grid-cell-shell-gap);min-width:0}.cell-value{min-width:0;flex:1 1 auto}.row-toggle{border:1px solid var(--ui-grid-border-color);background:var(--ui-grid-surface);color:var(--ui-grid-cell-color);width:var(--ui-grid-row-toggle-size);height:var(--ui-grid-row-toggle-size);border-radius:var(--ui-grid-row-toggle-radius);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto;padding:0;font:inherit}.toggle-icon{width:var(--ui-grid-toggle-icon-size);height:var(--ui-grid-toggle-icon-size);fill:currentColor;pointer-events:none}.group-disclosure-icon{width:var(--ui-grid-group-disclosure-icon-size);height:var(--ui-grid-group-disclosure-icon-size)}.pagination-icon{width:var(--ui-grid-pagination-icon-size);height:var(--ui-grid-pagination-icon-size);fill:currentColor}.expandable-row{padding:var(--ui-grid-expandable-row-padding-block) var(--ui-grid-expandable-row-padding-inline);border-bottom:1px solid var(--ui-grid-border-color);background:var(--ui-grid-expandable-row-background)}.body-grid>.body-cell:hover:not(.row-focused):not(.cell-focused):not(.cell-editing){background:var(--ui-grid-row-hover);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ui-grid-accent) 10%, transparent)}.body-cell.row-focused,.body-grid>.body-cell.row-focused{background:var(--ui-grid-row-focus-background)}.body-cell.cell-focused,.body-grid>.body-cell.cell-focused{background:var(--ui-grid-cell-focus-background);box-shadow:var(--ui-grid-cell-focus-ring)}.body-cell.cell-editing,.body-grid>.body-cell.cell-editing{background:var(--ui-grid-cell-editing-background)}.cell-editor{display:block;width:100%;min-width:0;max-width:100%;border:1px solid var(--ui-grid-cell-editor-border-color);border-radius:var(--ui-grid-cell-editor-radius);background:var(--ui-grid-surface);color:var(--ui-grid-cell-color);padding:var(--ui-grid-cell-editor-padding-block) var(--ui-grid-cell-editor-padding-inline);font:inherit}.cell-editor:focus{outline:var(--ui-grid-cell-editor-focus-outline)}.grid-viewport{width:100%}.grid-virtual-spacer{position:relative;width:max-content;min-width:100%}.grid-virtual-body{position:absolute;left:0}.body-cell.align-center{text-align:center}.body-cell.align-end{text-align:right}.empty-state{display:grid;place-items:center;gap:var(--ui-grid-empty-state-gap);min-height:var(--ui-grid-empty-state-min-height);text-align:center;padding:var(--ui-grid-empty-state-padding);color:var(--ui-grid-muted-color);background:var(--ui-grid-surface)}.empty-state p,.empty-state strong{margin:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.status-pill{display:inline-flex;align-items:center;justify-content:center;padding:var(--ui-grid-status-pill-padding-block) var(--ui-grid-status-pill-padding-inline);border-radius:var(--ui-grid-status-pill-radius);background:var(--ui-grid-status-pill-default-bg);color:var(--ui-grid-cell-color);font-size:var(--ui-grid-status-pill-font-size);font-weight:700}.status-pill-enterprise{background:var(--ui-grid-status-enterprise-bg);color:var(--ui-grid-status-enterprise-color)}.status-pill-active{background:var(--ui-grid-status-active-bg);color:var(--ui-grid-status-active-color)}.status-pill-expansion{background:var(--ui-grid-status-expansion-bg);color:var(--ui-grid-status-expansion-color)}.status-pill-pilot{background:var(--ui-grid-status-pilot-bg);color:var(--ui-grid-status-pilot-color)}@media(max-width: 900px){.metrics-strip{grid-template-columns:repeat(2, minmax(0, 1fr))}.grid-hero,.grid-toolbar{grid-template-columns:1fr;display:grid}.hero-actions{justify-content:space-between}}@media(max-width: 640px){.metrics-strip{grid-template-columns:1fr}}.ui-grid-row-selected,.body-cell.ui-grid-row-selected{background:var(--ui-grid-row-selected-bg, var(--app-ui-grid-row-selected-bg, color-mix(in srgb, var(--ui-grid-accent, #2563eb) 22%, var(--ui-grid-surface, #ffffff))));color:var(--ui-grid-row-selected-color, var(--app-ui-grid-row-selected-color, var(--ui-grid-cell-color)))}.body-cell.ui-grid-row-selected.body-cell-odd{background:var(--ui-grid-row-selected-bg-odd, var(--app-ui-grid-row-selected-bg-odd, color-mix(in srgb, var(--ui-grid-accent, #2563eb) 26%, var(--ui-grid-surface, #ffffff))))}.ui-grid-row-focused,.body-cell.ui-grid-row-focused{outline:1px dashed var(--ui-grid-accent, #2563eb);outline-offset:-1px}.body-cell[data-column=selectionRowHeaderCol],.header-cell[data-column=selectionRowHeaderCol],.filter-cell[data-column=selectionRowHeaderCol]{padding:0 !important;cursor:pointer;user-select:none;-webkit-user-select:none;display:flex;align-items:center;justify-content:center}.body-cell[data-column=selectionRowHeaderCol]>.cell-shell,.body-cell[data-column=selectionRowHeaderCol]>.cell-shell>.cell-content{padding:0 !important;padding-inline-start:0 !important;margin:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.filter-cell[data-column=selectionRowHeaderCol]{padding:0;background:var(--_ui-grid-header-background, var(--ui-grid-header-background, transparent));border-bottom:1px solid var(--_ui-grid-border-color, var(--ui-grid-border-color, transparent))}.ui-grid-selection-row-header-buttons{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;cursor:pointer}.ui-grid-selection-checkbox{display:inline-block;width:16px;height:16px;box-sizing:border-box;border:2px solid currentColor;border-radius:3px;background:rgba(0,0,0,0);color:var(--ui-grid-cell-color, currentColor);position:relative;transition:background 120ms ease,border-color 120ms ease,color 120ms ease;opacity:.7}.ui-grid-selection-row-header-buttons:hover .ui-grid-selection-checkbox{opacity:1;color:var(--ui-grid-accent, var(--_ui-grid-accent, #2563eb))}.ui-grid-selection-checkbox-checked{background:var(--ui-grid-accent, var(--_ui-grid-accent, #2563eb));color:var(--ui-grid-accent, var(--_ui-grid-accent, #2563eb));border-color:var(--ui-grid-accent, var(--_ui-grid-accent, #2563eb));opacity:1}.ui-grid-selection-checkbox-checked::after{content:"";position:absolute;left:3px;top:0;width:5px;height:9px;border:2px solid var(--ui-grid-surface, var(--_ui-grid-surface, #ffffff));border-top:0;border-left:0;transform:rotate(45deg)}.ui-grid-selection-checkbox-disabled{opacity:.3;cursor:not-allowed}.ui-grid-selection-select-all{display:inline-flex;align-items:center;justify-content:center;background:rgba(0,0,0,0);border:0;padding:0;margin:0;cursor:pointer;width:100%;height:100%}.ui-grid-selection-select-all:focus-visible{outline:2px solid var(--_ui-grid-accent, var(--ui-grid-accent, #2563eb));outline-offset:-2px}.grid-body-viewport:has([data-column=selectionRowHeaderCol]){user-select:none;-webkit-user-select:none}.body-cell.ui-grid-row-dirty{color:var(--ui-grid-row-dirty-color, var(--app-ui-grid-row-dirty-color, #610B38));background:var(--ui-grid-row-dirty-bg, var(--app-ui-grid-row-dirty-bg, color-mix(in srgb, var(--ui-grid-accent, #2563eb) 8%, var(--ui-grid-surface, #ffffff))))}.body-cell.ui-grid-row-saving{color:var(--ui-grid-row-saving-color, var(--app-ui-grid-row-saving-color, #848484)) !important;opacity:var(--ui-grid-row-saving-opacity, 0.75);cursor:progress}.body-cell.ui-grid-row-error{color:var(--ui-grid-row-error-color, var(--app-ui-grid-row-error-color, #FF0000)) !important;background:var(--ui-grid-row-error-bg, var(--app-ui-grid-row-error-bg, color-mix(in srgb, #ff0000 14%, var(--ui-grid-surface, #ffffff))))}.body-cell.ui-grid-cell-invalid{position:relative;background:var(--ui-grid-cell-invalid-bg, var(--app-ui-grid-cell-invalid-bg, color-mix(in srgb, #ff0000 10%, var(--ui-grid-surface, #ffffff))))}.body-cell.ui-grid-cell-invalid::after{content:"";position:absolute;top:0;right:0;width:0;height:0;border-style:solid;border-width:0 var(--ui-grid-cell-invalid-marker-size, 8px) var(--ui-grid-cell-invalid-marker-size, 8px) 0;border-color:rgba(0,0,0,0) var(--ui-grid-cell-invalid-marker-color, #ff0000) rgba(0,0,0,0) rgba(0,0,0,0);pointer-events:none}.filter-cell{padding:var(--ui-grid-filter-cell-padding-block-start) var(--ui-grid-filter-cell-padding-inline) var(--ui-grid-filter-cell-padding-block-end);border-bottom:1px solid var(--ui-grid-border-color);background:var(--ui-grid-header-background)}.filter-cell input{width:100%;min-width:0;box-sizing:border-box;border:1px solid var(--ui-grid-border-color);border-radius:var(--ui-grid-radius);background:var(--ui-grid-surface);padding:var(--ui-grid-filter-input-padding-block) var(--ui-grid-filter-input-padding-inline);font:inherit}.filter-cell input:focus{outline:var(--ui-grid-filter-input-focus-outline);border-color:var(--ui-grid-accent)}.group-row{display:flex;align-items:center;gap:var(--ui-grid-group-row-gap);border:0;width:100%;padding:var(--ui-grid-group-row-padding-block) var(--ui-grid-group-row-padding-inline);background:var(--ui-grid-group-background);border-bottom:1px solid var(--ui-grid-border-color);color:var(--ui-grid-cell-color);cursor:pointer;text-align:left}.group-row span,.group-row small{color:var(--ui-grid-muted-color)}.pagination-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--ui-grid-pagination-gap);padding:var(--ui-grid-pagination-padding-block) var(--ui-grid-pagination-padding-inline);border-top:1px solid var(--ui-grid-border-color);background:var(--ui-grid-header-background)}.pagination-bar p{margin:0;color:var(--ui-grid-muted-color)}.pagination-controls{display:flex;align-items:center;gap:var(--ui-grid-pagination-controls-gap);flex-wrap:wrap}.pagination-button{padding:var(--ui-grid-pagination-button-padding-block) var(--ui-grid-pagination-button-padding-inline)}.pagination-size{display:inline-flex;align-items:center;gap:var(--ui-grid-pagination-size-gap)}.pagination-size select{border:1px solid var(--ui-grid-border-color);border-radius:var(--ui-grid-radius);background:var(--ui-grid-surface);padding:var(--ui-grid-pagination-select-padding-block) var(--ui-grid-pagination-select-padding-inline);font:inherit}';
|
|
4004
4108
|
|
|
4005
4109
|
// src/adopt-styles.ts
|
|
4006
4110
|
var sheetsSupported = null;
|
|
@@ -4740,6 +4844,17 @@ var UiGridStandaloneElement = class extends HTMLElement {
|
|
|
4740
4844
|
lastVirtualOffset = 0;
|
|
4741
4845
|
/** @internal */
|
|
4742
4846
|
lastTotalVirtualHeight = 0;
|
|
4847
|
+
/**
|
|
4848
|
+
* @internal Per-row visual-state fingerprint from the previous patch pass.
|
|
4849
|
+
* The patch path uses this to skip cells whose row state hasn't changed
|
|
4850
|
+
* (selection, expand, dirty/saving/error flags) when the structure
|
|
4851
|
+
* fingerprint matches. Cleared on full re-render.
|
|
4852
|
+
*/
|
|
4853
|
+
lastRowStateFingerprints = /* @__PURE__ */ new Map();
|
|
4854
|
+
/** @internal */
|
|
4855
|
+
lastEditingCellKey = null;
|
|
4856
|
+
/** @internal */
|
|
4857
|
+
lastFocusedCellKey = null;
|
|
4743
4858
|
/**
|
|
4744
4859
|
* @internal Framework-rendered slot bridge. See `./framework-slots.ts`.
|
|
4745
4860
|
*/
|
|
@@ -4782,6 +4897,7 @@ var UiGridStandaloneElement = class extends HTMLElement {
|
|
|
4782
4897
|
*/
|
|
4783
4898
|
setFrameworkRenderedSlots(config) {
|
|
4784
4899
|
if (this.frameworkSlots.configure(config)) {
|
|
4900
|
+
this.lastRowStateFingerprints.clear();
|
|
4785
4901
|
this.render();
|
|
4786
4902
|
}
|
|
4787
4903
|
}
|
|
@@ -5168,8 +5284,49 @@ var UiGridStandaloneElement = class extends HTMLElement {
|
|
|
5168
5284
|
cancelAnimationFrame(this.scrollFrame);
|
|
5169
5285
|
this.scrollFrame = null;
|
|
5170
5286
|
}
|
|
5287
|
+
this.controller?.setBenchmarkHandler(null);
|
|
5171
5288
|
this.frameworkSlots.flushRemovals();
|
|
5172
5289
|
}
|
|
5290
|
+
benchmarkRender(iterations) {
|
|
5291
|
+
const controller = this.controller;
|
|
5292
|
+
const snapshot = this.snapshot;
|
|
5293
|
+
if (!controller || !snapshot) {
|
|
5294
|
+
return Promise.resolve({
|
|
5295
|
+
iterations: 0,
|
|
5296
|
+
totalMs: 0,
|
|
5297
|
+
averageMs: 0,
|
|
5298
|
+
visibleRows: 0,
|
|
5299
|
+
renderedItems: 0
|
|
5300
|
+
});
|
|
5301
|
+
}
|
|
5302
|
+
const now = () => typeof performance === "undefined" ? Date.now() : performance.now();
|
|
5303
|
+
const nextFrame = () => new Promise((resolve) => {
|
|
5304
|
+
if (typeof requestAnimationFrame === "undefined") {
|
|
5305
|
+
setTimeout(resolve, 0);
|
|
5306
|
+
return;
|
|
5307
|
+
}
|
|
5308
|
+
requestAnimationFrame(() => resolve());
|
|
5309
|
+
});
|
|
5310
|
+
const loops = Math.max(1, iterations ?? controller.getOptions().benchmark?.iterations ?? 25);
|
|
5311
|
+
return (async () => {
|
|
5312
|
+
const started = now();
|
|
5313
|
+
for (let index = 0; index < loops; index += 1) {
|
|
5314
|
+
this.render();
|
|
5315
|
+
await nextFrame();
|
|
5316
|
+
}
|
|
5317
|
+
const currentSnapshot = this.snapshot ?? snapshot;
|
|
5318
|
+
const totalMs = now() - started;
|
|
5319
|
+
const result = {
|
|
5320
|
+
iterations: loops,
|
|
5321
|
+
totalMs,
|
|
5322
|
+
averageMs: totalMs / loops,
|
|
5323
|
+
visibleRows: currentSnapshot.pipeline.visibleRows.length,
|
|
5324
|
+
renderedItems: currentSnapshot.pipeline.displayItems.length
|
|
5325
|
+
};
|
|
5326
|
+
controller.gridApi.core.raise.benchmarkComplete(result);
|
|
5327
|
+
return result;
|
|
5328
|
+
})();
|
|
5329
|
+
}
|
|
5173
5330
|
/** @internal */
|
|
5174
5331
|
ensureShadowRoot() {
|
|
5175
5332
|
if (!this.shadowRoot) {
|
|
@@ -5180,6 +5337,7 @@ var UiGridStandaloneElement = class extends HTMLElement {
|
|
|
5180
5337
|
/** @internal */
|
|
5181
5338
|
ensureController(options) {
|
|
5182
5339
|
if (this.controller) {
|
|
5340
|
+
this.controller.setBenchmarkHandler((iterations) => this.benchmarkRender(iterations));
|
|
5183
5341
|
if (this.clientWidth > 0) {
|
|
5184
5342
|
this.controller.setViewportWidth(this.clientWidth);
|
|
5185
5343
|
}
|
|
@@ -5187,6 +5345,7 @@ var UiGridStandaloneElement = class extends HTMLElement {
|
|
|
5187
5345
|
return;
|
|
5188
5346
|
}
|
|
5189
5347
|
this.controller = createVanillaGridController(options);
|
|
5348
|
+
this.controller.setBenchmarkHandler((iterations) => this.benchmarkRender(iterations));
|
|
5190
5349
|
if (this.clientWidth > 0) {
|
|
5191
5350
|
this.controller.setViewportWidth(this.clientWidth);
|
|
5192
5351
|
}
|
|
@@ -5348,6 +5507,9 @@ var UiGridStandaloneElement = class extends HTMLElement {
|
|
|
5348
5507
|
if (!snapshot) {
|
|
5349
5508
|
this.lastStructureKey = null;
|
|
5350
5509
|
this.lastItemsFingerprint = null;
|
|
5510
|
+
this.lastRowStateFingerprints.clear();
|
|
5511
|
+
this.lastEditingCellKey = null;
|
|
5512
|
+
this.lastFocusedCellKey = null;
|
|
5351
5513
|
emptyTemplate({ message: "No grid options provided." }).connect(root);
|
|
5352
5514
|
return;
|
|
5353
5515
|
}
|
|
@@ -5558,6 +5720,9 @@ var UiGridStandaloneElement = class extends HTMLElement {
|
|
|
5558
5720
|
this.lastItemsFingerprint = this.fingerprintItems(plan.itemsToRender);
|
|
5559
5721
|
this.lastVirtualOffset = plan.virtualOffset;
|
|
5560
5722
|
this.lastTotalVirtualHeight = plan.totalVirtualHeight;
|
|
5723
|
+
this.lastRowStateFingerprints.clear();
|
|
5724
|
+
this.lastEditingCellKey = this.controller?.getEditingCellKey() ?? null;
|
|
5725
|
+
this.lastFocusedCellKey = this.focusedCell ? `${this.focusedCell.rowId} ${this.focusedCell.columnName}` : null;
|
|
5561
5726
|
}
|
|
5562
5727
|
renderPatch(plan, root) {
|
|
5563
5728
|
renderPatch(this, plan, root);
|
|
@@ -5770,15 +5935,13 @@ async function defineStandaloneUiGridElement(tagName = "ui-grid-element") {
|
|
|
5770
5935
|
// src/index.ts
|
|
5771
5936
|
async function registerVanillaUiGridRustModule(module2, input) {
|
|
5772
5937
|
await module2.default(input);
|
|
5773
|
-
(0, import_ui_grid_core7.registerRustWasmGridEngine)({
|
|
5774
|
-
buildPipeline(context) {
|
|
5775
|
-
return module2.build_pipeline_js(context);
|
|
5776
|
-
}
|
|
5777
|
-
});
|
|
5778
5938
|
}
|
|
5779
5939
|
async function mountVanillaUiGrid(target, options, rustModule, tagName = "ui-grid-element") {
|
|
5780
5940
|
if (rustModule) {
|
|
5781
|
-
|
|
5941
|
+
try {
|
|
5942
|
+
await registerVanillaUiGridRustModule(rustModule);
|
|
5943
|
+
} catch {
|
|
5944
|
+
}
|
|
5782
5945
|
}
|
|
5783
5946
|
await defineStandaloneUiGridElement(tagName);
|
|
5784
5947
|
const grid = document.createElement(tagName);
|