@clikvn/showroom-visualizer 0.3.0-dev-06 → 0.3.0-dev-08
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CLAUDE.md +145 -0
- package/README.md +338 -15
- package/dist/commons/SkinLayer/components/CardItemGroup/Item.d.ts.map +1 -1
- package/dist/components/SkinLayer/ActionsChangeScene/index.d.ts.map +1 -1
- package/dist/components/SkinLayer/Floorplan/index.d.ts.map +1 -1
- package/dist/components/SkinLayer/Guide/index.d.ts.map +1 -1
- package/dist/components/SkinLayer/HotspotOverview/index.d.ts.map +1 -1
- package/dist/components/SkinLayer/PinActionButtons/index.d.ts.map +1 -1
- package/dist/components/SkinLayer/PlayBar/index.d.ts.map +1 -1
- package/dist/components/SkinLayer/PoiDetailSlideIn/Detail.d.ts.map +1 -1
- package/dist/components/SkinLayer/PoiDetailSlideIn/index.d.ts.map +1 -1
- package/dist/components/SkinLayer/ScenarioList/index.d.ts.map +1 -1
- package/dist/components/SkinLayer/SceneCategories/index.d.ts.map +1 -1
- package/dist/components/SkinLayer/SearchAndDiscoverySlideIn/ContentItem/index.d.ts.map +1 -1
- package/dist/components/SkinLayer/SearchAndDiscoverySlideIn/PoiInfoActionPart/index.d.ts.map +1 -1
- package/dist/components/SkinLayer/SearchAndDiscoverySlideIn/PromotionPart/index.d.ts.map +1 -1
- package/dist/components/SkinLayer/SearchAndDiscoverySlideIn/ScenariosPart/Item.d.ts.map +1 -1
- package/dist/components/SkinLayer/SearchAndDiscoverySlideIn/index.d.ts.map +1 -1
- package/dist/components/SkinLayer/TourScenarios/index.d.ts.map +1 -1
- package/dist/features/ShowroomVisualizer/index.d.ts +2 -1
- package/dist/features/ShowroomVisualizer/index.d.ts.map +1 -1
- package/dist/hooks/Visualizer/useTourVisualizer.d.ts.map +1 -1
- package/dist/hooks/useActionMiddleware.d.ts +25 -0
- package/dist/hooks/useActionMiddleware.d.ts.map +1 -0
- package/dist/hooks/useConfiguration.d.ts +3 -1
- package/dist/hooks/useConfiguration.d.ts.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/models/Visualizer/Plugins/BasePlugin.d.ts.map +1 -1
- package/dist/models/Visualizer/Poi/PoiLensFlare.d.ts.map +1 -1
- package/dist/models/Visualizer/Poi/PoiMultimedia/PoiSound.d.ts.map +1 -1
- package/dist/models/Visualizer/Poi/PoiMultimedia/PoiVideo.d.ts.map +1 -1
- package/dist/register.d.ts +2 -1
- package/dist/register.d.ts.map +1 -1
- package/dist/types/SkinLayer/index.d.ts +1 -0
- package/dist/types/SkinLayer/index.d.ts.map +1 -1
- package/dist/types/SkinLayer/middleware.type.d.ts +42 -0
- package/dist/types/SkinLayer/middleware.type.d.ts.map +1 -0
- package/dist/types/SkinLayer/visualizer.type.d.ts +2 -0
- package/dist/types/SkinLayer/visualizer.type.d.ts.map +1 -1
- package/dist/types/Visualizer/tourScenario/tourScenario.type.d.ts.map +1 -1
- package/dist/utils/Visualizer/image.utils.d.ts.map +1 -1
- package/dist/utils/middleware/listenerWrapper.d.ts +31 -0
- package/dist/utils/middleware/listenerWrapper.d.ts.map +1 -0
- package/dist/web.js +1 -1
- package/package.json +3 -3
- package/.claude/settings.local.json +0 -19
- package/dist/components/SkinLayer/DefaultLayout/index.d.ts +0 -8
- package/dist/components/SkinLayer/DefaultLayout/index.d.ts.map +0 -1
- package/dist/context/CustomLayoutContext.d.ts +0 -20
- package/dist/context/CustomLayoutContext.d.ts.map +0 -1
- package/dist/context/SwizzleContext.d.ts +0 -21
- package/dist/context/SwizzleContext.d.ts.map +0 -1
- package/dist/hooks/headless/index.d.ts +0 -150
- package/dist/hooks/headless/index.d.ts.map +0 -1
- package/dist/hooks/headless/useFloorplanControl.d.ts +0 -18
- package/dist/hooks/headless/useFloorplanControl.d.ts.map +0 -1
- package/dist/hooks/headless/usePOIInteraction.d.ts +0 -23
- package/dist/hooks/headless/usePOIInteraction.d.ts.map +0 -1
- package/dist/hooks/headless/useScenarioControl.d.ts +0 -22
- package/dist/hooks/headless/useScenarioControl.d.ts.map +0 -1
- package/dist/hooks/headless/useSceneNavigation.d.ts +0 -26
- package/dist/hooks/headless/useSceneNavigation.d.ts.map +0 -1
- package/dist/hooks/headless/useTourCore.d.ts +0 -23
- package/dist/hooks/headless/useTourCore.d.ts.map +0 -1
- package/dist/hooks/headless/useViewportControl.d.ts +0 -22
- package/dist/hooks/headless/useViewportControl.d.ts.map +0 -1
- package/dist/index.html +0 -110
- package/dist/index.js +0 -1
- package/dist/types/custom-layout.d.ts +0 -63
- package/dist/types/custom-layout.d.ts.map +0 -1
- package/dist/types/swizzle.d.ts +0 -59
- package/dist/types/swizzle.d.ts.map +0 -1
package/CLAUDE.md
ADDED
|
@@ -0,0 +1,145 @@
|
|
|
1
|
+
# CLAUDE.md
|
|
2
|
+
|
|
3
|
+
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
|
|
4
|
+
|
|
5
|
+
## Project Overview
|
|
6
|
+
|
|
7
|
+
This is a React-based 3D showroom visualizer library built with TypeScript that renders interactive 360-degree virtual tours. The library is published as `@clikvn/showroom-visualizer` and integrates with Krpano panoramic viewer technology to create immersive experiences with POIs (Points of Interest), scenarios, and multimedia content.
|
|
8
|
+
|
|
9
|
+
## Build Commands
|
|
10
|
+
|
|
11
|
+
```bash
|
|
12
|
+
# Development with hot reload
|
|
13
|
+
yarn dev
|
|
14
|
+
|
|
15
|
+
# Production build
|
|
16
|
+
yarn build
|
|
17
|
+
|
|
18
|
+
# Linting
|
|
19
|
+
yarn lint
|
|
20
|
+
yarn lint:fix
|
|
21
|
+
|
|
22
|
+
# Code formatting
|
|
23
|
+
yarn prettier
|
|
24
|
+
|
|
25
|
+
# Publish to npm
|
|
26
|
+
yarn deploy # Builds and publishes
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
## Code Architecture
|
|
30
|
+
|
|
31
|
+
### Entry Points
|
|
32
|
+
|
|
33
|
+
- `src/web.ts` - Main entry point that exports the visualizer API to `window.ShowroomVisualizer`
|
|
34
|
+
- `src/window.ts` - Handles browser integration: `initVisualizer()` and `destroy()` methods
|
|
35
|
+
- `src/features/ShowroomVisualizer/index.tsx` - Root React component that sets up providers and layout
|
|
36
|
+
|
|
37
|
+
### Core Architecture Layers
|
|
38
|
+
|
|
39
|
+
The codebase follows a layered architecture:
|
|
40
|
+
|
|
41
|
+
1. **Visualizer Layer** (`src/models/Visualizer/`) - Domain models that manage 3D tour logic
|
|
42
|
+
- `Tour.ts` - Central orchestrator managing scenes, POIs, sounds, and scenarios
|
|
43
|
+
- `Krpano.ts` - Wrapper around Krpano API with coordinate transformation utilities
|
|
44
|
+
- `Scene.ts` - Individual 360° panorama scenes
|
|
45
|
+
- `Poi/` - Various POI types (Gallery, Info, Navigation, Multimedia, Texture, etc.)
|
|
46
|
+
- `TourScenario/` - Automated tour playback with actions (LookingAt, Moving, Rotation, Sleep, etc.)
|
|
47
|
+
- `Plugins/` - Gyro, Radar, Sound plugins
|
|
48
|
+
|
|
49
|
+
2. **SkinLayer** (`src/components/SkinLayer/`) - React UI components
|
|
50
|
+
- Components overlay on the 3D viewer providing interactivity
|
|
51
|
+
- Key components: Floorplan/Minimap, HotspotOverview, PlayBar, SearchAndDiscovery, PoiDetailSlideIn
|
|
52
|
+
- Uses Ant Design components with custom styling
|
|
53
|
+
|
|
54
|
+
3. **State Management** (`src/hooks/useStore.tsx`)
|
|
55
|
+
- Context-based global state management
|
|
56
|
+
- Manages UI state, active POIs, scenarios, galleries, slide-ins
|
|
57
|
+
- Provides selectors for component consumption
|
|
58
|
+
|
|
59
|
+
4. **Services Layer** (`src/services/Visualizer/`)
|
|
60
|
+
- `tour.service.ts` - Fetches tour data from API
|
|
61
|
+
- `poi.service.ts` - POI-related API calls
|
|
62
|
+
- `webRotate.service.ts` - Web rotation functionality
|
|
63
|
+
- `request.ts` - HTTP client wrapper
|
|
64
|
+
|
|
65
|
+
### Key Architectural Patterns
|
|
66
|
+
|
|
67
|
+
**Krpano Integration**: The `Krpano` class wraps the Krpano viewer API and provides coordinate transformation utilities (`screentosphere`, `spheretoscreen`, `spheretospace`, `spacetosphere`). All 3D position calculations go through this abstraction.
|
|
68
|
+
|
|
69
|
+
**POI System**: POIs are polymorphic with a base `Poi` class and specialized subtypes (PoiInfo, PoiGallery, PoiVideo, PoiSound, etc.). Each type handles its own rendering and interaction logic within the Krpano viewer.
|
|
70
|
+
|
|
71
|
+
**Tour Scenario System**: Scenarios are composed of `TourScenarioStep` objects containing `TourScenarioAction` implementations. The `TourScenarioPlayer` executes actions sequentially (LookingAt → Moving → Rotation → Sleep patterns). Actions can have associated sounds managed by `ScenarioSound`.
|
|
72
|
+
|
|
73
|
+
**Signal-based Events**: Uses the `signals` library extensively for decoupled event handling between Visualizer and SkinLayer.
|
|
74
|
+
|
|
75
|
+
**Web Component Registration**: The library registers `<showroom-visualizer>` as a custom element (see `src/register.ts`) for easy embedding.
|
|
76
|
+
|
|
77
|
+
### Configuration System
|
|
78
|
+
|
|
79
|
+
Configuration flows through multiple layers:
|
|
80
|
+
|
|
81
|
+
- External config passed to `initVisualizer()`
|
|
82
|
+
- `ConfigurationProvider` (src/hooks/useConfiguration.tsx) merges API host, override configs, listeners, middleware
|
|
83
|
+
- `StoreProvider` maintains runtime state
|
|
84
|
+
- `TourContext` provides global access to the Tour instance
|
|
85
|
+
|
|
86
|
+
### Middleware System
|
|
87
|
+
|
|
88
|
+
The library supports a comprehensive **tracking middleware** system for analytics and monitoring:
|
|
89
|
+
|
|
90
|
+
**Architecture**:
|
|
91
|
+
|
|
92
|
+
- Middleware function passed to `initVisualizer({ middleware: (event) => {...} })`
|
|
93
|
+
- `useActionMiddleware` hook provides `trackAction()` function to components
|
|
94
|
+
- **35+ tracking actions** covering all user interactions
|
|
95
|
+
- **Tracking-only** - does not block or cancel actions (fire-and-forget pattern)
|
|
96
|
+
- Works independently of listeners (fires even without listeners configured)
|
|
97
|
+
|
|
98
|
+
**Complete Coverage**:
|
|
99
|
+
|
|
100
|
+
1. **Search & Discovery** - All category clicks, search, individual item clicks (products, POIs, features, etc.)
|
|
101
|
+
2. **POI Detail Panel** - Open/close, action buttons (AI, Save, Audio, Share), tab switching, gallery clicks
|
|
102
|
+
3. **Scenario Playback** - Play/pause, skip, loop, sound toggle, scenario selection
|
|
103
|
+
4. **Navigation** - Scene groups, floorplan changes, minimap controls
|
|
104
|
+
5. **UI Components** - Guide, playbar, all interactive elements
|
|
105
|
+
|
|
106
|
+
**Key Features**:
|
|
107
|
+
|
|
108
|
+
- **Deep-level tracking** - Tracks not just categories but individual items within each category
|
|
109
|
+
- **Rich payloads** - Each event includes codes, names, types, and contextual data
|
|
110
|
+
- **User journey mapping** - Complete visibility into user interactions from discovery to engagement
|
|
111
|
+
- **Analytics-ready** - Designed for integration with GA4, Mixpanel, or custom backends
|
|
112
|
+
|
|
113
|
+
**Documentation**:
|
|
114
|
+
|
|
115
|
+
- 📚 **[Complete Tracking Guide](Planning/README-tracking-complete.md)** - Full reference of all 35+ tracking actions with examples
|
|
116
|
+
- 📖 **[Middleware Architecture](Planning/README-middleware.md)** - Core middleware system documentation
|
|
117
|
+
- 📝 **[Changes Summary](Planning/TRACKING-CHANGES-SUMMARY.md)** - List of all modified files and implementation details
|
|
118
|
+
|
|
119
|
+
### Multi-language Support
|
|
120
|
+
|
|
121
|
+
Uses `i18next` with JSON translation files in `src/assets/locales/{en,cn,jp,kr,vi}/` covering chatbot, common, guide, nav, onboarding-screen, and skin-layer namespaces.
|
|
122
|
+
|
|
123
|
+
## Development Notes
|
|
124
|
+
|
|
125
|
+
**TypeScript Paths**: Uses path aliases with `baseUrl: "./src"` so imports like `import { Tour } from 'models/Visualizer/Tour'` work without relative paths.
|
|
126
|
+
|
|
127
|
+
**Rollup Build**: Configured for ESM output with PostCSS (Tailwind), TypeScript compilation, and tree-shaking. Development mode skips uglify/terser/babel for faster rebuilds.
|
|
128
|
+
|
|
129
|
+
**CSS Architecture**: Mix of component-scoped CSS files (`src/assets/*.css`) and Tailwind utilities. Custom CSS variables set dynamically for modal positioning and hotspot states.
|
|
130
|
+
|
|
131
|
+
**State Persistence**: No localStorage/sessionStorage - state is ephemeral per session. Tours are fetched fresh via SWR caching.
|
|
132
|
+
|
|
133
|
+
**Mobile vs Desktop**: The `mobile` prop controls UI layout significantly - different slide-in behaviors, hotspot positioning, and touch controls.
|
|
134
|
+
|
|
135
|
+
## Common Patterns
|
|
136
|
+
|
|
137
|
+
**Finding POIs**: Use `tour.getPoiByType(POI_TYPE.*)` or `tour.getPoisByIds(ids)`
|
|
138
|
+
|
|
139
|
+
**Scene Navigation**: `tour.changeScene(sceneCode)` or through navigation POIs
|
|
140
|
+
|
|
141
|
+
**Coordinate Conversion**: Always use `krpano.screentosphere()` / `spheretoscreen()` for position calculations between screen and 3D space
|
|
142
|
+
|
|
143
|
+
**Adding Listeners**: Tour emits signals for scene changes, POI interactions, scenario events - hook into these via `tour.signals.*`
|
|
144
|
+
|
|
145
|
+
**ESLint Rules**: The project uses TypeScript ESLint with Prettier integration. Note that `no-console` allows `info`, `warn`, `error` but not plain `log`.
|
package/README.md
CHANGED
|
@@ -4,29 +4,352 @@
|
|
|
4
4
|
|
|
5
5
|
Javascript library to display Clik Showroom Visualizer with UI on your website
|
|
6
6
|
|
|
7
|
+
## Installation
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
npm install @clikvn/showroom-visualizer
|
|
11
|
+
# or
|
|
12
|
+
yarn add @clikvn/showroom-visualizer
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
## Basic Usage
|
|
16
|
+
|
|
7
17
|
```html
|
|
8
18
|
<!-- public/index.html -->
|
|
9
19
|
<script type="module">
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
20
|
+
import ShowroomVisualizer from 'http://localhost:3000/web.js';
|
|
21
|
+
ShowroomVisualizer.initVisualizer({
|
|
22
|
+
apiHost: 'https://ci-api.clik.vn/vt360',
|
|
23
|
+
config: {
|
|
24
|
+
tourCode: 'TOUR_FXYCEN7ZZVW6',
|
|
25
|
+
language: 'EN',
|
|
26
|
+
},
|
|
27
|
+
onLoaded: (tool) => {
|
|
28
|
+
window.tool = tool;
|
|
29
|
+
},
|
|
30
|
+
mobile: false,
|
|
31
|
+
});
|
|
22
32
|
</script>
|
|
23
33
|
<div style="width: 100vw; height: 100vh">
|
|
24
|
-
|
|
34
|
+
<showroom-visualizer></showroom-visualizer>
|
|
25
35
|
</div>
|
|
26
36
|
```
|
|
27
37
|
|
|
38
|
+
## Features
|
|
39
|
+
|
|
40
|
+
- 🌐 **360° Virtual Tours** - Interactive panoramic experiences powered by Krpano
|
|
41
|
+
- 🎯 **Points of Interest (POI)** - Multiple POI types: Gallery, Video, Sound, Navigation, Texture, Promotions
|
|
42
|
+
- 🎬 **Automated Scenarios** - Guided tour playback with camera movements and narration
|
|
43
|
+
- 🗺️ **Floorplan/Minimap** - Interactive navigation with radar positioning
|
|
44
|
+
- 📱 **Mobile Optimized** - Touch controls and responsive layout for mobile devices
|
|
45
|
+
- 🌍 **Multi-language** - Support for EN, CN, JP, KR, VI
|
|
46
|
+
- 🎨 **Customizable UI** - Theme support and configurable components
|
|
47
|
+
- 📊 **Comprehensive Analytics** - **35+ tracking actions** covering all user interactions (see below)
|
|
48
|
+
|
|
49
|
+
## Comprehensive Analytics & Tracking
|
|
50
|
+
|
|
51
|
+
The library includes a powerful **tracking middleware** system with **35+ actions** covering all user interactions:
|
|
52
|
+
|
|
53
|
+
```typescript
|
|
54
|
+
import ShowroomVisualizer from '@clikvn/showroom-visualizer';
|
|
55
|
+
|
|
56
|
+
ShowroomVisualizer.initVisualizer({
|
|
57
|
+
apiHost: 'https://api.clik.vn',
|
|
58
|
+
config: { tourCode: 'TOUR_123' },
|
|
59
|
+
|
|
60
|
+
// Add tracking middleware
|
|
61
|
+
middleware: (event) => {
|
|
62
|
+
// Event structure:
|
|
63
|
+
// {
|
|
64
|
+
// actionName: 'onCardItemClick',
|
|
65
|
+
// payload: { itemCode, itemTitle, itemType, sceneCode, ... },
|
|
66
|
+
// timestamp: '2025-01-15T10:00:00.000Z',
|
|
67
|
+
// metadata: { tourCode, sceneCode, categoryCode }
|
|
68
|
+
// }
|
|
69
|
+
|
|
70
|
+
// Send to your analytics service
|
|
71
|
+
analytics.track(event.actionName, event.payload);
|
|
72
|
+
},
|
|
73
|
+
});
|
|
74
|
+
```
|
|
75
|
+
|
|
76
|
+
### What's Tracked (35+ Actions)
|
|
77
|
+
|
|
78
|
+
**Search & Discovery (6 actions)**
|
|
79
|
+
|
|
80
|
+
- Panel open/close, search queries
|
|
81
|
+
- Category header clicks (Products, Features, Locations, etc.)
|
|
82
|
+
- Promotion actions (show more, auto play)
|
|
83
|
+
- Individual scenario clicks
|
|
84
|
+
|
|
85
|
+
**Individual Items (1 universal action covering all types)**
|
|
86
|
+
|
|
87
|
+
- Product clicks
|
|
88
|
+
- POI clicks (Information, Features, Brands, Locations, Facilities, Multimedia)
|
|
89
|
+
- Feature clicks
|
|
90
|
+
- Promotion item clicks
|
|
91
|
+
|
|
92
|
+
**POI Detail Panel (5 actions)**
|
|
93
|
+
|
|
94
|
+
- Open/close, audio playback
|
|
95
|
+
- Action buttons (AI Assistant, Save, Audio, Share)
|
|
96
|
+
- Tab switching (Gallery, AR, Web Rotate, Info, Specification)
|
|
97
|
+
- Gallery item clicks
|
|
98
|
+
|
|
99
|
+
**Scenario Playback (8 actions)**
|
|
100
|
+
|
|
101
|
+
- Scenario start, play/pause
|
|
102
|
+
- Skip (next/previous), loop toggle
|
|
103
|
+
- Sound toggle, playlist toggle
|
|
104
|
+
- Playbar close
|
|
105
|
+
|
|
106
|
+
**Navigation (6 actions)**
|
|
107
|
+
|
|
108
|
+
- Scene group selection
|
|
109
|
+
- Floorplan changes
|
|
110
|
+
- Minimap expand/minimize
|
|
111
|
+
- View scenes button
|
|
112
|
+
|
|
113
|
+
**UI Components (1+ actions)**
|
|
114
|
+
|
|
115
|
+
- Guide open/close
|
|
116
|
+
- Other UI interactions
|
|
117
|
+
|
|
118
|
+
### Key Features
|
|
119
|
+
|
|
120
|
+
✅ **Deep-level tracking** - Not just categories, but individual items within each category
|
|
121
|
+
✅ **Rich payloads** - Codes, names, types, and contextual data for every action
|
|
122
|
+
✅ **User journey mapping** - Complete visibility from discovery to engagement
|
|
123
|
+
✅ **Zero overhead** - No performance impact when middleware not configured
|
|
124
|
+
✅ **Fire-and-forget** - Non-blocking, error-safe pattern
|
|
125
|
+
✅ **Analytics-ready** - Easy integration with GA4, Mixpanel, or custom backends
|
|
126
|
+
|
|
127
|
+
### Complete List of Tracked Events (35+ Actions)
|
|
128
|
+
|
|
129
|
+
#### Search & Discovery (6 events)
|
|
130
|
+
|
|
131
|
+
| Event Name | Trigger | Payload |
|
|
132
|
+
| ----------------------------------- | --------------------------- | ---------------------------------- |
|
|
133
|
+
| `onSearchAndDiscoveryClose` | Panel closed | `{}` |
|
|
134
|
+
| `onSearchAndDiscoverySearch` | User types in search | `{ searchQuery }` |
|
|
135
|
+
| `onSearchAndDiscoveryItemClick` | Category header clicked | `{ itemKey, itemTitle, itemType }` |
|
|
136
|
+
| `onSearchAndDiscoveryScenarioClick` | Scenario clicked from panel | `{ scenarioCode, scenarioName }` |
|
|
137
|
+
| `onPromotionShowMore` | Show more button clicked | `{ totalPromotions }` |
|
|
138
|
+
| `onPromotionAutoPlay` | Auto play button clicked | `{ totalPromotions }` |
|
|
139
|
+
|
|
140
|
+
**Categories tracked:** HOME, AMENITIES, SCENE, PROMOTION, FEATURES, PRODUCT_LIST, INFORMATION, BRAND, LOCATION, FACILITY, MULTIMEDIA, SWAP_ELEMENT, SCENARIO, PLAYLIST, DISPLAY_HOTSPOT, DETAIL
|
|
141
|
+
|
|
142
|
+
#### Individual Items - Universal (1 event covering ALL types)
|
|
143
|
+
|
|
144
|
+
| Event Name | Trigger | Payload |
|
|
145
|
+
| ----------------- | ---------------------------------------------- | -------------------------------------------------------------------- |
|
|
146
|
+
| `onCardItemClick` | Any item clicked (product, POI, feature, etc.) | `{ itemCode, itemTitle, itemType, sceneCode, hotspotCode, isVideo }` |
|
|
147
|
+
|
|
148
|
+
**Item types covered:** Products, Information POIs, Features, Brands, Locations, Facilities, Multimedia, Swap Elements, Promotions
|
|
149
|
+
|
|
150
|
+
#### POI Detail Panel (5 events)
|
|
151
|
+
|
|
152
|
+
| Event Name | Trigger | Payload |
|
|
153
|
+
| ------------------------- | ------------------------- | ----------------------------------------------------------- |
|
|
154
|
+
| `onPoiDetailClose` | Detail panel closed | `{ poiCode, poiName, poiType }` |
|
|
155
|
+
| `onPoiDetailAudioPlay` | Audio play button clicked | `{ poiCode, poiName, poiType }` |
|
|
156
|
+
| `onPoiDetailGalleryClick` | Gallery item clicked | `{ poiCode, poiName, poiType, galleryItemId, galleryType }` |
|
|
157
|
+
| `onPoiDetailActionClick` | Action button clicked | `{ actionKey, productCode, productName, productType }` |
|
|
158
|
+
| `onPoiDetailTabChange` | Tab switched | `{ tabKey, productCode, productName, galleryType }` |
|
|
159
|
+
|
|
160
|
+
**Action keys:** `ai_assistant`, `save`, `audio`, `share`
|
|
161
|
+
**Tab keys:** `gallery`, `ar`, `webRotate`, `info`, `specification`
|
|
162
|
+
|
|
163
|
+
#### Scenario Playback (8 events)
|
|
164
|
+
|
|
165
|
+
| Event Name | Trigger | Payload |
|
|
166
|
+
| ---------------------- | -------------------------- | ----------------------------- |
|
|
167
|
+
| `onStartScenario` | Scenario started from list | `scenarioCode` (string) |
|
|
168
|
+
| `onPlayBarClose` | Playbar closed | `{ scenarioCode }` |
|
|
169
|
+
| `onPlayListToggle` | Playlist toggled | `{ show }` |
|
|
170
|
+
| `onPlayBarPlayClick` | Play button clicked | `{ scenarioCode }` |
|
|
171
|
+
| `onPlayBarPauseClick` | Pause button clicked | `{ scenarioCode }` |
|
|
172
|
+
| `onPlayBarLoopToggle` | Loop toggled | `{ loop, scenarioCode }` |
|
|
173
|
+
| `onPlayBarSoundToggle` | Sound toggled | `{ playing }` |
|
|
174
|
+
| `onPlayBarSkip` | Skip button clicked | `{ direction, scenarioCode }` |
|
|
175
|
+
|
|
176
|
+
**Direction values:** `'previous'` or `'next'`
|
|
177
|
+
|
|
178
|
+
#### Navigation (6 events)
|
|
179
|
+
|
|
180
|
+
| Event Name | Trigger | Payload |
|
|
181
|
+
| ------------------------- | -------------------------- | ------------------------------------------ |
|
|
182
|
+
| `onSceneGroupSelected` | Scene group selected | `{ sceneGroupCode, sceneGroupName }` |
|
|
183
|
+
| `onSubSceneGroupSelected` | Sub scene group selected | `{ subSceneGroupCode, subSceneGroupName }` |
|
|
184
|
+
| `onFloorplanViewScenes` | View scenes button clicked | `{}` |
|
|
185
|
+
| `onFloorplanChange` | Floorplan changed | `{ floorplanCode, floorplanName }` |
|
|
186
|
+
| `onMinimapExpand` | Minimap expanded | `{}` |
|
|
187
|
+
| `onMinimapMinimize` | Minimap minimized | `{}` |
|
|
188
|
+
|
|
189
|
+
#### UI Components (1+ events)
|
|
190
|
+
|
|
191
|
+
| Event Name | Trigger | Payload |
|
|
192
|
+
| -------------- | -------------------- | ------- |
|
|
193
|
+
| `onGuideClose` | Guide overlay closed | `{}` |
|
|
194
|
+
|
|
195
|
+
### Analytics Integration Examples
|
|
196
|
+
|
|
197
|
+
**Google Analytics 4:**
|
|
198
|
+
|
|
199
|
+
```typescript
|
|
200
|
+
middleware: (event) => {
|
|
201
|
+
gtag('event', event.actionName, {
|
|
202
|
+
event_category: 'showroom',
|
|
203
|
+
tour_code: event.metadata?.tourCode,
|
|
204
|
+
...event.payload,
|
|
205
|
+
});
|
|
206
|
+
};
|
|
207
|
+
```
|
|
208
|
+
|
|
209
|
+
**Mixpanel:**
|
|
210
|
+
|
|
211
|
+
```typescript
|
|
212
|
+
middleware: (event) => {
|
|
213
|
+
mixpanel.track(event.actionName, {
|
|
214
|
+
tour_code: event.metadata?.tourCode,
|
|
215
|
+
...event.payload,
|
|
216
|
+
});
|
|
217
|
+
};
|
|
218
|
+
```
|
|
219
|
+
|
|
220
|
+
**Custom Backend:**
|
|
221
|
+
|
|
222
|
+
```typescript
|
|
223
|
+
middleware: async (event) => {
|
|
224
|
+
await fetch('/api/analytics', {
|
|
225
|
+
method: 'POST',
|
|
226
|
+
headers: { 'Content-Type': 'application/json' },
|
|
227
|
+
body: JSON.stringify(event),
|
|
228
|
+
});
|
|
229
|
+
};
|
|
230
|
+
```
|
|
231
|
+
|
|
232
|
+
> **📚 Detailed Documentation:** For complete examples, user journey scenarios, and implementation patterns, see [Complete Tracking Guide](./Planning/README-tracking-complete.md)
|
|
233
|
+
|
|
234
|
+
## Available Listeners
|
|
235
|
+
|
|
236
|
+
The library provides **21+ event listeners** for custom app logic:
|
|
237
|
+
|
|
238
|
+
| Listener | Description | Payload |
|
|
239
|
+
| ----------------------- | --------------------- | ------------------------- |
|
|
240
|
+
| **POI Events** |
|
|
241
|
+
| `onPoiClicked` | POI clicked | POI object |
|
|
242
|
+
| `onPoiOver` | Mouse over POI | POI object |
|
|
243
|
+
| `onPoiHover` | Mouse hovering POI | POI object |
|
|
244
|
+
| `onPoiOut` | Mouse left POI | - |
|
|
245
|
+
| `onPoiInCenter` | POI nearest to center | POI object |
|
|
246
|
+
| **Scene Events** |
|
|
247
|
+
| `onSceneCompleted` | Scene loaded | `sceneCode, categoryCode` |
|
|
248
|
+
| `onSceneChanged` | Scene navigated | Scene object |
|
|
249
|
+
| **Scenario Events** |
|
|
250
|
+
| `onStartScenario` | Scenario started | `scenarioCode` |
|
|
251
|
+
| `onScenarioPaused` | Scenario paused | `scenarioCode` |
|
|
252
|
+
| `onScenarioEnded` | Scenario ended | `scenarioCode` |
|
|
253
|
+
| **UI Events** |
|
|
254
|
+
| `onToggleSlideIn` | Slide-in toggled | `{ open, offset }` |
|
|
255
|
+
| `onPlaybarOpen` | Playbar opened | - |
|
|
256
|
+
| `onPlaybarClosed` | Playbar closed | - |
|
|
257
|
+
| `onPinActionClicked` | Pin button clicked | Button key string |
|
|
258
|
+
| **Tour Lifecycle** |
|
|
259
|
+
| `onStartLoadingTour` | Tour load started | `tourCode` |
|
|
260
|
+
| `onFinishedLoadingTour` | Tour load finished | `tourCode` |
|
|
261
|
+
| `onLoaded` | Tool ready | Tool object |
|
|
262
|
+
| `onDataLoaded` | Tour data loaded | `tour, tourData` |
|
|
263
|
+
| **Product Events** |
|
|
264
|
+
| `onAIProductClicked` | AI product clicked | Product code |
|
|
265
|
+
| `onShareProductClicked` | Share product clicked | Product code |
|
|
266
|
+
| **Other Events** |
|
|
267
|
+
| `onChanged` | Config changed | Config object |
|
|
268
|
+
| `onTourSwitchLoaded` | Tour switch ready | TourSwitch object |
|
|
269
|
+
| `onStateChanged` | State changed | State values |
|
|
270
|
+
|
|
271
|
+
## Key Differences: Listeners vs Middleware
|
|
272
|
+
|
|
273
|
+
| Feature | Listeners | Middleware (Tracked Actions) |
|
|
274
|
+
| -------------- | ------------------ | ------------------------------ |
|
|
275
|
+
| **Purpose** | Custom app logic | Analytics & tracking |
|
|
276
|
+
| **When fires** | Only if configured | Always (if middleware set) |
|
|
277
|
+
| **Count** | 21+ events | 35+ actions |
|
|
278
|
+
| **Use case** | App functionality | User behavior insights |
|
|
279
|
+
| **Blocking** | Can be blocking | Non-blocking (fire-and-forget) |
|
|
280
|
+
|
|
281
|
+
**Example:**
|
|
282
|
+
|
|
283
|
+
- Use **listeners** to trigger custom UI updates when a scene changes
|
|
284
|
+
- Use **middleware** to track that scene change in your analytics platform
|
|
285
|
+
|
|
286
|
+
Both can be used together - listeners for app logic, middleware for analytics!
|
|
287
|
+
|
|
288
|
+
## Configuration Options
|
|
289
|
+
|
|
290
|
+
```typescript
|
|
291
|
+
ShowroomVisualizer.initVisualizer({
|
|
292
|
+
// Required
|
|
293
|
+
apiHost: string; // API endpoint URL
|
|
294
|
+
config: {
|
|
295
|
+
tourCode: string; // Tour identifier
|
|
296
|
+
language?: string; // 'EN' | 'CN' | 'JP' | 'KR' | 'VI'
|
|
297
|
+
};
|
|
298
|
+
|
|
299
|
+
// Optional
|
|
300
|
+
mobile?: boolean; // Mobile mode
|
|
301
|
+
onLoaded?: (tool) => void; // Callback when loaded
|
|
302
|
+
middleware?: (event) => void; // Analytics tracking
|
|
303
|
+
listeners?: { // Event listeners (see table above)
|
|
304
|
+
onPoiClicked?: (poi) => void;
|
|
305
|
+
onSceneChanged?: (scene) => void;
|
|
306
|
+
onStartScenario?: (scenarioCode) => void;
|
|
307
|
+
onPinActionClicked?: (key) => void;
|
|
308
|
+
onSceneCompleted?: (sceneCode, categoryCode) => void;
|
|
309
|
+
// ... 16+ more listeners available
|
|
310
|
+
};
|
|
311
|
+
});
|
|
312
|
+
```
|
|
313
|
+
|
|
314
|
+
## Development
|
|
315
|
+
|
|
316
|
+
```bash
|
|
317
|
+
# Development with hot reload
|
|
318
|
+
yarn dev
|
|
319
|
+
|
|
320
|
+
# Production build
|
|
321
|
+
yarn build
|
|
322
|
+
|
|
323
|
+
# Linting
|
|
324
|
+
yarn lint
|
|
325
|
+
yarn lint:fix
|
|
326
|
+
|
|
327
|
+
# Code formatting
|
|
328
|
+
yarn prettier
|
|
329
|
+
|
|
330
|
+
# Serve built files locally
|
|
331
|
+
serve dist --cors
|
|
332
|
+
```
|
|
333
|
+
|
|
334
|
+
## Documentation
|
|
335
|
+
|
|
336
|
+
### Core Documentation
|
|
337
|
+
|
|
338
|
+
- **[CLAUDE.md](./CLAUDE.md)** - Complete architecture overview and development guide
|
|
339
|
+
- **[README.md](./README.md)** - This file - Quick start and API reference
|
|
340
|
+
|
|
341
|
+
### Analytics & Tracking
|
|
342
|
+
|
|
343
|
+
- 📚 **[Complete Tracking Guide](./Planning/README-tracking-complete.md)** - Full reference for all 35+ tracking actions
|
|
344
|
+
- 📖 **[Quick Reference Card](./Planning/TRACKING-QUICK-REFERENCE.md)** - Handy cheat sheet for developers
|
|
345
|
+
- 📝 **[Middleware Architecture](./Planning/README-middleware.md)** - Core middleware system documentation
|
|
346
|
+
- 📋 **[Changes Summary](./Planning/TRACKING-CHANGES-SUMMARY.md)** - Implementation details and file list
|
|
347
|
+
|
|
348
|
+
### Planning & Specifications
|
|
28
349
|
|
|
350
|
+
- **[Planning/](./Planning/)** - Feature planning and specifications
|
|
351
|
+
- [TEMPLATE.md](./Planning/TEMPLATE.md) - Template for new feature planning
|
|
29
352
|
|
|
353
|
+
## License
|
|
30
354
|
|
|
31
|
-
|
|
32
|
-
serve dist --cors
|
|
355
|
+
Proprietary - Clik Vietnam
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Item.d.ts","sourceRoot":"","sources":["../../../../../src/commons/SkinLayer/components/CardItemGroup/Item.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Item.d.ts","sourceRoot":"","sources":["../../../../../src/commons/SkinLayer/components/CardItemGroup/Item.tsx"],"names":[],"mappings":"AAOA,OAAc,EACZ,EAAE,EAEF,SAAS,EAIV,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAI5C,MAAM,MAAM,aAAa,GAAG;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB,CAAC;AAEF,UAAU,kBAAmB,SAAQ,aAAa;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,mBAAmB,CAAC,EAAE,MAAM,SAAS,CAAC;CACvC;AAED,QAAA,MAAM,QAAQ,EAAE,EAAE,CAAC,kBAAkB,CA8LpC,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/ActionsChangeScene/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,EAAE,EAAoD,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/ActionsChangeScene/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,EAAE,EAAoD,MAAM,OAAO,CAAC;AAS7E,QAAA,MAAM,kBAAkB,EAAE,EAyRzB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/Floorplan/index.tsx"],"names":[],"mappings":"AAQA,OAAO,KAQN,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/Floorplan/index.tsx"],"names":[],"mappings":"AAQA,OAAO,KAQN,MAAM,OAAO,CAAC;AAYf,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAK1D,eAAO,MAAM,cAAc,GAAI,GAAG,aAAa,EAAE,GAAG,aAAa,WAKhE,CAAC;AA6jBF,QAAA,MAAM,aAAa;UAnhBS,OAAO;EAmhBE,CAAC;AACtC,OAAO,EAAE,aAAa,IAAI,SAAS,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/Guide/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/Guide/index.tsx"],"names":[],"mappings":"AAyOA,QAAA,MAAM,SAAS,0CAAc,CAAC;AAC9B,OAAO,EAAE,SAAS,IAAI,KAAK,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/HotspotOverview/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,EAAE,EAOH,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/HotspotOverview/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,EAAE,EAOH,MAAM,OAAO,CAAC;AAgFf,QAAA,MAAM,eAAe,EAAE,EAydtB,CAAC;AAEF,eAAe,eAAe,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/PinActionButtons/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/PinActionButtons/index.tsx"],"names":[],"mappings":"AA0BA,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAG/D,eAAO,MAAM,mBAAmB,2BAA2B,CAAC;AAU5D,KAAK,mBAAmB,GAAG;IACzB,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,mBAAmB,GAAG,IAAI,KAAK,IAAI,CAAC;CAChE,CAAC;;AAwgBF,wBAAgC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/PlayBar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,EAAE,EAA4C,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/PlayBar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,EAAE,EAA4C,MAAM,OAAO,CAAC;AAerE,QAAA,MAAM,OAAO,EAAE,EA6Vd,CAAC;AAEF,eAAe,OAAO,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Detail.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/PoiDetailSlideIn/Detail.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Detail.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/PoiDetailSlideIn/Detail.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAAE,cAAc,EAAE,MAAM,GAAG,CAAC;AAMnC,QAAA,MAAM,aAAa,GAAI,+CAKpB;IACD,OAAO,EAAE,cAAc,CAAC;IACxB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;CAChE,4CAyPA,CAAC;AAEF,eAAe,aAAa,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/PoiDetailSlideIn/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/PoiDetailSlideIn/index.tsx"],"names":[],"mappings":"AAYA,OAAO,EACL,EAAE,EAMH,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE5C,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAGhE,OAAO,EAAE,SAAS,EAAE,MAAM,4CAA4C,CAAC;AAOvE,MAAM,MAAM,cAAc,GAAG;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IAEb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,SAAS,EAAE,CAAC;IACtB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,KAAK,CAAC,EAAE,cAAc,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,QAAA,MAAM,gBAAgB,EAAE,EA8LvB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/ScenarioList/index.tsx"],"names":[],"mappings":"AAMA,OAAO,EACL,EAAE,EAOH,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/ScenarioList/index.tsx"],"names":[],"mappings":"AAMA,OAAO,EACL,EAAE,EAOH,MAAM,OAAO,CAAC;AAmCf,QAAA,MAAM,YAAY,EAAE,EA4InB,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/SceneCategories/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/SceneCategories/index.tsx"],"names":[],"mappings":"AA4PA,QAAA,MAAM,mBAAmB,0CAAwB,CAAC;AAClD,OAAO,EAAE,mBAAmB,IAAI,eAAe,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/SkinLayer/SearchAndDiscoverySlideIn/ContentItem/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAM,SAAS,EAAQ,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/SkinLayer/SearchAndDiscoverySlideIn/ContentItem/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAM,SAAS,EAAQ,MAAM,OAAO,CAAC;AAI5C,MAAM,MAAM,4BAA4B,GAAG;IACzC,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IACzB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,mBAAmB,CAAC,EAAE,MAAM,SAAS,CAAC;CACvC,CAAC;AAiDF,QAAA,MAAM,eAAe,oEAAoB,CAAC;AAC1C,OAAO,EAAE,eAAe,IAAI,WAAW,EAAE,CAAC"}
|
package/dist/components/SkinLayer/SearchAndDiscoverySlideIn/PoiInfoActionPart/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/SkinLayer/SearchAndDiscoverySlideIn/PoiInfoActionPart/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,EAAE,EAEF,SAAS,EAIV,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,gDAAgD,CAAC;AAajF,oBAAY,OAAO;IACjB,MAAM,IAAA;IACN,MAAM,IAAA;CACP;AAED,KAAK,sBAAsB,GAAG;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,WAAW,CAAC,EAAE,sBAAsB,EAAE,CAAC;IACvC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,eAAe,KAAK,IAAI,CAAC;IACtD,mBAAmB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,SAAS,CAAC;CAC1D,CAAC;AAEF,QAAA,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/SkinLayer/SearchAndDiscoverySlideIn/PoiInfoActionPart/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,EAAE,EAEF,SAAS,EAIV,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,gDAAgD,CAAC;AAajF,oBAAY,OAAO;IACjB,MAAM,IAAA;IACN,MAAM,IAAA;CACP;AAED,KAAK,sBAAsB,GAAG;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,WAAW,CAAC,EAAE,sBAAsB,EAAE,CAAC;IACvC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,eAAe,KAAK,IAAI,CAAC;IACtD,mBAAmB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,SAAS,CAAC;CAC1D,CAAC;AAEF,QAAA,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAwKjD,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/SkinLayer/SearchAndDiscoverySlideIn/PromotionPart/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/SkinLayer/SearchAndDiscoverySlideIn/PromotionPart/index.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAE,EAAE,EAAE,SAAS,EAAmC,MAAM,OAAO,CAAC;AAIvE,KAAK,kBAAkB,GAAG;IACxB,WAAW,CAAC,EAAE,GAAG,EAAE,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC1C,mBAAmB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,SAAS,CAAC;CAC1D,CAAC;AAEF,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CA4JzC,CAAC;AAEF,eAAe,aAAa,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Item.d.ts","sourceRoot":"","sources":["../../../../../src/components/SkinLayer/SearchAndDiscoverySlideIn/ScenariosPart/Item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAM,SAAS,EAA+B,MAAM,OAAO,CAAC;AAEnE,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;
|
|
1
|
+
{"version":3,"file":"Item.d.ts","sourceRoot":"","sources":["../../../../../src/components/SkinLayer/SearchAndDiscoverySlideIn/ScenariosPart/Item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAM,SAAS,EAA+B,MAAM,OAAO,CAAC;AAEnE,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AAStE,KAAK,qBAAqB,GAAG;IAC3B,IAAI,EAAE,iBAAiB,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC5C,mBAAmB,CAAC,EAAE,MAAM,SAAS,CAAC;CACvC,CAAC;AAmEF,QAAA,MAAM,gBAAgB,6DAAqB,CAAC;AAC5C,OAAO,EAAE,gBAAgB,IAAI,YAAY,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/SearchAndDiscoverySlideIn/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/SearchAndDiscoverySlideIn/index.tsx"],"names":[],"mappings":"AAwRA,MAAM,CAAC,OAAO,UAAU,UAAU,4CAQjC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/TourScenarios/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/SkinLayer/TourScenarios/index.tsx"],"names":[],"mappings":"AA8NA,QAAA,MAAM,iBAAiB,0CAAsB,CAAC;AAC9C,OAAO,EAAE,iBAAiB,IAAI,aAAa,EAAE,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
|
-
import { ProductType, VisualizerListenersType } from '../../types/SkinLayer';
|
|
2
|
+
import { ActionMiddleware, ProductType, VisualizerListenersType } from '../../types/SkinLayer';
|
|
3
3
|
type VirtualTourVisualizerProps = {
|
|
4
4
|
elementId?: string;
|
|
5
5
|
apiHost?: string;
|
|
@@ -16,6 +16,7 @@ type VirtualTourVisualizerProps = {
|
|
|
16
16
|
};
|
|
17
17
|
listeners?: VisualizerListenersType;
|
|
18
18
|
products?: ProductType[];
|
|
19
|
+
middleware?: ActionMiddleware;
|
|
19
20
|
};
|
|
20
21
|
declare const ShowroomVisualizer: FC<VirtualTourVisualizerProps>;
|
|
21
22
|
export default ShowroomVisualizer;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/features/ShowroomVisualizer/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,EAAE,EAKH,MAAM,OAAO,CAAC;AAUf,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/features/ShowroomVisualizer/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,EAAE,EAKH,MAAM,OAAO,CAAC;AAUf,OAAO,EACL,gBAAgB,EAChB,WAAW,EACX,uBAAuB,EACxB,MAAM,uBAAuB,CAAC;AAO/B,KAAK,0BAA0B,GAAG;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,MAAM,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE;QACP,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,aAAa,CAAC,EAAE,MAAM,CAAC;KACxB,CAAC;IACF,SAAS,CAAC,EAAE,uBAAuB,CAAC;IACpC,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAC;IACzB,UAAU,CAAC,EAAE,gBAAgB,CAAC;CAC/B,CAAC;AACF,QAAA,MAAM,kBAAkB,EAAE,EAAE,CAAC,0BAA0B,CAuRtD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTourVisualizer.d.ts","sourceRoot":"","sources":["../../../src/hooks/Visualizer/useTourVisualizer.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useTourVisualizer.d.ts","sourceRoot":"","sources":["../../../src/hooks/Visualizer/useTourVisualizer.ts"],"names":[],"mappings":"AAwBA,QAAA,MAAM,iBAAiB,YA0mBtB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
|