Publish browser-only pre-data-room triage worksheet

README.md

@@ -1,10 +1,19 @@
 ---
-title: Pre Data Room Triage Worksheet
-emoji: 📉
-colorFrom: gray
-colorTo: gray
+title: Pre-Data-Room Triage Worksheet
+emoji: 🗂️
+colorFrom: indigo
+colorTo: green
 sdk: static
 pinned: false
+license: cc-by-4.0
+short_description: Document first-pass evidence before a full data room.
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+# Pre-Data-Room Triage Worksheet
+
+A browser-only worksheet for corporate venture, corporate development,
+innovation, and M&A teams. Review 12 connected evidence checkpoints, assign
+owners, and export the agenda before deeper diligence begins.
+
+Nothing entered in the worksheet is uploaded or stored by the Space. The
+template and fictional example are licensed under CC BY 4.0.

app.js

@@ -0,0 +1,174 @@
+"use strict";
+
+const checkpoints = [
+  ["Business Idea", "Strategic or transaction fit"],
+  ["Offering", "Current offering and buyer outcome"],
+  ["Team", "Execution ownership and key-person dependency"],
+  ["Market", "Target segment and demand evidence"],
+  ["Competitors", "Alternatives and differentiation"],
+  ["Technology & IP", "Technical readiness and defensibility"],
+  ["Scalability", "Deployment and operating scalability"],
+  ["Legal & Regulatory", "Regulatory, data, and contractual exposure"],
+  ["Financials", "Revenue quality and cash assumptions"],
+  ["Fundability", "Capital structure and financing dependencies"],
+  ["Exit", "Transaction and integration path"],
+  ["Presentation", "Evidence package and open-item traceability"],
+];
+const fields = [
+  "priority",
+  "dimension",
+  "checkpoint",
+  "evidence_state",
+  "evidence",
+  "owner",
+  "next_action",
+  "review_note",
+];
+const rows = document.querySelector("#checkpoint-rows");
+const statusMessage = document.querySelector("#status-message");
+
+function select(name, options) {
+  const element = document.createElement("select");
+  element.dataset.field = name;
+  element.setAttribute("aria-label", name.replaceAll("_", " "));
+  for (const optionText of options) {
+    const option = document.createElement("option");
+    option.textContent = optionText;
+    element.append(option);
+  }
+  return element;
+}
+
+function textControl(name, multiline = false) {
+  const element = document.createElement(multiline ? "textarea" : "input");
+  element.dataset.field = name;
+  element.setAttribute("aria-label", name.replaceAll("_", " "));
+  return element;
+}
+
+function buildRows() {
+  rows.replaceChildren();
+  checkpoints.forEach(([dimension, checkpoint], index) => {
+    const row = document.createElement("tr");
+    const values = [
+      select("priority", ["", "1", "2", "3", "4", "5"]),
+      Object.assign(document.createElement("span"), {
+        textContent: dimension,
+      }),
+      Object.assign(document.createElement("span"), {
+        textContent: checkpoint,
+      }),
+      select("evidence_state", [
+        "Not reviewed",
+        "Claim only",
+        "Partial",
+        "Supported",
+        "Conflicted",
+      ]),
+      textControl("evidence", true),
+      textControl("owner"),
+      textControl("next_action", true),
+      textControl("review_note", true),
+    ];
+    values[1].dataset.field = "dimension";
+    values[2].dataset.field = "checkpoint";
+    values.forEach((value) => {
+      const cell = document.createElement("td");
+      cell.append(value);
+      row.append(cell);
+    });
+    row.dataset.row = String(index + 1);
+    rows.append(row);
+  });
+}
+
+function controlValue(row, field) {
+  const element = row.querySelector(`[data-field="${field}"]`);
+  return ("value" in element ? element.value : element.textContent).trim();
+}
+
+function rowValues(row) {
+  return Object.fromEntries(fields.map((field) => [field, controlValue(row, field)]));
+}
+
+function csvCell(value) {
+  return `"${String(value).replaceAll('"', '""')}"`;
+}
+
+function exportCsv() {
+  const context = {
+    opportunity_type: document.querySelector("#opportunity-type").value,
+    review_stage: document.querySelector("#review-stage").value,
+    review_owner: document.querySelector("#review-owner").value.trim(),
+  };
+  const exportFields = [...Object.keys(context), ...fields];
+  const data = [...rows.querySelectorAll("tr")].map((row) => ({
+    ...context,
+    ...rowValues(row),
+  }));
+  const csv = [
+    exportFields.map(csvCell).join(","),
+    ...data.map((row) => exportFields.map((field) => csvCell(row[field])).join(",")),
+  ].join("\r\n");
+  const blob = new Blob([csv], { type: "text/csv;charset=utf-8" });
+  const url = URL.createObjectURL(blob);
+  const link = document.createElement("a");
+  link.href = url;
+  link.download = "pre-data-room-triage-workbook.csv";
+  link.click();
+  URL.revokeObjectURL(url);
+  statusMessage.textContent = "Downloaded all 12 checkpoints as CSV.";
+}
+
+function setRow(rowNumber, values) {
+  const row = rows.querySelector(`[data-row="${rowNumber}"]`);
+  Object.entries(values).forEach(([field, value]) => {
+    row.querySelector(`[data-field="${field}"]`).value = value;
+  });
+}
+
+function clearWorksheet() {
+  document.querySelector("#opportunity-type").value = "Corporate venture investment";
+  document.querySelector("#review-stage").value = "Inbound triage";
+  document.querySelector("#review-owner").value = "";
+  buildRows();
+  statusMessage.textContent = "Worksheet cleared.";
+}
+
+function loadExample() {
+  clearWorksheet();
+  document.querySelector("#opportunity-type").value = "Commercial partnership";
+  document.querySelector("#review-stage").value = "Before first management call";
+  document.querySelector("#review-owner").value = "Fictional CVC team";
+  setRow(4, {
+    priority: "1",
+    evidence_state: "Partial",
+    evidence: "Three pilot letters; no paid conversion history",
+    owner: "Commercial lead",
+    next_action: "Ask for cohort, conversion, and signed-pipeline evidence",
+    review_note: "Separate buyer interest from repeatable demand.",
+  });
+  setRow(6, {
+    priority: "2",
+    evidence_state: "Claim only",
+    evidence: "Architecture claim in deck; no integration test supplied",
+    owner: "Technical reviewer",
+    next_action: "Request data-flow map and one reproducible integration test",
+    review_note: "Fictional example only.",
+  });
+  setRow(8, {
+    priority: "3",
+    evidence_state: "Not reviewed",
+    evidence: "",
+    owner: "Legal reviewer",
+    next_action: "Confirm the lawful data basis and required customer terms",
+    review_note: "Scope only after the intended deployment is clear.",
+  });
+  statusMessage.textContent = "Loaded a completely fictional three-item example.";
+}
+
+document.querySelector("#load-example").addEventListener("click", loadExample);
+document.querySelector("#clear").addEventListener("click", clearWorksheet);
+document.querySelector("#export-csv").addEventListener("click", exportCsv);
+
+buildRows();

index.html

@@ -1,19 +1,123 @@
 <!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta
+      name="description"
+      content="A browser-only pre-data-room triage worksheet for corporate venture and M&A teams."
+    />
+    <title>Pre-Data-Room Triage Worksheet</title>
+    <link rel="stylesheet" href="styles.css" />
+  </head>
+  <body>
+    <main>
+      <header class="intro">
+        <p class="eyebrow">Corporate venture and M&amp;A first pass</p>
+        <h1>Pre-Data-Room Triage Worksheet</h1>
+        <p class="lede">
+          Turn an inbound opportunity into a documented evidence agenda before
+          committing to a full data-room process. Everything stays in this
+          browser; export the worksheet before closing the page.
+        </p>
+        <div class="guardrails" aria-label="Worksheet guardrails">
+          <span>No uploads</span><span>No account</span><span>No scoring</span
+          ><span>No decision automation</span>
+        </div>
+      </header>
+
+      <section class="controls" aria-labelledby="controls-title">
+        <div>
+          <p class="eyebrow">Review context</p>
+          <h2 id="controls-title">Set the first-pass frame</h2>
+        </div>
+        <label>
+          Opportunity type
+          <select id="opportunity-type">
+            <option>Corporate venture investment</option>
+            <option>Commercial partnership</option>
+            <option>Minority investment</option>
+            <option>Acquisition screen</option>
+          </select>
+        </label>
+        <label>
+          Review stage
+          <select id="review-stage">
+            <option>Inbound triage</option>
+            <option>Before first management call</option>
+            <option>Before data-room request</option>
+            <option>Handoff to specialist diligence</option>
+          </select>
+        </label>
+        <label>
+          Internal sponsor or owner
+          <input id="review-owner" placeholder="Optional; stored only in this tab" />
+        </label>
+      </section>
+
+      <section class="workspace" aria-labelledby="workspace-title">
+        <div class="workspace-heading">
+          <div>
+            <p class="eyebrow">12 connected checkpoints</p>
+            <h2 id="workspace-title">Evidence agenda</h2>
+          </div>
+          <div class="actions">
+            <button id="load-example" type="button" class="secondary">
+              Load fictional example
+            </button>
+            <button id="clear" type="button">Clear</button>
+            <button id="export-csv" type="button" class="primary">
+              Download CSV
+            </button>
+          </div>
+        </div>
+
+        <div class="table-wrap">
+          <table>
+            <thead>
+              <tr>
+                <th>Priority</th>
+                <th>Dimension</th>
+                <th>Checkpoint</th>
+                <th>Evidence state</th>
+                <th>Evidence reviewed or needed</th>
+                <th>Owner</th>
+                <th>Next question or action</th>
+                <th>Review note</th>
+              </tr>
+            </thead>
+            <tbody id="checkpoint-rows"></tbody>
+          </table>
+        </div>
+        <p id="status-message" class="status" role="status" aria-live="polite"></p>
+      </section>
+
+      <section class="method" aria-labelledby="method-title">
+        <h2 id="method-title">Use the worksheet as a handoff, not a verdict</h2>
+        <p>
+          Select no more than five decision-changing items for the next call or
+          evidence request. “Supported” means the source behind a claim is
+          identifiable; it does not mean the claim is favourable. “Conflicted”
+          means the next step should resolve a discrepancy, not that the company
+          has failed diligence.
+        </p>
+      </section>
+
+      <footer>
+        <p>
+          This open worksheet is maintained by
+          <a
+            href="https://www.ddscore.ai/for-investor/?utm_source=hugging-face-space&amp;utm_medium=referral&amp;utm_campaign=ddscore-30d-jul-2026&amp;utm_content=pre-data-room-triage-planner-a"
+            rel="noopener noreferrer"
+            >DDScore.ai</a
+          >, a Finnish product that structures private-company materials into a
+          0–100 Due Diligence Score and written report across 12 dimensions.
+          DDScore supports judgement and full due diligence rather than
+          replacing either.
+        </p>
+        <p>Template and fictional example: CC BY 4.0.</p>
+      </footer>
+    </main>
+    <script src="app.js"></script>
+  </body>
 </html>

styles.css

@@ -0,0 +1,278 @@
+:root {
+  color-scheme: light;
+  font-family:
+    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
+    sans-serif;
+  color: #17211d;
+  background: #f4f7f5;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  margin: 0;
+}
+
+main {
+  width: min(1500px, calc(100% - 32px));
+  margin: 0 auto;
+  padding: 48px 0 32px;
+}
+
+h1,
+h2,
+p {
+  margin-top: 0;
+}
+
+h1 {
+  max-width: 980px;
+  margin-bottom: 18px;
+  font-size: clamp(2.5rem, 6vw, 5.8rem);
+  line-height: 0.98;
+  letter-spacing: -0.055em;
+}
+
+h2 {
+  margin-bottom: 12px;
+  font-size: 1.45rem;
+}
+
+.intro,
+.controls,
+.workspace,
+.method,
+footer {
+  border: 1px solid #d4ded8;
+  background: #fff;
+  box-shadow: 0 12px 30px rgb(24 45 35 / 6%);
+}
+
+.intro {
+  padding: clamp(28px, 5vw, 72px);
+  border-radius: 24px 24px 0 0;
+  background:
+    radial-gradient(circle at 92% 4%, rgb(68 115 255 / 20%), transparent 34%),
+    radial-gradient(circle at 72% 100%, rgb(28 154 100 / 13%), transparent 38%),
+    #fff;
+}
+
+.eyebrow {
+  margin-bottom: 9px;
+  color: #245f49;
+  font-size: 0.76rem;
+  font-weight: 800;
+  letter-spacing: 0.12em;
+  text-transform: uppercase;
+}
+
+.lede {
+  max-width: 900px;
+  color: #4d5f56;
+  font-size: clamp(1.05rem, 2vw, 1.28rem);
+  line-height: 1.65;
+}
+
+.guardrails {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  margin-top: 24px;
+}
+
+.guardrails span {
+  border: 1px solid #bfd3c8;
+  border-radius: 999px;
+  padding: 7px 11px;
+  color: #245f49;
+  background: #eff8f3;
+  font-size: 0.83rem;
+  font-weight: 750;
+}
+
+.controls {
+  display: grid;
+  grid-template-columns: 1.2fr repeat(3, minmax(180px, 1fr));
+  gap: 22px;
+  align-items: end;
+  padding: 28px clamp(24px, 4vw, 52px);
+}
+
+label {
+  display: grid;
+  gap: 8px;
+  color: #3f5048;
+  font-size: 0.78rem;
+  font-weight: 800;
+  letter-spacing: 0.03em;
+  text-transform: uppercase;
+}
+
+.workspace {
+  padding: 28px 0 16px;
+  overflow: hidden;
+}
+
+.workspace-heading {
+  display: flex;
+  align-items: end;
+  justify-content: space-between;
+  gap: 24px;
+  padding: 0 28px 20px;
+}
+
+.workspace-heading h2 {
+  margin-bottom: 0;
+}
+
+.actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+}
+
+button {
+  border: 1px solid #b8c8bf;
+  border-radius: 9px;
+  padding: 10px 14px;
+  color: #17211d;
+  background: #fff;
+  font: inherit;
+  font-weight: 750;
+  cursor: pointer;
+}
+
+button:hover,
+button:focus-visible {
+  border-color: #245f49;
+  outline: 3px solid rgb(36 95 73 / 16%);
+}
+
+button.primary {
+  border-color: #245f49;
+  color: #fff;
+  background: #245f49;
+}
+
+button.secondary {
+  color: #2b438f;
+  background: #eef2ff;
+}
+
+.table-wrap {
+  overflow-x: auto;
+  border-top: 1px solid #d4ded8;
+  border-bottom: 1px solid #d4ded8;
+}
+
+table {
+  width: 100%;
+  min-width: 1420px;
+  border-collapse: collapse;
+}
+
+th,
+td {
+  border-right: 1px solid #d4ded8;
+  border-bottom: 1px solid #e6ece8;
+  padding: 10px;
+  text-align: left;
+  vertical-align: top;
+}
+
+th {
+  color: #405047;
+  background: #f0f4f1;
+  font-size: 0.72rem;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+}
+
+td:nth-child(1) {
+  width: 78px;
+}
+
+td:nth-child(2) {
+  width: 140px;
+  color: #245f49;
+  font-weight: 800;
+}
+
+td:nth-child(3) {
+  width: 210px;
+  font-weight: 700;
+}
+
+input,
+textarea,
+select {
+  width: 100%;
+  border: 1px solid #c9d4ce;
+  border-radius: 7px;
+  padding: 9px;
+  color: #17211d;
+  background: #fff;
+  font: inherit;
+}
+
+textarea {
+  min-height: 86px;
+  resize: vertical;
+}
+
+input:focus,
+textarea:focus,
+select:focus {
+  border-color: #245f49;
+  outline: 3px solid rgb(36 95 73 / 14%);
+}
+
+.status {
+  min-height: 24px;
+  margin: 12px 28px 0;
+  color: #245f49;
+  font-weight: 750;
+}
+
+.method,
+footer {
+  padding: 28px clamp(24px, 4vw, 52px);
+}
+
+.method p,
+footer p {
+  max-width: 980px;
+  color: #4d5f56;
+  line-height: 1.65;
+}
+
+footer {
+  border-radius: 0 0 24px 24px;
+}
+
+footer p:last-child {
+  margin-bottom: 0;
+}
+
+a {
+  color: #2b438f;
+  font-weight: 750;
+}
+
+@media (max-width: 980px) {
+  main {
+    width: min(100% - 18px, 1500px);
+    padding-top: 10px;
+  }
+
+  .controls {
+    grid-template-columns: 1fr;
+  }
+
+  .workspace-heading {
+    align-items: flex-start;
+    flex-direction: column;
+  }
+}