dom-render 1.0.79 → 1.0.80

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/DomRender.d.ts CHANGED
@@ -3,26 +3,11 @@ import { ConstructorType } from './types/Types';
3
3
  import { RawSet } from './RawSet';
4
4
  export declare class DomRender {
5
5
  static run<T extends object>(obj: T, target?: Node, config?: Config): T;
6
- static addComponent(config: Config, { type, tagName }: {
6
+ static createComponent(param: {
7
7
  type: ConstructorType<any>;
8
8
  tagName?: string;
9
- }, { template, styles, styleLocale }: {
10
- template: string;
11
- styles?: string[];
12
- styleLocale?: boolean;
13
- }): {
14
- add: (source: {
15
- type: ConstructorType<any>;
16
- tagName?: string;
17
- }, front: {
18
- template: string;
19
- styles?: string[];
20
- }) => any;
21
- };
22
- static addAttribute(config: Config, attrName: string, getThisObj: (element: Element, attrValue: string, obj: any, rawSet: RawSet) => any, factory: (element: Element, attrValue: string, obj: any, rawSet: RawSet) => DocumentFragment): {
23
- add: (attrName: string, getThisObj: (element: Element, attrValue: string, obj: any, rawSet: RawSet) => any, factory: (element: Element, attrValue: string, obj: any, rawSet: RawSet) => DocumentFragment) => any;
24
- };
25
- static addAttributeCallBack(config: Config, attrName: string, callBack: (elements: Element, attrValue: string, obj: any) => void): {
26
- add: (attrName: string, callBack: (elements: Element, attrValue: string, obj: any) => void) => any;
27
- };
9
+ template?: string;
10
+ styles?: string[] | string;
11
+ }, config: Config): import("./Config").TargetElement;
12
+ static createAttribute(attrName: string, getThisObj: (element: Element, attrValue: string, obj: any, rawSet: RawSet) => any, factory: (element: Element, attrValue: string, obj: any, rawSet: RawSet) => DocumentFragment): import("./Config").TargetAttr;
28
13
  }
package/DomRender.js CHANGED
@@ -46,44 +46,17 @@ var DomRender = /** @class */ (function () {
46
46
  domRender.run(robj);
47
47
  return robj;
48
48
  };
49
- DomRender.addComponent = function (config, _a, _b) {
50
- var _c;
51
- var type = _a.type, _d = _a.tagName, tagName = _d === void 0 ? type.name : _d;
52
- var template = _b.template, _e = _b.styles, styles = _e === void 0 ? [] : _e, _f = _b.styleLocale, styleLocale = _f === void 0 ? false : _f;
53
- var component = RawSet_1.RawSet.createComponentTargetElement(tagName, function (e, o, r2, counstructorParam) {
54
- return new (type.bind.apply(type, __spreadArray([void 0], counstructorParam, false)))();
55
- }, template, styles, styleLocale, config);
56
- config.targetElements = (_c = config.targetElements) !== null && _c !== void 0 ? _c : [];
57
- config.targetElements.push(component);
58
- return {
59
- add: function (source, front) {
60
- return DomRender.addComponent(config, source, front);
61
- }
62
- };
49
+ DomRender.createComponent = function (param, config) {
50
+ var _a, _b;
51
+ var component = RawSet_1.RawSet.createComponentTargetElement((_a = param.tagName) !== null && _a !== void 0 ? _a : param.type.name, function (e, o, r2, counstructorParam) {
52
+ var _a;
53
+ return new ((_a = param.type).bind.apply(_a, __spreadArray([void 0], counstructorParam, false)))();
54
+ }, (_b = param.template) !== null && _b !== void 0 ? _b : '', Array.isArray(param.styles) ? param.styles : (param.styles ? [param.styles] : undefined), false, config);
55
+ return component;
63
56
  };
64
- DomRender.addAttribute = function (config, attrName, getThisObj, factory) {
65
- var _a;
57
+ DomRender.createAttribute = function (attrName, getThisObj, factory) {
66
58
  var targetAttribute = RawSet_1.RawSet.createComponentTargetAttribute(attrName, getThisObj, factory);
67
- config.targetAttrs = (_a = config.targetAttrs) !== null && _a !== void 0 ? _a : [];
68
- config.targetAttrs.push(targetAttribute);
69
- return {
70
- add: function (attrName, getThisObj, factory) {
71
- return DomRender.addAttribute(config, attrName, getThisObj, factory);
72
- }
73
- };
74
- };
75
- DomRender.addAttributeCallBack = function (config, attrName, callBack) {
76
- var _a;
77
- config.applyEvents = (_a = config.applyEvents) !== null && _a !== void 0 ? _a : [];
78
- config.applyEvents.push({
79
- attrName: attrName,
80
- callBack: callBack
81
- });
82
- return {
83
- add: function (attrName, callBack) {
84
- return DomRender.addAttributeCallBack(config, attrName, callBack);
85
- }
86
- };
59
+ return targetAttribute;
87
60
  };
88
61
  return DomRender;
89
62
  }());
package/DomRenderProxy.js CHANGED
@@ -64,7 +64,7 @@ var DomRenderProxy = /** @class */ (function () {
64
64
  (_d = (_c = this._domRender_proxy) === null || _c === void 0 ? void 0 : _c.onCreateRender) === null || _d === void 0 ? void 0 : _d.call(_c, createParam);
65
65
  var innerHTML = (_e = target.innerHTML) !== null && _e !== void 0 ? _e : '';
66
66
  this._targets.add(target);
67
- var rawSets = RawSet_1.RawSet.checkPointCreates(target, this.config);
67
+ var rawSets = RawSet_1.RawSet.checkPointCreates(target, this._domRender_proxy, this.config);
68
68
  // console.log('initRender -------rawSet', rawSets)
69
69
  // 중요 초기에 한번 튕겨줘야함.
70
70
  EventManager_1.eventManager.applyEvent(this._domRender_proxy, EventManager_1.eventManager.findAttrElements(target, this.config), this.config);
package/README.MD CHANGED
@@ -364,11 +364,12 @@ validator
364
364
  const config: Config = {
365
365
  window
366
366
  };
367
- DomRender.addComponent(config, {type: Main, tagName: 'page-main'}, {template: MainTemplate})
368
- .add({type: Second, tagName: 'page-second'}, {template: SecondTemplate})
369
- .add({type: Detail, tagName: 'page-detail'}, {template: DetailTemplate});
370
- config.routerType = 'hash';
371
- config.routerType = 'hash';
367
+ config.targetElements = [
368
+ DomRender.createComponent({type: Main, tagName: 'page-main', template: MainTemplate}, config),
369
+ DomRender.createComponent({type: Second, tagName: 'page-second', template: SecondTemplate}, config),
370
+ DomRender.createComponent({type: Detail, tagName: 'page-detail', template: DetailTemplate}, config)
371
+ ]
372
+ config.routerType = 'hash'; // 'hash' | 'path' | 'none';
372
373
  const data = DomRender.run(new Data(), document.querySelector('#app')!, config);
373
374
  ```
374
375
  ```html
@@ -592,33 +593,41 @@ link attribute
592
593
  </body>
593
594
  ```
594
595
  ```typescript
595
- DomRender
596
- .addComponent(config, {type: Profile}, {template: ProfileTemplate})
597
- .add({type: Home}, {template: HomeTemplate});
598
-
599
- DomRender.addAttribute(config, 'link',
600
- (element: Element, attrValue: string, obj: any, rawSet: RawSet) => {
601
- return obj;
602
- },
603
- (element: Element, attrValue: string, obj: any, rawSet: RawSet) => {
604
- const fag = window.document.createDocumentFragment();
605
- if (attrValue) {
606
- const n = element.cloneNode(true) as Element;
607
- attrValue = ScriptUtils.eval(`return ${attrValue}`, obj)
608
- n.addEventListener('click', () => {
609
- location.href = attrValue;
610
- });
611
- fag.append(n);
596
+ config.targetElements = [
597
+ DomRender.createComponent({type: Profile, template: ProfileTemplate}, config),
598
+ DomRender.createComponent({type: Home, template: HomeTemplate, styles: HomeStyle}, config)
599
+ ]
600
+
601
+ config.targetAttrs = [
602
+ DomRender.createAttribute('link',
603
+ (element: Element, attrValue: string, obj: any, rawSet: RawSet) => {
604
+ return obj;
605
+ },
606
+ (element: Element, attrValue: string, obj: any, rawSet: RawSet) => {
607
+ const fag = window.document.createDocumentFragment();
608
+ if (attrValue) {
609
+ const n = element.cloneNode(true) as Element;
610
+ attrValue = ScriptUtils.eval(`return ${attrValue}`, obj)
611
+ n.addEventListener('click', () => {
612
+ location.href = attrValue;
613
+ });
614
+ fag.append(n);
615
+ }
616
+ return fag;
612
617
  }
613
- return fag;
614
- }
615
- );
616
-
617
- DomRender.addAttributeCallBack(config, 'wow', (e, a, o) => {
618
- e.addEventListener('click', (event) => {
619
- alert((event.target as any).value);
620
- })
621
- })
618
+ )
619
+ ]
620
+
621
+ config.applyEvents = [
622
+ {
623
+ attrName: 'wow',
624
+ callBack: (e, a, o) => {
625
+ e.addEventListener('click', (event) => {
626
+ alert((event.target as any).value);
627
+ })
628
+ }
629
+ }
630
+ ]
622
631
  const data = DomRender.run(new Data(), document.querySelector('#app')!, config);
623
632
  ```
624
633
  using component
package/RawSet.d.ts CHANGED
@@ -120,7 +120,7 @@ export declare class RawSet {
120
120
  getAttributeAndDelete(element: Element, attr: string): string | null;
121
121
  getDrAppendAttributeAndDelete(element: Element, obj: any): string | null;
122
122
  replaceBody(genNode: Node): void;
123
- static checkPointCreates(element: Node, config: Config): RawSet[];
123
+ static checkPointCreates(element: Node, obj: any, config: Config): RawSet[];
124
124
  childAllRemove(): void;
125
125
  static drItOtherEncoding(element: Element | DocumentFragment): string;
126
126
  static drItOtherDecoding(element: Element | DocumentFragment, random: string): void;
package/RawSet.js CHANGED
@@ -303,7 +303,7 @@ var RawSet = /** @class */ (function () {
303
303
  (_a = this.point.start.parentNode) === null || _a === void 0 ? void 0 : _a.insertBefore(genNode, this.point.start.nextSibling);
304
304
  };
305
305
  // 중요 important
306
- RawSet.checkPointCreates = function (element, config) {
306
+ RawSet.checkPointCreates = function (element, obj, config) {
307
307
  var _a, _b, _c, _d, _e, _f, _g, _h;
308
308
  var thisVariableName = element.__domrender_this_variable_name;
309
309
  // console.log('checkPointCreates thisVariableName', thisVariableName);