j-templates 7.0.5 → 7.0.7

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 (7) hide show
  1. package/DOM/elements.d.ts +10 -10
  2. package/Node/component.d.ts +3 -2
  3. package/Node/component.js +3 -3
  4. package/Node/vNode.d.ts +2 -2
  5. package/Node/vNode.js +28 -21
  6. package/Node/vNode.types.d.ts +2 -1
  7. package/package.json +1 -1
package/DOM/elements.d.ts CHANGED
@@ -5,7 +5,7 @@ export declare const div: <T>(config: {
5
5
  }>;
6
6
  on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
7
7
  data?: () => T | Array<T> | Promise<Array<T>> | Promise<T>;
8
- }, children?: import("../Node/vNode.types").vNode[] | ((data: T) => string | import("../Node/vNode.types").vNode | import("../Node/vNode.types").vNode[])) => import("../Node/vNode.types").vNode;
8
+ }, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
9
9
  export declare const a: <T>(config: {
10
10
  props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
11
11
  attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -13,7 +13,7 @@ export declare const a: <T>(config: {
13
13
  }>;
14
14
  on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
15
15
  data?: () => T | Array<T> | Promise<Array<T>> | Promise<T>;
16
- }, children?: import("../Node/vNode.types").vNode[] | ((data: T) => string | import("../Node/vNode.types").vNode | import("../Node/vNode.types").vNode[])) => import("../Node/vNode.types").vNode;
16
+ }, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
17
17
  export declare const button: <T>(config: {
18
18
  props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLButtonElement>>;
19
19
  attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -21,7 +21,7 @@ export declare const button: <T>(config: {
21
21
  }>;
22
22
  on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
23
23
  data?: () => T | Array<T> | Promise<Array<T>> | Promise<T>;
24
- }, children?: import("../Node/vNode.types").vNode[] | ((data: T) => string | import("../Node/vNode.types").vNode | import("../Node/vNode.types").vNode[])) => import("../Node/vNode.types").vNode;
24
+ }, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
25
25
  export declare const h1: <T>(config: {
26
26
  props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
27
27
  attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -29,7 +29,7 @@ export declare const h1: <T>(config: {
29
29
  }>;
30
30
  on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
31
31
  data?: () => T | Array<T> | Promise<Array<T>> | Promise<T>;
32
- }, children?: import("../Node/vNode.types").vNode[] | ((data: T) => string | import("../Node/vNode.types").vNode | import("../Node/vNode.types").vNode[])) => import("../Node/vNode.types").vNode;
32
+ }, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
33
33
  export declare const input: <T>(config: {
34
34
  props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLInputElement>>;
35
35
  attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -37,7 +37,7 @@ export declare const input: <T>(config: {
37
37
  }>;
38
38
  on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
39
39
  data?: () => T | Array<T> | Promise<Array<T>> | Promise<T>;
40
- }, children?: import("../Node/vNode.types").vNode[] | ((data: T) => string | import("../Node/vNode.types").vNode | import("../Node/vNode.types").vNode[])) => import("../Node/vNode.types").vNode;
40
+ }, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
41
41
  export declare const span: <T>(config: {
42
42
  props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
43
43
  attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -45,7 +45,7 @@ export declare const span: <T>(config: {
45
45
  }>;
46
46
  on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
47
47
  data?: () => T | Array<T> | Promise<Array<T>> | Promise<T>;
48
- }, children?: import("../Node/vNode.types").vNode[] | ((data: T) => string | import("../Node/vNode.types").vNode | import("../Node/vNode.types").vNode[])) => import("../Node/vNode.types").vNode;
48
+ }, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
49
49
  export declare const table: <T>(config: {
50
50
  props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
51
51
  attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -53,7 +53,7 @@ export declare const table: <T>(config: {
53
53
  }>;
54
54
  on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
55
55
  data?: () => T | Array<T> | Promise<Array<T>> | Promise<T>;
56
- }, children?: import("../Node/vNode.types").vNode[] | ((data: T) => string | import("../Node/vNode.types").vNode | import("../Node/vNode.types").vNode[])) => import("../Node/vNode.types").vNode;
56
+ }, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
57
57
  export declare const tbody: <T>(config: {
58
58
  props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
59
59
  attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -61,7 +61,7 @@ export declare const tbody: <T>(config: {
61
61
  }>;
62
62
  on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
63
63
  data?: () => T | Array<T> | Promise<Array<T>> | Promise<T>;
64
- }, children?: import("../Node/vNode.types").vNode[] | ((data: T) => string | import("../Node/vNode.types").vNode | import("../Node/vNode.types").vNode[])) => import("../Node/vNode.types").vNode;
64
+ }, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
65
65
  export declare const tr: <T>(config: {
66
66
  props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
67
67
  attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -69,7 +69,7 @@ export declare const tr: <T>(config: {
69
69
  }>;
70
70
  on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
71
71
  data?: () => T | Array<T> | Promise<Array<T>> | Promise<T>;
72
- }, children?: import("../Node/vNode.types").vNode[] | ((data: T) => string | import("../Node/vNode.types").vNode | import("../Node/vNode.types").vNode[])) => import("../Node/vNode.types").vNode;
72
+ }, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
73
73
  export declare const td: <T>(config: {
74
74
  props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
75
75
  attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -77,4 +77,4 @@ export declare const td: <T>(config: {
77
77
  }>;
78
78
  on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
79
79
  data?: () => T | Array<T> | Promise<Array<T>> | Promise<T>;
80
- }, children?: import("../Node/vNode.types").vNode[] | ((data: T) => string | import("../Node/vNode.types").vNode | import("../Node/vNode.types").vNode[])) => import("../Node/vNode.types").vNode;
80
+ }, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
package/Node/component.d.ts CHANGED
@@ -13,8 +13,9 @@ export declare class Component<D = void, T = void, E = {}> {
13
13
  protected get Data(): D;
14
14
  protected get VNode(): vNodeType;
15
15
  protected get Templates(): T;
16
- constructor(data: D | (() => (D | Promise<D>)), templates: T, vNode: vNodeType, componentEvents: ComponentEvents<E>);
16
+ constructor(data: D | (() => D | Promise<D>), templates: T, vNode: vNodeType, componentEvents: ComponentEvents<E>);
17
17
  Template(): vNodeType | vNodeType[];
18
+ Template(): string;
18
19
  Bound(): void;
19
20
  Fire<P extends keyof E>(event: P, data?: E[P]): void;
20
21
  Destroy(): void;
@@ -25,7 +26,7 @@ type vComponentConfig<D, E, P = HTMLElement> = {
25
26
  on?: ComponentEvents<E> | undefined;
26
27
  };
27
28
  type ComponentConstructor<D, T, E> = {
28
- new (data: D | (() => (D | Promise<D>)), templates: T, vNode: vNodeType, componentEvents: ComponentEvents<E>): Component<D, T, E>;
29
+ new (data: D | (() => D | Promise<D>), templates: T, vNode: vNodeType, componentEvents: ComponentEvents<E>): Component<D, T, E>;
29
30
  };
30
31
  export declare namespace Component {
31
32
  function ToFunction<D, T, E, P = HTMLElement>(type: string, constructor: ComponentConstructor<D, T, E>, namespace?: string): (config: vComponentConfig<D, E, P>, templates?: T) => vNodeType;
package/Node/component.js CHANGED
@@ -26,14 +26,14 @@ class Component {
26
26
  constructor(data, templates, vNode, componentEvents) {
27
27
  this.vNode = vNode;
28
28
  this.componentEvents = componentEvents;
29
- if (typeof data === 'function')
29
+ if (typeof data === "function")
30
30
  this.scope = new observableScope_1.ObservableScope(data);
31
31
  else
32
32
  this.scope = new observableScope_1.ObservableScope(() => data);
33
33
  this.templates = templates || {};
34
34
  }
35
35
  Template() {
36
- return [];
36
+ return "";
37
37
  }
38
38
  Bound() { }
39
39
  Fire(event, data) {
@@ -59,7 +59,7 @@ exports.Component = Component;
59
59
  type,
60
60
  namespace: namespace ?? null,
61
61
  props,
62
- componentConstructor: ConcreteComponent
62
+ componentConstructor: ConcreteComponent,
63
63
  };
64
64
  return vNode_1.vNode.Create(definition);
65
65
  };
package/Node/vNode.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { RecursivePartial } from "../Utils/utils.types";
2
- import { vNode as vNodeType, vNodeDefinition, FunctionOr, vNodeEvents } from "./vNode.types";
2
+ import { vNode as vNodeType, vNodeDefinition, FunctionOr, vNodeEvents, vNodeChildrenFunction } from "./vNode.types";
3
3
  type vNodeConfig<P = HTMLElement, E = HTMLElementEventMap, T = never> = {
4
4
  props?: FunctionOr<RecursivePartial<P>>;
5
5
  attrs?: FunctionOr<{
@@ -14,7 +14,7 @@ export declare namespace vNode {
14
14
  function InitAll(vnodes: vNodeType[]): void;
15
15
  function Destroy(vnode: vNodeType): void;
16
16
  function DestroyAll(vnodes: vNodeType[]): void;
17
- function ToFunction<P = HTMLElement, E = HTMLElementEventMap>(type: string, namespace?: string): <T>(config: vNodeConfig<P, E, T>, children?: vNodeType[] | ((data: T) => string | vNodeType | vNodeType[])) => vNodeType;
17
+ function ToFunction<P = HTMLElement, E = HTMLElementEventMap>(type: string, namespace?: string): <T>(config: vNodeConfig<P, E, T>, children?: vNodeType[] | vNodeChildrenFunction<T>) => vNodeType;
18
18
  function Attach(node: any, vnode: vNodeType): vNodeType;
19
19
  }
20
20
  export {};
package/Node/vNode.js CHANGED
@@ -16,7 +16,7 @@ var vNode;
16
16
  children: null,
17
17
  destroyed: false,
18
18
  component: null,
19
- scopes: []
19
+ scopes: [],
20
20
  };
21
21
  }
22
22
  vNode.Create = Create;
@@ -47,10 +47,14 @@ var vNode;
47
47
  vNode.DestroyAll = DestroyAll;
48
48
  function ToFunction(type, namespace) {
49
49
  return function (config, children) {
50
- const childrenConfig = children ? Array.isArray(children) ? { childrenArray: children } : { children } : undefined;
50
+ const childrenConfig = children
51
+ ? Array.isArray(children)
52
+ ? { childrenArray: children }
53
+ : { children }
54
+ : undefined;
51
55
  const definition = Object.assign({
52
56
  type,
53
- namespace: namespace ?? null
57
+ namespace: namespace ?? null,
54
58
  }, config, childrenConfig);
55
59
  return Create(definition);
56
60
  };
@@ -64,12 +68,12 @@ var vNode;
64
68
  vNode.Attach = Attach;
65
69
  })(vNode || (exports.vNode = vNode = {}));
66
70
  function InitNode(vnode) {
67
- const { type, namespace, props, attrs, on, data, componentConstructor, children, childrenArray } = vnode.definition;
68
- const node = vnode.node = nodeConfig_1.NodeConfig.createNode(type, namespace);
71
+ const { type, namespace, props, attrs, on, data, componentConstructor, children, childrenArray, } = vnode.definition;
72
+ const node = (vnode.node = nodeConfig_1.NodeConfig.createNode(type, namespace));
69
73
  vnode.definition = null;
70
74
  if (props) {
71
75
  const assignProperties = nodeConfig_1.NodeConfig.createPropertyAssignment(node);
72
- if (typeof props === 'function') {
76
+ if (typeof props === "function") {
73
77
  const scope = Store_1.ObservableScope.Create(props);
74
78
  vnode.scopes.push(scope);
75
79
  Store_1.ObservableScope.Watch(scope, ScheduledAssignment(assignProperties));
@@ -81,7 +85,7 @@ function InitNode(vnode) {
81
85
  }
82
86
  if (on) {
83
87
  const assignEvents = nodeConfig_1.NodeConfig.createEventAssignment(node);
84
- if (typeof on === 'function') {
88
+ if (typeof on === "function") {
85
89
  const scope = Store_1.ObservableScope.Create(on);
86
90
  vnode.scopes.push(scope);
87
91
  Store_1.ObservableScope.Watch(scope, ScheduledAssignment(assignEvents));
@@ -93,7 +97,7 @@ function InitNode(vnode) {
93
97
  }
94
98
  if (attrs) {
95
99
  const assignAttributes = nodeConfig_1.NodeConfig.createAttributeAssignment(node);
96
- if (typeof attrs === 'function') {
100
+ if (typeof attrs === "function") {
97
101
  const scope = Store_1.ObservableScope.Create(attrs);
98
102
  vnode.scopes.push(scope);
99
103
  Store_1.ObservableScope.Watch(scope, ScheduledAssignment(assignAttributes));
@@ -138,13 +142,13 @@ function InitNode(vnode) {
138
142
  function StaticChildren(vnode, children) {
139
143
  const childrenScope = Store_1.ObservableScope.Create(WrapStaticChildren(vnode.injector, children));
140
144
  const child = Store_1.ObservableScope.Peek(childrenScope);
141
- if (typeof child === 'string') {
145
+ if (typeof child === "string") {
142
146
  const node = vNode.Create({
143
- type: 'text',
147
+ type: "text",
144
148
  namespace: null,
145
149
  props() {
146
150
  return { nodeValue: Store_1.ObservableScope.Value(childrenScope) };
147
- }
151
+ },
148
152
  });
149
153
  node.scopes.push(childrenScope);
150
154
  vnode.children = [node];
@@ -194,15 +198,18 @@ function DynamicChildren(vnode, children, data) {
194
198
  function WrapDynamicChildren(dataScope, nodeList, injector, children) {
195
199
  return function () {
196
200
  const nextData = Store_1.ObservableScope.Value(dataScope);
197
- const nodeMap = list_1.List.ToNodeMap(nodeList, function (data) { return data.data; });
201
+ const nodeMap = list_1.List.ToNodeMap(nodeList, function (data) {
202
+ return data.data;
203
+ });
198
204
  const nextNodeList = list_1.List.Create();
199
205
  const nextNodeArray = [];
200
206
  for (let x = 0; x < nextData.length; x++) {
201
207
  const data = nextData[x];
202
208
  const existingNodeArray = nodeMap.get(data);
203
209
  let existingNode = null;
204
- ;
205
- for (let x = 0; existingNodeArray && x < existingNodeArray.length && existingNode === null; x++) {
210
+ for (let x = 0; existingNodeArray &&
211
+ x < existingNodeArray.length &&
212
+ existingNode === null; x++) {
206
213
  existingNode = existingNodeArray[x];
207
214
  existingNodeArray[x] = null;
208
215
  }
@@ -221,13 +228,13 @@ function WrapDynamicChildren(dataScope, nodeList, injector, children) {
221
228
  const childNodes = injector_1.Injector.Scope(injector, children, data);
222
229
  const nodes = Array.isArray(childNodes) ? childNodes : [childNodes];
223
230
  for (let x = 0; x < nodes.length; x++) {
224
- if (typeof nodes[x] === 'string')
231
+ if (typeof nodes[x] === "string")
225
232
  nodes[x] = vNode.Create({
226
- type: 'text',
233
+ type: "text",
227
234
  namespace: null,
228
235
  props: {
229
- nodeValue: nodes[x]
230
- }
236
+ nodeValue: nodes[x],
237
+ },
231
238
  });
232
239
  }
233
240
  return nodes;
@@ -235,7 +242,7 @@ function WrapDynamicChildren(dataScope, nodeList, injector, children) {
235
242
  list_1.List.Add(nextNodeList, {
236
243
  data,
237
244
  nodes: Store_1.ObservableScope.Value(childrenScope),
238
- scope: childrenScope
245
+ scope: childrenScope,
239
246
  });
240
247
  }
241
248
  nextNodeArray.push(...nextNodeList.tail.data.nodes);
@@ -266,12 +273,12 @@ function UpdateChildren(vnode, init = false) {
266
273
  if (vnode.destroyed || children !== vnode.children)
267
274
  return;
268
275
  if (init || !async)
269
- nodeConfig_1.NodeConfig.reconcileChildren(vnode.node, vnode.children.map(vnode => vnode.node));
276
+ nodeConfig_1.NodeConfig.reconcileChildren(vnode.node, vnode.children.map((vnode) => vnode.node));
270
277
  else
271
278
  nodeConfig_1.NodeConfig.scheduleUpdate(function () {
272
279
  if (vnode.destroyed || children !== vnode.children)
273
280
  return;
274
- nodeConfig_1.NodeConfig.reconcileChildren(vnode.node, vnode.children.map(vnode => vnode.node));
281
+ nodeConfig_1.NodeConfig.reconcileChildren(vnode.node, vnode.children.map((vnode) => vnode.node));
275
282
  });
276
283
  });
277
284
  });
package/Node/vNode.types.d.ts CHANGED
@@ -12,6 +12,7 @@ export type vNodeEvents<E extends {
12
12
  (events: E[P]): void;
13
13
  };
14
14
  };
15
+ export type vNodeChildrenFunction<T> = ((data: T) => vNode | vNode[]) | ((data: T) => string);
15
16
  export type vNode = {
16
17
  definition: vNodeDefinition<any, any, any>;
17
18
  injector: Injector;
@@ -30,7 +31,7 @@ export type vNodeDefinition<P = HTMLElement, E = HTMLElementEventMap, T = never>
30
31
  }>;
31
32
  on?: FunctionOr<vNodeEvents<E>>;
32
33
  data?: () => T | Array<T> | Promise<Array<T>> | Promise<T>;
33
- children?: (data: T) => string | vNode | vNode[];
34
+ children?: vNodeChildrenFunction<T>;
34
35
  childrenArray?: vNode[];
35
36
  componentConstructor?: {
36
37
  new (vnode: vNode): Component<any, any, any>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "j-templates",
3
- "version": "7.0.5",
3
+ "version": "7.0.7",
4
4
  "description": "j-templates",
5
5
  "license": "MIT",
6
6
  "repository": "https://github.com/TypesInCode/jTemplates",