1 line
21 KiB
Plaintext
1 line
21 KiB
Plaintext
{"version":3,"sources":["./node_modules/@ionic/core/dist/esm/ion-virtual-scroll.entry.js"],"names":[],"mappings":";;;;;;;;;;AAAA;AAAA;AAAA;AAA4I;;AAE5I;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,4BAA4B,SAAS;AACrC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GAAG;AACH;AACA;AACA;AACA;AACA;AACA,iBAAiB,gBAAgB;AACjC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+CAA+C,SAAS;AACxD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,QAAQ,wBAAwB;AAChC;AACA;AACA;AACA;AACA;AACA;AACA,QAAQ,wBAAwB;AAChC;AACA;AACA;AACA;AACA;AACA;AACA,UAAU;AACV;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB,gBAAgB;AACjC;AACA;AACA;AACA;AACA;AACA;AACA;AACA,sBAAsB,SAAS;AAC/B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS;AACT;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS;AACT;AACA;AACA;AACA;AACA;AACA;AACA;AACA,qBAAqB,gBAAgB;AACrC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,6CAA6C,cAAc,kBAAkB,WAAW,eAAe,yBAAyB,sBAAsB,qBAAqB,iBAAiB,oCAAoC,UAAU,iCAAiC,6BAA6B,iBAAiB,mBAAmB,kBAAkB,gCAAgC,wBAAwB,sBAAsB;;AAE5a;AACA;AACA,IAAI,4DAAgB;AACpB,kBAAkB;AAClB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAI,4DAAQ;AACZ,IAAI,4DAAS;AACb;AACA;AACA,WAAW,0BAA0B;AACrC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,4DAAW;AACjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,WAAW,qBAAqB;AAChC;AACA;AACA;AACA;AACA;AACA;AACA;AACA,YAAY,4DAAC,CAAC,oDAAI,GAAG;AACrB,mBAAmB,iBAAiB;AACpC,OAAO,EAAE,sBAAsB,4DAAC,gBAAgB,uBAAuB;AACvE;AACA,YAAY,QAAQ,4DAAU,OAAO;AACrC,yBAAyB;AACzB;AACA;AACA;AACA;AACA,IAAI;AACJ;AACA,uBAAuB,MAAM;AAC7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,yCAAyC,WAAW,uCAAuC,YAAY,sDAAsD,kBAAkB,6BAA6B,SAAS,QAAQ,GAAG,GAAG;AACnO,GAAG;AACH;AACA;;AAE+C","file":"42-es2015.js","sourcesContent":["import { r as registerInstance, f as readTask, c as writeTask, j as forceUpdate, h, H as Host, i as getElement } from './index-e806d1f6.js';\n\nconst CELL_TYPE_ITEM = 'item';\nconst CELL_TYPE_HEADER = 'header';\nconst CELL_TYPE_FOOTER = 'footer';\nconst NODE_CHANGE_NONE = 0;\nconst NODE_CHANGE_POSITION = 1;\nconst NODE_CHANGE_CELL = 2;\n\nconst MIN_READS = 2;\nconst updateVDom = (dom, heightIndex, cells, range) => {\n // reset dom\n for (const node of dom) {\n node.change = NODE_CHANGE_NONE;\n node.d = true;\n }\n // try to match into exisiting dom\n const toMutate = [];\n const end = range.offset + range.length;\n for (let i = range.offset; i < end; i++) {\n const cell = cells[i];\n const node = dom.find(n => n.d && n.cell === cell);\n if (node) {\n const top = heightIndex[i];\n if (top !== node.top) {\n node.top = top;\n node.change = NODE_CHANGE_POSITION;\n }\n node.d = false;\n }\n else {\n toMutate.push(cell);\n }\n }\n // needs to append\n const pool = dom.filter(n => n.d);\n for (const cell of toMutate) {\n const node = pool.find(n => n.d && n.cell.type === cell.type);\n const index = cell.i;\n if (node) {\n node.d = false;\n node.change = NODE_CHANGE_CELL;\n node.cell = cell;\n node.top = heightIndex[index];\n }\n else {\n dom.push({\n d: false,\n cell,\n visible: true,\n change: NODE_CHANGE_CELL,\n top: heightIndex[index],\n });\n }\n }\n dom\n .filter(n => n.d && n.top !== -9999)\n .forEach(n => {\n n.change = NODE_CHANGE_POSITION;\n n.top = -9999;\n });\n};\nconst doRender = (el, nodeRender, dom, updateCellHeight) => {\n const children = Array.from(el.children).filter(n => n.tagName !== 'TEMPLATE');\n const childrenNu = children.length;\n let child;\n for (let i = 0; i < dom.length; i++) {\n const node = dom[i];\n const cell = node.cell;\n // the cell change, the content must be updated\n if (node.change === NODE_CHANGE_CELL) {\n if (i < childrenNu) {\n child = children[i];\n nodeRender(child, cell, i);\n }\n else {\n const newChild = createNode(el, cell.type);\n child = nodeRender(newChild, cell, i) || newChild;\n child.classList.add('virtual-item');\n el.appendChild(child);\n }\n child['$ionCell'] = cell;\n }\n else {\n child = children[i];\n }\n // only update position when it changes\n if (node.change !== NODE_CHANGE_NONE) {\n child.style.transform = `translate3d(0,${node.top}px,0)`;\n }\n // update visibility\n const visible = cell.visible;\n if (node.visible !== visible) {\n if (visible) {\n child.classList.remove('virtual-loading');\n }\n else {\n child.classList.add('virtual-loading');\n }\n node.visible = visible;\n }\n // dynamic height\n if (cell.reads > 0) {\n updateCellHeight(cell, child);\n cell.reads--;\n }\n }\n};\nconst createNode = (el, type) => {\n const template = getTemplate(el, type);\n if (template && el.ownerDocument) {\n return el.ownerDocument.importNode(template.content, true).children[0];\n }\n return null;\n};\nconst getTemplate = (el, type) => {\n switch (type) {\n case CELL_TYPE_ITEM: return el.querySelector('template:not([name])');\n case CELL_TYPE_HEADER: return el.querySelector('template[name=header]');\n case CELL_TYPE_FOOTER: return el.querySelector('template[name=footer]');\n }\n};\nconst getViewport = (scrollTop, vierportHeight, margin) => {\n return {\n top: Math.max(scrollTop - margin, 0),\n bottom: scrollTop + vierportHeight + margin\n };\n};\nconst getRange = (heightIndex, viewport, buffer) => {\n const topPos = viewport.top;\n const bottomPos = viewport.bottom;\n // find top index\n let i = 0;\n for (; i < heightIndex.length; i++) {\n if (heightIndex[i] > topPos) {\n break;\n }\n }\n const offset = Math.max(i - buffer - 1, 0);\n // find bottom index\n for (; i < heightIndex.length; i++) {\n if (heightIndex[i] >= bottomPos) {\n break;\n }\n }\n const end = Math.min(i + buffer, heightIndex.length);\n const length = end - offset;\n return { offset, length };\n};\nconst getShouldUpdate = (dirtyIndex, currentRange, range) => {\n const end = range.offset + range.length;\n return (dirtyIndex <= end ||\n currentRange.offset !== range.offset ||\n currentRange.length !== range.length);\n};\nconst findCellIndex = (cells, index) => {\n const max = cells.length > 0 ? cells[cells.length - 1].index : 0;\n if (index === 0) {\n return 0;\n }\n else if (index === max + 1) {\n return cells.length;\n }\n else {\n return cells.findIndex(c => c.index === index);\n }\n};\nconst inplaceUpdate = (dst, src, offset) => {\n if (offset === 0 && src.length >= dst.length) {\n return src;\n }\n for (let i = 0; i < src.length; i++) {\n dst[i + offset] = src[i];\n }\n return dst;\n};\nconst calcCells = (items, itemHeight, headerHeight, footerHeight, headerFn, footerFn, approxHeaderHeight, approxFooterHeight, approxItemHeight, j, offset, len) => {\n const cells = [];\n const end = len + offset;\n for (let i = offset; i < end; i++) {\n const item = items[i];\n if (headerFn) {\n const value = headerFn(item, i, items);\n if (value != null) {\n cells.push({\n i: j++,\n type: CELL_TYPE_HEADER,\n value,\n index: i,\n height: headerHeight ? headerHeight(value, i) : approxHeaderHeight,\n reads: headerHeight ? 0 : MIN_READS,\n visible: !!headerHeight,\n });\n }\n }\n cells.push({\n i: j++,\n type: CELL_TYPE_ITEM,\n value: item,\n index: i,\n height: itemHeight ? itemHeight(item, i) : approxItemHeight,\n reads: itemHeight ? 0 : MIN_READS,\n visible: !!itemHeight,\n });\n if (footerFn) {\n const value = footerFn(item, i, items);\n if (value != null) {\n cells.push({\n i: j++,\n type: CELL_TYPE_FOOTER,\n value,\n index: i,\n height: footerHeight ? footerHeight(value, i) : approxFooterHeight,\n reads: footerHeight ? 0 : MIN_READS,\n visible: !!footerHeight,\n });\n }\n }\n }\n return cells;\n};\nconst calcHeightIndex = (buf, cells, index) => {\n let acum = buf[index];\n for (let i = index; i < buf.length; i++) {\n buf[i] = acum;\n acum += cells[i].height;\n }\n return acum;\n};\nconst resizeBuffer = (buf, len) => {\n if (!buf) {\n return new Uint32Array(len);\n }\n if (buf.length === len) {\n return buf;\n }\n else if (len > buf.length) {\n const newBuf = new Uint32Array(len);\n newBuf.set(buf);\n return newBuf;\n }\n else {\n return buf.subarray(0, len);\n }\n};\nconst positionForIndex = (index, cells, heightIndex) => {\n const cell = cells.find(c => c.type === CELL_TYPE_ITEM && c.index === index);\n if (cell) {\n return heightIndex[cell.i];\n }\n return -1;\n};\n\nconst virtualScrollCss = \"ion-virtual-scroll{display:block;position:relative;width:100%;contain:strict;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}ion-virtual-scroll>.virtual-loading{opacity:0}ion-virtual-scroll>.virtual-item{position:absolute !important;top:0 !important;right:0 !important;left:0 !important;-webkit-transition-duration:0ms;transition-duration:0ms;will-change:transform}\";\n\nconst VirtualScroll = class {\n constructor(hostRef) {\n registerInstance(this, hostRef);\n this.range = { offset: 0, length: 0 };\n this.viewportHeight = 0;\n this.cells = [];\n this.virtualDom = [];\n this.isEnabled = false;\n this.viewportOffset = 0;\n this.currentScrollTop = 0;\n this.indexDirty = 0;\n this.lastItemLen = 0;\n this.totalHeight = 0;\n /**\n * It is important to provide this\n * if virtual item height will be significantly larger than the default\n * The approximate height of each virtual item template's cell.\n * This dimension is used to help determine how many cells should\n * be created when initialized, and to help calculate the height of\n * the scrollable area. This height value can only use `px` units.\n * Note that the actual rendered size of each cell comes from the\n * app's CSS, whereas this approximation is used to help calculate\n * initial dimensions before the item has been rendered.\n */\n this.approxItemHeight = 45;\n /**\n * The approximate height of each header template's cell.\n * This dimension is used to help determine how many cells should\n * be created when initialized, and to help calculate the height of\n * the scrollable area. This height value can only use `px` units.\n * Note that the actual rendered size of each cell comes from the\n * app's CSS, whereas this approximation is used to help calculate\n * initial dimensions before the item has been rendered.\n */\n this.approxHeaderHeight = 30;\n /**\n * The approximate width of each footer template's cell.\n * This dimension is used to help determine how many cells should\n * be created when initialized, and to help calculate the height of\n * the scrollable area. This height value can only use `px` units.\n * Note that the actual rendered size of each cell comes from the\n * app's CSS, whereas this approximation is used to help calculate\n * initial dimensions before the item has been rendered.\n */\n this.approxFooterHeight = 30;\n this.onScroll = () => {\n this.updateVirtualScroll();\n };\n }\n itemsChanged() {\n this.calcCells();\n this.updateVirtualScroll();\n }\n async connectedCallback() {\n const contentEl = this.el.closest('ion-content');\n if (!contentEl) {\n console.error('<ion-virtual-scroll> must be used inside an <ion-content>');\n return;\n }\n this.scrollEl = await contentEl.getScrollElement();\n this.contentEl = contentEl;\n this.calcCells();\n this.updateState();\n }\n componentDidUpdate() {\n this.updateState();\n }\n disconnectedCallback() {\n this.scrollEl = undefined;\n }\n onResize() {\n this.calcCells();\n this.updateVirtualScroll();\n }\n /**\n * Returns the position of the virtual item at the given index.\n */\n positionForItem(index) {\n return Promise.resolve(positionForIndex(index, this.cells, this.getHeightIndex()));\n }\n /**\n * This method marks a subset of items as dirty, so they can be re-rendered. Items should be marked as\n * dirty any time the content or their style changes.\n *\n * The subset of items to be updated can are specifing by an offset and a length.\n */\n async checkRange(offset, len = -1) {\n // TODO: kind of hacky how we do in-place updated of the cells\n // array. this part needs a complete refactor\n if (!this.items) {\n return;\n }\n const length = (len === -1)\n ? this.items.length - offset\n : len;\n const cellIndex = findCellIndex(this.cells, offset);\n const cells = calcCells(this.items, this.itemHeight, this.headerHeight, this.footerHeight, this.headerFn, this.footerFn, this.approxHeaderHeight, this.approxFooterHeight, this.approxItemHeight, cellIndex, offset, length);\n this.cells = inplaceUpdate(this.cells, cells, cellIndex);\n this.lastItemLen = this.items.length;\n this.indexDirty = Math.max(offset - 1, 0);\n this.scheduleUpdate();\n }\n /**\n * This method marks the tail the items array as dirty, so they can be re-rendered.\n *\n * It's equivalent to calling:\n *\n * ```js\n * virtualScroll.checkRange(lastItemLen);\n * ```\n */\n async checkEnd() {\n if (this.items) {\n this.checkRange(this.lastItemLen);\n }\n }\n updateVirtualScroll() {\n // do nothing if virtual-scroll is disabled\n if (!this.isEnabled || !this.scrollEl) {\n return;\n }\n // unschedule future updates\n if (this.timerUpdate) {\n clearTimeout(this.timerUpdate);\n this.timerUpdate = undefined;\n }\n // schedule DOM operations into the stencil queue\n readTask(this.readVS.bind(this));\n writeTask(this.writeVS.bind(this));\n }\n readVS() {\n const { contentEl, scrollEl, el } = this;\n let topOffset = 0;\n let node = el;\n while (node && node !== contentEl) {\n topOffset += node.offsetTop;\n node = node.offsetParent;\n }\n this.viewportOffset = topOffset;\n if (scrollEl) {\n this.viewportHeight = scrollEl.offsetHeight;\n this.currentScrollTop = scrollEl.scrollTop;\n }\n }\n writeVS() {\n const dirtyIndex = this.indexDirty;\n // get visible viewport\n const scrollTop = this.currentScrollTop - this.viewportOffset;\n const viewport = getViewport(scrollTop, this.viewportHeight, 100);\n // compute lazily the height index\n const heightIndex = this.getHeightIndex();\n // get array bounds of visible cells base in the viewport\n const range = getRange(heightIndex, viewport, 2);\n // fast path, do nothing\n const shouldUpdate = getShouldUpdate(dirtyIndex, this.range, range);\n if (!shouldUpdate) {\n return;\n }\n this.range = range;\n // in place mutation of the virtual DOM\n updateVDom(this.virtualDom, heightIndex, this.cells, range);\n // Write DOM\n // Different code paths taken depending of the render API used\n if (this.nodeRender) {\n doRender(this.el, this.nodeRender, this.virtualDom, this.updateCellHeight.bind(this));\n }\n else if (this.domRender) {\n this.domRender(this.virtualDom);\n }\n else if (this.renderItem) {\n forceUpdate(this);\n }\n }\n updateCellHeight(cell, node) {\n const update = () => {\n if (node['$ionCell'] === cell) {\n const style = window.getComputedStyle(node);\n const height = node.offsetHeight + parseFloat(style.getPropertyValue('margin-bottom'));\n this.setCellHeight(cell, height);\n }\n };\n if (node && node.componentOnReady) {\n node.componentOnReady().then(update);\n }\n else {\n update();\n }\n }\n setCellHeight(cell, height) {\n const index = cell.i;\n // the cell might changed since the height update was scheduled\n if (cell !== this.cells[index]) {\n return;\n }\n if (cell.height !== height || cell.visible !== true) {\n cell.visible = true;\n cell.height = height;\n this.indexDirty = Math.min(this.indexDirty, index);\n this.scheduleUpdate();\n }\n }\n scheduleUpdate() {\n clearTimeout(this.timerUpdate);\n this.timerUpdate = setTimeout(() => this.updateVirtualScroll(), 100);\n }\n updateState() {\n const shouldEnable = !!(this.scrollEl &&\n this.cells);\n if (shouldEnable !== this.isEnabled) {\n this.enableScrollEvents(shouldEnable);\n if (shouldEnable) {\n this.updateVirtualScroll();\n }\n }\n }\n calcCells() {\n if (!this.items) {\n return;\n }\n this.lastItemLen = this.items.length;\n this.cells = calcCells(this.items, this.itemHeight, this.headerHeight, this.footerHeight, this.headerFn, this.footerFn, this.approxHeaderHeight, this.approxFooterHeight, this.approxItemHeight, 0, 0, this.lastItemLen);\n this.indexDirty = 0;\n }\n getHeightIndex() {\n if (this.indexDirty !== Infinity) {\n this.calcHeightIndex(this.indexDirty);\n }\n return this.heightIndex;\n }\n calcHeightIndex(index = 0) {\n // TODO: optimize, we don't need to calculate all the cells\n this.heightIndex = resizeBuffer(this.heightIndex, this.cells.length);\n this.totalHeight = calcHeightIndex(this.heightIndex, this.cells, index);\n this.indexDirty = Infinity;\n }\n enableScrollEvents(shouldListen) {\n if (this.rmEvent) {\n this.rmEvent();\n this.rmEvent = undefined;\n }\n const scrollEl = this.scrollEl;\n if (scrollEl) {\n this.isEnabled = shouldListen;\n scrollEl.addEventListener('scroll', this.onScroll);\n this.rmEvent = () => {\n scrollEl.removeEventListener('scroll', this.onScroll);\n };\n }\n }\n renderVirtualNode(node) {\n const { type, value, index } = node.cell;\n switch (type) {\n case CELL_TYPE_ITEM: return this.renderItem(value, index);\n case CELL_TYPE_HEADER: return this.renderHeader(value, index);\n case CELL_TYPE_FOOTER: return this.renderFooter(value, index);\n }\n }\n render() {\n return (h(Host, { style: {\n height: `${this.totalHeight}px`\n } }, this.renderItem && (h(VirtualProxy, { dom: this.virtualDom }, this.virtualDom.map(node => this.renderVirtualNode(node))))));\n }\n get el() { return getElement(this); }\n static get watchers() { return {\n \"itemHeight\": [\"itemsChanged\"],\n \"headerHeight\": [\"itemsChanged\"],\n \"footerHeight\": [\"itemsChanged\"],\n \"items\": [\"itemsChanged\"]\n }; }\n};\nconst VirtualProxy = ({ dom }, children, utils) => {\n return utils.map(children, (child, i) => {\n const node = dom[i];\n const vattrs = child.vattrs || {};\n let classes = vattrs.class || '';\n classes += 'virtual-item ';\n if (!node.visible) {\n classes += 'virtual-loading';\n }\n return Object.assign(Object.assign({}, child), { vattrs: Object.assign(Object.assign({}, vattrs), { class: classes, style: Object.assign(Object.assign({}, vattrs.style), { transform: `translate3d(0,${node.top}px,0)` }) }) });\n });\n};\nVirtualScroll.style = virtualScrollCss;\n\nexport { VirtualScroll as ion_virtual_scroll };\n"],"sourceRoot":"webpack:///"} |