dom-render 1.0.88 → 1.0.91

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.
Files changed (44) hide show
  1. package/DomRenderProxy.js +31 -11
  2. package/README.MD +18 -11
  3. package/components/ComponentSet.d.ts +5 -2
  4. package/components/ComponentSet.js +2 -3
  5. package/configs/Config.d.ts +5 -0
  6. package/dist/bundle.js +582 -534
  7. package/events/EventManager.js +0 -1
  8. package/lifecycle/OnInitRender.d.ts +1 -6
  9. package/operators/Dr.d.ts +7 -3
  10. package/operators/Dr.js +21 -23
  11. package/operators/DrAppender.d.ts +7 -3
  12. package/operators/DrAppender.js +28 -26
  13. package/operators/DrFor.d.ts +7 -3
  14. package/operators/DrFor.js +24 -23
  15. package/operators/DrForOf.d.ts +7 -3
  16. package/operators/DrForOf.js +27 -26
  17. package/operators/DrForm.d.ts +7 -3
  18. package/operators/DrForm.js +51 -54
  19. package/operators/DrIf.d.ts +7 -3
  20. package/operators/DrIf.js +29 -32
  21. package/operators/DrInnerHTML.d.ts +7 -3
  22. package/operators/DrInnerHTML.js +19 -21
  23. package/operators/DrInnerText.d.ts +7 -3
  24. package/operators/DrInnerText.js +17 -19
  25. package/operators/DrPre.d.ts +6 -3
  26. package/operators/DrPre.js +9 -6
  27. package/operators/DrRepeat.d.ts +7 -3
  28. package/operators/DrRepeat.js +24 -23
  29. package/operators/DrTargetAttr.d.ts +6 -3
  30. package/operators/DrTargetAttr.js +10 -8
  31. package/operators/DrTargetElement.d.ts +6 -3
  32. package/operators/DrTargetElement.js +10 -32
  33. package/operators/DrThis.d.ts +4 -3
  34. package/operators/DrThis.js +21 -27
  35. package/operators/OperatorExecuter.d.ts +48 -0
  36. package/operators/OperatorExecuter.js +43 -0
  37. package/operators/OperatorExecuterAttrRequire.d.ts +8 -0
  38. package/operators/OperatorExecuterAttrRequire.js +55 -0
  39. package/package.json +1 -1
  40. package/rawsets/RawSet.d.ts +7 -1
  41. package/rawsets/RawSet.js +60 -42
  42. package/utils/location/LocationUtils.js +7 -1
  43. package/operators/OperatorRender.d.ts +0 -45
  44. package/operators/OperatorRender.js +0 -21
package/DomRenderProxy.js CHANGED
@@ -1,4 +1,13 @@
1
1
  "use strict";
2
+ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
3
+ if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
4
+ if (ar || !(i in from)) {
5
+ if (!ar) ar = Array.prototype.slice.call(from, 0, i);
6
+ ar[i] = from[i];
7
+ }
8
+ }
9
+ return to.concat(ar || Array.prototype.slice.call(from));
10
+ };
2
11
  Object.defineProperty(exports, "__esModule", { value: true });
3
12
  exports.DomRenderProxy = void 0;
4
13
  var RawSet_1 = require("./rawsets/RawSet");
@@ -56,13 +65,16 @@ var DomRenderProxy = /** @class */ (function () {
56
65
  };
57
66
  DomRenderProxy.prototype.initRender = function (target) {
58
67
  var _this = this;
59
- var _a, _b, _c, _d, _e, _f, _g;
60
- var onCreate = (_b = (_a = target).getAttribute) === null || _b === void 0 ? void 0 : _b.call(_a, "".concat(EventManager_1.EventManager.attrPrefix, "on-create"));
61
- var createParam;
68
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j;
69
+ var onCreate = (_b = (_a = target).getAttribute) === null || _b === void 0 ? void 0 : _b.call(_a, RawSet_1.RawSet.DR_ON_CREATE_ARGUMENTS_OPTIONNAME);
70
+ var createParam = [];
62
71
  if (onCreate) {
63
72
  createParam = ScriptUtils_1.ScriptUtils.evalReturn(onCreate, this._domRender_proxy);
73
+ if (!Array.isArray(createParam)) {
74
+ createParam = [createParam];
75
+ }
64
76
  }
65
- (_d = (_c = this._domRender_proxy) === null || _c === void 0 ? void 0 : _c.onCreateRender) === null || _d === void 0 ? void 0 : _d.call(_c, createParam);
77
+ (_d = (_c = this._domRender_proxy) === null || _c === void 0 ? void 0 : _c.onCreateRender) === null || _d === void 0 ? void 0 : _d.call.apply(_d, __spreadArray([_c], createParam, false));
66
78
  var innerHTML = (_e = target.innerHTML) !== null && _e !== void 0 ? _e : '';
67
79
  this._targets.add(target);
68
80
  var rawSets = RawSet_1.RawSet.checkPointCreates(target, this._domRender_proxy, this.config);
@@ -81,13 +93,21 @@ var DomRenderProxy = /** @class */ (function () {
81
93
  }
82
94
  });
83
95
  this.render(this.getRawSets());
84
- var render = { target: target };
85
- var creatorMetaData = {
86
- creator: this._domRender_proxy,
87
- rootCreator: this._domRender_proxy,
88
- innerHTML: innerHTML
89
- };
90
- (_g = (_f = this._domRender_proxy) === null || _f === void 0 ? void 0 : _f.onInitRender) === null || _g === void 0 ? void 0 : _g.call(_f, { render: render, creatorMetaData: creatorMetaData });
96
+ // const render = {target} as Render;
97
+ // const creatorMetaData = {
98
+ // creator: this._domRender_proxy,
99
+ // rootCreator: this._domRender_proxy,
100
+ // innerHTML
101
+ // } as CreatorMetaData;
102
+ var onInit = (_g = (_f = target).getAttribute) === null || _g === void 0 ? void 0 : _g.call(_f, RawSet_1.RawSet.DR_ON_INIT_ARGUMENTS_OPTIONNAME);
103
+ var initParam = [];
104
+ if (onCreate) {
105
+ initParam = ScriptUtils_1.ScriptUtils.evalReturn(onCreate, this._domRender_proxy);
106
+ if (!Array.isArray(initParam)) {
107
+ initParam = [initParam];
108
+ }
109
+ }
110
+ (_j = (_h = this._domRender_proxy) === null || _h === void 0 ? void 0 : _h.onInitRender) === null || _j === void 0 ? void 0 : _j.call.apply(_j, __spreadArray([_h], initParam, false));
91
111
  };
92
112
  DomRenderProxy.prototype.getRawSets = function () {
93
113
  var set = new Set();
package/README.MD CHANGED
@@ -7,7 +7,7 @@ DOM-RENDER
7
7
 
8
8
  # 🚀 Quick start
9
9
  ```html
10
- <script src="https://cdn.jsdelivr.net/npm/dom-render@1.0.86/dist/bundle.js"></script>
10
+ <script src="https://cdn.jsdelivr.net/npm/dom-render@1.0.91/dist/bundle.js"></script>
11
11
  ```
12
12
  ```html
13
13
  <!DOCTYPE html>
@@ -433,7 +433,7 @@ const data = DomRender.run(new Data(), document.querySelector('#app')!, config);
433
433
  <page-second dr-if="$router.test('/second')">1</page-second>
434
434
  <page-second dr-if="$router.testRegexp('/second/[0-9]?$')">2</page-second>
435
435
  <page-second dr-if="$router.testRegexp('/second/wow$')">wow</page-second>
436
- <page-detail url='/detail/{id:[0-9]+}' dr-if="$router.test($attribute.url)" dr-on-component-init="$component.routerData($router.getRouteData($attribute.url))" ></page-detail>
436
+ <page-detail url='/detail/{id:[0-9]+}' dr-if="$router.test($attribute.url)" dr-on-create:callback="$component.routerData($router.getRouteData($attribute.url))" ></page-detail>
437
437
  <div>
438
438
  <button dr-event-click="this.plusCount()">${this.count}$ count pluse++</button>
439
439
  </div>
@@ -638,15 +638,18 @@ const data = config.scripts.concat('head', 'tail')
638
638
  <body id="app">
639
639
  ${this.name}$
640
640
  <h1>component</h1>
641
- <profile dr-on-component-init="$component.name='jhone'; $component.age=55;"><b>${#component#.details}$</b></profile>
642
- <profile dr-on-component-init="$component.name='cal'; $component.age=56;"><b>detail-2</b></profile>
643
- <profile dr-on-component-init="$component.name='rose'; $component.age=57;">
644
- <profile dr-on-component-init="$component.name='rose-sub'; $component.age=156;">
641
+ <profile dr-on-create:callback="$component.name='jhone'; $component.age=55;"><b>${#component#.details}$</b></profile>
642
+ <profile dr-on-create:callback="$component.name='cal'; $component.age=56;"><b>detail-2</b></profile>
643
+ <profile dr-on-create:callback="$component.name='rose'; $component.age=57;">
644
+ <profile dr-on-create:callback="$component.name='rose-sub'; $component.age=156;">
645
645
  <b>${this.name}$</b>
646
646
  </profile>
647
647
  </profile>
648
648
  <h3>component data link and detect</h3>
649
- <Profile dr-if="this.toggle" dr-detect="$component.age = this.age" dr-on-component-init="$component.name='papa'; $component.age=58;">
649
+ <Profile dr-if="this.toggle" dr-detect="$component.age = this.age" dr-on-create:callback="$component.name='papa'; $component.age=58;">
650
+ <b>${this.name}$</b>
651
+ </Profile>
652
+ <Profile dr-if="this.toggle" dr-detect="$component.age = this.age" dr-on-constructor:arguments="[1,2]">
650
653
  <b>${this.name}$</b>
651
654
  </Profile>
652
655
 
@@ -654,8 +657,8 @@ ${this.name}$
654
657
  <button dr-event-click="this.age = Date.now();">change age</button>
655
658
  <button dr-event-click="this.toggle = !this.toggle;">change toggle</button>
656
659
 
657
- <j1>component constructor, on-create, dr-on-component-init</j1>
658
- <home dr-constructor="[this.name, this.age, 'home welcom']" dr-on-create="{type: 'onCreate', data: 'datadata'}" dr-on-component-init="$component.onInit('data')"></home>
660
+ <j1>component constructor, on-create, dr-on-create:callback</j1>
661
+ <home dr-constructor="[this.name, this.age, 'home welcom']" dr-on-create-arguments="{type: 'onCreate', data: 'datadata'}" dr-on-create:callback="$component.onInit('data')"></home>
659
662
 
660
663
 
661
664
 
@@ -712,7 +715,7 @@ const data = DomRender.run(new Data(), document.querySelector('#app')!, config);
712
715
  ```
713
716
  using component
714
717
  ```html
715
- <my-element dr-on-component-init="$component.say();"></my-element>
718
+ <my-element dr-on-create:callback="$component.say();"></my-element>
716
719
 
717
720
  <home value="${this.name}$" wow="${this.color}$">
718
721
  ${#component#.homeName}$
@@ -722,11 +725,15 @@ using component
722
725
  </home>
723
726
  ```
724
727
  - attribute
725
- - dr-on-component-init: component created init call script
728
+ - dr-on-create:callback: component created init callback script
729
+ - dr-on-create:arguments: component onCreatedRender arguments
730
+ - dr-on-init:arguments: component onInitRender arguments
731
+ - dr-on-constructor:arguments: component counstructor arguments
726
732
  - $component: component instance
727
733
  - $element: element instance
728
734
  - $attribute: element attribute object
729
735
  - $innerHTML: element innerHTML string
736
+ - $creatorMetaData: metaData
730
737
  - #component#: component instance
731
738
  - #innerHTML#: element innerHTML
732
739
  - dr-component-name: renaming component variable name (default: component)
package/components/ComponentSet.d.ts CHANGED
@@ -1,7 +1,10 @@
1
+ export declare type ComponentSetConfig = {
2
+ objPath?: string | null;
3
+ };
1
4
  export declare class ComponentSet {
2
5
  obj: any;
3
6
  template?: string | undefined;
4
7
  styles?: string[] | undefined;
5
- styleLocale: boolean;
6
- constructor(obj: any, template?: string | undefined, styles?: string[] | undefined, styleLocale?: boolean);
8
+ config: ComponentSetConfig;
9
+ constructor(obj: any, template?: string | undefined, styles?: string[] | undefined, config?: ComponentSetConfig);
7
10
  }
package/components/ComponentSet.js CHANGED
@@ -2,12 +2,11 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.ComponentSet = void 0;
4
4
  var ComponentSet = /** @class */ (function () {
5
- function ComponentSet(obj, template, styles, styleLocale) {
6
- if (styleLocale === void 0) { styleLocale = false; }
5
+ function ComponentSet(obj, template, styles, config) {
7
6
  this.obj = obj;
8
7
  this.template = template;
9
8
  this.styles = styles;
10
- this.styleLocale = styleLocale;
9
+ this.config = Object.assign({ objPath: 'obj' }, config);
11
10
  }
12
11
  return ComponentSet;
13
12
  }());
package/configs/Config.d.ts CHANGED
@@ -4,10 +4,15 @@ import { Router } from '../routers/Router';
4
4
  import { Messenger } from '../messenger/Messenger';
5
5
  import { TargetElement } from './TargetElement';
6
6
  import { TargetAttr } from './TargetAttr';
7
+ import { Attrs } from '../rawsets/Attrs';
8
+ import { OperatorAround } from '../operators/OperatorExecuter';
7
9
  export declare type Config = {
8
10
  window: Window;
9
11
  targetElements?: TargetElement[];
10
12
  targetAttrs?: TargetAttr[];
13
+ operatorAround?: {
14
+ [key in keyof Attrs]?: OperatorAround;
15
+ };
11
16
  onElementInit?: (name: string, obj: any, rawSet: RawSet, targetElement: TargetElement) => any;
12
17
  onAttrInit?: (name: string, attrValue: string, obj: any, rawSet: RawSet) => any;
13
18
  proxyExcludeTyps?: ConstructorType<any>[];