@jielga/tmdatagrid 2.2.0 → 2.4.0

package/dist/styles.css

@@ -1,2 +1,2 @@
-._root_wlqnb_8[data-size=xs]{--dg-row-height:34px;--dg-header-height:32px;--dg-font-size:var(--mantine-font-size-xs);--dg-padding:6px}._root_wlqnb_8[data-size=sm]{--dg-row-height:42px;--dg-header-height:38px;--dg-font-size:var(--mantine-font-size-sm);--dg-padding:8px}._root_wlqnb_8[data-size=md]{--dg-row-height:52px;--dg-header-height:44px;--dg-font-size:var(--mantine-font-size-sm);--dg-padding:10px}._root_wlqnb_8[data-size=lg]{--dg-row-height:62px;--dg-header-height:52px;--dg-font-size:var(--mantine-font-size-md);--dg-padding:14px}._root_wlqnb_8[data-size=xl]{--dg-row-height:72px;--dg-header-height:60px;--dg-font-size:var(--mantine-font-size-lg);--dg-padding:18px}._root_wlqnb_8{--dg-radius:var(--mantine-radius-md);--dg-row-height:52px;--dg-header-height:44px;--dg-font-size:var(--mantine-font-size-sm);--dg-padding:10px;--dg-header-font-size:var(--dg-font-size);--dg-row-selected-bg:var(--mantine-primary-color-light);--dg-row-highlight-bg:var(--mantine-primary-color-light-hover);--dg-row-group-bg:var(--mantine-color-body);--dg-row-striped-bg:color-mix(in srgb, var(--mantine-color-text) 3.5%, var(--mantine-color-body));--dg-row-new-bg:color-mix(in srgb, var(--mantine-color-green-6) 8%, var(--mantine-color-body));--dg-z-focused-cell:1;--dg-z-pinned-cell:2;--dg-z-pinned-focused-cell:3;--dg-z-pinned-row:4;--dg-z-pinned-row-pinned-cell:5;--dg-z-summary-row:4;--dg-z-summary-pinned-cell:5;--dg-z-header:6;--dg-z-header-pinned-cell:7;text-align:left;border:1px solid var(--mantine-color-default-border);border-radius:var(--dg-radius);background-color:var(--mantine-color-body);flex-direction:column;min-height:0;display:flex;overflow:hidden}._columnsPanel_a5do5_1{flex-direction:column;width:280px;display:flex}._columnsPanelSearch_a5do5_7{padding:var(--mantine-spacing-sm)}._columnsPanelList_a5do5_11{gap:var(--mantine-spacing-sm);padding:var(--mantine-spacing-sm);flex-direction:column;display:flex}._columnsPanelSearch_a5do5_7+* ._columnsPanelList_a5do5_11{padding-top:0}._columnsPanelFooter_a5do5_22{justify-content:space-between;align-items:center;gap:var(--mantine-spacing-sm);padding:var(--mantine-spacing-sm);border-top:1px solid var(--mantine-color-default-border);display:flex}._detailsToggle_n39tz_3{width:100%;height:100%;color:inherit;justify-content:center;align-items:center;display:flex}._detailsToggle_n39tz_3:hover ._chevron_n39tz_12{color:var(--mantine-color-text)}._chevron_n39tz_12{color:var(--mantine-color-dimmed);align-items:center;transition:transform .12s;display:flex}._chevron_n39tz_12[data-expanded=true]{transform:rotate(90deg)}@media (prefers-reduced-motion:reduce){._chevron_n39tz_12{transition:none}}._tableWrapper_1qtpn_2{flex-direction:column;flex:1;min-height:0;display:flex;position:relative}._tableWrapper_1qtpn_2[data-dg-filter-sidebar]{flex-direction:row}._scrollContainer_1qtpn_17{flex:1;min-width:0;min-height:0;position:relative;overflow:auto;container-type:inline-size}._grid_1qtpn_29{align-content:start;min-height:100%;display:grid}._tabGuard_1qtpn_44{outline:none;width:0;height:0;position:absolute;overflow:hidden}._headerRow_1qtpn_54{grid-column:1/-1;grid-template-columns:subgrid;z-index:var(--dg-z-header,6);display:grid;position:sticky;top:0}._bodyRow_1qtpn_63{--row-bg:var(--mantine-color-body);grid-column:1/-1;grid-template-columns:subgrid;align-items:stretch;display:grid}._bodyRow_1qtpn_63[data-striped=true]{--row-bg:var(--dg-row-striped-bg)}._bodyRow_1qtpn_63[data-new=true]{--row-bg:var(--dg-row-new-bg,var(--mantine-color-body))}._bodyRow_1qtpn_63:hover{--row-bg:var(--mantine-color-default-hover)}._bodyRow_1qtpn_63[data-grouped=true]{--row-bg:var(--dg-row-group-bg)}._bodyRow_1qtpn_63[data-context-menu=true]{--row-bg:var(--mantine-color-default-hover)}._bodyRow_1qtpn_63[data-selected-bg=true]{--row-bg:var(--dg-row-selected-bg)}._bodyRow_1qtpn_63[data-highlighted=true]{--row-bg:var(--dg-row-highlight-bg)}._bodyRow_1qtpn_63[data-selects-on-click=true]{-webkit-user-select:none;user-select:none}._bodyRow_1qtpn_63:focus-visible{outline:2px solid var(--mantine-primary-color-filled);outline-offset:-2px}._bodyCell_1qtpn_137{padding:0 var(--dg-padding);border-bottom:1px solid var(--mantine-color-default-border);background-color:var(--mantine-color-body);background-image:linear-gradient(var(--row-bg), var(--row-bg));font-size:var(--dg-font-size);align-items:center;display:flex}._bodyCell_1qtpn_137[data-control-column=true]{padding:0}._grid_1qtpn_29[data-range-dragging]{-webkit-user-select:none;user-select:none}._bodyCell_1qtpn_137[data-selected=true]{--dg-range-tint:color-mix(in srgb, var(--mantine-primary-color-filled) 14%, var(--row-bg));background-image:linear-gradient(var(--dg-range-tint), var(--dg-range-tint));--dg-edge-top:transparent;--dg-edge-bottom:transparent;--dg-edge-left:transparent;--dg-edge-right:transparent;box-shadow:inset 0 1px 0 0 var(--dg-edge-top), inset 0 -1px 0 0 var(--dg-edge-bottom), inset 1px 0 0 0 var(--dg-edge-left), inset -1px 0 0 0 var(--dg-edge-right)}._bodyCell_1qtpn_137[data-edge-top=true]{--dg-edge-top:var(--mantine-primary-color-filled)}._bodyCell_1qtpn_137[data-edge-bottom=true]{--dg-edge-bottom:var(--mantine-primary-color-filled)}._bodyCell_1qtpn_137[data-edge-left=true]{--dg-edge-left:var(--mantine-primary-color-filled)}._bodyCell_1qtpn_137[data-edge-right=true]{--dg-edge-right:var(--mantine-primary-color-filled)}._bodyCell_1qtpn_137[data-focused=true]{outline:2px solid var(--mantine-primary-color-filled);outline-offset:-2px}._cellContent_1qtpn_135{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}._bodyCell_1qtpn_137[data-editing]{padding:0 calc(var(--dg-padding) / 2)}._cellEditor_1qtpn_244{align-items:center;gap:2px;width:100%;min-width:0;display:flex}._cellEditorField_1qtpn_254{flex:auto;align-items:center;min-width:0;display:flex}._cellEditorActions_1qtpn_262{flex:none;align-items:center;display:flex}._bodyCell_1qtpn_137[data-dirty],._bodyCell_1qtpn_137[data-invalid],._entryCell_1qtpn_275[data-invalid]{position:relative}._bodyCell_1qtpn_137[data-dirty]:after,._bodyCell_1qtpn_137[data-invalid]:after,._entryCell_1qtpn_275[data-invalid]:after{content:"";border:5px solid #0000;border-top-color:var(--mantine-primary-color-filled);border-right-color:var(--mantine-primary-color-filled);position:absolute;top:0;right:0}._bodyCell_1qtpn_137[data-invalid]:after,._entryCell_1qtpn_275[data-invalid]:after{border-top-color:var(--mantine-color-error);border-right-color:var(--mantine-color-error)}._bodyCell_1qtpn_137[data-align=right]{justify-content:flex-end}._bodyCell_1qtpn_137[data-align=center]{justify-content:center}._bodyCell_1qtpn_137[data-align=left] ._cellContent_1qtpn_135{flex:auto}._detailsCell_1qtpn_317{border-bottom:1px solid var(--mantine-color-default-border);background-color:var(--mantine-color-body);background-image:linear-gradient(var(--row-bg), var(--row-bg));padding:var(--dg-padding);-webkit-user-select:text;user-select:text;cursor:auto;grid-column:1/-1}._messageRow_1qtpn_23{justify-content:center;justify-self:start;align-items:center;gap:var(--mantine-spacing-xs);width:100cqi;padding:var(--mantine-spacing-xl);flex-direction:column;grid-column:1/-1;display:flex;position:sticky;left:0}._bodyRow_1qtpn_63[data-deleted=true]{opacity:.55;text-decoration:line-through}._bodyRow_1qtpn_63[data-deleted=true] ._bodyCell_1qtpn_137:not([data-control-column=true]){pointer-events:none}._entryBlock_1qtpn_369{grid-column:1/-1;grid-template-columns:subgrid;top:var(--dg-header-height,0px);z-index:var(--dg-z-pinned-row,4);display:grid;position:sticky}._entryRow_1qtpn_378{grid-column:1/-1;grid-template-columns:subgrid;display:grid}._pinnedTopBlock_1qtpn_391{grid-column:1/-1;grid-template-columns:subgrid;top:calc(var(--dg-header-height,0px) + var(--dg-entry-height,0px));z-index:var(--dg-z-pinned-row,4);display:grid;position:sticky}._pinnedTopBlock_1qtpn_391>:last-child>[role=cell]{border-bottom:2px solid var(--mantine-color-default-border)}._pinnedBottomBlock_1qtpn_404{grid-column:1/-1;grid-template-columns:subgrid;bottom:var(--dg-summary-height,0px);z-index:var(--dg-z-pinned-row,4);display:grid;position:sticky}._pinnedBottomBlock_1qtpn_404>:first-child>[role=cell]{border-top:2px solid var(--mantine-color-default-border)}._entryCell_1qtpn_275{padding:0 calc(var(--dg-padding) / 2);border-bottom:2px solid var(--mantine-primary-color-filled);background-color:var(--mantine-color-body);font-size:var(--dg-font-size);align-items:center;display:flex}._entryCell_1qtpn_275[data-control-column=true]{justify-content:center;padding:0}._entryRow_1qtpn_378[data-committed=true] ._entryCell_1qtpn_275{padding:0 var(--dg-padding);border-bottom:1px solid var(--mantine-color-default-border);background-image:linear-gradient(var(--dg-row-new-bg,transparent), var(--dg-row-new-bg,transparent))}._entryRow_1qtpn_378[data-committed=true] ._entryCell_1qtpn_275[data-control-column=true]{padding:0}._rowStateIndicator_1qtpn_453{width:22px;height:22px;color:var(--mantine-color-dimmed);flex:none;justify-content:center;align-items:center;display:inline-flex}._rowStateIndicator_1qtpn_453[data-error]{color:var(--mantine-color-error)}._entryCell_1qtpn_275[data-align=right]{justify-content:flex-end}._entryCell_1qtpn_275[data-align=center]{justify-content:center}._matchHighlight_1qtpn_479{background-color:var(--dg-match-highlight-bg,var(--lightningcss-light,var(--mantine-color-yellow-2))var(--lightningcss-dark,#fab00559));color:inherit;border-radius:2px}._summaryRow_1qtpn_500{grid-column:1/-1;grid-template-columns:subgrid;top:calc(100% - var(--dg-summary-height,0px));z-index:var(--dg-z-summary-row,4);display:grid;position:sticky;bottom:0}._summaryCell_1qtpn_510{padding:0 var(--dg-padding);border-top:1px solid var(--mantine-color-default-border);background-color:var(--mantine-color-body);font-size:var(--dg-font-size);align-items:center;font-weight:600;display:flex}._summaryCell_1qtpn_510[data-control-column=true]{padding:0}._summaryCell_1qtpn_510[data-align=right]{justify-content:flex-end}._summaryCell_1qtpn_510[data-align=center]{justify-content:center}._groupToggle_1954o_4{width:100%;min-width:0;font-size:var(--dg-font-size);color:inherit;align-items:center;gap:6px;display:flex}._chevron_1954o_14{color:var(--mantine-color-dimmed);flex:none;align-items:center;transition:transform .12s;display:flex}._chevron_1954o_14[data-expanded=true]{transform:rotate(90deg)}@media (prefers-reduced-motion:reduce){._chevron_1954o_14{transition:none}}._groupLabel_1954o_34{white-space:nowrap;text-overflow:ellipsis;min-width:0;font-weight:600;overflow:hidden}._groupCount_1954o_44{color:var(--mantine-color-dimmed);font-variant-numeric:tabular-nums;flex:none}._filterPanel_wm77f_4{gap:var(--mantine-spacing-xs);flex-direction:column;display:flex}._filterRow_wm77f_12{align-items:flex-end;gap:var(--mantine-spacing-xs);display:flex}._filterRow_wm77f_12[data-layout=stacked]{align-items:end;gap:6px var(--mantine-spacing-xs);padding:var(--mantine-spacing-xs);border:1px solid var(--mantine-color-default-border);border-radius:var(--mantine-radius-sm);grid-template-columns:1fr auto;display:grid}._filterRow_wm77f_12[data-layout=stacked] ._filterRemove_wm77f_32{grid-area:1/2}._filterRow_wm77f_12[data-layout=stacked] ._filterColumnSlot_wm77f_37{grid-area:1/1;min-width:0}._filterRow_wm77f_12[data-layout=stacked] ._filterOperatorSlot_wm77f_43,._filterRow_wm77f_12[data-layout=stacked] ._filterValueSlot_wm77f_44{grid-column:1/-1;min-width:0}._filterPanelFooter_wm77f_49{justify-content:space-between;align-items:center;gap:var(--mantine-spacing-md);display:flex}._filterPills_14wl0_3{align-items:center;gap:var(--mantine-spacing-xs);flex-wrap:wrap;display:flex}._filterPills_14wl0_3 ._pill_14wl0_15{background-color:var(--lightningcss-light,var(--mantine-color-gray-1))var(--lightningcss-dark,var(--mantine-color-dark-5));color:var(--lightningcss-light,var(--mantine-color-black))var(--lightningcss-dark,var(--mantine-color-dark-0));border:1px solid var(--lightningcss-light,var(--mantine-color-gray-3))var(--lightningcss-dark,var(--mantine-color-dark-3))}._pillLabel_14wl0_27{font:inherit;color:inherit;cursor:pointer}._pillLabel_14wl0_27:hover{text-decoration:underline}._footer_te0a3_1{justify-content:flex-end;align-items:center;gap:var(--mantine-spacing-lg);padding:4px var(--mantine-spacing-sm);border-top:1px solid var(--mantine-color-default-border);flex-shrink:0;min-height:48px;display:flex}._footer_te0a3_1[data-paging-suspended=true]{opacity:.55}._stickyLeft_1jwnm_16:after,._stickyRight_1jwnm_17:after{content:"";pointer-events:none;width:8px;position:absolute;top:0;bottom:0}._stickyLeft_1jwnm_16:after{background:linear-gradient(90deg,var(--lightningcss-light,#00000012)var(--lightningcss-dark,#00000042),var(--lightningcss-light,#00000006)var(--lightningcss-dark,#00000017) 45%,#0000);left:100%}._stickyRight_1jwnm_17:after{background:linear-gradient(270deg,var(--lightningcss-light,#00000012)var(--lightningcss-dark,#00000042),var(--lightningcss-light,#00000006)var(--lightningcss-dark,#00000017) 45%,#0000);right:100%}@supports (animation-timeline:scroll()){._stickyLeft_1jwnm_16:after,._stickyRight_1jwnm_17:after{--dg-sticky-edge-range:20px;opacity:0;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:scroll(inline)}._stickyLeft_1jwnm_16:after{animation-name:_stickyEdgeIn_1jwnm_1;animation-range:0 var(--dg-sticky-edge-range)}._stickyRight_1jwnm_17:after{animation-name:_stickyEdgeOut_1jwnm_1;animation-range:calc(100% - var(--dg-sticky-edge-range)) 100%}}@keyframes _stickyEdgeIn_1jwnm_1{0%{opacity:0}to{opacity:1}}@keyframes _stickyEdgeOut_1jwnm_1{0%{opacity:1}to{opacity:0}}._headerBoundary_1jwnm_120:after{content:"";pointer-events:none;background:linear-gradient(to bottom, var(--dg-header-shadow-color,#00000024), transparent);opacity:0;height:6px;position:absolute;inset:100% 0 auto}@supports (animation-timeline:scroll()){._headerBoundary_1jwnm_120:after{animation:linear both _dgHeaderShadow_1jwnm_1;animation-timeline:scroll();animation-range:0 24px}}@keyframes _dgHeaderShadow_1jwnm_1{0%{opacity:0}to{opacity:1}}._surfaceHeader_10bcx_5{justify-content:space-between;align-items:center;gap:var(--mantine-spacing-md);padding-bottom:var(--mantine-spacing-xs);display:flex}._filterPopup_10bcx_18{top:calc(var(--dg-header-stack-height,var(--dg-header-height)) + 2px);left:var(--mantine-spacing-md);z-index:var(--dg-z-filter-popup,20);padding:var(--mantine-spacing-sm);border-radius:var(--mantine-radius-md);border:1px solid var(--mantine-color-default-border);background-color:var(--mantine-color-body);box-shadow:var(--mantine-shadow-md);position:absolute}._filterSidebar_10bcx_33{min-width:0;padding:var(--mantine-spacing-sm);background-color:var(--mantine-color-body);border-left:1px solid var(--mantine-color-default-border);flex-direction:column;flex:none;display:flex}._filterSidebar_10bcx_33[data-side=left]{border-left:none;border-right:1px solid var(--mantine-color-default-border);order:-1}._filterSidebarBody_10bcx_51{flex:1;min-height:0}._headerFilterRow_h1geg_9{grid-column:1/-1;grid-template-columns:subgrid;top:var(--dg-header-height);z-index:var(--dg-z-header,6);display:grid;position:sticky}._headerFilterCell_h1geg_18{min-width:0;padding:calc(var(--dg-padding) / 2);background-color:var(--mantine-color-body);border-bottom:1px solid var(--mantine-color-default-border);align-items:center;gap:2px;display:flex;overflow:hidden}._headerFilterCell_h1geg_18[data-control-column=true]{padding:0}._headerFilterValue_h1geg_39{flex:1;min-width:0}._headerFilterOperator_h1geg_44{flex:none}._operatorItemActive_h1geg_48{color:var(--mantine-primary-color-filled);font-weight:600}._headerCell_18ma1_1{padding:0 var(--dg-padding);min-width:0;min-height:var(--dg-header-height);font-weight:600;font-size:var(--dg-header-font-size);background-color:var(--mantine-color-body);border-bottom:1px solid var(--mantine-color-default-border);-webkit-user-select:none;user-select:none;align-items:center;gap:2px;display:flex;position:relative}._headerCell_18ma1_1[data-align=right]{justify-content:flex-end}._headerCell_18ma1_1[data-align=center]{justify-content:center}._headerCell_18ma1_1[data-control-column=true]{padding:0}._headerCellFiltered_18ma1_35 ._headerTitle_18ma1_35{color:var(--mantine-primary-color-filled)}._headerTitle_18ma1_35{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-width:0;overflow:hidden}._headerCell_18ma1_1[data-align=right] ._headerTitle_18ma1_35{text-align:right}._headerCell_18ma1_1[data-align=center] ._headerTitle_18ma1_35{justify-content:center;display:flex}._headerActions_18ma1_58{flex-shrink:0;align-items:center;gap:0;margin-left:auto;display:flex}._headerCell_18ma1_1[data-align=right] ._headerActions_18ma1_58{order:-1;margin-left:0;margin-right:auto}._headerAction_18ma1_58{display:none}._headerCell_18ma1_1:hover ._headerAction_18ma1_58,._headerCell_18ma1_1:focus-within ._headerAction_18ma1_58,._headerAction_18ma1_58[data-pinned-visible=true]{display:flex}._headerCellSortable_18ma1_87{cursor:pointer}._sortAction_18ma1_93:not([data-sorted]){opacity:.55}._sortAction_18ma1_93:not([data-sorted]):hover{opacity:1}._sortIndex_18ma1_103{color:var(--mantine-color-dimmed);text-align:center;min-width:10px;font-size:10px;font-weight:600;line-height:1}._headerCellDragging_18ma1_115{opacity:.4}._headerCellDropBefore_18ma1_119:before,._headerCellDropAfter_18ma1_120:before{content:"";background-color:var(--mantine-primary-color-filled);z-index:5;pointer-events:none;width:2px;position:absolute;top:0;bottom:0}._headerCellDropBefore_18ma1_119:before{left:0}._headerCellDropAfter_18ma1_120:before{right:0}._columnSeparator_18ma1_140{z-index:1;justify-content:center;width:10px;height:50%;display:flex;position:absolute;top:25%;right:0;transform:translate(50%)}._headerCell_18ma1_1:last-child ._columnSeparator_18ma1_140{justify-content:flex-end;transform:none}._columnSeparatorResizable_18ma1_162{cursor:col-resize;touch-action:none}._columnSeparator_18ma1_140:after{content:"";background-color:#0000;width:1px;height:100%;transition:background-color .12s,width .12s}._headerCell_18ma1_1:hover ._columnSeparator_18ma1_140:after,._headerCell_18ma1_1:focus-within ._columnSeparator_18ma1_140:after{background-color:var(--mantine-color-default-border)}._columnSeparatorResizable_18ma1_162:hover:after,._columnSeparatorActive_18ma1_185:after{background-color:var(--mantine-primary-color-filled);width:2px}._menuItemActive_18ma1_191{background-color:var(--mantine-color-default-hover);font-weight:600}._toolbar_gwk05_1{align-items:center;gap:var(--mantine-spacing-xs);padding:6px var(--mantine-spacing-xs);flex-shrink:0;min-height:42px;display:flex}._toolbar_gwk05_1[data-with-bottom-border]{border-bottom:1px solid var(--mantine-color-default-border)}._toolbarSpacer_gwk05_15{flex:1}._summaryCount_gwk05_19{white-space:nowrap}._title_199r2_1{font-weight:500}._list_199r2_5{border:1px solid var(--mantine-color-default-border);border-radius:var(--mantine-radius-default);flex-direction:column;display:flex;overflow:hidden}._listHeader_199r2_13{justify-content:space-between;align-items:center;gap:var(--mantine-spacing-sm);padding:var(--mantine-spacing-xs) var(--mantine-spacing-sm);background-color:var(--mantine-color-default-hover);border-bottom:1px solid var(--mantine-color-default-border);display:flex}._headerLabel_199r2_23{cursor:pointer;font-weight:500}._rows_199r2_28{padding:calc(var(--mantine-spacing-xs) / 2) 0;flex-direction:column;display:flex}._row_199r2_28{padding:0 var(--mantine-spacing-sm)}._row_199r2_28:hover{background-color:var(--mantine-color-default-hover)}._rowBody_199r2_45{align-items:center}._rowLabelWrapper_199r2_49{flex:1;min-width:0}._rowLabel_199r2_49{justify-content:space-between;align-items:center;gap:var(--mantine-spacing-sm);padding-block:calc(var(--mantine-spacing-xs) * .75);cursor:pointer;display:flex}._rowText_199r2_63{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}._rowHint_199r2_69{font-size:var(--mantine-font-size-xs);color:var(--mantine-color-dimmed);flex:none}._empty_199r2_75{padding:var(--mantine-spacing-xs) var(--mantine-spacing-sm)}
+._root_wlqnb_8[data-size=xs]{--dg-row-height:34px;--dg-header-height:32px;--dg-font-size:var(--mantine-font-size-xs);--dg-padding:6px}._root_wlqnb_8[data-size=sm]{--dg-row-height:42px;--dg-header-height:38px;--dg-font-size:var(--mantine-font-size-sm);--dg-padding:8px}._root_wlqnb_8[data-size=md]{--dg-row-height:52px;--dg-header-height:44px;--dg-font-size:var(--mantine-font-size-sm);--dg-padding:10px}._root_wlqnb_8[data-size=lg]{--dg-row-height:62px;--dg-header-height:52px;--dg-font-size:var(--mantine-font-size-md);--dg-padding:14px}._root_wlqnb_8[data-size=xl]{--dg-row-height:72px;--dg-header-height:60px;--dg-font-size:var(--mantine-font-size-lg);--dg-padding:18px}._root_wlqnb_8{--dg-radius:var(--mantine-radius-md);--dg-row-height:52px;--dg-header-height:44px;--dg-font-size:var(--mantine-font-size-sm);--dg-padding:10px;--dg-header-font-size:var(--dg-font-size);--dg-row-selected-bg:var(--mantine-primary-color-light);--dg-row-highlight-bg:var(--mantine-primary-color-light-hover);--dg-row-group-bg:var(--mantine-color-body);--dg-row-striped-bg:color-mix(in srgb, var(--mantine-color-text) 3.5%, var(--mantine-color-body));--dg-row-new-bg:color-mix(in srgb, var(--mantine-color-green-6) 8%, var(--mantine-color-body));--dg-z-focused-cell:1;--dg-z-pinned-cell:2;--dg-z-pinned-focused-cell:3;--dg-z-pinned-row:4;--dg-z-pinned-row-pinned-cell:5;--dg-z-summary-row:4;--dg-z-summary-pinned-cell:5;--dg-z-header:6;--dg-z-header-pinned-cell:7;text-align:left;border:1px solid var(--mantine-color-default-border);border-radius:var(--dg-radius);background-color:var(--mantine-color-body);flex-direction:column;min-height:0;display:flex;overflow:hidden}._columnsPanel_a5do5_1{flex-direction:column;width:280px;display:flex}._columnsPanelSearch_a5do5_7{padding:var(--mantine-spacing-sm)}._columnsPanelList_a5do5_11{gap:var(--mantine-spacing-sm);padding:var(--mantine-spacing-sm);flex-direction:column;display:flex}._columnsPanelSearch_a5do5_7+* ._columnsPanelList_a5do5_11{padding-top:0}._columnsPanelFooter_a5do5_22{justify-content:space-between;align-items:center;gap:var(--mantine-spacing-sm);padding:var(--mantine-spacing-sm);border-top:1px solid var(--mantine-color-default-border);display:flex}._detailsToggle_n39tz_3{width:100%;height:100%;color:inherit;justify-content:center;align-items:center;display:flex}._detailsToggle_n39tz_3:hover ._chevron_n39tz_12{color:var(--mantine-color-text)}._chevron_n39tz_12{color:var(--mantine-color-dimmed);align-items:center;transition:transform .12s;display:flex}._chevron_n39tz_12[data-expanded=true]{transform:rotate(90deg)}@media (prefers-reduced-motion:reduce){._chevron_n39tz_12{transition:none}}._tableWrapper_34o3j_2{flex-direction:column;flex:1;min-height:0;display:flex;position:relative}._tableWrapper_34o3j_2[data-dg-filter-sidebar]{flex-direction:row}._scrollContainer_34o3j_17{flex:1;min-width:0;min-height:0;position:relative;overflow:auto;container-type:inline-size}._grid_34o3j_29{align-content:start;min-height:100%;display:grid}._tabGuard_34o3j_44{outline:none;width:0;height:0;position:absolute;overflow:hidden}._headerRow_34o3j_54{grid-column:1/-1;grid-template-columns:subgrid;z-index:var(--dg-z-header,6);display:grid;position:sticky;top:0}._bodyRow_34o3j_63{--row-bg:var(--mantine-color-body);grid-column:1/-1;grid-template-columns:subgrid;align-items:stretch;display:grid}._bodyRow_34o3j_63[data-striped=true]{--row-bg:var(--dg-row-striped-bg)}._bodyRow_34o3j_63[data-new=true]{--row-bg:var(--dg-row-new-bg,var(--mantine-color-body))}._bodyRow_34o3j_63:where([data-highlight-on-hover=true]):hover{--row-bg:var(--mantine-color-default-hover)}._bodyRow_34o3j_63[data-grouped=true]{--row-bg:var(--dg-row-group-bg)}._bodyRow_34o3j_63[data-context-menu=true]{--row-bg:var(--mantine-color-default-hover)}._bodyRow_34o3j_63[data-selected-bg=true]{--row-bg:var(--dg-row-selected-bg)}._bodyRow_34o3j_63[data-highlighted=true]{--row-bg:var(--dg-row-highlight-bg)}._bodyRow_34o3j_63[data-selects-on-click=true]{-webkit-user-select:none;user-select:none}._bodyRow_34o3j_63:focus-visible{outline:2px solid var(--mantine-primary-color-filled);outline-offset:-2px}._bodyCell_34o3j_143{padding:0 var(--dg-padding);border-bottom:1px solid var(--mantine-color-default-border);background-color:var(--mantine-color-body);background-image:linear-gradient(var(--row-bg), var(--row-bg));font-size:var(--dg-font-size);align-items:center;display:flex}._bodyCell_34o3j_143[data-control-column=true]{padding:0}._grid_34o3j_29[data-range-dragging]{-webkit-user-select:none;user-select:none}._bodyCell_34o3j_143[data-selected=true]{--dg-range-tint:color-mix(in srgb, var(--mantine-primary-color-filled) 14%, var(--row-bg));background-image:linear-gradient(var(--dg-range-tint), var(--dg-range-tint));--dg-edge-top:transparent;--dg-edge-bottom:transparent;--dg-edge-left:transparent;--dg-edge-right:transparent;box-shadow:inset 0 1px 0 0 var(--dg-edge-top), inset 0 -1px 0 0 var(--dg-edge-bottom), inset 1px 0 0 0 var(--dg-edge-left), inset -1px 0 0 0 var(--dg-edge-right)}._bodyCell_34o3j_143[data-edge-top=true]{--dg-edge-top:var(--mantine-primary-color-filled)}._bodyCell_34o3j_143[data-edge-bottom=true]{--dg-edge-bottom:var(--mantine-primary-color-filled)}._bodyCell_34o3j_143[data-edge-left=true]{--dg-edge-left:var(--mantine-primary-color-filled)}._bodyCell_34o3j_143[data-edge-right=true]{--dg-edge-right:var(--mantine-primary-color-filled)}._bodyCell_34o3j_143[data-focused=true]{outline:2px solid var(--mantine-primary-color-filled);outline-offset:-2px}._cellContent_34o3j_141{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}._bodyCell_34o3j_143[data-editing]{padding:0 calc(var(--dg-padding) / 2)}._cellEditor_34o3j_250{align-items:center;gap:2px;width:100%;min-width:0;display:flex}._cellEditorField_34o3j_260{flex:auto;align-items:center;min-width:0;display:flex}._cellEditorActions_34o3j_268{flex:none;align-items:center;display:flex}._bodyCell_34o3j_143[data-dirty],._bodyCell_34o3j_143[data-invalid],._entryCell_34o3j_281[data-invalid]{position:relative}._bodyCell_34o3j_143[data-dirty]:after,._bodyCell_34o3j_143[data-invalid]:after,._entryCell_34o3j_281[data-invalid]:after{content:"";border:5px solid #0000;border-top-color:var(--mantine-primary-color-filled);border-right-color:var(--mantine-primary-color-filled);position:absolute;top:0;right:0}._bodyCell_34o3j_143[data-invalid]:after,._entryCell_34o3j_281[data-invalid]:after{border-top-color:var(--mantine-color-error);border-right-color:var(--mantine-color-error)}._bodyCell_34o3j_143[data-align=right]{justify-content:flex-end}._bodyCell_34o3j_143[data-align=center]{justify-content:center}._bodyCell_34o3j_143[data-align=left] ._cellContent_34o3j_141{flex:auto}._detailsCell_34o3j_323{border-bottom:1px solid var(--mantine-color-default-border);background-color:var(--mantine-color-body);background-image:linear-gradient(var(--row-bg), var(--row-bg));-webkit-user-select:text;user-select:text;cursor:auto;grid-column:1/-1}._messageRow_34o3j_23{justify-content:center;justify-self:start;align-items:center;gap:var(--mantine-spacing-xs);width:100cqi;padding:var(--mantine-spacing-xl);flex-direction:column;grid-column:1/-1;display:flex;position:sticky;left:0}._bodyRow_34o3j_63[data-deleted=true]{opacity:.55;text-decoration:line-through}._bodyRow_34o3j_63[data-deleted=true] ._bodyCell_34o3j_143:not([data-control-column=true]){pointer-events:none}._entryBlock_34o3j_377{grid-column:1/-1;grid-template-columns:subgrid;top:var(--dg-header-height,0px);z-index:var(--dg-z-pinned-row,4);display:grid;position:sticky}._entryRow_34o3j_386{grid-column:1/-1;grid-template-columns:subgrid;display:grid}._pinnedTopBlock_34o3j_399{grid-column:1/-1;grid-template-columns:subgrid;top:calc(var(--dg-header-height,0px) + var(--dg-entry-height,0px));z-index:var(--dg-z-pinned-row,4);display:grid;position:sticky}._pinnedTopBlock_34o3j_399>:last-child>[role=cell]{border-bottom:2px solid var(--mantine-color-default-border)}._pinnedBottomBlock_34o3j_412{grid-column:1/-1;grid-template-columns:subgrid;bottom:var(--dg-summary-height,0px);z-index:var(--dg-z-pinned-row,4);display:grid;position:sticky}._pinnedBottomBlock_34o3j_412>:first-child>[role=cell]{border-top:2px solid var(--mantine-color-default-border)}._entryCell_34o3j_281{padding:0 calc(var(--dg-padding) / 2);border-bottom:2px solid var(--mantine-primary-color-filled);background-color:var(--mantine-color-body);font-size:var(--dg-font-size);align-items:center;display:flex}._entryCell_34o3j_281[data-control-column=true]{justify-content:center;padding:0}._entryRow_34o3j_386[data-committed=true] ._entryCell_34o3j_281{padding:0 var(--dg-padding);border-bottom:1px solid var(--mantine-color-default-border);background-image:linear-gradient(var(--dg-row-new-bg,transparent), var(--dg-row-new-bg,transparent))}._entryRow_34o3j_386[data-committed=true] ._entryCell_34o3j_281[data-control-column=true]{padding:0}._rowStateIndicator_34o3j_461{width:22px;height:22px;color:var(--mantine-color-dimmed);flex:none;justify-content:center;align-items:center;display:inline-flex}._rowStateIndicator_34o3j_461[data-error]{color:var(--mantine-color-error)}._entryCell_34o3j_281[data-align=right]{justify-content:flex-end}._entryCell_34o3j_281[data-align=center]{justify-content:center}._matchHighlight_34o3j_487{background-color:var(--dg-match-highlight-bg,var(--mantine-color-yellow-2));color:inherit;border-radius:2px}:where([data-mantine-color-scheme=dark]) ._matchHighlight_34o3j_487{background-color:var(--dg-match-highlight-bg,#fab00559)}._summaryRow_34o3j_509{grid-column:1/-1;grid-template-columns:subgrid;top:calc(100% - var(--dg-summary-height,0px));z-index:var(--dg-z-summary-row,4);display:grid;position:sticky;bottom:0}._summaryCell_34o3j_519{padding:0 var(--dg-padding);border-top:1px solid var(--mantine-color-default-border);background-color:var(--mantine-color-body);font-size:var(--dg-font-size);align-items:center;font-weight:600;display:flex}._summaryCell_34o3j_519[data-control-column=true]{padding:0}._summaryCell_34o3j_519[data-align=right]{justify-content:flex-end}._summaryCell_34o3j_519[data-align=center]{justify-content:center}._groupToggle_1954o_4{width:100%;min-width:0;font-size:var(--dg-font-size);color:inherit;align-items:center;gap:6px;display:flex}._chevron_1954o_14{color:var(--mantine-color-dimmed);flex:none;align-items:center;transition:transform .12s;display:flex}._chevron_1954o_14[data-expanded=true]{transform:rotate(90deg)}@media (prefers-reduced-motion:reduce){._chevron_1954o_14{transition:none}}._groupLabel_1954o_34{white-space:nowrap;text-overflow:ellipsis;min-width:0;font-weight:600;overflow:hidden}._groupCount_1954o_44{color:var(--mantine-color-dimmed);font-variant-numeric:tabular-nums;flex:none}._filterPanel_wm77f_4{gap:var(--mantine-spacing-xs);flex-direction:column;display:flex}._filterRow_wm77f_12{align-items:flex-end;gap:var(--mantine-spacing-xs);display:flex}._filterRow_wm77f_12[data-layout=stacked]{align-items:end;gap:6px var(--mantine-spacing-xs);padding:var(--mantine-spacing-xs);border:1px solid var(--mantine-color-default-border);border-radius:var(--mantine-radius-sm);grid-template-columns:1fr auto;display:grid}._filterRow_wm77f_12[data-layout=stacked] ._filterRemove_wm77f_32{grid-area:1/2}._filterRow_wm77f_12[data-layout=stacked] ._filterColumnSlot_wm77f_37{grid-area:1/1;min-width:0}._filterRow_wm77f_12[data-layout=stacked] ._filterOperatorSlot_wm77f_43,._filterRow_wm77f_12[data-layout=stacked] ._filterValueSlot_wm77f_44{grid-column:1/-1;min-width:0}._filterPanelFooter_wm77f_49{justify-content:space-between;align-items:center;gap:var(--mantine-spacing-md);display:flex}._filterPills_c75fv_3{align-items:center;gap:var(--mantine-spacing-xs);flex-wrap:wrap;display:flex}._filterPills_c75fv_3 ._pill_c75fv_15{background-color:var(--mantine-color-gray-1);color:var(--mantine-color-black);border:1px solid var(--mantine-color-gray-3)}:where([data-mantine-color-scheme=dark]) ._filterPills_c75fv_3 ._pill_c75fv_15{background-color:var(--mantine-color-dark-5);color:var(--mantine-color-dark-0);border-color:var(--mantine-color-dark-3)}._pillLabel_c75fv_29{font:inherit;color:inherit;cursor:pointer}._pillLabel_c75fv_29:hover{text-decoration:underline}._footer_te0a3_1{justify-content:flex-end;align-items:center;gap:var(--mantine-spacing-lg);padding:4px var(--mantine-spacing-sm);border-top:1px solid var(--mantine-color-default-border);flex-shrink:0;min-height:48px;display:flex}._footer_te0a3_1[data-paging-suspended=true]{opacity:.55}._stickyLeft_1opmk_18:after,._stickyRight_1opmk_19:after{content:"";pointer-events:none;width:8px;position:absolute;top:0;bottom:0}._stickyLeft_1opmk_18:after{background:linear-gradient(90deg,#00000012,#00000006 45%,#0000);left:100%}._stickyRight_1opmk_19:after{background:linear-gradient(270deg,#00000012,#00000006 45%,#0000);right:100%}:where([data-mantine-color-scheme=dark]) ._stickyLeft_1opmk_18:after{background:linear-gradient(90deg,#00000042,#00000017 45%,#0000)}:where([data-mantine-color-scheme=dark]) ._stickyRight_1opmk_19:after{background:linear-gradient(270deg,#00000042,#00000017 45%,#0000)}@supports (animation-timeline:scroll()){._stickyLeft_1opmk_18:after,._stickyRight_1opmk_19:after{--dg-sticky-edge-range:20px;opacity:0;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:scroll(inline)}._stickyLeft_1opmk_18:after{animation-name:_stickyEdgeIn_1opmk_1;animation-range:0 var(--dg-sticky-edge-range)}._stickyRight_1opmk_19:after{animation-name:_stickyEdgeOut_1opmk_1;animation-range:calc(100% - var(--dg-sticky-edge-range)) 100%}}@keyframes _stickyEdgeIn_1opmk_1{0%{opacity:0}to{opacity:1}}@keyframes _stickyEdgeOut_1opmk_1{0%{opacity:1}to{opacity:0}}._headerBoundary_1opmk_140:after{content:"";pointer-events:none;background:linear-gradient(to bottom, var(--dg-header-shadow-color,#00000024), transparent);opacity:0;height:6px;position:absolute;inset:100% 0 auto}@supports (animation-timeline:scroll()){._headerBoundary_1opmk_140:after{animation:linear both _dgHeaderShadow_1opmk_1;animation-timeline:scroll();animation-range:0 24px}}@keyframes _dgHeaderShadow_1opmk_1{0%{opacity:0}to{opacity:1}}._surfaceHeader_10bcx_5{justify-content:space-between;align-items:center;gap:var(--mantine-spacing-md);padding-bottom:var(--mantine-spacing-xs);display:flex}._filterPopup_10bcx_18{top:calc(var(--dg-header-stack-height,var(--dg-header-height)) + 2px);left:var(--mantine-spacing-md);z-index:var(--dg-z-filter-popup,20);padding:var(--mantine-spacing-sm);border-radius:var(--mantine-radius-md);border:1px solid var(--mantine-color-default-border);background-color:var(--mantine-color-body);box-shadow:var(--mantine-shadow-md);position:absolute}._filterSidebar_10bcx_33{min-width:0;padding:var(--mantine-spacing-sm);background-color:var(--mantine-color-body);border-left:1px solid var(--mantine-color-default-border);flex-direction:column;flex:none;display:flex}._filterSidebar_10bcx_33[data-side=left]{border-left:none;border-right:1px solid var(--mantine-color-default-border);order:-1}._filterSidebarBody_10bcx_51{flex:1;min-height:0}._headerFilterRow_h1geg_9{grid-column:1/-1;grid-template-columns:subgrid;top:var(--dg-header-height);z-index:var(--dg-z-header,6);display:grid;position:sticky}._headerFilterCell_h1geg_18{min-width:0;padding:calc(var(--dg-padding) / 2);background-color:var(--mantine-color-body);border-bottom:1px solid var(--mantine-color-default-border);align-items:center;gap:2px;display:flex;overflow:hidden}._headerFilterCell_h1geg_18[data-control-column=true]{padding:0}._headerFilterValue_h1geg_39{flex:1;min-width:0}._headerFilterOperator_h1geg_44{flex:none}._operatorItemActive_h1geg_48{color:var(--mantine-primary-color-filled);font-weight:600}._headerCell_18ma1_1{padding:0 var(--dg-padding);min-width:0;min-height:var(--dg-header-height);font-weight:600;font-size:var(--dg-header-font-size);background-color:var(--mantine-color-body);border-bottom:1px solid var(--mantine-color-default-border);-webkit-user-select:none;user-select:none;align-items:center;gap:2px;display:flex;position:relative}._headerCell_18ma1_1[data-align=right]{justify-content:flex-end}._headerCell_18ma1_1[data-align=center]{justify-content:center}._headerCell_18ma1_1[data-control-column=true]{padding:0}._headerCellFiltered_18ma1_35 ._headerTitle_18ma1_35{color:var(--mantine-primary-color-filled)}._headerTitle_18ma1_35{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-width:0;overflow:hidden}._headerCell_18ma1_1[data-align=right] ._headerTitle_18ma1_35{text-align:right}._headerCell_18ma1_1[data-align=center] ._headerTitle_18ma1_35{justify-content:center;display:flex}._headerActions_18ma1_58{flex-shrink:0;align-items:center;gap:0;margin-left:auto;display:flex}._headerCell_18ma1_1[data-align=right] ._headerActions_18ma1_58{order:-1;margin-left:0;margin-right:auto}._headerAction_18ma1_58{display:none}._headerCell_18ma1_1:hover ._headerAction_18ma1_58,._headerCell_18ma1_1:focus-within ._headerAction_18ma1_58,._headerAction_18ma1_58[data-pinned-visible=true]{display:flex}._headerCellSortable_18ma1_87{cursor:pointer}._sortAction_18ma1_93:not([data-sorted]){opacity:.55}._sortAction_18ma1_93:not([data-sorted]):hover{opacity:1}._sortIndex_18ma1_103{color:var(--mantine-color-dimmed);text-align:center;min-width:10px;font-size:10px;font-weight:600;line-height:1}._headerCellDragging_18ma1_115{opacity:.4}._headerCellDropBefore_18ma1_119:before,._headerCellDropAfter_18ma1_120:before{content:"";background-color:var(--mantine-primary-color-filled);z-index:5;pointer-events:none;width:2px;position:absolute;top:0;bottom:0}._headerCellDropBefore_18ma1_119:before{left:0}._headerCellDropAfter_18ma1_120:before{right:0}._columnSeparator_18ma1_140{z-index:1;justify-content:center;width:10px;height:50%;display:flex;position:absolute;top:25%;right:0;transform:translate(50%)}._headerCell_18ma1_1:last-child ._columnSeparator_18ma1_140{justify-content:flex-end;transform:none}._columnSeparatorResizable_18ma1_162{cursor:col-resize;touch-action:none}._columnSeparator_18ma1_140:after{content:"";background-color:#0000;width:1px;height:100%;transition:background-color .12s,width .12s}._headerCell_18ma1_1:hover ._columnSeparator_18ma1_140:after,._headerCell_18ma1_1:focus-within ._columnSeparator_18ma1_140:after{background-color:var(--mantine-color-default-border)}._columnSeparatorResizable_18ma1_162:hover:after,._columnSeparatorActive_18ma1_185:after{background-color:var(--mantine-primary-color-filled);width:2px}._menuItemActive_18ma1_191{background-color:var(--mantine-color-default-hover);font-weight:600}._toolbar_gwk05_1{align-items:center;gap:var(--mantine-spacing-xs);padding:6px var(--mantine-spacing-xs);flex-shrink:0;min-height:42px;display:flex}._toolbar_gwk05_1[data-with-bottom-border]{border-bottom:1px solid var(--mantine-color-default-border)}._toolbarSpacer_gwk05_15{flex:1}._summaryCount_gwk05_19{white-space:nowrap}._title_199r2_1{font-weight:500}._list_199r2_5{border:1px solid var(--mantine-color-default-border);border-radius:var(--mantine-radius-default);flex-direction:column;display:flex;overflow:hidden}._listHeader_199r2_13{justify-content:space-between;align-items:center;gap:var(--mantine-spacing-sm);padding:var(--mantine-spacing-xs) var(--mantine-spacing-sm);background-color:var(--mantine-color-default-hover);border-bottom:1px solid var(--mantine-color-default-border);display:flex}._headerLabel_199r2_23{cursor:pointer;font-weight:500}._rows_199r2_28{padding:calc(var(--mantine-spacing-xs) / 2) 0;flex-direction:column;display:flex}._row_199r2_28{padding:0 var(--mantine-spacing-sm)}._row_199r2_28:hover{background-color:var(--mantine-color-default-hover)}._rowBody_199r2_45{align-items:center}._rowLabelWrapper_199r2_49{flex:1;min-width:0}._rowLabel_199r2_49{justify-content:space-between;align-items:center;gap:var(--mantine-spacing-sm);padding-block:calc(var(--mantine-spacing-xs) * .75);cursor:pointer;display:flex}._rowText_199r2_63{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}._rowHint_199r2_69{font-size:var(--mantine-font-size-xs);color:var(--mantine-color-dimmed);flex:none}._empty_199r2_75{padding:var(--mantine-spacing-xs) var(--mantine-spacing-sm)}
 /*$vite$:1*/

package/docs/columns.md

@@ -47,6 +47,13 @@ addresses the column by id - `initialState`, `editing.columns`, `moveColumn`,
 a test selector - takes the underscore form; the dotted form silently matches
 nothing.
 
+Each column the helper returns also carries, in its type only, its id,
+`meta.type`, value type, `meta.filter.operators`, and its `enableColumnFilter`,
+`enableSorting` and `meta.filter.url` switches.
+[Typed links](/docs/persistence#typed-links) read them, so a link into the grid
+can name only the filters and sorts its columns offer.
+Only literal values count: `enableSorting: isAdmin` reads as not sortable.
+
 ### Columns derived from the other rows
 
 `accessorFn` is handed one row, so a value that depends on the rest - a share
@@ -100,6 +107,7 @@ Its type is `TMDataGridColumnMeta`.
 | --- | --- | --- | --- |
 | `defaultOperator` | `TMDataGridFilterOperator` | The type's default | The operator a fresh filter starts with. See [Filtering](/docs/filtering#operators). |
 | `control` | `TMDataGridFilterControlComponent` | By type and operator | Replaces the filter panel's value control. See [Filtering](/docs/filtering#replacing-the-value-control). |
+| `url` | `boolean` | `true` | Keeps the column's filter out of a `persist.urlKey` link when `false`. See [Deep links](/docs/persistence#deep-links). |
 
 ```tsx
 meta: {
@@ -314,7 +322,7 @@ column can be placed in front of it.
 | `meta.align` | Column meta | `"left" \| "right" \| "center"` | `"left"` | Header and cell alignment. |
 | `meta.colSpan` | Column meta | `number \| (args) => number` | `1` | Columns the cell covers on a row. See [Spanning columns](#spanning-columns). |
 | `TMDataGridColSpanArgs` | Type | `{ row, table }` | – | What a `meta.colSpan` function receives. |
-| `meta.filter` | Column meta | `TMDataGridColumnFilterOptions` | – | How the column filters: `defaultOperator`, `control`. |
+| `meta.filter` | Column meta | `TMDataGridColumnFilterOptions` | – | How the column filters: `operators`, `defaultOperator`, `control`, `url`. |
 | `meta.edit` | Column meta | `TMDataGridColumnEditOptions` | – | How the column edits: `enabled`, `field`, `editor`, `validate`, `mapValue`. |
 | `resolveColumnOptions` | Export | `({ table, column, row? }) => options` | – | Normalises all three `meta.options` forms. |
 | `optionsToComboboxData` | Export | `(options) => ComboboxData` | – | Options as Mantine `Select` data. |

package/docs/components.md

@@ -88,6 +88,7 @@ Pass the row type so the handlers are typed:
 | `rowClassName` | `string \| (row) => string` | – | Class for a body row. See [Row styling](/docs/row-styling). |
 | `rowStyle` | `TMDataGridRowStyle \| (row) => TMDataGridRowStyle` | – | Inline style for a body row. Set `--row-bg` rather than `background`. See [Row styling](/docs/row-styling#set-the-row-background). |
 | `striped` | `boolean` | `false` | If set, every second row takes `--dg-row-striped-bg`. See [Striping](/docs/row-styling#striping). |
+| `highlightOnHover` | `boolean` | On for rows that answer a click or a right-click | Whether a body row takes the hover tint. See [Hover](/docs/row-styling#hover). |
 | `onScrollToTop` · `onScrollToBottom` · `onScrollToLeft` · `onScrollToRight` | `() => void` | – | Called once on arriving at that edge, not on mount and not per scroll event. See [Edge callbacks](/docs/scrolling#edge-callbacks). |
 | `onReachEnd` | `() => void` | – | Called as the scroll nears the last row, once per row count. Sorting and filtering must be server-side. See [Infinite scroll](/docs/server-side#infinite-scroll). |
 | `reachEndThreshold` | `number` | `10` | Rows before the end at which `onReachEnd` fires. |

package/docs/filtering.md

@@ -98,6 +98,8 @@ columnHelper.accessor("customer", {
 
 `getColumnOperators(column)` returns the resolved list, and `getColumnDefaultOperator(column)` the operator a fresh filter on it opens on.
 
+`meta.filter.url` keeps a column's filter out of a `persist.urlKey` link. See [Deep links](/docs/persistence#deep-links).
+
 ## The filters option
 
 `filters` on `useTMDataGrid` decides where the filter controls render.
@@ -204,6 +206,7 @@ file: columns/FilterPanelPlaced.tsx
 ## TMDataGrid.FilterPills
 
 One pill per active filter - `First name: Sofia ✕` - where the ✕ clears that filter and a click on the label sends the user to that column's control through [openColumnFilter](#opencolumnfilter).
+A value with an option reads as the option's label, and a boolean value as `labels.booleanTrue` or `labels.booleanFalse`.
 Half-typed filters produce no pill.
 The label spells the operator out unless it is the column type's default: `Age is greater than 30`, but `First name: Sofia`.
 
@@ -426,6 +429,7 @@ stays, empty.
 | `meta.filter.operators` | Column meta | `readonly TMDataGridFilterOperator[]` | The type's list | The operators this column offers, a subset of its type's. |
 | `meta.filter.defaultOperator` | Column meta | `TMDataGridFilterOperator` | The type's default, else the first offered | The operator a fresh filter opens on. |
 | `meta.filter.control` | Column meta | `TMDataGridFilterControlComponent` | By type and operator | Replaces the value control. |
+| `meta.filter.url` | Column meta | `boolean` | `true` | Keeps the column's filter out of a `persist.urlKey` link when `false`. See [Deep links](/docs/persistence#deep-links). |
 | `filterFn` | Column option | `TMDataGridFilterFn<TData>` \| name | `"tmDataGrid"` | Custom matching for one column. Receives the `{ operator, value }` envelope. |
 | `TMDataGridFilterFn<TData>` | Type | `(row, columnId, filter: TMDataGridFilterValue, addMeta?) => boolean` | – | The signature of a column's own `filterFn`. |
 | `tmDataGridFilterFn` | Export | `(row, columnId, filterValue: unknown) => boolean`, assignable to `TMDataGridFilterFn<TData>` | – | The shared matcher, for a custom `filterFn` to delegate to. |
@@ -444,7 +448,7 @@ stays, empty.
 | `getColumnOperators` · `getColumnDefaultOperator` | Exports | `(column) => operators` · `(column) => operator` | – | The list one column offers after `meta.filter.operators`, and the operator a fresh filter on it opens on. |
 | `FILTER_OPERATOR_LABELS` | Export | record | – | The label shown for each operator. |
 | `TMDataGridFilterValueInput` | Export | component | – | The default value control, for falling back to. |
-| `formatFilterLabel` | Export | `({ label, type, filter }) => string` | – | The one-line description used on the pills. |
+| `formatFilterLabel` | Export | `({ label, type, filter, operatorLabels?, options?, labels? }) => string` | – | The one-line description used on the pills. `operatorLabels` names the operators, `options` gives a value its option's label, and `labels` gives a boolean its `booleanTrue` / `booleanFalse`; each defaults to English or to the value itself. |
 | `emptyValueForOperator` · `operatorNeedsValue` · `operatorTakesArrayValue` · `operatorTakesRangeValue` · `filterValueShape` | Exports | – | – | What shape of value an operator expects. |
 | `TMDataGridFilterValueShape` | Type | `"scalar" \| "set" \| "range"` | – | What `filterValueShape` returns for an operator. |
 | `TMDataGridFiltersOptions` · `TMDataGridFiltersSettings` · `TMDataGridFilterSurface` · `TMDataGridFilterSidebarSide` | Types | – | – | The `filters` option, and the resolved form of it on `api.filters`. |

package/docs/grouping.md

@@ -160,7 +160,7 @@ server-side can set `enableGrouping: true` alongside `manualGrouping: true`. See
 | `aggregationFn` | Column option | `TMDataGridAggregationName \| fn` | – | How a column fills in its group cells. Unset leaves them blank. |
 | `aggregatedCell` | Column option | `(ctx) => ReactNode` | `cell` over the aggregate when `aggregationFn` is set, else blank | Renders a group row's value differently from a data row's. |
 | `GROUP_COLUMN_ID` | Export | `"__group__"` | – | Id of the generated tree column. |
-| `formatGroupValue` | Export | `(value) => string` | – | How the tree lane renders a group's value. |
+| `formatGroupValue` | Export | `(value, blankLabel?, { type?, options?, labels? }?) => string` | – | How the tree lane writes a group's value: `blankLabel` for an empty value, an option's label for a value with an option, `labels.booleanTrue` / `booleanFalse` for a boolean, and `toLocaleDateString()` for a `Date`. |
 | `getGroupDataRows` | Export | `(row) => Row[]` | – | Every record under a group row, at any depth. |
 | `isPagingActive` | Export | `(table, features) => boolean` | – | Whether the pager is slicing anything. `false` while grouped. |
 | `--dg-row-group-bg` | CSS variable | colour | Themed | Group row background. |

package/docs/localization.md

@@ -111,8 +111,8 @@ shows it; a function label shows its template:
 | `filterFrom` | `From` | The lower bound of a `between` filter: its input, or its slider thumb. |
 | `filterTo` | `To` | The upper bound of a `between` filter: its input, or its slider thumb. |
 | `filterAll` | `All` | The no-filter segment of the tri-state filter. |
-| `booleanTrue` | `Yes` | The `true` choice of a boolean filter value control and of the tri-state filter. |
-| `booleanFalse` | `No` | The `false` choice of a boolean filter value control and of the tri-state filter. |
+| `booleanTrue` | `Yes` | The `true` choice of a boolean filter value control and of the tri-state filter, and a `true` value on a filter pill and in a group row. |
+| `booleanFalse` | `No` | The `false` choice of a boolean filter value control and of the tri-state filter, and a `false` value on a filter pill and in a group row. |
 | `addFilter` | `Add filter` | Button in `TMDataGrid.FilterPanel`. |
 | `clearAllFilters` | `Clear all` | Button in `TMDataGrid.FilterPanel` and in `TMDataGrid.FilterPills`. |
 | `closeFilters` | `Close filters` | `aria-label` of the close button of the filter popup and sidebar. |
@@ -134,7 +134,7 @@ shows it; a function label shows its template:
 | `moveRight` | `Move right` | Column menu item. |
 | `autosizeColumn` | `Autosize column` | Column menu item. |
 | `hideColumn` | `Hide column` | Column menu item. |
-| `filterOn` | `` `Filter on ${column}` `` | `aria-label` of the header filter button, of a header filter cell, and of the value control in it. |
+| `filterOn` | `` `Filter on ${column}` `` | `aria-label` of the header filter button, of the header filter cell of a column that can filter, and of the value control in it. |
 | `sortColumn` | `` `Sort ${column}` `` | `aria-label` of the header sort button. |
 | `columnMenu` | `` `${column} column menu` `` | `aria-label` of the column menu trigger. |
 | `rowsPerPage` | `Rows per page:` | `TMDataGrid.Footer`: the text before the page size select. |

package/docs/persistence.md

@@ -6,7 +6,8 @@ return to the grid as they left it.
 State is split across **two keys**: `settingsKey` for the column layout, which
 stays valid indefinitely, and `dataKey` for filters, sorting and pagination,
 which go stale as the data underneath them changes. Either can be cleared
-without touching the other.
+without touching the other. A third key, `urlKey`, keeps data slices in the
+page URL instead, as a [deep link](#deep-links).
 
 ```tsx
 // Module scope: the object is a dependency of the write subscription.
@@ -32,6 +33,7 @@ extraSources: data/employeeColumns.tsx
 | Group | Slices | Lifetime |
 | --- | --- | --- |
 | `dataKey` | `columnFilters`, `globalFilter`, `sorting`, `pagination`, `expanded` | As long as the data means the same thing |
+| `urlKey` | The data slices. A slice listed here is taken out of `dataKey` | As long as the link is opened. See [Deep links](#deep-links) |
 | `settingsKey` | `columnVisibility`, `columnSizing`, `columnOrder`, `columnPinning`, `grouping` | Indefinite. This is the user's layout |
 
 `DATA_STATE_SLICES` and `SETTINGS_STATE_SLICES` are exported with the same
@@ -57,6 +59,173 @@ const persist = {
 Only the selected slices are read back, so a payload written before you narrowed
 the selection cannot reintroduce slices you have since opted out of.
 
+## Deep links
+
+`urlKey` keeps data slices in one URL search param, so a link to the page opens
+the grid on the same filters. The string is the param name, and the slices
+follow the same rules as `dataKey`: a bare key takes every data slice, a tuple a
+subset. A slice lives in one group, so a slice listed under `urlKey` is taken
+out of `dataKey`:
+
+```tsx
+const persist = {
+  settingsKey: "employees.settings",
+  // Sorting is remembered per browser; the filters travel in the link.
+  dataKey: ["employees.data", ["sorting"]],
+  urlKey: ["employees", ["columnFilters", "globalFilter"]],
+} satisfies TMDataGridPersistence;
+```
+
+```demo
+file: data/DeepLinks.tsx
+hint: Filter a column, then copy the address bar into a new tab. The Location filter stays out of the link.
+extraSources: data/employeeColumns.tsx
+```
+
+The param carries only the slices whose value differs from the initial state,
+`initialState` merged over the grid defaults, and only the column filters that
+are active. When nothing differs, the param is removed. A link without the
+param, or without a slice, opens on the initial state; a URL slice never falls
+back to storage.
+
+Writes use `history.replaceState`, so a filter change never adds a history
+entry. Only the grid's own param changes; the path, the hash, other params and
+`history.state` are kept. Two grids on one page use two keys.
+
+The URL payload carries no version stamp, because a bookmarked link has to
+survive a release. The shape guards and the realignment against existing
+columns apply as they do to storage, and so do `serialize` and `deserialize`.
+
+Note that a bare `dataKey` hands the URL slices over silently, while a
+`dataKey` tuple that names a slice `urlKey` also lists is reported with
+`console.error` on mount; `urlKey` handles the slice either way.
+
+### Keeping a column out of the link
+
+Set `meta.filter.url` to `false` on a column whose filter should not travel
+with the link:
+
+```tsx
+columnHelper.accessor("owner", {
+  header: "Owner",
+  meta: { filter: { url: false } },
+});
+```
+
+The column's filter is then not persisted anywhere. A filter on it in
+`initialState` still applies when a link is opened. The flag has no effect
+unless `urlKey` carries `columnFilters`.
+
+### Typed links
+
+`createTMDataGridUrlState` defines a grid's deep links from its columns.
+Pass it the array the grid renders, built with `createTMDataGridColumnHelper`:
+
+```tsx
+const columns = columnHelper.columns([
+  columnHelper.accessor("department", { header: "Department", meta: { type: "select" } }),
+  columnHelper.accessor("salary", { header: "Salary", meta: { type: "number" } }),
+  columnHelper.accessor("email", { header: "Email", enableColumnFilter: false }),
+]);
+
+export const employeesUrl = createTMDataGridUrlState({
+  key: "employees",
+  columns,
+  slices: ["columnFilters", "sorting"],
+});
+
+// The grid
+const persist = { urlKey: employeesUrl.urlKey } satisfies TMDataGridPersistence;
+
+// A link from anywhere in the app
+const href = `/employees?${employeesUrl.searchParams({
+  filters: { department: { operator: "isAnyOf", value: ["Design"] } },
+  sorting: [{ id: "salary", desc: true }],
+})}`;
+```
+
+A link may name only what the grid's columns offer:
+
+- `filters` takes the columns that can be filtered: `enableColumnFilter` is not `false` and `meta.filter.url` is not `false`.
+- The operators are the ones the column's `meta.type` offers, narrowed by `meta.filter.operators`.
+- The value has the column's type: a `number` for a number column, a `Date` or a `YYYY-MM-DD` string for a date column, the column's own values for a select column, and no value for `isEmpty` and `isNotEmpty`.
+- `sorting` takes the columns whose `enableSorting` is not `false`.
+- Only the slices in `slices` are accepted. By default, every data slice is.
+
+Anything else is a type error.
+The column helper reads these switches from literal values, so `enableSorting: isAdmin` reads as not sortable.
+A column with an accessor function is named by its `id`; without an `id` it cannot be named.
+Columns built without the helper offer nothing to a link.
+
+The definition builds the link in three forms:
+
+- `searchParams(input)` - `URLSearchParams` for a plain URL, encoded the way the default `serialize` encodes the param
+- `search(input)` - `{ [key]: payload }`, for a router that keeps objects in its search
+- `payload(input)` - the param's value alone, in the grid's state shape
+
+Pass `searchParams` the same `serialize` as `persist` when you set one.
+
+### Routers that own the URL
+
+`urlStorage` replaces the default read and write of the param, for a router
+that validates its search params and would not see a `replaceState` call.
+`get` returns the param's string or `null`; `set` receives the string, or
+`null` to remove the param. Keep `persist` referentially stable here too:
+react-router rebuilds `setSearchParams` on every URL change, so read it
+through a ref rather than listing it as a dependency:
+
+```tsx
+// react-router: let the router do the replace.
+const [, setSearchParams] = useSearchParams();
+const setSearchParamsRef = useRef(setSearchParams);
+setSearchParamsRef.current = setSearchParams;
+
+const persist = useMemo(
+  () =>
+    ({
+      urlKey: ["employees", ["columnFilters"]],
+      urlStorage: {
+        get: (name) => new URLSearchParams(window.location.search).get(name),
+        set: (name, value) =>
+          setSearchParamsRef.current(
+            (prev) => {
+              if (value === null) prev.delete(name);
+              else prev.set(name, value);
+              return prev;
+            },
+            { replace: true },
+          ),
+      },
+    }) satisfies TMDataGridPersistence,
+  [],
+);
+```
+
+A router that keeps objects in its search params and encodes them itself,
+such as TanStack Router, takes the payload as an object.
+Pass its search to `persist` on a typed link definition:
+
+```tsx
+const router = useRouter();
+const persist = useMemo(
+  () =>
+    employeesUrl.persist({
+      get: (name) => (router.state.location.search as Record<string, unknown>)[name],
+      set: (name, value) =>
+        void router.navigate({
+          to: ".",
+          search: (prev: Record<string, unknown>) => ({ ...prev, [name]: value }),
+          replace: true,
+        }),
+    }),
+  [router],
+);
+```
+
+`get` returns the param's value, or `undefined`; `set` receives the payload, or `undefined` to remove the param.
+Leave `serialize` and `deserialize` at their defaults with `persist(storage)`, since the router does the encoding.
+[Typed links with TanStack Router](/docs/typed-deep-links) puts the route, the grid and the links together.
+
 ## Behaviour
 
 **Restoring happens once**, on mount, through `initialState`. Writing is a
@@ -103,7 +272,25 @@ its `StorageType`.
 | `persist` | Option | `TMDataGridPersistence` | – | The whole configuration. Keep it referentially stable. |
 | `dataKey` | persist field | `string \| [string, DataSlice[]]` | – | Storage key for the data group. |
 | `settingsKey` | persist field | `string \| [string, SettingsSlice[]]` | – | Storage key for the settings group. |
-| `TMDataGridPersistKey` | Type | `string \| [string, slices]` | – | The type of `dataKey` and `settingsKey`. |
+| `urlKey` | persist field | `string \| [string, DataSlice[]]` | – | Search param for data slices kept in the URL. See [Deep links](#deep-links). |
+| `urlStorage` | persist field | `TMDataGridUrlStorage` | `location.search` and `history.replaceState` | Reads and writes the URL param. |
+| `TMDataGridUrlStorage` | Type | `{ get(name): string \| null; set(name, value: string \| null): void }` | – | The type of `urlStorage`. |
+| `createTMDataGridUrlState` | Export | `({ key, columns, slices? }) => TMDataGridUrlState` | – | Defines typed links into the grid from its columns. See [Typed links](#typed-links). |
+| `key` | Definition field | `string` | – | The URL search param. |
+| `slices` | Definition field | `TMDataGridDataSlice[]` | Every data slice | The data slices the param carries. |
+| `urlKey` | Definition field | `TMDataGridPersistKey` | – | For `persist.urlKey`: the key, or `[key, slices]` when `slices` is set. |
+| `searchParams` | Definition method | `(input, { serialize? }) => URLSearchParams` | `serialize`: `JSON.stringify` | The link as search params. Empty when the input sets nothing. |
+| `search` | Definition method | `(input) => { [key]: TMDataGridUrlPayload \| undefined }` | – | The link as a router search object. |
+| `payload` | Definition method | `(input) => TMDataGridUrlPayload \| undefined` | – | The param's value, or `undefined` when the input sets nothing. |
+| `validateSearch` | Definition method | `(search) => { [key]?: TMDataGridUrlPayload }` | – | A route search validator. Keeps the param when it is an object. |
+| `persist` | Definition method | `(storage?: TMDataGridUrlSearchStorage) => { urlKey, urlStorage? }` | – | Spread into `persist`. If not given a storage, the grid uses the browser's URL. |
+| `TMDataGridUrlInput` | Type | `{ filters?, globalFilter?, sorting?, pagination? }` | – | What a link may set, typed from the columns and `slices`. |
+| `TMDataGridUrlPayload` | Type | `{ columnFilters?, globalFilter?, sorting?, pagination?, expanded? }` | – | The param's value, in the grid's state shape. |
+| `TMDataGridUrlSearchStorage` | Type | `{ get(name): unknown; set(name, value: TMDataGridUrlPayload \| undefined): void }` | – | A router search read and written as values. |
+| `TMDataGridColumnInfo` · `TMDataGridColumnInfoOf` · `TMDataGridTypedColumn` | Types | – | – | What a helper column tells a link about itself: id, type, value, operators, and its filter, sort and URL switches. |
+| `TMDataGridUrlFiltersInput` · `TMDataGridUrlSortableId` · `TMDataGridDateInput` | Types | – | – | The parts of `TMDataGridUrlInput`. |
+| `meta.filter.url` | Column meta | `boolean` | `true` | Determines whether the column's filter is written to the URL under `urlKey`. |
+| `TMDataGridPersistKey` | Type | `string \| [string, slices]` | – | The type of `dataKey`, `settingsKey` and `urlKey`. |
 | `storageMode` | persist field | `"localStorage" \| "sessionStorage"` | `"localStorage"` | Storage area. `"sessionStorage"` is per tab. |
 | `TMDataGridStorageMode` | Type | `"localStorage" \| "sessionStorage"` | – | The type of `storageMode`. |
 | `serialize` | persist field | `(value) => string` | `JSON.stringify` | Serializes a payload before storing. |

package/docs/row-details.md

@@ -128,6 +128,11 @@ not select or highlight the row underneath. It carries
 `data-dg-part="details"` with the row's `data-row-id`. See
 [Testing](/docs/testing).
 
+The panel has no padding. Its content starts at the row's left edge and ends at
+its right edge, so a nested grid, a tab strip or an image fills the row. Give
+content that should line up with the cell text `padding: var(--dg-padding)`,
+the [cell padding](/docs/styling#css-variables) of the grid's `size`.
+
 Group rows have no panel. Expanding one opens its children.
 
 Rows are virtualized. A row that leaves the viewport and the `overscan`

package/docs/row-interaction.md

@@ -22,7 +22,7 @@ hint: Click, double-click and right-click anywhere in the body.
 
 | Prop | Argument | Notes |
 | --- | --- | --- |
-| `onRowClick` | `row` | Rows show a pointer cursor when set. |
+| `onRowClick` | `row` | Rows show a pointer cursor and the [hover tint](/docs/row-styling#hover) when set. |
 | `onCellClick` | `{ cell, row, column, event }` | The cell cursor still moves. |
 | `onCellDoubleClick` | same | A double-click that opens an editor still does. |
 | `onCellContextMenu` | same | `renderRowContextMenu` and the cell-selection menu still open. |

package/docs/row-styling.md

@@ -95,6 +95,21 @@ virtualization rather than sticking to particular records.
 
 Pinned rows are not striped: they have left the scrolling order.
 
+## Hover
+
+A row takes the hover tint under the pointer when the row itself answers a
+gesture: `selectionMode: "row"` or a highlight mode, `onRowClick`, or
+`renderRowContextMenu`. A grid with none of those shows no hover tint, and a
+group row never does, since it sits out those gestures.
+
+`highlightOnHover` overrides that: `true` tints every row, `false` none.
+
+```tsx
+<TMDataGrid.Table highlightOnHover={false} />
+```
+
+A row carries `data-highlight-on-hover="true"` while the tint applies.
+
 ## Styling by state
 
 Rows carry data attributes for their state, so a stylesheet can target any of
@@ -108,6 +123,7 @@ it without a callback:
 | `data-grouped` | Group rows |
 | `data-depth` | Every row. The nesting level |
 | `data-context-menu` | The row whose context menu is open |
+| `data-highlight-on-hover` | Rows that take the hover tint. See [Hover](#hover) |
 | `data-row-id` | Every row. Its id, which [tests](/docs/testing) key off |
 
 The state attributes are present, with the value `"true"`, only on the rows
@@ -127,6 +143,7 @@ they apply to, so the bare attribute and the value match the same rows:
 | `rowStyle` | Table prop | `TMDataGridRowStyle \| (row) => TMDataGridRowStyle` | – | Inline style for a body row. |
 | `rowClassName` | Table prop | `string \| (row) => string \| undefined` | – | Class for a body row, added after the grid's own. |
 | `striped` | Table prop | `boolean` | `false` | Every second row takes `--dg-row-striped-bg`. |
+| `highlightOnHover` | Table prop | `boolean` | On for rows that answer a click or a right-click | Whether a body row takes the hover tint. |
 | `TMDataGridRowStyle` | Export | type | – | `CSSProperties` or an object of `--*` custom properties. |
 | `--row-bg` | CSS variable | colour | – | The row's own background, composed over the body colour and under hover, selection and range. |
 | `--dg-row-striped-bg` | CSS variable | colour | Themed | The stripe colour. |