@web-atoms/web-controls 2.3.0 → 2.3.2

package/dist/basic/AtomRepeater.js

@@ -1,1117 +1,2 @@
-System.register(["@web-atoms/core/dist/core/AtomBinder", "@web-atoms/core/dist/core/Bind", "@web-atoms/core/dist/core/BindableProperty", "@web-atoms/core/dist/core/Colors", "@web-atoms/core/dist/core/StringHelper", "@web-atoms/core/dist/core/WatchProperty", "@web-atoms/core/dist/core/XNode", "@web-atoms/core/dist/style/StyleRule", "@web-atoms/core/dist/web/controls/AtomControl", "@web-atoms/core/dist/web/services/PopupService", "@web-atoms/core/dist/web/styles/CSS", "./InlinePopup"], function (_export, _context) {
-  "use strict";
-
-  var AtomBinder, Bind, BindableProperty, Colors, StringHelper, WatchProperty, XNode, StyleRule, AtomControl, PopupWindow, CSS, InlinePopup, SelectAllControl, AtomRepeater, __decorate, __metadata, __rest, popupCSS, getParentRepeaterItem, MatchTrue, MatchFalse, ArrowToString, MatchCaseInsensitive, MatchAnyCaseInsensitive, SameObjectValue, maxHeight, getFirstChild, hoverItem, dragOver;
-  function askSuggestion(items, itemRenderer, match, options) {
-    class Suggestions extends PopupWindow {
-      create() {
-        var _a;
-        this.title = (_a = options === null || options === void 0 ? void 0 : options.title) !== null && _a !== void 0 ? _a : "Select";
-        this.render(XNode.create("div", {
-          class: popupCSS
-        }, XNode.create("input", {
-          type: "search",
-          value: Bind.twoWaysImmediate(() => this.search),
-          autofocus: true
-        }), XNode.create("div", {
-          class: "items"
-        }, XNode.create(AtomRepeater, {
-          class: "presenter",
-          itemRenderer: itemRenderer,
-          visibilityFilter: Bind.oneWay(() => match(this.search)),
-          eventItemClick: e => {
-            this.close(e.detail);
-          },
-          items: items
-        }))));
-      }
-    }
-    __decorate([BindableProperty, __metadata("design:type", String)], Suggestions.prototype, "search", void 0);
-    options !== null && options !== void 0 ? options : options = {};
-    if (typeof options.maximize === "undefined") {
-      if (typeof options.width === "undefined") {
-        options.maxWidth = "90%";
-        options.minWidth = "300px";
-      }
-      if (typeof options.height === "undefined") {
-        options.height = "80%";
-      }
-    }
-    return Suggestions.showModal(options);
-  }
-  function askSuggestionPopup(opener, items, itemRenderer, match, selectedItem) {
-    const updateSearch = ("search" in opener);
-    const itemsInOpener = ("items" in opener);
-    class Suggestions extends InlinePopup {
-      get items() {
-        return itemsInOpener ? this.opener.items : items;
-      }
-      onPropertyChanged(name) {
-        if (updateSearch && name === "search") {
-          opener.search = this.search;
-        }
-        super.onPropertyChanged(name);
-      }
-      create() {
-        this.anchorItem = selectedItem;
-        this.opener = opener;
-        if (this.opener.search) {
-          this.search = this.opener.search;
-        }
-        if (selectedItem) {
-          this.anchorIndex = items.indexOf(selectedItem);
-        }
-        const disableSearch = opener.disableSearch;
-        if (itemsInOpener) {
-          this.render(XNode.create("div", {
-            "data-suggestion-popup": "suggestion-popup"
-          }, !disableSearch && XNode.create("input", {
-            type: "search",
-            value: Bind.twoWaysImmediate(() => this.search),
-            eventKeydown: e => this.onKey(e),
-            autofocus: true
-          }), XNode.create("div", {
-            class: "items"
-          }, XNode.create(AtomRepeater, {
-            class: "presenter",
-            selectedItem: Bind.oneWay(() => this.anchorItem),
-            itemRenderer: itemRenderer,
-            visibilityFilter: Bind.oneWay(() => match(this.search)),
-            eventItemClick: e => {
-              this.anchorItem = e.detail;
-              setTimeout(() => this.close(e.detail), 100);
-            },
-            items: Bind.oneWay(() => this.opener.items)
-          }))));
-          return;
-        }
-        this.render(XNode.create("div", {
-          "data-suggestion-popup": "suggestion-popup"
-        }, !disableSearch && XNode.create("input", {
-          type: "search",
-          value: Bind.twoWaysImmediate(() => this.search),
-          eventKeydown: e => this.onKey(e),
-          autofocus: true
-        }), XNode.create("div", {
-          class: "items"
-        }, XNode.create(AtomRepeater, {
-          class: "presenter",
-          selectedItem: Bind.oneWay(() => this.anchorItem),
-          itemRenderer: itemRenderer,
-          visibilityFilter: Bind.oneWay(() => match(this.search)),
-          scrollToSelection: true,
-          eventItemClick: e => {
-            this.close(e.detail);
-          },
-          items: items
-        }))));
-      }
-      onKey(e) {
-        var _a;
-        const suggested = match ? (_a = this.items) === null || _a === void 0 ? void 0 : _a.filter(match(this.search)) : this.items;
-        switch (e.key) {
-          case "Enter":
-            const anchorItem = this.anchorItem;
-            if (!anchorItem) {
-              return;
-            }
-            this.anchorIndex = 0;
-            this.close(anchorItem);
-            this.anchorItem = null;
-            this.search = "";
-            break;
-          case "ArrowDown":
-            if (suggested) {
-              if (!this.anchorItem) {
-                this.anchorIndex = 0;
-              } else {
-                if (this.anchorIndex < suggested.length - 1) {
-                  this.anchorIndex++;
-                }
-              }
-              this.anchorItem = suggested[this.anchorIndex];
-            }
-            break;
-          case "ArrowUp":
-            if (suggested) {
-              if (!this.anchorItem) {
-                return;
-              }
-              if (this.anchorIndex) {
-                this.anchorIndex--;
-              }
-              this.anchorItem = suggested[this.anchorIndex];
-            }
-            break;
-        }
-      }
-    }
-    __decorate([BindableProperty, __metadata("design:type", String)], Suggestions.prototype, "search", void 0);
-    return Suggestions.showControl(opener);
-  }
-  function SelectorCheckBox(_a, ...nodes) {
-    var {
-        text,
-        icon = "far fa-square",
-        iconSelected = "fas fa-check-square"
-      } = _a,
-      a = __rest(_a, ["text", "icon", "iconSelected"]);
-    if (text) {
-      return XNode.create("label", null, XNode.create("i", {
-        class: icon,
-        "data-click-event": "item-select"
-      }), XNode.create("i", {
-        class: iconSelected,
-        "data-click-event": "item-deselect"
-      }), XNode.create("span", {
-        "data-no-wrap": "true",
-        text: text
-      }), ...nodes);
-    }
-    return XNode.create("label", null, XNode.create("i", {
-      class: icon,
-      "data-click-event": "item-select"
-    }), XNode.create("i", {
-      class: iconSelected,
-      "data-click-event": "item-deselect"
-    }), ...nodes);
-  }
-  function SelectAll(_a, ...nodes) {
-    var {
-        text = "Select All",
-        icon = "far fa-square",
-        iconSelected = "fas fa-check-square"
-      } = _a,
-      a = __rest(_a, ["text", "icon", "iconSelected"]);
-    if (text) {
-      return XNode.create(SelectAllControl, Object.assign({
-        for: "label"
-      }, a), XNode.create("i", {
-        class: icon,
-        "data-ui-type": "item-select"
-      }), XNode.create("i", {
-        class: iconSelected,
-        "data-ui-type": "item-deselect"
-      }), XNode.create("span", {
-        "data-no-wrap": "true",
-        text: text
-      }));
-    }
-    return XNode.create(SelectAllControl, Object.assign({
-      for: "label"
-    }, a), XNode.create("i", {
-      class: icon,
-      "data-ui-type": "item-select"
-    }), XNode.create("i", {
-      class: iconSelected,
-      "data-ui-type": "item-deselect"
-    }), ...nodes);
-  }
-  function disposeChildren(owner, e) {
-    if (!e) {
-      return;
-    }
-    let s = e.firstElementChild;
-    while (s) {
-      const c = s;
-      s = s.nextElementSibling;
-      const ac = c.atomControl;
-      if (ac) {
-        ac.dispose();
-        continue;
-      }
-      disposeChildren(owner, c);
-      owner.unbind(c);
-      owner.unbindEvent(c);
-    }
-    e.innerHTML = "";
-  }
-  function disposeChild(owner, e) {
-    const ac = e.atomControl;
-    if (ac) {
-      ac.dispose();
-      return;
-    }
-    disposeChildren(owner, e);
-    owner.unbind(e);
-    owner.unbindEvent(e);
-    e.remove();
-  }
-  function defaultComparer(left, right) {
-    if (left && right) {
-      if (left instanceof Date) {
-        if (right instanceof Date) {
-          return left.getTime() === right.getTime();
-        }
-        return false;
-      }
-    }
-    return left === right;
-  }
-  function updateDragDrop(e, force = false) {
-    if (!e) {
-      return;
-    }
-    if (force) {
-      e.draggable = false;
-    } else {
-      force = e.draggable;
-    }
-    e = e.firstElementChild;
-    while (e) {
-      updateDragDrop(e, force);
-      e = e.nextElementSibling;
-    }
-  }
-  _export({
-    askSuggestion: askSuggestion,
-    askSuggestionPopup: askSuggestionPopup,
-    SelectorCheckBox: SelectorCheckBox,
-    SelectAll: SelectAll,
-    disposeChildren: disposeChildren,
-    disposeChild: disposeChild,
-    defaultComparer: defaultComparer,
-    default: void 0
-  });
-  return {
-    setters: [function (_webAtomsCoreDistCoreAtomBinder) {
-      AtomBinder = _webAtomsCoreDistCoreAtomBinder.AtomBinder;
-    }, function (_webAtomsCoreDistCoreBind) {
-      Bind = _webAtomsCoreDistCoreBind.default;
-    }, function (_webAtomsCoreDistCoreBindableProperty) {
-      BindableProperty = _webAtomsCoreDistCoreBindableProperty.BindableProperty;
-    }, function (_webAtomsCoreDistCoreColors) {
-      Colors = _webAtomsCoreDistCoreColors.default;
-    }, function (_webAtomsCoreDistCoreStringHelper) {
-      StringHelper = _webAtomsCoreDistCoreStringHelper.StringHelper;
-    }, function (_webAtomsCoreDistCoreWatchProperty) {
-      WatchProperty = _webAtomsCoreDistCoreWatchProperty.default;
-    }, function (_webAtomsCoreDistCoreXNode) {
-      XNode = _webAtomsCoreDistCoreXNode.default;
-    }, function (_webAtomsCoreDistStyleStyleRule) {
-      StyleRule = _webAtomsCoreDistStyleStyleRule.default;
-    }, function (_webAtomsCoreDistWebControlsAtomControl) {
-      AtomControl = _webAtomsCoreDistWebControlsAtomControl.AtomControl;
-    }, function (_webAtomsCoreDistWebServicesPopupService) {
-      PopupWindow = _webAtomsCoreDistWebServicesPopupService.PopupWindow;
-    }, function (_webAtomsCoreDistWebStylesCSS) {
-      CSS = _webAtomsCoreDistWebStylesCSS.default;
-    }, function (_InlinePopup) {
-      InlinePopup = _InlinePopup.default;
-    }],
-    execute: function () {
-      __decorate = void 0 && (void 0).__decorate || function (decorators, target, key, desc) {
-        var c = arguments.length,
-          r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
-          d;
-        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-        return c > 3 && r && Object.defineProperty(target, key, r), r;
-      };
-      __metadata = void 0 && (void 0).__metadata || function (k, v) {
-        if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-      };
-      __rest = void 0 && (void 0).__rest || function (s, e) {
-        var t = {};
-        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-        if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-          if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
-        }
-        return t;
-      };
-      CSS(StyleRule().display("none"), "[data-ui-display=none]");
-      popupCSS = CSS(StyleRule().minWidth(200).verticalFlexLayout({
-        alignItems: "stretch"
-      }).child(StyleRule(".items").flexStretch().overflow("auto").child(StyleRule(".presenter").child(StyleRule("*").padding(5)).child(StyleRule("[data-selected-item=true]").backgroundColor(Colors.lightGreen)))));
-      _export("getParentRepeaterItem", getParentRepeaterItem = target => {
-        let eventName;
-        let repeater;
-        let index;
-        let root;
-        while (target) {
-          const a = target.atomControl;
-          if (a !== undefined && a instanceof AtomRepeater) {
-            repeater = a;
-            break;
-          }
-          if (index === undefined) {
-            const itemIndex = target.dataset.itemIndex;
-            if (typeof itemIndex !== "undefined") {
-              root = target;
-              index = ~~itemIndex;
-            }
-          }
-          if (eventName === undefined) {
-            const itemClickEvent = target.dataset.clickEvent;
-            if (itemClickEvent) {
-              eventName = itemClickEvent.replace(/-([a-z])/g, g => g[1].toUpperCase());
-            }
-          }
-          target = target.parentElement;
-        }
-        if (index === void 0 || repeater === void 0) {
-          return undefined;
-        }
-        const item = repeater.items[~~index];
-        return [eventName, repeater, item, index, root];
-      });
-      _export("MatchTrue", MatchTrue = (...a) => true);
-      _export("MatchFalse", MatchFalse = (...a) => false);
-      _export("ArrowToString", ArrowToString = item => {
-        var _a, _b;
-        return (_b = (_a = item.label) === null || _a === void 0 ? void 0 : _a.toString()) !== null && _b !== void 0 ? _b : item.toString();
-      });
-      _export("MatchCaseInsensitive", MatchCaseInsensitive = (textField = ArrowToString) => {
-        return s => {
-          if (!s) {
-            return MatchTrue;
-          }
-          const r = StringHelper.createContainsRegExp(s);
-          return item => r.test(textField(item));
-        };
-      });
-      _export("MatchAnyCaseInsensitive", MatchAnyCaseInsensitive = (textField = ArrowToString) => {
-        return s => {
-          if (!s) {
-            return MatchTrue;
-          }
-          const r = StringHelper.createContainsAnyWordRegExp(s);
-          return item => r.test(textField(item));
-        };
-      });
-      _export("SameObjectValue", SameObjectValue = item => item);
-      maxHeight = window.screen.availHeight / 2 > 250 ? StyleRule().height("250px") : StyleRule().maxHeight(80);
-      CSS(StyleRule().merge(maxHeight).minWidth(80).verticalFlexLayout({
-        alignItems: "stretch"
-      }).child(StyleRule(".items").flexStretch().overflow("auto").child(StyleRule(".presenter").child(StyleRule("*").padding(5)).child(StyleRule("[data-selected-item=true]").backgroundColor(Colors.lightGreen)))), "*[data-suggestion-popup=suggestion-popup]");
-      CSS(StyleRule().nested(StyleRule("i[data-click-event]").padding(5)).nested(StyleRule("[data-no-wrap=true]").whiteSpace("nowrap")), "*[data-selected-item]");
-      CSS(StyleRule().nested(StyleRule("i[data-click-event=item-select]").padding(5)).displayNone(" i[data-click-event=item-select]"), "*[data-selected-item=true]");
-      CSS(StyleRule().displayNone(" i[data-click-event=item-deselect]"), "*[data-selected-item=false]");
-      CSS(StyleRule().flexLayout({
-        alignItems: "center",
-        justifyContent: "flex-start"
-      }).margin(0).nested(StyleRule("i[data-ui-type]").padding(5)).nested(StyleRule("[data-no-wrap=true]").whiteSpace("nowrap")).displayNone("[data-is-selected=true] i[data-ui-type=item-select]").displayNone("[data-is-selected=false] i[data-ui-type=item-deselect]"), "*[data-select-all=select-all]");
-      SelectAllControl = class SelectAllControl extends AtomControl {
-        preCreate() {
-          this.element.dataset.selectAll = "select-all";
-          this.items = [];
-          this.selectedItems = [];
-          this.render(XNode.create(SelectAllControl, {
-            "data-is-selected": Bind.oneWay(() => this.items.length > 0 && this.items.length === this.selectedItems.length, false)
-          }));
-          this.bindEvent(this.element, "click", () => {
-            const si = this.selectedItems;
-            const items = this.items;
-            if (!si) {
-              return;
-            }
-            if (!items) {
-              return;
-            }
-            if (items.length === 0) {
-              return;
-            }
-            if (items.length === si.length) {
-              si.clear();
-            } else {
-              si.length = 0;
-              si.push(...items);
-              si.refresh();
-            }
-          });
-        }
-      };
-      __decorate([BindableProperty, __metadata("design:type", Array)], SelectAllControl.prototype, "items", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Array)], SelectAllControl.prototype, "selectedItems", void 0);
-      getFirstChild = container => {
-        let child = container.firstElementChild;
-        while (child && child.dataset.itemIndex === void 0) {
-          child = child.nextElementSibling;
-        }
-        return child;
-      };
-      _export("default", AtomRepeater = class AtomRepeater extends AtomControl {
-        constructor() {
-          super(...arguments);
-          this.bubbleEvents = true;
-        }
-        static from(element) {
-          while (element) {
-            const {
-              atomControl
-            } = element;
-            if (atomControl instanceof AtomRepeater) {
-              return atomControl;
-            }
-            element = element.parentElement;
-          }
-        }
-        set refreshEventScope(v) {
-          this.registerDisposable(v.listen(ce => {
-            this.refreshItem(ce.detail);
-          }));
-        }
-        get allSelected() {
-          const selectedItems = this.selectedItems;
-          const items = this.items;
-          if (!(items && selectedItems)) {
-            return false;
-          }
-          return items.length && items.length === selectedItems.length;
-        }
-        get value() {
-          var _a;
-          if (this.initialValue !== undefined) {
-            return this.initialValue;
-          }
-          const sp = this.selectedItem;
-          if (sp === undefined) {
-            return sp;
-          }
-          const vp = (_a = this.valuePath) !== null && _a !== void 0 ? _a : SameObjectValue;
-          return vp(sp);
-        }
-        set value(v) {
-          var _a, _b;
-          this.initialValue = v;
-          if (!this.items || !this.items.length) {
-            AtomBinder.refreshValue(this, "value");
-            return;
-          }
-          const vp = (_a = this.valuePath) !== null && _a !== void 0 ? _a : SameObjectValue;
-          const c = (_b = this.comparer) !== null && _b !== void 0 ? _b : defaultComparer;
-          const selectedItem = this.items.find(item => c(vp(item), v));
-          this.selectedItem = selectedItem;
-          delete this.initialValue;
-        }
-        get selectedItem() {
-          var _a;
-          return (_a = this.selectedItems) === null || _a === void 0 ? void 0 : _a[0];
-        }
-        set selectedItem(value) {
-          var _a;
-          const si = (_a = this.selectedItems) !== null && _a !== void 0 ? _a : this.selectedItems = [];
-          const first = si[0];
-          if (value === first) {
-            return;
-          }
-          si.set(0, value);
-        }
-        onPropertyChanged(name) {
-          var _a, _b;
-          switch (name) {
-            case "items":
-              (_a = this.itemsDisposable) === null || _a === void 0 ? void 0 : _a.dispose();
-              const items = this.items;
-              const d = items === null || items === void 0 ? void 0 : items.watch((target, type, index, item) => {
-                switch (type) {
-                  case "add":
-                  case "remove":
-                  case "set":
-                    this.updatePartial(type, index, item);
-                    break;
-                  default:
-                    this.updateItems();
-                    break;
-                }
-                this.dispatchCustomEvent("items-updated", {
-                  type,
-                  items,
-                  index
-                });
-                AtomBinder.refreshValue(this, "selectedItem");
-                AtomBinder.refreshValue(this, "value");
-              });
-              if (d) {
-                this.itemsDisposable = this.registerDisposable(d);
-              }
-              const iv = this.initialValue;
-              if (iv) {
-                this.value = iv;
-              }
-              this.updateItems();
-              this.dispatchCustomEvent("items-updated", {
-                type: "reset",
-                items,
-                index: 0
-              });
-              if (this.scrollToSelection) {
-                this.bringSelectionIntoView();
-              }
-              break;
-            case "selectedItems":
-              (_b = this.selectedItemsDisposable) === null || _b === void 0 ? void 0 : _b.dispose();
-              const selectedItems = this.selectedItems;
-              const sd = selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.watch(() => {
-                this.updateClasses();
-                if (this.scrollToSelection) {
-                  this.bringSelectionIntoView();
-                }
-                if (this.selectedItem) {
-                  delete this.initialValue;
-                }
-                AtomBinder.refreshValue(this, "selectedItem");
-                AtomBinder.refreshValue(this, "value");
-                AtomBinder.refreshValue(this, "allSelected");
-                this.dispatchCustomEvent("selection-updated", selectedItems);
-              });
-              if (sd) {
-                this.selectedItemsDisposable = this.registerDisposable(sd);
-              }
-              this.updateClasses();
-              this.dispatchCustomEvent("selection-updated", selectedItems);
-              AtomBinder.refreshValue(this, "allSelected");
-              break;
-            case "itemRenderer":
-            case "watch":
-              this.updateItems();
-              break;
-            case "visibilityFilter":
-              this.updateVisibility();
-              break;
-            case "header":
-            case "headerRenderer":
-              this.updateHeaderFooter("header", this.headerPresenter, this.header, this.headerRenderer, true);
-              break;
-            case "footer":
-            case "footerRenderer":
-              this.updateHeaderFooter("footer", this.footerPresenter, this.footer, this.footerRenderer);
-              break;
-          }
-        }
-        bringSelectionIntoView(force) {
-          if (force) {
-            const selection = this.selectedItem;
-            if (selection) {
-              const element = this.elementForItem(selection);
-              element === null || element === void 0 ? void 0 : element.scrollIntoView();
-            }
-            return;
-          }
-          if (this.bringIntoViewId) {
-            clearTimeout(this.bringIntoViewId);
-          }
-          this.bringIntoViewId = setTimeout(() => {
-            clearTimeout(this.bringIntoViewId);
-            this.bringIntoViewId = undefined;
-            this.bringSelectionIntoView(true);
-          }, 100);
-        }
-        forEach(action, container) {
-          var _a;
-          container !== null && container !== void 0 ? container : container = (_a = this.itemsPresenter) !== null && _a !== void 0 ? _a : this.element;
-          const items = this.items;
-          let start = getFirstChild(container);
-          while (start) {
-            const index = start.dataset.itemIndex;
-            const item = items[~~index];
-            action(item, start);
-            start = start.nextElementSibling;
-          }
-        }
-        *any(fx, itemSelector, container) {
-          var _a;
-          container !== null && container !== void 0 ? container : container = (_a = this.itemsPresenter) !== null && _a !== void 0 ? _a : this.element;
-          const items = this.items;
-          let node = getFirstChild(container);
-          while (node) {
-            const index = node.dataset.itemIndex;
-            const item = items[~~index];
-            let element = node;
-            if (itemSelector) {
-              element = element.querySelector(itemSelector);
-            }
-            const ie = {
-              item,
-              element
-            };
-            if (fx) {
-              if (fx(item)) {
-                yield ie;
-              }
-              continue;
-            }
-            yield ie;
-            node = node.nextElementSibling;
-          }
-        }
-        *all(container) {
-          var _a;
-          container !== null && container !== void 0 ? container : container = (_a = this.itemsPresenter) !== null && _a !== void 0 ? _a : this.element;
-          const items = this.items;
-          let element = getFirstChild(container);
-          while (element) {
-            const index = element.dataset.itemIndex;
-            const item = items[~~index];
-            yield {
-              item,
-              element
-            };
-            element = element.nextElementSibling;
-          }
-        }
-        elementForItem(itemToFind, container) {
-          var _a;
-          container !== null && container !== void 0 ? container : container = (_a = this.itemsPresenter) !== null && _a !== void 0 ? _a : this.element;
-          const items = this.items;
-          let element = getFirstChild(container);
-          while (element) {
-            const index = element.dataset.itemIndex;
-            const item = items[~~index];
-            if (item === itemToFind) {
-              return element;
-            }
-            element = element.nextElementSibling;
-          }
-        }
-        refreshItem(item, fx, index = -1) {
-          if (index === -1) {
-            index = this.items.indexOf(item);
-          }
-          if (fx === null || fx === void 0 ? void 0 : fx.then) {
-            const finalize = () => {
-              this.refreshItem(item, undefined, index);
-            };
-            fx.then(finalize, finalize);
-            return;
-          }
-          this.updatePartial("set", index, item);
-        }
-        updatePartial(key, index, item, container) {
-          var _a, _b, _c, _d, _e, _f;
-          const items = this.items;
-          if (!items) {
-            return;
-          }
-          const ir = this.itemRenderer;
-          if (!ir) {
-            return;
-          }
-          container !== null && container !== void 0 ? container : container = (_a = this.itemsPresenter) !== null && _a !== void 0 ? _a : this.element;
-          let start = getFirstChild(container);
-          let ei;
-          while (start) {
-            ei = ~~start.dataset.itemIndex;
-            if (ei === index) {
-              break;
-            }
-            start = start.nextElementSibling;
-          }
-          if (key !== "add" && !start) {
-            return;
-          }
-          const vp = (_b = this.valuePath) !== null && _b !== void 0 ? _b : it => it;
-          const si = ((_c = this.selectedItems) !== null && _c !== void 0 ? _c : []).map(vp);
-          const isRemove = key === "remove";
-          if (isRemove || key === "set") {
-            const current = start;
-            start = start.nextElementSibling;
-            const ac = current.atomControl;
-            if (ac) {
-              ac.dispose();
-            } else {
-              this.unbind(current);
-              this.unbindEvent(current);
-            }
-            current.remove();
-          }
-          if (!isRemove) {
-            const en = ir(item, index, this);
-            const ea = (_d = en.attributes) !== null && _d !== void 0 ? _d : en.attributes = {};
-            const v = vp(item);
-            const e = document.createElement((_f = (_e = ea.for) !== null && _e !== void 0 ? _e : en.name) !== null && _f !== void 0 ? _f : "div");
-            e.dataset.itemIndex = (index++).toString();
-            e.dataset.selectedItem = si.indexOf(v) !== -1 ? "true" : "false";
-            if (this.enableDragDrop) {
-              updateDragDrop(e);
-            }
-            if (start) {
-              container.insertBefore(e, start);
-            } else {
-              container.appendChild(e);
-            }
-            this.render(en, e, this);
-          }
-          while (start) {
-            const ci = items[index];
-            const cv = vp(ci);
-            start.dataset.itemIndex = (index++).toString();
-            start.dataset.selectedItem = si.indexOf(cv) !== -1 ? "true" : "false";
-            start = start.nextElementSibling;
-          }
-          this.onPropertyChanged("footer");
-        }
-        updateItems(container, force) {
-          var _a, _b, _c, _d, _e, _f;
-          if (this.deferUpdates && !force) {
-            if (this.deferredUpdateId) {
-              return;
-            }
-            this.deferredUpdateId = setTimeout(() => {
-              this.deferredUpdateId = 0;
-              this.updateItems(container, true);
-            }, 1);
-            return;
-          }
-          container !== null && container !== void 0 ? container : container = (_a = this.itemsPresenter) !== null && _a !== void 0 ? _a : this.element;
-          if (!container) {
-            return;
-          }
-          disposeChildren(this, container);
-          this.onPropertyChanged("header");
-          const ir = this.itemRenderer;
-          if (!ir) {
-            this.onPropertyChanged("footer");
-            return;
-          }
-          const items = this.items;
-          if (!items) {
-            this.onPropertyChanged("footer");
-            return;
-          }
-          const vp = (_b = this.valuePath) !== null && _b !== void 0 ? _b : it => it;
-          const si = ((_c = this.selectedItems) !== null && _c !== void 0 ? _c : []).map(vp);
-          let i = 0;
-          for (const iterator of items) {
-            const index = i++;
-            const e = ir(iterator, index, this);
-            const ea = (_d = e.attributes) !== null && _d !== void 0 ? _d : e.attributes = {};
-            const v = vp(iterator);
-            const element = document.createElement((_f = (_e = ea.for) !== null && _e !== void 0 ? _e : e.name) !== null && _f !== void 0 ? _f : "div");
-            element.dataset.itemIndex = index.toString();
-            element.dataset.selectedItem = si.indexOf(v) !== -1 ? "true" : "false";
-            this.render(e, element, this);
-            if (this.enableDragDrop) {
-              updateDragDrop(element);
-            }
-            container.appendChild(element);
-          }
-          this.onPropertyChanged("footer");
-        }
-        preCreate() {
-          this.element.setAttribute("data-click-event", "item-click");
-        }
-        dispatchCustomEvent(type, detail) {
-          var _a;
-          type = StringHelper.fromHyphenToCamel(type);
-          (_a = this.element) === null || _a === void 0 ? void 0 : _a.dispatchEvent(new CustomEvent(type, {
-            detail,
-            bubbles: false,
-            cancelable: true
-          }));
-        }
-        updateClasses() {
-          var _a, _b, _c;
-          const container = (_a = this.itemsPresenter) !== null && _a !== void 0 ? _a : this.element;
-          const items = this.items;
-          let element = getFirstChild(container);
-          const vp = (_b = this.valuePath) !== null && _b !== void 0 ? _b : i => i;
-          const si = ((_c = this.selectedItems) !== null && _c !== void 0 ? _c : []).map(vp);
-          while (element) {
-            const index = ~~element.dataset.itemIndex;
-            const item = items[index];
-            const v = vp(item);
-            element.dataset.selectedItem = si.indexOf(v) !== -1 ? "true" : "false";
-            element = element.nextElementSibling;
-          }
-        }
-        updateVisibility() {
-          var _a, _b;
-          const container = (_a = this.itemsPresenter) !== null && _a !== void 0 ? _a : this.element;
-          const items = this.items;
-          let element = container.firstElementChild;
-          const vf = (_b = this.visibilityFilter) !== null && _b !== void 0 ? _b : MatchTrue;
-          while (element) {
-            const index = ~~element.dataset.itemIndex;
-            const item = items[index];
-            if (vf(item)) {
-              element.removeAttribute("data-ui-display");
-            } else {
-              element.dataset.uiDisplay = "none";
-            }
-            element = element.nextElementSibling;
-          }
-        }
-        updateHeaderFooter(name, presenter, item, itemRenderer, insert) {
-          var _a, _b, _c, _d;
-          presenter !== null && presenter !== void 0 ? presenter : presenter = (_a = this.itemsPresenter) !== null && _a !== void 0 ? _a : this.itemsPresenter = this.element;
-          if (!presenter) {
-            return;
-          }
-          let current;
-          if (insert) {
-            current = presenter.firstElementChild;
-            while (current && current.dataset[name] !== name) {
-              current = current.nextElementSibling;
-            }
-          } else {
-            current = presenter.lastElementChild;
-            while (current && current.dataset[name] !== name) {
-              current = current.previousElementSibling;
-            }
-          }
-          if (current) {
-            disposeChild(this, current);
-          }
-          if (!(item && itemRenderer)) {
-            return;
-          }
-          const node = itemRenderer(item);
-          const element = document.createElement((_d = (_c = (_b = node.attributes) === null || _b === void 0 ? void 0 : _b.for) !== null && _c !== void 0 ? _c : node.name) !== null && _d !== void 0 ? _d : "div");
-          element.dataset[name] = name;
-          this.render(node, element, this);
-          if (insert) {
-            presenter.insertBefore(element, presenter.firstElementChild);
-          } else {
-            presenter.appendChild(element);
-          }
-        }
-        dispatchHeaderFooterEvent(eventName, type, originalTarget) {
-          const detail = this[type];
-          const ce = new CustomEvent(eventName !== null && eventName !== void 0 ? eventName : `${type}Click`, {
-            detail,
-            bubbles: this.bubbleEvents,
-            cancelable: true
-          });
-          originalTarget.dispatchEvent(ce);
-          if (!ce.defaultPrevented) {
-            this.onPropertyChanged(type);
-          }
-        }
-        dispatchItemEvent(eventName, item, recreate, originalTarget, nestedItem) {
-          const ce = new CustomEvent(eventName !== null && eventName !== void 0 ? eventName : "itemClick", {
-            detail: nestedItem !== null && nestedItem !== void 0 ? nestedItem : item,
-            bubbles: this.bubbleEvents,
-            cancelable: true
-          });
-          originalTarget.dispatchEvent(ce);
-          if (recreate && ce.executed && !ce.defaultPrevented) {
-            this.refreshItem(item, ce.promise);
-          }
-        }
-        dispatchClickEvent(e, data) {
-          var _a;
-          let {
-            clickEvent = "itemClick",
-            recreate,
-            header,
-            footer,
-            itemIndex,
-            itemPath
-          } = data;
-          clickEvent = clickEvent.replace(/-([a-z])/g, g => g[1].toUpperCase());
-          if (header) {
-            this.dispatchHeaderFooterEvent(clickEvent, header, e.target);
-            return;
-          }
-          if (footer) {
-            this.dispatchHeaderFooterEvent(clickEvent, header, e.target);
-            return;
-          }
-          if (itemIndex === void 0 || itemIndex === null) {
-            return;
-          }
-          let index = ~~itemIndex;
-          const item = this.items[index];
-          if (clickEvent === "itemSelect" || clickEvent === "itemDeselect") {
-            const si = (_a = this.selectedItems) !== null && _a !== void 0 ? _a : this.selectedItems = [];
-            if (si) {
-              index = si.indexOf(item);
-              if (index === -1) {
-                if (this.allowMultipleSelection) {
-                  si.add(item);
-                } else {
-                  si.set(0, item);
-                }
-              } else {
-                si.removeAt(index);
-              }
-            }
-          }
-          if (item) {
-            if (itemPath) {
-              if (/^[\{\"}]/.test(itemPath)) {
-                this.dispatchItemEvent(clickEvent, item, recreate, e.target, JSON.parse(itemPath));
-                return;
-              }
-              let nestedItem = {};
-              const all = itemPath.split(",");
-              for (const iterator of all) {
-                let [name, paths] = iterator.split(/\=|\:/);
-                if (paths === void 0) {
-                  if (all.length > 1) {
-                    throw new Error("Invalid path, please use name=path format");
-                  }
-                  paths = name;
-                }
-                let start = item;
-                for (const path of paths.split(".")) {
-                  if (path === "$") {
-                    start = item;
-                    continue;
-                  }
-                  start = start[path];
-                }
-                if (all.length === 1) {
-                  nestedItem = start;
-                  break;
-                }
-                nestedItem[name] = start;
-              }
-              this.dispatchItemEvent(clickEvent, item, recreate, e.target, nestedItem);
-              return;
-            }
-            this.dispatchItemEvent(clickEvent, item, recreate, e.target);
-          }
-        }
-      });
-      __decorate([BindableProperty, __metadata("design:type", Boolean)], AtomRepeater.prototype, "allowMultipleSelection", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Array)], AtomRepeater.prototype, "selectedItems", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Object)], AtomRepeater.prototype, "itemsPresenter", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Array)], AtomRepeater.prototype, "items", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Object)], AtomRepeater.prototype, "watch", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Function)], AtomRepeater.prototype, "visibilityFilter", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Function)], AtomRepeater.prototype, "enableFunc", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Function)], AtomRepeater.prototype, "itemRenderer", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Function)], AtomRepeater.prototype, "valuePath", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Function)], AtomRepeater.prototype, "comparer", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Boolean)], AtomRepeater.prototype, "deferUpdates", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Object)], AtomRepeater.prototype, "header", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Object)], AtomRepeater.prototype, "headerRenderer", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Object)], AtomRepeater.prototype, "footer", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Object)], AtomRepeater.prototype, "footerRenderer", void 0);
-      __decorate([BindableProperty, __metadata("design:type", Object)], AtomRepeater.prototype, "enableDragDrop", void 0);
-      __decorate([WatchProperty, __metadata("design:type", Object), __metadata("design:paramtypes", [])], AtomRepeater.prototype, "allSelected", null);
-      hoverItem = {
-        repeater: null,
-        target: null,
-        item: null,
-        placeholder: null
-      };
-      document.body.addEventListener("dragstart", e => {
-        const {
-          target
-        } = e;
-        if (target.draggable) {
-          const ri = getParentRepeaterItem(target);
-          if (!ri) {
-            return;
-          }
-          const [type, repeater, item, index] = ri;
-          if (!repeater || !repeater.enableDragDrop) {
-            return;
-          }
-          const placeholder = document.createElement("div");
-          placeholder.style.width = target.offsetWidth + "px";
-          placeholder.style.height = target.offsetHeight + "px";
-          placeholder.style.backgroundColor = Colors.lightGray.toString();
-          placeholder.style.border = "solid 1px gray";
-          placeholder.style.borderRadius = "10px";
-          hoverItem = {
-            repeater,
-            target,
-            item,
-            placeholder
-          };
-          e.dataTransfer.dropEffect = "move";
-          setTimeout(() => {
-            target.style.display = "none";
-            target.parentElement.insertBefore(placeholder, target);
-          }, 0);
-        }
-      });
-      document.body.addEventListener("dragend", e => {
-        var _a, _b;
-        if (!(hoverItem === null || hoverItem === void 0 ? void 0 : hoverItem.placeholder)) {
-          return;
-        }
-        const {
-          item,
-          placeholder,
-          repeater
-        } = hoverItem;
-        let start = placeholder;
-        let index = -1;
-        while (start) {
-          const itemIndex = (_b = (_a = start.previousElementSibling) === null || _a === void 0 ? void 0 : _a.dataset) === null || _b === void 0 ? void 0 : _b.itemIndex;
-          if (itemIndex !== void 0) {
-            index = ~~itemIndex;
-          }
-          if (start.parentElement.atomControl) {
-            break;
-          }
-          start = start.parentElement;
-        }
-        const targetRepeater = start.parentElement.atomControl;
-        placeholder.remove();
-        hoverItem.placeholder = null;
-        repeater.items.remove(item);
-        index++;
-        const ce = new CustomEvent("itemDropped", {
-          detail: {
-            item,
-            index
-          }
-        });
-        if (ce.defaultPrevented) {
-          return;
-        }
-        const {
-          detail
-        } = ce;
-        targetRepeater.items.insert(detail.index, detail.item);
-      });
-      dragOver = e => {
-        if (hoverItem) {
-          const {
-            placeholder
-          } = hoverItem;
-          if (e.target === placeholder) {
-            return;
-          }
-        }
-        const ri = getParentRepeaterItem(e.target);
-        if (!ri) {
-          return;
-        }
-        const [type, repeater, item, index, target] = ri;
-        if (!repeater) {
-          return;
-        }
-        if (hoverItem) {
-          const {
-            placeholder
-          } = hoverItem;
-          e.preventDefault();
-          const mp = {
-            x: e.clientX,
-            y: e.clientY
-          };
-          const isBefore = (co, n) => n.x <= co.x + co.width * 0.3 || n.y <= co.y + co.height * 0.3;
-          const isAfter = (co, n) => n.x >= co.x + co.width * 0.7 || n.y >= co.y + co.height * 0.7;
-          const targetBounds = target.getBoundingClientRect();
-          if (isAfter(targetBounds, mp)) {
-            const next = target.nextElementSibling;
-            if (next === placeholder) {
-              return;
-            }
-            placeholder.remove();
-            target.insertAdjacentElement("afterend", placeholder);
-            return;
-          }
-          if (isBefore(targetBounds, mp)) {
-            const previous = target.previousElementSibling;
-            if (previous === placeholder) {
-              return;
-            }
-            placeholder.remove();
-            target.insertAdjacentElement("beforebegin", placeholder);
-          }
-          return;
-        }
-      };
-      document.body.addEventListener("dragover", dragOver);
-      document.body.addEventListener("dragenter", dragOver);
-    }
-  };
-});
+System.register(["tslib","@web-atoms/core/dist/core/AtomBinder","@web-atoms/core/dist/core/Bind","@web-atoms/core/dist/core/BindableProperty","@web-atoms/core/dist/core/Colors","@web-atoms/core/dist/core/StringHelper","@web-atoms/core/dist/core/WatchProperty","@web-atoms/core/dist/core/XNode","@web-atoms/core/dist/style/StyleRule","@web-atoms/core/dist/web/controls/AtomControl","@web-atoms/core/dist/web/services/PopupService","@web-atoms/core/dist/web/styles/CSS","./InlinePopup"],function(_export,_context){"use strict";var __decorate,__metadata,__rest,AtomBinder,Bind,BindableProperty,Colors,StringHelper,WatchProperty,XNode,StyleRule,AtomControl,PopupWindow,CSS,InlinePopup,SelectAllControl,AtomRepeater,popupCSS,getParentRepeaterItem,MatchTrue,MatchFalse,ArrowToString,MatchCaseInsensitive,MatchAnyCaseInsensitive,SameObjectValue,maxHeight,getFirstChild,hoverItem,dragOver;function askSuggestion(items,itemRenderer,match,options){class Suggestions extends PopupWindow{create(){var _a;this.title=(_a=options===null||options===void 0?void 0:options.title)!==null&&_a!==void 0?_a:"Select";this.render(XNode.create("div",{class:popupCSS},XNode.create("input",{type:"search",value:Bind.twoWaysImmediate(()=>this.search),autofocus:true}),XNode.create("div",{class:"items"},XNode.create(AtomRepeater,{class:"presenter",itemRenderer:itemRenderer,visibilityFilter:Bind.oneWay(()=>match(this.search)),eventItemClick:e=>{this.close(e.detail);},items:items}))));}}__decorate([BindableProperty,__metadata("design:type",String)],Suggestions.prototype,"search",void 0);options!==null&&options!==void 0?options:options={};if(typeof options.maximize==="undefined"){if(typeof options.width==="undefined"){options.maxWidth="90%";options.minWidth="300px";}if(typeof options.height==="undefined"){options.height="80%";}}return Suggestions.showModal(options);}function askSuggestionPopup(opener,items,itemRenderer,match,selectedItem){const updateSearch=("search"in opener);const itemsInOpener=("items"in opener);class Suggestions extends InlinePopup{get items(){return itemsInOpener?this.opener.items:items;}onPropertyChanged(name){if(updateSearch&&name==="search"){opener.search=this.search;}super.onPropertyChanged(name);}create(){this.anchorItem=selectedItem;this.opener=opener;if(this.opener.search){this.search=this.opener.search;}if(selectedItem){this.anchorIndex=items.indexOf(selectedItem);}const disableSearch=opener.disableSearch;if(itemsInOpener){this.render(XNode.create("div",{"data-suggestion-popup":"suggestion-popup"},!disableSearch&&XNode.create("input",{type:"search",value:Bind.twoWaysImmediate(()=>this.search),eventKeydown:e=>this.onKey(e),autofocus:true}),XNode.create("div",{class:"items"},XNode.create(AtomRepeater,{class:"presenter",selectedItem:Bind.oneWay(()=>this.anchorItem),itemRenderer:itemRenderer,visibilityFilter:Bind.oneWay(()=>match(this.search)),eventItemClick:e=>{this.anchorItem=e.detail;setTimeout(()=>this.close(e.detail),100);},items:Bind.oneWay(()=>this.opener.items)}))));return;}this.render(XNode.create("div",{"data-suggestion-popup":"suggestion-popup"},!disableSearch&&XNode.create("input",{type:"search",value:Bind.twoWaysImmediate(()=>this.search),eventKeydown:e=>this.onKey(e),autofocus:true}),XNode.create("div",{class:"items"},XNode.create(AtomRepeater,{class:"presenter",selectedItem:Bind.oneWay(()=>this.anchorItem),itemRenderer:itemRenderer,visibilityFilter:Bind.oneWay(()=>match(this.search)),scrollToSelection:true,eventItemClick:e=>{this.close(e.detail);},items:items}))));}onKey(e){var _a;const suggested=match?(_a=this.items)===null||_a===void 0?void 0:_a.filter(match(this.search)):this.items;switch(e.key){case"Enter":const anchorItem=this.anchorItem;if(!anchorItem){return;}this.anchorIndex=0;this.close(anchorItem);this.anchorItem=null;this.search="";break;case"ArrowDown":if(suggested){if(!this.anchorItem){this.anchorIndex=0;}else{if(this.anchorIndex<suggested.length-1){this.anchorIndex++;}}this.anchorItem=suggested[this.anchorIndex];}break;case"ArrowUp":if(suggested){if(!this.anchorItem){return;}if(this.anchorIndex){this.anchorIndex--;}this.anchorItem=suggested[this.anchorIndex];}break;}}}__decorate([BindableProperty,__metadata("design:type",String)],Suggestions.prototype,"search",void 0);return Suggestions.showControl(opener);}function SelectorCheckBox(_a,...nodes){var{text,icon="far fa-square",iconSelected="fas fa-check-square"}=_a,a=__rest(_a,["text","icon","iconSelected"]);if(text){return XNode.create("label",null,XNode.create("i",{class:icon,"data-click-event":"item-select"}),XNode.create("i",{class:iconSelected,"data-click-event":"item-deselect"}),XNode.create("span",{"data-no-wrap":"true",text:text}),...nodes);}return XNode.create("label",null,XNode.create("i",{class:icon,"data-click-event":"item-select"}),XNode.create("i",{class:iconSelected,"data-click-event":"item-deselect"}),...nodes);}function SelectAll(_a,...nodes){var{text="Select All",icon="far fa-square",iconSelected="fas fa-check-square"}=_a,a=__rest(_a,["text","icon","iconSelected"]);if(text){return XNode.create(SelectAllControl,Object.assign({for:"label"},a),XNode.create("i",{class:icon,"data-ui-type":"item-select"}),XNode.create("i",{class:iconSelected,"data-ui-type":"item-deselect"}),XNode.create("span",{"data-no-wrap":"true",text:text}));}return XNode.create(SelectAllControl,Object.assign({for:"label"},a),XNode.create("i",{class:icon,"data-ui-type":"item-select"}),XNode.create("i",{class:iconSelected,"data-ui-type":"item-deselect"}),...nodes);}function disposeChildren(owner,e){if(!e){return;}let s=e.firstElementChild;while(s){const c=s;s=s.nextElementSibling;const ac=c.atomControl;if(ac){ac.dispose();continue;}disposeChildren(owner,c);owner.unbind(c);owner.unbindEvent(c);}e.innerHTML="";}function disposeChild(owner,e){const ac=e.atomControl;if(ac){ac.dispose();return;}disposeChildren(owner,e);owner.unbind(e);owner.unbindEvent(e);e.remove();}function defaultComparer(left,right){if(left&&right){if(left instanceof Date){if(right instanceof Date){return left.getTime()===right.getTime();}return false;}}return left===right;}function updateDragDrop(e,force=false){if(!e){return;}if(force){e.draggable=false;}else{force=e.draggable;}e=e.firstElementChild;while(e){updateDragDrop(e,force);e=e.nextElementSibling;}}_export({askSuggestion:askSuggestion,askSuggestionPopup:askSuggestionPopup,SelectorCheckBox:SelectorCheckBox,SelectAll:SelectAll,disposeChildren:disposeChildren,disposeChild:disposeChild,defaultComparer:defaultComparer,default:void 0});return{setters:[function(_tslib){__decorate=_tslib.__decorate;__metadata=_tslib.__metadata;__rest=_tslib.__rest;},function(_webAtomsCoreDistCoreAtomBinder){AtomBinder=_webAtomsCoreDistCoreAtomBinder.AtomBinder;},function(_webAtomsCoreDistCoreBind){Bind=_webAtomsCoreDistCoreBind.default;},function(_webAtomsCoreDistCoreBindableProperty){BindableProperty=_webAtomsCoreDistCoreBindableProperty.BindableProperty;},function(_webAtomsCoreDistCoreColors){Colors=_webAtomsCoreDistCoreColors.default;},function(_webAtomsCoreDistCoreStringHelper){StringHelper=_webAtomsCoreDistCoreStringHelper.StringHelper;},function(_webAtomsCoreDistCoreWatchProperty){WatchProperty=_webAtomsCoreDistCoreWatchProperty.default;},function(_webAtomsCoreDistCoreXNode){XNode=_webAtomsCoreDistCoreXNode.default;},function(_webAtomsCoreDistStyleStyleRule){StyleRule=_webAtomsCoreDistStyleStyleRule.default;},function(_webAtomsCoreDistWebControlsAtomControl){AtomControl=_webAtomsCoreDistWebControlsAtomControl.AtomControl;},function(_webAtomsCoreDistWebServicesPopupService){PopupWindow=_webAtomsCoreDistWebServicesPopupService.PopupWindow;},function(_webAtomsCoreDistWebStylesCSS){CSS=_webAtomsCoreDistWebStylesCSS.default;},function(_InlinePopup){InlinePopup=_InlinePopup.default;}],execute:function(){CSS(StyleRule().display("none"),"[data-ui-display=none]");popupCSS=CSS(StyleRule().minWidth(200).verticalFlexLayout({alignItems:"stretch"}).child(StyleRule(".items").flexStretch().overflow("auto").child(StyleRule(".presenter").child(StyleRule("*").padding(5)).child(StyleRule("[data-selected-item=true]").backgroundColor(Colors.lightGreen)))));_export("getParentRepeaterItem",getParentRepeaterItem=target=>{let eventName;let repeater;let index;let root;while(target){const a=target.atomControl;if(a!==undefined&&a instanceof AtomRepeater){repeater=a;break;}if(index===undefined){const itemIndex=target.dataset.itemIndex;if(typeof itemIndex!=="undefined"){root=target;index=~~itemIndex;}}if(eventName===undefined){const itemClickEvent=target.dataset.clickEvent;if(itemClickEvent){eventName=itemClickEvent.replace(/-([a-z])/g,g=>g[1].toUpperCase());}}target=target.parentElement;}if(index===void 0||repeater===void 0){return undefined;}const item=repeater.items[~~index];return[eventName,repeater,item,index,root];});_export("MatchTrue",MatchTrue=(...a)=>true);_export("MatchFalse",MatchFalse=(...a)=>false);_export("ArrowToString",ArrowToString=item=>{var _a,_b;return(_b=(_a=item.label)===null||_a===void 0?void 0:_a.toString())!==null&&_b!==void 0?_b:item.toString();});_export("MatchCaseInsensitive",MatchCaseInsensitive=(textField=ArrowToString)=>{return s=>{if(!s){return MatchTrue;}const r=StringHelper.createContainsRegExp(s);return item=>r.test(textField(item));};});_export("MatchAnyCaseInsensitive",MatchAnyCaseInsensitive=(textField=ArrowToString)=>{return s=>{if(!s){return MatchTrue;}const r=StringHelper.createContainsAnyWordRegExp(s);return item=>r.test(textField(item));};});_export("SameObjectValue",SameObjectValue=item=>item);maxHeight=window.screen.availHeight/2>250?StyleRule().height("250px"):StyleRule().maxHeight(80);CSS(StyleRule().merge(maxHeight).minWidth(80).verticalFlexLayout({alignItems:"stretch"}).child(StyleRule(".items").flexStretch().overflow("auto").child(StyleRule(".presenter").child(StyleRule("*").padding(5)).child(StyleRule("[data-selected-item=true]").backgroundColor(Colors.lightGreen)))),"*[data-suggestion-popup=suggestion-popup]");CSS(StyleRule().nested(StyleRule("i[data-click-event]").padding(5)).nested(StyleRule("[data-no-wrap=true]").whiteSpace("nowrap")),"*[data-selected-item]");CSS(StyleRule().nested(StyleRule("i[data-click-event=item-select]").padding(5)).displayNone(" i[data-click-event=item-select]"),"*[data-selected-item=true]");CSS(StyleRule().displayNone(" i[data-click-event=item-deselect]"),"*[data-selected-item=false]");CSS(StyleRule().flexLayout({alignItems:"center",justifyContent:"flex-start"}).margin(0).nested(StyleRule("i[data-ui-type]").padding(5)).nested(StyleRule("[data-no-wrap=true]").whiteSpace("nowrap")).displayNone("[data-is-selected=true] i[data-ui-type=item-select]").displayNone("[data-is-selected=false] i[data-ui-type=item-deselect]"),"*[data-select-all=select-all]");SelectAllControl=class SelectAllControl extends AtomControl{preCreate(){this.element.dataset.selectAll="select-all";this.items=[];this.selectedItems=[];this.render(XNode.create(SelectAllControl,{"data-is-selected":Bind.oneWay(()=>this.items.length>0&&this.items.length===this.selectedItems.length,false)}));this.bindEvent(this.element,"click",()=>{const si=this.selectedItems;const items=this.items;if(!si){return;}if(!items){return;}if(items.length===0){return;}if(items.length===si.length){si.clear();}else{si.length=0;si.push(...items);si.refresh();}});}};__decorate([BindableProperty,__metadata("design:type",Array)],SelectAllControl.prototype,"items",void 0);__decorate([BindableProperty,__metadata("design:type",Array)],SelectAllControl.prototype,"selectedItems",void 0);getFirstChild=container=>{let child=container.firstElementChild;while(child&&child.dataset.itemIndex===void 0){child=child.nextElementSibling;}return child;};_export("default",AtomRepeater=class AtomRepeater extends AtomControl{constructor(){super(...arguments);this.bubbleEvents=true;}static from(element){while(element){const{atomControl}=element;if(atomControl instanceof AtomRepeater){return atomControl;}element=element.parentElement;}}set refreshEventScope(v){this.registerDisposable(v.listen(ce=>{this.refreshItem(ce.detail);}));}get allSelected(){const selectedItems=this.selectedItems;const items=this.items;if(!(items&&selectedItems)){return false;}return items.length&&items.length===selectedItems.length;}get value(){var _a;if(this.initialValue!==undefined){return this.initialValue;}const sp=this.selectedItem;if(sp===undefined){return sp;}const vp=(_a=this.valuePath)!==null&&_a!==void 0?_a:SameObjectValue;return vp(sp);}set value(v){var _a,_b;this.initialValue=v;if(!this.items||!this.items.length){AtomBinder.refreshValue(this,"value");return;}const vp=(_a=this.valuePath)!==null&&_a!==void 0?_a:SameObjectValue;const c=(_b=this.comparer)!==null&&_b!==void 0?_b:defaultComparer;const selectedItem=this.items.find(item=>c(vp(item),v));this.selectedItem=selectedItem;delete this.initialValue;}get selectedItem(){var _a;return(_a=this.selectedItems)===null||_a===void 0?void 0:_a[0];}set selectedItem(value){var _a;const si=(_a=this.selectedItems)!==null&&_a!==void 0?_a:this.selectedItems=[];const first=si[0];if(value===first){return;}si.set(0,value);}onPropertyChanged(name){var _a,_b;switch(name){case"items":(_a=this.itemsDisposable)===null||_a===void 0?void 0:_a.dispose();const items=this.items;const d=items===null||items===void 0?void 0:items.watch((target,type,index,item)=>{switch(type){case"add":case"remove":case"set":this.updatePartial(type,index,item);break;default:this.updateItems();break;}this.dispatchCustomEvent("items-updated",{type,items,index});AtomBinder.refreshValue(this,"selectedItem");AtomBinder.refreshValue(this,"value");});if(d){this.itemsDisposable=this.registerDisposable(d);}const iv=this.initialValue;if(iv){this.value=iv;}this.updateItems();this.dispatchCustomEvent("items-updated",{type:"reset",items,index:0});if(this.scrollToSelection){this.bringSelectionIntoView();}break;case"selectedItems":(_b=this.selectedItemsDisposable)===null||_b===void 0?void 0:_b.dispose();const selectedItems=this.selectedItems;const sd=selectedItems===null||selectedItems===void 0?void 0:selectedItems.watch(()=>{this.updateClasses();if(this.scrollToSelection){this.bringSelectionIntoView();}if(this.selectedItem){delete this.initialValue;}AtomBinder.refreshValue(this,"selectedItem");AtomBinder.refreshValue(this,"value");AtomBinder.refreshValue(this,"allSelected");this.dispatchCustomEvent("selection-updated",selectedItems);});if(sd){this.selectedItemsDisposable=this.registerDisposable(sd);}this.updateClasses();this.dispatchCustomEvent("selection-updated",selectedItems);AtomBinder.refreshValue(this,"allSelected");break;case"itemRenderer":case"watch":this.updateItems();break;case"visibilityFilter":this.updateVisibility();break;case"header":case"headerRenderer":this.updateHeaderFooter("header",this.headerPresenter,this.header,this.headerRenderer,true);break;case"footer":case"footerRenderer":this.updateHeaderFooter("footer",this.footerPresenter,this.footer,this.footerRenderer);break;}}bringSelectionIntoView(force){if(force){const selection=this.selectedItem;if(selection){const element=this.elementForItem(selection);element===null||element===void 0?void 0:element.scrollIntoView();}return;}if(this.bringIntoViewId){clearTimeout(this.bringIntoViewId);}this.bringIntoViewId=setTimeout(()=>{clearTimeout(this.bringIntoViewId);this.bringIntoViewId=undefined;this.bringSelectionIntoView(true);},100);}forEach(action,container){var _a;container!==null&&container!==void 0?container:container=(_a=this.itemsPresenter)!==null&&_a!==void 0?_a:this.element;const items=this.items;let start=getFirstChild(container);while(start){const index=start.dataset.itemIndex;const item=items[~~index];action(item,start);start=start.nextElementSibling;}}*any(fx,itemSelector,container){var _a;container!==null&&container!==void 0?container:container=(_a=this.itemsPresenter)!==null&&_a!==void 0?_a:this.element;const items=this.items;let node=getFirstChild(container);while(node){const index=node.dataset.itemIndex;const item=items[~~index];let element=node;if(itemSelector){element=element.querySelector(itemSelector);}const ie={item,element};if(fx){if(fx(item)){yield ie;}continue;}yield ie;node=node.nextElementSibling;}}*all(container){var _a;container!==null&&container!==void 0?container:container=(_a=this.itemsPresenter)!==null&&_a!==void 0?_a:this.element;const items=this.items;let element=getFirstChild(container);while(element){const index=element.dataset.itemIndex;const item=items[~~index];yield{item,element};element=element.nextElementSibling;}}elementForItem(itemToFind,container){var _a;container!==null&&container!==void 0?container:container=(_a=this.itemsPresenter)!==null&&_a!==void 0?_a:this.element;const items=this.items;let element=getFirstChild(container);while(element){const index=element.dataset.itemIndex;const item=items[~~index];if(item===itemToFind){return element;}element=element.nextElementSibling;}}refreshItem(item,fx,index=-1){if(index===-1){index=this.items.indexOf(item);}if(fx===null||fx===void 0?void 0:fx.then){const finalize=()=>{this.refreshItem(item,undefined,index);};fx.then(finalize,finalize);return;}this.updatePartial("set",index,item);}updatePartial(key,index,item,container){var _a,_b,_c,_d,_e,_f;const items=this.items;if(!items){return;}const ir=this.itemRenderer;if(!ir){return;}container!==null&&container!==void 0?container:container=(_a=this.itemsPresenter)!==null&&_a!==void 0?_a:this.element;let start=getFirstChild(container);let ei;while(start){ei=~~start.dataset.itemIndex;if(ei===index){break;}start=start.nextElementSibling;}if(key!=="add"&&!start){return;}const vp=(_b=this.valuePath)!==null&&_b!==void 0?_b:it=>it;const si=((_c=this.selectedItems)!==null&&_c!==void 0?_c:[]).map(vp);const isRemove=key==="remove";if(isRemove||key==="set"){const current=start;start=start.nextElementSibling;const ac=current.atomControl;if(ac){ac.dispose();}else{this.unbind(current);this.unbindEvent(current);}current.remove();}if(!isRemove){const en=ir(item,index,this);const ea=(_d=en.attributes)!==null&&_d!==void 0?_d:en.attributes={};const v=vp(item);const e=document.createElement((_f=(_e=ea.for)!==null&&_e!==void 0?_e:en.name)!==null&&_f!==void 0?_f:"div");e.dataset.itemIndex=(index++).toString();e.dataset.selectedItem=si.indexOf(v)!==-1?"true":"false";if(this.enableDragDrop){updateDragDrop(e);}if(start){container.insertBefore(e,start);}else{container.appendChild(e);}this.render(en,e,this);}while(start){const ci=items[index];const cv=vp(ci);start.dataset.itemIndex=(index++).toString();start.dataset.selectedItem=si.indexOf(cv)!==-1?"true":"false";start=start.nextElementSibling;}this.onPropertyChanged("footer");}updateItems(container,force){var _a,_b,_c,_d,_e,_f;if(this.deferUpdates&&!force){if(this.deferredUpdateId){return;}this.deferredUpdateId=setTimeout(()=>{this.deferredUpdateId=0;this.updateItems(container,true);},1);return;}container!==null&&container!==void 0?container:container=(_a=this.itemsPresenter)!==null&&_a!==void 0?_a:this.element;if(!container){return;}disposeChildren(this,container);this.onPropertyChanged("header");const ir=this.itemRenderer;if(!ir){this.onPropertyChanged("footer");return;}const items=this.items;if(!items){this.onPropertyChanged("footer");return;}const vp=(_b=this.valuePath)!==null&&_b!==void 0?_b:it=>it;const si=((_c=this.selectedItems)!==null&&_c!==void 0?_c:[]).map(vp);let i=0;for(const iterator of items){const index=i++;const e=ir(iterator,index,this);const ea=(_d=e.attributes)!==null&&_d!==void 0?_d:e.attributes={};const v=vp(iterator);const element=document.createElement((_f=(_e=ea.for)!==null&&_e!==void 0?_e:e.name)!==null&&_f!==void 0?_f:"div");element.dataset.itemIndex=index.toString();element.dataset.selectedItem=si.indexOf(v)!==-1?"true":"false";this.render(e,element,this);if(this.enableDragDrop){updateDragDrop(element);}container.appendChild(element);}this.onPropertyChanged("footer");}preCreate(){this.element.setAttribute("data-click-event","item-click");}dispatchCustomEvent(type,detail){var _a;type=StringHelper.fromHyphenToCamel(type);(_a=this.element)===null||_a===void 0?void 0:_a.dispatchEvent(new CustomEvent(type,{detail,bubbles:false,cancelable:true}));}updateClasses(){var _a,_b,_c;const container=(_a=this.itemsPresenter)!==null&&_a!==void 0?_a:this.element;const items=this.items;let element=getFirstChild(container);const vp=(_b=this.valuePath)!==null&&_b!==void 0?_b:i=>i;const si=((_c=this.selectedItems)!==null&&_c!==void 0?_c:[]).map(vp);while(element){const index=~~element.dataset.itemIndex;const item=items[index];const v=vp(item);element.dataset.selectedItem=si.indexOf(v)!==-1?"true":"false";element=element.nextElementSibling;}}updateVisibility(){var _a,_b;const container=(_a=this.itemsPresenter)!==null&&_a!==void 0?_a:this.element;const items=this.items;let element=container.firstElementChild;const vf=(_b=this.visibilityFilter)!==null&&_b!==void 0?_b:MatchTrue;while(element){const index=~~element.dataset.itemIndex;const item=items[index];if(vf(item)){element.removeAttribute("data-ui-display");}else{element.dataset.uiDisplay="none";}element=element.nextElementSibling;}}updateHeaderFooter(name,presenter,item,itemRenderer,insert){var _a,_b,_c,_d;presenter!==null&&presenter!==void 0?presenter:presenter=(_a=this.itemsPresenter)!==null&&_a!==void 0?_a:this.itemsPresenter=this.element;if(!presenter){return;}let current;if(insert){current=presenter.firstElementChild;while(current&&current.dataset[name]!==name){current=current.nextElementSibling;}}else{current=presenter.lastElementChild;while(current&&current.dataset[name]!==name){current=current.previousElementSibling;}}if(current){disposeChild(this,current);}if(!(item&&itemRenderer)){return;}const node=itemRenderer(item);const element=document.createElement((_d=(_c=(_b=node.attributes)===null||_b===void 0?void 0:_b.for)!==null&&_c!==void 0?_c:node.name)!==null&&_d!==void 0?_d:"div");element.dataset[name]=name;this.render(node,element,this);if(insert){presenter.insertBefore(element,presenter.firstElementChild);}else{presenter.appendChild(element);}}dispatchHeaderFooterEvent(eventName,type,originalTarget){const detail=this[type];const ce=new CustomEvent(eventName!==null&&eventName!==void 0?eventName:`${type}Click`,{detail,bubbles:this.bubbleEvents,cancelable:true});originalTarget.dispatchEvent(ce);if(!ce.defaultPrevented){this.onPropertyChanged(type);}}dispatchItemEvent(eventName,item,recreate,originalTarget,nestedItem){const ce=new CustomEvent(eventName!==null&&eventName!==void 0?eventName:"itemClick",{detail:nestedItem!==null&&nestedItem!==void 0?nestedItem:item,bubbles:this.bubbleEvents,cancelable:true});originalTarget.dispatchEvent(ce);if(recreate&&ce.executed&&!ce.defaultPrevented){this.refreshItem(item,ce.promise);}}dispatchClickEvent(e,data){var _a;let{clickEvent="itemClick",recreate,header,footer,itemIndex,itemPath}=data;clickEvent=clickEvent.replace(/-([a-z])/g,g=>g[1].toUpperCase());if(header){this.dispatchHeaderFooterEvent(clickEvent,header,e.target);return;}if(footer){this.dispatchHeaderFooterEvent(clickEvent,header,e.target);return;}if(itemIndex===void 0||itemIndex===null){return;}let index=~~itemIndex;const item=this.items[index];if(clickEvent==="itemSelect"||clickEvent==="itemDeselect"){const si=(_a=this.selectedItems)!==null&&_a!==void 0?_a:this.selectedItems=[];if(si){index=si.indexOf(item);if(index===-1){if(this.allowMultipleSelection){si.add(item);}else{si.set(0,item);}}else{si.removeAt(index);}}}if(item){if(itemPath){if(/^[\{\"}]/.test(itemPath)){this.dispatchItemEvent(clickEvent,item,recreate,e.target,JSON.parse(itemPath));return;}let nestedItem={};const all=itemPath.split(",");for(const iterator of all){let[name,paths]=iterator.split(/\=|\:/);if(paths===void 0){if(all.length>1){throw new Error("Invalid path, please use name=path format");}paths=name;}let start=item;for(const path of paths.split(".")){if(path==="$"){start=item;continue;}start=start[path];}if(all.length===1){nestedItem=start;break;}nestedItem[name]=start;}this.dispatchItemEvent(clickEvent,item,recreate,e.target,nestedItem);return;}this.dispatchItemEvent(clickEvent,item,recreate,e.target);}}});__decorate([BindableProperty,__metadata("design:type",Boolean)],AtomRepeater.prototype,"allowMultipleSelection",void 0);__decorate([BindableProperty,__metadata("design:type",Array)],AtomRepeater.prototype,"selectedItems",void 0);__decorate([BindableProperty,__metadata("design:type",Object)],AtomRepeater.prototype,"itemsPresenter",void 0);__decorate([BindableProperty,__metadata("design:type",Array)],AtomRepeater.prototype,"items",void 0);__decorate([BindableProperty,__metadata("design:type",Object)],AtomRepeater.prototype,"watch",void 0);__decorate([BindableProperty,__metadata("design:type",Function)],AtomRepeater.prototype,"visibilityFilter",void 0);__decorate([BindableProperty,__metadata("design:type",Function)],AtomRepeater.prototype,"enableFunc",void 0);__decorate([BindableProperty,__metadata("design:type",Function)],AtomRepeater.prototype,"itemRenderer",void 0);__decorate([BindableProperty,__metadata("design:type",Function)],AtomRepeater.prototype,"valuePath",void 0);__decorate([BindableProperty,__metadata("design:type",Function)],AtomRepeater.prototype,"comparer",void 0);__decorate([BindableProperty,__metadata("design:type",Boolean)],AtomRepeater.prototype,"deferUpdates",void 0);__decorate([BindableProperty,__metadata("design:type",Object)],AtomRepeater.prototype,"header",void 0);__decorate([BindableProperty,__metadata("design:type",Object)],AtomRepeater.prototype,"headerRenderer",void 0);__decorate([BindableProperty,__metadata("design:type",Object)],AtomRepeater.prototype,"footer",void 0);__decorate([BindableProperty,__metadata("design:type",Object)],AtomRepeater.prototype,"footerRenderer",void 0);__decorate([BindableProperty,__metadata("design:type",Object)],AtomRepeater.prototype,"enableDragDrop",void 0);__decorate([WatchProperty,__metadata("design:type",Object),__metadata("design:paramtypes",[])],AtomRepeater.prototype,"allSelected",null);hoverItem={repeater:null,target:null,item:null,placeholder:null};document.body.addEventListener("dragstart",e=>{const{target}=e;if(target.draggable){const ri=getParentRepeaterItem(target);if(!ri){return;}const[type,repeater,item,index]=ri;if(!repeater||!repeater.enableDragDrop){return;}const placeholder=document.createElement("div");placeholder.style.width=target.offsetWidth+"px";placeholder.style.height=target.offsetHeight+"px";placeholder.style.backgroundColor=Colors.lightGray.toString();placeholder.style.border="solid 1px gray";placeholder.style.borderRadius="10px";hoverItem={repeater,target,item,placeholder};e.dataTransfer.dropEffect="move";setTimeout(()=>{target.style.display="none";target.parentElement.insertBefore(placeholder,target);},0);}});document.body.addEventListener("dragend",e=>{var _a,_b;if(!(hoverItem===null||hoverItem===void 0?void 0:hoverItem.placeholder)){return;}const{item,placeholder,repeater}=hoverItem;let start=placeholder;let index=-1;while(start){const itemIndex=(_b=(_a=start.previousElementSibling)===null||_a===void 0?void 0:_a.dataset)===null||_b===void 0?void 0:_b.itemIndex;if(itemIndex!==void 0){index=~~itemIndex;}if(start.parentElement.atomControl){break;}start=start.parentElement;}const targetRepeater=start.parentElement.atomControl;placeholder.remove();hoverItem.placeholder=null;repeater.items.remove(item);index++;const ce=new CustomEvent("itemDropped",{detail:{item,index}});if(ce.defaultPrevented){return;}const{detail}=ce;targetRepeater.items.insert(detail.index,detail.item);});dragOver=e=>{if(hoverItem){const{placeholder}=hoverItem;if(e.target===placeholder){return;}}const ri=getParentRepeaterItem(e.target);if(!ri){return;}const[type,repeater,item,index,target]=ri;if(!repeater){return;}if(hoverItem){const{placeholder}=hoverItem;e.preventDefault();const mp={x:e.clientX,y:e.clientY};const isBefore=(co,n)=>n.x<=co.x+co.width*0.3||n.y<=co.y+co.height*0.3;const isAfter=(co,n)=>n.x>=co.x+co.width*0.7||n.y>=co.y+co.height*0.7;const targetBounds=target.getBoundingClientRect();if(isAfter(targetBounds,mp)){const next=target.nextElementSibling;if(next===placeholder){return;}placeholder.remove();target.insertAdjacentElement("afterend",placeholder);return;}if(isBefore(targetBounds,mp)){const previous=target.previousElementSibling;if(previous===placeholder){return;}placeholder.remove();target.insertAdjacentElement("beforebegin",placeholder);}return;}};document.body.addEventListener("dragover",dragOver);document.body.addEventListener("dragenter",dragOver);}};});
 //# sourceMappingURL=AtomRepeater.js.map