Commit graph

298 commits

Author SHA1 Message Date
Andrew Prifer
8d8e2348dd Create idb-backed image prop (#366)
Co-authored-by: Clement Roche <rchclement@gmail.com>
2022-12-31 11:01:16 +01:00
Aria Minaei
95b329b02d 0.5.1 2022-12-31 10:54:27 +01:00
Aria Minaei
fcd3ab7ec5 0.5.1-rc.2 2022-12-07 10:24:50 +01:00
Aria Minaei
a9adc2640c 0.5.1-rc.1 2022-11-25 11:21:28 +01:00
Andrew Prifer
e3a194c7dd
Playground improvements (#342)
Remove previews, add vs code task, open in chrome
2022-11-22 15:05:11 +00:00
Andrew Prifer
484cfeb8ba
Add camera playground (#343) 2022-11-22 14:34:15 +00:00
Aria Minaei
a8a9b5ef05 Rename deleteObject() and related params
Since `sheet.deleteObject()` doesn't actually delete the values
of the props of that object, I decided to rename it to `detachObject()`.

Also, the param `override` sounded too similar to the concept of value overrides,
so I renamed it to `reconfigure`.
2022-11-10 16:23:15 +01:00
Andrew Prifer
43714fdf17
Notification improvements (#324) 2022-10-21 20:32:53 +00:00
Andrew Prifer
965d7085dc
Add runtime type checks to r3f (#323)
* Add better error/warning messages to r3f

* Fix notifications playground
2022-10-21 19:17:45 +00:00
Andrew Prifer
62bc12ab51
Create a notification system that can display notifications in Theatre.js' Studio (#320)
* Implement an internal library for studio notifications

* Improve design a little

* Document code

* Change relative import to absolute one

* Fix tiny styling issue

* Add notifications playground

* Add notifications empty state and keep notifications buttons always visible

Also fix a bug related to not clearing the type and uniqueness checkers.

* Simplify notifications playground

* Treat window as optional in case it runs in server code
2022-10-21 15:51:13 +02:00
Aria Minaei
ef5752cbd3 Add a playground for dynamic trees in r3f 2022-10-18 11:43:54 +02:00
Aria Minaei
a9c3c00153 Implement dynamic scene trees in r3f
This makes it possible to add/remove objects on the fly, do hot-module reloading, change object configs on the fly, and more.
2022-10-18 11:43:54 +02:00
Aria Minaei
10c2b69bf3 Implement useExtensionButton() 2022-10-18 11:43:54 +02:00
Andrew Prifer
e708463377
Remove useless TS type (#318) 2022-10-17 14:13:23 +00:00
Andrew Prifer
29e036638b
Normalize theatre keys in r3f (#317)
Also remove a stray console log and make makeStoreKey make more sense.
2022-10-16 16:02:35 +00:00
Andrew Prifer
54ed4c3c41
Improve light support in theatre/r3f (#316)
Add color to all light types and add ambient and hemisphere lights
2022-10-14 13:43:53 +00:00
Andrew Prifer
6497bf2097
Add instant editable cameras to the r3f extension (#315)
Add spruced up editable orthographic/perspective camera
2022-10-13 18:14:53 +00:00
Andrew Prifer
3ec8c20fa6
Warn about (possibly) incorrect custom camera (#308)
Print a warning if people use e.perspectiveCamera or e.orthographicCamera
2022-10-06 14:22:39 +00:00
Aria Minaei
ca9360fc29 Allow audio files in the playground 2022-09-27 23:32:01 +02:00
Aria Minaei
179c7a8158 Allow audio files in the playground 2022-09-27 23:32:01 +02:00
Aria Minaei
6d49e5977c Remove the warning about SSR mode
It's being misunderstood as an error message https://discord.com/channels/870988717190426644/870988717190426647/1020751857024503828
2022-09-27 23:28:23 +02:00
Aria Minaei
87acdbe9ea 0.5.0 2022-09-17 18:54:11 +02:00
Aria Minaei
c97377d868 0.5.0-rc.4 2022-09-17 18:54:11 +02:00
Andrew Prifer
743254a6c6
Fix popover behavior when popover is open and the trigger is clicked (#211)
* Fix popover behavior when open and clicking on trigger

* Remove console log

* Resolve merge conflicts

* Remove destructuring in favor of property access

* Extract usePopover return type into an interface

* Fix merge
2022-09-14 09:05:09 -04:00
Andrew Prifer
8680f9d89e
Replace uniqueName with theatreKey (#285) 2022-09-14 08:36:49 -04:00
Elliot
735bd983a5
Fix/0.5-compatability-tests (#293)
* Working changes

* Fix window undefined bug by updating lib

* Fix TransformControlsImpl import

* Fix compatibility tests>simple debuggable examples
2022-09-13 15:37:39 -04:00
Andrew Prifer
494c60d0c3
Require Opt modifier for orbiting (#286) 2022-08-25 19:55:47 +02:00
Elliot
a871aa628f Revert "Handle requestPointerLock error cases in iframes P-199 (#272)"
This reverts commit 2ef9d5e346.
2022-08-17 16:14:36 -04:00
Andrew Prifer
14603bccbd
Make transform controls only update the props that are being manipulated in the current mode of the transform controls (#279)
Only update the transform that is being manipulated in the current mode
2022-08-15 15:15:37 +00:00
Cole Lawrence
e0c9626d68 dev: Add "reading obj value" playground test 2022-08-05 10:30:13 -04:00
Cole Lawrence
c00144464d dev: Fix playground scroll y on home page 2022-08-05 10:30:13 -04:00
vezwork
fdf268ad43 Add comments and remove extra performance measure
Co-authored-by: Cole Lawrence <cole@colelawrence.com>
2022-08-04 13:34:08 -04:00
Cole Lawrence
62def1e883 Add r3f stress + Ticker.__ticks counter 2022-08-04 13:34:08 -04:00
Cole Lawrence
ea3e7434c6 Fix e2e visual regression tests by always showing Updates badge in CI
- ensure that window.__IS_VISUAL_REGRESSION_TESTING is true when CI=1
2022-08-03 11:38:44 -04:00
Cole Lawrence
963b03ab6e dev: Add warning for unbound .tick() call 2022-08-03 11:38:44 -04:00
Cole Lawrence
63056c5a58 fix validate path call (warning) & playground dom: Fix namespace warning 2022-08-03 11:38:44 -04:00
Cole Lawrence
2ef9d5e346
Handle requestPointerLock error cases in iframes P-199 (#272)
See https://linear.app/theatre/issue/P-199/dont-use-pointer-lock-when-in-an-iframe
2022-08-03 13:55:09 +00:00
Cole Lawrence
8bd37a28d6 r3f fix: Pinching creates more than one undo level in r3f P-202
See https://linear.app/theatre/issue/P-202/pinching-creates-more-than-one-undo-level-in-r3f-history-bug
2022-08-02 16:06:15 -04:00
Fülöp Kovács
e3226da492 Add namespacing to dom example 2022-07-26 10:43:36 +01:00
Cole Lawrence
fcc23b3863 Add variants of the extension example 2022-07-25 12:01:26 -04:00
Cole Lawrence
984a61347f Use "Theatre.js" for name consistency
Co-authored-by: Fülöp <fulopkovacs@users.noreply.github.com>
2022-07-25 12:01:26 -04:00
Cole Lawrence
58f04685ad r3f: Accept function for objRef like for setState 2022-07-25 12:01:26 -04:00
Cole Lawrence
415e493834 doc: Add doc to Ticker.raf 2022-07-25 12:01:26 -04:00
Cole Lawrence
a48155f8dc r3f readme: Update with corrected API 2022-07-25 12:01:26 -04:00
Cole Lawrence
5ca3edead8 dev: Fix r3f tsconfig to include TSX files 2022-07-25 12:01:26 -04:00
Cole Lawrence
11b5d175f4
Fix github checks (#263)
* Update dependencies which pass tests locally

* Break the yarn cache in an attempt to fix checks

* playground: Add wrapping error info for build.ts

* playground: Don't use dev mode in CI tests

* playground: Use tsc for typecheck

* playground: Specify working esbuild version 0.13.15

* playground: Use only promises in build.ts

* playground: Ensure serving in ci e2e

 * Add echo for vercel for build:static
2022-07-25 10:37:34 +02:00
Aria Minaei
a8176a36f7 0.5.0-rc.3 2022-07-12 18:37:04 +02:00
Aria Minaei
00a039a713 Fix exports of @theatre/r3f so it is consistently interpreted across bundlers
Before this commit, the exports field of `@theatre/r3f` was:

```
"exports": {
  ".": "./dist/index.js",
  "./extension": "./dist/extension/index.js"
 },
 ```
So users could import the extension from '@theatre/r3f/extension'

However, if the user’s bundler doesn’t support the exports field, they’d have to import from @theatre/r3f/dist/extension. There are 3 problems with this approach:

1. We have to ask users to try both paths and see which works for their bundler.
2. Users can’t copy code from each other if their bundler setups are different.
3. To make matters worse, if a user’s bundler supports exports, they can’t import from @theatre/r3f/dist/extension.

This is all confusing, so we're fixing it by exposing @theatrer/3f/dist/extension and not @theatre/r3f/extension. Uglier, but more consistent, and avoids the above 3 problems.
2022-07-12 17:49:09 +02:00
Aria Minaei
667f9d4fa2 Massive perf-gain in @theatre/react
Remove cold derivation reads

Prior to this commit, the first render of every `useDerivation()` resulted in a cold read of its inner derivation. Cold reads are predictably slow. The reason we'd run cold reads was to comply with react's rule of not running side-effects during render. (Turning a derivation hot is _technically_ a side-effect).

However, now that users are animating scenes with hundreds of objects in the same sequence, the lag started to be noticable.

This commit changes `useDerivation()` so that it turns its derivation hot before rendering them.

Freshen derivations before render

Previously in order to avoid the zombie child problem (https://kaihao.dev/posts/stale-props-and-zombie-children-in-redux) we deferred freshening the derivations to the render phase of components. This meant that if a derivation's dependencies changed, `useDerivation()` would schedule a re-render, regardless of whether that change actually affected the derivation's value. Here is a contrived example:

```
const num = new Box(1)
const isPositiveD = prism(() => num.derivation.getValue() >= 0)

const Comp = () => {
  return <div>{useDerivation(isPositiveD)}</div>
}

num.set(2) // would cause Comp to re-render- even though 1 is still a positive number
```

We now avoid this problem by freshening the derivation (i.e. calling `der.getValue()`) inside `runQueue()`, and then only causing a re-render if the derivation's value is actually changed.

This still avoids the zombie-child problem because `runQueue` reads the derivations in-order of their position in  the mounting tree.

On the off-chance that one of them still turns out to be a zombile child, `runQueue` will defer that particular `useDerivation()` to be read inside a normal react render phase.
2022-07-12 13:34:29 +02:00
Aria Minaei
cbfc8861b5 Add comment about bundling deps in r3f/extension 2022-07-08 14:08:57 +02:00