@toolbox-web/grid 1.26.1 → 1.27.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/all.js +2 -2
- package/all.js.map +1 -1
- package/index.js +1 -1
- package/index.js.map +1 -1
- package/lib/core/grid.d.ts +64 -1
- package/lib/core/internal/diagnostics.d.ts +4 -3
- package/lib/core/internal/row-manager.d.ts +3 -1
- package/lib/core/plugin/base-plugin.d.ts +2 -2
- package/lib/core/types.d.ts +59 -3
- package/lib/features/registry.js.map +1 -1
- package/lib/plugins/clipboard/ClipboardPlugin.d.ts +1 -1
- package/lib/plugins/clipboard/index.js.map +1 -1
- package/lib/plugins/column-virtualization/index.js.map +1 -1
- package/lib/plugins/context-menu/ContextMenuPlugin.d.ts +24 -5
- package/lib/plugins/context-menu/index.js.map +1 -1
- package/lib/plugins/editing/EditingPlugin.d.ts +1 -1
- package/lib/plugins/editing/index.js.map +1 -1
- package/lib/plugins/export/ExportPlugin.d.ts +1 -1
- package/lib/plugins/export/index.js.map +1 -1
- package/lib/plugins/filtering/index.d.ts +2 -2
- package/lib/plugins/filtering/index.js +1 -1
- package/lib/plugins/filtering/index.js.map +1 -1
- package/lib/plugins/grouping-columns/GroupingColumnsPlugin.d.ts +2 -2
- package/lib/plugins/grouping-columns/grouping-columns.d.ts +18 -3
- package/lib/plugins/grouping-columns/index.d.ts +0 -1
- package/lib/plugins/grouping-columns/index.js +1 -1
- package/lib/plugins/grouping-columns/index.js.map +1 -1
- package/lib/plugins/grouping-columns/types.d.ts +1 -7
- package/lib/plugins/grouping-rows/index.d.ts +2 -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/MasterDetailPlugin.d.ts +2 -0
- package/lib/plugins/master-detail/index.js +1 -1
- package/lib/plugins/master-detail/index.js.map +1 -1
- package/lib/plugins/master-detail/types.d.ts +20 -1
- package/lib/plugins/multi-sort/index.js.map +1 -1
- package/lib/plugins/pinned-columns/PinnedColumnsPlugin.d.ts +8 -1
- package/lib/plugins/pinned-columns/index.js +1 -1
- package/lib/plugins/pinned-columns/index.js.map +1 -1
- package/lib/plugins/pinned-columns/pinned-columns.d.ts +11 -1
- package/lib/plugins/pinned-rows/index.d.ts +1 -1
- package/lib/plugins/pinned-rows/index.js +1 -1
- package/lib/plugins/pinned-rows/index.js.map +1 -1
- package/lib/plugins/pinned-rows/types.d.ts +10 -3
- package/lib/plugins/pivot/PivotPlugin.d.ts +107 -1
- package/lib/plugins/pivot/index.d.ts +2 -1
- package/lib/plugins/pivot/index.js +1 -1
- package/lib/plugins/pivot/index.js.map +1 -1
- package/lib/plugins/print/index.js.map +1 -1
- package/lib/plugins/print/types.d.ts +0 -3
- package/lib/plugins/reorder-columns/ReorderPlugin.d.ts +19 -2
- 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.d.ts +1 -1
- package/lib/plugins/reorder-rows/index.js.map +1 -1
- package/lib/plugins/responsive/ResponsivePlugin.d.ts +1 -1
- package/lib/plugins/responsive/index.js +1 -1
- package/lib/plugins/responsive/index.js.map +1 -1
- package/lib/plugins/selection/SelectionPlugin.d.ts +1 -1
- package/lib/plugins/selection/index.js +1 -1
- package/lib/plugins/selection/index.js.map +1 -1
- package/lib/plugins/selection/types.d.ts +3 -3
- package/lib/plugins/server-side/ServerSidePlugin.d.ts +6 -1
- package/lib/plugins/server-side/index.js +1 -1
- package/lib/plugins/server-side/index.js.map +1 -1
- package/lib/plugins/tree/TreePlugin.d.ts +116 -0
- package/lib/plugins/tree/index.d.ts +1 -1
- package/lib/plugins/tree/index.js +1 -1
- package/lib/plugins/tree/index.js.map +1 -1
- package/lib/plugins/tree/types.d.ts +16 -1
- package/lib/plugins/undo-redo/UndoRedoPlugin.d.ts +1 -1
- package/lib/plugins/undo-redo/index.js.map +1 -1
- package/lib/plugins/undo-redo/types.d.ts +15 -3
- package/lib/plugins/visibility/VisibilityPlugin.d.ts +18 -5
- package/lib/plugins/visibility/index.js +1 -1
- package/lib/plugins/visibility/index.js.map +1 -1
- package/package.json +1 -1
- package/public.d.ts +2 -4
- package/themes/dg-theme-material.css +16 -4
- 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/clipboard.umd.js.map +1 -1
- package/umd/plugins/context-menu.umd.js.map +1 -1
- package/umd/plugins/editing.umd.js.map +1 -1
- package/umd/plugins/export.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-columns.umd.js +1 -1
- package/umd/plugins/grouping-columns.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/pinned-columns.umd.js +1 -1
- package/umd/plugins/pinned-columns.umd.js.map +1 -1
- package/umd/plugins/pinned-rows.umd.js +1 -1
- package/umd/plugins/pinned-rows.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/reorder-columns.umd.js +1 -1
- package/umd/plugins/reorder-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
- package/umd/plugins/server-side.umd.js +1 -1
- package/umd/plugins/server-side.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/undo-redo.umd.js.map +1 -1
- package/umd/plugins/visibility.umd.js +1 -1
- package/umd/plugins/visibility.umd.js.map +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { PluginManifest, PluginQuery, BaseGridPlugin } from '../../core/plugin/base-plugin';
|
|
1
|
+
import { AfterCellRenderContext, PluginManifest, PluginQuery, BaseGridPlugin } from '../../core/plugin/base-plugin';
|
|
2
2
|
import { ColumnConfig } from '../../core/types';
|
|
3
3
|
import { PinnedColumnsConfig, PinnedPosition } from './types';
|
|
4
4
|
/**
|
|
@@ -95,6 +95,13 @@ export declare class PinnedColumnsPlugin extends BaseGridPlugin<PinnedColumnsCon
|
|
|
95
95
|
processColumns(columns: readonly ColumnConfig[]): ColumnConfig[];
|
|
96
96
|
/** @internal */
|
|
97
97
|
afterRender(): void;
|
|
98
|
+
/**
|
|
99
|
+
* Maintain group-end adjustments on cells rendered during scroll.
|
|
100
|
+
* Runs after GroupingColumnsPlugin.afterCellRender (which sets group-end
|
|
101
|
+
* based on group boundaries), overriding it at pin boundaries.
|
|
102
|
+
* @internal
|
|
103
|
+
*/
|
|
104
|
+
afterCellRender(context: AfterCellRenderContext): void;
|
|
98
105
|
/**
|
|
99
106
|
* Handle inter-plugin queries.
|
|
100
107
|
* @internal
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
function t(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 e(t,e){return`[tbw-grid${t?`#${t}`:""}${e?`:${e}`:""}]`}function i(t,i,n,r){return`${e(n,r)} ${t}: ${i}\n\n → More info: ${function(t){return`https://toolboxjs.com/grid/errors#${t.toLowerCase()}`}(t)}`}const n='<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>',r={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:n,filterActive:n,print:"🖨️"};class s{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 i=new CustomEvent(t,{detail:e,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(i),i.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{...r,...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(),i=parseInt(e,10);if(!isNaN(i))return i}return 200}resolveIcon(t,e){return void 0!==e?e:this.gridIcons[t]}setIcon(t,e){"string"==typeof e?t.innerHTML=e:e instanceof HTMLElement&&(t.innerHTML="",t.appendChild(e.cloneNode(!0)))}warn(t,n){void 0!==n?console.warn(i(t,n,this.gridElement.id,this.name)):console.warn(`${e(this.gridElement.id,this.name)} ${t}`)}throwDiagnostic(t,e){throw new Error(i(t,e,this.gridElement.id,this.name))}}function o(t){return t.pinned??t.sticky??t.meta?.pinned??t.meta?.sticky}function l(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 c(t,e){const i=o(t);return!!i&&"left"===l(i,e)}function d(t,e){const i=o(t);return!!i&&"right"===l(i,e)}function u(t){return t.some(t=>null!=o(t))}function a(e,i){const n=Array.from(e.querySelectorAll(".header-row .cell"));if(!n.length)return;const r=t(e);let s=0;for(const t of i)if(c(t,r)){const i=n.find(e=>e.getAttribute("data-field")===t.field);i&&(i.classList.add("sticky-left"),i.style.position="sticky",i.style.left=s+"px",e.querySelectorAll(`.data-grid-row .cell[data-field="${t.field}"]`).forEach(t=>{t.classList.add("sticky-left"),t.style.position="sticky",t.style.left=s+"px"}),s+=i.offsetWidth)}let o=0;for(const t of[...i].reverse())if(d(t,r)){const i=n.find(e=>e.getAttribute("data-field")===t.field);i&&(i.classList.add("sticky-right"),i.style.position="sticky",i.style.right=o+"px",e.querySelectorAll(`.data-grid-row .cell[data-field="${t.field}"]`).forEach(t=>{t.classList.add("sticky-right"),t.style.position="sticky",t.style.right=o+"px"}),o+=i.offsetWidth)}}function f(t){t.querySelectorAll(".sticky-left, .sticky-right").forEach(t=>{t.classList.remove("sticky-left","sticky-right"),t.style.position="",t.style.left="",t.style.right=""})}const h="canMoveColumn";class g extends s{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}],incompatibleWith:[{name:"groupingColumns",reason:"Pinning reorders columns to the grid edges, but moving a column out of its column group is not supported. The group header layout cannot accommodate members at different positions."}],queries:[{type:h,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=[];detach(){this.leftOffsets.clear(),this.rightOffsets.clear(),this.isApplied=!1,this.#e=[]}static detect(t,e){const i=e?.columns;return!!Array.isArray(i)&&u(i)}processColumns(e){const i=[...e];if(this.isApplied=u(i),!this.isApplied)return i;const n=this.gridElement;return function(t,e="ltr"){const i=[],n=[],r=[];for(const s of t){const t=o(s);t?"left"===l(t,e)?i.push(s):r.push(s):n.push(s)}return[...i,...n,...r]}(i,n?t(n):"ltr")}afterRender(){if(!this.isApplied)return;const t=this.gridElement,e=[...this.columns];if(!u(e))return f(t),void(this.isApplied=!1);queueMicrotask(()=>{a(t,e)})}handleQuery(t){switch(t.type){case h:return null==o(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 i=e.column;if(!i?.field)return;if(i.meta?.lockPinning)return;const n=this.grid?.getPluginByName("groupingColumns");if(n?.isGroupingActive())return;const r=[];return null!=o(i)?r.push({id:"pinned/unpin",label:"Unpin Column",icon:"📌",order:40,action:()=>this.setPinPosition(i.field,void 0)}):(r.push({id:"pinned/pin-left",label:"Pin Left",icon:"⬅",order:40,action:()=>this.setPinPosition(i.field,"left")}),r.push({id:"pinned/pin-right",label:"Pin Right",icon:"➡",order:41,action:()=>this.setPinPosition(i.field,"right")})),r}default:return}}setPinPosition(t,e){const i=this.columns;if(!i?.length)return;const n=i.findIndex(e=>e.field===t);if(-1===n)return;const r=this.gridElement;if(e){0===this.#e.length&&(this.#e=i.map(t=>t.field));const n=i.map(i=>{if(i.field!==t)return i;const n={...i};return n.pinned=e,delete n.sticky,n});r.columns=n}else{const e={...i[n]};delete e.pinned,delete e.sticky;const s=[...i];s.splice(n,1);const l=this.#e.indexOf(t);if(l>=0){let t=s.length;for(let e=0;e<s.length;e++){if(o(s[e]))continue;if(this.#e.indexOf(s[e].field)>l){t=e;break}}s.splice(t,0,e)}else s.splice(Math.min(n,s.length),0,e);s.some(t=>null!=o(t))||(this.#e=[]),r.columns=s}}refreshStickyOffsets(){const t=[...this.columns];a(this.gridElement,t)}getLeftPinnedColumns(){return function(t,e="ltr"){return t.filter(t=>c(t,e))}([...this.columns],t(this.gridElement))}getRightPinnedColumns(){return function(t,e="ltr"){return t.filter(t=>d(t,e))}([...this.columns],t(this.gridElement))}clearStickyPositions(){f(this.gridElement)}getHorizontalScrollOffsets(t,e){if(!this.isApplied)return;let i=0,n=0;if(t){const e=t.querySelectorAll(".sticky-left"),r=t.querySelectorAll(".sticky-right");e.forEach(t=>{i+=t.offsetWidth}),r.forEach(t=>{n+=t.offsetWidth})}else{this.gridElement.querySelectorAll(".header-row .cell").forEach(t=>{t.classList.contains("sticky-left")?i+=t.offsetWidth:t.classList.contains("sticky-right")&&(n+=t.offsetWidth)})}const r=e?.classList.contains("sticky-left")||e?.classList.contains("sticky-right");return{left:i,right:n,skipScroll:r}}}export{g as PinnedColumnsPlugin};
|
|
1
|
+
function t(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 e(t,e){return`[tbw-grid${t?`#${t}`:""}${e?`:${e}`:""}]`}function i(t,i,n,r){return`${e(n,r)} ${t}: ${i}\n\n → More info: ${function(t){return`https://toolboxjs.com/grid/errors#${t.toLowerCase()}`}(t)}`}const n='<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>',r={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:n,filterActive:n,print:"🖨️"};class s{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 i=new CustomEvent(t,{detail:e,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(i),i.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{...r,...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(),i=parseInt(e,10);if(!isNaN(i))return i}return 200}resolveIcon(t,e){return void 0!==e?e:this.gridIcons[t]}setIcon(t,e){"string"==typeof e?t.innerHTML=e:e instanceof HTMLElement&&(t.innerHTML="",t.appendChild(e.cloneNode(!0)))}warn(t,n){void 0!==n?console.warn(i(t,n,this.gridElement.id,this.name)):console.warn(`${e(this.gridElement.id,this.name)} ${t}`)}throwDiagnostic(t,e){throw new Error(i(t,e,this.gridElement.id,this.name))}}function o(t){return t.pinned??t.sticky??t.meta?.pinned??t.meta?.sticky}function l(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 d(t,e){const i=o(t);return!!i&&"left"===l(i,e)}function c(t,e){const i=o(t);return!!i&&"right"===l(i,e)}function a(t){return t.some(t=>null!=o(t))}function u(e,i){const n={addGroupEnd:/* @__PURE__ */new Set,removeGroupEnd:/* @__PURE__ */new Set},r=Array.from(e.querySelectorAll(".header-row .cell"));if(!r.length)return n;const s=t(e);let o=0;for(const t of i)if(d(t,s)){const i=r.find(e=>e.getAttribute("data-field")===t.field);i&&(i.classList.add("sticky-left"),i.style.position="sticky",i.style.left=o+"px",e.querySelectorAll(`.data-grid-row .cell[data-field="${t.field}"]`).forEach(t=>{t.classList.add("sticky-left"),t.style.position="sticky",t.style.left=o+"px"}),o+=i.offsetWidth)}let l=0;for(const t of[...i].reverse())if(c(t,s)){const i=r.find(e=>e.getAttribute("data-field")===t.field);i&&(i.classList.add("sticky-right"),i.style.position="sticky",i.style.right=l+"px",e.querySelectorAll(`.data-grid-row .cell[data-field="${t.field}"]`).forEach(t=>{t.classList.add("sticky-right"),t.style.position="sticky",t.style.right=l+"px"}),l+=i.offsetWidth)}const a=function(t,e,i,n){const r={addGroupEnd:/* @__PURE__ */new Set,removeGroupEnd:/* @__PURE__ */new Set},s=Array.from(t.querySelectorAll(".header-group-row .header-group-cell"));if(!s.length)return r;for(const o of s){const t=o.style.gridColumn;if(!t)continue;const s=t.match(/^(\d+)\s*\/\s*span\s+(\d+)$/);if(!s)continue;const l=parseInt(s[1],10)-1,a=l+parseInt(s[2],10)-1,u=e.slice(l,a+1);if(!u.length)continue;const f=u.every(t=>d(t,n)),g=u.every(t=>c(t,n));if(f){const t=u[0].field,e=i.find(e=>e.getAttribute("data-field")===t);e&&(o.classList.add("sticky-left"),o.style.position="sticky",o.style.left=e.style.left)}else if(g){const t=u[u.length-1].field,e=i.find(e=>e.getAttribute("data-field")===t);e&&(o.classList.add("sticky-right"),o.style.position="sticky",o.style.right=e.style.right)}else o.classList.contains("implicit-group")&&h(o,u,l,i,n,r)}return r}(e,i,r,s);if(a.addGroupEnd.size>0||a.removeGroupEnd.size>0){for(const t of a.addGroupEnd){const i=r.find(e=>e.getAttribute("data-field")===t);i&&i.classList.add("group-end"),e.querySelectorAll(`.data-grid-row .cell[data-field="${t}"]`).forEach(t=>{t.classList.add("group-end")})}for(const t of a.removeGroupEnd){const i=r.find(e=>e.getAttribute("data-field")===t);i&&i.classList.remove("group-end"),e.querySelectorAll(`.data-grid-row .cell[data-field="${t}"]`).forEach(t=>{t.classList.remove("group-end")})}}return a}function f(t,e){return d(t,e)?"left":c(t,e)?"right":"none"}function h(t,e,i,n,r,s){const o=[];for(let c=0;c<e.length;c++){const t=f(e[c],r),n=o[o.length-1];n&&n.state===t?n.cols.push(e[c]):o.push({state:t,cols:[e[c]],colStart:i+c})}if(o.length<=1)return;const l=t.parentElement;if(!l)return;const d=t.nextSibling;l.removeChild(t);for(const c of o){const e=document.createElement("div");if(e.className=t.className,e.setAttribute("data-group",t.getAttribute("data-group")||""),e.style.gridColumn=`${c.colStart+1} / span ${c.cols.length}`,"left"===c.state){const t=c.cols[0].field,i=n.find(e=>e.getAttribute("data-field")===t);i&&(e.classList.add("sticky-left"),e.style.position="sticky",e.style.left=i.style.left)}else if("right"===c.state){const t=c.cols[c.cols.length-1].field,i=n.find(e=>e.getAttribute("data-field")===t);i&&(e.classList.add("sticky-right"),e.style.position="sticky",e.style.right=i.style.right)}else if("none"===c.state){c.cols.every(t=>String(t.field||"").startsWith("__tbw_"))&&(e.style.borderRightStyle="none")}d?l.insertBefore(e,d):l.appendChild(e)}for(let c=0;c<o.length;c++){const t=o[c],e=o[c+1];if("none"!==t.state&&e&&"none"===e.state){const e=t.cols[t.cols.length-1].field;e&&s.addGroupEnd.add(e)}if("none"===t.state){if(t.cols.every(t=>String(t.field||"").startsWith("__tbw_"))){const e=t.cols[t.cols.length-1].field;e&&s.removeGroupEnd.add(e)}}}}function g(t){t.querySelectorAll(".sticky-left, .sticky-right").forEach(t=>{t.classList.remove("sticky-left","sticky-right"),t.style.position="",t.style.left="",t.style.right=""})}const p="canMoveColumn";class m extends s{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:p,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};#i=[];detach(){this.leftOffsets.clear(),this.rightOffsets.clear(),this.isApplied=!1,this.#e={addGroupEnd:/* @__PURE__ */new Set,removeGroupEnd:/* @__PURE__ */new Set},this.#i=[]}static detect(t,e){const i=e?.columns;return!!Array.isArray(i)&&a(i)}processColumns(e){const i=[...e];if(this.isApplied=a(i),!this.isApplied)return i;const n=this.gridElement;return function(t,e="ltr"){const i=[],n=[],r=[];for(const s of t){const t=o(s);t?"left"===l(t,e)?i.push(s):r.push(s):n.push(s)}return[...i,...n,...r]}(i,n?t(n):"ltr")}afterRender(){if(!this.isApplied)return;const t=this.gridElement,e=[...this.columns];if(!a(e))return g(t),void(this.isApplied=!1);queueMicrotask(()=>{this.#e=u(t,e)})}afterCellRender(t){if(!this.isApplied)return;const e=t.column.field;this.#e.addGroupEnd.has(e)?t.cellElement.classList.add("group-end"):this.#e.removeGroupEnd.has(e)&&t.cellElement.classList.remove("group-end")}handleQuery(t){switch(t.type){case p:return null==o(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 i=e.column;if(!i?.field)return;if(i.meta?.lockPinning)return;const n=[];return null!=o(i)?n.push({id:"pinned/unpin",label:"Unpin Column",icon:"📌",order:40,action:()=>this.setPinPosition(i.field,void 0)}):(n.push({id:"pinned/pin-left",label:"Pin Left",icon:"⬅",order:40,action:()=>this.setPinPosition(i.field,"left")}),n.push({id:"pinned/pin-right",label:"Pin Right",icon:"➡",order:41,action:()=>this.setPinPosition(i.field,"right")})),n}default:return}}setPinPosition(t,e){const i=this.columns;if(!i?.length)return;const n=i.findIndex(e=>e.field===t);if(-1===n)return;const r=this.gridElement;if(e){0===this.#i.length&&(this.#i=i.map(t=>t.field));const n=i.map(i=>{if(i.field!==t)return i;const n={...i};return n.pinned=e,delete n.sticky,n});r.columns=n}else{const e={...i[n]};delete e.pinned,delete e.sticky;const s=[...i];s.splice(n,1);const l=this.#i.indexOf(t);if(l>=0){let t=s.length;for(let e=0;e<s.length;e++){if(o(s[e]))continue;if(this.#i.indexOf(s[e].field)>l){t=e;break}}s.splice(t,0,e)}else s.splice(Math.min(n,s.length),0,e);s.some(t=>null!=o(t))||(this.#i=[]),r.columns=s}}refreshStickyOffsets(){const t=[...this.columns];u(this.gridElement,t)}getLeftPinnedColumns(){return function(t,e="ltr"){return t.filter(t=>d(t,e))}([...this.columns],t(this.gridElement))}getRightPinnedColumns(){return function(t,e="ltr"){return t.filter(t=>c(t,e))}([...this.columns],t(this.gridElement))}clearStickyPositions(){g(this.gridElement)}getHorizontalScrollOffsets(t,e){if(!this.isApplied)return;let i=0,n=0;if(t){const e=t.querySelectorAll(".sticky-left"),r=t.querySelectorAll(".sticky-right");e.forEach(t=>{i+=t.offsetWidth}),r.forEach(t=>{n+=t.offsetWidth})}else{this.gridElement.querySelectorAll(".header-row .cell").forEach(t=>{t.classList.contains("sticky-left")?i+=t.offsetWidth:t.classList.contains("sticky-right")&&(n+=t.offsetWidth)})}const r=e?.classList.contains("sticky-left")||e?.classList.contains("sticky-right");return{left:i,right:n,skipScroll:r}}}export{m as PinnedColumnsPlugin};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|