procedure-cli 0.1.13 → 0.1.14

package/src/steps/project-info.tsx

@@ -1,183 +0,0 @@
-import React, { useState, useEffect } from "react";
-import { Text, useInput } from "ink";
-import { TextInput } from "@inkjs/ui";
-import { GutterLine } from "../components/gutter-line.js";
-import { GutteredSelect } from "../components/guttered-select.js";
-import type { WizardAnswers } from "../lib/types.js";
-import { C } from "../theme.js";
-
-interface Props {
-  onComplete: (answers: Partial<WizardAnswers>) => void;
-}
-
-type Step = "projectName" | "description" | "packageManager" | "license";
-
-const STEP_ORDER: Step[] = [
-  "projectName",
-  "description",
-  "packageManager",
-  "license",
-];
-
-const PACKAGE_MANAGER_OPTIONS = [
-  { label: "npm", value: "npm" },
-  { label: "pnpm", value: "pnpm" },
-  { label: "bun", value: "bun" },
-  { label: "yarn", value: "yarn" },
-];
-
-const LICENSE_OPTIONS = [
-  { label: "MIT — Permissive, allows commercial use", value: "MIT" },
-  { label: "ISC — Simplified MIT, minimal restrictions", value: "ISC" },
-  { label: "Apache-2.0 — Permissive with patent protection", value: "Apache-2.0" },
-  { label: "GPL-3.0 — Copyleft, requires source disclosure", value: "GPL-3.0" },
-  { label: "Unlicense — Public domain, no restrictions", value: "Unlicense" },
-];
-
-export default function ProjectInfo({ onComplete }: Props) {
-  const [stepIndex, setStepIndex] = useState(0);
-  const [answers, setAnswers] = useState<Record<string, string>>({});
-  const [error, setError] = useState("");
-  const [liveInput, setLiveInput] = useState("");
-
-  const currentStep = STEP_ORDER[stepIndex]!;
-  const isFirst = stepIndex === 0;
-
-  // Reset live input when navigating to a different field
-  useEffect(() => {
-    setLiveInput("");
-  }, [stepIndex]);
-
-  const isSelectStep = currentStep === "packageManager" || currentStep === "license";
-
-  useInput((input, key) => {
-    if (key.shift && key.tab && stepIndex > 0) {
-      setStepIndex((i) => i - 1);
-      setError("");
-    } else if (key.tab && !key.shift && !isSelectStep) {
-      // Tab only advances text steps — select steps require an explicit Enter selection
-      const val = liveInput.trim() || answers[currentStep] || "";
-      if (!val) {
-        setError(
-          currentStep === "projectName"
-            ? "Project name is required"
-            : "Description is required"
-        );
-        return;
-      }
-      setError("");
-      const next = { ...answers, [currentStep]: val };
-      setAnswers(next);
-      setStepIndex((i) => i + 1);
-    }
-  });
-
-  function advance(key: string, value: string) {
-    const next = { ...answers, [key]: value };
-    setAnswers(next);
-    setError("");
-
-    if (stepIndex < STEP_ORDER.length - 1) {
-      setStepIndex(stepIndex + 1);
-    } else {
-      onComplete(next as unknown as Partial<WizardAnswers>);
-    }
-  }
-
-  function handleTextSubmit(value: string) {
-    const val = value.trim();
-    if (!val) {
-      setError(
-        currentStep === "projectName"
-          ? "Project name is required"
-          : "Description is required"
-      );
-      return;
-    }
-    advance(currentStep, val);
-  }
-
-  function handleSelectChange(key: string) {
-    return (value: string) => {
-      advance(key, value);
-    };
-  }
-
-  // Render completed fields
-  const completed = STEP_ORDER.slice(0, stepIndex).map((key) => (
-    <GutterLine key={key}>
-      <Text color={C.overlay1}>
-        {key === "projectName" && `Project name: ${answers[key]}`}
-        {key === "description" && `Description: ${answers[key]}`}
-        {key === "packageManager" && `Package manager: ${answers[key]}`}
-        {key === "license" && `License: ${answers[key]}`}
-      </Text>
-    </GutterLine>
-  ));
-
-  return (
-    <>
-      {completed}
-
-      {currentStep === "projectName" && (
-        <>
-          <GutterLine>
-            <Text bold>Project name: </Text>
-            <TextInput placeholder="..." onChange={setLiveInput} onSubmit={handleTextSubmit} />
-          </GutterLine>
-          <GutterLine>
-            <Text color={C.overlay1}>{"Tab next  Enter confirm"}</Text>
-          </GutterLine>
-        </>
-      )}
-
-      {currentStep === "description" && (
-        <>
-          <GutterLine>
-            <Text bold>One-line description: </Text>
-            <TextInput placeholder="..." onChange={setLiveInput} onSubmit={handleTextSubmit} />
-          </GutterLine>
-          <GutterLine>
-            <Text color={C.overlay1}>{"Shift+Tab prev  Tab next  Enter confirm"}</Text>
-          </GutterLine>
-        </>
-      )}
-
-      {currentStep === "packageManager" && (
-        <>
-          <GutterLine>
-            <Text bold>Package manager:</Text>
-          </GutterLine>
-          <GutteredSelect
-            options={PACKAGE_MANAGER_OPTIONS}
-            onChange={handleSelectChange("packageManager")}
-          />
-          <GutterLine>
-            <Text color={C.overlay1}>{"Shift+Tab prev  ↑↓ move  Enter select"}</Text>
-          </GutterLine>
-        </>
-      )}
-
-      {currentStep === "license" && (
-        <>
-          <GutterLine>
-            <Text bold>License:</Text>
-          </GutterLine>
-          <GutteredSelect
-            options={LICENSE_OPTIONS}
-            onChange={handleSelectChange("license")}
-          />
-          <GutterLine>
-            <Text color={C.overlay1}>{"Shift+Tab prev  ↑↓ move  Enter select"}</Text>
-          </GutterLine>
-        </>
-      )}
-
-      {error && (
-        <GutterLine>
-          <Text color={C.red}>{error}</Text>
-        </GutterLine>
-      )}
-    </>
-  );
-}

package/src/steps/stack-style.tsx

@@ -1,304 +0,0 @@
-import React, { useState } from "react";
-import { Text } from "ink";
-import { GutterLine } from "../components/gutter-line.js";
-import { GutteredSelect, GutteredMultiSelect } from "../components/guttered-select.js";
-import type { WizardAnswers } from "../lib/types.js";
-import { C } from "../theme.js";
-
-interface Props {
-  onComplete: (answers: Partial<WizardAnswers>) => void;
-}
-
-type Mode = "quickstart" | "advanced";
-type AdvancedStep = "language" | "framework" | "codeStyle";
-
-// ─── Presets ────────────────────────────────────────────────────────────────
-
-interface Preset {
-  label: string;
-  description: string;
-  answers: Partial<WizardAnswers>;
-}
-
-const PRESETS: Record<string, Preset> = {
-  "typescript-node": {
-    label: "TypeScript + Node.js",
-    description: "CLI tools, backend APIs, npm packages",
-    answers: {
-      language: "TypeScript",
-      framework: "Node.js",
-      codeStyle: [
-        "TypeScript strict mode, ESM imports",
-        "camelCase for variables, PascalCase for types",
-        "stdlib → external → internal import ordering",
-        "Return errors, don't throw",
-      ],
-      buildCommand: "tsc",
-      testCommand: "node --test",
-      typecheckCommand: "tsc --noEmit",
-      lintCommand: "eslint src/",
-      prCommand: "npm run typecheck && npm run test",
-    },
-  },
-  "nextjs-fullstack": {
-    label: "Next.js Full-Stack",
-    description: "SaaS apps, marketing sites, SSR/SSG",
-    answers: {
-      language: "TypeScript",
-      framework: "Next.js",
-      codeStyle: [
-        "TypeScript strict mode",
-        "camelCase for variables, PascalCase for components",
-        "Server components by default, client components only when needed",
-        "Co-locate components with their routes",
-      ],
-      buildCommand: "next build",
-      testCommand: "vitest",
-      typecheckCommand: "tsc --noEmit",
-      lintCommand: "next lint",
-      prCommand: "npm run typecheck && npm run lint",
-    },
-  },
-  "react-spa": {
-    label: "React SPA",
-    description: "Dashboards, admin panels, SPAs",
-    answers: {
-      language: "TypeScript",
-      framework: "React",
-      codeStyle: [
-        "TypeScript strict mode",
-        "Functional components only, no class components",
-        "Prefer functional patterns, immutability",
-        "camelCase for variables, PascalCase for components",
-      ],
-      buildCommand: "vite build",
-      testCommand: "vitest",
-      typecheckCommand: "tsc --noEmit",
-      lintCommand: "eslint src/",
-      prCommand: "npm run typecheck && npm run test",
-    },
-  },
-  "python-fastapi": {
-    label: "Python + FastAPI",
-    description: "AI/ML backends, REST APIs, data services",
-    answers: {
-      language: "Python",
-      framework: "FastAPI",
-      codeStyle: [
-        "Type hints on all functions and class attributes",
-        "Black formatting, 88 char line length",
-        "Pydantic models for request/response schemas",
-        "Return errors explicitly, avoid bare exceptions",
-      ],
-      buildCommand: "python -m py_compile src/",
-      testCommand: "pytest",
-      typecheckCommand: "mypy .",
-      lintCommand: "ruff check .",
-      prCommand: "mypy . && pytest",
-    },
-  },
-  "go-service": {
-    label: "Go HTTP Service",
-    description: "High-perf APIs, microservices",
-    answers: {
-      language: "Go",
-      framework: "net/http",
-      codeStyle: [
-        "gofmt enforced, no exceptions",
-        "Errors are values — always handle, never ignore",
-        "Table-driven tests with t.Run subtests",
-        "Keep interfaces small, accept interfaces return structs",
-      ],
-      buildCommand: "go build ./...",
-      testCommand: "go test ./...",
-      typecheckCommand: "go vet ./...",
-      lintCommand: "golangci-lint run",
-      prCommand: "go vet ./... && go test ./...",
-    },
-  },
-  "react-native-expo": {
-    label: "React Native + Expo",
-    description: "Cross-platform mobile apps (iOS + Android)",
-    answers: {
-      language: "TypeScript",
-      framework: "React Native",
-      codeStyle: [
-        "TypeScript strict mode",
-        "Functional components with hooks",
-        "StyleSheet.create for styles, no inline objects",
-        "Platform-specific code via Platform.select or .ios.tsx / .android.tsx",
-      ],
-      buildCommand: "expo build",
-      testCommand: "jest",
-      typecheckCommand: "tsc --noEmit",
-      lintCommand: "eslint .",
-      prCommand: "npm run typecheck && npm run test",
-    },
-  },
-};
-
-const QUICKSTART_OPTIONS = [
-  ...Object.entries(PRESETS).map(([value, preset]) => ({
-    label: preset.label,
-    value,
-    description: preset.description,
-  })),
-  {
-    label: "Configure manually →",
-    value: "advanced",
-    description: "Choose language, framework, and code style",
-  },
-];
-
-// ─── Advanced options ────────────────────────────────────────────────────────
-
-const LANGUAGE_OPTIONS = [
-  { label: "TypeScript", value: "TypeScript", description: "Typed JavaScript, strict mode recommended" },
-  { label: "JavaScript", value: "JavaScript", description: "Dynamic, runs everywhere" },
-  { label: "Python", value: "Python", description: "Readable, great ecosystem for AI/ML & web" },
-  { label: "Go", value: "Go", description: "Fast compilation, built-in concurrency" },
-  { label: "Rust", value: "Rust", description: "Memory-safe systems programming" },
-  { label: "Java", value: "Java", description: "Enterprise-grade, JVM ecosystem" },
-  { label: "Ruby", value: "Ruby", description: "Developer happiness, Rails ecosystem" },
-  { label: "PHP", value: "PHP", description: "Web-native, Laravel & WordPress" },
-  { label: "Swift", value: "Swift", description: "Apple platforms, type-safe" },
-  { label: "Kotlin", value: "Kotlin", description: "Modern JVM, Android-first" },
-];
-
-const FRAMEWORK_OPTIONS = [
-  { label: "Node.js", value: "Node.js", description: "JS/TS server runtime" },
-  { label: "React", value: "React", description: "Component-based UI library" },
-  { label: "Next.js", value: "Next.js", description: "Full-stack React framework" },
-  { label: "Vue", value: "Vue", description: "Progressive UI framework" },
-  { label: "Svelte", value: "Svelte", description: "Compile-time UI framework" },
-  { label: "Express", value: "Express", description: "Minimal Node.js web framework" },
-  { label: "Fastify", value: "Fastify", description: "Fast Node.js web framework" },
-  { label: "Django", value: "Django", description: "Batteries-included Python web" },
-  { label: "Flask", value: "Flask", description: "Lightweight Python web" },
-  { label: "Rails", value: "Rails", description: "Convention-over-config Ruby web" },
-];
-
-const CODE_STYLE_OPTIONS = [
-  { label: "Strict mode", value: "Strict mode", description: "TypeScript strict, ESLint strict" },
-  { label: "camelCase / PascalCase", value: "camelCase for variables, PascalCase for types", description: "Standard JS/TS naming" },
-  { label: "ESM imports", value: "ESM imports, no CommonJS require", description: "Modern module syntax" },
-  { label: "Import ordering", value: "stdlib → external → internal import ordering", description: "Grouped imports" },
-  { label: "Return errors, don't throw", value: "Return errors, don't throw", description: "Explicit error handling" },
-  { label: "Functional style", value: "Prefer functional patterns", description: "Pure functions, immutability" },
-  { label: "No any type", value: "No any type, use unknown", description: "Strict type safety" },
-  { label: "JSDoc comments", value: "JSDoc for public APIs", description: "Documentation standard" },
-];
-
-/** Suggest frameworks based on selected languages */
-function getFrameworkPreselect(languages: string[]): string[] {
-  const langSet = new Set(languages.map((l) => l.toLowerCase()));
-  const preselect: string[] = [];
-  if (langSet.has("typescript") || langSet.has("javascript")) preselect.push("Node.js");
-  if (langSet.has("python")) preselect.push("Django");
-  if (langSet.has("ruby")) preselect.push("Rails");
-  return preselect;
-}
-
-// ─── Component ───────────────────────────────────────────────────────────────
-
-export default function StackStyle({ onComplete }: Props) {
-  const [mode, setMode] = useState<Mode>("quickstart");
-  const [advancedStep, setAdvancedStep] = useState<AdvancedStep>("language");
-  const [selectedLanguages, setSelectedLanguages] = useState<string[]>([]);
-  const [selectedFrameworks, setSelectedFrameworks] = useState<string[]>([]);
-
-  // ── QuickStart ──
-  if (mode === "quickstart") {
-    return (
-      <>
-        <GutterLine>
-          <Text bold>Select a preset:</Text>
-        </GutterLine>
-        <GutteredSelect
-          options={QUICKSTART_OPTIONS}
-          onChange={(val) => {
-            if (val === "advanced") {
-              setMode("advanced");
-              return;
-            }
-            const preset = PRESETS[val];
-            if (preset) onComplete(preset.answers);
-          }}
-        />
-      </>
-    );
-  }
-
-  // ── Advanced ──
-  if (advancedStep === "language") {
-    return (
-      <>
-        <GutterLine>
-          <Text color={C.overlay1}>Mode: manual configuration</Text>
-        </GutterLine>
-        <GutterLine>
-          <Text bold>Programming languages:</Text>
-        </GutterLine>
-        <GutteredMultiSelect
-          options={LANGUAGE_OPTIONS}
-          allowCustom
-          customPlaceholder="e.g. Elixir, Zig, C++"
-          onSubmit={(values) => {
-            setSelectedLanguages(values);
-            setAdvancedStep("framework");
-          }}
-        />
-      </>
-    );
-  }
-
-  if (advancedStep === "framework") {
-    return (
-      <>
-        <GutterLine>
-          <Text color={C.overlay1}>Languages: {selectedLanguages.join(", ")}</Text>
-        </GutterLine>
-        <GutterLine>
-          <Text bold>Frameworks:</Text>
-        </GutterLine>
-        <GutteredMultiSelect
-          options={FRAMEWORK_OPTIONS}
-          initialSelected={getFrameworkPreselect(selectedLanguages)}
-          allowCustom
-          customPlaceholder="e.g. Hono, Remix, Astro"
-          onSubmit={(values) => {
-            setSelectedFrameworks(values);
-            setAdvancedStep("codeStyle");
-          }}
-        />
-      </>
-    );
-  }
-
-  // codeStyle step
-  return (
-    <>
-      <GutterLine>
-        <Text color={C.overlay1}>Languages: {selectedLanguages.join(", ")}</Text>
-      </GutterLine>
-      <GutterLine>
-        <Text color={C.overlay1}>Frameworks: {selectedFrameworks.join(", ")}</Text>
-      </GutterLine>
-      <GutterLine>
-        <Text bold>Code style conventions:</Text>
-      </GutterLine>
-      <GutteredMultiSelect
-        options={CODE_STYLE_OPTIONS}
-        allowCustom
-        customPlaceholder="e.g. tabs over spaces, max 80 chars"
-        onSubmit={(values) => {
-          onComplete({
-            language: selectedLanguages.join(", "),
-            framework: selectedFrameworks.join(", "),
-            codeStyle: values,
-          });
-        }}
-      />
-    </>
-  );
-}

package/src/theme.ts

@@ -1,15 +0,0 @@
-/**
- * Catppuccin Mocha palette — https://catppuccin.com/palette
- * Use these constants for all terminal colors. Never use named terminal
- * colors (cyan, green, red…) — hex values render consistently across terminals.
- */
-export const C = {
-  mauve:    '#cba6f7',  // active step, current focus
-  green:    '#a6e3a1',  // completed steps, success
-  sapphire: '#74c7ec',  // section headers, accent
-  teal:     '#94e2d5',  // secondary accent (custom option)
-  red:      '#f38ba8',  // errors
-  peach:    '#fab387',  // warnings
-  overlay1: '#7f849c',  // gutter lines, dim text, hints
-  overlay0: '#6c7086',  // pending steps, very dim
-} as const;

package/tsconfig.json

@@ -1,17 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES2022",
-    "module": "Node16",
-    "moduleResolution": "Node16",
-    "strict": true,
-    "esModuleInterop": true,
-    "skipLibCheck": true,
-    "outDir": "dist",
-    "rootDir": "src",
-    "jsx": "react-jsx",
-    "declaration": true,
-    "sourceMap": true
-  },
-  "include": ["src"],
-  "exclude": ["node_modules", "dist"]
-}