@almadar/ui 5.33.0 → 5.33.1

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.
@@ -17,6 +17,7 @@ import React from 'react';
17
17
  import type { EventEmit } from '@almadar/core';
18
18
  import * as THREE from 'three';
19
19
  import { AssetLoader } from './three/loaders/AssetLoader';
20
+ import { type MinimalMouseEvent } from './three/hooks/useGameCanvas3DEvents';
20
21
  import type { IsometricTile, IsometricUnit, IsometricFeature } from '../organisms/types/isometric';
21
22
  import './GameCanvas3D.css';
22
23
  export type { IsometricTile, IsometricUnit, IsometricFeature };
@@ -74,15 +75,15 @@ export interface GameCanvas3DProps {
74
75
  /** Background color */
75
76
  backgroundColor?: string;
76
77
  /** Callback when a tile is clicked */
77
- onTileClick?: (tile: IsometricTile, event: React.MouseEvent) => void;
78
+ onTileClick?: (tile: IsometricTile, event: MinimalMouseEvent) => void;
78
79
  /** Callback when a unit is clicked */
79
- onUnitClick?: (unit: IsometricUnit, event: React.MouseEvent) => void;
80
+ onUnitClick?: (unit: IsometricUnit, event: MinimalMouseEvent) => void;
80
81
  /** Callback when a feature is clicked */
81
- onFeatureClick?: (feature: IsometricFeature, event: React.MouseEvent) => void;
82
+ onFeatureClick?: (feature: IsometricFeature, event: MinimalMouseEvent) => void;
82
83
  /** Callback when canvas is clicked (background) */
83
- onCanvasClick?: (event: React.MouseEvent) => void;
84
+ onCanvasClick?: (event: MinimalMouseEvent) => void;
84
85
  /** Callback when mouse moves over a tile */
85
- onTileHover?: (tile: IsometricTile | null, event: React.MouseEvent) => void;
86
+ onTileHover?: (tile: IsometricTile | null, event: MinimalMouseEvent) => void;
86
87
  /** Callback for unit animation state change */
87
88
  onUnitAnimation?: (unitId: string, state: string) => void;
88
89
  /** Asset loader instance (uses global singleton if not provided) */
@@ -69,29 +69,29 @@ export interface MinimalMouseEvent {
69
69
  }
70
70
  export interface UseGameCanvas3DEventsOptions extends GameCanvas3DEventConfig {
71
71
  /** Callback for tile clicks (direct) */
72
- onTileClick?: (tile: IsometricTile, event: React.MouseEvent) => void;
72
+ onTileClick?: (tile: IsometricTile, event: MinimalMouseEvent) => void;
73
73
  /** Callback for unit clicks (direct) */
74
- onUnitClick?: (unit: IsometricUnit, event: React.MouseEvent) => void;
74
+ onUnitClick?: (unit: IsometricUnit, event: MinimalMouseEvent) => void;
75
75
  /** Callback for feature clicks (direct) */
76
- onFeatureClick?: (feature: IsometricFeature, event: React.MouseEvent) => void;
76
+ onFeatureClick?: (feature: IsometricFeature, event: MinimalMouseEvent) => void;
77
77
  /** Callback for canvas clicks (direct) */
78
- onCanvasClick?: (event: React.MouseEvent) => void;
78
+ onCanvasClick?: (event: MinimalMouseEvent) => void;
79
79
  /** Callback for tile hover (direct) */
80
- onTileHover?: (tile: IsometricTile | null, event: React.MouseEvent) => void;
80
+ onTileHover?: (tile: IsometricTile | null, event: MinimalMouseEvent) => void;
81
81
  /** Callback for unit animation changes (direct) */
82
82
  onUnitAnimation?: (unitId: string, state: string) => void;
83
83
  }
84
84
  export interface UseGameCanvas3DEventsReturn {
85
85
  /** Handle tile click - emits event and calls callback */
86
- handleTileClick: (tile: IsometricTile, event: React.MouseEvent) => void;
86
+ handleTileClick: (tile: IsometricTile, event: MinimalMouseEvent) => void;
87
87
  /** Handle unit click - emits event and calls callback */
88
- handleUnitClick: (unit: IsometricUnit, event: React.MouseEvent) => void;
88
+ handleUnitClick: (unit: IsometricUnit, event: MinimalMouseEvent) => void;
89
89
  /** Handle feature click - emits event and calls callback */
90
- handleFeatureClick: (feature: IsometricFeature, event: React.MouseEvent) => void;
90
+ handleFeatureClick: (feature: IsometricFeature, event: MinimalMouseEvent) => void;
91
91
  /** Handle canvas click - emits event and calls callback */
92
92
  handleCanvasClick: (event: MinimalMouseEvent) => void;
93
93
  /** Handle tile hover - emits event and calls callback */
94
- handleTileHover: (tile: IsometricTile | null, event: React.MouseEvent) => void;
94
+ handleTileHover: (tile: IsometricTile | null, event: MinimalMouseEvent) => void;
95
95
  /** Handle unit animation - emits event and calls callback */
96
96
  handleUnitAnimation: (unitId: string, state: string) => void;
97
97
  /** Handle camera change - emits event */
@@ -2518,6 +2518,28 @@ var GameCanvas3D = React11.forwardRef(
2518
2518
  else if (isAttackTarget) emissive = 4456448;
2519
2519
  else if (isValidMove) emissive = 17408;
2520
2520
  else if (isHovered) emissive = 2236962;
2521
+ if (tile.modelUrl) {
2522
+ return /* @__PURE__ */ jsxRuntime.jsx(
2523
+ "group",
2524
+ {
2525
+ position,
2526
+ onClick: (e) => handleTileClick(tile, e),
2527
+ onPointerEnter: (e) => handleTileHover(tile, e),
2528
+ onPointerLeave: (e) => handleTileHover(null, e),
2529
+ userData: { type: "tile", tileId: tile.id, gridX: tile.x, gridZ: tile.z ?? tile.y },
2530
+ children: /* @__PURE__ */ jsxRuntime.jsx(
2531
+ ModelLoader,
2532
+ {
2533
+ url: tile.modelUrl,
2534
+ scale: 0.95,
2535
+ fallbackGeometry: "box",
2536
+ castShadow: true,
2537
+ receiveShadow: true
2538
+ }
2539
+ )
2540
+ }
2541
+ );
2542
+ }
2521
2543
  return /* @__PURE__ */ jsxRuntime.jsxs(
2522
2544
  "mesh",
2523
2545
  {
@@ -2550,17 +2572,30 @@ var GameCanvas3D = React11.forwardRef(
2550
2572
  /* @__PURE__ */ jsxRuntime.jsx("ringGeometry", { args: [0.4, 0.5, 32] }),
2551
2573
  /* @__PURE__ */ jsxRuntime.jsx("meshBasicMaterial", { color: "#ffff00", transparent: true, opacity: 0.8 })
2552
2574
  ] }),
2553
- /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [0, 0.3, 0], children: [
2554
- /* @__PURE__ */ jsxRuntime.jsx("cylinderGeometry", { args: [0.3, 0.3, 0.1, 8] }),
2555
- /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color })
2556
- ] }),
2557
- /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [0, 0.6, 0], children: [
2558
- /* @__PURE__ */ jsxRuntime.jsx("capsuleGeometry", { args: [0.2, 0.4, 4, 8] }),
2559
- /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color })
2560
- ] }),
2561
- /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [0, 0.9, 0], children: [
2562
- /* @__PURE__ */ jsxRuntime.jsx("sphereGeometry", { args: [0.12, 8, 8] }),
2563
- /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color })
2575
+ unit.modelUrl ? (
2576
+ /* GLB unit model (box fallback while loading / on error) */
2577
+ /* @__PURE__ */ jsxRuntime.jsx(
2578
+ ModelLoader,
2579
+ {
2580
+ url: unit.modelUrl,
2581
+ scale: 0.5,
2582
+ fallbackGeometry: "box",
2583
+ castShadow: true
2584
+ }
2585
+ )
2586
+ ) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2587
+ /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [0, 0.3, 0], children: [
2588
+ /* @__PURE__ */ jsxRuntime.jsx("cylinderGeometry", { args: [0.3, 0.3, 0.1, 8] }),
2589
+ /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color })
2590
+ ] }),
2591
+ /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [0, 0.6, 0], children: [
2592
+ /* @__PURE__ */ jsxRuntime.jsx("capsuleGeometry", { args: [0.2, 0.4, 4, 8] }),
2593
+ /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color })
2594
+ ] }),
2595
+ /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [0, 0.9, 0], children: [
2596
+ /* @__PURE__ */ jsxRuntime.jsx("sphereGeometry", { args: [0.12, 8, 8] }),
2597
+ /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color })
2598
+ ] })
2564
2599
  ] }),
2565
2600
  unit.health !== void 0 && unit.maxHealth !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("group", { position: [0, 1.2, 0], children: [
2566
2601
  /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [-0.25, 0, 0], children: [
@@ -2494,6 +2494,28 @@ var GameCanvas3D = forwardRef(
2494
2494
  else if (isAttackTarget) emissive = 4456448;
2495
2495
  else if (isValidMove) emissive = 17408;
2496
2496
  else if (isHovered) emissive = 2236962;
2497
+ if (tile.modelUrl) {
2498
+ return /* @__PURE__ */ jsx(
2499
+ "group",
2500
+ {
2501
+ position,
2502
+ onClick: (e) => handleTileClick(tile, e),
2503
+ onPointerEnter: (e) => handleTileHover(tile, e),
2504
+ onPointerLeave: (e) => handleTileHover(null, e),
2505
+ userData: { type: "tile", tileId: tile.id, gridX: tile.x, gridZ: tile.z ?? tile.y },
2506
+ children: /* @__PURE__ */ jsx(
2507
+ ModelLoader,
2508
+ {
2509
+ url: tile.modelUrl,
2510
+ scale: 0.95,
2511
+ fallbackGeometry: "box",
2512
+ castShadow: true,
2513
+ receiveShadow: true
2514
+ }
2515
+ )
2516
+ }
2517
+ );
2518
+ }
2497
2519
  return /* @__PURE__ */ jsxs(
2498
2520
  "mesh",
2499
2521
  {
@@ -2526,17 +2548,30 @@ var GameCanvas3D = forwardRef(
2526
2548
  /* @__PURE__ */ jsx("ringGeometry", { args: [0.4, 0.5, 32] }),
2527
2549
  /* @__PURE__ */ jsx("meshBasicMaterial", { color: "#ffff00", transparent: true, opacity: 0.8 })
2528
2550
  ] }),
2529
- /* @__PURE__ */ jsxs("mesh", { position: [0, 0.3, 0], children: [
2530
- /* @__PURE__ */ jsx("cylinderGeometry", { args: [0.3, 0.3, 0.1, 8] }),
2531
- /* @__PURE__ */ jsx("meshStandardMaterial", { color })
2532
- ] }),
2533
- /* @__PURE__ */ jsxs("mesh", { position: [0, 0.6, 0], children: [
2534
- /* @__PURE__ */ jsx("capsuleGeometry", { args: [0.2, 0.4, 4, 8] }),
2535
- /* @__PURE__ */ jsx("meshStandardMaterial", { color })
2536
- ] }),
2537
- /* @__PURE__ */ jsxs("mesh", { position: [0, 0.9, 0], children: [
2538
- /* @__PURE__ */ jsx("sphereGeometry", { args: [0.12, 8, 8] }),
2539
- /* @__PURE__ */ jsx("meshStandardMaterial", { color })
2551
+ unit.modelUrl ? (
2552
+ /* GLB unit model (box fallback while loading / on error) */
2553
+ /* @__PURE__ */ jsx(
2554
+ ModelLoader,
2555
+ {
2556
+ url: unit.modelUrl,
2557
+ scale: 0.5,
2558
+ fallbackGeometry: "box",
2559
+ castShadow: true
2560
+ }
2561
+ )
2562
+ ) : /* @__PURE__ */ jsxs(Fragment, { children: [
2563
+ /* @__PURE__ */ jsxs("mesh", { position: [0, 0.3, 0], children: [
2564
+ /* @__PURE__ */ jsx("cylinderGeometry", { args: [0.3, 0.3, 0.1, 8] }),
2565
+ /* @__PURE__ */ jsx("meshStandardMaterial", { color })
2566
+ ] }),
2567
+ /* @__PURE__ */ jsxs("mesh", { position: [0, 0.6, 0], children: [
2568
+ /* @__PURE__ */ jsx("capsuleGeometry", { args: [0.2, 0.4, 4, 8] }),
2569
+ /* @__PURE__ */ jsx("meshStandardMaterial", { color })
2570
+ ] }),
2571
+ /* @__PURE__ */ jsxs("mesh", { position: [0, 0.9, 0], children: [
2572
+ /* @__PURE__ */ jsx("sphereGeometry", { args: [0.12, 8, 8] }),
2573
+ /* @__PURE__ */ jsx("meshStandardMaterial", { color })
2574
+ ] })
2540
2575
  ] }),
2541
2576
  unit.health !== void 0 && unit.maxHealth !== void 0 && /* @__PURE__ */ jsxs("group", { position: [0, 1.2, 0], children: [
2542
2577
  /* @__PURE__ */ jsxs("mesh", { position: [-0.25, 0, 0], children: [
@@ -51,6 +51,8 @@ export type IsometricUnit = {
51
51
  z?: number;
52
52
  /** Static sprite URL (used when no sprite sheet animation) */
53
53
  sprite?: AssetUrl;
54
+ /** 3D model URL (GLB format) for GameCanvas3D — rendered via ModelLoader with box fallback */
55
+ modelUrl?: AssetUrl;
54
56
  /** Unit archetype key for sprite resolution */
55
57
  unitType?: string;
56
58
  /** Hero identifier for sprite sheet lookup */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@almadar/ui",
3
- "version": "5.33.0",
3
+ "version": "5.33.1",
4
4
  "description": "React UI components, hooks, and providers for Almadar",
5
5
  "type": "module",
6
6
  "sideEffects": [