# HG changeset patch
# User cin
# Date 2021-05-19 22:16:38
# Node ID e3c05e9785a2ae916013e9eaf1c2d602dc45412c
# Parent  8ac132c8363922a58531c57063973aae684a1ae3

added support for two arguments (props, children) form of fucntional components

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<Node> {
-    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;