/react-niconico

Overlay text like Niconico

Primary LanguageTypeScriptMIT LicenseMIT

react-niconico

CI npm version

Overlay text like Niconico.

Online demo: https://react-niconico.vercel.app/

Installation

Using yarn:

$ yarn add react-niconico

Using npm:

$ npm install react-niconico

Usage

import * as React from "react";
import { useEffect } from "react";
import { useNiconico } from "react-niconico";

export const App = () => {
  const [ref, emitText] = useNiconico();

  useEffect(() => {
    emitText("short text");
    emitText("looooooooooooong text");
  }, [emitText]);

  return <video ref={ref} src="/sample.mp4" />;
};

Options

const [ref, emitText] = useNiconico({
  // options...
});
name type required description default
displayMillis number optional time to display text in milliseconds 5_000
fontSize number optional font size of text 36
lineWidth number optional width of the text border 4

License

MIT