@dooboostore/dom-render
Version:
html view template engine
109 lines (108 loc) • 4.1 kB
JavaScript
import { ComponentBase } from "../ComponentBase.js";
import { RawSet } from "../../rawsets/RawSet.js";
import { isOnChangeAttrRender } from "../../lifecycle/OnChangeAttrRender.js";
import { ComponentSet } from "../../components/ComponentSet.js";
import { ComponentRouterBase, isOnCreatedOutletDebounce } from "../../components/ComponentRouterBase.js";
var RouterOutlet;
((_RouterOutlet) => {
_RouterOutlet.selector = "dr-router-outlet";
class RouterOutlet2 extends ComponentBase {
constructor() {
super(...arguments);
this.if = null;
this.sw = false;
}
setValue(value) {
this.sw = false;
setTimeout(() => {
this.value = value;
}, 0);
setTimeout(() => {
this.sw = true;
}, 0);
}
async onInitRender(param, rawSet) {
await super.onInitRender(param, rawSet);
const c = this.getParentThis();
const userValue = this.getAttribute("value");
if (typeof userValue === "string") {
this.setValue(c[userValue]);
} else if (userValue instanceof ComponentSet) {
this.setValue(userValue);
} else if (!userValue && c instanceof ComponentRouterBase) {
this.setValue(c.child);
}
}
onDestroyRender(data) {
super.onDestroyRender(data);
}
onDestroy() {
super.onDestroy();
}
onChangeAttrRender(name, value, other) {
super.onChangeAttrRender(name, value, other);
if (this.equalsAttributeName(name, "value")) {
this.setValue(value);
}
if (this.equalsAttributeName(name, "if")) {
this.if = value;
}
if (this.equalsAttributeName(name, "createArguments")) {
this.createArguments = value;
}
if (this.childObject && this.childRawSet && isOnChangeAttrRender(this.childObject)) {
this.childObject.onChangeAttrRender(name, value, { rawSet: this.childRawSet });
}
}
onCreatedThisChild(child, data) {
super.onCreatedThisChild(child, data);
}
onCreatedThisChildDebounce(childrenSet) {
super.onCreatedThisChildDebounce(childrenSet);
let parentThis = this.getParentThis();
if (isOnCreatedOutletDebounce(parentThis)) {
parentThis.onCreatedOutletDebounce(this.value?.obj);
}
this.getAttribute("onCreatedDebounce")?.(this.value?.obj);
}
onCreateDrThis($component, $rawSet) {
this.childObject = $component ?? ($component = this.value?.obj);
this.childRawSet = $rawSet;
if ($component) {
this.getAttribute("onCreated")?.($component);
if (isOnChangeAttrRender($component)) {
this.getAttributeNames().filter((it) => it.startsWith("attribute-")).forEach((it) => {
var _a;
const attrName = it.replace(/^attribute-/, "");
const attrValue = this.getAttribute(it);
(_a = $rawSet.dataSet.render).attribute ?? (_a.attribute = {});
$rawSet.dataSet.render.attribute[attrName] = attrValue;
$component.onChangeAttrRender(attrName, attrValue, { rawSet: $rawSet });
});
}
}
}
}
_RouterOutlet.RouterOutlet = RouterOutlet2;
})(RouterOutlet || (RouterOutlet = {}));
var RouterOutlet_default = {
// TODO: 왜 이놈만 webpack에서 순환참조 에러나는지모르겠다.. 왜 이놈만.. 그래서 이렇게 하긴함.
routerOutlet: (config, executer) => {
return RawSet.createComponentTargetElement({
name: RouterOutlet.selector,
template: `
<dr-if value="\${@this@.sw}$">
<div dr-this="@this@.value" dr-detect-option-if="@this@?.value && @this@?.if" dr-option-strip="true" dr-on-create:arguments="@this@.createArguments" dr-on-create:callback="@this@?.onCreateDrThis?.($component, $rawSet)">#innerHTML#</div>
</dr-if>
`,
objFactory: (e, o, r2, counstructorParam) => {
return executer?.run({ rootObject: new RouterOutlet.RouterOutlet(...counstructorParam), config });
}
});
}
};
export {
RouterOutlet,
RouterOutlet_default as default
};
//# sourceMappingURL=RouterOutlet.js.map