Repository navigation
v0.13.0 - One Core
klipp is now a complete camera system in the core, with integrations as thin layers on top: three.js and React Three Fiber today, with more to come, like TresJS. Klipp runs the cameras, picks the winner and blends with any renderer. KlippThree from @kvvasuu/klipp/three drives a three.js camera, and <Klipp> is built on it.
✨ New Features
Klippruns everything - virtual cameras, priority, blending and the frame loop. Callklipp.update(dt)and putklipp.shoton your camera, or overridewriteto update it only when the shot changes.- Every piece is a core class -
FollowBody,HardLookAtAim,PositionComposerBody,GroupFramingExtensionand the rest take aTargetPoseyou keep up to date. To read your engine's objects directly, extend one and overridereadTarget. - three.js classes end in
Three-KlippThreedrives aPerspectiveCamera, andVirtualCameraThree,FollowBodyThreeand the other pieces readObject3Dtargets. Their options take aVector3, a tuple or a number wherever a setting is a vector. klipp.whileOnScreen(camera, start)connects input only while its camera is on screen, outside React.CameraFrustumHelperThreedraws a virtual camera's frustum in three.js.- Settings factories -
createFollowParams,createLensParamsand the rest give every piece's defaults. - Debug zones in the core -
composerDebugZonesandgroupFramingPaddingBox, for drawing zones withDebugOverlaywithout React. - Duplicate camera names now log a warning.
⚠️ Breaking Changes
- three.js classes end in
Three-FollowBody,HardLockToTargetBody,PositionComposerBody,HardLookAtAim,RotateWithFollowTargetAim,RotationComposerAim,PanTiltAim,GroupFramingExtensionandCameraControlsBodyfrom@kvvasuu/klipp/threeare nowFollowBodyThree,HardLockToTargetBodyThreeand so on. This also changes the types of React refs:useRef<FollowBody>is nowuseRef<FollowBodyThree>. KlippCoreis nowKlipp, andKlippCoreOptionsis nowKlippOptions.Klipp-registerCamera,updatePriority,updateHintsandtickare replaced byaddCamera(name, options), the camera's ownpriorityandhints, andupdate(dt)withshot.VirtualCameraControlleris nowVirtualCamera.useKlipp()returns theKlippThreeinstead of{ core, registerUpdate, initialCameraState, targets }:useKlipp().core.isBlendingis nowuseKlipp().isBlending.useVirtualCamera()returns the camera instead of{ controller, state, initialState }. A<VirtualCamera>'srefis that sameVirtualCameraThree.- Custom pieces -
registerBody(update)andregisterAim(update)are replaced bycamera.body = { update }andcamera.aim = { update }, orsetBodyandsetAim.registerExtensionandregisterNoiseare replaced byaddExtension({ update })andaddNoise({ update }). Every method except the setters returns a function that removes the piece. - Types removed -
KlippContextValue,VirtualCameraContextValueandVirtualCameraSlots.
🔄 Behavior Changes
BlendCurves.easeInandeaseOutare swapped, to matchcubicInandcubicOutfrommath. "In" is now a gentle departure, as in CSS. Your code compiles as before, but these blends move the other way: swap the two names to keep the old motion.createGroupMember()starts withresolved: true, so a new member counts right away. Set it tofalseto skip one.
🐛 Bug Fixes
- Reactivating a camera whose target isn't available yet no longer eases in from the old shot once the target appears.
HardLockToTargetandGroupFramingreset on activation likeFollow, and the composers wait for the target.
📖 Documentation
- Every page shows the core and each integration in tabs. The tab you pick is remembered across pages.
- Your first camera is one step-by-step guide per integration.
- Building on the core covers your own integration and the data and functions underneath.
- Shorter pages and README, without repeated explanations.
🔧 Internal Changes
- three.js and React keep only what is theirs: target reads, camera writes, props and hooks.
- Core tests run without three.js, and tests are typechecked in CI.
- Leaner test suite, with one test per behavior.
What's Changed
- test: core tests without three.js by @kvvasuu in #90
- refactor: express the recoil impulse as an inverted smoothstep by @kvvasuu in #91
- Test/cleanup by @kvvasuu in #92
- Refactor/params defaults by @kvvasuu in #93
- Fix/hardening by @kvvasuu in #94
- test: seed the impulse shake so it never samples exactly zero by @kvvasuu in #96
- Refactor/klipp class by @kvvasuu in #97
- Docs/core react by @kvvasuu in #98
- Docs/tabs by @kvvasuu in #99
- Feat/three vector options by @kvvasuu in #100
- Feat/layer helpers by @kvvasuu in #101
- Refactor/three suffix by @kvvasuu in #102
- docs: sync the integration tabs across pages by @kvvasuu in #103
- docs: create the target in every core example by @kvvasuu in #104
Full Changelog: v0.12.0...v0.13.0