@revolist/revogrid 4.0.29 → 4.0.31

package/dist/revo-grid/{viewport.store-d9e291c5.js → viewport.store-2dc172be.js}

@@ -1,5 +1,5 @@
 /*!
  * Built by Revolist OU ❤️
  */
-import{i as t,k as e,l as s}from"./dimension.helpers-a3065cb1.js";function i(e,s,i,f,u){const l=t(u,e);const m=h(s);let d;if(m){let t=l.itemIndex-(m.itemIndex||0);if(t){d=a(Math.abs(t),Object.assign(Object.assign({positiveDirection:t>-1},u),s))}}const z=n(f,u.realSize,l);if(d){const t=o(l,i,z,d,u);if(t.length){r(d.items,t,d)}}if(!d){const t=c({firstItemStart:l.start,firstItemIndex:l.itemIndex,origSize:u.originItemSize,maxSize:z,maxCount:i,sizes:u.sizes});d={items:t,start:0,end:t.length-1}}return d}function n(t,e,s){return Math.min(t+(s.end-s.start),e)}function r(t,e,s){t.splice(s.end+1,0,...e);if(s.start>=s.end&&!(s.start===s.end&&s.start===0)){s.start+=e.length}s.end+=e.length}function o(t,e,s,i,n){const r=m(i);const o=c({sizes:n.sizes,firstItemStart:r.end,firstItemIndex:r.itemIndex+1,origSize:n.originItemSize,maxSize:s-(r.end-t.start),maxCount:e});return o}function c(t,e=0){const s=[];let i=t.firstItemIndex;let n=e;while(n<=t.maxSize&&i<t.maxCount){const e=f(i,t.sizes,t.origSize);s.push({start:t.firstItemStart+n,end:t.firstItemStart+n+e,itemIndex:i,size:e});n+=e;i++}return s}function a(t,e){const s=[...e.items];const i=s.length;let n={start:e.start,end:e.end};if(t>i){return null}if(e.positiveDirection){let r=m(e);let o=n.start;const c=o+t;for(;o<c;o++){const t=r.itemIndex+1;const c=f(t,e.sizes,e.originItemSize);if(r.end+c>e.realSize){break}let a=o%i;if(!s[a]){throw new Error("incorrect index")}s[a]=r={start:r.end,end:r.end+c,itemIndex:t,size:c};n.start++;n.end=a}}else{let r=h(e);const o=n.end;for(let c=0;c<t;c++){const t=r.itemIndex-1;const a=f(t,e.sizes,e.originItemSize);let u=o-c;u=(u<0?i+u:u)%i;if(!s[u]){throw new Error("incorrect index")}s[u]=r={start:r.start-a,end:r.start,itemIndex:t,size:a};n.start=u;n.end--}}const r={start:(n.start<0?i+n.start:n.start)%i,end:(n.end<0?i+n.end:n.end)%i};return Object.assign({items:s},r)}function f(t,e,s=0){if(e&&e[t]){return e[t]}return s}function u(t,e,s,i){if(!s||!i){return false}return t>=s.start&&t<=s.end||t>s.end&&i.end===e}function l(t,e,s,i){if(!s){return false}return e+t>(i===null||i===void 0?void 0:i.end)}function h(t){return t.items[t.start]}function m(t){return t.items[t.end]}function d(t,e,s,i){const n=[...t];const r=n.length;let o=i;let c=0;let a=e;if(!r){return[]}while(c<r){const t=n[a];t.start=o;t.size=s;t.end=t.start+s;o=t.end;a++;c++;if(a===r){a=0}}return n}function z(){return{items:[],start:0,end:0,virtualSize:0,realCount:0}}class b{get lastCoordinate(){return this.lastKnownScroll}set lastCoordinate(t){this.lastKnownScroll=t}constructor(t){this.type=t;this.lastKnownScroll=0;this.store=e(z());this.store.onChange("realCount",(()=>this.clearItems()));this.store.onChange("virtualSize",(()=>this.clearItems()))}setViewPortCoordinate(t,e){const s=this.store.get("virtualSize");if(!s){return}const n=1;const c=e.originItemSize*n;const a=c*2;const f=s+a;let d=0;if(e.realSize>s){d=e.realSize-s-c}let z=t;if(z<0){z=0}else if(z>d){z=d}this.lastCoordinate=z;z-=c;z=z<0?0:z<d?z:d;const b=this.getItems();const x=[...b.items];const I=h(b);const S=m(b);let j={};if(!u(z,e.realSize,I,S)){j=Object.assign(Object.assign({},j),i(z,b,this.store.get("realCount"),f,e));this.setViewport(Object.assign({},j))}else if(l(z,f,I,S)){const t=o(I,this.store.get("realCount"),f+z-I.start,b,{sizes:e.sizes,originItemSize:e.originItemSize});if(t.length){const e={start:this.store.get("start"),end:this.store.get("end")};r(x,t,e);j=Object.assign(Object.assign(Object.assign({},j),{items:[...x]}),e);this.setViewport(Object.assign({},j))}}}setViewPortDimensionSizes(t,e){let s=[...this.store.get("items")];const i=s.length;if(!i){return}let n=0;let r=0;let o=this.store.get("start");if(e){const t=this.getItems();const i=h(t);s=d(s,o,e,i.start)}while(r<i){const e=s[o];if(n){e.start+=n;e.end+=n}const c=t[e.itemIndex];if(c){const t=c-e.size;n+=t;e.size=c;e.end=e.start+c}o++;r++;if(o===i){o=0}}this.setViewport({items:[...s]})}setOriginalSizes(t){const e=this.store.get("items");const i=e.length;if(!i){return}s(this.store,{items:d(e,this.store.get("start"),t,this.lastCoordinate)})}getItems(){return{items:this.store.get("items"),start:this.store.get("start"),end:this.store.get("end")}}setViewport(t){s(this.store,t)}clearItems(){this.store.set("items",[])}}export{b as V,o as a,c as b,l as c,h as d,m as e,i as g,u as i,a as r,d as s,r as u};
-//# sourceMappingURL=viewport.store-d9e291c5.js.map
+import{i as t,k as e,l as s}from"./dimension.helpers-c0c2888f.js";function i(e,s,i,f,u){const l=t(u,e);const m=h(s);let d;if(m){let t=l.itemIndex-(m.itemIndex||0);if(t){d=a(Math.abs(t),Object.assign(Object.assign({positiveDirection:t>-1},u),s))}}const z=n(f,u.realSize,l);if(d){const t=o(l,i,z,d,u);if(t.length){r(d.items,t,d)}}if(!d){const t=c({firstItemStart:l.start,firstItemIndex:l.itemIndex,origSize:u.originItemSize,maxSize:z,maxCount:i,sizes:u.sizes});d={items:t,start:0,end:t.length-1}}return d}function n(t,e,s){return Math.min(t+(s.end-s.start),e)}function r(t,e,s){t.splice(s.end+1,0,...e);if(s.start>=s.end&&!(s.start===s.end&&s.start===0)){s.start+=e.length}s.end+=e.length}function o(t,e,s,i,n){const r=m(i);const o=c({sizes:n.sizes,firstItemStart:r.end,firstItemIndex:r.itemIndex+1,origSize:n.originItemSize,maxSize:s-(r.end-t.start),maxCount:e});return o}function c(t,e=0){const s=[];let i=t.firstItemIndex;let n=e;while(n<=t.maxSize&&i<t.maxCount){const e=f(i,t.sizes,t.origSize);s.push({start:t.firstItemStart+n,end:t.firstItemStart+n+e,itemIndex:i,size:e});n+=e;i++}return s}function a(t,e){const s=[...e.items];const i=s.length;let n={start:e.start,end:e.end};if(t>i){return null}if(e.positiveDirection){let r=m(e);let o=n.start;const c=o+t;for(;o<c;o++){const t=r.itemIndex+1;const c=f(t,e.sizes,e.originItemSize);if(r.end+c>e.realSize){break}let a=o%i;if(!s[a]){throw new Error("incorrect index")}s[a]=r={start:r.end,end:r.end+c,itemIndex:t,size:c};n.start++;n.end=a}}else{let r=h(e);const o=n.end;for(let c=0;c<t;c++){const t=r.itemIndex-1;const a=f(t,e.sizes,e.originItemSize);let u=o-c;u=(u<0?i+u:u)%i;if(!s[u]){throw new Error("incorrect index")}s[u]=r={start:r.start-a,end:r.start,itemIndex:t,size:a};n.start=u;n.end--}}const r={start:(n.start<0?i+n.start:n.start)%i,end:(n.end<0?i+n.end:n.end)%i};return Object.assign({items:s},r)}function f(t,e,s=0){if(e&&e[t]){return e[t]}return s}function u(t,e,s,i){if(!s||!i){return false}return t>=s.start&&t<=s.end||t>s.end&&i.end===e}function l(t,e,s,i){if(!s){return false}return e+t>(i===null||i===void 0?void 0:i.end)}function h(t){return t.items[t.start]}function m(t){return t.items[t.end]}function d(t,e,s,i){const n=[...t];const r=n.length;let o=i;let c=0;let a=e;if(!r){return[]}while(c<r){const t=n[a];t.start=o;t.size=s;t.end=t.start+s;o=t.end;a++;c++;if(a===r){a=0}}return n}function z(){return{items:[],start:0,end:0,virtualSize:0,realCount:0}}class b{get lastCoordinate(){return this.lastKnownScroll}set lastCoordinate(t){this.lastKnownScroll=t}constructor(t){this.type=t;this.lastKnownScroll=0;this.store=e(z());this.store.onChange("realCount",(()=>this.clearItems()));this.store.onChange("virtualSize",(()=>this.clearItems()))}setViewPortCoordinate(t,e){const s=this.store.get("virtualSize");if(!s){return}const n=1;const c=e.originItemSize*n;const a=c*2;const f=s+a;let d=0;if(e.realSize>s){d=e.realSize-s-c}let z=t;if(z<0){z=0}else if(z>d){z=d}this.lastCoordinate=z;z-=c;z=z<0?0:z<d?z:d;const b=this.getItems();const x=[...b.items];const I=h(b);const S=m(b);let j={};if(!u(z,e.realSize,I,S)){j=Object.assign(Object.assign({},j),i(z,b,this.store.get("realCount"),f,e));this.setViewport(Object.assign({},j))}else if(l(z,f,I,S)){const t=o(I,this.store.get("realCount"),f+z-I.start,b,{sizes:e.sizes,originItemSize:e.originItemSize});if(t.length){const e={start:this.store.get("start"),end:this.store.get("end")};r(x,t,e);j=Object.assign(Object.assign(Object.assign({},j),{items:[...x]}),e);this.setViewport(Object.assign({},j))}}}setViewPortDimensionSizes(t,e){let s=[...this.store.get("items")];const i=s.length;if(!i){return}let n=0;let r=0;let o=this.store.get("start");if(e){const t=this.getItems();const i=h(t);s=d(s,o,e,i.start)}while(r<i){const e=s[o];if(n){e.start+=n;e.end+=n}const c=t[e.itemIndex];if(c){const t=c-e.size;n+=t;e.size=c;e.end=e.start+c}o++;r++;if(o===i){o=0}}this.setViewport({items:[...s]})}setOriginalSizes(t){const e=this.store.get("items");const i=e.length;if(!i){return}s(this.store,{items:d(e,this.store.get("start"),t,this.lastCoordinate)})}getItems(){return{items:this.store.get("items"),start:this.store.get("start"),end:this.store.get("end")}}setViewport(t){s(this.store,t)}clearItems(){this.store.set("items",[])}}export{b as V,o as a,c as b,l as c,h as d,m as e,i as g,u as i,a as r,d as s,r as u};
+//# sourceMappingURL=viewport.store-2dc172be.js.map

package/dist/revo-grid/viewport.store-2dc172be.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getUpdatedItemsByPosition","pos","items","realCount","virtualSize","dimension","activeItem","getItemByPosition","firstItem","getFirstItem","toUpdate","changedOffsetStart","itemIndex","recombineByOffset","Math","abs","Object","assign","positiveDirection","maxSizeVirtualSize","getMaxVirtualSize","realSize","extra","addMissingItems","length","updateMissingAndRange","getItems","firstItemStart","start","firstItemIndex","origSize","originItemSize","maxSize","maxCount","sizes","end","min","missing","range","splice","existingCollection","lastItem","getLastItem","opt","currentSize","index","size","newSize","getItemSize","push","offset","data","newItems","itemsCount","newRange","i","newIndex","newEnd","Error","newStart","isActiveRange","first","last","isActiveRangeOutsideLastItem","s","setItemSizes","vpItems","initialIndex","lastCoordinate","count","item","initialState","ViewportStore","this","lastKnownScroll","value","constructor","type","store","createStore","onChange","clearItems","setViewPortCoordinate","position","viewportSize","get","frameOffset","singleOffsetInPx","outsize","maxCoordinate","allItems","setViewport","setViewPortDimensionSizes","dropToOriginalSize","changedCoordinate","changedSize","setOriginalSizes","setStore","set"],"sources":["src/store/vp/viewport.helpers.ts","src/store/vp/viewport.store.ts"],"sourcesContent":["import {\n  DimensionSettingsState,\n  PositionItem,\n  ViewSettingSizeProp,\n  ViewportStateItems,\n  VirtualPositionItem,\n  Range,\n} from '@type';\n\nimport { getItemByPosition } from '../dimension/dimension.helpers';\n\nexport type DimensionDataViewport = Pick<\n  DimensionSettingsState,\n  | 'indexes'\n  | 'positionIndexes'\n  | 'positionIndexToItem'\n  | 'sizes'\n  | 'originItemSize'\n  | 'realSize'\n>;\n\ntype ItemsToUpdate = Pick<ViewportStateItems, 'items' | 'start' | 'end'>;\n/**\n * Update items based on new scroll position\n * If viewport wasn't changed fully simple recombination of positions\n * Otherwise rebuild viewport items\n */\nexport function getUpdatedItemsByPosition<T extends ItemsToUpdate>(\n  pos: number, // coordinate\n  items: T,\n  realCount: number,\n  virtualSize: number,\n  dimension: DimensionDataViewport,\n): ItemsToUpdate {\n  const activeItem: PositionItem = getItemByPosition(dimension, pos);\n  const firstItem: PositionItem = getFirstItem(items);\n  let toUpdate: ItemsToUpdate;\n  // do simple position recombination if items already present in viewport\n  if (firstItem) {\n    let changedOffsetStart = activeItem.itemIndex - (firstItem.itemIndex || 0);\n    // if item changed\n    if (changedOffsetStart) {\n      // simple recombination\n      toUpdate = recombineByOffset(Math.abs(changedOffsetStart), {\n        positiveDirection: changedOffsetStart > -1,\n        ...dimension,\n        ...items,\n      });\n    }\n  }\n\n  const maxSizeVirtualSize = getMaxVirtualSize(\n    virtualSize,\n    dimension.realSize,\n    activeItem,\n  );\n  // if partial recombination add items if revo-viewport has some space left\n  if (toUpdate) {\n    const extra = addMissingItems(\n      activeItem,\n      realCount,\n      maxSizeVirtualSize,\n      toUpdate,\n      dimension,\n    );\n    if (extra.length) {\n      updateMissingAndRange(toUpdate.items, extra, toUpdate);\n    }\n  }\n\n  // new collection if no items after replacement full replacement\n  if (!toUpdate) {\n    const items = getItems({\n      firstItemStart: activeItem.start,\n      firstItemIndex: activeItem.itemIndex,\n      origSize: dimension.originItemSize,\n      maxSize: maxSizeVirtualSize,\n      maxCount: realCount,\n      sizes: dimension.sizes,\n    });\n\n    // range now comes from 0 to length - 1\n    toUpdate = {\n      items,\n      start: 0,\n      end: items.length - 1,\n    };\n  }\n  return toUpdate;\n}\n\n// virtual size can differ based on scroll position if some big items are present\n// scroll can be in the middle of item and virtual size will be larger\n// so we need to exclude this part from virtual size hence it's already passed\nfunction getMaxVirtualSize(\n  virtualSize: number,\n  realSize: number,\n  activeItem: PositionItem,\n) {\n  return Math.min(virtualSize + (activeItem.end - activeItem.start), realSize);\n}\n\nexport function updateMissingAndRange(\n  items: VirtualPositionItem[],\n  missing: VirtualPositionItem[],\n  range: Range,\n) {\n  items.splice(range.end + 1, 0, ...missing);\n  // update range if start larger after recombination\n  if (\n    range.start >= range.end &&\n    !(range.start === range.end && range.start === 0)\n  ) {\n    range.start += missing.length;\n  }\n  range.end += missing.length;\n}\n\n/**\n * If partial replacement\n * this function adds items if viewport has some space left\n */\nexport function addMissingItems<T extends ItemsToUpdate>(\n  firstItem: PositionItem,\n  realCount: number,\n  virtualSize: number,\n  existingCollection: T,\n  dimension: Pick<DimensionSettingsState, 'sizes' | 'originItemSize'>,\n): VirtualPositionItem[] {\n  const lastItem: VirtualPositionItem = getLastItem(existingCollection);\n  const items = getItems({\n    sizes: dimension.sizes,\n    firstItemStart: lastItem.end,\n    firstItemIndex: lastItem.itemIndex + 1,\n    origSize: dimension.originItemSize,\n    maxSize: virtualSize - (lastItem.end - firstItem.start),\n    maxCount: realCount,\n  });\n  return items;\n}\n\n/**\n * Get wiewport items parameters\n * caching position and calculating items count in viewport\n */\nexport function getItems(\n  opt: {\n    firstItemIndex: number;\n    firstItemStart: number;\n    origSize: number;\n    maxSize: number; // virtual size\n    maxCount: number; // real item count, where the last item\n    sizes?: ViewSettingSizeProp;\n  },\n  currentSize = 0,\n) {\n  const items: VirtualPositionItem[] = [];\n\n  let index = opt.firstItemIndex;\n  let size = currentSize;\n\n  // max size or max count\n  while (size <= opt.maxSize && index < opt.maxCount) {\n    const newSize = getItemSize(index, opt.sizes, opt.origSize);\n    items.push({\n      start: opt.firstItemStart + size,\n      end: opt.firstItemStart + size + newSize,\n      itemIndex: index,\n      size: newSize,\n    });\n    size += newSize;\n    index++;\n  }\n  return items;\n}\n\n/**\n * Do batch items recombination\n * If items not overlapped with existing viewport returns null\n */\ntype RecombindDimensionData = Pick<\n  DimensionSettingsState,\n  'sizes' | 'realSize' | 'originItemSize'\n>;\ntype RecombineOffsetData = {\n  positiveDirection: boolean;\n} & ItemsToUpdate &\n  RecombindDimensionData;\nexport function recombineByOffset(\n  offset: number,\n  data: RecombineOffsetData,\n): ItemsToUpdate | null {\n  const newItems = [...data.items];\n  const itemsCount = newItems.length;\n  let newRange = {\n    start: data.start,\n    end: data.end,\n  };\n\n  // if offset out of revo-viewport, makes sense whole redraw\n  if (offset > itemsCount) {\n    return null;\n  }\n\n  // is direction of scroll positive\n  if (data.positiveDirection) {\n    // push item to the end\n    let lastItem: VirtualPositionItem = getLastItem(data);\n\n    let i = newRange.start;\n    const length = i + offset;\n    for (; i < length; i++) {\n      const newIndex = lastItem.itemIndex + 1;\n      const size = getItemSize(\n        newIndex,\n        data.sizes,\n        data.originItemSize,\n      );\n\n      // if item overlapped limit break a loop\n      if (lastItem.end + size > data.realSize) {\n        break;\n      }\n\n      // new item index to recombine\n      let newEnd = i % itemsCount;\n\n      // item should always present, we do not create new item, we recombine them\n      if (!newItems[newEnd]) {\n        throw new Error('incorrect index');\n      }\n\n      // do recombination\n      newItems[newEnd] = lastItem = {\n        start: lastItem.end,\n        end: lastItem.end + size,\n        itemIndex: newIndex,\n        size: size,\n      };\n      // update range\n      newRange.start++;\n      newRange.end = newEnd;\n    }\n\n    // direction is negative\n  } else {\n    // push item to the start\n    let firstItem: VirtualPositionItem = getFirstItem(data);\n\n    const end = newRange.end;\n    for (let i = 0; i < offset; i++) {\n      const newIndex = firstItem.itemIndex - 1;\n      const size = getItemSize(\n        newIndex,\n        data.sizes,\n        data.originItemSize,\n      );\n\n      // new item index to recombine\n      let newStart = end - i;\n      newStart = (newStart < 0 ? itemsCount + newStart : newStart) % itemsCount;\n\n      // item should always present, we do not create new item, we recombine them\n      if (!newItems[newStart]) {\n        throw new Error('incorrect index');\n      }\n\n      // do recombination\n      newItems[newStart] = firstItem = {\n        start: firstItem.start - size,\n        end: firstItem.start,\n        itemIndex: newIndex,\n        size: size,\n      };\n      // update range\n      newRange.start = newStart;\n      newRange.end--;\n    }\n  }\n  const range = {\n    start:\n      (newRange.start < 0 ? itemsCount + newRange.start : newRange.start) %\n      itemsCount,\n    end:\n      (newRange.end < 0 ? itemsCount + newRange.end : newRange.end) %\n      itemsCount,\n  };\n  return {\n    items: newItems,\n    ...range,\n  };\n}\n\nfunction getItemSize(\n  index: number,\n  sizes?: ViewSettingSizeProp,\n  origSize = 0,\n): number {\n  if (sizes && sizes[index]) {\n    return sizes[index];\n  }\n  return origSize;\n}\n\n/**\n * Verify if position is in range of the PositionItem, start and end are included\n */\nexport function isActiveRange(\n  pos: number,\n  realSize: number,\n  first?: PositionItem,\n  last?: PositionItem,\n): boolean {\n  if (!first || !last) {\n    return false;\n  }\n  // if position is in range of first item\n  // or position is after first item and last item is the last item in real size\n  return (\n    (pos >= first.start && pos <= first.end) ||\n    (pos > first.end && last.end === realSize)\n  );\n}\n\nexport function isActiveRangeOutsideLastItem(\n  pos: number,\n  virtualSize: number,\n  firstItem?: PositionItem,\n  lastItem?: PositionItem,\n) {\n  // if no first item, means no items in viewport\n  if (!firstItem) {\n    return false;\n  }\n  return virtualSize + pos > lastItem?.end;\n}\n\nexport function getFirstItem(\n  s: ItemsToUpdate,\n): VirtualPositionItem | undefined {\n  return s.items[s.start];\n}\n\nexport function getLastItem(s: ItemsToUpdate): VirtualPositionItem {\n  return s.items[s.end];\n}\n\n/**\n * Set items sizes from start index to end\n * @param vpItems\n * @param start\n * @param size\n * @param lastCoordinate\n * @returns\n */\nexport function setItemSizes(\n  vpItems: VirtualPositionItem[],\n  initialIndex: number,\n  size: number,\n  lastCoordinate: number,\n) {\n  const items = [...vpItems];\n  const count = items.length;\n\n  let pos = lastCoordinate;\n  let i = 0;\n  let start = initialIndex;\n\n  // viewport not inited\n  if (!count) {\n    return [];\n  }\n  // loop through array from initial item after recombination\n  while (i < count) {\n    const item = items[start];\n    item.start = pos;\n    item.size = size;\n    item.end = item.start + size;\n    pos = item.end;\n    // loop by start index\n    start++;\n    i++;\n\n    // if start index out of array, reset it\n    if (start === count) {\n      start = 0;\n    }\n  }\n  return items;\n}\n","import {\n  DimensionDataViewport,\n  addMissingItems,\n  getFirstItem,\n  getLastItem,\n  getUpdatedItemsByPosition,\n  isActiveRange,\n  setItemSizes,\n  updateMissingAndRange,\n  isActiveRangeOutsideLastItem,\n} from './viewport.helpers';\nimport { createStore } from '@stencil/store';\nimport { type Observable, setStore } from '../../utils/store.utils';\nimport type {\n  VirtualPositionItem,\n  ViewportStateItems,\n  ViewportState,\n  ViewSettingSizeProp,\n  MultiDimensionType,\n} from '@type';\n\n/**\n * Viewport store\n * Used for virtualization (process of rendering only visible part of data)\n * Redraws viewport based on position and dimension\n */\nfunction initialState(): ViewportState {\n  return {\n    // virtual item information per rendered item\n    items: [],\n    // virtual dom item order to render\n    start: 0,\n    end: 0,\n\n    // size of viewport in px\n    virtualSize: 0,\n\n    // total number of items\n    realCount: 0,\n  };\n}\n\n/**\n * Viewport store class\n */\nexport class ViewportStore {\n  readonly store: Observable<ViewportState>;\n\n  // last coordinate for store position restore\n  private lastKnownScroll = 0;\n\n  get lastCoordinate() {\n    return this.lastKnownScroll;\n  }\n  set lastCoordinate(value: number) {\n    this.lastKnownScroll = value;\n  }\n  constructor(readonly type: MultiDimensionType) {\n    this.store = createStore(initialState());\n    // drop items on real size change, require a new item set\n    this.store.onChange('realCount', () => this.clearItems());\n    // drop items on virtual size change, require a new item set\n    this.store.onChange('virtualSize', () => this.clearItems());\n  }\n\n  /**\n   * Render viewport based on coordinate\n   * It's the main method for draw\n   */\n  setViewPortCoordinate(position: number, dimension: DimensionDataViewport) {\n    const viewportSize = this.store.get('virtualSize');\n    // no visible data to calculate\n    if (!viewportSize) {\n      return;\n    }\n\n    const frameOffset = 1;\n    const singleOffsetInPx = dimension.originItemSize * frameOffset;\n    // add offset to virtual size from both sides\n    const outsize = singleOffsetInPx * 2;\n    // math virtual size is based on visible area + 2 items outside of visible area\n    const virtualSize = viewportSize + outsize;\n\n    // expected no scroll if real size less than virtual size, position is 0\n    let maxCoordinate = 0;\n    // if there is nodes outside of viewport, max coordinate has to be adjusted\n    if (dimension.realSize > viewportSize) {\n      // max coordinate is real size minus virtual/rendered space\n      maxCoordinate = dimension.realSize - viewportSize - singleOffsetInPx;\n    }\n\n    let pos = position;\n    // limit position to max and min coordinates\n    if (pos < 0) {\n      pos = 0;\n    } else if (pos > maxCoordinate) {\n      pos = maxCoordinate;\n    }\n\n    // store last coordinate for further restore on redraw\n    this.lastCoordinate = pos;\n\n    // actual position is less than first item start based on offset\n    pos -= singleOffsetInPx;\n    pos = pos < 0 ? 0 : pos < maxCoordinate ? pos : maxCoordinate;\n\n    const allItems = this.getItems();\n    const items = [...allItems.items];\n\n    const firstItem: VirtualPositionItem | undefined = getFirstItem(allItems);\n    const lastItem: VirtualPositionItem | undefined = getLastItem(allItems);\n\n    let toUpdate: Partial<ViewportState> = {};\n\n    // left position changed\n    // verify if new position is in range of previously rendered first item\n    if (!isActiveRange(pos, dimension.realSize, firstItem, lastItem)) {\n      toUpdate = {\n        ...toUpdate,\n        ...getUpdatedItemsByPosition(\n          pos,\n          allItems,\n          this.store.get('realCount'),\n          virtualSize,\n          dimension,\n        ),\n      };\n      this.setViewport({ ...toUpdate });\n      // verify is render area is outside of last item\n    } else if (\n      isActiveRangeOutsideLastItem(pos, virtualSize, firstItem, lastItem)\n    ) {\n      // check is any item missing for full fill content\n      const missing = addMissingItems(\n        firstItem,\n        this.store.get('realCount'),\n        virtualSize + pos - firstItem.start,\n        allItems,\n        {\n          sizes: dimension.sizes,\n          originItemSize: dimension.originItemSize,\n        },\n      );\n\n      // update missing items\n      if (missing.length) {\n        const range = {\n          start: this.store.get('start'),\n          end: this.store.get('end'),\n        };\n        updateMissingAndRange(items, missing, range);\n        toUpdate = {\n          ...toUpdate,\n          items: [...items],\n          ...range,\n        };\n        this.setViewport({ ...toUpdate });\n      }\n    }\n  }\n\n  /**\n   * Update viewport sizes for existing items\n   * This method is generating new item positions based on custom sizes and original sizes\n   * @param sizes - custom sizes for each item\n   * @param dropToOriginalSize - drop to original size if requested\n   */\n  setViewPortDimensionSizes(\n    sizes: ViewSettingSizeProp,\n    dropToOriginalSize?: number,\n  ) {\n    let items = [...this.store.get('items')];\n    const count = items.length;\n    // viewport not inited\n    if (!count) {\n      return;\n    }\n\n    let changedCoordinate = 0;\n    let i = 0;\n    let start = this.store.get('start');\n\n    // drop to original size if requested\n    if (dropToOriginalSize) {\n      const allItems = this.getItems();\n      const firstItem: VirtualPositionItem | undefined = getFirstItem(allItems);\n      items = setItemSizes(items, start, dropToOriginalSize, firstItem.start);\n    }\n\n    // loop through array from initial item after recombination\n    // if size change present, change position for all items after\n    while (i < count) {\n      const item = items[start];\n      // change pos if size change present before\n      if (changedCoordinate) {\n        item.start += changedCoordinate;\n        item.end += changedCoordinate;\n      }\n      // check if size change present\n      const size: number | undefined = sizes[item.itemIndex];\n      // size found\n      if (size) {\n        const changedSize = size - item.size;\n        changedCoordinate += changedSize;\n        item.size = size;\n        item.end = item.start + size;\n        // size lost\n      }\n\n      // loop by start index\n      start++;\n      i++;\n      // if start index out of array, reset it\n      if (start === count) {\n        start = 0;\n      }\n    }\n\n    this.setViewport({ items: [...items] });\n  }\n\n  /**\n   * Set sizes for existing items\n   */\n  setOriginalSizes(size: number) {\n    const items = this.store.get('items');\n    const count = items.length;\n    // viewport not inited\n    if (!count) {\n      return;\n    }\n\n    setStore(this.store, {\n      items: setItemSizes(\n        items,\n        this.store.get('start'),\n        size,\n        this.lastCoordinate,\n      ),\n    });\n  }\n\n  getItems(): Pick<ViewportStateItems, 'items' | 'start' | 'end'> {\n    return {\n      items: this.store.get('items'),\n      start: this.store.get('start'),\n      end: this.store.get('end'),\n    };\n  }\n\n  setViewport(data: Partial<ViewportState>) {\n    setStore(this.store, data);\n  }\n\n  clearItems() {\n    this.store.set('items', []);\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/types/components/data/column.service.d.ts

@@ -1,7 +1,6 @@
 import { DSourceState } from "../../store/index";
-import { DimensionCols, DimensionRows, RowDrag } from "../../types/index";
-import { ColumnRegular, Observable, DataType, CellProps, ColumnDataSchemaModel, ColumnProp, DataLookup, DataFormat } from "../../types/index";
-import { ChangedRange, OldNewRangeMapping, Cell, RangeArea, BeforeSaveDataDetails, EditorCtr, Editors } from "../../types/index";
+import { DimensionCols, DimensionRows, RowDrag, ColumnRegular, DataType, CellProps, ColumnDataSchemaModel, ColumnProp, DataLookup, DataFormat, ChangedRange, OldNewRangeMapping, Cell, RangeArea, BeforeSaveDataDetails, EditorCtr, Editors } from "../../types/index";
+import { Observable } from '../../utils/store.utils';
 export type ColumnStores = {
     [T in DimensionCols]: Observable<DSourceState<ColumnRegular, DimensionCols>>;
 };

package/dist/types/components/data/revogr-data.d.ts

@@ -1,8 +1,8 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { DSourceState } from "../../store/index";
 import { DimensionCols, DimensionRows } from "../../types/index";
-import { Observable, ViewportState, DimensionSettingsState, BeforeRowRenderEvent, Providers, ColumnRegular, DataType, BeforeCellRenderEvent, DragStartEvent, ColumnDataSchemaModel, VirtualPositionItem } from "../../types/index";
-import { SelectionStoreState } from "../../types/index";
+import { ViewportState, DimensionSettingsState, BeforeRowRenderEvent, Providers, ColumnRegular, DataType, BeforeCellRenderEvent, DragStartEvent, ColumnDataSchemaModel, VirtualPositionItem, SelectionStoreState } from "../../types/index";
+import { Observable } from '../../utils/store.utils';
 /**
  * This component is responsible for rendering data
  * Rows, columns, groups and cells

package/dist/types/components/editors/text-editor.d.ts

@@ -1,4 +1,4 @@
-import { h as createElement } from '../../stencil-public-runtime';
+import { VNode, h as createElement } from '../../stencil-public-runtime';
 import { ColumnRegular } from "../../types/index";
 import { EditCell, EditorBase, SaveData } from "../../types/index";
 /**
@@ -18,7 +18,7 @@ export declare class TextEditor implements EditorBase {
     private saveCallback?;
     private editInput;
     element: Element | null;
-    editCell: EditCell | null;
+    editCell?: EditCell;
     constructor(column: ColumnRegular, saveCallback?: SaveCallback);
     /**
      * Callback triggered on cell editor render
@@ -42,5 +42,5 @@ export declare class TextEditor implements EditorBase {
      * @param {Object} _additionalData - additional data from plugin.
      * @returns {VNode} - input element.
      */
-    render(h: typeof createElement, _additionalData: any): import("@stencil/core").VNode;
+    render(h: typeof createElement, _additionalData: any): VNode | VNode[];
 }

package/dist/types/components/header/revogr-header.d.ts

@@ -2,9 +2,8 @@ import { EventEmitter } from '../../stencil-public-runtime';
 import { HTMLStencilElement } from '../../stencil-public-runtime';
 import { Groups } from "../../store/index";
 import { ResizeProps } from '../../services/resizable.directive';
-import { ColumnRegular, DimensionSettingsState, InitialHeaderClick, Observable, Providers, ViewportState, ViewSettingSizeProp } from "../../types/index";
-import { DimensionCols } from "../../types/index";
-import { SelectionStoreState } from "../../types/index";
+import { ColumnRegular, DimensionSettingsState, InitialHeaderClick, Providers, ViewportState, ViewSettingSizeProp, DimensionCols, SelectionStoreState } from "../../types/index";
+import { Observable } from '../../utils/store.utils';
 export declare class RevogrHeaderComponent {
     /**
      * Stores
@@ -53,15 +52,15 @@ export declare class RevogrHeaderComponent {
     additionalData: any;
     /**
      * On initial header click
-    */
+     */
     initialHeaderClick: EventEmitter<InitialHeaderClick>;
     /**
      * On header resize
-    */
+     */
     headerresize: EventEmitter<ViewSettingSizeProp>;
     /**
      * On before header resize
-    */
+     */
     beforeResize: EventEmitter<ColumnRegular[]>;
     /**
      * On header double click

package/dist/types/components/order/revogr-order-editor.d.ts

@@ -1,8 +1,7 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { DSourceState } from "../../store/index";
-import { DimensionRows } from "../../types/index";
-import { DataType, DimensionSettingsState, DragStartEvent, Observable, PositionItem } from "../../types/index";
-import { Cell } from "../../types/index";
+import { DimensionRows, DataType, DimensionSettingsState, DragStartEvent, PositionItem, Cell } from "../../types/index";
+import { Observable } from '../../utils/store.utils';
 /**
  * Component for handling row order editor.
  */

package/dist/types/components/overlay/autofill.service.d.ts

@@ -1,7 +1,8 @@
 import { EventData } from './selection.utils';
 import { DSourceState } from "../../store/index";
 import ColumnService from '../data/column.service';
-import { DataLookup, DataType, DimensionSettingsState, Observable, TempRange, ChangedRange, BeforeRangeSaveDataDetails, RangeArea, Cell, DimensionRows } from "../../types/index";
+import { DataLookup, DataType, DimensionSettingsState, TempRange, ChangedRange, BeforeRangeSaveDataDetails, RangeArea, Cell, DimensionRows } from "../../types/index";
+import { Observable } from '../../utils/store.utils';
 type Config = {
     dimensionRow: Observable<DimensionSettingsState>;
     dimensionCol: Observable<DimensionSettingsState>;

package/dist/types/components/overlay/keyboard.service.d.ts

@@ -1,6 +1,6 @@
 import { EventData } from './selection.utils';
 import { Cell, RangeArea, SelectionStoreState } from "../../types/index";
-import { Observable } from "../../types/index";
+import { Observable } from '../../utils/store.utils';
 type Config = {
     selectionStore: Observable<SelectionStoreState>;
     change(val?: any): void;

package/dist/types/components/overlay/revogr-overlay-selection.d.ts

@@ -3,7 +3,7 @@ import ColumnService from '../data/column.service';
 import { DSourceState } from "../../store/index";
 import { EventData } from './selection.utils';
 import { Observable, SelectionStoreState, DimensionSettingsState, DataType, DimensionRows, ColumnRegular, DimensionCols, Cell, DragStartEvent } from '../../components';
-import { MultiDimensionType } from "../../types/index";
+import { EditCellStore, MultiDimensionType } from "../../types/index";
 import { FocusRenderEvent, ApplyFocusEvent, AllDimensionType } from "../../types/index";
 import { Editors, BeforeSaveDataDetails, BeforeEdit, RangeArea, TempRange, ChangedRange, BeforeRangeSaveDataDetails, SaveDataDetails } from "../../types/index";
 /**
@@ -230,7 +230,7 @@ export declare class OverlaySelection {
      * Verify if edit allowed.
      */
     protected canEdit(): boolean;
-    get edited(): import("@type").EditCellStore;
+    get edited(): EditCellStore;
     /**
      * Sets the focus on a cell and optionally edits a range.
      */

package/dist/types/components/revoGrid/revo-grid.d.ts

@@ -9,11 +9,8 @@ import { ColumnFilterConfig, FilterCollection } from '../../plugins/filter/filte
 import { DataInput } from '../../plugins/export/types';
 import { GroupingOptions } from '../../plugins/groupingRow/grouping.row.types';
 import { FocusedData } from './viewport.service';
-import { MultiDimensionType, DimensionRows, DimensionCols, DimensionTypeCol } from "../../types/index";
-import { RowHeaders, ColumnRegular, ColumnGrouping, DataType, RowDefinition, ColumnType, FocusTemplateFunc, PositionItem, ColumnProp, ViewPortScrollEvent, InitialHeaderClick, ColumnDataSchema, Observable, AllDimensionType } from "../../types/index";
-import { Editors, BeforeSaveDataDetails, BeforeRangeSaveDataDetails, Cell, ChangedRange, RangeArea, AfterEditEvent } from "../../types/index";
-import { Theme } from "../../types/index";
-import { PluginBaseComponent, PluginExternalConstructor } from "../../types/index";
+import { MultiDimensionType, DimensionRows, DimensionCols, DimensionTypeCol, RowHeaders, ColumnRegular, ColumnGrouping, DataType, RowDefinition, ColumnType, FocusTemplateFunc, PositionItem, ColumnProp, ViewPortScrollEvent, InitialHeaderClick, ColumnDataSchema, AllDimensionType, Editors, BeforeSaveDataDetails, BeforeRangeSaveDataDetails, Cell, ChangedRange, RangeArea, AfterEditEvent, Theme, PluginBaseComponent, PluginExternalConstructor } from "../../types/index";
+import { Observable } from '../../utils/store.utils';
 /**
  * Revogrid - High-performance, customizable grid library for managing large datasets.
  *

package/dist/types/components/scrollable/revogr-scroll-virtual.d.ts

@@ -1,6 +1,7 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { DimensionType } from "../../types/index";
-import { Observable, ViewportState, DimensionSettingsState, ViewPortScrollEvent } from "../../types/index";
+import { ViewportState, DimensionSettingsState, ViewPortScrollEvent } from "../../types/index";
+import { Observable } from '../../utils/store.utils';
 /**
  * Virtual scroll component
  */

package/dist/types/components/selectionFocus/revogr-focus.d.ts

@@ -1,6 +1,7 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { DSourceState } from "../../store/index";
-import { SelectionStoreState, ColumnRegular, DataType, DimensionSettingsState, FocusRenderEvent, FocusTemplateFunc, Observable, DimensionCols, DimensionRows } from "../../types/index";
+import { SelectionStoreState, ColumnRegular, DataType, DimensionSettingsState, FocusRenderEvent, FocusTemplateFunc, DimensionCols, DimensionRows } from "../../types/index";
+import { Observable } from '../../utils/store.utils';
 /**
  * Focus component. Shows focus layer around the cell that is currently in focus.
  * @slot focus-${view.type}-${data.type}. @example focus-rgCol-rgRow

package/dist/types/components/selectionTempRange/revogr-temp-range.d.ts

@@ -1,5 +1,6 @@
-import { Observable, DimensionSettingsState } from "../../types/index";
+import { DimensionSettingsState } from "../../types/index";
 import { SelectionStoreState } from "../../types/index";
+import { Observable } from '../../utils/store.utils';
 /**
  * Temporary range selection component. Shows temporary range selection.
  */

package/dist/types/components/vnode/vnode.utils.d.ts

@@ -1,8 +1,9 @@
+import { VNode } from '../../stencil-public-runtime';
 import { JSX } from '../../components';
 /**
  * Converts a VNode element into an HTML element and appends it to the specified parentHolder.
  */
 export declare function convertVNodeToHTML(parentHolder: Element, redraw: JSX.VnodeHtml['redraw']): Promise<{
     html: string;
-    vnodes: import("@stencil/core/internal/stencil-public-runtime").VNode[];
+    vnodes: VNode[];
 }>;

package/dist/types/components.d.ts

@@ -5,7 +5,7 @@
  * It contains typing information for all components that exist in this project.
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
-import { AfterEditEvent, AllDimensionType, ApplyFocusEvent, BeforeCellRenderEvent, BeforeEdit, BeforeRangeSaveDataDetails, BeforeRowRenderEvent, BeforeSaveDataDetails, Cell, ChangedRange, ColumnDataSchemaModel, ColumnGrouping, ColumnProp, ColumnRegular, ColumnType, DataFormat, DataType, DimensionCols, DimensionRows, DimensionSettingsState, DimensionType, DimensionTypeCol, DragStartEvent, EditCell, EditorCtr, Editors, ElementScroll, FocusRenderEvent, FocusTemplateFunc, InitialHeaderClick, MultiDimensionType, Observable, PluginBaseComponent, PluginExternalConstructor, PositionItem, RangeArea, RowDefinition, RowHeaders, SaveDataDetails, SelectionStoreState, TempRange, Theme, ViewportData, ViewPortResizeEvent, ViewPortScrollEvent, ViewportState, ViewSettingSizeProp } from "./types/index";
+import { AfterEditEvent, AllDimensionType, ApplyFocusEvent, BeforeCellRenderEvent, BeforeEdit, BeforeRangeSaveDataDetails, BeforeRowRenderEvent, BeforeSaveDataDetails, Cell, ChangedRange, ColumnDataSchemaModel, ColumnGrouping, ColumnProp, ColumnRegular, ColumnType, DataFormat, DataType, DimensionCols, DimensionRows, DimensionSettingsState, DimensionType, DimensionTypeCol, DragStartEvent, EditCell, EditorCtr, Editors, ElementScroll, FocusRenderEvent, FocusTemplateFunc, InitialHeaderClick, MultiDimensionType, PluginBaseComponent, PluginExternalConstructor, PositionItem, RangeArea, RowDefinition, RowHeaders, SaveDataDetails, SelectionStoreState, TempRange, Theme, ViewportData, ViewPortResizeEvent, ViewPortScrollEvent, ViewportState, ViewSettingSizeProp } from "./types/index";
 import { AutoSizeColumnConfig } from "./plugins/column.auto-size.plugin";
 import { ColumnFilterConfig, FilterCaptions, FilterCollection } from "./plugins/filter/filter.plugin";
 import { GroupingOptions } from "./plugins/groupingRow/grouping.row.types";
@@ -13,12 +13,13 @@ import { VNode } from "./stencil-public-runtime";
 import { FocusedData } from "./components/revoGrid/viewport.service";
 import { ColumnCollection } from "./services/column.data.provider";
 import { DataInput } from "./plugins/export/types";
+import { Observable } from "./utils/store.utils";
 import { DSourceState, Groups } from "./store/index";
 import { MultiFilterItem, ShowData } from "./plugins/filter/filter.pop";
 import { LogicFunction } from "./plugins/filter/filter.types";
 import { ResizeProps } from "./services/resizable.directive";
 import { Cell as Cell1, ColumnRegular as ColumnRegular1, DataType as DataType1, DimensionCols as DimensionCols1, DimensionRows as DimensionRows1, DimensionSettingsState as DimensionSettingsState1, Observable as Observable1, SelectionStoreState as SelectionStoreState1 } from "./components";
-export { AfterEditEvent, AllDimensionType, ApplyFocusEvent, BeforeCellRenderEvent, BeforeEdit, BeforeRangeSaveDataDetails, BeforeRowRenderEvent, BeforeSaveDataDetails, Cell, ChangedRange, ColumnDataSchemaModel, ColumnGrouping, ColumnProp, ColumnRegular, ColumnType, DataFormat, DataType, DimensionCols, DimensionRows, DimensionSettingsState, DimensionType, DimensionTypeCol, DragStartEvent, EditCell, EditorCtr, Editors, ElementScroll, FocusRenderEvent, FocusTemplateFunc, InitialHeaderClick, MultiDimensionType, Observable, PluginBaseComponent, PluginExternalConstructor, PositionItem, RangeArea, RowDefinition, RowHeaders, SaveDataDetails, SelectionStoreState, TempRange, Theme, ViewportData, ViewPortResizeEvent, ViewPortScrollEvent, ViewportState, ViewSettingSizeProp } from "./types/index";
+export { AfterEditEvent, AllDimensionType, ApplyFocusEvent, BeforeCellRenderEvent, BeforeEdit, BeforeRangeSaveDataDetails, BeforeRowRenderEvent, BeforeSaveDataDetails, Cell, ChangedRange, ColumnDataSchemaModel, ColumnGrouping, ColumnProp, ColumnRegular, ColumnType, DataFormat, DataType, DimensionCols, DimensionRows, DimensionSettingsState, DimensionType, DimensionTypeCol, DragStartEvent, EditCell, EditorCtr, Editors, ElementScroll, FocusRenderEvent, FocusTemplateFunc, InitialHeaderClick, MultiDimensionType, PluginBaseComponent, PluginExternalConstructor, PositionItem, RangeArea, RowDefinition, RowHeaders, SaveDataDetails, SelectionStoreState, TempRange, Theme, ViewportData, ViewPortResizeEvent, ViewPortScrollEvent, ViewportState, ViewSettingSizeProp } from "./types/index";
 export { AutoSizeColumnConfig } from "./plugins/column.auto-size.plugin";
 export { ColumnFilterConfig, FilterCaptions, FilterCollection } from "./plugins/filter/filter.plugin";
 export { GroupingOptions } from "./plugins/groupingRow/grouping.row.types";
@@ -26,6 +27,7 @@ export { VNode } from "./stencil-public-runtime";
 export { FocusedData } from "./components/revoGrid/viewport.service";
 export { ColumnCollection } from "./services/column.data.provider";
 export { DataInput } from "./plugins/export/types";
+export { Observable } from "./utils/store.utils";
 export { DSourceState, Groups } from "./store/index";
 export { MultiFilterItem, ShowData } from "./plugins/filter/filter.pop";
 export { LogicFunction } from "./plugins/filter/filter.types";

package/dist/types/plugins/groupingRow/grouping.row.plugin.d.ts

@@ -1,12 +1,14 @@
+import { DSourceState } from "../../store/index";
 import { BasePlugin } from '../base.plugin';
 import { GroupingOptions } from './grouping.row.types';
-import { PluginProviders } from "../../types/index";
+import { DataType, DimensionRows, PluginProviders } from "../../types/index";
+import { Observable } from '../../utils/store.utils';
 export default class GroupingRowPlugin extends BasePlugin {
     protected revogrid: HTMLRevoGridElement;
     protected providers: PluginProviders;
     private options;
     get hasProps(): number;
-    get store(): import("@type").Observable<import("@store").DSourceState<import("@type").DataType, import("@type").DimensionRows>>;
+    get store(): Observable<DSourceState<DataType, DimensionRows>>;
     get rowItems(): number[];
     get trimmed(): Record<any, any>;
     constructor(revogrid: HTMLRevoGridElement, providers: PluginProviders);

package/dist/types/stencil-public-runtime.d.ts

@@ -989,7 +989,6 @@ export declare namespace JSXBase {
     interface LabelHTMLAttributes<T> extends HTMLAttributes<T> {
         form?: string;
         htmlFor?: string;
-        htmlfor?: string;
     }
     interface LiHTMLAttributes<T> extends HTMLAttributes<T> {
         value?: string | string[] | number;
@@ -1100,7 +1099,6 @@ export declare namespace JSXBase {
     interface OutputHTMLAttributes<T> extends HTMLAttributes<T> {
         form?: string;
         htmlFor?: string;
-        htmlfor?: string;
         name?: string;
     }
     interface ParamHTMLAttributes<T> extends HTMLAttributes<T> {

package/dist/types/store/dataSource/data.proxy.d.ts

@@ -1,5 +1,5 @@
 import { DSourceState } from "../index";
-import { Observable, PluginSubscribe } from "../../types/index";
+import { Observable, PluginSubscribe } from '../../utils/store.utils';
 type State = DSourceState<any, any>;
 /**
  * All items

package/dist/types/store/dataSource/data.store.d.ts

@@ -1,7 +1,8 @@
 import { Trimmed } from './trimmed.plugin';
+import { Observable } from '../../utils/store.utils';
 import { GroupLabelTemplateFunc } from '../../plugins/groupingRow/grouping.row.types';
 import { DimensionRows, DimensionCols } from "../../types/index";
-import type { ColumnProperties, ColumnGrouping, ColumnRegular, DataType, DataSourceState, Observable, ColumnProp } from "../../types/index";
+import type { ColumnProperties, ColumnGrouping, ColumnRegular, DataType, DataSourceState, ColumnProp } from "../../types/index";
 export interface Group extends ColumnProperties {
     name: string;
     children: (ColumnGrouping | ColumnRegular)[];

package/dist/types/store/dataSource/trimmed.plugin.d.ts

@@ -1,4 +1,4 @@
-import { Observable, PluginSubscribe } from "../../types/index";
+import { Observable, PluginSubscribe } from '../../utils/store.utils';
 import { DSourceState } from './data.store';
 export type TrimmedEntity = Record<number, boolean>;
 export type Trimmed = Record<string, TrimmedEntity>;

package/dist/types/store/dimension/dimension.store.d.ts

@@ -1,8 +1,5 @@
-/**
- * Storing pre-calculated
- * Dimension information and sizes
- */
-import { DimensionSettingsState, Observable, ViewSettingSizeProp, MultiDimensionType } from "../../types/index";
+import { Observable } from '../../utils/store.utils';
+import { DimensionSettingsState, ViewSettingSizeProp, MultiDimensionType } from "../../types/index";
 export type DimensionStoreCollection = {
     [T in MultiDimensionType]: DimensionStore;
 };
@@ -18,17 +15,5 @@ export declare class DimensionStore {
      * Generates new indexes based on sizes
      * @param sizes - sizes to set
      */
-    setDimensionSize(sizes: ViewSettingSizeProp): {
-        indexes: number[];
-        positionIndexes: number[];
-        positionIndexToItem: {
-            [x: number]: import("@type").PositionItem;
-        };
-        indexToItem: {
-            [index: number]: import("@type").PositionItem;
-        };
-        sizes: {
-            [x: string]: number;
-        };
-    };
+    setDimensionSize(sizes: ViewSettingSizeProp): void;
 }

package/dist/types/store/selection/selection.store.d.ts

@@ -1,7 +1,7 @@
 /**
  * Selection store
  */
-import { Observable } from "../../types/index";
+import { Observable } from '../../utils/store.utils';
 import { SelectionStoreState, Cell, TempRange, RangeArea } from "../../types/index";
 export declare class SelectionStore {
     readonly store: Observable<SelectionStoreState>;

package/dist/types/store/vp/viewport.store.d.ts

@@ -1,5 +1,6 @@
 import { DimensionDataViewport } from './viewport.helpers';
-import type { ViewportStateItems, ViewportState, Observable, ViewSettingSizeProp, MultiDimensionType } from "../../types/index";
+import { type Observable } from '../../utils/store.utils';
+import type { ViewportStateItems, ViewportState, ViewSettingSizeProp, MultiDimensionType } from "../../types/index";
 /**
  * Viewport store class
  */

package/dist/types/types/interfaces.d.ts

@@ -1,9 +1,7 @@
-import { VNode } from '../stencil-public-runtime';
-import { ObservableMap, Subscription } from '@stencil/store';
+import type { VNode } from '../stencil-public-runtime';
 import { DimensionCols, DimensionRows, DimensionColPin, DimensionType, MultiDimensionType } from './dimension';
 import { Cell, EditorCtr, FocusedCells, RangeArea, SelectionStoreState } from './selection';
-export type Observable<T> = ObservableMap<T>;
-export type PluginSubscribe<T> = Subscription<T>;
+import type { Observable } from '../utils/store.utils';
 export type ColumnDataSchemaModel = {
     /**
      * Column prop used for mapping value to cell from data source model/row

package/dist/types/types/viewport.interfaces.d.ts

@@ -1,6 +1,7 @@
 import type { JSXBase } from '../stencil-public-runtime';
-import type { DimensionCols, ColumnRegular, Observable, ViewPortScrollEvent, ViewportState, Cell, SelectionStoreState } from "./index";
+import type { DimensionCols, ColumnRegular, ViewPortScrollEvent, ViewportState, Cell, SelectionStoreState } from "./index";
 import type { DimensionStoreCollection, ViewportStoreCollection, DSourceState } from "../store/index";
+import { Observable } from '../utils/store.utils';
 import type { RowDataSources } from '../services/data.provider';
 import type { JSX } from '..';
 export type SlotType = 'content' | 'header' | 'footer';

package/dist/types/utils/store.types.d.ts

@@ -0,0 +1,97 @@
+export interface Handlers<T> {
+    dispose: DisposeEventHandler[];
+    get: GetEventHandler<T>[];
+    reset: ResetEventHandler[];
+    set: SetEventHandler<T>[];
+}
+export type SetEventHandler<StoreType> = (key: keyof StoreType, newValue: any, oldValue: any) => void;
+export type GetEventHandler<StoreType> = (key: keyof StoreType) => void;
+export type ResetEventHandler = () => void;
+export type DisposeEventHandler = () => void;
+export interface OnHandler<StoreType> {
+    (eventName: 'set', callback: SetEventHandler<StoreType>): () => void;
+    (eventName: 'get', callback: GetEventHandler<StoreType>): () => void;
+    (eventName: 'dispose', callback: DisposeEventHandler): () => void;
+    (eventName: 'reset', callback: ResetEventHandler): () => void;
+}
+export interface OnChangeHandler<StoreType> {
+    <Key extends keyof StoreType>(propName: Key, cb: (newValue: StoreType[Key]) => void): () => void;
+}
+export interface Subscription<StoreType> {
+    dispose?(): void;
+    get?<KeyFromStoreType extends keyof StoreType>(key: KeyFromStoreType): void;
+    set?<KeyFromStoreType extends keyof StoreType>(key: KeyFromStoreType, newValue: StoreType[KeyFromStoreType], oldValue: StoreType[KeyFromStoreType]): void;
+    reset?(): void;
+}
+export interface Getter<T> {
+    <P extends keyof T>(propName: P & string): T[P];
+}
+export interface Setter<T> {
+    <P extends keyof T>(propName: P & string, value: T[P]): void;
+}
+export interface ObservableMap<T> {
+    /**
+     * Proxied object that will detect dependencies and call
+     * the subscriptions and computed properties.
+     *
+     * If available, it will detect from which Stencil Component
+     * it was called and rerender it when the property changes.
+     *
+     * Note: Proxy objects are not supported by IE11 (not even with a polyfill)
+     * so you need to use the store.get and store.set methods of the API if you wish to support IE11.
+     *
+     */
+    state: T;
+    /**
+     * Only useful if you need to support IE11.
+     *
+     * @example
+     * const { state, get } = createStore({ hola: 'hello', adios: 'goodbye' });
+     * console.log(state.hola); // If you don't need to support IE11, use this way.
+     * console.log(get('hola')); // If you need to support IE11, use this other way.
+     */
+    get: Getter<T>;
+    /**
+     * Only useful if you need to support IE11.
+     *
+     * @example
+     * const { state, get } = createStore({ hola: 'hello', adios: 'goodbye' });
+     * state.hola = 'ola'; // If you don't need to support IE11, use this way.
+     * set('hola', 'ola')); // If you need to support IE11, use this other way.
+     */
+    set: Setter<T>;
+    /**
+     * Register a event listener, you can listen to `set`, `get` and `reset` events.
+     *
+     * @example
+     * store.on('set', (prop, value) => {
+     *   console.log(`Prop ${prop} changed to: ${value}`);
+     * });
+     */
+    on: OnHandler<T>;
+    /**
+     * Easily listen for value changes of the specified key.
+     */
+    onChange: OnChangeHandler<T>;
+    /**
+     * Resets the state to its original state and
+     * signals a dispose event to all the plugins.
+     *
+     * This method is intended for plugins to reset
+     * all their internal state between tests.
+     */
+    dispose(): void;
+    /**
+     * Resets the state to its original state.
+     */
+    reset(): void;
+    /**
+     * Registers a subscription that will be called whenever the user gets, sets, or
+     * resets a value.
+     */
+    use(...plugins: Subscription<T>[]): () => void;
+    /**
+     * Force a rerender of the specified key, just like the value changed.
+     */
+    forceUpdate(key: keyof T): any;
+}

package/dist/types/utils/store.utils.d.ts

@@ -1,6 +1,7 @@
-import type { Observable } from "../types/index";
+import { ObservableMap, Subscription } from './store.types';
+export type Observable<T> = ObservableMap<T>;
+export type PluginSubscribe<T> = Subscription<T>;
 /** Set stores data */
-declare function setStore<T extends {
+export declare function setStore<T extends {
     [key: string]: any;
 }>(store: Observable<T>, data: Partial<T>): void;
-export { setStore };