feat: Adds hydronic system pressure calculator.

Tests/ViewControllerTests/ViewControllerTests.swift

@@ -124,7 +124,11 @@ struct ViewControllerTests {
             doorHeight: 86,
             doorUndercut: 1,
             preferredGrilleHeight: .fourteen
-          ))))
+          )))),
+
+          // Hydronic system pressure
+          .hydronicSystemPressure(.index),
+          .hydronicSystemPressure(.submit(.init(height: 12, waterTemperature: 60)))
 
         ])
 

Tests/ViewControllerTests/__Snapshots__/ViewControllerTests/snapShotTests.30.html

@@ -0,0 +1,45 @@
+<div class="flex items-center gap-3 mb-6">
+  <div class="block text-blue-500">
+    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-gauge">
+    <path d="M15.6 2.7a10 10 0 1 0 5.7 5.7"/>
+    <circle cx="12" cy="12" r="2"/>
+    <path d="M13.4 10.6 19 5"/>
+    </svg>
+  </div>
+  <h2 class="text-2xl font-extrabold">Hydronic System Pressure</h2>
+</div>
+<form hx-post="/hydronic-system-pressure" hx-target="#result">
+  <div class="space-y-6">
+    <div class="grid grid-cols-2 gap-4">
+      <div>
+        <label for="height" class="block text-sm font-medium mb-2">Height (ft.)</label>
+        <input id="height" placeholder="Building height" name="height" class="  w-full px-4 py-2 border rounded-md min-h-11
+  focus:ring-2 focus:ring-yellow-800 focus:border-yellow-800
+  placeholder-shown:!border-gray-400
+  invalid:border-red-500 out-of-range:border-red-500" type="number" min="0.1" step="0.1" autofocus required>
+      </div>
+      <div>
+        <label for="waterTemperature" class="block text-sm font-medium mb-2">Water Temperature (°F)</label>
+        <input id="waterTemperature" placeholder="Temperature (optional)" name="waterTemperature" class="  w-full px-4 py-2 border rounded-md min-h-11
+  focus:ring-2 focus:ring-yellow-800 focus:border-yellow-800
+  placeholder-shown:!border-gray-400
+  invalid:border-red-500 out-of-range:border-red-500" type="number" min="32.0" step="0.1">
+      </div>
+    </div>
+    <div class="mt-8 p-4 bg-gray-100 dark:bg-gray-700 rounded-md shadow-md
+border border-blue-500 text-blue-500 text-sm">
+      <p class="font-extrabold mb-3">Note:</p>
+      <p class="px-6">
+        Water temperature should be the coldest water temperature the system sees, which for boilers will be
+        when the system is filled with water.
+      </p>
+    </div>
+    <div>
+      <button type="submit" class="  w-full font-bold py-3 rounded-md transition-colors
+  bg-yellow-300 dark:bg-blue-500
+  hover:bg-yellow-400 hover:dark:bg-blue-600
+  text-blue-500 dark:text-yellow-300">Calculate System Pressure</button>
+    </div>
+  </div>
+</form>
+<div id="result"></div>

Tests/ViewControllerTests/__Snapshots__/ViewControllerTests/snapShotTests.31.html

@@ -0,0 +1,29 @@
+<div class="  mt-6 p-6 rounded-lg border border-blue-500
+  bg-blue-50 dark:bg-slate-600
+  text-blue-500 dark:text-slate-200">
+  <div class="relative">
+    <h3 class="text-xl font-semibold mb-4">Results</h3>
+    <button class="  font-bold px-4 py-2 rounded-md transition-colors
+  bg-blue-500 dark:bg-yellow-300
+  hover:bg-blue-600 hover:dark:bg-yellow-400
+  text-yellow-300 dark:text-blue-500 absolute bottom-0 right-0" hx-get="/hydronic-system-pressure" hx-target="#content">Reset</button>
+  </div>
+  <div class="w-full rounded-lg shadow-lg bg-blue-100 border border-blue-600 text-blue-600 p-6">
+    <div class="grid grid-cols-2">
+      <div class="grid grid-cols-1 justify-items-center">
+        <p class="font-medium">Pressure</p>
+        <h3 class="text-3xl font-extrabold">10.22<span class="text-lg ms-2">psi</span></h3>
+      </div>
+      <div class="grid grid-cols-1 justify-items-center">
+        <p class="font-medium">Water Density</p>
+        <h3 class="text-3xl font-extrabold">62.58<span class="text-lg ms-2">lb/ft³</span></h3>
+      </div>
+    </div>
+  </div>
+  <div id="warnings"></div>
+  <div class="mt-8 p-4 bg-gray-100 dark:bg-gray-700 rounded-md shadow-md
+border border-blue-500 text-blue-500 text-sm">
+    <p class="font-extrabold mb-3">Note:</p>
+    <p class="px-6">Expansion tank pressure should match system fill pressure.</p>
+  </div>
+</div>