@qijenchen/design-system 0.1.0-beta.3 → 0.1.0-beta.32

package/ds-canonical/hooks/tests/test_check_field_controls_contracts.sh

@@ -0,0 +1,126 @@
+#!/bin/bash
+# Tests for check_field_controls_contracts.sh(Stream C 3-contract consolidated guardrail)
+#
+# Hook 規則:PostToolUse Edit/Write/MultiEdit + file 存在 disk → 檢 3 contracts:
+#   (a) Selected value renderer symmetry — Combobox/Select/PeoplePicker
+#   (b) Placeholder vocabulary — 所有 components/*.tsx
+#   (c) Cell metric escape hatches — Combobox/Select/PeoplePicker
+# 違反 → 印 JSON `{hookSpecificOutput: {hookEventName: "PostToolUse", additionalContext: "..."}}` to stdout (exit 0)。
+# Allow:檔首 3 行內加 `// @placeholder-vocabulary-allow:` / `@renderer-symmetry-allow:` / `@cell-metric-escape-allow:`。
+
+set -u
+
+SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
+HOOK="$SCRIPT_DIR/../check_field_controls_contracts.sh"
+
+if [ ! -x "$HOOK" ]; then
+  echo "FATAL: hook not executable: $HOOK"
+  exit 1
+fi
+
+TMP_ROOT=$(mktemp -d)
+trap 'rm -rf "$TMP_ROOT"' EXIT
+
+PASS=0
+FAIL=0
+FAILED_TESTS=""
+
+# Build a real fixture file under fake DS root
+make_fixture() {
+  local rel_path="$1"; local content="$2"
+  local full="$TMP_ROOT/$rel_path"
+  mkdir -p "$(dirname "$full")"
+  printf '%s' "$content" >"$full"
+  echo "$full"
+}
+
+run_hook() {
+  local file_path="$1"
+  local payload
+  payload=$(jq -n --arg fp "$file_path" \
+    '{tool_name: "Edit", hook_event_name: "PostToolUse", tool_input: {file_path: $fp, new_string: "n/a"}}')
+  STDOUT=$(mktemp); STDERR=$(mktemp)
+  set +e
+  printf '%s' "$payload" | bash "$HOOK" >"$STDOUT" 2>"$STDERR"
+  EXIT=$?
+  set -e
+  STDOUT_TEXT=$(cat "$STDOUT")
+  STDERR_TEXT=$(cat "$STDERR")
+  rm -f "$STDOUT" "$STDERR"
+}
+
+expect_pass_silent() {
+  local name="$1"
+  if [ "$EXIT" = "0" ] && [ -z "$STDOUT_TEXT" ]; then
+    echo "  PASS  $name"; PASS=$((PASS+1))
+  else
+    echo "  FAIL  $name (expected silent, exit=$EXIT)"
+    echo "  --- stdout ---"; echo "$STDOUT_TEXT" | sed 's/^/    /'; echo "  --- end ---"
+    FAIL=$((FAIL+1)); FAILED_TESTS="${FAILED_TESTS}\n  - $name"
+  fi
+}
+
+expect_violation() {
+  local name="$1"; local needle="$2"
+  if [ "$EXIT" = "0" ] && echo "$STDOUT_TEXT" | grep -qF "$needle"; then
+    echo "  PASS  $name"; PASS=$((PASS+1))
+  else
+    echo "  FAIL  $name (expected JSON ctx containing '$needle', got exit $EXIT)"
+    echo "  --- stdout ---"; echo "$STDOUT_TEXT" | sed 's/^/    /'; echo "  --- end ---"
+    FAIL=$((FAIL+1)); FAILED_TESTS="${FAILED_TESTS}\n  - $name"
+  fi
+}
+
+echo "=== check_field_controls_contracts tests ==="
+
+# 1. PreToolUse event (not PostToolUse) → skip
+F1=$(make_fixture "packages/design-system/src/components/Foo/foo.tsx" 'emptyPlaceholder={emptyText}')
+payload=$(jq -n --arg fp "$F1" '{tool_name: "Edit", hook_event_name: "PreToolUse", tool_input: {file_path: $fp, new_string: ""}}')
+STDOUT=$(mktemp); STDERR=$(mktemp)
+set +e
+printf '%s' "$payload" | bash "$HOOK" >"$STDOUT" 2>"$STDERR"
+EXIT=$?
+set -e
+STDOUT_TEXT=$(cat "$STDOUT"); STDERR_TEXT=$(cat "$STDERR")
+rm -f "$STDOUT" "$STDERR"
+expect_pass_silent "1. PreToolUse event → skip"
+
+# 2. File doesn't exist → skip
+run_hook "/nonexistent/path/foo.tsx"
+expect_pass_silent "2. nonexistent file → skip"
+
+# 3. Out-of-scope tsx (no contract trigger) → silent
+F3=$(make_fixture "packages/design-system/src/components/Button/button.tsx" '
+const Button = () => <button>OK</button>;
+')
+run_hook "$F3"
+expect_pass_silent "3. components/Button button.tsx no violations → silent"
+
+# 4. Contract (b) violation:emptyPlaceholder={emptyText} → violation
+F4=$(make_fixture "packages/design-system/src/components/Bar/bar.tsx" 'export const Bar = () => <X emptyPlaceholder={emptyText} />;')
+run_hook "$F4"
+expect_violation "4. contract (b) emptyPlaceholder={emptyText} → violation" "contract (b) placeholder vocabulary"
+
+# 5. Contract (b) with allow escape → silent
+F5=$(make_fixture "packages/design-system/src/components/Baz/baz.tsx" '// @placeholder-vocabulary-allow: legacy migration
+export const Baz = () => <X emptyPlaceholder={searchEmpty} />;')
+run_hook "$F5"
+expect_pass_silent "5. contract (b) with @placeholder-vocabulary-allow → silent"
+
+# 6. Contract (c) hardcoded tagAreaPaddingLeftPx={8} in Combobox → violation
+F6=$(make_fixture "packages/design-system/src/components/Combobox/combobox.tsx" 'export const Combobox = () => <Tags tagAreaPaddingLeftPx={8} />;')
+run_hook "$F6"
+expect_violation "6. contract (c) Combobox hardcoded tagAreaPaddingLeftPx → violation" "contract (c) cell metric escape hatch"
+
+# 7. Contract (b) noResults variant → violation
+F7=$(make_fixture "packages/design-system/src/components/Qux/qux.tsx" 'export const Qux = () => <X emptyPlaceholder={noResults} />;')
+run_hook "$F7"
+expect_violation "7. contract (b) emptyPlaceholder={noResults} → violation" "contract (b) placeholder vocabulary"
+
+echo ""
+echo "=== Summary ==="
+echo "Passed: $PASS / $((PASS + FAIL))"
+if [ "$FAIL" -gt 0 ]; then
+  echo "Failed:$FAILED_TESTS"
+  exit 1
+fi

package/ds-canonical/hooks/tests/test_check_field_family_invariants.sh

@@ -0,0 +1,194 @@
+#!/bin/bash
+# Tests for check_field_family_invariants.sh — merged 4 sub-rules(A.1-A.4)
+#
+# Coverage(每 sub-rule pass + block 各 1 case,共 12 case):
+#   A.1 naked row-mode propagation:pass / block / allowlist
+#   A.2 FieldControlGroup wrapper child:pass / block / allowlist
+#   A.3 Field state ring SSOT:pass / 3 block(shadow inset / outline / per-control open)
+#   A.4 disabled placeholder color:pass / 1 stderr-warn(exit 0)/ allowlist
+#   non-target:non-tsx skip / SSOT host skip(field-wrapper.tsx)
+
+set -u
+
+SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
+HOOK="$SCRIPT_DIR/../check_field_family_invariants.sh"
+[ -x "$HOOK" ] || { echo "FATAL: hook not executable: $HOOK"; exit 1; }
+
+PASS=0; FAIL=0; FAILED_TESTS=""
+
+run_hook() {
+  local file_path="$1" content="$2" tool="${3:-Write}"
+  local payload
+  payload=$(jq -n --arg tool "$tool" --arg fp "$file_path" --arg c "$content" \
+    '{tool_name: $tool, tool_input: {file_path: $fp, content: $c}}')
+  STDOUT=$(mktemp); STDERR=$(mktemp)
+  set +e
+  printf '%s' "$payload" | bash "$HOOK" >"$STDOUT" 2>"$STDERR"
+  EXIT=$?
+  set -e
+  STDOUT_TEXT=$(cat "$STDOUT"); STDERR_TEXT=$(cat "$STDERR")
+  rm -f "$STDOUT" "$STDERR"
+}
+
+expect_exit() {
+  local name="$1" expect="$2" needle="${3:-}"
+  if [ "$EXIT" = "$expect" ] && { [ -z "$needle" ] || echo "$STDERR_TEXT" | grep -qF "$needle"; }; then
+    echo "  PASS  $name"; PASS=$((PASS+1))
+  else
+    echo "  FAIL  $name (expected exit $expect${needle:+ + needle '$needle'}, got exit $EXIT)"
+    echo "  --- stderr ---"; echo "$STDERR_TEXT" | sed 's/^/    /'; echo "  --- end ---"
+    FAIL=$((FAIL+1)); FAILED_TESTS="${FAILED_TESTS}\n  - $name"
+  fi
+}
+
+echo "=== A.1 naked row-mode propagation ==="
+
+# 1. naked + items-center + nakedCellRowModeAlign import → pass
+run_hook "/r/packages/design-system/src/components/PeoplePicker/people-picker.tsx" '
+import { nakedCellRowModeAlign } from "@/design-system/components/Field/field-wrapper"
+function F() { return <div variant="naked" className="inline-flex items-center" /> }
+'
+expect_exit "A.1.1 naked + import → pass" 0
+
+# 2. naked + items-center + no SSOT → BLOCK
+run_hook "/r/packages/design-system/src/components/Bad/bad.tsx" '
+function F() { return <span variant="naked" className="inline-flex items-center" /> }
+'
+expect_exit "A.1.2 naked + no SSOT → BLOCK" 2 "naked row-mode propagation"
+
+# 3. allowlist → pass
+run_hook "/r/packages/design-system/src/components/Edge/edge.tsx" '
+// @naked-row-mode-allow: popover content
+function F() { return <span variant="naked" className="inline-flex items-center" /> }
+'
+expect_exit "A.1.3 allowlist → pass" 0
+
+# 4. SSOT host skip(field-wrapper.tsx)→ pass(自身 SSOT,不檢)
+run_hook "/r/packages/design-system/src/components/Field/field-wrapper.tsx" '
+function F() { return <span variant="naked" className="inline-flex items-center" /> }
+'
+expect_exit "A.1.4 SSOT host skip → pass" 0
+
+echo ""
+echo "=== A.2 FieldControlGroup wrapper direct child ==="
+
+# 5. <FieldControlGroup> 內 <div wrapper> → WARN(exit 1)
+run_hook "/r/packages/design-system/src/components/Filter/filter.tsx" '
+function F() { return (
+  <FieldControlGroup>
+    <div className="flex-1 min-w-0">
+      <FilterValuePicker />
+    </div>
+  </FieldControlGroup>
+)}
+'
+expect_exit "A.2.1 FCG with div wrapper → WARN" 1 "FieldControlGroup wrapper"
+
+# 6. <FieldControlGroup> 直接 child 沒 wrapper → pass
+run_hook "/r/packages/design-system/src/components/Filter/filter.tsx" '
+function F() { return (
+  <FieldControlGroup>
+    <FilterValuePicker className="flex-1 min-w-0" />
+  </FieldControlGroup>
+)}
+'
+expect_exit "A.2.2 FCG direct child → pass" 0
+
+# 7. allowlist → pass
+run_hook "/r/packages/design-system/src/components/Filter/filter.tsx" '
+// @fcg-wrapper-allow: legacy migration
+function F() { return (
+  <FieldControlGroup>
+    <div><FilterValuePicker /></div>
+  </FieldControlGroup>
+)}
+'
+expect_exit "A.2.3 FCG allowlist → pass" 0
+
+echo ""
+echo "=== A.3 Field state ring SSOT ==="
+
+# 8. shadow-[inset → BLOCK
+run_hook "/r/packages/design-system/src/components/Combobox/combobox.tsx" '
+const cls = "hover:shadow-[inset_0_0_0_1px_var(--border)]"
+'
+expect_exit "A.3.1 shadow-[inset → BLOCK" 2 "shadow inset"
+
+# 9. focus-within:outline-primary → BLOCK
+run_hook "/r/packages/design-system/src/components/Select/select.tsx" '
+const cls = "focus-within:outline-primary"
+'
+expect_exit "A.3.2 outline state ring → BLOCK" 2 "outline"
+
+# 10. open && border-primary → BLOCK
+run_hook "/r/packages/design-system/src/components/Select/select.tsx" "
+const cls = open && 'border-primary'
+"
+expect_exit "A.3.3 per-control open=blue → BLOCK" 2 "open=blue"
+
+# 11. SSOT host skip(textarea.tsx)→ pass
+run_hook "/r/packages/design-system/src/components/Textarea/textarea.tsx" '
+const cls = "hover:shadow-[inset_0_0_0_1px_red]"
+'
+expect_exit "A.3.4 textarea SSOT skip → pass" 0
+
+echo ""
+echo "=== A.4 disabled placeholder color ==="
+
+# 12. placeholder:text-fg-muted no override → exit 0 with stderr warn
+run_hook "/r/packages/design-system/src/components/Custom/custom.tsx" '
+const cls = "placeholder:text-fg-muted"
+'
+# A.4 是 P1 stderr,exit 0 — verify stderr 有 warn 訊息但不 fail
+if [ "$EXIT" = "0" ] && echo "$STDERR_TEXT" | grep -q "disabled placeholder color"; then
+  echo "  PASS  A.4.1 placeholder:text-fg-muted no override → stderr warn, exit 0"
+  PASS=$((PASS+1))
+else
+  echo "  FAIL  A.4.1 (expected exit 0 + stderr 'disabled placeholder color', got exit $EXIT)"
+  echo "  --- stderr ---"; echo "$STDERR_TEXT" | sed 's/^/    /'; echo "  --- end ---"
+  FAIL=$((FAIL+1)); FAILED_TESTS="${FAILED_TESTS}\n  - A.4.1"
+fi
+
+# 13. placeholder + disabled override → pass(stderr 不該 fire)
+run_hook "/r/packages/design-system/src/components/Custom/custom.tsx" '
+const cls = "placeholder:text-fg-muted disabled:placeholder:text-fg-disabled"
+'
+if [ "$EXIT" = "0" ] && ! echo "$STDERR_TEXT" | grep -q "disabled placeholder color"; then
+  echo "  PASS  A.4.2 placeholder + disabled override → silent pass"
+  PASS=$((PASS+1))
+else
+  echo "  FAIL  A.4.2 (expected silent exit 0, got stderr fire)"
+  FAIL=$((FAIL+1)); FAILED_TESTS="${FAILED_TESTS}\n  - A.4.2"
+fi
+
+# 14. allowlist → silent pass
+run_hook "/r/packages/design-system/src/components/Custom/custom.tsx" '
+// @disabled-color-allow: caption text intentionally muted across modes
+const cls = "placeholder:text-fg-muted"
+'
+if [ "$EXIT" = "0" ] && ! echo "$STDERR_TEXT" | grep -q "disabled placeholder color"; then
+  echo "  PASS  A.4.3 allowlist → silent pass"
+  PASS=$((PASS+1))
+else
+  echo "  FAIL  A.4.3"
+  FAIL=$((FAIL+1)); FAILED_TESTS="${FAILED_TESTS}\n  - A.4.3"
+fi
+
+echo ""
+echo "=== Skip cases ==="
+
+# 15. non-tsx → skip
+run_hook "/r/packages/design-system/src/components/Foo.md" 'placeholder:text-fg-muted'
+expect_exit "S.1 non-tsx → skip" 0
+
+# 16. read tool → skip
+run_hook "/r/packages/design-system/src/components/Foo.tsx" 'irrelevant' Read
+expect_exit "S.2 non-edit tool → skip" 0
+
+echo ""
+echo "═══ Results: $PASS PASS, $FAIL FAIL ═══"
+if [ "$FAIL" -gt 0 ]; then
+  printf "Failed:%b\n" "$FAILED_TESTS"
+  exit 1
+fi
+exit 0

package/ds-canonical/hooks/tests/test_check_file_size_budget.sh

@@ -0,0 +1,32 @@
+#!/bin/bash
+# Smoke test for check_file_size_budget.sh
+
+set -u
+SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
+HOOK="$SCRIPT_DIR/../check_file_size_budget.sh"
+[ -x "$HOOK" ] || { echo "FATAL: hook not executable"; exit 1; }
+
+PASS=0; FAIL=0
+
+run_hook() {
+  local content="$1"
+  local file_path="$2"
+  local payload
+  payload=$(jq -n --arg fp "$file_path" --arg ct "$content" \
+    '{tool_name:"Write", tool_input:{file_path:$fp, content:$ct}}')
+  STDOUT=$(echo "$payload" | bash "$HOOK" 2>&1)
+  EXIT=$?
+}
+
+# Test 1: small file → silent
+echo "Test 1: small CLAUDE.md → silent pass"
+run_hook "$(yes 'x' | head -100)" "/tmp/test-CLAUDE.md"
+if [ "$EXIT" = "0" ]; then echo "  PASS"; PASS=$((PASS+1)); else echo "  FAIL ($EXIT, $STDOUT)"; FAIL=$((FAIL+1)); fi
+
+# Test 2: irrelevant file → silent
+echo "Test 2: non-governance file → silent skip"
+run_hook "$(yes 'x' | head -2000)" "/tmp/test.tsx"
+if [ "$EXIT" = "0" ] && [ -z "$STDOUT" ]; then echo "  PASS"; PASS=$((PASS+1)); else echo "  FAIL ($EXIT, $STDOUT)"; FAIL=$((FAIL+1)); fi
+
+echo "Results: $PASS PASS, $FAIL FAIL"
+[ "$FAIL" -eq 0 ] || exit 1

package/ds-canonical/hooks/tests/test_check_hardcoded_strings.sh

@@ -0,0 +1,14 @@
+#!/bin/bash
+set -u
+HOOK="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)/../lib/_hardcoded_strings.sh"
+[ -x "$HOOK" ] || { echo "FATAL"; exit 1; }
+PASS=0; FAIL=0
+run_hook() {
+  local payload=$(jq -n --arg fp "$1" --arg ct "$2" '{tool_name:"Write", tool_input:{file_path:$fp, content:$ct}}')
+  STDOUT=$(echo "$payload" | bash "$HOOK" 2>&1); EXIT=$?
+}
+echo "Test 1: non-DS file → silent skip"
+run_hook "/tmp/test.tsx" "<div>長字串確認被略過</div>"
+[ "$EXIT" = "0" ] && { echo "  PASS"; PASS=$((PASS+1)); } || { echo "  FAIL ($STDOUT)"; FAIL=$((FAIL+1)); }
+echo "Results: $PASS PASS, $FAIL FAIL"
+[ "$FAIL" -eq 0 ] || exit 1

package/ds-canonical/hooks/tests/test_check_header_with_tabs_border.sh

@@ -0,0 +1,110 @@
+#!/bin/bash
+# Tests for check_header_with_tabs_border.sh(header-canonical W1 BLOCKER)
+#
+# Hook 規則:PreToolUse Edit/Write/MultiEdit + file 為 `packages/design-system/src/**/*.tsx`(非 stories)→
+#   讀 disk content + tool_input.new_string/content 合 FULL_CONTENT;
+#   含 `<XxxHeader>` + `<Tabs|TabsList|TabsTrigger>` JSX 但 `withTabs` 出現 0 次 → exit 2 BLOCKER。
+#   header > withTabs(但 ≥ 1)→ soft warn exit 0。
+# Allow:FULL_CONTENT 含 `@header-withtabs-allow:` → 整檔豁免。
+# Skip:stories.tsx / anatomy.stories.tsx / principles.stories.tsx。
+
+set -u
+
+SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
+HOOK="$SCRIPT_DIR/../check_header_with_tabs_border.sh"
+
+if [ ! -x "$HOOK" ]; then
+  echo "FATAL: hook not executable: $HOOK"
+  exit 1
+fi
+
+PASS=0
+FAIL=0
+FAILED_TESTS=""
+
+run_hook() {
+  local file_path="$1"; local content="$2"
+  local payload
+  payload=$(jq -n --arg fp "$file_path" --arg c "$content" \
+    '{tool_name: "Write", tool_input: {file_path: $fp, content: $c}}')
+  STDOUT=$(mktemp); STDERR=$(mktemp)
+  set +e
+  printf '%s' "$payload" | bash "$HOOK" >"$STDOUT" 2>"$STDERR"
+  EXIT=$?
+  set -e
+  STDERR_TEXT=$(cat "$STDERR")
+  rm -f "$STDOUT" "$STDERR"
+}
+
+expect_pass_silent() {
+  local name="$1"
+  if [ "$EXIT" = "0" ] && [ -z "$STDERR_TEXT" ]; then
+    echo "  PASS  $name"; PASS=$((PASS+1))
+  else
+    echo "  FAIL  $name (expected silent, exit=$EXIT)"
+    echo "  --- stderr ---"; echo "$STDERR_TEXT" | sed 's/^/    /'; echo "  --- end ---"
+    FAIL=$((FAIL+1)); FAILED_TESTS="${FAILED_TESTS}\n  - $name"
+  fi
+}
+
+expect_blocker() {
+  local name="$1"; local needle="$2"
+  if [ "$EXIT" = "2" ] && echo "$STDERR_TEXT" | grep -qF "$needle"; then
+    echo "  PASS  $name"; PASS=$((PASS+1))
+  else
+    echo "  FAIL  $name (expected exit 2 + '$needle', got exit $EXIT)"
+    echo "  --- stderr ---"; echo "$STDERR_TEXT" | sed 's/^/    /'; echo "  --- end ---"
+    FAIL=$((FAIL+1)); FAILED_TESTS="${FAILED_TESTS}\n  - $name"
+  fi
+}
+
+expect_warn_silent_exit0() {
+  # exit 0 but stderr contains needle (soft warn)
+  local name="$1"; local needle="$2"
+  if [ "$EXIT" = "0" ] && echo "$STDERR_TEXT" | grep -qF "$needle"; then
+    echo "  PASS  $name"; PASS=$((PASS+1))
+  else
+    echo "  FAIL  $name (expected exit 0 + warn '$needle', got exit $EXIT)"
+    echo "  --- stderr ---"; echo "$STDERR_TEXT" | sed 's/^/    /'; echo "  --- end ---"
+    FAIL=$((FAIL+1)); FAILED_TESTS="${FAILED_TESTS}\n  - $name"
+  fi
+}
+
+echo "=== check_header_with_tabs_border tests ==="
+
+# 1. Out-of-scope path (random tsx) → skip
+run_hook "/repo/src/foo.tsx" '<ChromeHeader/><Tabs/>'
+expect_pass_silent "1. out-of-scope path → skip"
+
+# 2. Story file → skip
+run_hook "/repo/packages/design-system/src/components/Foo/foo.stories.tsx" '<ChromeHeader/><Tabs/>'
+expect_pass_silent "2. .stories.tsx → skip"
+
+# 3. In-scope but no header → skip
+run_hook "/repo/packages/design-system/src/components/Foo/foo.tsx" '<button/>'
+expect_pass_silent "3. no header JSX → skip"
+
+# 4. In-scope header but no Tabs → skip
+run_hook "/repo/packages/design-system/src/components/Foo/foo.tsx" '<ChromeHeader/>'
+expect_pass_silent "4. header but no Tabs → skip"
+
+# 5. In-scope header + Tabs + withTabs prop → silent
+run_hook "/repo/packages/design-system/src/components/Foo/foo.tsx" '<ChromeHeader withTabs><TabsList ></TabsList></ChromeHeader>'
+expect_pass_silent "5. header + Tabs + withTabs → silent"
+
+# 6. In-scope header + Tabs WITHOUT withTabs → BLOCKER exit 2
+run_hook "/repo/packages/design-system/src/components/Foo/foo.tsx" '<ChromeHeader><TabsList ></TabsList></ChromeHeader>'
+expect_blocker "6. header + Tabs missing withTabs → BLOCKER" "HEADER + TABS WITHTABS BLOCKER"
+
+# 7. With allow escape → silent
+run_hook "/repo/packages/design-system/src/components/Foo/foo.tsx" '// @header-withtabs-allow: special case
+<ChromeHeader><TabsList ></TabsList></ChromeHeader>'
+expect_pass_silent "7. @header-withtabs-allow → silent"
+
+echo ""
+echo "=== Summary ==="
+echo "Passed: $PASS / $((PASS + FAIL))"
+if [ "$FAIL" -gt 0 ]; then
+  echo "Failed:$FAILED_TESTS"
+  exit 1
+fi

package/ds-canonical/hooks/tests/test_check_layout_space_canonical.sh

@@ -0,0 +1,73 @@
+#!/bin/bash
+# Tests for check_layout_space_canonical.sh
+set -u
+SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
+HOOK="$SCRIPT_DIR/../lib/_layout_space_canonical.sh"
+[ -x "$HOOK" ] || { echo "FATAL: hook not executable"; exit 1; }
+PASS=0; FAIL=0
+
+setup() { TMP=$(mktemp -d); mkdir -p "$TMP/.claude/hooks"; echo 'log_hook_fire(){ :; }' > "$TMP/.claude/hooks/_log-fire.sh"; }
+teardown() { rm -rf "$TMP"; }
+
+run() {
+  local fp="$1"
+  STDOUT=$(echo "{\"tool_input\":{\"file_path\":\"$fp\"}}" | bash "$HOOK" 2>&1)
+  EXIT=$?
+}
+
+# Test 1: out-of-scope file → silent
+echo "Test 1: out-of-scope path → silent"
+setup
+echo "<div></div>" > "$TMP/random.tsx"
+run "$TMP/random.tsx"
+[ "$EXIT" = "0" ] && [ -z "$STDOUT" ] && { echo "  PASS"; PASS=$((PASS+1)); } || { echo "  FAIL: $STDOUT"; FAIL=$((FAIL+1)); }
+teardown
+
+# Test 2: stories.tsx with block + tight margin → flag
+echo "Test 2: tight margin near DataTable → flagged"
+setup
+mkdir -p "$TMP/packages/design-system/src/components"
+cat > "$TMP/test.stories.tsx" <<EOF
+import { DataTable } from '@/design-system/components/DataTable/data-table'
+export const X = { render: () => (
+  <div>
+    <DataTable />
+    <div className="mt-[var(--layout-space-tight)]">Footer</div>
+  </div>
+)}
+EOF
+run "$TMP/test.stories.tsx"
+echo "$STDOUT" | grep -q "tight margin near block" && { echo "  PASS"; PASS=$((PASS+1)); } || { echo "  FAIL: $STDOUT"; FAIL=$((FAIL+1)); }
+teardown
+
+# Test 3: gap-tight on flex-col → flag
+echo "Test 3: flex-col gap-tight → flagged"
+setup
+cat > "$TMP/test.stories.tsx" <<EOF
+export const Y = { render: () => (
+  <div className="flex flex-col gap-[var(--layout-space-tight)]">
+    <Input /><Button /><Select />
+  </div>
+)}
+EOF
+run "$TMP/test.stories.tsx"
+echo "$STDOUT" | grep -q "flex-col gap-tight" && { echo "  PASS"; PASS=$((PASS+1)); } || { echo "  FAIL: $STDOUT"; FAIL=$((FAIL+1)); }
+teardown
+
+# Test 4: clean stories.tsx → silent
+echo "Test 4: compliant stories.tsx → silent"
+setup
+cat > "$TMP/clean.stories.tsx" <<EOF
+export const Z = { render: () => (
+  <div className="flex flex-col gap-[var(--layout-space-loose)]">
+    <Input /><Button />
+  </div>
+)}
+EOF
+run "$TMP/clean.stories.tsx"
+[ "$EXIT" = "0" ] && [ -z "$STDOUT" ] && { echo "  PASS"; PASS=$((PASS+1)); } || { echo "  FAIL: $STDOUT"; FAIL=$((FAIL+1)); }
+teardown
+
+echo ""
+echo "── Summary: $PASS / $((PASS+FAIL)) passed ──"
+[ "$FAIL" -eq 0 ] && echo "✅ All passed" || exit 1