@agentica/prompt-jsx

Prompt-JSX

Prompt-JSX is a library that allows you to structure and write AI prompts using JSX syntax. By using a React-like syntax to compose prompts as components, it significantly improves the readability and reusability of prompts.

Features

• 🎯 Structured Prompts: Write prompts in a logical, hierarchical structure using JSX
• 📝 Type Safety: Type checking for prompts with TypeScript support
• 🔄 Reusability: Reuse prompt elements with component-based structure
• 🎨 Readability: Easily understand complex prompts with visually clear structure

Installation

npm install @wrtnlabs/prompt-jsx

Configuration

TypeScript Configuration

// tsconfig.json
{
  "compilerOptions": {
    "jsx": "react-jsx",
    "jsxImportSource": "@wrtnlabs/prompt-jsx"
  }
}

Usage Example

import { jsx } from "@wrtnlabs/prompt-jsx";

const prompt = (
  <prompt>
    <instruction>
      You are a friendly AI assistant. Please provide clear and accurate
      responses to user questions.
    </instruction>

    <examples>
      <input>What is Python?</input>
      <output>
        Python is a simple and easy-to-learn programming language. It is known
        for its high readability and extensive library ecosystem.
      </output>
    </examples>

    <context>
      This conversation is for educational purposes, aimed at programming
      beginners.
    </context>

    <persona>
      You are a senior developer and educator with 10 years of experience. You
      enjoy explaining complex concepts in simple terms.
    </persona>
  </prompt>
);

Supported Elements

Prompt Elements

• <prompt>: Root element for the prompt
• <instruction>: Main instructions for the AI
• <examples>: Contains example inputs and outputs
• <context>: Background information or context for the prompt
• <input>: Example input
• <output>: Example output
• <persona>: Defines the AI's role or personality
• <role>: Specifies the AI's expertise or role

Formatting Elements

• <br/>: Line break
• <strong>: Bold text
• <code lang="javascript">: Code block (with optional language specification)

Benefits

• Structured Prompts

  • Clearly separate different parts of the prompt using JSX's hierarchical structure
  • Easily visualize the prompt structure

• Type Safety

  • Prevent errors during prompt writing with TypeScript type checking
  • IDE autocompletion support

• Reusability

  • Create reusable components from common prompt elements
  • Easy prompt template creation

• Maintainability

  • Manage prompts in a structured format
  • Easy to modify and update prompts

License

MIT