optcg-card-rules

Reusable Poneglyph card rules text renderer for One Piece Card Game card text.

import { CardRulesText, TriggerBlock } from "optcg-card-rules";
import "optcg-card-rules/styles.css";

<CardRulesText text="[On Play] Draw 1 card." />
<TriggerBlock text="[Trigger] Draw 1 card." />

The renderer keeps badges visually clean while preserving bracket markers in selectable/copied text. For example, a rendered On Play badge copies as [On Play].

Router Links

By default, quoted card names and trait references render as normal anchors to /search?q=.... Apps with their own router can inject link rendering:

<CardRulesText
  text={'Add up to 1 "Monkey.D.Luffy" card.'}
  renderSearchLink={({ href, children }) => <Link to={href}>{children}</Link>}
/>

Counter Icon

The package includes optcg-card-rules/counter.svg. The component defaults to /counter.svg to match the current web asset path. Apps can pass counterIconSrc if the asset is served somewhere else.