@react-three/fiber 7.0.24 → 7.0.27

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.
@@ -1,388 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var index = require('../../dist/index-eb414398.cjs.prod.js');
6
- var THREE = require('three');
7
- var expoAsset = require('expo-asset');
8
- var expoFileSystem = require('expo-file-system');
9
- var base64Arraybuffer = require('base64-arraybuffer');
10
- var suspendReact = require('suspend-react');
11
- var _extends = require('@babel/runtime/helpers/extends');
12
- var React = require('react');
13
- var reactNative = require('react-native');
14
- var expoGl = require('expo-gl');
15
- var Pressability = require('react-native/Libraries/Pressability/Pressability');
16
- require('react-reconciler/constants');
17
- require('zustand');
18
- require('react-reconciler');
19
- require('scheduler');
20
-
21
- function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
22
-
23
- function _interopNamespace(e) {
24
- if (e && e.__esModule) return e;
25
- var n = Object.create(null);
26
- if (e) {
27
- Object.keys(e).forEach(function (k) {
28
- if (k !== 'default') {
29
- var d = Object.getOwnPropertyDescriptor(e, k);
30
- Object.defineProperty(n, k, d.get ? d : {
31
- enumerable: true,
32
- get: function () {
33
- return e[k];
34
- }
35
- });
36
- }
37
- });
38
- }
39
- n['default'] = e;
40
- return Object.freeze(n);
41
- }
42
-
43
- var THREE__namespace = /*#__PURE__*/_interopNamespace(THREE);
44
- var React__namespace = /*#__PURE__*/_interopNamespace(React);
45
- var Pressability__default = /*#__PURE__*/_interopDefault(Pressability);
46
-
47
- /**
48
- * Generates an asset based on input type.
49
- */
50
-
51
- const getAsset = input => {
52
- if (input instanceof expoAsset.Asset) return input;
53
-
54
- switch (typeof input) {
55
- case 'string':
56
- return expoAsset.Asset.fromURI(input);
57
-
58
- case 'number':
59
- return expoAsset.Asset.fromModule(input);
60
-
61
- default:
62
- throw 'Invalid asset! Must be a URI or module.';
63
- }
64
- };
65
- /**
66
- * Downloads from a local URI and decodes into an ArrayBuffer.
67
- */
68
-
69
-
70
- const toBuffer = async localUri => expoFileSystem.readAsStringAsync(localUri, {
71
- encoding: 'base64'
72
- }).then(base64Arraybuffer.decode);
73
-
74
- function loadingFn(extensions, onProgress) {
75
- return function (Proto, ...input) {
76
- // Construct new loader and run extensions
77
- const loader = new Proto();
78
- if (extensions) extensions(loader); // Go through the urls and load them
79
-
80
- return Promise.all(input.map(entry => new Promise(async (res, reject) => {
81
- // Construct URL
82
- const url = typeof entry === 'string' ? loader.path + entry : entry; // There's no Image in native, so we create & pass a data texture instead
83
-
84
- if (loader instanceof THREE__namespace.TextureLoader) {
85
- const asset = await getAsset(url).downloadAsync();
86
- const texture = new THREE__namespace.Texture();
87
- texture.isDataTexture = true;
88
- texture.image = {
89
- data: asset,
90
- width: asset.width,
91
- height: asset.height
92
- };
93
- texture.needsUpdate = true;
94
- return res(texture);
95
- } // Do similar for CubeTextures
96
-
97
-
98
- if (loader instanceof THREE__namespace.CubeTextureLoader) {
99
- const texture = new THREE__namespace.CubeTexture();
100
- texture.isDataTexture = true;
101
- texture.images = await Promise.all(url.map(async src => {
102
- const asset = await getAsset(src).downloadAsync();
103
- return {
104
- data: asset,
105
- width: asset.width,
106
- height: asset.height
107
- };
108
- }));
109
- texture.needsUpdate = true;
110
- return res(texture);
111
- } // If asset is external and not an Image, load it
112
-
113
-
114
- if (url.startsWith != null && url.startsWith('http') && Proto.prototype.hasOwnProperty('load')) {
115
- return loader.load(entry, data => {
116
- if (data.scene) Object.assign(data, index.buildGraph(data.scene));
117
- res(data);
118
- }, onProgress, error => reject(`Could not load ${url}: ${error.message}`));
119
- } // Otherwise, create a localUri and a file buffer
120
-
121
-
122
- const {
123
- localUri
124
- } = await getAsset(url).downloadAsync();
125
- const arrayBuffer = await toBuffer(localUri); // Parse it
126
-
127
- const parsed = loader.parse == null ? void 0 : loader.parse(arrayBuffer, undefined, data => {
128
- if (data.scene) Object.assign(data, index.buildGraph(data.scene));
129
- res(data);
130
- }, error => reject(`Could not load ${url}: ${error.message}`)); // Respect synchronous parsers which don't have callbacks
131
-
132
- if (parsed) return res(parsed);
133
- })));
134
- };
135
- }
136
-
137
- function useLoader(Proto, input, extensions, onProgress) {
138
- // Use suspense to load async assets
139
- const keys = Array.isArray(input) ? input : [input];
140
- const results = suspendReact.suspend(loadingFn(extensions, onProgress), [Proto, ...keys], {
141
- equal: index.is.equ
142
- }); // Return the object/s
143
-
144
- return Array.isArray(input) ? results : results[0];
145
- }
146
-
147
- useLoader.preload = function (Proto, input, extensions) {
148
- const keys = Array.isArray(input) ? input : [input];
149
- return suspendReact.preload(loadingFn(extensions), [Proto, ...keys]);
150
- };
151
-
152
- useLoader.clear = function (Proto, input) {
153
- const keys = Array.isArray(input) ? input : [input];
154
- return suspendReact.clear([Proto, ...keys]);
155
- };
156
-
157
- const EVENTS = {
158
- PRESS: 'onPress',
159
- PRESSIN: 'onPressIn',
160
- PRESSOUT: 'onPressOut',
161
- LONGPRESS: 'onLongPress',
162
- HOVERIN: 'onHoverIn',
163
- HOVEROUT: 'onHoverOut',
164
- PRESSMOVE: 'onPressMove'
165
- };
166
- const DOM_EVENTS = {
167
- [EVENTS.PRESS]: 'onClick',
168
- [EVENTS.PRESSIN]: 'onPointerDown',
169
- [EVENTS.PRESSOUT]: 'onPointerUp',
170
- [EVENTS.LONGPRESS]: 'onDoubleClick',
171
- [EVENTS.HOVERIN]: 'onPointerOver',
172
- [EVENTS.HOVEROUT]: 'onPointerOut',
173
- [EVENTS.PRESSMOVE]: 'onPointerMove'
174
- };
175
- function createTouchEvents(store) {
176
- const {
177
- handlePointer
178
- } = index.createEvents(store);
179
-
180
- const handleTouch = (event, name) => {
181
- event.persist() // Apply offset
182
- ;
183
- event.nativeEvent.offsetX = event.nativeEvent.pageX;
184
- event.nativeEvent.offsetY = event.nativeEvent.pageY; // Emulate DOM event
185
-
186
- const callback = handlePointer(DOM_EVENTS[name]);
187
- return callback(event.nativeEvent);
188
- };
189
-
190
- return {
191
- connected: false,
192
- handlers: Object.values(EVENTS).reduce((acc, name) => ({ ...acc,
193
- [name]: event => handleTouch(event, name)
194
- }), {}),
195
- connect: () => {
196
- const {
197
- set,
198
- events
199
- } = store.getState();
200
- events.disconnect == null ? void 0 : events.disconnect();
201
- const connected = new Pressability__default['default'](events == null ? void 0 : events.handlers);
202
- const handlers = connected.getEventHandlers();
203
- set(state => ({
204
- events: { ...state.events,
205
- connected,
206
- handlers
207
- }
208
- }));
209
- },
210
- disconnect: () => {
211
- const {
212
- set,
213
- events
214
- } = store.getState();
215
-
216
- if (events.connected) {
217
- events.connected.reset();
218
- set(state => ({
219
- events: { ...state.events,
220
- connected: false
221
- }
222
- }));
223
- }
224
- }
225
- };
226
- }
227
-
228
- const CANVAS_PROPS = ['gl', 'events', 'shadows', 'linear', 'flat', 'orthographic', 'frameloop', 'performance', 'clock', 'raycaster', 'camera', 'onPointerMissed', 'onCreated'];
229
-
230
- function Block({
231
- set
232
- }) {
233
- React__namespace.useLayoutEffect(() => {
234
- set(new Promise(() => null));
235
- return () => set(false);
236
- }, [set]);
237
- return null;
238
- }
239
-
240
- class ErrorBoundary extends React__namespace.Component {
241
- constructor(...args) {
242
- super(...args);
243
- this.state = {
244
- error: false
245
- };
246
- }
247
-
248
- componentDidCatch(error) {
249
- this.props.set(error);
250
- }
251
-
252
- render() {
253
- return this.state.error ? null : this.props.children;
254
- }
255
-
256
- }
257
-
258
- ErrorBoundary.getDerivedStateFromError = () => ({
259
- error: true
260
- });
261
-
262
- const Canvas = /*#__PURE__*/React__namespace.forwardRef(({
263
- children,
264
- fallback,
265
- style,
266
- events,
267
- ...props
268
- }, forwardedRef) => {
269
- // Create a known catalogue of Threejs-native elements
270
- // This will include the entire THREE namespace by default, users can extend
271
- // their own elements by using the createRoot API instead
272
- React__namespace.useMemo(() => index.extend(THREE__namespace), []);
273
- const [{
274
- width,
275
- height
276
- }, setSize] = React__namespace.useState({
277
- width: 0,
278
- height: 0
279
- });
280
- const [canvas, setCanvas] = React__namespace.useState(null);
281
- const [bind, setBind] = React__namespace.useState();
282
- const canvasProps = index.pick(props, CANVAS_PROPS);
283
- const viewProps = index.omit(props, CANVAS_PROPS);
284
- const [block, setBlock] = React__namespace.useState(false);
285
- const [error, setError] = React__namespace.useState(false); // Suspend this component if block is a promise (2nd run)
286
-
287
- if (block) throw block; // Throw exception outwards if anything within canvas throws
288
-
289
- if (error) throw error;
290
- const onLayout = React__namespace.useCallback(e => {
291
- const {
292
- width,
293
- height
294
- } = e.nativeEvent.layout;
295
- setSize({
296
- width,
297
- height
298
- });
299
- }, []);
300
- const onContextCreate = React__namespace.useCallback(context => {
301
- const canvasShim = {
302
- width: context.drawingBufferWidth,
303
- height: context.drawingBufferHeight,
304
- style: {},
305
- addEventListener: () => {},
306
- removeEventListener: () => {},
307
- clientHeight: context.drawingBufferHeight,
308
- getContext: () => context
309
- };
310
- setCanvas(canvasShim);
311
- }, []);
312
-
313
- if (width > 0 && height > 0 && canvas) {
314
- // Overwrite onCreated to apply RN bindings
315
- const onCreated = state => {
316
- // Bind events after creation
317
- setBind(state.events.handlers); // Bind render to RN bridge
318
-
319
- const context = state.gl.getContext();
320
- const renderFrame = state.gl.render.bind(state.gl);
321
-
322
- state.gl.render = (scene, camera) => {
323
- renderFrame(scene, camera);
324
- context.endFrameEXP();
325
- };
326
-
327
- return canvasProps == null ? void 0 : canvasProps.onCreated == null ? void 0 : canvasProps.onCreated(state);
328
- };
329
-
330
- index.createRoot(canvas, { ...canvasProps,
331
- // expo-gl can only render at native dpr/resolution
332
- // https://github.com/expo/expo-three/issues/39
333
- dpr: reactNative.PixelRatio.get(),
334
- size: {
335
- width,
336
- height
337
- },
338
- events: events || createTouchEvents,
339
- onCreated
340
- }).render( /*#__PURE__*/React__namespace.createElement(ErrorBoundary, {
341
- set: setError
342
- }, /*#__PURE__*/React__namespace.createElement(React__namespace.Suspense, {
343
- fallback: /*#__PURE__*/React__namespace.createElement(Block, {
344
- set: setBlock
345
- })
346
- }, children)));
347
- }
348
-
349
- React__namespace.useEffect(() => {
350
- return () => index.unmountComponentAtNode(canvas);
351
- }, [canvas]);
352
- return /*#__PURE__*/React__namespace.createElement(reactNative.View, _extends({}, viewProps, {
353
- ref: forwardedRef,
354
- onLayout: onLayout,
355
- style: {
356
- flex: 1,
357
- ...style
358
- }
359
- }, bind), width > 0 && /*#__PURE__*/React__namespace.createElement(expoGl.GLView, {
360
- onContextCreate: onContextCreate,
361
- style: reactNative.StyleSheet.absoluteFill
362
- }));
363
- });
364
-
365
- exports.ReactThreeFiber = index.threeTypes;
366
- exports._roots = index.roots;
367
- exports.act = index.act;
368
- exports.addAfterEffect = index.addAfterEffect;
369
- exports.addEffect = index.addEffect;
370
- exports.addTail = index.addTail;
371
- exports.advance = index.advance;
372
- exports.applyProps = index.applyProps;
373
- exports.context = index.context;
374
- exports.createPortal = index.createPortal;
375
- exports.createRoot = index.createRoot;
376
- exports.dispose = index.dispose;
377
- exports.extend = index.extend;
378
- exports.invalidate = index.invalidate;
379
- exports.reconciler = index.reconciler;
380
- exports.render = index.render;
381
- exports.unmountComponentAtNode = index.unmountComponentAtNode;
382
- exports.useFrame = index.useFrame;
383
- exports.useGraph = index.useGraph;
384
- exports.useStore = index.useStore;
385
- exports.useThree = index.useThree;
386
- exports.Canvas = Canvas;
387
- exports.events = createTouchEvents;
388
- exports.useLoader = useLoader;