yadflow 2.8.0 → 2.10.0

package/CHANGELOG.md

@@ -1,9 +1,9 @@
-# [2.8.0](https://github.com/abdelrahmannasr/yadflow/compare/v2.7.0...v2.8.0) (2026-06-15)
+# [2.10.0](https://github.com/abdelrahmannasr/yadflow/compare/v2.9.0...v2.10.0) (2026-06-15)
 
 
 ### Features
 
-* add `yad roster` command to manage the reviewer roster any time ([#64](https://github.com/abdelrahmannasr/yadflow/issues/64)) ([4d78225](https://github.com/abdelrahmannasr/yadflow/commit/4d78225ec25579b50d24d917f217212f4820728f))
+* **checks:** cap jest/vitest test workers in connected-repo CI gates ([#66](https://github.com/abdelrahmannasr/yadflow/issues/66)) ([7a16d51](https://github.com/abdelrahmannasr/yadflow/commit/7a16d51eb135c3240d3e94012f844c8b74210bd9))
 
 # [2.2.0](https://github.com/abdelrahmannasr/yadflow/compare/v2.1.0...v2.2.0) (2026-06-14)
 

package/cli/platform.mjs

@@ -89,7 +89,7 @@ export function validateLogin(platform, login) {
   const r = run('glab', ['api', `users?username=${encodeURIComponent(login)}`]);
   if (!r.ok) return { ok: false, exists: false, checked: true };
   let exists = false;
-  try { exists = Array.isArray(JSON.parse(r.stdout)) && JSON.parse(r.stdout).length > 0; } catch { exists = false; }
+  try { exists = Array.isArray(JSON.parse(r.stdout)) && JSON.parse(r.stdout).length > 0; } catch { /* malformed JSON -> exists stays false */ }
   return { ok: exists, exists, checked: true };
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "yadflow",
-  "version": "2.8.0",
+  "version": "2.10.0",
   "description": "Yadflow — the gated, team, multi-repo SDLC: author → review → build with a PR-driven review gate and a zero-dependency `yad` CLI (setup, gate, commit, open-pr, ship, repo). A BMAD module + 29 yad-* skills.",
   "type": "module",
   "author": "AbdelRahman Nasr",
@@ -56,7 +56,7 @@
   "devDependencies": {
     "@eslint/js": "^10.0.1",
     "@semantic-release/changelog": "^6.0.3",
-    "eslint": "^9.39.4",
+    "eslint": "^10.5.0",
     "semantic-release": "^25.0.3"
   }
 }

package/skills/yad-checks/SKILL.md

@@ -16,6 +16,8 @@ in CI on every PR/MR and must pass before merge (build plan §C). Each is a smal
    contract upstream, it **FAILS and routes back to the architecture gate**. The shared surface is
    never widened from inside a code repo (Phase 2 contract representation: delimited block + SHA-256 lock).
 3. **build/test/lint** — standard quality stage; tests must actually exercise new behavior, not just pass.
+   The CI job sets `YAD_TEST_MAX_WORKERS` (default `2`); the gate caps jest/vitest test concurrency at
+   that and is a no-op for other runners (see `references/check-gates.md`).
 4. **verified-commits** — no unverified commits from unverified users: every commit in the range must
    carry a signature the platform marks **Verified** AND be authored by a known identity
    (`.sdlc/verified-authors`, generated from the hub roster's `email` fields). Enforced on the

package/skills/yad-checks/references/check-gates.md

@@ -46,6 +46,11 @@ repo uses. Each reads conventions established by earlier steps — it invents no
 - Runs `npm run lint`, `npm run build`, `npm test` in order; any non-zero exit fails the gate.
 - Tests must actually exercise behavior (build plan §C) — an empty or trivially-passing suite does not
   satisfy the gate's intent.
+- **Test worker cap.** When the CI job sets `YAD_TEST_MAX_WORKERS` (the templates default it to `2`)
+  and the repo's `test` script is jest/vitest, the gate forwards `--maxWorkers=<n>` to bound CI
+  concurrency. For any other runner (`node --test`, mocha, …) it is a no-op — the flag is never
+  passed, so the gate cannot break on an unknown option. Override it per repo via the
+  `YAD_TEST_MAX_WORKERS` CI variable, or unset it to remove the cap.
 
 ### Canonical `package.json` scripts (Node demo)
 

package/skills/yad-checks/templates/checks/build-test-lint.sh

@@ -8,7 +8,19 @@ echo "[build/test/lint] lint…"
 npm run --silent lint
 echo "[build/test/lint] build…"
 npm run --silent build
+
+# Worker cap: when YAD_TEST_MAX_WORKERS is set AND the repo's test script is jest/vitest (the
+# runners that accept --maxWorkers), forward it to bound CI test concurrency. For any other runner
+# (node --test, mocha, …) it is a deliberate no-op so the gate never breaks on an unknown flag.
+extra=""
+if [ -n "${YAD_TEST_MAX_WORKERS:-}" ]; then
+  case "$(npm pkg get scripts.test 2>/dev/null || true)" in
+    *jest*|*vitest*) extra="-- --maxWorkers=${YAD_TEST_MAX_WORKERS}" ;;
+  esac
+fi
 echo "[build/test/lint] test…"
-npm run --silent test
+# Intentional word-splitting: $extra is either empty or `-- --maxWorkers=N`.
+# shellcheck disable=SC2086
+npm run --silent test $extra
 
 echo "PASS [build/test/lint]: lint, build, and tests all green."

package/skills/yad-checks/templates/github/yad-checks.yml

@@ -25,6 +25,8 @@ jobs:
 
   build-test-lint:
     runs-on: ubuntu-latest
+    env:
+      YAD_TEST_MAX_WORKERS: "2" # cap jest/vitest test workers in CI; ignored by other runners
     steps:
       - uses: actions/checkout@v4
         with: { fetch-depth: 0 }

package/skills/yad-checks/templates/gitlab/yad-checks.gitlab-ci.yml

@@ -42,6 +42,8 @@ yad-contract-check:
 yad-build-test-lint:
   extends: .sdlc_mr_only
   needs: []
+  variables:
+    YAD_TEST_MAX_WORKERS: "2" # cap jest/vitest test workers in CI; ignored by other runners
   script:
     - bash checks/build-test-lint.sh
 

package/skills/yad-docs/references/data-mapping.md

@@ -15,6 +15,28 @@ shell renders whatever these export, as long as it satisfies `src/data/types.ts`
 | `docSections.ts` | `DOC_SECTIONS: DocSectionConfig[]` | `epic.md`, `architecture.md`, `contract.md`, `ui-design.md`, `test-cases.md` | the ordered doc-section registry (`{ id, title, icon, iconColor, component }`); each section id is referenced from `roles.ts`. |
 | `referenceData.ts` | the reference tables/payloads the doc-section components render | `contract.md` CONTRACT-SURFACE (authoritative) + `architecture.md` + `test-cases.md` | API reference rows, the status machine, the DB schema, feature flags, error codes, the test plan — the structured data behind the doc sections. |
 
+## Canvas layout (`components.ts` `position`)
+
+`position` is `{ x, y }` in 0–100 (percent of the canvas). Lay the components out as a **hub-and-spoke
+organized around a central hub into four surrounding zones** so the spokes fan out without crossing,
+rather than scattering nodes:
+
+- **Center** — the product hub (the brain).
+- **Top band** — the file ledger the hub owns (state / approvals / contract-lock), spread across one row.
+- **Left** — the code side: each connector with its external target just beyond it (`repos-json → code-repos`).
+- **Right** — the connected tools as a single aligned column: each connector on the inner edge with its
+  external tool on the same row just outside it (`design-json → Design Tool`, etc.).
+- **Bottom band** — publish / platform / evidence (docs / platform / trust-log).
+
+Layout constraints (the nodes are fixed-size cards, ~116×146px, so spacing is what prevents overlap):
+- Only **~4 rows** fit vertically — keep row centers **≥23% apart**; same-row neighbours **≥18% apart** in x.
+- Keep all nodes inside ~6–94% on each axis so no card clips the canvas edge (tool column ≤ ~88% x,
+  bottom band ≤ ~80% y).
+- Keep `label`s short (e.g. `Git Platform`, not `Platform (GitHub/GitLab)`) — a long label widens the
+  card and breaks the spacing.
+- The layout is **deterministic**: assign zones by role (ledger / code / tools / platform+evidence) and
+  order within a zone by stable id, so an unchanged architecture regenerates byte-identically.
+
 ## Section sources (the doc sections + their artifact)
 
 | Doc section(s) | Artifact source |

package/skills/yad-docs/templates/app/index.html

@@ -2,7 +2,7 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <link rel="icon" type="image/png" href="/yadflow-icon.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Booking Flow Visualizer</title>
     <link rel="preconnect" href="https://fonts.googleapis.com" />

package/skills/yad-docs/templates/app/src/App.tsx

@@ -12,10 +12,8 @@ import { SystemLogsTerminal } from './components/Logs/SystemLogsTerminal';
 import { SubPathDetailPage } from './pages/SubPathDetailPage';
 import { RoleSelectPage } from './pages/RoleSelectPage';
 import { StakeholderDocPage } from './pages/StakeholderDocPage';
-import { LoginPage } from './components/Auth/LoginPage';
 import { usePlayback } from './hooks/usePlayback';
 import { useFlowStore } from './store/useFlowStore';
-import { useAuthStore } from './store/useAuthStore';
 
 function Dashboard() {
   usePlayback();
@@ -74,12 +72,6 @@ function Dashboard() {
 }
 
 function App() {
-  const isAuthenticated = useAuthStore((s) => s.isAuthenticated);
-
-  if (!isAuthenticated) {
-    return <LoginPage />;
-  }
-
   return (
     <div className="flex flex-col h-screen w-screen overflow-hidden" style={{ background: 'var(--color-bg-primary)' }}>
       <TopNavBar />

package/skills/yad-docs/templates/app/src/components/Canvas/SystemComponent.tsx

@@ -52,8 +52,8 @@ export const SystemComponent: React.FC<SystemComponentProps> = React.memo(
               : 'rgba(47, 41, 56, 0.4)',
             backdropFilter: 'blur(12px)',
             ...glowStyle,
-            minWidth: '130px',
-            minHeight: '140px',
+            minWidth: '116px',
+            minHeight: '120px',
           }}
           animate={
             isReceiving

package/skills/yad-docs/templates/app/src/components/DetailPanel/RightPanel.tsx

@@ -6,6 +6,7 @@ import { TriggerEventCard } from './TriggerEventCard';
 import { RequestPayloadPreview } from './RequestPayloadPreview';
 import { HandlerLogicSnippet } from './HandlerLogicSnippet';
 import { Icon } from '../shared/Icon';
+import { Tooltip } from '../shared/Tooltip';
 
 export function RightPanel() {
   const getCurrentStep = useFlowStore((s) => s.getCurrentStep);
@@ -68,19 +69,19 @@ export function RightPanel() {
             <Icon name="open_in_new" size={18} />
             View Full Path Details
           </button>
-          <button
-            onClick={() => console.log('Debug step:', step)}
-            className="w-full py-2.5 rounded-lg text-slate-300 text-sm font-medium border transition-colors flex items-center justify-center gap-2"
-            style={{
-              background: 'rgba(255,255,255,0.05)',
-              borderColor: 'rgba(255,255,255,0.05)',
-            }}
-            onMouseEnter={(e) => e.currentTarget.style.background = 'rgba(255,255,255,0.1)'}
-            onMouseLeave={(e) => e.currentTarget.style.background = 'rgba(255,255,255,0.05)'}
-          >
-            <Icon name="bug_report" size={18} />
-            Debug Step
-          </button>
+          <Tooltip content="Coming soon" className="w-full">
+            <button
+              disabled
+              className="w-full py-2.5 rounded-lg text-slate-300 text-sm font-medium border flex items-center justify-center gap-2 opacity-50 cursor-not-allowed"
+              style={{
+                background: 'rgba(255,255,255,0.05)',
+                borderColor: 'rgba(255,255,255,0.05)',
+              }}
+            >
+              <Icon name="bug_report" size={18} />
+              Debug Step
+            </button>
+          </Tooltip>
         </div>
       )}
     </aside>

package/skills/yad-docs/templates/app/src/components/Navigation/TopNavBar.tsx

@@ -1,13 +1,12 @@
 import { useNavigate } from 'react-router-dom';
 import { Icon } from '../shared/Icon';
+import { Tooltip } from '../shared/Tooltip';
 import { useFlowStore } from '../../store/useFlowStore';
-import { useAuthStore } from '../../store/useAuthStore';
 
 export function TopNavBar() {
   const navigate = useNavigate();
   const toggleReferencePanel = useFlowStore((s) => s.toggleReferencePanel);
   const toggleCommandPalette = useFlowStore((s) => s.toggleCommandPalette);
-  const logout = useAuthStore((s) => s.logout);
 
   return (
     <header className="flex-none flex items-center justify-between whitespace-nowrap border-b px-6 py-3 z-20"
@@ -17,8 +16,9 @@ export function TopNavBar() {
       }}
     >
       <div className="flex items-center gap-8">
-        <div className="flex items-center gap-3 text-white">
-          <img src="/logo.svg" alt="Logo" className="h-8" />
+        <div className="flex items-center gap-2 text-white">
+          <img src={`${import.meta.env.BASE_URL}yadflow-icon.png`} alt="yadflow" className="h-9 w-9 object-contain" />
+          <span className="text-lg font-bold font-display text-white tracking-tight">yadflow</span>
         </div>
         <button
           onClick={toggleCommandPalette}
@@ -58,31 +58,15 @@ export function TopNavBar() {
             <Icon name="description" size={18} className="mr-2" />
             Docs
           </button>
-          <button
-            className="flex items-center justify-center px-4 py-2 rounded-full text-slate-300 text-sm font-medium transition-colors"
-            onMouseEnter={(e) => e.currentTarget.style.background = 'var(--color-surface-highlight)'}
-            onMouseLeave={(e) => e.currentTarget.style.background = 'transparent'}
-          >
-            <Icon name="settings" size={18} className="mr-2" />
-            Settings
-          </button>
-        </div>
-        <div className="h-6 w-px mx-2" style={{ background: 'var(--color-surface-highlight)' }} />
-        <div className="flex items-center gap-3">
-          <div className="text-right hidden sm:block">
-            <p className="text-sm font-medium text-white">AbdelRahman Nasr</p>
-            <p className="text-xs text-slate-400">Admin</p>
-          </div>
-          <button
-            onClick={logout}
-            title="Sign out"
-            className="h-10 w-10 rounded-full ring-2 ring-[#2f2938] flex items-center justify-center cursor-pointer transition-opacity hover:opacity-80"
-            style={{
-              background: 'linear-gradient(135deg, var(--color-primary) 0%, #a855f7 100%)',
-            }}
-          >
-            <Icon name="logout" size={20} className="text-white" />
-          </button>
+          <Tooltip content="Coming soon">
+            <button
+              disabled
+              className="flex items-center justify-center px-4 py-2 rounded-full text-slate-300 text-sm font-medium opacity-50 cursor-not-allowed"
+            >
+              <Icon name="settings" size={18} className="mr-2" />
+              Settings
+            </button>
+          </Tooltip>
         </div>
       </div>
     </header>

package/skills/yad-docs/templates/app/src/components/Reference/RulesLegendPanel.tsx

@@ -1,6 +1,7 @@
 import { motion, AnimatePresence } from 'framer-motion';
 import { useFlowStore } from '../../store/useFlowStore';
 import { Icon } from '../shared/Icon';
+import { Tooltip } from '../shared/Tooltip';
 import { MESSAGE_COLORS } from '../../data/types';
 import { MESSAGE_TYPE_ICONS } from '../../utils/iconMap';
 import { StakeholderToggle } from './StakeholderToggle';
@@ -197,17 +198,21 @@ export function RulesLegendPanel() {
                 background: 'var(--color-surface-dark)',
               }}
             >
-              <button className="flex-1 py-3 px-4 rounded-lg text-white text-sm font-bold transition-colors flex items-center justify-center gap-2"
-                style={{ background: 'var(--color-primary)' }}
-              >
-                <Icon name="download" size={18} />
-                Export Rules PDF
-              </button>
-              <button className="p-3 rounded-lg text-slate-300 transition-colors"
-                style={{ background: 'rgba(255,255,255,0.05)' }}
-              >
-                <Icon name="settings" size={20} />
-              </button>
+              <Tooltip content="Coming soon" className="flex-1">
+                <button disabled className="w-full py-3 px-4 rounded-lg text-white text-sm font-bold flex items-center justify-center gap-2 opacity-50 cursor-not-allowed"
+                  style={{ background: 'var(--color-primary)' }}
+                >
+                  <Icon name="download" size={18} />
+                  Export Rules PDF
+                </button>
+              </Tooltip>
+              <Tooltip content="Coming soon">
+                <button disabled className="p-3 rounded-lg text-slate-300 opacity-50 cursor-not-allowed"
+                  style={{ background: 'rgba(255,255,255,0.05)' }}
+                >
+                  <Icon name="settings" size={20} />
+                </button>
+              </Tooltip>
             </div>
           </motion.div>
         </>

package/skills/yad-docs/templates/app/src/components/Sidebar/PathSelector.tsx

@@ -5,6 +5,7 @@ import { useFlowStore } from '../../store/useFlowStore';
 import { PATHS } from '../../data/paths';
 import type { PathCategory } from '../../data/types';
 import { Icon } from '../shared/Icon';
+import { Tooltip } from '../shared/Tooltip';
 import { CATEGORY_ICONS } from '../../utils/iconMap';
 
 const CATEGORY_LABELS: Record<PathCategory, string> = {
@@ -51,9 +52,11 @@ export const PathSelector = () => {
         <h3 className="text-slate-100 text-sm font-bold font-display uppercase tracking-wider">
           Path Selection
         </h3>
-        <button className="text-xs font-medium" style={{ color: 'var(--color-primary)' }}>
-          View All
-        </button>
+        <Tooltip content="Coming soon">
+          <button disabled className="text-xs font-medium opacity-50 cursor-not-allowed" style={{ color: 'var(--color-primary)' }}>
+            View All
+          </button>
+        </Tooltip>
       </div>
 
       {/* Search */}

package/skills/yad-docs/templates/app/src/components/shared/Tooltip.tsx

@@ -4,14 +4,15 @@ import { motion, AnimatePresence } from "framer-motion";
 interface TooltipProps {
   content: string;
   children: React.ReactNode;
+  className?: string;
 }
 
-export const Tooltip: React.FC<TooltipProps> = ({ content, children }) => {
+export const Tooltip: React.FC<TooltipProps> = ({ content, children, className = "" }) => {
   const [show, setShow] = useState(false);
 
   return (
     <div
-      className="relative inline-block"
+      className={`relative inline-block ${className}`}
       onMouseEnter={() => setShow(true)}
       onMouseLeave={() => setShow(false)}
       onFocus={() => setShow(true)}

package/skills/yad-docs/templates/app/src/components/Auth/LoginPage.tsx

@@ -1,101 +0,0 @@
-import { useState } from 'react';
-import { useAuthStore } from '../../store/useAuthStore';
-
-export function LoginPage() {
-  const [username, setUsername] = useState('');
-  const [password, setPassword] = useState('');
-  const { login, error } = useAuthStore();
-
-  const handleSubmit = (e: React.FormEvent) => {
-    e.preventDefault();
-    login(username, password);
-  };
-
-  return (
-    <div
-      className="h-screen w-screen flex items-center justify-center"
-      style={{ background: 'var(--color-bg-primary)' }}
-    >
-      <div
-        className="w-full max-w-md rounded-2xl p-10 shadow-2xl"
-        style={{
-          background: 'var(--color-bg-secondary)',
-          border: '1px solid var(--color-border-default)',
-        }}
-      >
-        {/* Logo */}
-        <div className="flex justify-center mb-6">
-          <img src="/logo.svg" alt="Logo" className="h-14" />
-        </div>
-
-        {/* Title */}
-        <h1 className="text-center text-xl font-bold text-white mb-1">
-          Booking Flow Documentation
-        </h1>
-        <p className="text-center text-sm mb-8" style={{ color: 'var(--color-text-muted)' }}>
-          Sign in to access the documentation
-        </p>
-
-        <form onSubmit={handleSubmit} className="space-y-5">
-          {/* Username */}
-          <div>
-            <label className="block text-sm font-semibold text-white mb-2">
-              Username
-            </label>
-            <input
-              type="text"
-              value={username}
-              onChange={(e) => setUsername(e.target.value)}
-              placeholder="Enter your username"
-              className="w-full px-4 py-3 rounded-lg text-sm text-white placeholder-slate-500 border outline-none transition-colors focus:border-[var(--color-primary)]"
-              style={{
-                background: 'var(--color-surface-highlight)',
-                borderColor: 'var(--color-border-default)',
-              }}
-              autoFocus
-            />
-          </div>
-
-          {/* Password */}
-          <div>
-            <label className="block text-sm font-semibold text-white mb-2">
-              Password
-            </label>
-            <input
-              type="password"
-              value={password}
-              onChange={(e) => setPassword(e.target.value)}
-              placeholder="Enter your password"
-              className="w-full px-4 py-3 rounded-lg text-sm text-white placeholder-slate-500 border outline-none transition-colors focus:border-[var(--color-primary)]"
-              style={{
-                background: 'var(--color-surface-highlight)',
-                borderColor: 'var(--color-border-default)',
-              }}
-            />
-          </div>
-
-          {/* Error */}
-          {error && (
-            <p className="text-sm text-red-400 text-center">{error}</p>
-          )}
-
-          {/* Submit */}
-          <button
-            type="submit"
-            className="w-full py-3 rounded-xl text-white font-semibold text-sm transition-all hover:opacity-90 cursor-pointer"
-            style={{
-              background: 'var(--color-primary)',
-              boxShadow: '0 4px 20px rgba(97, 22, 218, 0.4)',
-            }}
-          >
-            Sign In
-          </button>
-        </form>
-
-        <p className="text-center text-xs mt-6" style={{ color: 'var(--color-text-muted)' }}>
-          Booking flow documentation portal
-        </p>
-      </div>
-    </div>
-  );
-}

package/skills/yad-docs/templates/app/src/store/useAuthStore.ts

@@ -1,42 +0,0 @@
-import { create } from 'zustand';
-
-// Login gate — presentational ONLY, never a security control (real access control is the
-// repo / Pages ACL). `yad docs` sets DOCS_REQUIRE_LOGIN to `false` by default for public docs;
-// teams publishing to a private Pages site can flip it to `true` (login_gate: true) and set
-// credentials via the Vite env vars VITE_DOCS_USER / VITE_DOCS_PASS at build time.
-const DOCS_REQUIRE_LOGIN = false;
-const CREDENTIALS = {
-  username: import.meta.env.VITE_DOCS_USER ?? 'docs',
-  password: import.meta.env.VITE_DOCS_PASS ?? 'docs',
-};
-
-interface AuthStore {
-  isAuthenticated: boolean;
-  username: string | null;
-  error: string | null;
-  login: (username: string, password: string) => boolean;
-  logout: () => void;
-}
-
-export const useAuthStore = create<AuthStore>((set) => ({
-  isAuthenticated: !DOCS_REQUIRE_LOGIN || sessionStorage.getItem('auth') === 'true',
-  username: sessionStorage.getItem('auth_user'),
-  error: null,
-
-  login: (username, password) => {
-    if (username === CREDENTIALS.username && password === CREDENTIALS.password) {
-      sessionStorage.setItem('auth', 'true');
-      sessionStorage.setItem('auth_user', username);
-      set({ isAuthenticated: true, username, error: null });
-      return true;
-    }
-    set({ error: 'Invalid username or password' });
-    return false;
-  },
-
-  logout: () => {
-    sessionStorage.removeItem('auth');
-    sessionStorage.removeItem('auth_user');
-    set({ isAuthenticated: false, username: null, error: null });
-  },
-}));