grucloud · FredericHeem · Nov 4, 2024 · Nov 4, 2024 · Nov 4, 2024
diff --git a/examples/mortgage-repayment-calculator/.gitignore b/examples/mortgage-repayment-calculator/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/examples/mortgage-repayment-calculator/.npmrc b/examples/mortgage-repayment-calculator/.npmrc
@@ -0,0 +1,2 @@
+save-exact = true
+package-lock = false
diff --git a/examples/mortgage-repayment-calculator/README.md b/examples/mortgage-repayment-calculator/README.md
@@ -0,0 +1,23 @@
+# Frontend Mentor Mortgage Repayment Calculator
+
+Here is the implementation in [Bau.js](https://github.com/grucloud/bau) of the [Frontend Mentor Mortgage Repayment Calculator code challenge](https://www.frontendmentor.io/challenges/mortgage-repayment-calculator-Galx1LXK73)
+
+## Workflow
+
+Install the dependencies:
+
+```sh
+npm install
+```
+
+Start a development server:
+
+```sh
+npm run dev
+```
+
+Build a production version:
+
+```sh
+npm run build
+```
diff --git a/examples/mortgage-repayment-calculator/index.html b/examples/mortgage-repayment-calculator/index.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link
+      rel="icon"
+      type="image/png"
+      href="./assets/images/favicon-32x32.png"
+    />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Mortgage Repayment Calculator | FrontendMentor</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
diff --git a/examples/mortgage-repayment-calculator/package.json b/examples/mortgage-repayment-calculator/package.json
@@ -0,0 +1,21 @@
+{
+  "name": "frontendmentor-mortgage-repayment-calculator",
+  "private": true,
+  "version": "0.85.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview"
+  },
+  "devDependencies": {
+    "typescript": "^5.0.2",
+    "vite": "^5.2.11"
+  },
+  "dependencies": {
+    "@grucloud/bau": "^0.85.0",
+    "@grucloud/bau-css": "^0.85.0",
+    "@grucloud/bau-ui": "^0.85.0",
+    "bignumber.js": "9.1.2"
+  }
+}
diff --git a/examples/mortgage-repayment-calculator/public/assets/images/favicon-32x32.png b/examples/mortgage-repayment-calculator/public/assets/images/favicon-32x32.png
diff --git a/examples/mortgage-repayment-calculator/public/assets/images/icon-calculator.svg b/examples/mortgage-repayment-calculator/public/assets/images/icon-calculator.svg
diff --git a/examples/mortgage-repayment-calculator/public/assets/images/illustration-empty.svg b/examples/mortgage-repayment-calculator/public/assets/images/illustration-empty.svg
diff --git a/examples/mortgage-repayment-calculator/src/main.ts b/examples/mortgage-repayment-calculator/src/main.ts
@@ -0,0 +1,20 @@
+import { createContext, type Context } from "@grucloud/bau-ui/context";
+import mortgageRepaymentCalculator from "./mortgageRepaymentCalculator";
+
+import "./style.css";
+
+const context = createContext();
+
+const app = (context: Context) => {
+  const { bau } = context;
+  const { main } = bau.tags;
+
+  const MortgageRepaymentCalculator = mortgageRepaymentCalculator(context);
+
+  return function () {
+    return main(MortgageRepaymentCalculator());
+  };
+};
+
+const App = app(context);
+document.getElementById("app")?.replaceChildren(App());