@web-atoms/core 2.5.9 → 2.5.13

package/dist-esm/web/controls/AtomItemsControl.js

@@ -0,0 +1,840 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AtomItemsControl = void 0;
+const tslib_1 = require("tslib");
+const AtomBinder_js_1 = require("../../core/AtomBinder.js");
+const AtomEnumerator_js_1 = tslib_1.__importDefault(require("../../core/AtomEnumerator.js"));
+require("../../core/AtomList");
+const XNode_js_1 = tslib_1.__importDefault(require("../../core/XNode.js"));
+const AtomUI_js_1 = require("../../web/core/AtomUI.js");
+const AtomControl_js_1 = require("./AtomControl.js");
+class AtomItemsControl extends AtomControl_js_1.AtomControl {
+    constructor() {
+        super(...arguments);
+        this.mValue = undefined;
+        // private mFilteredItems: any[] = [];
+        // private mSelectedItem: any = undefined;
+        this.mFilter = undefined;
+        this.mFirstChild = null;
+        this.mLastChild = null;
+        this.mScrollerSetup = false;
+        this.mScopes = null;
+        this.mItemsDisposable = null;
+        this.isUpdating = false;
+    }
+    get itemsPresenter() {
+        return this.mItemsPresenter || (this.mItemsPresenter = this.element);
+    }
+    set itemsPresenter(v) {
+        this.mItemsPresenter = v;
+        AtomBinder_js_1.AtomBinder.refreshValue(this, "itemsPresenter");
+    }
+    get value() {
+        if (this.allowMultipleSelection) {
+            let items = this.mSelectedItems;
+            if (items.length === 0) {
+                if (this.mValue !== undefined) {
+                    return this.mValue;
+                }
+                return null;
+            }
+            items = items.map((m) => m[this.valuePath]);
+            if (this.valueSeparator) {
+                items = items.join(this.valueSeparator);
+            }
+            return items;
+        }
+        let s = this.selectedItem;
+        if (!s) {
+            if (this.mValue !== undefined) {
+                return this.mValue;
+            }
+            return null;
+        }
+        if (this.valuePath) {
+            s = s[this.valuePath];
+        }
+        return s;
+    }
+    set value(v) {
+        this.mValue = v;
+        const dataItems = this.items;
+        if (!dataItems) {
+            return;
+        }
+        const sItems = this.selectedItems;
+        if (v === undefined || v === null) {
+            // reset...
+            AtomBinder_js_1.AtomBinder.clear(sItems);
+            return;
+        }
+        if (this.allowMultipleSelection && this.valueSeparator) {
+            if (typeof v !== "string") {
+                v = "" + v;
+            }
+            v = v.split(this.valueSeparator);
+        }
+        else {
+            v = [v];
+        }
+        // const items = AtomArray.intersect(dataItems, this._valuePath, v);
+        sItems.length = 0;
+        const vp = this.valuePath;
+        for (const item of v) {
+            // tslint:disable-next-line:triple-equals
+            const dataItem = dataItems.find((i) => i[vp] == v);
+            if (dataItem) {
+                sItems.push(dataItem);
+            }
+        }
+        // this.updateSelectionBindings();
+        AtomBinder_js_1.AtomBinder.refreshItems(sItems);
+    }
+    get items() {
+        return this.mItems;
+    }
+    set items(v) {
+        if (this.mItemsDisposable) {
+            this.mItemsDisposable.dispose();
+            this.mItemsDisposable = null;
+        }
+        this.mItems = v;
+        // this.mFilteredItems = null;
+        if (v != null) {
+            this.mItemsDisposable = this.registerDisposable(AtomBinder_js_1.AtomBinder.add_CollectionChanged(v, (target, key, index, item) => {
+                this.onCollectionChangedInternal(key, index, item);
+            }));
+            // this.onCollectionChangedInternal("refresh", -1, null);
+        }
+        AtomBinder_js_1.AtomBinder.refreshValue(this, "items");
+    }
+    get selectedItem() {
+        if (this.selectedItems.length > 0) {
+            return this.selectedItems[0];
+        }
+        return null;
+    }
+    set selectedItem(value) {
+        if (value !== undefined && value !== null) {
+            this.mSelectedItems.length = 1;
+            this.mSelectedItems[0] = value;
+        }
+        else {
+            this.mSelectedItems.length = 0;
+        }
+        AtomBinder_js_1.AtomBinder.refreshItems(this.mSelectedItems);
+    }
+    get selectedItems() {
+        return this.mSelectedItems || (this.selectedItems = []);
+    }
+    set selectedItems(v) {
+        if (this.mSelectedItemsWatcher) {
+            this.mSelectedItemsWatcher.dispose();
+            this.mSelectedItemsWatcher = null;
+        }
+        this.mSelectedItems = v;
+        if (v) {
+            this.mSelectedItemsWatcher = this.registerDisposable(AtomBinder_js_1.AtomBinder.add_CollectionChanged(v, (t, k, i, item) => {
+                this.onSelectedItemsChanged(k, i, item);
+            }));
+        }
+    }
+    get selectedIndex() {
+        if (!this.mItems) {
+            return -1;
+        }
+        const item = this.selectedItem;
+        return this.mItems.indexOf(item);
+    }
+    set selectedIndex(n) {
+        if (!this.mItems) {
+            return;
+        }
+        if (n <= -1 || n >= this.mItems.length) {
+            this.selectedItem = null;
+            return;
+        }
+        this.selectedItem = this.mItems[n];
+    }
+    hasProperty(name) {
+        // tslint:disable-next-line: max-line-length
+        if (/^(items|itemsPresenter|value|valuePath|valueSeparator|label|labelPath|selectedItems|selectedItem|selectedIndex|uiVirtualize|viewModel|localViewModel|data)$/.test(name)) {
+            return true;
+        }
+        return super.hasProperty(name);
+    }
+    dispose(e) {
+        this.items = null;
+        this.selectedItems = null;
+        // this.mFilteredItems = null;
+        super.dispose(e);
+    }
+    onPropertyChanged(name) {
+        switch (name) {
+            case "itemsPresenter":
+            case "itemTemplate":
+            case "labelPath":
+            case "valuePath":
+            case "items":
+            case "filter":
+            case "sort":
+                if (this.mItems) {
+                    this.invalidateItems();
+                }
+                // this.runAfterInit(() => {
+                //     if (this.mItems) {
+                //         this.onCollectionChangedInternal("refresh", -1, null);
+                //     }
+                // });
+                break;
+        }
+    }
+    set selectAll(v) {
+        if (v === undefined || v === null) {
+            return;
+        }
+        this.mSelectedItems.length = 0;
+        const items = this.mItems;
+        if (v && items) {
+            for (const itm of items) {
+                this.mSelectedItems.push(itm);
+            }
+        }
+        this.mSelectAll = true;
+        AtomBinder_js_1.AtomBinder.refreshItems(this.mSelectedItems);
+    }
+    resetVirtualContainer() {
+        const ip = this.itemsPresenter;
+        if (ip) {
+            this.disposeChildren(ip);
+        }
+        this.mFirstChild = null;
+        this.mLastChild = null;
+        this.mScrollerSetup = false;
+        this.mScopes = null;
+        this.unbindEvent(this.mVirtualContainer, "scroll");
+    }
+    postVirtualCollectionChanged() {
+        this.app.callLater(() => {
+            this.onVirtualCollectionChanged();
+        });
+    }
+    onVirtualCollectionChanged() {
+        const ip = this.itemsPresenter;
+        const items = this.items;
+        if (!items.length) {
+            this.resetVirtualContainer();
+            return;
+        }
+        this.validateScroller();
+        const fc = this.mFirstChild;
+        const lc = this.mLastChild;
+        const vc = this.mVirtualContainer;
+        const vcHeight = AtomUI_js_1.AtomUI.innerHeight(vc);
+        const vcScrollHeight = vc.scrollHeight;
+        if (isNaN(vcHeight) || vcHeight <= 0 || vcScrollHeight <= 0) {
+            setTimeout(() => {
+                this.onVirtualCollectionChanged();
+            }, 1000);
+            return;
+        }
+        const vcWidth = AtomUI_js_1.AtomUI.innerWidth(vc);
+        let avgHeight = this.mAvgHeight;
+        let avgWidth = this.mAvgWidth;
+        const itemsHeight = vc.scrollHeight - AtomUI_js_1.AtomUI.outerHeight(fc) - AtomUI_js_1.AtomUI.outerHeight(lc);
+        const itemsWidth = AtomUI_js_1.AtomUI.innerWidth(ip);
+        const element = this.element;
+        let ce;
+        let ae = new AtomEnumerator_js_1.default(items);
+        if (this.mTraining) {
+            if (vcHeight >= itemsHeight) {
+                // lets add item...
+                ce = lc.previousElementSibling;
+                if (ce !== fc) {
+                    const data = ce.atomControl.data;
+                    while (ae.next()) {
+                        if (ae.current === data) {
+                            break;
+                        }
+                    }
+                }
+                if (ae.next()) {
+                    const data = ae.current;
+                    const elementChild = this.createChild(null, data);
+                    ip.insertBefore(elementChild.element, lc);
+                    this.postVirtualCollectionChanged();
+                }
+            }
+            else {
+                // calculate avg height
+                let totalVisibleItems = 0;
+                ce = fc.nextElementSibling;
+                let allHeight = 0;
+                let allWidth = 0;
+                while (ce !== lc) {
+                    totalVisibleItems++;
+                    allHeight += AtomUI_js_1.AtomUI.outerHeight(ce);
+                    allWidth += AtomUI_js_1.AtomUI.outerWidth(ce);
+                    ce = ce.nextElementSibling;
+                }
+                avgHeight = allHeight / totalVisibleItems;
+                avgWidth = allWidth / totalVisibleItems;
+                totalVisibleItems--;
+                this.mAvgHeight = avgHeight;
+                this.mAvgWidth = avgWidth;
+                const columns = Math.floor(vcWidth / avgWidth);
+                const allRows = Math.ceil(items.length / columns);
+                const visibleRows = Math.ceil(totalVisibleItems / columns);
+                // tslint:disable-next-line:no-console
+                console.log({
+                    avgWidth,
+                    avgHeight,
+                    totalVisibleItems,
+                    allRows,
+                    columns
+                });
+                this.mAllRows = allRows;
+                this.mColumns = columns;
+                this.mVisibleRows = visibleRows;
+                this.mVisibleHeight = visibleRows * avgHeight;
+                // set height of last child... to increase padding
+                lc.style.height = ((allRows - visibleRows + 1) * avgHeight) + "px";
+                this.mTraining = false;
+                this.mReady = true;
+                this.postVirtualCollectionChanged();
+            }
+            return;
+        }
+        const self = this;
+        this.lastScrollTop = vc.scrollTop;
+        if (this.mIsChanging) {
+            // setTimeout(function () {
+            //    self.onVirtualCollectionChanged();
+            // }, 100);
+            return;
+        }
+        this.mIsChanging = true;
+        const block = Math.floor(this.mVisibleHeight / avgHeight);
+        const itemsInBlock = this.mVisibleRows * this.mColumns;
+        // lets simply recreate the view... if we are out of the scroll bounds...
+        const index = Math.floor(vc.scrollTop / this.mVisibleHeight);
+        const itemIndex = index * itemsInBlock;
+        // console.log("First block index is " + index + " item index is " + index * itemsInBlock);
+        if (itemIndex >= items.length) {
+            this.mIsChanging = false;
+            return;
+        }
+        const lastIndex = Math.min((Math.max(index, 0) + 3) * itemsInBlock - 1, items.length - 1);
+        const firstIndex = Math.max(0, (index) * itemsInBlock);
+        ce = fc.nextElementSibling;
+        const firstItem = fc.nextElementSibling;
+        const lastItem = lc.previousElementSibling;
+        if (firstItem !== lastItem) {
+            const firstVisibleIndex = items.indexOf(firstItem.atomControl.data);
+            const lastVisibleIndex = items.indexOf(lastItem.atomControl.data);
+            // tslint:disable-next-line:no-console
+            console.log({
+                firstVisibleIndex,
+                firstIndex,
+                lastVisibleIndex,
+                lastIndex
+            });
+            if (firstIndex >= firstVisibleIndex && lastIndex <= lastVisibleIndex) {
+                // tslint:disable-next-line:no-console
+                console.log("All items are visible...");
+                this.mIsChanging = false;
+                return;
+            }
+        }
+        const remove = [];
+        const cache = {};
+        while (ce !== lc) {
+            const c = ce;
+            ce = ce.nextElementSibling;
+            const s = items.indexOf(c.atomControl.data);
+            cache[s] = c;
+            remove.push(c);
+        }
+        this.app.dispatcher.pause();
+        ae = new AtomEnumerator_js_1.default(items);
+        for (let i = 0; i < firstIndex; i++) {
+            ae.next();
+        }
+        let after = fc;
+        let last = null;
+        const add = [];
+        for (let i = firstIndex; i <= lastIndex; i++) {
+            if (!ae.next()) {
+                break;
+            }
+            const index2 = ae.currentIndex;
+            const data = ae.current;
+            let elementChild = cache[index2];
+            if (elementChild && element.atomControl.data === data) {
+                cache[index2] = null;
+            }
+            else {
+                elementChild = this.createChild(null, data).element;
+            }
+            elementChild.before = after;
+            add.push(elementChild);
+            after = elementChild;
+            last = index2;
+        }
+        const h = (this.mAllRows - block * 3) * avgHeight - index * this.mVisibleHeight;
+        // tslint:disable-next-line:no-console
+        console.log("last child height = " + h);
+        this.app.callLater(() => {
+            const oldHeight = AtomUI_js_1.AtomUI.outerHeight(fc);
+            const newHeight = index * this.mVisibleHeight;
+            const diff = newHeight - oldHeight;
+            const oldScrollTop = vc.scrollTop;
+            const a = new AtomEnumerator_js_1.default(add);
+            while (a.next()) {
+                const ec = a.current;
+                ip.insertBefore(ec, ec.before.nextElementSibling);
+                ec.before = null;
+            }
+            fc.style.height = newHeight + "px";
+            for (const iterator of remove) {
+                if (!iterator.before) {
+                    iterator.atomControl.dispose();
+                }
+                iterator.remove();
+            }
+            // const a = new AtomEnumerator(remove);
+            // while (a.next()) {
+            //     const ec = a.current();
+            //     if (!ec.before) {
+            //         ec.atomControl.dispose();
+            //     }
+            //     ec.remove();
+            // }
+            // vc.scrollTop = oldScrollTop - diff;
+            lc.style.height = h + "px";
+            // tslint:disable-next-line:no-console
+            console.log(`Old: ${oldScrollTop} Diff: ${diff} Old Height: ${oldHeight} Height: ${newHeight}`);
+            this.mIsChanging = false;
+        });
+        this.app.dispatcher.start();
+        AtomBinder_js_1.AtomBinder.refreshValue(this, "childAtomControls");
+    }
+    isSelected(item) {
+        let selectedItem = null;
+        for (const iterator of this.mSelectedItems) {
+            selectedItem = iterator;
+            if (selectedItem === item) {
+                return true;
+            }
+        }
+        return false;
+    }
+    bringIntoView(data) {
+        this.app.callLater(() => {
+            for (let item of AtomUI_js_1.ChildEnumerator.enumerate(this.itemsPresenter || this.element)) {
+                const dataItem = item.atomControl ? item.atomControl.data : item;
+                if (dataItem === data) {
+                    item.scrollIntoView();
+                    return;
+                }
+            }
+        });
+    }
+    bringSelectionIntoView() {
+        // do not scroll for first auto select
+        // if (this.mAllowSelectFirst && this.get_selectedIndex() === 0) {
+        //     return;
+        // }
+        if (this.uiVirtualize) {
+            const index = this.selectedIndex;
+            if (!this.mReady) {
+                setTimeout(() => {
+                    this.bringSelectionIntoView();
+                }, 1000);
+                return;
+            }
+            const avgHeight = this.mAvgHeight;
+            const vcHeight = AtomUI_js_1.AtomUI.innerHeight(this.mVirtualContainer);
+            const block = Math.ceil(vcHeight / avgHeight);
+            const itemsInBlock = block * this.mColumns;
+            const scrollTop = Math.floor(index / itemsInBlock);
+            AtomUI_js_1.AtomUI.scrollTop(this.mVirtualContainer, scrollTop * vcHeight);
+            return;
+        }
+        // const en = new ChildEnumerator(this.itemsPresenter || this.element);
+        for (let item of AtomUI_js_1.ChildEnumerator.enumerate(this.itemsPresenter || this.element)) {
+            // const item = en.current;
+            const dataItem = item.atomControl ? item.atomControl.data : item;
+            if (this.isSelected(dataItem)) {
+                setTimeout(() => {
+                    item.scrollIntoView();
+                }, 1000);
+                return;
+            }
+        }
+    }
+    updateSelectionBindings() {
+        this.version = this.version + 1;
+        if (this.mSelectedItems && this.mSelectedItems.length) {
+            this.mValue = undefined;
+        }
+        AtomBinder_js_1.AtomBinder.refreshValue(this, "value");
+        AtomBinder_js_1.AtomBinder.refreshValue(this, "selectedItem");
+        AtomBinder_js_1.AtomBinder.refreshValue(this, "selectedItems");
+        AtomBinder_js_1.AtomBinder.refreshValue(this, "selectedIndex");
+        if (!this.mSelectedItems.length) {
+            if (this.mSelectAll === true) {
+                this.mSelectAll = false;
+                AtomBinder_js_1.AtomBinder.refreshValue(this, "selectAll");
+            }
+        }
+    }
+    onSelectedItemsChanged(type, index, item) {
+        if (!this.mOnUIChanged) {
+            // this.updateChildSelections(type, index, item);
+            if (this.autoScrollToSelection) {
+                this.bringSelectionIntoView();
+            }
+        }
+        this.updateSelectionBindings();
+        // AtomControl.updateUI();
+        // this.invokePost();
+    }
+    hasItems() {
+        return this.mItems !== undefined && this.mItems !== null;
+    }
+    invalidateItems() {
+        if (this.pendingInits || this.isUpdating) {
+            setTimeout(() => {
+                this.invalidateItems();
+            }, 5);
+            return;
+        }
+        if (this.itemsInvalidated) {
+            clearTimeout(this.itemsInvalidated);
+            this.itemsInvalidated = 0;
+        }
+        this.itemsInvalidated = setTimeout(() => {
+            this.itemsInvalidated = 0;
+            this.onCollectionChangedInternal("refresh", -1, null);
+        }, 5);
+        // this.registerDisposable({
+        //     dispose: () => {
+        //         if (this.itemsInvalidated) {
+        //             clearTimeout(this.itemsInvalidated);
+        //         }
+        //     }
+        // });
+    }
+    onCollectionChanged(key, index, item) {
+        if (!this.mItems) {
+            return;
+        }
+        if (!this.itemTemplate) {
+            return;
+        }
+        if (!this.itemsPresenter) {
+            this.itemsPresenter = this.element;
+        }
+        this.version = this.version + 1;
+        if (/reset|refresh/i.test(key)) {
+            this.resetVirtualContainer();
+        }
+        if (/remove/gi.test(key)) {
+            // tslint:disable-next-line:no-shadowed-variable
+            const ip = this.itemsPresenter || this.element;
+            // const en = new ChildEnumerator(ip);
+            for (let ce of AtomUI_js_1.ChildEnumerator.enumerate(ip)) {
+                // const ce = en.current;
+                // tslint:disable-next-line:no-shadowed-variable
+                const c = ce;
+                if (c.atomControl && c.atomControl.data === item) {
+                    c.atomControl.dispose();
+                    ce.remove();
+                    break;
+                }
+            }
+            // AtomControl.updateUI();
+            return;
+        }
+        if (this.uiVirtualize) {
+            this.onVirtualCollectionChanged();
+            return;
+        }
+        // AtomUIComponent
+        const parentScope = undefined;
+        // const parentScope = this.get_scope();
+        // const et = this.getTemplate("itemTemplate");
+        // if (et) {
+        //     et = AtomUI.getAtomType(et);
+        //     if (et) {
+        //         this._childItemType = et;
+        //     }
+        // }
+        let items = this.mFilter ? this.mItems.filter(this.mFilter) : this.mItems;
+        let s = this.sort;
+        if (s) {
+            if (typeof s === "string") {
+                const sp = s;
+                s = (l, r) => {
+                    const lv = (l[sp] || "").toString();
+                    const rv = (r[sp] || "").toString();
+                    return lv.toLowerCase().localeCompare(rv.toLowerCase());
+                };
+            }
+            items = items.sort(s);
+        }
+        if (/add/gi.test(key)) {
+            // WebAtoms.dispatcher.pause();
+            // for (const aeItem of this.mItems) {
+            //     for (const ceItem of AtomUI.childEnumerator(this.itemsPresenter)) {
+            //         const d: any = ceItem;
+            //         if (aeItem.currentIndex() === index) {
+            //             const ctl: any = this.createChildElement(parentScope, this.itemsPresenter, item, aeItem, d);
+            //             this.applyItemStyle(ctl, item, aeItem.isFirst(), aeItem.isLast());
+            //             break;
+            //         }
+            //         if (aeItem.isLast()) {
+            // tslint:disable-next-line:max-line-length
+            //             const ctl: any = this.createChildElement(parentScope, this.itemsPresenter, item, aeItem, null);
+            //             this.applyItemStyle(ctl, item, aeItem.isFirst(), aeItem.isLast());
+            //             break;
+            //         }
+            //     }
+            // }
+            // WebAtoms.dispatcher.start();
+            // AtomControl.updateUI();
+            const lastItem = items[index];
+            let last = this.itemsPresenter.children.item(index);
+            const df2 = document.createDocumentFragment();
+            this.createChild(df2, lastItem);
+            if (last) {
+                this.itemsPresenter.insertBefore(df2, last);
+            }
+            else {
+                this.itemsPresenter.appendChild(df2);
+            }
+            return;
+        }
+        const element = this.itemsPresenter;
+        // const dataItems = this.get_dataItems();
+        // AtomControl.disposeChildren(element);
+        this.disposeChildren(this.itemsPresenter);
+        // WebAtoms.dispatcher.pause();
+        // const items = this.get_dataItems(true);
+        const added = [];
+        // this.getTemplate("itemTemplate");
+        // tslint:disable-next-line:no-console
+        // console.log("Started");
+        // const df = document.createDocumentFragment();
+        const ip = this.itemsPresenter || this.element;
+        for (const mItem of items) {
+            const data = mItem;
+            // const elementChild = this.createChildElement(parentScope, element, data, mItem, null);
+            // added.push(elementChild);
+            // this.applyItemStyle(elementChild, data, mItem.isFirst(), mItem.isLast());
+            const ac = this.createChild(null, data);
+            ip.appendChild(ac.element);
+        }
+        // (this.element as HTMLElement).appendChild(df);
+        // tslint:disable-next-line:no-console
+        // console.log("Ended");
+        // const self = this;
+        // WebAtoms.dispatcher.callLater(() => {
+        //     const dirty = [];
+        //     for (const elementItem of AtomUI.childEnumerator(element)) {
+        //         const ct = elementItem;
+        //         const func = added.filter((fx) => ct === fx);
+        //         if (func.pop() !== ct) {
+        //             dirty.push(ct);
+        //         }
+        //     }
+        //     for (const dirtyItem of dirty) {
+        //         const drt = dirtyItem;
+        //         if (drt.atomControl) {
+        //             drt.atomControl.dispose();
+        //         }
+        //         AtomUI.remove(item);
+        //     }
+        //     });
+        // WebAtoms.dispatcher.start();
+        // AtomBinder.refreshValue(this, "childAtomControls");
+    }
+    preCreate() {
+        this.mAllowSelectFirst = false;
+        this.allowMultipleSelection = false;
+        this.valuePath = "value";
+        this.labelPath = "label";
+        this.version = 1;
+        this.autoScrollToSelection = false;
+        this.sort = null;
+        this.valueSeparator = ", ";
+        this.uiVirtualize = false;
+        this.mSelectAll = false;
+        this.mItems = null;
+        this.selectedItems = [];
+        this.itemTemplate = AtomItemsControlItemTemplate;
+        super.preCreate();
+    }
+    onCollectionChangedInternal(key, index, item) {
+        // Atom.refresh(this, "allValues");
+        // AtomBinder.refreshValue(this, "allValues");
+        const value = this.value;
+        try {
+            this.isUpdating = true;
+            this.onCollectionChanged(key, index, item);
+            if (value) {
+                if (!(value || this.mAllowSelectFirst)) {
+                    AtomBinder_js_1.AtomBinder.clear(this.mSelectedItems);
+                }
+            }
+            if (value != null) {
+                this.value = value;
+                if (this.selectedIndex !== -1) {
+                    return;
+                }
+                else {
+                    this.mValue = undefined;
+                }
+            }
+        }
+        finally {
+            this.app.callLater(() => {
+                this.isUpdating = false;
+            });
+        }
+        // this.selectDefault();
+    }
+    set allowSelectFirst(b) {
+        b = b ? b !== "false" : b;
+        this.mAllowSelectFirst = b;
+    }
+    set filter(f) {
+        if (f === this.mFilter) {
+            return;
+        }
+        this.mFilter = f;
+        // this.mFilteredItems = null;
+        AtomBinder_js_1.AtomBinder.refreshValue(this, "filter");
+    }
+    onScroll() {
+        if (this.scrollTimeout) {
+            clearTimeout(this.scrollTimeout);
+        }
+        this.scrollTimeout = setTimeout(() => {
+            this.scrollTimeout = 0;
+            this.onVirtualCollectionChanged();
+        }, 10);
+    }
+    toggleSelection(data) {
+        this.mOnUIChanged = true;
+        this.mValue = undefined;
+        if (this.allowMultipleSelection) {
+            if (this.mSelectedItems.indexOf(data) !== -1) {
+                AtomBinder_js_1.AtomBinder.removeItem(this.mSelectedItems, data);
+            }
+            else {
+                AtomBinder_js_1.AtomBinder.addItem(this.mSelectedItems, data);
+            }
+        }
+        else {
+            this.mSelectedItems.length = 1;
+            this.mSelectedItems[0] = data;
+            AtomBinder_js_1.AtomBinder.refreshItems(this.mSelectedItems);
+        }
+        this.mOnUIChanged = false;
+    }
+    validateScroller() {
+        if (this.mScrollerSetup) {
+            return;
+        }
+        const ip = this.itemsPresenter;
+        const e = this.element;
+        let vc = this.mVirtualContainer;
+        if (!vc) {
+            if (ip === e && !/table/i.test(e.nodeName)) {
+                throw new Error("virtualContainer presenter not found,"
+                    + "you must put itemsPresenter inside a virtualContainer in order for Virtualization to work");
+            }
+            else {
+                vc = this.mVirtualContainer = this.element;
+            }
+        }
+        vc.style.overflow = "auto";
+        this.bindEvent(vc, "scroll", () => {
+            this.onScroll();
+        });
+        ip.style.overflow = "hidden";
+        // this.validateScroller = null;
+        const isTable = /tbody/i.test(ip.nodeName);
+        let fc;
+        let lc;
+        if (isTable) {
+            fc = document.createElement("TR");
+            lc = document.createElement("TR");
+        }
+        else {
+            fc = document.createElement("DIV");
+            lc = document.createElement("DIV");
+        }
+        fc.classList.add("sticky");
+        fc.classList.add("first-child");
+        lc.classList.add("sticky");
+        lc.classList.add("last-child");
+        fc.style.position = "relative";
+        fc.style.height = "0";
+        fc.style.width = "100%";
+        fc.style.clear = "both";
+        lc.style.position = "relative";
+        lc.style.height = "0";
+        lc.style.width = "100%";
+        lc.style.clear = "both";
+        this.mFirstChild = fc;
+        this.mLastChild = lc;
+        ip.appendChild(fc);
+        ip.appendChild(lc);
+        // let us train ourselves to find average height/width
+        this.mTraining = true;
+        this.mScrollerSetup = true;
+    }
+    createChild(df, data) {
+        const t = this.itemTemplate;
+        const ac = this.app.resolve(t, true);
+        const e = ac.element;
+        e._logicalParent = this.element;
+        e._templateParent = this;
+        if (df) {
+            df.appendChild(ac.element);
+        }
+        ac.data = data;
+        this.element.dispatchEvent(new CustomEvent("item-created", {
+            bubbles: false,
+            cancelable: false,
+            detail: data
+        }));
+        return ac;
+    }
+    disposeChildren(e) {
+        // const en = new ChildEnumerator(e);
+        for (let iterator of AtomUI_js_1.ChildEnumerator.enumerate(e)) {
+            // const iterator = en.current;
+            const ac = iterator.atomControl;
+            if (ac) {
+                ac.dispose();
+            }
+        }
+        e.innerHTML = "";
+    }
+}
+exports.AtomItemsControl = AtomItemsControl;
+/** Item Template for displaying individual items */
+AtomItemsControl.itemTemplate = XNode_js_1.default.prepare("itemTemplate", true, true);
+class AtomItemsControlItemTemplate extends AtomControl_js_1.AtomControl {
+    create() {
+        this.runAfterInit(() => {
+            const tp = this.element._templateParent;
+            this.element.textContent = this.data[tp.valuePath];
+        });
+    }
+}
+//# sourceMappingURL=AtomItemsControl.js.map