myroom-react/dist/index.d.mts

React component wrapper for MyRoom 3D scene

import React from 'react';
import { Scene, AbstractEngine } from '@babylonjs/core';
export { Engine, Scene } from '@babylonjs/core';

interface ActiveMovement {
    forward: boolean;
    backward: boolean;
    left: boolean;
    right: boolean;
    turnLeft: boolean;
    turnRight: boolean;
    jump: boolean;
    run: boolean;
    wave: boolean;
    dance: boolean;
}
interface TouchMovement {
    x: number;
    y: number;
    isMoving: boolean;
    durationBoost?: number;
}
interface TouchRotation {
    delta: number;
}
interface PartItem {
    name: string;
    fileName: string | null;
}
interface GenderSelectableParts {
    hair: PartItem[];
    top: PartItem[];
    bottom?: PartItem[];
    shoes?: PartItem[];
    accessory?: PartItem[];
    fullset?: PartItem[];
}
interface GenderFixedParts {
    body: string;
}
interface GenderDefaultColors {
    hair?: string;
    top?: string;
    bottom?: string;
    shoes?: string;
    accessory?: string;
    fullset?: string;
    [key: string]: string | undefined;
}
interface GenderData {
    fixedParts: GenderFixedParts;
    selectableParts: GenderSelectableParts;
    defaultColors: GenderDefaultColors;
}
interface AvailableParts {
    male: GenderData;
    female: GenderData;
}
interface AvatarPartPaths {
    body: string;
    hair: string | null;
    top: string | null;
    bottom?: string | null;
    shoes?: string | null;
    accessory?: string | null;
    [key: string]: string | null | undefined;
}
interface AvatarColors {
    hair?: string;
    top?: string;
    bottom?: string;
    shoes?: string;
    accessory?: string;
    [key: string]: string | undefined;
}
type Gender = keyof AvailableParts;
interface AvatarConfig {
    gender: Gender;
    parts: AvatarPartPaths;
    colors: AvatarColors;
}
interface LoadedItem {
    id: string;
    name: string;
    path: string;
    position: {
        x: number;
        y: number;
        z: number;
    };
    rotation?: {
        x: number;
        y: number;
        z: number;
    };
    scale?: {
        x: number;
        y: number;
        z: number;
    };
}

interface MyRoomSceneProps {
    roomPath?: string;
    gender?: Gender;
    width?: string;
    height?: string;
    autoplay?: boolean;
    avatarConfig?: AvatarConfig;
    enableControls?: boolean;
    cameraControls?: boolean;
    loadedItems?: LoadedItem[];
    gizmoMode?: 'position' | 'rotation' | 'scale';
    onSceneReady?: (scene: Scene, engine: AbstractEngine) => void;
    onAvatarChanged?: (config: AvatarConfig) => void;
    onItemSelected?: (item: any) => void;
    onCameraMoved?: (position: any, target: any) => void;
    onError?: (error: any) => void;
    className?: string;
    style?: React.CSSProperties;
}
interface MyRoomSceneRef {
    resetCamera: () => void;
    changeAvatar: (config: AvatarConfig) => Promise<void>;
    loadItems: (items: LoadedItem[]) => Promise<void>;
    getScene: () => Scene | null;
    getEngine: () => AbstractEngine | null;
}
/**
 * MyRoomScene - A React component wrapper for the MyRoom 3D scene system
 */
declare const MyRoomScene: React.ForwardRefExoticComponent<MyRoomSceneProps & React.RefAttributes<MyRoomSceneRef>>;

interface IntegratedBabylonSceneProps {
    roomPath?: string;
    avatarConfig?: AvatarConfig;
    activeMovement?: ActiveMovement;
    touchMovement?: TouchMovement;
    loadedItems?: LoadedItem[];
    onSceneReady?: (scene: any) => void;
    gizmoMode?: 'position' | 'rotation' | 'scale';
    onGizmoModeChange?: (mode: 'position' | 'rotation' | 'scale') => void;
    selectedItem?: any;
    onSelectItem?: (item: any) => void;
    onItemTransformChange?: (itemId: string, transform: {
        position: {
            x: number;
            y: number;
            z: number;
        };
        rotation: {
            x: number;
            y: number;
            z: number;
        };
        scale: {
            x: number;
            y: number;
            z: number;
        };
    }) => void;
    onToggleUIOverlay?: () => void;
    onError?: (error: any) => void;
}
interface IntegratedBabylonSceneRef {
    resetCamera: () => void;
}

declare const availablePartsData: {
    male: {
        fixedParts: {
            body: string;
        };
        selectableParts: {
            hair: {
                name: string;
                fileName: string;
            }[];
            top: {
                name: string;
                fileName: string;
            }[];
            bottom: {
                name: string;
                fileName: string;
            }[];
            shoes: {
                name: string;
                fileName: string;
            }[];
            accessory: {
                name: string;
                fileName: string;
            }[];
            fullset: {
                name: string;
                fileName: string;
            }[];
        };
        defaultColors: {
            hair: string;
            top: string;
            bottom: string;
            shoes: string;
            accessory: string;
        };
    };
    female: {
        fixedParts: {
            body: string;
        };
        selectableParts: {
            hair: {
                name: string;
                fileName: string;
            }[];
            top: {
                name: string;
                fileName: string;
            }[];
            bottom: {
                name: string;
                fileName: string;
            }[];
            shoes: {
                name: string;
                fileName: string;
            }[];
            accessory: {
                name: string;
                fileName: string;
            }[];
            fullset: {
                name: string;
                fileName: string;
            }[];
        };
        defaultColors: {
            hair: string;
            top: string;
            bottom: string;
            shoes: string;
            accessory: string;
        };
    };
};
/**
 * Get default avatar configuration for a specific gender
 */
declare function getDefaultConfigForGender(gender: Gender): AvatarConfig;
/**
 * Get available parts for a specific gender and part type
 */
declare function getAvailableParts(gender: Gender, partType: string): {
    name: string;
    fileName: string;
}[] | {
    name: string;
    fileName: string;
}[] | {
    name: string;
    fileName: string;
}[] | {
    name: string;
    fileName: string;
}[] | {
    name: string;
    fileName: string;
}[] | {
    name: string;
    fileName: string;
}[] | {
    name: string;
    fileName: string;
}[] | {
    name: string;
    fileName: string;
}[] | {
    name: string;
    fileName: string;
}[] | {
    name: string;
    fileName: string;
}[] | {
    name: string;
    fileName: string;
}[] | {
    name: string;
    fileName: string;
}[];
/**
 * Get default colors for a specific gender
 */
declare function getDefaultColorsForGender(gender: Gender): {
    hair: string;
    top: string;
    bottom: string;
    shoes: string;
    accessory: string;
} | {
    hair: string;
    top: string;
    bottom: string;
    shoes: string;
    accessory: string;
};

declare const MyRoomDemo: React.FC;

/**
 * Simple example showing basic usage of MyRoomScene component
 */
declare const SimpleExample: React.FC;

/**
 * Advanced example showing complex usage of MyRoomScene component
 */
declare const AdvancedExample: React.FC;

export { type ActiveMovement, AdvancedExample, type AvailableParts, type AvatarColors, type AvatarConfig, type AvatarPartPaths, type Gender, type GenderData, type GenderDefaultColors, type GenderFixedParts, type GenderSelectableParts, type IntegratedBabylonSceneProps, type IntegratedBabylonSceneRef, type LoadedItem, MyRoomDemo, MyRoomScene, type MyRoomSceneProps, type MyRoomSceneRef, type PartItem, SimpleExample, type TouchMovement, type TouchRotation, availablePartsData, getAvailableParts, getDefaultColorsForGender, getDefaultConfigForGender };