npm

@pxljp/pxl-player-react
TypeScript icon, indicating that this package has built-in type declarations

0.2.2 • Public • Published

Pxl Player React

Pxl Player React is a wrapper of the Pxl Player for React projects.

Install

npm i --save @pxljp/pxl-player-react

Usage

Parameters

export type PxlPlayerInitOptions = {
  eventId: string; // Event from pxl
  clientId: string; // Your OAuth2 client id
  code: string; // Code for OAuth2 authentication
  endpoint: string; // Endpoint used with `domain` to call for authentification
  domain: string; // Your pxl domain address (https://XXX.asn.jp)
  rootElement: RootElement; // The HTML element to add the pxl player as child
  i18n?: Language; // optional, en_US by default, interface language setup (en_US or ja_JP)
};
Attribute Type required? default value Description
eventId string required none Event id coming from admin.pxl
clientId string required none OAuth2 client id
code string required none OAuth2 code used for authentication
endpoint string required none OAuth2 endpoint used with domain
domain string required none Domain URL of your pxl artist (https://XXX.asn.jp)
rootElement HTMLElement or Element required none The HTML element to add the pxl player as child
i18n string optional en_US Interface language (en_US or ja_JP)
export const PagePlayer = () => {
  const element = useRef<HTMLDivElement>(null);

  initPxlPlayer({
    rootElement: element.current,
    clientId: 'XXXX',
    code: 'YYYY',
    endpoint: 'uri/to/endpoint',
    eventId: 'EVENT-ID-XXXX-YYYY-ZZZZ',
    domain: 'https://YOUR-ARTIST.asn.jp/',
    i18n: 'en_US',
    useChat: false,
  });
  return (
    <>
      <div ref={element} />
    </>
  );
};

Readme

Keywords

none

Package Sidebar

Install

npm i @pxljp/pxl-player-react

Weekly Downloads

0

Version

0.2.2

License

MIT

Unpacked Size

33.8 kB

Total Files

8

Last publish

Collaborators

  • magicaltux
  • jvinai