@dooboostore/dom-render/dist/esm/events/EventManager.js

html view template engine

import { ScriptUtils } from "@dooboostore/core-web";
import { ElementUtils } from "@dooboostore/core-web";
import { Range } from "@dooboostore/core";
import { getDomRenderConfig } from "../DomRenderProxy.js";
import { ObjectUtils } from "@dooboostore/core";
const _EventManager = class _EventManager {
  constructor(window) {
    this.window = window;
    this.eventNames = ["click", "mousedown", "mouseup", "dblclick", "mouseover", "mouseout", "mousemove", "mouseenter", "mouseleave", "contextmenu", "keyup", "keydown", "keypress", "toggle", "change", "input", "submit", "resize", "focus", "blur", "close", "cancel", "scroll"];
    this.delegatableEventMap = {
      mouseleave: "mouseout",
      mouseenter: "mouseover",
      focus: "focusin",
      blur: "focusout"
    };
    this.directAttachEvents = /* @__PURE__ */ new Set(["close", "scroll"]);
    this.bindScript = `
        const ${_EventManager.VALUE_VARNAME} = this.__render.value;
        const ${_EventManager.SCRIPTS_VARNAME} = this.__render.scripts;
        const ${_EventManager.RANGE_VARNAME} = this.__render.range;
        const ${_EventManager.ROUTER_VARNAME} = this.__render.router;
        const ${_EventManager.ATTRIBUTE_VARNAME} = this.__render.attribute;
        const ${_EventManager.ELEMENT_VARNAME} = this.__render.element;
        const ${_EventManager.COMPONENT_VARNAME} = this.__render.element.component;
        const ${_EventManager.TARGET_VARNAME} = this.__render.target;
        const ${_EventManager.EVENT_VARNAME} = this.__render.event;
    `;
    this.eventNames.forEach((it) => {
      _EventManager.attrNames.push(_EventManager.attrPrefix + "event-" + it);
    });
    _EventManager.attrNames.push(_EventManager.onRenderedInitAttrName);
    if (typeof window !== "undefined") {
      _EventManager.WINDOW_EVENTS.forEach((eventName) => {
        window?.addEventListener(eventName, (event) => {
          const targetAttr = `dr-window-event-${eventName}`;
          document.querySelectorAll(`[${targetAttr}]`).forEach((it) => {
            const script = it.getAttribute(targetAttr);
            if (script) {
              const obj = this.findComponentInstance(it);
              const config = getDomRenderConfig(obj);
              ScriptUtils.evaluate(`${this.bindScript} ${script} `, this.createExecutionContext(event, it, obj, config));
            }
          });
        });
      });
      const rootElement = this.window.document;
      const listeningEvents = /* @__PURE__ */ new Set();
      this.eventNames.forEach((eventName) => {
        if (this.directAttachEvents.has(eventName)) {
          return;
        }
        const delegatedEventName = this.delegatableEventMap[eventName] || eventName;
        if (listeningEvents.has(delegatedEventName)) {
          return;
        }
        listeningEvents.add(delegatedEventName);
        rootElement.addEventListener(delegatedEventName, this.handleEvent.bind(this), true);
      });
    }
  }
  handleEvent(event) {
    const handlers = this.collectHandlers(event);
    for (const handler of handlers) {
      if (event.cancelBubble) {
        break;
      }
      const componentInstance = this.findComponentInstance(handler.element);
      if (!componentInstance) {
        continue;
      }
      this.executeHandler(event, handler, componentInstance);
    }
  }
  collectHandlers(event) {
    const handlers = [];
    const root = this.window.document;
    if (!root) return handlers;
    const initialTarget = event.target;
    let currentTarget = initialTarget.nodeType === 1 ? initialTarget : initialTarget.parentElement;
    const collectedElements = /* @__PURE__ */ new Set();
    const eventMap = {
      mouseout: "mouseleave",
      mouseover: "mouseenter",
      focusout: "blur",
      focusin: "focus"
    };
    const mappedEventName = eventMap[event.type] || event.type;
    while (currentTarget) {
      if (collectedElements.has(currentTarget)) {
        break;
      }
      const matchingLinkAttr = _EventManager.linkAttrs.find((la) => la.event === mappedEventName && currentTarget?.hasAttribute(la.name));
      if (matchingLinkAttr) {
        handlers.push({
          element: currentTarget,
          attr: matchingLinkAttr.name,
          type: "link",
          priority: 1,
          property: matchingLinkAttr.property
        });
      }
      const eventAttr = `${_EventManager.attrPrefix}event-${mappedEventName}`;
      if (currentTarget.hasAttribute(eventAttr)) {
        handlers.push({
          element: currentTarget,
          attr: eventAttr,
          type: "event",
          priority: 2
        });
      }
      const eventParamAttr = _EventManager.eventParam;
      if (currentTarget.hasAttribute(eventParamAttr)) {
        const bindEvents = currentTarget.getAttribute(`${eventParamAttr}:bind`);
        if (bindEvents && bindEvents.split(",").map((s) => s.trim()).includes(mappedEventName)) {
          handlers.push({
            element: currentTarget,
            attr: eventParamAttr,
            type: "event-param",
            priority: 3
          });
        }
      }
      collectedElements.add(currentTarget);
      if (currentTarget === root.documentElement) {
        break;
      }
      currentTarget = currentTarget.parentElement;
    }
    return handlers.sort((a, b) => a.priority - b.priority);
  }
  findComponentInstance(element) {
    let current = element;
    const root = this.window.document;
    while (current) {
      if (current.obj) {
        return current.obj;
      }
      if (current === root.documentElement) {
        break;
      }
      current = current.parentElement;
    }
    return this.window;
  }
  createExecutionContext(event, element, componentInstance, config, extraVars = {}) {
    return Object.assign(componentInstance, {
      __render: Object.freeze({
        event,
        element,
        target: event.target,
        attribute: ElementUtils.getAttributeToObject(element),
        router: config?.router,
        range: Range.range,
        scripts: _EventManager.setBindProperty(config?.scripts, componentInstance),
        ...config?.eventVariables,
        ...extraVars
      })
    });
  }
  executeHandler(event, handler, componentInstance) {
    const { element, type, attr } = handler;
    const config = getDomRenderConfig(componentInstance);
    switch (type) {
      case "link":
        const varName = element.getAttribute(attr);
        if (!varName || !handler.property) return;
        if (attr.includes("leave") || attr.includes("enter") || attr.includes("focus") || attr.includes("blur")) {
          const relatedTarget = event.relatedTarget;
          if (relatedTarget && element.contains(relatedTarget)) {
            return;
          }
        }
        const ownerVariablePath = element.getAttribute(_EventManager.ownerVariablePathAttrName);
        let bindObj = componentInstance;
        if (ownerVariablePath) {
          bindObj = ScriptUtils.evaluateReturn(ownerVariablePath, componentInstance);
        }
        const mapScript = element.getAttribute(`${attr}:map`);
        let value = element[handler.property];
        if (mapScript) {
          const context2 = this.createExecutionContext(event, element, bindObj, config, { value });
          value = ScriptUtils.evaluate(`return ${mapScript}`, context2);
        }
        if (typeof this.getValue(componentInstance, varName, bindObj) === "function") {
          this.getValue(componentInstance, varName, bindObj)(value, event);
        } else {
          this.setValue(componentInstance, varName, value);
        }
        break;
      case "event":
        const script = element.getAttribute(attr);
        if (!script) return;
        if (attr.endsWith("mouseleave") || attr.endsWith("mouseenter") || attr.endsWith("blur") || attr.endsWith("focus")) {
          const relatedTarget = event.relatedTarget;
          if (relatedTarget && element.contains(relatedTarget)) {
            return;
          }
        }
        const context = this.createExecutionContext(event, element, componentInstance, config);
        const filterScript = element.getAttribute(`${attr}:filter`);
        let filter = true;
        if (filter) {
          ScriptUtils.evaluate(`${this.getBindScript(config)} ${script}`, context);
        }
        break;
      case "event-param":
        const paramScript = element.getAttribute(attr);
        if (!paramScript) return;
        if (attr.endsWith("mouseleave") || attr.endsWith("mouseenter") || attr.endsWith("blur") || attr.endsWith("focus")) {
          const relatedTarget = event.relatedTarget;
          if (relatedTarget && element.contains(relatedTarget)) {
            return;
          }
        }
        const attributes = ElementUtils.getAttributeToObject(element);
        const params = {};
        const prefix = attr + ":";
        Object.entries(attributes).filter(([k, v]) => k.startsWith(prefix)).forEach(([k, v]) => {
          params[k.slice(prefix.length)] = v;
        });
        const paramContext = this.createExecutionContext(event, element, componentInstance, config, { params });
        ScriptUtils.evaluate(`${this.getBindScript(config)} ${paramScript}`, paramContext);
        break;
    }
  }
  findAttrElements(fragment, config) {
    const elements = /* @__PURE__ */ new Set();
    const addAttributes = config?.applyEvents?.map((it) => it.attrName) ?? [];
    const attrs = addAttributes.concat([..._EventManager.attrNames]).filter(Boolean);
    if (attrs.length) {
      const selector = attrs.map((a) => `[${a}]`).join(",");
      fragment?.querySelectorAll(selector).forEach((it) => elements.add(it));
    }
    return elements;
  }
  applyEvent(obj, childNodes, config) {
    childNodes.forEach((node) => {
      if (node.nodeType === 1) {
        node.obj = obj;
      }
    });
    this.procAttr(childNodes, _EventManager.valueAttrName, (it, attribute) => {
      const script = attribute;
      if (script) {
        const data = ObjectUtils.Script.evaluateReturn(script, obj);
        if (it.value !== data) {
          it.value = data;
        }
      }
    });
    this.procAttr(childNodes, _EventManager.srcAttrName, (it, attribute) => {
      const script = attribute;
      if (script) {
        const data = ObjectUtils.Script.evaluateReturn(script, obj);
        if (it.src !== data) {
          it.src = data;
        }
      }
    });
    this.procAttr(childNodes, _EventManager.checkedAttrName, (it, attribute) => {
      const script = attribute;
      if (script) {
        const data = ObjectUtils.Script.evaluateReturn(script, obj);
        if (it.checked !== data) {
          it.checked = data;
        }
      }
    });
    this.procAttr(childNodes, _EventManager.selectedAttrName, (it, attribute) => {
      const script = attribute;
      if (script) {
        const data = ObjectUtils.Script.evaluateReturn(script, obj);
        if (data) {
          it.setAttribute("selected", "selected");
        } else {
          it.removeAttribute("selected");
        }
        if (it.selected !== data) {
          it.selected = data;
        }
      }
    });
    this.procAttr(childNodes, _EventManager.readonlyAttrName, (it, attribute) => {
      const script = attribute;
      if (script) {
        const data = ObjectUtils.Script.evaluateReturn(script, obj);
        if (data) {
          it.setAttribute("readonly", "readonly");
        } else {
          it.removeAttribute("readonly");
        }
        if (it.readOnly !== data) {
          it.readOnly = data;
        }
      }
    });
    this.procAttr(childNodes, _EventManager.disabledAttrName, (it, attribute) => {
      const script = attribute;
      if (script) {
        const data = ObjectUtils.Script.evaluateReturn(script, obj);
        if (data) {
          it.setAttribute("disabled", "disabled");
        } else {
          it.removeAttribute("disabled");
        }
        if (it.disabled !== data) {
          it.disabled = data;
        }
      }
    });
    this.procAttr(childNodes, _EventManager.hiddenAttrName, (it, attribute) => {
      const script = attribute;
      if (script) {
        const data = ObjectUtils.Script.evaluateReturn(script, obj);
        if (data) {
          it.setAttribute("hidden", "hidden");
        } else {
          it.removeAttribute("hidden");
        }
        if (it.hidden !== data) {
          it.hidden = data;
        }
      }
    });
    this.procAttr(childNodes, _EventManager.requiredAttrName, (it, attribute) => {
      const script = attribute;
      if (script) {
        const data = ObjectUtils.Script.evaluateReturn(script, obj);
        if (data) {
          it.setAttribute("required", "required");
        } else {
          it.removeAttribute("required");
        }
        if (it.required !== data) {
          it.required = data;
        }
      }
    });
    this.procAttr(childNodes, _EventManager.openAttrName, (it, attribute) => {
      const script = attribute;
      if (script) {
        const data = ObjectUtils.Script.evaluateReturn(script, obj);
        if (data) {
          it.setAttribute("open", "open");
        } else {
          it.removeAttribute("open");
        }
        if (it.open !== data) {
          it.open = data;
        }
      }
    });
    this.procAttr(childNodes, _EventManager.normalAttrMapAttrName, (it, attribute) => {
      const map = new Map(JSON.parse(attribute));
      map.forEach((v, k) => {
        const variablePaths = v.variablePaths;
        let targetScript = v.originalAttrValue;
        let script;
        if (v.isStringTemplate) {
          variablePaths.forEach((it2) => {
            let r = ObjectUtils.Path.toOptionalChainPath(it2.inner);
            targetScript = targetScript.replaceAll(it2.origin, `\${${r}}`);
          });
          script = "`" + targetScript + "`";
        } else {
          variablePaths.forEach((it2) => {
            let r = ObjectUtils.Path.toOptionalChainPath(it2.inner);
            targetScript = targetScript.replaceAll(it2.origin, `${r}`);
          });
          script = targetScript;
        }
        const data = ObjectUtils.Script.evaluate(
          `const $element = this.element;  return ${script}`,
          Object.assign(obj, {
            __render: Object.freeze({
              element: it,
              attribute: ElementUtils.getAttributeToObject(it)
            })
          })
        );
        if (data === null || data === void 0) {
          it.removeAttribute(k);
        } else {
          it.setAttribute(k, data);
        }
      });
    });
    _EventManager.WINDOW_EVENTS.forEach((it) => {
      this.procAttr(childNodes, _EventManager.attrPrefix + "window-event-" + it, (it2, attribute) => {
        it2.obj = obj;
      });
    });
    _EventManager.linkAttrs.forEach((linkInfo) => {
      this.procAttr(childNodes, linkInfo.name, (it, varName) => {
        if (varName) {
          const ownerVariablePathName = it.getAttribute(_EventManager.ownerVariablePathAttrName);
          const mapScript = it.getAttribute(`${linkInfo.name}:map`);
          let bindObj = obj;
          if (ownerVariablePathName) {
            bindObj = ObjectUtils.Script.evaluateReturn(ownerVariablePathName, obj);
          }
          const getValue = this.getValue(obj, varName, bindObj);
          if (typeof getValue === "function" && getValue) {
            let setValue = it[linkInfo.property];
            if (mapScript) {
              setValue = ObjectUtils.Script.evaluate(`${this.getBindScript(config)} return ${mapScript}`, Object.assign(bindObj, { __render: Object.freeze({ element: it, target: bindObj, range: Range.range, value: setValue, scripts: _EventManager.setBindProperty(config?.scripts, obj), ...config?.eventVariables }) }));
            }
            getValue(setValue);
          } else if (getValue) {
            let setValue = getValue;
            if (mapScript) {
              setValue = ObjectUtils.Script.evaluate(`${this.getBindScript(config)} return ${mapScript}`, Object.assign(bindObj, { __render: Object.freeze({ element: it, target: bindObj, range: Range.range, value: setValue, scripts: _EventManager.setBindProperty(config?.scripts, obj), ...config?.eventVariables }) }));
            }
            if (setValue === null) {
              it.removeAttribute(linkInfo.property);
            } else {
              it[linkInfo.property] = setValue;
            }
          } else if (getValue === void 0) {
            this.setValue(obj, varName, it[linkInfo.property]);
          }
        }
      });
    });
    this.directAttachEvents.forEach((eventName) => {
      const attr = `${_EventManager.attrPrefix}event-${eventName}`;
      this.procAttr(childNodes, attr, (element, script) => {
        const handler = (event) => {
          const componentInstance = this.findComponentInstance(element);
          if (!componentInstance) return;
          const context = this.createExecutionContext(event, element, componentInstance, config);
          const filterScript = element.getAttribute(`${attr}:filter`);
          let filter = true;
          if (filterScript) {
            filter = ObjectUtils.Script.evaluate(`${this.getBindScript(config)} return ${filterScript}`, context) ?? false;
          }
          if (filter) {
            ObjectUtils.Script.evaluate(`${this.getBindScript(config)} ${script}`, context);
          }
        };
        element.addEventListener(eventName, handler);
      });
    });
    this.procAttr(childNodes, _EventManager.onInitAttrName, (it, attribute) => {
      let script = attribute;
      if (script) {
        script = "return " + script;
      }
      if (script) {
        ObjectUtils.Script.evaluate(
          `${this.getBindScript(config)}; ${script} `,
          Object.assign(obj, {
            __render: Object.freeze({
              element: it,
              attribute: ElementUtils.getAttributeToObject(it),
              ...config?.eventVariables
            })
          })
        );
      }
    });
    this.onRenderedEvent(obj, childNodes, config);
    this.changeVar(obj, childNodes, void 0, config);
    const elements = Array.from(childNodes).filter((it) => it.nodeType === 1).map((it) => it);
    elements.forEach((it) => {
      config?.applyEvents?.filter((ta) => it.getAttribute(ta.attrName) !== null).forEach((ta) => ta.callBack(it, it.getAttribute(ta.attrName), obj));
    });
  }
  onRenderedEvent(obj, childNodes, config) {
    this.procAttr(childNodes, _EventManager.onRenderedInitAttrName, (it, attribute) => {
      if (!it.isConnected) {
        return;
      }
      let script = attribute;
      if (script) {
        script = "return " + script;
      }
      if (script) {
        ObjectUtils.Script.evaluate(
          `${this.getBindScript(config)}; ${script} `,
          Object.assign(obj, {
            __render: Object.freeze({
              element: it,
              attribute: ElementUtils.getAttributeToObject(it),
              ...config?.eventVariables
            })
          })
        );
      }
    });
  }
  changeVar(obj, elements, varName, config) {
    this.procAttr(elements, _EventManager.styleAttrName, (it, attribute) => {
      let script = attribute;
      if (script) {
        script = "return " + script;
      }
      if (_EventManager.isUsingThisVar(script, varName) || varName === void 0) {
        const data = ObjectUtils.Script.evaluate(
          `const $element = this.__render.element;  ${script} `,
          Object.assign(obj, {
            __render: Object.freeze({
              element: it,
              attribute: ElementUtils.getAttributeToObject(it)
            })
          })
        );
        if (typeof data === "string") {
          data.split(";").forEach((sit) => {
            const [key, value] = sit.split(":").map((s) => s.trim());
            if (key && value) {
              it.style[key] = value;
            }
          });
        } else if (Array.isArray(data)) {
          data.forEach((sit) => {
            const [key, value] = sit.split(":").map((s) => s.trim());
            if (key && value) {
              it.style[key] = value;
            }
          });
        } else if (data) {
          for (const [key, value] of Object.entries(data)) {
            it.style[key] = value === null ? null : String(value);
          }
        }
      }
    });
    this.procAttr(elements, _EventManager.classAttrName, (it, attribute) => {
      let script = attribute;
      if (script) {
        script = "return " + script;
      }
      if (_EventManager.isUsingThisVar(script, varName) || varName === void 0) {
        const data = ObjectUtils.Script.evaluate(
          `const $element = this.element;  ${script} `,
          Object.assign(obj, {
            __render: Object.freeze({
              element: it,
              attribute: ElementUtils.getAttributeToObject(it)
            })
          })
        );
        if (typeof data === "string") {
          data.split(" ").map((it2) => it2.trim()).filter((it2) => it2.length > 0).forEach((cit) => it.classList.add(cit.trim()));
        } else if (Array.isArray(data)) {
          data.map((it2) => it2.trim()).filter((it2) => it2.length > 0).forEach((cit) => it.classList.add(cit.trim()));
        } else if (data) {
          for (const [key, value] of Object.entries(data)) {
            if (it instanceof HTMLElement) {
              const v = key.trim();
              if (value && v) {
                it.classList.add(v);
              } else if (v) {
                it.classList.remove(v);
              }
            }
          }
        }
      }
    });
    this.procAttr(elements, _EventManager.valueAttrName, (it, attribute) => {
      if (_EventManager.isUsingThisVar(attribute, varName) || varName === void 0) {
        const data = ObjectUtils.Script.evaluateReturn(attribute, obj);
        if (it.value !== data) it.value = data;
      }
    });
    this.procAttr(elements, _EventManager.checkedAttrName, (it, attribute) => {
      if (_EventManager.isUsingThisVar(attribute, varName) || varName === void 0) {
        const data = ObjectUtils.Script.evaluateReturn(attribute, obj);
        if (it.checked !== data) it.checked = data;
      }
    });
    this.procAttr(elements, _EventManager.selectedAttrName, (it, attribute) => {
      if (_EventManager.isUsingThisVar(attribute, varName) || varName === void 0) {
        const data = ObjectUtils.Script.evaluateReturn(attribute, obj);
        if (it.selected !== data) it.selected = data;
      }
    });
    this.procAttr(elements, _EventManager.readonlyAttrName, (it, attribute) => {
      if (_EventManager.isUsingThisVar(attribute, varName) || varName === void 0) {
        const data = ObjectUtils.Script.evaluateReturn(attribute, obj);
        if (it.readOnly !== data) it.readOnly = data;
      }
    });
    this.procAttr(elements, _EventManager.disabledAttrName, (it, attribute) => {
      if (_EventManager.isUsingThisVar(attribute, varName) || varName === void 0) {
        const data = ObjectUtils.Script.evaluateReturn(attribute, obj);
        if (it.disabled !== data) it.disabled = data;
      }
    });
    this.procAttr(elements, _EventManager.hiddenAttrName, (it, attribute) => {
      if (_EventManager.isUsingThisVar(attribute, varName) || varName === void 0) {
        const data = ObjectUtils.Script.evaluateReturn(attribute, obj);
        if (it.hidden !== data) it.hidden = data;
      }
    });
    this.procAttr(elements, _EventManager.requiredAttrName, (it, attribute) => {
      if (_EventManager.isUsingThisVar(attribute, varName) || varName === void 0) {
        const data = ObjectUtils.Script.evaluateReturn(attribute, obj);
        if (it.required !== data) it.required = data;
      }
    });
    this.procAttr(elements, _EventManager.openAttrName, (it, attribute) => {
      if (_EventManager.isUsingThisVar(attribute, varName) || varName === void 0) {
        const data = ObjectUtils.Script.evaluateReturn(attribute, obj);
        if (it.open !== data) it.open = data;
      }
    });
  }
  deepAttributeElements(elements = /* @__PURE__ */ new Set(), attrName) {
    const sets = /* @__PURE__ */ new Set();
    elements.forEach((it) => {
      if (!it) {
        return;
      }
      if (it.nodeType === 1) {
        const e = it;
        if (e.hasAttribute(attrName)) {
          sets.add(e);
        }
        e.querySelectorAll(`[${attrName}]`).forEach((it2) => {
          sets.add(it2);
        });
      }
    });
    return sets;
  }
  procAttr(elements = /* @__PURE__ */ new Set(), attrName, callBack) {
    const sets = this.deepAttributeElements(elements, attrName);
    sets.forEach((it) => {
      const attr = it.getAttribute(attrName);
      const attrs = ElementUtils.getAttributeToObject(it);
      if (attr) {
        callBack(it, attr, attrs);
      }
    });
  }
  getValue(obj, name, bindObj) {
    let r = ObjectUtils.Script.evaluateReturn(name, obj);
    if (typeof r === "function") {
      r = r.bind(bindObj ?? obj);
    }
    return r;
  }
  setValue(obj, name, value) {
    name = name.replaceAll("this.", "this.this.");
    ObjectUtils.Script.evaluate(`${name} = this.value;`, {
      this: obj,
      value
    });
  }
  static decodeScriptVar(raws) {
    if (raws) {
      _EventManager.VARNAMES.forEach((it) => {
        raws = raws.replace(RegExp(it.replace("$", "\\$"), "g"), `this.___${it}`);
      });
      return raws;
    }
    return void 0;
  }
  static isUsingThisVar(raws, varName) {
    raws = _EventManager.decodeScriptVar(raws);
    if (varName && raws) {
      if (varName.startsWith("this.")) {
        varName = varName.replace(/this\./, "");
      }
      const variablePaths = ObjectUtils.Path.detectPathFromScript(raws, { excludeThis: true });
      return variablePaths.has(varName);
    }
    return false;
  }
  static setBindProperty(scripts, obj) {
    if (scripts) {
      const newScripts = Object.assign({}, scripts);
      for (const [key, value] of Object.entries(newScripts)) {
        if (typeof value === "function") {
          newScripts[key] = value.bind(obj);
        }
      }
      return newScripts;
    }
  }
  getBindScript(config) {
    if (config?.eventVariables) {
      const bindScript = Object.entries(config.eventVariables).filter(([key, value]) => !this.bindScript.includes(`const ${key}`)).map(([key, value]) => {
        return `const ${key} = this.__render.${key};`;
      }).join(";");
      return this.bindScript + "" + bindScript;
    } else {
      return this.bindScript;
    }
  }
};
_EventManager.attrPrefix = "dr-";
_EventManager.ownerVariablePathAttrName = _EventManager.attrPrefix + "owner-variable-path";
_EventManager.eventParam = _EventManager.attrPrefix + "event";
_EventManager.onInitAttrName = _EventManager.attrPrefix + "on-init";
_EventManager.valueAttrName = _EventManager.attrPrefix + "value";
_EventManager.srcAttrName = _EventManager.attrPrefix + "src";
_EventManager.checkedAttrName = _EventManager.attrPrefix + "checked";
_EventManager.selectedAttrName = _EventManager.attrPrefix + "selected";
_EventManager.readonlyAttrName = _EventManager.attrPrefix + "readonly";
_EventManager.disabledAttrName = _EventManager.attrPrefix + "disabled";
_EventManager.hiddenAttrName = _EventManager.attrPrefix + "hidden";
_EventManager.requiredAttrName = _EventManager.attrPrefix + "required";
_EventManager.openAttrName = _EventManager.attrPrefix + "open";
// link는 쓰지 않는걸 추천한다 라이프 사이클 꼬인다 다른 프레임워크에서도 양방향은 지양 한다
_EventManager.linkAttrs = [
  { name: _EventManager.attrPrefix + "value-link", property: "value", event: "input" },
  { name: _EventManager.attrPrefix + "hidden-link", property: "value", event: "input" },
  { name: _EventManager.attrPrefix + "required-link", property: "value", event: "input" },
  { name: _EventManager.attrPrefix + "checked-link", property: "checked", event: "change" },
  { name: _EventManager.attrPrefix + "open-link", property: "open", event: "toggle" }
];
// @ts-ignore  합성이벤트(Synthetic) 처리하면서 의미가 없어졌다
_EventManager.linkTargetMapAttrName = _EventManager.attrPrefix + "link-variables";
_EventManager.onRenderedInitAttrName = _EventManager.attrPrefix + "on-rendered-init";
_EventManager.attrAttrName = _EventManager.attrPrefix + "attr";
_EventManager.normalAttrMapAttrName = _EventManager.attrPrefix + "normal-attr-map";
_EventManager.styleAttrName = _EventManager.attrPrefix + "style";
_EventManager.classAttrName = _EventManager.attrPrefix + "class";
_EventManager.VALUE_VARNAME = "$value";
_EventManager.SCRIPTS_VARNAME = "$scripts";
_EventManager.FAG_VARNAME = "$fag";
_EventManager.RAWSET_VARNAME = "$rawSet";
_EventManager.RENDER_VARNAME = "$render";
_EventManager.NEAR_THIS_VARNAME = "$nearThis";
_EventManager.PARENT_THIS_VARNAME = "$parentThis";
_EventManager.ROOT_OBJECT_VARNAME = "$rootObject";
_EventManager.SCRIPT_UTILS_VARNAME = "$scriptUtils";
_EventManager.RANGE_VARNAME = "$range";
_EventManager.ROUTER_VARNAME = "$router";
_EventManager.INNER_HTML_VARNAME = "$innerHTML";
_EventManager.ELEMENT_VARNAME = "$element";
_EventManager.TARGET_VARNAME = "$target";
_EventManager.EVENT_VARNAME = "$event";
_EventManager.COMPONENT_VARNAME = "$component";
_EventManager.INNERHTML_VARNAME = "$innerHTML";
_EventManager.ATTRIBUTE_VARNAME = "$attribute";
_EventManager.CREATOR_META_DATA_VARNAME = "$creatorMetaData";
_EventManager.PARENT_THIS_PATH_VARNAME = "$parentPath";
_EventManager.CURRENT_THIS_VARNAME = "$currentThis";
_EventManager.CURRENT_THIS_PATH_VARNAME = "$currentThisPath";
_EventManager.NEAR_THIS_PATH_VARNAME = "$nearThisPath";
_EventManager.VARNAMES = [_EventManager.SCRIPTS_VARNAME, _EventManager.FAG_VARNAME, _EventManager.RAWSET_VARNAME, _EventManager.RANGE_VARNAME, _EventManager.ROUTER_VARNAME, _EventManager.ELEMENT_VARNAME, _EventManager.TARGET_VARNAME, _EventManager.EVENT_VARNAME, _EventManager.COMPONENT_VARNAME, _EventManager.INNERHTML_VARNAME, _EventManager.ATTRIBUTE_VARNAME, _EventManager.ATTRIBUTE_VARNAME, _EventManager.CREATOR_META_DATA_VARNAME, _EventManager.PARENT_THIS_PATH_VARNAME, _EventManager.PARENT_THIS_VARNAME];
_EventManager.WINDOW_EVENT_POPSTATE = "popstate";
_EventManager.WINDOW_EVENT_RESIZE = "resize";
_EventManager.WINDOW_EVENT_SCROLL = "scroll";
_EventManager.WINDOW_EVENTS = [_EventManager.WINDOW_EVENT_POPSTATE, _EventManager.WINDOW_EVENT_RESIZE, _EventManager.WINDOW_EVENT_SCROLL];
_EventManager.noDetectAttr = [_EventManager.normalAttrMapAttrName];
_EventManager.attrNames = [_EventManager.valueAttrName, _EventManager.srcAttrName, _EventManager.checkedAttrName, _EventManager.selectedAttrName, _EventManager.readonlyAttrName, _EventManager.disabledAttrName, _EventManager.hiddenAttrName, _EventManager.requiredAttrName, _EventManager.openAttrName, _EventManager.attrAttrName, _EventManager.normalAttrMapAttrName, _EventManager.styleAttrName, _EventManager.classAttrName, _EventManager.attrPrefix + "window-event-" + _EventManager.WINDOW_EVENT_POPSTATE, _EventManager.attrPrefix + "window-event-" + _EventManager.WINDOW_EVENT_RESIZE, _EventManager.attrPrefix + "window-event-" + _EventManager.WINDOW_EVENT_SCROLL, _EventManager.onInitAttrName, ..._EventManager.linkAttrs.map((it) => it.name), _EventManager.eventParam];
let EventManager = _EventManager;
export {
  EventManager
};
//# sourceMappingURL=EventManager.js.map