\n \n \n\n",[],[194],"91ffb741-abaa-4b94-b44c-2aaa14717d2c","index.html","ecd8ff60-9ce0-11f1-a5bb-1607ee4eb77e",44,["D",1787869593067],"\n\n \n \n \n Takoma Park purchase model\n \n \n \n \n \n \n

\n \n \n\n",[],[203],"a0c2d634-93ab-4371-9358-2515135c1643","deno.json","ec407f4c-9ce0-11f1-b46e-1607ee4eb77e",59,["D",1788042566187],"{\n \"tasks\": {\n \"dev\": \"deno run --allow-net --allow-read --allow-env --env-file=.env --watch=main.tsx,server/ main.tsx\",\n \"test\": \"deno test frontend/\",\n \"check\": \"deno check main.tsx && deno fmt --check && deno lint && deno test --quiet frontend/\"\n },\n \"compilerOptions\": {\n \"jsx\": \"react\",\n \"lib\": [\n \"deno.window\",\n \"dom\",\n \"dom.iterable\"\n ]\n },\n \"fmt\": {\n \"exclude\": [\n \".claude/\",\n \".vt/\",\n \"circleave/\",\n \"frontend/model.jsx\"\n ]\n },\n \"lint\": {\n \"exclude\": [\n \".claude/\",\n \"circleave/\",\n \"frontend/model.jsx\"\n ],\n \"rules\": {\n \"exclude\": [\n \"no-import-prefix\"\n ]\n }\n }\n}\n",[],[211],"2c4a9783-fc72-4d01-a238-ded7df2b3318","README.md","ec6db6c4-9ce0-11f1-b46e-1607ee4eb77e",61,["D",1788042566240],"# househunt\n\nInteractive model of a Takoma Park purchase: closing costs, SBLOC bridge,\ndouble-carry during renovation, MD reassessment, and 60 months of cash / equity.\n\nBehind a password, and your figures live in your browser, not in this repo.\n\n## Run locally\n\n```\ndeno task dev\n```\n\nReads `.env` for `HOUSEHUNT_PASSWORD` and serves http://localhost:8000. The\nserver watches itself; client edits are picked up on reload — files are read and\ntranspiled per request, no build step.\n\n`deno task test` runs the model's unit tests. `deno task check` runs\n`deno check` + `fmt --check` + `lint` + the tests.\n\n## Access\n\nOne shared password in `HOUSEHUNT_PASSWORD`. Signing in sets a signed, HttpOnly\ncookie good for 30 days; the signing secret is derived from the password, so\nchanging the password signs every device out. Set `SESSION_SECRET` to pin it\ninstead. Every route except `/login` is gated, including the client modules.\n\n## Your numbers\n\nNothing personal is in the source. `frontend/schema.js` splits inputs in two:\n\n- `MODEL_PARAMS` — rates, county fees, insurance, reassessment and policy\n assumptions. Generic, stay in the repo.\n- `PERSONAL_FIELDS` — price, renovation, and DC rent budgets, plus cash, gifts,\n and SBLOC for funding the purchase. Blank in the repo, entered on first visit,\n saved to `localStorage` under `househunt:inputs:v1`.\n\nFirst visit shows a setup screen: type the figures in, or paste a JSON blob.\nYour original values are in `private/defaults.local.json` (gitignored, and\nexcluded from the Val Town push) — paste that on first load, then delete the\nfile if you'd rather it not sit on disk.\n\nAfter that every edit persists automatically. The left column has **Copy values\nas JSON** (for moving to another browser), **Reset rates and fees**, **Erase and\nstart over** (back to the setup screen), and **Sign out**. Clearing site data\nloses the figures — copy them out first.\n\n## Layout\n\n| Path | What it is |\n| ------------------------ | ------------------------------------------------------------- |\n| `main.tsx` | Hono app — default export for Val Town, `Deno.serve` locally |\n| `server/auth.ts` | Password check, signed session cookie, gate middleware |\n| `server/files.ts` | File serving: `std/utils` on Val Town, disk + sucrase locally |\n| `login.html` | Sign-in page |\n| `index.html` | App shell: Twind CDN, Val Town error catcher, module script |\n| `frontend/index.jsx` | Mounts setup or model depending on what's stored |\n| `frontend/setup.jsx` | First-run screen |\n| `frontend/schema.js` | Model params vs. personal fields |\n| `frontend/storage.js` | localStorage read/write |\n| `frontend/model.js` | The model: closing costs, MD assessment, cash sim, frontier |\n| `frontend/model.jsx` | The UI around it |\n| `frontend/model_test.js` | Unit tests for `model.js` |\n\nReact and recharts load from esm.sh in the browser, pinned to react 18.2.0.\nClient imports keep explicit extensions (`./model.jsx`) because the browser\nresolves them as URLs.\n\n## Moving to Val Town\n\nPush these files to a val with `main.tsx` as the HTTP entrypoint, then set\n`HOUSEHUNT_PASSWORD` in the val's environment variables — it is not in the code\nand the app returns a 500 explaining itself until it's set. `.vtignore` keeps\n`.env` and `private/` out of the push.\n\nThere:\n\n- `serveFile` from `https://esm.town/v/std/utils/index.ts` reads project files\n and transpiles `.jsx` on the way out; sucrase and the disk reads are never\n loaded (`IS_VAL_TOWN` is decided by whether modules load over `https:`).\n- `/source` redirects to the val via `parseVal()`.\n- Client errors surface in val logs through `https://esm.town/v/std/catch`.\n",[],[219],"5834bf9f-4ac2-4b59-8bc6-a8e0ffb1a6c6",".vtignore","ec8c86f8-9ce0-11f1-9127-1607ee4eb77e",31,["D",1787512058680],".env\nprivate/\ndeno.lock\n.claude/\n.git\n",[],[227],"a1bd7e59-538d-46a7-bc41-e4cc6a07153e",".gitignore","ec80c23c-9ce0-11f1-9de6-1607ee4eb77e",["D",1788176715558],3,".env\n.env*\nprivate/\ncircleave\n.claude/\n.vt/\n",[],[235],"83fc666f-7348-492a-8819-269f1414f505","files.ts","ec59d8ca-9ce0-11f1-a8fe-1607ee4eb77e",14,["D",1787262527599],"// File serving that works both on Val Town and on a local Deno process.\n//\n// Val Town has no filesystem: files are read through std/utils, which also\n// transpiles .ts/.tsx/.jsx on the way out. Locally we read from disk and\n// transpile with sucrase so the browser gets the same plain JS either way.\n\n// Val Town loads modules over https from esm.town; locally they are file:// URLs.\nexport const IS_VAL_TOWN = !import.meta.url.startsWith(\"file://\") ||\n Boolean(Deno.env.get(\"valtown\"));\n\nconst ROOT = new URL(\"../\", import.meta.url);\n\nconst CONTENT_TYPES: Record = {\n \".html\": \"text/html; charset=utf-8\",\n \".css\": \"text/css; charset=utf-8\",\n \".js\": \"text/javascript; charset=utf-8\",\n \".json\": \"application/json; charset=utf-8\",\n \".svg\": \"image/svg+xml\",\n \".ico\": \"image/x-icon\",\n \".png\": \"image/png\",\n \".txt\": \"text/plain; charset=utf-8\",\n};\n\nconst TRANSPILED = new Set([\".ts\", \".tsx\", \".jsx\"]);\n\n// Imported lazily so the Val Town deploy never pulls it in.\nlet sucrase: typeof import(\"npm:sucrase@3.35.0\") | undefined;\nasync function transpile(source: string, filePath: string): Promise {\n sucrase ??= await import(\"npm:sucrase@3.35.0\");\n return sucrase.transform(source, {\n transforms: [\"typescript\", \"jsx\"],\n filePath,\n production: true,\n }).code;\n}\n\nfunction extname(path: string): string {\n const i = path.lastIndexOf(\".\");\n return i === -1 ? \"\" : path.slice(i).toLowerCase();\n}\n\nexport async function serveFile(path: string): Promise {\n if (IS_VAL_TOWN) {\n const { serveFile: valTownServeFile } = await import(\n \"https://esm.town/v/std/utils/index.ts\"\n );\n return await valTownServeFile(path, import.meta.url);\n }\n return await serveLocalFile(path);\n}\n\nasync function serveLocalFile(path: string): Promise {\n const file = new URL(path.replace(/^\\/+/, \"\"), ROOT);\n if (!file.href.startsWith(ROOT.href)) {\n return new Response(\"Not found\", { status: 404 });\n }\n\n const ext = extname(path);\n let body: string | Uint8Array;\n try {\n body = TRANSPILED.has(ext)\n ? await Deno.readTextFile(file)\n : await Deno.readFile(file);\n } catch (err) {\n if (err instanceof Deno.errors.NotFound) {\n return new Response(\"Not found\", { status: 404 });\n }\n throw err;\n }\n\n let contentType = CONTENT_TYPES[ext] ?? \"application/octet-stream\";\n if (TRANSPILED.has(ext)) {\n body = await transpile(body as string, path);\n contentType = CONTENT_TYPES[\".js\"];\n }\n\n return new Response(body, {\n headers: {\n \"content-type\": contentType,\n // Local dev only: always pick up the latest edit on reload.\n \"cache-control\": \"no-store\",\n },\n });\n}\n",[],[150,243],["D",1787262527736],[],[150,63],"5766a7d8-7e21-4697-b7bf-49455daf9980",["D",1787262526708],"directory",[173,174],[150],"b9a1e137-9e3e-4da1-a1a1-c02db951a82a","storage.js","ec332478-9ce0-11f1-a8fe-1607ee4eb77e","eb86824a-9ce0-11f1-8fc3-1607ee4eb77e",10,["D",1787262527429],"// All inputs live in this browser only. Nothing is sent to the server.\n\nimport { withDefaults } from \"./schema.js\";\n\nconst KEY = \"househunt:inputs:v1\";\n\nexport function loadInputs() {\n try {\n const raw = localStorage.getItem(KEY);\n if (!raw) return null;\n const parsed = JSON.parse(raw);\n return parsed && typeof parsed === \"object\" ? withDefaults(parsed) : null;\n } catch {\n return null;\n }\n}\n\nexport function saveInputs(inputs) {\n try {\n localStorage.setItem(KEY, JSON.stringify(inputs));\n } catch {\n // Private browsing or a full quota — the session still works, it just\n // won't survive a reload.\n }\n}\n\nexport function clearInputs() {\n try {\n localStorage.removeItem(KEY);\n } catch {\n // nothing to do\n }\n}\n",[],[267,259],"frontend","2cb10c96-1a54-42ca-89f4-1a46d1c28209","setup.jsx","ec1b1a86-9ce0-11f1-8d4a-1607ee4eb77e",45,["D",1787869593115],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport {\n BLANK,\n PERSONAL_FIELDS,\n PERSONAL_KEYS,\n withDefaults,\n} from \"./schema.js\";\n\nconst GROUPS = [\"House\", \"Liquidity\"];\n\nfunction Field({ field, value, onChange }) {\n return (\n \n {field.label}\n \n \n onChange(e.target.value === \"\" ? 0 : Number(e.target.value))}\n className=\"w-32 rounded border border-slate-300 px-2 py-1 text-right text-xs font-mono tabular-nums focus:border-slate-900 focus:outline-none\"\n />\n {field.suffix ?? \"\"}\n \n \n );\n}\n\nexport default function Setup({ onDone }) {\n const [values, setValues] = useState(BLANK);\n const [paste, setPaste] = useState(\"\");\n const [pasteError, setPasteError] = useState(\"\");\n\n const set = (key) => (v) => setValues((p) => ({ ...p, [key]: v }));\n\n const importJson = () => {\n try {\n const parsed = JSON.parse(paste);\n if (!parsed || typeof parsed !== \"object\") {\n throw new Error(\"not an object\");\n }\n setValues(withDefaults(parsed));\n setPaste(\"\");\n setPasteError(\"\");\n } catch {\n setPasteError(\"That isn't valid JSON.\");\n }\n };\n\n const ready = PERSONAL_KEYS.some((k) => Number(values[k]) > 0);\n\n return (\n

Set up your numbers

\n These stay in this browser's local storage — they are not in the\n source and never reach the server. Everything is editable later;\n rates, fees, and county assumptions already have defaults.\n

\n\n

\n {GROUPS.map((group) => (\n \n

\n {group}\n

\n {PERSONAL_FIELDS.filter((f) => f.group === group).map((f) => (\n \n ))}\n

\n ))}\n\n

\n Paste saved values\n

\n JSON exported from another browser, or from your own notes.\n

\n setPaste(e.target.value)}\n rows={5}\n placeholder='{\"price\": 1100000, \"cashNow\": 300000, ...}'\n className=\"mt-1 w-full rounded border border-slate-300 px-2 py-1 font-mono text-xs focus:border-slate-900 focus:outline-none\"\n />\n {pasteError &&

{pasteError}

}\n \n Load into the form\n \n

\n\n onDone(values)}\n disabled={!ready}\n className=\"w-full rounded bg-slate-900 px-3 py-2 text-sm text-white hover:bg-slate-700 disabled:opacity-40\"\n >\n Save and open the model\n \n

\n \n );\n}\n",[],[267,269],"4c1dad0d-7e90-4edb-bb84-aa2fb0262eb4","schema.js","ec0fae62-9ce0-11f1-b401-1607ee4eb77e",58,["D",1788042566127],5,"// Two kinds of input. Model parameters are market/county assumptions and stay\n// in source. Personal fields are your money — they live only in this browser's\n// localStorage, entered on first visit. Cash, gifts, and the SBLOC are a\n// dedicated fund for the purchase itself (through move-in), isolated from\n// ordinary monthly income/expenses, which this app doesn't track.\n\nexport const MODEL_PARAMS = {\n // House\n downPct: 20,\n pmiAnnualPct: 0.55,\n mortgageRate: 6.5,\n termYears: 30,\n propTaxRate: 1.65,\n itoc: 692,\n insuranceAnnual: 2400,\n // The price `insuranceAnnual` is a quote for. Premiums price off replacement\n // cost, so the quote has to be pinned to a house before it can be scaled to\n // any other one — otherwise a $1.6M house insures for the same $2,400 as a\n // $600k house, and the frontier's price axis sees no insurance at all.\n insuranceBasePrice: 1000000,\n replacementCostPct: 65,\n insuranceVacancyMult: 1.75,\n buildersRiskPct: 2.0,\n buyerSharePct: 50,\n titlePct: 0.55,\n fixedFees: 5500,\n escrowMonths: 3,\n firstTime: true,\n ownerOccupied: true,\n\n // Renovation\n renoMonths: 6,\n renoStart: 0,\n movingCost: 5000,\n renoValueAdd: 70,\n appreciation: 3.0,\n\n // Reassessment\n modelReassessment: true,\n // Maryland does not reassess on sale — the SDAT value in force at closing\n // carries until the next cycle, and it usually trails the purchase price.\n assessmentRatioPct: 85,\n reassessLagMonths: 6,\n homesteadCapPct: 10,\n\n // Policy\n priority: \"reno,sbloc\",\n sweepMonthly: true,\n};\n\nexport const PERSONAL_FIELDS = [\n { key: \"price\", group: \"House\", label: \"Purchase price\", step: 10000 },\n { key: \"renoCost\", group: \"House\", label: \"Renovation budget\", step: 5000 },\n { key: \"rent\", group: \"House\", label: \"DC rent (double carry)\" },\n\n { key: \"cashNow\", group: \"Liquidity\", label: \"Cash today\" },\n { key: \"gift1\", group: \"Liquidity\", label: \"Gift 1\" },\n {\n key: \"gift1Month\",\n group: \"Liquidity\",\n label: \"Gift 1 arrives\",\n suffix: \"mo\",\n },\n { key: \"gift2\", group: \"Liquidity\", label: \"Gift 2\" },\n {\n key: \"gift2Month\",\n group: \"Liquidity\",\n label: \"Gift 2 arrives\",\n suffix: \"mo\",\n },\n { key: \"sblocLimit\", group: \"Liquidity\", label: \"SBLOC limit\" },\n {\n key: \"sblocRate\",\n group: \"Liquidity\",\n label: \"SBLOC rate\",\n step: 0.25,\n suffix: \"%\",\n },\n { key: \"cashFloor\", group: \"Liquidity\", label: \"Cash floor\" },\n];\n\nexport const PERSONAL_KEYS = PERSONAL_FIELDS.map((f) => f.key);\n\nexport const BLANK = {\n ...MODEL_PARAMS,\n ...Object.fromEntries(PERSONAL_KEYS.map((k) => [k, 0])),\n};\n\n// Fill in anything a saved set is missing, so adding a parameter later doesn't\n// strand people on stale storage.\nexport function withDefaults(saved) {\n return { ...BLANK, ...saved };\n}\n",[],[267,277],"e9718646-83c6-4025-a3e3-02e4a2870d68","model_test.js","1797354a-a3f9-11f1-8f89-1607ee4eb77e",62,["D",1788042566216],"// Tests for the pure model. Run with `deno task test`.\n//\n// No test-framework dependency on purpose: the rest of this project pulls its\n// libraries from URLs at runtime, and the model itself imports nothing, so the\n// suite stays runnable offline.\n\nimport { MODEL_PARAMS } from \"./schema.js\";\nimport {\n annualPropertyTax,\n assessedAtClose,\n closingCosts,\n frontier,\n HORIZON,\n insuranceProfile,\n mortgageBalance,\n piti60,\n pmiMonthly,\n pmt,\n priceCeiling,\n recordationTax,\n renoHeadroom,\n renovationSchedule,\n simulate,\n trueValueSeries,\n} from \"./model.js\";\n\n// --- assertions -------------------------------------------------------------\n\nfunction assert(cond, msg) {\n if (!cond) throw new Error(msg ?? \"assertion failed\");\n}\n\nfunction assertEquals(actual, expected, msg) {\n if (actual !== expected) {\n throw new Error(`${msg ?? \"not equal\"}: got ${actual}, want ${expected}`);\n }\n}\n\nfunction assertClose(actual, expected, tolerance, msg) {\n if (!(Math.abs(actual - expected) <= tolerance)) {\n throw new Error(\n `${msg ?? \"not close\"}: got ${actual}, want ${expected} ±${tolerance}`,\n );\n }\n}\n\n// --- fixtures ---------------------------------------------------------------\n\nconst PERSONAL = {\n price: 1000000,\n renoCost: 200000,\n rent: 3000,\n cashNow: 500000,\n gift1: 100000,\n gift1Month: 3,\n gift2: 100000,\n gift2Month: 12,\n sblocLimit: 300000,\n sblocRate: 6,\n cashFloor: 50000,\n};\n\nconst BASE = { ...MODEL_PARAMS, ...PERSONAL };\nconst at = (over) => ({ ...BASE, ...over });\n\n// --- Montgomery County transfer taxes ---------------------------------------\n\nDeno.test(\"recordationTax applies the tiers marginally\", () => {\n // 500k @ 4.45 + 100k @ 6.75 + 150k @ 10.20 + 250k @ 10.78, all per $500.\n assertClose(recordationTax(1000000), 14250, 0.01, \"$1M\");\n assertClose(recordationTax(500000), 4450, 0.01, \"top of the first tier\");\n assertClose(recordationTax(0), 0, 0.01, \"no price, no tax\");\n});\n\nDeno.test(\"recordationTax is continuous across tier boundaries\", () => {\n for (const edge of [500000, 600000, 750000, 1000000]) {\n const below = recordationTax(edge - 1);\n const above = recordationTax(edge + 1);\n assertClose(above - below, 0, 0.1, `discontinuity at ${edge}`);\n }\n});\n\nDeno.test(\"closing costs honor the first-time and owner-occupied breaks\", () => {\n const full = closingCosts(at({ firstTime: false, ownerOccupied: false }));\n const broken = closingCosts(at({ firstTime: true, ownerOccupied: true }));\n\n assertClose(\n full.stateTransfer,\n 1000000 * 0.005 * 0.5,\n 0.01,\n \"state transfer\",\n );\n assertEquals(\n broken.stateTransfer,\n 0,\n \"first-time buyer pays no state transfer\",\n );\n\n // County exempts the first $50k of consideration for an owner-occupant.\n assertClose(\n full.countyTransfer - broken.countyTransfer,\n 50000 * 0.01 * 0.5,\n 0.01,\n );\n // And the recordation credit is worth $890 gross, split at the buyer's share.\n assertClose(full.recordation - broken.recordation, 890 * 0.5, 0.01);\n});\n\nDeno.test(\"closing cost total is the sum of its parts\", () => {\n const cc = closingCosts(BASE);\n const parts = cc.recordation + cc.countyTransfer + cc.stateTransfer +\n cc.title + cc.fixed + cc.prepaids;\n assertClose(cc.total, parts, 0.01);\n});\n\n// --- financing --------------------------------------------------------------\n\nDeno.test(\"pmt matches a known amortization\", () => {\n // $800,000 at 6.5% over 30 years.\n assertClose(pmt(800000, 6.5, 30), 5056.5442, 0.001);\n assertClose(pmt(120000, 0, 10), 1000, 1e-9, \"zero rate is straight-line\");\n assertEquals(pmt(100000, 5, 0), 0, \"zero term has no payment\");\n});\n\nDeno.test(\"mortgageBalance agrees with month-by-month amortization\", () => {\n // `simulate` amortizes in a loop; the frontier uses the closed form. If these\n // ever drift, month-60 PITI on the chart stops matching the panel beside it.\n const r = simulate(BASE);\n for (const m of [1, 12, 36, HORIZON]) {\n assertClose(\n mortgageBalance(r.loan, BASE.mortgageRate, BASE.termYears, m),\n r.rows[m].mortBal,\n 1,\n `balance at month ${m}`,\n );\n }\n assertEquals(\n mortgageBalance(800000, 6.5, 30, 0),\n 800000,\n \"month 0 is the loan\",\n );\n});\n\nDeno.test(\"PMI applies below 20% down and terminates at 80% LTV\", () => {\n const full = at({ downPct: 20 });\n assertEquals(\n pmiMonthly(full, full.price * 0.8, full.price * 0.8),\n 0,\n \"20% down\",\n );\n\n const thin = at({ downPct: 10 });\n const loan = thin.price * 0.9;\n assertClose(\n pmiMonthly(thin, loan, loan),\n (loan * thin.pmiAnnualPct) / 100 / 12,\n 0.01,\n );\n assertEquals(\n pmiMonthly(thin, loan, thin.price * 0.8),\n 0,\n \"terminated once the balance reaches 80% of price\",\n );\n\n const r = simulate(thin);\n assert(r.pmiInitial > 0, \"10% down should carry PMI\");\n assert(r.rows[0].pmi > 0, \"and it should show in the monthly rows\");\n assertEquals(simulate(full).pmiInitial, 0, \"20% down should not\");\n});\n\n// --- renovation schedule and market value -----------------------------------\n\nDeno.test(\"renovation draws sum to the budget\", () => {\n const spread = renovationSchedule(at({ renoStart: 2, renoMonths: 6 }));\n assertEquals(spread.moveIn, 8);\n assertEquals(spread.draws.size, 6);\n assertClose(\n [...spread.draws.values()].reduce((a, b) => a + b, 0),\n 200000,\n 0.01,\n );\n assert(\n spread.draws.has(2) && spread.draws.has(7),\n \"draws run start..start+n-1\",\n );\n\n const lump = renovationSchedule(at({ renoStart: 3, renoMonths: 0 }));\n assertEquals(lump.moveIn, 3, \"zero-length reno moves in at the start month\");\n assertClose(lump.draws.get(3), 200000, 0.01, \"and pays in one lump\");\n});\n\nDeno.test(\"value-add appreciates from the month it is spent\", () => {\n const inp = at({\n appreciation: 3,\n renoValueAdd: 70,\n renoStart: 0,\n renoMonths: 6,\n });\n const { values } = trueValueSeries(inp);\n\n assertClose(values[0], inp.price + (200000 / 6) * 0.7, 0.5, \"month 0\");\n\n // By month 60 the whole add has been in the ground for a while, so it must\n // have grown — holding it flat was the old behavior.\n const flat = inp.price * Math.pow(1.03, 5) + 200000 * 0.7;\n assert(\n values[HORIZON] > flat + 1000,\n \"the add should compound, not sit still\",\n );\n\n const noGrowth = trueValueSeries(at({ appreciation: 0 })).values;\n assertClose(noGrowth[HORIZON], inp.price + 200000 * 0.7, 1, \"flat at 0%\");\n});\n\n// --- insurance --------------------------------------------------------------\n\nDeno.test(\"insurance is the quote at the anchor price\", () => {\n const inp = at({ price: 1000000, insuranceBasePrice: 1000000, renoCost: 0 });\n assertClose(insuranceProfile(inp).beforeAnnual, inp.insuranceAnnual, 0.01);\n});\n\nDeno.test(\"a pricier house costs more to insure\", () => {\n // Regression: the premium used to be a flat dollar quote divided by a\n // price-dependent replacement cost, which made bigger houses *cheaper* to\n // insure and bent every iso-PITI contour the wrong way.\n let last = 0;\n for (const price of [600000, 800000, 1000000, 1200000, 1600000]) {\n const { afterRenoAnnual } = insuranceProfile(at({ price }));\n assert(\n afterRenoAnnual > last,\n `premium should rise with price (at ${price})`,\n );\n last = afterRenoAnnual;\n }\n});\n\nDeno.test(\"renovation raises replacement cost and the premium with it\", () => {\n const none = insuranceProfile(at({ renoCost: 0 }));\n const some = insuranceProfile(at({ renoCost: 200000 }));\n assertClose(some.replacementAfter - none.replacementAfter, 200000, 0.01);\n assert(some.afterRenoAnnual > none.afterRenoAnnual, \"premium steps up\");\n});\n\nDeno.test(\"the vacancy multiplier applies only when the house sits empty\", () => {\n const empty = insuranceProfile(at({ renoStart: 0, renoMonths: 6 }));\n assertClose(\n empty.duringRenoAnnual,\n empty.beforeAnnual * BASE.insuranceVacancyMult,\n 0.01,\n );\n\n const straightIn = insuranceProfile(at({ renoStart: 0, renoMonths: 0 }));\n assertClose(straightIn.duringRenoAnnual, straightIn.beforeAnnual, 0.01);\n});\n\nDeno.test(\"builder's risk is a share of construction cost\", () => {\n const { buildersRisk } = insuranceProfile(\n at({ renoCost: 200000, buildersRiskPct: 2 }),\n );\n assertClose(buildersRisk, 4000, 0.01);\n});\n\n// --- property tax and the Maryland assessment -------------------------------\n\nDeno.test(\"the ITOC credit follows the owner-occupancy affidavit\", () => {\n const occupied = at({ ownerOccupied: true });\n const rented = at({ ownerOccupied: false });\n assertClose(\n annualPropertyTax(1000000, rented) - annualPropertyTax(1000000, occupied),\n BASE.itoc,\n 0.01,\n );\n});\n\nDeno.test(\"assessment starts below price, because Maryland doesn't reassess on sale\", () => {\n const inp = at({ assessmentRatioPct: 85 });\n assertClose(assessedAtClose(inp), 850000, 0.01);\n assertClose(simulate(inp).rows[0].assessed, 850000, 1);\n assertClose(assessedAtClose(at({ assessmentRatioPct: 100 })), 1000000, 0.01);\n});\n\nDeno.test(\"assessed value never exceeds market value\", () => {\n // Regression: overlapping phase-ins used to stack, so the renovation ramp and\n // the triennial ramp both ran and drove the assessment past what the house\n // was worth. Sweep the timings that put the two events near each other, with\n // the homestead cap lifted so it can't mask the overshoot.\n for (const renoStart of [0, 3, 6, 12, 18, 24, 30]) {\n for (const lag of [0, 3, 6, 9]) {\n const inp = at({\n renoStart,\n reassessLagMonths: lag,\n homesteadCapPct: 1000,\n });\n const r = simulate(inp);\n for (const row of r.rows) {\n assert(\n row.assessed <= row.value + 1,\n `assessed ${row.assessed} > market ${row.value} at month ${row.month} ` +\n `(renoStart ${renoStart}, lag ${lag})`,\n );\n }\n }\n }\n});\n\nDeno.test(\"colliding reassessment triggers apply the increase once\", () => {\n // renoStart 24 + 6 months of work + a 6-month lag lands the SDAT pickup\n // exactly on the triennial month.\n const collide = at({\n renoStart: 24,\n renoMonths: 6,\n reassessLagMonths: 6,\n homesteadCapPct: 1000,\n });\n const justBefore = { ...collide, reassessLagMonths: 5 };\n const justAfter = { ...collide, reassessLagMonths: 7 };\n\n const end = (inp) => simulate(inp).rows[HORIZON].assessed;\n const mid = end(collide);\n assert(\n mid <= Math.max(end(justBefore), end(justAfter)) + 1,\n \"a collision should not assess more than either neighbouring lag\",\n );\n});\n\nDeno.test(\"the homestead cap defers an increase rather than forgiving it\", () => {\n // A big renovation pushes the phase-in past 10% a year, so the cap binds.\n const inp = at({ renoCost: 400000, homesteadCapPct: 10 });\n const r = simulate(inp);\n const yearly = [0, 12, 24, 36, 48, 60].map((m) => r.rows[m].assessed);\n\n let capped = false;\n for (let i = 1; i < yearly.length; i++) {\n const growth = yearly[i] / yearly[i - 1] - 1;\n assert(growth <= 0.1 + 1e-6, `year ${i} grew ${growth}, over the cap`);\n assert(growth >= -1e-9, `year ${i} went backwards`);\n if (growth > 0.09) capped = true;\n }\n assert(capped, \"this scenario should actually bind the cap\");\n\n // Uncapped, the same scenario reaches a strictly higher assessment — the\n // capped run is behind, not permanently short by a forgiven amount.\n const uncapped = simulate({ ...inp, homesteadCapPct: 1000 });\n assert(uncapped.rows[HORIZON].assessed > r.rows[HORIZON].assessed);\n});\n\nDeno.test(\"the cap does not bind in the first year of ownership\", () => {\n const r = simulate(\n at({\n renoStart: 0,\n renoMonths: 0,\n reassessLagMonths: 3,\n homesteadCapPct: 0,\n }),\n );\n assert(\n r.rows[11].assessed >= r.rows[6].assessed,\n \"first year rides uncapped\",\n );\n});\n\nDeno.test(\"the phase-in runs 36 months, not just to the horizon\", () => {\n // Regression: the ramp length used to be clipped to the months left in the\n // window, so a month-36 reassessment finished by month 60 instead of 72.\n const inp = at({\n renoCost: 0,\n assessmentRatioPct: 85,\n homesteadCapPct: 1000,\n });\n const r = simulate(inp);\n const values = trueValueSeries(inp).values;\n\n const reached = r.rows[HORIZON].assessed - r.rows[36].assessed;\n const target = values[36] - r.rows[36].assessed;\n // 24 of the 36 phase-in months have elapsed by month 60.\n assertClose(reached / target, 24 / 36, 0.02, \"two thirds phased in\");\n assert(\n r.rows[HORIZON].assessed < values[36],\n \"should not have finished early\",\n );\n});\n\nDeno.test(\"reassessment can be switched off\", () => {\n const r = simulate(at({ modelReassessment: false }));\n const base = assessedAtClose(BASE);\n for (const row of r.rows) assertClose(row.assessed, base, 1);\n assertClose(r.taxAtEnd, r.monthlyTax, 0.01, \"tax stays flat\");\n});\n\nDeno.test(\"a small renovation waits for the regular cycle\", () => {\n const under = at({ renoCost: 100000, renoValueAdd: 70 }); // $70k of value\n const over = at({ renoCost: 200000, renoValueAdd: 70 }); // $140k of value\n const r = simulate(under);\n // Nothing moves before the triennial month when the pickup isn't triggered.\n assertClose(r.rows[30].assessed, r.rows[0].assessed, 1);\n assert(\n simulate(over).rows[30].assessed > r.rows[30].assessed,\n \"crossing $100k should pull the assessment forward\",\n );\n});\n\n// --- the cash simulation ----------------------------------------------------\n\nDeno.test(\"cash reconciles against the lumpy outflows and the gifts\", () => {\n const inp = at({ sblocLimit: 0, cashNow: 900000, cashFloor: 0 });\n const r = simulate(inp);\n const spent = r.rows.reduce((a, row) => a + row.lumpy, 0);\n assertClose(\n r.rows[HORIZON].cash,\n inp.cashNow + inp.gift1 + inp.gift2 - spent,\n 2,\n \"every dollar is accounted for\",\n );\n assertEquals(r.peakSbloc, 0, \"no borrowing was needed\");\n});\n\nDeno.test(\"closing, builder's risk, draws, and moving all hit the fund\", () => {\n const inp = at({ renoStart: 2, renoMonths: 6 });\n const r = simulate(inp);\n assertClose(\n r.rows[0].lumpy,\n r.down + r.cc.total,\n 1,\n \"month 0 is down + closing\",\n );\n assertClose(\n r.rows[2].lumpy,\n r.buildersRisk + inp.renoCost / 6,\n 1,\n \"builder's risk lands with the first draw\",\n );\n assertClose(r.rows[8].lumpy, inp.movingCost, 1, \"moving lands at move-in\");\n // Rows carry rounded dollars, so the sum drifts a little from the total.\n assertClose(\n r.totalThroughMoveIn,\n r.rows.filter((x) => x.month <= r.moveIn).reduce((a, x) => a + x.lumpy, 0),\n 5,\n );\n});\n\nDeno.test(\"gifts scheduled outside the horizon are reported, not silently dropped\", () => {\n const clean = simulate(BASE);\n assertEquals(clean.strandedGifts.length, 0);\n\n const late = simulate(at({ gift2Month: HORIZON + 1 }));\n assertEquals(late.strandedGifts.length, 1);\n assertEquals(late.strandedGifts[0].label, \"Gift 2\");\n assertEquals(late.strandedGifts[0].amount, 100000);\n\n assertEquals(\n simulate(at({ gift1Month: -1 })).strandedGifts.length,\n 1,\n \"before closing\",\n );\n assertEquals(\n simulate(at({ gift2: 0, gift2Month: 999 })).strandedGifts.length,\n 0,\n \"a zero gift is not a warning\",\n );\n});\n\nDeno.test(\"the SBLOC bridges a gap and is repaid when a gift lands\", () => {\n const inp = at({\n cashNow: 260000,\n gift1: 0,\n gift2: 250000,\n gift2Month: 9,\n cashFloor: 0,\n });\n const r = simulate(inp);\n assert(r.peakSbloc > 0, \"should have drawn\");\n assert(r.sblocInterest > 0, \"and accrued interest\");\n assert(\n r.sblocClearedMonth !== null && r.sblocClearedMonth >= 9,\n \"repaid at the gift\",\n );\n assert(!r.limitBreach, \"within the limit\");\n});\n\nDeno.test(\"an exhausted line is flagged as a breach\", () => {\n const r = simulate(\n at({ cashNow: 100000, gift1: 0, gift2: 0, sblocLimit: 50000 }),\n );\n assert(r.limitBreach, \"the line cannot cover this\");\n assert(r.shortfall > 0, \"and cash goes negative\");\n});\n\nDeno.test(\"protecting the renovation delays repaying the line\", () => {\n const inp = at({\n cashNow: 240000,\n gift1: 0,\n gift2: 300000,\n gift2Month: 2,\n renoStart: 0,\n renoMonths: 12,\n cashFloor: 0,\n });\n const protectedFirst = simulate({ ...inp, priority: \"reno,sbloc\" });\n const repayFirst = simulate({ ...inp, priority: \"sbloc,reno\" });\n assert(\n repayFirst.sblocInterest <= protectedFirst.sblocInterest,\n \"repaying first should cost no more interest than reserving the draws\",\n );\n});\n\n// --- consistency between the panel and the frontier -------------------------\n\nDeno.test(\"piti60 reproduces the simulation's month-60 PITI\", () => {\n // These are two separate code paths over the same assumptions. This is the\n // test that stops them drifting apart.\n for (\n const over of [\n {},\n { price: 700000, renoCost: 50000 },\n { price: 1500000, renoCost: 400000 },\n { downPct: 10 },\n { modelReassessment: false },\n { ownerOccupied: false },\n { renoStart: 6, renoMonths: 12 },\n ]\n ) {\n const inp = at(over);\n assertClose(\n piti60(inp, inp.price, inp.renoCost),\n simulate(inp).pitiAtEnd,\n 0.01,\n `mismatch for ${JSON.stringify(over)}`,\n );\n }\n});\n\nDeno.test(\"piti60 rises monotonically with price\", () => {\n // priceAtPiti bisects on this, so it has to hold across the search range.\n let last = -Infinity;\n for (let price = 100000; price <= 4000000; price += 100000) {\n const v = piti60(BASE, price, BASE.renoCost);\n assert(v > last, `PITI fell going into ${price}`);\n last = v;\n }\n});\n\nDeno.test(\"frontier headroom is what the simulation can actually spend\", () => {\n // Regression: the frontier charged for down payment, closing, moving and the\n // cash floor but not builder's risk, so it promised a renovation the cash\n // simulation could not fund.\n const inp = at({ sblocLimit: 5000000, sblocRate: 0 });\n const f = frontier(inp);\n\n const spend = (renoCost) => {\n const r = simulate({ ...inp, renoCost });\n const end = r.rows[HORIZON];\n return end.cash - end.sbloc - inp.cashFloor;\n };\n\n assertClose(\n spend(f.headroom),\n 0,\n 2,\n \"the headroom exactly exhausts the fund\",\n );\n assert(spend(f.headroom - 5000) > 0, \"a smaller renovation leaves slack\");\n assert(spend(f.headroom + 5000) < 0, \"a larger one overdraws\");\n});\n\nDeno.test(\"headroom falls as price rises\", () => {\n const fund = BASE.cashNow + BASE.gift1 + BASE.gift2;\n let last = Infinity;\n for (let price = 600000; price <= 1600000; price += 50000) {\n const h = renoHeadroom(BASE, price, fund);\n assert(h < last, `headroom rose going into ${price}`);\n last = h;\n }\n});\n\nDeno.test(\"priceCeiling inverts renoHeadroom\", () => {\n const fund = BASE.cashNow + BASE.gift1 + BASE.gift2;\n for (const reno of [0, 100000, 250000]) {\n const ceiling = priceCeiling(BASE, fund, reno);\n assertClose(renoHeadroom(BASE, ceiling, fund), reno, 5, `at reno ${reno}`);\n }\n assertEquals(priceCeiling(BASE, 0, 100000), 0, \"no fund buys nothing\");\n});\n\nDeno.test(\"the frontier's own summary figures line up\", () => {\n const f = frontier(BASE);\n assertClose(f.fund, BASE.cashNow + BASE.gift1 + BASE.gift2, 0.01);\n assertClose(f.slack, f.headroom - BASE.renoCost, 0.01);\n assertClose(f.piti, simulate(BASE).pitiAtEnd, 0.01);\n assert(f.pitiPerPrice > 0, \"more house costs more per month\");\n assert(f.pitiPerReno > 0, \"so does more renovation\");\n assert(\n f.pitiPerPrice > f.pitiPerReno,\n \"price should move PITI harder than renovation — that's why the contours are steep\",\n );\n assert(f.contours.length > 0, \"there should be contours to draw\");\n});\n\n// --- degenerate inputs ------------------------------------------------------\n\nDeno.test(\"a blank form produces finite numbers\", () => {\n const blank = { ...MODEL_PARAMS };\n for (const k of Object.keys(PERSONAL)) blank[k] = 0;\n const r = simulate(blank);\n for (const [k, v] of Object.entries(r)) {\n if (typeof v === \"number\") assert(Number.isFinite(v), `${k} is ${v}`);\n }\n assertEquals(r.rows.length, HORIZON + 1);\n});\n\nDeno.test(\"a zero-length renovation still pays and moves in at month 0\", () => {\n const r = simulate(at({ renoStart: 0, renoMonths: 0 }));\n assertEquals(r.moveIn, 0);\n assertClose(\n r.rows[0].lumpy,\n r.down + r.cc.total + BASE.renoCost + r.buildersRisk + BASE.movingCost,\n 1,\n \"everything lands at closing\",\n );\n});\n",[],[267,286],"6a39a0f0-edac-4298-ae47-c8bafeef4184","model.jsx","ec473652-9ce0-11f1-8da2-1607ee4eb77e",64,["D",1788042566199],13,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useEffect, useMemo, useState } from \"https://esm.sh/react@18.2.0\";\nimport {\n Area,\n CartesianGrid,\n ComposedChart,\n Legend,\n Line,\n LineChart,\n ReferenceDot,\n ReferenceLine,\n ResponsiveContainer,\n Tooltip,\n XAxis,\n YAxis,\n} from \"https://esm.sh/recharts@2.15.4?deps=react@18.2.0,react-dom@18.2.0\";\nimport { BLANK, MODEL_PARAMS } from \"./schema.js\";\nimport {\n eventMarkers,\n frontier,\n HORIZON,\n piti60,\n PRICE_MAX,\n PRICE_MIN,\n PRIORITY_OPTIONS,\n RENO_MAX,\n simulate,\n} from \"./model.js\";\n\nfunction chartTooltip(eventsByMonth) {\n return ({ active, payload, label }) => {\n if (!active || !payload?.length) return null;\n const events = eventsByMonth[label] || [];\n return (\n

Month {label}

\n {events.length > 0 && (\n

\n {events.join(\" • \")}\n

\n )}\n {payload.map((p, i) => (\n

\n \n {p.name}:\n {money(p.value)}\n

\n ))}\n

\n );\n };\n}\n\nfunction frontierTooltip({ active, payload, label }) {\n if (!active || !payload?.length) return null;\n return (\n

{money(label)} house

\n {payload.map((p, i) => (\n

\n \n {p.name}:\n {money(p.value)}\n

\n ))}\n

\n );\n}\n\nconst money = (n) =>\n (n < 0 ? \"-\" : \"\") + \"$\" + Math.round(Math.abs(n)).toLocaleString();\nconst pct = (n) => n.toFixed(1) + \"%\";\n\n\nfunction Row({ label, value, sub, warn }) {\n return (\n

\n {label}\n \n {value}\n {sub && {sub}}\n \n

\n );\n}\n\nfunction Num({ label, value, onChange, step = 1, suffix }) {\n return (\n \n {label}\n \n \n onChange(e.target.value === \"\" ? 0 : Number(e.target.value))\n }\n className=\"w-28 rounded border border-slate-300 px-2 py-1 text-right text-xs font-mono tabular-nums focus:border-slate-900 focus:outline-none\"\n />\n {suffix && {suffix}}\n \n \n );\n}\n\nfunction Slide({ label, value, onChange, min, max, step, format }) {\n return (\n

\n {label}\n \n {format ? format(value) : value}\n \n

\n onChange(Number(e.target.value))}\n className=\"mt-1 w-full accent-slate-900\"\n />\n

\n );\n}\n\nfunction Section({ title, children, open = true }) {\n const [show, setShow] = useState(open);\n return (\n

\n setShow(!show)}\n className=\"flex w-full items-center justify-between px-3 py-2 text-left\"\n >\n \n {title}\n \n {show ? \"−\" : \"+\"}\n \n {show &&

{children}

}\n

\n );\n}\n\nfunction Stat({ label, value, warn }) {\n return (\n

{label}

\n \n {value}\n

\n \n );\n}\n\nfunction Zone({ label }) {\n return (\n

\n {label}\n

\n );\n}\n\nconst axisLabel = { fontSize: 11, fill: \"#64748b\" };\n\nfunction Frontier({ inp }) {\n const f = useMemo(() => frontier(inp), [inp]);\n\n const within = inp.renoCost <= f.headroom;\n\n return (\n

\n Price vs. renovation budget\n

\n \n \n \n `${(v / 1e6).toFixed(1)}M`}\n tick={{ fontSize: 11 }}\n label={{\n value: \"Purchase price\",\n position: \"insideBottom\",\n offset: -14,\n style: axisLabel,\n }}\n />\n `${Math.round(v / 1000)}k`}\n width={56}\n domain={[0, f.yMax]}\n allowDataOverflow\n label={{\n value: \"Renovation budget\",\n angle: -90,\n position: \"insideLeft\",\n offset: 14,\n style: { ...axisLabel, textAnchor: \"middle\" },\n }}\n />\n \n \n {/* Above the fill so the field reads through it, below the dot.\n Each contour is one segment per reassessment regime; only the\n topmost carries the label. */}\n {f.contours.flatMap((c) =>\n c.segments.map((s, si) => (\n \n ))\n )}\n {f.threshold != null && (\n \n )}\n \n \n \n \n

\n\n

\n \n \n \n \n \n \n \n \n

\n\n

\n Every $10,000 more house costs {money(f.tradeoff)} of renovation —{\" \"}\n {inp.downPct}% down plus the transfer, recordation, and title on that\n slice. The dot is where you are;{\" \"}\n {within ? \"it sits under the curve.\" : \"it is past the curve.\"}\n

\n Grey lines are equal month-60 PITI, {money(f.step)}/mo apart. They run\n far steeper than the frontier — {money(f.pitiPerPrice)}/mo for $10k of\n price against {money(f.pitiPerReno)}/mo for $10k of renovation, a{\" \"}\n {(f.pitiPerReno > 0 ? f.pitiPerPrice / f.pitiPerReno : 0).toFixed(1)}×\n gap, because renovation isn't mortgaged and is assessed at{\" \"}\n {inp.renoValueAdd}% of cost. So no move along the frontier holds monthly\n cost flat: trading price for renovation always lowers it.\n

\n {f.threshold != null && (\n

\n The dashed line at {money(f.threshold)} of renovation is where the\n added value crosses $100k and SDAT picks it up off-cycle instead of at\n the 3-year mark. Crossing it costs about{\" \"}\n {money(\n piti60(inp, inp.price, f.threshold + 500) -\n piti60(inp, inp.price, f.threshold - 500),\n )}\n /mo at month 60 — though that gap is mostly phase-in timing under the\n homestead cap, and narrows if you hold past five years.\n

\n )}\n

\n Timing is collapsed out: gifts count no matter when they land, and the\n cash floor ({money(inp.cashFloor)}) is held back. The SBLOC isn't budget\n here — it's a bridge, repaid from this same fund, so it mostly changes\n when you can spend rather than how much. Its interest is the exception,\n and this curve doesn't charge for it. Borrowing shows up in the\n trajectory chart above.\n

\n );\n}\n\nexport default function HouseModel({ initial, onChange, onClear }) {\n const [inp, setInp] = useState(() => ({ ...BLANK, ...initial }));\n const [scenarios, setScenarios] = useState([]);\n const [showTable, setShowTable] = useState(false);\n const [showClosingDetail, setShowClosingDetail] = useState(false);\n const [copied, setCopied] = useState(false);\n\n const set = (k) => (v) => setInp((p) => ({ ...p, [k]: v }));\n\n useEffect(() => {\n onChange?.(inp);\n }, [inp, onChange]);\n const r = useMemo(() => simulate(inp), [inp]);\n\n const copyValues = async () => {\n try {\n await navigator.clipboard.writeText(JSON.stringify(inp, null, 2));\n setCopied(true);\n setTimeout(() => setCopied(false), 1500);\n } catch {\n // clipboard blocked (insecure origin, denied permission) — no-op\n }\n };\n\n const saveScenario = () => {\n setScenarios((s) => [\n ...s,\n {\n id: Date.now(),\n price: inp.price,\n reno: inp.renoCost,\n months: inp.renoMonths,\n cashAtClose: r.cashAtClose,\n peakSbloc: r.peakSbloc,\n sblocInterest: r.sblocInterest,\n cleared: r.sblocClearedMonth,\n piti: r.duringReno,\n equity36: r.rows[36].netEquity,\n ok: !r.limitBreach && r.shortfall < 1,\n },\n ]);\n };\n\n const chartEnd = Math.min(HORIZON, r.moveIn + 1);\n const chartData = [\n { month: -1, Cash: inp.cashNow, SBLOC: 0, \"Net equity\": 0 },\n ...r.rows\n .filter((x) => x.month <= chartEnd)\n .map((x) => ({\n month: x.month,\n Cash: x.cash,\n SBLOC: x.sbloc,\n \"Net equity\": x.netEquity,\n })),\n ];\n\n const markers = eventMarkers(inp, r);\n const markerMonths = [...new Set(markers.map((m) => m.month))]\n .filter((m) => m <= chartEnd)\n .sort((a, b) => a - b);\n const eventsByMonth = Object.fromEntries(\n markerMonths.map((month) => [\n month,\n markers.filter((m) => m.month === month).map((m) => m.label),\n ])\n );\n\n const infeasible = r.limitBreach || r.shortfall > 1;\n\n return (\n

Takoma Park purchase model

\n Month 0 = closing. All figures nominal. Defaults are estimates — verify\n taxes and fees with your settlement agent.{\" \"}\n \n view source\n \n

\n\n {infeasible && (\n

\n Not fundable as configured.\n {r.limitBreach && \" SBLOC limit is exhausted.\"}\n {r.shortfall > 1 && ` Cash goes negative by ${money(r.shortfall)}.`}\n

\n )}\n\n {r.strandedGifts.length > 0 && (\n

\n {r.strandedGifts\n .map((g) => `${g.label} (${money(g.amount)}) arrives in month ${g.month}`)\n .join(\"; \")}\n , outside the 0–{HORIZON} month window — so it never lands, and none\n of the figures below count it.\n

\n )}\n\n

\n \n \n \n \n \n \n \n

\n\n

\n {/* ---------------- INPUTS ---------------- */}\n

\n \n \n `${v} mo`}\n />\n `month ${v}`}\n />\n

\n Down payment {inp.downPct}% = {money(r.down)}. Move-in month{\" \"}\n {r.moveIn}; DC rent runs through month {Math.max(0, r.moveIn - 1)}.\n

\n \n \n

\n\n

\n \n \n \n \n \n \n \n \n {r.pmiInitial > 0 && (\n

\n Under 20% down, so PMI runs at {money(r.pmiInitial)}/mo until\n the balance reaches 80% of price —{\" \"}\n {r.pmiAtEnd > 0\n ? \"still on at month 60.\"\n : \"off before month 60.\"}\n

\n )}\n

\n Insurance through the reno\n

\n \n \n \n \n \n

\n The premium is a rate on replacement cost, backed out of that\n quote at {money(inp.insuranceBasePrice)}. Here that's{\" \"}\n {money(r.replacementBefore)} → {money(r.replacementAfter)} of\n structure, so it steps to {money(r.insAfterReno)}/mo after\n move-in. Builder's risk is {money(r.buildersRisk)} once, at\n month {Math.max(0, Math.round(inp.renoStart))}.\n

\n \n set(\"modelReassessment\")(e.target.checked)}\n />\n Model post-purchase reassessment\n \n \n {inp.modelReassessment && (\n <>\n \n \n

\n Maryland doesn't reassess on sale, so month 0 starts at{\" \"}\n {money(r.rows[0].assessed)} — {inp.assessmentRatioPct}% of\n price. Reno adds{\" \"}\n {money((inp.renoCost * inp.renoValueAdd) / 100)} in value\n {(inp.renoCost * inp.renoValueAdd) / 100 >= 100000\n ? \" — triggers an off-cycle SDAT pickup (≥$100k).\"\n : \" — under the $100k interim-assessment threshold; picked up at the normal 3-year cycle instead.\"}\n

\n \n )}\n

\n\n

\n \n \n \n \n \n set(\"firstTime\")(e.target.checked)} />\n First-time MD buyer (seller pays state transfer tax)\n \n \n set(\"ownerOccupied\")(e.target.checked)} />\n Owner-occupied affidavit ($50k county exemption, $890 credit)\n \n

\n\n

\n \n \n \n \n \n \n \n \n

\n\n

\n \n When money frees up\n set(\"priority\")(e.target.value)}\n className=\"mt-1 w-full rounded border border-slate-300 px-2 py-1 text-xs\"\n >\n {PRIORITY_OPTIONS.map((o) => (\n \n ))}\n \n \n \n set(\"sweepMonthly\")(e.target.checked)}\n />\n Sweep every month, not only when a gift lands\n \n

\n The purchase fund has no monthly income in it, so this only\n matters once renovation draws stop being reserved and free cash\n up between gifts.\n

\n\n

\n Your values\n

\n Saved in this browser only. Copy them out before switching\n machines or clearing site data.\n

\n \n {copied ? \"Copied\" : \"Copy values as JSON\"}\n \n setInp((p) => ({ ...p, ...MODEL_PARAMS }))}\n className=\"w-full rounded border border-slate-300 px-3 py-2 text-xs text-slate-600 hover:bg-slate-100\"\n >\n Reset rates and fees\n \n {\n if (confirm(\"Erase your saved figures from this browser?\")) {\n onClear?.();\n }\n }}\n className=\"w-full rounded border border-slate-300 px-3 py-2 text-xs text-red-600 hover:bg-red-50\"\n >\n Erase and start over\n \n

\n\n {/* ---------------- OUTPUTS ---------------- */}\n

\n \n

\n At closing\n

\n \n \n \n \n \n \n

\n\n

\n At move-in\n

\n \n {r.buildersRisk > 0 && (\n \n )}\n \n \n \n \n

\n\n

\n Bridge exposure\n

\n \n \n \n = 1 && r.sblocClearedMonth === null}\n />\n \n

\n\n \n

\n During reno (double carry)\n

\n \n \n 0 ? `${inp.insuranceVacancyMult}×` : null}\n />\n {r.pmiInitial > 0 && (\n \n )}\n \n \n {r.buildersRisk > 0 && (\n

\n Plus {money(r.buildersRisk)} of builder's risk, paid once at\n month {Math.max(0, Math.round(inp.renoStart))} — it comes out\n of the purchase fund, not monthly income.\n

\n )}\n

\n\n

\n After move-in\n

\n \n \n r.insDuringReno\n ? `+${money(r.insAfterReno - r.insDuringReno)}`\n : null\n }\n />\n {r.pmiAtMoveIn > 0 && (\n \n )}\n \n

\n r.taxAtMoveIn * 1.15} />\n \n {inp.modelReassessment && r.taxAtEnd > r.taxAtMoveIn + 1 && (\n

\n Reassessment adds {money(r.taxAtEnd - r.taxAtMoveIn)}/mo by month\n 60 as the renovation's added value and ordinary appreciation\n get picked up by SDAT.\n

\n )}\n

\n\n \n

\n \n Saved scenarios\n \n \n Save current\n \n

\n {scenarios.length === 0 ? (\n

\n Nothing saved yet. Set a combination, then save it to compare.\n

\n ) : (\n

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n {scenarios.map((s) => (\n \n \n \n \n \n \n \n \n \n \n \n \n ))}\n \n

Price	Reno	Mo	Cash left	Peak SBLOC	SBLOC int.	Clear	Peak mo.	Eq. mo36
{money(s.price)}	{money(s.reno)}	{s.months}	{money(s.cashAtClose)}	\n {money(s.peakSbloc)}\n	{money(s.sblocInterest)}	\n {s.peakSbloc < 1 ? \"—\" : s.cleared === null ? \">60\" : s.cleared}\n	{money(s.piti)}	{money(s.equity36)}	\n \n setScenarios((x) => x.filter((y) => y.id !== s.id))\n }\n className=\"text-slate-400 hover:text-red-600\"\n >\n ×\n \n

\n )}\n

\n\n \n

\n setShowClosingDetail(!showClosingDetail)}\n className=\"text-xs font-semibold uppercase tracking-wide text-slate-500\"\n >\n {showClosingDetail ? \"Hide\" : \"Show\"} closing cost breakdown\n \n {showClosingDetail && (\n

\n \n \n \n \n \n \n \n

\n = {pct((r.cc.total / inp.price) * 100)} of price\n

\n )}\n

\n\n

\n setShowTable(!showTable)}\n className=\"text-xs font-semibold uppercase tracking-wide text-slate-500\"\n >\n {showTable ? \"Hide\" : \"Show\"} month-by-month detail\n \n {showTable && (\n

\n \n \n \n \n \n \n \n \n \n \n \n \n \n {r.rows.map((x) => (\n \n \n \n \n \n \n \n \n \n ))}\n \n

Mo	Outflow	Lump	Cash	SBLOC	Mortgage	Net equity
{x.month}	{money(x.expense)}	{x.lumpy ? money(x.lumpy) : \"—\"}	\n {money(x.cash)}\n	0 ? \"text-red-600\" : \"text-slate-300\")}>\n {x.sbloc ? money(x.sbloc) : \"—\"}\n	{money(x.mortBal)}	{money(x.netEquity)}

\n )}\n

\n\n {/* ---------------- VISUALIZATION ---------------- */}\n

\n \n

\n Cash, SBLOC, and equity, starting balances through month {chartEnd} (move-in + 1)\n

\n \n \n \n \n `${Math.round(v / 1000)}k`}\n width={48}\n />\n \n \n {markerMonths.map((month) => (\n \n ))}\n \n \n \n \n \n

\n\n \n \n\n

\n Equity\n

\n {[12, 36, 60].map((m) => (\n \n ))}\n

\n Net equity = home value − mortgage − SBLOC. Excludes brokerage.\n

\n );\n}\n",[],[267,294],"9df74c3e-2202-4644-b2ec-6f68c8870c70","model.js","178b8c54-a3f9-11f1-bcce-1607ee4eb77e",60,["D",1788042566227],"// The model itself: closing costs, the Maryland assessment machinery, the\n// month-by-month cash simulation, and the price/renovation frontier.\n//\n// No React and no DOM in here — `model.jsx` owns the UI, and `model_test.js`\n// exercises this file directly.\n\nexport const HORIZON = 60;\n\n// Slider bounds, shared with the price/renovation frontier chart so the two\n// always describe the same window.\nexport const PRICE_MIN = 600000;\nexport const PRICE_MAX = 1600000;\nexport const RENO_MAX = 500000;\n\nexport const REASSESS_THRESHOLD = 100000; // MD SDAT interim-assessment trigger\nconst PHASE_IN_MONTHS = 36; // MD phases an increase in over three years\nconst TRIENNIAL_MONTH = 36; // next regular cycle, assumed three years out\n\nexport const PRIORITY_OPTIONS = [\n { value: \"reno,sbloc\", label: \"Finish renovation first, then repay SBLOC\" },\n { value: \"sbloc,reno\", label: \"Repay SBLOC first, then finish renovation\" },\n];\n\n// ---------------------------------------------------------------------------\n// Montgomery County transfer taxes and financing math\n\nexport function recordationTax(price) {\n const tiers = [\n [500000, 4.45],\n [600000, 6.75],\n [750000, 10.2],\n [1000000, 10.78],\n [Infinity, 11.35],\n ];\n let prev = 0;\n let tax = 0;\n for (const [cap, rate] of tiers) {\n if (price <= prev) break;\n const portion = Math.min(price, cap) - prev;\n tax += (portion / 500) * rate;\n prev = cap;\n }\n return tax;\n}\n\nexport function pmt(principal, annualPct, years) {\n const r = annualPct / 100 / 12;\n const n = years * 12;\n if (n <= 0) return 0;\n if (r === 0) return principal / n;\n return (principal * r) / (1 - Math.pow(1 + r, -n));\n}\n\n// Closed-form remaining balance after `months` payments. `simulate` amortizes\n// month by month because it needs the interest/principal split; the frontier\n// only ever wants one balance, and calling this beats running the loop.\nexport function mortgageBalance(principal, annualPct, years, months) {\n if (months <= 0) return principal;\n const r = annualPct / 100 / 12;\n const payment = pmt(principal, annualPct, years);\n if (r === 0) return Math.max(0, principal - payment * months);\n const growth = Math.pow(1 + r, months);\n return Math.max(0, principal * growth - (payment * (growth - 1)) / r);\n}\n\n// PMI is quoted as a percentage of the *original* loan and falls away when the\n// balance reaches 80% of the original price — the automatic-termination point.\nexport function pmiMonthly(inp, loan, balance) {\n if (balance <= inp.price * 0.8 + 0.5) return 0;\n return (loan * Math.max(0, inp.pmiAnnualPct)) / 100 / 12;\n}\n\n// ---------------------------------------------------------------------------\n// Renovation schedule and what the house is worth\n\nexport function moveInMonth(inp) {\n return (\n Math.max(0, Math.round(inp.renoStart)) +\n Math.max(0, Math.round(inp.renoMonths))\n );\n}\n\n// One schedule, built once and shared. `simulate` and `piti60` used to derive\n// this separately and had to be kept in step by hand.\nexport function renovationSchedule(inp) {\n const start = Math.max(0, Math.round(inp.renoStart));\n const months = Math.max(0, Math.round(inp.renoMonths));\n const draws = new Map();\n if (months <= 0) {\n if (inp.renoCost > 0) draws.set(start, inp.renoCost);\n } else {\n for (let i = 0; i < months; i++) {\n draws.set(start + i, inp.renoCost / months);\n }\n }\n return { start, months, moveIn: start + months, draws };\n}\n\n// Market value: the price compounding at `appreciation`, plus the renovation's\n// value-add compounding from the month each draw is spent. Holding the add flat\n// while the base appreciates would quietly shrink it in real terms.\nexport function trueValueSeries(inp, sched = renovationSchedule(inp)) {\n const annualGrowth = Math.max(0, 1 + inp.appreciation / 100);\n const monthlyGrowth = Math.pow(annualGrowth, 1 / 12);\n const values = [];\n const spentByMonth = [];\n let spent = 0;\n let added = 0;\n for (let m = 0; m <= HORIZON; m++) {\n added *= monthlyGrowth;\n const draw = sched.draws.get(m) ?? 0;\n spent += draw;\n added += (draw * inp.renoValueAdd) / 100;\n spentByMonth.push(spent);\n values.push(inp.price * Math.pow(annualGrowth, m / 12) + added);\n }\n return { values, spentByMonth };\n}\n\n// ---------------------------------------------------------------------------\n// Three distinct insurance costs, not one.\n//\n// 1. While the house sits empty between closing and move-in, a standard HO-3\n// won't carry it — the vacancy clause suspends vandalism, theft, and water\n// coverage somewhere around day 60, and the lender requires continuous\n// coverage regardless. That's a vacancy endorsement or a vacant-dwelling\n// policy, priced above the standard premium. Vacancy starts at *closing*,\n// not at `renoStart` — the trigger is the empty house, not the work.\n// 2. Builder's risk covers the structure and materials during construction.\n// The GC's liability and comp policies don't touch the building, and the\n// AIA forms leave property insurance with the owner, so this is ours. It's\n// a single premium for the project term, quoted off construction cost, so\n// it lands in `lumpy` at `renoStart` like any other purchase-fund outlay.\n// 3. After move-in the premium steps up permanently, because dwelling coverage\n// prices off replacement cost and renovation dollars go into the structure\n// roughly 1:1. Land isn't insured, hence `replacementCostPct` of price as\n// the pre-reno base rather than price itself.\n//\n// Everything scales off one rate per dollar of replacement cost, backed out of\n// the quote in `insuranceAnnual` at the house it was quoted for. That is what\n// makes a pricier house cost more to insure, which the frontier's price axis\n// depends on.\n//\n// Not modeled: construction-cost inflation on replacement value over the\n// horizon, which would drift the post-reno premium up a few percent a year.\nexport function insuranceProfile(inp) {\n const structurePct = Math.max(0, inp.replacementCostPct) / 100;\n const replacementBefore = Math.max(0, inp.price) * structurePct;\n const replacementAfter = replacementBefore + Math.max(0, inp.renoCost);\n\n const anchorPrice = inp.insuranceBasePrice > 0\n ? inp.insuranceBasePrice\n : inp.price;\n const replacementAnchor = Math.max(0, anchorPrice) * structurePct;\n\n // With no structure to price off — a blank form, or a zeroed-out structure\n // percentage — fall back to treating the quote as a flat premium.\n const perDollar = replacementAnchor > 0\n ? inp.insuranceAnnual / replacementAnchor\n : 0;\n const beforeAnnual = replacementAnchor > 0\n ? perDollar * replacementBefore\n : inp.insuranceAnnual;\n const afterRenoAnnual = replacementAnchor > 0\n ? perDollar * replacementAfter\n : inp.insuranceAnnual;\n\n const vacantPeriod = moveInMonth(inp) > 0;\n\n return {\n replacementBefore,\n replacementAfter,\n beforeAnnual,\n duringRenoAnnual: beforeAnnual *\n (vacantPeriod ? inp.insuranceVacancyMult : 1),\n afterRenoAnnual,\n buildersRisk: (Math.max(0, inp.renoCost) * inp.buildersRiskPct) / 100,\n };\n}\n\n// ---------------------------------------------------------------------------\n// Property tax\n\n// The Income Tax Offset Credit is an owner-occupancy credit, so it follows the\n// affidavit rather than applying unconditionally.\nexport function annualPropertyTax(assessed, inp) {\n const credit = inp.ownerOccupied ? inp.itoc : 0;\n return Math.max(0, (assessed * inp.propTaxRate) / 100 - credit);\n}\n\n// Maryland does not reassess on sale. The SDAT value in force at closing is\n// whatever the last cycle set, which normally trails the purchase price.\nexport function assessedAtClose(inp) {\n return inp.price * (Math.max(0, inp.assessmentRatioPct) / 100);\n}\n\n// Maryland reassesses on a 3-year cycle with increases phased in over the\n// following 3 years, capped annually by the county homestead limit. Permits\n// for improvements adding >= $100k in value trigger an off-cycle pickup\n// instead of waiting for the regular cycle.\n//\n// Two series come out of that, and conflating them is what makes this subtle:\n//\n// - `full` is SDAT's phase-in value. Each reassessment *re-targets* the ramp\n// toward market value, replacing whatever ramp was still running. A new\n// assessment supersedes the old one; it does not stack on top of it, which\n// would drive the assessment above what the house is actually worth.\n// - `taxable` is what the homestead credit lets the county bill. It trails\n// `full` by at most the cap each year and then keeps climbing until it\n// catches up, because the credit *defers* an increase rather than forgiving\n// it.\nexport function assessedValueSeries(inp, trueValues, moveIn) {\n const n = trueValues.length;\n const base = assessedAtClose(inp);\n if (!inp.modelReassessment) return new Array(n).fill(base);\n\n const renoAdded = (inp.renoCost * inp.renoValueAdd) / 100;\n // A Set, because the renovation pickup can land on the triennial month; two\n // events in one month would otherwise each re-target off the same untouched\n // value and apply the increase twice.\n const events = new Set([Math.min(TRIENNIAL_MONTH, n - 1)]);\n if (renoAdded >= REASSESS_THRESHOLD) {\n const trigger = Math.min(n - 1, moveIn + Math.round(inp.reassessLagMonths));\n if (trigger > 0) events.add(trigger);\n }\n\n const full = new Array(n).fill(base);\n const taxable = new Array(n).fill(base);\n let ramp = null;\n\n for (let m = 1; m < n; m++) {\n full[m] = full[m - 1] + (ramp && m <= ramp.end ? ramp.perMonth : 0);\n\n if (events.has(m)) {\n const diff = trueValues[m] - full[m];\n // The phase-in is three years whatever the horizon is. Squeezing it into\n // the months that happen to be left would make it finish early.\n ramp = diff > 0\n ? { perMonth: diff / PHASE_IN_MONTHS, end: m + PHASE_IN_MONTHS }\n : null;\n }\n\n // The homestead cap doesn't bind until the property has been owned and\n // occupied a full taxable year, so the first twelve months ride the full\n // assessment.\n const cap = m >= 12\n ? taxable[m - 12] * (1 + Math.max(0, inp.homesteadCapPct) / 100)\n : Infinity;\n taxable[m] = Math.max(taxable[m - 1], Math.min(full[m], cap));\n }\n return taxable;\n}\n\n// ---------------------------------------------------------------------------\n// Closing\n\nexport function closingCosts(inp) {\n const price = inp.price;\n const loan = price * (1 - Math.max(0, inp.downPct) / 100);\n const share = inp.buyerSharePct / 100;\n\n const recGross = recordationTax(price);\n const recNet = Math.max(0, recGross - (inp.ownerOccupied ? 890 : 0));\n const recordation = recNet * share;\n\n const countyBase = inp.ownerOccupied ? Math.max(0, price - 50000) : price;\n const countyTransfer = countyBase * 0.01 * share;\n\n const stateTransfer = inp.firstTime ? 0 : price * 0.005 * share;\n\n const title = (price * inp.titlePct) / 100;\n const fixed = inp.fixedFees;\n\n // The lender escrows against the bill the county will actually send, which\n // is struck on the assessment in force, not on what you paid.\n const annualTax = annualPropertyTax(assessedAtClose(inp), inp);\n // The prepaid year of hazard insurance is bought at the rate in force on\n // closing day, which is the vacancy rate if the house sits empty first.\n const escrow = annualTax * (inp.escrowMonths / 12) +\n insuranceProfile(inp).duringRenoAnnual;\n const perDiem = ((loan * (inp.mortgageRate / 100)) / 365) * 15;\n const prepaids = escrow + perDiem;\n\n const total = recordation + countyTransfer + stateTransfer + title + fixed +\n prepaids;\n\n return {\n recordation,\n countyTransfer,\n stateTransfer,\n title,\n fixed,\n prepaids,\n total,\n };\n}\n\n// ---------------------------------------------------------------------------\n// The month-by-month simulation\n\nexport function simulate(inp) {\n const price = inp.price;\n const down = (price * Math.max(0, inp.downPct)) / 100;\n const loan = price - down;\n const mRate = inp.mortgageRate / 100 / 12;\n const mPmt = pmt(loan, inp.mortgageRate, inp.termYears);\n const cc = closingCosts(inp);\n\n const ins = insuranceProfile(inp);\n const insDuringReno = ins.duringRenoAnnual / 12;\n const insAfterReno = ins.afterRenoAnnual / 12;\n\n const sched = renovationSchedule(inp);\n const { start: renoStart, moveIn, draws } = sched;\n const { values: trueValueArr } = trueValueSeries(inp, sched);\n\n const remainingReno = (m) => {\n let sum = 0;\n for (const [month, amount] of draws) if (month > m) sum += amount;\n return sum;\n };\n\n const assessedArr = assessedValueSeries(inp, trueValueArr, moveIn);\n const taxArr = assessedArr.map((a) => annualPropertyTax(a, inp) / 12);\n const monthlyTax = taxArr[0];\n const insArr = trueValueArr.map((_, m) =>\n m < moveIn ? insDuringReno : insAfterReno\n );\n\n // Gifts land on a named month. One scheduled outside the horizon would\n // otherwise just fail to arrive, with the money silently absent from every\n // figure on the page.\n const giftSchedule = [\n { label: \"Gift 1\", month: Math.round(inp.gift1Month), amount: inp.gift1 },\n { label: \"Gift 2\", month: Math.round(inp.gift2Month), amount: inp.gift2 },\n ].filter((g) => g.amount > 0);\n const strandedGifts = giftSchedule.filter(\n (g) => g.month < 0 || g.month > HORIZON,\n );\n\n // \"reno,sbloc\" holds the unspent renovation draws back before repaying the\n // line; \"sbloc,reno\" repays first and lets the line refill the renovation.\n const order = inp.priority.split(\",\");\n const protectReno = order.indexOf(\"reno\") >= 0 &&\n (order.indexOf(\"sbloc\") < 0 ||\n order.indexOf(\"reno\") < order.indexOf(\"sbloc\"));\n\n let cash = inp.cashNow;\n let sbloc = 0;\n let mortBal = loan;\n let sblocInterest = 0;\n let peakSbloc = 0;\n let peakSblocMonth = 0;\n let sblocClearedMonth = null;\n let sblocEverDrawn = false;\n let limitBreach = false;\n let shortfall = 0;\n let minCash = Infinity;\n let minCashMonth = 0;\n let cashAtClose = null;\n let sblocAtClose = 0;\n\n const rows = [];\n\n for (let m = 0; m <= HORIZON; m++) {\n // `expense` is informational only (monthly PITI + double-carry rent) —\n // it's paid out of ordinary income, which this model doesn't track.\n // `cash` is the dedicated purchase fund and only moves for the lumpy\n // costs of getting to (and furnishing) the house.\n let expense = 0;\n if (m >= 1 && mortBal > 0) {\n const interest = mortBal * mRate;\n const principal = Math.min(mPmt - interest, mortBal);\n mortBal -= principal;\n expense += interest + principal;\n }\n const pmi = pmiMonthly(inp, loan, mortBal);\n expense += taxArr[m] + insArr[m] + pmi;\n if (m < moveIn) expense += inp.rent;\n\n if (sbloc > 0) {\n const si = (sbloc * inp.sblocRate) / 100 / 12;\n sbloc += si;\n sblocInterest += si;\n }\n\n let lumpy = 0;\n if (m === 0) lumpy += down + cc.total;\n if (m === renoStart && inp.renoCost > 0) lumpy += ins.buildersRisk;\n if (draws.has(m)) lumpy += draws.get(m);\n if (m === moveIn && moveIn > 0) lumpy += inp.movingCost;\n if (m === 0 && moveIn === 0) lumpy += inp.movingCost;\n cash -= lumpy;\n\n let gift = 0;\n for (const g of giftSchedule) if (g.month === m) gift += g.amount;\n cash += gift;\n\n if (cash < inp.cashFloor) {\n const need = inp.cashFloor - cash;\n const avail = Math.max(0, inp.sblocLimit - sbloc);\n const draw = Math.min(need, avail);\n if (draw > 0) {\n sbloc += draw;\n cash += draw;\n sblocEverDrawn = true;\n }\n if (draw < need - 0.5) limitBreach = true;\n }\n if (cash < 0) {\n shortfall = Math.max(shortfall, -cash);\n }\n\n if ((inp.sweepMonthly || gift > 0) && sbloc > 0) {\n const reserve = protectReno ? remainingReno(m) : 0;\n const avail = cash - inp.cashFloor - reserve;\n if (avail >= 1000) {\n const repay = Math.min(avail, sbloc);\n sbloc -= repay;\n cash -= repay;\n }\n }\n\n if (sbloc > peakSbloc) {\n peakSbloc = sbloc;\n peakSblocMonth = m;\n }\n if (sblocEverDrawn && sbloc < 1 && sblocClearedMonth === null) {\n sblocClearedMonth = m;\n }\n if (cash < minCash) {\n minCash = cash;\n minCashMonth = m;\n }\n if (m === 0) {\n cashAtClose = cash;\n sblocAtClose = sbloc;\n }\n\n const value = trueValueArr[m];\n\n rows.push({\n month: m,\n cash: Math.round(cash),\n sbloc: Math.round(sbloc),\n mortBal: Math.round(mortBal),\n equity: Math.round(value - mortBal),\n netEquity: Math.round(value - mortBal - sbloc),\n value: Math.round(value),\n expense: Math.round(expense),\n lumpy: Math.round(lumpy),\n tax: Math.round(taxArr[m]),\n ins: Math.round(insArr[m]),\n pmi: Math.round(pmi),\n assessed: Math.round(assessedArr[m]),\n });\n }\n\n const taxAtMoveIn = taxArr[Math.min(moveIn, HORIZON)];\n const taxAtEnd = taxArr[HORIZON];\n\n const pmiInitial = pmiMonthly(inp, loan, loan);\n const pmiAtMoveIn = pmiMonthly(\n inp,\n loan,\n mortgageBalance(\n loan,\n inp.mortgageRate,\n inp.termYears,\n Math.min(moveIn, HORIZON),\n ),\n );\n const pmiAtEnd = pmiMonthly(\n inp,\n loan,\n mortgageBalance(loan, inp.mortgageRate, inp.termYears, HORIZON),\n );\n\n const pitiInitial = mPmt + monthlyTax + insDuringReno + pmiInitial;\n const pitiAtMoveIn = mPmt + taxAtMoveIn + insAfterReno + pmiAtMoveIn;\n const pitiAtEnd = mPmt + taxAtEnd + insAfterReno + pmiAtEnd;\n const duringReno = pitiInitial + inp.rent;\n\n const moveInRow = rows[Math.min(moveIn, HORIZON)];\n const buildersRisk = inp.renoCost > 0 ? ins.buildersRisk : 0;\n const totalThroughMoveIn = down + cc.total + inp.renoCost + inp.movingCost +\n buildersRisk;\n\n return {\n cc,\n down,\n loan,\n mPmt,\n monthlyTax,\n taxAtMoveIn,\n taxAtEnd,\n insDuringReno,\n insAfterReno,\n buildersRisk,\n pmiInitial,\n pmiAtMoveIn,\n pmiAtEnd,\n replacementBefore: ins.replacementBefore,\n replacementAfter: ins.replacementAfter,\n moveIn,\n rows,\n cashAtClose,\n sblocAtClose,\n cashAtMoveIn: moveInRow.cash,\n sblocAtMoveIn: moveInRow.sbloc,\n totalThroughMoveIn,\n peakSbloc,\n peakSblocMonth,\n sblocClearedMonth,\n sblocInterest,\n limitBreach,\n shortfall,\n strandedGifts,\n minCash,\n minCashMonth,\n pitiInitial,\n pitiAtMoveIn,\n pitiAtEnd,\n duringReno,\n cashDeployedAtClose: down + cc.total,\n };\n}\n\n// ---------------------------------------------------------------------------\n// Price / renovation frontier\n//\n// Collapse the whole timeline into one accounting identity: every dollar of\n// cash and gifts lands in the down payment, closing costs, moving, builder's\n// risk, or the renovation. Timing drops out, so what remains is a single curve\n// trading price against renovation budget.\n//\n// The SBLOC is deliberately absent. It is a bridge, repaid out of the same cash\n// and gifts, so it mostly changes when a dollar is available rather than how\n// many there are — and this view has already thrown timing away. Its interest\n// is a real leak the curve doesn't charge for. Borrowing shows up in the\n// trajectory chart, which still knows what month it is.\n\n// Everything the price buys before a nail is swung, plus the cash you refuse to\n// spend. Closing costs are re-derived at the trial price, so the recordation\n// tiers and the county's $50k owner-occupied exemption stay honest.\nexport function fixedUses(inp, price) {\n const down = (price * Math.max(0, inp.downPct)) / 100;\n const cc = closingCosts({ ...inp, price }).total;\n return down + cc + inp.movingCost + inp.cashFloor;\n}\n\n// Builder's risk is quoted off construction cost, so it scales with the answer:\n// a renovation of R costs R * (1 + buildersRiskPct/100) out of the fund, not R.\n// Solving for R rather than subtracting a fixed number is what keeps this curve\n// agreeing with `simulate` about what is affordable.\nexport function renoHeadroom(inp, price, budget) {\n const grossUp = 1 + Math.max(0, inp.buildersRiskPct) / 100;\n return (budget - fixedUses(inp, price)) / grossUp;\n}\n\n// Highest price that still leaves `reno` for the renovation. Headroom falls\n// monotonically with price, so bisect rather than invert the tier table.\nexport function priceCeiling(inp, budget, reno) {\n const lo = 0;\n const hi = 5000000;\n if (renoHeadroom(inp, lo, budget) < reno) return 0;\n if (renoHeadroom(inp, hi, budget) >= reno) return hi;\n let low = lo;\n let high = hi;\n for (let i = 0; i < 50; i++) {\n const mid = (low + high) / 2;\n if (renoHeadroom(inp, mid, budget) >= reno) low = mid;\n else high = mid;\n }\n return low;\n}\n\n// Month-60 PITI, without running the cash simulation. `simulate` reports the\n// same figure as `pitiAtEnd`, but the frontier has to evaluate this a few\n// thousand times per render to invert it, so this skips straight to the\n// assessment and the closed-form mortgage balance.\nexport function piti60(inp, price, renoCost) {\n const at = { ...inp, price, renoCost };\n const loan = price * (1 - Math.max(0, inp.downPct) / 100);\n const mPmt = pmt(loan, inp.mortgageRate, inp.termYears);\n\n const sched = renovationSchedule(at);\n const { values } = trueValueSeries(at, sched);\n const assessed = assessedValueSeries(at, values, sched.moveIn);\n\n const tax = annualPropertyTax(assessed[HORIZON], at) / 12;\n const balance = mortgageBalance(\n loan,\n inp.mortgageRate,\n inp.termYears,\n HORIZON,\n );\n // Post-reno premium, since month 60 is well past move-in. It varies with both\n // axes of this chart — price sets the structure's replacement cost and the\n // renovation adds to it — so it has to be re-derived at the trial point.\n return mPmt + tax + insuranceProfile(at).afterRenoAnnual / 12 +\n pmiMonthly(at, loan, balance);\n}\n\n// Price that puts month-60 PITI exactly at `target`, at a given renovation\n// budget. Iso-PITI lines run steeply — about $5 of renovation per $1 of price —\n// so they are near-vertical on these axes and are far better conditioned\n// solved for price than for renovation. PITI rises monotonically with price,\n// so bisect. Returns null when the level is unreachable in the search range.\nconst PRICE_SEARCH_LO = 100000;\nconst PRICE_SEARCH_HI = 4000000;\n\nexport function priceAtPiti(inp, renoCost, target) {\n if (piti60(inp, PRICE_SEARCH_LO, renoCost) > target) return null;\n if (piti60(inp, PRICE_SEARCH_HI, renoCost) < target) return null;\n let lo = PRICE_SEARCH_LO;\n let hi = PRICE_SEARCH_HI;\n for (let i = 0; i < 26; i++) {\n const mid = (lo + hi) / 2;\n if (piti60(inp, mid, renoCost) < target) lo = mid;\n else hi = mid;\n }\n return (lo + hi) / 2;\n}\n\n// Renovation spend at which the added value trips MD's $100k interim-assessment\n// threshold — a horizontal cliff across the chart, since it's a level of reno.\nexport function sdatThreshold(inp) {\n if (inp.renoValueAdd <= 0) return null;\n return (REASSESS_THRESHOLD * 100) / inp.renoValueAdd;\n}\n\nconst CONTOUR_STEPS = [250, 500, 1000, 2000, 2500, 5000];\nconst CONTOUR_SAMPLES = 8; // points per contour, per reassessment regime\n\nexport function frontier(inp) {\n const fund = inp.cashNow + inp.gift1 + inp.gift2;\n\n const points = [];\n const steps = 60;\n for (let i = 0; i <= steps; i++) {\n const price = PRICE_MIN + ((PRICE_MAX - PRICE_MIN) * i) / steps;\n points.push({ price, reno: Math.max(0, renoHeadroom(inp, price, fund)) });\n }\n\n const headroom = renoHeadroom(inp, inp.price, fund);\n\n // Plot box: the frontier itself, but always tall enough to show the dot and\n // the SDAT cliff so neither can sit silently off-screen.\n const threshold = sdatThreshold(inp);\n const yMax = Math.max(\n ...points.map((p) => p.reno),\n inp.renoCost,\n threshold ?? 0,\n ) * 1.08 || RENO_MAX;\n\n // Iso-PITI levels. Because the contours are near-vertical, what sets a\n // readable density is how much PITI moves across the *price* axis, not the\n // corner-to-corner range — aim for roughly half a dozen lines.\n const midReno = yMax / 2;\n const lo = piti60(inp, PRICE_MIN, midReno);\n const hi = piti60(inp, PRICE_MAX, midReno);\n const step = CONTOUR_STEPS.find((s) => (hi - lo) / s <= 7) ?? 10000;\n\n const levels = [];\n for (let L = Math.ceil(lo / step) * step; L <= hi; L += step) levels.push(L);\n\n // Contours step across the SDAT threshold, so each is drawn as a separate\n // polyline on either side of it — a single line through both would average\n // away the jog. Inside a regime the contour is very nearly straight, but not\n // exactly: the homestead cap binds over part of the range and bends it. So\n // sample each side rather than assuming a chord.\n const spans = [];\n if (threshold !== null && threshold > 0 && threshold < yMax) {\n spans.push([0, threshold - 1], [threshold, yMax]);\n } else {\n spans.push([0, yMax]);\n }\n\n const contours = levels\n .map((L) => {\n const segments = [];\n for (const [ya, yb] of spans) {\n let prev = null;\n for (let i = 0; i <= CONTOUR_SAMPLES; i++) {\n const y = ya + ((yb - ya) * i) / CONTOUR_SAMPLES;\n const x = priceAtPiti(inp, y, L);\n const pt = x === null ? null : { x, y };\n if (\n prev && pt &&\n !(Math.max(prev.x, pt.x) < PRICE_MIN ||\n Math.min(prev.x, pt.x) > PRICE_MAX)\n ) {\n segments.push({ from: prev, to: pt });\n }\n prev = pt;\n }\n }\n return segments.length ? { level: L, segments } : null;\n })\n .filter(Boolean);\n\n return {\n fund,\n points,\n contours,\n step,\n yMax,\n threshold,\n fixed: fixedUses(inp, inp.price),\n headroom,\n slack: headroom - inp.renoCost,\n ceiling: priceCeiling(inp, fund, inp.renoCost),\n // What another $10k of house costs the renovation: 20% down plus the\n // marginal transfer, recordation, and title on that slice.\n tradeoff: headroom - renoHeadroom(inp, inp.price + 10000, fund),\n piti: piti60(inp, inp.price, inp.renoCost),\n // Monthly cost of the same $10k, and of $10k of renovation instead. The\n // ratio is why sliding down the frontier never holds PITI flat.\n pitiPerPrice: piti60(inp, inp.price + 10000, inp.renoCost) -\n piti60(inp, inp.price, inp.renoCost),\n pitiPerReno: piti60(inp, inp.price, inp.renoCost + 10000) -\n piti60(inp, inp.price, inp.renoCost),\n };\n}\n\n// ---------------------------------------------------------------------------\n\nexport function eventMarkers(inp, r) {\n const markers = [];\n const push = (month, label, ok) => {\n if (!ok) return;\n const m = Math.max(0, Math.min(HORIZON, Math.round(month)));\n markers.push({ month: m, label });\n };\n\n push(0, \"Closing\", true);\n push(r.moveIn, \"Move in\", r.moveIn > 0);\n push(inp.gift1Month, \"Gift 1\", inp.gift1 > 0);\n push(inp.gift2Month, \"Gift 2\", inp.gift2 > 0);\n push(r.peakSblocMonth, \"SBLOC peak\", r.peakSbloc > 0);\n push(r.sblocClearedMonth, \"SBLOC cleared\", r.sblocClearedMonth != null);\n push(TRIENNIAL_MONTH, \"Reassessment\", inp.modelReassessment);\n\n const renoAdded = (inp.renoCost * inp.renoValueAdd) / 100;\n if (inp.modelReassessment && renoAdded >= REASSESS_THRESHOLD) {\n push(r.moveIn + inp.reassessLagMonths, \"Reno reassessment\", true);\n }\n\n return markers.sort((a, b) => a.month - b.month);\n}\n",[],[267,303],"97e4308f-12a8-41e5-8c80-9930d6a2147a","index.jsx","ec22baac-9ce0-11f1-b72c-1607ee4eb77e",8,["D",1787262527232],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport HouseModel from \"./model.jsx\";\nimport Setup from \"./setup.jsx\";\nimport { clearInputs, loadInputs, saveInputs } from \"./storage.js\";\n\nfunction App() {\n const [inputs, setInputs] = useState(loadInputs);\n\n if (!inputs) {\n return (\n {\n saveInputs(values);\n setInputs(values);\n }}\n />\n );\n }\n\n return (\n {\n clearInputs();\n setInputs(null);\n }}\n />\n );\n}\n\nconst root = document.getElementById(\"root\");\nif (!root) throw new Error(\"#root element missing\");\n\ncreateRoot(root).render(\n \n \n ,\n);\n",[],[267,311],"09e9afd4-e9f5-4b6f-845b-7d6603a73ed5",["D",1787262526308],[165,166,167,168,169,170,171],[267],"fea5cfe3-d91d-4fa1-9dcf-f14feade3bb4","circleave","80142aa8-a2d5-11f1-bb39-1607ee4eb77e",55,["D",1787917328566],[],[323],"5c2a5547-d76c-4567-8522-29423283e60f",".claude","eba0af44-9ce0-11f1-a8fe-1607ee4eb77e",["D",1787262526487],[],[330],["D",1787262525473],{"_11":12,"_120":69},{"_11":12,"_116":-5,"_68":69,"_30":67,"_117":118,"_119":24},{"_38":107,"_13":16,"_32":35,"_108":71,"_109":-5,"_110":-5,"_111":-5,"_112":-5,"_113":-5,"_114":14,"_115":12},"ctx",{"_51":-5,"_139":372,"_373":374,"_375":376,"_377":24,"_378":24,"_379":24,"_380":84,"_381":-5,"_382":-7,"_383":-7,"_384":26,"_385":24,"_386":24,"_387":-5,"_388":24,"_389":24,"_390":24,"_391":-5},"ENV",{"_343":344,"_345":346,"_347":16,"_348":349,"_350":351,"_352":353,"_354":355,"_356":357,"_358":359,"_360":361,"_362":363,"_364":365,"_366":367,"_368":369,"_370":371},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Purchase model

Set up your numbers

\n {label}\n

Takoma Park purchase model

History · auth.ts