#CharacterMarkMirror

import { CharacterMark, CharacterMarkMirror } from '@aora-bot/react';

export default function Demo() {
  return (
    <div className="site-demo">
      <div className="site-demo__cell">
        <CharacterMark sourceId="demo-source" shape="hex" color="blue" state="orbit" sizePx={92} />
        <span className="site-demo__label">source</span>
      </div>
      {(['red', 'green', 'violet', 'orange'] as const).map((color) => (
        <div className="site-demo__cell" key={color}>
          <CharacterMarkMirror sourceId="demo-source" color={color} sizePx={92} />
          <span className="site-demo__label">mirror</span>
        </div>
      ))}
    </div>
  );
}