diff --git a/docs/api-guide/gpu/gpu-buffers.md b/docs/api-guide/gpu/gpu-buffers.md
index 14f9e92661..328cca995a 100644
--- a/docs/api-guide/gpu/gpu-buffers.md
+++ b/docs/api-guide/gpu/gpu-buffers.md
@@ -6,7 +6,7 @@
The ability to copy memory between CPU, buffers and textures
| Dimension | WebGPU | WebGL2 | Description |
-| --------------------- | ------ | ------ | ----------------------------------------------------- | |
+| --------------------- | ------- | ------- | ----------------------------------------------------- |
| `writeBuffer` | ✅ | ✅ | Read a buffer synchronously |
| `readBuffer (sync)` | ❌ | ✅ | Read a buffer synchronously |
| `readBuffer (async)` | ✅ | ❌ \* | Read a buffer asynchronously |
diff --git a/docs/tutorials/hello-instancing.mdx b/docs/tutorials/hello-instancing.mdx
index 8ba80a95aa..9302bd2726 100644
--- a/docs/tutorials/hello-instancing.mdx
+++ b/docs/tutorials/hello-instancing.mdx
@@ -9,7 +9,7 @@ In this tutorial, we'll work through how to do instanced drawing with luma.gl's
The tutorial pages have not yet been updated for luma.gl v9.
:::
-
+
diff --git a/docs/tutorials/hello-triangle.mdx b/docs/tutorials/hello-triangle.mdx
index 9cc42e236b..322cb76233 100644
--- a/docs/tutorials/hello-triangle.mdx
+++ b/docs/tutorials/hello-triangle.mdx
@@ -9,7 +9,7 @@ This tutorial will demonstrate how to draw a triangle using luma.gl's high-level
The tutorial pages have not yet been updated for luma.gl v9.
:::
-
+
It is assumed you've set up your development environment as described in
diff --git a/docs/tutorials/lighting.mdx b/docs/tutorials/lighting.mdx
index 85c09829be..ee2489fc7a 100644
--- a/docs/tutorials/lighting.mdx
+++ b/docs/tutorials/lighting.mdx
@@ -9,7 +9,7 @@ This tutorial adds some lighting to enhance the feeling of 3D in the scene.
The tutorial pages have not yet been updated for luma.gl v9.
:::
-
+
To add lighting, we'll use one of built-in luma.gl shader modules for the first time.
diff --git a/docs/tutorials/shader-hooks.mdx b/docs/tutorials/shader-hooks.mdx
index 7128f0b6f0..4646c35282 100644
--- a/docs/tutorials/shader-hooks.mdx
+++ b/docs/tutorials/shader-hooks.mdx
@@ -10,7 +10,7 @@ The tutorial pages have not yet been updated for luma.gl v9.
In this tutorial, we'll focus on a key feature of the shader module system:
the ability to modify the behavior of the shaders that use the shader modules via **shader hooks**.
-
+
In the [previous tutorial](/docs/tutorials/shader-modules), we used shader modules
diff --git a/docs/tutorials/shader-modules.mdx b/docs/tutorials/shader-modules.mdx
index 79631d42d7..2651f76633 100644
--- a/docs/tutorials/shader-modules.mdx
+++ b/docs/tutorials/shader-modules.mdx
@@ -10,7 +10,7 @@ reusable bits of functionality and dynamically insert them into your shaders.
The tutorial pages have not yet been updated for luma.gl v9.
:::
-
+
diff --git a/website/content/examples/api/animation.mdx b/website/content/examples/api/animation.mdx
index cc2050ebea..a5a5529ef9 100644
--- a/website/content/examples/api/animation.mdx
+++ b/website/content/examples/api/animation.mdx
@@ -3,5 +3,5 @@ import {AnimationExample} from '@site';
# Animation
-
+
diff --git a/website/content/examples/showcase/persistence.mdx b/website/content/examples/showcase/persistence.mdx
index 191b602b08..b57319b98d 100644
--- a/website/content/examples/showcase/persistence.mdx
+++ b/website/content/examples/showcase/persistence.mdx
@@ -3,5 +3,5 @@ import {PersistenceExample} from '@site';
# Persistence
-
+
diff --git a/website/content/examples/tutorials/hello-gltf.mdx b/website/content/examples/tutorials/hello-gltf.mdx
index e425e62d89..7cd50c1397 100644
--- a/website/content/examples/tutorials/hello-gltf.mdx
+++ b/website/content/examples/tutorials/hello-gltf.mdx
@@ -3,5 +3,5 @@ import {HelloGLTFExample} from '@site';
# Hello glTF
-
+
diff --git a/website/content/examples/tutorials/hello-instancing.mdx b/website/content/examples/tutorials/hello-instancing.mdx
index 2c08288a8a..46ae783571 100644
--- a/website/content/examples/tutorials/hello-instancing.mdx
+++ b/website/content/examples/tutorials/hello-instancing.mdx
@@ -3,5 +3,5 @@ import {HelloInstancingExample} from '@site';
# Hello Instancing
-
+
diff --git a/website/content/examples/tutorials/lighting.mdx b/website/content/examples/tutorials/lighting.mdx
index 357b4b3311..1046fe4ed9 100644
--- a/website/content/examples/tutorials/lighting.mdx
+++ b/website/content/examples/tutorials/lighting.mdx
@@ -3,5 +3,5 @@ import {LightingExample} from '@site';
# Hello Lighting
-
+
diff --git a/website/content/examples/tutorials/shader-hooks.mdx b/website/content/examples/tutorials/shader-hooks.mdx
index 75e12e759a..775328e958 100644
--- a/website/content/examples/tutorials/shader-hooks.mdx
+++ b/website/content/examples/tutorials/shader-hooks.mdx
@@ -3,5 +3,5 @@ import {ShaderHooksExample} from '@site';
# Shader Hooks
-
+
diff --git a/website/content/examples/tutorials/shader-modules.mdx b/website/content/examples/tutorials/shader-modules.mdx
index 420d91058e..0f62e5fc7b 100644
--- a/website/content/examples/tutorials/shader-modules.mdx
+++ b/website/content/examples/tutorials/shader-modules.mdx
@@ -3,5 +3,5 @@ import {ShaderModulesExample} from '@site';
# Shader Modules
-
+
diff --git a/website/src/react-luma/components/device-tabs.tsx b/website/src/react-luma/components/device-tabs.tsx
index d4a4d3f2f8..25c53d6591 100644
--- a/website/src/react-luma/components/device-tabs.tsx
+++ b/website/src/react-luma/components/device-tabs.tsx
@@ -4,23 +4,39 @@ import BrowserOnly from '@docusaurus/BrowserOnly';
import {Tabs, Tab} from './tabs';
import {useStore} from '../store/device-store';
-export const DeviceTabsPriv = props => {
+interface DeviceTabsProps {
+ devices?: ('webgl2' | 'webgpu')[];
+}
+
+const DEFAULT_DEVICE_TABS_PROPS: Required = {
+ devices: ['webgl2', 'webgpu']
+};
+
+export const DeviceTabsPriv = (props?: DeviceTabsProps) => {
+ props = {...DEFAULT_DEVICE_TABS_PROPS, ...props};
const deviceType = useStore(state => state.deviceType);
const deviceError = useStore(state => state.deviceError);
const setDeviceType = useStore(state => state.setDeviceType);
return (
-
- {/*
*/}
- {deviceError}
-
-
- {/*
*/}
- {deviceError}
-
+ {props.devices.includes('webgl2') && (
+
+ {/*
*/}
+ {deviceError}
+
+ )}
+
+ {props.devices.includes('webgpu') && (
+
+ {/*
*/}
+ {deviceError}
+
+ )}
);
};
-export const DeviceTabs = () => {() => };
+export const DeviceTabs = (props?: DeviceTabsProps) => (
+ {() => }
+);