@jjlmoya/utils-nature 1.20.0 → 1.22.0

package/src/tool/seedCalculator/i18n/en.ts

@@ -1,4 +1,4 @@
-import type { WithContext, FAQPage, HowToThing, SoftwareApplication } from 'schema-dts';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 import type { SeedCalculatorUI } from '../ui';
@@ -60,7 +60,7 @@ const faqSchema: WithContext<FAQPage> = {
   })),
 };
 
-const howToSchema: WithContext<HowToThing> = {
+const howToSchema: WithContext<HowTo> = {
   '@context': 'https://schema.org',
   '@type': 'HowTo',
   name: title,

package/src/tool/seedCalculator/i18n/es.ts

@@ -1,4 +1,4 @@
-import type { WithContext, FAQPage, HowToThing, SoftwareApplication } from 'schema-dts';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 import type { SeedCalculatorUI } from '../ui';
@@ -60,7 +60,7 @@ const faqSchema: WithContext<FAQPage> = {
   })),
 };
 
-const howToSchema: WithContext<HowToThing> = {
+const howToSchema: WithContext<HowTo> = {
   '@context': 'https://schema.org',
   '@type': 'HowTo',
   name: title,

package/src/tool/seedCalculator/i18n/fr.ts

@@ -1,4 +1,4 @@
-import type { WithContext, FAQPage, HowToThing, SoftwareApplication } from 'schema-dts';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 import type { SeedCalculatorUI } from '../ui';
@@ -60,7 +60,7 @@ const faqSchema: WithContext<FAQPage> = {
   })),
 };
 
-const howToSchema: WithContext<HowToThing> = {
+const howToSchema: WithContext<HowTo> = {
   '@context': 'https://schema.org',
   '@type': 'HowTo',
   name: title,

package/src/tool/seedCalculator/i18n/id.ts

@@ -1,4 +1,4 @@
-import type { WithContext, FAQPage, HowToThing, SoftwareApplication } from 'schema-dts';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 import type { SeedCalculatorUI } from '../ui';
@@ -60,7 +60,7 @@ const faqSchema: WithContext<FAQPage> = {
   })),
 };
 
-const howToSchema: WithContext<HowToThing> = {
+const howToSchema: WithContext<HowTo> = {
   '@context': 'https://schema.org',
   '@type': 'HowTo',
   name: title,

package/src/tool/seedCalculator/i18n/it.ts

@@ -1,4 +1,4 @@
-import type { WithContext, FAQPage, HowToThing, SoftwareApplication } from 'schema-dts';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 import type { SeedCalculatorUI } from '../ui';
@@ -60,7 +60,7 @@ const faqSchema: WithContext<FAQPage> = {
   })),
 };
 
-const howToSchema: WithContext<HowToThing> = {
+const howToSchema: WithContext<HowTo> = {
   '@context': 'https://schema.org',
   '@type': 'HowTo',
   name: title,

package/src/tool/seedCalculator/i18n/ja.ts

@@ -1,4 +1,4 @@
-import type { WithContext, FAQPage, HowToThing, SoftwareApplication } from 'schema-dts';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 import type { SeedCalculatorUI } from '../ui';
@@ -60,7 +60,7 @@ const faqSchema: WithContext<FAQPage> = {
   })),
 };
 
-const howToSchema: WithContext<HowToThing> = {
+const howToSchema: WithContext<HowTo> = {
   '@context': 'https://schema.org',
   '@type': 'HowTo',
   name: title,

package/src/tool/seedCalculator/i18n/ko.ts

@@ -1,4 +1,4 @@
-import type { WithContext, FAQPage, HowToThing, SoftwareApplication } from 'schema-dts';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 import type { SeedCalculatorUI } from '../ui';
@@ -60,7 +60,7 @@ const faqSchema: WithContext<FAQPage> = {
   })),
 };
 
-const howToSchema: WithContext<HowToThing> = {
+const howToSchema: WithContext<HowTo> = {
   '@context': 'https://schema.org',
   '@type': 'HowTo',
   name: title,

package/src/tool/seedCalculator/i18n/nl.ts

@@ -1,4 +1,4 @@
-import type { WithContext, FAQPage, HowToThing, SoftwareApplication } from 'schema-dts';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 import type { SeedCalculatorUI } from '../ui';
@@ -60,7 +60,7 @@ const faqSchema: WithContext<FAQPage> = {
   })),
 };
 
-const howToSchema: WithContext<HowToThing> = {
+const howToSchema: WithContext<HowTo> = {
   '@context': 'https://schema.org',
   '@type': 'HowTo',
   name: title,

package/src/tool/seedCalculator/i18n/pl.ts

@@ -1,4 +1,4 @@
-import type { WithContext, FAQPage, HowToThing, SoftwareApplication } from 'schema-dts';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 import type { SeedCalculatorUI } from '../ui';
@@ -60,7 +60,7 @@ const faqSchema: WithContext<FAQPage> = {
   })),
 };
 
-const howToSchema: WithContext<HowToThing> = {
+const howToSchema: WithContext<HowTo> = {
   '@context': 'https://schema.org',
   '@type': 'HowTo',
   name: title,

package/src/tool/seedCalculator/i18n/pt.ts

@@ -1,4 +1,4 @@
-import type { WithContext, FAQPage, HowToThing, SoftwareApplication } from 'schema-dts';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 import type { SeedCalculatorUI } from '../ui';
@@ -60,7 +60,7 @@ const faqSchema: WithContext<FAQPage> = {
   })),
 };
 
-const howToSchema: WithContext<HowToThing> = {
+const howToSchema: WithContext<HowTo> = {
   '@context': 'https://schema.org',
   '@type': 'HowTo',
   name: title,

package/src/tool/seedCalculator/i18n/ru.ts

@@ -1,4 +1,4 @@
-import type { WithContext, FAQPage, HowToThing, SoftwareApplication } from 'schema-dts';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 import type { SeedCalculatorUI } from '../ui';
@@ -60,7 +60,7 @@ const faqSchema: WithContext<FAQPage> = {
   })),
 };
 
-const howToSchema: WithContext<HowToThing> = {
+const howToSchema: WithContext<HowTo> = {
   '@context': 'https://schema.org',
   '@type': 'HowTo',
   name: title,

package/src/tool/seedCalculator/i18n/sv.ts

@@ -1,4 +1,4 @@
-import type { WithContext, FAQPage, HowToThing, SoftwareApplication } from 'schema-dts';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 import type { SeedCalculatorUI } from '../ui';
@@ -60,7 +60,7 @@ const faqSchema: WithContext<FAQPage> = {
   })),
 };
 
-const howToSchema: WithContext<HowToThing> = {
+const howToSchema: WithContext<HowTo> = {
   '@context': 'https://schema.org',
   '@type': 'HowTo',
   name: title,

package/src/tool/seedCalculator/i18n/tr.ts

@@ -1,4 +1,4 @@
-import type { WithContext, FAQPage, HowToThing, SoftwareApplication } from 'schema-dts';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 import type { SeedCalculatorUI } from '../ui';
@@ -60,7 +60,7 @@ const faqSchema: WithContext<FAQPage> = {
   })),
 };
 
-const howToSchema: WithContext<HowToThing> = {
+const howToSchema: WithContext<HowTo> = {
   '@context': 'https://schema.org',
   '@type': 'HowTo',
   name: title,

package/src/tool/seedCalculator/i18n/zh.ts

@@ -1,4 +1,4 @@
-import type { WithContext, FAQPage, HowToThing, SoftwareApplication } from 'schema-dts';
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
 import { bibliography } from '../bibliography';
 import type { ToolLocaleContent } from '../../../types';
 import type { SeedCalculatorUI } from '../ui';
@@ -60,7 +60,7 @@ const faqSchema: WithContext<FAQPage> = {
   })),
 };
 
-const howToSchema: WithContext<HowToThing> = {
+const howToSchema: WithContext<HowTo> = {
   '@context': 'https://schema.org',
   '@type': 'HowTo',
   name: title,

package/src/tool/seedCalculator/index.ts

@@ -1,3 +1,4 @@
+import type { ToolDefinition } from '../../types';
 import { seedCalculator } from './entry';
 export * from './entry';
 export const SEED_CALCULATOR_TOOL: ToolDefinition = {

package/src/tool/urbanGardenPlanner/bibliography.astro

@@ -0,0 +1,9 @@
+---
+import { Bibliography as SharedBibliography } from '@jjlmoya/utils-shared';
+import { urbanGardenPlanner } from './index';
+
+const { locale = 'en' } = Astro.props;
+const content = await urbanGardenPlanner.i18n[locale as keyof typeof urbanGardenPlanner.i18n]?.();
+---
+
+{content && <SharedBibliography links={content.bibliography} />}

package/src/tool/urbanGardenPlanner/bibliography.ts

@@ -0,0 +1,16 @@
+import type { BibliographyEntry } from '../../types';
+
+export const bibliography: BibliographyEntry[] = [
+  {
+    name: 'RHS Urban gardening',
+    url: 'https://www.rhs.org.uk/advice/urban-gardening',
+  },
+  {
+    name: 'US EPA Rain barrels',
+    url: 'https://www.epa.gov/soakuptherain/soak-rain-rain-barrels',
+  },
+  {
+    name: 'FAO Water harvesting and soil moisture management',
+    url: 'https://www.fao.org/4/y4690e/y4690e00.htm',
+  },
+];

package/src/tool/urbanGardenPlanner/component.astro

@@ -0,0 +1,131 @@
+---
+import { Icon } from 'astro-icon/components';
+import { urbanGardenPlanner } from './index';
+import { DEFAULT_INPUTS } from './logic';
+
+const { ui: propUi, locale = 'en' } = Astro.props;
+let ui = propUi;
+
+if (!ui) {
+  const content = await urbanGardenPlanner.i18n[locale as keyof typeof urbanGardenPlanner.i18n]?.();
+  ui = content?.ui;
+}
+
+if (!ui) return null;
+
+const config = JSON.stringify({ ui, defaults: DEFAULT_INPUTS });
+---
+
+<urban-garden-planner class="ugrp-root">
+  <div class="ugrp-shell">
+    <section class="ugrp-input-panel" aria-labelledby="ugrp-input-heading">
+      <div class="ugrp-kicker">{ui.eyebrow}</div>
+      <h2 id="ugrp-input-heading" class="ugrp-heading">
+        <span class="ugrp-step">1</span>
+        {ui.headInputs}
+      </h2>
+
+      <div class="ugrp-fields">
+        <label class="ugrp-field" for="gardenArea">
+          <span class="ugrp-label"><Icon name="mdi:flower-outline" aria-hidden="true" />{ui.labelGardenArea}</span>
+          <span class="ugrp-input-line">
+            <input id="gardenArea" type="number" min="0" step="0.5" value={DEFAULT_INPUTS.gardenAreaM2} />
+            <span>{ui.unitSquareMeters}</span>
+          </span>
+          <span class="ugrp-help">{ui.helpGardenArea}</span>
+        </label>
+
+        <label class="ugrp-field" for="substrateDepth">
+          <span class="ugrp-label"><Icon name="mdi:layers-outline" aria-hidden="true" />{ui.labelDepth}</span>
+          <span class="ugrp-input-line">
+            <input id="substrateDepth" type="number" min="0" step="1" value={DEFAULT_INPUTS.substrateDepthCm} />
+            <span>{ui.unitCentimeters}</span>
+          </span>
+          <span class="ugrp-help">{ui.helpDepth}</span>
+        </label>
+
+        <label class="ugrp-field" for="collectionArea">
+          <span class="ugrp-label"><Icon name="mdi:home-roof" aria-hidden="true" />{ui.labelCollectionArea}</span>
+          <span class="ugrp-input-line">
+            <input id="collectionArea" type="number" min="0" step="0.5" value={DEFAULT_INPUTS.collectionAreaM2} />
+            <span>{ui.unitSquareMeters}</span>
+          </span>
+          <span class="ugrp-help">{ui.helpCollectionArea}</span>
+        </label>
+
+        <label class="ugrp-field" for="rainfall">
+          <span class="ugrp-label"><Icon name="mdi:weather-rainy" aria-hidden="true" />{ui.labelRainfall}</span>
+          <span class="ugrp-input-line">
+            <input id="rainfall" type="number" min="0" step="1" value={DEFAULT_INPUTS.rainfallMm} />
+            <span>{ui.unitMillimeters}</span>
+          </span>
+          <span class="ugrp-help">{ui.helpRainfall}</span>
+        </label>
+      </div>
+
+      <div class="ugrp-presets">
+        <div class="ugrp-subheading">{ui.presetsTitle}</div>
+        <div class="ugrp-preset-row">
+          <button type="button" class="ugrp-preset" data-preset="4,20,8,15">{ui.presetBalcony}</button>
+          <button type="button" class="ugrp-preset" data-preset="12,30,25,20">{ui.presetRaisedBed}</button>
+          <button type="button" class="ugrp-preset" data-preset="24,35,50,25">{ui.presetCommunity}</button>
+        </div>
+      </div>
+
+      <div class="ugrp-note ugrp-note-assumption">
+        <Icon name="mdi:calculator-variant-outline" aria-hidden="true" />
+        <div><strong>{ui.assumptionTitle}</strong><span>{ui.assumptionText}</span></div>
+      </div>
+    </section>
+
+    <section class="ugrp-result-panel" aria-labelledby="ugrp-scene-heading">
+      <div class="ugrp-result-topline">
+        <div>
+          <div class="ugrp-kicker">{ui.headScene}</div>
+          <h2 id="ugrp-scene-heading" class="ugrp-heading"><span class="ugrp-step ugrp-step-light">2</span>{ui.sceneGardenBed}</h2>
+        </div>
+        <div id="planStatus" class="ugrp-status" aria-live="polite">{ui.statusBalanced}</div>
+      </div>
+
+      <div class="ugrp-landscape" aria-label={ui.headScene} role="img">
+        <div id="rainDots" class="ugrp-rain-dots" aria-hidden="true"></div>
+        <div class="ugrp-cloud"><Icon name="mdi:weather-cloudy" aria-hidden="true" /></div>
+        <div class="ugrp-catchment"><span>{ui.sceneCatchment}</span><i></i></div>
+        <div class="ugrp-pipe"><i></i><b></b></div>
+        <div class="ugrp-bed">
+          <div class="ugrp-bed-frame"></div>
+          <div id="soilFill" class="ugrp-soil-fill" role="progressbar" aria-valuemin="0" aria-valuemax="100"></div>
+          <div class="ugrp-leaves"><Icon name="mdi:sprout" aria-hidden="true" /><Icon name="mdi:sprout" aria-hidden="true" /><Icon name="mdi:sprout" aria-hidden="true" /></div>
+          <span>{ui.sceneSoil}</span>
+        </div>
+        <div class="ugrp-water-vessel"><div id="waterFill" role="progressbar" aria-valuemin="0" aria-valuemax="100"></div><Icon name="mdi:water-outline" aria-hidden="true" /><span>{ui.sceneWater}</span></div>
+      </div>
+
+      <p id="planStatusNote" class="ugrp-status-note">{ui.statusNote}</p>
+
+      <div class="ugrp-metrics" aria-live="polite">
+        <div class="ugrp-metric ugrp-metric-main"><span>{ui.labelWaterCaptured}</span><strong id="waterValue">0 L</strong></div>
+        <div class="ugrp-metric"><span>{ui.labelSoilNeeded}</span><strong id="soilValue">0 L</strong></div>
+        <div class="ugrp-metric"><span>{ui.labelGardenDepth}</span><strong id="depthValue">0 mm</strong></div>
+        <div class="ugrp-metric"><span>{ui.labelWateringArea}</span><strong id="areaValue">0 m²</strong></div>
+      </div>
+
+      <div class="ugrp-note ugrp-note-limit">
+        <Icon name="mdi:leaf-circle-outline" aria-hidden="true" />
+        <div><strong>{ui.limitationTitle}</strong><span>{ui.limitationText}</span></div>
+      </div>
+    </section>
+  </div>
+</urban-garden-planner>
+
+<script is:inline type="application/json" id="ugrp-config" set:html={config}></script>
+
+<script>
+  import { mountUrbanGardenPlanner } from './controller';
+  const root = document.querySelector<HTMLElement>('urban-garden-planner');
+  const configNode = document.getElementById('ugrp-config');
+  if (root && configNode) {
+    const config = JSON.parse(configNode.textContent || '{}');
+    mountUrbanGardenPlanner(root, config);
+  }
+</script>

package/src/tool/urbanGardenPlanner/controller.ts

@@ -0,0 +1,88 @@
+import { evaluateGardenPlan } from './evaluator';
+import { calculateGardenPlan, DEFAULT_INPUTS, type GardenPlanInput } from './logic';
+import { findElements, renderGardenPlan, type GardenPlannerElements } from './dom-views';
+import { loadGardenPlan, saveGardenPlan } from './storage';
+import type { UrbanGardenPlannerUI } from './ui';
+
+export interface UrbanGardenPlannerConfig {
+  ui: UrbanGardenPlannerUI;
+  defaults: GardenPlanInput;
+}
+
+const inputKeys: (keyof GardenPlanInput)[] = [
+  'gardenAreaM2',
+  'substrateDepthCm',
+  'collectionAreaM2',
+  'rainfallMm',
+];
+
+class UrbanGardenPlannerController {
+  private readonly elements: GardenPlannerElements;
+  private readonly config: UrbanGardenPlannerConfig;
+
+  constructor(private readonly root: HTMLElement, config: UrbanGardenPlannerConfig) {
+    this.elements = findElements(root);
+    this.config = config;
+  }
+
+  mount(): void {
+    this.restoreInputs();
+    this.bindInputs();
+    this.bindPresets();
+    this.calculate();
+  }
+
+  private restoreInputs(): void {
+    const saved = loadGardenPlan();
+    const values = { ...DEFAULT_INPUTS, ...this.config.defaults, ...saved };
+    inputKeys.forEach((key) => {
+      const element = this.elements.inputs[key];
+      if (element) element.value = String(values[key]);
+    });
+  }
+
+  private bindInputs(): void {
+    inputKeys.forEach((key) => {
+      this.elements.inputs[key]?.addEventListener('input', () => this.calculate());
+    });
+  }
+
+  private bindPresets(): void {
+    this.root.querySelectorAll<HTMLButtonElement>('[data-preset]').forEach((button) => {
+      button.addEventListener('click', () => {
+        const values = button.dataset.preset?.split(',').map(Number) ?? [];
+        inputKeys.forEach((key, index) => {
+          const element = this.elements.inputs[key];
+          if (element && Number.isFinite(values[index])) element.value = String(values[index]);
+        });
+        this.calculate();
+      });
+    });
+  }
+
+  private readInputs(): GardenPlanInput {
+    return {
+      gardenAreaM2: Number(this.elements.inputs.gardenAreaM2?.value),
+      substrateDepthCm: Number(this.elements.inputs.substrateDepthCm?.value),
+      collectionAreaM2: Number(this.elements.inputs.collectionAreaM2?.value),
+      rainfallMm: Number(this.elements.inputs.rainfallMm?.value),
+    };
+  }
+
+  private calculate(): void {
+    const input = this.readInputs();
+    const result = calculateGardenPlan(input);
+    const assessment = evaluateGardenPlan(input, result);
+    saveGardenPlan(input);
+    renderGardenPlan(this.elements, result, assessment, this.config.ui);
+  }
+}
+
+export function mountUrbanGardenPlanner(
+  root: HTMLElement,
+  config: UrbanGardenPlannerConfig,
+): void {
+  if (root.dataset.mounted === 'true') return;
+  root.dataset.mounted = 'true';
+  new UrbanGardenPlannerController(root, config).mount();
+}

package/src/tool/urbanGardenPlanner/dom-views.ts

@@ -0,0 +1,84 @@
+import type { GardenPlanAssessment } from './evaluator';
+import type { GardenPlanResult } from './logic';
+import type { UrbanGardenPlannerUI } from './ui';
+
+export interface GardenPlannerElements {
+  root: HTMLElement;
+  inputs: Record<keyof GardenPlanResult, HTMLInputElement | null>;
+  soilValue: HTMLElement | null;
+  waterValue: HTMLElement | null;
+  depthValue: HTMLElement | null;
+  areaValue: HTMLElement | null;
+  status: HTMLElement | null;
+  statusNote: HTMLElement | null;
+  soilFill: HTMLElement | null;
+  waterFill: HTMLElement | null;
+  rainDots: HTMLElement | null;
+}
+
+export function findElements(root: HTMLElement): GardenPlannerElements {
+  const input = (id: string) => root.querySelector<HTMLInputElement>(id);
+  const output = (id: string) => root.querySelector<HTMLElement>(id);
+
+  return {
+    root,
+    inputs: {
+      gardenAreaM2: input('#gardenArea'),
+      substrateDepthCm: input('#substrateDepth'),
+      collectionAreaM2: input('#collectionArea'),
+      rainfallMm: input('#rainfall'),
+      soilVolumeLiters: null,
+      grossRainwaterLiters: null,
+      harvestedWaterLiters: null,
+      gardenWaterDepthMm: null,
+      wateringAreaAt10Mm: null,
+    },
+    soilValue: output('#soilValue'),
+    waterValue: output('#waterValue'),
+    depthValue: output('#depthValue'),
+    areaValue: output('#areaValue'),
+    status: output('#planStatus'),
+    statusNote: output('#planStatusNote'),
+    soilFill: output('#soilFill'),
+    waterFill: output('#waterFill'),
+    rainDots: output('#rainDots'),
+  };
+}
+
+export function formatNumber(value: number, maximumFractionDigits = 0): string {
+  return new Intl.NumberFormat('en', { maximumFractionDigits }).format(value);
+}
+
+function setText(element: HTMLElement | null, text: string): void {
+  if (element) element.textContent = text;
+}
+
+function statusLabel(ui: UrbanGardenPlannerUI, assessment: GardenPlanAssessment): string {
+  const labels = {
+    balanced: ui.statusBalanced,
+    lightCapture: ui.statusLightCapture,
+    deepBed: ui.statusDeepBed,
+    noRain: ui.statusNoRain,
+  };
+  return labels[assessment.status];
+}
+
+export function renderGardenPlan(
+  elements: GardenPlannerElements,
+  result: GardenPlanResult,
+  assessment: GardenPlanAssessment,
+  ui: UrbanGardenPlannerUI,
+): void {
+  setText(elements.soilValue, `${formatNumber(result.soilVolumeLiters)} L`);
+  setText(elements.waterValue, `${formatNumber(result.harvestedWaterLiters, 1)} L`);
+  setText(elements.depthValue, `${formatNumber(result.gardenWaterDepthMm, 1)} mm`);
+  setText(elements.areaValue, `${formatNumber(result.wateringAreaAt10Mm, 1)} m²`);
+  setText(elements.status, statusLabel(ui, assessment));
+  setText(elements.statusNote, ui.statusNote);
+  elements.root.dataset.status = assessment.status;
+  elements.root.style.setProperty('--ugrp-water-progress', `${assessment.progress}%`);
+  elements.root.style.setProperty('--ugrp-soil-progress', `${Math.min(92, Math.max(18, result.substrateDepthCm * 1.7))}%`);
+  elements.root.style.setProperty('--ugrp-rain-progress', `${Math.min(100, Math.max(8, result.rainfallMm * 2.2))}%`);
+  if (elements.soilFill) elements.soilFill.setAttribute('aria-valuenow', String(result.substrateDepthCm));
+  if (elements.waterFill) elements.waterFill.setAttribute('aria-valuenow', String(result.harvestedWaterLiters));
+}

package/src/tool/urbanGardenPlanner/entry.ts

@@ -0,0 +1,29 @@
+import type { NatureToolEntry, ToolLocaleContent } from '../../types';
+import type { UrbanGardenPlannerUI } from './ui';
+
+export type UrbanGardenPlannerLocaleContent = ToolLocaleContent<UrbanGardenPlannerUI>;
+
+export const urbanGardenPlanner: NatureToolEntry<UrbanGardenPlannerUI> = {
+  id: 'urban-garden-rainwater-soil-planner',
+  icons: {
+    bg: 'mdi:water-outline',
+    fg: 'mdi:sprout',
+  },
+  i18n: {
+    en: async () => (await import('./i18n/en')).content,
+    de: async () => (await import('./i18n/de')).content,
+    es: async () => (await import('./i18n/es')).content,
+    fr: async () => (await import('./i18n/fr')).content,
+    id: async () => (await import('./i18n/id')).content,
+    it: async () => (await import('./i18n/it')).content,
+    ja: async () => (await import('./i18n/ja')).content,
+    ko: async () => (await import('./i18n/ko')).content,
+    nl: async () => (await import('./i18n/nl')).content,
+    pl: async () => (await import('./i18n/pl')).content,
+    pt: async () => (await import('./i18n/pt')).content,
+    ru: async () => (await import('./i18n/ru')).content,
+    sv: async () => (await import('./i18n/sv')).content,
+    tr: async () => (await import('./i18n/tr')).content,
+    zh: async () => (await import('./i18n/zh')).content,
+  },
+};

package/src/tool/urbanGardenPlanner/evaluator.ts

@@ -0,0 +1,27 @@
+import type { GardenPlanInput, GardenPlanResult } from './logic';
+
+export type GardenPlanStatus = 'balanced' | 'lightCapture' | 'deepBed' | 'noRain';
+
+export interface GardenPlanAssessment {
+  status: GardenPlanStatus;
+  progress: number;
+}
+
+export function evaluateGardenPlan(
+  input: GardenPlanInput,
+  result: GardenPlanResult,
+): GardenPlanAssessment {
+  if (result.rainfallMm === 0 || result.collectionAreaM2 === 0) {
+    return { status: 'noRain', progress: 8 };
+  }
+
+  if (result.gardenWaterDepthMm < 5) {
+    return { status: 'lightCapture', progress: Math.max(12, result.gardenWaterDepthMm * 8) };
+  }
+
+  if (input.substrateDepthCm > 45) {
+    return { status: 'deepBed', progress: 86 };
+  }
+
+  return { status: 'balanced', progress: Math.min(92, Math.max(18, result.gardenWaterDepthMm * 3)) };
+}