feat: add ModularPanel

doric-js/src/native/navigator.ts

@@ -14,8 +14,8 @@
  * limitations under the License.
  */
 import { BridgeContext } from "../runtime/global"
-import { ClassType } from "../pattern/mvvm"
 import { Panel } from "../ui/panel"
+import { ClassType } from "../util/types"
 
 export function internalScheme(context: BridgeContext, panelClass: ClassType<Panel>) {
     return `_internal_://export?class=${encodeURIComponent(panelClass.name)}&context=${context.id}`

doric-js/src/pattern/index.pattern.ts

@@ -15,4 +15,5 @@
  */
 export * from './candies'
 export * from './provider'
-export * from './mvvm'
+export * from './mvvm'
+export * from './modular'

doric-js/src/pattern/modular.ts

@@ -0,0 +1,59 @@
+import { Panel } from "../ui/panel"
+import { Group } from "../ui/view"
+import { ClassType } from "../util/types"
+
+export abstract class ModularPanel extends Panel {
+    private modules: Panel[]
+
+    constructor() {
+        super()
+        this.modules = this.setupModules().map(e => new e)
+    }
+
+    abstract setupModules(): ClassType<Panel>[]
+    abstract setupShelf(root: Group): Group
+
+    build(root: Group) {
+        root.children.length = 0
+        const groupView = this.setupShelf(root)
+        this.modules.forEach(e => {
+            Reflect.set(e, "__root__", groupView)
+            e.build(groupView)
+        })
+    }
+
+    onCreate() {
+        super.onCreate()
+        this.modules.forEach(e => {
+            e.onCreate()
+        })
+    }
+
+    onDestroy() {
+        super.onDestroy()
+        this.modules.forEach(e => {
+            e.onDestroy()
+        })
+    }
+
+    onShow() {
+        super.onShow()
+        this.modules.forEach(e => {
+            e.onShow()
+        })
+    }
+
+    onHidden() {
+        super.onHidden()
+        this.modules.forEach(e => {
+            e.onHidden()
+        })
+    }
+
+    onRenderFinished() {
+        super.onRenderFinished()
+        this.modules.forEach(e => {
+            e.onRenderFinished()
+        })
+    }
+}

doric-js/src/pattern/mvvm.ts

@@ -16,6 +16,7 @@
 import { Group } from "../ui/view"
 import { Panel } from "../ui/panel"
 import { BridgeContext } from "../runtime/global"
+import { ClassType } from "../util/types"
 
 export abstract class ViewHolder {
     abstract build(root: Group): void
@@ -56,7 +57,6 @@ export abstract class ViewModel<M extends Object, V extends ViewHolder> {
     abstract onBind(state: M, vh: V): void
 }
 
-export type ClassType<T> = new (...args: any) => T
 
 export abstract class VMPanel<M extends Object, V extends ViewHolder> extends Panel {
     private vm?: ViewModel<M, V>

doric-js/src/runtime/global.ts

@@ -1,5 +1,5 @@
 import { Panel } from "../ui/panel"
-import { ClassType } from "../pattern/mvvm"
+import { ClassType } from "../util/types"
 
 /*
  * Copyright [2019] [Doric.Pub]

doric-js/src/ui/panel.ts

@@ -235,7 +235,8 @@ export abstract class Panel {
             }, 0)
         }
     }
-    private onRenderFinished() {
+
+    onRenderFinished() {
         this.onRenderFinishedCallback.forEach(e => {
             e()
         })

doric-js/src/util/types.ts

@@ -70,4 +70,6 @@ export class Mutable<T>{
     static of<E>(v: E) {
         return new Mutable(v)
     }
-}
+}
+
+export type ClassType<T> = new (...args: any) => T