@toolbox-web/grid 1.30.2 → 1.31.0

package/lib/plugins/column-virtualization/index.js

@@ -1,2 +1,2 @@
-function t(t,e){return`[tbw-grid${t?`#${t}`:""}${e?`:${e}`:""}]`}function e(e,r,i,s){return`${t(i,s)} ${e}: ${r}\n\n  → More info: ${function(t){return`https://toolboxjs.com/grid/errors#${t.toLowerCase()}`}(e)}`}const r=/* @__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"]),i=/^on\w+$/i,s=/* @__PURE__ */new Set(["href","src","action","formaction","data","srcdoc","xlink:href","poster","srcset"]),n=/^\s*(javascript|vbscript|data|blob):/i;function o(t){if(!t||"string"!=typeof t)return"";if(-1===t.indexOf("<"))return t;const e=document.createElement("template");return e.innerHTML=t,function(t){const e=[],o=t.querySelectorAll("*");for(const l of o){const t=l.tagName.toLowerCase();if(r.has(t)){e.push(l);continue}if("svg"===t||"http://www.w3.org/2000/svg"===l.namespaceURI){if(Array.from(l.attributes).some(t=>i.test(t.name)||"href"===t.name||"xlink:href"===t.name)){e.push(l);continue}}const o=[];for(const e of l.attributes){const t=e.name.toLowerCase();i.test(t)?o.push(e.name):(s.has(t)&&n.test(e.value)||"style"===t&&/expression\s*\(|javascript:|behavior\s*:/i.test(e.value))&&o.push(e.name)}o.forEach(t=>l.removeAttribute(t))}e.forEach(t=>t.remove())}(e.content),e.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>',a={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:l,filterActive:l,print:"🖨️"};class u{static dependencies;static manifest;aliases;version="undefined"!=typeof __GRID_VERSION__?__GRID_VERSION__:"dev";styles;cellRenderers;headerRenderers;cellEditors;grid;config;userConfig;#t;get defaultConfig(){return{}}constructor(t={}){this.userConfig=t}attach(t){this.#t?.abort(),this.#t=new AbortController,this.grid=t,this.config={...this.defaultConfig,...this.userConfig}}detach(){this.#t?.abort(),this.#t=void 0}getPlugin(t){return this.grid?.getPlugin(t)}emit(t,e){this.grid?.dispatchEvent?.(new CustomEvent(t,{detail:e,bubbles:!0}))}emitCancelable(t,e){const r=new CustomEvent(t,{detail:e,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(r),r.defaultPrevented}on(t,e){this.grid?._pluginManager?.subscribe(this,t,e)}off(t){this.grid?._pluginManager?.unsubscribe(this,t)}emitPluginEvent(t,e){this.grid?._pluginManager?.emitPluginEvent(t,e)}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.#t?.signal??this.grid?.disconnectSignal}get gridIcons(){const t=this.grid?.gridConfig?.icons??{};return{...a,...t}}get isAnimationEnabled(){const t=this.grid?.effectiveConfig?.animation?.mode??"reduced-motion";if(!1===t||"off"===t)return!1;if(!0===t||"on"===t)return!0;const e=this.gridElement;if(e){return"0"!==getComputedStyle(e).getPropertyValue("--tbw-animation-enabled").trim()}return!0}get animationDuration(){const t=this.gridElement;if(t){const e=getComputedStyle(t).getPropertyValue("--tbw-animation-duration").trim(),r=parseInt(e,10);if(!isNaN(r))return r}return 200}resolveIcon(t,e){return void 0!==e?e:this.gridIcons[t]}setIcon(t,e){"string"==typeof e?t.innerHTML=o(e):e instanceof HTMLElement&&(t.innerHTML="",t.appendChild(e.cloneNode(!0)))}warn(r,i){void 0!==i?console.warn(e(r,i,this.gridElement.id,this.name)):console.warn(`${t(this.gridElement.id,this.name)} ${r}`)}throwDiagnostic(t,r){throw new Error(e(t,r,this.gridElement.id,this.name))}}function h(t){if(null==t)return 100;if("number"==typeof t)return t;const e=parseFloat(t);return isNaN(e)?100:e}function c(t){return t.map(t=>h(t.width))}function d(t){const e=[];let r=0;for(const i of t)e.push(r),r+=h(i.width);return e}function f(t){return t.reduce((t,e)=>t+h(e.width),0)}function g(t,e,r,i,s){const n=r.length;if(0===n)return{startCol:0,endCol:0,visibleColumns:[]};let o=function(t,e,r){let i=0,s=e.length-1;for(;i<s;){const n=Math.floor((i+s)/2);e[n]+r[n]<=t?i=n+1:s=n}return i}(t,r,i);o=Math.max(0,o-s);const l=t+e;let a=o;for(let h=o;h<n;h++){if(r[h]>=l){a=h-1;break}a=h}a=Math.min(n-1,a+s);const u=[];for(let h=o;h<=a;h++)u.push(h);return{startCol:o,endCol:a,visibleColumns:u}}class m extends u{name="columnVirtualization";get defaultConfig(){return{autoEnable:!0,threshold:30,overscan:3}}isVirtualized=!1;startCol=0;endCol=0;scrollLeft=0;totalWidth=0;columnWidths=[];columnOffsets=[];originalColumns=[];attach(t){super.attach(t);const e=this.columns;this.columnWidths=c(e),this.columnOffsets=d(e),this.totalWidth=f(e),this.endCol=e.length-1}detach(){this.#e(),this.columnWidths=[],this.columnOffsets=[],this.originalColumns=[],this.isVirtualized=!1,this.startCol=0,this.endCol=0,this.scrollLeft=0,this.totalWidth=0}#e(){const t=this.gridElement;if(!t)return;const e=t.querySelector(".header-row");e&&(e.style.paddingLeft="",e.style.minWidth="");t.querySelectorAll(".data-grid-row").forEach(t=>{t.style.paddingLeft=""});const r=t.querySelector(".rows-viewport .rows");r&&(r.style.width="");const i=t.querySelector(".rows-body");i&&(i.style.minWidth="")}processColumns(t){(0===this.originalColumns.length||t.length>=this.originalColumns.length)&&(this.originalColumns=t,this.columnWidths=c(t),this.columnOffsets=d(t),this.totalWidth=f(t));const e=this.originalColumns,r=(i=e.length,s=this.config.threshold??30,!!(this.config.autoEnable??!0)&&i>s);var i,s;if(this.isVirtualized=r??!1,!r)return this.startCol=0,this.endCol=e.length-1,[...e];const n=this.grid?.clientWidth||800,o=g(this.scrollLeft,n,this.columnOffsets,this.columnWidths,this.config.overscan??3);return this.startCol=o.startCol,this.endCol=o.endCol,o.visibleColumns.map(t=>e[t])}afterRender(){if(!this.isVirtualized)return;const t=this.gridElement;if(!t)return;const e=this.columnOffsets[this.startCol]??0,r=t.querySelector(".header-row"),i=t.querySelectorAll(".data-grid-row");r&&(r.style.paddingLeft=`${e}px`,r.style.minWidth=`${this.totalWidth}px`),i.forEach(t=>{t.style.paddingLeft=`${e}px`});const s=t.querySelector(".rows-viewport .rows");s&&(s.style.width=`${this.totalWidth}px`);const n=t.querySelector(".rows-body");n&&(n.style.minWidth=`${this.totalWidth}px`)}onScroll(t){if(!this.isVirtualized)return;Math.abs(t.scrollLeft-this.scrollLeft)<1||(this.scrollLeft=t.scrollLeft,this.requestColumnsRender())}getIsVirtualized(){return this.isVirtualized}getVisibleColumnRange(){return{start:this.startCol,end:this.endCol}}scrollToColumn(t){const e=this.columnOffsets[t]??0,r=this.gridElement;r&&(r.scrollLeft=e)}getColumnOffset(t){return this.columnOffsets[t]??0}getTotalWidth(){return this.totalWidth}}export{m as ColumnVirtualizationPlugin};
+function t(t,e){return`[tbw-grid${t?`#${t}`:""}${e?`:${e}`:""}]`}function e(e,r,s,i){return`${t(s,i)} ${e}: ${r}\n\n  → More info: ${function(t){return`https://toolboxjs.com/grid/errors#${t.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(t=>t.split("").reverse().join(""));const r=/* @__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,i=/* @__PURE__ */new Set(["href","src","action","formaction","data","srcdoc","xlink:href","poster","srcset"]),n=/^\s*(javascript|vbscript|data|blob):/i;function o(t){if(!t||"string"!=typeof t)return"";if(-1===t.indexOf("<"))return t;const e=document.createElement("template");return e.innerHTML=t,function(t){const e=[],o=t.querySelectorAll("*");for(const l of o){const t=l.tagName.toLowerCase();if(r.has(t)){e.push(l);continue}if("svg"===t||"http://www.w3.org/2000/svg"===l.namespaceURI){if(Array.from(l.attributes).some(t=>s.test(t.name)||"href"===t.name||"xlink:href"===t.name)){e.push(l);continue}}const o=[];for(const e of l.attributes){const t=e.name.toLowerCase();s.test(t)?o.push(e.name):(i.has(t)&&n.test(e.value)||"style"===t&&/expression\s*\(|javascript:|behavior\s*:/i.test(e.value))&&o.push(e.name)}o.forEach(t=>l.removeAttribute(t))}e.forEach(t=>t.remove())}(e.content),e.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>',a={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:l,filterActive:l,print:"🖨️"};class c{static dependencies;static manifest;aliases;version="undefined"!=typeof __GRID_VERSION__?__GRID_VERSION__:"dev";styles;cellRenderers;headerRenderers;cellEditors;grid;config;userConfig;#t;get defaultConfig(){return{}}constructor(t={}){this.userConfig=t}attach(t){this.#t?.abort(),this.#t=new AbortController,this.grid=t,this.config={...this.defaultConfig,...this.userConfig}}detach(){this.#t?.abort(),this.#t=void 0}getPlugin(t){return this.grid?.getPlugin(t)}emit(t,e){this.grid?.dispatchEvent?.(new CustomEvent(t,{detail:e,bubbles:!0}))}emitCancelable(t,e){const r=new CustomEvent(t,{detail:e,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(r),r.defaultPrevented}on(t,e){this.grid?._pluginManager?.subscribe(this,t,e)}off(t){this.grid?._pluginManager?.unsubscribe(this,t)}emitPluginEvent(t,e){this.grid?._pluginManager?.emitPluginEvent(t,e)}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.#t?.signal??this.grid?.disconnectSignal}get gridIcons(){const t=this.grid?.gridConfig?.icons??{};return{...a,...t}}get isAnimationEnabled(){const t=this.grid?.effectiveConfig?.animation?.mode??"reduced-motion";if(!1===t||"off"===t)return!1;if(!0===t||"on"===t)return!0;const e=this.gridElement;if(e){return"0"!==getComputedStyle(e).getPropertyValue("--tbw-animation-enabled").trim()}return!0}get animationDuration(){const t=this.gridElement;if(t){const e=getComputedStyle(t).getPropertyValue("--tbw-animation-duration").trim(),r=parseInt(e,10);if(!isNaN(r))return r}return 200}resolveIcon(t,e){return void 0!==e?e:this.gridIcons[t]}setIcon(t,e,r){t.dataset.icon=e.replace(/([A-Z])/g,"-$1").toLowerCase(),"collapse"===e?t.dataset.expanded="":"expand"===e&&delete t.dataset.expanded;const s=this.#e(e,r);void 0!==s?"string"==typeof s?t.innerHTML=o(s):s instanceof HTMLElement&&(t.innerHTML="",t.appendChild(s.cloneNode(!0))):t.innerHTML=""}#e(t,e){return void 0!==e?e:this.grid?.gridConfig?.icons?.[t]}updateSortIndicator(t,e){t.querySelector('[part~="sort-indicator"], .sort-indicator')?.remove();const r=document.createElement("span");r.setAttribute("part","sort-indicator"),r.className="sort-indicator",e?(t.setAttribute("aria-sort","asc"===e?"ascending":"descending"),t.setAttribute("data-sort",e),this.setIcon(r,"asc"===e?"sortAsc":"sortDesc")):(t.setAttribute("aria-sort","none"),t.removeAttribute("data-sort"),this.setIcon(r,"sortNone"));const s=t.querySelector(".tbw-filter-btn")??t.querySelector(".resize-handle");return s?t.insertBefore(r,s):t.appendChild(r),r}warn(r,s){void 0!==s?console.warn(e(r,s,this.gridElement.id,this.name)):console.warn(`${t(this.gridElement.id,this.name)} ${r}`)}throwDiagnostic(t,r){throw new Error(e(t,r,this.gridElement.id,this.name))}}function u(t){if(null==t)return 100;if("number"==typeof t)return t;const e=parseFloat(t);return isNaN(e)?100:e}function d(t){return t.map(t=>u(t.width))}function h(t){const e=[];let r=0;for(const s of t)e.push(r),r+=u(s.width);return e}function f(t){return t.reduce((t,e)=>t+u(e.width),0)}function g(t,e,r,s,i){const n=r.length;if(0===n)return{startCol:0,endCol:0,visibleColumns:[]};let o=function(t,e,r){let s=0,i=e.length-1;for(;s<i;){const n=Math.floor((s+i)/2);e[n]+r[n]<=t?s=n+1:i=n}return s}(t,r,s);o=Math.max(0,o-i);const l=t+e;let a=o;for(let u=o;u<n;u++){if(r[u]>=l){a=u-1;break}a=u}a=Math.min(n-1,a+i);const c=[];for(let u=o;u<=a;u++)c.push(u);return{startCol:o,endCol:a,visibleColumns:c}}class m extends c{name="columnVirtualization";get defaultConfig(){return{autoEnable:!0,threshold:30,overscan:3}}isVirtualized=!1;startCol=0;endCol=0;scrollLeft=0;totalWidth=0;columnWidths=[];columnOffsets=[];originalColumns=[];attach(t){super.attach(t);const e=this.columns;this.columnWidths=d(e),this.columnOffsets=h(e),this.totalWidth=f(e),this.endCol=e.length-1}detach(){this.#r(),this.columnWidths=[],this.columnOffsets=[],this.originalColumns=[],this.isVirtualized=!1,this.startCol=0,this.endCol=0,this.scrollLeft=0,this.totalWidth=0}#r(){const t=this.gridElement;if(!t)return;const e=t.querySelector(".header-row");e&&(e.style.paddingLeft="",e.style.minWidth="");t.querySelectorAll(".data-grid-row").forEach(t=>{t.style.paddingLeft=""});const r=t.querySelector(".rows-viewport .rows");r&&(r.style.width="");const s=t.querySelector(".rows-body");s&&(s.style.minWidth="")}processColumns(t){(0===this.originalColumns.length||t.length>=this.originalColumns.length)&&(this.originalColumns=t,this.columnWidths=d(t),this.columnOffsets=h(t),this.totalWidth=f(t));const e=this.originalColumns,r=(s=e.length,i=this.config.threshold??30,!!(this.config.autoEnable??!0)&&s>i);var s,i;if(this.isVirtualized=r??!1,!r)return this.startCol=0,this.endCol=e.length-1,[...e];const n=this.grid?.clientWidth||800,o=g(this.scrollLeft,n,this.columnOffsets,this.columnWidths,this.config.overscan??3);return this.startCol=o.startCol,this.endCol=o.endCol,o.visibleColumns.map(t=>e[t])}afterRender(){if(!this.isVirtualized)return;const t=this.gridElement;if(!t)return;const e=this.columnOffsets[this.startCol]??0,r=t.querySelector(".header-row"),s=t.querySelectorAll(".data-grid-row");r&&(r.style.paddingLeft=`${e}px`,r.style.minWidth=`${this.totalWidth}px`),s.forEach(t=>{t.style.paddingLeft=`${e}px`});const i=t.querySelector(".rows-viewport .rows");i&&(i.style.width=`${this.totalWidth}px`);const n=t.querySelector(".rows-body");n&&(n.style.minWidth=`${this.totalWidth}px`)}onScroll(t){if(!this.isVirtualized)return;Math.abs(t.scrollLeft-this.scrollLeft)<1||(this.scrollLeft=t.scrollLeft,this.requestColumnsRender())}getIsVirtualized(){return this.isVirtualized}getVisibleColumnRange(){return{start:this.startCol,end:this.endCol}}scrollToColumn(t){const e=this.columnOffsets[t]??0,r=this.gridElement;r&&(r.scrollLeft=e)}getColumnOffset(t){return this.columnOffsets[t]??0}getTotalWidth(){return this.totalWidth}}export{m as ColumnVirtualizationPlugin};
 //# sourceMappingURL=index.js.map