React と組み合わせて使う

@charcoal-ui/react<Icon>コンポーネントが収録されているので、基本的にはそちらを利用してください。


@charcoal-ui/reactを使わない場合

Custom ElementはclassNameというpropsを受け取ることが通常できません。

Custom elements accept class rather than className, and for rather thanhtmlFor.
React公式ドキュメントより

もしstyled-componentsなどを使っていてclassNameを渡せないと困るケースでは、ラッパーコンポーネントを作ることができます。

import { Props as IconProps } from '@charcoal-ui/icons'

interface Props extends Omit<IconProps, 'class'> {
  className?: string
}

export const Icon: React.FC<Props> = ({ className, ...props }) => (
  <pixiv-icon class={className} {...props} />
)