design system token v0.2

skill/install.sh

@@ -1,29 +1,25 @@
 #!/usr/bin/env bash
-# install.sh — Symlink the Greyhaven Design System SKILL.md into a consuming project's
-# .claude/skills/ directory so that any Claude Code session gets full design system context.
+# install.sh — Install the Greyhaven Design System into a consuming project.
+#
+# What it does:
+#   1. Symlinks SKILL.md into .claude/skills/ (for Claude Code)
+#   2. Symlinks AGENT.md into the project root (for non-Claude AI agents)
+#   3. Copies Aspekta font files + @font-face CSS into public/fonts/
+#   4. Prints CSS import instructions for the consuming project
 #
 # Usage:
-#   From the greyhaven-design-system repo:
-#     ./skill/install.sh /path/to/your/project
-#
-#   Or from any directory:
-#     /path/to/greyhaven-design-system/skill/install.sh /path/to/your/project
+#   ./skill/install.sh /path/to/your/project
 
 set -euo pipefail
 
-# Resolve the absolute path of the SKILL.md file relative to this script
 SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
+REPO_ROOT="$(cd "$SCRIPT_DIR/.." && pwd)"
 SKILL_FILE="${SCRIPT_DIR}/SKILL.md"
+AGENT_FILE="${SCRIPT_DIR}/AGENT.md"
+FONTS_DIR="${REPO_ROOT}/public/fonts"
 
-# Validate SKILL.md exists
-if [ ! -f "$SKILL_FILE" ]; then
-  echo "Error: SKILL.md not found at ${SKILL_FILE}"
-  exit 1
-fi
-
-# Get target project directory from argument or prompt
 if [ $# -ge 1 ]; then
-  TARGET_PROJECT="$1"
+  TARGET_PROJECT="$(cd "$1" && pwd)"
 else
   echo "Usage: $0 <target-project-directory>"
   echo ""
@@ -33,36 +29,82 @@ else
   exit 1
 fi
 
-# Resolve to absolute path
-TARGET_PROJECT="$(cd "$TARGET_PROJECT" && pwd)"
-
-# Validate target directory exists
 if [ ! -d "$TARGET_PROJECT" ]; then
   echo "Error: Directory not found: ${TARGET_PROJECT}"
   exit 1
 fi
 
-# Create .claude/skills/ directory in target project if it doesn't exist
-SKILLS_DIR="${TARGET_PROJECT}/.claude/skills"
-mkdir -p "$SKILLS_DIR"
+echo "Installing Greyhaven Design System into ${TARGET_PROJECT}"
+echo ""
 
-# Create the symlink
-LINK_PATH="${SKILLS_DIR}/greyhaven-design-system.md"
+# ── 1. Claude Skill ────────────────────────────────────────────────────────
+if [ -f "$SKILL_FILE" ]; then
+  SKILLS_DIR="${TARGET_PROJECT}/.claude/skills"
+  mkdir -p "$SKILLS_DIR"
+  LINK_PATH="${SKILLS_DIR}/greyhaven-design-system.md"
 
-if [ -L "$LINK_PATH" ]; then
-  echo "Updating existing symlink at ${LINK_PATH}"
-  rm "$LINK_PATH"
-elif [ -f "$LINK_PATH" ]; then
-  echo "Warning: ${LINK_PATH} exists as a regular file. Backing up to ${LINK_PATH}.bak"
-  mv "$LINK_PATH" "${LINK_PATH}.bak"
+  if [ -L "$LINK_PATH" ]; then
+    rm "$LINK_PATH"
+  elif [ -f "$LINK_PATH" ]; then
+    mv "$LINK_PATH" "${LINK_PATH}.bak"
+  fi
+
+  ln -s "$SKILL_FILE" "$LINK_PATH"
+  echo "[ok] Claude Skill:  ${LINK_PATH} -> ${SKILL_FILE}"
+else
+  echo "[skip] SKILL.md not found — run 'pnpm skill:build' first"
 fi
 
-ln -s "$SKILL_FILE" "$LINK_PATH"
+# ── 2. AGENT.md ────────────────────────────────────────────────────────────
+if [ -f "$AGENT_FILE" ]; then
+  AGENT_LINK="${TARGET_PROJECT}/AGENT.md"
 
-echo "Done! Greyhaven Design System skill installed."
+  if [ -L "$AGENT_LINK" ]; then
+    rm "$AGENT_LINK"
+  elif [ -f "$AGENT_LINK" ]; then
+    mv "$AGENT_LINK" "${AGENT_LINK}.bak"
+  fi
+
+  ln -s "$AGENT_FILE" "$AGENT_LINK"
+  echo "[ok] AGENT.md:      ${AGENT_LINK} -> ${AGENT_FILE}"
+else
+  echo "[skip] AGENT.md not found — run 'pnpm skill:build' first"
+fi
+
+# ── 3. Fonts ───────────────────────────────────────────────────────────────
+if [ -d "$FONTS_DIR" ]; then
+  TARGET_FONTS="${TARGET_PROJECT}/public/fonts"
+  mkdir -p "$TARGET_FONTS"
+
+  # Copy only Aspekta woff2 files and the font-face CSS
+  copied=0
+  for f in "$FONTS_DIR"/Aspekta-*.woff2; do
+    [ -f "$f" ] || continue
+    cp -n "$f" "$TARGET_FONTS/" 2>/dev/null && copied=$((copied + 1)) || true
+  done
+
+  # Copy font-face.css
+  if [ -f "$FONTS_DIR/font-face.css" ]; then
+    cp -n "$FONTS_DIR/font-face.css" "$TARGET_FONTS/" 2>/dev/null || true
+  fi
+
+  echo "[ok] Fonts:         ${copied} Aspekta woff2 files copied to ${TARGET_FONTS}/"
+else
+  echo "[skip] Fonts dir not found at ${FONTS_DIR}"
+fi
+
+# ── Done ───────────────────────────────────────────────────────────────────
 echo ""
-echo "  Symlink: ${LINK_PATH}"
-echo "  Target:  ${SKILL_FILE}"
+echo "Done! Next steps for your project's CSS entry point:"
 echo ""
-echo "Any Claude Code session in ${TARGET_PROJECT} will now have"
-echo "full Greyhaven Design System context available."
+echo "  /* Add these @font-face declarations to your global CSS */"
+echo "  @font-face { font-family: 'Aspekta'; font-weight: 400; font-display: swap; src: url('/fonts/Aspekta-400.woff2') format('woff2'); }"
+echo "  @font-face { font-family: 'Aspekta'; font-weight: 500; font-display: swap; src: url('/fonts/Aspekta-500.woff2') format('woff2'); }"
+echo "  @font-face { font-family: 'Aspekta'; font-weight: 600; font-display: swap; src: url('/fonts/Aspekta-600.woff2') format('woff2'); }"
+echo "  @font-face { font-family: 'Aspekta'; font-weight: 700; font-display: swap; src: url('/fonts/Aspekta-700.woff2') format('woff2'); }"
+echo ""
+echo "  /* Or import the full set: */"
+echo "  @import url('/fonts/font-face.css');"
+echo ""
+echo "  /* Set your font stack: */"
+echo "  --font-sans: 'Aspekta', ui-sans-serif, system-ui, sans-serif;"