Code Panel

설정 화면에서 쓰는 밝은 코드 패널입니다.

@horon-ai/react 표시

Preview

---
name: weekly-investor-update
description: Draft the Friday investor email
---

1. Pull MRR, burn and runway from Stripe.
2. Summarize shipped work from Linear.
3. Keep it under 200 words, plain tone.

Usage

tsx

import { CodeKey, CodePanel } from "@horon-ai/react";

export default function CodePanelDemo() {
  return (
    <>
      <CodePanel className="w-full max-w-126.5">
        {"---\n"}
        <CodeKey>name:</CodeKey> weekly-investor-update{"\n"}
        <CodeKey>description:</CodeKey> Draft the Friday investor email{"\n"}
        {"---\n\n"}
        {"1. Pull MRR, burn and runway from Stripe.\n"}
        {"2. Summarize shipped work from Linear.\n"}
        {"3. Keep it under 200 words, plain tone."}
      </CodePanel>
    </>
  );
}