diff --git a/djx/package.json b/djx/package.json --- a/djx/package.json +++ b/djx/package.json @@ -29,7 +29,7 @@ "eslint": "6.8.0", "requirejs": "2.3.6", "tslint": "^6.1.3", - "typescript": "4.0.2", + "typescript": "4.2.4", "yaml": "~1.7.2" } } diff --git a/djx/src/main/ts/tsx/FunctionRendition.ts b/djx/src/main/ts/tsx/FunctionRendition.ts --- a/djx/src/main/ts/tsx/FunctionRendition.ts +++ b/djx/src/main/ts/tsx/FunctionRendition.ts @@ -2,25 +2,28 @@ import { argumentNotNull } from "@implab import { RenditionBase } from "./RenditionBase"; export class FunctionRendition extends RenditionBase { - private _component: (props: any) => any; + private _component: (...args: any[]) => any; private _node: Node | undefined; - constructor(component: (props: any) => any) { + constructor(component: (...args: any[]) => any) { super(); argumentNotNull(component, "component"); this._component = component; } - _create(attrs: object, children: any[]) { + protected _create(attrs: object, children: any[]) { const _attrs: any = attrs || {}; - _attrs.children = children.map(x => this.getItemDom(x)); - - this._node = this.getItemDom(this._component.call(null, _attrs)); + const _children = children.map(x => this.getItemDom(x)); + this._node = this.getItemDom( + this._component.length === 2 ? + this._component.call(null, { ..._attrs }, _children) : + this._component.call(null, { ..._attrs, children: _children }) + ); } - _getDomNode() { + protected _getDomNode() { if (!this._node) throw new Error("The instance of the widget isn't created"); return this._node;