@readyplayerme/react-avatar-creator/dist/index.d.ts

Ready Player Me - React Avatar Creator

import { FC, CSSProperties } from 'react';

type BodyType = 'halfbody' | 'fullbody';
type Language = 'en' | 'en-IE' | 'de' | 'fr' | 'es' | 'es-MX' | 'it' | 'pt' | 'pt-BR' | 'tr' | 'ja' | 'kr' | 'ch';
type AvatarCreatorConfig = {
    clearCache?: boolean;
    bodyType?: BodyType;
    quickStart?: boolean;
    language?: Language;
    token?: string;
    avatarId?: string;
};
type IFrameEvent<TPayload> = {
    eventName?: string;
    source?: string;
    data: TPayload;
};

type UserSetEventPayload = {
    id: string;
};
type UserSetEvent = IFrameEvent<UserSetEventPayload>;

type AssetUnlockedEventPayload = {
    userId: string;
    assetId: string;
};
type AssetUnlockedEvent = IFrameEvent<AssetUnlockedEventPayload>;

type UserAuthorizedEventPayload = {
    url: string;
};
type UserAuthorizedEvent = IFrameEvent<UserAuthorizedEventPayload>;

type AvatarExportedEventPayload = {
    url: string;
    userId: string;
    avatarId: string;
};
type AvatarExportedEvent = IFrameEvent<AvatarExportedEventPayload>;

type AvatarCreatorEvent = UserSetEvent | AssetUnlockedEvent | UserAuthorizedEvent | AvatarExportedEvent;

type AvatarCreatorRawProps = {
    subdomain: string;
    className?: string;
    style?: CSSProperties;
    config?: AvatarCreatorConfig;
};
type EventReceivedProps = {
    onEventReceived?: (event: AvatarCreatorEvent) => void;
};
/**
 * AvatarCreatorRaw is a React component that allows you to create an avatar using Ready Player Me and receive avatar URL. It exposes the raw events in one callback to allow you to write more custom logic around the event handling.
 * @param subdomain The subdomain of your Ready Player Me instance.
 * @param className The css classes to apply to this iframe.
 * @param style The css styles to apply to this iframe.
 * @param avatarCreatorConfig The configuration for the AvatarCreator component.
 * @param onEventReceived A callback that is called when an avatar creator event is received.
 * @returns A React component.
 */
declare const AvatarCreatorRaw: FC<AvatarCreatorRawProps & EventReceivedProps>;

type AvatarCreatorProps = {
    onUserSet?: (event: UserSetEvent) => void;
    onAvatarExported?: (event: AvatarExportedEvent) => void;
    onUserAuthorized?: (event: UserAuthorizedEvent) => void;
    onAssetUnlock?: (event: AssetUnlockedEvent) => void;
} & AvatarCreatorRawProps;
/**
 * AvatarCreator is a React component that allows you to create an avatar using Ready Player Me and receive avatar URL. It wraps AvatarCreatorRaw to provide more type safety, and to provide explicit callbacks per event type.
 * @param subdomain The subdomain of your Ready Player Me instance.
 * @param className The css classes to apply to this iframe.
 * @param style The css styles to apply to this iframe.
 * @param config The configuration for the AvatarCreator component.
 * @param onUserSet A callback that is called when a user is set.
 * @param onAvatarExported A callback that is called when an avatar is exported.
 * @param onUserAuthorized A callback that is called when a user is authorized.
 * @param onAssetUnlock A callback that is called when an asset unlock button is pressed in RPM.
 * @returns A React component.
 */
declare const AvatarCreator: FC<AvatarCreatorProps>;

export { AssetUnlockedEvent, AssetUnlockedEventPayload, AvatarCreator, AvatarCreatorConfig, AvatarCreatorEvent, AvatarCreatorRaw, AvatarExportedEvent, AvatarExportedEventPayload, BodyType, IFrameEvent, Language, UserAuthorizedEvent, UserAuthorizedEventPayload, UserSetEvent, UserSetEventPayload };