react-pixi-fiber@3.0.0-alpha.1

Patch Changes

• #387 8ab7e10 Thanks @michalochman! - The Stage error for a rejected app prop names the two forms that Stage accepts: a PIXI.Application, or an object that the PixiJS adapter accepts as one. The pixi-8 adapter accepts an object with a Container as stage.

  usePixiTicker throws during render when the app has no ticker, and the error names the ticker.

@react-pixi-fiber/pixi-8@1.0.0-alpha.1

Minor Changes

• #387 7a6bea7 Thanks @michalochman! - pixi8WithComponents takes the PixiJS classes that the app renders as components. A bundle of the ES build holds only those classes. pixi8() keeps every class:

  import { Application, Container, Sprite, Text } from "pixi.js";
  import { pixi8WithComponents } from "@react-pixi-fiber/pixi-8";
  
  configure({ react: react18(), pixi: pixi8WithComponents({ components: { Application, Container, Sprite, Text } }) });

  A tag left out of the list throws at first render, and the error names the class to add. ParticleContainer needs Particle in the list. Without Application in the list, Stage needs an app prop. That app needs a Container as stage, and a ticker for usePixiTicker. So an app can make its own renderer. allComponents holds every class that pixi8() uses.

2.0.0

Same code as 2.0.0-rc.4. Changes since 1.0.6, collected from the 2.0.0 prereleases:
Same code as 2.0.0-rc.4. Changes since 1.0.6, collected from the prereleases below:

Changed

• Requires React 18.2 or newer, react-reconciler updated to 0.29
• ref on built-in and custom components is now typed as the underlying PIXI.DisplayObject instance instead of the props type
• Every component accepts children again in TypeScript, as every wrapped display object is a PIXI.Container
• Declared pixi.js peer dependency as >=4.4.0 <8.0.0, PixiJS v8 is not supported

Removed

• Removed unstable_batchedUpdates API ([#89])

Added

• TypeScript: CustomPIXIProperty is now declared in index.d.ts
• TypeScript: PointLikeTuple accepts a single element tuple (e.g. scale={[2]}), matching runtime behavior
• TypeScript: this.applyDisplayObjectProps inside customApplyProps is now typed (CustomDisplayObjectPropSetterContext), along with CustomPIXIComponentProps helper type
• Examples are now written in TypeScript and typechecked against the local index.d.ts in CI

Fixed

• Stage renders a new canvas when PIXI.Application is recreated after non-dimensional options change. Previously the new PIXI.Application shared the canvas with the one being destroyed, and destroying it unbound the current WebGL program (PixiJS v6) or lost the context (PixiJS v7), leaving only the background color rendered
• Create React App 5 (and other webpack builds with strict export checks) failed with "Attempted import error: 'extras' is not exported from 'pixi.js'" when using PixiJS v5+. The ES build read the PixiJS v4 extras, mesh and particles namespaces straight from the pixi.js import, the fallback to the top-level classes is unchanged
• TypeScript: Text accepts a plain style object in style (Partial<PIXI.ITextStyle>), matching the PIXI.Text setter. PixiJS v7 types the style getter as TextStyle only, so passing an object literal failed to typecheck

react-pixi-fiber@3.0.0-alpha.0

Major Changes

• #377 446f761 Thanks @michalochman! - Split into a core package and per-version adapters. Call configure({ react, pixi }) once at the app entry with a React adapter (@react-pixi-fiber/react-17, react-18, react-19) and a PixiJS adapter (@react-pixi-fiber/pixi-4 to pixi-8). See the migration guide in the README.

  Added

  • configure({ react, pixi }), called once in the app entry before the first render, wires a React adapter and a PixiJS adapter into the core. Without it the first render throws an error that prints the install line and the setup lines
  • React adapters: @react-pixi-fiber/react-17 for React 17.0.2 or a later 17.x, @react-pixi-fiber/react-18 for React 18.3.1 or a later 18.x and @react-pixi-fiber/react-19 for React 19.3 or a later 19.x
  • PixiJS adapters: @react-pixi-fiber/pixi-4 for PixiJS 4.4 or a later 4.x, @react-pixi-fiber/pixi-5, @react-pixi-fiber/pixi-6, @react-pixi-fiber/pixi-7 for PixiJS 7.2 or a later 7.x and @react-pixi-fiber/pixi-8 for PixiJS 8.9 or a later 8.x. The pixi-7 and pixi-8 adapters have a compat/pixi6 module that translates the 2.x props their PixiJS version renamed or ignores. Each adapter's changelog lists its tags and peers
  • Fragment refs on React 19: a <Fragment ref> inside Stage receives a PixiFragmentInstance with children, getBounds(), off(event, fn) and on(event, fn) over the fragment's top-level display objects
  • The PixiJS adapter's defaults option sets default props per tag, like React's defaultProps: pixi6({ defaults: { Sprite: { alpha: 0.5 } } }). A prop that is missing or undefined when the instance is created gets its default before create runs, and a prop removed later, or set to undefined, returns to it. An explicit null is kept. Entries are keyed by the tag name; the deprecated NineSlicePlane on PixiJS 8 is keyed as NineSliceSprite
  • A PixiJS adapter can rename props with translateProps before they are validated, set or diffed; a PIXIComponent with its own applyProps receives the props as written, with the defaults applied
  • PIXIComponent(type, behavior) and PIXIProperty replace CustomPIXIComponent(behavior, type) and CustomPIXIProperty. Behavior keys are create, applyProps, afterAdd, beforeRemove, and the unstable appendChild, insertBefore and removeChild, which let a container own the order of children that are not display objects. The Behavior, BehaviorInput and ApplyPropsContext types describe a behavior
  • getInstanceTag(instance) returns the tag an instance was created with, after a deprecated tag is mapped
  • A tag registered with PIXIComponent under the name of an adapter tag replaces the adapter tag and warns once in development. 2.x always created the built-in tag
  • PIXIProperty accepts tags registered with PIXIComponent; 2.x reported them as not a valid component type
  • PixiTickerCallback type export, the callback type usePixiTicker takes
  • Tags AnimatedSprite, Mesh, MeshSimple, MeshPlane, MeshRope and NineSliceSprite. Every PixiJS adapter implements all 13 tags
  • Stage onInit(app) prop, called once the PixiJS application exists and the children are rendered
  • Stage bridgeContexts prop, a list of React contexts provided around Stage that its children can read. React does not pass context between renderers; Stage reads each context where it renders and provides it again inside, and renders the children again when a value changes

  Changed

  • react-reconciler moved from the core into the React adapters; @react-pixi-fiber/react-17 bundles react-reconciler 0.26.2, @react-pixi-fiber/react-18 0.29.2 and @react-pixi-fiber/react-19 0.34.0
  • pixi.js is no longer a peer dependency of the core, the PixiJS adapter has it. The core's react peer is >=17.0.0 <20.0.0
  • PixiJS 7.0–7.1 and 8.0–8.8 are not supported: @react-pixi-fiber/pixi-7 peers pixi.js ^7.2.0 (eventMode first ships in 7.2) and @react-pixi-fiber/pixi-8 peers pixi.js ^8.9.0 (the first 8.x with every tag it exports). 2.x peered pixi.js >=4.4.0 <8
  • A second configure call after a render warns once in development. Trees already rendered keep their React renderer; new PixiJS instances and prop writes use the new adapter
  • The types InteractionCompatibility, InteractionEventCompatibility and PixiTypeFallback import from the PixiJS adapter: @react-pixi-fiber/pixi-4, pixi-5 and pixi-6 export all three, @react-pixi-fiber/pixi-7 exports PixiTypeFallback
  • Build output moved from cjs/ and es/ to dist/cjs/ and dist/es/. Imports of react-pixi-fiber are unaffected; direct paths to the built files need the dist/ prefix
  • The usePixiTicker callback has the type app.ticker.add takes on the configured PixiJS version
  • Examples are built with Vite instead of Create React App
  • Examples run on PixiJS 7 with @pixi/layers instead of PixiJS 6
  • package.json has an exports map. Bundlers that understand it (webpack 5, Vite) get the ES build directly, the development or production file picked by the development condition; Node and require still get the CommonJS entry points. Only react-pixi-fiber and react-pixi-fiber/package.json can be imported, deep imports into dist/ or src/ no longer resolve
  • The module and jsnext:main fields and index.es.js are removed. index.es.js was a CommonJS wrapper around the ES build; bundlers that ignore exports now use main
  • The type declarations are regular modules for the CommonJS and the ES build instead of a declare module "react-pixi-fiber" block. tsconfig.json paths pointing react-pixi-fiber at index.d.ts are no longer needed
  • Code is formatted and linted with Biome instead of Prettier and ESLint
  • The library is built with tsdown instead of Rollup 2 and Babel. The code targets ES2018 instead of ES5 and is minified with Oxc instead of terser; for the same source the development builds are about 20% and the production builds about 3% smaller
  • The library tests run with Vitest instead of Jest 26; pnpm test still runs the development and production suites. Babel and babel-plugin-rewire are gone, the tests mock modules with vi.mock instead
  • Stage creates the PixiJS application asynchronously. Children mount after Stage commits; ref._app.current is null until onInit fires and warns in development when read before that
  • Stage calls onInit once for every application it creates or is given in app and keeps, so again after an options change recreates the application. An options change while the application is being created is applied once it exists. A failed application creation (a thrown error or a rejected promise) reaches the nearest error boundary. Unmounting Stage before the application exists destroys the application when it is ready and never calls onInit
  • Destroying the application of an unmounted or recreated Stage keeps the WebGL context of a canvas still in the document, such as an external options.view, so the next application on that canvas can draw; 2.x lost it. The next application is created once the previous one is destroyed. The development double mount under <StrictMode> no longer leaves the canvas blank
  • Stage warns once in development when its app prop changes after mount; it keeps the application it started with
  • Stage renders no <canvas> when options.canvas is set, as for options.view. On PixiJS 8 the application draws on the given canvas; when both are given, view wins. On PixiJS 4 to 7 canvas is not an application option, and Stage warns once in development
  • Stage has no defaultProps: ref.current.props.options is undefined when options is omitted (it was {})
  • Stage passes typed prop names and Container prop names (for example buttonMode, interactiveChildren) to app.stage. 2.x compared the names in lowercase, so these props went to the <canvas> element
  • A prop set to undefined is reset to the value PixiJS had before the first write, recorded per instance, instead of a value from a table. This covers every PixiJS version and custom components. For example Text text set to undefined goes back to the value the PIXI.Text was created with, not ""
  • Removing a prop restores the value the instance had before react-pixi-fiber first set it, which may be undefined on PixiJS 8 (mask, filters), instead of setting numeric and untyped props to null, so <Sprite alpha={0.5} /> re-rendered as <Sprite /> has alpha 1 again. An explicit null is still set as-is on numeric, boolean and untyped props; on point and callback props it is an invalid value, as in 2.x. A prop set to undefined or removed no longer warns under <StrictMode>; the development warning for an invalid value names the received value ("Received -1 for prop alpha…") instead of "Received undefined"
  • Development prop validation now runs on React 18 and 19 for components under a <StrictMode> placed inside Stage (or inside the tree passed to render). It never ran on React 18 or 19 before, because the library checked React 17's mode bit. A <StrictMode> around <Stage> does not reach the PixiJS tree, which is a separate React root, as in 2.x
  • A boolean or function value on a prop the library does not type is set on the instance instead of being dropped (<Container sortableChildren /> works on PixiJS 4 to 7). Unknown prop names are no longer reported in development; they are set as-is. The development warning for an event handler prop checks only on plus an uppercase letter, so onclick no longer warns
  • `apply...

@react-pixi-fiber/react-19@1.0.0-alpha.0

Major Changes

• #377 b5e5be4 Thanks @michalochman! - Initial release. The React 19 adapter for React 19.3 or a later 19.x. It bundles react-reconciler 0.34.0 and renders on a concurrent root, as createRoot does; 2.x rendered on a legacy root. It logs uncaught, caught and recoverable render errors with console.error, gives a <Fragment ref> inside Stage a PixiFragmentInstance, and renders a <ViewTransition> inside Stage without animating.

Patch Changes

• Updated dependencies [446f761]:
  • react-pixi-fiber@3.0.0-alpha.0

@react-pixi-fiber/react-18@1.0.0-alpha.0

Major Changes

• #377 b5e5be4 Thanks @michalochman! - Initial release. The React 18 adapter for React 18.3.1 or a later 18.x; 2.x accepted React 18.2. It bundles react-reconciler 0.29.2 and renders on a legacy root, as 2.x did; react18({ root: "concurrent" }) renders on a concurrent root instead. Errors React recovers from are logged with console.error.

Patch Changes

• Updated dependencies [446f761]:
  • react-pixi-fiber@3.0.0-alpha.0

@react-pixi-fiber/react-17@1.0.0-alpha.0

Major Changes

• #377 b5e5be4 Thanks @michalochman! - Initial release. The React 17 adapter for React 17.0.2 or a later 17.x. It bundles react-reconciler 0.26.2 and renders on a legacy root, as 2.x did; react17({ root: "concurrent" }) renders on the experimental concurrent root of React 17 instead.

Patch Changes

• Updated dependencies [446f761]:
  • react-pixi-fiber@3.0.0-alpha.0

@react-pixi-fiber/pixi-8@1.0.0-alpha.0

Major Changes

• #377 b5e5be4 Thanks @michalochman! - Initial release. The PixiJS 8 adapter for PixiJS 8.9 or a later 8.x, the first with every tag it exports. It implements the 13 core tags and DOMContainer, HTMLText, Particle, PerspectiveMesh, RenderContainer and RenderLayer. NineSlicePlane maps to NineSliceSprite and warns once in development. Graphics passes context to the constructor. ParticleContainer takes Particle children; a Suspense boundary inside it does not hide its particles, and it cannot be the container passed to render. RenderLayer draws the objects attached to it with attach; its JSX children draw in tree order. Stage puts the untyped Container props of PixiJS 8, such as boundsArea, cullArea, label and tint, on app.stage, not on the <canvas>.

  The default export of @react-pixi-fiber/pixi-8/compat/pixi6 (also served as compat/pixi7), passed as pixi8({ compat }), translates the PixiJS 6 and 7 props PixiJS 8 renamed or deprecated: the event names become the on handler properties (click to onclick), mousemove, pointermove and touchmove become onglobalmousemove, onglobalpointermove and onglobaltouchmove, buttonMode becomes cursor, interactive becomes eventMode ("static" or "passive", as PixiJS 8's setter does), name becomes label and uvRespectAnchor becomes applyAnchorToTexture. Each translated prop warns once in development; when the PixiJS 8 prop is also set, it wins and a warning names both. Without the import the adapter holds no compat code.

Patch Changes

• Updated dependencies [446f761]:
  • react-pixi-fiber@3.0.0-alpha.0

@react-pixi-fiber/pixi-7@1.0.0-alpha.0

Major Changes

• #377 b5e5be4 Thanks @michalochman! - Initial release. The PixiJS 7 adapter for PixiJS 7.2 or a later 7.x, the first with eventMode. It implements the 13 core tags and HTMLText, and keeps NineSlicePlane, SimpleMesh, SimplePlane and SimpleRope as tags for NineSliceSprite, MeshSimple, MeshPlane and MeshRope. Graphics passes geometry to the constructor. It exports the PixiTypeFallback type.

  The default export of @react-pixi-fiber/pixi-7/compat/pixi6, passed as pixi7({ compat }), translates the PixiJS 6 props: the event names become the on handler properties (click to onclick), mousemove, pointermove and touchmove become onglobalmousemove, onglobalpointermove and onglobaltouchmove, buttonMode becomes cursor ("pointer" or null) and interactive becomes eventMode ("static" or "auto", as PixiJS 7's deprecated setter does). Each translated prop warns once in development; when the PixiJS 7 prop is also set, it wins and a warning names both. Without compat, the event names and buttonMode, which PixiJS 7 ignores, warn once per prop name in development.

Patch Changes

• Updated dependencies [446f761]:
  • react-pixi-fiber@3.0.0-alpha.0

@react-pixi-fiber/pixi-6@1.0.0-alpha.0

Major Changes

• #377 b5e5be4 Thanks @michalochman! - Initial release. The PixiJS 6 adapter for PixiJS 6.x. It implements the 13 core tags and keeps NineSlicePlane, SimpleMesh, SimplePlane and SimpleRope as tags for NineSliceSprite, MeshSimple, MeshPlane and MeshRope. Graphics passes geometry to the constructor. It exports the InteractionCompatibility, InteractionEventCompatibility, InteractiveComponent and PixiTypeFallback types.

Patch Changes

• Updated dependencies [446f761]:
  • react-pixi-fiber@3.0.0-alpha.0