@yubild/cli 0.1.0

package/src/commands/sync.ts

@@ -0,0 +1,86 @@
+/**
+ * yubild sync
+ * Sync design tokens between local project and Figma
+ */
+
+import { loadConfig } from '../lib/config';
+import { isAuthenticated } from '../lib/auth';
+import { ApiClient } from '../lib/api-client';
+
+export async function syncCommand(options: { autoMerge?: boolean }): Promise<void> {
+  if (!isAuthenticated()) {
+    console.error('Error: Not authenticated. Run `yubild login` first.');
+    process.exit(1);
+  }
+
+  const config = loadConfig();
+  if (!config) {
+    console.error('Error: No .yubildrc found. Run `yubild init` first.');
+    process.exit(1);
+  }
+
+  const { default: chalk } = await import('chalk');
+  const { default: ora } = await import('ora');
+
+  const spinner = ora('Syncing with Figma...').start();
+
+  try {
+    const client = new ApiClient();
+    const result = await client.syncTokens(config.projectId, options.autoMerge ?? false);
+
+    if (result.synced) {
+      spinner.succeed('Sync complete!');
+      const summary = result.summary;
+      if (summary) {
+        console.log('');
+        console.log(`  ${chalk.green(`+ ${summary.added} added`)}`);
+        console.log(`  ${chalk.yellow(`~ ${summary.modified} modified`)}`);
+        console.log(`  ${chalk.red(`- ${summary.removed} removed`)}`);
+        console.log(`  ${chalk.gray(`  ${summary.unchanged} unchanged`)}`);
+      }
+      if (result.warnings && result.warnings.length > 0) {
+        console.log('');
+        for (const warning of result.warnings) {
+          console.log(`  ${chalk.yellow('Warning:')} ${warning}`);
+        }
+      }
+    } else {
+      spinner.warn('Sync requires conflict resolution');
+      if (result.diff) {
+        console.log('');
+        console.log('Diff:');
+        console.log('');
+        const padKey = Math.max(...result.diff.entries.map((e) => e.tokenKey.length), 10);
+        const padStatus = 10;
+        console.log(
+          `  ${'Token'.padEnd(padKey)}  ${'Status'.padEnd(padStatus)}  ${'Local'.padEnd(20)}  Figma`
+        );
+        console.log(`  ${''.padEnd(padKey, '-')}  ${''.padEnd(padStatus, '-')}  ${''.padEnd(20, '-')}  ${''.padEnd(20, '-')}`);
+        for (const entry of result.diff.entries) {
+          const statusColor =
+            entry.status === 'added'
+              ? chalk.green
+              : entry.status === 'modified'
+                ? chalk.yellow
+                : entry.status === 'removed'
+                  ? chalk.red
+                  : chalk.gray;
+          console.log(
+            `  ${entry.tokenKey.padEnd(padKey)}  ${statusColor(entry.status.padEnd(padStatus))}  ${(entry.localValue ?? '-').padEnd(20)}  ${entry.figmaValue ?? '-'}`
+          );
+        }
+        const s = result.diff.summary;
+        console.log('');
+        console.log(
+          `  Summary: ${chalk.green(`+${s.added}`)} ${chalk.yellow(`~${s.modified}`)} ${chalk.red(`-${s.removed}`)} ${chalk.gray(`${s.unchanged} unchanged`)}`
+        );
+      }
+      console.log('');
+      console.log(`  Use ${chalk.cyan('yubild sync --auto-merge')} to auto-merge, or resolve conflicts in the Yubild UI.`);
+    }
+  } catch (error) {
+    spinner.fail('Sync failed');
+    console.error(`\nFailed to sync tokens: ${(error as Error).message}`);
+    process.exit(1);
+  }
+}

package/src/commands/watch.ts

@@ -0,0 +1,71 @@
+/**
+ * yubild watch
+ * Watch for token changes and auto-sync
+ */
+
+import { loadConfig } from '../lib/config';
+import { isAuthenticated } from '../lib/auth';
+import { ApiClient } from '../lib/api-client';
+
+export async function watchCommand(options: {
+  interval?: string;
+}): Promise<void> {
+  if (!isAuthenticated()) {
+    console.error('Error: Not authenticated. Run `yubild login` first.');
+    process.exit(1);
+  }
+
+  const config = loadConfig();
+  if (!config) {
+    console.error('Error: No .yubildrc found. Run `yubild init` first.');
+    process.exit(1);
+  }
+
+  const { default: chalk } = await import('chalk');
+
+  const intervalSeconds = parseInt(options.interval ?? '30', 10);
+  if (isNaN(intervalSeconds) || intervalSeconds < 5) {
+    console.error('Error: Interval must be a number >= 5 seconds.');
+    process.exit(1);
+  }
+
+  const client = new ApiClient();
+
+  console.log(chalk.cyan(`Watching for changes every ${intervalSeconds}s... (Ctrl+C to stop)`));
+  console.log('');
+
+  const check = async () => {
+    try {
+      const diff = await client.diffTokens(config.projectId);
+
+      const totalChanges = diff.summary.added + diff.summary.modified + diff.summary.removed;
+
+      if (totalChanges === 0) {
+        console.log(chalk.gray(`[${new Date().toLocaleTimeString()}] No changes detected.`));
+        return;
+      }
+
+      console.log(
+        chalk.yellow(`[${new Date().toLocaleTimeString()}] Changes detected: `) +
+          `${chalk.green(`+${diff.summary.added}`)} ${chalk.yellow(`~${diff.summary.modified}`)} ${chalk.red(`-${diff.summary.removed}`)}`
+      );
+
+      console.log(chalk.cyan('  Auto-syncing...'));
+      const result = await client.syncTokens(config.projectId, true);
+
+      if (result.synced) {
+        console.log(chalk.green('  Sync complete!'));
+      } else {
+        console.log(chalk.yellow('  Sync requires manual resolution. Run `yubild sync` to resolve.'));
+      }
+    } catch (error) {
+      console.error(chalk.red(`  Error: ${(error as Error).message}`));
+    }
+  };
+
+  // Run immediately on start
+  await check();
+
+  // Then run on interval
+  setInterval(check, intervalSeconds * 1000);
+}

package/src/commands/whoami.ts

@@ -0,0 +1,31 @@
+/**
+ * yubild whoami
+ * Show the currently authenticated user
+ */
+
+import { loadCredentials, isAuthenticated } from '../lib/auth';
+import { ApiClient } from '../lib/api-client';
+
+export async function whoamiCommand(): Promise<void> {
+  if (!isAuthenticated()) {
+    console.log('Not authenticated. Run `yubild login` to get started.');
+    process.exit(0);
+  }
+
+  const creds = loadCredentials();
+  if (!creds) {
+    console.log('Not authenticated. Run `yubild login` to get started.');
+    process.exit(0);
+  }
+
+  try {
+    const client = new ApiClient();
+    const { user } = await client.authenticate();
+    console.log(`Authenticated as: ${user.email}`);
+    console.log(`API URL: ${creds.apiUrl}`);
+  } catch {
+    console.log(`Stored email: ${creds.email || 'unknown'}`);
+    console.log(`API URL: ${creds.apiUrl}`);
+    console.log('(Could not verify - API may be unreachable)');
+  }
+}

package/src/index.ts

@@ -0,0 +1,104 @@
+#!/usr/bin/env node
+
+/**
+ * Yubild CLI
+ * Pull design tokens from Yubild into your project
+ */
+
+import { Command, Option } from 'commander';
+import { loginCommand } from './commands/login';
+import { initCommand } from './commands/init';
+import { pullCommand } from './commands/pull';
+import { whoamiCommand } from './commands/whoami';
+import { logoutCommand } from './commands/logout';
+import { syncCommand } from './commands/sync';
+import { diffCommand } from './commands/diff';
+import { pushCommand } from './commands/push';
+import { exportCommand } from './commands/export';
+import { deployCommand } from './commands/deploy';
+import { publishCommand } from './commands/publish';
+import { projectsCommand } from './commands/projects';
+import { watchCommand } from './commands/watch';
+
+const program = new Command();
+
+program
+  .name('yubild')
+  .description('Yubild CLI - Design system token management')
+  .version('0.1.0');
+
+program
+  .command('login')
+  .description('Authenticate with your Yubild account')
+  .option('--api-key <key>', 'API key (starts with nxui_sk_)')
+  .option('--api-url <url>', 'Yubild API URL', 'https://yubild.com')
+  .action(loginCommand);
+
+program
+  .command('init')
+  .description('Initialize a project and create .yubildrc configuration')
+  .option('--project-id <id>', 'Yubild project ID')
+  .action(initCommand);
+
+program
+  .command('pull')
+  .description('Pull latest design tokens into your project')
+  .option('-f, --format <format>', 'Specific format to pull (css, tailwind, json)')
+  .action(pullCommand);
+
+program
+  .command('whoami')
+  .description('Show the currently authenticated user')
+  .action(whoamiCommand);
+
+program
+  .command('logout')
+  .description('Clear stored authentication credentials')
+  .action(logoutCommand);
+
+program
+  .command('sync')
+  .description('Sync design tokens between local project and Figma')
+  .option('--auto-merge', 'Automatically merge changes without prompting', false)
+  .action(syncCommand);
+
+program
+  .command('diff')
+  .description('Show differences between local tokens and Figma tokens')
+  .action(diffCommand);
+
+program
+  .command('push')
+  .description('Push design tokens to Figma')
+  .action(pushCommand);
+
+program
+  .command('export')
+  .description('Export design tokens in a specific format')
+  .addOption(new Option('-f, --format <format>', 'Output format').choices(['css', 'tailwind', 'json', 'scss', 'react', 'vue', 'angular']).makeOptionMandatory())
+  .option('-o, --output <dir>', 'Output directory')
+  .action(exportCommand);
+
+program
+  .command('deploy')
+  .description('Deploy design tokens to CDN')
+  .action(deployCommand);
+
+program
+  .command('publish')
+  .description('Publish design tokens to Git via Pull Request')
+  .option('--repo <repositoryId>', 'Target repository ID')
+  .action(publishCommand);
+
+program
+  .command('projects')
+  .description('List all projects')
+  .action(projectsCommand);
+
+program
+  .command('watch')
+  .description('Watch for token changes and auto-sync')
+  .option('--interval <seconds>', 'Polling interval in seconds', '30')
+  .action(watchCommand);
+
+program.parse();

package/src/lib/api-client.ts

@@ -0,0 +1,231 @@
+/**
+ * HTTP client for Yubild API
+ */
+
+import { getApiKey, getApiUrl } from './auth';
+
+export class ApiClient {
+  private baseUrl: string;
+  private apiKey: string;
+
+  constructor(apiUrl?: string, apiKey?: string) {
+    this.baseUrl = apiUrl || getApiUrl();
+    this.apiKey = apiKey || getApiKey() || '';
+  }
+
+  private async request<T>(
+    endpoint: string,
+    options: RequestInit = {}
+  ): Promise<T> {
+    const url = `${this.baseUrl}/api${endpoint}`;
+
+    const response = await fetch(url, {
+      ...options,
+      headers: {
+        Authorization: `Bearer ${this.apiKey}`,
+        'Content-Type': 'application/json',
+        'User-Agent': 'yubild-cli',
+        ...options.headers,
+      },
+    });
+
+    if (response.status === 401) {
+      throw new Error('Authentication failed. Run `yubild login` to authenticate.');
+    }
+
+    if (!response.ok) {
+      let errorMessage = `API error: ${response.status}`;
+      try {
+        const body = (await response.json()) as Record<string, string>;
+        errorMessage = body.error || body.message || errorMessage;
+      } catch {
+        // Use default
+      }
+      throw new Error(errorMessage);
+    }
+
+    return response.json() as Promise<T>;
+  }
+
+  private async rawRequest(
+    endpoint: string,
+    options: RequestInit = {}
+  ): Promise<Response> {
+    const url = `${this.baseUrl}/api${endpoint}`;
+
+    const response = await fetch(url, {
+      ...options,
+      headers: {
+        Authorization: `Bearer ${this.apiKey}`,
+        'Content-Type': 'application/json',
+        'User-Agent': 'yubild-cli',
+        ...options.headers,
+      },
+    });
+
+    if (response.status === 401) {
+      throw new Error('Authentication failed. Run `yubild login` to authenticate.');
+    }
+
+    if (!response.ok) {
+      let errorMessage = `API error: ${response.status}`;
+      try {
+        const body = (await response.json()) as Record<string, string>;
+        errorMessage = body.error || body.message || errorMessage;
+      } catch {
+        // Use default
+      }
+      throw new Error(errorMessage);
+    }
+
+    return response;
+  }
+
+  /**
+   * Authenticate with API key
+   */
+  async authenticate(): Promise<{ user: { email: string; name: string | null } }> {
+    return this.request('/cli/auth', {
+      method: 'POST',
+    });
+  }
+
+  /**
+   * Get project status
+   */
+  async getProjectStatus(projectId: string): Promise<{
+    project: { name: string; version: string; framework: string };
+    lastBuild: { version: string; createdAt: string } | null;
+  }> {
+    return this.request(`/cli/status?projectId=${projectId}`);
+  }
+
+  /**
+   * Pull tokens for a project
+   */
+  async pullTokens(
+    projectId: string,
+    formats: string[]
+  ): Promise<{
+    files: Array<{ path: string; content: string }>;
+    version: string;
+  }> {
+    return this.request('/cli/pull', {
+      method: 'POST',
+      body: JSON.stringify({ projectId, formats }),
+    });
+  }
+
+  /**
+   * Sync tokens between local and Figma
+   */
+  async syncTokens(
+    projectId: string,
+    autoMerge: boolean
+  ): Promise<{
+    synced: boolean;
+    diff?: {
+      entries: Array<{ tokenKey: string; status: string; localValue?: string; figmaValue?: string }>;
+      summary: { added: number; modified: number; removed: number; unchanged: number };
+    };
+    summary?: { added: number; modified: number; removed: number; unchanged: number };
+    warnings?: string[];
+  }> {
+    return this.request('/cli/sync', {
+      method: 'POST',
+      body: JSON.stringify({ projectId, autoMerge }),
+    });
+  }
+
+  /**
+   * Diff tokens between local and Figma
+   */
+  async diffTokens(projectId: string): Promise<{
+    entries: Array<{ tokenKey: string; status: string; localValue?: string; figmaValue?: string }>;
+    summary: { added: number; modified: number; removed: number; unchanged: number };
+    hasConflicts: boolean;
+    warnings?: string[];
+  }> {
+    return this.request('/cli/diff', {
+      method: 'POST',
+      body: JSON.stringify({ projectId }),
+    });
+  }
+
+  /**
+   * Push tokens to Figma
+   */
+  async pushToFigma(projectId: string): Promise<{
+    data: { variables: unknown[]; projectName: string; exportedAt: string };
+  }> {
+    return this.request('/cli/push', {
+      method: 'POST',
+      body: JSON.stringify({ projectId }),
+    });
+  }
+
+  /**
+   * Export tokens in a specific format
+   */
+  async exportTokens(
+    projectId: string,
+    format: string
+  ): Promise<{
+    files: Array<{ path: string; content: string }>;
+    format: string;
+    version: string;
+  }> {
+    return this.request('/cli/export', {
+      method: 'POST',
+      body: JSON.stringify({ projectId, format }),
+    });
+  }
+
+  /**
+   * Deploy tokens to CDN
+   */
+  async deployToCdn(projectId: string): Promise<{
+    deployed: boolean;
+    version: string;
+    buildId: string;
+    cdnUrl: string;
+  }> {
+    return this.request('/cli/deploy', {
+      method: 'POST',
+      body: JSON.stringify({ projectId }),
+    });
+  }
+
+  /**
+   * Publish tokens to Git via Pull Request
+   */
+  async publishToGit(
+    projectId: string,
+    repositoryId?: string
+  ): Promise<{
+    published: boolean;
+    prUrl?: string;
+    prNumber?: number;
+  }> {
+    return this.request('/cli/publish', {
+      method: 'POST',
+      body: JSON.stringify({ projectId, repositoryId }),
+    });
+  }
+
+  /**
+   * List all projects
+   */
+  async listProjects(): Promise<{
+    projects: Array<{
+      id: string;
+      name: string;
+      slug: string;
+      version: string;
+      framework: string;
+      updatedAt: string;
+    }>;
+  }> {
+    return this.request('/cli/projects');
+  }
+}

package/src/lib/auth.ts

@@ -0,0 +1,86 @@
+/**
+ * Authentication management for CLI
+ * Stores credentials in user's home directory
+ */
+
+import * as fs from 'fs';
+import * as path from 'path';
+import * as os from 'os';
+
+interface AuthCredentials {
+  apiKey: string;
+  apiUrl: string;
+  email?: string;
+  expiresAt?: string;
+}
+
+const AUTH_DIR = path.join(os.homedir(), '.yubild');
+const AUTH_FILE = path.join(AUTH_DIR, 'credentials.json');
+
+/**
+ * Store authentication credentials
+ */
+export function saveCredentials(credentials: AuthCredentials): void {
+  if (!fs.existsSync(AUTH_DIR)) {
+    fs.mkdirSync(AUTH_DIR, { recursive: true, mode: 0o700 });
+  }
+
+  fs.writeFileSync(
+    AUTH_FILE,
+    JSON.stringify(credentials, null, 2),
+    { encoding: 'utf-8', mode: 0o600 }
+  );
+}
+
+/**
+ * Load stored credentials
+ */
+export function loadCredentials(): AuthCredentials | null {
+  if (!fs.existsSync(AUTH_FILE)) return null;
+
+  try {
+    const content = fs.readFileSync(AUTH_FILE, 'utf-8');
+    return JSON.parse(content) as AuthCredentials;
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * Clear stored credentials
+ */
+export function clearCredentials(): void {
+  if (fs.existsSync(AUTH_FILE)) {
+    fs.unlinkSync(AUTH_FILE);
+  }
+}
+
+/**
+ * Check if authenticated
+ */
+export function isAuthenticated(): boolean {
+  const creds = loadCredentials();
+  if (!creds) return false;
+
+  if (creds.expiresAt && new Date(creds.expiresAt) < new Date()) {
+    return false;
+  }
+
+  return !!creds.apiKey;
+}
+
+/**
+ * Get the API key for making requests
+ */
+export function getApiKey(): string | null {
+  const creds = loadCredentials();
+  return creds?.apiKey || null;
+}
+
+/**
+ * Get the API URL
+ */
+export function getApiUrl(): string {
+  const creds = loadCredentials();
+  return creds?.apiUrl || 'https://yubild.com';
+}

package/src/lib/config.ts

@@ -0,0 +1,77 @@
+/**
+ * Configuration file management for .yubildrc
+ */
+
+import * as fs from 'fs';
+import * as path from 'path';
+
+export interface YubildConfig {
+  projectId: string;
+  apiUrl: string;
+  outputDir: string;
+  formats: string[];
+  framework?: string;
+  watchInterval?: number;
+}
+
+const CONFIG_FILENAME = '.yubildrc';
+const DEFAULT_CONFIG: Partial<YubildConfig> = {
+  apiUrl: 'https://yubild.com',
+  outputDir: './src/tokens',
+  formats: ['css', 'tailwind', 'json'],
+};
+
+/**
+ * Find .yubildrc by walking up from cwd
+ */
+export function findConfigFile(): string | null {
+  let dir = process.cwd();
+
+  while (true) {
+    const configPath = path.join(dir, CONFIG_FILENAME);
+    if (fs.existsSync(configPath)) {
+      return configPath;
+    }
+
+    const parentDir = path.dirname(dir);
+    if (parentDir === dir) break;
+    dir = parentDir;
+  }
+
+  return null;
+}
+
+/**
+ * Load configuration from .yubildrc
+ */
+export function loadConfig(): YubildConfig | null {
+  const configPath = findConfigFile();
+  if (!configPath) return null;
+
+  try {
+    const content = fs.readFileSync(configPath, 'utf-8');
+    const config = JSON.parse(content) as YubildConfig;
+
+    return {
+      ...DEFAULT_CONFIG,
+      ...config,
+    } as YubildConfig;
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * Save configuration to .yubildrc in cwd
+ */
+export function saveConfig(config: YubildConfig): void {
+  const configPath = path.join(process.cwd(), CONFIG_FILENAME);
+  fs.writeFileSync(configPath, JSON.stringify(config, null, 2) + '\n', 'utf-8');
+}
+
+/**
+ * Get config path in cwd
+ */
+export function getConfigPath(): string {
+  return path.join(process.cwd(), CONFIG_FILENAME);
+}