@toolbox-web/grid 1.16.1 → 1.18.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 +126 -41
- package/all.js +1046 -936
- package/all.js.map +1 -1
- package/index.js +394 -369
- package/index.js.map +1 -1
- package/lib/core/grid.d.ts +13 -3
- package/lib/core/grid.d.ts.map +1 -1
- package/lib/core/internal/header.d.ts.map +1 -1
- package/lib/core/internal/keyboard.d.ts.map +1 -1
- package/lib/core/internal/shell.d.ts +11 -0
- package/lib/core/internal/shell.d.ts.map +1 -1
- package/lib/core/plugin/types.d.ts +1 -0
- package/lib/core/plugin/types.d.ts.map +1 -1
- package/lib/core/types.d.ts +42 -2
- package/lib/core/types.d.ts.map +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/index.js.map +1 -1
- package/lib/plugins/editing/EditingPlugin.d.ts.map +1 -1
- package/lib/plugins/editing/index.js +155 -145
- package/lib/plugins/editing/index.js.map +1 -1
- package/lib/plugins/export/index.js.map +1 -1
- package/lib/plugins/filtering/FilteringPlugin.d.ts +31 -0
- package/lib/plugins/filtering/FilteringPlugin.d.ts.map +1 -1
- package/lib/plugins/filtering/filter-model.d.ts +30 -3
- package/lib/plugins/filtering/filter-model.d.ts.map +1 -1
- package/lib/plugins/filtering/index.d.ts +1 -0
- package/lib/plugins/filtering/index.d.ts.map +1 -1
- package/lib/plugins/filtering/index.js +471 -361
- package/lib/plugins/filtering/index.js.map +1 -1
- package/lib/plugins/filtering/types.d.ts +32 -0
- package/lib/plugins/filtering/types.d.ts.map +1 -1
- package/lib/plugins/grouping-columns/index.js.map +1 -1
- package/lib/plugins/grouping-rows/index.js.map +1 -1
- package/lib/plugins/master-detail/index.js.map +1 -1
- package/lib/plugins/multi-sort/MultiSortPlugin.d.ts +4 -0
- package/lib/plugins/multi-sort/MultiSortPlugin.d.ts.map +1 -1
- package/lib/plugins/multi-sort/index.js +57 -47
- package/lib/plugins/multi-sort/index.js.map +1 -1
- package/lib/plugins/pinned-columns/index.js.map +1 -1
- package/lib/plugins/pinned-rows/index.js.map +1 -1
- package/lib/plugins/pivot/index.js.map +1 -1
- package/lib/plugins/print/index.js.map +1 -1
- package/lib/plugins/reorder/index.js +81 -78
- package/lib/plugins/reorder/index.js.map +1 -1
- package/lib/plugins/responsive/index.js +58 -55
- package/lib/plugins/responsive/index.js.map +1 -1
- package/lib/plugins/row-reorder/index.js +5 -2
- package/lib/plugins/row-reorder/index.js.map +1 -1
- package/lib/plugins/selection/index.js.map +1 -1
- package/lib/plugins/server-side/index.js.map +1 -1
- package/lib/plugins/tree/index.js.map +1 -1
- package/lib/plugins/undo-redo/index.js.map +1 -1
- package/lib/plugins/visibility/index.js.map +1 -1
- package/package.json +1 -1
- package/umd/grid.all.umd.js +29 -29
- package/umd/grid.all.umd.js.map +1 -1
- package/umd/grid.umd.js +10 -10
- package/umd/grid.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/multi-sort.umd.js +1 -1
- package/umd/plugins/multi-sort.umd.js.map +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
(function(b,y){typeof exports=="object"&&typeof module<"u"?y(exports,require("../../core/internal/keyboard"),require("../../core/internal/rows"),require("../../core/plugin/base-plugin")):typeof define=="function"&&define.amd?define(["exports","../../core/internal/keyboard","../../core/internal/rows","../../core/plugin/base-plugin"],y):(b=typeof globalThis<"u"?globalThis:b||self,y(b.TbwGridPlugin_editing={},b.TbwGrid,b.TbwGrid,b.TbwGrid))})(this,(function(b,y,v,q){"use strict";const B="@layer tbw-plugins{tbw-grid{--tbw-editing-bg: var(--tbw-color-selection);--tbw-editing-row-bg: var(--tbw-editing-bg);--tbw-editing-border: var(--tbw-border-input, 1px solid var(--tbw-color-border-strong));--tbw-padding-editing-input: var(--tbw-cell-padding-input, 2px 6px);--tbw-font-size-editor: inherit;--tbw-editing-row-outline-color: var(--tbw-color-accent);--tbw-editing-row-outline-width: 1px;--tbw-invalid-bg: light-dark(#fef2f2, #450a0a);--tbw-invalid-border-color: light-dark(#ef4444, #f87171)}tbw-grid:not(.tbw-grid-mode) .data-grid-row:has(.editing){background:var(--tbw-editing-row-bg);outline:var(--tbw-editing-row-outline-width) solid var(--tbw-editing-row-outline-color);outline-offset:calc(-1 * var(--tbw-editing-row-outline-width))}tbw-grid .data-grid-row>.cell.editing{overflow:hidden;padding:0;display:flex;min-height:calc(var(--tbw-row-height) + 2px);align-items:center;justify-content:center}tbw-grid .data-grid-row>.cell.editing input:not([type=checkbox]),tbw-grid .data-grid-row>.cell.editing select,tbw-grid .data-grid-row>.cell.editing textarea{width:100%;height:100%;flex:1 1 auto;min-width:0;border:var(--tbw-editing-border);padding:var(--tbw-padding-editing-input);font-size:var(--tbw-font-size-editor)}tbw-grid .tbw-editor-host{display:contents}tbw-grid .data-grid-row>.cell[data-invalid=true]{background:var(--tbw-invalid-bg);outline:1px solid var(--tbw-invalid-border-color);outline-offset:-1px}}";function D(l){const e=l.options;return e?typeof e=="function"?e():e:[]}function P(l){return e=>{const t=l.editorParams,i=document.createElement("input");i.type="number",i.value=e.value!=null?String(e.value):"",t?.min!==void 0&&(i.min=String(t.min)),t?.max!==void 0&&(i.max=String(t.max)),t?.step!==void 0&&(i.step=String(t.step)),t?.placeholder&&(i.placeholder=t.placeholder);const n=()=>e.commit(i.value===""?null:Number(i.value));return i.addEventListener("blur",n),i.addEventListener("keydown",s=>{s.key==="Enter"&&n(),s.key==="Escape"&&e.cancel()}),i}}function M(){return l=>{const e=document.createElement("input");return e.type="checkbox",e.checked=!!l.value,e.addEventListener("change",()=>l.commit(e.checked)),e}}function G(l){return e=>{const t=l.editorParams,i=document.createElement("input");i.type="date",e.value instanceof Date?i.valueAsDate=e.value:typeof e.value=="string"&&e.value&&(i.value=e.value.split("T")[0]),t?.min&&(i.min=t.min),t?.max&&(i.max=t.max),t?.placeholder&&(i.placeholder=t.placeholder);const n=()=>{typeof e.value=="string"?e.commit(i.value):e.commit(i.valueAsDate)};return i.addEventListener("change",n),i.addEventListener("keydown",s=>{s.key==="Escape"&&e.cancel()}),i}}function H(l){return e=>{const t=l.editorParams,i=document.createElement("select");if(l.multi&&(i.multiple=!0),t?.includeEmpty){const r=document.createElement("option");r.value="",r.textContent=t.emptyLabel??"",i.appendChild(r)}D(l).forEach(r=>{const o=document.createElement("option");o.value=String(r.value),o.textContent=r.label,(l.multi&&Array.isArray(e.value)&&e.value.includes(r.value)||!l.multi&&e.value===r.value)&&(o.selected=!0),i.appendChild(o)});const s=()=>{if(l.multi){const r=Array.from(i.selectedOptions).map(o=>o.value);e.commit(r)}else e.commit(i.value)};return i.addEventListener("change",s),i.addEventListener("blur",s),i.addEventListener("keydown",r=>{r.key==="Escape"&&e.cancel()}),i}}function $(l){return e=>{const t=l.editorParams,i=document.createElement("input");i.type="text",i.value=e.value!=null?String(e.value):"",t?.maxLength!==void 0&&(i.maxLength=t.maxLength),t?.pattern&&(i.pattern=t.pattern),t?.placeholder&&(i.placeholder=t.placeholder);const n=()=>{const s=i.value;(e.value===null||e.value===void 0)&&s===""||typeof e.value=="string"&&s===e.value.replace(/[\n\r]/g,"")||(typeof e.value=="number"&&s!==""?e.commit(Number(s)):e.commit(s))};return i.addEventListener("blur",n),i.addEventListener("keydown",s=>{s.key==="Enter"&&n(),s.key==="Escape"&&e.cancel()}),i}}function A(l){switch(l.type){case"number":return P(l);case"boolean":return M();case"date":return G(l);case"select":return H(l);default:return $(l)}}function x(l,e){if(e.editor)return e.editor;if(e.__editorTemplate)return"template";if(!e.type)return;const i=l.effectiveConfig?.typeDefaults;if(i?.[e.type]?.editor)return i[e.type].editor;const n=l.__frameworkAdapter;if(n?.getTypeDefault){const s=n.getTypeDefault(e.type);if(s?.editor)return s.editor}}function L(l){return!(typeof l!="string"||l==="__proto__"||l==="constructor"||l==="prototype")}function F(l){const e=(l.__editingCellCount??0)+1;l.__editingCellCount=e,l.setAttribute("data-has-editing","")}function N(l){l.__editingCellCount=0,l.removeAttribute("data-has-editing")}function R(l,e,t){return l instanceof HTMLInputElement?l.type==="checkbox"?l.checked:l.type==="number"?l.value===""?null:Number(l.value):l.type==="date"?typeof t=="string"?l.value:l.valueAsDate:typeof t=="number"?l.value===""?null:Number(l.value):t==null&&l.value===""||typeof t=="string"&&l.value===t.replace(/[\n\r]/g,"")?t:l.value:e?.type==="number"&&l.value!==""||typeof t=="number"&&l.value!==""?Number(l.value):t==null&&l.value===""?t:l.value}function O(l){}function U(l,e,t,i){const n=l.querySelector("input,textarea,select");n&&(n.addEventListener("blur",()=>{t(R(n,e,i))}),n instanceof HTMLInputElement&&n.type==="checkbox"?n.addEventListener("change",()=>t(n.checked)):n instanceof HTMLSelectElement&&n.addEventListener("change",()=>t(R(n,e,i))))}class j extends q.BaseGridPlugin{static manifest={ownedProperties:[{property:"editable",level:"column",description:'the "editable" column property',isUsed:e=>e===!0},{property:"editor",level:"column",description:'the "editor" column property'},{property:"editorParams",level:"column",description:'the "editorParams" column property'}],events:[{type:"cell-edit-committed",description:"Emitted when a cell edit is committed (for plugin-to-plugin coordination)"}],queries:[{type:"isEditing",description:"Returns whether any cell is currently being edited"}]};name="editing";styles=B;get defaultConfig(){return{mode:"row",editOn:"click"}}get#t(){return this.config.mode==="grid"}#e=-1;#f=-1;#l=new Map;#n=new Set;#o=new Set;#a=new Map;#u=!1;#h=-1;#i=new Map;#r=!1;#c=!1;#d=!1;attach(e){super.attach(e);const t=this.disconnectSignal,i=e;i._activeEditRows=-1,i._rowEditSnapshots=new Map,Object.defineProperty(e,"changedRows",{get:()=>this.changedRows,configurable:!0}),Object.defineProperty(e,"changedRowIds",{get:()=>this.changedRowIds,configurable:!0}),e.resetChangedRows=n=>this.resetChangedRows(n),e.beginBulkEdit=(n,s)=>{s&&this.beginCellEdit(n,s)},document.addEventListener("keydown",n=>{if(!this.#t&&n.key==="Escape"&&this.#e!==-1){if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(n)===!1)return;this.#s(this.#e,!0)}},{capture:!0,signal:t}),document.addEventListener("mousedown",n=>{if(this.#t||this.#e===-1)return;const s=i.findRenderedRowElement?.(this.#e);!s||(n.composedPath&&n.composedPath()||[]).includes(s)||this.config.onBeforeEditClose&&this.config.onBeforeEditClose(n)===!1||queueMicrotask(()=>{this.#e!==-1&&this.#s(this.#e,!1)})},{signal:t}),this.gridElement.addEventListener("cell-change",n=>{const s=n.detail;if(s.source==="user")return;const r=`${s.rowIndex}:${s.field}`,o=this.#a.get(r);o&&o(s.newValue)},{signal:t}),this.#t&&(i._isGridEditMode=!0,this.gridElement.classList.add("tbw-grid-mode"),this.requestRender(),this.gridElement.addEventListener("focusin",n=>{const s=n.target;if(s.matches(v.FOCUSABLE_EDITOR_SELECTOR)){if(this.#c){s.blur(),this.gridElement.focus();return}this.#r=!0}},{signal:t}),this.gridElement.addEventListener("focusout",n=>{const s=n.relatedTarget;(!s||!this.gridElement.contains(s)||!s.matches(v.FOCUSABLE_EDITOR_SELECTOR))&&(this.#r=!1)},{signal:t}),this.gridElement.addEventListener("keydown",n=>{if(n.key==="Escape"&&this.#r){if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(n)===!1)return;const s=document.activeElement;s&&this.gridElement.contains(s)&&(s.blur(),this.gridElement.focus()),this.#r=!1,this.#c=!0,n.preventDefault(),n.stopPropagation()}},{capture:!0,signal:t}),this.gridElement.addEventListener("mousedown",n=>{n.target.matches(v.FOCUSABLE_EDITOR_SELECTOR)&&(this.#c=!1)},{signal:t}))}detach(){const e=this.gridElement;e._isGridEditMode=!1,this.gridElement.classList.remove("tbw-grid-mode"),this.#e=-1,this.#f=-1,this.#l.clear(),this.#n.clear(),this.#o.clear(),this.#a.clear(),this.#r=!1,this.#c=!1,this.#d=!1,super.detach()}handleQuery(e){if(e.type==="isEditing")return this.#t||this.#e!==-1}onCellClick(e){if(this.#t)return!1;const t=this.grid,i=this.config.editOn??t.effectiveConfig?.editOn;if(i===!1||i==="manual"||i!=="click"&&i!=="dblclick")return!1;const n=e.originalEvent.type==="dblclick";if(i==="click"&&n||i==="dblclick"&&!n)return!1;const{rowIndex:s}=e;return t._columns?.some(o=>o.editable)?(e.originalEvent.stopPropagation(),this.beginBulkEdit(s),!0):!1}onKeyDown(e){const t=this.grid;if(e.key==="Escape"){if(this.#t&&this.#r){if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(e)===!1)return!0;const i=document.activeElement;return i&&this.gridElement.contains(i)&&i.blur(),this.#r=!1,this.requestAfterRender(),!0}if(this.#e!==-1&&!this.#t)return this.config.onBeforeEditClose&&this.config.onBeforeEditClose(e)===!1||this.#s(this.#e,!0),!0}if(this.#t&&!this.#r&&(e.key==="ArrowUp"||e.key==="ArrowDown"||e.key==="ArrowLeft"||e.key==="ArrowRight"))return!1;if(this.#t&&this.#r&&(e.key==="ArrowUp"||e.key==="ArrowDown"))return!0;if((e.key==="ArrowUp"||e.key==="ArrowDown")&&this.#e!==-1&&!this.#t){if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(e)===!1)return!0;const i=t._rows.length-1,n=this.#e;return this.#s(n,!1),e.key==="ArrowDown"?t._focusRow=Math.min(i,t._focusRow+1):t._focusRow=Math.max(0,t._focusRow-1),e.preventDefault(),y.ensureCellVisible(t),this.requestAfterRender(),!0}if(e.key==="Tab"&&(this.#e!==-1||this.#t)){if(e.preventDefault(),this.#d)return this.#s(this.#e,!1),!0;const i=!e.shiftKey;return this.#C(i),!0}if(e.key===" "||e.key==="Spacebar"){if(this.#e!==-1)return!1;const i=t._focusRow,n=t._focusCol;if(i>=0&&n>=0){const s=t._visibleColumns[n],r=t._rows[i];if(s?.editable&&s.type==="boolean"&&r){const o=s.field;if(L(o)){const c=!r[o];return this.#m(i,s,c,r),e.preventDefault(),this.requestRender(),!0}}}return!1}if(e.key==="Enter"&&!e.shiftKey&&!e.ctrlKey&&!e.altKey&&!e.metaKey){if(this.#t&&!this.#r)return this.#y(),!0;if(this.#e!==-1)return!!(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(e)===!1);const i=this.config.editOn??t.effectiveConfig?.editOn;if(i===!1||i==="manual")return!1;const n=t._focusRow,s=t._focusCol;if(n>=0&&t._columns?.some(o=>o.editable)){const o=t._visibleColumns[s],a=t._rows[n],c=o?.field??"",f=c&&a?a[c]:void 0,E=this.gridElement.querySelector(`[data-row="${n}"][data-col="${s}"]`),h=new CustomEvent("cell-activate",{cancelable:!0,bubbles:!0,detail:{rowIndex:n,colIndex:s,field:c,value:f,row:a,cellEl:E,trigger:"keyboard",originalEvent:e}});this.gridElement.dispatchEvent(h);const m=new CustomEvent("activate-cell",{cancelable:!0,bubbles:!0,detail:{row:n,col:s}});return this.gridElement.dispatchEvent(m),h.defaultPrevented||m.defaultPrevented?(e.preventDefault(),!0):(this.beginBulkEdit(n),!0)}return!1}if(e.key==="F2"){if(this.#e!==-1||this.#t||(this.config.editOn??t.effectiveConfig?.editOn)===!1)return!1;const n=t._focusRow,s=t._focusCol;if(n>=0&&s>=0){const r=t._visibleColumns[s];if(r?.editable&&r.field)return e.preventDefault(),this.beginCellEdit(n,r.field),!0}return!1}return!1}processColumns(e){const t=this.grid,i=t.effectiveConfig?.typeDefaults,n=t.__frameworkAdapter;return!i&&!n?.getTypeDefault?e:e.map(s=>{if(!s.type)return s;let r;if(i?.[s.type]?.editorParams&&(r=i[s.type].editorParams),!r&&n?.getTypeDefault){const o=n.getTypeDefault(s.type);o?.editorParams&&(r=o.editorParams)}return r?{...s,editorParams:{...r,...s.editorParams}}:s})}afterRender(){const e=this.grid;if(this.#u&&(this.#u=!1,this.#b(e)),this.#h!==-1){const t=this.#h;this.#h=-1,e.animateRow?.(t,"change")}if(!this.#t&&this.#o.size!==0)for(const t of this.#o){const[i,n]=t.split(":"),s=parseInt(i,10),r=parseInt(n,10),o=e.findRenderedRowElement?.(s);if(!o)continue;const a=o.querySelector(`.cell[data-col="${r}"]`);if(!a||a.classList.contains("editing"))continue;const c=e._rows[s],f=e._visibleColumns[r];c&&f&&this.#E(c,s,f,r,a,!0)}}afterCellRender(e){if(!this.#t)return;const{row:t,rowIndex:i,column:n,colIndex:s,cellElement:r}=e;n.editable&&(r.classList.contains("editing")||this.#E(t,i,n,s,r,!0))}onScrollRender(){this.afterRender()}get changedRows(){const e=[];for(const t of this.#n){const i=this.grid.getRow(t);i&&e.push(i)}return e}get changedRowIds(){return Array.from(this.#n)}get activeEditRow(){return this.#e}get activeEditCol(){return this.#f}isRowEditing(e){return this.#e===e}isCellEditing(e,t){return this.#o.has(`${e}:${t}`)}isRowChanged(e){const t=this.grid,i=t._rows[e];if(!i)return!1;try{const n=t.getRowId?.(i);return n?this.#n.has(n):!1}catch{return!1}}isRowChangedById(e){return this.#n.has(e)}setInvalid(e,t,i=""){let n=this.#i.get(e);n||(n=new Map,this.#i.set(e,n)),n.set(t,i),this.#g(e,t,!0)}clearInvalid(e,t){const i=this.#i.get(e);i&&(i.delete(t),i.size===0&&this.#i.delete(e)),this.#g(e,t,!1)}clearRowInvalid(e){const t=this.#i.get(e);if(t){const i=Array.from(t.keys());this.#i.delete(e),i.forEach(n=>this.#g(e,n,!1))}}clearAllInvalid(){const e=Array.from(this.#i.entries());this.#i.clear(),e.forEach(([t,i])=>{i.forEach((n,s)=>this.#g(t,s,!1))})}isCellInvalid(e,t){return this.#i.get(e)?.has(t)??!1}getInvalidMessage(e,t){return this.#i.get(e)?.get(t)}hasInvalidCells(e){const t=this.#i.get(e);return t?t.size>0:!1}getInvalidFields(e){return new Map(this.#i.get(e)??[])}#g(e,t,i){const n=this.grid,s=n._visibleColumns?.findIndex(f=>f.field===t);if(s===-1||s===void 0)return;const o=n._rows?.findIndex(f=>{try{return n.getRowId?.(f)===e}catch{return!1}});if(o===-1||o===void 0)return;const c=n.findRenderedRowElement?.(o)?.querySelector(`.cell[data-col="${s}"]`);if(c)if(i){c.setAttribute("data-invalid","true");const f=this.#i.get(e)?.get(t);f&&c.setAttribute("title",f)}else c.removeAttribute("data-invalid"),c.removeAttribute("title")}resetChangedRows(e){const t=this.changedRows,i=this.changedRowIds;this.#n.clear(),this.#p(),e||this.emit("changed-rows-reset",{rows:t,ids:i}),this.grid._rowPool?.forEach(s=>s.classList.remove("changed"))}beginCellEdit(e,t){const i=this.grid,n=i._visibleColumns.findIndex(a=>a.field===t);if(n===-1||!i._visibleColumns[n]?.editable)return;const o=i.findRenderedRowElement?.(e)?.querySelector(`.cell[data-col="${n}"]`);o&&(this.#d=!0,this.#v(e,n,o))}beginBulkEdit(e){const t=this.grid;if((this.config.editOn??t.effectiveConfig?.editOn)===!1||!t._columns?.some(o=>o.editable))return;const s=t.findRenderedRowElement?.(e);if(!s)return;this.#d=!1;const r=t._rows[e];this.#w(e,r),Array.from(s.children).forEach((o,a)=>{const c=t._visibleColumns[a];if(c?.editable){const f=o;f.classList.contains("editing")||this.#E(r,e,c,a,f,!0)}}),setTimeout(()=>{let o=s.querySelector(`.cell[data-col="${t._focusCol}"]`);if(o?.classList.contains("editing")||(o=s.querySelector(".cell.editing")),o?.classList.contains("editing")){const a=o.querySelector(v.FOCUSABLE_EDITOR_SELECTOR);try{a?.focus({preventScroll:!0})}catch{}}},0)}commitActiveRowEdit(){this.#e!==-1&&this.#s(this.#e,!1)}cancelActiveRowEdit(){this.#e!==-1&&this.#s(this.#e,!0)}#v(e,t,i){const n=this.grid,s=n._rows[e],r=n._visibleColumns[t];!s||!r?.editable||i.classList.contains("editing")||(this.#e!==e&&this.#w(e,s),this.#f=t,this.#E(s,e,r,t,i,!1))}#y(){const e=this.grid,t=e._focusRow,i=e._focusCol;if(t<0||i<0)return;const s=e.findRenderedRowElement?.(t)?.querySelector(`.cell[data-col="${i}"]`);if(s?.classList.contains("editing")){const r=s.querySelector(v.FOCUSABLE_EDITOR_SELECTOR);r&&(this.#c=!1,r.focus(),this.#r=!0,r instanceof HTMLInputElement&&(r.type==="text"||r.type==="number")&&r.select())}}#C(e){const t=this.grid,i=t._rows,n=this.#t?t._focusRow:this.#e,s=t._visibleColumns.map((c,f)=>c.editable?f:-1).filter(c=>c>=0);if(s.length===0)return;const o=s.indexOf(t._focusCol)+(e?1:-1);if(o>=0&&o<s.length){t._focusCol=s[o];const f=t.findRenderedRowElement?.(n)?.querySelector(`.cell[data-col="${s[o]}"]`);f?.classList.contains("editing")&&f.querySelector(v.FOCUSABLE_EDITOR_SELECTOR)?.focus({preventScroll:!0}),y.ensureCellVisible(t,{forceHorizontalScroll:!0});return}const a=n+(e?1:-1);a>=0&&a<i.length&&(this.#t?(t._focusRow=a,t._focusCol=e?s[0]:s[s.length-1],y.ensureCellVisible(t,{forceHorizontalScroll:!0}),this.requestAfterRender(),setTimeout(()=>{const f=t.findRenderedRowElement?.(a)?.querySelector(`.cell[data-col="${t._focusCol}"]`);f?.classList.contains("editing")&&f.querySelector(v.FOCUSABLE_EDITOR_SELECTOR)?.focus({preventScroll:!0})},0)):(this.#s(n,!1),t._focusRow=a,t._focusCol=e?s[0]:s[s.length-1],this.beginBulkEdit(a),y.ensureCellVisible(t,{forceHorizontalScroll:!0})))}#p(){const e=this.grid;e._activeEditRows=this.#e,e._rowEditSnapshots=this.#l}#w(e,t){if(this.#e!==e&&(this.#l.set(e,{...t}),this.#e=e,this.#p(),!this.#t)){const i=this.grid;let n="";try{n=i.getRowId?.(t)??""}catch{}this.emit("edit-open",{rowIndex:e,rowId:n,row:t})}}#s(e,t){if(this.#e!==e)return;const i=this.grid,n=this.#l.get(e),s=i._rows[e],r=i.findRenderedRowElement?.(e);let o;if(s)try{o=i.getRowId?.(s)}catch{}if(!t&&r&&s&&r.querySelectorAll(".cell.editing").forEach(c=>{const f=Number(c.getAttribute("data-col"));if(isNaN(f))return;const E=i._visibleColumns[f];if(!E||c.hasAttribute("data-editor-managed"))return;const h=c.querySelector("input,textarea,select");if(h){const m=E.field,g=s[m],p=R(h,E,g);g!==p&&this.#m(e,E,p,s)}}),t&&n&&s)Object.keys(n).forEach(a=>{s[a]=n[a]}),o&&(this.#n.delete(o),this.clearRowInvalid(o));else if(!t&&s){const a=this.#_(n,s),c=o?this.#n.has(o):a,f=this.emitCancelable("row-commit",{rowIndex:e,rowId:o??"",row:s,oldValue:n,newValue:s,changed:c,changedRows:this.changedRows,changedRowIds:this.changedRowIds});f&&n?(Object.keys(n).forEach(E=>{s[E]=n[E]}),o&&(this.#n.delete(o),this.clearRowInvalid(o))):!f&&a&&this.isAnimationEnabled&&(this.#h=e)}this.#l.delete(e),this.#e=-1,this.#f=-1,this.#d=!1,this.#p();for(const a of this.#o)a.startsWith(`${e}:`)&&this.#o.delete(a);for(const a of this.#a.keys())a.startsWith(`${e}:`)&&this.#a.delete(a);r&&(r.querySelectorAll(".cell.editing").forEach(a=>{a.classList.remove("editing"),N(a.parentElement)}),this.requestRender()),this.#u=!0,r||(this.#b(i),this.#u=!1),!this.#t&&s&&this.emit("edit-close",{rowIndex:e,rowId:o??"",row:s,reverted:t})}#m(e,t,i,n){const s=t.field;if(!L(s))return;const r=n[s];if(r===i)return;const o=this.grid;let a;try{a=this.grid.getRowId(n)}catch{}const c=a?!this.#n.has(a):!0,f=a?p=>this.grid.updateRow(a,p,"cascade"):O;let E=!1;const h=a?p=>{E=!0,this.setInvalid(a,s,p??"")}:()=>{};if(this.emitCancelable("cell-commit",{row:n,rowId:a??"",field:s,oldValue:r,value:i,rowIndex:e,changedRows:this.changedRows,changedRowIds:this.changedRowIds,firstTimeForRow:c,updateRow:f,setInvalid:h}))return;a&&!E&&this.isCellInvalid(a,s)&&this.clearInvalid(a,s),n[s]=i,a&&this.#n.add(a),this.#p(),this.emitPluginEvent("cell-edit-committed",{rowIndex:e,field:s,oldValue:r,newValue:i});const g=o.findRenderedRowElement?.(e);g&&g.classList.add("changed")}#E(e,t,i,n,s,r){if(!i.editable||s.classList.contains("editing"))return;let o;try{o=this.grid.getRowId(e)}catch{}const a=o?d=>this.grid.updateRow(o,d,"cascade"):O,c=L(i.field)?e[i.field]:void 0;s.classList.add("editing"),this.#o.add(`${t}:${n}`);const f=s.parentElement;f&&F(f);let E=!1;const h=d=>{if(E||!this.#t&&this.#e===-1)return;const u=this.grid._rows[t]??e;this.#m(t,i,d,u)},m=()=>{if(E=!0,L(i.field)){const d=this.grid._rows[t]??e;d[i.field]=c}},g=document.createElement("div");g.className="tbw-editor-host",s.innerHTML="",s.appendChild(g),g.addEventListener("keydown",d=>{if(d.key==="Enter"){if(this.#t){d.stopPropagation(),d.preventDefault();const u=g.querySelector("input,textarea,select");u&&h(R(u,i,c));return}if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(d)===!1)return;d.stopPropagation(),d.preventDefault(),E=!0,this.#s(t,!1)}if(d.key==="Escape"){if(this.#t){d.stopPropagation(),d.preventDefault();return}if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(d)===!1)return;d.stopPropagation(),d.preventDefault(),m(),this.#s(t,!0)}});const p=i,_=p.__editorTemplate,w=x(this.grid,p)??A(i),T=c,z=`${t}:${i.field}`,I=[];this.#a.set(z,d=>{for(const u of I)u(d)});const S=d=>{I.push(d)};if(w==="template"&&_)this.#R(g,p,e,c,h,m,r,t),S(d=>{const u=g.querySelector("input,textarea,select");u&&(u instanceof HTMLInputElement&&u.type==="checkbox"?u.checked=!!d:u.value=String(d??""))});else if(typeof w=="string"){const d=document.createElement(w);d.value=T,d.addEventListener("change",()=>h(d.value)),S(u=>{d.value=u}),g.appendChild(d),r||queueMicrotask(()=>{g.querySelector(v.FOCUSABLE_EDITOR_SELECTOR)?.focus({preventScroll:!0})})}else if(typeof w=="function"){const d={row:e,rowId:o??"",value:T,field:i.field,column:i,commit:h,cancel:m,updateRow:a,onValueChange:S},u=w(d);typeof u=="string"?(g.innerHTML=u,U(g,i,h,c),S(k=>{const C=g.querySelector("input,textarea,select");C&&(C instanceof HTMLInputElement&&C.type==="checkbox"?C.checked=!!k:C.value=String(k??""))})):u instanceof Node&&(g.appendChild(u),u instanceof HTMLInputElement||u instanceof HTMLSelectElement||u instanceof HTMLTextAreaElement?S(C=>{u instanceof HTMLInputElement&&u.type==="checkbox"?u.checked=!!C:u.value=String(C??"")}):s.setAttribute("data-editor-managed","")),r||queueMicrotask(()=>{g.querySelector(v.FOCUSABLE_EDITOR_SELECTOR)?.focus({preventScroll:!0})})}else if(w&&typeof w=="object"){const d=document.createElement("div");d.setAttribute("data-external-editor",""),d.setAttribute("data-field",i.field),g.appendChild(d),s.setAttribute("data-editor-managed","");const u={row:e,rowId:o??"",value:T,field:i.field,column:i,commit:h,cancel:m,updateRow:a,onValueChange:S};if(w.mount)try{w.mount({placeholder:d,context:u,spec:w})}catch(k){console.warn(`[tbw-grid] External editor mount error for column '${i.field}':`,k)}else this.grid.dispatchEvent(new CustomEvent("mount-external-editor",{detail:{placeholder:d,spec:w,context:u}}))}}#R(e,t,i,n,s,r,o,a){const c=t.__editorTemplate;if(!c)return;const f=c.cloneNode(!0),E=t.__compiledEditor;E?f.innerHTML=E({row:i,value:n,field:t.field,column:t,commit:s,cancel:r}):f.querySelectorAll("*").forEach(m=>{m.childNodes.length===1&&m.firstChild?.nodeType===Node.TEXT_NODE&&(m.textContent=m.textContent?.replace(/{{\s*value\s*}}/g,n==null?"":String(n)).replace(/{{\s*row\.([a-zA-Z0-9_]+)\s*}}/g,(g,p)=>{if(!L(p))return"";const _=i[p];return _==null?"":String(_)})||"")});const h=f.querySelector("input,textarea,select");if(h){h instanceof HTMLInputElement&&h.type==="checkbox"?h.checked=!!n:h.value=String(n??"");let m=!1;h.addEventListener("blur",()=>{m||s(R(h,t,n))}),h.addEventListener("keydown",g=>{const p=g;if(p.key==="Enter"){if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(p)===!1)return;p.stopPropagation(),p.preventDefault(),m=!0,s(R(h,t,n)),this.#s(a,!1)}if(p.key==="Escape"){if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(p)===!1)return;p.stopPropagation(),p.preventDefault(),r(),this.#s(a,!0)}}),h instanceof HTMLInputElement&&h.type==="checkbox"&&h.addEventListener("change",()=>s(h.checked)),o||setTimeout(()=>h.focus({preventScroll:!0}),0)}e.appendChild(f)}#_(e,t){if(!e)return!1;const i=e,n=t,s=new Set([...Object.keys(i),...Object.keys(n)]);for(const r of s)if(i[r]!==n[r])return!0;return!1}#b(e){queueMicrotask(()=>{try{const t=e._focusRow,i=e._focusCol,n=e.findRenderedRowElement?.(t);if(n){Array.from(e._bodyEl.querySelectorAll(".cell-focus")).forEach(r=>r.classList.remove("cell-focus"));const s=n.querySelector(`.cell[data-row="${t}"][data-col="${i}"]`);s&&(s.classList.add("cell-focus"),s.setAttribute("aria-selected","true"),s.hasAttribute("tabindex")||s.setAttribute("tabindex","-1"),s.focus({preventScroll:!0}))}}catch{}})}}b.EditingPlugin=j,b.defaultEditorFor=A,Object.defineProperty(b,Symbol.toStringTag,{value:"Module"})}));
|
|
1
|
+
(function(b,_){typeof exports=="object"&&typeof module<"u"?_(exports,require("../../core/internal/keyboard"),require("../../core/internal/rows"),require("../../core/plugin/base-plugin")):typeof define=="function"&&define.amd?define(["exports","../../core/internal/keyboard","../../core/internal/rows","../../core/plugin/base-plugin"],_):(b=typeof globalThis<"u"?globalThis:b||self,_(b.TbwGridPlugin_editing={},b.TbwGrid,b.TbwGrid,b.TbwGrid))})(this,(function(b,_,C,q){"use strict";const B="@layer tbw-plugins{tbw-grid{--tbw-editing-bg: var(--tbw-color-selection);--tbw-editing-row-bg: var(--tbw-editing-bg);--tbw-editing-border: var(--tbw-border-input, 1px solid var(--tbw-color-border-strong));--tbw-padding-editing-input: var(--tbw-cell-padding-input, 2px 6px);--tbw-font-size-editor: inherit;--tbw-editing-row-outline-color: var(--tbw-color-accent);--tbw-editing-row-outline-width: 1px;--tbw-invalid-bg: light-dark(#fef2f2, #450a0a);--tbw-invalid-border-color: light-dark(#ef4444, #f87171)}tbw-grid:not(.tbw-grid-mode) .data-grid-row:has(.editing){background:var(--tbw-editing-row-bg);outline:var(--tbw-editing-row-outline-width) solid var(--tbw-editing-row-outline-color);outline-offset:calc(-1 * var(--tbw-editing-row-outline-width))}tbw-grid .data-grid-row>.cell.editing{overflow:hidden;padding:0;display:flex;min-height:calc(var(--tbw-row-height) + 2px);align-items:center;justify-content:center}tbw-grid .data-grid-row>.cell.editing input:not([type=checkbox]),tbw-grid .data-grid-row>.cell.editing select,tbw-grid .data-grid-row>.cell.editing textarea{width:100%;height:100%;flex:1 1 auto;min-width:0;border:var(--tbw-editing-border);padding:var(--tbw-padding-editing-input);font-size:var(--tbw-font-size-editor)}tbw-grid .tbw-editor-host{display:contents}tbw-grid .data-grid-row>.cell[data-invalid=true]{background:var(--tbw-invalid-bg);outline:1px solid var(--tbw-invalid-border-color);outline-offset:-1px}}";function D(o){const e=o.options;return e?typeof e=="function"?e():e:[]}function P(o){return e=>{const t=o.editorParams,i=document.createElement("input");i.type="number",i.value=e.value!=null?String(e.value):"",t?.min!==void 0&&(i.min=String(t.min)),t?.max!==void 0&&(i.max=String(t.max)),t?.step!==void 0&&(i.step=String(t.step)),t?.placeholder&&(i.placeholder=t.placeholder);const n=()=>e.commit(i.value===""?null:Number(i.value));return i.addEventListener("blur",n),i.addEventListener("keydown",s=>{s.key==="Enter"&&n(),s.key==="Escape"&&e.cancel()}),i}}function M(){return o=>{const e=document.createElement("input");return e.type="checkbox",e.checked=!!o.value,e.addEventListener("change",()=>o.commit(e.checked)),e}}function G(o){return e=>{const t=o.editorParams,i=document.createElement("input");i.type="date",e.value instanceof Date?i.valueAsDate=e.value:typeof e.value=="string"&&e.value&&(i.value=e.value.split("T")[0]),t?.min&&(i.min=t.min),t?.max&&(i.max=t.max),t?.placeholder&&(i.placeholder=t.placeholder);const n=()=>{typeof e.value=="string"?e.commit(i.value):e.commit(i.valueAsDate)};return i.addEventListener("change",n),i.addEventListener("keydown",s=>{s.key==="Escape"&&e.cancel()}),i}}function x(o){return e=>{const t=o.editorParams,i=document.createElement("select");if(o.multi&&(i.multiple=!0),t?.includeEmpty){const r=document.createElement("option");r.value="",r.textContent=t.emptyLabel??"",i.appendChild(r)}D(o).forEach(r=>{const l=document.createElement("option");l.value=String(r.value),l.textContent=r.label,(o.multi&&Array.isArray(e.value)&&e.value.includes(r.value)||!o.multi&&e.value===r.value)&&(l.selected=!0),i.appendChild(l)});const s=()=>{if(o.multi){const r=Array.from(i.selectedOptions).map(l=>l.value);e.commit(r)}else e.commit(i.value)};return i.addEventListener("change",s),i.addEventListener("blur",s),i.addEventListener("keydown",r=>{r.key==="Escape"&&e.cancel()}),i}}function H(o){return e=>{const t=o.editorParams,i=document.createElement("input");i.type="text",i.value=e.value!=null?String(e.value):"",t?.maxLength!==void 0&&(i.maxLength=t.maxLength),t?.pattern&&(i.pattern=t.pattern),t?.placeholder&&(i.placeholder=t.placeholder);const n=()=>{const s=i.value;(e.value===null||e.value===void 0)&&s===""||typeof e.value=="string"&&s===e.value.replace(/[\n\r]/g,"")||(typeof e.value=="number"&&s!==""?e.commit(Number(s)):e.commit(s))};return i.addEventListener("blur",n),i.addEventListener("keydown",s=>{s.key==="Enter"&&n(),s.key==="Escape"&&e.cancel()}),i}}function A(o){switch(o.type){case"number":return P(o);case"boolean":return M();case"date":return G(o);case"select":return x(o);default:return H(o)}}function $(o,e){if(e.editor)return e.editor;if(e.__editorTemplate)return"template";if(!e.type)return;const i=o.effectiveConfig?.typeDefaults;if(i?.[e.type]?.editor)return i[e.type].editor;const n=o.__frameworkAdapter;if(n?.getTypeDefault){const s=n.getTypeDefault(e.type);if(s?.editor)return s.editor}}function L(o){return!(typeof o!="string"||o==="__proto__"||o==="constructor"||o==="prototype")}function F(o){const e=(o.__editingCellCount??0)+1;o.__editingCellCount=e,o.setAttribute("data-has-editing","")}function N(o){o.__editingCellCount=0,o.removeAttribute("data-has-editing")}function S(o,e,t){return o instanceof HTMLInputElement?o.type==="checkbox"?o.checked:o.type==="number"?o.value===""?null:Number(o.value):o.type==="date"?typeof t=="string"?o.value:o.valueAsDate:typeof t=="number"?o.value===""?null:Number(o.value):t==null&&o.value===""||typeof t=="string"&&o.value===t.replace(/[\n\r]/g,"")?t:o.value:e?.type==="number"&&o.value!==""||typeof t=="number"&&o.value!==""?Number(o.value):t==null&&o.value===""?t:o.value}function I(o){}function U(o,e,t,i){const n=o.querySelector("input,textarea,select");n&&(n.addEventListener("blur",()=>{t(S(n,e,i))}),n instanceof HTMLInputElement&&n.type==="checkbox"?n.addEventListener("change",()=>t(n.checked)):n instanceof HTMLSelectElement&&n.addEventListener("change",()=>t(S(n,e,i))))}class j extends q.BaseGridPlugin{static manifest={ownedProperties:[{property:"editable",level:"column",description:'the "editable" column property',isUsed:e=>e===!0},{property:"editor",level:"column",description:'the "editor" column property'},{property:"editorParams",level:"column",description:'the "editorParams" column property'}],events:[{type:"cell-edit-committed",description:"Emitted when a cell edit is committed (for plugin-to-plugin coordination)"}],queries:[{type:"isEditing",description:"Returns whether any cell is currently being edited"}]};name="editing";styles=B;get defaultConfig(){return{mode:"row",editOn:"click"}}get#t(){return this.config.mode==="grid"}#e=-1;#l;#u;#h=-1;#a=new Map;#n=new Set;#o=new Set;#c=new Map;#g=!1;#p=-1;#i=new Map;#r=!1;#d=!1;#f=!1;attach(e){super.attach(e);const t=this.disconnectSignal,i=e;i._activeEditRows=-1,i._rowEditSnapshots=new Map,Object.defineProperty(e,"changedRows",{get:()=>this.changedRows,configurable:!0}),Object.defineProperty(e,"changedRowIds",{get:()=>this.changedRowIds,configurable:!0}),e.resetChangedRows=n=>this.resetChangedRows(n),e.beginBulkEdit=(n,s)=>{s&&this.beginCellEdit(n,s)},document.addEventListener("keydown",n=>{if(!this.#t&&n.key==="Escape"&&this.#e!==-1){if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(n)===!1)return;this.#s(this.#e,!0)}},{capture:!0,signal:t}),document.addEventListener("mousedown",n=>{if(this.#t||this.#e===-1)return;const s=i.findRenderedRowElement?.(this.#e);!s||(n.composedPath&&n.composedPath()||[]).includes(s)||this.config.onBeforeEditClose&&this.config.onBeforeEditClose(n)===!1||queueMicrotask(()=>{this.#e!==-1&&this.#s(this.#e,!1)})},{signal:t}),this.gridElement.addEventListener("cell-change",n=>{const s=n.detail;if(s.source==="user")return;const r=`${s.rowIndex}:${s.field}`,l=this.#c.get(r);l&&l(s.newValue)},{signal:t}),this.#t&&(i._isGridEditMode=!0,this.gridElement.classList.add("tbw-grid-mode"),this.requestRender(),this.gridElement.addEventListener("focusin",n=>{const s=n.target;if(s.matches(C.FOCUSABLE_EDITOR_SELECTOR)){if(this.#d){s.blur(),this.gridElement.focus();return}this.#r=!0}},{signal:t}),this.gridElement.addEventListener("focusout",n=>{const s=n.relatedTarget;(!s||!this.gridElement.contains(s)||!s.matches(C.FOCUSABLE_EDITOR_SELECTOR))&&(this.#r=!1)},{signal:t}),this.gridElement.addEventListener("keydown",n=>{if(n.key==="Escape"&&this.#r){if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(n)===!1)return;const s=document.activeElement;s&&this.gridElement.contains(s)&&(s.blur(),this.gridElement.focus()),this.#r=!1,this.#d=!0,n.preventDefault(),n.stopPropagation()}},{capture:!0,signal:t}),this.gridElement.addEventListener("mousedown",n=>{n.target.matches(C.FOCUSABLE_EDITOR_SELECTOR)&&(this.#d=!1)},{signal:t}))}detach(){const e=this.gridElement;e._isGridEditMode=!1,this.gridElement.classList.remove("tbw-grid-mode"),this.#e=-1,this.#l=void 0,this.#u=void 0,this.#h=-1,this.#a.clear(),this.#n.clear(),this.#o.clear(),this.#c.clear(),this.#r=!1,this.#d=!1,this.#f=!1,super.detach()}handleQuery(e){if(e.type==="isEditing")return this.#t||this.#e!==-1}onCellClick(e){if(this.#t)return!1;const t=this.grid,i=this.config.editOn??t.effectiveConfig?.editOn;if(i===!1||i==="manual"||i!=="click"&&i!=="dblclick")return!1;const n=e.originalEvent.type==="dblclick";if(i==="click"&&n||i==="dblclick"&&!n)return!1;const{rowIndex:s}=e;return t._columns?.some(l=>l.editable)?(e.originalEvent.stopPropagation(),this.beginBulkEdit(s),!0):!1}onKeyDown(e){const t=this.grid;if(e.key==="Escape"){if(this.#t&&this.#r){if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(e)===!1)return!0;const i=document.activeElement;return i&&this.gridElement.contains(i)&&i.blur(),this.#r=!1,this.requestAfterRender(),!0}if(this.#e!==-1&&!this.#t)return this.config.onBeforeEditClose&&this.config.onBeforeEditClose(e)===!1||this.#s(this.#e,!0),!0}if(this.#t&&!this.#r&&(e.key==="ArrowUp"||e.key==="ArrowDown"||e.key==="ArrowLeft"||e.key==="ArrowRight"))return!1;if(this.#t&&this.#r&&(e.key==="ArrowUp"||e.key==="ArrowDown"))return!0;if((e.key==="ArrowUp"||e.key==="ArrowDown")&&this.#e!==-1&&!this.#t){if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(e)===!1)return!0;const i=t._rows.length-1,n=this.#e;return this.#s(n,!1),e.key==="ArrowDown"?t._focusRow=Math.min(i,t._focusRow+1):t._focusRow=Math.max(0,t._focusRow-1),e.preventDefault(),_.ensureCellVisible(t),this.requestAfterRender(),!0}if(e.key==="Tab"&&(this.#e!==-1||this.#t)){if(e.preventDefault(),this.#f)return this.#s(this.#e,!1),!0;const i=!e.shiftKey;return this.#_(i),!0}if(e.key===" "||e.key==="Spacebar"){if(this.#e!==-1)return!1;const i=t._focusRow,n=t._focusCol;if(i>=0&&n>=0){const s=t._visibleColumns[n],r=t._rows[i];if(s?.editable&&s.type==="boolean"&&r){const l=s.field;if(L(l)){const c=!r[l];return this.#v(i,s,c,r),e.preventDefault(),this.requestRender(),!0}}}return!1}if(e.key==="Enter"&&!e.shiftKey&&!e.ctrlKey&&!e.altKey&&!e.metaKey){if(this.#t&&!this.#r)return this.#R(),!0;if(this.#e!==-1)return!!(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(e)===!1);const i=this.config.editOn??t.effectiveConfig?.editOn;if(i===!1||i==="manual")return!1;const n=t._focusRow,s=t._focusCol;if(n>=0&&t._columns?.some(l=>l.editable)){const l=t._visibleColumns[s],a=t._rows[n],c=l?.field??"",f=c&&a?a[c]:void 0,E=this.gridElement.querySelector(`[data-row="${n}"][data-col="${s}"]`),u=new CustomEvent("cell-activate",{cancelable:!0,bubbles:!0,detail:{rowIndex:n,colIndex:s,field:c,value:f,row:a,cellEl:E,trigger:"keyboard",originalEvent:e}});this.gridElement.dispatchEvent(u);const m=new CustomEvent("activate-cell",{cancelable:!0,bubbles:!0,detail:{row:n,col:s}});return this.gridElement.dispatchEvent(m),u.defaultPrevented||m.defaultPrevented?(e.preventDefault(),!0):(this.beginBulkEdit(n),!0)}return!1}if(e.key==="F2"){if(this.#e!==-1||this.#t||(this.config.editOn??t.effectiveConfig?.editOn)===!1)return!1;const n=t._focusRow,s=t._focusCol;if(n>=0&&s>=0){const r=t._visibleColumns[s];if(r?.editable&&r.field)return e.preventDefault(),this.beginCellEdit(n,r.field),!0}return!1}return!1}processColumns(e){const t=this.grid,i=t.effectiveConfig?.typeDefaults,n=t.__frameworkAdapter;return!i&&!n?.getTypeDefault?e:e.map(s=>{if(!s.type)return s;let r;if(i?.[s.type]?.editorParams&&(r=i[s.type].editorParams),!r&&n?.getTypeDefault){const l=n.getTypeDefault(s.type);l?.editorParams&&(r=l.editorParams)}return r?{...s,editorParams:{...r,...s.editorParams}}:s})}afterRender(){const e=this.grid;if(this.#g&&(this.#g=!1,this.#y(e)),this.#p!==-1){const t=this.#p;this.#p=-1,e.animateRow?.(t,"change")}if(!this.#t&&this.#o.size!==0)for(const t of this.#o){const[i,n]=t.split(":"),s=parseInt(i,10),r=parseInt(n,10),l=e.findRenderedRowElement?.(s);if(!l)continue;const a=l.querySelector(`.cell[data-col="${r}"]`);if(!a||a.classList.contains("editing"))continue;const c=e._rows[s],f=e._visibleColumns[r];c&&f&&this.#w(c,s,f,r,a,!0)}}afterCellRender(e){if(!this.#t)return;const{row:t,rowIndex:i,column:n,colIndex:s,cellElement:r}=e;n.editable&&(r.classList.contains("editing")||this.#w(t,i,n,s,r,!0))}onScrollRender(){this.afterRender()}get changedRows(){const e=[];for(const t of this.#n){const i=this.grid.getRow(t);i&&e.push(i)}return e}get changedRowIds(){return Array.from(this.#n)}get activeEditRow(){return this.#e}get activeEditCol(){return this.#h}isRowEditing(e){return this.#e===e}isCellEditing(e,t){return this.#o.has(`${e}:${t}`)}isRowChanged(e){const t=this.grid,i=t._rows[e];if(!i)return!1;try{const n=t.getRowId?.(i);return n?this.#n.has(n):!1}catch{return!1}}isRowChangedById(e){return this.#n.has(e)}setInvalid(e,t,i=""){let n=this.#i.get(e);n||(n=new Map,this.#i.set(e,n)),n.set(t,i),this.#E(e,t,!0)}clearInvalid(e,t){const i=this.#i.get(e);i&&(i.delete(t),i.size===0&&this.#i.delete(e)),this.#E(e,t,!1)}clearRowInvalid(e){const t=this.#i.get(e);if(t){const i=Array.from(t.keys());this.#i.delete(e),i.forEach(n=>this.#E(e,n,!1))}}clearAllInvalid(){const e=Array.from(this.#i.entries());this.#i.clear(),e.forEach(([t,i])=>{i.forEach((n,s)=>this.#E(t,s,!1))})}isCellInvalid(e,t){return this.#i.get(e)?.has(t)??!1}getInvalidMessage(e,t){return this.#i.get(e)?.get(t)}hasInvalidCells(e){const t=this.#i.get(e);return t?t.size>0:!1}getInvalidFields(e){return new Map(this.#i.get(e)??[])}#E(e,t,i){const n=this.grid,s=n._visibleColumns?.findIndex(f=>f.field===t);if(s===-1||s===void 0)return;const l=n._rows?.findIndex(f=>{try{return n.getRowId?.(f)===e}catch{return!1}});if(l===-1||l===void 0)return;const c=n.findRenderedRowElement?.(l)?.querySelector(`.cell[data-col="${s}"]`);if(c)if(i){c.setAttribute("data-invalid","true");const f=this.#i.get(e)?.get(t);f&&c.setAttribute("title",f)}else c.removeAttribute("data-invalid"),c.removeAttribute("title")}resetChangedRows(e){const t=this.changedRows,i=this.changedRowIds;this.#n.clear(),this.#m(),e||this.emit("changed-rows-reset",{rows:t,ids:i}),this.grid._rowPool?.forEach(s=>s.classList.remove("changed"))}beginCellEdit(e,t){const i=this.grid,n=i._visibleColumns.findIndex(a=>a.field===t);if(n===-1||!i._visibleColumns[n]?.editable)return;const l=i.findRenderedRowElement?.(e)?.querySelector(`.cell[data-col="${n}"]`);l&&(this.#f=!0,this.#C(e,n,l))}beginBulkEdit(e){const t=this.grid;if((this.config.editOn??t.effectiveConfig?.editOn)===!1||!t._columns?.some(l=>l.editable))return;const s=t.findRenderedRowElement?.(e);if(!s)return;this.#f=!1;const r=t._rows[e];this.#b(e,r),Array.from(s.children).forEach((l,a)=>{const c=t._visibleColumns[a];if(c?.editable){const f=l;f.classList.contains("editing")||this.#w(r,e,c,a,f,!0)}}),setTimeout(()=>{let l=s.querySelector(`.cell[data-col="${t._focusCol}"]`);if(l?.classList.contains("editing")||(l=s.querySelector(".cell.editing")),l?.classList.contains("editing")){const a=l.querySelector(C.FOCUSABLE_EDITOR_SELECTOR);try{a?.focus({preventScroll:!0})}catch{}}},0)}commitActiveRowEdit(){this.#e!==-1&&this.#s(this.#e,!1)}cancelActiveRowEdit(){this.#e!==-1&&this.#s(this.#e,!0)}#C(e,t,i){const n=this.grid,s=n._rows[e],r=n._visibleColumns[t];!s||!r?.editable||i.classList.contains("editing")||(this.#e!==e&&this.#b(e,s),this.#h=t,this.#w(s,e,r,t,i,!1))}#R(){const e=this.grid,t=e._focusRow,i=e._focusCol;if(t<0||i<0)return;const s=e.findRenderedRowElement?.(t)?.querySelector(`.cell[data-col="${i}"]`);if(s?.classList.contains("editing")){const r=s.querySelector(C.FOCUSABLE_EDITOR_SELECTOR);r&&(this.#d=!1,r.focus(),this.#r=!0,r instanceof HTMLInputElement&&(r.type==="text"||r.type==="number")&&r.select())}}#_(e){const t=this.grid,i=t._rows,n=this.#t?t._focusRow:this.#e,s=t._visibleColumns.map((c,f)=>c.editable?f:-1).filter(c=>c>=0);if(s.length===0)return;const l=s.indexOf(t._focusCol)+(e?1:-1);if(l>=0&&l<s.length){t._focusCol=s[l];const f=t.findRenderedRowElement?.(n)?.querySelector(`.cell[data-col="${s[l]}"]`);f?.classList.contains("editing")&&f.querySelector(C.FOCUSABLE_EDITOR_SELECTOR)?.focus({preventScroll:!0}),_.ensureCellVisible(t,{forceHorizontalScroll:!0});return}const a=n+(e?1:-1);a>=0&&a<i.length&&(this.#t?(t._focusRow=a,t._focusCol=e?s[0]:s[s.length-1],_.ensureCellVisible(t,{forceHorizontalScroll:!0}),this.requestAfterRender(),setTimeout(()=>{const f=t.findRenderedRowElement?.(a)?.querySelector(`.cell[data-col="${t._focusCol}"]`);f?.classList.contains("editing")&&f.querySelector(C.FOCUSABLE_EDITOR_SELECTOR)?.focus({preventScroll:!0})},0)):(this.#s(n,!1),t._focusRow=a,t._focusCol=e?s[0]:s[s.length-1],this.beginBulkEdit(a),_.ensureCellVisible(t,{forceHorizontalScroll:!0})))}#m(){const e=this.grid;e._activeEditRows=this.#e,e._rowEditSnapshots=this.#a}#b(e,t){if(this.#e!==e){this.#a.set(e,{...t}),this.#e=e,this.#u=t;const i=this.grid;try{this.#l=i.getRowId?.(t)??void 0}catch{this.#l=void 0}this.#m(),this.#t||this.emit("edit-open",{rowIndex:e,rowId:this.#l??"",row:t})}}#s(e,t){if(this.#e!==e)return;const i=this.grid,n=this.#a.get(e),s=i.findRenderedRowElement?.(e);let r=this.#l;const a=(r?i._getRowEntry(r):void 0)?.row??this.#u??i._rows[e];if(!r&&a)try{r=i.getRowId?.(a)}catch{}if(!t&&s&&a&&s.querySelectorAll(".cell.editing").forEach(f=>{const E=Number(f.getAttribute("data-col"));if(isNaN(E))return;const u=i._visibleColumns[E];if(!u||f.hasAttribute("data-editor-managed"))return;const m=f.querySelector("input,textarea,select");if(m){const g=u.field,p=a[g],R=S(m,u,p);p!==R&&this.#v(e,u,R,a)}}),t&&n&&a)Object.keys(n).forEach(c=>{a[c]=n[c]}),r&&(this.#n.delete(r),this.clearRowInvalid(r));else if(!t&&a){const c=this.#k(n,a),f=r?this.#n.has(r):c,E=this.emitCancelable("row-commit",{rowIndex:e,rowId:r??"",row:a,oldValue:n,newValue:a,changed:f,changedRows:this.changedRows,changedRowIds:this.changedRowIds});E&&n?(Object.keys(n).forEach(u=>{a[u]=n[u]}),r&&(this.#n.delete(r),this.clearRowInvalid(r))):!E&&c&&this.isAnimationEnabled&&(this.#p=e)}this.#a.delete(e),this.#e=-1,this.#l=void 0,this.#u=void 0,this.#h=-1,this.#f=!1,this.#m();for(const c of this.#o)c.startsWith(`${e}:`)&&this.#o.delete(c);for(const c of this.#c.keys())c.startsWith(`${e}:`)&&this.#c.delete(c);this.#g=!0,s?(s.querySelectorAll(".cell.editing").forEach(c=>{c.classList.remove("editing"),N(c.parentElement)}),i.refreshVirtualWindow(!0)):(this.#y(i),this.#g=!1),!this.#t&&a&&this.emit("edit-close",{rowIndex:e,rowId:r??"",row:a,reverted:t})}#v(e,t,i,n){const s=t.field;if(!L(s))return;const r=n[s];if(r===i)return;const l=this.grid;let a;try{a=this.grid.getRowId(n)}catch{}const c=a?!this.#n.has(a):!0,f=a?p=>this.grid.updateRow(a,p,"cascade"):I;let E=!1;const u=a?p=>{E=!0,this.setInvalid(a,s,p??"")}:()=>{};if(this.emitCancelable("cell-commit",{row:n,rowId:a??"",field:s,oldValue:r,value:i,rowIndex:e,changedRows:this.changedRows,changedRowIds:this.changedRowIds,firstTimeForRow:c,updateRow:f,setInvalid:u}))return;a&&!E&&this.isCellInvalid(a,s)&&this.clearInvalid(a,s),n[s]=i,a&&this.#n.add(a),this.#m(),this.emitPluginEvent("cell-edit-committed",{rowIndex:e,field:s,oldValue:r,newValue:i});const g=l.findRenderedRowElement?.(e);g&&g.classList.add("changed")}#w(e,t,i,n,s,r){if(!i.editable||s.classList.contains("editing"))return;let l;try{l=this.grid.getRowId(e)}catch{}const a=l?d=>this.grid.updateRow(l,d,"cascade"):I,c=L(i.field)?e[i.field]:void 0;s.classList.add("editing"),this.#o.add(`${t}:${n}`);const f=s.parentElement;f&&F(f);let E=!1;const u=d=>{if(E||!this.#t&&this.#e===-1)return;const h=this.grid,v=l?h._getRowEntry(l):void 0,y=v?.row??e,K=v?.index??t;this.#v(K,i,d,y)},m=()=>{if(E=!0,L(i.field)){const d=this.grid,v=(l?d._getRowEntry(l):void 0)?.row??e;v[i.field]=c}},g=document.createElement("div");g.className="tbw-editor-host",s.innerHTML="",s.appendChild(g),g.addEventListener("keydown",d=>{if(d.key==="Enter"){if(this.#t){d.stopPropagation(),d.preventDefault();const h=g.querySelector("input,textarea,select");h&&u(S(h,i,c));return}if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(d)===!1)return;d.stopPropagation(),d.preventDefault(),E=!0,this.#s(t,!1)}if(d.key==="Escape"){if(this.#t){d.stopPropagation(),d.preventDefault();return}if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(d)===!1)return;d.stopPropagation(),d.preventDefault(),m(),this.#s(t,!0)}});const p=i,R=p.__editorTemplate,w=$(this.grid,p)??A(i),T=c,z=`${t}:${i.field}`,O=[];this.#c.set(z,d=>{for(const h of O)h(d)});const k=d=>{O.push(d)};if(w==="template"&&R)this.#S(g,p,e,c,u,m,r,t),k(d=>{const h=g.querySelector("input,textarea,select");h&&(h instanceof HTMLInputElement&&h.type==="checkbox"?h.checked=!!d:h.value=String(d??""))});else if(typeof w=="string"){const d=document.createElement(w);d.value=T,d.addEventListener("change",()=>u(d.value)),k(h=>{d.value=h}),g.appendChild(d),r||queueMicrotask(()=>{g.querySelector(C.FOCUSABLE_EDITOR_SELECTOR)?.focus({preventScroll:!0})})}else if(typeof w=="function"){const d={row:e,rowId:l??"",value:T,field:i.field,column:i,commit:u,cancel:m,updateRow:a,onValueChange:k},h=w(d);typeof h=="string"?(g.innerHTML=h,U(g,i,u,c),k(v=>{const y=g.querySelector("input,textarea,select");y&&(y instanceof HTMLInputElement&&y.type==="checkbox"?y.checked=!!v:y.value=String(v??""))})):h instanceof Node&&(g.appendChild(h),h instanceof HTMLInputElement||h instanceof HTMLSelectElement||h instanceof HTMLTextAreaElement?k(y=>{h instanceof HTMLInputElement&&h.type==="checkbox"?h.checked=!!y:h.value=String(y??"")}):s.setAttribute("data-editor-managed","")),r||queueMicrotask(()=>{g.querySelector(C.FOCUSABLE_EDITOR_SELECTOR)?.focus({preventScroll:!0})})}else if(w&&typeof w=="object"){const d=document.createElement("div");d.setAttribute("data-external-editor",""),d.setAttribute("data-field",i.field),g.appendChild(d),s.setAttribute("data-editor-managed","");const h={row:e,rowId:l??"",value:T,field:i.field,column:i,commit:u,cancel:m,updateRow:a,onValueChange:k};if(w.mount)try{w.mount({placeholder:d,context:h,spec:w})}catch(v){console.warn(`[tbw-grid] External editor mount error for column '${i.field}':`,v)}else this.grid.dispatchEvent(new CustomEvent("mount-external-editor",{detail:{placeholder:d,spec:w,context:h}}))}}#S(e,t,i,n,s,r,l,a){const c=t.__editorTemplate;if(!c)return;const f=c.cloneNode(!0),E=t.__compiledEditor;E?f.innerHTML=E({row:i,value:n,field:t.field,column:t,commit:s,cancel:r}):f.querySelectorAll("*").forEach(m=>{m.childNodes.length===1&&m.firstChild?.nodeType===Node.TEXT_NODE&&(m.textContent=m.textContent?.replace(/{{\s*value\s*}}/g,n==null?"":String(n)).replace(/{{\s*row\.([a-zA-Z0-9_]+)\s*}}/g,(g,p)=>{if(!L(p))return"";const R=i[p];return R==null?"":String(R)})||"")});const u=f.querySelector("input,textarea,select");if(u){u instanceof HTMLInputElement&&u.type==="checkbox"?u.checked=!!n:u.value=String(n??"");let m=!1;u.addEventListener("blur",()=>{m||s(S(u,t,n))}),u.addEventListener("keydown",g=>{const p=g;if(p.key==="Enter"){if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(p)===!1)return;p.stopPropagation(),p.preventDefault(),m=!0,s(S(u,t,n)),this.#s(a,!1)}if(p.key==="Escape"){if(this.config.onBeforeEditClose&&this.config.onBeforeEditClose(p)===!1)return;p.stopPropagation(),p.preventDefault(),r(),this.#s(a,!0)}}),u instanceof HTMLInputElement&&u.type==="checkbox"&&u.addEventListener("change",()=>s(u.checked)),l||setTimeout(()=>u.focus({preventScroll:!0}),0)}e.appendChild(f)}#k(e,t){if(!e)return!1;const i=e,n=t,s=new Set([...Object.keys(i),...Object.keys(n)]);for(const r of s)if(i[r]!==n[r])return!0;return!1}#y(e){queueMicrotask(()=>{try{const t=e._focusRow,i=e._focusCol,n=e.findRenderedRowElement?.(t);if(n){Array.from(e._bodyEl.querySelectorAll(".cell-focus")).forEach(r=>r.classList.remove("cell-focus"));const s=n.querySelector(`.cell[data-row="${t}"][data-col="${i}"]`);s&&(s.classList.add("cell-focus"),s.setAttribute("aria-selected","true"),s.hasAttribute("tabindex")||s.setAttribute("tabindex","-1"),s.focus({preventScroll:!0}))}}catch{}})}}b.EditingPlugin=j,b.defaultEditorFor=A,Object.defineProperty(b,Symbol.toStringTag,{value:"Module"})}));
|
|
2
2
|
//# sourceMappingURL=editing.umd.js.map
|