@ninebone/datagrid 0.0.23 → 0.0.24
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/dist/nine-table.js +2 -2
- package/dist/nine-table.umd.js +2 -2
- package/package.json +2 -2
package/dist/nine-table.js
CHANGED
|
@@ -2930,7 +2930,7 @@ var P = class {
|
|
|
2930
2930
|
let e = Array.from(this.#e.children).filter((e) => e.tagName.toUpperCase() === "TABLE"), t = e.length, n = e.map((e, n) => {
|
|
2931
2931
|
let r = n === 0 ? "active" : "", i = e.id || `sheet${n + 1}`;
|
|
2932
2932
|
return `<nine-table-sheet class="${r}" data-index="${n}" data-sheet-id="${i}" id="${i}"></nine-table-sheet>` + (n < t - 1 ? `<nine-splitter class="h" data-split-index="${n}"></nine-splitter>` : "");
|
|
2933
|
-
}).join(""), r = ["@import \"https://cdn.jsdelivr.net/npm/@ninebone/datagrid@0.0.
|
|
2933
|
+
}).join(""), r = ["@import \"https://cdn.jsdelivr.net/npm/@ninebone/datagrid@0.0.24/dist/css/nine-table.css\";"];
|
|
2934
2934
|
nine["nine-table"] && nine["nine-table"].cssFile && r.push(`@import "${nine["nine-table"].cssFile}";`), this.#e.shadowRoot.innerHTML = `
|
|
2935
2935
|
<style>
|
|
2936
2936
|
${r.join("\n")}
|
|
@@ -3068,7 +3068,7 @@ var P = class {
|
|
|
3068
3068
|
#i;
|
|
3069
3069
|
#a = 0;
|
|
3070
3070
|
constructor() {
|
|
3071
|
-
super(), ["NINE-TABLE"].includes(this.tagName) && n.log("Welcome nine-table", "0.0.
|
|
3071
|
+
super(), ["NINE-TABLE"].includes(this.tagName) && n.log("Welcome nine-table", "0.0.24"), this.#e = this.attachShadow({ mode: "open" }), this.#t = new o(this), this.#r = new I(this), this.#i = new L(this), this.#c();
|
|
3072
3072
|
}
|
|
3073
3073
|
connectedCallback() {
|
|
3074
3074
|
setTimeout(() => {
|
package/dist/nine-table.umd.js
CHANGED
|
@@ -77,7 +77,7 @@
|
|
|
77
77
|
|
|
78
78
|
<div class="ng-col-mover-grip"></div>
|
|
79
79
|
<div class="ng-col-mover-indi"></div>
|
|
80
|
-
`,this.#m={mainBody:this.querySelector(`.ng-sheet-body .ng-container-body`),hscrollbar:this.querySelector(`nine-table-hscrollbar`),vscrollbar:this.querySelector(`nine-table-vscrollbar`),content:this.querySelector(`.ng-sheet-body .ng-sheet-body-content`),scrollHolder:this.querySelector(`.ng-sheet-body .ng-virtual-height-holder`)}};#w=()=>{let e=this.querySelector(`.ng-container-left table`),t=this.querySelector(`.ng-container-body table`),n=this.querySelector(`.ng-container-right table`),r=Array.from(e.querySelectorAll(`thead tr:not(.col-indicator-rowgroup)`)),i=Array.from(t.querySelectorAll(`thead tr:not(.col-indicator-rowgroup)`)),a=Array.from(n.querySelectorAll(`thead tr:not(.col-indicator-rowgroup)`));this.#T(r,i,a);let o=Array.from(e.querySelectorAll(`tfoot tr`)),s=Array.from(t.querySelectorAll(`tfoot tr`)),c=Array.from(n.querySelectorAll(`tfoot tr`));this.#T(o,s,c)};#T=(e,t,n)=>{setTimeout(()=>{let r=Math.max(e.length,t.length,n.length);for(let i=0;i<r;i++){let r=[e[i]?.getBoundingClientRect().height||0,t[i]?.getBoundingClientRect().height||0,n[i]?.getBoundingClientRect().height||0],a=Math.max(...r);a>0&&(e[i]&&(e[i].style.height=`${a}px`),t[i]&&(t[i].style.height=`${a}px`),n[i]&&(n[i].style.height=`${a}px`))}})};#E=()=>{let e=this.querySelector(`.ng-sheet-body`);if(!e)return;let t=null;e.addEventListener(`mouseover`,n=>{let r=n.target.closest(`tr`);if(!r||!r.dataset.row&&r.dataset.row!==`0`)return;let i=r.dataset.row;t!==i&&(t=i,e.querySelectorAll(`tr[data-row="${i}"]`).forEach(e=>{e.classList.add(`hover`)}))}),e.addEventListener(`mouseout`,n=>{let r=n.target.closest(`tr`);if(!r)return;let i=n.relatedTarget;r.contains(i)||(e.querySelectorAll(`tr.hover`).forEach(e=>{e.classList.remove(`hover`)}),t=null)})};#D=()=>{[this.#d].forEach(e=>{new Set([...Reflect.ownKeys(e),...Reflect.ownKeys(Object.getPrototypeOf(e))]).forEach(t=>{if(t===`constructor`||String(t).startsWith(`#`))return;let n=e[t];typeof n==`function`?this[t]||(this[t]=(...t)=>n.apply(e,t)):typeof n==`object`&&n&&(this[t]||(this[t]=n))})})};disconnectedCallback(){this.#a?.destroy(),this.#o?.destroy(),this.innerHTML=``}};customElements.get(`nine-table-sheet`)||customElements.define(`nine-table-sheet`,P);var F=class{#e;constructor(e){this.#e=e,this.#t()}#t=()=>{this.#n(),this.#r()};set loading(e){e?this.#e.classList.add(`loading`):this.#e.classList.remove(`loading`)}#n=()=>{let e=Array.from(this.#e.children).filter(e=>e.tagName.toUpperCase()===`TABLE`),t=e.length,n=e.map((e,n)=>{let r=n===0?`active`:``,i=e.id||`sheet${n+1}`;return`<nine-table-sheet class="${r}" data-index="${n}" data-sheet-id="${i}" id="${i}"></nine-table-sheet>`+(n<t-1?`<nine-splitter class="h" data-split-index="${n}"></nine-splitter>`:``)}).join(``),r=[`@import "https://cdn.jsdelivr.net/npm/@ninebone/datagrid@0.0.
|
|
80
|
+
`,this.#m={mainBody:this.querySelector(`.ng-sheet-body .ng-container-body`),hscrollbar:this.querySelector(`nine-table-hscrollbar`),vscrollbar:this.querySelector(`nine-table-vscrollbar`),content:this.querySelector(`.ng-sheet-body .ng-sheet-body-content`),scrollHolder:this.querySelector(`.ng-sheet-body .ng-virtual-height-holder`)}};#w=()=>{let e=this.querySelector(`.ng-container-left table`),t=this.querySelector(`.ng-container-body table`),n=this.querySelector(`.ng-container-right table`),r=Array.from(e.querySelectorAll(`thead tr:not(.col-indicator-rowgroup)`)),i=Array.from(t.querySelectorAll(`thead tr:not(.col-indicator-rowgroup)`)),a=Array.from(n.querySelectorAll(`thead tr:not(.col-indicator-rowgroup)`));this.#T(r,i,a);let o=Array.from(e.querySelectorAll(`tfoot tr`)),s=Array.from(t.querySelectorAll(`tfoot tr`)),c=Array.from(n.querySelectorAll(`tfoot tr`));this.#T(o,s,c)};#T=(e,t,n)=>{setTimeout(()=>{let r=Math.max(e.length,t.length,n.length);for(let i=0;i<r;i++){let r=[e[i]?.getBoundingClientRect().height||0,t[i]?.getBoundingClientRect().height||0,n[i]?.getBoundingClientRect().height||0],a=Math.max(...r);a>0&&(e[i]&&(e[i].style.height=`${a}px`),t[i]&&(t[i].style.height=`${a}px`),n[i]&&(n[i].style.height=`${a}px`))}})};#E=()=>{let e=this.querySelector(`.ng-sheet-body`);if(!e)return;let t=null;e.addEventListener(`mouseover`,n=>{let r=n.target.closest(`tr`);if(!r||!r.dataset.row&&r.dataset.row!==`0`)return;let i=r.dataset.row;t!==i&&(t=i,e.querySelectorAll(`tr[data-row="${i}"]`).forEach(e=>{e.classList.add(`hover`)}))}),e.addEventListener(`mouseout`,n=>{let r=n.target.closest(`tr`);if(!r)return;let i=n.relatedTarget;r.contains(i)||(e.querySelectorAll(`tr.hover`).forEach(e=>{e.classList.remove(`hover`)}),t=null)})};#D=()=>{[this.#d].forEach(e=>{new Set([...Reflect.ownKeys(e),...Reflect.ownKeys(Object.getPrototypeOf(e))]).forEach(t=>{if(t===`constructor`||String(t).startsWith(`#`))return;let n=e[t];typeof n==`function`?this[t]||(this[t]=(...t)=>n.apply(e,t)):typeof n==`object`&&n&&(this[t]||(this[t]=n))})})};disconnectedCallback(){this.#a?.destroy(),this.#o?.destroy(),this.innerHTML=``}};customElements.get(`nine-table-sheet`)||customElements.define(`nine-table-sheet`,P);var F=class{#e;constructor(e){this.#e=e,this.#t()}#t=()=>{this.#n(),this.#r()};set loading(e){e?this.#e.classList.add(`loading`):this.#e.classList.remove(`loading`)}#n=()=>{let e=Array.from(this.#e.children).filter(e=>e.tagName.toUpperCase()===`TABLE`),t=e.length,n=e.map((e,n)=>{let r=n===0?`active`:``,i=e.id||`sheet${n+1}`;return`<nine-table-sheet class="${r}" data-index="${n}" data-sheet-id="${i}" id="${i}"></nine-table-sheet>`+(n<t-1?`<nine-splitter class="h" data-split-index="${n}"></nine-splitter>`:``)}).join(``),r=[`@import "https://cdn.jsdelivr.net/npm/@ninebone/datagrid@0.0.24/dist/css/nine-table.css";`];nine[`nine-table`]&&nine[`nine-table`].cssFile&&r.push(`@import "${nine[`nine-table`].cssFile}";`),this.#e.shadowRoot.innerHTML=`
|
|
81
81
|
<style>
|
|
82
82
|
${r.join(`
|
|
83
83
|
`)}
|
|
@@ -104,7 +104,7 @@
|
|
|
104
104
|
|
|
105
105
|
if (!data && !host) return "";
|
|
106
106
|
return ${i};
|
|
107
|
-
`),this.#n.set(i,e)),e(t,n,this.#e)}return i}catch{return e}}},L=class{#e;constructor(e){this.#e=e}provider={style:{value:``},add:e=>{if(!e||typeof e!=`object`)return;let{style:t,...n}=e;t&&typeof t==`string`&&(this.provider.style.value=t),Object.keys(n).length>0&&setTimeout(()=>{Object.entries(n).forEach(([e,t])=>{typeof t==`function`&&(this.#e[e]=t)}),this.#e.rerenderer()})}}},R=class{#e;constructor(e){this.#e=e,[`row`].forEach(e=>{this[e]=new Proxy({},{get:(t,n)=>{let r=this.#t();if(!r||!r[e])return;let i=r[e][n];return typeof i==`function`?(...t)=>i.apply(r[e],t):i}})})}getActiveSheets(){return this.#e.shadow.querySelectorAll(`nine-table-sheet.active`)}#t(){let e=this.getActiveSheets();return e.length>0?e[0]:null}},z=class extends HTMLElement{#e;#t;#n;#r;#i;#a=0;constructor(){super(),[`NINE-TABLE`].includes(this.tagName)&&r.log(`Welcome nine-table`,`0.0.
|
|
107
|
+
`),this.#n.set(i,e)),e(t,n,this.#e)}return i}catch{return e}}},L=class{#e;constructor(e){this.#e=e}provider={style:{value:``},add:e=>{if(!e||typeof e!=`object`)return;let{style:t,...n}=e;t&&typeof t==`string`&&(this.provider.style.value=t),Object.keys(n).length>0&&setTimeout(()=>{Object.entries(n).forEach(([e,t])=>{typeof t==`function`&&(this.#e[e]=t)}),this.#e.rerenderer()})}}},R=class{#e;constructor(e){this.#e=e,[`row`].forEach(e=>{this[e]=new Proxy({},{get:(t,n)=>{let r=this.#t();if(!r||!r[e])return;let i=r[e][n];return typeof i==`function`?(...t)=>i.apply(r[e],t):i}})})}getActiveSheets(){return this.#e.shadow.querySelectorAll(`nine-table-sheet.active`)}#t(){let e=this.getActiveSheets();return e.length>0?e[0]:null}},z=class extends HTMLElement{#e;#t;#n;#r;#i;#a=0;constructor(){super(),[`NINE-TABLE`].includes(this.tagName)&&r.log(`Welcome nine-table`,`0.0.24`),this.#e=this.attachShadow({mode:`open`}),this.#t=new s(this),this.#r=new L(this),this.#i=new R(this),this.#c()}connectedCallback(){setTimeout(()=>{this.#a=this.querySelectorAll(`table`)?.length,this.fields=new c(this),this.exprEngine=new I(this),this.#s(),this.#n=new F(this),this.#o()})}disconnectedCallback(){}#o=()=>{let e=0,t=setInterval(()=>{e++;let n=this.shadow.querySelectorAll(`nine-table-sheet`);if(e>=50&&clearInterval(t),n.length>=this.#a){let e=0;n.forEach(t=>{t.loaded&&e++}),e>=this.#a&&(clearInterval(t),this.loaded=!0,this.dispatchEvent(new CustomEvent(i.EVENT.LOAD,{bubbles:!0,detail:{target:this}})))}},100)};get shadow(){return this.#e}get dataManager(){return this.#t}get data(){return this.#t.data}setData(e){this.#t.data.set(e),this.refresh()}refresh(){this.activeSheet?.invalidate()}set loading(e){this.#n&&(this.#n.loading=e)}rerenderer(){this.activeSheet?.querySelectorAll(`tbody.body th,tbody.body td`).forEach(e=>{Array.from(e.children).find(e=>e.tagName.toLowerCase().startsWith(`cell-`)&&typeof e.rerenderer==`function`)?.rerenderer()})}sheet=e=>{if(e===null||e<0)return this.activeSheet;let t=Array.from(this.shadow.querySelectorAll(`nine-table-sheet`));return typeof e==`number`?t[e]||null:typeof e==`string`?this.shadow.querySelector(`nine-table-sheet#${e}, nine-table-sheet[data-sheet-id="${e}"]`)||null:t[0]||null};get sheets(){return Array.from(this.shadow.querySelectorAll(`nine-table-sheet`))}get activeSheet(){return this.shadow.querySelector(`nine-table-sheet.active`)||null}#s(){let e=new Set;this.querySelectorAll(`[data-source]`).forEach(t=>{let n=t.getAttribute(`data-source`);if(!n)return;let r=n.matchAll(/(?:host\.)?([a-zA-Z0-9_$]+)\s*\(/g);for(let t of r){let n=t[1];n&&n!==`host`&&e.add(n)}}),e.forEach(e=>{let t=null;Object.defineProperty(this,e,{set:e=>{t=e,this.rerenderer()},get:()=>t,configurable:!0,enumerable:!0})})}execute=e=>{setTimeout(()=>{this.loading=!0,setTimeout(()=>{try{e.call(this)}finally{this.loading=!1}})})};#c(){[this.#r,this.#i].forEach(e=>{new Set([...Reflect.ownKeys(e),...Reflect.ownKeys(Object.getPrototypeOf(e))]).forEach(t=>{if(t===`constructor`||String(t).startsWith(`#`))return;let n=e[t];typeof n==`function`?this[t]||(this[t]=(...t)=>n.apply(e,t)):typeof n==`object`&&n&&(this[t]||(this[t]=n))})})}};customElements.get(`nine-table`)||customElements.define(`nine-table`,z),customElements.get(`nine-table-simple`)||customElements.define(`nine-table-simple`,class extends z{connectedCallback(){this.setAttribute(`theme`,`simple`),super.connectedCallback()}});var B=class extends HTMLElement{constructor(){super()}applyBaseStyle(){}connectedCallback(){}},V=new Map,H=class extends B{#e;#t;#n;#r;#i;constructor(){super()}get host(){return this.#e}get sheet(){return this.#t}get cell(){return this.#r}get tr(){return this.#n}get attr(){return this.#i}connectedCallback(){super.connectedCallback(),this.#e=this.getRootNode().host,this.#r=this.closest(`th,td`),this.#n=this.#r.closest(`tr`),this.#t=this.#n.closest(`nine-table-sheet`),this.#r.classList.add(this.tagName),this.#i={};for(let e=0;e<this.#r.attributes.length;e++){let t=this.#r.attributes[e].name;[`text-align`,`class`,`cell-type`,`data-bind`,`data-expr`,`data-col`,`tabindex`].includes(t)||(this.#i[t]=this.#r.attributes[e].value)}if(!this.#r)return;let e=this.shadowRoot||this;e.querySelectorAll(`button, ng-expand-button`).forEach(e=>{e.addEventListener(`click`,()=>{let e=this.getAttribute(`onbuttonclick`)||this.getAttribute(`onButtonClick`)||this.#r?.getAttribute(`onbuttonclick`)||this.#r?.getAttribute(`onButtonClick`),t=this.data,n=parseInt(this.#r.dataset.row,10);if(e&&this.#e){e=e.replace(`()`,``);let r=e.match(/^(\w+)\s*\(/)?.[1]||e;typeof this.#e[r]==`function`?this.#e[r].call(this.#e,t,n,this.#r):typeof this.#e.exprFunction==`function`&&this.#e.exprFunction(e).call(this,t,n)}})});let t=e.querySelector(`.renderer`);t&&this.getAttribute(`link`)===`true`&&(t.classList.add(`link`),t.addEventListener(`click`,()=>{let e=this.getAttribute(`onlinkclick`)||this.getAttribute(`onLinkClick`),t=this.data,n=parseInt(this.#r.dataset.row,10);if(e&&this.#e){e=e.replace(`()`,``);let r=e.match(/^(\w+)\s*\(/)?.[1]||e;typeof this.#e[r]==`function`?this.#e[r].call(this.#e,t,n,this.#r):typeof this.#e.exprFunction==`function`&&this.#e.exprFunction(e).call(this,t,n)}this.#e?.dispatchEvent(new CustomEvent(ninegrid.EVENT.LINK_CLICK,{detail:{target:this.#r,data:t,currow:n},bubbles:!0,composed:!0}))}))}get data(){let e=this.#n?.data;if(!e)return null;if(!e.v)return e;let t=this.#e;return new Proxy(e,{get(e,n){if(n===`__ng`)return e.__ng;if(n===`v`)return e.v;let r=t?.fields?.indexOf?.(n)??-1;return r>=0?e.v[r]:e[n]}})}get value(){if(!this.#r||!this.#n?.data)return``;let e=this.#r.dataset?.bind;if(!e)return``;let t=this.#n.data;if(t.v&&Array.isArray(t.v)){let n=this.#e.fields.get().indexOf(e)??-1;return n>=0?t.v[n]??``:``}return t[e]??``}set value(e){if(!this.#r||!this.#e?.data)return;let t=parseInt(this.#n.dataset.row,10),n=this.#r.dataset.bind;!isNaN(t)&&n&&this.#e.data.setValue(t,n,e)}get row(){return parseInt(this.#r?.dataset?.row,10)}get index(){return parseInt(this.#r?.dataset?.index,10)}isValid(){return!this.#r.classList.contains(`invalid`)}isInvalid(){return!this.isValid()}getDisplayText=(e=``)=>{if(!this.#r||!this.#r.closest(`tbody`)||!this.#n.data)return e;let t=this.#r.dataset.expr,n=this.#r.dataset.bind,r=parseInt(this.#r.dataset.row,10);if(t)try{return this.#n.getAttribute(`grouping`)===`true`?this.getGroupExprValue(t,this.#n.data,r,this.#r):this.#e.exprEngine.evaluate(t,this.#n.data,r)}catch{return e}return n?this.value??e:e};refresh(){if(!this.#r||!this.#n)return;let e=this.value;return this.#r.classList.remove(`invalid`),[`color`,`background`,`background-color`,`visible`,`enable`,`validator`].forEach(e=>{let t=this.#i[e];if(t){let n=this.#e.exprEngine.evaluate(t,this.#n.data,parseInt(this.#r.dataset.row,10));e===`validator`?n||this.#r.classList.add(`invalid`):e===`visible`?this.style.display=n?``:`none`:e===`enable`?(this.querySelectorAll(`input, button, textarea, select`).forEach(e=>{e.disabled=!n}),n?this.#r.removeAttribute(`disabled`):this.#r.setAttribute(`disabled`,`true`)):this.#r.style[e]=n}}),e}getExprValue(e,t,n){return!this.#e||!this.#e.exprEngine||e==null||e===``?e:this.#e.exprEngine.evaluate(e,t,n)}getGroupExprValue=(e,t,n,r)=>{if(!e)return``;try{n=parseInt(n,10);let i=e.replace(`()`,``).trim();if(this.#e&&typeof this.#e[i]==`function`)return this.#e[i].call(this,t,n,r);let a=i.match(/^(\w+)\s*\(\s*([\w\-]*)\s*\)/);if(a){let e=t[GROUP_IDX.CHILDREN],n=this.#e?.data?.getArray?this.#e.data.getArray():[],r=e?e.map(e=>n[e]).filter(Boolean):[],[,i,o]=a,s=this.#e;switch(i.toLowerCase()){case`count`:return r.length;case`sum`:{let e=s?.fields?.indexOf?.(o)??-1;return r.reduce((t,n)=>{let r=e>=0?n.v?.[e]:n[o];return t+(Number(r)||0)},0)}case`avg`:{if(r.length===0)return 0;let e=s?.fields?.indexOf?.(o)??-1;return r.reduce((t,n)=>{let r=e>=0?n.v?.[e]:n[o];return t+(Number(r)||0)},0)/r.length}}}if(this.#e&&typeof this.#e.exprFunction==`function`)return this.#e.exprFunction(e).call(this,t,n,this.#e.data);if(e.includes(`data.`)||e.includes(`childRecords`)||e.includes(`groupRecord`)){let i=V.get(`grp_`+e);return i||(i=Function(`groupRecord`,`row`,`cell`,`host`,`
|
|
108
108
|
const indices = groupRecord[3]; // GROUP_IDX.CHILDREN = 3
|
|
109
109
|
const allRecords = host?.data?.getArray ? host.data.getArray() : [];
|
|
110
110
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ninebone/datagrid",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.24",
|
|
4
4
|
"description": "Blazing-fast virtualized HTML table for massive datasets with inline editing",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"datagrid",
|
|
@@ -51,7 +51,7 @@
|
|
|
51
51
|
"build:example:local": "npm --prefix example/react run build",
|
|
52
52
|
"build:local": "npm run build:core && npm run build:example:local",
|
|
53
53
|
"build:example:ci": "cd example/react && npm run build",
|
|
54
|
-
"build:ci": "npm run build:core && npm run build
|
|
54
|
+
"build:ci": "npm install --package-lock-only && npm run build:core && cd example/react && npm run build",
|
|
55
55
|
"build": "npm run build:local",
|
|
56
56
|
"watch": "vite build --watch",
|
|
57
57
|
"version": "npm run build",
|