tests: pin ink engine in _make_tui_argv npm-bootstrap tests (post-merge semantic fix)

Main's rewritten test_tui_npm_install.py tests call _make_tui_argv expecting
the Ink/npm flow unconditionally; with the dual-engine dispatch merged in,
_resolve_tui_engine() auto-selects opentui whenever ui-opentui/dist is built
in the repo, routing the call away from the path under test (first subprocess
became 'node --version' instead of 'npm run build'). Pin the engine to ink
via an autouse fixture, mirroring the existing pinning precedent in
test_tui_resume_flow.py.

website/src/components/AutomationBlueprintsCatalog/index.tsx

@@ -0,0 +1,117 @@
+import React, { useEffect, useState } from "react";
+import styles from "./styles.module.css";
+
+interface BlueprintField {
+  name: string;
+  type: string;
+  label: string;
+  default: string | null;
+  options: string[];
+  optional: boolean;
+  help: string;
+}
+
+interface Blueprint {
+  key: string;
+  title: string;
+  description: string;
+  category: string;
+  tags: string[];
+  fields: BlueprintField[];
+  scheduleHuman: string;
+  command: string;
+  appUrl: string;
+}
+
+const INDEX_URL = "/docs/api/automation-blueprints-index.json";
+
+function CopyButton({ text }: { text: string }): JSX.Element {
+  const [copied, setCopied] = useState(false);
+  return (
+    <button
+      type="button"
+      className={styles.copyBtn}
+      onClick={() => {
+        navigator.clipboard.writeText(text).then(() => {
+          setCopied(true);
+          setTimeout(() => setCopied(false), 1500);
+        });
+      }}
+      aria-label="Copy command"
+    >
+      {copied ? "Copied" : "Copy"}
+    </button>
+  );
+}
+
+function BlueprintCard({ blueprint }: { blueprint: Blueprint }): JSX.Element {
+  return (
+    <div className={styles.card}>
+      <div className={styles.cardHead}>
+        <h3 className={styles.title}>{blueprint.title}</h3>
+        <span className={styles.schedule}>{blueprint.scheduleHuman}</span>
+      </div>
+      <p className={styles.desc}>{blueprint.description}</p>
+
+      <div className={styles.tags}>
+        {blueprint.tags.map((t) => (
+          <span key={t} className={styles.tag}>
+            {t}
+          </span>
+        ))}
+      </div>
+
+      <div className={styles.cmdRow}>
+        <code className={styles.cmd}>{blueprint.command}</code>
+        <CopyButton text={blueprint.command} />
+      </div>
+
+      <div className={styles.actions}>
+        <a className={styles.appBtn} href={blueprint.appUrl}>
+          Send to App ↗
+        </a>
+        <span className={styles.hint}>
+          or paste the command into the CLI, TUI, or any messenger
+        </span>
+      </div>
+    </div>
+  );
+}
+
+export default function AutomationBlueprintsCatalog(): JSX.Element {
+  const [blueprints, setBlueprints] = useState<Blueprint[] | null>(null);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    let cancelled = false;
+    fetch(INDEX_URL)
+      .then((r) => r.json())
+      .then((data: Blueprint[]) => {
+        if (!cancelled) setBlueprints(data);
+      })
+      .catch((e) => {
+        if (!cancelled) setError(String(e));
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+
+  if (error) {
+    return <p>Couldn't load the blueprint catalog: {error}</p>;
+  }
+  if (blueprints === null) {
+    return <p>Loading blueprints…</p>;
+  }
+  if (blueprints.length === 0) {
+    return <p>No automation blueprints are available.</p>;
+  }
+
+  return (
+    <div className={styles.grid}>
+      {blueprints.map((r) => (
+        <BlueprintCard key={r.key} blueprint={r} />
+      ))}
+    </div>
+  );
+}

website/src/components/AutomationBlueprintsCatalog/styles.module.css

@@ -0,0 +1,114 @@
+.grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
+  gap: 1rem;
+  margin: 1.5rem 0;
+}
+
+.card {
+  border: 1px solid var(--ifm-color-emphasis-300);
+  border-radius: 10px;
+  padding: 1.1rem 1.2rem;
+  background: var(--ifm-card-background-color, var(--ifm-background-surface-color));
+  display: flex;
+  flex-direction: column;
+  gap: 0.65rem;
+}
+
+.cardHead {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  gap: 0.75rem;
+}
+
+.title {
+  margin: 0;
+  font-size: 1.1rem;
+}
+
+.schedule {
+  font-size: 0.8rem;
+  color: var(--ifm-color-emphasis-700);
+  white-space: nowrap;
+}
+
+.desc {
+  margin: 0;
+  color: var(--ifm-color-emphasis-800);
+  font-size: 0.92rem;
+}
+
+.tags {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem;
+}
+
+.tag {
+  font-size: 0.72rem;
+  padding: 0.1rem 0.5rem;
+  border-radius: 999px;
+  background: var(--ifm-color-emphasis-200);
+  color: var(--ifm-color-emphasis-800);
+}
+
+.cmdRow {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.cmd {
+  flex: 1;
+  overflow-x: auto;
+  white-space: nowrap;
+  padding: 0.45rem 0.6rem;
+  font-size: 0.82rem;
+  border-radius: 6px;
+  background: var(--ifm-color-emphasis-100);
+}
+
+.copyBtn {
+  flex-shrink: 0;
+  border: 1px solid var(--ifm-color-emphasis-300);
+  background: transparent;
+  color: var(--ifm-color-emphasis-800);
+  border-radius: 6px;
+  padding: 0.35rem 0.7rem;
+  font-size: 0.8rem;
+  cursor: pointer;
+}
+
+.copyBtn:hover {
+  background: var(--ifm-color-emphasis-200);
+}
+
+.actions {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+  flex-wrap: wrap;
+}
+
+.appBtn {
+  display: inline-block;
+  padding: 0.4rem 0.85rem;
+  border-radius: 6px;
+  background: var(--ifm-color-primary);
+  color: var(--ifm-color-primary-contrast-background, #fff);
+  font-size: 0.85rem;
+  font-weight: 600;
+  text-decoration: none;
+}
+
+.appBtn:hover {
+  background: var(--ifm-color-primary-dark);
+  text-decoration: none;
+  color: var(--ifm-color-primary-contrast-background, #fff);
+}
+
+.hint {
+  font-size: 0.78rem;
+  color: var(--ifm-color-emphasis-600);
+}