@amrhas82/agentic-kit 1.5.0 → 1.7.5

package/packages/droid/commands/README.md

@@ -1,76 +0,0 @@
-# Droid Slash Commands
-
-This directory contains 22 transformed Claude skills converted into Factory.ai CLI compatible Droid slash commands.
-
-## Command Reference by Category
-
-### Core Development Skills (7)
-*Code creation, testing, and development workflows*
-
-| Command | Purpose | Key Features |
-|---------|---------|--------------|
-| **algorithmic-art** | Create algorithmic art using p5.js with seeded randomness and interactive parameter exploration | Algorithmic philosophy creation, p5.js templates, generator patterns, interactive viewer creation |
-| **artifacts-builder** | Build elaborate multi-component HTML artifacts using React, TypeScript, Tailwind CSS, and shadcn/ui | React + TypeScript setup, shadcn/ui components, Parcel bundling, single HTML output |
-| **canvas-design** | Create beautiful visual art in PNG and PDF documents using design philosophy and minimal text | Design philosophy creation, visual expression, minimal text approach, craftsmanship principles |
-| **code-review** | Request structured code review to catch issues before they cascade | Mandatory review triggers, focus areas, feedback handling, workflow integration |
-| **test-driven-development** | Write test first, watch it fail, write minimal code to pass - ensures tests actually verify behavior | Red-green-refactor cycle, iron law of TDD, test quality standards, common patterns |
-| **testing-anti-patterns** | Avoid testing anti-patterns - never test mock behavior, add test-only methods, or mock without understanding | Mock behavior testing prevention, production code pollution avoidance, dependency understanding |
-| **skill-creator** | Guide for creating effective skills that extend Claude's capabilities with specialized knowledge | Skill anatomy, progressive disclosure, bundled resources, creation workflow |
-
-### Debugging & Quality (4)
-*Systematic debugging, quality assurance, and verification*
-
-| Command | Purpose | Key Features |
-|---------|---------|--------------|
-| **systematic-debugging** | Systematic four-phase debugging framework - investigate root cause before any fixes | Four-phase process (investigation, analysis, hypothesis, implementation), evidence-based debugging |
-| **root-cause-tracing** | Systematically trace bugs backward through call stack to find original trigger, never just fix symptoms | Backward tracing process, instrumentation techniques, multi-layer defense, test pollution detection |
-| **condition-based-waiting** | Replace arbitrary timeouts with condition polling to eliminate flaky tests from timing guesses | Wait-for-condition patterns, polling implementation, race condition elimination |
-| **verification-before-completion** | Evidence before claims - verify work completion with fresh verification commands | Iron law of verification, gate function, common failure patterns, evidence-based reporting |
-
-### Communication & Documentation (4)
-*Writing, collaboration, and documentation workflows*
-
-| Command | Purpose | Key Features |
-|---------|---------|--------------|
-| **brainstorming** | Turn rough ideas into fully-formed designs through collaborative questioning and exploration | Process-based questioning, approach exploration, design presentation, documentation workflow |
-| **internal-comms** | Write internal communications using company-approved formats and templates | 3P updates, company newsletters, FAQ responses, status reports, leadership communications |
-| **brand-guidelines** | Apply Anthropic's official brand colors and typography to any artifact | Official color palette (orange, blue, green, grays), Poppins/Lora fonts, CSS/Python implementations |
-| **mcp-builder** | Create high-quality MCP servers that enable LLMs to interact with external services through well-designed tools | MCP protocol, agent-centric design, workflow optimization, Python/Node implementations |
-
-### File Processing & Office Tools (4)
-*Document, presentation, and spreadsheet manipulation*
-
-| Command | Purpose | Key Features |
-|---------|---------|--------------|
-| **pdf** | Comprehensive PDF processing toolkit - extract text/tables, create PDFs, merge/split, handle forms | pypdf operations, form handling, image conversion, JavaScript pdf-lib, table extraction |
-| **docx** | Create, edit, and manipulate Word documents with JavaScript library and XML manipulation | docx library, raw XML editing, comments, tracked changes, validation schemas |
-| **pptx** | Create, edit, and analyze PowerPoint presentations with HTML conversion, XML manipulation, and design principles | Design-first approach, color palettes, HTML-to-PPTX conversion, XML structure access |
-| **xlsx** | Create, edit, and analyze spreadsheets with formulas, formatting, data analysis, and visualization | Formula requirements, pandas/openpyxl workflows, financial modeling standards, recalculation tools |
-
-### Web & API Integration (2)
-*Web application testing and API integration*
-
-| Command | Purpose | Key Features |
-|---------|---------|--------------|
-| **webapp-testing** | Test local web applications using Playwright - verify functionality, debug UI, capture screenshots | Playwright setup, server management, reconnaissance pattern, common testing patterns |
-| **theme-factory** | Apply professional themes to artifacts - 10 curated themes with color palettes and font pairings | 10 pre-built themes, theme showcase, custom theme creation, application standards |
-
-### Creative & Animation (1)
-*Animation and visual creativity*
-
-| Command | Purpose | Key Features |
-|---------|---------|--------------|
-| **slack-gif-creator** | Create animated GIFs optimized for Slack with size validation and composable animation primitives | Slack size constraints, validation tools, animation primitives (shake, bounce, spin, etc.), optimization strategies |
-
-## Usage
-
-Each command can be invoked in Droid with:
-```
-/command-name <optional-arguments>
-```
-
-Arguments should match the `argument-hint` specified in each command's YAML frontmatter.
-
-## Transformation Process
-
-These commands were transformed from Claude skills located in `~/.factory/commands/` according to Factory.ai CLI formatting requirements. Each skill was renamed from `SKILL.md` to `{skill-name}.md` and reformatted with proper YAML frontmatter for Droid compatibility.

package/packages/droid/commands/algorithmic-art/templates/generator_template.js

@@ -1,223 +0,0 @@
-/**
- * ═══════════════════════════════════════════════════════════════════════════
- *                  P5.JS GENERATIVE ART - BEST PRACTICES
- * ═══════════════════════════════════════════════════════════════════════════
- *
- * This file shows STRUCTURE and PRINCIPLES for p5.js generative art.
- * It does NOT prescribe what art you should create.
- *
- * Your algorithmic philosophy should guide what you build.
- * These are just best practices for how to structure your code.
- *
- * ═══════════════════════════════════════════════════════════════════════════
- */
-
-// ============================================================================
-// 1. PARAMETER ORGANIZATION
-// ============================================================================
-// Keep all tunable parameters in one object
-// This makes it easy to:
-// - Connect to UI controls
-// - Reset to defaults
-// - Serialize/save configurations
-
-let params = {
-    // Define parameters that match YOUR algorithm
-    // Examples (customize for your art):
-    // - Counts: how many elements (particles, circles, branches, etc.)
-    // - Scales: size, speed, spacing
-    // - Probabilities: likelihood of events
-    // - Angles: rotation, direction
-    // - Colors: palette arrays
-
-    seed: 12345,
-    // define colorPalette as an array -- choose whatever colors you'd like ['#d97757', '#6a9bcc', '#788c5d', '#b0aea5']
-    // Add YOUR parameters here based on your algorithm
-};
-
-// ============================================================================
-// 2. SEEDED RANDOMNESS (Critical for reproducibility)
-// ============================================================================
-// ALWAYS use seeded random for Art Blocks-style reproducible output
-
-function initializeSeed(seed) {
-    randomSeed(seed);
-    noiseSeed(seed);
-    // Now all random() and noise() calls will be deterministic
-}
-
-// ============================================================================
-// 3. P5.JS LIFECYCLE
-// ============================================================================
-
-function setup() {
-    createCanvas(800, 800);
-
-    // Initialize seed first
-    initializeSeed(params.seed);
-
-    // Set up your generative system
-    // This is where you initialize:
-    // - Arrays of objects
-    // - Grid structures
-    // - Initial positions
-    // - Starting states
-
-    // For static art: call noLoop() at the end of setup
-    // For animated art: let draw() keep running
-}
-
-function draw() {
-    // Option 1: Static generation (runs once, then stops)
-    // - Generate everything in setup()
-    // - Call noLoop() in setup()
-    // - draw() doesn't do much or can be empty
-
-    // Option 2: Animated generation (continuous)
-    // - Update your system each frame
-    // - Common patterns: particle movement, growth, evolution
-    // - Can optionally call noLoop() after N frames
-
-    // Option 3: User-triggered regeneration
-    // - Use noLoop() by default
-    // - Call redraw() when parameters change
-}
-
-// ============================================================================
-// 4. CLASS STRUCTURE (When you need objects)
-// ============================================================================
-// Use classes when your algorithm involves multiple entities
-// Examples: particles, agents, cells, nodes, etc.
-
-class Entity {
-    constructor() {
-        // Initialize entity properties
-        // Use random() here - it will be seeded
-    }
-
-    update() {
-        // Update entity state
-        // This might involve:
-        // - Physics calculations
-        // - Behavioral rules
-        // - Interactions with neighbors
-    }
-
-    display() {
-        // Render the entity
-        // Keep rendering logic separate from update logic
-    }
-}
-
-// ============================================================================
-// 5. PERFORMANCE CONSIDERATIONS
-// ============================================================================
-
-// For large numbers of elements:
-// - Pre-calculate what you can
-// - Use simple collision detection (spatial hashing if needed)
-// - Limit expensive operations (sqrt, trig) when possible
-// - Consider using p5 vectors efficiently
-
-// For smooth animation:
-// - Aim for 60fps
-// - Profile if things are slow
-// - Consider reducing particle counts or simplifying calculations
-
-// ============================================================================
-// 6. UTILITY FUNCTIONS
-// ============================================================================
-
-// Color utilities
-function hexToRgb(hex) {
-    const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
-    return result ? {
-        r: parseInt(result[1], 16),
-        g: parseInt(result[2], 16),
-        b: parseInt(result[3], 16)
-    } : null;
-}
-
-function colorFromPalette(index) {
-    return params.colorPalette[index % params.colorPalette.length];
-}
-
-// Mapping and easing
-function mapRange(value, inMin, inMax, outMin, outMax) {
-    return outMin + (outMax - outMin) * ((value - inMin) / (inMax - inMin));
-}
-
-function easeInOutCubic(t) {
-    return t < 0.5 ? 4 * t * t * t : 1 - Math.pow(-2 * t + 2, 3) / 2;
-}
-
-// Constrain to bounds
-function wrapAround(value, max) {
-    if (value < 0) return max;
-    if (value > max) return 0;
-    return value;
-}
-
-// ============================================================================
-// 7. PARAMETER UPDATES (Connect to UI)
-// ============================================================================
-
-function updateParameter(paramName, value) {
-    params[paramName] = value;
-    // Decide if you need to regenerate or just update
-    // Some params can update in real-time, others need full regeneration
-}
-
-function regenerate() {
-    // Reinitialize your generative system
-    // Useful when parameters change significantly
-    initializeSeed(params.seed);
-    // Then regenerate your system
-}
-
-// ============================================================================
-// 8. COMMON P5.JS PATTERNS
-// ============================================================================
-
-// Drawing with transparency for trails/fading
-function fadeBackground(opacity) {
-    fill(250, 249, 245, opacity); // Anthropic light with alpha
-    noStroke();
-    rect(0, 0, width, height);
-}
-
-// Using noise for organic variation
-function getNoiseValue(x, y, scale = 0.01) {
-    return noise(x * scale, y * scale);
-}
-
-// Creating vectors from angles
-function vectorFromAngle(angle, magnitude = 1) {
-    return createVector(cos(angle), sin(angle)).mult(magnitude);
-}
-
-// ============================================================================
-// 9. EXPORT FUNCTIONS
-// ============================================================================
-
-function exportImage() {
-    saveCanvas('generative-art-' + params.seed, 'png');
-}
-
-// ============================================================================
-// REMEMBER
-// ============================================================================
-//
-// These are TOOLS and PRINCIPLES, not a recipe.
-// Your algorithmic philosophy should guide WHAT you create.
-// This structure helps you create it WELL.
-//
-// Focus on:
-// - Clean, readable code
-// - Parameterized for exploration
-// - Seeded for reproducibility
-// - Performant execution
-//
-// The art itself is entirely up to you!
-//
-// ============================================================================