@glyphcss/react 0.0.1 → 0.0.3
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/README.md +39 -28
- package/dist/index.cjs +480 -300
- package/dist/index.d.cts +116 -64
- package/dist/index.d.ts +116 -64
- package/dist/index.js +383 -206
- package/package.json +3 -3
package/dist/index.d.cts
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import { RenderMode, Vec3,
|
|
2
|
-
export { ApproximateMergeOptions, ArrowPolygonsOptions, AutoRotateConfig, AutoRotateOption, AxesHelperOptions, BASE_TILE, CAMERA_BACKFACE_CULL_EPS, CameraCullNormalGroup, CameraCullRotation, CameraHandle, CameraState, CameraStyleInput, CoverPlanarPolygonsOptions, CullInteriorOptions, DEFAULT_CAMERA_STATE, DEFAULT_PROJECTION, GltfParseOptions,
|
|
1
|
+
import { RenderMode, Polygon, GlyphGeometryName, Vec3, GlyphAnimationTarget, GlyphAnimationMixer, GlyphAnimationClip, GlyphAnimationAction, ParseAnimationController } from '@glyphcss/core';
|
|
2
|
+
export { ApproximateMergeOptions, ArrowPolygonsOptions, AutoRotateConfig, AutoRotateOption, AxesHelperOptions, BASE_TILE, CAMERA_BACKFACE_CULL_EPS, CameraCullNormalGroup, CameraCullRotation, CameraHandle, CameraState, CameraStyleInput, CoverPlanarPolygonsOptions, CullInteriorOptions, DEFAULT_CAMERA_STATE, DEFAULT_PROJECTION, GltfParseOptions, GlyphAmbientLight, GlyphAnimationAction, GlyphAnimationClip, GlyphAnimationMixer, GlyphAnimationTarget, GlyphDirectionalLight, GlyphGeometryName, GlyphGeometryOptions, LoadMeshOptions, LoopMode, LoopOnce, LoopPingPong, LoopRepeat, MtlParseResult, NormalizeResult, ObjParseOptions, OctahedronPolygonsOptions, OptimizeMeshPolygonsOptions, ParseAnimationClip, ParseAnimationController, ParseResult, ParsedColor, Polygon, PolygonFace, RingPolygonsOptions, SceneBbox, SceneContext, SceneContextBuildArgs, SceneContextBuildResult, SolidTextureSampleOptions, TextureTriangle, VOXEL_CAMERA_CULL_AXIS_EPS, VOXEL_CAMERA_CULL_NORMAL_LIMIT, Vec2, Vec3, VoxParseOptions, antiprismPolygons, arrowPolygons, axesHelperPolygons, bakeSolidTextureSampledPolygons, bakeSolidTextureSamples, bipyramidPolygons, buildSceneContext, cameraCullNormalGroups, cameraCullNormalGroupsFromPolygons, cameraCullNormalKey, cameraCullVisibleSignature, cameraFacingDepth, clampChannel, computeSceneBbox, computeShapeLighting, conePolygons, coverPlanarPolygons, createGlyphAnimationMixer, createIsometricCamera, cubePolygons, cuboctahedronPolygons, cullInteriorPolygons, cylinderPolygons, deltoidalHexecontahedronPolygons, deltoidalIcositetrahedronPolygons, disdyakisDodecahedronPolygons, disdyakisTriacontahedronPolygons, dodecahedronPolygons, formatColor, greatDodecahedronPolygons, greatIcosahedronPolygons, greatStellatedDodecahedronPolygons, icosahedronPolygons, icosidodecahedronPolygons, inverseRotateVec3, isAxisAlignedSurfaceNormal, isVoxelCameraCullableNormalGroups, loadMesh, mergePolygons, normalFacesCamera, normalizeInvertMultiplier, normalizePolygons, octahedronPolygons, optimizeMeshPolygons, parseColor, parseGltf, parseHexColor, parseMtl, parseObj, parsePureColor, parseRgbColor, parseVox, pentagonalHexecontahedronPolygons, pentagonalIcositetrahedronPolygons, pentakisDodecahedronPolygons, planePolygons, polygonCssSurfaceNormal, polygonFaces, polygonFacesCamera, prismPolygons, pyramidPolygons, resolveGeometry, rhombicDodecahedronPolygons, rhombicTriacontahedronPolygons, rhombicosidodecahedronPolygons, rhombicuboctahedronPolygons, ringPolygons, ringQuadPolygons, rotateVec3, shadeColor, smallStellatedDodecahedronPolygons, snubCubePolygons, snubDodecahedronPolygons, spherePolygons, tetrahedronPolygons, tetrakisHexahedronPolygons, torusPolygons, trapezohedronPolygons, triakisIcosahedronPolygons, triakisOctahedronPolygons, triakisTetrahedronPolygons, truncatedCubePolygons, truncatedCuboctahedronPolygons, truncatedDodecahedronPolygons, truncatedIcosahedronPolygons, truncatedIcosidodecahedronPolygons, truncatedOctahedronPolygons, truncatedTetrahedronPolygons } from '@glyphcss/core';
|
|
3
3
|
import * as react from 'react';
|
|
4
4
|
import { CSSProperties, ReactNode, MouseEventHandler, RefObject } from 'react';
|
|
5
5
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
6
|
-
import {
|
|
7
|
-
export {
|
|
6
|
+
import { GlyphDirectionalLight, GlyphAmbientLight, GlyphPointerEvent, GlyphMouseEvent, GlyphWheelEvent, GlyphSceneHandle, GlyphMeshTransform, GlyphMeshHandle, GlyphCamera } from 'glyphcss';
|
|
7
|
+
export { GlyphEventHandler, GlyphMeshHandle, GlyphMouseEvent, GlyphPointerEvent, GlyphWheelEvent, injectGlyphBaseStyles } from 'glyphcss';
|
|
8
8
|
|
|
9
|
-
interface
|
|
9
|
+
interface GlyphSceneProps {
|
|
10
10
|
/** Render mode: "wireframe" | "solid". Default "solid". */
|
|
11
11
|
mode?: RenderMode;
|
|
12
12
|
/** Named glyph palette. Defaults to "default". */
|
|
@@ -19,29 +19,70 @@ interface GlyphcssSceneProps {
|
|
|
19
19
|
rows?: number;
|
|
20
20
|
/** Character cell aspect ratio (height/width). Default 2.0. */
|
|
21
21
|
cellAspect?: number;
|
|
22
|
-
directionalLight?:
|
|
23
|
-
ambientLight?:
|
|
22
|
+
directionalLight?: GlyphDirectionalLight;
|
|
23
|
+
ambientLight?: GlyphAmbientLight;
|
|
24
|
+
/** Smooth (Gouraud) shading. Default false. */
|
|
25
|
+
smoothShading?: boolean;
|
|
26
|
+
/** Crease angle in degrees. Edges sharper than this stay flat-shaded. Default 60. */
|
|
27
|
+
creaseAngle?: number;
|
|
28
|
+
/** Observe host element and adapt cols/rows to fill it. Default false. */
|
|
29
|
+
autoSize?: boolean;
|
|
24
30
|
className?: string;
|
|
25
31
|
style?: CSSProperties;
|
|
26
32
|
children?: ReactNode;
|
|
27
33
|
}
|
|
28
|
-
declare function
|
|
29
|
-
declare const
|
|
34
|
+
declare function GlyphSceneInner({ mode, glyphPalette, useColors, cols, rows, cellAspect, directionalLight, ambientLight, smoothShading, creaseAngle, autoSize, className, style, children, }: GlyphSceneProps): react_jsx_runtime.JSX.Element;
|
|
35
|
+
declare const GlyphScene: react.MemoExoticComponent<typeof GlyphSceneInner>;
|
|
30
36
|
|
|
31
|
-
interface
|
|
37
|
+
interface GlyphMeshProps {
|
|
32
38
|
id?: string;
|
|
33
|
-
|
|
39
|
+
polygons?: Polygon[];
|
|
40
|
+
/**
|
|
41
|
+
* Built-in geometry name. Resolved via `resolveGeometry` when neither
|
|
42
|
+
* `polygons` nor `src` is provided.
|
|
43
|
+
*
|
|
44
|
+
* Precedence: explicit `polygons` > `src` > `geometry`.
|
|
45
|
+
*/
|
|
46
|
+
geometry?: GlyphGeometryName;
|
|
47
|
+
/** Uniform size passed to `resolveGeometry` when `geometry` is set. Defaults to 1. */
|
|
48
|
+
size?: number;
|
|
49
|
+
/** Fill color passed to `resolveGeometry` when `geometry` is set. */
|
|
50
|
+
color?: string;
|
|
34
51
|
position?: Vec3;
|
|
35
52
|
scale?: number | Vec3;
|
|
36
53
|
rotation?: Vec3;
|
|
37
54
|
className?: string;
|
|
38
55
|
style?: CSSProperties;
|
|
39
56
|
children?: ReactNode;
|
|
57
|
+
onPointerDown?: (event: GlyphPointerEvent) => void;
|
|
58
|
+
onPointerUp?: (event: GlyphPointerEvent) => void;
|
|
59
|
+
onPointerMove?: (event: GlyphPointerEvent) => void;
|
|
60
|
+
onPointerEnter?: (event: GlyphPointerEvent) => void;
|
|
61
|
+
onPointerLeave?: (event: GlyphPointerEvent) => void;
|
|
62
|
+
onClick?: (event: GlyphMouseEvent) => void;
|
|
63
|
+
onWheel?: (event: GlyphWheelEvent) => void;
|
|
40
64
|
}
|
|
41
|
-
declare function
|
|
42
|
-
declare const
|
|
65
|
+
declare function GlyphMeshInner({ id, polygons: polygonsProp, geometry, size, color, position, scale, rotation, className, style, children, }: GlyphMeshProps): react_jsx_runtime.JSX.Element;
|
|
66
|
+
declare const GlyphMesh: react.MemoExoticComponent<typeof GlyphMeshInner>;
|
|
43
67
|
|
|
44
|
-
interface
|
|
68
|
+
interface GlyphGroundProps {
|
|
69
|
+
/** Half-extent of the ground plane in world units. Default 5. */
|
|
70
|
+
size?: number;
|
|
71
|
+
/** Fill color. Default "#444444". */
|
|
72
|
+
color?: string;
|
|
73
|
+
/** World-space position. Default [0, -0.5, 0]. */
|
|
74
|
+
position?: Vec3;
|
|
75
|
+
/** World-space rotation in radians (Euler XYZ). */
|
|
76
|
+
rotation?: Vec3;
|
|
77
|
+
/** String id forwarded to the underlying mesh handle. */
|
|
78
|
+
id?: string;
|
|
79
|
+
className?: string;
|
|
80
|
+
style?: CSSProperties;
|
|
81
|
+
}
|
|
82
|
+
declare function GlyphGroundInner({ size, color, position, rotation, id, className, style, }: GlyphGroundProps): react_jsx_runtime.JSX.Element;
|
|
83
|
+
declare const GlyphGround: react.MemoExoticComponent<typeof GlyphGroundInner>;
|
|
84
|
+
|
|
85
|
+
interface GlyphHotspotProps {
|
|
45
86
|
/** Stable identifier for this hotspot. */
|
|
46
87
|
id: string;
|
|
47
88
|
/** 3D world-space anchor. */
|
|
@@ -53,67 +94,78 @@ interface GlyphcssHotspotProps {
|
|
|
53
94
|
"aria-label"?: string;
|
|
54
95
|
children?: ReactNode;
|
|
55
96
|
}
|
|
56
|
-
declare function
|
|
57
|
-
declare const
|
|
97
|
+
declare function GlyphHotspotInner({ id, at, size, onClick, className, children, }: GlyphHotspotProps): react.ReactPortal | null;
|
|
98
|
+
declare const GlyphHotspot: react.MemoExoticComponent<typeof GlyphHotspotInner>;
|
|
58
99
|
|
|
59
|
-
interface
|
|
60
|
-
sceneRef: React.MutableRefObject<
|
|
100
|
+
interface GlyphSceneContextValue {
|
|
101
|
+
sceneRef: React.MutableRefObject<GlyphSceneHandle | null>;
|
|
61
102
|
}
|
|
62
|
-
declare const
|
|
63
|
-
declare function
|
|
103
|
+
declare const GlyphSceneContext: react.Context<GlyphSceneContextValue | null>;
|
|
104
|
+
declare function useGlyphSceneContext(): GlyphSceneContextValue;
|
|
64
105
|
|
|
65
|
-
interface
|
|
66
|
-
transform?:
|
|
106
|
+
interface UseGlyphMeshOptions {
|
|
107
|
+
transform?: GlyphMeshTransform;
|
|
67
108
|
}
|
|
68
|
-
interface
|
|
69
|
-
meshRef: React.MutableRefObject<
|
|
109
|
+
interface UseGlyphMeshResult {
|
|
110
|
+
meshRef: React.MutableRefObject<GlyphMeshHandle | null>;
|
|
70
111
|
loading: boolean;
|
|
71
112
|
}
|
|
72
113
|
/**
|
|
73
|
-
*
|
|
114
|
+
* useGlyphMesh — register a polygon list with the parent GlyphScene.
|
|
74
115
|
* Mirrors usePolyMesh but for the ASCII paint backend.
|
|
75
116
|
*/
|
|
76
|
-
declare function
|
|
117
|
+
declare function useGlyphMesh(polygons: Polygon[], options?: UseGlyphMeshOptions): UseGlyphMeshResult;
|
|
77
118
|
|
|
78
|
-
declare function
|
|
119
|
+
declare function findGlyphMeshHandle(el: Element | null): GlyphMeshHandle | null;
|
|
120
|
+
declare function pointInMeshElement(meshEl: HTMLElement, clientX: number, clientY: number): boolean;
|
|
121
|
+
declare function findMeshUnderPoint(clientX: number, clientY: number, filter?: (meshEl: HTMLElement) => boolean): GlyphMeshHandle | null;
|
|
79
122
|
|
|
80
|
-
interface
|
|
123
|
+
interface GlyphOrthographicCameraProps {
|
|
81
124
|
rotX?: number;
|
|
82
125
|
rotY?: number;
|
|
83
|
-
/**
|
|
84
|
-
|
|
85
|
-
/** Mesh scale in viewport fraction. Default 0.4. */
|
|
86
|
-
scale?: number;
|
|
87
|
-
/** Extra horizontal stretch on top of cellAspect. Default 1.0. */
|
|
88
|
-
stretch?: number;
|
|
126
|
+
/** Orthographic zoom (fraction of min(cols, rows)). Default 0.4. */
|
|
127
|
+
zoom?: number;
|
|
89
128
|
/** Center of projection in normalized grid coords. Default [0.5, 0.5]. */
|
|
90
129
|
center?: [number, number];
|
|
130
|
+
className?: string;
|
|
131
|
+
style?: CSSProperties;
|
|
91
132
|
children?: ReactNode;
|
|
92
133
|
}
|
|
93
|
-
declare function
|
|
94
|
-
declare const
|
|
134
|
+
declare function GlyphOrthographicCameraInner({ rotX, rotY, zoom, center, className, style, children, }: GlyphOrthographicCameraProps): react_jsx_runtime.JSX.Element;
|
|
135
|
+
declare const GlyphOrthographicCamera: react.MemoExoticComponent<typeof GlyphOrthographicCameraInner>;
|
|
95
136
|
|
|
96
|
-
interface
|
|
137
|
+
interface GlyphPerspectiveCameraProps {
|
|
97
138
|
rotX?: number;
|
|
98
139
|
rotY?: number;
|
|
99
|
-
/**
|
|
140
|
+
/** Perspective distance. Default 3. */
|
|
141
|
+
distance?: number;
|
|
142
|
+
/** Camera zoom — mesh fraction of min(cols, rows). Default 0.4. */
|
|
100
143
|
zoom?: number;
|
|
144
|
+
/** Extra horizontal stretch on top of cellAspect. Default 1.0. */
|
|
145
|
+
stretch?: number;
|
|
101
146
|
/** Center of projection in normalized grid coords. Default [0.5, 0.5]. */
|
|
102
147
|
center?: [number, number];
|
|
148
|
+
className?: string;
|
|
149
|
+
style?: CSSProperties;
|
|
103
150
|
children?: ReactNode;
|
|
104
151
|
}
|
|
105
|
-
declare function
|
|
106
|
-
declare const
|
|
152
|
+
declare function GlyphPerspectiveCameraInner({ rotX, rotY, distance, zoom, stretch, center, className, style, children, }: GlyphPerspectiveCameraProps): react_jsx_runtime.JSX.Element;
|
|
153
|
+
declare const GlyphPerspectiveCamera: react.MemoExoticComponent<typeof GlyphPerspectiveCameraInner>;
|
|
107
154
|
|
|
108
|
-
interface
|
|
109
|
-
cameraRef: React.MutableRefObject<
|
|
155
|
+
interface GlyphCameraContextValue {
|
|
156
|
+
cameraRef: React.MutableRefObject<GlyphCamera | null>;
|
|
110
157
|
/** Notify the scene to re-render after camera changes. */
|
|
111
158
|
rerender: () => void;
|
|
159
|
+
/**
|
|
160
|
+
* Set by the child GlyphScene so the camera can trigger rerenders when
|
|
161
|
+
* props change after the scene is mounted.
|
|
162
|
+
*/
|
|
163
|
+
sceneRerenderRef: React.MutableRefObject<(() => void) | null>;
|
|
112
164
|
}
|
|
113
|
-
declare const
|
|
114
|
-
declare function
|
|
165
|
+
declare const GlyphCameraContext: react.Context<GlyphCameraContextValue | null>;
|
|
166
|
+
declare function useGlyphCamera(): GlyphCameraContextValue;
|
|
115
167
|
|
|
116
|
-
interface
|
|
168
|
+
interface GlyphOrbitControlsProps {
|
|
117
169
|
/** Pointer-drag. Default true. */
|
|
118
170
|
drag?: boolean;
|
|
119
171
|
/** Wheel / pinch zoom. Default true. */
|
|
@@ -127,9 +179,9 @@ interface GlyphcssOrbitControlsProps {
|
|
|
127
179
|
pauseOnInteraction?: boolean;
|
|
128
180
|
};
|
|
129
181
|
}
|
|
130
|
-
declare function
|
|
182
|
+
declare function GlyphOrbitControls({ drag, wheel, invert, animate, }: GlyphOrbitControlsProps): null;
|
|
131
183
|
|
|
132
|
-
interface
|
|
184
|
+
interface GlyphMapControlsProps {
|
|
133
185
|
drag?: boolean;
|
|
134
186
|
wheel?: boolean;
|
|
135
187
|
invert?: boolean | number;
|
|
@@ -139,25 +191,25 @@ interface GlyphcssMapControlsProps {
|
|
|
139
191
|
pauseOnInteraction?: boolean;
|
|
140
192
|
};
|
|
141
193
|
}
|
|
142
|
-
declare function
|
|
194
|
+
declare function GlyphMapControls({ drag, wheel, invert, animate, }: GlyphMapControlsProps): null;
|
|
143
195
|
|
|
144
|
-
interface
|
|
196
|
+
interface GlyphFirstPersonControlsProps {
|
|
145
197
|
drag?: boolean;
|
|
146
198
|
keyboard?: boolean;
|
|
147
199
|
moveSpeed?: number;
|
|
148
200
|
lookSpeed?: number;
|
|
149
201
|
invert?: boolean | number;
|
|
150
202
|
}
|
|
151
|
-
declare function
|
|
203
|
+
declare function GlyphFirstPersonControls({ drag, keyboard, moveSpeed, lookSpeed, invert, }: GlyphFirstPersonControlsProps): null;
|
|
152
204
|
|
|
153
|
-
interface
|
|
205
|
+
interface GlyphAxesHelperProps {
|
|
154
206
|
/** Length of each axis bar in world units. Default 1. */
|
|
155
207
|
size?: number;
|
|
156
208
|
}
|
|
157
|
-
declare function
|
|
158
|
-
declare const
|
|
209
|
+
declare function GlyphAxesHelperInner({ size }: GlyphAxesHelperProps): null;
|
|
210
|
+
declare const GlyphAxesHelper: react.MemoExoticComponent<typeof GlyphAxesHelperInner>;
|
|
159
211
|
|
|
160
|
-
interface
|
|
212
|
+
interface GlyphDirectionalLightHelperProps {
|
|
161
213
|
/** Light source position in world space. Default [1, 1, 1]. */
|
|
162
214
|
position?: Vec3;
|
|
163
215
|
/** Glyph color. Default "#ffff00". */
|
|
@@ -165,16 +217,16 @@ interface GlyphcssDirectionalLightHelperProps {
|
|
|
165
217
|
/** Marker size in world units. Default 0.1. */
|
|
166
218
|
size?: number;
|
|
167
219
|
}
|
|
168
|
-
declare function
|
|
169
|
-
declare const
|
|
220
|
+
declare function GlyphDirectionalLightHelperInner({ position, color, size, }: GlyphDirectionalLightHelperProps): null;
|
|
221
|
+
declare const GlyphDirectionalLightHelper: react.MemoExoticComponent<typeof GlyphDirectionalLightHelperInner>;
|
|
170
222
|
|
|
171
|
-
interface
|
|
172
|
-
/** Attach to a `
|
|
173
|
-
ref: RefObject<
|
|
223
|
+
interface UseGlyphAnimationResult {
|
|
224
|
+
/** Attach to a `GlyphAnimationTarget`-compatible handle when not using `root`. */
|
|
225
|
+
ref: RefObject<GlyphAnimationTarget | null>;
|
|
174
226
|
/** The active mixer, or null if inputs are not ready yet. */
|
|
175
|
-
mixer:
|
|
227
|
+
mixer: GlyphAnimationMixer | null;
|
|
176
228
|
/** Resolved clip list (empty when `clips` is undefined). */
|
|
177
|
-
clips:
|
|
229
|
+
clips: GlyphAnimationClip[];
|
|
178
230
|
/** Clip names in input order. */
|
|
179
231
|
names: string[];
|
|
180
232
|
/**
|
|
@@ -182,8 +234,8 @@ interface UseGlyphcssAnimationResult {
|
|
|
182
234
|
* instantiates the action if it does not exist yet. Returns null when the
|
|
183
235
|
* mixer is not ready.
|
|
184
236
|
*/
|
|
185
|
-
actions: Record<string,
|
|
237
|
+
actions: Record<string, GlyphAnimationAction | null>;
|
|
186
238
|
}
|
|
187
|
-
declare function
|
|
239
|
+
declare function useGlyphAnimation(clips: GlyphAnimationClip[] | undefined, controller: ParseAnimationController | undefined, root?: RefObject<GlyphAnimationTarget | null> | GlyphAnimationTarget | null): UseGlyphAnimationResult;
|
|
188
240
|
|
|
189
|
-
export {
|
|
241
|
+
export { GlyphAxesHelper, type GlyphAxesHelperProps, GlyphOrthographicCamera as GlyphCamera, GlyphCameraContext, type GlyphCameraContextValue, type GlyphOrthographicCameraProps as GlyphCameraProps, GlyphDirectionalLightHelper, type GlyphDirectionalLightHelperProps, GlyphFirstPersonControls, type GlyphFirstPersonControlsProps, GlyphGround, type GlyphGroundProps, GlyphHotspot, type GlyphHotspotProps, GlyphMapControls, type GlyphMapControlsProps, GlyphMesh, type GlyphMeshProps, GlyphOrbitControls, type GlyphOrbitControlsProps, GlyphOrthographicCamera, type GlyphOrthographicCameraProps, GlyphPerspectiveCamera, type GlyphPerspectiveCameraProps, GlyphScene, GlyphSceneContext, type GlyphSceneContextValue, type GlyphSceneProps, type UseGlyphAnimationResult, type UseGlyphMeshOptions, type UseGlyphMeshResult, findGlyphMeshHandle, findMeshUnderPoint, pointInMeshElement, useGlyphAnimation, useGlyphCamera, useGlyphMesh, useGlyphSceneContext };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import { RenderMode, Vec3,
|
|
2
|
-
export { ApproximateMergeOptions, ArrowPolygonsOptions, AutoRotateConfig, AutoRotateOption, AxesHelperOptions, BASE_TILE, CAMERA_BACKFACE_CULL_EPS, CameraCullNormalGroup, CameraCullRotation, CameraHandle, CameraState, CameraStyleInput, CoverPlanarPolygonsOptions, CullInteriorOptions, DEFAULT_CAMERA_STATE, DEFAULT_PROJECTION, GltfParseOptions,
|
|
1
|
+
import { RenderMode, Polygon, GlyphGeometryName, Vec3, GlyphAnimationTarget, GlyphAnimationMixer, GlyphAnimationClip, GlyphAnimationAction, ParseAnimationController } from '@glyphcss/core';
|
|
2
|
+
export { ApproximateMergeOptions, ArrowPolygonsOptions, AutoRotateConfig, AutoRotateOption, AxesHelperOptions, BASE_TILE, CAMERA_BACKFACE_CULL_EPS, CameraCullNormalGroup, CameraCullRotation, CameraHandle, CameraState, CameraStyleInput, CoverPlanarPolygonsOptions, CullInteriorOptions, DEFAULT_CAMERA_STATE, DEFAULT_PROJECTION, GltfParseOptions, GlyphAmbientLight, GlyphAnimationAction, GlyphAnimationClip, GlyphAnimationMixer, GlyphAnimationTarget, GlyphDirectionalLight, GlyphGeometryName, GlyphGeometryOptions, LoadMeshOptions, LoopMode, LoopOnce, LoopPingPong, LoopRepeat, MtlParseResult, NormalizeResult, ObjParseOptions, OctahedronPolygonsOptions, OptimizeMeshPolygonsOptions, ParseAnimationClip, ParseAnimationController, ParseResult, ParsedColor, Polygon, PolygonFace, RingPolygonsOptions, SceneBbox, SceneContext, SceneContextBuildArgs, SceneContextBuildResult, SolidTextureSampleOptions, TextureTriangle, VOXEL_CAMERA_CULL_AXIS_EPS, VOXEL_CAMERA_CULL_NORMAL_LIMIT, Vec2, Vec3, VoxParseOptions, antiprismPolygons, arrowPolygons, axesHelperPolygons, bakeSolidTextureSampledPolygons, bakeSolidTextureSamples, bipyramidPolygons, buildSceneContext, cameraCullNormalGroups, cameraCullNormalGroupsFromPolygons, cameraCullNormalKey, cameraCullVisibleSignature, cameraFacingDepth, clampChannel, computeSceneBbox, computeShapeLighting, conePolygons, coverPlanarPolygons, createGlyphAnimationMixer, createIsometricCamera, cubePolygons, cuboctahedronPolygons, cullInteriorPolygons, cylinderPolygons, deltoidalHexecontahedronPolygons, deltoidalIcositetrahedronPolygons, disdyakisDodecahedronPolygons, disdyakisTriacontahedronPolygons, dodecahedronPolygons, formatColor, greatDodecahedronPolygons, greatIcosahedronPolygons, greatStellatedDodecahedronPolygons, icosahedronPolygons, icosidodecahedronPolygons, inverseRotateVec3, isAxisAlignedSurfaceNormal, isVoxelCameraCullableNormalGroups, loadMesh, mergePolygons, normalFacesCamera, normalizeInvertMultiplier, normalizePolygons, octahedronPolygons, optimizeMeshPolygons, parseColor, parseGltf, parseHexColor, parseMtl, parseObj, parsePureColor, parseRgbColor, parseVox, pentagonalHexecontahedronPolygons, pentagonalIcositetrahedronPolygons, pentakisDodecahedronPolygons, planePolygons, polygonCssSurfaceNormal, polygonFaces, polygonFacesCamera, prismPolygons, pyramidPolygons, resolveGeometry, rhombicDodecahedronPolygons, rhombicTriacontahedronPolygons, rhombicosidodecahedronPolygons, rhombicuboctahedronPolygons, ringPolygons, ringQuadPolygons, rotateVec3, shadeColor, smallStellatedDodecahedronPolygons, snubCubePolygons, snubDodecahedronPolygons, spherePolygons, tetrahedronPolygons, tetrakisHexahedronPolygons, torusPolygons, trapezohedronPolygons, triakisIcosahedronPolygons, triakisOctahedronPolygons, triakisTetrahedronPolygons, truncatedCubePolygons, truncatedCuboctahedronPolygons, truncatedDodecahedronPolygons, truncatedIcosahedronPolygons, truncatedIcosidodecahedronPolygons, truncatedOctahedronPolygons, truncatedTetrahedronPolygons } from '@glyphcss/core';
|
|
3
3
|
import * as react from 'react';
|
|
4
4
|
import { CSSProperties, ReactNode, MouseEventHandler, RefObject } from 'react';
|
|
5
5
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
6
|
-
import {
|
|
7
|
-
export {
|
|
6
|
+
import { GlyphDirectionalLight, GlyphAmbientLight, GlyphPointerEvent, GlyphMouseEvent, GlyphWheelEvent, GlyphSceneHandle, GlyphMeshTransform, GlyphMeshHandle, GlyphCamera } from 'glyphcss';
|
|
7
|
+
export { GlyphEventHandler, GlyphMeshHandle, GlyphMouseEvent, GlyphPointerEvent, GlyphWheelEvent, injectGlyphBaseStyles } from 'glyphcss';
|
|
8
8
|
|
|
9
|
-
interface
|
|
9
|
+
interface GlyphSceneProps {
|
|
10
10
|
/** Render mode: "wireframe" | "solid". Default "solid". */
|
|
11
11
|
mode?: RenderMode;
|
|
12
12
|
/** Named glyph palette. Defaults to "default". */
|
|
@@ -19,29 +19,70 @@ interface GlyphcssSceneProps {
|
|
|
19
19
|
rows?: number;
|
|
20
20
|
/** Character cell aspect ratio (height/width). Default 2.0. */
|
|
21
21
|
cellAspect?: number;
|
|
22
|
-
directionalLight?:
|
|
23
|
-
ambientLight?:
|
|
22
|
+
directionalLight?: GlyphDirectionalLight;
|
|
23
|
+
ambientLight?: GlyphAmbientLight;
|
|
24
|
+
/** Smooth (Gouraud) shading. Default false. */
|
|
25
|
+
smoothShading?: boolean;
|
|
26
|
+
/** Crease angle in degrees. Edges sharper than this stay flat-shaded. Default 60. */
|
|
27
|
+
creaseAngle?: number;
|
|
28
|
+
/** Observe host element and adapt cols/rows to fill it. Default false. */
|
|
29
|
+
autoSize?: boolean;
|
|
24
30
|
className?: string;
|
|
25
31
|
style?: CSSProperties;
|
|
26
32
|
children?: ReactNode;
|
|
27
33
|
}
|
|
28
|
-
declare function
|
|
29
|
-
declare const
|
|
34
|
+
declare function GlyphSceneInner({ mode, glyphPalette, useColors, cols, rows, cellAspect, directionalLight, ambientLight, smoothShading, creaseAngle, autoSize, className, style, children, }: GlyphSceneProps): react_jsx_runtime.JSX.Element;
|
|
35
|
+
declare const GlyphScene: react.MemoExoticComponent<typeof GlyphSceneInner>;
|
|
30
36
|
|
|
31
|
-
interface
|
|
37
|
+
interface GlyphMeshProps {
|
|
32
38
|
id?: string;
|
|
33
|
-
|
|
39
|
+
polygons?: Polygon[];
|
|
40
|
+
/**
|
|
41
|
+
* Built-in geometry name. Resolved via `resolveGeometry` when neither
|
|
42
|
+
* `polygons` nor `src` is provided.
|
|
43
|
+
*
|
|
44
|
+
* Precedence: explicit `polygons` > `src` > `geometry`.
|
|
45
|
+
*/
|
|
46
|
+
geometry?: GlyphGeometryName;
|
|
47
|
+
/** Uniform size passed to `resolveGeometry` when `geometry` is set. Defaults to 1. */
|
|
48
|
+
size?: number;
|
|
49
|
+
/** Fill color passed to `resolveGeometry` when `geometry` is set. */
|
|
50
|
+
color?: string;
|
|
34
51
|
position?: Vec3;
|
|
35
52
|
scale?: number | Vec3;
|
|
36
53
|
rotation?: Vec3;
|
|
37
54
|
className?: string;
|
|
38
55
|
style?: CSSProperties;
|
|
39
56
|
children?: ReactNode;
|
|
57
|
+
onPointerDown?: (event: GlyphPointerEvent) => void;
|
|
58
|
+
onPointerUp?: (event: GlyphPointerEvent) => void;
|
|
59
|
+
onPointerMove?: (event: GlyphPointerEvent) => void;
|
|
60
|
+
onPointerEnter?: (event: GlyphPointerEvent) => void;
|
|
61
|
+
onPointerLeave?: (event: GlyphPointerEvent) => void;
|
|
62
|
+
onClick?: (event: GlyphMouseEvent) => void;
|
|
63
|
+
onWheel?: (event: GlyphWheelEvent) => void;
|
|
40
64
|
}
|
|
41
|
-
declare function
|
|
42
|
-
declare const
|
|
65
|
+
declare function GlyphMeshInner({ id, polygons: polygonsProp, geometry, size, color, position, scale, rotation, className, style, children, }: GlyphMeshProps): react_jsx_runtime.JSX.Element;
|
|
66
|
+
declare const GlyphMesh: react.MemoExoticComponent<typeof GlyphMeshInner>;
|
|
43
67
|
|
|
44
|
-
interface
|
|
68
|
+
interface GlyphGroundProps {
|
|
69
|
+
/** Half-extent of the ground plane in world units. Default 5. */
|
|
70
|
+
size?: number;
|
|
71
|
+
/** Fill color. Default "#444444". */
|
|
72
|
+
color?: string;
|
|
73
|
+
/** World-space position. Default [0, -0.5, 0]. */
|
|
74
|
+
position?: Vec3;
|
|
75
|
+
/** World-space rotation in radians (Euler XYZ). */
|
|
76
|
+
rotation?: Vec3;
|
|
77
|
+
/** String id forwarded to the underlying mesh handle. */
|
|
78
|
+
id?: string;
|
|
79
|
+
className?: string;
|
|
80
|
+
style?: CSSProperties;
|
|
81
|
+
}
|
|
82
|
+
declare function GlyphGroundInner({ size, color, position, rotation, id, className, style, }: GlyphGroundProps): react_jsx_runtime.JSX.Element;
|
|
83
|
+
declare const GlyphGround: react.MemoExoticComponent<typeof GlyphGroundInner>;
|
|
84
|
+
|
|
85
|
+
interface GlyphHotspotProps {
|
|
45
86
|
/** Stable identifier for this hotspot. */
|
|
46
87
|
id: string;
|
|
47
88
|
/** 3D world-space anchor. */
|
|
@@ -53,67 +94,78 @@ interface GlyphcssHotspotProps {
|
|
|
53
94
|
"aria-label"?: string;
|
|
54
95
|
children?: ReactNode;
|
|
55
96
|
}
|
|
56
|
-
declare function
|
|
57
|
-
declare const
|
|
97
|
+
declare function GlyphHotspotInner({ id, at, size, onClick, className, children, }: GlyphHotspotProps): react.ReactPortal | null;
|
|
98
|
+
declare const GlyphHotspot: react.MemoExoticComponent<typeof GlyphHotspotInner>;
|
|
58
99
|
|
|
59
|
-
interface
|
|
60
|
-
sceneRef: React.MutableRefObject<
|
|
100
|
+
interface GlyphSceneContextValue {
|
|
101
|
+
sceneRef: React.MutableRefObject<GlyphSceneHandle | null>;
|
|
61
102
|
}
|
|
62
|
-
declare const
|
|
63
|
-
declare function
|
|
103
|
+
declare const GlyphSceneContext: react.Context<GlyphSceneContextValue | null>;
|
|
104
|
+
declare function useGlyphSceneContext(): GlyphSceneContextValue;
|
|
64
105
|
|
|
65
|
-
interface
|
|
66
|
-
transform?:
|
|
106
|
+
interface UseGlyphMeshOptions {
|
|
107
|
+
transform?: GlyphMeshTransform;
|
|
67
108
|
}
|
|
68
|
-
interface
|
|
69
|
-
meshRef: React.MutableRefObject<
|
|
109
|
+
interface UseGlyphMeshResult {
|
|
110
|
+
meshRef: React.MutableRefObject<GlyphMeshHandle | null>;
|
|
70
111
|
loading: boolean;
|
|
71
112
|
}
|
|
72
113
|
/**
|
|
73
|
-
*
|
|
114
|
+
* useGlyphMesh — register a polygon list with the parent GlyphScene.
|
|
74
115
|
* Mirrors usePolyMesh but for the ASCII paint backend.
|
|
75
116
|
*/
|
|
76
|
-
declare function
|
|
117
|
+
declare function useGlyphMesh(polygons: Polygon[], options?: UseGlyphMeshOptions): UseGlyphMeshResult;
|
|
77
118
|
|
|
78
|
-
declare function
|
|
119
|
+
declare function findGlyphMeshHandle(el: Element | null): GlyphMeshHandle | null;
|
|
120
|
+
declare function pointInMeshElement(meshEl: HTMLElement, clientX: number, clientY: number): boolean;
|
|
121
|
+
declare function findMeshUnderPoint(clientX: number, clientY: number, filter?: (meshEl: HTMLElement) => boolean): GlyphMeshHandle | null;
|
|
79
122
|
|
|
80
|
-
interface
|
|
123
|
+
interface GlyphOrthographicCameraProps {
|
|
81
124
|
rotX?: number;
|
|
82
125
|
rotY?: number;
|
|
83
|
-
/**
|
|
84
|
-
|
|
85
|
-
/** Mesh scale in viewport fraction. Default 0.4. */
|
|
86
|
-
scale?: number;
|
|
87
|
-
/** Extra horizontal stretch on top of cellAspect. Default 1.0. */
|
|
88
|
-
stretch?: number;
|
|
126
|
+
/** Orthographic zoom (fraction of min(cols, rows)). Default 0.4. */
|
|
127
|
+
zoom?: number;
|
|
89
128
|
/** Center of projection in normalized grid coords. Default [0.5, 0.5]. */
|
|
90
129
|
center?: [number, number];
|
|
130
|
+
className?: string;
|
|
131
|
+
style?: CSSProperties;
|
|
91
132
|
children?: ReactNode;
|
|
92
133
|
}
|
|
93
|
-
declare function
|
|
94
|
-
declare const
|
|
134
|
+
declare function GlyphOrthographicCameraInner({ rotX, rotY, zoom, center, className, style, children, }: GlyphOrthographicCameraProps): react_jsx_runtime.JSX.Element;
|
|
135
|
+
declare const GlyphOrthographicCamera: react.MemoExoticComponent<typeof GlyphOrthographicCameraInner>;
|
|
95
136
|
|
|
96
|
-
interface
|
|
137
|
+
interface GlyphPerspectiveCameraProps {
|
|
97
138
|
rotX?: number;
|
|
98
139
|
rotY?: number;
|
|
99
|
-
/**
|
|
140
|
+
/** Perspective distance. Default 3. */
|
|
141
|
+
distance?: number;
|
|
142
|
+
/** Camera zoom — mesh fraction of min(cols, rows). Default 0.4. */
|
|
100
143
|
zoom?: number;
|
|
144
|
+
/** Extra horizontal stretch on top of cellAspect. Default 1.0. */
|
|
145
|
+
stretch?: number;
|
|
101
146
|
/** Center of projection in normalized grid coords. Default [0.5, 0.5]. */
|
|
102
147
|
center?: [number, number];
|
|
148
|
+
className?: string;
|
|
149
|
+
style?: CSSProperties;
|
|
103
150
|
children?: ReactNode;
|
|
104
151
|
}
|
|
105
|
-
declare function
|
|
106
|
-
declare const
|
|
152
|
+
declare function GlyphPerspectiveCameraInner({ rotX, rotY, distance, zoom, stretch, center, className, style, children, }: GlyphPerspectiveCameraProps): react_jsx_runtime.JSX.Element;
|
|
153
|
+
declare const GlyphPerspectiveCamera: react.MemoExoticComponent<typeof GlyphPerspectiveCameraInner>;
|
|
107
154
|
|
|
108
|
-
interface
|
|
109
|
-
cameraRef: React.MutableRefObject<
|
|
155
|
+
interface GlyphCameraContextValue {
|
|
156
|
+
cameraRef: React.MutableRefObject<GlyphCamera | null>;
|
|
110
157
|
/** Notify the scene to re-render after camera changes. */
|
|
111
158
|
rerender: () => void;
|
|
159
|
+
/**
|
|
160
|
+
* Set by the child GlyphScene so the camera can trigger rerenders when
|
|
161
|
+
* props change after the scene is mounted.
|
|
162
|
+
*/
|
|
163
|
+
sceneRerenderRef: React.MutableRefObject<(() => void) | null>;
|
|
112
164
|
}
|
|
113
|
-
declare const
|
|
114
|
-
declare function
|
|
165
|
+
declare const GlyphCameraContext: react.Context<GlyphCameraContextValue | null>;
|
|
166
|
+
declare function useGlyphCamera(): GlyphCameraContextValue;
|
|
115
167
|
|
|
116
|
-
interface
|
|
168
|
+
interface GlyphOrbitControlsProps {
|
|
117
169
|
/** Pointer-drag. Default true. */
|
|
118
170
|
drag?: boolean;
|
|
119
171
|
/** Wheel / pinch zoom. Default true. */
|
|
@@ -127,9 +179,9 @@ interface GlyphcssOrbitControlsProps {
|
|
|
127
179
|
pauseOnInteraction?: boolean;
|
|
128
180
|
};
|
|
129
181
|
}
|
|
130
|
-
declare function
|
|
182
|
+
declare function GlyphOrbitControls({ drag, wheel, invert, animate, }: GlyphOrbitControlsProps): null;
|
|
131
183
|
|
|
132
|
-
interface
|
|
184
|
+
interface GlyphMapControlsProps {
|
|
133
185
|
drag?: boolean;
|
|
134
186
|
wheel?: boolean;
|
|
135
187
|
invert?: boolean | number;
|
|
@@ -139,25 +191,25 @@ interface GlyphcssMapControlsProps {
|
|
|
139
191
|
pauseOnInteraction?: boolean;
|
|
140
192
|
};
|
|
141
193
|
}
|
|
142
|
-
declare function
|
|
194
|
+
declare function GlyphMapControls({ drag, wheel, invert, animate, }: GlyphMapControlsProps): null;
|
|
143
195
|
|
|
144
|
-
interface
|
|
196
|
+
interface GlyphFirstPersonControlsProps {
|
|
145
197
|
drag?: boolean;
|
|
146
198
|
keyboard?: boolean;
|
|
147
199
|
moveSpeed?: number;
|
|
148
200
|
lookSpeed?: number;
|
|
149
201
|
invert?: boolean | number;
|
|
150
202
|
}
|
|
151
|
-
declare function
|
|
203
|
+
declare function GlyphFirstPersonControls({ drag, keyboard, moveSpeed, lookSpeed, invert, }: GlyphFirstPersonControlsProps): null;
|
|
152
204
|
|
|
153
|
-
interface
|
|
205
|
+
interface GlyphAxesHelperProps {
|
|
154
206
|
/** Length of each axis bar in world units. Default 1. */
|
|
155
207
|
size?: number;
|
|
156
208
|
}
|
|
157
|
-
declare function
|
|
158
|
-
declare const
|
|
209
|
+
declare function GlyphAxesHelperInner({ size }: GlyphAxesHelperProps): null;
|
|
210
|
+
declare const GlyphAxesHelper: react.MemoExoticComponent<typeof GlyphAxesHelperInner>;
|
|
159
211
|
|
|
160
|
-
interface
|
|
212
|
+
interface GlyphDirectionalLightHelperProps {
|
|
161
213
|
/** Light source position in world space. Default [1, 1, 1]. */
|
|
162
214
|
position?: Vec3;
|
|
163
215
|
/** Glyph color. Default "#ffff00". */
|
|
@@ -165,16 +217,16 @@ interface GlyphcssDirectionalLightHelperProps {
|
|
|
165
217
|
/** Marker size in world units. Default 0.1. */
|
|
166
218
|
size?: number;
|
|
167
219
|
}
|
|
168
|
-
declare function
|
|
169
|
-
declare const
|
|
220
|
+
declare function GlyphDirectionalLightHelperInner({ position, color, size, }: GlyphDirectionalLightHelperProps): null;
|
|
221
|
+
declare const GlyphDirectionalLightHelper: react.MemoExoticComponent<typeof GlyphDirectionalLightHelperInner>;
|
|
170
222
|
|
|
171
|
-
interface
|
|
172
|
-
/** Attach to a `
|
|
173
|
-
ref: RefObject<
|
|
223
|
+
interface UseGlyphAnimationResult {
|
|
224
|
+
/** Attach to a `GlyphAnimationTarget`-compatible handle when not using `root`. */
|
|
225
|
+
ref: RefObject<GlyphAnimationTarget | null>;
|
|
174
226
|
/** The active mixer, or null if inputs are not ready yet. */
|
|
175
|
-
mixer:
|
|
227
|
+
mixer: GlyphAnimationMixer | null;
|
|
176
228
|
/** Resolved clip list (empty when `clips` is undefined). */
|
|
177
|
-
clips:
|
|
229
|
+
clips: GlyphAnimationClip[];
|
|
178
230
|
/** Clip names in input order. */
|
|
179
231
|
names: string[];
|
|
180
232
|
/**
|
|
@@ -182,8 +234,8 @@ interface UseGlyphcssAnimationResult {
|
|
|
182
234
|
* instantiates the action if it does not exist yet. Returns null when the
|
|
183
235
|
* mixer is not ready.
|
|
184
236
|
*/
|
|
185
|
-
actions: Record<string,
|
|
237
|
+
actions: Record<string, GlyphAnimationAction | null>;
|
|
186
238
|
}
|
|
187
|
-
declare function
|
|
239
|
+
declare function useGlyphAnimation(clips: GlyphAnimationClip[] | undefined, controller: ParseAnimationController | undefined, root?: RefObject<GlyphAnimationTarget | null> | GlyphAnimationTarget | null): UseGlyphAnimationResult;
|
|
188
240
|
|
|
189
|
-
export {
|
|
241
|
+
export { GlyphAxesHelper, type GlyphAxesHelperProps, GlyphOrthographicCamera as GlyphCamera, GlyphCameraContext, type GlyphCameraContextValue, type GlyphOrthographicCameraProps as GlyphCameraProps, GlyphDirectionalLightHelper, type GlyphDirectionalLightHelperProps, GlyphFirstPersonControls, type GlyphFirstPersonControlsProps, GlyphGround, type GlyphGroundProps, GlyphHotspot, type GlyphHotspotProps, GlyphMapControls, type GlyphMapControlsProps, GlyphMesh, type GlyphMeshProps, GlyphOrbitControls, type GlyphOrbitControlsProps, GlyphOrthographicCamera, type GlyphOrthographicCameraProps, GlyphPerspectiveCamera, type GlyphPerspectiveCameraProps, GlyphScene, GlyphSceneContext, type GlyphSceneContextValue, type GlyphSceneProps, type UseGlyphAnimationResult, type UseGlyphMeshOptions, type UseGlyphMeshResult, findGlyphMeshHandle, findMeshUnderPoint, pointInMeshElement, useGlyphAnimation, useGlyphCamera, useGlyphMesh, useGlyphSceneContext };
|