@toolbox-web/grid 1.25.0 → 1.25.2

package/lib/plugins/undo-redo/UndoRedoPlugin.d.ts

@@ -45,11 +45,11 @@ import { UndoRedoAction, UndoRedoConfig } from './types';
  *
  * @example Basic Usage with EditingPlugin
  * ```ts
- * import '@toolbox-web/grid';
+ * import { queryGrid } from '@toolbox-web/grid';
  * import { EditingPlugin } from '@toolbox-web/grid/plugins/editing';
  * import { UndoRedoPlugin } from '@toolbox-web/grid/plugins/undo-redo';
  *
- * const grid = document.querySelector('tbw-grid');
+ * const grid = queryGrid('tbw-grid');
  * grid.gridConfig = {
  *   columns: [
  *     { field: 'name', header: 'Name', editable: true },

package/lib/plugins/undo-redo/index.js

@@ -1,2 +1,2 @@
-document.createElement("template").innerHTML='<div class="cell" role="gridcell" part="cell"></div>';document.createElement("template").innerHTML='<div class="data-grid-row" role="row" part="row"></div>';const t='<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>',e={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:t,filterActive:t,print:"🖨️"};class n{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 n=new CustomEvent(t,{detail:e,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(n),n.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{...e,...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(),n=parseInt(e,10);if(!isNaN(n))return n}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){var e,n;console.warn(`${e=this.gridElement.id,n=this.name,`[tbw-grid${e?`#${e}`:""}${n?`:${n}`:""}]`} ${t}`)}}function o(t,e,n){const o=[...t.undoStack,e];for(;o.length>n;)o.shift();return{undoStack:o,redoStack:[]}}function i(t){if(0===t.undoStack.length)return{newState:t,action:null};const e=[...t.undoStack],n=e.pop();return n?{newState:{undoStack:e,redoStack:[...t.redoStack,n]},action:n}:{newState:t,action:null}}function r(t){if(0===t.redoStack.length)return{newState:t,action:null};const e=[...t.redoStack],n=e.pop();return n?{newState:{undoStack:[...t.undoStack,n],redoStack:e},action:n}:{newState:t,action:null}}class a extends n{static dependencies=[{name:"editing",required:!0,reason:"UndoRedoPlugin tracks cell edit history"}];name="undoRedo";get defaultConfig(){return{maxHistorySize:100}}undoStack=[];redoStack=[];#e=!1;#n=null;#o(t,e){const n=this.rows[t.rowIndex];if(n){try{const o=this.grid.getRowId(n);if(o)return void this.grid.updateRow(o,{[t.field]:e})}catch{}n[t.field]=e}}#i(t){const e=this.grid,n=e._visibleColumns?.findIndex(e=>e.field===t.field)??-1;if(n<0)return;e._focusRow=t.rowIndex,e._focusCol=n;const o=e.findRenderedRowElement?.(t.rowIndex);if(!o)return;const i=o.querySelector(`.cell[data-col="${n}"]`);if(i?.classList.contains("editing")){const t=i.querySelector('input,select,textarea,[contenteditable="true"],[contenteditable=""],[tabindex]:not([tabindex="-1"])');t?.focus({preventScroll:!0})}}#r(t,e){if(this.#e=!0,"compound"===t.type){const n="undo"===e?[...t.actions].reverse():t.actions;for(const t of n)this.#o(t,"undo"===e?t.oldValue:t.newValue)}else this.#o(t,"undo"===e?t.oldValue:t.newValue);this.#e=!1}#a(t){const e="compound"===t.type?t.actions[t.actions.length-1]:t;e&&this.#i(e)}attach(t){super.attach(t),this.on("cell-edit-committed",t=>{this.#e||this.recordEdit(t.rowIndex,t.field,t.oldValue,t.newValue)})}detach(){this.undoStack=[],this.redoStack=[],this.#n=null}onKeyDown(t){const e=(t.ctrlKey||t.metaKey)&&"z"===t.key&&!t.shiftKey,n=(t.ctrlKey||t.metaKey)&&("y"===t.key||"z"===t.key&&t.shiftKey);if(e){t.preventDefault();const e=i({undoStack:this.undoStack,redoStack:this.redoStack});return e.action&&(this.#r(e.action,"undo"),this.undoStack=e.newState.undoStack,this.redoStack=e.newState.redoStack,this.emit("undo",{action:e.action,type:"undo"}),this.#a(e.action),this.requestRenderWithFocus()),!0}if(n){t.preventDefault();const e=r({undoStack:this.undoStack,redoStack:this.redoStack});return e.action&&(this.#r(e.action,"redo"),this.undoStack=e.newState.undoStack,this.redoStack=e.newState.redoStack,this.emit("redo",{action:e.action,type:"redo"}),this.#a(e.action),this.requestRenderWithFocus()),!0}return!1}recordEdit(t,e,n,i){const r=function(t,e,n,o){return{type:"cell-edit",rowIndex:t,field:e,oldValue:n,newValue:o,timestamp:Date.now()}}(t,e,n,i);if(this.#n)return void this.#n.push(r);const a=o({undoStack:this.undoStack,redoStack:this.redoStack},r,this.config.maxHistorySize??100);this.undoStack=a.undoStack,this.redoStack=a.redoStack}beginTransaction(){if(this.#n)throw new Error("UndoRedoPlugin: Transaction already in progress. Call endTransaction() first.");this.#n=[]}endTransaction(){const t=this.#n;if(!t)throw new Error("UndoRedoPlugin: No transaction in progress. Call beginTransaction() first.");if(this.#n=null,0===t.length)return;const e=1===t.length?t[0]:{type:"compound",actions:t,timestamp:Date.now()};const n=o({undoStack:this.undoStack,redoStack:this.redoStack},e,this.config.maxHistorySize??100);this.undoStack=n.undoStack,this.redoStack=n.redoStack}undo(){const t=i({undoStack:this.undoStack,redoStack:this.redoStack});return t.action&&(this.#r(t.action,"undo"),this.undoStack=t.newState.undoStack,this.redoStack=t.newState.redoStack,this.#a(t.action),this.requestRenderWithFocus()),t.action}redo(){const t=r({undoStack:this.undoStack,redoStack:this.redoStack});return t.action&&(this.#r(t.action,"redo"),this.undoStack=t.newState.undoStack,this.redoStack=t.newState.redoStack,this.#a(t.action),this.requestRenderWithFocus()),t.action}canUndo(){return{undoStack:this.undoStack,redoStack:this.redoStack}.undoStack.length>0}canRedo(){return{undoStack:this.undoStack,redoStack:this.redoStack}.redoStack.length>0}clearHistory(){const t={undoStack:[],redoStack:[]};this.undoStack=t.undoStack,this.redoStack=t.redoStack,this.#n=null}getUndoStack(){return[...this.undoStack]}getRedoStack(){return[...this.redoStack]}}export{a as UndoRedoPlugin};
+function t(t,e){return`[tbw-grid${t?`#${t}`:""}${e?`:${e}`:""}]`}function e(e,n,o,i){return`${t(o,i)} ${e}: ${n}\n\n  → More info: ${function(t){return`https://toolboxjs.com/grid/errors#${t.toLowerCase()}`}(e)}`}function n(t,n,o,i){throw new Error(e(t,n,o,i))}document.createElement("template").innerHTML='<div class="cell" role="gridcell" part="cell"></div>';document.createElement("template").innerHTML='<div class="data-grid-row" role="row" part="row"></div>';const o='<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>',i={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:o,filterActive:o,print:"🖨️"};class r{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 n=new CustomEvent(t,{detail:e,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(n),n.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{...i,...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(),n=parseInt(e,10);if(!isNaN(n))return n}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(n,o){void 0!==o?console.warn(e(n,o,this.gridElement.id,this.name)):console.warn(`${t(this.gridElement.id,this.name)} ${n}`)}throwDiagnostic(t,n){throw new Error(e(t,n,this.gridElement.id,this.name))}}function s(t,e,n){const o=[...t.undoStack,e];for(;o.length>n;)o.shift();return{undoStack:o,redoStack:[]}}function a(t){if(0===t.undoStack.length)return{newState:t,action:null};const e=[...t.undoStack],n=e.pop();return n?{newState:{undoStack:e,redoStack:[...t.redoStack,n]},action:n}:{newState:t,action:null}}function c(t){if(0===t.redoStack.length)return{newState:t,action:null};const e=[...t.redoStack],n=e.pop();return n?{newState:{undoStack:[...t.undoStack,n],redoStack:e},action:n}:{newState:t,action:null}}class d extends r{static dependencies=[{name:"editing",required:!0,reason:"UndoRedoPlugin tracks cell edit history"}];name="undoRedo";get defaultConfig(){return{maxHistorySize:100}}undoStack=[];redoStack=[];#e=!1;#n=null;#o(t,e){const n=this.rows[t.rowIndex];if(n){try{const o=this.grid.getRowId(n);if(o)return void this.grid.updateRow(o,{[t.field]:e})}catch{}n[t.field]=e}}#i(t){const e=this.grid,n=e._visibleColumns?.findIndex(e=>e.field===t.field)??-1;if(n<0)return;e._focusRow=t.rowIndex,e._focusCol=n;const o=e.findRenderedRowElement?.(t.rowIndex);if(!o)return;const i=o.querySelector(`.cell[data-col="${n}"]`);if(i?.classList.contains("editing")){const t=i.querySelector('input,select,textarea,[contenteditable="true"],[contenteditable=""],[tabindex]:not([tabindex="-1"])');t?.focus({preventScroll:!0})}}#r(t,e){if(this.#e=!0,"compound"===t.type){const n="undo"===e?[...t.actions].reverse():t.actions;for(const t of n)this.#o(t,"undo"===e?t.oldValue:t.newValue)}else this.#o(t,"undo"===e?t.oldValue:t.newValue);this.#e=!1}#s(t){const e="compound"===t.type?t.actions[t.actions.length-1]:t;e&&this.#i(e)}attach(t){super.attach(t),this.on("cell-edit-committed",t=>{this.#e||this.recordEdit(t.rowIndex,t.field,t.oldValue,t.newValue)})}detach(){this.undoStack=[],this.redoStack=[],this.#n=null}onKeyDown(t){const e=(t.ctrlKey||t.metaKey)&&"z"===t.key&&!t.shiftKey,n=(t.ctrlKey||t.metaKey)&&("y"===t.key||"z"===t.key&&t.shiftKey);if(e){t.preventDefault();const e=a({undoStack:this.undoStack,redoStack:this.redoStack});return e.action&&(this.#r(e.action,"undo"),this.undoStack=e.newState.undoStack,this.redoStack=e.newState.redoStack,this.emit("undo",{action:e.action,type:"undo"}),this.#s(e.action),this.requestRenderWithFocus()),!0}if(n){t.preventDefault();const e=c({undoStack:this.undoStack,redoStack:this.redoStack});return e.action&&(this.#r(e.action,"redo"),this.undoStack=e.newState.undoStack,this.redoStack=e.newState.redoStack,this.emit("redo",{action:e.action,type:"redo"}),this.#s(e.action),this.requestRenderWithFocus()),!0}return!1}recordEdit(t,e,n,o){const i=function(t,e,n,o){return{type:"cell-edit",rowIndex:t,field:e,oldValue:n,newValue:o,timestamp:Date.now()}}(t,e,n,o);if(this.#n)return void this.#n.push(i);const r=s({undoStack:this.undoStack,redoStack:this.redoStack},i,this.config.maxHistorySize??100);this.undoStack=r.undoStack,this.redoStack=r.redoStack}beginTransaction(){this.#n&&n("TBW111","Transaction already in progress. Call endTransaction() first."),this.#n=[]}endTransaction(){const t=this.#n;if(t||n("TBW112","No transaction in progress. Call beginTransaction() first."),this.#n=null,0===t.length)return;const e=1===t.length?t[0]:{type:"compound",actions:t,timestamp:Date.now()};const o=s({undoStack:this.undoStack,redoStack:this.redoStack},e,this.config.maxHistorySize??100);this.undoStack=o.undoStack,this.redoStack=o.redoStack}undo(){const t=a({undoStack:this.undoStack,redoStack:this.redoStack});return t.action&&(this.#r(t.action,"undo"),this.undoStack=t.newState.undoStack,this.redoStack=t.newState.redoStack,this.#s(t.action),this.requestRenderWithFocus()),t.action}redo(){const t=c({undoStack:this.undoStack,redoStack:this.redoStack});return t.action&&(this.#r(t.action,"redo"),this.undoStack=t.newState.undoStack,this.redoStack=t.newState.redoStack,this.#s(t.action),this.requestRenderWithFocus()),t.action}canUndo(){return{undoStack:this.undoStack,redoStack:this.redoStack}.undoStack.length>0}canRedo(){return{undoStack:this.undoStack,redoStack:this.redoStack}.redoStack.length>0}clearHistory(){const t={undoStack:[],redoStack:[]};this.undoStack=t.undoStack,this.redoStack=t.redoStack,this.#n=null}getUndoStack(){return[...this.undoStack]}getRedoStack(){return[...this.redoStack]}}export{d as UndoRedoPlugin};
 //# sourceMappingURL=index.js.map