@dooboostore/dom-render
Version:
html view template engine
777 lines (776 loc) • 33 kB
JavaScript
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var EventManager_exports = {};
__export(EventManager_exports, {
EventManager: () => EventManager
});
module.exports = __toCommonJS(EventManager_exports);
var import_core_web = require("@dooboostore/core-web");
var import_core_web2 = require("@dooboostore/core-web");
var import_core = require("@dooboostore/core");
var import_DomRenderProxy = require("../DomRenderProxy");
var import_core2 = require("@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 = (0, import_DomRenderProxy.getDomRenderConfig)(obj);
import_core_web.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: import_core_web2.ElementUtils.getAttributeToObject(element),
router: config?.router,
range: import_core.Range.range,
scripts: _EventManager.setBindProperty(config?.scripts, componentInstance),
...config?.eventVariables,
...extraVars
})
});
}
executeHandler(event, handler, componentInstance) {
const { element, type, attr } = handler;
const config = (0, import_DomRenderProxy.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 = import_core_web.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 = import_core_web.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) {
import_core_web.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 = import_core_web2.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 });
import_core_web.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 = import_core2.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 = import_core2.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 = import_core2.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 = import_core2.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 = import_core2.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 = import_core2.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 = import_core2.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 = import_core2.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 = import_core2.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 = import_core2.ObjectUtils.Path.toOptionalChainPath(it2.inner);
targetScript = targetScript.replaceAll(it2.origin, `\${${r}}`);
});
script = "`" + targetScript + "`";
} else {
variablePaths.forEach((it2) => {
let r = import_core2.ObjectUtils.Path.toOptionalChainPath(it2.inner);
targetScript = targetScript.replaceAll(it2.origin, `${r}`);
});
script = targetScript;
}
const data = import_core2.ObjectUtils.Script.evaluate(
`const $element = this.element; return ${script}`,
Object.assign(obj, {
__render: Object.freeze({
element: it,
attribute: import_core_web2.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 = import_core2.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 = import_core2.ObjectUtils.Script.evaluate(`${this.getBindScript(config)} return ${mapScript}`, Object.assign(bindObj, { __render: Object.freeze({ element: it, target: bindObj, range: import_core.Range.range, value: setValue, scripts: _EventManager.setBindProperty(config?.scripts, obj), ...config?.eventVariables }) }));
}
getValue(setValue);
} else if (getValue) {
let setValue = getValue;
if (mapScript) {
setValue = import_core2.ObjectUtils.Script.evaluate(`${this.getBindScript(config)} return ${mapScript}`, Object.assign(bindObj, { __render: Object.freeze({ element: it, target: bindObj, range: import_core.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 = import_core2.ObjectUtils.Script.evaluate(`${this.getBindScript(config)} return ${filterScript}`, context) ?? false;
}
if (filter) {
import_core2.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) {
import_core2.ObjectUtils.Script.evaluate(
`${this.getBindScript(config)}; ${script} `,
Object.assign(obj, {
__render: Object.freeze({
element: it,
attribute: import_core_web2.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) {
import_core2.ObjectUtils.Script.evaluate(
`${this.getBindScript(config)}; ${script} `,
Object.assign(obj, {
__render: Object.freeze({
element: it,
attribute: import_core_web2.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 = import_core2.ObjectUtils.Script.evaluate(
`const $element = this.__render.element; ${script} `,
Object.assign(obj, {
__render: Object.freeze({
element: it,
attribute: import_core_web2.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 = import_core2.ObjectUtils.Script.evaluate(
`const $element = this.element; ${script} `,
Object.assign(obj, {
__render: Object.freeze({
element: it,
attribute: import_core_web2.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 = import_core2.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 = import_core2.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 = import_core2.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 = import_core2.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 = import_core2.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 = import_core2.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 = import_core2.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 = import_core2.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 = import_core_web2.ElementUtils.getAttributeToObject(it);
if (attr) {
callBack(it, attr, attrs);
}
});
}
getValue(obj, name, bindObj) {
let r = import_core2.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.");
import_core2.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 = import_core2.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;
//# sourceMappingURL=EventManager.js.map