gaesup-world 0.2.52 → 0.3.1

package/dist/gaesup/animation/actions.d.ts

@@ -42,3 +42,8 @@ export default function playActions({ type, animationResult, currentAnimation, }
     animationRef: import("react").MutableRefObject<Object3D<Object3DEventMap>>;
     currentAnimation: string;
 };
+export declare const setAnimation: ({ currentAnimation, actions, type, }: {
+    currentAnimation?: string;
+    actions?: actionsType;
+    type?: "character" | "vehicle" | "airplane";
+}) => void;

package/dist/gaesup/animation/actions.js

@@ -101,3 +101,13 @@ export default function playActions(_a) {
         currentAnimation: (_b = animationState === null || animationState === void 0 ? void 0 : animationState[type]) === null || _b === void 0 ? void 0 : _b.current,
     };
 }
+export var setAnimation = function (_a) {
+    var currentAnimation = _a.currentAnimation, actions = _a.actions, type = _a.type;
+    useEffect(function () {
+        var _a;
+        var action = (_a = actions[currentAnimation]) === null || _a === void 0 ? void 0 : _a.reset().fadeIn(0.2).play();
+        return function () {
+            action === null || action === void 0 ? void 0 : action.fadeOut(0.2);
+        };
+    }, [currentAnimation, type]);
+};

package/dist/gaesup/camera/control/normal.js

@@ -14,5 +14,6 @@ export default function normal(prop) {
         .clone()
         .add(V3(0, cameraOption.YDistance, cameraOption.ZDistance));
     state.camera.position.lerp(cameraPosition, 1);
-    state.camera.lookAt(activeState.position.clone());
+    if (!cameraOption.target)
+        state.camera.lookAt(activeState.position.clone());
 }

package/dist/gaesup/camera/index.js

@@ -23,9 +23,9 @@ export default function Camera(_a) {
     var refs = _a.refs, prop = _a.prop, control = _a.control;
     var worldContext = useContext(GaesupWorldContext);
     var controllerContext = useContext(GaesupControllerContext);
-    var mode = worldContext.mode, cameraOption = worldContext.cameraOption;
+    var mode = worldContext.mode, cameraOption = worldContext.cameraOption, activeState = worldContext.activeState;
     var rigidBodyRef = refs.rigidBodyRef, outerGroupRef = refs.outerGroupRef;
-    var _b = useThree(), scene = _b.scene, camera = _b.camera;
+    var camera = useThree().camera;
     var cameraRef = useRef();
     var intersectObjectMap = useMemo(function () { return ({}); }, []);
     var cameraProp = __assign(__assign({}, prop), { control: control, controllerContext: controllerContext, worldContext: worldContext, intersectObjectMap: intersectObjectMap });
@@ -70,42 +70,24 @@ export default function Camera(_a) {
             // detector(cameraProp);
         }
     });
-    //   // moveTo 함수 정의
-    //   worldContext.moveTo = async (
-    //     position: THREE.Vector3,
-    //     target: THREE.Vector3
-    //   ) => {
-    //     camera.position.copy(position);
-    //     if (mode.control === "orbit") {
-    //       await Promise.all([
-    //         cameraRef.current.setPosition(position.x, position.y, position.z, true),
-    //
-    //         camera.rotation.copy(worldContext.activeState.euler),
-    //         cameraRef.current.setLookAt(
-    //           position.x,
-    //           position.y,
-    //           position.z,
-    //           target.x,
-    //           target.y,
-    //           target.z,
-    //           true
-    //         ),
-    //       ]);
-    //     } else if (mode.control === "normal") {
-    //       await Promise.all([
-    //         cameraRef.current.setPosition(0, position.y, position.z, true),
-    //         camera.rotation.copy(worldContext.activeState.euler),
-    //         cameraRef.current.setLookAt(
-    //           0,
-    //           position.y,
-    //           position.z,
-    //           target.x,
-    //           target.y,
-    //           target.z,
-    //           true
-    //         ),
-    //       ]);
-    //     }
-    //   };
+    // zoom
+    useEffect(function () {
+        if (cameraRef.current) {
+            cameraRef.current.zoomTo(worldContext.cameraOption.zoom, true);
+        }
+    }, [worldContext.cameraOption.zoom]);
+    // lookat
+    useEffect(function () {
+        if (cameraRef.current) {
+            var currentCamera = camera.position.clone();
+            if (cameraOption.focus) {
+                cameraRef.current.setLookAt(currentCamera.x, currentCamera.y, currentCamera.z, cameraOption.target.x, cameraOption.target.y, cameraOption.target.z, true);
+                // 포커스 품
+            }
+            else if (!cameraOption.focus) {
+                cameraRef.current.setLookAt(currentCamera.x, currentCamera.y, currentCamera.z, activeState.position.x, activeState.position.y, activeState.position.z, true);
+            }
+        }
+    }, [cameraOption.focus]);
     return _jsx(CameraControls, { ref: cameraRef });
 }

package/dist/gaesup/component/inner/character/index.js

@@ -24,5 +24,5 @@ export function CharacterInnerRef(_a) {
     var outerGroupRef = refs.outerGroupRef, rigidBodyRef = refs.rigidBodyRef, colliderRef = refs.colliderRef, innerGroupRef = refs.innerGroupRef;
     var size = useGltfAndSize({ url: urls.characterUrl }).size;
     var collider = calcCharacterColliderProps(size);
-    return (_jsx(_Fragment, { children: collider && (_jsxs(OuterGroupRef, { ref: outerGroupRef, children: [children, _jsxs(RigidBodyRef, { ref: rigidBodyRef, name: "character", position: position, rotation: euler, children: [_jsx(CapsuleCollider, { ref: colliderRef, args: [collider.height, collider.radius], position: [0, collider.height + collider.radius, 0] }), _jsx(InnerGroupRef, { type: "character", ref: innerGroupRef, url: urls.characterUrl, currentAnimation: currentAnimation })] })] })) }));
+    return (_jsx(_Fragment, { children: collider && (_jsx(OuterGroupRef, { ref: outerGroupRef, children: _jsxs(RigidBodyRef, { ref: rigidBodyRef, name: "character", position: position, rotation: euler, children: [_jsx(CapsuleCollider, { ref: colliderRef, args: [collider.height, collider.radius], position: [0, collider.height + collider.radius, 0] }), _jsx(InnerGroupRef, { type: "character", ref: innerGroupRef, url: urls.characterUrl, currentAnimation: currentAnimation, children: children })] }) })) }));
 }

package/dist/gaesup/component/passive/character/index.d.ts

@@ -5,6 +5,7 @@ export type passiveCharacterPropsType = {
     euler: THREE.Euler;
     urls: urlsType;
     currentAnimation: string;
+    gravityScale?: number;
     children?: React.ReactNode;
 };
 export declare function PassiveCharacter(props: passiveCharacterPropsType): import("react/jsx-runtime").JSX.Element;

package/dist/gaesup/component/passive/character/index.js

@@ -1,10 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useAnimations } from "@react-three/drei";
 import { useFrame } from "@react-three/fiber";
 import { quat } from "@react-three/rapier";
 import { useEffect, useMemo, useRef } from "react";
-import playActions from "../../../animation/actions";
-import { useGltfAndSize } from "../../../hooks/useGaesupGltf";
 import { CharacterInnerRef } from "../../inner/character";
 export function PassiveCharacter(props) {
     var rigidBodyRef = useRef(null);
@@ -21,10 +18,9 @@ export function PassiveCharacter(props) {
         return {
             position: props.position,
             euler: props.euler,
-            currentAnimation: props.currentAnimation,
             characterUrl: props.urls.characterUrl,
         };
-    }, [props]), position = _a.position, euler = _a.euler, currentAnimation = _a.currentAnimation;
+    }, [props]), position = _a.position, euler = _a.euler;
     useEffect(function () {
         if (rigidBodyRef || rigidBodyRef.current) {
             rigidBodyRef.current.setEnabledRotations(false, false, false, false);
@@ -35,12 +31,5 @@ export function PassiveCharacter(props) {
             innerGroupRef.current.quaternion.rotateTowards(quat().setFromEuler(euler), 10 * delta);
         }
     });
-    var gltf = useGltfAndSize({ url: props.urls.characterUrl }).gltf;
-    var animationResult = useAnimations(gltf.animations);
-    var animationRef = playActions({
-        type: "character",
-        animationResult: animationResult,
-        currentAnimation: currentAnimation,
-    }).animationRef;
-    return (_jsx(CharacterInnerRef, { animationRef: animationRef, position: position, refs: refs, urls: props.urls, children: props.children }));
+    return (_jsx(CharacterInnerRef, { position: position, refs: refs, urls: props.urls, currentAnimation: props.currentAnimation, children: props.children }));
 }

package/dist/gaesup/gaesupProps/index.js

@@ -11,17 +11,59 @@ var __assign = (this && this.__assign) || function () {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { vec3 } from "@react-three/rapier";
-import { Suspense, useContext, useEffect, useMemo, useRef } from "react";
+import { Suspense, useContext, useEffect, useRef } from "react";
 import * as THREE from "three";
-import { GaesupWorldContext, GaesupWorldDispatchContext, } from "../world/context/index.js";
+import useClicker from "../hooks/useClicker";
+import { GaesupWorldContext, GaesupWorldDispatchContext, } from "../world/context";
 export function GaeSupProps(_a) {
     var _b = _a.type, type = _b === void 0 ? "normal" : _b, text = _a.text, position = _a.position, children = _a.children;
     var groupRef = useRef(null);
-    var minimap = useContext(GaesupWorldContext).minimap;
+    var _c = useContext(GaesupWorldContext), minimap = _c.minimap, activeState = _c.activeState, clicker = _c.clicker;
     var dispatch = useContext(GaesupWorldDispatchContext);
-    var groupComponent = useMemo(function () {
-        return (_jsx("group", { ref: groupRef, position: position, children: children }));
-    }, []);
+    // clicker
+    var moveClicker = useClicker().moveClicker;
+    //   const moveClicker = (e: ThreeEvent<MouseEvent>) => {
+    //     const originPoint = activeState.position;
+    //     const newPosition = e.point;
+    //     const newAngle = Math.atan2(
+    //       newPosition.z - originPoint.z,
+    //       newPosition.x - originPoint.x
+    //     );
+    //     const norm = Math.sqrt(
+    //       Math.pow(newPosition.z - originPoint.z, 2) +
+    //         Math.pow(newPosition.x - originPoint.x, 2)
+    //     );
+    //     if (norm < 1) return;
+    //     dispatch({
+    //       type: "update",
+    //       payload: {
+    //         clicker: {
+    //           point: V3(e.point.x, e.point.y, e.point.z),
+    //           angle: newAngle,
+    //           isOn: true,
+    //         },
+    //       },
+    //     });
+    //   };
+    //
+    //   // 거리 계산
+    //   useEffect(() => {
+    //     const originPoint = activeState.position;
+    //     const newPosition = clicker.point;
+    //     const norm = Math.sqrt(
+    //       Math.pow(newPosition.z - originPoint.z, 2) +
+    //         Math.pow(newPosition.x - originPoint.x, 2)
+    //     );
+    //     if (norm < 1) {
+    //       clicker.isOn = false;
+    //       dispatch({
+    //         type: "update",
+    //         payload: {
+    //           clicker: clicker,
+    //         },
+    //       });
+    //     }
+    //   }, [activeState.position, clicker.point]);
     useEffect(function () {
         if (groupRef.current) {
             var box = new THREE.Box3().setFromObject(groupRef.current);
@@ -42,5 +84,7 @@ export function GaeSupProps(_a) {
             });
         }
     }, []);
-    return _jsx(Suspense, { fallback: null, children: groupComponent });
+    return (_jsx(Suspense, { fallback: null, children: _jsx("group", { ref: groupRef, position: position, 
+            // onClick={(e) => clickerPoint(e, activeState.position.clone())}
+            onPointerDown: function (e) { return moveClicker(e, false); }, onDoubleClick: function (e) { return moveClicker(e, true); }, children: children }) }));
 }

package/dist/gaesup/hooks/useClicker/index.d.ts

@@ -0,0 +1,4 @@
+import { ThreeEvent } from "@react-three/fiber";
+export default function useClicker(): {
+    moveClicker: (e: ThreeEvent<MouseEvent>, isRun: boolean) => void;
+};

package/dist/gaesup/hooks/useClicker/index.js

@@ -0,0 +1,50 @@
+import { useContext, useEffect } from "react";
+import { V3 } from "../../utils";
+import { GaesupWorldContext, GaesupWorldDispatchContext, } from "../../world/context";
+export default function useClicker() {
+    var _a = useContext(GaesupWorldContext), activeState = _a.activeState, clicker = _a.clicker, mode = _a.mode;
+    var dispatch = useContext(GaesupWorldDispatchContext);
+    var moveClicker = function (e, isRun) {
+        if (mode.controller !== "clicker")
+            return;
+        var originPoint = activeState.position;
+        var newPosition = e.point;
+        var newAngle = Math.atan2(newPosition.z - originPoint.z, newPosition.x - originPoint.x);
+        var norm = Math.sqrt(Math.pow(newPosition.z - originPoint.z, 2) +
+            Math.pow(newPosition.x - originPoint.x, 2));
+        if (norm < 1)
+            return;
+        dispatch({
+            type: "update",
+            payload: {
+                clicker: {
+                    point: V3(e.point.x, e.point.y, e.point.z),
+                    angle: newAngle,
+                    isOn: true,
+                    isRun: isRun,
+                },
+            },
+        });
+    };
+    // 거리 계산
+    useEffect(function () {
+        if (mode.controller !== "clicker")
+            return;
+        var originPoint = activeState.position;
+        var newPosition = clicker.point;
+        var norm = Math.sqrt(Math.pow(newPosition.z - originPoint.z, 2) +
+            Math.pow(newPosition.x - originPoint.x, 2));
+        if (norm < 1) {
+            clicker.isOn = false;
+            dispatch({
+                type: "update",
+                payload: {
+                    clicker: clicker,
+                },
+            });
+        }
+    }, [activeState.position, clicker.point]);
+    return {
+        moveClicker: moveClicker,
+    };
+}

package/dist/gaesup/hooks/useFocus/index.d.ts

@@ -0,0 +1,7 @@
+export declare function useFocus(): {
+    open: ({ zoom, target }: {
+        zoom?: number;
+        target: THREE.Vector3;
+    }) => void;
+    close: () => void;
+};

package/dist/gaesup/hooks/useFocus/index.js

@@ -0,0 +1,32 @@
+import { useContext } from "react";
+import { GaesupWorldContext, GaesupWorldDispatchContext, } from "../../world/context";
+export function useFocus() {
+    var cameraOption = useContext(GaesupWorldContext).cameraOption;
+    var dispatch = useContext(GaesupWorldDispatchContext);
+    var open = function (_a) {
+        var zoom = _a.zoom, target = _a.target;
+        if (zoom)
+            cameraOption.zoom = zoom;
+        cameraOption.target = target;
+        cameraOption.focus = true;
+        dispatch({
+            type: "update",
+            payload: {
+                cameraOption: cameraOption,
+            },
+        });
+    };
+    var close = function () {
+        cameraOption.focus = false;
+        dispatch({
+            type: "update",
+            payload: {
+                cameraOption: cameraOption,
+            },
+        });
+    };
+    return {
+        open: open,
+        close: close,
+    };
+}

package/dist/gaesup/hooks/useZoom/index.d.ts

@@ -0,0 +1,3 @@
+export declare function useZoom(): {
+    zoom: (zoom: number) => void;
+};

package/dist/gaesup/hooks/useZoom/index.js

@@ -0,0 +1,18 @@
+import { useContext } from "react";
+import { GaesupWorldContext, GaesupWorldDispatchContext, } from "../../world/context";
+export function useZoom() {
+    var cameraOption = useContext(GaesupWorldContext).cameraOption;
+    var dispatch = useContext(GaesupWorldDispatchContext);
+    var zoom = function (zoom) {
+        cameraOption.zoom = zoom;
+        dispatch({
+            type: "update",
+            payload: {
+                cameraOption: cameraOption,
+            },
+        });
+    };
+    return {
+        zoom: zoom,
+    };
+}

package/dist/gaesup/physics/character/direction.d.ts

@@ -1,21 +1,20 @@
-import { RootState } from "@react-three/fiber";
 import { joyStickInnerType } from "../../tools/joyStick/type";
-import { activeStateType, modeType } from "../../world/context/type";
+import { activeStateType, clickerType, modeType } from "../../world/context/type";
 import { calcPropType } from "../type";
-export declare function orbitDirection({ activeState, control, mode, joystick, state, }: {
-    state: RootState;
+export declare function orbitDirection({ activeState, control, mode, joystick, clicker, }: {
     activeState: activeStateType;
     mode: modeType;
     joystick: joyStickInnerType;
+    clicker: clickerType;
     control: {
         [key: string]: boolean;
     };
 }): void;
-export declare function normalDirection({ activeState, control, mode, joystick, state, }: {
-    state: RootState;
+export declare function normalDirection({ activeState, control, mode, joystick, clicker, }: {
     activeState: activeStateType;
     mode: modeType;
     joystick: joyStickInnerType;
+    clicker: clickerType;
     control: {
         [key: string]: boolean;
     };

package/dist/gaesup/physics/character/direction.js

@@ -1,6 +1,6 @@
 import { V3, calcAngleByVector } from "../../utils/vector";
 export function orbitDirection(_a) {
-    var activeState = _a.activeState, control = _a.control, mode = _a.mode, joystick = _a.joystick, state = _a.state;
+    var activeState = _a.activeState, control = _a.control, mode = _a.mode, joystick = _a.joystick, clicker = _a.clicker;
     var forward = control.forward, backward = control.backward, leftward = control.leftward, rightward = control.rightward;
     var dirX = Number(leftward) - Number(rightward);
     var dirZ = Number(forward) - Number(backward);
@@ -11,6 +11,10 @@ export function orbitDirection(_a) {
         activeState.euler.y = Math.PI / 2 - joystick.joyStickOrigin.angle;
         start = 1;
     }
+    else if (mode.controller === "clicker") {
+        activeState.euler.y = Math.PI / 2 - clicker.angle;
+        start = 1;
+    }
     else {
         if (dirX === 0 && dirZ === 0)
             return;
@@ -22,14 +26,17 @@ export function orbitDirection(_a) {
     activeState.dir = activeState.direction.normalize();
 }
 export function normalDirection(_a) {
-    var activeState = _a.activeState, control = _a.control, mode = _a.mode, joystick = _a.joystick, state = _a.state;
+    var activeState = _a.activeState, control = _a.control, mode = _a.mode, joystick = _a.joystick, clicker = _a.clicker;
     var forward = control.forward, backward = control.backward, leftward = control.leftward, rightward = control.rightward;
-    var start = 0;
     if (mode.controller === "joystick") {
         if (joystick.joyStickOrigin.isCenter)
             return;
         activeState.euler.y = Math.PI / 2 - joystick.joyStickOrigin.angle;
-        start = 1;
+        activeState.dir.set(-Math.sin(activeState.euler.y), 0, -Math.cos(activeState.euler.y));
+    }
+    else if (mode.controller === "clicker") {
+        activeState.euler.y = Math.PI / 2 - clicker.angle;
+        activeState.dir.set(-Math.sin(activeState.euler.y), 0, -Math.cos(activeState.euler.y));
     }
     else {
         // 일반 컨트롤
@@ -45,11 +52,11 @@ export function normalDirection(_a) {
     }
 }
 export default function direction(prop) {
-    var state = prop.state, _a = prop.worldContext, joystick = _a.joystick, mode = _a.mode, activeState = _a.activeState, control = _a.control;
+    var state = prop.state, _a = prop.worldContext, joystick = _a.joystick, mode = _a.mode, activeState = _a.activeState, control = _a.control, clicker = _a.clicker;
     if (mode.control === "normal") {
-        normalDirection({ activeState: activeState, control: control, mode: mode, joystick: joystick, state: state });
+        normalDirection({ activeState: activeState, control: control, mode: mode, joystick: joystick, clicker: clicker });
     }
     else if (mode.control === "orbit") {
-        orbitDirection({ activeState: activeState, control: control, mode: mode, joystick: joystick, state: state });
+        orbitDirection({ activeState: activeState, control: control, mode: mode, joystick: joystick, clicker: clicker });
     }
 }

package/dist/gaesup/physics/check/moving.js

@@ -1,5 +1,5 @@
 export default function moving(prop) {
-    var _a = prop.worldContext, states = _a.states, joystick = _a.joystick, mode = _a.mode, control = _a.control;
+    var _a = prop.worldContext, states = _a.states, joystick = _a.joystick, mode = _a.mode, control = _a.control, clicker = _a.clicker;
     var forward = control.forward, backward = control.backward, leftward = control.leftward, rightward = control.rightward, shift = control.shift, space = control.space;
     if (mode.controller === "gameboy" || mode.controller === "keyboard") {
         states.isMoving = forward || backward || leftward || rightward;
@@ -13,4 +13,10 @@ export default function moving(prop) {
         states.isRunning = shift && states.isMoving;
         states.isJumping = space;
     }
+    else if (mode.controller === "clicker") {
+        states.isMoving = clicker.isOn;
+        states.isNotMoving = !clicker.isOn;
+        states.isRunning = (shift || clicker.isRun) && states.isMoving;
+        states.isJumping = space;
+    }
 }

package/dist/gaesup/tools/clicker/index.d.ts

@@ -0,0 +1,5 @@
+import { ReactNode } from "react";
+export declare function Clicker({ onMarker, runMarker, }: {
+    onMarker: ReactNode;
+    runMarker: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/gaesup/tools/clicker/index.js

@@ -0,0 +1,8 @@
+import { jsxs as _jsxs, Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { useContext } from "react";
+import { GaesupWorldContext } from "../../world/context";
+export function Clicker(_a) {
+    var onMarker = _a.onMarker, runMarker = _a.runMarker;
+    var _b = useContext(GaesupWorldContext), clicker = _b.clicker, mode = _b.mode;
+    return (_jsx(_Fragment, { children: mode.controller === "clicker" && (_jsxs("group", { position: clicker.point, children: [clicker.isOn && onMarker, clicker.isOn && clicker.isRun && runMarker] })) }));
+}

package/dist/gaesup/utils/debug.d.ts

@@ -1,4 +1,4 @@
-type valueType = string | number | THREE.Vector3 | THREE.Quaternion | THREE.Euler;
+type valueType = string | boolean | number | THREE.Vector3 | THREE.Quaternion | THREE.Euler;
 type constantType = {
     [key: string]: valueType;
 };

package/dist/gaesup/utils/innerHtml.d.ts

@@ -0,0 +1,4 @@
+export declare function InnerHtml({ children, ...props }: {
+    [x: string]: any;
+    children: any;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/gaesup/utils/innerHtml.js

@@ -0,0 +1,41 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Html } from "@react-three/drei";
+import { useFrame } from "@react-three/fiber";
+import { useRef, useState } from "react";
+import * as THREE from "three";
+export function InnerHtml(_a) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    var ref = useRef();
+    var _b = useState(), isOccluded = _b[0], setOccluded = _b[1];
+    var _c = useState(), isInRange = _c[0], setInRange = _c[1];
+    var isVisible = isInRange && !isOccluded;
+    var vec = new THREE.Vector3();
+    useFrame(function (state) {
+        var range = state.camera.position.distanceTo(ref.current.getWorldPosition(vec)) <= 10;
+        if (range !== isInRange)
+            setInRange(range);
+    });
+    return (_jsx("group", { ref: ref, children: _jsx(Html, __assign({ transform: true, occlude: true }, props, { children: children })) }));
+}

package/dist/gaesup/world/context/index.js

@@ -43,6 +43,12 @@ export var gaesupWorldDefault = {
     minimap: {
         props: {},
     },
+    clicker: {
+        point: V3(0, 0, 0),
+        angle: Math.PI / 2,
+        isOn: false,
+        isRun: false,
+    },
     joystick: {
         joyStickOrigin: {
             x: 0,
@@ -100,6 +106,9 @@ export var gaesupWorldDefault = {
         XDistance: 20,
         YDistance: 10,
         ZDistance: 20,
+        zoom: 1,
+        target: null,
+        focus: false,
     },
     moveTo: null,
     rideable: {},

package/dist/gaesup/world/context/reducer.d.ts

@@ -17,6 +17,7 @@ export declare function gaesupWorldReducer(props: gaesupWorldContextType, action
     animationState: import("./type").animationStateType;
     keyBoardMap: import("../../tools/keyBoardToolTip/type").keyboardMapType;
     cameraOption: import("./type").cameraOptionType;
+    clicker: import("./type").clickerType;
     moveTo: (position: import("three").Vector3, target: import("three").Vector3) => Promise<void>;
     rideable: {
         [key: string]: import("./type").rideableType;

package/dist/gaesup/world/context/type.d.ts

@@ -10,6 +10,9 @@ export type gaesupCameraOptionDebugType = {
     XDistance?: number;
     YDistance?: number;
     ZDistance?: number;
+    zoom?: number;
+    target?: THREE.Vector3;
+    focus?: boolean;
 };
 export type cameraOptionType = {
     offset?: THREE.Vector3;
@@ -77,7 +80,7 @@ export type animationStatePropType = {
 };
 export type modeType = {
     type?: "character" | "vehicle" | "airplane";
-    controller?: "gameboy" | "keyboard" | "joystick";
+    controller?: "gameboy" | "keyboard" | "joystick" | "clicker";
     control?: "normal" | "orbit";
 };
 export type activeStateType = {
@@ -91,6 +94,12 @@ export type activeStateType = {
     direction: THREE.Vector3;
     dir: THREE.Vector3;
 };
+export type clickerType = {
+    point: THREE.Vector3;
+    angle: number;
+    isOn: boolean;
+    isRun: boolean;
+};
 export type wheelStateType = {
     position: THREE.Vector3;
     rotation: THREE.Euler;
@@ -155,6 +164,7 @@ export type gaesupWorldContextType = {
     animationState: animationStateType;
     keyBoardMap: keyboardMapType;
     cameraOption: cameraOptionType;
+    clicker: clickerType;
     moveTo: (position: THREE.Vector3, target: THREE.Vector3) => Promise<void>;
     rideable: {
         [key: string]: rideableType;

package/dist/gaesup/world/initalize/index.d.ts

@@ -17,6 +17,7 @@ export default function initGaesupWorld(props: gaesupWorldPropsType): {
             animationState: import("../context/type").animationStateType;
             keyBoardMap: import("../../tools/keyBoardToolTip/type").keyboardMapType;
             cameraOption: import("../context/type").cameraOptionType;
+            clicker: import("../context/type").clickerType;
             moveTo: (position: import("three").Vector3, target: import("three").Vector3) => Promise<void>;
             rideable: {
                 [key: string]: import("../context/type").rideableType;

package/dist/gaesup/world/initalize/index.js

@@ -26,6 +26,7 @@ export default function initGaesupWorld(props) {
         minimap: gaesupWorldDefault.minimap,
         joystick: gaesupWorldDefault.joystick,
         control: gaesupWorldDefault.control,
+        clicker: gaesupWorldDefault.clicker,
         animationState: gaesupWorldDefault.animationState,
         keyBoardMap: Object.assign(gaesupWorldDefault.keyBoardMap, props.keyBoardMap || {}),
         moveTo: null,

package/dist/index.d.ts

@@ -5,6 +5,7 @@ export { PassiveCharacter } from "./gaesup/component/passive/character";
 export { PassiveVehicle } from "./gaesup/component/passive/vehicle";
 export { GaesupController } from "./gaesup/controller";
 export { GaeSupProps } from "./gaesup/gaesupProps";
+export { Clicker } from "./gaesup/tools/clicker";
 export { GameBoy } from "./gaesup/tools/gameBoy";
 export { GamePad } from "./gaesup/tools/gamePad";
 export { JoyStick } from "./gaesup/tools/joyStick";
@@ -13,11 +14,14 @@ export { KeyBoardToolTip } from "./gaesup/tools/keyBoardToolTip";
 export { MiniMap } from "./gaesup/tools/miniMap";
 export { Rideable } from "./gaesup/tools/rideable";
 export { ZoomButton } from "./gaesup/tools/zoomButton";
+export { InnerHtml } from "./gaesup/utils/innerHtml";
 export { Elr, Qt, V3, V30, V31 } from "./gaesup/utils/vector";
 export { GaesupWorld } from "./gaesup/world";
+export { useFocus } from "./gaesup/hooks/useFocus";
 export { useGaesupAnimation } from "./gaesup/hooks/useGaesupAnimation";
 export { useGaesupController } from "./gaesup/hooks/useGaesupController";
 export * as useJoyStick from "./gaesup/hooks/useJoyStick";
 export { usePushKey } from "./gaesup/hooks/usePushKey";
 export { useRideable } from "./gaesup/hooks/useRideable";
 export { useTeleport } from "./gaesup/hooks/useTeleport";
+export { useZoom } from "./gaesup/hooks/useZoom";

package/dist/index.js

@@ -5,6 +5,7 @@ export { PassiveCharacter } from "./gaesup/component/passive/character";
 export { PassiveVehicle } from "./gaesup/component/passive/vehicle";
 export { GaesupController } from "./gaesup/controller";
 export { GaeSupProps } from "./gaesup/gaesupProps";
+export { Clicker } from "./gaesup/tools/clicker";
 export { GameBoy } from "./gaesup/tools/gameBoy";
 export { GamePad } from "./gaesup/tools/gamePad";
 export { JoyStick } from "./gaesup/tools/joyStick";
@@ -13,11 +14,14 @@ export { KeyBoardToolTip } from "./gaesup/tools/keyBoardToolTip";
 export { MiniMap } from "./gaesup/tools/miniMap";
 export { Rideable } from "./gaesup/tools/rideable";
 export { ZoomButton } from "./gaesup/tools/zoomButton";
+export { InnerHtml } from "./gaesup/utils/innerHtml";
 export { Elr, Qt, V3, V30, V31 } from "./gaesup/utils/vector";
 export { GaesupWorld } from "./gaesup/world";
+export { useFocus } from "./gaesup/hooks/useFocus";
 export { useGaesupAnimation } from "./gaesup/hooks/useGaesupAnimation";
 export { useGaesupController } from "./gaesup/hooks/useGaesupController";
 export * as useJoyStick from "./gaesup/hooks/useJoyStick";
 export { usePushKey } from "./gaesup/hooks/usePushKey";
 export { useRideable } from "./gaesup/hooks/useRideable";
 export { useTeleport } from "./gaesup/hooks/useTeleport";
+export { useZoom } from "./gaesup/hooks/useZoom";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gaesup-world",
-  "version": "0.2.52",
+  "version": "0.3.1",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",