@toolbox-web/grid 2.0.0-rc.1 → 2.0.0-rc.2

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.
Files changed (95) hide show
  1. package/README.md +23 -6
  2. package/all.js +2 -2
  3. package/all.js.map +1 -1
  4. package/index.js +1 -1
  5. package/index.js.map +1 -1
  6. package/lib/core/internal/sorting.d.ts +4 -0
  7. package/lib/core/plugin/base-plugin.d.ts +31 -0
  8. package/lib/core/plugin/plugin-manager.d.ts +4 -1
  9. package/lib/core/plugin/types.d.ts +2 -0
  10. package/lib/core/types.d.ts +20 -1
  11. package/lib/plugins/clipboard/ClipboardPlugin.d.ts +8 -1
  12. package/lib/plugins/clipboard/index.js +1 -1
  13. package/lib/plugins/clipboard/index.js.map +1 -1
  14. package/lib/plugins/column-virtualization/index.js +1 -1
  15. package/lib/plugins/column-virtualization/index.js.map +1 -1
  16. package/lib/plugins/context-menu/index.js +1 -1
  17. package/lib/plugins/context-menu/index.js.map +1 -1
  18. package/lib/plugins/editing/index.js +1 -1
  19. package/lib/plugins/editing/index.js.map +1 -1
  20. package/lib/plugins/export/ExportPlugin.d.ts +8 -1
  21. package/lib/plugins/export/index.js +1 -1
  22. package/lib/plugins/export/index.js.map +1 -1
  23. package/lib/plugins/filtering/index.js +1 -1
  24. package/lib/plugins/filtering/index.js.map +1 -1
  25. package/lib/plugins/grouping-columns/index.js +1 -1
  26. package/lib/plugins/grouping-columns/index.js.map +1 -1
  27. package/lib/plugins/grouping-rows/GroupingRowsPlugin.d.ts +33 -1
  28. package/lib/plugins/grouping-rows/grouping-rows.d.ts +15 -1
  29. package/lib/plugins/grouping-rows/index.js +2 -2
  30. package/lib/plugins/grouping-rows/index.js.map +1 -1
  31. package/lib/plugins/master-detail/index.js +1 -1
  32. package/lib/plugins/master-detail/index.js.map +1 -1
  33. package/lib/plugins/multi-sort/index.js +1 -1
  34. package/lib/plugins/multi-sort/index.js.map +1 -1
  35. package/lib/plugins/pinned-columns/index.js +1 -1
  36. package/lib/plugins/pinned-columns/index.js.map +1 -1
  37. package/lib/plugins/pinned-rows/index.js +1 -1
  38. package/lib/plugins/pinned-rows/index.js.map +1 -1
  39. package/lib/plugins/pivot/PivotPlugin.d.ts +10 -0
  40. package/lib/plugins/pivot/index.js +1 -1
  41. package/lib/plugins/pivot/index.js.map +1 -1
  42. package/lib/plugins/print/index.js +1 -1
  43. package/lib/plugins/print/index.js.map +1 -1
  44. package/lib/plugins/reorder-columns/index.js +1 -1
  45. package/lib/plugins/reorder-columns/index.js.map +1 -1
  46. package/lib/plugins/reorder-rows/RowReorderPlugin.d.ts +3 -0
  47. package/lib/plugins/reorder-rows/index.js +1 -1
  48. package/lib/plugins/reorder-rows/index.js.map +1 -1
  49. package/lib/plugins/responsive/index.js +1 -1
  50. package/lib/plugins/responsive/index.js.map +1 -1
  51. package/lib/plugins/selection/index.js +1 -1
  52. package/lib/plugins/selection/index.js.map +1 -1
  53. package/lib/plugins/server-side/index.js +1 -1
  54. package/lib/plugins/server-side/index.js.map +1 -1
  55. package/lib/plugins/tooltip/index.js +1 -1
  56. package/lib/plugins/tooltip/index.js.map +1 -1
  57. package/lib/plugins/tree/TreePlugin.d.ts +16 -0
  58. package/lib/plugins/tree/index.js +1 -1
  59. package/lib/plugins/tree/index.js.map +1 -1
  60. package/lib/plugins/tree/types.d.ts +6 -0
  61. package/lib/plugins/undo-redo/index.js +1 -1
  62. package/lib/plugins/undo-redo/index.js.map +1 -1
  63. package/lib/plugins/visibility/index.js +1 -1
  64. package/lib/plugins/visibility/index.js.map +1 -1
  65. package/package.json +1 -1
  66. package/umd/grid.all.umd.js +1 -1
  67. package/umd/grid.all.umd.js.map +1 -1
  68. package/umd/grid.umd.js +1 -1
  69. package/umd/grid.umd.js.map +1 -1
  70. package/umd/plugins/clipboard.umd.js +1 -1
  71. package/umd/plugins/clipboard.umd.js.map +1 -1
  72. package/umd/plugins/context-menu.umd.js +1 -1
  73. package/umd/plugins/context-menu.umd.js.map +1 -1
  74. package/umd/plugins/editing.umd.js +1 -1
  75. package/umd/plugins/editing.umd.js.map +1 -1
  76. package/umd/plugins/export.umd.js +1 -1
  77. package/umd/plugins/export.umd.js.map +1 -1
  78. package/umd/plugins/grouping-rows.umd.js +1 -1
  79. package/umd/plugins/grouping-rows.umd.js.map +1 -1
  80. package/umd/plugins/multi-sort.umd.js +1 -1
  81. package/umd/plugins/multi-sort.umd.js.map +1 -1
  82. package/umd/plugins/pinned-columns.umd.js +1 -1
  83. package/umd/plugins/pinned-columns.umd.js.map +1 -1
  84. package/umd/plugins/pivot.umd.js +1 -1
  85. package/umd/plugins/pivot.umd.js.map +1 -1
  86. package/umd/plugins/reorder-rows.umd.js +1 -1
  87. package/umd/plugins/reorder-rows.umd.js.map +1 -1
  88. package/umd/plugins/selection.umd.js +1 -1
  89. package/umd/plugins/selection.umd.js.map +1 -1
  90. package/umd/plugins/server-side.umd.js +1 -1
  91. package/umd/plugins/server-side.umd.js.map +1 -1
  92. package/umd/plugins/tooltip.umd.js +1 -1
  93. package/umd/plugins/tooltip.umd.js.map +1 -1
  94. package/umd/plugins/tree.umd.js +1 -1
  95. package/umd/plugins/tree.umd.js.map +1 -1
@@ -66,6 +66,16 @@ import { FlattenedTreeRow, TreeConfig, TreeRow } from './types';
66
66
  */
67
67
  export declare class TreePlugin extends BaseGridPlugin<TreeConfig> {
68
68
  static readonly manifest: PluginManifest;
69
+ /**
70
+ * Optional dependency on MultiSort for coordinated sorting.
71
+ * When MultiSort is loaded, Tree defers header click sorting to it and queries the
72
+ * sort model in processRows. When MultiSort is absent, Tree uses its own sort state.
73
+ */
74
+ static readonly dependencies: {
75
+ name: string;
76
+ required: boolean;
77
+ reason: string;
78
+ }[];
69
79
  /** @internal */
70
80
  readonly name = "tree";
71
81
  /** @internal */
@@ -98,6 +108,12 @@ export declare class TreePlugin extends BaseGridPlugin<TreeConfig> {
98
108
  private withStableKeys;
99
109
  /** Flatten tree using stable keys */
100
110
  private flattenTree;
111
+ /**
112
+ * Resolve the effective sort state: prefer MultiSort's model when available,
113
+ * fall back to local tree sort state.
114
+ * This follows the same pattern as GroupingRowsPlugin.resolveGroupSortDirections.
115
+ */
116
+ private resolveEffectiveSortState;
101
117
  /** Sort tree recursively, keeping children with parents */
102
118
  private sortTree;
103
119
  /** @internal */
@@ -1,2 +1,2 @@
1
- const e="expanded",t="tree-toggle";function n(e,t){return`[tbw-grid${e?`#${e}`:""}${t?`:${t}`:""}]`}function r(e,t,r,i){return`${n(r,i)} ${e}: ${t}\n\n → More info: ${function(e){return`https://toolboxjs.com/grid/errors#${e.toLowerCase()}`}(e)}`}["__otorp__","__retteGenifed__","__retteSenifed__","rotcurtsnoc","wodniw","sihTlabolg","labolg","ssecorp","noitcnuF","tropmi","lave","tcelfeR","yxorP","rorrE","stnemugra","tnemucod","noitacol","eikooc","egarotSlacol","egarotSnoisses","BDdexedni","hctef","tseuqeRpttHLMX","tekcoSbeW","rekroW","rekroWderahS","rekroWecivreS","renepo","tnerap","pot","semarf","fles"].map(e=>e.split("").reverse().join(""));const i=/* @__PURE__ */new Set(["script","iframe","object","embed","form","input","button","textarea","select","link","meta","base","style","template","slot","portal","frame","frameset","applet","noscript","noembed","plaintext","xmp","listing"]),s=/^on\w+$/i,a=/* @__PURE__ */new Set(["href","src","action","formaction","data","srcdoc","xlink:href","poster","srcset"]),o=/^\s*(javascript|vbscript|data|blob):/i;function d(e){if(!e||"string"!=typeof e)return"";if(-1===e.indexOf("<"))return e;const t=document.createElement("template");return t.innerHTML=e,function(e){const t=[],n=e.querySelectorAll("*");for(const r of n){const e=r.tagName.toLowerCase();if(i.has(e)){t.push(r);continue}if("svg"===e||"http://www.w3.org/2000/svg"===r.namespaceURI){if(Array.from(r.attributes).some(e=>s.test(e.name)||"href"===e.name||"xlink:href"===e.name)){t.push(r);continue}}const n=[];for(const t of r.attributes){const e=t.name.toLowerCase();s.test(e)?n.push(t.name):(a.has(e)&&o.test(t.value)||"style"===e&&/expression\s*\(|javascript:|behavior\s*:/i.test(t.value))&&n.push(t.name)}n.forEach(e=>r.removeAttribute(e))}t.forEach(e=>e.remove())}(t.content),t.innerHTML}const l='<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>',c={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:l,filterActive:l,print:"🖨️"};class h{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 n=new CustomEvent(e,{detail:t,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(n),n.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{...c,...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(),n=parseInt(t,10);if(!isNaN(n))return n}return 200}setIcon(e,t,n){e.dataset.icon=t.replace(/([A-Z])/g,"-$1").toLowerCase(),"collapse"===t?e.dataset.expanded="":"expand"===t&&delete e.dataset.expanded;const r=this.#t(t,n);void 0!==r?"string"==typeof r?e.innerHTML=d(r):r instanceof HTMLElement&&(e.innerHTML="",e.appendChild(r.cloneNode(!0))):e.innerHTML=""}#t(e,t){return void 0!==t?t:this.grid?.gridConfig?.icons?.[e]}updateSortIndicator(e,t){e.querySelector('[part~="sort-indicator"], .sort-indicator')?.remove();const n=document.createElement("span");n.setAttribute("part","sort-indicator"),n.className="sort-indicator",t?(e.setAttribute("aria-sort","asc"===t?"ascending":"descending"),e.setAttribute("data-sort",t),this.setIcon(n,"asc"===t?"sortAsc":"sortDesc")):(e.setAttribute("aria-sort","none"),e.removeAttribute("data-sort"),this.setIcon(n,"sortNone"));const r=e.querySelector(".tbw-filter-btn")??e.querySelector(".resize-handle");return r?e.insertBefore(n,r):e.appendChild(n),n}warn(e,t){void 0!==t?console.warn(r(e,t,this.gridElement.id,this.name)):console.warn(`${n(this.gridElement.id,this.name)} ${e}`)}throwDiagnostic(e,t){throw new Error(r(e,t,this.gridElement.id,this.name))}}function u(e,t,n){return void 0!==e.id?String(e.id):n?`${n}-${t}`:String(t)}function g(e,t){const n=new Set(e);return n.has(t)?n.delete(t):n.add(t),n}function p(e,t,n=null,r=0){const i=t.childrenField??"children",s=/* @__PURE__ */new Set;for(let a=0;a<e.length;a++){const o=e[a],d=u(o,a,n),l=o[i];if(Array.isArray(l)&&l.length>0){s.add(d);const e=p(l,t,d,r+1);for(const t of e)s.add(t)}}return s}function f(e,t,n,r=null,i=0){const s=n.childrenField??"children";for(let a=0;a<e.length;a++){const o=e[a],d=u(o,a,r);if(d===t)return[d];const l=o[s];if(Array.isArray(l)&&l.length>0){const e=f(l,t,n,d,i+1);if(e)return[d,...e]}}return null}function w(e,t,n,r){const i=f(e,t,n);if(!i)return r;const s=new Set(r);for(let a=0;a<i.length-1;a++)s.add(i[a]);return s}function y(e,t="children"){if(!Array.isArray(e)||0===e.length)return!1;for(const n of e){if(!n)continue;const e=n[t];if(Array.isArray(e)&&e.length>0)return!0}return!1}class m extends h{static manifest={incompatibleWith:[{name:"groupingRows",reason:"Both plugins transform the entire row model. TreePlugin flattens nested hierarchies while GroupingRowsPlugin groups flat rows with synthetic headers. Use one approach per grid."},{name:"pivot",reason:"PivotPlugin replaces the entire row and column structure with aggregated pivot data. Tree hierarchy cannot coexist with pivot aggregation."},{name:"serverSide",reason:"TreePlugin requires the full hierarchy to flatten and manage expansion state. ServerSidePlugin lazy-loads rows in blocks and cannot provide nested children on demand."}],events:[{type:"tree-state-change",description:"Emitted when tree expansion state changes (toggle, expand all, collapse all)"}],queries:[{type:"canMoveRow",description:"Returns false for rows with children (parent nodes cannot be reordered)"}]};name="tree";styles="@layer tbw-plugins{tbw-grid .cell[data-field=__tbw_expander]{border-inline-end:none!important;padding:0;display:flex;align-items:center;justify-content:flex-start}tbw-grid .header-row .cell[data-field=__tbw_expander]{display:none}tbw-grid .header-row .cell[data-field=__tbw_expander]+.cell{grid-column:1 / 3}tbw-grid .tree-cell-wrapper{display:inline-flex;align-items:center;padding-inline-start:calc(var(--tbw-tree-depth, 0) * var(--tbw-tree-indent-width, var(--tbw-tree-toggle-size, 1.25em)))}tbw-grid .tree-expander{display:flex;align-items:center;justify-content:flex-start;width:100%;height:100%;box-sizing:border-box}tbw-grid .tree-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;width:var(--tbw-tree-toggle-size, 1.25em);height:var(--tbw-tree-toggle-size, 1.25em);flex-shrink:0}tbw-grid .tree-toggle:hover{color:var(--tbw-tree-accent, var(--tbw-color-accent))}tbw-grid .tree-spacer{width:var(--tbw-tree-toggle-size, 1.25em);display:inline-block;flex-shrink:0}tbw-grid .data-grid-row.tbw-tree-slide-in{animation:tbw-tree-slide-in var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}tbw-grid .data-grid-row.tbw-tree-fade-in{animation:tbw-tree-fade-in var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}@keyframes tbw-tree-slide-in{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}@keyframes tbw-tree-fade-in{0%{opacity:0}to{opacity:1}}}";get defaultConfig(){return{childrenField:"children",autoDetect:!0,defaultExpanded:!1,indentWidth:20,showExpandIcons:!0,animation:"slide"}}expandedKeys=/* @__PURE__ */new Set;initialExpansionDone=!1;flattenedRows=[];rowKeyMap=/* @__PURE__ */new Map;previousVisibleKeys=/* @__PURE__ */new Set;keysToAnimate=/* @__PURE__ */new Set;sortState=null;detach(){this.expandedKeys.clear(),this.initialExpansionDone=!1,this.flattenedRows=[],this.rowKeyMap.clear(),this.previousVisibleKeys.clear(),this.keysToAnimate.clear(),this.sortState=null}handleQuery(e){if("canMoveRow"===e.type){const t=e.context,n=this.config.childrenField??"children",r=t?.[n];if(Array.isArray(r)&&r.length>0)return!1}}get animationStyle(){return!!this.isAnimationEnabled&&(this.config.animation??"slide")}detect(e){if(!this.config.autoDetect)return!1;const t=e,n=this.config.childrenField??function(e){if(!Array.isArray(e)||0===e.length)return null;const t=["children","items","nodes","subRows","nested"];for(const n of e)if(n&&"object"==typeof n)for(const e of t){const t=n[e];if(Array.isArray(t)&&t.length>0)return e}return null}(t)??"children";return y(t,n)}processRows(e){const t=e;if(!y(t,this.config.childrenField??"children"))return this.flattenedRows=[],this.rowKeyMap.clear(),this.previousVisibleKeys.clear(),[...e];let n=this.withStableKeys(t);this.sortState&&(n=this.sortTree(n,this.sortState.field,this.sortState.direction)),this.config.defaultExpanded&&!this.initialExpansionDone&&(this.expandedKeys=p(n,this.config),this.initialExpansionDone=!0),this.flattenedRows=this.flattenTree(n,this.expandedKeys),this.rowKeyMap.clear(),this.keysToAnimate.clear();const r=/* @__PURE__ */new Set;for(const i of this.flattenedRows)this.rowKeyMap.set(i.key,i),r.add(i.key),!this.previousVisibleKeys.has(i.key)&&i.depth>0&&this.keysToAnimate.add(i.key);return this.previousVisibleKeys=r,this.flattenedRows.map(e=>({...e.data,__treeKey:e.key,__treeDepth:e.depth,__treeHasChildren:e.hasChildren,__treeExpanded:e.isExpanded}))}withStableKeys(e,t=null){const n=this.config.childrenField??"children";return e.map((e,r)=>{const i=e.__stableKey,s=void 0!==e.id?String(e.id):i??(t?`${t}-${r}`:String(r)),a=e[n],o=Array.isArray(a)&&a.length>0;return{...e,__stableKey:s,...o?{[n]:this.withStableKeys(a,s)}:{}}})}flattenTree(e,t,n=0){const r=this.config.childrenField??"children",i=[];for(const s of e){const e=s.__stableKey??String(s.id??"?"),a=s[r],o=Array.isArray(a)&&a.length>0,d=t.has(e);i.push({key:e,data:s,depth:n,hasChildren:o,isExpanded:d,parentKey:n>0&&e.substring(0,e.lastIndexOf("-"))||null}),o&&d&&i.push(...this.flattenTree(a,t,n+1))}return i}sortTree(e,t,n){const r=this.config.childrenField??"children";return[...e].sort((e,r)=>{const i=e[t],s=r[t];return null==i&&null==s?0:null==i?-1:null==s?1:i>s?n:i<s?-n:0}).map(e=>{const i=e[r];return Array.isArray(i)&&i.length>0?{...e,[r]:this.sortTree(i,t,n)}:e})}processColumns(n){if(0===this.flattenedRows.length)return[...n];const r=[...n];if(0===r.length)return r;const i=r[0],s=i.viewRenderer,a=()=>this.config,o=this.setIcon.bind(this);return r[0]={...i,viewRenderer:n=>{const{row:r,value:i}=n,{showExpandIcons:d=!0,indentWidth:l}=a(),c=r,h=c.__treeDepth??0,u=document.createElement("span");if(u.className="tree-cell-wrapper",u.style.setProperty("--tbw-tree-depth",String(h)),void 0!==l&&u.style.setProperty("--tbw-tree-indent-width",`${l}px`),d)if(c.__treeHasChildren){const n=document.createElement("span");n.className=`${t}${c.__treeExpanded?` ${e}`:""}`,o(n,c.__treeExpanded?"collapse":"expand"),n.setAttribute("data-tree-key",String(c.__treeKey??"")),u.appendChild(n)}else{const e=document.createElement("span");e.className="tree-spacer",u.appendChild(e)}const g=document.createElement("span");if(g.className="tree-content",s){const e=s(n);e instanceof Node?g.appendChild(e):"string"==typeof e&&(g.innerHTML=e)}else g.textContent=null!=i?String(i):"";return u.appendChild(g),u}},r}onCellClick(e){const n=e.originalEvent?.target;if(!n?.classList.contains(t))return!1;const r=n.getAttribute("data-tree-key");if(!r)return!1;const i=this.rowKeyMap.get(r);return!!i&&(this.expandedKeys=g(this.expandedKeys,r),this.emit("tree-expand",{key:r,row:i.data,expanded:this.expandedKeys.has(r),depth:i.depth}),this.requestRender(),!0)}onKeyDown(e){if(" "!==e.key)return;const t=this.grid._focusRow,n=this.flattenedRows[t];return n?.hasChildren?(e.preventDefault(),this.expandedKeys=g(this.expandedKeys,n.key),this.emit("tree-expand",{key:n.key,row:n.data,expanded:this.expandedKeys.has(n.key),depth:n.depth}),this.requestRenderWithFocus(),!0):void 0}onHeaderClick(e){if(0===this.flattenedRows.length||!e.column.sortable)return!1;const{field:t}=e.column;this.sortState&&this.sortState.field===t?1===this.sortState.direction?this.sortState={field:t,direction:-1}:this.sortState=null:this.sortState={field:t,direction:1};const n=this.grid;return void 0!==n._sortState&&(n._sortState=this.sortState?{...this.sortState}:null),this.emit("sort-change",{field:t,direction:this.sortState?.direction??0}),this.requestRender(),!0}afterRender(){const e=this.gridElement?.querySelector(".rows");if(!e)return;const t=this.animationStyle,n=!1!==t&&this.keysToAnimate.size>0,r="fade"===t?"tbw-tree-fade-in":"tbw-tree-slide-in";for(const i of e.querySelectorAll(".data-grid-row")){const e=i.querySelector(".cell[data-row]"),t=e?parseInt(e.getAttribute("data-row")??"-1",10):-1,s=this.flattenedRows[t];s?.hasChildren&&i.setAttribute("aria-expanded",String(s.isExpanded)),n&&s?.key&&this.keysToAnimate.has(s.key)&&(i.classList.add(r),i.addEventListener("animationend",()=>i.classList.remove(r),{once:!0}))}this.keysToAnimate.clear()}expand(e){this.expandedKeys.add(e),this.requestRender()}collapse(e){this.expandedKeys.delete(e),this.requestRender()}toggle(e){this.expandedKeys=g(this.expandedKeys,e),this.emitPluginEvent("tree-state-change",{expandedKeys:[...this.expandedKeys]}),this.requestRender()}expandAll(){this.expandedKeys=p(this.rows,this.config),this.emitPluginEvent("tree-state-change",{expandedKeys:[...this.expandedKeys]}),this.requestRender()}collapseAll(){this.expandedKeys=/* @__PURE__ */new Set,this.emitPluginEvent("tree-state-change",{expandedKeys:[...this.expandedKeys]}),this.requestRender()}isExpanded(e){return this.expandedKeys.has(e)}getExpandedKeys(){return[...this.expandedKeys]}getFlattenedRows(){return[...this.flattenedRows]}getRowByKey(e){return this.rowKeyMap.get(e)?.data}expandToKey(e){this.expandedKeys=w(this.rows,e,this.config,this.expandedKeys),this.requestRender()}}export{m as TreePlugin};
1
+ const e="expanded",t="tree-toggle";function r(e,t){return`[tbw-grid${e?`#${e}`:""}${t?`:${t}`:""}]`}function n(e,t,n,i){return`${r(n,i)} ${e}: ${t}\n\n → More info: ${function(e){return`https://toolboxjs.com/grid/errors#${e.toLowerCase()}`}(e)}`}["__otorp__","__retteGenifed__","__retteSenifed__","rotcurtsnoc","wodniw","sihTlabolg","labolg","ssecorp","noitcnuF","tropmi","lave","tcelfeR","yxorP","rorrE","stnemugra","tnemucod","noitacol","eikooc","egarotSlacol","egarotSnoisses","BDdexedni","hctef","tseuqeRpttHLMX","tekcoSbeW","rekroW","rekroWderahS","rekroWecivreS","renepo","tnerap","pot","semarf","fles"].map(e=>e.split("").reverse().join(""));const i=/* @__PURE__ */new Set(["script","iframe","object","embed","form","input","button","textarea","select","link","meta","base","style","template","slot","portal","frame","frameset","applet","noscript","noembed","plaintext","xmp","listing"]),s=/^on\w+$/i,o=/* @__PURE__ */new Set(["href","src","action","formaction","data","srcdoc","xlink:href","poster","srcset"]),a=/^\s*(javascript|vbscript|data|blob):/i;function d(e){if(!e||"string"!=typeof e)return"";if(-1===e.indexOf("<"))return e;const t=document.createElement("template");return t.innerHTML=e,function(e){const t=[],r=e.querySelectorAll("*");for(const n of r){const e=n.tagName.toLowerCase();if(i.has(e)){t.push(n);continue}if("svg"===e||"http://www.w3.org/2000/svg"===n.namespaceURI){if(Array.from(n.attributes).some(e=>s.test(e.name)||"href"===e.name||"xlink:href"===e.name)){t.push(n);continue}}const r=[];for(const t of n.attributes){const e=t.name.toLowerCase();s.test(e)?r.push(t.name):(o.has(e)&&a.test(t.value)||"style"===e&&/expression\s*\(|javascript:|behavior\s*:/i.test(t.value))&&r.push(t.name)}r.forEach(e=>n.removeAttribute(e))}t.forEach(e=>e.remove())}(t.content),t.innerHTML}const l='<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>',c={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:l,filterActive:l,print:"🖨️"};class h{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)}broadcast(e,t){this.emitPluginEvent(e,t),this.emit(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{...c,...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}setIcon(e,t,r){e.dataset.icon=t.replace(/([A-Z])/g,"-$1").toLowerCase(),"collapse"===t?e.dataset.expanded="":"expand"===t&&delete e.dataset.expanded;const n=this.#t(t,r);void 0!==n?"string"==typeof n?e.innerHTML=d(n):n instanceof HTMLElement&&(e.innerHTML="",e.appendChild(n.cloneNode(!0))):e.innerHTML=""}#t(e,t){return void 0!==t?t:this.grid?.gridConfig?.icons?.[e]}updateSortIndicator(e,t){e.querySelector('[part~="sort-indicator"], .sort-indicator')?.remove();const r=document.createElement("span");r.setAttribute("part","sort-indicator"),r.className="sort-indicator",t?(e.setAttribute("aria-sort","asc"===t?"ascending":"descending"),e.setAttribute("data-sort",t),this.setIcon(r,"asc"===t?"sortAsc":"sortDesc")):(e.setAttribute("aria-sort","none"),e.removeAttribute("data-sort"),this.setIcon(r,"sortNone"));const n=e.querySelector(".tbw-filter-btn")??e.querySelector(".resize-handle");return n?e.insertBefore(r,n):e.appendChild(r),r}warn(e,t){void 0!==t?console.warn(n(e,t,this.gridElement.id,this.name)):console.warn(`${r(this.gridElement.id,this.name)} ${e}`)}throwDiagnostic(e,t){throw new Error(n(e,t,this.gridElement.id,this.name))}}function u(e,t,r){return void 0!==e.id?String(e.id):r?`${r}-${t}`:String(t)}function g(e,t){const r=new Set(e);return r.has(t)?r.delete(t):r.add(t),r}function p(e,t,r=null,n=0){const i=t.childrenField??"children",s=/* @__PURE__ */new Set;for(let o=0;o<e.length;o++){const a=e[o],d=u(a,o,r),l=a[i];if(Array.isArray(l)&&l.length>0){s.add(d);const e=p(l,t,d,n+1);for(const t of e)s.add(t)}}return s}function f(e,t,r,n=null,i=0){const s=r.childrenField??"children";for(let o=0;o<e.length;o++){const a=e[o],d=u(a,o,n);if(d===t)return[d];const l=a[s];if(Array.isArray(l)&&l.length>0){const e=f(l,t,r,d,i+1);if(e)return[d,...e]}}return null}function y(e,t,r,n){const i=f(e,t,r);if(!i)return n;const s=new Set(n);for(let o=0;o<i.length-1;o++)s.add(i[o]);return s}function m(e,t="children"){if(!Array.isArray(e)||0===e.length)return!1;for(const r of e){if(!r)continue;const e=r[t];if(Array.isArray(e)&&e.length>0)return!0}return!1}class w extends h{static manifest={modifiesRowStructure:!0,incompatibleWith:[{name:"groupingRows",reason:"Both plugins transform the entire row model. TreePlugin flattens nested hierarchies while GroupingRowsPlugin groups flat rows with synthetic headers. Use one approach per grid."},{name:"pivot",reason:"PivotPlugin replaces the entire row and column structure with aggregated pivot data. Tree hierarchy cannot coexist with pivot aggregation."},{name:"serverSide",reason:"TreePlugin requires the full hierarchy to flatten and manage expansion state. ServerSidePlugin lazy-loads rows in blocks and cannot provide nested children on demand."}],events:[{type:"tree-state-change",description:"Emitted when tree expansion state changes (toggle, expand all, collapse all)"}],queries:[{type:"canMoveRow",description:"Returns false for rows with children (parent nodes cannot be reordered)"}]};static dependencies=[{name:"multiSort",required:!1,reason:"Queries sort model for coordinated tree sorting"}];name="tree";styles="@layer tbw-plugins{tbw-grid .cell[data-field=__tbw_expander]{border-inline-end:none!important;padding:0;display:flex;align-items:center;justify-content:flex-start}tbw-grid .header-row .cell[data-field=__tbw_expander]{display:none}tbw-grid .header-row .cell[data-field=__tbw_expander]+.cell{grid-column:1 / 3}tbw-grid .tree-cell-wrapper{display:inline-flex;align-items:center;overflow:visible;padding-inline-start:calc(var(--tbw-tree-depth, 0) * var(--tbw-tree-indent-width, var(--tbw-tree-toggle-size, 1.25em)))}tbw-grid .tree-expander{display:flex;align-items:center;justify-content:flex-start;width:100%;height:100%;box-sizing:border-box}tbw-grid .tree-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;width:var(--tbw-tree-toggle-size, 1.25em);height:var(--tbw-tree-toggle-size, 1.25em);flex-shrink:0}tbw-grid .tree-toggle:hover{color:var(--tbw-tree-accent, var(--tbw-color-accent))}tbw-grid .tree-spacer{width:var(--tbw-tree-toggle-size, 1.25em);display:inline-block;flex-shrink:0}tbw-grid .data-grid-row.tbw-tree-slide-in{animation:tbw-tree-slide-in var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}tbw-grid .data-grid-row.tbw-tree-fade-in{animation:tbw-tree-fade-in var(--tbw-animation-duration, .2s) var(--tbw-animation-easing, ease-out) forwards}@keyframes tbw-tree-slide-in{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}@keyframes tbw-tree-fade-in{0%{opacity:0}to{opacity:1}}}";get defaultConfig(){return{childrenField:"children",autoDetect:!0,defaultExpanded:!1,indentWidth:20,showExpandIcons:!0,animation:"slide"}}expandedKeys=/* @__PURE__ */new Set;initialExpansionDone=!1;flattenedRows=[];rowKeyMap=/* @__PURE__ */new Map;previousVisibleKeys=/* @__PURE__ */new Set;keysToAnimate=/* @__PURE__ */new Set;sortState=null;detach(){this.expandedKeys.clear(),this.initialExpansionDone=!1,this.flattenedRows=[],this.rowKeyMap.clear(),this.previousVisibleKeys.clear(),this.keysToAnimate.clear(),this.sortState=null}handleQuery(e){if("canMoveRow"===e.type){const t=e.context,r=this.config.childrenField??"children",n=t?.[r];if(Array.isArray(n)&&n.length>0)return!1}}get animationStyle(){return!!this.isAnimationEnabled&&(this.config.animation??"slide")}detect(e){if(!this.config.autoDetect)return!1;const t=e,r=this.config.childrenField??function(e){if(!Array.isArray(e)||0===e.length)return null;const t=["children","items","nodes","subRows","nested"];for(const r of e)if(r&&"object"==typeof r)for(const e of t){const t=r[e];if(Array.isArray(t)&&t.length>0)return e}return null}(t)??"children";return m(t,r)}processRows(e){const t=e;if(!m(t,this.config.childrenField??"children"))return this.flattenedRows=[],this.rowKeyMap.clear(),this.previousVisibleKeys.clear(),[...e];let r=this.withStableKeys(t);const n=this.resolveEffectiveSortState();n&&(r=this.sortTree(r,n.field,n.direction)),this.config.defaultExpanded&&!this.initialExpansionDone&&(this.expandedKeys=p(r,this.config),this.initialExpansionDone=!0),this.flattenedRows=this.flattenTree(r,this.expandedKeys),this.rowKeyMap.clear(),this.keysToAnimate.clear();const i=/* @__PURE__ */new Set;for(const s of this.flattenedRows)this.rowKeyMap.set(s.key,s),i.add(s.key),!this.previousVisibleKeys.has(s.key)&&s.depth>0&&this.keysToAnimate.add(s.key);return this.previousVisibleKeys=i,this.flattenedRows.map(e=>({...e.data,__treeKey:e.key,__treeDepth:e.depth,__treeHasChildren:e.hasChildren,__treeExpanded:e.isExpanded}))}withStableKeys(e,t=null){const r=this.config.childrenField??"children";return e.map((e,n)=>{const i=e.__stableKey,s=void 0!==e.id?String(e.id):i??(t?`${t}-${n}`:String(n)),o=e[r],a=Array.isArray(o)&&o.length>0;return{...e,__stableKey:s,...a?{[r]:this.withStableKeys(o,s)}:{}}})}flattenTree(e,t,r=0){const n=this.config.childrenField??"children",i=[];for(const s of e){const e=s.__stableKey??String(s.id??"?"),o=s[n],a=Array.isArray(o)&&o.length>0,d=t.has(e);i.push({key:e,data:s,depth:r,hasChildren:a,isExpanded:d,parentKey:r>0&&e.substring(0,e.lastIndexOf("-"))||null}),a&&d&&i.push(...this.flattenTree(o,t,r+1))}return i}resolveEffectiveSortState(){const e=this.grid?.query?.("sort:get-model",null);if(Array.isArray(e)&&e.length>0){const t=e[0];if(Array.isArray(t)&&t.length>0)return{field:t[0].field,direction:"desc"===t[0].direction?-1:1}}return this.sortState}sortTree(e,t,r){const n=this.config.childrenField??"children";return[...e].sort((e,n)=>{const i=e[t],s=n[t];return null==i&&null==s?0:null==i?-1:null==s?1:i>s?r:i<s?-r:0}).map(e=>{const i=e[n];return Array.isArray(i)&&i.length>0?{...e,[n]:this.sortTree(i,t,r)}:e})}processColumns(r){if(0===this.flattenedRows.length)return[...r];const n=[...r];if(0===n.length)return n;const{treeColumn:i}=this.config;let s=0;if(i){const e=n.findIndex(e=>e.field===i);e>=0&&(s=e)}const o=n[s],a=o.viewRenderer,d=()=>this.config,l=this.setIcon.bind(this);return n[s]={...o,viewRenderer:r=>{const{row:n,value:i}=r,{showExpandIcons:s=!0,indentWidth:o}=d(),c=n,h=c.__treeDepth??0,u=document.createElement("span");if(u.className="tree-cell-wrapper",u.style.setProperty("--tbw-tree-depth",String(h)),void 0!==o&&u.style.setProperty("--tbw-tree-indent-width",`${o}px`),s)if(c.__treeHasChildren){const r=document.createElement("span");r.className=`${t}${c.__treeExpanded?` ${e}`:""}`,l(r,c.__treeExpanded?"collapse":"expand"),r.setAttribute("data-tree-key",String(c.__treeKey??"")),u.appendChild(r)}else{const e=document.createElement("span");e.className="tree-spacer",u.appendChild(e)}const g=document.createElement("span");if(g.className="tree-content",a){const e=a(r);e instanceof Node?g.appendChild(e):"string"==typeof e&&(g.innerHTML=e)}else g.textContent=null!=i?String(i):"";return u.appendChild(g),u}},n}onCellClick(e){const r=e.originalEvent?.target;if(!r?.classList.contains(t))return!1;const n=r.getAttribute("data-tree-key");if(!n)return!1;const i=this.rowKeyMap.get(n);return!!i&&(this.expandedKeys=g(this.expandedKeys,n),this.emit("tree-expand",{key:n,row:i.data,expanded:this.expandedKeys.has(n),depth:i.depth}),this.requestRender(),!0)}onKeyDown(e){if(" "!==e.key)return;const t=this.grid._focusRow,r=this.flattenedRows[t];return r?.hasChildren?(e.preventDefault(),this.expandedKeys=g(this.expandedKeys,r.key),this.emit("tree-expand",{key:r.key,row:r.data,expanded:this.expandedKeys.has(r.key),depth:r.depth}),this.requestRenderWithFocus(),!0):void 0}onHeaderClick(e){if(0===this.flattenedRows.length||!e.column.sortable)return!1;const t=this.grid?.query?.("sort:get-model",null);if(Array.isArray(t)&&t.length>0)return!1;const{field:r}=e.column;this.sortState&&this.sortState.field===r?1===this.sortState.direction?this.sortState={field:r,direction:-1}:this.sortState=null:this.sortState={field:r,direction:1};const n=this.grid;return void 0!==n._sortState&&(n._sortState=this.sortState?{...this.sortState}:null),this.broadcast("sort-change",{field:r,direction:this.sortState?.direction??0}),this.requestRender(),!0}afterRender(){const e=this.gridElement?.querySelector(".rows");if(!e)return;const t=this.animationStyle,r=!1!==t&&this.keysToAnimate.size>0,n="fade"===t?"tbw-tree-fade-in":"tbw-tree-slide-in";for(const i of e.querySelectorAll(".data-grid-row")){const e=i.querySelector(".cell[data-row]"),t=e?parseInt(e.getAttribute("data-row")??"-1",10):-1,s=this.flattenedRows[t];s?.hasChildren&&i.setAttribute("aria-expanded",String(s.isExpanded)),r&&s?.key&&this.keysToAnimate.has(s.key)&&(i.classList.add(n),i.addEventListener("animationend",()=>i.classList.remove(n),{once:!0}))}this.keysToAnimate.clear()}expand(e){this.expandedKeys.add(e),this.requestRender()}collapse(e){this.expandedKeys.delete(e),this.requestRender()}toggle(e){this.expandedKeys=g(this.expandedKeys,e),this.emitPluginEvent("tree-state-change",{expandedKeys:[...this.expandedKeys]}),this.requestRender()}expandAll(){this.expandedKeys=p(this.rows,this.config),this.emitPluginEvent("tree-state-change",{expandedKeys:[...this.expandedKeys]}),this.requestRender()}collapseAll(){this.expandedKeys=/* @__PURE__ */new Set,this.emitPluginEvent("tree-state-change",{expandedKeys:[...this.expandedKeys]}),this.requestRender()}isExpanded(e){return this.expandedKeys.has(e)}getExpandedKeys(){return[...this.expandedKeys]}getFlattenedRows(){return[...this.flattenedRows]}getRowByKey(e){return this.rowKeyMap.get(e)?.data}expandToKey(e){this.expandedKeys=y(this.rows,e,this.config,this.expandedKeys),this.requestRender()}}export{w as TreePlugin};
2
2
  //# sourceMappingURL=index.js.map