|
|
|
|
@@ -1,36 +1,39 @@
|
|
|
|
|
#!/bin/bash
|
|
|
|
|
# DSS Initialization Script - Full Workflow
|
|
|
|
|
# Sets up complete DSS structure and manages the entire pipeline
|
|
|
|
|
# DSS Initialization Script - Complete Setup & Build Pipeline
|
|
|
|
|
#
|
|
|
|
|
# Usage: scripts/dss-init.sh [--reset] [--skip-analysis]
|
|
|
|
|
# This is the single entry point for DSS setup. It handles:
|
|
|
|
|
# - MCP configuration
|
|
|
|
|
# - Dependencies (Python venv, Node modules)
|
|
|
|
|
# - Directory structure and database
|
|
|
|
|
# - Figma sync and token resolution
|
|
|
|
|
# - CSS generation with style-dictionary
|
|
|
|
|
# - Storybook story generation
|
|
|
|
|
# - Development servers (optional)
|
|
|
|
|
#
|
|
|
|
|
# Full Workflow:
|
|
|
|
|
# 1. Reset to clean state (optional, with --reset)
|
|
|
|
|
# 2. Create directory structure and database
|
|
|
|
|
# 3. Analyze target projects (admin-ui, storybook)
|
|
|
|
|
# 4. Figma sync (requires FIGMA_TOKEN, uses MCP)
|
|
|
|
|
# 5. Build CSS with style-dictionary
|
|
|
|
|
# 6. admin-ui imports from .dss/data/_system/themes/
|
|
|
|
|
# Usage: scripts/dss-init.sh [--reset] [--skip-analysis] [--skip-servers]
|
|
|
|
|
#
|
|
|
|
|
# Flags:
|
|
|
|
|
# --reset Clear all DSS data first (fresh start)
|
|
|
|
|
# --skip-analysis Skip target project analysis
|
|
|
|
|
# --skip-servers Don't start development servers
|
|
|
|
|
# --servers-only Only start servers (skip init steps)
|
|
|
|
|
|
|
|
|
|
set -e
|
|
|
|
|
|
|
|
|
|
DSS_ROOT="$(cd "$(dirname "$0")/.." && pwd)"
|
|
|
|
|
cd "$DSS_ROOT"
|
|
|
|
|
|
|
|
|
|
# Use venv Python if available
|
|
|
|
|
if [ -f "$DSS_ROOT/.venv/bin/python3" ]; then
|
|
|
|
|
PYTHON="$DSS_ROOT/.venv/bin/python3"
|
|
|
|
|
else
|
|
|
|
|
PYTHON="python3"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
# Parse arguments
|
|
|
|
|
RESET=false
|
|
|
|
|
SKIP_ANALYSIS=false
|
|
|
|
|
SKIP_SERVERS=false
|
|
|
|
|
SERVERS_ONLY=false
|
|
|
|
|
for arg in "$@"; do
|
|
|
|
|
case $arg in
|
|
|
|
|
--reset) RESET=true ;;
|
|
|
|
|
--skip-analysis) SKIP_ANALYSIS=true ;;
|
|
|
|
|
--skip-servers) SKIP_SERVERS=true ;;
|
|
|
|
|
--servers-only) SERVERS_ONLY=true ;;
|
|
|
|
|
esac
|
|
|
|
|
done
|
|
|
|
|
|
|
|
|
|
@@ -50,10 +53,46 @@ log_info() { echo -e "${CYAN}[INFO]${NC} $1"; }
|
|
|
|
|
|
|
|
|
|
echo "╔══════════════════════════════════════════════════════════════╗"
|
|
|
|
|
echo "║ DSS INITIALIZATION ║"
|
|
|
|
|
echo "║ Full Workflow Pipeline ║"
|
|
|
|
|
echo "║ Complete Setup & Build Pipeline ║"
|
|
|
|
|
echo "╚══════════════════════════════════════════════════════════════╝"
|
|
|
|
|
echo ""
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# SERVERS ONLY MODE
|
|
|
|
|
# ============================================================================
|
|
|
|
|
if [ "$SERVERS_ONLY" = true ]; then
|
|
|
|
|
log_step "Starting development servers only..."
|
|
|
|
|
|
|
|
|
|
# Kill existing processes
|
|
|
|
|
pkill -f "vite.*admin-ui" 2>/dev/null || true
|
|
|
|
|
pkill -f "storybook.*6006" 2>/dev/null || true
|
|
|
|
|
sleep 1
|
|
|
|
|
|
|
|
|
|
cd "$DSS_ROOT/admin-ui"
|
|
|
|
|
nohup npm run dev > /tmp/dss-admin-ui.log 2>&1 &
|
|
|
|
|
log_info "admin-ui starting (PID: $!)..."
|
|
|
|
|
|
|
|
|
|
nohup npm run storybook > /tmp/dss-storybook.log 2>&1 &
|
|
|
|
|
log_info "Storybook starting (PID: $!)..."
|
|
|
|
|
|
|
|
|
|
cd "$DSS_ROOT"
|
|
|
|
|
sleep 5
|
|
|
|
|
|
|
|
|
|
if curl -s -o /dev/null -w "" http://localhost:3456 2>/dev/null; then
|
|
|
|
|
log_ok "admin-ui: http://localhost:3456"
|
|
|
|
|
else
|
|
|
|
|
log_warn "admin-ui not responding yet (check /tmp/dss-admin-ui.log)"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
if curl -s -o /dev/null -w "" http://localhost:6006 2>/dev/null; then
|
|
|
|
|
log_ok "Storybook: http://localhost:6006"
|
|
|
|
|
else
|
|
|
|
|
log_warn "Storybook not responding yet (check /tmp/dss-storybook.log)"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
exit 0
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 1: Reset (if requested)
|
|
|
|
|
# ============================================================================
|
|
|
|
|
@@ -85,9 +124,8 @@ if [ "$RESET" = true ]; then
|
|
|
|
|
}
|
|
|
|
|
EOF
|
|
|
|
|
|
|
|
|
|
# Reset skins
|
|
|
|
|
# Reset skins (macOS bash 3 compatible)
|
|
|
|
|
for skin in base classic workbench; do
|
|
|
|
|
# Capitalize first letter (macOS bash 3 compatible)
|
|
|
|
|
skin_cap="$(echo "$skin" | sed 's/./\U&/')"
|
|
|
|
|
if [ "$skin" = "base" ]; then
|
|
|
|
|
cat > "dss-claude-plugin/core/skins/${skin}.json" << EOF
|
|
|
|
|
@@ -127,42 +165,101 @@ else
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 2: Validate Environment
|
|
|
|
|
# STEP 2: Generate MCP Configuration
|
|
|
|
|
# ============================================================================
|
|
|
|
|
log_step "2. Validating DSS environment..."
|
|
|
|
|
log_step "2. Generating MCP configuration..."
|
|
|
|
|
|
|
|
|
|
cat > "$DSS_ROOT/.mcp.json" << EOF
|
|
|
|
|
{
|
|
|
|
|
"\$schema": "https://raw.githubusercontent.com/anthropics/claude-code/main/schemas/mcp-servers.schema.json",
|
|
|
|
|
"mcpServers": {
|
|
|
|
|
"dss": {
|
|
|
|
|
"command": "$DSS_ROOT/.venv/bin/python3",
|
|
|
|
|
"args": ["$DSS_ROOT/dss-claude-plugin/servers/dss-mcp-server.py"],
|
|
|
|
|
"env": {
|
|
|
|
|
"PYTHONPATH": "$DSS_ROOT:$DSS_ROOT/dss-claude-plugin",
|
|
|
|
|
"DSS_HOME": "$DSS_ROOT/.dss",
|
|
|
|
|
"DSS_DATABASE": "$DSS_ROOT/.dss/dss.db",
|
|
|
|
|
"DSS_CACHE": "$DSS_ROOT/.dss/cache",
|
|
|
|
|
"DSS_BASE_PATH": "$DSS_ROOT"
|
|
|
|
|
},
|
|
|
|
|
"description": "Design System Server MCP - local development"
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
EOF
|
|
|
|
|
log_ok "MCP config: .mcp.json"
|
|
|
|
|
|
|
|
|
|
echo ""
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 3: Check/Install Dependencies
|
|
|
|
|
# ============================================================================
|
|
|
|
|
log_step "3. Checking dependencies..."
|
|
|
|
|
|
|
|
|
|
# Check/create Python venv
|
|
|
|
|
if [ ! -d "$DSS_ROOT/.venv" ]; then
|
|
|
|
|
log_info "Creating Python virtual environment..."
|
|
|
|
|
python3 -m venv "$DSS_ROOT/.venv"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
# Use venv Python
|
|
|
|
|
PYTHON="$DSS_ROOT/.venv/bin/python3"
|
|
|
|
|
|
|
|
|
|
# Activate venv and check packages
|
|
|
|
|
source "$DSS_ROOT/.venv/bin/activate"
|
|
|
|
|
if ! python3 -c "import mcp" 2>/dev/null; then
|
|
|
|
|
log_info "Installing MCP package..."
|
|
|
|
|
pip install mcp 2>/dev/null || log_warn "MCP package install failed"
|
|
|
|
|
fi
|
|
|
|
|
log_ok "Python venv ready"
|
|
|
|
|
|
|
|
|
|
# Check admin-ui node_modules
|
|
|
|
|
if [ ! -d "$DSS_ROOT/admin-ui/node_modules" ]; then
|
|
|
|
|
log_info "Installing admin-ui dependencies..."
|
|
|
|
|
cd "$DSS_ROOT/admin-ui" && npm install --legacy-peer-deps
|
|
|
|
|
cd "$DSS_ROOT"
|
|
|
|
|
fi
|
|
|
|
|
log_ok "Node dependencies ready"
|
|
|
|
|
|
|
|
|
|
# Build admin-ui
|
|
|
|
|
log_info "Building admin-ui..."
|
|
|
|
|
cd "$DSS_ROOT/admin-ui"
|
|
|
|
|
npm run build 2>&1 | tail -5
|
|
|
|
|
cd "$DSS_ROOT"
|
|
|
|
|
log_ok "admin-ui built (dist/)"
|
|
|
|
|
|
|
|
|
|
# Check style-dictionary
|
|
|
|
|
STYLE_DICT_AVAILABLE=false
|
|
|
|
|
FIGMA_AVAILABLE=false
|
|
|
|
|
|
|
|
|
|
# Check Python
|
|
|
|
|
if ! command -v python3 &> /dev/null; then
|
|
|
|
|
log_error "Python3 not found"
|
|
|
|
|
exit 1
|
|
|
|
|
fi
|
|
|
|
|
log_ok "Python3: $(python3 --version | cut -d' ' -f2)"
|
|
|
|
|
|
|
|
|
|
# Check Node.js
|
|
|
|
|
if command -v node &> /dev/null; then
|
|
|
|
|
log_ok "Node.js: $(node --version)"
|
|
|
|
|
else
|
|
|
|
|
log_warn "Node.js not found - Storybook features limited"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
# Check style-dictionary (project, home, or global)
|
|
|
|
|
if command -v style-dictionary &> /dev/null; then
|
|
|
|
|
STYLE_DICT_CMD=""
|
|
|
|
|
if [ -f "$DSS_ROOT/node_modules/.bin/style-dictionary" ]; then
|
|
|
|
|
STYLE_DICT_AVAILABLE=true
|
|
|
|
|
log_ok "style-dictionary: available"
|
|
|
|
|
elif [ -f "node_modules/.bin/style-dictionary" ]; then
|
|
|
|
|
STYLE_DICT_AVAILABLE=true
|
|
|
|
|
log_ok "style-dictionary: local install"
|
|
|
|
|
STYLE_DICT_CMD="$DSS_ROOT/node_modules/.bin/style-dictionary"
|
|
|
|
|
log_ok "style-dictionary: local"
|
|
|
|
|
elif [ -f "$HOME/node_modules/.bin/style-dictionary" ]; then
|
|
|
|
|
STYLE_DICT_AVAILABLE=true
|
|
|
|
|
log_ok "style-dictionary: installed (~)"
|
|
|
|
|
STYLE_DICT_CMD="$HOME/node_modules/.bin/style-dictionary"
|
|
|
|
|
log_ok "style-dictionary: global (~)"
|
|
|
|
|
elif command -v style-dictionary &> /dev/null; then
|
|
|
|
|
STYLE_DICT_AVAILABLE=true
|
|
|
|
|
STYLE_DICT_CMD="style-dictionary"
|
|
|
|
|
log_ok "style-dictionary: global"
|
|
|
|
|
else
|
|
|
|
|
log_warn "style-dictionary not installed (npm install -g style-dictionary)"
|
|
|
|
|
log_warn "style-dictionary not installed (npm install style-dictionary)"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
# Check Figma token - load from config if not in environment
|
|
|
|
|
echo ""
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 4: Validate Environment
|
|
|
|
|
# ============================================================================
|
|
|
|
|
log_step "4. Validating environment..."
|
|
|
|
|
|
|
|
|
|
log_ok "Python: $(python3 --version | cut -d' ' -f2)"
|
|
|
|
|
log_ok "Node.js: $(node --version)"
|
|
|
|
|
|
|
|
|
|
# Check Figma token
|
|
|
|
|
FIGMA_AVAILABLE=false
|
|
|
|
|
FIGMA_CONFIG=".dss/config/figma.json"
|
|
|
|
|
if [ -z "$FIGMA_TOKEN" ] && [ -f "$FIGMA_CONFIG" ]; then
|
|
|
|
|
FIGMA_TOKEN=$(python3 -c "import json; print(json.load(open('$FIGMA_CONFIG')).get('token',''))" 2>/dev/null)
|
|
|
|
|
@@ -171,22 +268,21 @@ fi
|
|
|
|
|
|
|
|
|
|
if [ -n "$FIGMA_TOKEN" ]; then
|
|
|
|
|
FIGMA_AVAILABLE=true
|
|
|
|
|
log_ok "FIGMA_TOKEN: configured (from .dss/config/figma.json)"
|
|
|
|
|
# Also show UIKit reference if available
|
|
|
|
|
log_ok "FIGMA_TOKEN: configured"
|
|
|
|
|
if [ -f "$FIGMA_CONFIG" ]; then
|
|
|
|
|
UIKIT_NAME=$(python3 -c "import json; d=json.load(open('$FIGMA_CONFIG')); print(d.get('uikit_reference',{}).get('name',''))" 2>/dev/null)
|
|
|
|
|
[ -n "$UIKIT_NAME" ] && log_ok "UIKit reference: $UIKIT_NAME"
|
|
|
|
|
[ -n "$UIKIT_NAME" ] && log_ok "UIKit: $UIKIT_NAME"
|
|
|
|
|
fi
|
|
|
|
|
else
|
|
|
|
|
log_warn "FIGMA_TOKEN not set - add to .dss/config/figma.json"
|
|
|
|
|
log_warn "FIGMA_TOKEN not set"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
echo ""
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 3: Create Directory Structure
|
|
|
|
|
# STEP 5: Create Directory Structure
|
|
|
|
|
# ============================================================================
|
|
|
|
|
log_step "3. Creating DSS directory structure..."
|
|
|
|
|
log_step "5. Creating directory structure..."
|
|
|
|
|
|
|
|
|
|
mkdir -p .dss/data/{_system/{tokens,themes,components,cache,activity},projects,teams}
|
|
|
|
|
mkdir -p .dss/schema
|
|
|
|
|
@@ -194,33 +290,22 @@ mkdir -p .dss/logs/browser-logs
|
|
|
|
|
touch .dss/logs/dss-operations.jsonl
|
|
|
|
|
touch .dss/logs/git-hooks.jsonl
|
|
|
|
|
|
|
|
|
|
# Create _system ds.config.json
|
|
|
|
|
# Create ds.config.json
|
|
|
|
|
if [ ! -f ".dss/data/_system/ds.config.json" ]; then
|
|
|
|
|
cat > .dss/data/_system/ds.config.json << 'EOF'
|
|
|
|
|
{
|
|
|
|
|
"name": "dss-system",
|
|
|
|
|
"version": "1.0.0",
|
|
|
|
|
"description": "DSS internal design system (dogfooding)",
|
|
|
|
|
"description": "DSS internal design system",
|
|
|
|
|
"skin": "base",
|
|
|
|
|
"base_theme": "light",
|
|
|
|
|
"targets": [
|
|
|
|
|
{
|
|
|
|
|
"name": "admin-ui",
|
|
|
|
|
"path": "./admin-ui",
|
|
|
|
|
"type": "web-app",
|
|
|
|
|
"framework": "vanilla"
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
"name": "storybook",
|
|
|
|
|
"path": "./storybook",
|
|
|
|
|
"type": "documentation",
|
|
|
|
|
"framework": "storybook"
|
|
|
|
|
}
|
|
|
|
|
{"name": "admin-ui", "path": "./admin-ui", "type": "web-app"},
|
|
|
|
|
{"name": "storybook", "path": "./storybook", "type": "documentation"}
|
|
|
|
|
],
|
|
|
|
|
"output": {
|
|
|
|
|
"tokens_dir": "./.dss/data/_system/tokens",
|
|
|
|
|
"themes_dir": "./.dss/data/_system/themes",
|
|
|
|
|
"components_dir": "./.dss/data/_system/components",
|
|
|
|
|
"formats": ["css", "scss", "json"]
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
@@ -231,9 +316,9 @@ log_ok "Directory structure ready"
|
|
|
|
|
echo ""
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 4: Initialize Database
|
|
|
|
|
# STEP 6: Initialize Database
|
|
|
|
|
# ============================================================================
|
|
|
|
|
log_step "4. Initializing database..."
|
|
|
|
|
log_step "6. Initializing database..."
|
|
|
|
|
|
|
|
|
|
if [ ! -f ".dss/dss.db" ]; then
|
|
|
|
|
python3 << 'PYEOF'
|
|
|
|
|
@@ -265,70 +350,45 @@ fi
|
|
|
|
|
echo ""
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 5: Analyze Target Projects
|
|
|
|
|
# STEP 7: Analyze Target Projects
|
|
|
|
|
# ============================================================================
|
|
|
|
|
if [ "$SKIP_ANALYSIS" = false ]; then
|
|
|
|
|
log_step "5. Analyzing target projects..."
|
|
|
|
|
log_step "7. Analyzing targets..."
|
|
|
|
|
|
|
|
|
|
# Analyze admin-ui
|
|
|
|
|
if [ -d "admin-ui" ]; then
|
|
|
|
|
JS_COUNT=$(find admin-ui -name "*.js" -not -path "*/node_modules/*" 2>/dev/null | wc -l)
|
|
|
|
|
CSS_COUNT=$(find admin-ui -name "*.css" -not -path "*/node_modules/*" 2>/dev/null | wc -l)
|
|
|
|
|
HTML_COUNT=$(find admin-ui -name "*.html" -not -path "*/node_modules/*" 2>/dev/null | wc -l)
|
|
|
|
|
|
|
|
|
|
cat > .dss/data/_system/analysis-admin-ui.json << EOF
|
|
|
|
|
{"target":"admin-ui","analyzed_at":"$(date -Iseconds)","stats":{"js":$JS_COUNT,"css":$CSS_COUNT,"html":$HTML_COUNT},"status":"analyzed"}
|
|
|
|
|
EOF
|
|
|
|
|
log_ok "admin-ui: $JS_COUNT js, $CSS_COUNT css, $HTML_COUNT html"
|
|
|
|
|
else
|
|
|
|
|
log_warn "admin-ui directory not found"
|
|
|
|
|
log_ok "admin-ui: $JS_COUNT js, $CSS_COUNT css"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
# Analyze storybook
|
|
|
|
|
STORIES_COUNT=$(find . -name "*.stories.js" -o -name "*.stories.ts" 2>/dev/null | grep -v node_modules | wc -l)
|
|
|
|
|
MDX_COUNT=$(find . -name "*.mdx" 2>/dev/null | grep -v node_modules | wc -l)
|
|
|
|
|
|
|
|
|
|
cat > .dss/data/_system/analysis-storybook.json << EOF
|
|
|
|
|
{"target":"storybook","analyzed_at":"$(date -Iseconds)","stats":{"stories":$STORIES_COUNT,"mdx":$MDX_COUNT},"status":"analyzed"}
|
|
|
|
|
EOF
|
|
|
|
|
log_ok "storybook: $STORIES_COUNT stories, $MDX_COUNT mdx"
|
|
|
|
|
log_ok "storybook: $STORIES_COUNT stories"
|
|
|
|
|
|
|
|
|
|
echo ""
|
|
|
|
|
else
|
|
|
|
|
log_step "5. Skipping analysis (--skip-analysis)"
|
|
|
|
|
log_step "7. Skipping analysis (--skip-analysis)"
|
|
|
|
|
echo ""
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 6: Initialize Token Structure
|
|
|
|
|
# STEP 8: Initialize Token Structure
|
|
|
|
|
# ============================================================================
|
|
|
|
|
log_step "6. Checking token structure..."
|
|
|
|
|
log_step "8. Checking tokens..."
|
|
|
|
|
|
|
|
|
|
mkdir -p .dss/data/_system/tokens
|
|
|
|
|
if [ ! -f ".dss/data/_system/tokens/base.json" ]; then
|
|
|
|
|
cat > .dss/data/_system/tokens/base.json << 'EOF'
|
|
|
|
|
{
|
|
|
|
|
"_meta": {
|
|
|
|
|
"version": "1.0.0",
|
|
|
|
|
"generated": null,
|
|
|
|
|
"source": "awaiting Figma sync",
|
|
|
|
|
"status": "empty"
|
|
|
|
|
},
|
|
|
|
|
"_meta": {"version": "1.0.0", "status": "empty"},
|
|
|
|
|
"tokens": {}
|
|
|
|
|
}
|
|
|
|
|
EOF
|
|
|
|
|
log_ok "Empty token structure created"
|
|
|
|
|
log_ok "Token structure created"
|
|
|
|
|
else
|
|
|
|
|
# Check if tokens have content
|
|
|
|
|
TOKEN_STATUS=$(python3 -c "import json; d=json.load(open('.dss/data/_system/tokens/base.json')); print(d.get('_meta',{}).get('status','unknown'))" 2>/dev/null || echo "unknown")
|
|
|
|
|
if [ "$TOKEN_STATUS" = "empty" ]; then
|
|
|
|
|
log_warn "Tokens empty - run Figma sync to populate"
|
|
|
|
|
else
|
|
|
|
|
log_ok "Tokens present (status: $TOKEN_STATUS)"
|
|
|
|
|
fi
|
|
|
|
|
log_ok "Token structure exists"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
# Create style-dictionary config (paths relative to .dss/data/_system/ where it runs)
|
|
|
|
|
# Create style-dictionary config
|
|
|
|
|
cat > .dss/data/_system/style-dictionary.config.json << 'EOF'
|
|
|
|
|
{
|
|
|
|
|
"source": ["tokens/tokens.json"],
|
|
|
|
|
@@ -355,236 +415,194 @@ EOF
|
|
|
|
|
echo ""
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 7: Validate 3-Layer Architecture
|
|
|
|
|
# STEP 9: Validate 3-Layer Architecture
|
|
|
|
|
# ============================================================================
|
|
|
|
|
log_step "7. Validating 3-layer architecture..."
|
|
|
|
|
log_step "9. Validating 3-layer architecture..."
|
|
|
|
|
|
|
|
|
|
# Check core primitives
|
|
|
|
|
if [ -f ".dss/core/primitives.json" ]; then
|
|
|
|
|
PRIM_COUNT=$(python3 -c "import json; d=json.load(open('.dss/core/primitives.json')); print(sum(len(v) if isinstance(v,dict) else 0 for k,v in d.items() if not k.startswith('_')))" 2>/dev/null || echo "0")
|
|
|
|
|
log_ok "Core primitives: $PRIM_COUNT tokens"
|
|
|
|
|
else
|
|
|
|
|
log_warn "Core primitives not found (.dss/core/primitives.json)"
|
|
|
|
|
log_ok "Core primitives: $PRIM_COUNT"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
# Check skin contract
|
|
|
|
|
if [ -f ".dss/schema/skin-contract.json" ]; then
|
|
|
|
|
log_ok "Skin contract defined"
|
|
|
|
|
else
|
|
|
|
|
log_warn "Skin contract not found (.dss/schema/skin-contract.json)"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
# Check skins
|
|
|
|
|
SKIN_COUNT=$(find .dss/skins -name "tokens.json" 2>/dev/null | wc -l)
|
|
|
|
|
if [ "$SKIN_COUNT" -gt 0 ]; then
|
|
|
|
|
log_ok "Skins available: $SKIN_COUNT"
|
|
|
|
|
for skin in $(find .dss/skins -type d -mindepth 1 -maxdepth 1 2>/dev/null); do
|
|
|
|
|
SKIN_NAME=$(basename "$skin")
|
|
|
|
|
log_info " - $SKIN_NAME"
|
|
|
|
|
done
|
|
|
|
|
else
|
|
|
|
|
log_warn "No skins found (.dss/skins/)"
|
|
|
|
|
fi
|
|
|
|
|
[ "$SKIN_COUNT" -gt 0 ] && log_ok "Skins: $SKIN_COUNT"
|
|
|
|
|
|
|
|
|
|
# Check themes
|
|
|
|
|
THEME_COUNT=$(find .dss/themes -name "*.json" 2>/dev/null | grep -v "_" | wc -l)
|
|
|
|
|
if [ "$THEME_COUNT" -gt 0 ]; then
|
|
|
|
|
log_ok "Themes available: $THEME_COUNT"
|
|
|
|
|
for theme in $(find .dss/themes -name "*.json" 2>/dev/null | grep -v "_"); do
|
|
|
|
|
THEME_NAME=$(basename "$theme" .json)
|
|
|
|
|
log_info " - $THEME_NAME"
|
|
|
|
|
done
|
|
|
|
|
else
|
|
|
|
|
log_warn "No themes found (.dss/themes/)"
|
|
|
|
|
fi
|
|
|
|
|
[ "$THEME_COUNT" -gt 0 ] && log_ok "Themes: $THEME_COUNT"
|
|
|
|
|
|
|
|
|
|
# Run validation if available
|
|
|
|
|
if [ -f "scripts/validate-theme.py" ] && [ -f ".dss/schema/skin-contract.json" ]; then
|
|
|
|
|
log_info "Running theme/skin validation..."
|
|
|
|
|
# Run validation
|
|
|
|
|
if [ -f "scripts/validate-theme.py" ]; then
|
|
|
|
|
log_info "Running validation..."
|
|
|
|
|
if $PYTHON scripts/validate-theme.py --validate-skin --quiet 2>&1 | while read line; do
|
|
|
|
|
echo " $line"
|
|
|
|
|
done; then
|
|
|
|
|
log_ok "All validations passed"
|
|
|
|
|
else
|
|
|
|
|
log_warn "Validation had issues - check output above"
|
|
|
|
|
log_ok "Validation passed"
|
|
|
|
|
fi
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
echo ""
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 8: Figma Sync
|
|
|
|
|
# STEP 10: Figma Sync
|
|
|
|
|
# ============================================================================
|
|
|
|
|
log_step "8. Figma sync..."
|
|
|
|
|
log_step "10. Figma sync..."
|
|
|
|
|
|
|
|
|
|
# Check if tokens are empty and Figma is available
|
|
|
|
|
TOKEN_STATUS=$(python3 -c "import json; d=json.load(open('.dss/data/_system/tokens/base.json')); print(d.get('_meta',{}).get('status','empty'))" 2>/dev/null || echo "empty")
|
|
|
|
|
|
|
|
|
|
if [ "$FIGMA_AVAILABLE" = true ] && [ "$TOKEN_STATUS" = "empty" ]; then
|
|
|
|
|
log_info "Tokens empty - syncing from Figma..."
|
|
|
|
|
|
|
|
|
|
# Get file key from config
|
|
|
|
|
FIGMA_FILE_KEY=$(python3 -c "import json; print(json.load(open('$FIGMA_CONFIG')).get('uikit_reference',{}).get('file_key',''))" 2>/dev/null)
|
|
|
|
|
|
|
|
|
|
if [ -n "$FIGMA_FILE_KEY" ]; then
|
|
|
|
|
log_info "File: $FIGMA_FILE_KEY"
|
|
|
|
|
|
|
|
|
|
# Run Figma sync script
|
|
|
|
|
log_info "Syncing from Figma..."
|
|
|
|
|
if $PYTHON "$DSS_ROOT/scripts/figma-sync.py" --file-key "$FIGMA_FILE_KEY" 2>&1 | while read line; do
|
|
|
|
|
echo " $line"
|
|
|
|
|
done; then
|
|
|
|
|
log_ok "Figma sync complete"
|
|
|
|
|
else
|
|
|
|
|
log_warn "Figma sync had issues - check output above"
|
|
|
|
|
fi
|
|
|
|
|
else
|
|
|
|
|
log_warn "No UIKit file_key in config - add to .dss/config/figma.json"
|
|
|
|
|
log_warn "No UIKit file_key configured"
|
|
|
|
|
fi
|
|
|
|
|
elif [ "$TOKEN_STATUS" != "empty" ]; then
|
|
|
|
|
log_ok "Tokens already synced (status: $TOKEN_STATUS)"
|
|
|
|
|
log_ok "Tokens already synced"
|
|
|
|
|
else
|
|
|
|
|
log_warn "FIGMA_TOKEN not set - add to .dss/config/figma.json"
|
|
|
|
|
log_warn "FIGMA_TOKEN not set"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
echo ""
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 9: Resolve 3-Layer Token Cascade
|
|
|
|
|
# STEP 11: Resolve Token Cascade
|
|
|
|
|
# ============================================================================
|
|
|
|
|
log_step "9. Resolving 3-layer token cascade..."
|
|
|
|
|
log_step "11. Resolving token cascade..."
|
|
|
|
|
|
|
|
|
|
# Check if we have the 3-layer structure
|
|
|
|
|
HAS_PRIMITIVES=$([ -f ".dss/core/primitives.json" ] && echo "yes" || echo "no")
|
|
|
|
|
HAS_SKINS=$([ -d ".dss/skins/shadcn" ] && echo "yes" || echo "no")
|
|
|
|
|
|
|
|
|
|
if [ "$HAS_PRIMITIVES" = "yes" ] && [ "$HAS_SKINS" = "yes" ]; then
|
|
|
|
|
log_info "Resolving: Core → Skin → Theme"
|
|
|
|
|
if [ -f ".dss/core/primitives.json" ] && [ -d ".dss/skins/shadcn" ]; then
|
|
|
|
|
log_info "Core → Skin → Theme"
|
|
|
|
|
if $PYTHON scripts/resolve-tokens.py 2>&1 | while read line; do
|
|
|
|
|
echo " $line"
|
|
|
|
|
done; then
|
|
|
|
|
log_ok "Token cascade resolved"
|
|
|
|
|
else
|
|
|
|
|
log_warn "Token resolution had issues"
|
|
|
|
|
log_ok "Tokens resolved"
|
|
|
|
|
fi
|
|
|
|
|
else
|
|
|
|
|
log_warn "3-layer structure incomplete - using legacy tokens"
|
|
|
|
|
log_warn "3-layer structure incomplete"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
echo ""
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 10: Build CSS with style-dictionary
|
|
|
|
|
# STEP 12: Build CSS
|
|
|
|
|
# ============================================================================
|
|
|
|
|
log_step "10. Building CSS from tokens..."
|
|
|
|
|
log_step "12. Building CSS..."
|
|
|
|
|
|
|
|
|
|
# Re-check if tokens have content (may have been resolved in step 9)
|
|
|
|
|
# Check tokens.json which is the style-dictionary input file
|
|
|
|
|
HAS_TOKENS=$(python3 -c "
|
|
|
|
|
import json
|
|
|
|
|
try:
|
|
|
|
|
d = json.load(open('.dss/data/_system/tokens/tokens.json'))
|
|
|
|
|
has_content = bool(d) # tokens.json has direct categories like typography, effect
|
|
|
|
|
print('yes' if has_content else 'no')
|
|
|
|
|
print('yes' if d else 'no')
|
|
|
|
|
except:
|
|
|
|
|
print('no')
|
|
|
|
|
" 2>/dev/null || echo "no")
|
|
|
|
|
|
|
|
|
|
# Find style-dictionary (local, parent, home, or global)
|
|
|
|
|
STYLE_DICT_CMD=""
|
|
|
|
|
if [ -f "$DSS_ROOT/node_modules/.bin/style-dictionary" ]; then
|
|
|
|
|
STYLE_DICT_CMD="$DSS_ROOT/node_modules/.bin/style-dictionary"
|
|
|
|
|
elif [ -f "$HOME/node_modules/.bin/style-dictionary" ]; then
|
|
|
|
|
STYLE_DICT_CMD="$HOME/node_modules/.bin/style-dictionary"
|
|
|
|
|
elif [ -f "$(dirname "$DSS_ROOT")/node_modules/.bin/style-dictionary" ]; then
|
|
|
|
|
STYLE_DICT_CMD="$(dirname "$DSS_ROOT")/node_modules/.bin/style-dictionary"
|
|
|
|
|
elif command -v style-dictionary &> /dev/null; then
|
|
|
|
|
STYLE_DICT_CMD="style-dictionary"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
if [ "$HAS_TOKENS" = "yes" ] && [ -n "$STYLE_DICT_CMD" ]; then
|
|
|
|
|
log_info "Running style-dictionary build..."
|
|
|
|
|
cd .dss/data/_system
|
|
|
|
|
if $STYLE_DICT_CMD build --config style-dictionary.config.json 2>&1 | grep -v "^$"; then
|
|
|
|
|
log_ok "CSS/SCSS/JSON generated in .dss/data/_system/themes/"
|
|
|
|
|
else
|
|
|
|
|
log_warn "style-dictionary build had issues"
|
|
|
|
|
log_ok "CSS generated"
|
|
|
|
|
fi
|
|
|
|
|
cd "$DSS_ROOT"
|
|
|
|
|
|
|
|
|
|
# Show what was generated
|
|
|
|
|
if [ -f ".dss/data/_system/themes/tokens.css" ]; then
|
|
|
|
|
CSS_VARS=$(grep -c "^ --" .dss/data/_system/themes/tokens.css 2>/dev/null || echo "0")
|
|
|
|
|
log_ok "Generated $CSS_VARS CSS variables"
|
|
|
|
|
log_ok "$CSS_VARS CSS variables"
|
|
|
|
|
fi
|
|
|
|
|
elif [ "$HAS_TOKENS" = "no" ]; then
|
|
|
|
|
log_warn "No tokens - run Figma sync first"
|
|
|
|
|
log_warn "No tokens - sync from Figma first"
|
|
|
|
|
elif [ -z "$STYLE_DICT_CMD" ]; then
|
|
|
|
|
log_warn "style-dictionary not found"
|
|
|
|
|
log_info "Install: npm install style-dictionary (in project root)"
|
|
|
|
|
log_warn "style-dictionary not installed"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
echo ""
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 11: Generate Storybook Stories
|
|
|
|
|
# STEP 13: Generate Storybook Stories
|
|
|
|
|
# ============================================================================
|
|
|
|
|
log_step "11. Generating Storybook stories..."
|
|
|
|
|
log_step "13. Generating Storybook stories..."
|
|
|
|
|
|
|
|
|
|
if [ "$HAS_TOKENS" = "yes" ] && [ -f "scripts/generate-storybook.py" ]; then
|
|
|
|
|
log_info "Building stories from tokens..."
|
|
|
|
|
if $PYTHON scripts/generate-storybook.py 2>&1 | while read line; do
|
|
|
|
|
echo " $line"
|
|
|
|
|
done; then
|
|
|
|
|
STORY_COUNT=$(find admin-ui/src/stories -name "*.stories.js" 2>/dev/null | wc -l)
|
|
|
|
|
log_ok "Generated $STORY_COUNT Storybook stories"
|
|
|
|
|
else
|
|
|
|
|
log_warn "Storybook generation had issues"
|
|
|
|
|
log_ok "$STORY_COUNT stories generated"
|
|
|
|
|
fi
|
|
|
|
|
else
|
|
|
|
|
if [ "$HAS_TOKENS" = "no" ]; then
|
|
|
|
|
log_warn "No tokens - skipping Storybook generation"
|
|
|
|
|
else
|
|
|
|
|
log_warn "Storybook generator not found (scripts/generate-storybook.py)"
|
|
|
|
|
fi
|
|
|
|
|
log_warn "Skipping (no tokens or generator)"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
echo ""
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 12: Regenerate Hash Manifest
|
|
|
|
|
# STEP 14: Update Hash Manifest
|
|
|
|
|
# ============================================================================
|
|
|
|
|
log_step "12. Updating hash manifest..."
|
|
|
|
|
log_step "14. Updating hashes..."
|
|
|
|
|
|
|
|
|
|
if [ -f "scripts/regenerate-core-hashes.sh" ]; then
|
|
|
|
|
./scripts/regenerate-core-hashes.sh 2>/dev/null
|
|
|
|
|
log_ok "Hash manifest updated"
|
|
|
|
|
else
|
|
|
|
|
log_warn "Hash script not found"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
echo ""
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# STEP 15: Start Development Servers
|
|
|
|
|
# ============================================================================
|
|
|
|
|
if [ "$SKIP_SERVERS" = false ]; then
|
|
|
|
|
log_step "15. Starting development servers..."
|
|
|
|
|
|
|
|
|
|
pkill -f "vite.*admin-ui" 2>/dev/null || true
|
|
|
|
|
pkill -f "storybook.*6006" 2>/dev/null || true
|
|
|
|
|
sleep 1
|
|
|
|
|
|
|
|
|
|
cd "$DSS_ROOT/admin-ui"
|
|
|
|
|
nohup npm run dev > /tmp/dss-admin-ui.log 2>&1 &
|
|
|
|
|
log_info "admin-ui starting..."
|
|
|
|
|
|
|
|
|
|
nohup npm run storybook > /tmp/dss-storybook.log 2>&1 &
|
|
|
|
|
log_info "Storybook starting..."
|
|
|
|
|
|
|
|
|
|
cd "$DSS_ROOT"
|
|
|
|
|
sleep 5
|
|
|
|
|
|
|
|
|
|
if curl -s -o /dev/null -w "" http://localhost:3456 2>/dev/null; then
|
|
|
|
|
log_ok "admin-ui: http://localhost:3456"
|
|
|
|
|
else
|
|
|
|
|
log_warn "admin-ui not responding yet"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
if curl -s -o /dev/null -w "" http://localhost:6006 2>/dev/null; then
|
|
|
|
|
log_ok "Storybook: http://localhost:6006"
|
|
|
|
|
else
|
|
|
|
|
log_warn "Storybook not responding yet"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
echo ""
|
|
|
|
|
else
|
|
|
|
|
log_step "15. Skipping servers (--skip-servers)"
|
|
|
|
|
echo ""
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
# ============================================================================
|
|
|
|
|
# SUMMARY
|
|
|
|
|
# ============================================================================
|
|
|
|
|
|
|
|
|
|
# Re-check token status after Figma sync
|
|
|
|
|
FINAL_TOKEN_STATUS=$(python3 -c "import json; d=json.load(open('.dss/data/_system/tokens/base.json')); print(d.get('_meta',{}).get('status','empty'))" 2>/dev/null || echo "empty")
|
|
|
|
|
FINAL_TOKEN_COUNT=$(python3 -c "import json; d=json.load(open('.dss/data/_system/tokens/base.json')); print(sum(len(v) for v in d.get('tokens',{}).values()))" 2>/dev/null || echo "0")
|
|
|
|
|
|
|
|
|
|
# Determine overall status
|
|
|
|
|
# Determine status
|
|
|
|
|
if [ -f ".dss/data/_system/themes/tokens.css" ]; then
|
|
|
|
|
STATUS="READY"
|
|
|
|
|
STATUS_MSG="admin-ui can import from .dss/data/_system/themes/"
|
|
|
|
|
elif [ "$FINAL_TOKEN_STATUS" = "synced" ]; then
|
|
|
|
|
STATUS="TOKENS SYNCED ($FINAL_TOKEN_COUNT tokens)"
|
|
|
|
|
STATUS_MSG="Install style-dictionary to build CSS: npm install -g style-dictionary"
|
|
|
|
|
elif [ "$FIGMA_AVAILABLE" = true ]; then
|
|
|
|
|
STATUS="AWAITING FIGMA SYNC"
|
|
|
|
|
STATUS_MSG="Run: dss_sync_figma or /dss-figma to populate tokens"
|
|
|
|
|
STATUS_MSG="Import from .dss/data/_system/themes/"
|
|
|
|
|
elif [ "$HAS_TOKENS" = "yes" ]; then
|
|
|
|
|
STATUS="TOKENS READY"
|
|
|
|
|
STATUS_MSG="Install style-dictionary to build CSS"
|
|
|
|
|
else
|
|
|
|
|
STATUS="AWAITING SETUP"
|
|
|
|
|
STATUS_MSG="Set FIGMA_TOKEN environment variable first"
|
|
|
|
|
STATUS="AWAITING FIGMA SYNC"
|
|
|
|
|
STATUS_MSG="Run: /dss-figma to populate tokens"
|
|
|
|
|
fi
|
|
|
|
|
|
|
|
|
|
echo "╔══════════════════════════════════════════════════════════════╗"
|
|
|
|
|
@@ -594,20 +612,17 @@ echo ""
|
|
|
|
|
echo " Status: $STATUS"
|
|
|
|
|
echo " → $STATUS_MSG"
|
|
|
|
|
echo ""
|
|
|
|
|
echo " 3-Layer Architecture:"
|
|
|
|
|
echo " .dss/core/primitives.json ← Core Tailwind primitives (immutable)"
|
|
|
|
|
echo " .dss/skins/*/tokens.json ← Skins (semantic mappings)"
|
|
|
|
|
echo " .dss/themes/*.json ← Themes (brand overrides)"
|
|
|
|
|
echo " .dss/schema/skin-contract ← Contract for skin compatibility"
|
|
|
|
|
echo " Services:"
|
|
|
|
|
echo " admin-ui: http://localhost:3456"
|
|
|
|
|
echo " Storybook: http://localhost:6006"
|
|
|
|
|
echo ""
|
|
|
|
|
echo " Output:"
|
|
|
|
|
echo " .dss/data/_system/themes/ ← CSS output for admin-ui"
|
|
|
|
|
echo " .dss/data/_system/tokens/ ← Token JSON files"
|
|
|
|
|
echo " .dss/data/_system/themes/ ← CSS for admin-ui"
|
|
|
|
|
echo " .dss/data/_system/tokens/ ← Token JSON"
|
|
|
|
|
echo " admin-ui/src/stories/ ← Storybook stories"
|
|
|
|
|
echo ""
|
|
|
|
|
echo " Workflow:"
|
|
|
|
|
echo " 1. scripts/dss-init.sh --reset # Fresh start"
|
|
|
|
|
echo " 2. dss_sync_figma # Populate from Figma"
|
|
|
|
|
echo " 3. scripts/dss-init.sh # Validate + Build CSS"
|
|
|
|
|
echo " 4. admin-ui imports themes/ # Ready to use"
|
|
|
|
|
echo " Commands:"
|
|
|
|
|
echo " /dss-init --reset Fresh start"
|
|
|
|
|
echo " /dss-init Incremental update"
|
|
|
|
|
echo " /dss-init --servers-only Start servers"
|
|
|
|
|
echo ""
|
|
|
|
|
|
