@toolbox-web/grid 3.6.0 → 3.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +1 -1
- package/all.js +1 -1
- package/all.js.map +1 -1
- package/index.js +1 -1
- package/index.js.map +1 -1
- package/lib/core/internal/empty.d.ts +14 -6
- package/lib/core/types.d.ts +4 -0
- package/lib/features/registry.js +1 -1
- package/lib/plugins/clipboard/index.js +1 -1
- package/lib/plugins/clipboard/index.js.map +1 -1
- package/lib/plugins/column-virtualization/index.js +1 -1
- package/lib/plugins/column-virtualization/index.js.map +1 -1
- package/lib/plugins/context-menu/index.js +1 -1
- package/lib/plugins/context-menu/index.js.map +1 -1
- package/lib/plugins/editing/index.js +1 -1
- package/lib/plugins/editing/index.js.map +1 -1
- package/lib/plugins/export/index.js +1 -1
- package/lib/plugins/export/index.js.map +1 -1
- package/lib/plugins/filtering/index.js +1 -1
- package/lib/plugins/filtering/index.js.map +1 -1
- package/lib/plugins/grouping-columns/index.js +1 -1
- package/lib/plugins/grouping-columns/index.js.map +1 -1
- package/lib/plugins/grouping-rows/index.js +1 -1
- package/lib/plugins/grouping-rows/index.js.map +1 -1
- package/lib/plugins/master-detail/index.js +1 -1
- package/lib/plugins/master-detail/index.js.map +1 -1
- package/lib/plugins/multi-sort/index.js +1 -1
- package/lib/plugins/multi-sort/index.js.map +1 -1
- package/lib/plugins/pinned-columns/index.js +1 -1
- package/lib/plugins/pinned-columns/index.js.map +1 -1
- package/lib/plugins/pinned-rows/index.js +1 -1
- package/lib/plugins/pinned-rows/index.js.map +1 -1
- package/lib/plugins/pivot/index.js +1 -1
- package/lib/plugins/pivot/index.js.map +1 -1
- package/lib/plugins/print/index.js +1 -1
- package/lib/plugins/print/index.js.map +1 -1
- package/lib/plugins/reorder-columns/index.js +1 -1
- package/lib/plugins/reorder-columns/index.js.map +1 -1
- package/lib/plugins/responsive/index.d.ts +1 -1
- package/lib/plugins/responsive/index.js +1 -1
- package/lib/plugins/responsive/index.js.map +1 -1
- package/lib/plugins/responsive/types.d.ts +36 -1
- package/lib/plugins/row-drag-drop/index.js +1 -1
- package/lib/plugins/row-drag-drop/index.js.map +1 -1
- package/lib/plugins/selection/index.js +1 -1
- package/lib/plugins/selection/index.js.map +1 -1
- package/lib/plugins/server-side/index.js +1 -1
- package/lib/plugins/server-side/index.js.map +1 -1
- package/lib/plugins/shell/index.js +1 -1
- package/lib/plugins/shell/index.js.map +1 -1
- package/lib/plugins/sticky-rows/index.js +1 -1
- package/lib/plugins/sticky-rows/index.js.map +1 -1
- package/lib/plugins/tooltip/index.js +1 -1
- package/lib/plugins/tooltip/index.js.map +1 -1
- package/lib/plugins/tree/index.js +1 -1
- package/lib/plugins/tree/index.js.map +1 -1
- package/lib/plugins/undo-redo/index.js +1 -1
- package/lib/plugins/undo-redo/index.js.map +1 -1
- package/lib/plugins/visibility/index.js +1 -1
- package/lib/plugins/visibility/index.js.map +1 -1
- package/package.json +3 -2
- package/themes/dg-theme-bootstrap.css +13 -4
- package/themes/dg-theme-contrast.css +3 -0
- package/themes/dg-theme-large.css +4 -0
- package/themes/dg-theme-material.css +3 -0
- package/themes/dg-theme-standard.css +12 -3
- package/themes/dg-theme-vibrant.css +10 -3
- package/umd/grid.all.umd.js +1 -1
- package/umd/grid.all.umd.js.map +1 -1
- package/umd/grid.umd.js +1 -1
- package/umd/grid.umd.js.map +1 -1
- package/umd/plugins/grouping-columns.umd.js +1 -1
- package/umd/plugins/grouping-columns.umd.js.map +1 -1
- package/umd/plugins/responsive.umd.js +1 -1
- package/umd/plugins/responsive.umd.js.map +1 -1
- package/umd/plugins/selection.umd.js +1 -1
- package/umd/plugins/selection.umd.js.map +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var e="expanded",t="tree-toggle",r="__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".split("|").map(e=>e.split("").reverse().join("")),n=(new RegExp(`__(proto|defineGetter|defineSetter)|${r.slice(3).join("|")}|this\\b`),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|math".split("|"))),i=/^on\w+$/i,s=new Set("href|src|action|formaction|data|srcdoc|xlink:href|poster|srcset".split("|")),o=/^\s*(javascript|vbscript|data|blob):/i;function a(e){const t=document.createElement("template");return e&&"string"==typeof e&&(t.innerHTML=e,function(e){const t=[],r=e.querySelectorAll("*");for(const a of r){const e=a.tagName.toLowerCase();if(n.has(e)){t.push(a);continue}if(("svg"===e||"http://www.w3.org/2000/svg"===a.namespaceURI)&&Array.from(a.attributes).some(e=>i.test(e.name)||"href"===e.name||"xlink:href"===e.name)){t.push(a);continue}const r=[];for(const t of a.attributes){const e=t.name.toLowerCase();i.test(e)?r.push(t.name):"is"!==e?(s.has(e)&&o.test(t.value)||"style"===e&&/expression\s*\(|javascript:|behavior\s*:/i.test(t.value))&&r.push(t.name):r.push(t.name)}r.forEach(e=>a.removeAttribute(e))}t.forEach(e=>e.remove())}(t.content)),t.content}function d(e,t){t&&"string"==typeof t?-1!==t.indexOf("<")||-1!==t.indexOf("&")?e.replaceChildren(a(t)):e.textContent=t:e.replaceChildren()}var l={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:"",filterActive:"",print:"🖨️"},c=/* @__PURE__ */new WeakMap;function h(e){return"__proto__"===e||"constructor"===e||"prototype"===e}var u=/* @__PURE__ */new Map;function p(e){if(-1===e.indexOf("."))return null;let t=u.get(e);return void 0===t&&(t=Object.freeze(e.split(".")),u.set(e,t)),t}function f(e,t){let r=e;for(let n=0;n<t.length;n++){if(null==r||"object"!=typeof r)return;const e=t[n];if(h(e))return;r=r[e]}return r}function g(e){const t=p(e);return null===t?h(e)?()=>{}:t=>null==t?void 0:t[e]:r=>{if(null==r)return;const n=r;return Object.prototype.hasOwnProperty.call(n,e)?n[e]:f(n,t)}}function y(e,t,r=-1){if(!t.valueAccessor)return function(e,t){if(null==e)return;const r=p(t),n=e;return null===r?h(t)?void 0:n[t]:Object.prototype.hasOwnProperty.call(n,t)?n[t]:f(n,r)}(e,t.field);if("object"!=typeof e||null===e)return t.valueAccessor({row:e,column:t,rowIndex:r});const n=e,i=t.field;let s=c.get(n);if(s){const e=s.get(i);if(void 0!==e)return e.v}else s=/* @__PURE__ */new Map,c.set(n,s);const o=t.valueAccessor({row:e,column:t,rowIndex:r});return s.set(i,{v:o}),o}function w(e,t,r){const n=[...e];return function(e,t,r,n){const i=n.find(e=>e.field===t),s=i?.sortComparator;if(s)if(i?.valueAccessor)e.sort((e,t)=>s(y(e,i),y(t,i),e,t)*r);else{const n=g(t);e.sort((e,t)=>s(n(e),n(t),e,t)*r)}else i?.valueAccessor?function(e,t,r){m(e,e=>y(e,t),r)}(e,i,r):function(e,t,r){if(function(e){return-1===e.indexOf(".")&&!h(e)}(t))return void e.sort((e,n)=>{const i=function(e,t){const r=!0===e?.__loading;return r===(!0===t?.__loading)?0:r?1:-1}(e,n);if(0!==i)return i;const s=e[t],o=n[t];return null==s&&null==o?0:null==s?-r:null==o||s>o?r:s<o?-r:0});m(e,g(t),r)}(e,t,r)}(n,t.field,t.direction,r),n}function m(e,t,r){const n=e.length;if(n<2)return;const i=new Array(n),s=new Uint8Array(n),o=new Array(n);for(let d=0;d<n;d++){const r=e[d];o[d]=d,i[d]=t(r),s[d]=!0===r?.__loading?1:0}o.sort((e,t)=>{const n=s[e];if(n!==s[t])return n?1:-1;const o=i[e],a=i[t];return null==o&&null==a?0:null==o?-r:null==a||o>a?r:o<a?-r:0});const a=new Array(n);for(let d=0;d<n;d++)a[d]=e[o[d]];for(let d=0;d<n;d++)e[d]=a[d]}function b(e,t){return`[tbw-grid${e?`#${e}`:""}${t?`:${t}`:""}]`}function v(e,t,r,n){return`${b(r,n)} ${e}: ${t}\n\n → More info: ${function(e){return`https://toolboxjs.com/grid/errors#${e.toLowerCase()}`}(e)}`}var x=class{static dependencies;static manifest;aliases;version="3.6.0";styles;cellRenderers;headerRenderers;cellEditors;grid;config;userConfig;#e;get defaultConfig(){return{}}constructor(e={}){this.userConfig=e}get resolvedConfig(){return this.#e?this.config:{...this.defaultConfig,...this.userConfig}}mergeConfigsFrom(e){if(0===e.length)return;const t={...this.userConfig},r={};for(const n of Object.keys(t))r[n]=this;for(const n of e){const e=n.userConfig;for(const[i,s]of Object.entries(e)){if(void 0===s)continue;if(!(i in t)){t[i]=s,r[i]=n;continue}if(t[i]===s)continue;const e=r[i]?.constructor.name??this.constructor.name,o=n.constructor.name,a=v("TBW025",`Cannot merge plugin configs for "${this.name}": conflicting value for "${i}" supplied by both ${e} and ${o}. Pass the option on a single instance, or remove the duplicate.`,void 0,this.name);throw new Error(a)}}Object.assign(this.userConfig,t)}refreshUserConfigFrom(e){const t=this.userConfig,r={...e.userConfig};for(const n of Object.keys(t))delete t[n];Object.assign(t,r)}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)}queryBoolean(e,t=null){const r=this.grid?.query?.(e,t);return Array.isArray(r)?r.some(Boolean):!!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{...l,...e}}t(e,t){return this.grid?.effectiveConfig?.locale?.[e]??t}get translate(){return(e,t)=>this.t(e,t)}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;return!t||"0"!==getComputedStyle(t).getPropertyValue("--tbw-animation-enabled").trim()}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?d(e,n):n instanceof HTMLElement&&e.replaceChildren(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(v(e,t,this.gridElement.id,this.name)):console.warn(`${b(this.gridElement.id,this.name)} ${e}`)}throwDiagnostic(e,t){throw new Error(v(e,t,this.gridElement.id,this.name))}};function C(e,t,r){return void 0!==e.id?String(e.id):r?`${r}-${t}`:String(t)}function A(e,t){const r=new Set(e);return r.has(t)?r.delete(t):r.add(t),r}function S(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=C(a,o,r),l=a[i];if(Array.isArray(l)&&l.length>0){s.add(d);const e=S(l,t,d,n+1);for(const t of e)s.add(t)}}return s}function R(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=C(a,o,n);if(d===t)return[d];const l=a[s];if(Array.isArray(l)&&l.length>0){const e=R(l,t,r,d,i+1);if(e)return[d,...e]}}return null}function K(e,t,r,n){const i=R(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 k(e,t){const r=Math.min(t,e.length-1);if(r<0)return 0;let n=r;for(;n>0&&e[n].depth>0;)n--;let i=0;for(let s=0;s<=n;s++)0===e[s].depth&&i++;return i-1}function E(e){let t=0;for(const r of e)0===r.depth&&t++;return t}function q(e,t="children",r){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;if(null!=e&&!Array.isArray(e)&&e)return!0;if(r?.(n))return!0}return!1}var _=class extends x{static manifest={modifiesRowStructure:!0,hookPriority:{processRows:10},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."}],events:[{type:"tree-expand",description:"Emitted when tree expansion state changes (toggle, expand all, collapse all). Broadcast to both DOM consumers and plugin bus."},{type:"tree-load-start",description:"Emitted when lazy child loading starts for a node whose children are not yet loaded."},{type:"tree-load-end",description:"Emitted when lazy child loading completes and children have been merged into the parent row."},{type:"tree-load-error",description:"Emitted when lazy child loading fails. The node leaves its loading state and can be retried."}],queries:[{type:"canMoveRow",description:"Returns false for rows with children (parent nodes cannot be reordered)"},{type:"datasource:viewport-mapping",description:"Translates flat viewport row indices to top-level node indices for ServerSide pagination."}]};static dependencies=[{name:"multiSort",required:!1,reason:"Queries sort model for coordinated tree sorting"},{name:"serverSide",required:!1,reason:"Consumes datasource events for lazy-loaded tree data"}];name="tree";styles='@layer tbw-plugins{tbw-grid .cell[data-field=__tbw_expander]{justify-content:flex-start;align-items:center;padding:0;display:flex;border-inline-end:none!important}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{vertical-align:middle;align-items:center;padding-inline-start:calc(var(--tbw-tree-depth,0) * var(--tbw-tree-indent-width,var(--tbw-tree-toggle-size,1.25em)));display:inline-flex;overflow:visible}tbw-grid .tree-expander{box-sizing:border-box;justify-content:flex-start;align-items:center;width:100%;height:100%;display:flex}tbw-grid .tree-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;width:var(--tbw-tree-toggle-size,1.25em);height:var(--tbw-tree-toggle-size,1.25em);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}tbw-grid .tree-toggle:hover{color:var(--tbw-tree-accent,var(--tbw-color-accent))}tbw-grid .tree-toggle{position:relative}tbw-grid .tree-toggle:after{content:"";inline-size:var(--tbw-touch-target-min,24px);block-size:var(--tbw-touch-target-min,24px);position:absolute;inset-block-start:50%;inset-inline-start:50%;translate:-50% -50%}tbw-grid .tree-spacer{width:var(--tbw-tree-toggle-size,1.25em);height:var(--tbw-tree-toggle-size,1.25em);flex-shrink:0;display:inline-block}@media (pointer:coarse){tbw-grid .tree-toggle,tbw-grid .tree-spacer{min-width:var(--tbw-touch-target-min,24px);min-height:var(--tbw-touch-target-min,24px)}}tbw-grid .tree-loading{--tbw-spinner-size:var(--tbw-tree-toggle-size,1.25em);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;loadingKeys=/* @__PURE__ */new Set;loadedKeys=/* @__PURE__ */new Set;#r=/* @__PURE__ */new Map;#n=/* @__PURE__ */new WeakMap;#i=/* @__PURE__ */new WeakMap;originalTreeColumnRenderer;wrappedTreeColumnField;#s=!1;#o=!1;detach(){(this.gridElement?.querySelector(".rows-body"))?.setAttribute("role","grid"),this.expandedKeys.clear(),this.initialExpansionDone=!1,this.flattenedRows=[],this.rowKeyMap.clear(),this.previousVisibleKeys.clear(),this.keysToAnimate.clear(),this.sortState=null,this.loadingKeys.clear(),this.loadedKeys.clear();for(const e of this.#r.values())e.abort();this.#r.clear(),this.originalTreeColumnRenderer=void 0,this.wrappedTreeColumnField=void 0,this.#s=!1}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}if("datasource:viewport-mapping"===e.type){const{viewportStart:t,viewportEnd:r}=e.context;if(0===this.flattenedRows.length)return;return{startNode:k(this.flattenedRows,t),endNode:k(this.flattenedRows,r)+1,totalLoadedNodes:E(this.flattenedRows)}}}attach(e){super.attach(e),this.on("datasource:data",e=>{const t=e;t.claimed||(t.claimed=!0)}),this.on("datasource:children",e=>{const t=e;if("tree"!==t.context?.source)return;t.claimed=!0;const r=t.context.parentNode;if(r){const e=this.#a(r);this.#d(r,t.rows??[]),this.loadingKeys.delete(e),this.broadcast("tree-load-end",{key:e,row:r,depth:this.rowKeyMap.get(e)?.depth??0,childCount:t.rows?.length??0}),this.requestRender()}}),this.on("datasource:error",e=>{const t=e;if("tree"!==t.context?.source)return;const r=t.context.parentNode;if(!r)return;const n=this.#a(r);this.loadingKeys.delete(n)&&(this.broadcast("tree-load-error",{key:n,row:r,depth:this.rowKeyMap.get(n)?.depth??0,error:t.error}),this.requestRender())})}get animationStyle(){return!!this.isAnimationEnabled&&(this.config.animation??"slide")}detect(e){if(!this.config.autoDetect)return!1;const t=e;return q(t,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")}processRows(e){const t=this.config.childrenField??"children",r=e;if(0===r.length||!q(r,t,this.config.hasChildren))return this.flattenedRows=[],this.rowKeyMap.clear(),this.previousVisibleKeys.clear(),this.#l(),[...e];const n=this.resolveEffectiveSortState();this.config.defaultExpanded&&!this.initialExpansionDone&&(this.expandedKeys=S(r,this.config),this.initialExpansionDone=!0),this.flattenedRows=this.#c(r,this.expandedKeys,n,null,0),this.#i=/* @__PURE__ */new WeakMap,this.rowKeyMap.clear(),this.keysToAnimate.clear();const i=/* @__PURE__ */new Set;for(const s of this.flattenedRows)this.rowKeyMap.set(s.key,s),this.#i.set(s.data,s),i.add(s.key),!this.previousVisibleKeys.has(s.key)&&s.depth>0&&this.keysToAnimate.add(s.key);return this.previousVisibleKeys=i,this.#l(),this.flattenedRows.map(e=>e.data)}#l(){this.#o||(this.#o=!0,queueMicrotask(()=>{this.#o=!1,this.grid&&this.#s!==this.flattenedRows.length>0&&this.requestColumnsRender()}))}#h(e,t,r){if(void 0!==e.id){const t=String(e.id);return this.#n.set(e,t),t}const n=this.#n.get(e);if(void 0!==n)return n;const i=r?`${r}-${t}`:String(t);return this.#n.set(e,i),i}#c(e,t,r,n,i){const s=this.config.childrenField??"children";for(let l=0;l<e.length;l++)this.#h(e[l],l,n);const o=r?this.#u(e,r.field,r.direction):e,a=[],d=this.config.hasChildren;for(let l=0;l<o.length;l++){const e=o[l],c=this.#h(e,l,n),h=e[s],u=Array.isArray(h)&&h.length>0,p=u||(d?d(e):null!=h&&!Array.isArray(h)&&!!h),f=t.has(c);a.push({key:c,data:e,depth:i,hasChildren:p,isExpanded:f,parentKey:n,posInSet:l+1,setSize:o.length}),u&&f&&a.push(...this.#c(h,t,r,c,i+1))}return a}#u(e,t,r){const n=this.grid,i=n?._columns??[],s={field:t,direction:r},o=[...e],a=(n?.effectiveConfig?.sortHandler??w)(o,s,i);return a&&"function"==typeof a.then?(a.catch(()=>{}),w(o,s,i)):a}#a(e){return this.#n.get(e)??String(e.id??"?")}#d(e,t){e[this.config.childrenField??"children"]=t,this.loadedKeys.add(this.#a(e))}#p(e,t){if(this.loadedKeys.has(t))return!1;const r=e[this.config.childrenField??"children"];if(Array.isArray(r)&&r.length>0)return!1;const n=this.config.hasChildren;return n?n(e):null!=r&&!Array.isArray(r)&&!!r}requestLazyChildren(e){const{key:t,depth:r,data:n}=e;if(this.loadingKeys.has(t))return;if(!this.#p(n,t))return;const i=this.queryBoolean("datasource:is-active"),{loadChildren:s}=this.config;(i||s)&&(this.loadingKeys.add(t),this.broadcast("tree-load-start",{key:t,row:n,depth:r}),i?this.grid.query("datasource:fetch-children",{context:{source:"tree",parentNode:n,nodePath:[t]}}):this.#f(t,n,r))}#f(e,t,r){const n=this.config.loadChildren,i=new AbortController;this.#r.set(e,i);const s=()=>!i.signal.aborted&&(this.#r.delete(e),this.loadingKeys.delete(e),!0),o=n=>{if(!s())return;const i=n??[];this.#d(t,i),this.broadcast("tree-load-end",{key:e,row:t,depth:r,childCount:i.length}),this.requestRender()},a=n=>{s()&&(this.broadcast("tree-load-error",{key:e,row:t,depth:r,error:n}),this.requestRender())};let d;try{d=n({row:t,key:e,depth:r,signal:i.signal})}catch(l){return void a(l)}if(d&&"function"==typeof d.subscribe){let e=!1,t=null;const r=()=>{e=!0,t?.unsubscribe(),t=null},n=d.subscribe({next:e=>{o(e),r()},error:e=>{a(e),r()}});return e?void n.unsubscribe():(t=n,void i.signal.addEventListener("abort",r,{once:!0}))}Promise.resolve(d).then(o,a)}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}processColumns(r){if(0===this.flattenedRows.length){const e=[...r];if(this.#s){const t=e.findIndex(e=>e.field===this.wrappedTreeColumnField);t>=0&&(e[t]={...e[t],viewRenderer:this.originalTreeColumnRenderer})}return this.#s=!1,this.originalTreeColumnRenderer=void 0,this.wrappedTreeColumnField=void 0,e}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.field;this.wrappedTreeColumnField!==a&&(this.originalTreeColumnRenderer=o.viewRenderer,this.wrappedTreeColumnField=a);const l=this.originalTreeColumnRenderer,c=()=>this.config,h=this.setIcon.bind(this);return n[s]={...o,viewRenderer:r=>{const{row:n,value:i}=r,{showExpandIcons:s=!0,indentWidth:o}=c(),a=this.#i.get(n),u=a?.depth??0,p=document.createElement("span");if(p.className="tree-cell-wrapper",p.style.setProperty("--tbw-tree-depth",String(u)),void 0!==o&&p.style.setProperty("--tbw-tree-indent-width",`${o}px`),s)if(a&&this.loadingKeys.has(a.key)){const e=function(e){const t=document.createElement("div");return t.className=`tbw-spinner tbw-spinner--${e}`,t.setAttribute("role","progressbar"),t.setAttribute("aria-label","Loading"),t}("small");e.classList.add("tree-loading"),p.appendChild(e)}else if(a&&a.hasChildren){const r=document.createElement("span");r.className=`${t}${a.isExpanded?` ${e}`:""}`,h(r,a.isExpanded?"collapse":"expand"),r.setAttribute("data-tree-key",a.key),p.appendChild(r)}else{const e=document.createElement("span");e.className="tree-spacer",p.appendChild(e)}const f=document.createElement("span");if(f.className="tree-content",l){const e=l(r);e instanceof Node?f.appendChild(e):"string"==typeof e&&d(f,e)}else f.textContent=null!=i?String(i):"";return p.appendChild(f),p}},this.#s=!0,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=A(this.expandedKeys,n),this.expandedKeys.has(n)&&this.requestLazyChildren(i),this.broadcast("tree-expand",{key:n,row:i.data,expanded:this.expandedKeys.has(n),depth:i.depth,expandedKeys:[...this.expandedKeys]}),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=A(this.expandedKeys,r.key),this.expandedKeys.has(r.key)&&this.requestLazyChildren(r),this.broadcast("tree-expand",{key:r.key,row:r.data,expanded:this.expandedKeys.has(r.key),depth:r.depth,expandedKeys:[...this.expandedKeys]}),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-body");e&&"treegrid"!==e.getAttribute("role")&&e.setAttribute("role","treegrid");const t=this.gridElement?.querySelector(".rows");if(!t)return;const r=this.animationStyle,n=!1!==r&&this.keysToAnimate.size>0,i="fade"===r?"tbw-tree-fade-in":"tbw-tree-slide-in";for(const s of t.querySelectorAll(".data-grid-row")){const e=s.querySelector(".cell[data-row]"),t=e?parseInt(e.getAttribute("data-row")??"-1",10):-1,r=this.flattenedRows[t];r&&(s.setAttribute("aria-level",String(r.depth+1)),s.setAttribute("aria-setsize",String(r.setSize)),s.setAttribute("aria-posinset",String(r.posInSet)),r.hasChildren?s.setAttribute("aria-expanded",String(r.isExpanded)):s.hasAttribute("aria-expanded")&&s.removeAttribute("aria-expanded"),s.classList.toggle("tbw-row-expanded",r.hasChildren&&r.isExpanded),this.loadingKeys.has(r.key)?s.setAttribute("aria-busy","true"):s.hasAttribute("aria-busy")&&s.removeAttribute("aria-busy"),n&&r.key&&this.keysToAnimate.has(r.key)&&(s.classList.add(i),s.addEventListener("animationend",()=>s.classList.remove(i),{once:!0})))}this.keysToAnimate.clear()}expand(e){this.expandedKeys.add(e);const t=this.rowKeyMap.get(e);t&&this.requestLazyChildren(t),this.requestRender()}collapse(e){this.expandedKeys.delete(e),this.requestRender()}toggle(e){this.expandedKeys=A(this.expandedKeys,e);const t=this.rowKeyMap.get(e);t?(this.expandedKeys.has(e)&&this.requestLazyChildren(t),this.broadcast("tree-expand",{key:e,row:t.data,expanded:this.expandedKeys.has(e),depth:t.depth,expandedKeys:[...this.expandedKeys]})):this.emitPluginEvent("tree-expand",{expandedKeys:[...this.expandedKeys]}),this.requestRender()}expandAll(){this.expandedKeys=S(this.rows,this.config),this.emitPluginEvent("tree-expand",{expandedKeys:[...this.expandedKeys]}),this.requestRender()}collapseAll(){this.expandedKeys=/* @__PURE__ */new Set,this.emitPluginEvent("tree-expand",{expandedKeys:[...this.expandedKeys]}),this.requestRender()}isExpanded(e){return this.expandedKeys.has(e)}getExpandedKeys(){return[...this.expandedKeys]}getFlattenedRows(){return[...this.flattenedRows]}getRowMeta(e){return this.#i.get(e)}getRowByKey(e){return this.rowKeyMap.get(e)?.data}expandToKey(e){this.expandedKeys=K(this.rows,e,this.config,this.expandedKeys),this.requestRender()}};export{_ as TreePlugin};
|
|
1
|
+
var e="expanded",t="tree-toggle",r="__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".split("|").map(e=>e.split("").reverse().join("")),n=(new RegExp(`__(proto|defineGetter|defineSetter)|${r.slice(3).join("|")}|this\\b`),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|math".split("|"))),i=/^on\w+$/i,s=new Set("href|src|action|formaction|data|srcdoc|xlink:href|poster|srcset".split("|")),o=/^\s*(javascript|vbscript|data|blob):/i;function a(e){const t=document.createElement("template");return e&&"string"==typeof e&&(t.innerHTML=e,function(e){const t=[],r=e.querySelectorAll("*");for(const a of r){const e=a.tagName.toLowerCase();if(n.has(e)){t.push(a);continue}if(("svg"===e||"http://www.w3.org/2000/svg"===a.namespaceURI)&&Array.from(a.attributes).some(e=>i.test(e.name)||"href"===e.name||"xlink:href"===e.name)){t.push(a);continue}const r=[];for(const t of a.attributes){const e=t.name.toLowerCase();i.test(e)?r.push(t.name):"is"!==e?(s.has(e)&&o.test(t.value)||"style"===e&&/expression\s*\(|javascript:|behavior\s*:/i.test(t.value))&&r.push(t.name):r.push(t.name)}r.forEach(e=>a.removeAttribute(e))}t.forEach(e=>e.remove())}(t.content)),t.content}function d(e,t){t&&"string"==typeof t?-1!==t.indexOf("<")||-1!==t.indexOf("&")?e.replaceChildren(a(t)):e.textContent=t:e.replaceChildren()}var l={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:"",filterActive:"",print:"🖨️"},c=/* @__PURE__ */new WeakMap;function h(e){return"__proto__"===e||"constructor"===e||"prototype"===e}var u=/* @__PURE__ */new Map;function p(e){if(-1===e.indexOf("."))return null;let t=u.get(e);return void 0===t&&(t=Object.freeze(e.split(".")),u.set(e,t)),t}function f(e,t){let r=e;for(let n=0;n<t.length;n++){if(null==r||"object"!=typeof r)return;const e=t[n];if(h(e))return;r=r[e]}return r}function g(e){const t=p(e);return null===t?h(e)?()=>{}:t=>null==t?void 0:t[e]:r=>{if(null==r)return;const n=r;return Object.prototype.hasOwnProperty.call(n,e)?n[e]:f(n,t)}}function y(e,t,r=-1){if(!t.valueAccessor)return function(e,t){if(null==e)return;const r=p(t),n=e;return null===r?h(t)?void 0:n[t]:Object.prototype.hasOwnProperty.call(n,t)?n[t]:f(n,r)}(e,t.field);if("object"!=typeof e||null===e)return t.valueAccessor({row:e,column:t,rowIndex:r});const n=e,i=t.field;let s=c.get(n);if(s){const e=s.get(i);if(void 0!==e)return e.v}else s=/* @__PURE__ */new Map,c.set(n,s);const o=t.valueAccessor({row:e,column:t,rowIndex:r});return s.set(i,{v:o}),o}function w(e,t,r){const n=[...e];return function(e,t,r,n){const i=n.find(e=>e.field===t),s=i?.sortComparator;if(s)if(i?.valueAccessor)e.sort((e,t)=>s(y(e,i),y(t,i),e,t)*r);else{const n=g(t);e.sort((e,t)=>s(n(e),n(t),e,t)*r)}else i?.valueAccessor?function(e,t,r){m(e,e=>y(e,t),r)}(e,i,r):function(e,t,r){if(function(e){return-1===e.indexOf(".")&&!h(e)}(t))return void e.sort((e,n)=>{const i=function(e,t){const r=!0===e?.__loading;return r===(!0===t?.__loading)?0:r?1:-1}(e,n);if(0!==i)return i;const s=e[t],o=n[t];return null==s&&null==o?0:null==s?-r:null==o||s>o?r:s<o?-r:0});m(e,g(t),r)}(e,t,r)}(n,t.field,t.direction,r),n}function m(e,t,r){const n=e.length;if(n<2)return;const i=new Array(n),s=new Uint8Array(n),o=new Array(n);for(let d=0;d<n;d++){const r=e[d];o[d]=d,i[d]=t(r),s[d]=!0===r?.__loading?1:0}o.sort((e,t)=>{const n=s[e];if(n!==s[t])return n?1:-1;const o=i[e],a=i[t];return null==o&&null==a?0:null==o?-r:null==a||o>a?r:o<a?-r:0});const a=new Array(n);for(let d=0;d<n;d++)a[d]=e[o[d]];for(let d=0;d<n;d++)e[d]=a[d]}function b(e,t){return`[tbw-grid${e?`#${e}`:""}${t?`:${t}`:""}]`}function v(e,t,r,n){return`${b(r,n)} ${e}: ${t}\n\n → More info: ${function(e){return`https://toolboxjs.com/grid/errors#${e.toLowerCase()}`}(e)}`}var x=class{static dependencies;static manifest;aliases;version="3.7.0";styles;cellRenderers;headerRenderers;cellEditors;grid;config;userConfig;#e;get defaultConfig(){return{}}constructor(e={}){this.userConfig=e}get resolvedConfig(){return this.#e?this.config:{...this.defaultConfig,...this.userConfig}}mergeConfigsFrom(e){if(0===e.length)return;const t={...this.userConfig},r={};for(const n of Object.keys(t))r[n]=this;for(const n of e){const e=n.userConfig;for(const[i,s]of Object.entries(e)){if(void 0===s)continue;if(!(i in t)){t[i]=s,r[i]=n;continue}if(t[i]===s)continue;const e=r[i]?.constructor.name??this.constructor.name,o=n.constructor.name,a=v("TBW025",`Cannot merge plugin configs for "${this.name}": conflicting value for "${i}" supplied by both ${e} and ${o}. Pass the option on a single instance, or remove the duplicate.`,void 0,this.name);throw new Error(a)}}Object.assign(this.userConfig,t)}refreshUserConfigFrom(e){const t=this.userConfig,r={...e.userConfig};for(const n of Object.keys(t))delete t[n];Object.assign(t,r)}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)}queryBoolean(e,t=null){const r=this.grid?.query?.(e,t);return Array.isArray(r)?r.some(Boolean):!!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{...l,...e}}t(e,t){return this.grid?.effectiveConfig?.locale?.[e]??t}get translate(){return(e,t)=>this.t(e,t)}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;return!t||"0"!==getComputedStyle(t).getPropertyValue("--tbw-animation-enabled").trim()}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?d(e,n):n instanceof HTMLElement&&e.replaceChildren(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(v(e,t,this.gridElement.id,this.name)):console.warn(`${b(this.gridElement.id,this.name)} ${e}`)}throwDiagnostic(e,t){throw new Error(v(e,t,this.gridElement.id,this.name))}};function C(e,t,r){return void 0!==e.id?String(e.id):r?`${r}-${t}`:String(t)}function A(e,t){const r=new Set(e);return r.has(t)?r.delete(t):r.add(t),r}function S(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=C(a,o,r),l=a[i];if(Array.isArray(l)&&l.length>0){s.add(d);const e=S(l,t,d,n+1);for(const t of e)s.add(t)}}return s}function R(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=C(a,o,n);if(d===t)return[d];const l=a[s];if(Array.isArray(l)&&l.length>0){const e=R(l,t,r,d,i+1);if(e)return[d,...e]}}return null}function K(e,t,r,n){const i=R(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 k(e,t){const r=Math.min(t,e.length-1);if(r<0)return 0;let n=r;for(;n>0&&e[n].depth>0;)n--;let i=0;for(let s=0;s<=n;s++)0===e[s].depth&&i++;return i-1}function E(e){let t=0;for(const r of e)0===r.depth&&t++;return t}function q(e,t="children",r){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;if(null!=e&&!Array.isArray(e)&&e)return!0;if(r?.(n))return!0}return!1}var _=class extends x{static manifest={modifiesRowStructure:!0,hookPriority:{processRows:10},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."}],events:[{type:"tree-expand",description:"Emitted when tree expansion state changes (toggle, expand all, collapse all). Broadcast to both DOM consumers and plugin bus."},{type:"tree-load-start",description:"Emitted when lazy child loading starts for a node whose children are not yet loaded."},{type:"tree-load-end",description:"Emitted when lazy child loading completes and children have been merged into the parent row."},{type:"tree-load-error",description:"Emitted when lazy child loading fails. The node leaves its loading state and can be retried."}],queries:[{type:"canMoveRow",description:"Returns false for rows with children (parent nodes cannot be reordered)"},{type:"datasource:viewport-mapping",description:"Translates flat viewport row indices to top-level node indices for ServerSide pagination."}]};static dependencies=[{name:"multiSort",required:!1,reason:"Queries sort model for coordinated tree sorting"},{name:"serverSide",required:!1,reason:"Consumes datasource events for lazy-loaded tree data"}];name="tree";styles='@layer tbw-plugins{tbw-grid .cell[data-field=__tbw_expander]{justify-content:flex-start;align-items:center;padding:0;display:flex;border-inline-end:none!important}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{vertical-align:middle;align-items:center;padding-inline-start:calc(var(--tbw-tree-depth,0) * var(--tbw-tree-indent-width,var(--tbw-tree-toggle-size,1.25em)));display:inline-flex;overflow:visible}tbw-grid .tree-expander{box-sizing:border-box;justify-content:flex-start;align-items:center;width:100%;height:100%;display:flex}tbw-grid .tree-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;width:var(--tbw-tree-toggle-size,1.25em);height:var(--tbw-tree-toggle-size,1.25em);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}tbw-grid .tree-toggle:hover{color:var(--tbw-tree-accent,var(--tbw-color-accent))}tbw-grid .tree-toggle{position:relative}tbw-grid .tree-toggle:after{content:"";inline-size:var(--tbw-touch-target-min,24px);block-size:var(--tbw-touch-target-min,24px);position:absolute;inset-block-start:50%;inset-inline-start:50%;translate:-50% -50%}tbw-grid .tree-spacer{width:var(--tbw-tree-toggle-size,1.25em);height:var(--tbw-tree-toggle-size,1.25em);flex-shrink:0;display:inline-block}@media (pointer:coarse){tbw-grid .tree-toggle,tbw-grid .tree-spacer{min-width:var(--tbw-touch-target-min,24px);min-height:var(--tbw-touch-target-min,24px)}}tbw-grid .tree-loading{--tbw-spinner-size:var(--tbw-tree-toggle-size,1.25em);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;loadingKeys=/* @__PURE__ */new Set;loadedKeys=/* @__PURE__ */new Set;#r=/* @__PURE__ */new Map;#n=/* @__PURE__ */new WeakMap;#i=/* @__PURE__ */new WeakMap;originalTreeColumnRenderer;wrappedTreeColumnField;#s=!1;#o=!1;detach(){(this.gridElement?.querySelector(".rows-body"))?.setAttribute("role","grid"),this.expandedKeys.clear(),this.initialExpansionDone=!1,this.flattenedRows=[],this.rowKeyMap.clear(),this.previousVisibleKeys.clear(),this.keysToAnimate.clear(),this.sortState=null,this.loadingKeys.clear(),this.loadedKeys.clear();for(const e of this.#r.values())e.abort();this.#r.clear(),this.originalTreeColumnRenderer=void 0,this.wrappedTreeColumnField=void 0,this.#s=!1}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}if("datasource:viewport-mapping"===e.type){const{viewportStart:t,viewportEnd:r}=e.context;if(0===this.flattenedRows.length)return;return{startNode:k(this.flattenedRows,t),endNode:k(this.flattenedRows,r)+1,totalLoadedNodes:E(this.flattenedRows)}}}attach(e){super.attach(e),this.on("datasource:data",e=>{const t=e;t.claimed||(t.claimed=!0)}),this.on("datasource:children",e=>{const t=e;if("tree"!==t.context?.source)return;t.claimed=!0;const r=t.context.parentNode;if(r){const e=this.#a(r);this.#d(r,t.rows??[]),this.loadingKeys.delete(e),this.broadcast("tree-load-end",{key:e,row:r,depth:this.rowKeyMap.get(e)?.depth??0,childCount:t.rows?.length??0}),this.requestRender()}}),this.on("datasource:error",e=>{const t=e;if("tree"!==t.context?.source)return;const r=t.context.parentNode;if(!r)return;const n=this.#a(r);this.loadingKeys.delete(n)&&(this.broadcast("tree-load-error",{key:n,row:r,depth:this.rowKeyMap.get(n)?.depth??0,error:t.error}),this.requestRender())})}get animationStyle(){return!!this.isAnimationEnabled&&(this.config.animation??"slide")}detect(e){if(!this.config.autoDetect)return!1;const t=e;return q(t,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")}processRows(e){const t=this.config.childrenField??"children",r=e;if(0===r.length||!q(r,t,this.config.hasChildren))return this.flattenedRows=[],this.rowKeyMap.clear(),this.previousVisibleKeys.clear(),this.#l(),[...e];const n=this.resolveEffectiveSortState();this.config.defaultExpanded&&!this.initialExpansionDone&&(this.expandedKeys=S(r,this.config),this.initialExpansionDone=!0),this.flattenedRows=this.#c(r,this.expandedKeys,n,null,0),this.#i=/* @__PURE__ */new WeakMap,this.rowKeyMap.clear(),this.keysToAnimate.clear();const i=/* @__PURE__ */new Set;for(const s of this.flattenedRows)this.rowKeyMap.set(s.key,s),this.#i.set(s.data,s),i.add(s.key),!this.previousVisibleKeys.has(s.key)&&s.depth>0&&this.keysToAnimate.add(s.key);return this.previousVisibleKeys=i,this.#l(),this.flattenedRows.map(e=>e.data)}#l(){this.#o||(this.#o=!0,queueMicrotask(()=>{this.#o=!1,this.grid&&this.#s!==this.flattenedRows.length>0&&this.requestColumnsRender()}))}#h(e,t,r){if(void 0!==e.id){const t=String(e.id);return this.#n.set(e,t),t}const n=this.#n.get(e);if(void 0!==n)return n;const i=r?`${r}-${t}`:String(t);return this.#n.set(e,i),i}#c(e,t,r,n,i){const s=this.config.childrenField??"children";for(let l=0;l<e.length;l++)this.#h(e[l],l,n);const o=r?this.#u(e,r.field,r.direction):e,a=[],d=this.config.hasChildren;for(let l=0;l<o.length;l++){const e=o[l],c=this.#h(e,l,n),h=e[s],u=Array.isArray(h)&&h.length>0,p=u||(d?d(e):null!=h&&!Array.isArray(h)&&!!h),f=t.has(c);a.push({key:c,data:e,depth:i,hasChildren:p,isExpanded:f,parentKey:n,posInSet:l+1,setSize:o.length}),u&&f&&a.push(...this.#c(h,t,r,c,i+1))}return a}#u(e,t,r){const n=this.grid,i=n?._columns??[],s={field:t,direction:r},o=[...e],a=(n?.effectiveConfig?.sortHandler??w)(o,s,i);return a&&"function"==typeof a.then?(a.catch(()=>{}),w(o,s,i)):a}#a(e){return this.#n.get(e)??String(e.id??"?")}#d(e,t){e[this.config.childrenField??"children"]=t,this.loadedKeys.add(this.#a(e))}#p(e,t){if(this.loadedKeys.has(t))return!1;const r=e[this.config.childrenField??"children"];if(Array.isArray(r)&&r.length>0)return!1;const n=this.config.hasChildren;return n?n(e):null!=r&&!Array.isArray(r)&&!!r}requestLazyChildren(e){const{key:t,depth:r,data:n}=e;if(this.loadingKeys.has(t))return;if(!this.#p(n,t))return;const i=this.queryBoolean("datasource:is-active"),{loadChildren:s}=this.config;(i||s)&&(this.loadingKeys.add(t),this.broadcast("tree-load-start",{key:t,row:n,depth:r}),i?this.grid.query("datasource:fetch-children",{context:{source:"tree",parentNode:n,nodePath:[t]}}):this.#f(t,n,r))}#f(e,t,r){const n=this.config.loadChildren,i=new AbortController;this.#r.set(e,i);const s=()=>!i.signal.aborted&&(this.#r.delete(e),this.loadingKeys.delete(e),!0),o=n=>{if(!s())return;const i=n??[];this.#d(t,i),this.broadcast("tree-load-end",{key:e,row:t,depth:r,childCount:i.length}),this.requestRender()},a=n=>{s()&&(this.broadcast("tree-load-error",{key:e,row:t,depth:r,error:n}),this.requestRender())};let d;try{d=n({row:t,key:e,depth:r,signal:i.signal})}catch(l){return void a(l)}if(d&&"function"==typeof d.subscribe){let e=!1,t=null;const r=()=>{e=!0,t?.unsubscribe(),t=null},n=d.subscribe({next:e=>{o(e),r()},error:e=>{a(e),r()}});return e?void n.unsubscribe():(t=n,void i.signal.addEventListener("abort",r,{once:!0}))}Promise.resolve(d).then(o,a)}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}processColumns(r){if(0===this.flattenedRows.length){const e=[...r];if(this.#s){const t=e.findIndex(e=>e.field===this.wrappedTreeColumnField);t>=0&&(e[t]={...e[t],viewRenderer:this.originalTreeColumnRenderer})}return this.#s=!1,this.originalTreeColumnRenderer=void 0,this.wrappedTreeColumnField=void 0,e}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.field;this.wrappedTreeColumnField!==a&&(this.originalTreeColumnRenderer=o.viewRenderer,this.wrappedTreeColumnField=a);const l=this.originalTreeColumnRenderer,c=()=>this.config,h=this.setIcon.bind(this);return n[s]={...o,viewRenderer:r=>{const{row:n,value:i}=r,{showExpandIcons:s=!0,indentWidth:o}=c(),a=this.#i.get(n),u=a?.depth??0,p=document.createElement("span");if(p.className="tree-cell-wrapper",p.style.setProperty("--tbw-tree-depth",String(u)),void 0!==o&&p.style.setProperty("--tbw-tree-indent-width",`${o}px`),s)if(a&&this.loadingKeys.has(a.key)){const e=function(e){const t=document.createElement("div");return t.className=`tbw-spinner tbw-spinner--${e}`,t.setAttribute("role","progressbar"),t.setAttribute("aria-label","Loading"),t}("small");e.classList.add("tree-loading"),p.appendChild(e)}else if(a&&a.hasChildren){const r=document.createElement("span");r.className=`${t}${a.isExpanded?` ${e}`:""}`,h(r,a.isExpanded?"collapse":"expand"),r.setAttribute("data-tree-key",a.key),p.appendChild(r)}else{const e=document.createElement("span");e.className="tree-spacer",p.appendChild(e)}const f=document.createElement("span");if(f.className="tree-content",l){const e=l(r);e instanceof Node?f.appendChild(e):"string"==typeof e&&d(f,e)}else f.textContent=null!=i?String(i):"";return p.appendChild(f),p}},this.#s=!0,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=A(this.expandedKeys,n),this.expandedKeys.has(n)&&this.requestLazyChildren(i),this.broadcast("tree-expand",{key:n,row:i.data,expanded:this.expandedKeys.has(n),depth:i.depth,expandedKeys:[...this.expandedKeys]}),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=A(this.expandedKeys,r.key),this.expandedKeys.has(r.key)&&this.requestLazyChildren(r),this.broadcast("tree-expand",{key:r.key,row:r.data,expanded:this.expandedKeys.has(r.key),depth:r.depth,expandedKeys:[...this.expandedKeys]}),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-body");e&&"treegrid"!==e.getAttribute("role")&&e.setAttribute("role","treegrid");const t=this.gridElement?.querySelector(".rows");if(!t)return;const r=this.animationStyle,n=!1!==r&&this.keysToAnimate.size>0,i="fade"===r?"tbw-tree-fade-in":"tbw-tree-slide-in";for(const s of t.querySelectorAll(".data-grid-row")){const e=s.querySelector(".cell[data-row]"),t=e?parseInt(e.getAttribute("data-row")??"-1",10):-1,r=this.flattenedRows[t];r&&(s.setAttribute("aria-level",String(r.depth+1)),s.setAttribute("aria-setsize",String(r.setSize)),s.setAttribute("aria-posinset",String(r.posInSet)),r.hasChildren?s.setAttribute("aria-expanded",String(r.isExpanded)):s.hasAttribute("aria-expanded")&&s.removeAttribute("aria-expanded"),s.classList.toggle("tbw-row-expanded",r.hasChildren&&r.isExpanded),this.loadingKeys.has(r.key)?s.setAttribute("aria-busy","true"):s.hasAttribute("aria-busy")&&s.removeAttribute("aria-busy"),n&&r.key&&this.keysToAnimate.has(r.key)&&(s.classList.add(i),s.addEventListener("animationend",()=>s.classList.remove(i),{once:!0})))}this.keysToAnimate.clear()}expand(e){this.expandedKeys.add(e);const t=this.rowKeyMap.get(e);t&&this.requestLazyChildren(t),this.requestRender()}collapse(e){this.expandedKeys.delete(e),this.requestRender()}toggle(e){this.expandedKeys=A(this.expandedKeys,e);const t=this.rowKeyMap.get(e);t?(this.expandedKeys.has(e)&&this.requestLazyChildren(t),this.broadcast("tree-expand",{key:e,row:t.data,expanded:this.expandedKeys.has(e),depth:t.depth,expandedKeys:[...this.expandedKeys]})):this.emitPluginEvent("tree-expand",{expandedKeys:[...this.expandedKeys]}),this.requestRender()}expandAll(){this.expandedKeys=S(this.rows,this.config),this.emitPluginEvent("tree-expand",{expandedKeys:[...this.expandedKeys]}),this.requestRender()}collapseAll(){this.expandedKeys=/* @__PURE__ */new Set,this.emitPluginEvent("tree-expand",{expandedKeys:[...this.expandedKeys]}),this.requestRender()}isExpanded(e){return this.expandedKeys.has(e)}getExpandedKeys(){return[...this.expandedKeys]}getFlattenedRows(){return[...this.flattenedRows]}getRowMeta(e){return this.#i.get(e)}getRowByKey(e){return this.rowKeyMap.get(e)?.data}expandToKey(e){this.expandedKeys=K(this.rows,e,this.config,this.expandedKeys),this.requestRender()}};export{_ as TreePlugin};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|