@eyeon/threejs-map 1.1.1

package/dist/interfaces/index.d.ts

@@ -0,0 +1,93 @@
+import { Color, Intersection, Material, Mesh, MeshLambertMaterial, Object3D, ShapeGeometry, Vector3 } from 'three';
+import { Graph } from 'ngraph.graph';
+import { MapResponsiveSettings } from './mapApiTypes';
+export type MapMode = 'view' | 'edit';
+export type MapRole = 'PORTAL' | 'DISPLAY_APP' | 'WP_SITE' | 'PORTAL_KIOSK' | 'PORTAL_RESPONSIVE' | 'DEMO';
+export type MapRenderMode = '2D' | '3D';
+export type MapDeviceType = 'display_app' | 'desktop' | 'tablet' | 'mobile';
+export interface MapConfigProps {
+    CENTER_ID: number;
+    KIOSK_ID: number;
+    ROLE: MapRole;
+    DEVICE: MapDeviceType;
+    STYLE: MapRenderMode;
+    STATS: boolean;
+    DEBUG: boolean;
+    IMAGE_PROXY_URL?: string;
+    CAMERA_CONTROLS_STATES: MapResponsiveSettings;
+    DEFAULT_CONTROLS_TARGET: null;
+    ORIGINAL_CAMERA_POSITION: null;
+    BASE_COLOR: Color;
+    OVERLAY_OPACITY: number;
+    DEFAULT_CAMERA_POSITION: null;
+    BOUNDARY_THICKNESS: number;
+    SELECTED_RETAILER_ID?: number;
+    STORE_TEXT_COLOR: Color;
+    STORE_HEIGHT: number;
+    WALL_THICKNESS: number;
+    DEFAULT_SELECTED_STORE: string | null;
+    BOUNDARY_COLOR: Color;
+    CAMERA: {
+        minDistance: number;
+        maxDistance: number;
+        animSpeed: number;
+        far?: number;
+        fov?: number;
+    };
+    WALL_COLOR: Color;
+    OVERLAY_COLOR: Color;
+    ACCENT_COLOR: Color;
+    STORE_DEFAULT_COLOR: Color;
+    MAP_BACKGROUND_COLOR: Color;
+    KIOSK_SIZE: number;
+    ZOOM_STEP: number;
+    SELECTED_ZOOM_LIMIT: number;
+}
+export interface IMeshValues {
+    mesh: IExtMesh;
+    geometry: ShapeGeometry;
+    material: Material;
+    object_id: string;
+    mesh_type: string | null;
+    floor_index: number;
+    visible: boolean;
+    renderOrder: number;
+    route_node_id?: string | null;
+}
+export interface MeshFloorsProps {
+    meshParams: IMeshValues[][];
+    textParams: {
+        textMesh: IExtMesh;
+    }[][];
+    storeLogos: {
+        storeLogo: IExtMesh;
+    }[][];
+    drawText?: Function;
+    pathFinderGraph: Graph<any, any>;
+    escalator_nodes: string[];
+    allSvgObjectIds: Set<string>;
+}
+export interface IExtMeshLambertMaterial extends MeshLambertMaterial {
+    colorDefault?: Color;
+    active?: boolean;
+}
+export interface IExtMesh extends Mesh {
+    object_id?: string | null;
+    mesh_type?: string | null;
+    floor_index?: number;
+    route_node_id?: string | null;
+    escalator_id?: string | null;
+    goToFloor?: {
+        index: number;
+        direction: string;
+    };
+}
+export interface IExtShapeGeometry extends ShapeGeometry {
+    faces: Vector3[];
+}
+export interface ExIntersection extends Intersection {
+    eventObject: Object3D | IExtMesh;
+}
+export interface ZoomData {
+    direction: 'in' | 'out';
+}

package/dist/interfaces/mapApiTypes.d.ts

@@ -0,0 +1,90 @@
+import { MapAmenityID } from '../helpers/amenities.helper';
+import { PortalMapSettingsProps } from './portal';
+import { MapConfigProps } from '.';
+export interface MapRetailer {
+    id: number;
+    global_retailer_id: number;
+    index?: number;
+    retail_name: string;
+    slug: string;
+    location: string;
+    retailer_phone: string;
+    retailer_description: string;
+    logo: string;
+    map_obj_name: string;
+}
+export interface MapRetailerSingle extends MapRetailer {
+    opening_hours: Record<string, {
+        startTime: string;
+        endTime: string;
+        isClosed: boolean;
+    }>;
+}
+export interface MapObjData {
+    id?: number;
+    center_id?: number;
+    retailer_id: number | null;
+    kiosk_id: number | null;
+    map_obj_name: string;
+    obj_type: 'retailer' | 'special' | 'custom';
+    layer_type: 'retail_name' | 'retail_logo' | 'retail_text' | 'kiosk' | 'amenity' | 'custom_image' | 'custom_text';
+    value: MapAmenityID | string;
+    custom_text: string | null;
+    custom_image: string | null;
+    bg_color: string | null;
+    transparent: boolean;
+    text_color: string | null;
+    size: number;
+    rotate: number;
+    offset_x: number;
+    offset_y: number;
+    lock_size: boolean;
+}
+export interface MapFloor {
+    id: number;
+    name: string;
+    svgUrl: string;
+}
+export interface MapKiosk {
+    id: number;
+    name: string;
+    map_obj_name?: string;
+}
+export interface MapVectorPoint {
+    x: number;
+    y: number;
+    z: number;
+}
+export type MapCameraControlsState = {
+    camera: MapVectorPoint;
+    controls: MapVectorPoint;
+};
+export interface FloorMapResponsiveSettings {
+    display_app: MapCameraControlsState;
+    desktop: MapCameraControlsState;
+    tablet: MapCameraControlsState;
+    mobile: MapCameraControlsState;
+    id?: number;
+    floor_id: number;
+}
+export interface MapResponsiveSettings {
+    display_app: MapCameraControlsState;
+    desktop: MapCameraControlsState;
+    tablet: MapCameraControlsState;
+    mobile: MapCameraControlsState;
+    perFloor: {
+        [floorId: number]: FloorMapResponsiveSettings;
+    } | null;
+}
+export type MapAllDataResponse = {
+    retailers: MapRetailer[];
+    globalRetailerIds: number[];
+    map_objs: MapObjData[];
+    floors: MapFloor[];
+    kiosks: MapKiosk[];
+    mapSettings: {
+        apiResponse: PortalMapSettingsProps;
+        responseConfig: Partial<MapConfigProps>;
+    };
+    responsiveSettings: MapResponsiveSettings;
+};

package/dist/interfaces/mapbox.d.ts

@@ -0,0 +1,18 @@
+import { MapFloor } from './mapApiTypes';
+import { Group, Texture, Vector3 } from 'three';
+export type AppRoutePoint = {
+    name: string;
+    node: Vector3;
+};
+export interface AppFloor extends MapFloor {
+    objsGroup: Group;
+    interactiveObjs: any[];
+    escalatorsObjs: any[];
+    escalatorsNodes: Record<any, any>;
+    escalatorMeshes?: any[];
+    route_points?: AppRoutePoint[];
+    route_tube?: any;
+    route_texture?: Texture | null | undefined;
+    routeMeshes?: any[];
+    route_active?: boolean;
+}

package/dist/interfaces/portal-sidebar-form.d.ts

@@ -0,0 +1,13 @@
+export interface MapRetailerOption {
+    value: number;
+    label: string;
+}
+export interface MapKioskOption {
+    value: number;
+    label: string;
+    isDisabled: boolean;
+}
+export interface MapAmenityOption {
+    value: string;
+    label: string;
+}

package/dist/interfaces/portal.d.ts

@@ -0,0 +1,21 @@
+import { MapRenderMode } from '.';
+export interface PortalMapSettingsProps {
+    MAP_STYLE: MapRenderMode;
+    MAP_BACKGROUND_COLOR: string;
+    ACCENT_COLOR: string;
+    STORE_DEFAULT_COLOR: string;
+    STORE_TEXT_COLOR: string;
+    STORE_HEIGHT: number;
+    WALL_COLOR: string;
+    BOUNDARY_COLOR: string;
+    BASE_COLOR: string;
+    OVERLAY_COLOR: string;
+    WALL_THICKNESS: number;
+    BOUNDARY_THICKNESS: number;
+    OVERLAY_OPACITY: number;
+    KIOSK_SIZE: number;
+    ZOOM_STEP: number;
+    SELECTED_ZOOM_LIMIT: number;
+    CAMERA_MAX_DISTANCE: number;
+    CAMERA_MIN_DISTANCE: number;
+}

package/dist/react-app-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="react-scripts" />

package/dist/reportWebVitals.d.ts

@@ -0,0 +1,3 @@
+import { ReportHandler } from 'web-vitals';
+declare const reportWebVitals: (onPerfEntry?: ReportHandler) => void;
+export default reportWebVitals;

package/dist/services/index.service.d.ts

@@ -0,0 +1,9 @@
+import { MapApiService } from './map.service';
+import { RetailersService } from './retailers.service';
+import { MapConfigProps } from '../interfaces';
+export interface ApiServicesProps {
+    mapApiService: MapApiService;
+    retailersService: RetailersService;
+}
+declare const createApiServices: (baseApiUrl: string, mapConfig: MapConfigProps) => ApiServicesProps;
+export default createApiServices;

package/dist/services/map.service.d.ts

@@ -0,0 +1,15 @@
+import { AxiosInstance } from 'axios';
+import { MapConfigProps } from '../interfaces';
+import { MapResponsiveSettings, MapObjData, MapFloor, MapKiosk } from '../interfaces/mapApiTypes';
+export interface MapApiService {
+    getMapData: () => Promise<MapObjData[]>;
+    getMapFloors: () => Promise<MapFloor[]>;
+    getMapKiosks: () => Promise<MapKiosk[]>;
+    getMapSettings: () => Promise<{
+        apiResponse: any;
+        responseConfig: Partial<MapConfigProps>;
+    }>;
+    getMapResponsiveSettings: () => Promise<MapResponsiveSettings>;
+}
+declare const createMapApiService: (axiosInstance: AxiosInstance) => MapApiService;
+export default createMapApiService;

package/dist/services/retailers.service.d.ts

@@ -0,0 +1,11 @@
+import { AxiosInstance } from 'axios';
+import { MapRetailer, MapRetailerSingle } from '../interfaces/mapApiTypes';
+export interface RetailersService {
+    getAllRetailers: () => Promise<{
+        retailers: MapRetailer[];
+        globalRetailerIds: number[];
+    }>;
+    getRetailer: (slug: string) => Promise<MapRetailerSingle>;
+}
+declare const createRetailersService: (axiosInstance: AxiosInstance) => RetailersService;
+export default createRetailersService;

package/dist/types/style-modules.d.ts

@@ -0,0 +1,10 @@
+// removed scss declarations
+
+declare module '*.module.css' {
+  const classes: { [key: string]: string };
+  export default classes;
+}
+
+declare module '*.css';
+
+

package/package.json

@@ -0,0 +1,135 @@
+{
+  "name": "@eyeon/threejs-map",
+  "version": "1.1.1",
+  "description": "EyeOn ThreeJS Map component for interactive 3D mall/center maps",
+  "keywords": [
+    "threejs",
+    "react",
+    "3d",
+    "map",
+    "interactive",
+    "mall",
+    "retail"
+  ],
+  "author": "EyeOn LLC",
+  "license": "UNLICENSED",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/mycenterportal/eyeon-threejs-map-build.git"
+  },
+  "type": "module",
+  "source": "src/index.ts",
+  "main": "dist/index.js",
+  "module": "dist/index.module.js",
+  "unpkg": "dist/index.umd.js",
+  "types": "dist/index.d.ts",
+  "engines": {
+    "node": "^22.20.0",
+    "npm": "^11.6.2"
+  },
+  "engineStrict": true,
+  "packageManager": "npm@11.6.2",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.module.js",
+      "require": "./dist/index.js"
+    },
+    "./index.css": "./dist/index.css"
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "scripts": {
+    "build": "vite build --mode lib",
+    "dev": "vite",
+    "storybook": "storybook dev -p 6006"
+  },
+  "husky": {
+    "hooks": {
+      "pre-push": "npm run prepare"
+    }
+  },
+  "dependencies": {
+    "@react-three/drei": "10.7.6",
+    "@reduxjs/toolkit": "^2.2.3",
+    "@tweenjs/tween.js": "^21.0.0",
+    "axios": "^1.7.2",
+    "bootstrap": "^5.3.1",
+    "ngraph.graph": "^20.0.1",
+    "ngraph.path": "^1.5.0",
+    "react-bootstrap": "^2.8.0",
+    "react-bootstrap-icons": "^1.10.3",
+    "react-device-detect": "^2.2.3",
+    "react-feather": "^2.0.10",
+    "react-redux": "^9.1.0",
+    "react-select": "^5.8.0",
+    "three-stdlib": "^2.25.1",
+    "web-vitals": "^2.1.4"
+  },
+  "peerDependencies": {
+    "@react-three/fiber": "^9.4.0",
+    "react": "^19.2.1",
+    "react-dom": "^19.2.1",
+    "three": "^0.180.0"
+  },
+  "devDependencies": {
+    "@react-three/fiber": "^9.4.0",
+    "@storybook/addon-docs": "^9.1.8",
+    "@storybook/addon-links": "^9.1.8",
+    "@storybook/addon-onboarding": "^9.1.8",
+    "@storybook/react": "^9.1.8",
+    "@storybook/react-vite": "^9.1.8",
+    "@types/express": "^5.0.5",
+    "@types/jest": "^27.5.2",
+    "@types/jsonwebtoken": "^9.0.6",
+    "@types/node": "^22.7.4",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "@types/three": "^0.180.0",
+    "@vitejs/plugin-react": "^4.3.1",
+    "dotenv": "^17.2.3",
+    "eslint-plugin-storybook": "^9.1.8",
+    "express": "^5.1.0",
+    "husky": "^8.0.3",
+    "jsonwebtoken": "^9.0.2",
+    "postcss": "^8.4.47",
+    "postcss-nested": "^6.0.1",
+    "prop-types": "^15.8.1",
+    "react": "19.2.1",
+    "react-dom": "19.2.1",
+    "storybook": "^9.1.8",
+    "three": "^0.180.0",
+    "typescript": "^5.4.5",
+    "vite": "^5.4.9",
+    "vite-plugin-dts": "^4.2.3"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "overrides": {
+    "@react-spring/animated": "^9.7.0",
+    "@react-spring/core": "^9.7.0",
+    "@react-spring/shared": "^9.7.0"
+  }
+}