CDA: update dreamland-router

create-dreamland-app/templates/tsx/dreamland-router/patch.json

@@ -10,5 +10,5 @@
         }
     },
     "folders": ["src/routes/"],
-    "files": ["src/router.tsx", "src/main.tsx", "src/routes/home.tsx"]
+    "files": ["src/router.tsx", "src/routes/home.tsx"]
 }

create-dreamland-app/templates/tsx/dreamland-router/src/router.tsx

@@ -1,7 +1,14 @@
-import { Route } from 'dreamland-router';
+import { Router, Route } from 'dreamland-router';
 import Home from './routes/home';
-export const Router = (
-    <Route path="/">
+
+//base styles
+import './index.css';
+const base = css`
+    width: 100%;
+    height: 100%;
+`
+new Router(
+    <Route class={base}>
         <Route path="" show={<Home />} />
     </Route>
-).$;
+).mount(document.getElementById('app')!);

create-dreamland-app/templates/tsx/dreamland-router/src/routes/home.tsx

@@ -58,7 +58,13 @@ const docsButton = css`
     text-decoration: none;
 `
 
-const Home: Component<{}, { counter: number }> = function () {
+const Home: Component<{
+        // component properties. if you had a component that took a property like `<Button text="..." /> you would use a type like the one in the following line
+        // text: string
+        }, { 
+            // types for internal state
+            counter: number 
+        }> = function () {
     this.counter = 0;
     return (
          <div class={baseStyle}>