@toolbox-web/grid 1.1.1 → 1.1.2

package/umd/plugins/grouping-rows.umd.js

@@ -1,2 +1,2 @@
-(function(c,y){typeof exports=="object"&&typeof module<"u"?y(exports,require("../../core/plugin/base-plugin"),require("../../core/plugin/expander-column"),require("../../core/internal/aggregators")):typeof define=="function"&&define.amd?define(["exports","../../core/plugin/base-plugin","../../core/plugin/expander-column","../../core/internal/aggregators"],y):(c=typeof globalThis<"u"?globalThis:c||self,y(c.TbwGridPlugin_groupingRows={},c.TbwGrid,c.TbwGrid,c.TbwGrid))})(this,(function(c,y,m,b){"use strict";function x({rows:l,config:e,expanded:t}){const r=e.groupOn;if(typeof r!="function")return[];const o={key:"__root__",value:null,depth:-1,rows:[],children:new Map};if(l.forEach(i=>{let s=r(i);s==null||s===!1?s=["__ungrouped__"]:Array.isArray(s)||(s=[s]);let a=o;s.forEach((h,g)=>{const f=h==null?"∅":String(h),d=a.key==="__root__"?f:a.key+"||"+f;let p=a.children.get(f);p||(p={key:d,value:h,depth:g,rows:[],children:new Map,parent:a},a.children.set(f,p)),a=p}),a.rows.push(i)}),o.children.size===1&&o.children.has("__ungrouped__")&&o.children.get("__ungrouped__").rows.length===l.length)return[];const n=[],u=i=>{if(i===o){i.children.forEach(a=>u(a));return}const s=t.has(i.key);n.push({kind:"group",key:i.key,value:i.value,depth:i.depth,rows:i.rows,expanded:s}),s&&(i.children.size?i.children.forEach(a=>u(a)):i.rows.forEach(a=>n.push({kind:"data",row:a,rowIndex:l.indexOf(a)})))};return u(o),n}function v(l,e){const t=new Set(l);return t.has(e)?t.delete(e):t.add(e),t}function R(l){const e=new Set;for(const t of l)t.kind==="group"&&e.add(t.key);return e}function C(){return new Set}function A(l){return l.kind!=="group"?0:l.rows.length}const K="@layer tbw-plugins{.group-row{display:grid;grid-template-columns:var(--tbw-column-template);background:var(--tbw-grouping-rows-bg, var(--tbw-color-panel-bg));font-weight:500;border-bottom:var(--tbw-row-divider);min-height:var(--tbw-row-height)}.group-row .cell{display:flex;align-items:center;padding:var(--tbw-cell-padding, .125rem .5rem)}.group-row:hover{background:var(--tbw-grouping-rows-bg-hover, var(--tbw-color-row-hover))}.group-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;width:var(--tbw-toggle-size, 1.25rem);height:var(--tbw-toggle-size, 1.25rem);margin-right:.25rem;background:none;border:0;font:inherit}.group-toggle:hover{background:var(--tbw-grouping-rows-toggle-hover, var(--tbw-color-row-hover));border-radius:var(--tbw-border-radius, .125rem)}.group-label{display:inline-flex;align-items:center;gap:var(--tbw-panel-gap, var(--tbw-spacing-md, .5rem))}.group-count{color:var(--tbw-grouping-rows-count-color, var(--tbw-color-fg-muted));font-size:var(--tbw-font-size-xs, .85em);font-weight:400}.group-row{padding-left:calc(var(--tbw-group-depth, 0) * var(--tbw-group-indent-width, 1.25em))}.data-grid-row.tbw-group-slide-in{animation:tbw-group-slide-in var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}@keyframes tbw-group-slide-in{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}.data-grid-row.tbw-group-fade-in{animation:tbw-group-fade-in var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}@keyframes tbw-group-fade-in{0%{opacity:0}to{opacity:1}}}";class k extends y.BaseGridPlugin{name="groupingRows";styles=K;get defaultConfig(){return{defaultExpanded:!1,showRowCount:!0,indentWidth:20,aggregators:{},animation:"slide"}}expandedKeys=new Set;flattenedRows=[];isActive=!1;previousVisibleKeys=new Set;keysToAnimate=new Set;get animationStyle(){return this.isAnimationEnabled?this.config.animation??"slide":!1}detach(){this.expandedKeys.clear(),this.flattenedRows=[],this.isActive=!1,this.previousVisibleKeys.clear(),this.keysToAnimate.clear()}static detect(e,t){return typeof t?.groupOn=="function"||typeof t?.enableRowGrouping=="boolean"}processRows(e){const t=this.config;if(typeof t.groupOn!="function")return this.isActive=!1,this.flattenedRows=[],[...e];const r=x({rows:[...e],config:t,expanded:this.expandedKeys});if(r.length===0)return this.isActive=!1,this.flattenedRows=[],[...e];this.isActive=!0,this.flattenedRows=r,this.keysToAnimate.clear();const o=new Set;return r.forEach((n,u)=>{if(n.kind==="data"){const i=`data-${u}`;o.add(i),this.previousVisibleKeys.has(i)||this.keysToAnimate.add(i)}}),this.previousVisibleKeys=o,r.map(n=>n.kind==="group"?{__isGroupRow:!0,__groupKey:n.key,__groupValue:n.value,__groupDepth:n.depth,__groupRows:n.rows,__groupExpanded:n.expanded,__groupRowCount:A(n)}:n.row)}onCellClick(e){const t=e.row;if(t?.__isGroupRow&&e.originalEvent.target?.closest(".group-toggle"))return this.toggle(t.__groupKey),!0}onKeyDown(e){if(e.key!==" ")return;const t=this.grid._focusRow,r=this.rows[t];if(r?.__isGroupRow)return e.preventDefault(),this.toggle(r.__groupKey),this.requestRenderWithFocus(),!0}renderRow(e,t,r){if(!e?.__isGroupRow)return!1;const o=this.config;if(o.groupRowRenderer){const i=()=>{this.toggle(e.__groupKey)},s=o.groupRowRenderer({key:e.__groupKey,value:e.__groupValue,depth:e.__groupDepth,rows:e.__groupRows,expanded:e.__groupExpanded,toggleExpand:i});if(s)return t.className="data-grid-row group-row",t.__isCustomRow=!0,t.setAttribute("data-group-depth",String(e.__groupDepth)),typeof s=="string"?t.innerHTML=s:(t.innerHTML="",t.appendChild(s)),!0}const n=()=>{this.toggle(e.__groupKey)};return t.className="data-grid-row group-row",t.__isCustomRow=!0,t.setAttribute("data-group-depth",String(e.__groupDepth)),t.setAttribute("role","row"),t.setAttribute("aria-expanded",String(e.__groupExpanded)),t.style.setProperty("--tbw-group-depth",String(e.__groupDepth||0)),o.indentWidth!==void 0&&t.style.setProperty("--tbw-group-indent-width",`${o.indentWidth}px`),t.innerHTML="",o.fullWidth!==!1?this.renderFullWidthGroupRow(e,t,n):this.renderPerColumnGroupRow(e,t,n),!0}afterRender(){const e=this.animationStyle;if(e===!1||this.keysToAnimate.size===0)return;const t=this.gridElement?.querySelector(".rows");if(!t)return;const r=e==="fade"?"tbw-group-fade-in":"tbw-group-slide-in";for(const o of t.querySelectorAll(".data-grid-row:not(.group-row)")){const n=o.querySelector(".cell[data-row]"),u=n?parseInt(n.getAttribute("data-row")??"-1",10):-1,s=this.flattenedRows[u]?.kind==="data"?`data-${u}`:void 0;s&&this.keysToAnimate.has(s)&&(o.classList.add(r),o.addEventListener("animationend",()=>o.classList.remove(r),{once:!0}))}this.keysToAnimate.clear()}createToggleButton(e,t){const r=document.createElement("button");return r.type="button",r.className=`group-toggle${e?" expanded":""}`,r.setAttribute("aria-label",e?"Collapse group":"Expand group"),this.setIcon(r,this.resolveIcon(e?"collapse":"expand")),r.addEventListener("click",o=>{o.stopPropagation(),t()}),r}getGroupLabelText(e,t,r){const o=this.config;return o.formatLabel?o.formatLabel(e,t,r):String(e)}renderFullWidthGroupRow(e,t,r){const o=this.config,n=document.createElement("div");n.className="cell group-full",n.style.gridColumn="1 / -1",n.setAttribute("role","gridcell"),n.setAttribute("data-col","0"),n.appendChild(this.createToggleButton(e.__groupExpanded,r));const u=document.createElement("span");if(u.className="group-label",u.textContent=this.getGroupLabelText(e.__groupValue,e.__groupDepth||0,e.__groupKey),n.appendChild(u),o.showRowCount!==!1){const i=document.createElement("span");i.className="group-count",i.textContent=`(${e.__groupRowCount??e.__groupRows?.length??0})`,n.appendChild(i)}t.appendChild(n)}renderPerColumnGroupRow(e,t,r){const o=this.config,n=o.aggregators??{},u=this.columns,i=e.__groupRows??[],a=this.gridElement?.querySelector(".body")?.style.gridTemplateColumns||"";a&&(t.style.display="grid",t.style.gridTemplateColumns=a);let h=!1;u.forEach((g,f)=>{const d=document.createElement("div");if(d.className="cell group-cell",d.setAttribute("data-col",String(f)),d.setAttribute("role","gridcell"),m.isExpanderColumn(g)){d.setAttribute("data-field",g.field),t.appendChild(d);return}if(h){const p=n[g.field];if(p){const _=b.runAggregator(p,i,g.field,g);d.textContent=_!=null?String(_):""}else d.textContent=""}else{h=!0,d.appendChild(this.createToggleButton(e.__groupExpanded,r));const p=document.createElement("span"),_=n[g.field];if(_){const w=b.runAggregator(_,i,g.field,g);p.textContent=w!=null?String(w):String(e.__groupValue)}else p.textContent=this.getGroupLabelText(e.__groupValue,e.__groupDepth||0,e.__groupKey);if(d.appendChild(p),o.showRowCount!==!1){const w=document.createElement("span");w.className="group-count",w.textContent=` (${i.length})`,d.appendChild(w)}}t.appendChild(d)})}expandAll(){this.expandedKeys=R(this.flattenedRows),this.requestRender()}collapseAll(){this.expandedKeys=C(),this.requestRender()}toggle(e){this.expandedKeys=v(this.expandedKeys,e);const t=this.flattenedRows.find(r=>r.kind==="group"&&r.key===e);this.emit("group-toggle",{key:e,expanded:this.expandedKeys.has(e),value:t?.value,depth:t?.depth??0}),this.requestRender()}isExpanded(e){return this.expandedKeys.has(e)}expand(e){this.expandedKeys.has(e)||(this.expandedKeys=new Set([...this.expandedKeys,e]),this.requestRender())}collapse(e){if(this.expandedKeys.has(e)){const t=new Set(this.expandedKeys);t.delete(e),this.expandedKeys=t,this.requestRender()}}getGroupState(){const e=this.flattenedRows.filter(t=>t.kind==="group");return{isActive:this.isActive,expandedCount:this.expandedKeys.size,totalGroups:e.length,expandedKeys:[...this.expandedKeys]}}getRowCount(){return this.flattenedRows.length}refreshGroups(){this.requestRender()}getExpandedGroups(){return[...this.expandedKeys]}getFlattenedRows(){return this.flattenedRows}isGroupingActive(){return this.isActive}setGroupOn(e){this.config.groupOn=e,this.requestRender()}}c.GroupingRowsPlugin=k,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})}));
+(function(c,y){typeof exports=="object"&&typeof module<"u"?y(exports,require("../../core/plugin/base-plugin"),require("../../core/plugin/expander-column"),require("../../core/internal/aggregators")):typeof define=="function"&&define.amd?define(["exports","../../core/plugin/base-plugin","../../core/plugin/expander-column","../../core/internal/aggregators"],y):(c=typeof globalThis<"u"?globalThis:c||self,y(c.TbwGridPlugin_groupingRows={},c.TbwGrid,c.TbwGrid,c.TbwGrid))})(this,(function(c,y,m,b){"use strict";function x({rows:l,config:e,expanded:t}){const r=e.groupOn;if(typeof r!="function")return[];const o={key:"__root__",value:null,depth:-1,rows:[],children:new Map};if(l.forEach(i=>{let s=r(i);s==null||s===!1?s=["__ungrouped__"]:Array.isArray(s)||(s=[s]);let a=o;s.forEach((h,g)=>{const f=h==null?"∅":String(h),d=a.key==="__root__"?f:a.key+"||"+f;let p=a.children.get(f);p||(p={key:d,value:h,depth:g,rows:[],children:new Map,parent:a},a.children.set(f,p)),a=p}),a.rows.push(i)}),o.children.size===1&&o.children.has("__ungrouped__")&&o.children.get("__ungrouped__").rows.length===l.length)return[];const n=[],u=i=>{if(i===o){i.children.forEach(a=>u(a));return}const s=t.has(i.key);n.push({kind:"group",key:i.key,value:i.value,depth:i.depth,rows:i.rows,expanded:s}),s&&(i.children.size?i.children.forEach(a=>u(a)):i.rows.forEach(a=>n.push({kind:"data",row:a,rowIndex:l.indexOf(a)})))};return u(o),n}function v(l,e){const t=new Set(l);return t.has(e)?t.delete(e):t.add(e),t}function R(l){const e=new Set;for(const t of l)t.kind==="group"&&e.add(t.key);return e}function C(){return new Set}function A(l){return l.kind!=="group"?0:l.rows.length}const K="@layer tbw-plugins{.group-row{display:grid;grid-template-columns:var(--tbw-column-template);background:var(--tbw-grouping-rows-bg, var(--tbw-color-panel-bg));font-weight:500;border-bottom:var(--tbw-row-divider);min-height:var(--tbw-row-height)}.group-row .cell{display:flex;align-items:center;padding:var(--tbw-cell-padding, .125rem .5rem)}.group-row:hover{background:var(--tbw-grouping-rows-bg-hover, var(--tbw-color-row-hover))}.group-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;width:var(--tbw-toggle-size, 1.25rem);height:var(--tbw-toggle-size, 1.25rem);margin-right:.25rem;background:none;border:0;font:inherit}.group-toggle:hover{background:var(--tbw-grouping-rows-toggle-hover, var(--tbw-color-row-hover));border-radius:var(--tbw-border-radius, .125rem)}.group-label{display:inline-flex;align-items:center;gap:var(--tbw-panel-gap, var(--tbw-spacing-md, .5rem))}.group-count{color:var(--tbw-grouping-rows-count-color, var(--tbw-color-fg-muted));font-size:var(--tbw-font-size-xs, .85em);font-weight:400}.group-row{padding-left:calc(var(--tbw-group-depth, 0) * var(--tbw-group-indent-width, 1.25em))}.data-grid-row.tbw-group-slide-in{animation:tbw-group-slide-in var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}@keyframes tbw-group-slide-in{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}.data-grid-row.tbw-group-fade-in{animation:tbw-group-fade-in var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}@keyframes tbw-group-fade-in{0%{opacity:0}to{opacity:1}}}";class k extends y.BaseGridPlugin{name="groupingRows";styles=K;get defaultConfig(){return{defaultExpanded:!1,showRowCount:!0,indentWidth:20,aggregators:{},animation:"slide"}}expandedKeys=new Set;flattenedRows=[];isActive=!1;previousVisibleKeys=new Set;keysToAnimate=new Set;get animationStyle(){return this.isAnimationEnabled?this.config.animation??"slide":!1}detach(){this.expandedKeys.clear(),this.flattenedRows=[],this.isActive=!1,this.previousVisibleKeys.clear(),this.keysToAnimate.clear()}static detect(e,t){return typeof t?.groupOn=="function"||typeof t?.enableRowGrouping=="boolean"}processRows(e){const t=this.config;if(typeof t.groupOn!="function")return this.isActive=!1,this.flattenedRows=[],[...e];const r=x({rows:[...e],config:t,expanded:this.expandedKeys});if(r.length===0)return this.isActive=!1,this.flattenedRows=[],[...e];this.isActive=!0,this.flattenedRows=r,this.keysToAnimate.clear();const o=new Set;return r.forEach((n,u)=>{if(n.kind==="data"){const i=`data-${u}`;o.add(i),this.previousVisibleKeys.has(i)||this.keysToAnimate.add(i)}}),this.previousVisibleKeys=o,r.map(n=>n.kind==="group"?{__isGroupRow:!0,__groupKey:n.key,__groupValue:n.value,__groupDepth:n.depth,__groupRows:n.rows,__groupExpanded:n.expanded,__groupRowCount:A(n)}:n.row)}onCellClick(e){const t=e.row;if(t?.__isGroupRow&&e.originalEvent.target?.closest(".group-toggle"))return this.toggle(t.__groupKey),!0}onKeyDown(e){if(e.key!==" ")return;const t=this.grid._focusRow,r=this.rows[t];if(r?.__isGroupRow)return e.preventDefault(),this.toggle(r.__groupKey),this.requestRenderWithFocus(),!0}renderRow(e,t,r){if(!e?.__isGroupRow)return!1;const o=this.config;if(o.groupRowRenderer){const i=()=>{this.toggle(e.__groupKey)},s=o.groupRowRenderer({key:e.__groupKey,value:e.__groupValue,depth:e.__groupDepth,rows:e.__groupRows,expanded:e.__groupExpanded,toggleExpand:i});if(s)return t.className="data-grid-row group-row",t.__isCustomRow=!0,t.setAttribute("data-group-depth",String(e.__groupDepth)),typeof s=="string"?t.innerHTML=s:(t.innerHTML="",t.appendChild(s)),!0}const n=()=>{this.toggle(e.__groupKey)};return t.className="data-grid-row group-row",t.__isCustomRow=!0,t.setAttribute("data-group-depth",String(e.__groupDepth)),t.setAttribute("role","row"),t.setAttribute("aria-expanded",String(e.__groupExpanded)),t.style.setProperty("--tbw-group-depth",String(e.__groupDepth||0)),o.indentWidth!==void 0&&t.style.setProperty("--tbw-group-indent-width",`${o.indentWidth}px`),t.style.height="",t.innerHTML="",o.fullWidth!==!1?this.renderFullWidthGroupRow(e,t,n):this.renderPerColumnGroupRow(e,t,n),!0}afterRender(){const e=this.animationStyle;if(e===!1||this.keysToAnimate.size===0)return;const t=this.gridElement?.querySelector(".rows");if(!t)return;const r=e==="fade"?"tbw-group-fade-in":"tbw-group-slide-in";for(const o of t.querySelectorAll(".data-grid-row:not(.group-row)")){const n=o.querySelector(".cell[data-row]"),u=n?parseInt(n.getAttribute("data-row")??"-1",10):-1,s=this.flattenedRows[u]?.kind==="data"?`data-${u}`:void 0;s&&this.keysToAnimate.has(s)&&(o.classList.add(r),o.addEventListener("animationend",()=>o.classList.remove(r),{once:!0}))}this.keysToAnimate.clear()}createToggleButton(e,t){const r=document.createElement("button");return r.type="button",r.className=`group-toggle${e?" expanded":""}`,r.setAttribute("aria-label",e?"Collapse group":"Expand group"),this.setIcon(r,this.resolveIcon(e?"collapse":"expand")),r.addEventListener("click",o=>{o.stopPropagation(),t()}),r}getGroupLabelText(e,t,r){const o=this.config;return o.formatLabel?o.formatLabel(e,t,r):String(e)}renderFullWidthGroupRow(e,t,r){const o=this.config,n=document.createElement("div");n.className="cell group-full",n.style.gridColumn="1 / -1",n.setAttribute("role","gridcell"),n.setAttribute("data-col","0"),n.appendChild(this.createToggleButton(e.__groupExpanded,r));const u=document.createElement("span");if(u.className="group-label",u.textContent=this.getGroupLabelText(e.__groupValue,e.__groupDepth||0,e.__groupKey),n.appendChild(u),o.showRowCount!==!1){const i=document.createElement("span");i.className="group-count",i.textContent=`(${e.__groupRowCount??e.__groupRows?.length??0})`,n.appendChild(i)}t.appendChild(n)}renderPerColumnGroupRow(e,t,r){const o=this.config,n=o.aggregators??{},u=this.columns,i=e.__groupRows??[],a=this.gridElement?.querySelector(".body")?.style.gridTemplateColumns||"";a&&(t.style.display="grid",t.style.gridTemplateColumns=a);let h=!1;u.forEach((g,f)=>{const d=document.createElement("div");if(d.className="cell group-cell",d.setAttribute("data-col",String(f)),d.setAttribute("role","gridcell"),m.isExpanderColumn(g)){d.setAttribute("data-field",g.field),t.appendChild(d);return}if(h){const p=n[g.field];if(p){const _=b.runAggregator(p,i,g.field,g);d.textContent=_!=null?String(_):""}else d.textContent=""}else{h=!0,d.appendChild(this.createToggleButton(e.__groupExpanded,r));const p=document.createElement("span"),_=n[g.field];if(_){const w=b.runAggregator(_,i,g.field,g);p.textContent=w!=null?String(w):String(e.__groupValue)}else p.textContent=this.getGroupLabelText(e.__groupValue,e.__groupDepth||0,e.__groupKey);if(d.appendChild(p),o.showRowCount!==!1){const w=document.createElement("span");w.className="group-count",w.textContent=` (${i.length})`,d.appendChild(w)}}t.appendChild(d)})}expandAll(){this.expandedKeys=R(this.flattenedRows),this.requestRender()}collapseAll(){this.expandedKeys=C(),this.requestRender()}toggle(e){this.expandedKeys=v(this.expandedKeys,e);const t=this.flattenedRows.find(r=>r.kind==="group"&&r.key===e);this.emit("group-toggle",{key:e,expanded:this.expandedKeys.has(e),value:t?.value,depth:t?.depth??0}),this.requestRender()}isExpanded(e){return this.expandedKeys.has(e)}expand(e){this.expandedKeys.has(e)||(this.expandedKeys=new Set([...this.expandedKeys,e]),this.requestRender())}collapse(e){if(this.expandedKeys.has(e)){const t=new Set(this.expandedKeys);t.delete(e),this.expandedKeys=t,this.requestRender()}}getGroupState(){const e=this.flattenedRows.filter(t=>t.kind==="group");return{isActive:this.isActive,expandedCount:this.expandedKeys.size,totalGroups:e.length,expandedKeys:[...this.expandedKeys]}}getRowCount(){return this.flattenedRows.length}refreshGroups(){this.requestRender()}getExpandedGroups(){return[...this.expandedKeys]}getFlattenedRows(){return this.flattenedRows}isGroupingActive(){return this.isActive}setGroupOn(e){this.config.groupOn=e,this.requestRender()}}c.GroupingRowsPlugin=k,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})}));
 //# sourceMappingURL=grouping-rows.umd.js.map

package/umd/plugins/grouping-rows.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"grouping-rows.umd.js","sources":["../../../../../libs/grid/src/lib/plugins/grouping-rows/grouping-rows.ts","../../../../../libs/grid/src/lib/plugins/grouping-rows/GroupingRowsPlugin.ts"],"sourcesContent":["/**\n * Row Grouping Core Logic\n *\n * Pure functions for building grouped row models and aggregations.\n */\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nimport type { GroupRowModelItem, RenderRow, RowGroupingConfig } from './types';\n\n// Re-export aggregator functions from core for backward compatibility\nexport { getAggregator, listAggregators, registerAggregator, runAggregator } from '../../core/internal/aggregators';\n\ninterface GroupNode {\n  key: string; // composite key\n  value: any;\n  depth: number;\n  rows: any[];\n  children: Map<string, GroupNode>;\n  parent?: GroupNode;\n}\n\ninterface BuildGroupingArgs {\n  rows: any[];\n  config: RowGroupingConfig;\n  expanded: Set<string>;\n}\n\n/**\n * Build a flattened grouping projection (collapsed by default).\n * Returns empty array when groupOn not configured or all rows ungrouped.\n *\n * @param args - The grouping arguments\n * @returns Flattened array of render rows (groups + data rows)\n */\nexport function buildGroupedRowModel({ rows, config, expanded }: BuildGroupingArgs): RenderRow[] {\n  const groupOn = config.groupOn;\n  if (typeof groupOn !== 'function') {\n    return [];\n  }\n\n  const root: GroupNode = { key: '__root__', value: null, depth: -1, rows: [], children: new Map() };\n\n  // Build tree structure\n  rows.forEach((r) => {\n    let path: any = groupOn(r);\n    if (path == null || path === false) path = ['__ungrouped__'];\n    else if (!Array.isArray(path)) path = [path];\n\n    let parent = root;\n    path.forEach((rawVal: any, depthIdx: number) => {\n      const seg = rawVal == null ? '∅' : String(rawVal);\n      const composite = parent.key === '__root__' ? seg : parent.key + '||' + seg;\n      let node = parent.children.get(seg);\n      if (!node) {\n        node = { key: composite, value: rawVal, depth: depthIdx, rows: [], children: new Map(), parent };\n        parent.children.set(seg, node);\n      }\n      parent = node;\n    });\n    parent.rows.push(r);\n  });\n\n  // All ungrouped? treat as no grouping\n  if (root.children.size === 1 && root.children.has('__ungrouped__')) {\n    const only = root.children.get('__ungrouped__')!;\n    if (only.rows.length === rows.length) return [];\n  }\n\n  // Flatten tree to array\n  const flat: RenderRow[] = [];\n  const visit = (node: GroupNode) => {\n    if (node === root) {\n      node.children.forEach((c) => visit(c));\n      return;\n    }\n\n    const isExpanded = expanded.has(node.key);\n    flat.push({\n      kind: 'group',\n      key: node.key,\n      value: node.value,\n      depth: node.depth,\n      rows: node.rows,\n      expanded: isExpanded,\n    });\n\n    if (isExpanded) {\n      if (node.children.size) {\n        node.children.forEach((c) => visit(c));\n      } else {\n        node.rows.forEach((r) => flat.push({ kind: 'data', row: r, rowIndex: rows.indexOf(r) }));\n      }\n    }\n  };\n  visit(root);\n\n  return flat;\n}\n\n/**\n * Toggle expansion state for a group key.\n *\n * @param expandedKeys - Current set of expanded keys\n * @param key - The group key to toggle\n * @returns New set with toggled state\n */\nexport function toggleGroupExpansion(expandedKeys: Set<string>, key: string): Set<string> {\n  const newSet = new Set(expandedKeys);\n  if (newSet.has(key)) {\n    newSet.delete(key);\n  } else {\n    newSet.add(key);\n  }\n  return newSet;\n}\n\n/**\n * Expand all groups.\n *\n * @param rows - The flattened render rows\n * @returns Set of all group keys\n */\nexport function expandAllGroups(rows: RenderRow[]): Set<string> {\n  const keys = new Set<string>();\n  for (const row of rows) {\n    if (row.kind === 'group') {\n      keys.add(row.key);\n    }\n  }\n  return keys;\n}\n\n/**\n * Collapse all groups.\n *\n * @returns Empty set\n */\nexport function collapseAllGroups(): Set<string> {\n  return new Set();\n}\n\n/**\n * Get all group keys from a flattened model.\n *\n * @param rows - The flattened render rows\n * @returns Array of group keys\n */\nexport function getGroupKeys(rows: RenderRow[]): string[] {\n  return rows.filter((r): r is GroupRowModelItem => r.kind === 'group').map((r) => r.key);\n}\n\n/**\n * Count total rows in a group (including nested groups).\n *\n * @param groupRow - The group row\n * @returns Total row count\n */\nexport function getGroupRowCount(groupRow: RenderRow): number {\n  if (groupRow.kind !== 'group') return 0;\n  return groupRow.rows.length;\n}\n","/**\n * Row Grouping Plugin (Class-based)\n *\n * Enables hierarchical row grouping with expand/collapse and aggregations.\n */\n\nimport { BaseGridPlugin, CellClickEvent } from '../../core/plugin/base-plugin';\nimport { isExpanderColumn } from '../../core/plugin/expander-column';\nimport type { RowElementInternal } from '../../core/types';\nimport {\n  buildGroupedRowModel,\n  collapseAllGroups,\n  expandAllGroups,\n  getGroupRowCount,\n  runAggregator,\n  toggleGroupExpansion,\n} from './grouping-rows';\nimport styles from './grouping-rows.css?inline';\nimport type {\n  ExpandCollapseAnimation,\n  GroupingRowsConfig,\n  GroupRowModelItem,\n  GroupToggleDetail,\n  RenderRow,\n} from './types';\n\n/**\n * Group state information returned by getGroupState()\n */\nexport interface GroupState {\n  /** Whether grouping is currently active */\n  isActive: boolean;\n  /** Number of expanded groups */\n  expandedCount: number;\n  /** Total number of groups */\n  totalGroups: number;\n  /** Array of expanded group keys */\n  expandedKeys: string[];\n}\n\n/**\n * Row Grouping Plugin for tbw-grid\n *\n * Organizes rows into collapsible hierarchical groups. Perfect for organizing data\n * by category, department, status, or any other dimension—or even multiple dimensions\n * for nested grouping. Includes aggregation support for summarizing group data.\n *\n * ## Installation\n *\n * ```ts\n * import { GroupingRowsPlugin } from '@toolbox-web/grid/plugins/grouping-rows';\n * ```\n *\n * ## Configuration Options\n *\n * | Option | Type | Default | Description |\n * |--------|------|---------|-------------|\n * | `groupOn` | `(row) => string[]` | - | Callback returning group path array |\n * | `defaultExpanded` | `boolean` | `false` | Start all groups expanded |\n * | `showRowCount` | `boolean` | `true` | Show row count in group header |\n * | `indentWidth` | `number` | `20` | Indentation per level (pixels) |\n * | `fullWidth` | `boolean` | `true` | Group row spans full width |\n * | `animation` | `false \\| 'slide' \\| 'fade'` | `'slide'` | Expand/collapse animation |\n *\n * ## Programmatic API\n *\n * | Method | Signature | Description |\n * |--------|-----------|-------------|\n * | `expandGroup` | `(path: string[]) => void` | Expand a specific group |\n * | `collapseGroup` | `(path: string[]) => void` | Collapse a specific group |\n * | `expandAll` | `() => void` | Expand all groups |\n * | `collapseAll` | `() => void` | Collapse all groups |\n * | `isGroupExpanded` | `(path: string[]) => boolean` | Check if group is expanded |\n * | `getGroupState` | `() => GroupState` | Get current grouping state |\n *\n * ## CSS Custom Properties\n *\n * | Property | Default | Description |\n * |----------|---------|-------------|\n * | `--tbw-group-indent-width` | `1.25em` | Indentation per group level |\n * | `--tbw-grouping-rows-bg` | `var(--tbw-color-panel-bg)` | Group row background |\n * | `--tbw-grouping-rows-count-color` | `var(--tbw-color-fg-muted)` | Count badge color |\n * | `--tbw-animation-duration` | `200ms` | Expand/collapse animation |\n *\n * @example Single-Level Grouping by Department\n * ```ts\n * import '@toolbox-web/grid';\n * import { GroupingRowsPlugin } from '@toolbox-web/grid/plugins/grouping-rows';\n *\n * const grid = document.querySelector('tbw-grid');\n * grid.gridConfig = {\n *   columns: [\n *     { field: 'name', header: 'Employee' },\n *     { field: 'department', header: 'Department' },\n *     { field: 'salary', header: 'Salary', type: 'currency' },\n *   ],\n *   plugins: [\n *     new GroupingRowsPlugin({\n *       groupOn: (row) => [row.department],\n *       showRowCount: true,\n *       defaultExpanded: false,\n *     }),\n *   ],\n * };\n * ```\n *\n * @example Multi-Level Grouping\n * ```ts\n * new GroupingRowsPlugin({\n *   groupOn: (row) => [row.region, row.department, row.team],\n *   indentWidth: 24,\n *   animation: 'slide',\n * })\n * ```\n *\n * @see {@link GroupingRowsConfig} for all configuration options\n * @see {@link GroupState} for the group state structure\n *\n * @internal Extends BaseGridPlugin\n */\nexport class GroupingRowsPlugin extends BaseGridPlugin<GroupingRowsConfig> {\n  /** @internal */\n  readonly name = 'groupingRows';\n  /** @internal */\n  override readonly styles = styles;\n\n  /** @internal */\n  protected override get defaultConfig(): Partial<GroupingRowsConfig> {\n    return {\n      defaultExpanded: false,\n      showRowCount: true,\n      indentWidth: 20,\n      aggregators: {},\n      animation: 'slide',\n    };\n  }\n\n  // #region Internal State\n  private expandedKeys: Set<string> = new Set();\n  private flattenedRows: RenderRow[] = [];\n  private isActive = false;\n  private previousVisibleKeys = new Set<string>();\n  private keysToAnimate = new Set<string>();\n  // #endregion\n\n  // #region Animation\n\n  /**\n   * Get expand/collapse animation style from plugin config.\n   * Uses base class isAnimationEnabled to respect grid-level settings.\n   */\n  private get animationStyle(): ExpandCollapseAnimation {\n    if (!this.isAnimationEnabled) return false;\n    return this.config.animation ?? 'slide';\n  }\n\n  // #endregion\n\n  // #region Lifecycle\n\n  /** @internal */\n  override detach(): void {\n    this.expandedKeys.clear();\n    this.flattenedRows = [];\n    this.isActive = false;\n    this.previousVisibleKeys.clear();\n    this.keysToAnimate.clear();\n  }\n  // #endregion\n\n  // #region Hooks\n\n  /**\n   * Auto-detect grouping configuration from grid config.\n   * Called by plugin system to determine if plugin should activate.\n   */\n  static detect(rows: readonly any[], config: any): boolean {\n    return typeof config?.groupOn === 'function' || typeof config?.enableRowGrouping === 'boolean';\n  }\n\n  /** @internal */\n  override processRows(rows: readonly any[]): any[] {\n    const config = this.config;\n\n    // Check if grouping is configured\n    if (typeof config.groupOn !== 'function') {\n      this.isActive = false;\n      this.flattenedRows = [];\n      return [...rows];\n    }\n\n    // Build grouped model\n    const grouped = buildGroupedRowModel({\n      rows: [...rows],\n      config: config,\n      expanded: this.expandedKeys,\n    });\n\n    // If no grouping produced, return original rows\n    if (grouped.length === 0) {\n      this.isActive = false;\n      this.flattenedRows = [];\n      return [...rows];\n    }\n\n    this.isActive = true;\n    this.flattenedRows = grouped;\n\n    // Track which data rows are newly visible (for animation)\n    this.keysToAnimate.clear();\n    const currentVisibleKeys = new Set<string>();\n    grouped.forEach((item, idx) => {\n      if (item.kind === 'data') {\n        const key = `data-${idx}`;\n        currentVisibleKeys.add(key);\n        if (!this.previousVisibleKeys.has(key)) {\n          this.keysToAnimate.add(key);\n        }\n      }\n    });\n    this.previousVisibleKeys = currentVisibleKeys;\n\n    // Return flattened rows for rendering\n    // The grid will need to handle group rows specially\n    return grouped.map((item) => {\n      if (item.kind === 'group') {\n        return {\n          __isGroupRow: true,\n          __groupKey: item.key,\n          __groupValue: item.value,\n          __groupDepth: item.depth,\n          __groupRows: item.rows,\n          __groupExpanded: item.expanded,\n          __groupRowCount: getGroupRowCount(item),\n        };\n      }\n      return item.row;\n    });\n  }\n\n  /** @internal */\n  override onCellClick(event: CellClickEvent): boolean | void {\n    const row = event.row as Record<string, unknown> | undefined;\n\n    // Check if this is a group row toggle\n    if (row?.__isGroupRow) {\n      const target = event.originalEvent.target as HTMLElement;\n      if (target?.closest('.group-toggle')) {\n        this.toggle(row.__groupKey as string);\n        return true; // Prevent default\n      }\n    }\n  }\n\n  /** @internal */\n  override onKeyDown(event: KeyboardEvent): boolean | void {\n    // SPACE toggles expansion on group rows\n    if (event.key !== ' ') return;\n\n    const focusRow = this.grid._focusRow;\n    const row = this.rows[focusRow] as Record<string, unknown> | undefined;\n\n    // Only handle SPACE on group rows\n    if (!row?.__isGroupRow) return;\n\n    event.preventDefault();\n    this.toggle(row.__groupKey as string);\n\n    // Restore focus styling after render completes via render pipeline\n    this.requestRenderWithFocus();\n    return true;\n  }\n\n  /**\n   * Render a row. Returns true if we handled the row (group row), false otherwise.\n   * @internal\n   */\n  override renderRow(row: any, rowEl: HTMLElement, _rowIndex: number): boolean {\n    // Only handle group rows\n    if (!row?.__isGroupRow) {\n      return false;\n    }\n\n    const config = this.config;\n\n    // If a custom renderer is provided, use it\n    if (config.groupRowRenderer) {\n      const toggleExpand = () => {\n        this.toggle(row.__groupKey);\n      };\n\n      const result = config.groupRowRenderer({\n        key: row.__groupKey,\n        value: row.__groupValue,\n        depth: row.__groupDepth,\n        rows: row.__groupRows,\n        expanded: row.__groupExpanded,\n        toggleExpand,\n      });\n\n      if (result) {\n        rowEl.className = 'data-grid-row group-row';\n        (rowEl as RowElementInternal).__isCustomRow = true; // Mark for proper class reset on recycle\n        rowEl.setAttribute('data-group-depth', String(row.__groupDepth));\n        if (typeof result === 'string') {\n          rowEl.innerHTML = result;\n        } else {\n          rowEl.innerHTML = '';\n          rowEl.appendChild(result);\n        }\n        return true;\n      }\n    }\n\n    // Helper to toggle expansion\n    const handleToggle = () => {\n      this.toggle(row.__groupKey);\n    };\n\n    // Default group row rendering - keep data-grid-row class for focus/keyboard navigation\n    rowEl.className = 'data-grid-row group-row';\n    (rowEl as RowElementInternal).__isCustomRow = true; // Mark for proper class reset on recycle\n    rowEl.setAttribute('data-group-depth', String(row.__groupDepth));\n    rowEl.setAttribute('role', 'row');\n    rowEl.setAttribute('aria-expanded', String(row.__groupExpanded));\n    // Use CSS variable for depth-based indentation\n    rowEl.style.setProperty('--tbw-group-depth', String(row.__groupDepth || 0));\n    if (config.indentWidth !== undefined) {\n      rowEl.style.setProperty('--tbw-group-indent-width', `${config.indentWidth}px`);\n    }\n    rowEl.innerHTML = '';\n\n    const isFullWidth = config.fullWidth !== false; // default true\n\n    if (isFullWidth) {\n      this.renderFullWidthGroupRow(row, rowEl, handleToggle);\n    } else {\n      this.renderPerColumnGroupRow(row, rowEl, handleToggle);\n    }\n\n    return true;\n  }\n\n  /** @internal */\n  override afterRender(): void {\n    const style = this.animationStyle;\n    if (style === false || this.keysToAnimate.size === 0) return;\n\n    const body = this.gridElement?.querySelector('.rows');\n    if (!body) return;\n\n    const animClass = style === 'fade' ? 'tbw-group-fade-in' : 'tbw-group-slide-in';\n    for (const rowEl of body.querySelectorAll('.data-grid-row:not(.group-row)')) {\n      const cell = rowEl.querySelector('.cell[data-row]');\n      const idx = cell ? parseInt(cell.getAttribute('data-row') ?? '-1', 10) : -1;\n      const item = this.flattenedRows[idx];\n      const key = item?.kind === 'data' ? `data-${idx}` : undefined;\n\n      if (key && this.keysToAnimate.has(key)) {\n        rowEl.classList.add(animClass);\n        rowEl.addEventListener('animationend', () => rowEl.classList.remove(animClass), { once: true });\n      }\n    }\n    this.keysToAnimate.clear();\n  }\n  // #endregion\n\n  // #region Private Rendering Helpers\n\n  /**\n   * Create a toggle button for expanding/collapsing a group.\n   */\n  private createToggleButton(expanded: boolean, handleToggle: () => void): HTMLButtonElement {\n    const btn = document.createElement('button');\n    btn.type = 'button';\n    btn.className = `group-toggle${expanded ? ' expanded' : ''}`;\n    btn.setAttribute('aria-label', expanded ? 'Collapse group' : 'Expand group');\n    this.setIcon(btn, this.resolveIcon(expanded ? 'collapse' : 'expand'));\n    btn.addEventListener('click', (e) => {\n      e.stopPropagation();\n      handleToggle();\n    });\n    return btn;\n  }\n\n  /**\n   * Get the formatted label text for a group.\n   */\n  private getGroupLabelText(value: unknown, depth: number, key: string): string {\n    const config = this.config;\n    return config.formatLabel ? config.formatLabel(value, depth, key) : String(value);\n  }\n\n  private renderFullWidthGroupRow(row: any, rowEl: HTMLElement, handleToggle: () => void): void {\n    const config = this.config;\n\n    // Full-width mode: single spanning cell with toggle + label + count\n    const cell = document.createElement('div');\n    cell.className = 'cell group-full';\n    cell.style.gridColumn = '1 / -1';\n    cell.setAttribute('role', 'gridcell');\n    cell.setAttribute('data-col', '0'); // Required for focus/click delegation\n\n    // Toggle button\n    cell.appendChild(this.createToggleButton(row.__groupExpanded, handleToggle));\n\n    // Group label\n    const label = document.createElement('span');\n    label.className = 'group-label';\n    label.textContent = this.getGroupLabelText(row.__groupValue, row.__groupDepth || 0, row.__groupKey);\n    cell.appendChild(label);\n\n    // Row count\n    if (config.showRowCount !== false) {\n      const count = document.createElement('span');\n      count.className = 'group-count';\n      count.textContent = `(${row.__groupRowCount ?? row.__groupRows?.length ?? 0})`;\n      cell.appendChild(count);\n    }\n\n    rowEl.appendChild(cell);\n  }\n\n  private renderPerColumnGroupRow(row: any, rowEl: HTMLElement, handleToggle: () => void): void {\n    const config = this.config;\n    const aggregators = config.aggregators ?? {};\n    const columns = this.columns;\n    const groupRows = row.__groupRows ?? [];\n\n    // Get grid template from the grid element\n    const bodyEl = this.gridElement?.querySelector('.body') as HTMLElement | null;\n    const gridTemplate = bodyEl?.style.gridTemplateColumns || '';\n    if (gridTemplate) {\n      rowEl.style.display = 'grid';\n      rowEl.style.gridTemplateColumns = gridTemplate;\n    }\n\n    // Track whether we've rendered the toggle button yet (should be in first non-expander column)\n    let toggleRendered = false;\n\n    columns.forEach((col, colIdx) => {\n      const cell = document.createElement('div');\n      cell.className = 'cell group-cell';\n      cell.setAttribute('data-col', String(colIdx));\n      cell.setAttribute('role', 'gridcell');\n\n      // Skip expander columns (they're handled by other plugins like MasterDetail/Tree)\n      // but still render an empty cell to maintain grid structure\n      if (isExpanderColumn(col)) {\n        cell.setAttribute('data-field', col.field);\n        rowEl.appendChild(cell);\n        return;\n      }\n\n      // First non-expander column gets the toggle button + label\n      if (!toggleRendered) {\n        toggleRendered = true;\n        cell.appendChild(this.createToggleButton(row.__groupExpanded, handleToggle));\n\n        const label = document.createElement('span');\n        const firstColAgg = aggregators[col.field];\n        if (firstColAgg) {\n          const aggResult = runAggregator(firstColAgg, groupRows, col.field, col);\n          label.textContent = aggResult != null ? String(aggResult) : String(row.__groupValue);\n        } else {\n          label.textContent = this.getGroupLabelText(row.__groupValue, row.__groupDepth || 0, row.__groupKey);\n        }\n        cell.appendChild(label);\n\n        if (config.showRowCount !== false) {\n          const count = document.createElement('span');\n          count.className = 'group-count';\n          count.textContent = ` (${groupRows.length})`;\n          cell.appendChild(count);\n        }\n      } else {\n        // Other columns: run aggregator if defined\n        const aggRef = aggregators[col.field];\n        if (aggRef) {\n          const result = runAggregator(aggRef, groupRows, col.field, col);\n          cell.textContent = result != null ? String(result) : '';\n        } else {\n          cell.textContent = '';\n        }\n      }\n\n      rowEl.appendChild(cell);\n    });\n  }\n  // #endregion\n\n  // #region Public API\n\n  /**\n   * Expand all groups.\n   */\n  expandAll(): void {\n    this.expandedKeys = expandAllGroups(this.flattenedRows);\n    this.requestRender();\n  }\n\n  /**\n   * Collapse all groups.\n   */\n  collapseAll(): void {\n    this.expandedKeys = collapseAllGroups();\n    this.requestRender();\n  }\n\n  /**\n   * Toggle expansion of a specific group.\n   * @param key - The group key to toggle\n   */\n  toggle(key: string): void {\n    this.expandedKeys = toggleGroupExpansion(this.expandedKeys, key);\n\n    // Find the group to emit event details\n    const group = this.flattenedRows.find((r) => r.kind === 'group' && r.key === key) as GroupRowModelItem | undefined;\n\n    this.emit<GroupToggleDetail>('group-toggle', {\n      key,\n      expanded: this.expandedKeys.has(key),\n      value: group?.value,\n      depth: group?.depth ?? 0,\n    });\n\n    this.requestRender();\n  }\n\n  /**\n   * Check if a specific group is expanded.\n   * @param key - The group key to check\n   * @returns Whether the group is expanded\n   */\n  isExpanded(key: string): boolean {\n    return this.expandedKeys.has(key);\n  }\n\n  /**\n   * Expand a specific group.\n   * @param key - The group key to expand\n   */\n  expand(key: string): void {\n    if (!this.expandedKeys.has(key)) {\n      this.expandedKeys = new Set([...this.expandedKeys, key]);\n      this.requestRender();\n    }\n  }\n\n  /**\n   * Collapse a specific group.\n   * @param key - The group key to collapse\n   */\n  collapse(key: string): void {\n    if (this.expandedKeys.has(key)) {\n      const newKeys = new Set(this.expandedKeys);\n      newKeys.delete(key);\n      this.expandedKeys = newKeys;\n      this.requestRender();\n    }\n  }\n\n  /**\n   * Get the current group state.\n   * @returns Group state information\n   */\n  getGroupState(): GroupState {\n    const groupRows = this.flattenedRows.filter((r) => r.kind === 'group');\n    return {\n      isActive: this.isActive,\n      expandedCount: this.expandedKeys.size,\n      totalGroups: groupRows.length,\n      expandedKeys: [...this.expandedKeys],\n    };\n  }\n\n  /**\n   * Get the total count of visible rows (including group headers).\n   * @returns Number of visible rows\n   */\n  getRowCount(): number {\n    return this.flattenedRows.length;\n  }\n\n  /**\n   * Refresh the grouped row model.\n   * Call this after modifying groupOn or other config options.\n   */\n  refreshGroups(): void {\n    this.requestRender();\n  }\n\n  /**\n   * Get current expanded group keys.\n   * @returns Array of expanded group keys\n   */\n  getExpandedGroups(): string[] {\n    return [...this.expandedKeys];\n  }\n\n  /**\n   * Get the flattened row model.\n   * @returns Array of render rows (groups + data rows)\n   */\n  getFlattenedRows(): RenderRow[] {\n    return this.flattenedRows;\n  }\n\n  /**\n   * Check if grouping is currently active.\n   * @returns Whether grouping is active\n   */\n  isGroupingActive(): boolean {\n    return this.isActive;\n  }\n\n  /**\n   * Set the groupOn function dynamically.\n   * @param fn - The groupOn function or undefined to disable\n   */\n  setGroupOn(fn: ((row: any) => any[] | any | null | false) | undefined): void {\n    (this.config as GroupingRowsConfig).groupOn = fn;\n    this.requestRender();\n  }\n  // #endregion\n}\n"],"names":["buildGroupedRowModel","rows","config","expanded","groupOn","root","r","path","parent","rawVal","depthIdx","seg","composite","node","flat","visit","c","isExpanded","toggleGroupExpansion","expandedKeys","key","newSet","expandAllGroups","keys","row","collapseAllGroups","getGroupRowCount","groupRow","GroupingRowsPlugin","BaseGridPlugin","styles","grouped","currentVisibleKeys","item","idx","event","focusRow","rowEl","_rowIndex","toggleExpand","result","handleToggle","style","body","animClass","cell","btn","e","value","depth","label","count","aggregators","columns","groupRows","gridTemplate","toggleRendered","col","colIdx","isExpanderColumn","aggRef","runAggregator","firstColAgg","aggResult","group","newKeys","fn"],"mappings":"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"}
+{"version":3,"file":"grouping-rows.umd.js","sources":["../../../../../libs/grid/src/lib/plugins/grouping-rows/grouping-rows.ts","../../../../../libs/grid/src/lib/plugins/grouping-rows/GroupingRowsPlugin.ts"],"sourcesContent":["/**\n * Row Grouping Core Logic\n *\n * Pure functions for building grouped row models and aggregations.\n */\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nimport type { GroupRowModelItem, RenderRow, RowGroupingConfig } from './types';\n\n// Re-export aggregator functions from core for backward compatibility\nexport { getAggregator, listAggregators, registerAggregator, runAggregator } from '../../core/internal/aggregators';\n\ninterface GroupNode {\n  key: string; // composite key\n  value: any;\n  depth: number;\n  rows: any[];\n  children: Map<string, GroupNode>;\n  parent?: GroupNode;\n}\n\ninterface BuildGroupingArgs {\n  rows: any[];\n  config: RowGroupingConfig;\n  expanded: Set<string>;\n}\n\n/**\n * Build a flattened grouping projection (collapsed by default).\n * Returns empty array when groupOn not configured or all rows ungrouped.\n *\n * @param args - The grouping arguments\n * @returns Flattened array of render rows (groups + data rows)\n */\nexport function buildGroupedRowModel({ rows, config, expanded }: BuildGroupingArgs): RenderRow[] {\n  const groupOn = config.groupOn;\n  if (typeof groupOn !== 'function') {\n    return [];\n  }\n\n  const root: GroupNode = { key: '__root__', value: null, depth: -1, rows: [], children: new Map() };\n\n  // Build tree structure\n  rows.forEach((r) => {\n    let path: any = groupOn(r);\n    if (path == null || path === false) path = ['__ungrouped__'];\n    else if (!Array.isArray(path)) path = [path];\n\n    let parent = root;\n    path.forEach((rawVal: any, depthIdx: number) => {\n      const seg = rawVal == null ? '∅' : String(rawVal);\n      const composite = parent.key === '__root__' ? seg : parent.key + '||' + seg;\n      let node = parent.children.get(seg);\n      if (!node) {\n        node = { key: composite, value: rawVal, depth: depthIdx, rows: [], children: new Map(), parent };\n        parent.children.set(seg, node);\n      }\n      parent = node;\n    });\n    parent.rows.push(r);\n  });\n\n  // All ungrouped? treat as no grouping\n  if (root.children.size === 1 && root.children.has('__ungrouped__')) {\n    const only = root.children.get('__ungrouped__')!;\n    if (only.rows.length === rows.length) return [];\n  }\n\n  // Flatten tree to array\n  const flat: RenderRow[] = [];\n  const visit = (node: GroupNode) => {\n    if (node === root) {\n      node.children.forEach((c) => visit(c));\n      return;\n    }\n\n    const isExpanded = expanded.has(node.key);\n    flat.push({\n      kind: 'group',\n      key: node.key,\n      value: node.value,\n      depth: node.depth,\n      rows: node.rows,\n      expanded: isExpanded,\n    });\n\n    if (isExpanded) {\n      if (node.children.size) {\n        node.children.forEach((c) => visit(c));\n      } else {\n        node.rows.forEach((r) => flat.push({ kind: 'data', row: r, rowIndex: rows.indexOf(r) }));\n      }\n    }\n  };\n  visit(root);\n\n  return flat;\n}\n\n/**\n * Toggle expansion state for a group key.\n *\n * @param expandedKeys - Current set of expanded keys\n * @param key - The group key to toggle\n * @returns New set with toggled state\n */\nexport function toggleGroupExpansion(expandedKeys: Set<string>, key: string): Set<string> {\n  const newSet = new Set(expandedKeys);\n  if (newSet.has(key)) {\n    newSet.delete(key);\n  } else {\n    newSet.add(key);\n  }\n  return newSet;\n}\n\n/**\n * Expand all groups.\n *\n * @param rows - The flattened render rows\n * @returns Set of all group keys\n */\nexport function expandAllGroups(rows: RenderRow[]): Set<string> {\n  const keys = new Set<string>();\n  for (const row of rows) {\n    if (row.kind === 'group') {\n      keys.add(row.key);\n    }\n  }\n  return keys;\n}\n\n/**\n * Collapse all groups.\n *\n * @returns Empty set\n */\nexport function collapseAllGroups(): Set<string> {\n  return new Set();\n}\n\n/**\n * Get all group keys from a flattened model.\n *\n * @param rows - The flattened render rows\n * @returns Array of group keys\n */\nexport function getGroupKeys(rows: RenderRow[]): string[] {\n  return rows.filter((r): r is GroupRowModelItem => r.kind === 'group').map((r) => r.key);\n}\n\n/**\n * Count total rows in a group (including nested groups).\n *\n * @param groupRow - The group row\n * @returns Total row count\n */\nexport function getGroupRowCount(groupRow: RenderRow): number {\n  if (groupRow.kind !== 'group') return 0;\n  return groupRow.rows.length;\n}\n","/**\n * Row Grouping Plugin (Class-based)\n *\n * Enables hierarchical row grouping with expand/collapse and aggregations.\n */\n\nimport { BaseGridPlugin, CellClickEvent } from '../../core/plugin/base-plugin';\nimport { isExpanderColumn } from '../../core/plugin/expander-column';\nimport type { RowElementInternal } from '../../core/types';\nimport {\n  buildGroupedRowModel,\n  collapseAllGroups,\n  expandAllGroups,\n  getGroupRowCount,\n  runAggregator,\n  toggleGroupExpansion,\n} from './grouping-rows';\nimport styles from './grouping-rows.css?inline';\nimport type {\n  ExpandCollapseAnimation,\n  GroupingRowsConfig,\n  GroupRowModelItem,\n  GroupToggleDetail,\n  RenderRow,\n} from './types';\n\n/**\n * Group state information returned by getGroupState()\n */\nexport interface GroupState {\n  /** Whether grouping is currently active */\n  isActive: boolean;\n  /** Number of expanded groups */\n  expandedCount: number;\n  /** Total number of groups */\n  totalGroups: number;\n  /** Array of expanded group keys */\n  expandedKeys: string[];\n}\n\n/**\n * Row Grouping Plugin for tbw-grid\n *\n * Organizes rows into collapsible hierarchical groups. Perfect for organizing data\n * by category, department, status, or any other dimension—or even multiple dimensions\n * for nested grouping. Includes aggregation support for summarizing group data.\n *\n * ## Installation\n *\n * ```ts\n * import { GroupingRowsPlugin } from '@toolbox-web/grid/plugins/grouping-rows';\n * ```\n *\n * ## Configuration Options\n *\n * | Option | Type | Default | Description |\n * |--------|------|---------|-------------|\n * | `groupOn` | `(row) => string[]` | - | Callback returning group path array |\n * | `defaultExpanded` | `boolean` | `false` | Start all groups expanded |\n * | `showRowCount` | `boolean` | `true` | Show row count in group header |\n * | `indentWidth` | `number` | `20` | Indentation per level (pixels) |\n * | `fullWidth` | `boolean` | `true` | Group row spans full width |\n * | `animation` | `false \\| 'slide' \\| 'fade'` | `'slide'` | Expand/collapse animation |\n *\n * ## Programmatic API\n *\n * | Method | Signature | Description |\n * |--------|-----------|-------------|\n * | `expandGroup` | `(path: string[]) => void` | Expand a specific group |\n * | `collapseGroup` | `(path: string[]) => void` | Collapse a specific group |\n * | `expandAll` | `() => void` | Expand all groups |\n * | `collapseAll` | `() => void` | Collapse all groups |\n * | `isGroupExpanded` | `(path: string[]) => boolean` | Check if group is expanded |\n * | `getGroupState` | `() => GroupState` | Get current grouping state |\n *\n * ## CSS Custom Properties\n *\n * | Property | Default | Description |\n * |----------|---------|-------------|\n * | `--tbw-group-indent-width` | `1.25em` | Indentation per group level |\n * | `--tbw-grouping-rows-bg` | `var(--tbw-color-panel-bg)` | Group row background |\n * | `--tbw-grouping-rows-count-color` | `var(--tbw-color-fg-muted)` | Count badge color |\n * | `--tbw-animation-duration` | `200ms` | Expand/collapse animation |\n *\n * @example Single-Level Grouping by Department\n * ```ts\n * import '@toolbox-web/grid';\n * import { GroupingRowsPlugin } from '@toolbox-web/grid/plugins/grouping-rows';\n *\n * const grid = document.querySelector('tbw-grid');\n * grid.gridConfig = {\n *   columns: [\n *     { field: 'name', header: 'Employee' },\n *     { field: 'department', header: 'Department' },\n *     { field: 'salary', header: 'Salary', type: 'currency' },\n *   ],\n *   plugins: [\n *     new GroupingRowsPlugin({\n *       groupOn: (row) => [row.department],\n *       showRowCount: true,\n *       defaultExpanded: false,\n *     }),\n *   ],\n * };\n * ```\n *\n * @example Multi-Level Grouping\n * ```ts\n * new GroupingRowsPlugin({\n *   groupOn: (row) => [row.region, row.department, row.team],\n *   indentWidth: 24,\n *   animation: 'slide',\n * })\n * ```\n *\n * @see {@link GroupingRowsConfig} for all configuration options\n * @see {@link GroupState} for the group state structure\n *\n * @internal Extends BaseGridPlugin\n */\nexport class GroupingRowsPlugin extends BaseGridPlugin<GroupingRowsConfig> {\n  /** @internal */\n  readonly name = 'groupingRows';\n  /** @internal */\n  override readonly styles = styles;\n\n  /** @internal */\n  protected override get defaultConfig(): Partial<GroupingRowsConfig> {\n    return {\n      defaultExpanded: false,\n      showRowCount: true,\n      indentWidth: 20,\n      aggregators: {},\n      animation: 'slide',\n    };\n  }\n\n  // #region Internal State\n  private expandedKeys: Set<string> = new Set();\n  private flattenedRows: RenderRow[] = [];\n  private isActive = false;\n  private previousVisibleKeys = new Set<string>();\n  private keysToAnimate = new Set<string>();\n  // #endregion\n\n  // #region Animation\n\n  /**\n   * Get expand/collapse animation style from plugin config.\n   * Uses base class isAnimationEnabled to respect grid-level settings.\n   */\n  private get animationStyle(): ExpandCollapseAnimation {\n    if (!this.isAnimationEnabled) return false;\n    return this.config.animation ?? 'slide';\n  }\n\n  // #endregion\n\n  // #region Lifecycle\n\n  /** @internal */\n  override detach(): void {\n    this.expandedKeys.clear();\n    this.flattenedRows = [];\n    this.isActive = false;\n    this.previousVisibleKeys.clear();\n    this.keysToAnimate.clear();\n  }\n  // #endregion\n\n  // #region Hooks\n\n  /**\n   * Auto-detect grouping configuration from grid config.\n   * Called by plugin system to determine if plugin should activate.\n   */\n  static detect(rows: readonly any[], config: any): boolean {\n    return typeof config?.groupOn === 'function' || typeof config?.enableRowGrouping === 'boolean';\n  }\n\n  /** @internal */\n  override processRows(rows: readonly any[]): any[] {\n    const config = this.config;\n\n    // Check if grouping is configured\n    if (typeof config.groupOn !== 'function') {\n      this.isActive = false;\n      this.flattenedRows = [];\n      return [...rows];\n    }\n\n    // Build grouped model\n    const grouped = buildGroupedRowModel({\n      rows: [...rows],\n      config: config,\n      expanded: this.expandedKeys,\n    });\n\n    // If no grouping produced, return original rows\n    if (grouped.length === 0) {\n      this.isActive = false;\n      this.flattenedRows = [];\n      return [...rows];\n    }\n\n    this.isActive = true;\n    this.flattenedRows = grouped;\n\n    // Track which data rows are newly visible (for animation)\n    this.keysToAnimate.clear();\n    const currentVisibleKeys = new Set<string>();\n    grouped.forEach((item, idx) => {\n      if (item.kind === 'data') {\n        const key = `data-${idx}`;\n        currentVisibleKeys.add(key);\n        if (!this.previousVisibleKeys.has(key)) {\n          this.keysToAnimate.add(key);\n        }\n      }\n    });\n    this.previousVisibleKeys = currentVisibleKeys;\n\n    // Return flattened rows for rendering\n    // The grid will need to handle group rows specially\n    return grouped.map((item) => {\n      if (item.kind === 'group') {\n        return {\n          __isGroupRow: true,\n          __groupKey: item.key,\n          __groupValue: item.value,\n          __groupDepth: item.depth,\n          __groupRows: item.rows,\n          __groupExpanded: item.expanded,\n          __groupRowCount: getGroupRowCount(item),\n        };\n      }\n      return item.row;\n    });\n  }\n\n  /** @internal */\n  override onCellClick(event: CellClickEvent): boolean | void {\n    const row = event.row as Record<string, unknown> | undefined;\n\n    // Check if this is a group row toggle\n    if (row?.__isGroupRow) {\n      const target = event.originalEvent.target as HTMLElement;\n      if (target?.closest('.group-toggle')) {\n        this.toggle(row.__groupKey as string);\n        return true; // Prevent default\n      }\n    }\n  }\n\n  /** @internal */\n  override onKeyDown(event: KeyboardEvent): boolean | void {\n    // SPACE toggles expansion on group rows\n    if (event.key !== ' ') return;\n\n    const focusRow = this.grid._focusRow;\n    const row = this.rows[focusRow] as Record<string, unknown> | undefined;\n\n    // Only handle SPACE on group rows\n    if (!row?.__isGroupRow) return;\n\n    event.preventDefault();\n    this.toggle(row.__groupKey as string);\n\n    // Restore focus styling after render completes via render pipeline\n    this.requestRenderWithFocus();\n    return true;\n  }\n\n  /**\n   * Render a row. Returns true if we handled the row (group row), false otherwise.\n   * @internal\n   */\n  override renderRow(row: any, rowEl: HTMLElement, _rowIndex: number): boolean {\n    // Only handle group rows\n    if (!row?.__isGroupRow) {\n      return false;\n    }\n\n    const config = this.config;\n\n    // If a custom renderer is provided, use it\n    if (config.groupRowRenderer) {\n      const toggleExpand = () => {\n        this.toggle(row.__groupKey);\n      };\n\n      const result = config.groupRowRenderer({\n        key: row.__groupKey,\n        value: row.__groupValue,\n        depth: row.__groupDepth,\n        rows: row.__groupRows,\n        expanded: row.__groupExpanded,\n        toggleExpand,\n      });\n\n      if (result) {\n        rowEl.className = 'data-grid-row group-row';\n        (rowEl as RowElementInternal).__isCustomRow = true; // Mark for proper class reset on recycle\n        rowEl.setAttribute('data-group-depth', String(row.__groupDepth));\n        if (typeof result === 'string') {\n          rowEl.innerHTML = result;\n        } else {\n          rowEl.innerHTML = '';\n          rowEl.appendChild(result);\n        }\n        return true;\n      }\n    }\n\n    // Helper to toggle expansion\n    const handleToggle = () => {\n      this.toggle(row.__groupKey);\n    };\n\n    // Default group row rendering - keep data-grid-row class for focus/keyboard navigation\n    rowEl.className = 'data-grid-row group-row';\n    (rowEl as RowElementInternal).__isCustomRow = true; // Mark for proper class reset on recycle\n    rowEl.setAttribute('data-group-depth', String(row.__groupDepth));\n    rowEl.setAttribute('role', 'row');\n    rowEl.setAttribute('aria-expanded', String(row.__groupExpanded));\n    // Use CSS variable for depth-based indentation\n    rowEl.style.setProperty('--tbw-group-depth', String(row.__groupDepth || 0));\n    if (config.indentWidth !== undefined) {\n      rowEl.style.setProperty('--tbw-group-indent-width', `${config.indentWidth}px`);\n    }\n    // Clear any inline height from previous use (e.g., responsive card mode sets height: auto)\n    // This ensures group rows use CSS-defined height, not stale inline styles from recycled elements\n    rowEl.style.height = '';\n    rowEl.innerHTML = '';\n\n    const isFullWidth = config.fullWidth !== false; // default true\n\n    if (isFullWidth) {\n      this.renderFullWidthGroupRow(row, rowEl, handleToggle);\n    } else {\n      this.renderPerColumnGroupRow(row, rowEl, handleToggle);\n    }\n\n    return true;\n  }\n\n  /** @internal */\n  override afterRender(): void {\n    const style = this.animationStyle;\n    if (style === false || this.keysToAnimate.size === 0) return;\n\n    const body = this.gridElement?.querySelector('.rows');\n    if (!body) return;\n\n    const animClass = style === 'fade' ? 'tbw-group-fade-in' : 'tbw-group-slide-in';\n    for (const rowEl of body.querySelectorAll('.data-grid-row:not(.group-row)')) {\n      const cell = rowEl.querySelector('.cell[data-row]');\n      const idx = cell ? parseInt(cell.getAttribute('data-row') ?? '-1', 10) : -1;\n      const item = this.flattenedRows[idx];\n      const key = item?.kind === 'data' ? `data-${idx}` : undefined;\n\n      if (key && this.keysToAnimate.has(key)) {\n        rowEl.classList.add(animClass);\n        rowEl.addEventListener('animationend', () => rowEl.classList.remove(animClass), { once: true });\n      }\n    }\n    this.keysToAnimate.clear();\n  }\n  // #endregion\n\n  // #region Private Rendering Helpers\n\n  /**\n   * Create a toggle button for expanding/collapsing a group.\n   */\n  private createToggleButton(expanded: boolean, handleToggle: () => void): HTMLButtonElement {\n    const btn = document.createElement('button');\n    btn.type = 'button';\n    btn.className = `group-toggle${expanded ? ' expanded' : ''}`;\n    btn.setAttribute('aria-label', expanded ? 'Collapse group' : 'Expand group');\n    this.setIcon(btn, this.resolveIcon(expanded ? 'collapse' : 'expand'));\n    btn.addEventListener('click', (e) => {\n      e.stopPropagation();\n      handleToggle();\n    });\n    return btn;\n  }\n\n  /**\n   * Get the formatted label text for a group.\n   */\n  private getGroupLabelText(value: unknown, depth: number, key: string): string {\n    const config = this.config;\n    return config.formatLabel ? config.formatLabel(value, depth, key) : String(value);\n  }\n\n  private renderFullWidthGroupRow(row: any, rowEl: HTMLElement, handleToggle: () => void): void {\n    const config = this.config;\n\n    // Full-width mode: single spanning cell with toggle + label + count\n    const cell = document.createElement('div');\n    cell.className = 'cell group-full';\n    cell.style.gridColumn = '1 / -1';\n    cell.setAttribute('role', 'gridcell');\n    cell.setAttribute('data-col', '0'); // Required for focus/click delegation\n\n    // Toggle button\n    cell.appendChild(this.createToggleButton(row.__groupExpanded, handleToggle));\n\n    // Group label\n    const label = document.createElement('span');\n    label.className = 'group-label';\n    label.textContent = this.getGroupLabelText(row.__groupValue, row.__groupDepth || 0, row.__groupKey);\n    cell.appendChild(label);\n\n    // Row count\n    if (config.showRowCount !== false) {\n      const count = document.createElement('span');\n      count.className = 'group-count';\n      count.textContent = `(${row.__groupRowCount ?? row.__groupRows?.length ?? 0})`;\n      cell.appendChild(count);\n    }\n\n    rowEl.appendChild(cell);\n  }\n\n  private renderPerColumnGroupRow(row: any, rowEl: HTMLElement, handleToggle: () => void): void {\n    const config = this.config;\n    const aggregators = config.aggregators ?? {};\n    const columns = this.columns;\n    const groupRows = row.__groupRows ?? [];\n\n    // Get grid template from the grid element\n    const bodyEl = this.gridElement?.querySelector('.body') as HTMLElement | null;\n    const gridTemplate = bodyEl?.style.gridTemplateColumns || '';\n    if (gridTemplate) {\n      rowEl.style.display = 'grid';\n      rowEl.style.gridTemplateColumns = gridTemplate;\n    }\n\n    // Track whether we've rendered the toggle button yet (should be in first non-expander column)\n    let toggleRendered = false;\n\n    columns.forEach((col, colIdx) => {\n      const cell = document.createElement('div');\n      cell.className = 'cell group-cell';\n      cell.setAttribute('data-col', String(colIdx));\n      cell.setAttribute('role', 'gridcell');\n\n      // Skip expander columns (they're handled by other plugins like MasterDetail/Tree)\n      // but still render an empty cell to maintain grid structure\n      if (isExpanderColumn(col)) {\n        cell.setAttribute('data-field', col.field);\n        rowEl.appendChild(cell);\n        return;\n      }\n\n      // First non-expander column gets the toggle button + label\n      if (!toggleRendered) {\n        toggleRendered = true;\n        cell.appendChild(this.createToggleButton(row.__groupExpanded, handleToggle));\n\n        const label = document.createElement('span');\n        const firstColAgg = aggregators[col.field];\n        if (firstColAgg) {\n          const aggResult = runAggregator(firstColAgg, groupRows, col.field, col);\n          label.textContent = aggResult != null ? String(aggResult) : String(row.__groupValue);\n        } else {\n          label.textContent = this.getGroupLabelText(row.__groupValue, row.__groupDepth || 0, row.__groupKey);\n        }\n        cell.appendChild(label);\n\n        if (config.showRowCount !== false) {\n          const count = document.createElement('span');\n          count.className = 'group-count';\n          count.textContent = ` (${groupRows.length})`;\n          cell.appendChild(count);\n        }\n      } else {\n        // Other columns: run aggregator if defined\n        const aggRef = aggregators[col.field];\n        if (aggRef) {\n          const result = runAggregator(aggRef, groupRows, col.field, col);\n          cell.textContent = result != null ? String(result) : '';\n        } else {\n          cell.textContent = '';\n        }\n      }\n\n      rowEl.appendChild(cell);\n    });\n  }\n  // #endregion\n\n  // #region Public API\n\n  /**\n   * Expand all groups.\n   */\n  expandAll(): void {\n    this.expandedKeys = expandAllGroups(this.flattenedRows);\n    this.requestRender();\n  }\n\n  /**\n   * Collapse all groups.\n   */\n  collapseAll(): void {\n    this.expandedKeys = collapseAllGroups();\n    this.requestRender();\n  }\n\n  /**\n   * Toggle expansion of a specific group.\n   * @param key - The group key to toggle\n   */\n  toggle(key: string): void {\n    this.expandedKeys = toggleGroupExpansion(this.expandedKeys, key);\n\n    // Find the group to emit event details\n    const group = this.flattenedRows.find((r) => r.kind === 'group' && r.key === key) as GroupRowModelItem | undefined;\n\n    this.emit<GroupToggleDetail>('group-toggle', {\n      key,\n      expanded: this.expandedKeys.has(key),\n      value: group?.value,\n      depth: group?.depth ?? 0,\n    });\n\n    this.requestRender();\n  }\n\n  /**\n   * Check if a specific group is expanded.\n   * @param key - The group key to check\n   * @returns Whether the group is expanded\n   */\n  isExpanded(key: string): boolean {\n    return this.expandedKeys.has(key);\n  }\n\n  /**\n   * Expand a specific group.\n   * @param key - The group key to expand\n   */\n  expand(key: string): void {\n    if (!this.expandedKeys.has(key)) {\n      this.expandedKeys = new Set([...this.expandedKeys, key]);\n      this.requestRender();\n    }\n  }\n\n  /**\n   * Collapse a specific group.\n   * @param key - The group key to collapse\n   */\n  collapse(key: string): void {\n    if (this.expandedKeys.has(key)) {\n      const newKeys = new Set(this.expandedKeys);\n      newKeys.delete(key);\n      this.expandedKeys = newKeys;\n      this.requestRender();\n    }\n  }\n\n  /**\n   * Get the current group state.\n   * @returns Group state information\n   */\n  getGroupState(): GroupState {\n    const groupRows = this.flattenedRows.filter((r) => r.kind === 'group');\n    return {\n      isActive: this.isActive,\n      expandedCount: this.expandedKeys.size,\n      totalGroups: groupRows.length,\n      expandedKeys: [...this.expandedKeys],\n    };\n  }\n\n  /**\n   * Get the total count of visible rows (including group headers).\n   * @returns Number of visible rows\n   */\n  getRowCount(): number {\n    return this.flattenedRows.length;\n  }\n\n  /**\n   * Refresh the grouped row model.\n   * Call this after modifying groupOn or other config options.\n   */\n  refreshGroups(): void {\n    this.requestRender();\n  }\n\n  /**\n   * Get current expanded group keys.\n   * @returns Array of expanded group keys\n   */\n  getExpandedGroups(): string[] {\n    return [...this.expandedKeys];\n  }\n\n  /**\n   * Get the flattened row model.\n   * @returns Array of render rows (groups + data rows)\n   */\n  getFlattenedRows(): RenderRow[] {\n    return this.flattenedRows;\n  }\n\n  /**\n   * Check if grouping is currently active.\n   * @returns Whether grouping is active\n   */\n  isGroupingActive(): boolean {\n    return this.isActive;\n  }\n\n  /**\n   * Set the groupOn function dynamically.\n   * @param fn - The groupOn function or undefined to disable\n   */\n  setGroupOn(fn: ((row: any) => any[] | any | null | false) | undefined): void {\n    (this.config as GroupingRowsConfig).groupOn = fn;\n    this.requestRender();\n  }\n  // #endregion\n}\n"],"names":["buildGroupedRowModel","rows","config","expanded","groupOn","root","r","path","parent","rawVal","depthIdx","seg","composite","node","flat","visit","c","isExpanded","toggleGroupExpansion","expandedKeys","key","newSet","expandAllGroups","keys","row","collapseAllGroups","getGroupRowCount","groupRow","GroupingRowsPlugin","BaseGridPlugin","styles","grouped","currentVisibleKeys","item","idx","event","focusRow","rowEl","_rowIndex","toggleExpand","result","handleToggle","style","body","animClass","cell","btn","e","value","depth","label","count","aggregators","columns","groupRows","gridTemplate","toggleRendered","col","colIdx","isExpanderColumn","aggRef","runAggregator","firstColAgg","aggResult","group","newKeys","fn"],"mappings":"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"}

package/umd/plugins/responsive.umd.js

@@ -1,2 +1,2 @@
-(function(n,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("../../core/internal/keyboard"),require("../../core/plugin/base-plugin")):typeof define=="function"&&define.amd?define(["exports","../../core/internal/keyboard","../../core/plugin/base-plugin"],s):(n=typeof globalThis<"u"?globalThis:n||self,s(n.TbwGridPlugin_responsive={},n.TbwGrid,n.TbwGrid))})(this,(function(n,s,d){"use strict";const l='tbw-grid[data-responsive-animate] .data-grid-row,tbw-grid[data-responsive-animate] .data-grid-row>.cell{transition:opacity var(--tbw-responsive-duration, .2s) ease-out,transform var(--tbw-responsive-duration, .2s) ease-out}tbw-grid[data-responsive][data-responsive-animate] .data-grid-row{animation:responsive-card-enter var(--tbw-responsive-duration, .2s) ease-out}@keyframes responsive-card-enter{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}tbw-grid[data-responsive] .header{display:none!important}tbw-grid[data-responsive] .footer-row{display:none}tbw-grid[data-responsive] .tbw-scroll-area{overflow-x:hidden;min-width:0!important}tbw-grid[data-responsive] .rows-body-wrapper{min-width:0!important}tbw-grid[data-responsive] .data-grid-row{display:block!important;grid-template-columns:none!important;padding:var(--tbw-cell-padding);padding-left:var(--tbw-spacing-xl);border-bottom:1px solid var(--tbw-color-border);min-height:auto!important;height:auto!important;contain:none!important;content-visibility:visible!important;background:var(--tbw-color-bg);position:relative}tbw-grid[data-responsive] .data-grid-row:nth-child(2n){background:var(--tbw-color-row-alt)}tbw-grid[data-responsive] .data-grid-row:hover{background:var(--tbw-color-row-hover)}tbw-grid[data-responsive] .data-grid-row[aria-selected=true]{background:var(--tbw-color-selection)}tbw-grid[data-responsive] .data-grid-row[aria-selected=true]:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--tbw-color-accent)}tbw-grid[data-responsive] .data-grid-row>.cell{display:flex!important;justify-content:space-between;align-items:center;padding:var(--tbw-spacing-xs) var(--tbw-spacing-md);width:100%!important;min-width:0!important;min-height:auto!important;height:auto!important;line-height:1.5!important;position:static!important;left:auto!important;right:auto!important;border:none!important;border-bottom:none!important;border-right:none!important;background:transparent!important;white-space:normal!important;overflow:visible!important}tbw-grid[data-responsive] .data-grid-row>.cell:before{content:attr(data-header) ": ";font-weight:600;color:var(--tbw-color-header-fg);flex-shrink:0;margin-right:var(--tbw-spacing-md);min-width:100px}tbw-grid[data-responsive] .data-grid-row>.cell:after{content:none}tbw-grid[data-responsive] .cell[data-utility]{display:none!important}tbw-grid[data-responsive] .data-grid-row:not(:last-child){margin-bottom:var(--tbw-spacing-xs)}tbw-grid[data-responsive] .cell[data-responsive-hidden]{display:none!important}tbw-grid[data-responsive] .cell[data-responsive-value-only]{justify-content:flex-start!important;font-weight:500}tbw-grid[data-responsive] .cell[data-responsive-value-only]:before{display:none!important}tbw-grid:not([data-responsive]) .cell[data-responsive-hidden]{display:none!important}tbw-grid[data-responsive] .tbw-footer,tbw-grid[data-responsive] .tbw-pinned-rows,tbw-grid[data-responsive] .tbw-aggregation-rows{display:none!important}tbw-grid[data-responsive] .tbw-pinned-rows,tbw-grid[data-responsive] .tbw-aggregation-rows,tbw-grid[data-responsive] .tbw-aggregation-row{min-width:0!important}tbw-grid[data-responsive] .data-grid-row.responsive-card{display:block!important;padding:var(--tbw-cell-padding);border-bottom:1px solid var(--tbw-color-border)}tbw-grid[data-responsive] .data-grid-row.responsive-card>*{width:100%}tbw-grid[data-responsive] .data-grid-row.responsive-card .cell:before{display:none}';class h extends d.BaseGridPlugin{name="responsive";version="1.0.0";styles=l;#r;#t=!1;#s;#p=!1;#o=0;#e=new Set;#n=new Set;#a=null;#d=[];isResponsive(){return this.#t}setResponsive(e){e!==this.#t&&(this.#t=e,this.#h(),this.emit("responsive-change",{isResponsive:e,width:this.#o,breakpoint:this.config.breakpoint??0}))}setBreakpoint(e){this.config.breakpoint=e,this.#c(this.#o)}setCardRenderer(e){this.config.cardRenderer=e,this.#t&&this.requestRender()}getWidth(){return this.#o}getActiveBreakpoint(){return this.#a}attach(e){super.attach(e),this.#l(this.config.hiddenColumns),this.config.breakpoints?.length&&(this.#d=[...this.config.breakpoints].sort((t,i)=>i.maxWidth-t.maxWidth)),this.#r=new ResizeObserver(t=>{const i=t[0]?.contentRect.width??0;this.#o=i,clearTimeout(this.#s),this.#s=setTimeout(()=>{this.#c(i)},this.config.debounceMs??100)}),this.#r.observe(this.gridElement)}#l(e){if(this.#e.clear(),this.#n.clear(),!!e)for(const t of e)typeof t=="string"?this.#e.add(t):t.showValue?this.#n.add(t.field):this.#e.add(t.field)}detach(){this.#r?.disconnect(),this.#r=void 0,clearTimeout(this.#s),this.#s=void 0,this.gridElement&&this.gridElement.removeAttribute("data-responsive"),super.detach()}afterRender(){if(!(this.#d.length>0?this.#a!==null:this.#t))return;const t=this.#e.size>0,i=this.#n.size>0;if(!t&&!i)return;const r=this.gridElement.querySelectorAll(".cell[data-field]");for(const o of r){const a=o.getAttribute("data-field");a&&(this.#e.has(a)?(o.setAttribute("data-responsive-hidden",""),o.removeAttribute("data-responsive-value-only")):this.#n.has(a)?(o.setAttribute("data-responsive-value-only",""),o.removeAttribute("data-responsive-hidden")):(o.removeAttribute("data-responsive-hidden"),o.removeAttribute("data-responsive-value-only")))}}#c(e){if(this.#d.length>0){this.#g(e);return}const t=this.config.breakpoint??0;t===0&&!this.#p&&(this.#p=!0,console.warn("[tbw-grid:ResponsivePlugin] No breakpoint configured. Responsive mode is disabled. Set a breakpoint based on your grid's column count."));const i=t>0&&e<t;i!==this.#t&&(this.#t=i,this.#h(),this.emit("responsive-change",{isResponsive:i,width:e,breakpoint:t}),this.requestRender())}#g(e){let t=null;for(const r of this.#d)e<=r.maxWidth&&(t=r);if(t!==this.#a){this.#a=t,t?.hiddenColumns?this.#l(t.hiddenColumns):this.#l(this.config.hiddenColumns);const r=t?.cardLayout===!0;r!==this.#t&&(this.#t=r,this.#h()),this.emit("responsive-change",{isResponsive:this.#t,width:e,breakpoint:t?.maxWidth??0}),this.requestRender()}}#i;#h(){this.gridElement.toggleAttribute("data-responsive",this.#t);const e=this.config.animate!==!1;this.gridElement.toggleAttribute("data-responsive-animate",e),this.config.animationDuration&&this.gridElement.style.setProperty("--tbw-responsive-duration",`${this.config.animationDuration}ms`);const t=this.grid;if(this.#t){t._virtualization&&(this.#i=t._virtualization.rowHeight);const i=this.gridElement.querySelector(".tbw-scroll-area");i&&(i.scrollLeft=0)}else{const i=this.gridElement.querySelectorAll(".data-grid-row");for(const r of i)r.style.height="",r.classList.remove("responsive-card");this.#i&&this.#i>0&&t._virtualization&&(t._virtualization.rowHeight=this.#i,this.#i=void 0)}}renderRow(e,t,i){if(!this.#t||!this.config.cardRenderer||e.__isGroupRow)return;t.replaceChildren();const r=this.config.cardRenderer(e,i);t.classList.add("responsive-card");const o=this.config.cardRowHeight??"auto";return o!=="auto"?t.style.height=`${o}px`:t.style.height="auto",t.appendChild(r),!0}onKeyDown(e){if(!this.#t||this.config.cardRenderer&&["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(e.key))return!1;const t=this.rows.length-1,i=this.visibleColumns.length-1;switch(e.key){case"ArrowDown":if(this.grid._focusCol<i)return this.grid._focusCol+=1,e.preventDefault(),s.ensureCellVisible(this.grid),!0;if(this.grid._focusRow<t)return this.grid._focusRow+=1,this.grid._focusCol=0,e.preventDefault(),s.ensureCellVisible(this.grid),!0;break;case"ArrowUp":if(this.grid._focusCol>0)return this.grid._focusCol-=1,e.preventDefault(),s.ensureCellVisible(this.grid),!0;if(this.grid._focusRow>0)return this.grid._focusRow-=1,this.grid._focusCol=i,e.preventDefault(),s.ensureCellVisible(this.grid),!0;break;case"ArrowRight":if(this.grid._focusRow<t)return this.grid._focusRow+=1,e.preventDefault(),s.ensureCellVisible(this.grid),!0;break;case"ArrowLeft":if(this.grid._focusRow>0)return this.grid._focusRow-=1,e.preventDefault(),s.ensureCellVisible(this.grid),!0;break}return!1}}n.ResponsivePlugin=h,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})}));
+(function(a,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("../../core/internal/keyboard"),require("../../core/plugin/base-plugin")):typeof define=="function"&&define.amd?define(["exports","../../core/internal/keyboard","../../core/plugin/base-plugin"],n):(a=typeof globalThis<"u"?globalThis:a||self,n(a.TbwGridPlugin_responsive={},a.TbwGrid,a.TbwGrid))})(this,(function(a,n,c){"use strict";const g='tbw-grid[data-responsive-animate] .data-grid-row,tbw-grid[data-responsive-animate] .data-grid-row>.cell{transition:opacity var(--tbw-responsive-duration, .2s) ease-out,transform var(--tbw-responsive-duration, .2s) ease-out}tbw-grid[data-responsive][data-responsive-animate] .data-grid-row{animation:responsive-card-enter var(--tbw-responsive-duration, .2s) ease-out}@keyframes responsive-card-enter{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}tbw-grid[data-responsive] .header{display:none!important}tbw-grid[data-responsive] .footer-row{display:none}tbw-grid[data-responsive] .tbw-scroll-area{overflow-x:hidden;min-width:0!important}tbw-grid[data-responsive] .rows-body-wrapper{min-width:0!important}tbw-grid[data-responsive] .data-grid-row:not(.group-row){display:block!important;grid-template-columns:none!important;padding:var(--tbw-cell-padding);padding-left:var(--tbw-spacing-xl);border-bottom:1px solid var(--tbw-color-border);min-height:auto!important;height:auto!important;contain:none!important;content-visibility:visible!important;background:var(--tbw-color-bg);position:relative}tbw-grid[data-responsive] .data-grid-row:not(.group-row):nth-child(2n){background:var(--tbw-color-row-alt)}tbw-grid[data-responsive] .data-grid-row:not(.group-row):hover{background:var(--tbw-color-row-hover)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)[aria-selected=true]{background:var(--tbw-color-selection)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)[aria-selected=true]:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--tbw-color-accent)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell{display:flex!important;justify-content:space-between;align-items:center;padding:var(--tbw-spacing-xs) var(--tbw-spacing-md);width:100%!important;min-width:0!important;min-height:auto!important;height:auto!important;line-height:1.5!important;position:static!important;left:auto!important;right:auto!important;border:none!important;border-bottom:none!important;border-right:none!important;background:transparent!important;white-space:normal!important;overflow:visible!important}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell:before{content:attr(data-header) ": ";font-weight:600;color:var(--tbw-color-header-fg);flex-shrink:0;margin-right:var(--tbw-spacing-md);min-width:100px}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell:after{content:none}tbw-grid[data-responsive] .cell[data-utility]{display:none!important}tbw-grid[data-responsive] .cell[data-responsive-hidden]{display:none!important}tbw-grid[data-responsive] .cell[data-responsive-value-only]{justify-content:flex-start!important;font-weight:500}tbw-grid[data-responsive] .cell[data-responsive-value-only]:before{display:none!important}tbw-grid:not([data-responsive]) .cell[data-responsive-hidden]{display:none!important}tbw-grid[data-responsive] .tbw-footer,tbw-grid[data-responsive] .tbw-pinned-rows,tbw-grid[data-responsive] .tbw-aggregation-rows{display:none!important}tbw-grid[data-responsive] .tbw-pinned-rows,tbw-grid[data-responsive] .tbw-aggregation-rows,tbw-grid[data-responsive] .tbw-aggregation-row{min-width:0!important}tbw-grid[data-responsive] .data-grid-row.responsive-card{display:block!important;padding:var(--tbw-cell-padding);border-bottom:1px solid var(--tbw-color-border)}tbw-grid[data-responsive] .data-grid-row.responsive-card>*{width:100%}tbw-grid[data-responsive] .data-grid-row.responsive-card .cell:before{display:none}';class p extends c.BaseGridPlugin{name="responsive";version="1.0.0";styles=g;static manifest={incompatibleWith:[{name:"groupingRows",reason:"Responsive card layout does not yet support row grouping. The variable row heights (cards vs group headers) cause scroll calculation issues."}]};#o;#t=!1;#n;#w=!1;#a=0;#s=new Set;#d=new Set;#h=null;#l=[];isResponsive(){return this.#t}setResponsive(t){t!==this.#t&&(this.#t=t,this.#c(),this.emit("responsive-change",{isResponsive:t,width:this.#a,breakpoint:this.config.breakpoint??0}))}setBreakpoint(t){this.config.breakpoint=t,this.#v(this.#a)}setCardRenderer(t){this.config.cardRenderer=t,this.#t&&this.requestRender()}getWidth(){return this.#a}getActiveBreakpoint(){return this.#h}attach(t){super.attach(t),this.#u(this.config.hiddenColumns),this.config.breakpoints?.length&&(this.#l=[...this.config.breakpoints].sort((e,i)=>i.maxWidth-e.maxWidth)),this.#o=new ResizeObserver(e=>{const i=e[0]?.contentRect.width??0;this.#a=i,clearTimeout(this.#n),this.#n=setTimeout(()=>{this.#v(i)},this.config.debounceMs??100)}),this.#o.observe(this.gridElement)}#u(t){if(this.#s.clear(),this.#d.clear(),!!t)for(const e of t)typeof e=="string"?this.#s.add(e):e.showValue?this.#d.add(e.field):this.#s.add(e.field)}detach(){this.#o?.disconnect(),this.#o=void 0,clearTimeout(this.#n),this.#n=void 0,this.gridElement&&this.gridElement.removeAttribute("data-responsive"),super.detach()}afterRender(){if(this.#k(),!(this.#l.length>0?this.#h!==null:this.#t))return;const e=this.#s.size>0,i=this.#d.size>0;if(!e&&!i)return;const r=this.gridElement.querySelectorAll(".cell[data-field]");for(const s of r){const o=s.getAttribute("data-field");o&&(this.#s.has(o)?(s.setAttribute("data-responsive-hidden",""),s.removeAttribute("data-responsive-value-only")):this.#d.has(o)?(s.setAttribute("data-responsive-value-only",""),s.removeAttribute("data-responsive-hidden")):(s.removeAttribute("data-responsive-hidden"),s.removeAttribute("data-responsive-value-only")))}}#v(t){if(this.#l.length>0){this.#R(t);return}const e=this.config.breakpoint??0;e===0&&!this.#w&&(this.#w=!0,console.warn("[tbw-grid:ResponsivePlugin] No breakpoint configured. Responsive mode is disabled. Set a breakpoint based on your grid's column count."));const i=e>0&&t<e;i!==this.#t&&(this.#t=i,this.#c(),this.emit("responsive-change",{isResponsive:i,width:t,breakpoint:e}),this.requestRender())}#R(t){let e=null;for(const r of this.#l)t<=r.maxWidth&&(e=r);if(e!==this.#h){this.#h=e,e?.hiddenColumns?this.#u(e.hiddenColumns):this.#u(this.config.hiddenColumns);const r=e?.cardLayout===!0;r!==this.#t&&(this.#t=r,this.#c()),this.emit("responsive-change",{isResponsive:this.#t,width:t,breakpoint:e?.maxWidth??0}),this.requestRender()}}#e;#c(){this.gridElement.toggleAttribute("data-responsive",this.#t);const t=this.config.animate!==!1;this.gridElement.toggleAttribute("data-responsive-animate",t),this.config.animationDuration&&this.gridElement.style.setProperty("--tbw-responsive-duration",`${this.config.animationDuration}ms`);const e=this.grid;if(this.#t){e._virtualization&&(this.#e=e._virtualization.rowHeight);const i=this.gridElement.querySelector(".tbw-scroll-area");i&&(i.scrollLeft=0)}else{const i=this.gridElement.querySelectorAll(".data-grid-row");for(const r of i)r.style.height="",r.classList.remove("responsive-card");this.#e&&this.#e>0&&e._virtualization&&(e._virtualization.rowHeight=this.#e,this.#e=void 0),this.#i=void 0,this.#r=void 0,this.#g=void 0}}renderRow(t,e,i){if(!this.#t||!this.config.cardRenderer||t.__isGroupRow)return;e.replaceChildren();const r=this.config.cardRenderer(t,i);e.className="data-grid-row responsive-card";const s=this.config.cardRowHeight??"auto";return s!=="auto"?e.style.height=`${s}px`:e.style.height="auto",e.appendChild(r),!0}onKeyDown(t){if(!this.#t||this.config.cardRenderer&&["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(t.key))return!1;const e=this.rows.length-1,i=this.visibleColumns.length-1;switch(t.key){case"ArrowDown":if(this.grid._focusCol<i)return this.grid._focusCol+=1,t.preventDefault(),n.ensureCellVisible(this.grid),!0;if(this.grid._focusRow<e)return this.grid._focusRow+=1,this.grid._focusCol=0,t.preventDefault(),n.ensureCellVisible(this.grid),!0;break;case"ArrowUp":if(this.grid._focusCol>0)return this.grid._focusCol-=1,t.preventDefault(),n.ensureCellVisible(this.grid),!0;if(this.grid._focusRow>0)return this.grid._focusRow-=1,this.grid._focusCol=i,t.preventDefault(),n.ensureCellVisible(this.grid),!0;break;case"ArrowRight":if(this.grid._focusRow<e)return this.grid._focusRow+=1,t.preventDefault(),n.ensureCellVisible(this.grid),!0;break;case"ArrowLeft":if(this.grid._focusRow>0)return this.grid._focusRow-=1,t.preventDefault(),n.ensureCellVisible(this.grid),!0;break}return!1}#i;#r;#g;#b(){if(this.#i&&this.#i>0)return this.#i;const t=this.config.cardRowHeight;return typeof t=="number"&&t>0?t:80}#m(){return this.#r&&this.#r>0?this.#r:this.#e??28}#p(){for(const t of this.rows)if(t.__isGroupRow)return!0;return!1}#y(){let t=0,e=0;for(const i of this.rows)i.__isGroupRow?t++:e++;return{groupCount:t,cardCount:e}}getExtraHeight(){if(!this.#t||!this.config.cardRenderer||!this.#p())return 0;const t=this.#e??28,e=this.#m(),i=this.#b(),{groupCount:r,cardCount:s}=this.#y(),o=r*Math.max(0,e-t),d=s*Math.max(0,i-t);return o+d}getExtraHeightBefore(t){if(!this.#t||!this.config.cardRenderer||!this.#p())return 0;const e=this.#e??28,i=this.#m(),r=this.#b(),s=Math.max(0,i-e),o=Math.max(0,r-e);let d=0,l=0;const u=this.rows,f=Math.min(t,u.length);for(let h=0;h<f;h++)u[h].__isGroupRow?d++:l++;return d*s+l*o}#C(){let t=0;for(const e of this.rows)e.__isGroupRow||t++;return t}#f=!1;#k(){if(!this.#t||!this.config.cardRenderer)return;let t=!1;const e=this.grid,i=this.#p(),r=this.#C();if(r!==this.#g&&(this.#g=r,t=!0),i){const o=this.gridElement.querySelector(".data-grid-row.group-row");if(o){const d=o.getBoundingClientRect().height;d>0&&d!==this.#r&&(this.#r=d,t=!0)}}const s=this.gridElement.querySelector(".data-grid-row.responsive-card");if(s){const o=s.getBoundingClientRect().height;o>0&&o!==this.#i&&(this.#i=o,t=!0,!i&&e._virtualization&&(e._virtualization.rowHeight=o))}t&&!this.#f&&(this.#f=!0,queueMicrotask(()=>{this.#f=!1,this.grid&&this.#t&&this.grid.refreshVirtualWindow?.(!0,!0)}))}}a.ResponsivePlugin=p,Object.defineProperty(a,Symbol.toStringTag,{value:"Module"})}));
 //# sourceMappingURL=responsive.umd.js.map

package/umd/plugins/responsive.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"responsive.umd.js","sources":["../../../../../libs/grid/src/lib/plugins/responsive/ResponsivePlugin.ts"],"sourcesContent":["/**\n * Responsive Plugin\n *\n * Transforms the grid from tabular layout to a card/list layout when the grid\n * width falls below a configurable breakpoint. This enables grids to work in\n * narrow containers (split-pane UIs, mobile viewports, dashboard widgets).\n *\n * ## Installation\n *\n * ```ts\n * import { ResponsivePlugin } from '@toolbox-web/grid/plugins/responsive';\n *\n * const config: GridConfig = {\n *   plugins: [new ResponsivePlugin({ breakpoint: 500 })],\n * };\n * ```\n *\n * ## How It Works\n *\n * 1. ResizeObserver monitors the grid element's width\n * 2. When `width < breakpoint`, adds `data-responsive` attribute to grid\n * 3. CSS transforms cells from horizontal to vertical layout\n * 4. Each cell displays \"Header: Value\" using CSS `::before` pseudo-element\n *\n * @see [Responsive Demo](?path=/story/grid-plugins-responsive--default)\n */\n\nimport { ensureCellVisible } from '../../core/internal/keyboard';\nimport { BaseGridPlugin, type GridElement } from '../../core/plugin/base-plugin';\nimport type { InternalGrid } from '../../core/types';\nimport styles from './responsive.css?inline';\nimport type { BreakpointConfig, HiddenColumnConfig, ResponsiveChangeDetail, ResponsivePluginConfig } from './types';\n\n/**\n * Responsive Plugin for tbw-grid\n *\n * Adds automatic card layout mode when the grid width falls below a configurable\n * breakpoint. Perfect for responsive designs, split-pane UIs, and mobile viewports.\n *\n * @template T The row data type\n *\n * @example\n * ```ts\n * // Basic usage - switch to card layout below 500px\n * const config: GridConfig = {\n *   plugins: [new ResponsivePlugin({ breakpoint: 500 })],\n * };\n * ```\n *\n * @example\n * ```ts\n * // Hide less important columns in card mode\n * const config: GridConfig = {\n *   plugins: [\n *     new ResponsivePlugin({\n *       breakpoint: 600,\n *       hiddenColumns: ['createdAt', 'updatedAt'],\n *     }),\n *   ],\n * };\n * ```\n *\n * @example\n * ```ts\n * // Custom card renderer for advanced layouts\n * const config: GridConfig = {\n *   plugins: [\n *     new ResponsivePlugin({\n *       breakpoint: 400,\n *       cardRenderer: (row) => {\n *         const card = document.createElement('div');\n *         card.className = 'custom-card';\n *         card.innerHTML = `<strong>${row.name}</strong><br>${row.email}`;\n *         return card;\n *       },\n *     }),\n *   ],\n * };\n * ```\n */\nexport class ResponsivePlugin<T = unknown> extends BaseGridPlugin<ResponsivePluginConfig<T>> {\n  readonly name = 'responsive';\n  override readonly version = '1.0.0';\n  override readonly styles = styles;\n\n  #resizeObserver?: ResizeObserver;\n  #isResponsive = false;\n  #debounceTimer?: ReturnType<typeof setTimeout>;\n  #warnedAboutMissingBreakpoint = false;\n  #currentWidth = 0;\n  /** Set of column fields to completely hide */\n  #hiddenColumnSet: Set<string> = new Set();\n  /** Set of column fields to show value only (no header label) */\n  #valueOnlyColumnSet: Set<string> = new Set();\n  /** Currently active breakpoint, or null if none */\n  #activeBreakpoint: BreakpointConfig | null = null;\n  /** Sorted breakpoints from largest to smallest */\n  #sortedBreakpoints: BreakpointConfig[] = [];\n\n  /**\n   * Check if currently in responsive mode.\n   * @returns `true` if the grid is in card layout mode\n   */\n  isResponsive(): boolean {\n    return this.#isResponsive;\n  }\n\n  /**\n   * Force responsive mode regardless of width.\n   * Useful for testing or manual control.\n   * @param enabled - Whether to enable responsive mode\n   */\n  setResponsive(enabled: boolean): void {\n    if (enabled !== this.#isResponsive) {\n      this.#isResponsive = enabled;\n      this.#applyResponsiveState();\n      this.emit('responsive-change', {\n        isResponsive: enabled,\n        width: this.#currentWidth,\n        breakpoint: this.config.breakpoint ?? 0,\n      } satisfies ResponsiveChangeDetail);\n    }\n  }\n\n  /**\n   * Update breakpoint dynamically.\n   * @param width - New breakpoint width in pixels\n   */\n  setBreakpoint(width: number): void {\n    this.config.breakpoint = width;\n    this.#checkBreakpoint(this.#currentWidth);\n  }\n\n  /**\n   * Set a custom card renderer.\n   * This allows framework adapters to provide template-based renderers at runtime.\n   * @param renderer - The card renderer function, or undefined to use default\n   */\n  setCardRenderer(renderer: ResponsivePluginConfig<T>['cardRenderer']): void {\n    this.config.cardRenderer = renderer;\n    // If already in responsive mode, trigger a re-render to apply the new renderer\n    if (this.#isResponsive) {\n      this.requestRender();\n    }\n  }\n\n  /**\n   * Get current grid width.\n   * @returns Width of the grid element in pixels\n   */\n  getWidth(): number {\n    return this.#currentWidth;\n  }\n\n  /**\n   * Get the currently active breakpoint config (multi-breakpoint mode only).\n   * @returns The active BreakpointConfig, or null if no breakpoint is active\n   */\n  getActiveBreakpoint(): BreakpointConfig | null {\n    return this.#activeBreakpoint;\n  }\n\n  override attach(grid: GridElement): void {\n    super.attach(grid);\n\n    // Build hidden column sets from config\n    this.#buildHiddenColumnSets(this.config.hiddenColumns);\n\n    // Sort breakpoints from largest to smallest for evaluation\n    if (this.config.breakpoints?.length) {\n      this.#sortedBreakpoints = [...this.config.breakpoints].sort((a, b) => b.maxWidth - a.maxWidth);\n    }\n\n    // Observe the grid element itself (not internal viewport)\n    // This captures the container width including when shell panels open/close\n    this.#resizeObserver = new ResizeObserver((entries) => {\n      const width = entries[0]?.contentRect.width ?? 0;\n      this.#currentWidth = width;\n\n      // Debounce to avoid thrashing during resize drag\n      clearTimeout(this.#debounceTimer);\n      this.#debounceTimer = setTimeout(() => {\n        this.#checkBreakpoint(width);\n      }, this.config.debounceMs ?? 100);\n    });\n\n    this.#resizeObserver.observe(this.gridElement);\n  }\n\n  /**\n   * Build the hidden and value-only column sets from config.\n   */\n  #buildHiddenColumnSets(hiddenColumns?: HiddenColumnConfig[]): void {\n    this.#hiddenColumnSet.clear();\n    this.#valueOnlyColumnSet.clear();\n\n    if (!hiddenColumns) return;\n\n    for (const col of hiddenColumns) {\n      if (typeof col === 'string') {\n        this.#hiddenColumnSet.add(col);\n      } else if (col.showValue) {\n        this.#valueOnlyColumnSet.add(col.field);\n      } else {\n        this.#hiddenColumnSet.add(col.field);\n      }\n    }\n  }\n\n  override detach(): void {\n    this.#resizeObserver?.disconnect();\n    this.#resizeObserver = undefined;\n    clearTimeout(this.#debounceTimer);\n    this.#debounceTimer = undefined;\n\n    // Clean up attribute\n    if (this.gridElement) {\n      this.gridElement.removeAttribute('data-responsive');\n    }\n\n    super.detach();\n  }\n\n  /**\n   * Apply hidden and value-only columns.\n   * In legacy mode (single breakpoint), only applies when in responsive mode.\n   * In multi-breakpoint mode, applies whenever there's an active breakpoint.\n   */\n  override afterRender(): void {\n    // In single breakpoint mode, only apply when responsive\n    // In multi-breakpoint mode, apply when there's an active breakpoint\n    const shouldApply = this.#sortedBreakpoints.length > 0 ? this.#activeBreakpoint !== null : this.#isResponsive;\n\n    if (!shouldApply) {\n      return;\n    }\n\n    const hasHiddenColumns = this.#hiddenColumnSet.size > 0;\n    const hasValueOnlyColumns = this.#valueOnlyColumnSet.size > 0;\n\n    if (!hasHiddenColumns && !hasValueOnlyColumns) {\n      return;\n    }\n\n    // Mark cells for hidden columns and value-only columns\n    const cells = this.gridElement.querySelectorAll('.cell[data-field]');\n    for (const cell of cells) {\n      const field = cell.getAttribute('data-field');\n      if (!field) continue;\n\n      // Apply hidden attribute\n      if (this.#hiddenColumnSet.has(field)) {\n        cell.setAttribute('data-responsive-hidden', '');\n        cell.removeAttribute('data-responsive-value-only');\n      }\n      // Apply value-only attribute (shows value without header label)\n      else if (this.#valueOnlyColumnSet.has(field)) {\n        cell.setAttribute('data-responsive-value-only', '');\n        cell.removeAttribute('data-responsive-hidden');\n      }\n      // Clear any previous responsive attributes\n      else {\n        cell.removeAttribute('data-responsive-hidden');\n        cell.removeAttribute('data-responsive-value-only');\n      }\n    }\n  }\n\n  /**\n   * Check if width has crossed any breakpoint threshold.\n   * Handles both single breakpoint (legacy) and multi-breakpoint modes.\n   */\n  #checkBreakpoint(width: number): void {\n    // Multi-breakpoint mode\n    if (this.#sortedBreakpoints.length > 0) {\n      this.#checkMultiBreakpoint(width);\n      return;\n    }\n\n    // Legacy single breakpoint mode\n    const breakpoint = this.config.breakpoint ?? 0;\n\n    // Warn once if breakpoint not configured (0 means never responsive)\n    if (breakpoint === 0 && !this.#warnedAboutMissingBreakpoint) {\n      this.#warnedAboutMissingBreakpoint = true;\n      console.warn(\n        \"[tbw-grid:ResponsivePlugin] No breakpoint configured. Responsive mode is disabled. Set a breakpoint based on your grid's column count.\",\n      );\n    }\n\n    const shouldBeResponsive = breakpoint > 0 && width < breakpoint;\n\n    if (shouldBeResponsive !== this.#isResponsive) {\n      this.#isResponsive = shouldBeResponsive;\n      this.#applyResponsiveState();\n      this.emit('responsive-change', {\n        isResponsive: shouldBeResponsive,\n        width,\n        breakpoint,\n      } satisfies ResponsiveChangeDetail);\n      this.requestRender();\n    }\n  }\n\n  /**\n   * Check breakpoints in multi-breakpoint mode.\n   * Evaluates breakpoints from largest to smallest, applying the first match.\n   */\n  #checkMultiBreakpoint(width: number): void {\n    // Find the active breakpoint (first one where width <= maxWidth)\n    // Since sorted largest to smallest, we find the largest matching breakpoint\n    let newActiveBreakpoint: BreakpointConfig | null = null;\n\n    for (const bp of this.#sortedBreakpoints) {\n      if (width <= bp.maxWidth) {\n        newActiveBreakpoint = bp;\n        // Continue to find the most specific (smallest) matching breakpoint\n      }\n    }\n\n    // Check if breakpoint changed\n    const breakpointChanged = newActiveBreakpoint !== this.#activeBreakpoint;\n\n    if (breakpointChanged) {\n      this.#activeBreakpoint = newActiveBreakpoint;\n\n      // Update hidden column sets from active breakpoint\n      if (newActiveBreakpoint?.hiddenColumns) {\n        this.#buildHiddenColumnSets(newActiveBreakpoint.hiddenColumns);\n      } else {\n        // Fall back to top-level hiddenColumns config\n        this.#buildHiddenColumnSets(this.config.hiddenColumns);\n      }\n\n      // Determine if we should be in card layout\n      const shouldBeResponsive = newActiveBreakpoint?.cardLayout === true;\n\n      if (shouldBeResponsive !== this.#isResponsive) {\n        this.#isResponsive = shouldBeResponsive;\n        this.#applyResponsiveState();\n      }\n\n      // Emit event for any breakpoint change\n      this.emit('responsive-change', {\n        isResponsive: this.#isResponsive,\n        width,\n        breakpoint: newActiveBreakpoint?.maxWidth ?? 0,\n      } satisfies ResponsiveChangeDetail);\n\n      this.requestRender();\n    }\n  }\n\n  /** Original row height before entering responsive mode, for restoration on exit */\n  #originalRowHeight?: number;\n\n  /**\n   * Apply the responsive state to the grid element.\n   * Handles scroll reset when entering responsive mode and row height restoration on exit.\n   */\n  #applyResponsiveState(): void {\n    this.gridElement.toggleAttribute('data-responsive', this.#isResponsive);\n\n    // Apply animation attribute if enabled (default: true)\n    const animate = this.config.animate !== false;\n    this.gridElement.toggleAttribute('data-responsive-animate', animate);\n\n    // Set custom animation duration if provided\n    if (this.config.animationDuration) {\n      this.gridElement.style.setProperty('--tbw-responsive-duration', `${this.config.animationDuration}ms`);\n    }\n\n    // Cast to internal type for virtualization access\n    const internalGrid = this.grid as unknown as InternalGrid;\n\n    if (this.#isResponsive) {\n      // Store original row height before responsive mode changes it\n      if (internalGrid._virtualization) {\n        this.#originalRowHeight = internalGrid._virtualization.rowHeight;\n      }\n\n      // Reset horizontal scroll position when entering responsive mode\n      // The CSS hides overflow but doesn't reset the scroll position\n      const scrollArea = this.gridElement.querySelector('.tbw-scroll-area') as HTMLElement | null;\n      if (scrollArea) {\n        scrollArea.scrollLeft = 0;\n      }\n    } else {\n      // Exiting responsive mode - clean up inline styles set by renderRow\n      // The rows are reused from the pool, so we need to remove the card-specific styles\n      const rows = this.gridElement.querySelectorAll('.data-grid-row');\n      for (const row of rows) {\n        (row as HTMLElement).style.height = '';\n        row.classList.remove('responsive-card');\n      }\n\n      // Restore original row height\n      if (this.#originalRowHeight && this.#originalRowHeight > 0 && internalGrid._virtualization) {\n        internalGrid._virtualization.rowHeight = this.#originalRowHeight;\n        this.#originalRowHeight = undefined;\n      }\n    }\n  }\n\n  /**\n   * Custom row rendering when cardRenderer is provided and in responsive mode.\n   *\n   * When a cardRenderer is configured, this hook takes over row rendering to display\n   * the custom card layout instead of the default cell structure.\n   *\n   * @param row - The row data object\n   * @param rowEl - The row DOM element to render into\n   * @param rowIndex - The index of the row in the data array\n   * @returns `true` if rendered (prevents default), `void` for default rendering\n   */\n  override renderRow(row: unknown, rowEl: HTMLElement, rowIndex: number): boolean | void {\n    // Only override when in responsive mode AND cardRenderer is provided\n    if (!this.#isResponsive || !this.config.cardRenderer) {\n      return; // Let default rendering proceed\n    }\n\n    // Skip group rows from GroupingRowsPlugin - they have special structure\n    // and should use their own renderer\n    if ((row as { __isGroupRow?: boolean }).__isGroupRow) {\n      return; // Let GroupingRowsPlugin handle group row rendering\n    }\n\n    // Clear existing content\n    rowEl.replaceChildren();\n\n    // Call user's cardRenderer to get custom content\n    const cardContent = this.config.cardRenderer(row as T, rowIndex);\n\n    // Apply card-specific styling\n    rowEl.classList.add('responsive-card');\n\n    // Handle cardRowHeight\n    const cardHeight = this.config.cardRowHeight ?? 'auto';\n    if (cardHeight !== 'auto') {\n      rowEl.style.height = `${cardHeight}px`;\n    } else {\n      // Remove any virtualization-set height for auto mode\n      rowEl.style.height = 'auto';\n    }\n\n    // Append the custom card content\n    rowEl.appendChild(cardContent);\n\n    return true; // We handled rendering\n  }\n\n  /**\n   * Handle keyboard navigation in responsive mode.\n   *\n   * In responsive mode, the visual layout is inverted:\n   * - Cells are stacked vertically within each \"card\" (row)\n   * - DOWN/UP visually moves within the card (between fields)\n   * - Page Down/Page Up or Ctrl+Down/Up moves between cards\n   *\n   * For custom cardRenderers, keyboard navigation is disabled entirely\n   * since the implementor controls the card content and should handle\n   * navigation via their own event handlers.\n   *\n   * @returns `true` if the event was handled and default behavior should be prevented\n   */\n  override onKeyDown(e: KeyboardEvent): boolean {\n    if (!this.#isResponsive) {\n      return false;\n    }\n\n    // If custom cardRenderer is provided, disable grid's keyboard navigation\n    // The implementor is responsible for their own navigation\n    if (this.config.cardRenderer) {\n      const navKeys = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'];\n      if (navKeys.includes(e.key)) {\n        // Let the event bubble - implementor can handle it\n        return false;\n      }\n    }\n\n    // Swap arrow key behavior for CSS-only responsive mode\n    // In card layout, cells are stacked vertically:\n    //   Card 1:       Card 2:\n    //     ID: 1         ID: 2\n    //     Name: Alice   Name: Bob  <- ArrowRight goes here\n    //     Dept: Eng     Dept: Mkt\n    //       ↓ ArrowDown goes here\n    //\n    // ArrowDown/Up = move within card (change column/field)\n    // ArrowRight/Left = move between cards (change row)\n    const maxRow = this.rows.length - 1;\n    const maxCol = this.visibleColumns.length - 1;\n\n    switch (e.key) {\n      case 'ArrowDown':\n        // Move down WITHIN card (to next field/column)\n        if (this.grid._focusCol < maxCol) {\n          this.grid._focusCol += 1;\n          e.preventDefault();\n          ensureCellVisible(this.grid as unknown as InternalGrid);\n          return true;\n        }\n        // At bottom of card - optionally move to next card's first field\n        if (this.grid._focusRow < maxRow) {\n          this.grid._focusRow += 1;\n          this.grid._focusCol = 0;\n          e.preventDefault();\n          ensureCellVisible(this.grid as unknown as InternalGrid);\n          return true;\n        }\n        break;\n\n      case 'ArrowUp':\n        // Move up WITHIN card (to previous field/column)\n        if (this.grid._focusCol > 0) {\n          this.grid._focusCol -= 1;\n          e.preventDefault();\n          ensureCellVisible(this.grid as unknown as InternalGrid);\n          return true;\n        }\n        // At top of card - optionally move to previous card's last field\n        if (this.grid._focusRow > 0) {\n          this.grid._focusRow -= 1;\n          this.grid._focusCol = maxCol;\n          e.preventDefault();\n          ensureCellVisible(this.grid as unknown as InternalGrid);\n          return true;\n        }\n        break;\n\n      case 'ArrowRight':\n        // Move to NEXT card (same field)\n        if (this.grid._focusRow < maxRow) {\n          this.grid._focusRow += 1;\n          e.preventDefault();\n          ensureCellVisible(this.grid as unknown as InternalGrid);\n          return true;\n        }\n        break;\n\n      case 'ArrowLeft':\n        // Move to PREVIOUS card (same field)\n        if (this.grid._focusRow > 0) {\n          this.grid._focusRow -= 1;\n          e.preventDefault();\n          ensureCellVisible(this.grid as unknown as InternalGrid);\n          return true;\n        }\n        break;\n    }\n\n    return false;\n  }\n}\n"],"names":["ResponsivePlugin","BaseGridPlugin","styles","#resizeObserver","#isResponsive","#debounceTimer","#warnedAboutMissingBreakpoint","#currentWidth","#hiddenColumnSet","#valueOnlyColumnSet","#activeBreakpoint","#sortedBreakpoints","enabled","#applyResponsiveState","width","#checkBreakpoint","renderer","grid","#buildHiddenColumnSets","a","b","entries","hiddenColumns","col","hasHiddenColumns","hasValueOnlyColumns","cells","cell","field","#checkMultiBreakpoint","breakpoint","shouldBeResponsive","newActiveBreakpoint","bp","#originalRowHeight","animate","internalGrid","scrollArea","rows","row","rowEl","rowIndex","cardContent","cardHeight","maxRow","maxCol","ensureCellVisible"],"mappings":"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"}
+{"version":3,"file":"responsive.umd.js","sources":["../../../../../libs/grid/src/lib/plugins/responsive/ResponsivePlugin.ts"],"sourcesContent":["/**\n * Responsive Plugin\n *\n * Transforms the grid from tabular layout to a card/list layout when the grid\n * width falls below a configurable breakpoint. This enables grids to work in\n * narrow containers (split-pane UIs, mobile viewports, dashboard widgets).\n *\n * ## Installation\n *\n * ```ts\n * import { ResponsivePlugin } from '@toolbox-web/grid/plugins/responsive';\n *\n * const config: GridConfig = {\n *   plugins: [new ResponsivePlugin({ breakpoint: 500 })],\n * };\n * ```\n *\n * ## How It Works\n *\n * 1. ResizeObserver monitors the grid element's width\n * 2. When `width < breakpoint`, adds `data-responsive` attribute to grid\n * 3. CSS transforms cells from horizontal to vertical layout\n * 4. Each cell displays \"Header: Value\" using CSS `::before` pseudo-element\n *\n * @see [Responsive Demo](?path=/story/grid-plugins-responsive--default)\n */\n\nimport { ensureCellVisible } from '../../core/internal/keyboard';\nimport { BaseGridPlugin, type GridElement, type PluginManifest } from '../../core/plugin/base-plugin';\nimport type { InternalGrid } from '../../core/types';\nimport styles from './responsive.css?inline';\nimport type { BreakpointConfig, HiddenColumnConfig, ResponsiveChangeDetail, ResponsivePluginConfig } from './types';\n\n/**\n * Responsive Plugin for tbw-grid\n *\n * Adds automatic card layout mode when the grid width falls below a configurable\n * breakpoint. Perfect for responsive designs, split-pane UIs, and mobile viewports.\n *\n * @template T The row data type\n *\n * @example\n * ```ts\n * // Basic usage - switch to card layout below 500px\n * const config: GridConfig = {\n *   plugins: [new ResponsivePlugin({ breakpoint: 500 })],\n * };\n * ```\n *\n * @example\n * ```ts\n * // Hide less important columns in card mode\n * const config: GridConfig = {\n *   plugins: [\n *     new ResponsivePlugin({\n *       breakpoint: 600,\n *       hiddenColumns: ['createdAt', 'updatedAt'],\n *     }),\n *   ],\n * };\n * ```\n *\n * @example\n * ```ts\n * // Custom card renderer for advanced layouts\n * const config: GridConfig = {\n *   plugins: [\n *     new ResponsivePlugin({\n *       breakpoint: 400,\n *       cardRenderer: (row) => {\n *         const card = document.createElement('div');\n *         card.className = 'custom-card';\n *         card.innerHTML = `<strong>${row.name}</strong><br>${row.email}`;\n *         return card;\n *       },\n *     }),\n *   ],\n * };\n * ```\n */\nexport class ResponsivePlugin<T = unknown> extends BaseGridPlugin<ResponsivePluginConfig<T>> {\n  readonly name = 'responsive';\n  override readonly version = '1.0.0';\n  override readonly styles = styles;\n\n  /**\n   * Plugin manifest declaring incompatibilities with other plugins.\n   */\n  static override readonly manifest: PluginManifest = {\n    incompatibleWith: [\n      {\n        name: 'groupingRows',\n        reason:\n          'Responsive card layout does not yet support row grouping. ' +\n          'The variable row heights (cards vs group headers) cause scroll calculation issues.',\n      },\n    ],\n  };\n\n  #resizeObserver?: ResizeObserver;\n  #isResponsive = false;\n  #debounceTimer?: ReturnType<typeof setTimeout>;\n  #warnedAboutMissingBreakpoint = false;\n  #currentWidth = 0;\n  /** Set of column fields to completely hide */\n  #hiddenColumnSet: Set<string> = new Set();\n  /** Set of column fields to show value only (no header label) */\n  #valueOnlyColumnSet: Set<string> = new Set();\n  /** Currently active breakpoint, or null if none */\n  #activeBreakpoint: BreakpointConfig | null = null;\n  /** Sorted breakpoints from largest to smallest */\n  #sortedBreakpoints: BreakpointConfig[] = [];\n\n  /**\n   * Check if currently in responsive mode.\n   * @returns `true` if the grid is in card layout mode\n   */\n  isResponsive(): boolean {\n    return this.#isResponsive;\n  }\n\n  /**\n   * Force responsive mode regardless of width.\n   * Useful for testing or manual control.\n   * @param enabled - Whether to enable responsive mode\n   */\n  setResponsive(enabled: boolean): void {\n    if (enabled !== this.#isResponsive) {\n      this.#isResponsive = enabled;\n      this.#applyResponsiveState();\n      this.emit('responsive-change', {\n        isResponsive: enabled,\n        width: this.#currentWidth,\n        breakpoint: this.config.breakpoint ?? 0,\n      } satisfies ResponsiveChangeDetail);\n    }\n  }\n\n  /**\n   * Update breakpoint dynamically.\n   * @param width - New breakpoint width in pixels\n   */\n  setBreakpoint(width: number): void {\n    this.config.breakpoint = width;\n    this.#checkBreakpoint(this.#currentWidth);\n  }\n\n  /**\n   * Set a custom card renderer.\n   * This allows framework adapters to provide template-based renderers at runtime.\n   * @param renderer - The card renderer function, or undefined to use default\n   */\n  setCardRenderer(renderer: ResponsivePluginConfig<T>['cardRenderer']): void {\n    this.config.cardRenderer = renderer;\n    // If already in responsive mode, trigger a re-render to apply the new renderer\n    if (this.#isResponsive) {\n      this.requestRender();\n    }\n  }\n\n  /**\n   * Get current grid width.\n   * @returns Width of the grid element in pixels\n   */\n  getWidth(): number {\n    return this.#currentWidth;\n  }\n\n  /**\n   * Get the currently active breakpoint config (multi-breakpoint mode only).\n   * @returns The active BreakpointConfig, or null if no breakpoint is active\n   */\n  getActiveBreakpoint(): BreakpointConfig | null {\n    return this.#activeBreakpoint;\n  }\n\n  override attach(grid: GridElement): void {\n    super.attach(grid);\n\n    // Build hidden column sets from config\n    this.#buildHiddenColumnSets(this.config.hiddenColumns);\n\n    // Sort breakpoints from largest to smallest for evaluation\n    if (this.config.breakpoints?.length) {\n      this.#sortedBreakpoints = [...this.config.breakpoints].sort((a, b) => b.maxWidth - a.maxWidth);\n    }\n\n    // Observe the grid element itself (not internal viewport)\n    // This captures the container width including when shell panels open/close\n    this.#resizeObserver = new ResizeObserver((entries) => {\n      const width = entries[0]?.contentRect.width ?? 0;\n      this.#currentWidth = width;\n\n      // Debounce to avoid thrashing during resize drag\n      clearTimeout(this.#debounceTimer);\n      this.#debounceTimer = setTimeout(() => {\n        this.#checkBreakpoint(width);\n      }, this.config.debounceMs ?? 100);\n    });\n\n    this.#resizeObserver.observe(this.gridElement);\n  }\n\n  /**\n   * Build the hidden and value-only column sets from config.\n   */\n  #buildHiddenColumnSets(hiddenColumns?: HiddenColumnConfig[]): void {\n    this.#hiddenColumnSet.clear();\n    this.#valueOnlyColumnSet.clear();\n\n    if (!hiddenColumns) return;\n\n    for (const col of hiddenColumns) {\n      if (typeof col === 'string') {\n        this.#hiddenColumnSet.add(col);\n      } else if (col.showValue) {\n        this.#valueOnlyColumnSet.add(col.field);\n      } else {\n        this.#hiddenColumnSet.add(col.field);\n      }\n    }\n  }\n\n  override detach(): void {\n    this.#resizeObserver?.disconnect();\n    this.#resizeObserver = undefined;\n    clearTimeout(this.#debounceTimer);\n    this.#debounceTimer = undefined;\n\n    // Clean up attribute\n    if (this.gridElement) {\n      this.gridElement.removeAttribute('data-responsive');\n    }\n\n    super.detach();\n  }\n\n  /**\n   * Apply hidden and value-only columns.\n   * In legacy mode (single breakpoint), only applies when in responsive mode.\n   * In multi-breakpoint mode, applies whenever there's an active breakpoint.\n   */\n  override afterRender(): void {\n    // Measure card height for virtualization calculations\n    this.#measureCardHeightFromDOM();\n\n    // In single breakpoint mode, only apply when responsive\n    // In multi-breakpoint mode, apply when there's an active breakpoint\n    const shouldApply = this.#sortedBreakpoints.length > 0 ? this.#activeBreakpoint !== null : this.#isResponsive;\n\n    if (!shouldApply) {\n      return;\n    }\n\n    const hasHiddenColumns = this.#hiddenColumnSet.size > 0;\n    const hasValueOnlyColumns = this.#valueOnlyColumnSet.size > 0;\n\n    if (!hasHiddenColumns && !hasValueOnlyColumns) {\n      return;\n    }\n\n    // Mark cells for hidden columns and value-only columns\n    const cells = this.gridElement.querySelectorAll('.cell[data-field]');\n    for (const cell of cells) {\n      const field = cell.getAttribute('data-field');\n      if (!field) continue;\n\n      // Apply hidden attribute\n      if (this.#hiddenColumnSet.has(field)) {\n        cell.setAttribute('data-responsive-hidden', '');\n        cell.removeAttribute('data-responsive-value-only');\n      }\n      // Apply value-only attribute (shows value without header label)\n      else if (this.#valueOnlyColumnSet.has(field)) {\n        cell.setAttribute('data-responsive-value-only', '');\n        cell.removeAttribute('data-responsive-hidden');\n      }\n      // Clear any previous responsive attributes\n      else {\n        cell.removeAttribute('data-responsive-hidden');\n        cell.removeAttribute('data-responsive-value-only');\n      }\n    }\n  }\n\n  /**\n   * Check if width has crossed any breakpoint threshold.\n   * Handles both single breakpoint (legacy) and multi-breakpoint modes.\n   */\n  #checkBreakpoint(width: number): void {\n    // Multi-breakpoint mode\n    if (this.#sortedBreakpoints.length > 0) {\n      this.#checkMultiBreakpoint(width);\n      return;\n    }\n\n    // Legacy single breakpoint mode\n    const breakpoint = this.config.breakpoint ?? 0;\n\n    // Warn once if breakpoint not configured (0 means never responsive)\n    if (breakpoint === 0 && !this.#warnedAboutMissingBreakpoint) {\n      this.#warnedAboutMissingBreakpoint = true;\n      console.warn(\n        \"[tbw-grid:ResponsivePlugin] No breakpoint configured. Responsive mode is disabled. Set a breakpoint based on your grid's column count.\",\n      );\n    }\n\n    const shouldBeResponsive = breakpoint > 0 && width < breakpoint;\n\n    if (shouldBeResponsive !== this.#isResponsive) {\n      this.#isResponsive = shouldBeResponsive;\n      this.#applyResponsiveState();\n      this.emit('responsive-change', {\n        isResponsive: shouldBeResponsive,\n        width,\n        breakpoint,\n      } satisfies ResponsiveChangeDetail);\n      this.requestRender();\n    }\n  }\n\n  /**\n   * Check breakpoints in multi-breakpoint mode.\n   * Evaluates breakpoints from largest to smallest, applying the first match.\n   */\n  #checkMultiBreakpoint(width: number): void {\n    // Find the active breakpoint (first one where width <= maxWidth)\n    // Since sorted largest to smallest, we find the largest matching breakpoint\n    let newActiveBreakpoint: BreakpointConfig | null = null;\n\n    for (const bp of this.#sortedBreakpoints) {\n      if (width <= bp.maxWidth) {\n        newActiveBreakpoint = bp;\n        // Continue to find the most specific (smallest) matching breakpoint\n      }\n    }\n\n    // Check if breakpoint changed\n    const breakpointChanged = newActiveBreakpoint !== this.#activeBreakpoint;\n\n    if (breakpointChanged) {\n      this.#activeBreakpoint = newActiveBreakpoint;\n\n      // Update hidden column sets from active breakpoint\n      if (newActiveBreakpoint?.hiddenColumns) {\n        this.#buildHiddenColumnSets(newActiveBreakpoint.hiddenColumns);\n      } else {\n        // Fall back to top-level hiddenColumns config\n        this.#buildHiddenColumnSets(this.config.hiddenColumns);\n      }\n\n      // Determine if we should be in card layout\n      const shouldBeResponsive = newActiveBreakpoint?.cardLayout === true;\n\n      if (shouldBeResponsive !== this.#isResponsive) {\n        this.#isResponsive = shouldBeResponsive;\n        this.#applyResponsiveState();\n      }\n\n      // Emit event for any breakpoint change\n      this.emit('responsive-change', {\n        isResponsive: this.#isResponsive,\n        width,\n        breakpoint: newActiveBreakpoint?.maxWidth ?? 0,\n      } satisfies ResponsiveChangeDetail);\n\n      this.requestRender();\n    }\n  }\n\n  /** Original row height before entering responsive mode, for restoration on exit */\n  #originalRowHeight?: number;\n\n  /**\n   * Apply the responsive state to the grid element.\n   * Handles scroll reset when entering responsive mode and row height restoration on exit.\n   */\n  #applyResponsiveState(): void {\n    this.gridElement.toggleAttribute('data-responsive', this.#isResponsive);\n\n    // Apply animation attribute if enabled (default: true)\n    const animate = this.config.animate !== false;\n    this.gridElement.toggleAttribute('data-responsive-animate', animate);\n\n    // Set custom animation duration if provided\n    if (this.config.animationDuration) {\n      this.gridElement.style.setProperty('--tbw-responsive-duration', `${this.config.animationDuration}ms`);\n    }\n\n    // Cast to internal type for virtualization access\n    const internalGrid = this.grid as unknown as InternalGrid;\n\n    if (this.#isResponsive) {\n      // Store original row height before responsive mode changes it\n      if (internalGrid._virtualization) {\n        this.#originalRowHeight = internalGrid._virtualization.rowHeight;\n      }\n\n      // Reset horizontal scroll position when entering responsive mode\n      // The CSS hides overflow but doesn't reset the scroll position\n      const scrollArea = this.gridElement.querySelector('.tbw-scroll-area') as HTMLElement | null;\n      if (scrollArea) {\n        scrollArea.scrollLeft = 0;\n      }\n    } else {\n      // Exiting responsive mode - clean up inline styles set by renderRow\n      // The rows are reused from the pool, so we need to remove the card-specific styles\n      const rows = this.gridElement.querySelectorAll('.data-grid-row');\n      for (const row of rows) {\n        (row as HTMLElement).style.height = '';\n        row.classList.remove('responsive-card');\n      }\n\n      // Restore original row height\n      if (this.#originalRowHeight && this.#originalRowHeight > 0 && internalGrid._virtualization) {\n        internalGrid._virtualization.rowHeight = this.#originalRowHeight;\n        this.#originalRowHeight = undefined;\n      }\n\n      // Clear cached measurements so they're remeasured fresh when re-entering responsive mode\n      // Without this, stale measurements cause incorrect height calculations after scrolling\n      this.#measuredCardHeight = undefined;\n      this.#measuredGroupRowHeight = undefined;\n      this.#lastCardRowCount = undefined;\n    }\n  }\n\n  /**\n   * Custom row rendering when cardRenderer is provided and in responsive mode.\n   *\n   * When a cardRenderer is configured, this hook takes over row rendering to display\n   * the custom card layout instead of the default cell structure.\n   *\n   * @param row - The row data object\n   * @param rowEl - The row DOM element to render into\n   * @param rowIndex - The index of the row in the data array\n   * @returns `true` if rendered (prevents default), `void` for default rendering\n   */\n  override renderRow(row: unknown, rowEl: HTMLElement, rowIndex: number): boolean | void {\n    // Only override when in responsive mode AND cardRenderer is provided\n    if (!this.#isResponsive || !this.config.cardRenderer) {\n      return; // Let default rendering proceed\n    }\n\n    // Skip group rows from GroupingRowsPlugin - they have special structure\n    // and should use their own renderer\n    if ((row as { __isGroupRow?: boolean }).__isGroupRow) {\n      return; // Let GroupingRowsPlugin handle group row rendering\n    }\n\n    // Clear existing content\n    rowEl.replaceChildren();\n\n    // Call user's cardRenderer to get custom content\n    const cardContent = this.config.cardRenderer(row as T, rowIndex);\n\n    // Reset className - clears any stale classes from previous use (e.g., 'group-row' from recycled element)\n    // This follows the same pattern as GroupingRowsPlugin which sets className explicitly\n    rowEl.className = 'data-grid-row responsive-card';\n\n    // Handle cardRowHeight\n    const cardHeight = this.config.cardRowHeight ?? 'auto';\n    if (cardHeight !== 'auto') {\n      rowEl.style.height = `${cardHeight}px`;\n    } else {\n      // Remove any virtualization-set height for auto mode\n      rowEl.style.height = 'auto';\n    }\n\n    // Append the custom card content\n    rowEl.appendChild(cardContent);\n\n    return true; // We handled rendering\n  }\n\n  /**\n   * Handle keyboard navigation in responsive mode.\n   *\n   * In responsive mode, the visual layout is inverted:\n   * - Cells are stacked vertically within each \"card\" (row)\n   * - DOWN/UP visually moves within the card (between fields)\n   * - Page Down/Page Up or Ctrl+Down/Up moves between cards\n   *\n   * For custom cardRenderers, keyboard navigation is disabled entirely\n   * since the implementor controls the card content and should handle\n   * navigation via their own event handlers.\n   *\n   * @returns `true` if the event was handled and default behavior should be prevented\n   */\n  override onKeyDown(e: KeyboardEvent): boolean {\n    if (!this.#isResponsive) {\n      return false;\n    }\n\n    // If custom cardRenderer is provided, disable grid's keyboard navigation\n    // The implementor is responsible for their own navigation\n    if (this.config.cardRenderer) {\n      const navKeys = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'];\n      if (navKeys.includes(e.key)) {\n        // Let the event bubble - implementor can handle it\n        return false;\n      }\n    }\n\n    // Swap arrow key behavior for CSS-only responsive mode\n    // In card layout, cells are stacked vertically:\n    //   Card 1:       Card 2:\n    //     ID: 1         ID: 2\n    //     Name: Alice   Name: Bob  <- ArrowRight goes here\n    //     Dept: Eng     Dept: Mkt\n    //       ↓ ArrowDown goes here\n    //\n    // ArrowDown/Up = move within card (change column/field)\n    // ArrowRight/Left = move between cards (change row)\n    const maxRow = this.rows.length - 1;\n    const maxCol = this.visibleColumns.length - 1;\n\n    switch (e.key) {\n      case 'ArrowDown':\n        // Move down WITHIN card (to next field/column)\n        if (this.grid._focusCol < maxCol) {\n          this.grid._focusCol += 1;\n          e.preventDefault();\n          ensureCellVisible(this.grid as unknown as InternalGrid);\n          return true;\n        }\n        // At bottom of card - optionally move to next card's first field\n        if (this.grid._focusRow < maxRow) {\n          this.grid._focusRow += 1;\n          this.grid._focusCol = 0;\n          e.preventDefault();\n          ensureCellVisible(this.grid as unknown as InternalGrid);\n          return true;\n        }\n        break;\n\n      case 'ArrowUp':\n        // Move up WITHIN card (to previous field/column)\n        if (this.grid._focusCol > 0) {\n          this.grid._focusCol -= 1;\n          e.preventDefault();\n          ensureCellVisible(this.grid as unknown as InternalGrid);\n          return true;\n        }\n        // At top of card - optionally move to previous card's last field\n        if (this.grid._focusRow > 0) {\n          this.grid._focusRow -= 1;\n          this.grid._focusCol = maxCol;\n          e.preventDefault();\n          ensureCellVisible(this.grid as unknown as InternalGrid);\n          return true;\n        }\n        break;\n\n      case 'ArrowRight':\n        // Move to NEXT card (same field)\n        if (this.grid._focusRow < maxRow) {\n          this.grid._focusRow += 1;\n          e.preventDefault();\n          ensureCellVisible(this.grid as unknown as InternalGrid);\n          return true;\n        }\n        break;\n\n      case 'ArrowLeft':\n        // Move to PREVIOUS card (same field)\n        if (this.grid._focusRow > 0) {\n          this.grid._focusRow -= 1;\n          e.preventDefault();\n          ensureCellVisible(this.grid as unknown as InternalGrid);\n          return true;\n        }\n        break;\n    }\n\n    return false;\n  }\n\n  // ============================================\n  // Variable Height Support for Mixed Row Types\n  // ============================================\n\n  /** Measured card height from DOM for virtualization calculations */\n  #measuredCardHeight?: number;\n\n  /** Measured group row height from DOM for virtualization calculations */\n  #measuredGroupRowHeight?: number;\n\n  /** Last known card row count for detecting changes (e.g., group expand/collapse) */\n  #lastCardRowCount?: number;\n\n  /**\n   * Get the effective card height for virtualization calculations.\n   * Prioritizes DOM-measured height (actual rendered size) over config,\n   * since content can overflow the configured height.\n   */\n  #getCardHeight(): number {\n    // Prefer measured height - it reflects actual rendered size including overflow\n    if (this.#measuredCardHeight && this.#measuredCardHeight > 0) {\n      return this.#measuredCardHeight;\n    }\n    // Fall back to explicit config\n    const configHeight = this.config.cardRowHeight;\n    if (typeof configHeight === 'number' && configHeight > 0) {\n      return configHeight;\n    }\n    // Default fallback\n    return 80;\n  }\n\n  /**\n   * Get the effective group row height for virtualization calculations.\n   * Uses DOM-measured height, falling back to original row height.\n   */\n  #getGroupRowHeight(): number {\n    if (this.#measuredGroupRowHeight && this.#measuredGroupRowHeight > 0) {\n      return this.#measuredGroupRowHeight;\n    }\n    // Fall back to original row height (before responsive mode)\n    return this.#originalRowHeight ?? 28;\n  }\n\n  /**\n   * Check if there are any group rows in the current dataset.\n   * Used to determine if we have mixed row heights.\n   */\n  #hasGroupRows(): boolean {\n    for (const row of this.rows) {\n      if ((row as { __isGroupRow?: boolean }).__isGroupRow) {\n        return true;\n      }\n    }\n    return false;\n  }\n\n  /**\n   * Count group rows and card rows in the current dataset.\n   */\n  #countRowTypes(): { groupCount: number; cardCount: number } {\n    let groupCount = 0;\n    let cardCount = 0;\n    for (const row of this.rows) {\n      if ((row as { __isGroupRow?: boolean }).__isGroupRow) {\n        groupCount++;\n      } else {\n        cardCount++;\n      }\n    }\n    return { groupCount, cardCount };\n  }\n\n  /**\n   * Return total extra height contributed by mixed row heights.\n   * This is called by the grid's virtualization system to adjust scrollbar height.\n   *\n   * The grid calculates: totalRows * baseRowHeight + pluginExtraHeight\n   *\n   * For mixed layouts (groups + cards), we need to report the difference between\n   * actual heights and what the base calculation assumes:\n   * - Extra for groups: groupCount * (groupHeight - baseHeight)\n   * - Extra for cards: cardCount * (cardHeight - baseHeight)\n   */\n  override getExtraHeight(): number {\n    // Only applies when in responsive mode with cardRenderer\n    if (!this.#isResponsive || !this.config.cardRenderer) {\n      return 0;\n    }\n\n    // Only report extra height when there are mixed row types (groups + cards)\n    // If all rows are cards, we update the virtualization row height instead\n    if (!this.#hasGroupRows()) {\n      return 0;\n    }\n\n    const baseHeight = this.#originalRowHeight ?? 28;\n    const groupHeight = this.#getGroupRowHeight();\n    const cardHeight = this.#getCardHeight();\n\n    const { groupCount, cardCount } = this.#countRowTypes();\n\n    // Calculate extra height for both row types\n    const groupExtra = groupCount * Math.max(0, groupHeight - baseHeight);\n    const cardExtra = cardCount * Math.max(0, cardHeight - baseHeight);\n\n    return groupExtra + cardExtra;\n  }\n\n  /**\n   * Return extra height that appears before a given row index.\n   * Used by virtualization to correctly calculate scroll positions.\n   *\n   * Like getExtraHeight, this accounts for both group and card row heights.\n   */\n  override getExtraHeightBefore(beforeRowIndex: number): number {\n    // Only applies when in responsive mode with cardRenderer\n    if (!this.#isResponsive || !this.config.cardRenderer) {\n      return 0;\n    }\n\n    // Only report extra height when there are mixed row types\n    if (!this.#hasGroupRows()) {\n      return 0;\n    }\n\n    const baseHeight = this.#originalRowHeight ?? 28;\n    const groupHeight = this.#getGroupRowHeight();\n    const cardHeight = this.#getCardHeight();\n\n    const groupHeightDiff = Math.max(0, groupHeight - baseHeight);\n    const cardHeightDiff = Math.max(0, cardHeight - baseHeight);\n\n    // Count group rows and card rows before the given index\n    let groupsBefore = 0;\n    let cardsBefore = 0;\n    const rows = this.rows;\n    const maxIndex = Math.min(beforeRowIndex, rows.length);\n\n    for (let i = 0; i < maxIndex; i++) {\n      if ((rows[i] as { __isGroupRow?: boolean }).__isGroupRow) {\n        groupsBefore++;\n      } else {\n        cardsBefore++;\n      }\n    }\n\n    return groupsBefore * groupHeightDiff + cardsBefore * cardHeightDiff;\n  }\n\n  /**\n   * Count the number of card rows (non-group rows) in the current dataset.\n   */\n  #countCardRows(): number {\n    let count = 0;\n    for (const row of this.rows) {\n      if (!(row as { __isGroupRow?: boolean }).__isGroupRow) {\n        count++;\n      }\n    }\n    return count;\n  }\n\n  /** Pending refresh scheduled via microtask */\n  #pendingRefresh = false;\n\n  /**\n   * Measure card height from DOM after render and detect row count changes.\n   * Called in afterRender to ensure scroll calculations are accurate.\n   *\n   * This handles two scenarios:\n   * 1. Card height changes (content overflow, dynamic sizing)\n   * 2. Card row count changes (group expand/collapse)\n   * 3. Group row height changes\n   *\n   * For uniform card layouts (no groups), we update the virtualization row height\n   * directly to the card height. For mixed layouts (groups + cards), we use the\n   * getExtraHeight mechanism to report height differences.\n   *\n   * The refresh is deferred via microtask to avoid nested render cycles.\n   */\n  #measureCardHeightFromDOM(): void {\n    if (!this.#isResponsive || !this.config.cardRenderer) {\n      return;\n    }\n\n    let needsRefresh = false;\n    const internalGrid = this.grid as unknown as InternalGrid;\n    const hasGroups = this.#hasGroupRows();\n\n    // Check if card row count changed (e.g., group expanded/collapsed)\n    const currentCardRowCount = this.#countCardRows();\n    if (currentCardRowCount !== this.#lastCardRowCount) {\n      this.#lastCardRowCount = currentCardRowCount;\n      needsRefresh = true;\n    }\n\n    // Measure actual group row height from DOM (for mixed layouts)\n    if (hasGroups) {\n      const groupRow = this.gridElement.querySelector('.data-grid-row.group-row') as HTMLElement | null;\n      if (groupRow) {\n        const height = groupRow.getBoundingClientRect().height;\n        if (height > 0 && height !== this.#measuredGroupRowHeight) {\n          this.#measuredGroupRowHeight = height;\n          needsRefresh = true;\n        }\n      }\n    }\n\n    // Measure actual card height from DOM\n    const cardRow = this.gridElement.querySelector('.data-grid-row.responsive-card') as HTMLElement | null;\n    if (cardRow) {\n      const height = cardRow.getBoundingClientRect().height;\n      if (height > 0 && height !== this.#measuredCardHeight) {\n        this.#measuredCardHeight = height;\n        needsRefresh = true;\n\n        // For uniform card layouts (no groups), update virtualization row height directly\n        // This ensures proper row recycling and translateY calculations\n        if (!hasGroups && internalGrid._virtualization) {\n          internalGrid._virtualization.rowHeight = height;\n        }\n      }\n    }\n\n    // Defer virtualization refresh to avoid nested render cycles\n    // This is called from afterRender, so we can't call refreshVirtualWindow synchronously\n    // Use scheduler's VIRTUALIZATION phase to batch properly and avoid duplicate afterRender calls\n    if (needsRefresh && !this.#pendingRefresh) {\n      this.#pendingRefresh = true;\n      queueMicrotask(() => {\n        this.#pendingRefresh = false;\n        // Only refresh if still attached and in responsive mode\n        if (this.grid && this.#isResponsive) {\n          // Request virtualization phase through grid's public API\n          // This goes through the scheduler which batches and handles afterRender properly\n          (this.grid as unknown as InternalGrid).refreshVirtualWindow?.(true, true);\n        }\n      });\n    }\n  }\n}\n"],"names":["ResponsivePlugin","BaseGridPlugin","styles","#resizeObserver","#isResponsive","#debounceTimer","#warnedAboutMissingBreakpoint","#currentWidth","#hiddenColumnSet","#valueOnlyColumnSet","#activeBreakpoint","#sortedBreakpoints","enabled","#applyResponsiveState","width","#checkBreakpoint","renderer","grid","#buildHiddenColumnSets","a","b","entries","hiddenColumns","col","#measureCardHeightFromDOM","hasHiddenColumns","hasValueOnlyColumns","cells","cell","field","#checkMultiBreakpoint","breakpoint","shouldBeResponsive","newActiveBreakpoint","bp","#originalRowHeight","animate","internalGrid","scrollArea","rows","row","#measuredCardHeight","#measuredGroupRowHeight","#lastCardRowCount","rowEl","rowIndex","cardContent","cardHeight","e","maxRow","maxCol","ensureCellVisible","#getCardHeight","configHeight","#getGroupRowHeight","#hasGroupRows","#countRowTypes","groupCount","cardCount","baseHeight","groupHeight","groupExtra","cardExtra","beforeRowIndex","groupHeightDiff","cardHeightDiff","groupsBefore","cardsBefore","maxIndex","i","#countCardRows","count","#pendingRefresh","needsRefresh","hasGroups","currentCardRowCount","groupRow","height","cardRow"],"mappings":"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"}