charter-first

Fetch charter data before editing React .tsx files with sibling .charter.md.

Updated May 14, 2024
One-click install
npx skills add https://github.com/wagnerra23/oimpresso.com --skill charter-first
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: charter-first
Source: https://github.com/wagnerra23/oimpresso.com/tree/main/.claude/skills/charter-first
Command: npx skills add https://github.com/wagnerra23/oimpresso.com --skill charter-first

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Prevents AI from making unsafe or non-compliant UI changes by forcing the active charter contract to be loaded before editing any .tsx file that has a neighboring .charter.md, reducing drift from agreed mission, invariants, UX targets, and anti-hooks.

Core Features & Use Cases

  • Pre-edit charter enforcement: Ensures the charter is fetched first when working on pages/features with a matching .charter.md next to them (Charter > Spec).
  • Live mission/goals invariants: Loads the canonical sections (Mission, Goals, Non-Goals, UX targets, automation hooks, and Anti-hooks) so edits follow production-approved intent.
  • Draft safety warnings: When charters are in draft/rascunho/proposto status, surfaces warnings about missing or sensitive sections (especially Non-Goals and Anti-hooks) to avoid hallucinated constraints.

Quick Start

Before editing the file resources/js/Pages/Repair/Index.tsx, ask the AI to call the MCP tool charter-fetch with page_id set to the related Index.charter.md.

Frequently Asked Questions about charter-first

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I enforce UI editing guardrails when modifying React .tsx files?

Contract-driven development anchors UI edits by loading a charter contract containing mission, goals, invariants, and anti-hooks before implementation. This prevents AI from making unsafe or non-compliant changes to React .tsx files.

How do I fetch a charter contract before editing a React page?

To fetch a charter contract, call the MCP tool charter-fetch with the page_id parameter set to the target .charter.md file. This loads canonical sections including Mission, Goals, Non-Goals, UX targets, and Anti-hooks before implementation work begins.

Does charter enforcement work with React files that have no sibling .charter.md?

Charter enforcement applies only to React .tsx files that have a sibling .charter.md file in the same directory. If no charter file exists, the contract-driven development guardrails will not trigger for that editing task.

What happens when I edit a React page with a draft charter status?

When a charter status is draft, rascunho, or proposto, the system surfaces warnings about missing or sensitive sections like Non-Goals and Anti-hooks. This prevents hallucinated constraints and avoids unsafe UI edits based on incomplete contracts.

Why do my React UI edits keep drifting from the agreed project mission?

UI edits drift when the active charter contract is not loaded before implementation. Forcing the charter fetch first anchors changes to production-approved intent, invariants, and UX targets, reducing drift from the agreed project mission.