build(examples): add missing html/webpack files, update deps

dazld · Mar 5, 2018 · 8019df8 · 8019df8
1 parent 9becd43
commit 8019df8
Show file tree

Hide file tree

Showing 8 changed files with 197 additions and 3 deletions.
diff --git a/examples/devcards/index.html b/examples/devcards/index.html
@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <style>
+        html {
+            font: 100%/1.2 Helvetica, Arial, sans-serif;
+        }
+
+        body {
+            max-width: 40rem;
+        }
+
+        div.card {
+            background: #eee;
+        }
+
+        div.card h3 {
+            background: #333;
+            color: #fff;
+            padding: 0.5rem;
+            margin: 0.25em 0;
+            font-weight: 400;
+        }
+
+        div.card div.body {
+            padding: 0.25rem;
+        }
+
+        div.card pre {
+            border-top: 1px #ccc solid;
+            border-bottom: 1px #ccc solid;
+            padding: 1rem 0;
+            color: #666;
+            font-family: Menlo, monospace;
+        }
+
+        div.card input[type="range"] {
+            width: 100%;
+        }
+
+        .underweight,
+        .overweight {
+            color: orange;
+        }
+
+        .obese {
+            color: red;
+        }
+    </style>
+</head>
+
+<body>
+    <p>This example demonstrates different component state handling options provided by @thi.ng/atom and uses @thi.ng/hdom for
+        rendering.
+    </p>
+    <p>The idea of "Devcards" is originally by Bruce Haumann and this implementation is in no way meant to be comparable...</p>
+    <p>The BMI calculator example too was taken from Devcards (and by extension from Reagent Project examples).</p>
+    <p>Total filesize: 18.5KB (6.6KB gzip'd) - see
+        <a href="">source</a> for more information.</p>
+    <script type="text/javascript" src="bundle.js"></script>
+</body>
+
+</html>
diff --git a/examples/devcards/package.json b/examples/devcards/package.json
@@ -17,9 +17,9 @@
     },
     "dependencies": {
         "@thi.ng/api": "^2.0.3",
-        "@thi.ng/atom": "^0.7.3",
-        "@thi.ng/hdom": "^2.0.0",
-        "@thi.ng/rstream": "^1.0.8",
+        "@thi.ng/atom": "^0.8.0",
+        "@thi.ng/hdom": "^2.1.0",
+        "@thi.ng/rstream": "^1.0.9",
         "@thi.ng/transducers": "^1.6.1"
     }
 }
diff --git a/examples/devcards/webpack.config.js b/examples/devcards/webpack.config.js
@@ -0,0 +1,17 @@
+module.exports = {
+    entry: "./src/index.ts",
+    output: {
+        path: __dirname,
+        filename: "bundle.js"
+    },
+    resolve: {
+        extensions: [".ts", ".js"]
+    },
+    module: {
+        loaders: [{ test: /\.ts$/, loader: "ts-loader" }]
+    },
+    node: {
+        process: false,
+        setImmediate: false
+    }
+};
diff --git a/examples/lifecycle-hooks/webpack.config.js b/examples/lifecycle-hooks/webpack.config.js
@@ -0,0 +1,17 @@
+module.exports = {
+    entry: "./src/index.ts",
+    output: {
+        path: __dirname,
+        filename: "bundle.js"
+    },
+    resolve: {
+        extensions: [".ts", ".js"]
+    },
+    module: {
+        loaders: [{ test: /\.ts$/, loader: "ts-loader" }]
+    },
+    node: {
+        process: false,
+        setImmediate: false
+    }
+};
diff --git a/examples/login-form/index.html b/examples/login-form/index.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <style>
+        html {
+            font: 100%/1.2 Helvetica, Arial, sans-serif;
+        }
+
+        .error {
+            background: #fbb;
+            color: #900;
+            padding: 0.5em 1em;
+            margin-bottom: 1em;
+        }
+
+        footer {
+            position: fixed;
+            bottom: 1em;
+            left: 1em;
+        }
+    </style>
+</head>
+
+<body>
+    <div id="app"></div>
+    <script type="text/javascript" src="bundle.js"></script>
+</body>
+
+</html>
diff --git a/examples/login-form/webpack.config.js b/examples/login-form/webpack.config.js
@@ -0,0 +1,17 @@
+module.exports = {
+    entry: "./src/index.ts",
+    output: {
+        path: __dirname,
+        filename: "bundle.js"
+    },
+    resolve: {
+        extensions: [".ts", ".js"]
+    },
+    module: {
+        loaders: [{ test: /\.ts$/, loader: "ts-loader" }]
+    },
+    node: {
+        process: false,
+        setImmediate: false
+    }
+};
diff --git a/examples/svg-particles/index.html b/examples/svg-particles/index.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <style>
+        html {
+            font: 100%/1.2 Helvetica, Arial, sans-serif;
+        }
+
+        body {
+            margin: 0;
+        }
+
+        footer {
+            position: absolute;
+            left: 20px;
+            bottom: 20px;
+            z-index: 1;
+        }
+    </style>
+</head>
+
+<body>
+    <div id="app"></div>
+    <footer>
+        Made with
+        <a href="https://github.com/thi-ng/umbrella/tree/master/packages/hdom">@thi.ng/hdom</a>.
+    </footer>
+    <script type="text/javascript" src="bundle.js"></script>
+</body>
+
+</html>
diff --git a/examples/svg-particles/webpack.config.js b/examples/svg-particles/webpack.config.js
@@ -0,0 +1,17 @@
+module.exports = {
+    entry: "./src/index.ts",
+    output: {
+        path: __dirname,
+        filename: "bundle.js"
+    },
+    resolve: {
+        extensions: [".ts", ".js"]
+    },
+    module: {
+        loaders: [{ test: /\.ts$/, loader: "ts-loader" }]
+    },
+    node: {
+        process: false,
+        setImmediate: false
+    }
+};