var TalonDesignMode = (function (componentService,routingService) {
  'use strict';

  function _typeof(obj) {
    if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
      _typeof = function (obj) {
        return typeof obj;
      };
    } else {
      _typeof = function (obj) {
        return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
      };
    }

    return _typeof(obj);
  }

  function _defineProperty(obj, key, value) {
    if (key in obj) {
      Object.defineProperty(obj, key, {
        value: value,
        enumerable: true,
        configurable: true,
        writable: true
      });
    } else {
      obj[key] = value;
    }

    return obj;
  }

  function _objectSpread(target) {
    for (var i = 1; i < arguments.length; i++) {
      var source = arguments[i] != null ? arguments[i] : {};
      var ownKeys = Object.keys(source);

      if (typeof Object.getOwnPropertySymbols === 'function') {
        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
        }));
      }

      ownKeys.forEach(function (key) {
        _defineProperty(target, key, source[key]);
      });
    }

    return target;
  }

  function e(e, t) {
    if (!(e instanceof t)) throw new TypeError("Cannot call a class as a function");
  }

  function t(e, t) {
    for (var n = 0; n < t.length; n++) {
      var i = t[n];
      i.enumerable = i.enumerable || !1, i.configurable = !0, "value" in i && (i.writable = !0), Object.defineProperty(e, i.key, i);
    }
  }

  function n(e, n, i) {
    return n && t(e.prototype, n), i && t(e, i), e;
  }

  function i(e) {
    return function (e) {
      if (Array.isArray(e)) {
        for (var t = 0, n = new Array(e.length); t < e.length; t++) {
          n[t] = e[t];
        }

        return n;
      }
    }(e) || function (e) {
      if (Symbol.iterator in Object(e) || "[object Arguments]" === Object.prototype.toString.call(e)) return Array.from(e);
    }(e) || function () {
      throw new TypeError("Invalid attempt to spread non-iterable instance");
    }();
  }

  var o = function () {
    function t() {
      var n = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : [];
      e(this, t), this.observers = n, this.state = function (e, t) {
        return new Proxy(e, {
          set: function set(e, n, i) {
            return t.forEach(function (t) {
              t(e, n, i);
            }), Reflect.set(e, n, i);
          }
        });
      }({
        dragging: !1,
        x: 0,
        y: 0,
        current: null,
        originExternal: !1,
        originX: null,
        originY: null,
        enabled: !0
      }, this.observers);
    }

    return n(t, [{
      key: "registerObserver",
      value: function value(e) {
        this.observers.push(e);
      }
    }, {
      key: "getState",
      value: function value() {
        return this.state;
      }
    }]), t;
  }();

  var r = function () {
    function t() {
      e(this, t), this.cache = {};
    }

    return n(t, [{
      key: "add",
      value: function value(e, t, n) {
        this.cache[e] || (this.cache[e] = t, n(e, t));
      }
    }, {
      key: "invalidate",
      value: function value(e) {
        delete this.cache[e];
      }
    }, {
      key: "invalidateAll",
      value: function value() {
        delete this.cache, this.cache = {};
      }
    }, {
      key: "getAll",
      value: function value() {
        return Object.values(this.cache);
      }
    }, {
      key: "get",
      value: function value(e) {
        return this.cache[e];
      }
    }]), t;
  }();

  function a(e, t) {
    var n = [],
        o = document.createTreeWalker(e);
    e.matches && e.matches(t) && (n = [].concat(i(n), [e]));
    var r = e.querySelectorAll && e.querySelectorAll(t);
    r && (n = [].concat(i(n), i(r)));

    do {
      var l = o.currentNode;
      l.shadowRoot && (n = n.concat(a(l.shadowRoot, t)));
    } while (o.nextNode());

    return n;
  }

  function l(e, t, n) {
    function i(e, t, n) {
      return e >= t && e <= n;
    }

    var o = e.getBoundingClientRect(),
        r = o.left,
        a = o.top,
        l = r + o.width,
        c = a + o.height;
    return i(t, r, l) && i(n, a, c);
  }

  function c(e, t, n) {
    return function (e, t, n) {
      var i = null;
      return e.forEach(function (e, o, r) {
        var a,
            l = {
          x: e.x,
          y: e.y,
          width: e.width,
          beforeId: e.beforeId,
          position: "top"
        },
            c = {
          x: e.x,
          y: e.y + e.height,
          width: e.width,
          beforeId: "",
          position: "bottom"
        };
        l.distance = Math.abs(l.x - t) + Math.abs(l.y - n), c.distance = Math.abs(c.x - t) + Math.abs(c.y - n), a = o !== r.length - 1 ? l : l.distance < c.distance ? l : c, i = i && i.distance < a.distance ? i : a;
      }), i;
    }(e.map(function (e) {
      var t,
          n = e.getBoundingClientRect();
      return {
        x: n.left,
        y: n.top,
        width: n.width,
        height: n.height,
        beforeId: (t = e, t && t.getAttribute("data-item-id"))
      };
    }), t, n);
  }

  var s = function () {
    function t(n, i) {
      var o = arguments.length > 2 && void 0 !== arguments[2] ? arguments[2] : [];
      e(this, t), this.enabled = !0, this.key = n, this.element = i, this.handlers = o;
    }

    return n(t, [{
      key: "init",
      value: function value(e, t) {
        this.processHandlers("init", {
          payload: t,
          context: this
        }), e ? this.enable(t) : this.disable();
      }
    }, {
      key: "enable",
      value: function value(e) {
        this.enabled = !0, this.processHandlers("enable", {
          payload: e,
          context: this
        });
      }
    }, {
      key: "disable",
      value: function value() {
        this.enabled = !1, this.processHandlers("disable");
      }
    }, {
      key: "processHandlers",
      value: function value(e, t) {
        var n = this;
        this.handlers.forEach(function (i) {
          i[e] && i[e]({
            key: n.key,
            element: n.element,
            params: t
          });
        });
      }
    }]), t;
  }(),
      d = function () {
    function t() {
      var n = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : [],
          i = arguments.length > 1 ? arguments[1] : void 0,
          o = arguments.length > 2 ? arguments[2] : void 0;
      e(this, t), this.cache = new r(), this.handlers = n, this.getElementKey = o, this.stateService = i;
    }

    return n(t, [{
      key: "scan",
      value: function value(e) {
        var t = this;
        a(e.scope, e.selector).forEach(function (e) {
          var n = t.getElementKey(e),
              i = new s(n, e, t.handlers);
          t.cache.add(n, i, function (e, n) {
            i.init(t.stateService.getState().enabled, {
              key: e,
              item: n
            });
          });
        });
      }
    }, {
      key: "getAll",
      value: function value() {
        return this.cache.getAll();
      }
    }, {
      key: "get",
      value: function value(e) {
        return this.cache.get(e);
      }
    }, {
      key: "invalidate",
      value: function value(e) {
        return this.cache.invalidate(e);
      }
    }, {
      key: "delete",
      value: function value(e) {
        var t = this.cache.get(e);
        t && (t.element.remove(), this.invalidate(e));
      }
    }, {
      key: "invalidateAll",
      value: function value() {
        return this.cache.invalidateAll();
      }
    }, {
      key: "enableAll",
      value: function value(e) {
        this.cache.getAll().forEach(function (t) {
          return t.enable(e);
        });
      }
    }, {
      key: "disableAll",
      value: function value() {
        this.cache.getAll().forEach(function (e) {
          return e.disable();
        });
      }
    }, {
      key: "findElementInCoord",
      value: function value(e, t) {
        return this.cache.getAll().find(function (n) {
          return l(n.element, e, t);
        });
      }
    }]), t;
  }(),
      u = function () {
    function t(n) {
      var i = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : [];
      e(this, t), this.name = n, this.handlers = i, this.enabled = !0, this.state = null, this.element = document.createElement("div"), this.element.classList.add("interactions-proxy", "interactions-proxy-".concat(n)), this.element.setAttribute("data-proxy-name", n), this.processHandlers("init");
    }

    return n(t, [{
      key: "enable",
      value: function value(e) {
        this.enabled = !0, this.state = e, this.processHandlers("enable", {
          payload: e,
          context: this
        });
      }
    }, {
      key: "disable",
      value: function value() {
        this.enabled = !1, this.processHandlers("disable");
      }
    }, {
      key: "processHandlers",
      value: function value(e, t) {
        this.handlers[e] && this.handlers[e]({
          key: this.name,
          element: this.element,
          params: t
        });
      }
    }]), t;
  }(),
      h = function () {
    function t(n) {
      var i = this,
          o = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : {};
      e(this, t), this.handlerMap = o, this.proxies = {
        region: null,
        component: null,
        componentClone: null,
        componentHover: null,
        drop: null
      };
      var r = document.createElement("div");
      r.classList.add("interactions-proxy-container", "interactions-proxy-container-".concat(n.trim().replace(/ /g, "").toLowerCase())), document.body.appendChild(r), Object.keys(this.proxies).forEach(function (e) {
        i.proxies[e] = new u(e, i.handlerMap[e]), r.appendChild(i.proxies[e].element);
      });
    }

    return n(t, [{
      key: "enableAll",
      value: function value(e) {
        Object.values(this.proxies).forEach(function (t) {
          return t.enable(e);
        });
      }
    }, {
      key: "disableAll",
      value: function value() {
        Object.values(this.proxies).forEach(function (e) {
          return e.disable();
        });
      }
    }]), t;
  }();

  function p(e) {
    var t,
        n = e.x,
        i = e.y,
        o = e.regions,
        r = e.dropProxy,
        s = e.dragging,
        d = e.component,
        u = e.enabled;

    if (s && u) {
      var h = o.find(function (e) {
        return l(e.element, n, i);
      });

      if (h) {
        var p = c(a("[object ShadowRoot]" === (t = h.element).parentNode.toString() ? t.parentNode.host : t, ".interactions-component"), n, i);
        r.enable({
          position: p,
          container: h,
          element: d
        });
      } else r.disable();
    } else r.disable();
  }

  var g = function () {
    function t(n) {
      var i = this,
          r = n.key,
          a = n.scope,
          l = n.configuration,
          c = n.handlers;
      e(this, t), this.scope = a, this.configuration = l;
      var s = this.configuration,
          u = s.dropHandler,
          p = void 0 === u ? function () {} : u,
          g = s.selectHandler,
          v = void 0 === g ? function () {} : g,
          f = s.getRegionKey,
          y = void 0 === f ? function () {} : f,
          m = s.getComponentKey,
          b = void 0 === m ? function () {} : m,
          x = c.componentHandler,
          S = void 0 === x ? {} : x,
          w = c.regionHandler,
          k = void 0 === w ? {} : w,
          A = c.proxyHandlerMap,
          E = void 0 === A ? {} : A,
          C = c.stateObserver,
          H = void 0 === C ? function () {} : C;
      this.stateService = new o([H.bind(this), function (e, t, n) {
        "x" !== t && "y" !== t && "dragging" !== t || (e[t] = n, i.render(e.x, e.y)), "current" === t && v(n);
      }]), this.componentService = new d([S], this.stateService, b), this.regionService = new d([k], this.stateService, y), this.proxyService = new h(r, E), this.scan(), function (e) {
        var t = e.stateService,
            n = e.componentService,
            i = e.proxyService,
            o = e.dropHandler;
        document.addEventListener("mousemove", function (e) {
          var n = t.getState();
          n.enabled && (n.x = e.clientX, n.y = e.clientY, n.originX && n.originY && !n.dragging && n.current && Math.abs(n.originX - n.x) + Math.abs(n.originY - n.y) > 20 && (n.dragging = !0));
        }), document.addEventListener("mouseup", function (e) {
          var n = t.getState();
          n.enabled && (n.dragging && n.current && (o(i.proxies.drop.state), n.current = null), n.x = e.clientX, n.y = e.clientY, n.originX = null, n.originY = null, n.dragging = !1);
        }), document.addEventListener("mousedown", function (e) {
          var i = t.getState();

          if (i.enabled) {
            i.x = e.clientX, i.y = e.clientY;
            var o = n.findElementInCoord(i.x, i.y);
            o ? o === i.current ? (i.originX = i.x, i.originY = i.y) : i.current = o : i.current = null;
          }
        });
      }({
        stateService: this.stateService,
        componentService: this.componentService,
        proxyService: this.proxyService,
        dropHandler: p
      });
    }

    return n(t, [{
      key: "enable",
      value: function value() {
        this.stateService.getState().enabled = !0, this.componentService.enableAll(), this.regionService.enableAll();
      }
    }, {
      key: "disable",
      value: function value() {
        this.stateService.getState().enabled = !1, this.componentService.disableAll(), this.regionService.disableAll(), this.proxyService.disableAll();
      }
    }, {
      key: "scan",
      value: function value() {
        var e = this.configuration,
            t = e.componentSelector,
            n = e.regionSelector;
        this.componentService.scan({
          scope: this.scope,
          selector: t
        }), this.regionService.scan({
          scope: this.scope,
          selector: n
        });
      }
    }, {
      key: "poll",
      value: function value(e) {
        var t = this;
        setInterval(this.scan.bind(this), e), setInterval(function () {
          var e = t.stateService.getState(),
              n = e.x,
              i = e.y;
          t.render(n, i);
        }, e);
      }
    }, {
      key: "render",
      value: function value(e, t) {
        var n = this.stateService.getState(),
            i = n.current,
            o = n.dragging,
            r = n.enabled;
        !function (e) {
          var t = e.x,
              n = e.y,
              i = e.components,
              o = e.componentHoverProxy,
              r = e.dragging,
              a = e.component,
              c = e.enabled,
              s = i.find(function (e) {
            return l(e.element, t, n);
          });
          s && !r && a !== s && c ? o.enable({
            element: s,
            x: t,
            y: n
          }) : o.disable();
        }({
          x: e,
          y: t,
          components: this.componentService.getAll(),
          componentHoverProxy: this.proxyService.proxies.componentHover,
          dragging: o,
          component: i,
          enabled: r
        }), function (e) {
          var t = e.component,
              n = e.componentProxy,
              i = e.enabled;
          t && i ? n.enable({
            element: t
          }) : n.disable();
        }({
          x: e,
          y: t,
          component: i,
          componentProxy: this.proxyService.proxies.component,
          enabled: r
        }), function (e) {
          var t = e.x,
              n = e.y,
              i = e.regions,
              o = e.regionProxy,
              r = e.dragging,
              a = e.enabled,
              c = i.find(function (e) {
            return l(e.element, t, n);
          });
          c && r && a ? o.enable({
            element: c,
            x: t,
            y: n
          }) : o.disable();
        }({
          x: e,
          y: t,
          regions: this.regionService.getAll(),
          regionProxy: this.proxyService.proxies.region,
          dragging: o,
          enabled: r
        }), p({
          x: e,
          y: t,
          regions: this.regionService.getAll(),
          dropProxy: this.proxyService.proxies.drop,
          dragging: this.stateService.getState().dragging,
          component: i,
          enabled: r
        }), function (e) {
          var t = e.x,
              n = e.y,
              i = e.component,
              o = e.dragging,
              r = e.originExternal,
              a = e.componentCloneProxy,
              l = e.enabled;
          o && !r && i && l ? a.enable({
            x: t,
            y: n,
            element: i
          }) : a.disable();
        }({
          x: e,
          y: t,
          component: i,
          dragging: this.stateService.getState().dragging,
          originExternal: this.stateService.getState().originExternal,
          componentCloneProxy: this.proxyService.proxies.componentClone,
          enabled: r
        });
      }
    }, {
      key: "dragStart",
      value: function value(e) {
        var t = e.mouseX,
            n = e.mouseY,
            i = this.stateService.getState();
        i.x = t, i.y = n, i.dragging = !0, i.external = !0;
      }
    }, {
      key: "dragUpdate",
      value: function value(e) {
        var t = e.mouseX,
            n = e.mouseY,
            i = this.stateService.getState();
        i.x = t, i.y = n;
      }
    }, {
      key: "dragEnd",
      value: function value(e) {
        var t = e.mouseX,
            n = e.mouseY,
            i = this.stateService.getState();
        return i.x = t, i.y = n, i.dragging = !1, i.external = !1, this.proxyService.proxies.drop.state;
      }
    }, {
      key: "selectComponent",
      value: function value(e) {
        this.stateService.getState().current = this.componentService.get(e);
      }
    }, {
      key: "invalidateComponentCache",
      value: function value(e) {
        var t = this.stateService.getState();
        this.componentService.invalidate(e), t.current = null;
      }
    }, {
      key: "invalidateAllElementCache",
      value: function value() {
        var e = this.stateService.getState();
        this.componentService.invalidateAll(), this.regionService.invalidateAll(), e.current = null;
      }
    }, {
      key: "deleteComponent",
      value: function value(e) {
        this.componentService.delete(e);
      }
    }]), t;
  }(),
      f = {
    querySelectorAll: a,
    querySelector: function e(t, n) {
      var i = document.createTreeWalker(t);
      if (t.matches && t.matches(n)) return t;
      var o = t.querySelector && t.querySelector(n);
      if (o) return o;

      do {
        var r = i.currentNode;
        r.shadowRoot && (o = e(r.shadowRoot, n));
      } while (i.nextNode() && !o);

      return o;
    }
  };

  var e$1 = function e(_e, n) {
    if ("string" != typeof _e || 0 === _e.length) throw new TypeError("field must be a non-empty string");
    return function (t, r) {
      var i = t[_e].localeCompare(r[_e], void 0, {
        sensitivity: "base"
      });

      return n ? -i : i;
    };
  },
      n$1 = e$1("label"),
      t$1 = e$1("name");

  function i$1(e) {
    return (i$1 = "function" == typeof Symbol && "symbol" == _typeof(Symbol.iterator) ? function (e) {
      return _typeof(e);
    } : function (e) {
      return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : _typeof(e);
    })(e);
  }

  function o$1(e, n) {
    if (!(e instanceof n)) throw new TypeError("Cannot call a class as a function");
  }

  function s$1(e, n) {
    for (var t = 0; t < n.length; t++) {
      var r = n[t];
      r.enumerable = r.enumerable || !1, r.configurable = !0, "value" in r && (r.writable = !0), Object.defineProperty(e, r.key, r);
    }
  }

  function a$1(e, n, t) {
    return n && s$1(e.prototype, n), t && s$1(e, t), e;
  }

  var w = function () {
    function e(n, t, r, i) {
      if (o$1(this, e), this.listeners = {}, !n) throw new Error("PostMessage: Error creating connection! 'srcWindow' was not provided while creating the connection.");
      if (!(t || i && i.constructor && i.call && i.apply)) throw new Error("PostMessage: Error creating connection! Either 'destWindow' or 'hookShouldHandleMessage' should be provided while creating a connection.");
      return this.curWindow = n, this.otherWindow = t, this.otherWindowOrigin = r, this.hookShouldHandleMessage = i, this.curWindow.addEventListener ? this.curWindow.addEventListener("message", this.messageHandler.bind(this), !1) : this.curWindow.attachEvent("onmessage", messageHandler), this.open = !0, this;
    }

    return a$1(e, [{
      key: "messageHandler",
      value: function value(e) {
        if ((this.otherWindow || this.hookShouldHandleMessage && this.hookShouldHandleMessage(e)) && !(e.source !== this.otherWindow || this.otherWindowOrigin && e.origin.toLowerCase() !== this.otherWindowOrigin.toLowerCase())) {
          var n;

          try {
            n = JSON.parse(e.data);
          } catch (e) {
            return;
          }

          var t = this.listeners[n.mType];
          if (t) for (var r = t.length, i = 0; i < r; i++) {
            var o = t[i];
            o && o.constructor && o.call && o.apply && o(n.mBody);
          }
        }
      }
    }, {
      key: "close",
      value: function value() {
        for (var e in this.curWindow.removeEventListener ? this.curWindow.removeEventListener("message", this.messageHandler, !1) : this.curWindow.detachEvent("onmessage", this.messageHandler), this) {
          this.hasOwnProperty(e) && delete this[e];
        }

        this.open = !1;
      }
    }, {
      key: "send",
      value: function value(e, n) {
        if (!this.open) throw new Error("PostMessage: Connection is not open. Cannot send messages if the connection is not open.");
        if (!this.otherWindow) throw new Error("PostMessage: Cannot send messages using Connection connection since a 'destWindow' was not specified during creation.");
        var t = {
          mType: e,
          mBody: n
        },
            r = this.otherWindowOrigin || "*";
        return this.otherWindow && this.otherWindow.postMessage(JSON.stringify(t), r), this;
      }
    }, {
      key: "listenFor",
      value: function value(e, n) {
        if (!this.open) throw new Error("PostMessage: Connection is not open. Cannot listen for messages if the connection is not open.");
        return this.listeners.hasOwnProperty(e) ? this.listeners[e].push(n) : this.listeners[e] = [n], this;
      }
    }, {
      key: "stopListeningFor",
      value: function value(e, n) {
        if (!this.open) throw new Error("PostMessage: Connection is not open.");

        if (n) {
          var t = this.listeners[e],
              r = t ? t.indexOf(n) : -1;
          r >= 0 && (t.splice(r, 1), 0 === t.length ? delete this.listeners[e] : this.listeners[e] = t);
        } else delete this.listeners[e];

        return this;
      }
    }]), e;
  }(),
      y = function () {
    function e() {
      o$1(this, e), this.connections = {};
    }

    return a$1(e, [{
      key: "registerPostmessageHandler",
      value: function value(e, n, t) {
        if (e && !e.location && !e.document) throw new Error('PostmessageManager: The source window supplied while registering the handler for "' + n + '" is not a valid window object.');
        if ("function" != typeof t) throw new Error('PostmessageManager: The action supplied while registering the handler for "' + n + '" is not a valid function.');
        (e ? this.getConnection(e) : this.getListenOnlyConnection()).listenFor(n, t);
      }
    }, {
      key: "unregisterPostmessageHandler",
      value: function value(e, n, t) {
        if (e && !e.location && !e.document) throw new Error('PostmessageManager: The source window supplied while unregistering the handler for "' + n + '" is not a valid window object.');
        (e ? this.getConnection(e) : this.getListenOnlyConnection()).stopListeningFor(n, t);
      }
    }, {
      key: "sendPostmessage",
      value: function value(e, n, t) {
        if (!e || !e.location || !e.postMessage) throw new Error('PostmessageManager: The destination window supplied while sending the "' + n + '" message is not a valid window object.');
        this.getConnection(e).send(n, t);
      }
    }, {
      key: "getListenOnlyConnection",
      value: function value() {
        var e = this;
        return this.listenOnlyConnection || (this.listenOnlyConnection = new w(window, void 0, void 0, function (n) {
          return !e.connections.hasOwnProperty(n.source);
        })), this.listenOnlyConnection;
      }
    }, {
      key: "getConnection",
      value: function value(e) {
        var n = this,
            t = this.connections[e.name];
        return t || (t = new w(window, e), e.addEventListener("unload", function () {
          var t = n.connections[e.name];
          t && t.close(), delete n.connections[e.name];
        }), this.connections[e.name] = t), t;
      }
    }]), e;
  }();

  var m = function m(e, n) {
    if (e) throw new Error("Assert Violation: ".concat(n));
  };

  function E(e, n, t) {
    t.mutated || (t.mutated = new Set(), Promise.resolve().then(function (e, n) {
      var t = new Set(),
          r = n.mutated;
      delete n.mutated, r.forEach(function (r) {
        var o = function (e, n) {
          var t = e[n.head];
          if (!n.tail) return t;

          for (var r = n.tail, o = 0, s = r.length; o < s && null != t; o++) {
            var a = r[o];
            if ("object" !== i$1(t) || !(a in t)) return;
            t = t[a];
          }

          return t;
        }(e, r);

        if (n.values[r.reference] !== o) {
          n.values[r.reference] = o;

          for (var s = n.listeners[r.head], a = 0, c = s.length; a < c; a++) {
            t.add(s[a]);
          }
        }
      }), o = t, s = n.values, o.forEach(function (e) {
        var n = e.listener,
            t = e.statics,
            r = e.reactives,
            i = Object.create(null);
        if (r) for (var o = Object.keys(r), a = 0, c = o.length; a < c; a++) {
          var u = o[a],
              f = s[r[u]];
          i[u] = f;
        }
        var l = Object.assign({}, t, i);
        n.call(void 0, l);
      });
      var o, s;
    }.bind(void 0, e, t))), t.mutated.add(n);
  }

  function O(e, n, t) {
    var r = E.bind(void 0, e, n, t),
        i = function (e, n, t) {
      var r,
          i,
          o,
          s = function e(n, t, r) {
        r = r || [];
        if (!n || r.indexOf(n) > -1) return null;
        var i = Object.getOwnPropertyDescriptor(n, t);
        if (i) return i;
        var o = Object.getPrototypeOf(n);
        if (!o) return null;
        r.push(n);
        return e(o, t, r);
      }(e, n);

      if (null === s || void 0 === s.get && void 0 === s.set) {
        var a = e[n];
        r = !0, i = function i() {
          return a;
        }, o = function o(e) {
          a = e, t();
        };
      } else {
        var c = s.set,
            u = s.get;
        r = s.enumerable, o = function o(n) {
          c && c.call(e, n), t();
        }, i = function i() {
          return u ? u.call(e) : void 0;
        };
      }

      return {
        set: o,
        get: i,
        enumerable: r,
        configurable: !0
      };
    }(e, n.head, r);

    Object.defineProperty(e, n.head, i);
  }

  function x(e, n) {
    var t = e.indexOf(n);
    t > -1 && e.splice(t, 1);
  }

  function _(e) {
    if (!e.includes(".")) return {
      reference: e,
      head: e
    };
    var n = e.split(".");
    return {
      reference: e,
      head: n.shift(),
      tail: n
    };
  }

  !function () {
    function e(n, t, r, i, s) {
      o$1(this, e), this._cmp = n, this._def = t, this._context = r, this._wireDef = i, this._wireTarget = s;
    }

    a$1(e, [{
      key: "addEventListener",
      value: function value(e, n) {
        var t = this;

        switch (e) {
          case "connect":
            var r = this._context["@wire"].connected;
            "production" !== process.env.NODE_ENV && m(r.includes(n), 'must not call addEventListener("connect") with the same listener'), r.push(n);
            break;

          case "disconnect":
            var i = this._context["@wire"].disconnected;
            "production" !== process.env.NODE_ENV && m(i.includes(n), 'must not call addEventListener("disconnect") with the same listener'), i.push(n);
            break;

          case "config":
            var o,
                s = this._wireDef.params,
                a = this._wireDef.static;

            if (!s || 0 === (o = Object.keys(s)).length) {
              var c = a || Object.create(null);
              return void n.call(void 0, c);
            }

            var u = {
              listener: n,
              statics: a,
              reactives: s
            },
                f = this._context["@wire"].updated;
            o.forEach(function (e) {
              var n = _(s[e]),
                  r = f.listeners[n.head];

              r ? r.push(u) : (r = [u], f.listeners[n.head] = r, O(t._cmp, n, f)), E(t._cmp, n, f);
            });
            break;

          default:
            throw new Error("unsupported event type ".concat(e));
        }
      }
    }, {
      key: "removeEventListener",
      value: function value(e, n) {
        switch (e) {
          case "connect":
            x(this._context["@wire"].connected, n);
            break;

          case "disconnect":
            x(this._context["@wire"].disconnected, n);
            break;

          case "config":
            var t = this._context["@wire"].updated.listeners,
                r = this._wireDef.params;
            r && Object.keys(r).forEach(function (e) {
              var i = _(r[e]),
                  o = t[i.head];

              o && function (e, n) {
                for (var t = 0, r = e.length; t < r; t++) {
                  if (e[t].listener === n) return void e.splice(t, 1);
                }
              }(o, n);
            });
            break;

          default:
            throw new Error("unsupported event type ".concat(e));
        }
      }
    }, {
      key: "dispatchEvent",
      value: function value(e) {
        if (e instanceof k) {
          var n = e.value;
          return this._wireDef.method ? this._cmp[this._wireTarget](n) : this._cmp[this._wireTarget] = n, !1;
        }

        if ("WireContextEvent" === e.type) return this._cmp.dispatchEvent(e);
        throw new Error("Invalid event ".concat(e, "."));
      }
    }]);
  }();

  var k = function e(n) {
    o$1(this, e), this.type = "ValueChangedEvent", this.value = n;
  };

  function j(e, n) {
    var t = e[n];

    if (null != t) {
      if ("function" != typeof t) throw new TypeError(t + " is not a function");
      return t;
    }
  }

  function P(e) {
    var n = e._cleanup;
    n && (e._cleanup = void 0, n());
  }

  function C(e) {
    return void 0 === e._observer;
  }

  var T = function () {
    function e(n, t) {
      o$1(this, e), this._observer = n, this._cleanup = void 0;
      var r,
          i = new W(this);

      try {
        var s = t.call(void 0, i);

        if (null != s) {
          if ("function" == typeof s.unsubscribe) r = s, s = function s() {
            r.unsubscribe();
          };else if ("function" != typeof s) throw new TypeError(s + " is not a function");
          this._cleanup = s;
        }
      } catch (e) {
        return void i.error(e);
      }

      C(this) && P(this);
    }

    return a$1(e, [{
      key: "unsubscribe",
      value: function value() {
        var e;
        C(e = this) || (e._observer = void 0, P(e));
      }
    }, {
      key: "closed",
      get: function get() {
        return C(this);
      }
    }]), e;
  }(),
      W = function () {
    function e(n) {
      o$1(this, e), this._subscription = n;
    }

    return a$1(e, [{
      key: "next",
      value: function value(e) {
        var n = this._subscription;

        if (!C(n)) {
          var t = n._observer,
              r = j(t, "next");
          r && r.call(t, e);
        }
      }
    }, {
      key: "error",
      value: function value(e) {
        var n = this._subscription;

        if (!C(n)) {
          var t = n._observer;
          n._observer = void 0;
          var r = j(t, "error");
          r && r.call(t, e), P(n);
        }
      }
    }, {
      key: "complete",
      value: function value() {
        var e = this._subscription;

        if (!C(e)) {
          var n = e._observer;
          e._observer = void 0;

          try {
            var t = j(n, "complete");
            t && t.call(n);
          } catch (e) {}

          P(e);
        }
      }
    }, {
      key: "closed",
      get: function get() {
        return C(this._subscription);
      }
    }]), e;
  }(),
      S = function () {
    function e(n) {
      if (o$1(this, e), "function" != typeof n) throw new TypeError("Observable initializer must be a function");
      this._subscriber = n;
    }

    return a$1(e, [{
      key: "subscribe",
      value: function value(e) {
        return "function" == typeof e ? e = {
          next: e,
          error: arguments.length <= 1 ? void 0 : arguments[1],
          complete: arguments.length <= 2 ? void 0 : arguments[2]
        } : "object" !== i$1(e) && (e = {}), new T(e, this._subscriber);
      }
    }], [{
      key: "from",
      value: function value(n) {
        var t = "function" == typeof this ? this : e;
        if (null == n) throw new TypeError(n + " is not an object");
        var r = j(n, Symbol.observable);

        if (r) {
          var i = r.call(n);
          if (Object(i) !== i) throw new TypeError(i + " is not an object");
          return i.constructor === t ? i : new t(function (e) {
            return i.subscribe(e);
          });
        }

        if (!(r = j(n, Symbol.iterator))) throw new TypeError(n + " is not observable");
        return new t(function (e) {
          var t = !0,
              i = !1,
              o = void 0;

          try {
            for (var s, a = r.call(n)[Symbol.iterator](); !(t = (s = a.next()).done); t = !0) {
              var c = s.value;
              if (e.next(c), e.closed) return;
            }
          } catch (e) {
            i = !0, o = e;
          } finally {
            try {
              t || null == a.return || a.return();
            } finally {
              if (i) throw o;
            }
          }

          e.complete();
        });
      }
    }, {
      key: "of",
      value: function value() {
        for (var n = arguments.length, t = new Array(n), r = 0; r < n; r++) {
          t[r] = arguments[r];
        }

        return new ("function" == typeof this ? this : e)(function (e) {
          for (var n = 0; n < t.length; ++n) {
            if (e.next(t[n]), e.closed) return;
          }

          e.complete();
        });
      }
    }]), e;
  }(),
      L = function () {
    function e() {
      o$1(this, e), this.observers = [];
    }

    return a$1(e, [{
      key: "createObservable",
      value: function value() {
        var e = this;
        return new S(function (n) {
          return e.addObserver(n);
        });
      }
    }, {
      key: "addObserver",
      value: function value(e) {
        var n = this;
        return this.observers.push(e), function () {
          var t = n.observers.indexOf(e);
          t > -1 && n.observers.splice(t, 1);
        };
      }
    }, {
      key: "emit",
      value: function value(e, n) {
        this.observers.forEach(function (t) {
          n ? t.error(n) : t.next(e);
        });
      }
    }]), e;
  }();

  function insertComponent(_ref) {
    var beforeId = _ref.beforeId,
        containerId = _ref.containerId,
        component = _ref.component;
    var regionWrapperEl = f.querySelector(document, ".interactions-region[data-item-id=\"".concat(containerId, "\"]")).parentNode.host;
    var beforeComponentWrapperEl = beforeId ? f.querySelector(document, ".interactions-component[data-item-id=\"".concat(beforeId, "\"]")).parentNode.host : null;
    var dropzoneEl = findDropzoneEl({
      beforeId: beforeId,
      regionWrapperEl: regionWrapperEl,
      beforeComponentWrapperEl: beforeComponentWrapperEl
    });
    insertItemToDropzoneEl({
      dropzoneEl: dropzoneEl,
      itemEl: component,
      beforeComponentWrapperEl: beforeComponentWrapperEl
    });
  }

  function findDropzoneEl(_ref2) {
    var beforeId = _ref2.beforeId,
        regionWrapperEl = _ref2.regionWrapperEl,
        beforeComponentWrapperEl = _ref2.beforeComponentWrapperEl;
    var dropzoneEl = null;

    if (beforeId) {
      dropzoneEl = f.querySelectorAll(regionWrapperEl, '.dropzone').find(function (el) {
        return f.querySelectorAll(el, ".interactions-component[data-item-id=\"".concat(beforeId, "\"]")).length > 0;
      });

      if (!dropzoneEl) {
        var indexOfBeforeComponentWrapperEl = Array.from(regionWrapperEl.children).indexOf(beforeComponentWrapperEl);
        var dropzoneWrapper = regionWrapperEl.children[indexOfBeforeComponentWrapperEl - 1];
        var dropzone = dropzoneWrapper.shadowRoot.querySelector('.dropzone');

        if (dropzone && dropzone.classList.contains('dropzone')) {
          dropzoneEl = dropzone;
        }
      }
    } else {
      var dropzoneEls = f.querySelectorAll(regionWrapperEl, '.dropzone');
      dropzoneEl = dropzoneEls.length > 0 ? dropzoneEls[dropzoneEls.length - 1] : null;
    }

    return dropzoneEl;
  }

  function insertItemToDropzoneEl(_ref3) {
    var dropzoneEl = _ref3.dropzoneEl,
        itemEl = _ref3.itemEl,
        beforeComponentWrapperEl = _ref3.beforeComponentWrapperEl;

    if (beforeComponentWrapperEl) {
      if (Array.from(dropzoneEl.children).includes(beforeComponentWrapperEl.shadowRoot.host)) {
        dropzoneEl.insertBefore(itemEl, beforeComponentWrapperEl);
      } else {
        dropzoneEl.appendChild(itemEl);
      }
    } else {
      dropzoneEl.appendChild(itemEl);
    }
  }

  function createComponent(properties) {
    return new Promise(function (resolve) {
      componentService.createElement('talondesign/componentWrapper').then(function (componentWrapperEl) {
        Object.assign(componentWrapperEl, properties);
        resolve(componentWrapperEl);
      });
    });
  }

  function isElementVisible(element) {
    return element.offsetWidth > 0 && element.offsetHeight > 0;
  }

  function updateRegions() {
    var regions = f.querySelectorAll(document, 'talondesign-region-wrapper');
    regions.forEach(function (region) {
      return updateRegion(region);
    });
  }

  function updateRegion(region) {
    var manual = f.querySelector(region, '.manual');
    var isEmpty = f.querySelector(region, '.ui-widget') === null;
    manual.style.display = isEmpty ? '' : 'none';
  }

  function toggleInteractions(isEnabled, interactionsCore) {
    window.interactionsEnabled = isEnabled;

    if (isEnabled) {
      interactionsCore.enable();
    } else {
      interactionsCore.disable();
    }
  }

  var cachedPostMessage;

  function startPostMessage() {
    if (cachedPostMessage) {
      return cachedPostMessage;
    }

    cachedPostMessage = new w(window, window.parent);
    return cachedPostMessage;
  }

  function startPostMessageListeners(_ref) {
    var postMessage = _ref.postMessage,
        interactions = _ref.interactions,
        componentSelector = _ref.componentSelector;
    postMessage.listenFor('set-interactions', function (enabled) {
      toggleInteractions(enabled, interactions);
    });
    postMessage.listenFor('cb-dnd-move-item', function (data) {
      var _data$data = data.data,
          beforeId = _data$data.beforeId,
          container = _data$data.container,
          item = _data$data.item;
      var componentWrapperEl = f.querySelector(document, "".concat(componentSelector, "[data-item-id=\"").concat(item, "\"]")).parentNode.host;
      insertComponent({
        beforeId: beforeId,
        containerId: container,
        component: componentWrapperEl
      });
      interactions.selectComponent(item);
      updateRegions();
    });
    postMessage.listenFor('cb-dnd-delete-item', function (data) {
      var results = data.results;
      interactions.deleteComponent(results.DeletedItemID);
      updateRegions();
    });
    postMessage.listenFor('drag-start', function (data) {
      interactions.dragStart({
        mouseX: data.x,
        mouseY: data.y
      });
    });
    postMessage.listenFor('drag-mouse-position', function (data) {
      interactions.dragUpdate({
        mouseX: data.x,
        mouseY: data.y
      });
    });
    postMessage.listenFor('drag-end', function (data) {
      var result = interactions.dragEnd({
        mouseX: data.x,
        mouseY: data.y
      });
      var beforeId = result.position && result.position.beforeId;
      var containerId = result.container.key;
      postMessage.send('drop-item', {
        argument: data.argument,
        type: data.argument.properties.connectorType,
        container: containerId,
        beforeId: beforeId
      });
    });
    postMessage.listenFor('cb-dnd-drop-item', function (data) {
      var _data$data2 = data.data,
          argument = _data$data2.argument,
          beforeId = _data$data2.beforeId,
          container = _data$data2.container;
      var CurrentItemID = data.results.CurrentItemID;
      var fqn = argument.properties.fqn;
      createComponent({
        componentName: fqn.replace(':', '/'),
        label: argument.label || fqn,
        componentAttributes: data.results.PropertiesJSON.Value,
        componentId: CurrentItemID,
        isLocked: false
      }).then(function (componentWrapperEl) {
        insertComponent({
          beforeId: beforeId,
          containerId: container,
          component: componentWrapperEl
        });
        interactions.selectComponent(CurrentItemID);
        updateRegions();
      });
    });
    postMessage.listenFor('cb-prop-changed', function (data) {
      var id = data.id,
          _data$props = data.props,
          props = _data$props === void 0 ? {} : _data$props;
      var origComponentWrapperEl = f.querySelector(document, "".concat(componentSelector, "[data-item-id=\"").concat(id, "\"]")).parentNode.host;
      createComponent({
        componentAttributes: props,
        componentId: origComponentWrapperEl.componentId,
        componentName: origComponentWrapperEl.componentName,
        label: origComponentWrapperEl.label,
        isLocked: origComponentWrapperEl.isLocked
      }).then(function (componentWrapperEl) {
        if (origComponentWrapperEl.parentNode && !origComponentWrapperEl.parentNode.classList.contains('dropzone')) {
          var origComponentWrapperSiblings = origComponentWrapperEl.parentNode.children;
          var indexOfOrig = Array.from(origComponentWrapperSiblings).indexOf(origComponentWrapperEl);
          var dropzoneWrapper = Array.from(origComponentWrapperSiblings)[indexOfOrig - 1];
          var dropzoneEl = f.querySelector(dropzoneWrapper, '.dropzone');
          interactions.deleteComponent(id);
          dropzoneEl.appendChild(componentWrapperEl);
          interactions.scan();
          interactions.selectComponent(id);
        } else {
          var _dropzoneEl = f.querySelectorAll(document, '.dropzone').find(function (el) {
            return f.querySelectorAll(el, "".concat(componentSelector, "[data-item-id=\"").concat(id, "\"]")).length > 0;
          });

          var childEls = Array.from(_dropzoneEl.childNodes);

          var _indexOfOrig = childEls.indexOf(origComponentWrapperEl);

          interactions.deleteComponent(id);

          _dropzoneEl.insertBefore(componentWrapperEl, childEls[_indexOfOrig + 1]);

          interactions.scan();
          interactions.selectComponent(id);
        }
      });
    });
    postMessage.listenFor('get-scroll-position', function () {
      var yOffset = window.pageYOffset;
      var xOffset = window.pageXOffset;
      var result = {
        top: yOffset,
        left: xOffset,
        bottom: document.documentElement.scrollHeight - yOffset - window.innerHeight,
        right: document.documentElement.scrollWidth - xOffset - window.innerWidth
      };
      postMessage.send('scroll-positions', result);
    });
    postMessage.listenFor('cb-request-element-attributes', function (itemId) {
      var itemEl = f.querySelector(document, "".concat(componentSelector, "[data-item-id=\"").concat(itemId, "\"]"));

      if (itemEl) {
        postMessage.send('cb-response-element-attributes', {
          allowDelete: false,
          fqn: itemEl.getAttribute('data-fqn'),
          id: itemEl.getAttribute('data-item-id'),
          isInTabset: false,
          isInThemeRegion: false,
          label: itemEl.getAttribute('data-component-label')
        });
      }
    });
    postMessage.listenFor('select-element', function (itemId) {
      interactions.selectComponent(itemId);
    });
  }

  function startWindowListeners(interactionsCore) {
    window.addEventListener('set-interactions', function (event) {
      toggleInteractions(event.detail && event.detail.interactionsEnabled, interactionsCore);
    });
  }

  function startRouteListeners(postMessage, interactionsCore) {
    routingService.subscribe(function () {
      var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
          _ref2$attributes = _ref2.attributes,
          attributes = _ref2$attributes === void 0 ? {} : _ref2$attributes,
          _ref2$state = _ref2.state,
          state = _ref2$state === void 0 ? {} : _ref2$state;

      var currentRoute = arguments.length > 1 ? arguments[1] : undefined;

      var currentParams = _objectSpread({}, state, attributes);

      interactionsCore.invalidateAllElementCache();

      if (window.interactionsEnabled) {
        interactionsCore.enable();
      } else {
        interactionsCore.disable();
      }

      postMessage.send('route-change-success', {
        routeId: currentRoute.id,
        routeParams: currentParams,
        routeUrl: currentRoute.path,
        viewId: currentRoute.viewId
      });
    });
  }

  var BASE_Z_INDEX = 999;

  var getComponentHandler = function getComponentHandler() {
    return {
      init: function init() {},
      enable: function enable(_ref) {
        var element = _ref.element;
        Object.assign(element.style, {
          'margin-bottom': '15px'
        });
      },
      disable: function disable(_ref2) {
        var element = _ref2.element;
        Object.assign(element.style, {
          'margin-bottom': ''
        });
      }
    };
  };

  var getRegionHandler = function getRegionHandler() {
    return {
      init: function init() {},
      enable: function enable(_ref3) {
        var element = _ref3.element;
        Object.assign(element.style, {
          border: '1px dashed #bbbbbb',
          margin: '15px',
          padding: '15px',
          'padding-bottom': 0,
          'min-height': '50px'
        });
        var manual = element.querySelector('.manual');

        while (manual.firstChild) {
          manual.removeChild(manual.firstChild);
        }

        var label = document.createElement('div');
        label.classList.add('region-label');
        Object.assign(label.style, {
          'text-align': 'center',
          'font-style': 'italic',
          color: '#667889'
        });
        label.textContent = element.getAttribute('data-region-name');
        manual.appendChild(label);
        updateRegion(element);
      },
      disable: function disable(_ref4) {
        var element = _ref4.element;
        Object.assign(element.style, {
          border: '',
          margin: '',
          padding: '',
          'min-height': ''
        });
        var manual = element.querySelector('.manual');

        while (manual.firstChild) {
          manual.removeChild(manual.firstChild);
        }
      }
    };
  };

  var getProxyHandlerMap = function getProxyHandlerMap(postMessage) {
    return {
      region: {
        init: function init(_ref5) {
          var element = _ref5.element;
          var label = document.createElement('div');
          label.classList.add('proxy-select-label');
          Object.assign(label.style, {
            position: 'absolute',
            padding: '0 10px',
            'background-color': '#04844b',
            color: 'white',
            height: '26px',
            'user-select': 'none',
            'border-radius': '3px 3px 0 0',
            display: 'flex',
            'align-items': 'center',
            'justify-content': 'center'
          });
          element.appendChild(label);
        },
        enable: function enable(_ref6) {
          var element = _ref6.element,
              params = _ref6.params;
          var region = params.payload.element;
          var rect = region.element.getBoundingClientRect();
          var style = {
            display: '',
            width: "".concat(rect.width, "px"),
            height: "".concat(rect.height, "px"),
            outline: '2px solid #04844b',
            position: 'absolute',
            left: "".concat(window.scrollX + rect.left, "px"),
            top: "".concat(window.scrollY + rect.top, "px"),
            zIndex: BASE_Z_INDEX - 1
          };
          element.setAttribute('data-item-id', region.key);

          if (isElementVisible(region.element) && isElementVisible(element)) {
            var label = element.querySelector('.proxy-select-label');
            label.style.visibility = '';
            label.textContent = region.element.getAttribute('data-region-name');
            var labelRect = label.getBoundingClientRect();
            label.style.top = "-".concat(labelRect.height, "px");
            label.style.left = "calc(50% - ".concat(labelRect.width / 2, "px)");
          }

          Object.assign(element.style, style);
        },
        disable: function disable(_ref7) {
          var element = _ref7.element;
          element.style.display = 'none';
        }
      },
      component: {
        init: function init(_ref8) {
          var element = _ref8.element;
          var label = document.createElement('div');
          label.classList.add('proxy-select-label');
          Object.assign(label.style, {
            position: 'absolute',
            padding: '0 10px',
            'background-color': '#0059A7',
            color: 'white',
            height: '26px',
            'user-select': 'none',
            'border-radius': '3px 3px 0 0',
            display: 'flex',
            'align-items': 'center',
            'justify-content': 'center'
          });
          element.appendChild(label);
          var toolbox = document.createElement('div');
          toolbox.classList.add('proxy-select-toolbox');
          Object.assign(toolbox.style, {
            position: 'absolute',
            top: '0',
            right: '0',
            display: 'flex',
            'user-select': 'none'
          });
          element.appendChild(toolbox);
          var toolboxDelete = document.createElement('div');
          toolboxDelete.classList.add('proxy-select-toolbox-item', 'proxy-select-toolbox-delete');
          toolboxDelete.textContent = 'x';
          Object.assign(toolboxDelete.style, {
            height: '20px',
            width: '20px',
            'background-color': '#0059A7',
            color: 'white',
            display: 'flex',
            'align-items': 'center',
            'justify-content': 'center',
            'line-height': '20px'
          });
          toolbox.appendChild(toolboxDelete);
          toolboxDelete.addEventListener('mousedown', function () {
            var itemId = element.getAttribute('data-item-id');
            postMessage.send('delete-item', {
              itemid: itemId
            });
          });
          return element;
        },
        enable: function enable(_ref9) {
          var element = _ref9.element,
              params = _ref9.params;
          var component = params.payload.element;
          element.setAttribute('data-item-id', component.element.getAttribute('data-item-id'));
          var rect = component.element.getBoundingClientRect();
          var style = {
            display: '',
            width: "".concat(rect.width, "px"),
            height: "".concat(rect.height, "px"),
            'box-shadow': '0 0 0 2px #0059A7',
            position: 'absolute',
            top: "".concat(window.scrollY + rect.top, "px"),
            left: "".concat(window.scrollX + rect.left, "px"),
            zIndex: BASE_Z_INDEX,
            cursor: 'pointer'
          };
          Object.assign(element.style, style);
          element.setAttribute('data-item-id', component.key);

          if (isElementVisible(component.element) && isElementVisible(element)) {
            var label = element.querySelector('.proxy-select-label');
            label.style.visibility = '';
            label.textContent = component.element.getAttribute('data-component-label');
            var labelRect = label.getBoundingClientRect();
            label.style.top = "-".concat(labelRect.height, "px");
            label.style.left = "calc(50% - ".concat(labelRect.width / 2, "px)");
          }
        },
        disable: function disable(_ref10) {
          var element = _ref10.element;
          element.style.display = 'none';
        }
      },
      componentClone: {
        init: function init() {},
        enable: function enable(_ref11) {
          var element = _ref11.element,
              params = _ref11.params;
          var component = params.payload.element;
          var rect = component.element.getBoundingClientRect();
          var style = {
            display: 'block',
            position: 'fixed',
            left: "".concat(params.payload.x - rect.width / 2, "px"),
            top: "".concat(params.payload.y - rect.height / 2, "px"),
            height: "".concat(rect.height, "px"),
            width: "".concat(rect.width, "px"),
            border: '2px solid #d4d4d4',
            backgroundColor: '#f3f3f3',
            opacity: 0.5,
            zIndex: BASE_Z_INDEX + 3
          };
          Object.assign(element.style, style);
        },
        disable: function disable(_ref12) {
          var element = _ref12.element;
          element.style.display = 'none';
        }
      },
      componentHover: {
        init: function init(_ref13) {
          var element = _ref13.element;
          var label = document.createElement('div');
          label.classList.add('proxy-select-label');
          Object.assign(label.style, {
            position: 'absolute',
            padding: '0 10px',
            'background-color': '#0069c6',
            color: 'white',
            height: '26px',
            'user-select': 'none',
            'border-radius': '3px 3px 0 0',
            display: 'flex',
            'align-items': 'center',
            'justify-content': 'center'
          });
          element.appendChild(label);
        },
        enable: function enable(_ref14) {
          var element = _ref14.element,
              params = _ref14.params;
          var component = params.payload.element;
          var rect = component.element.getBoundingClientRect();
          var style = {
            display: '',
            width: "".concat(rect.width, "px"),
            height: "".concat(rect.height, "px"),
            'box-shadow': '0 0 0 2px #0069c6',
            position: 'absolute',
            top: "".concat(window.scrollY + rect.top, "px"),
            left: "".concat(window.scrollX + rect.left, "px"),
            zIndex: BASE_Z_INDEX + 1
          };
          Object.assign(element.style, style);

          if (isElementVisible(element) && isElementVisible(component.element)) {
            var label = element.querySelector('.proxy-select-label');
            label.style.visibility = '';
            label.textContent = component.element.getAttribute('data-component-label');
            var labelRect = label.getBoundingClientRect();
            label.style.top = "-".concat(labelRect.height, "px");
            label.style.left = "calc(50% - ".concat(labelRect.width / 2, "px)");
          }
        },
        disable: function disable(_ref15) {
          var element = _ref15.element;
          element.style.display = 'none';
        }
      },
      drop: {
        init: function init() {},
        enable: function enable(_ref16) {
          var element = _ref16.element,
              params = _ref16.params;
          var position = params.payload.position;

          if (position) {
            var x = position.x,
                y = position.y,
                width = position.width;
            var style = {
              left: "".concat(window.scrollX + x, "px"),
              top: "".concat(window.scrollY + y, "px"),
              width: "".concat(width, "px"),
              position: 'absolute',
              height: "0px",
              borderTop: '1px solid #0059A7',
              backgroundColor: '#0059A7',
              zIndex: BASE_Z_INDEX + 2,
              display: ''
            };
            Object.assign(element.style, style);
          } else {
            element.style.display = 'none';
          }
        },
        disable: function disable(_ref17) {
          var element = _ref17.element;
          element.style.display = 'none';
        }
      }
    };
  };

  var COMPONENT_SELECTOR = '.interactions-component';
  var REGION_SELECTOR = '.interactions-region';

  function start() {
    var postMessage = startPostMessage();
    postMessage.send('live-loaded');
    var instance = new g({
      key: 'talon',
      scope: document,
      configuration: {
        componentSelector: COMPONENT_SELECTOR,
        regionSelector: REGION_SELECTOR,
        dropHandler: function dropHandler(drop) {
          if (drop.element) {
            var beforeId = drop.position && drop.position.beforeId;
            var containerId = drop.container.key;
            var itemId = drop.element.key;
            postMessage.send('move-item', {
              beforeId: beforeId,
              container: containerId,
              item: itemId
            });
          }
        },
        selectHandler: function selectHandler(current) {
          if (current && current.key) {
            postMessage.send('select-item', {
              id: current.key
            });
          } else {
            postMessage.send('unselect-element');
          }
        },
        getRegionKey: function getRegionKey(element) {
          return element.getAttribute('data-item-id');
        },
        getComponentKey: function getComponentKey(element) {
          return element.getAttribute('data-item-id');
        }
      },
      handlers: {
        componentHandler: getComponentHandler(),
        regionHandler: getRegionHandler(),
        proxyHandlerMap: getProxyHandlerMap(postMessage)
      }
    });
    instance.poll(100);
    startRouteListeners(postMessage, instance);
    startWindowListeners(instance);
    startPostMessageListeners({
      postMessage: postMessage,
      interactions: instance,
      componentSelector: COMPONENT_SELECTOR
    });
  }

  document.addEventListener('DOMContentLoaded', function () {
    start();
  });
  var designmode = {
    start: start
  };

  var designmode$1 = {
    designmode: designmode
  };

  return designmode$1;

}(Talon.componentService,Talon.routingService));
