output

name	output
description	Prevent AI laziness by enforcing complete, unabridged, and production-ready code generation.

Output

Eliminate incomplete implementations, placeholder comments, and "implement later" stubs. Ensure every line of code delivered is ready to run.

---

What This Skill Does

This skill overrides the AI's tendency to truncate long files or skip "repetitive" logic. It mandates that every component is fully formed with all states and real data structures.

---

Rules

1. No Placeholders: BANNED patterns include // ..., // rest of logic, // TODO, /* implement here */.
2. The 8-State Rule: Interactive components must ship with styling for: Default, Hover, Focus, Active, Disabled, Loading, Error, and Empty.
3. Structured Mock Data: Use real-world data structures (names, dates, prices) instead of item-1, item-2.
4. Full File Delivery: If asked for a file, output the entire file. Do not omit imports or export statements to save space.
5. Types are Real: No any or unknown in TypeScript unless technically unavoidable. Every prop must be typed and used.
6. Error Handling: Every async operation must have a real catch block or error state UI. No silent failures.

---

What to Always Do

• Cross-check scope: Count the requested deliverables and verify all are present before finishing.
• Implement the "boring" parts: Write the accessibility labels, the focus rings, and the mobile collapse logic.
• Break long outputs cleanly: If the token limit is a risk, stop at a logical file boundary and ask to continue.
• Use real icons: If an icon is needed, use an actual library (lucide, phosphor) instead of a placeholder div.

---

What to Never Do

• Never skip repetitive logic: If a layout has 4 cards, write the code for all 4 (or use a map with a real array).
• Never leave dead code: Remove unused imports, variables, and props before delivery.
• Never say "I'll leave this to you": If the user asked for it, build it.

---

Settings

• COMPLETENESS_DEPTH (Default: 10): 1 = Skeleton only, 10 = Exhaustive/Full-State.

---

Examples

Before (Lazy AI)

function UserProfile() {
  return (
    <div>
      <h1>User Name</h1>
      {/* TODO: Add profile image and bio */}
    </div>
  )
}

After (Output Applied)

interface UserProfileProps {
  name: string;
  bio: string;
  avatarUrl: string;
}

export function UserProfile({ name, bio, avatarUrl }: UserProfileProps) {
  if (!name) return <div className="p-4 text-red-500">Error: Missing user data</div>;

  return (
    <div className="flex items-center gap-4 p-6 rounded-xl border border-zinc-200">
      <img 
        src={avatarUrl} 
        alt={name} 
        className="w-16 h-16 rounded-full object-cover bg-zinc-100" 
      />
      <div>
        <h1 className="text-lg font-semibold text-zinc-900">{name}</h1>
        <p className="text-sm text-zinc-500 leading-relaxed">{bio}</p>
      </div>
    </div>
  );
}