@toolbox-web/grid 1.25.0 → 1.25.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,19 @@
1
1
  import { ColumnConfig } from '../../core/types';
2
- import { ColumnGroup, GroupingColumnsConfig } from './types';
2
+ import { ColumnGroup, ColumnGroupDefinition, GroupingColumnsConfig } from './types';
3
+ /**
4
+ * Generate a stable slug from a header string for use as auto-generated group id.
5
+ * E.g. `'Personal Info'` → `'personal-info'`
6
+ */
7
+ export declare function slugifyHeader(header: string): string;
8
+ /**
9
+ * Validate column group definitions and resolve auto-generated ids.
10
+ * Throws if a group has neither `id` nor `header`.
11
+ *
12
+ * @returns A new array with `id` resolved on every definition.
13
+ */
14
+ export declare function resolveColumnGroupDefs(defs: ColumnGroupDefinition[]): (ColumnGroupDefinition & {
15
+ id: string;
16
+ })[];
3
17
  /**
4
18
  * Compute column groups from column configuration.
5
19
  * Handles explicit groups (via column.group) and creates implicit groups for ungrouped columns.
@@ -4,5 +4,6 @@
4
4
  *
5
5
  * @module Plugins/Grouping Columns
6
6
  */
7
+ export { resolveColumnGroupDefs, slugifyHeader } from './grouping-columns';
7
8
  export { GroupingColumnsPlugin } from './GroupingColumnsPlugin';
8
9
  export type { ColumnGroup, ColumnGroupDefinition, GroupHeaderRenderParams, GroupingColumnsConfig } from './types';
@@ -1,2 +1,2 @@
1
- const e='<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>',t={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:e,filterActive:e,print:"🖨️"};class r{static dependencies;static manifest;aliases;version="undefined"!=typeof __GRID_VERSION__?__GRID_VERSION__:"dev";styles;cellRenderers;headerRenderers;cellEditors;grid;config;userConfig;#e;get defaultConfig(){return{}}constructor(e={}){this.userConfig=e}attach(e){this.#e?.abort(),this.#e=new AbortController,this.grid=e,this.config={...this.defaultConfig,...this.userConfig}}detach(){this.#e?.abort(),this.#e=void 0}getPlugin(e){return this.grid?.getPlugin(e)}emit(e,t){this.grid?.dispatchEvent?.(new CustomEvent(e,{detail:t,bubbles:!0}))}emitCancelable(e,t){const r=new CustomEvent(e,{detail:t,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(r),r.defaultPrevented}on(e,t){this.grid?._pluginManager?.subscribe(this,e,t)}off(e){this.grid?._pluginManager?.unsubscribe(this,e)}emitPluginEvent(e,t){this.grid?._pluginManager?.emitPluginEvent(e,t)}requestRender(){this.grid?.requestRender?.()}requestColumnsRender(){this.grid?.requestColumnsRender?.()}requestRenderWithFocus(){this.grid?.requestRenderWithFocus?.()}requestAfterRender(){this.grid?.requestAfterRender?.()}requestVirtualRefresh(){this.grid?.requestVirtualRefresh?.()}get rows(){return this.grid?.rows??[]}get sourceRows(){return this.grid?.sourceRows??[]}get columns(){return this.grid?.columns??[]}get visibleColumns(){return this.grid?._visibleColumns??[]}get gridElement(){return this.grid?._hostElement}get disconnectSignal(){return this.#e?.signal??this.grid?.disconnectSignal}get gridIcons(){const e=this.grid?.gridConfig?.icons??{};return{...t,...e}}get isAnimationEnabled(){const e=this.grid?.effectiveConfig?.animation?.mode??"reduced-motion";if(!1===e||"off"===e)return!1;if(!0===e||"on"===e)return!0;const t=this.gridElement;if(t){return"0"!==getComputedStyle(t).getPropertyValue("--tbw-animation-enabled").trim()}return!0}get animationDuration(){const e=this.gridElement;if(e){const t=getComputedStyle(e).getPropertyValue("--tbw-animation-duration").trim(),r=parseInt(t,10);if(!isNaN(r))return r}return 200}resolveIcon(e,t){return void 0!==t?t:this.gridIcons[e]}setIcon(e,t){"string"==typeof t?e.innerHTML=t:t instanceof HTMLElement&&(e.innerHTML="",e.appendChild(t.cloneNode(!0)))}warn(e){var t,r;console.warn(`${t=this.gridElement.id,r=this.name,`[tbw-grid${t?`#${t}`:""}${r?`:${r}`:""}]`} ${e}`)}}function o(e){if(!e.length)return[];const t=/* @__PURE__ */new Map,r=[],o=(e,t)=>{if(!t.length)return;const o=r[r.length-1];o&&o.implicit&&o.firstIndex+o.columns.length===e?o.columns.push(...t):r.push({id:"__implicit__"+e,label:void 0,columns:t,firstIndex:e,implicit:!0})};let i=[],n=0;return e.forEach((e,s)=>{const l=e.group;if(!l)return 0===i.length&&(n=s),void i.push(e);i.length&&(o(n,i.slice()),i=[]);const d="string"==typeof l?l:l.id;let u=t.get(d);u||(u={id:d,label:"string"==typeof l?void 0:l.label,columns:[],firstIndex:s},t.set(d,u),r.push(u)),u.columns.push(e)}),i.length&&o(n,i),1===r.length&&r[0].implicit&&r[0].columns.length===e.length?[]:r}function i(e,t){const r=e.columns[0],o=e.columns[e.columns.length-1],i=r?t.findIndex(e=>e.field===r.field):-1,n=o?t.findIndex(e=>e.field===o.field):-1;return-1!==i&&-1!==n?[i,n]:null}function n(e,t){const r=/* @__PURE__ */new Set,o=[];for(const n of e){if(String(n.id).startsWith("__implicit__"))continue;const e=i(n,t);e&&o.push(e)}for(const n of e){if(!String(n.id).startsWith("__implicit__"))continue;const e=i(n,t);if(!e)continue;const[s,l]=e;o.some(([e,t])=>s>=e&&l<=t)&&r.add(String(n.id))}return r}class s extends r{static manifest={ownedProperties:[{property:"group",level:"column",description:'the "group" column property'},{property:"columnGroups",level:"config",description:'the "columnGroups" config property',isUsed:e=>Array.isArray(e)&&e.length>0}],queries:[{type:"getColumnGrouping",description:"Returns column group metadata for the visibility panel"}]};name="groupingColumns";styles="@layer tbw-plugins{.header-group-row{display:grid;grid-auto-flow:column;background:var(--tbw-grouping-columns-header-bg, var(--tbw-color-header-bg));border-bottom:1px solid var(--tbw-grouping-columns-border, var(--tbw-color-border))}.header-group-cell{display:flex;align-items:center;justify-content:center;padding:var(--tbw-button-padding-sm, .25rem .5rem);font-weight:600;font-size:var(--tbw-font-size-sm, .9em);text-transform:uppercase;letter-spacing:.5px;border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.header-group-cell:last-child{border-right:none}.header-row .cell.grouped{border-top:none}.header-row .cell.group-end{border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.header-row .cell.group-end:last-child{border-right:none}.rows .cell.group-end{border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.rows .cell.group-end:last-child{border-right:none}.header-group-row.no-borders{border-bottom:none}.header-group-row.no-borders .header-group-cell{border-right:none}.header-row.no-group-borders .cell.group-end{border-right:1px solid var(--tbw-color-border)}}";get defaultConfig(){return{showGroupBorders:!0,lockGroupOrder:!1}}groups=[];isActive=!1;#t=/* @__PURE__ */new Set;attach(e){super.attach(e),this.gridElement.addEventListener("column-move",this.#r,{signal:this.disconnectSignal})}detach(){this.groups=[],this.isActive=!1,this.#t.clear()}#r=e=>{if(!this.isActive)return;const t=e,{field:r,columnOrder:o}=t.detail;if(this.config.lockGroupOrder)for(const i of this.groups)if(!i.id.startsWith("__implicit__")&&!this.#o(i,o))return t.preventDefault(),void this.#i(r);this.#n(o)};#n(e){this.#t.clear();const t=this.#s(e);for(const r of this.groups){const o=new Set(r.columns.map(e=>e.field));for(let r=e.length-1;r>=0;r--)if(o.has(e[r])){const o=e[r];o!==t&&this.#t.add(o);break}}}#s(e){if(0===this.groups.length)return null;for(let t=e.length-1;t>=0;t--){const r=e[t];for(const t of this.groups)if(t.columns.some(e=>e.field===r)){const r=new Set(t.columns.map(e=>e.field));for(let t=e.length-1;t>=0;t--)if(r.has(e[t]))return e[t]}}return null}#o(e,t){const r=e.columns.map(e=>t.indexOf(e.field)).filter(e=>-1!==e).sort((e,t)=>e-t);return r.length<=1||r.length===r[r.length-1]-r[0]+1}#i(e){const t=this.gridElement?.querySelector(`.header-row [part~="header-cell"][data-field="${e}"]`);t&&(t.style.setProperty("--_flash-color","var(--tbw-color-error)"),t.animate([{backgroundColor:"rgba(from var(--_flash-color) r g b / 30%)"},{backgroundColor:"transparent"}],{duration:400,easing:"ease-out"}))}handleQuery(e){if("getColumnGrouping"===e.type)return this.#l()}#l(){let e;const t=this.grid?.gridConfig?.columnGroups;if(t&&Array.isArray(t)&&t.length>0)e=t.filter(e=>e.children.length>0).map(e=>({id:e.id,label:e.header,fields:[...e.children]}));else if(this.isActive&&this.groups.length>0){e=this.groups.filter(e=>!e.id.startsWith("__implicit__")).map(e=>({id:e.id,label:e.label??e.id,fields:e.columns.map(e=>e.field)}));const t=this.columns;for(const r of t)if(r.hidden&&r.group){const t="string"==typeof r.group?r.group:r.group.id,o="string"==typeof r.group?r.group:r.group.label??r.group.id,i=e.find(e=>e.id===t);i?i.fields.includes(r.field)||i.fields.push(r.field):e.push({id:t,label:o,fields:[r.field]})}}else{const t=this.columns,r=/* @__PURE__ */new Map;for(const e of t){if(!e.group)continue;const t="string"==typeof e.group?e.group:e.group.id,o="string"==typeof e.group?e.group:e.group.label??e.group.id,i=r.get(t);i?i.fields.includes(e.field)||i.fields.push(e.field):r.set(t,{id:t,label:o,fields:[e.field]})}e=Array.from(r.values())}const r=this.grid?.getColumnOrder();if(r&&r.length>0){const t=new Map(r.map((e,t)=>[e,t]));for(const r of e)r.fields.sort((e,r)=>(t.get(e)??1/0)-(t.get(r)??1/0))}return e}static detect(e,t){if(t?.columnGroups&&Array.isArray(t.columnGroups)&&t.columnGroups.length>0)return!0;const r=t?.columns;return!!Array.isArray(r)&&function(e){return e.some(e=>null!=e.group)}(r)}processColumns(e){const t=this.grid?.gridConfig?.columnGroups;let r;if(t&&Array.isArray(t)&&t.length>0){const o=/* @__PURE__ */new Map;for(const e of t)for(const t of e.children)o.set(t,{id:e.id,label:e.header});r=e.map(e=>{const t=o.get(e.field);return t&&!e.group?{...e,group:t}:e})}else r=[...e];const i=o(r);if(0===i.length)return this.isActive=!1,this.groups=[],r;this.isActive=!0,this.groups=i,this.#t.clear();for(const o of i){const e=o.columns[o.columns.length-1];e?.field&&this.#t.add(e.field)}return r}afterRender(){if(!this.isActive){const e=this.gridElement?.querySelector(".header"),t=e?.querySelector(".header-group-row");return void(t&&t.remove())}const e=this.gridElement?.querySelector(".header");if(!e)return;const t=e.querySelector(".header-group-row");t&&t.remove();const r=this.visibleColumns,s=o(r);if(0===s.length)return;this.#t.clear();const l=n(s,r);for(let o=0;o<s.length;o++){const e=s[o];if(String(e.id).startsWith("__implicit__")&&l.has(String(e.id)))continue;const t=e.columns[e.columns.length-1];t?.field&&o<s.length-1&&this.#t.add(t.field)}const d=function(e,t,r){if(0===e.length)return null;const o=document.createElement("div");o.className="header-group-row",o.setAttribute("role","row");const s=n(e,t);for(const n of e){const e=String(n.id),l=e.startsWith("__implicit__");if(l&&s.has(e))continue;const d=i(n,t);if(!d)continue;const[u,c]=d,g=c-u+1,a=l?"":n.label||n.id,h=document.createElement("div");if(h.className="cell header-group-cell",l&&h.classList.add("implicit-group"),h.setAttribute("data-group",e),h.style.gridColumn=`${u+1} / span ${g}`,r&&!l){const t=r({id:e,label:String(a),columns:n.columns,firstIndex:u,isImplicit:!1});t instanceof HTMLElement?h.appendChild(t):"string"==typeof t?h.innerHTML=t:h.textContent=a}else h.textContent=a;o.appendChild(h)}return o}(s,r,this.config.groupHeaderRenderer);if(d){d.classList.toggle("no-borders",!this.config.showGroupBorders);const t=e.querySelector(".header-row");t?e.insertBefore(d,t):e.appendChild(d)}const u=e.querySelector(".header-row");u&&(u.classList.toggle("no-group-borders",!this.config.showGroupBorders),function(e,t,r){if(!t.length||!e)return;const o=n(t,r),i=/* @__PURE__ */new Map;for(const n of t)if(!String(n.id).startsWith("__implicit__")||!o.has(String(n.id)))for(const e of n.columns)e.field&&i.set(e.field,n.id);const s=Array.from(e.querySelectorAll(".cell[data-field]"));s.forEach(e=>{const t=e.getAttribute("data-field")||"",r=i.get(t);r&&(e.classList.add("grouped"),e.getAttribute("data-group")||e.setAttribute("data-group",r))});for(const n of t){if(String(n.id).startsWith("__implicit__")&&o.has(String(n.id)))continue;const e=n.columns[n.columns.length-1],t=s.find(t=>t.getAttribute("data-field")===e.field);t&&t.classList.add("group-end")}}(u,s,r))}afterCellRender(e){this.isActive&&this.config.showGroupBorders&&e.cellElement.classList.toggle("group-end",this.#t.has(e.column.field))}isGroupingActive(){return this.isActive}getGroups(){return this.groups}getGroupColumns(e){const t=this.groups.find(t=>t.id===e);return t?t.columns:[]}refresh(){this.requestRender()}}export{s as GroupingColumnsPlugin};
1
+ function e(e){return e.toLowerCase().trim().replace(/[^a-z0-9]+/g,"-").replace(/^-|-$/g,"")}function r(r){return r.map(r=>{if(r.id)return r;if(!r.header)throw new Error('[tbw-grid] ColumnGroupDefinition requires either an "id" or a "header" to generate an id from.');return{...r,id:e(r.header)}})}function t(e){if(!e.length)return[];const r=/* @__PURE__ */new Map,t=[],o=(e,r)=>{if(!r.length)return;const o=t[t.length-1];o&&o.implicit&&o.firstIndex+o.columns.length===e?o.columns.push(...r):t.push({id:"__implicit__"+e,label:void 0,columns:r,firstIndex:e,implicit:!0})};let i=[],n=0;return e.forEach((e,s)=>{const l=e.group;if(!l)return 0===i.length&&(n=s),void i.push(e);i.length&&(o(n,i.slice()),i=[]);const d="string"==typeof l?l:l.id;let u=r.get(d);u||(u={id:d,label:"string"==typeof l?void 0:l.label,columns:[],firstIndex:s},r.set(d,u),t.push(u)),u.columns.push(e)}),i.length&&o(n,i),1===t.length&&t[0].implicit&&t[0].columns.length===e.length?[]:t}function o(e,r){const t=e.columns[0],o=e.columns[e.columns.length-1],i=t?r.findIndex(e=>e.field===t.field):-1,n=o?r.findIndex(e=>e.field===o.field):-1;return-1!==i&&-1!==n?[i,n]:null}function i(e,r){const t=/* @__PURE__ */new Set,i=[];for(const n of e){if(String(n.id).startsWith("__implicit__"))continue;const e=o(n,r);e&&i.push(e)}for(const n of e){if(!String(n.id).startsWith("__implicit__"))continue;const e=o(n,r);if(!e)continue;const[s,l]=e;i.some(([e,r])=>s>=e&&l<=r)&&t.add(String(n.id))}return t}const n='<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>',s={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:n,filterActive:n,print:"🖨️"};class l{static dependencies;static manifest;aliases;version="undefined"!=typeof __GRID_VERSION__?__GRID_VERSION__:"dev";styles;cellRenderers;headerRenderers;cellEditors;grid;config;userConfig;#e;get defaultConfig(){return{}}constructor(e={}){this.userConfig=e}attach(e){this.#e?.abort(),this.#e=new AbortController,this.grid=e,this.config={...this.defaultConfig,...this.userConfig}}detach(){this.#e?.abort(),this.#e=void 0}getPlugin(e){return this.grid?.getPlugin(e)}emit(e,r){this.grid?.dispatchEvent?.(new CustomEvent(e,{detail:r,bubbles:!0}))}emitCancelable(e,r){const t=new CustomEvent(e,{detail:r,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(t),t.defaultPrevented}on(e,r){this.grid?._pluginManager?.subscribe(this,e,r)}off(e){this.grid?._pluginManager?.unsubscribe(this,e)}emitPluginEvent(e,r){this.grid?._pluginManager?.emitPluginEvent(e,r)}requestRender(){this.grid?.requestRender?.()}requestColumnsRender(){this.grid?.requestColumnsRender?.()}requestRenderWithFocus(){this.grid?.requestRenderWithFocus?.()}requestAfterRender(){this.grid?.requestAfterRender?.()}requestVirtualRefresh(){this.grid?.requestVirtualRefresh?.()}get rows(){return this.grid?.rows??[]}get sourceRows(){return this.grid?.sourceRows??[]}get columns(){return this.grid?.columns??[]}get visibleColumns(){return this.grid?._visibleColumns??[]}get gridElement(){return this.grid?._hostElement}get disconnectSignal(){return this.#e?.signal??this.grid?.disconnectSignal}get gridIcons(){const e=this.grid?.gridConfig?.icons??{};return{...s,...e}}get isAnimationEnabled(){const e=this.grid?.effectiveConfig?.animation?.mode??"reduced-motion";if(!1===e||"off"===e)return!1;if(!0===e||"on"===e)return!0;const r=this.gridElement;if(r){return"0"!==getComputedStyle(r).getPropertyValue("--tbw-animation-enabled").trim()}return!0}get animationDuration(){const e=this.gridElement;if(e){const r=getComputedStyle(e).getPropertyValue("--tbw-animation-duration").trim(),t=parseInt(r,10);if(!isNaN(t))return t}return 200}resolveIcon(e,r){return void 0!==r?r:this.gridIcons[e]}setIcon(e,r){"string"==typeof r?e.innerHTML=r:r instanceof HTMLElement&&(e.innerHTML="",e.appendChild(r.cloneNode(!0)))}warn(e){var r,t;console.warn(`${r=this.gridElement.id,t=this.name,`[tbw-grid${r?`#${r}`:""}${t?`:${t}`:""}]`} ${e}`)}}class d extends l{static manifest={ownedProperties:[{property:"group",level:"column",description:'the "group" column property'},{property:"columnGroups",level:"config",description:'the "columnGroups" config property',isUsed:e=>Array.isArray(e)&&e.length>0}],queries:[{type:"getColumnGrouping",description:"Returns column group metadata for the visibility panel"}]};name="groupingColumns";styles="@layer tbw-plugins{.header-group-row{display:grid;grid-auto-flow:column;background:var(--tbw-grouping-columns-header-bg, var(--tbw-color-header-bg));border-bottom:1px solid var(--tbw-grouping-columns-border, var(--tbw-color-border))}.header-group-cell{display:flex;align-items:center;justify-content:center;padding:var(--tbw-button-padding-sm, .25rem .5rem);font-weight:600;font-size:var(--tbw-font-size-sm, .9em);text-transform:uppercase;letter-spacing:.5px;border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.header-group-cell:last-child{border-right:none}.header-row .cell.grouped{border-top:none}.header-row .cell.group-end{border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.header-row .cell.group-end:last-child{border-right:none}.rows .cell.group-end{border-right:2px solid var(--tbw-grouping-columns-separator, var(--tbw-color-border-strong, var(--tbw-color-border)))}.rows .cell.group-end:last-child{border-right:none}.header-group-row.no-borders{border-bottom:none}.header-group-row.no-borders .header-group-cell{border-right:none}.header-row.no-group-borders .cell.group-end{border-right:1px solid var(--tbw-color-border)}}";get defaultConfig(){return{showGroupBorders:!0,lockGroupOrder:!1}}groups=[];isActive=!1;#r=/* @__PURE__ */new Set;#t=[];#o=/* @__PURE__ */new Map;attach(e){super.attach(e),this.gridElement.addEventListener("column-move",this.#i,{signal:this.disconnectSignal})}detach(){this.groups=[],this.isActive=!1,this.#r.clear(),this.#t=[],this.#o.clear()}#i=e=>{if(!this.isActive)return;const r=e,{field:t,columnOrder:o}=r.detail;if(this.config.lockGroupOrder)for(const i of this.groups)if(!i.id.startsWith("__implicit__")&&!this.#n(i,o))return r.preventDefault(),void this.#s(t);this.#l(o)};#l(e){this.#r.clear();const r=this.#d(e);for(const t of this.groups){const o=new Set(t.columns.map(e=>e.field));for(let t=e.length-1;t>=0;t--)if(o.has(e[t])){const o=e[t];o!==r&&this.#r.add(o);break}}}#d(e){if(0===this.groups.length)return null;for(let r=e.length-1;r>=0;r--){const t=e[r];for(const r of this.groups)if(r.columns.some(e=>e.field===t)){const t=new Set(r.columns.map(e=>e.field));for(let r=e.length-1;r>=0;r--)if(t.has(e[r]))return e[r]}}return null}#n(e,r){const t=e.columns.map(e=>r.indexOf(e.field)).filter(e=>-1!==e).sort((e,r)=>e-r);return t.length<=1||t.length===t[t.length-1]-t[0]+1}#s(e){const r=this.gridElement?.querySelector(`.header-row [part~="header-cell"][data-field="${e}"]`);r&&(r.style.setProperty("--_flash-color","var(--tbw-color-error)"),r.animate([{backgroundColor:"rgba(from var(--_flash-color) r g b / 30%)"},{backgroundColor:"transparent"}],{duration:400,easing:"ease-out"}))}handleQuery(e){if("getColumnGrouping"===e.type)return this.#u()}#u(){let e;if(this.#t.length>0)e=this.#t.filter(e=>e.children.length>0).map(e=>({id:e.id,label:e.header,fields:[...e.children]}));else if(this.isActive&&this.groups.length>0){e=this.groups.filter(e=>!e.id.startsWith("__implicit__")).map(e=>({id:e.id,label:e.label??e.id,fields:e.columns.map(e=>e.field)}));const r=this.columns;for(const t of r)if(t.hidden&&t.group){const r="string"==typeof t.group?t.group:t.group.id,o="string"==typeof t.group?t.group:t.group.label??t.group.id,i=e.find(e=>e.id===r);i?i.fields.includes(t.field)||i.fields.push(t.field):e.push({id:r,label:o,fields:[t.field]})}}else{const r=this.columns,t=/* @__PURE__ */new Map;for(const e of r){if(!e.group)continue;const r="string"==typeof e.group?e.group:e.group.id,o="string"==typeof e.group?e.group:e.group.label??e.group.id,i=t.get(r);i?i.fields.includes(e.field)||i.fields.push(e.field):t.set(r,{id:r,label:o,fields:[e.field]})}e=Array.from(t.values())}const r=this.grid?.getColumnOrder();if(r&&r.length>0){const t=new Map(r.map((e,r)=>[e,r]));for(const r of e)r.fields.sort((e,r)=>(t.get(e)??1/0)-(t.get(r)??1/0))}return e}static detect(e,r){const t=r?.features?.groupingColumns;if(t&&"object"==typeof t&&Array.isArray(t.columnGroups)&&t.columnGroups.length>0)return!0;if(r?.columnGroups&&Array.isArray(r.columnGroups)&&r.columnGroups.length>0)return!0;const o=r?.columns;return!!Array.isArray(o)&&function(e){return e.some(e=>null!=e.group)}(o)}processColumns(e){const o=this.config?.columnGroups,i=this.grid?.gridConfig?.columnGroups;let n,s;if(o&&Array.isArray(o)&&o.length>0?(i&&Array.isArray(i)&&i.length>0&&console.warn("[tbw-grid] columnGroups defined in both gridConfig and groupingColumns feature config. Using feature config (higher precedence)."),n=o):i&&Array.isArray(i)&&i.length>0&&(n=i),n&&n.length>0){const t=r(n);this.#t=t,this.#o.clear();for(const e of t)e.renderer&&this.#o.set(e.id,e.renderer);const o=/* @__PURE__ */new Map;for(const e of t)for(const r of e.children)o.set(r,{id:e.id,label:e.header});s=e.map(e=>{const r=o.get(e.field);return r&&!e.group?{...e,group:r}:e})}else this.#t=[],this.#o.clear(),s=[...e];const l=t(s);if(0===l.length)return this.isActive=!1,this.groups=[],s;if(this.#o.size>0)for(const r of l){const e=this.#o.get(r.id);e&&(r.renderer=e)}this.isActive=!0,this.groups=l,this.#r.clear();for(const r of l){const e=r.columns[r.columns.length-1];e?.field&&this.#r.add(e.field)}return s}afterRender(){if(!this.isActive){const e=this.gridElement?.querySelector(".header"),r=e?.querySelector(".header-group-row");return void(r&&r.remove())}const e=this.gridElement?.querySelector(".header");if(!e)return;const r=e.querySelector(".header-group-row");r&&r.remove();const n=this.visibleColumns,s=t(n);if(0===s.length)return;if(this.#o.size>0)for(const t of s){const e=this.#o.get(t.id);e&&(t.renderer=e)}this.#r.clear();const l=i(s,n);for(let t=0;t<s.length;t++){const e=s[t];if(String(e.id).startsWith("__implicit__")&&l.has(String(e.id)))continue;const r=e.columns[e.columns.length-1];r?.field&&t<s.length-1&&this.#r.add(r.field)}const d=function(e,r,t){if(0===e.length)return null;const n=document.createElement("div");n.className="header-group-row",n.setAttribute("role","row");const s=i(e,r);for(const i of e){const e=String(i.id),l=e.startsWith("__implicit__");if(l&&s.has(e))continue;const d=o(i,r);if(!d)continue;const[u,c]=d,g=c-u+1,a=l?"":i.label||i.id,h=document.createElement("div");h.className="cell header-group-cell",l&&h.classList.add("implicit-group"),h.setAttribute("data-group",e),h.style.gridColumn=`${u+1} / span ${g}`;const p=!l&&(i.renderer||t)||void 0;if(p&&!l){const r=p({id:e,label:String(a),columns:i.columns,firstIndex:u,isImplicit:!1});r instanceof HTMLElement?h.appendChild(r):"string"==typeof r?h.innerHTML=r:h.textContent=a}else h.textContent=a;n.appendChild(h)}return n}(s,n,this.config.groupHeaderRenderer);if(d){d.classList.toggle("no-borders",!this.config.showGroupBorders);const r=e.querySelector(".header-row");r?e.insertBefore(d,r):e.appendChild(d)}const u=e.querySelector(".header-row");u&&(u.classList.toggle("no-group-borders",!this.config.showGroupBorders),function(e,r,t){if(!r.length||!e)return;const o=i(r,t),n=/* @__PURE__ */new Map;for(const i of r)if(!String(i.id).startsWith("__implicit__")||!o.has(String(i.id)))for(const e of i.columns)e.field&&n.set(e.field,i.id);const s=Array.from(e.querySelectorAll(".cell[data-field]"));s.forEach(e=>{const r=e.getAttribute("data-field")||"",t=n.get(r);t&&(e.classList.add("grouped"),e.getAttribute("data-group")||e.setAttribute("data-group",t))});for(const i of r){if(String(i.id).startsWith("__implicit__")&&o.has(String(i.id)))continue;const e=i.columns[i.columns.length-1],r=s.find(r=>r.getAttribute("data-field")===e.field);r&&r.classList.add("group-end")}}(u,s,n))}afterCellRender(e){this.isActive&&this.config.showGroupBorders&&e.cellElement.classList.toggle("group-end",this.#r.has(e.column.field))}isGroupingActive(){return this.isActive}getGroups(){return this.groups}getGroupColumns(e){const r=this.groups.find(r=>r.id===e);return r?r.columns:[]}refresh(){this.requestRender()}}export{d as GroupingColumnsPlugin,r as resolveColumnGroupDefs,e as slugifyHeader};
2
2
  //# sourceMappingURL=index.js.map