v4.0.0

• Rename Spline Event listeners to onSplineXXX to avoid conflicts with native mouse/keyboard events #192

Before

export default function App() {
  function onMouseDown(e) {
    if (e.target.name === 'Cube') {
      console.log('I have been clicked!');
    }
  }

  return (
    <Spline
      scene="https://prod.spline.design/6Wq1Q7YGyM-iab9i/scene.splinecode"
      onMouseDown={onMouseDown}
    />
  );
}

After

export default function App() {
  function onSplineMouseDown(e) {
    if (e.target.name === 'Cube') {
      console.log('I have been clicked!');
    }
  }

  return (
    <Spline
      scene="https://prod.spline.design/6Wq1Q7YGyM-iab9i/scene.splinecode"
      onSplineMouseDown={onSplineMouseDown}
    />
  );
}

• Allow usage of ErrorBoundary with Spline internal errors #193

Code example

import { ErrorBoundary } from "react-error-boundary";

<ErrorBoundary fallback={<div>Something went wrong</div>}>
  <Spline scene="https://prod.spline.design/6Wq1Q7YGyM-iab9i/scene.splinecode" />
</ErrorBoundary>

v3.1.1

• Set minumum Next.js version
• Fix typescript error with old configurations

v3.1.0

Next.js SSR support

Add @splinetool/react-spline/next entry points which allows you to take advantage of Next.js 14+ app router server-side rendering logic and render a blurred placeholder of the scene, automatically generated from the Spline editor.

import Spline from '@splinetool/react-spline/next';

export default function App() {
  return (
    <div>
      <Spline scene="https://prod.spline.design/KFonZGtsoUXP-qx7/scene.splinecode" />
    </div>
  );
}

v3.0.0

• Fix error in Next.js 14 and properly allow usage in React Server Components.
• Support Next.js 15
• Support React 19

v2.2.2

• Fix types with newer versions of Typescript #78

v2.2.1

• 🖼 Fix canvas bottom margin

v2.2.0

• 🖼 Support the new Responsive frame behaviour #38

v2.1.0

• ⚛️ Support React 18 #29