@toolbox-web/grid 1.30.2 → 1.31.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/README.md +1 -1
- package/all.js +2 -2
- package/all.js.map +1 -1
- package/index.js +1 -1
- package/index.js.map +1 -1
- package/lib/core/internal/dom-builder.d.ts +3 -3
- package/lib/core/plugin/base-plugin.d.ts +31 -8
- package/lib/core/plugin/plugin-manager.d.ts +2 -2
- package/lib/core/types.d.ts +16 -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 +2 -2
- 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/MultiSortPlugin.d.ts +8 -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/PivotPlugin.d.ts +43 -1
- package/lib/plugins/pivot/index.d.ts +1 -1
- package/lib/plugins/pivot/index.js +1 -1
- package/lib/plugins/pivot/index.js.map +1 -1
- package/lib/plugins/pivot/pivot-engine.d.ts +21 -2
- package/lib/plugins/pivot/pivot-model.d.ts +6 -3
- package/lib/plugins/pivot/pivot-panel.d.ts +8 -3
- package/lib/plugins/pivot/pivot-rows.d.ts +3 -3
- package/lib/plugins/pivot/types.d.ts +121 -8
- 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/reorder-rows/index.js +1 -1
- package/lib/plugins/reorder-rows/index.js.map +1 -1
- package/lib/plugins/responsive/index.js +1 -1
- package/lib/plugins/responsive/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/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 +1 -1
- package/themes/dg-theme-bootstrap.css +8 -1
- package/themes/dg-theme-large.css +3 -1
- package/themes/dg-theme-material.css +3 -1
- package/themes/dg-theme-standard.css +5 -0
- package/themes/dg-theme-vibrant.css +5 -0
- 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/context-menu.umd.js +1 -1
- package/umd/plugins/context-menu.umd.js.map +1 -1
- package/umd/plugins/editing.umd.js +1 -1
- package/umd/plugins/editing.umd.js.map +1 -1
- package/umd/plugins/filtering.umd.js +1 -1
- package/umd/plugins/filtering.umd.js.map +1 -1
- package/umd/plugins/grouping-rows.umd.js +1 -1
- package/umd/plugins/grouping-rows.umd.js.map +1 -1
- package/umd/plugins/master-detail.umd.js +1 -1
- package/umd/plugins/master-detail.umd.js.map +1 -1
- package/umd/plugins/multi-sort.umd.js +1 -1
- package/umd/plugins/multi-sort.umd.js.map +1 -1
- package/umd/plugins/pivot.umd.js +1 -1
- package/umd/plugins/pivot.umd.js.map +1 -1
- package/umd/plugins/print.umd.js +1 -1
- package/umd/plugins/print.umd.js.map +1 -1
- package/umd/plugins/reorder-rows.umd.js +1 -1
- package/umd/plugins/reorder-rows.umd.js.map +1 -1
- package/umd/plugins/tree.umd.js +1 -1
- package/umd/plugins/tree.umd.js.map +1 -1
- package/umd/plugins/visibility.umd.js +1 -1
- package/umd/plugins/visibility.umd.js.map +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const t="sticky-left",e="sticky-right";function s(t){try{if("rtl"===getComputedStyle(t).direction)return"rtl"}catch{}try{const e=t.closest?.("[dir]")?.getAttribute("dir");if("rtl"===e)return"rtl"}catch{}return"ltr"}function n(t,e){return`[tbw-grid${t?`#${t}`:""}${e?`:${e}`:""}]`}function i(t,e,s,i){return`${n(s,i)} ${t}: ${e}\n\n → More info: ${function(t){return`https://toolboxjs.com/grid/errors#${t.toLowerCase()}`}(t)}`}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"]),o=/^on\w+$/i,l=/* @__PURE__ */new Set(["href","src","action","formaction","data","srcdoc","xlink:href","poster","srcset"]),d=/^\s*(javascript|vbscript|data|blob):/i;function a(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=[],s=t.querySelectorAll("*");for(const n of s){const t=n.tagName.toLowerCase();if(r.has(t)){e.push(n);continue}if("svg"===t||"http://www.w3.org/2000/svg"===n.namespaceURI){if(Array.from(n.attributes).some(t=>o.test(t.name)||"href"===t.name||"xlink:href"===t.name)){e.push(n);continue}}const s=[];for(const e of n.attributes){const t=e.name.toLowerCase();o.test(t)?s.push(e.name):(l.has(t)&&d.test(e.value)||"style"===t&&/expression\s*\(|javascript:|behavior\s*:/i.test(e.value))&&s.push(e.name)}s.forEach(t=>n.removeAttribute(t))}e.forEach(t=>t.remove())}(e.content),e.innerHTML}const c='<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>',f={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:c,filterActive:c,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 s=new CustomEvent(t,{detail:e,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(s),s.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{...f,...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(),s=parseInt(e,10);if(!isNaN(s))return s}return 200}resolveIcon(t,e){return void 0!==e?e:this.gridIcons[t]}setIcon(t,e){"string"==typeof e?t.innerHTML=a(e):e instanceof HTMLElement&&(t.innerHTML="",t.appendChild(e.cloneNode(!0)))}warn(t,e){void 0!==e?console.warn(i(t,e,this.gridElement.id,this.name)):console.warn(`${n(this.gridElement.id,this.name)} ${t}`)}throwDiagnostic(t,e){throw new Error(i(t,e,this.gridElement.id,this.name))}}function h(t){return t.pinned??t.sticky??t.meta?.pinned??t.meta?.sticky}function p(t,e){return function(t,e){return"left"===t||"right"===t?t:"rtl"===e?"start"===t?"right":"left":"start"===t?"left":"right"}(t,e)}function g(t,e){const s=h(t);return!!s&&"left"===p(s,e)}function m(t,e){const s=h(t);return!!s&&"right"===p(s,e)}function y(t){return t.some(t=>null!=h(t))}function b(n,i){const r={groupEndAdjustments:{addGroupEnd:/* @__PURE__ */new Set,removeGroupEnd:/* @__PURE__ */new Set},leftOffsets:/* @__PURE__ */new Map,rightOffsets:/* @__PURE__ */new Map,splitGroups:[]},o=Array.from(n.querySelectorAll(".header-row .cell"));if(!o.length)return r;const l=s(n),d=/* @__PURE__ */new Map,a=/* @__PURE__ */new Map;let c=0;for(const e of i)if(g(e,l)){const s=o.find(t=>t.getAttribute("data-field")===e.field);s&&(d.set(e.field,c),s.classList.add(t),s.style.position="sticky",s.style.left=c+"px",n.querySelectorAll(`.data-grid-row .cell[data-field="${e.field}"]`).forEach(e=>{e.classList.add(t),e.style.position="sticky",e.style.left=c+"px"}),c+=s.offsetWidth)}let f=0;for(const t of[...i].reverse())if(m(t,l)){const s=o.find(e=>e.getAttribute("data-field")===t.field);s&&(a.set(t.field,f),s.classList.add(e),s.style.position="sticky",s.style.right=f+"px",n.querySelectorAll(`.data-grid-row .cell[data-field="${t.field}"]`).forEach(t=>{t.classList.add(e),t.style.position="sticky",t.style.right=f+"px"}),f+=s.offsetWidth)}const u=[],h=function(s,n,i,r,o){const l={addGroupEnd:/* @__PURE__ */new Set,removeGroupEnd:/* @__PURE__ */new Set},d=Array.from(s.querySelectorAll(".header-group-row .header-group-cell"));if(!d.length)return l;for(const a of d){const s=a.style.gridColumn;if(!s)continue;const d=s.match(/^(\d+)\s*\/\s*span\s+(\d+)$/);if(!d)continue;const c=parseInt(d[1],10)-1,f=c+parseInt(d[2],10)-1,u=n.slice(c,f+1);if(!u.length)continue;const h=u.every(t=>g(t,r)),p=u.every(t=>m(t,r));if(h){const e=u[0].field,s=i.find(t=>t.getAttribute("data-field")===e);s&&(a.classList.add(t),a.style.position="sticky",a.style.left=s.style.left)}else if(p){const t=u[u.length-1].field,s=i.find(e=>e.getAttribute("data-field")===t);s&&(a.classList.add(e),a.style.position="sticky",a.style.right=s.style.right)}else if(a.classList.contains("implicit-group"))v(a,u,c,i,r,l);else{const t=u.some(t=>g(t,r)),e=u.some(t=>m(t,r));(t||e)&&w(a,u,c,i,r,l,o)}}return l}(n,i,o,l,u);if(h.addGroupEnd.size>0||h.removeGroupEnd.size>0){for(const t of h.addGroupEnd){const e=o.find(e=>e.getAttribute("data-field")===t);e&&e.classList.add("group-end"),n.querySelectorAll(`.data-grid-row .cell[data-field="${t}"]`).forEach(t=>{t.classList.add("group-end")})}for(const t of h.removeGroupEnd){const e=o.find(e=>e.getAttribute("data-field")===t);e&&e.classList.remove("group-end"),n.querySelectorAll(`.data-grid-row .cell[data-field="${t}"]`).forEach(t=>{t.classList.remove("group-end")})}}return{groupEndAdjustments:h,leftOffsets:d,rightOffsets:a,splitGroups:u}}function E(t,e){return g(t,e)?"left":m(t,e)?"right":"none"}function v(s,n,i,r,o,l){const d=[];for(let t=0;t<n.length;t++){const e=E(n[t],o),s=d[d.length-1];s&&s.state===e?s.cols.push(n[t]):d.push({state:e,cols:[n[t]],colStart:i+t})}if(d.length<=1)return;const a=s.parentElement;if(!a)return;const c=s.nextSibling;a.removeChild(s);for(const f of d){const n=document.createElement("div");if(n.className=s.className,n.setAttribute("data-group",s.getAttribute("data-group")||""),n.style.gridColumn=`${f.colStart+1} / span ${f.cols.length}`,"left"===f.state){const e=f.cols[0].field,s=r.find(t=>t.getAttribute("data-field")===e);s&&(n.classList.add(t),n.style.position="sticky",n.style.left=s.style.left)}else if("right"===f.state){const t=f.cols[f.cols.length-1].field,s=r.find(e=>e.getAttribute("data-field")===t);s&&(n.classList.add(e),n.style.position="sticky",n.style.right=s.style.right)}else if("none"===f.state){f.cols.every(t=>String(t.field||"").startsWith("__tbw_"))&&(n.style.borderRightStyle="none")}c?a.insertBefore(n,c):a.appendChild(n)}for(let t=0;t<d.length;t++){const e=d[t],s=d[t+1];if("none"!==e.state&&s&&"none"===s.state){const t=e.cols[e.cols.length-1].field;t&&l.addGroupEnd.add(t)}if("none"===e.state){if(e.cols.every(t=>String(t.field||"").startsWith("__tbw_"))){const t=e.cols[e.cols.length-1].field;t&&l.removeGroupEnd.add(t)}}}}function w(s,n,i,r,o,l,d){const a=[];for(let t=0;t<n.length;t++){const e=E(n[t],o),s=a[a.length-1];s&&s.state===e?s.cols.push(n[t]):a.push({state:e,cols:[n[t]],colStart:i+t})}if(a.length<=1)return;const c=s.parentElement;if(!c)return;const f=s.textContent||"",u=s.getAttribute("data-group")||"",h=s.nextSibling;c.removeChild(s);const p=a.findIndex(t=>"left"===t.state);let g=-1;for(let t=a.length-1;t>=0;t--)if("right"===a[t].state){g=t;break}const m=p>=0?p:g,y=p>=0&&p+1<a.length?p+1:g>=0&&g-1>=0?g-1:-1;let b,v,w,A="";for(let E=0;E<a.length;E++){const n=a[E],i=document.createElement("div");if(i.className=s.className,i.setAttribute("data-group",u),i.style.gridColumn=`${n.colStart+1} / span ${n.cols.length}`,"left"===n.state){const e=n.cols[0].field,s=r.find(t=>t.getAttribute("data-field")===e);s&&(i.classList.add(t),i.style.position="sticky",i.style.left=s.style.left,s.style.left),E===m&&(i.style.borderRightStyle="none",b=i,A=n.cols[n.cols.length-1].field)}else if("right"===n.state){const t=n.cols[n.cols.length-1].field,s=r.find(e=>e.getAttribute("data-field")===t);s&&(i.classList.add(e),i.style.position="sticky",i.style.right=s.style.right),E===m&&(i.style.borderLeftStyle="none",b=i,A=n.cols[0].field)}if(E===y){i.style.overflow="visible";const t=document.createElement("span");t.textContent=f,t.style.position="relative",t.style.zIndex="36",t.style.display="block",t.style.overflow="hidden",t.style.textOverflow="ellipsis",t.style.whiteSpace="nowrap",i.appendChild(t),v=i,w=t}h?c.insertBefore(i,h):c.appendChild(i)}b&&v&&w&&A&&d.push({groupId:u,label:f,pinnedFragment:b,scrollableFragment:v,floatLabel:w,pinnedField:A,isTransferred:!1,floatOffset:0})}function A(s){s.querySelectorAll(`.${t}, .${e}`).forEach(s=>{s.classList.remove(t,e),s.style.position="",s.style.left="",s.style.right=""})}const C="canMoveColumn";class S extends u{static manifest={ownedProperties:[{property:"pinned",level:"column",description:'the "pinned" column property',isUsed:t=>"left"===t||"right"===t||"start"===t||"end"===t},{property:"sticky",level:"column",description:'the "sticky" column property (deprecated, use "pinned")',isUsed:t=>"left"===t||"right"===t||"start"===t||"end"===t}],queries:[{type:C,description:"Prevents pinned (sticky) columns from being moved/reordered"},{type:"getStickyOffsets",description:"Returns the sticky offsets for left/right pinned columns"},{type:"getContextMenuItems",description:"Contributes pin/unpin items to the header context menu"}]};name="pinnedColumns";get defaultConfig(){return{}}isApplied=!1;leftOffsets=/* @__PURE__ */new Map;rightOffsets=/* @__PURE__ */new Map;#e={addGroupEnd:/* @__PURE__ */new Set,removeGroupEnd:/* @__PURE__ */new Set};#s=[];#n=[];detach(){this.leftOffsets.clear(),this.rightOffsets.clear(),this.isApplied=!1,this.#e={addGroupEnd:/* @__PURE__ */new Set,removeGroupEnd:/* @__PURE__ */new Set},this.#s=[],this.#n=[]}static detect(t,e){const s=e?.columns;return!!Array.isArray(s)&&y(s)}processColumns(t){const e=[...t];if(this.isApplied=y(e),!this.isApplied)return e;const n=this.gridElement;return function(t,e="ltr"){const s=[],n=[],i=[];for(const r of t){const t=h(r);t?"left"===p(t,e)?s.push(r):i.push(r):n.push(r)}return[...s,...n,...i]}(e,n?s(n):"ltr")}afterRender(){if(!this.isApplied)return;const t=this.gridElement,e=[...this.columns];if(!y(e))return A(t),void(this.isApplied=!1);queueMicrotask(()=>{const s=b(t,e);this.#e=s.groupEndAdjustments,this.leftOffsets=s.leftOffsets,this.rightOffsets=s.rightOffsets,this.#s=s.splitGroups,this.#i()})}afterCellRender(s){if(!this.isApplied)return;const n=s.column.field,i=s.cellElement,r=this.leftOffsets.get(n);if(void 0!==r)i.classList.contains(t)||i.classList.add(t),i.style.position="sticky",i.style.left=r+"px";else{const t=this.rightOffsets.get(n);void 0!==t&&(i.classList.contains(e)||i.classList.add(e),i.style.position="sticky",i.style.right=t+"px")}this.#e.addGroupEnd.has(n)?s.cellElement.classList.add("group-end"):this.#e.removeGroupEnd.has(n)&&s.cellElement.classList.remove("group-end")}onScroll(t){this.#i()}#i(){if(!this.isApplied||0===this.#s.length)return;const t=this.gridElement;for(const e of this.#s){const s=e.pinnedFragment.getBoundingClientRect(),n=e.scrollableFragment.getBoundingClientRect().right<=s.right;if(n&&!e.isTransferred?(e.pinnedFragment.textContent=e.label,e.pinnedFragment.style.overflow="hidden",e.pinnedFragment.style.textOverflow="ellipsis",e.pinnedFragment.style.whiteSpace="nowrap",e.pinnedFragment.style.borderRightStyle="",e.floatLabel.style.visibility="hidden",e.floatLabel.style.transform="",e.floatOffset=0,this.#e.addGroupEnd.add(e.pinnedField),t.querySelectorAll(`.header-row .cell[data-field="${e.pinnedField}"], .data-grid-row .cell[data-field="${e.pinnedField}"]`).forEach(t=>t.classList.add("group-end")),e.isTransferred=!0):!n&&e.isTransferred&&(e.pinnedFragment.textContent="",e.pinnedFragment.style.overflow="",e.pinnedFragment.style.textOverflow="",e.pinnedFragment.style.whiteSpace="",e.pinnedFragment.style.borderRightStyle="none",e.floatLabel.style.visibility="",e.floatLabel.style.transform="",e.floatOffset=0,this.#e.addGroupEnd.delete(e.pinnedField),t.querySelectorAll(`.header-row .cell[data-field="${e.pinnedField}"], .data-grid-row .cell[data-field="${e.pinnedField}"]`).forEach(t=>t.classList.remove("group-end")),e.isTransferred=!1),!e.isTransferred){const t=e.floatLabel.getBoundingClientRect().left-e.floatOffset,n=s.left;t<n?(e.floatOffset=n-t,e.floatLabel.style.transform=`translateX(${e.floatOffset}px)`):(e.floatOffset=0,e.floatLabel.style.transform="")}}}handleQuery(t){switch(t.type){case C:return null==h(t.context)&&void 0;case"getStickyOffsets":return{left:Object.fromEntries(this.leftOffsets),right:Object.fromEntries(this.rightOffsets)};case"getContextMenuItems":{const e=t.context;if(!e.isHeader)return;const s=e.column;if(!s?.field)return;if(s.meta?.lockPinning)return;const n=[];return null!=h(s)?n.push({id:"pinned/unpin",label:"Unpin Column",icon:"📌",order:40,action:()=>this.setPinPosition(s.field,void 0)}):(n.push({id:"pinned/pin-left",label:"Pin Left",icon:"⬅",order:40,action:()=>this.setPinPosition(s.field,"left")}),n.push({id:"pinned/pin-right",label:"Pin Right",icon:"➡",order:41,action:()=>this.setPinPosition(s.field,"right")})),n}default:return}}setPinPosition(t,e){const s=this.columns;if(!s?.length)return;const n=s.findIndex(e=>e.field===t);if(-1===n)return;const i=this.gridElement;if(e){0===this.#n.length&&(this.#n=s.map(t=>t.field));const n=s.map(s=>{if(s.field!==t)return s;const n={...s};return n.pinned=e,delete n.sticky,n});i.columns=n}else{const e={...s[n]};delete e.pinned,delete e.sticky;const r=[...s];r.splice(n,1);const o=this.#n.indexOf(t);if(o>=0){let t=r.length;for(let e=0;e<r.length;e++){if(h(r[e]))continue;if(this.#n.indexOf(r[e].field)>o){t=e;break}}r.splice(t,0,e)}else r.splice(Math.min(n,r.length),0,e);r.some(t=>null!=h(t))||(this.#n=[]),i.columns=r}}refreshStickyOffsets(){const t=[...this.columns],e=b(this.gridElement,t);this.#e=e.groupEndAdjustments,this.leftOffsets=e.leftOffsets,this.rightOffsets=e.rightOffsets,this.#s=e.splitGroups}getLeftPinnedColumns(){return function(t,e="ltr"){return t.filter(t=>g(t,e))}([...this.columns],s(this.gridElement))}getRightPinnedColumns(){return function(t,e="ltr"){return t.filter(t=>m(t,e))}([...this.columns],s(this.gridElement))}clearStickyPositions(){A(this.gridElement)}getHorizontalScrollOffsets(s,n){if(!this.isApplied)return;let i=0,r=0;if(s){const n=s.querySelectorAll(`.${t}`),o=s.querySelectorAll(`.${e}`);n.forEach(t=>{i+=t.offsetWidth}),o.forEach(t=>{r+=t.offsetWidth})}else{this.gridElement.querySelectorAll(".header-row .cell").forEach(s=>{s.classList.contains(t)?i+=s.offsetWidth:s.classList.contains(e)&&(r+=s.offsetWidth)})}const o=n?.classList.contains(t)||n?.classList.contains(e);return{left:i,right:r,skipScroll:o}}}export{S as PinnedColumnsPlugin};
|
|
1
|
+
const t="sticky-left",e="sticky-right";function s(t){try{if("rtl"===getComputedStyle(t).direction)return"rtl"}catch{}try{const e=t.closest?.("[dir]")?.getAttribute("dir");if("rtl"===e)return"rtl"}catch{}return"ltr"}function n(t,e){return`[tbw-grid${t?`#${t}`:""}${e?`:${e}`:""}]`}function i(t,e,s,i){return`${n(s,i)} ${t}: ${e}\n\n → More info: ${function(t){return`https://toolboxjs.com/grid/errors#${t.toLowerCase()}`}(t)}`}["__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"]),o=/^on\w+$/i,l=/* @__PURE__ */new Set(["href","src","action","formaction","data","srcdoc","xlink:href","poster","srcset"]),d=/^\s*(javascript|vbscript|data|blob):/i;function a(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=[],s=t.querySelectorAll("*");for(const n of s){const t=n.tagName.toLowerCase();if(r.has(t)){e.push(n);continue}if("svg"===t||"http://www.w3.org/2000/svg"===n.namespaceURI){if(Array.from(n.attributes).some(t=>o.test(t.name)||"href"===t.name||"xlink:href"===t.name)){e.push(n);continue}}const s=[];for(const e of n.attributes){const t=e.name.toLowerCase();o.test(t)?s.push(e.name):(l.has(t)&&d.test(e.value)||"style"===t&&/expression\s*\(|javascript:|behavior\s*:/i.test(e.value))&&s.push(e.name)}s.forEach(t=>n.removeAttribute(t))}e.forEach(t=>t.remove())}(e.content),e.innerHTML}const c='<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>',f={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:c,filterActive:c,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 s=new CustomEvent(t,{detail:e,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(s),s.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{...f,...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(),s=parseInt(e,10);if(!isNaN(s))return s}return 200}resolveIcon(t,e){return void 0!==e?e:this.gridIcons[t]}setIcon(t,e,s){t.dataset.icon=e.replace(/([A-Z])/g,"-$1").toLowerCase(),"collapse"===e?t.dataset.expanded="":"expand"===e&&delete t.dataset.expanded;const n=this.#e(e,s);void 0!==n?"string"==typeof n?t.innerHTML=a(n):n instanceof HTMLElement&&(t.innerHTML="",t.appendChild(n.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 s=document.createElement("span");s.setAttribute("part","sort-indicator"),s.className="sort-indicator",e?(t.setAttribute("aria-sort","asc"===e?"ascending":"descending"),t.setAttribute("data-sort",e),this.setIcon(s,"asc"===e?"sortAsc":"sortDesc")):(t.setAttribute("aria-sort","none"),t.removeAttribute("data-sort"),this.setIcon(s,"sortNone"));const n=t.querySelector(".tbw-filter-btn")??t.querySelector(".resize-handle");return n?t.insertBefore(s,n):t.appendChild(s),s}warn(t,e){void 0!==e?console.warn(i(t,e,this.gridElement.id,this.name)):console.warn(`${n(this.gridElement.id,this.name)} ${t}`)}throwDiagnostic(t,e){throw new Error(i(t,e,this.gridElement.id,this.name))}}function p(t){return t.pinned??t.sticky??t.meta?.pinned??t.meta?.sticky}function h(t,e){return function(t,e){return"left"===t||"right"===t?t:"rtl"===e?"start"===t?"right":"left":"start"===t?"left":"right"}(t,e)}function g(t,e){const s=p(t);return!!s&&"left"===h(s,e)}function m(t,e){const s=p(t);return!!s&&"right"===h(s,e)}function y(t){return t.some(t=>null!=p(t))}function b(n,i){const r={groupEndAdjustments:{addGroupEnd:/* @__PURE__ */new Set,removeGroupEnd:/* @__PURE__ */new Set},leftOffsets:/* @__PURE__ */new Map,rightOffsets:/* @__PURE__ */new Map,splitGroups:[]},o=Array.from(n.querySelectorAll(".header-row .cell"));if(!o.length)return r;const l=s(n),d=/* @__PURE__ */new Map,a=/* @__PURE__ */new Map;let c=0;for(const e of i)if(g(e,l)){const s=o.find(t=>t.getAttribute("data-field")===e.field);s&&(d.set(e.field,c),s.classList.add(t),s.style.position="sticky",s.style.left=c+"px",n.querySelectorAll(`.data-grid-row .cell[data-field="${e.field}"]`).forEach(e=>{e.classList.add(t),e.style.position="sticky",e.style.left=c+"px"}),c+=s.offsetWidth)}let f=0;for(const t of[...i].reverse())if(m(t,l)){const s=o.find(e=>e.getAttribute("data-field")===t.field);s&&(a.set(t.field,f),s.classList.add(e),s.style.position="sticky",s.style.right=f+"px",n.querySelectorAll(`.data-grid-row .cell[data-field="${t.field}"]`).forEach(t=>{t.classList.add(e),t.style.position="sticky",t.style.right=f+"px"}),f+=s.offsetWidth)}const u=[],p=function(s,n,i,r,o){const l={addGroupEnd:/* @__PURE__ */new Set,removeGroupEnd:/* @__PURE__ */new Set},d=Array.from(s.querySelectorAll(".header-group-row .header-group-cell"));if(!d.length)return l;for(const a of d){const s=a.style.gridColumn;if(!s)continue;const d=s.match(/^(\d+)\s*\/\s*span\s+(\d+)$/);if(!d)continue;const c=parseInt(d[1],10)-1,f=c+parseInt(d[2],10)-1,u=n.slice(c,f+1);if(!u.length)continue;const p=u.every(t=>g(t,r)),h=u.every(t=>m(t,r));if(p){const e=u[0].field,s=i.find(t=>t.getAttribute("data-field")===e);s&&(a.classList.add(t),a.style.position="sticky",a.style.left=s.style.left)}else if(h){const t=u[u.length-1].field,s=i.find(e=>e.getAttribute("data-field")===t);s&&(a.classList.add(e),a.style.position="sticky",a.style.right=s.style.right)}else if(a.classList.contains("implicit-group"))v(a,u,c,i,r,l);else{const t=u.some(t=>g(t,r)),e=u.some(t=>m(t,r));(t||e)&&w(a,u,c,i,r,l,o)}}return l}(n,i,o,l,u);if(p.addGroupEnd.size>0||p.removeGroupEnd.size>0){for(const t of p.addGroupEnd){const e=o.find(e=>e.getAttribute("data-field")===t);e&&e.classList.add("group-end"),n.querySelectorAll(`.data-grid-row .cell[data-field="${t}"]`).forEach(t=>{t.classList.add("group-end")})}for(const t of p.removeGroupEnd){const e=o.find(e=>e.getAttribute("data-field")===t);e&&e.classList.remove("group-end"),n.querySelectorAll(`.data-grid-row .cell[data-field="${t}"]`).forEach(t=>{t.classList.remove("group-end")})}}return{groupEndAdjustments:p,leftOffsets:d,rightOffsets:a,splitGroups:u}}function E(t,e){return g(t,e)?"left":m(t,e)?"right":"none"}function v(s,n,i,r,o,l){const d=[];for(let t=0;t<n.length;t++){const e=E(n[t],o),s=d[d.length-1];s&&s.state===e?s.cols.push(n[t]):d.push({state:e,cols:[n[t]],colStart:i+t})}if(d.length<=1)return;const a=s.parentElement;if(!a)return;const c=s.nextSibling;a.removeChild(s);for(const f of d){const n=document.createElement("div");if(n.className=s.className,n.setAttribute("data-group",s.getAttribute("data-group")||""),n.style.gridColumn=`${f.colStart+1} / span ${f.cols.length}`,"left"===f.state){const e=f.cols[0].field,s=r.find(t=>t.getAttribute("data-field")===e);s&&(n.classList.add(t),n.style.position="sticky",n.style.left=s.style.left)}else if("right"===f.state){const t=f.cols[f.cols.length-1].field,s=r.find(e=>e.getAttribute("data-field")===t);s&&(n.classList.add(e),n.style.position="sticky",n.style.right=s.style.right)}else if("none"===f.state){f.cols.every(t=>String(t.field||"").startsWith("__tbw_"))&&(n.style.borderRightStyle="none")}c?a.insertBefore(n,c):a.appendChild(n)}for(let t=0;t<d.length;t++){const e=d[t],s=d[t+1];if("none"!==e.state&&s&&"none"===s.state){const t=e.cols[e.cols.length-1].field;t&&l.addGroupEnd.add(t)}if("none"===e.state){if(e.cols.every(t=>String(t.field||"").startsWith("__tbw_"))){const t=e.cols[e.cols.length-1].field;t&&l.removeGroupEnd.add(t)}}}}function w(s,n,i,r,o,l,d){const a=[];for(let t=0;t<n.length;t++){const e=E(n[t],o),s=a[a.length-1];s&&s.state===e?s.cols.push(n[t]):a.push({state:e,cols:[n[t]],colStart:i+t})}if(a.length<=1)return;const c=s.parentElement;if(!c)return;const f=s.textContent||"",u=s.getAttribute("data-group")||"",p=s.nextSibling;c.removeChild(s);const h=a.findIndex(t=>"left"===t.state);let g=-1;for(let t=a.length-1;t>=0;t--)if("right"===a[t].state){g=t;break}const m=h>=0?h:g,y=h>=0&&h+1<a.length?h+1:g>=0&&g-1>=0?g-1:-1;let b,v,w,A="";for(let E=0;E<a.length;E++){const n=a[E],i=document.createElement("div");if(i.className=s.className,i.setAttribute("data-group",u),i.style.gridColumn=`${n.colStart+1} / span ${n.cols.length}`,"left"===n.state){const e=n.cols[0].field,s=r.find(t=>t.getAttribute("data-field")===e);s&&(i.classList.add(t),i.style.position="sticky",i.style.left=s.style.left,s.style.left),E===m&&(i.style.borderRightStyle="none",b=i,A=n.cols[n.cols.length-1].field)}else if("right"===n.state){const t=n.cols[n.cols.length-1].field,s=r.find(e=>e.getAttribute("data-field")===t);s&&(i.classList.add(e),i.style.position="sticky",i.style.right=s.style.right),E===m&&(i.style.borderLeftStyle="none",b=i,A=n.cols[0].field)}if(E===y){i.style.overflow="visible";const t=document.createElement("span");t.textContent=f,t.style.position="relative",t.style.zIndex="36",t.style.display="block",t.style.overflow="hidden",t.style.textOverflow="ellipsis",t.style.whiteSpace="nowrap",i.appendChild(t),v=i,w=t}p?c.insertBefore(i,p):c.appendChild(i)}b&&v&&w&&A&&d.push({groupId:u,label:f,pinnedFragment:b,scrollableFragment:v,floatLabel:w,pinnedField:A,isTransferred:!1,floatOffset:0})}function A(s){s.querySelectorAll(`.${t}, .${e}`).forEach(s=>{s.classList.remove(t,e),s.style.position="",s.style.left="",s.style.right=""})}const S="canMoveColumn";class C extends u{static manifest={ownedProperties:[{property:"pinned",level:"column",description:'the "pinned" column property',isUsed:t=>"left"===t||"right"===t||"start"===t||"end"===t},{property:"sticky",level:"column",description:'the "sticky" column property (deprecated, use "pinned")',isUsed:t=>"left"===t||"right"===t||"start"===t||"end"===t}],queries:[{type:S,description:"Prevents pinned (sticky) columns from being moved/reordered"},{type:"getStickyOffsets",description:"Returns the sticky offsets for left/right pinned columns"},{type:"getContextMenuItems",description:"Contributes pin/unpin items to the header context menu"}]};name="pinnedColumns";get defaultConfig(){return{}}isApplied=!1;leftOffsets=/* @__PURE__ */new Map;rightOffsets=/* @__PURE__ */new Map;#s={addGroupEnd:/* @__PURE__ */new Set,removeGroupEnd:/* @__PURE__ */new Set};#n=[];#i=[];detach(){this.leftOffsets.clear(),this.rightOffsets.clear(),this.isApplied=!1,this.#s={addGroupEnd:/* @__PURE__ */new Set,removeGroupEnd:/* @__PURE__ */new Set},this.#n=[],this.#i=[]}static detect(t,e){const s=e?.columns;return!!Array.isArray(s)&&y(s)}processColumns(t){const e=[...t];if(this.isApplied=y(e),!this.isApplied)return e;const n=this.gridElement;return function(t,e="ltr"){const s=[],n=[],i=[];for(const r of t){const t=p(r);t?"left"===h(t,e)?s.push(r):i.push(r):n.push(r)}return[...s,...n,...i]}(e,n?s(n):"ltr")}afterRender(){if(!this.isApplied)return;const t=this.gridElement,e=[...this.columns];if(!y(e))return A(t),void(this.isApplied=!1);queueMicrotask(()=>{const s=b(t,e);this.#s=s.groupEndAdjustments,this.leftOffsets=s.leftOffsets,this.rightOffsets=s.rightOffsets,this.#n=s.splitGroups,this.#r()})}afterCellRender(s){if(!this.isApplied)return;const n=s.column.field,i=s.cellElement,r=this.leftOffsets.get(n);if(void 0!==r)i.classList.contains(t)||i.classList.add(t),i.style.position="sticky",i.style.left=r+"px";else{const t=this.rightOffsets.get(n);void 0!==t&&(i.classList.contains(e)||i.classList.add(e),i.style.position="sticky",i.style.right=t+"px")}this.#s.addGroupEnd.has(n)?s.cellElement.classList.add("group-end"):this.#s.removeGroupEnd.has(n)&&s.cellElement.classList.remove("group-end")}onScroll(t){this.#r()}#r(){if(!this.isApplied||0===this.#n.length)return;const t=this.gridElement;for(const e of this.#n){const s=e.pinnedFragment.getBoundingClientRect(),n=e.scrollableFragment.getBoundingClientRect().right<=s.right;if(n&&!e.isTransferred?(e.pinnedFragment.textContent=e.label,e.pinnedFragment.style.overflow="hidden",e.pinnedFragment.style.textOverflow="ellipsis",e.pinnedFragment.style.whiteSpace="nowrap",e.pinnedFragment.style.borderRightStyle="",e.floatLabel.style.visibility="hidden",e.floatLabel.style.transform="",e.floatOffset=0,this.#s.addGroupEnd.add(e.pinnedField),t.querySelectorAll(`.header-row .cell[data-field="${e.pinnedField}"], .data-grid-row .cell[data-field="${e.pinnedField}"]`).forEach(t=>t.classList.add("group-end")),e.isTransferred=!0):!n&&e.isTransferred&&(e.pinnedFragment.textContent="",e.pinnedFragment.style.overflow="",e.pinnedFragment.style.textOverflow="",e.pinnedFragment.style.whiteSpace="",e.pinnedFragment.style.borderRightStyle="none",e.floatLabel.style.visibility="",e.floatLabel.style.transform="",e.floatOffset=0,this.#s.addGroupEnd.delete(e.pinnedField),t.querySelectorAll(`.header-row .cell[data-field="${e.pinnedField}"], .data-grid-row .cell[data-field="${e.pinnedField}"]`).forEach(t=>t.classList.remove("group-end")),e.isTransferred=!1),!e.isTransferred){const t=e.floatLabel.getBoundingClientRect().left-e.floatOffset,n=s.left;t<n?(e.floatOffset=n-t,e.floatLabel.style.transform=`translateX(${e.floatOffset}px)`):(e.floatOffset=0,e.floatLabel.style.transform="")}}}handleQuery(t){switch(t.type){case S:return null==p(t.context)&&void 0;case"getStickyOffsets":return{left:Object.fromEntries(this.leftOffsets),right:Object.fromEntries(this.rightOffsets)};case"getContextMenuItems":{const e=t.context;if(!e.isHeader)return;const s=e.column;if(!s?.field)return;if(s.meta?.lockPinning)return;const n=[];return null!=p(s)?n.push({id:"pinned/unpin",label:"Unpin Column",icon:"📌",order:40,action:()=>this.setPinPosition(s.field,void 0)}):(n.push({id:"pinned/pin-left",label:"Pin Left",icon:"⬅",order:40,action:()=>this.setPinPosition(s.field,"left")}),n.push({id:"pinned/pin-right",label:"Pin Right",icon:"➡",order:41,action:()=>this.setPinPosition(s.field,"right")})),n}default:return}}setPinPosition(t,e){const s=this.columns;if(!s?.length)return;const n=s.findIndex(e=>e.field===t);if(-1===n)return;const i=this.gridElement;if(e){0===this.#i.length&&(this.#i=s.map(t=>t.field));const n=s.map(s=>{if(s.field!==t)return s;const n={...s};return n.pinned=e,delete n.sticky,n});i.columns=n}else{const e={...s[n]};delete e.pinned,delete e.sticky;const r=[...s];r.splice(n,1);const o=this.#i.indexOf(t);if(o>=0){let t=r.length;for(let e=0;e<r.length;e++){if(p(r[e]))continue;if(this.#i.indexOf(r[e].field)>o){t=e;break}}r.splice(t,0,e)}else r.splice(Math.min(n,r.length),0,e);r.some(t=>null!=p(t))||(this.#i=[]),i.columns=r}}refreshStickyOffsets(){const t=[...this.columns],e=b(this.gridElement,t);this.#s=e.groupEndAdjustments,this.leftOffsets=e.leftOffsets,this.rightOffsets=e.rightOffsets,this.#n=e.splitGroups}getLeftPinnedColumns(){return function(t,e="ltr"){return t.filter(t=>g(t,e))}([...this.columns],s(this.gridElement))}getRightPinnedColumns(){return function(t,e="ltr"){return t.filter(t=>m(t,e))}([...this.columns],s(this.gridElement))}clearStickyPositions(){A(this.gridElement)}getHorizontalScrollOffsets(s,n){if(!this.isApplied)return;let i=0,r=0;if(s){const n=s.querySelectorAll(`.${t}`),o=s.querySelectorAll(`.${e}`);n.forEach(t=>{i+=t.offsetWidth}),o.forEach(t=>{r+=t.offsetWidth})}else{this.gridElement.querySelectorAll(".header-row .cell").forEach(s=>{s.classList.contains(t)?i+=s.offsetWidth:s.classList.contains(e)&&(r+=s.offsetWidth)})}const o=n?.classList.contains(t)||n?.classList.contains(e);return{left:i,right:r,skipScroll:o}}}export{C as PinnedColumnsPlugin};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|