From beadf9df33b287942db05de2fee8364e98e7c327 Mon Sep 17 00:00:00 2001
From: Iwo Plaza <iwoplaza@gmail.com>
Date: Fri, 16 Jan 2026 13:08:54 +0100
Subject: [PATCH 1/6] fix: More tree-shakeable and convenient exports

---
 packages/typegpu/src/index.ts        | 76 +---------------------------
 packages/typegpu/src/tgpu.ts         | 12 +++++
 packages/typegpu/src/tgpuUnstable.ts | 44 ++++++++++++++++
 3 files changed, 57 insertions(+), 75 deletions(-)
 create mode 100644 packages/typegpu/src/tgpu.ts
 create mode 100644 packages/typegpu/src/tgpuUnstable.ts

diff --git a/packages/typegpu/src/index.ts b/packages/typegpu/src/index.ts
index 731942d946..78d5512a4e 100644
--- a/packages/typegpu/src/index.ts
+++ b/packages/typegpu/src/index.ts
@@ -2,81 +2,7 @@
  * @module typegpu
  */
 
-import { constant } from './core/constant/tgpuConstant.ts';
-import { declare } from './core/declare/tgpuDeclare.ts';
-import { computeFn } from './core/function/tgpuComputeFn.ts';
-import { fn } from './core/function/tgpuFn.ts';
-import { rawCodeSnippet } from './core/rawCodeSnippet/tgpuRawCodeSnippet.ts';
-import { fragmentFn } from './core/function/tgpuFragmentFn.ts';
-import { vertexFn } from './core/function/tgpuVertexFn.ts';
-import { comptime } from './core/function/comptime.ts';
-import { resolve, resolveWithContext } from './core/resolve/tgpuResolve.ts';
-import { simulate } from './core/simulate/tgpuSimulate.ts';
-import { init, initFromDevice } from './core/root/init.ts';
-
-import { accessor, mutableAccessor } from './core/slot/accessor.ts';
-import { derived } from './core/slot/derived.ts';
-import { slot } from './core/slot/slot.ts';
-import { privateVar, workgroupVar } from './core/variable/tgpuVariable.ts';
-import { vertexLayout } from './core/vertexLayout/vertexLayout.ts';
-import { bindGroupLayout } from './tgpuBindGroupLayout.ts';
-import { namespace } from './core/resolve/namespace.ts';
-
-export const tgpu = {
-  fn,
-  bindGroupLayout,
-  vertexLayout,
-  slot,
-
-  init,
-  initFromDevice,
-
-  resolve,
-  resolveWithContext,
-
-  privateVar,
-  workgroupVar,
-  const: constant,
-
-  '~unstable': {
-    /**
-     * @deprecated This feature is now stable, use tgpu.fn.
-     */
-    fn,
-    fragmentFn,
-    vertexFn,
-    computeFn,
-    comptime,
-    /**
-     * @deprecated This feature is now stable, use tgpu.vertexLayout.
-     */
-    vertexLayout,
-    namespace,
-    derived,
-    /**
-     * @deprecated This feature is now stable, use tgpu.slot.
-     */
-    slot,
-    accessor,
-    mutableAccessor,
-    /**
-     * @deprecated This feature is now stable, use tgpu.privateVar.
-     */
-    privateVar,
-    /**
-     * @deprecated This feature is now stable, use tgpu.workgroupVar.
-     */
-    workgroupVar,
-    /**
-     * @deprecated This feature is now stable, use tgpu.const.
-     */
-    const: constant,
-    declare,
-    rawCodeSnippet,
-
-    simulate,
-  },
-};
+import * as tgpu from './tgpu.ts';
 export default tgpu;
 
 export {
diff --git a/packages/typegpu/src/tgpu.ts b/packages/typegpu/src/tgpu.ts
new file mode 100644
index 0000000000..d505c1963d
--- /dev/null
+++ b/packages/typegpu/src/tgpu.ts
@@ -0,0 +1,12 @@
+// NOTE: This is a barrel file, internal files should not import things from this file
+
+export { constant as const } from './core/constant/tgpuConstant.ts';
+export { fn } from './core/function/tgpuFn.ts';
+export { resolve, resolveWithContext } from './core/resolve/tgpuResolve.ts';
+export { init, initFromDevice } from './core/root/init.ts';
+export { slot } from './core/slot/slot.ts';
+export { privateVar, workgroupVar } from './core/variable/tgpuVariable.ts';
+export { vertexLayout } from './core/vertexLayout/vertexLayout.ts';
+export { bindGroupLayout } from './tgpuBindGroupLayout.ts';
+
+export * as '~unstable' from './tgpuUnstable.ts';
diff --git a/packages/typegpu/src/tgpuUnstable.ts b/packages/typegpu/src/tgpuUnstable.ts
new file mode 100644
index 0000000000..63530dda5f
--- /dev/null
+++ b/packages/typegpu/src/tgpuUnstable.ts
@@ -0,0 +1,44 @@
+export {
+  /**
+   * @deprecated This feature is now stable, use tgpu.const.
+   */
+  constant as const,
+} from './core/constant/tgpuConstant.ts';
+export { declare } from './core/declare/tgpuDeclare.ts';
+export { comptime } from './core/function/comptime.ts';
+export { computeFn } from './core/function/tgpuComputeFn.ts';
+export {
+  /**
+   * @deprecated This feature is now stable, use tgpu.fn.
+   */
+  fn,
+} from './core/function/tgpuFn.ts';
+export { fragmentFn } from './core/function/tgpuFragmentFn.ts';
+export { vertexFn } from './core/function/tgpuVertexFn.ts';
+export { rawCodeSnippet } from './core/rawCodeSnippet/tgpuRawCodeSnippet.ts';
+export { namespace } from './core/resolve/namespace.ts';
+export { simulate } from './core/simulate/tgpuSimulate.ts';
+export { accessor, mutableAccessor } from './core/slot/accessor.ts';
+export { derived } from './core/slot/derived.ts';
+export {
+  /**
+   * @deprecated This feature is now stable, use tgpu.slot.
+   */
+  slot,
+} from './core/slot/slot.ts';
+export {
+  /**
+   * @deprecated This feature is now stable, use tgpu.privateVar.
+   */
+  privateVar,
+  /**
+   * @deprecated This feature is now stable, use tgpu.workgroupVar.
+   */
+  workgroupVar,
+} from './core/variable/tgpuVariable.ts';
+export {
+  /**
+   * @deprecated This feature is now stable, use tgpu.vertexLayout.
+   */
+  vertexLayout,
+} from './core/vertexLayout/vertexLayout.ts';

From b8adde82690db8ae9564c65089c0ff3644a3b712 Mon Sep 17 00:00:00 2001
From: Iwo Plaza <iwoplaza@gmail.com>
Date: Fri, 16 Jan 2026 13:12:14 +0100
Subject: [PATCH 2/6] Update index.ts

---
 packages/typegpu/src/index.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/typegpu/src/index.ts b/packages/typegpu/src/index.ts
index 78d5512a4e..efa661baba 100644
--- a/packages/typegpu/src/index.ts
+++ b/packages/typegpu/src/index.ts
@@ -3,6 +3,7 @@
  */
 
 import * as tgpu from './tgpu.ts';
+export * as tgpu from './tgpu.ts';
 export default tgpu;
 
 export {

From 884b85d2550c22b9fc76ab9be31d84bea0f67717 Mon Sep 17 00:00:00 2001
From: Iwo Plaza <iwoplaza@gmail.com>
Date: Fri, 16 Jan 2026 13:19:34 +0100
Subject: [PATCH 3/6] Exporting other entry points from `typegpu`

---
 packages/typegpu/src/index.ts | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/typegpu/src/index.ts b/packages/typegpu/src/index.ts
index efa661baba..2f41d0fb92 100644
--- a/packages/typegpu/src/index.ts
+++ b/packages/typegpu/src/index.ts
@@ -6,6 +6,10 @@ import * as tgpu from './tgpu.ts';
 export * as tgpu from './tgpu.ts';
 export default tgpu;
 
+export * as d from './data/index.ts';
+export * as std from './std/index.ts';
+export * as common from './common/index.ts';
+
 export {
   MissingBindGroupsError,
   MissingLinksError,

From a7c0fbf522f711f3c434896c39531c1a7ff198cc Mon Sep 17 00:00:00 2001
From: Iwo Plaza <iwoplaza@gmail.com>
Date: Fri, 16 Jan 2026 16:04:09 +0100
Subject: [PATCH 4/6] Use simpler imports

---
 apps/bun-example/index.ts                     |  10 +-
 .../components/translator/lib/constants.ts    |  19 ++--
 .../content/docs/ecosystem/typegpu-noise.mdx  |  19 ++--
 .../content/docs/ecosystem/typegpu-sdf.mdx    |   3 +-
 .../docs/ecosystem/typegpu-three/index.mdx    |  10 +-
 .../content/docs/fundamentals/bind-groups.mdx |   3 +-
 .../src/content/docs/fundamentals/buffers.mdx |  45 +++-----
 .../docs/fundamentals/data-schemas.mdx        |  60 +++++-----
 .../docs/fundamentals/functions/index.mdx     |  50 +++------
 .../content/docs/fundamentals/pipelines.mdx   |  18 +--
 .../src/content/docs/fundamentals/resolve.mdx |  18 +--
 .../src/content/docs/fundamentals/slots.mdx   |  21 ++--
 .../content/docs/fundamentals/textures.mdx    |  19 +---
 .../src/content/docs/fundamentals/utils.mdx   |  22 ++--
 .../content/docs/fundamentals/variables.mdx   |   9 +-
 .../docs/fundamentals/vertex-layouts.mdx      |   3 +-
 .../docs/integration/react-native/index.mdx   |   3 +-
 .../integration/webgpu-interoperability.mdx   |   3 +-
 .../integration/wesl-interoperability.mdx     |   3 +-
 .../integration/working-with-wgpu-matrix.mdx  |   4 +-
 .../docs/reference/shader-generation.mdx      |   2 +-
 .../content/docs/tooling/unplugin-typegpu.mdx |   3 +-
 .../tutorials/triangle-to-boids/index.mdx     |   3 +-
 .../algorithms/jump-flood-distance/index.ts   |   7 +-
 .../algorithms/jump-flood-distance/types.ts   |   2 +-
 .../jump-flood-distance/visualization.ts      |   4 +-
 .../algorithms/jump-flood-voronoi/index.ts    |  12 +-
 .../algorithms/matrix-multiplication/index.ts |   3 +-
 .../algorithms/matrix-next/computeShared.ts   |   4 +-
 .../algorithms/matrix-next/computeSimple.ts   |   5 +-
 .../examples/algorithms/matrix-next/types.ts  |   3 +-
 .../algorithms/mnist-inference/data.ts        |   3 +-
 .../algorithms/mnist-inference/helpers.ts     |   3 +-
 .../algorithms/mnist-inference/index.ts       |   4 +-
 .../algorithms/probability/executor.ts        |   5 +-
 .../algorithms/probability/helpers.ts         |   5 +-
 .../src/examples/common/setup-orbit-camera.ts |   3 +-
 .../src/examples/geometry/circles/index.ts    |   5 +-
 .../image-processing/ascii-filter/index.ts    |   7 +-
 .../background-segmentation/index.ts          |  18 +--
 .../background-segmentation/schemas.ts        |   3 +-
 .../background-segmentation/shaders.ts        |   6 +-
 .../examples/image-processing/blur/index.ts   |   7 +-
 .../camera-thresholding/index.ts              |   7 +-
 .../image-processing/chroma-keying/index.ts   |   3 +-
 .../image-processing/image-tuning/index.ts    |   3 +-
 .../src/examples/rendering/3d-fish/compute.ts |   3 +-
 .../src/examples/rendering/3d-fish/index.ts   |   4 +-
 .../examples/rendering/3d-fish/load-model.ts  |   3 +-
 .../src/examples/rendering/3d-fish/params.ts  |   3 +-
 .../src/examples/rendering/3d-fish/render.ts  |   4 +-
 .../src/examples/rendering/3d-fish/schemas.ts |   3 +-
 .../rendering/3d-fish/tgsl-helpers.ts         |   2 +-
 .../rendering/box-raytracing/index.ts         |   3 +-
 .../src/examples/rendering/caustics/index.ts  |   4 +-
 .../src/examples/rendering/clouds/consts.ts   |   2 +-
 .../src/examples/rendering/clouds/index.ts    |   7 +-
 .../src/examples/rendering/clouds/types.ts    |   3 +-
 .../src/examples/rendering/clouds/utils.ts    |   4 +-
 .../rendering/cubemap-reflection/cubemap.ts   |   3 +-
 .../rendering/cubemap-reflection/dataTypes.ts |   2 +-
 .../rendering/cubemap-reflection/helpers.ts   |   3 +-
 .../rendering/cubemap-reflection/icosphere.ts |  15 ++-
 .../rendering/cubemap-reflection/index.ts     |   4 +-
 .../src/examples/rendering/disco/consts.ts    |   3 +-
 .../src/examples/rendering/disco/index.ts     |   3 +-
 .../rendering/disco/shaders/fragment.ts       |   6 +-
 .../rendering/disco/shaders/vertex.ts         |   3 +-
 .../src/examples/rendering/disco/utils.ts     |   3 +-
 .../rendering/function-visualizer/index.ts    |   4 +-
 .../examples/rendering/jelly-slider/camera.ts |   2 +-
 .../rendering/jelly-slider/constants.ts       |   2 +-
 .../rendering/jelly-slider/dataTypes.ts       |   3 +-
 .../examples/rendering/jelly-slider/index.ts  |   9 +-
 .../examples/rendering/jelly-slider/slider.ts |   3 +-
 .../examples/rendering/jelly-slider/taa.ts    |   4 +-
 .../examples/rendering/jelly-slider/utils.ts  |   4 +-
 .../examples/rendering/jelly-switch/camera.ts |   3 +-
 .../rendering/jelly-switch/constants.ts       |   2 +-
 .../rendering/jelly-switch/dataTypes.ts       |   3 +-
 .../examples/rendering/jelly-switch/index.ts  |   9 +-
 .../examples/rendering/jelly-switch/taa.ts    |   4 +-
 .../examples/rendering/jelly-switch/utils.ts  |   4 +-
 .../examples/rendering/perlin-noise/index.ts  |   8 +-
 .../rendering/phong-reflection/index.ts       |   4 +-
 .../rendering/phong-reflection/load-model.ts  |   3 +-
 .../rendering/phong-reflection/params.ts      |   2 +-
 .../rendering/phong-reflection/schemas.ts     |   3 +-
 .../point-light-shadow/box-geometry.ts        |   2 +-
 .../rendering/point-light-shadow/camera.ts    |   3 +-
 .../rendering/point-light-shadow/index.ts     |   7 +-
 .../point-light-shadow/point-light.ts         |   2 +-
 .../rendering/point-light-shadow/scene.ts     |   2 +-
 .../rendering/point-light-shadow/types.ts     |   3 +-
 .../examples/rendering/ray-marching/index.ts  |   4 +-
 .../rendering/simple-shadow/geometry.ts       |   2 +-
 .../examples/rendering/simple-shadow/index.ts |   4 +-
 .../rendering/simple-shadow/schema.ts         |   3 +-
 .../src/examples/rendering/two-boxes/index.ts |  15 ++-
 .../rendering/xor-dev-centrifuge-2/index.ts   |   3 +-
 .../rendering/xor-dev-runner/index.ts         |   3 +-
 .../examples/simple/gradient-tiles/index.ts   |   3 +-
 .../src/examples/simple/increment/index.ts    |   3 +-
 .../src/examples/simple/liquid-glass/index.ts |   7 +-
 .../src/examples/simple/oklab/index.ts        | 104 ++++++++----------
 .../src/examples/simple/square/index.ts       |   3 +-
 .../src/examples/simple/stencil/index.ts      |   3 +-
 .../src/examples/simple/triangle/index.ts     |   3 +-
 .../examples/simple/vaporrave/constants.ts    |   2 +-
 .../src/examples/simple/vaporrave/floor.ts    |   4 +-
 .../src/examples/simple/vaporrave/helpers.ts  |   3 +-
 .../src/examples/simple/vaporrave/index.ts    |  12 +-
 .../src/examples/simple/vaporrave/sphere.ts   |   6 +-
 .../src/examples/simple/vaporrave/types.ts    |   2 +-
 .../examples/simulation/boids-next/index.ts   |   4 +-
 .../src/examples/simulation/boids/index.ts    |   3 +-
 .../src/examples/simulation/confetti/index.ts |   8 +-
 .../fluid-double-buffering/index.ts           |   9 +-
 .../simulation/fluid-with-atomics/index.ts    |   4 +-
 .../examples/simulation/game-of-life/index.ts |   3 +-
 .../examples/simulation/gravity/compute.ts    |   4 +-
 .../examples/simulation/gravity/helpers.ts    |   3 +-
 .../src/examples/simulation/gravity/index.ts  |   2 +-
 .../examples/simulation/gravity/presets.ts    |   3 +-
 .../src/examples/simulation/gravity/render.ts |   4 +-
 .../examples/simulation/gravity/schemas.ts    |   3 +-
 .../simulation/slime-mold-3d/index.ts         |   7 +-
 .../examples/simulation/slime-mold/index.ts   |   4 +-
 .../examples/simulation/stable-fluid/index.ts |   2 +-
 .../simulation/stable-fluid/params.ts         |   2 +-
 .../simulation/stable-fluid/render.ts         |   4 +-
 .../simulation/stable-fluid/simulation.ts     |   4 +-
 .../src/examples/tests/dispatch/index.ts      |   4 +-
 .../src/examples/tests/log-test/index.ts      |   4 +-
 .../src/examples/tests/texture-test/index.ts  |   6 +-
 .../array-and-struct-constructors.ts          |   4 +-
 .../examples/tests/tgsl-parsing-test/index.ts |   3 +-
 .../tgsl-parsing-test/infix-operators.ts      |   4 +-
 .../tgsl-parsing-test/logical-expressions.ts  |   4 +-
 .../tests/tgsl-parsing-test/matrix-ops.ts     |   4 +-
 .../tests/tgsl-parsing-test/pointers.ts       |   4 +-
 .../examples/tests/wgsl-resolution/index.ts   |   4 +-
 .../src/examples/threejs/attractors/index.ts  |   3 +-
 .../examples/threejs/compute-cloth/index.ts   |   4 +-
 .../threejs/compute-cloth/triNoise.ts         |   4 +-
 .../examples/threejs/compute-cloth/verlet.ts  |   3 +-
 .../threejs/compute-geometry/index.ts         |   3 +-
 .../compute-particles-snow/entities.ts        |   3 +-
 .../threejs/compute-particles-snow/index.ts   |   3 +-
 .../threejs/compute-particles/index.ts        |   3 +-
 .../src/examples/threejs/simple/index.ts      |   5 +-
 .../threejs/test-mismatched-types/index.ts    |   2 +-
 .../test-reused-functions/functions.ts        |   4 +-
 packages/typegpu/tests/accessor.test.ts       |   4 +-
 packages/typegpu/tests/align.test.ts          |   8 +-
 packages/typegpu/tests/array.test.ts          |   3 +-
 packages/typegpu/tests/attributes.test.ts     |   3 +-
 .../typegpu/tests/bindGroupLayout.test.ts     |   5 +-
 packages/typegpu/tests/bufferUsage.test.ts    |   4 +-
 .../typegpu/tests/computePipeline.test.ts     |   5 +-
 packages/typegpu/tests/constant.test.ts       |   3 +-
 packages/typegpu/tests/data/ptr.test.ts       |   3 +-
 packages/typegpu/tests/declare.test.ts        |   3 +-
 .../tests/examples/individual/oklab.test.ts   |  32 +++---
 164 files changed, 389 insertions(+), 681 deletions(-)

diff --git a/apps/bun-example/index.ts b/apps/bun-example/index.ts
index 975822f7f7..9b46b38ce7 100644
--- a/apps/bun-example/index.ts
+++ b/apps/bun-example/index.ts
@@ -1,14 +1,14 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 import { randf } from '@typegpu/noise';
 
 const Boid = d.struct({
   pos: d.vec3f,
 });
 
-const createRandomBoid = tgpu.fn([], Boid)(() => {
-  return { pos: randf.inUnitCube() };
-});
+const createRandomBoid = () => {
+  'use gpu';
+  return Boid({ pos: randf.inUnitCube() });
+};
 
 const shaderCode = tgpu.resolve([createRandomBoid]);
 
diff --git a/apps/typegpu-docs/src/components/translator/lib/constants.ts b/apps/typegpu-docs/src/components/translator/lib/constants.ts
index de5e2b5da2..48f93f3c69 100644
--- a/apps/typegpu-docs/src/components/translator/lib/constants.ts
+++ b/apps/typegpu-docs/src/components/translator/lib/constants.ts
@@ -21,8 +21,7 @@ fn fs_main() -> @location(0) vec4<f32> {
   return vec4<f32>(1.0, 0.0, 0.0, 1.0);
 }`;
 
-export const DEFAULT_TGSL = `import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+export const DEFAULT_TGSL = `import tgpu, { d } from 'typegpu';
 
 const Particle = d.struct({
   position: d.vec3f,
@@ -51,13 +50,11 @@ export const updateParicle = tgpu.fn([Particle, d.vec3f, d.f32], Particle)(
   },
 );
 
-export const main = tgpu.fn([])(() => {
-  for (let i = 0; i < layout.$.systemData.particles.length; i++) {
-    const particle = layout.$.systemData.particles[i];
-    layout.$.systemData.particles[i] = updateParicle(
-      particle,
-      layout.$.systemData.gravity,
-      layout.$.systemData.deltaTime,
-    );
+export function main() {
+  'use gpu';
+  const data = layout.$.systemData;
+  for (let i = 0; i < data.particles.length; i++) {
+    const particle = data.particles[i];
+    data.particles[i] = updateParicle(particle, data.gravity, data.deltaTime);
   }
-});`;
+}`;
diff --git a/apps/typegpu-docs/src/content/docs/ecosystem/typegpu-noise.mdx b/apps/typegpu-docs/src/content/docs/ecosystem/typegpu-noise.mdx
index eb8b3705a1..749857b83b 100644
--- a/apps/typegpu-docs/src/content/docs/ecosystem/typegpu-noise.mdx
+++ b/apps/typegpu-docs/src/content/docs/ecosystem/typegpu-noise.mdx
@@ -24,8 +24,7 @@ Calling utility functions from [TypeGPU functions](/TypeGPU/fundamentals/functio
 In the example below, resolving `randomVec2f` into a shader will include the code for `randf.sample` and all of its dependencies.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 import { randf } from '@typegpu/noise';
 
@@ -47,7 +46,7 @@ The resolution mechanism handles deduplication out of the box, as well as omits
 so only one definition of `sample` will be included in the final shader.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 import { randf } from '@typegpu/noise';
 // `typegpu` is necessary to inject library code into your custom shader
@@ -82,8 +81,7 @@ Each call to `randf.sample` returns the next random float in the sequence, allow
 using a set of `randf.seedN` functions, where `N` is the number of components our seed has.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 import { randf } from '@typegpu/noise';
 
 const main = tgpu['~unstable'].fragmentFn({
@@ -146,8 +144,7 @@ The package exports an implementation for both 2D and 3D Perlin noise, `perlin2d
 Using it is as simple as calling the `.sample` function with the desired coordinates, and it returns a value in the range `[-1, 1]`.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 import { perlin2d } from '@typegpu/noise';
 
@@ -168,8 +165,7 @@ To improve performance, you can precompute the gradients using either a *Static*
 A static cache presumes that the domain of the noise function is fixed, and cannot change between shader invocations.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 import { perlin3d } from '@typegpu/noise';
 
@@ -191,7 +187,7 @@ const pipeline = root['~unstable']
 Or in WebGPU:
 ```ts twoslash
 /// <reference types="@webgpu/types" />
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 
 declare const device: GPUDevice;
 import tgpu from 'typegpu';
@@ -226,8 +222,7 @@ without having to recompile the shader, you have to use a dynamic cache. With it
 complex setup.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 import { perlin3d } from '@typegpu/noise';
 
 const main = tgpu['~unstable'].computeFn({ workgroupSize: [1] })(() => {
diff --git a/apps/typegpu-docs/src/content/docs/ecosystem/typegpu-sdf.mdx b/apps/typegpu-docs/src/content/docs/ecosystem/typegpu-sdf.mdx
index 6b9ebb9f6e..fb7ff4376a 100644
--- a/apps/typegpu-docs/src/content/docs/ecosystem/typegpu-sdf.mdx
+++ b/apps/typegpu-docs/src/content/docs/ecosystem/typegpu-sdf.mdx
@@ -22,8 +22,7 @@ Position, scale and translation of a shape can be adjusted by applying the inver
 Here is an example of a fragment shader that draws a disk of radius 0.25 on the center of a (presumably square) canvas:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 import * as sdf from '@typegpu/sdf';
 
 const mainFragment = tgpu['~unstable'].fragmentFn({
diff --git a/apps/typegpu-docs/src/content/docs/ecosystem/typegpu-three/index.mdx b/apps/typegpu-docs/src/content/docs/ecosystem/typegpu-three/index.mdx
index bb70f6a5f5..94efced101 100644
--- a/apps/typegpu-docs/src/content/docs/ecosystem/typegpu-three/index.mdx
+++ b/apps/typegpu-docs/src/content/docs/ecosystem/typegpu-three/index.mdx
@@ -60,8 +60,7 @@ Calling `t3.toTSL` with a TypeGPU function will return a TSL node, which can the
 <div class="flex-1 w-auto min-w-[0]">
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 import * as THREE from 'three/webgpu';
 import * as t3 from '@typegpu/three';
@@ -113,8 +112,7 @@ There are a handful of builtin TSL node accessors in the `t3` namespace:
 <div class="flex-1 w-auto min-w-[0]">
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 import * as THREE from 'three/webgpu';
 import * as t3 from '@typegpu/three';
@@ -140,9 +138,7 @@ Other TypeGPU functions (user-defined or from libraries) can be called to achiev
 <div class="flex-1 w-auto min-w-[0]">
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 // ---cut---
 import { perlin3d } from '@typegpu/noise';
 import * as THREE from 'three/webgpu';
diff --git a/apps/typegpu-docs/src/content/docs/fundamentals/bind-groups.mdx b/apps/typegpu-docs/src/content/docs/fundamentals/bind-groups.mdx
index bf7626dae0..9039eb274d 100644
--- a/apps/typegpu-docs/src/content/docs/fundamentals/bind-groups.mdx
+++ b/apps/typegpu-docs/src/content/docs/fundamentals/bind-groups.mdx
@@ -12,8 +12,7 @@ A bind group is a collection of resources that are bound to a shader. These reso
 It's a way to define what resources are available to a shader and how they are accessed.
 
 ```ts
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 // Defining the layout of resources we want the shader to
 // have access to.
diff --git a/apps/typegpu-docs/src/content/docs/fundamentals/buffers.mdx b/apps/typegpu-docs/src/content/docs/fundamentals/buffers.mdx
index 9448b46089..0a5d704a88 100644
--- a/apps/typegpu-docs/src/content/docs/fundamentals/buffers.mdx
+++ b/apps/typegpu-docs/src/content/docs/fundamentals/buffers.mdx
@@ -19,8 +19,7 @@ results of parallel computation back to JS. When creating a buffer, a schema for
 As an example, let's create a buffer for storing particles.
 
 ```ts twoslash {22-28}
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 // Defining a struct type
 const Particle = d.struct({
@@ -67,8 +66,7 @@ To create a buffer, you will need to define its schema by composing data types i
 structs and arrays. They will be explored in more detail in [a following chapter](/TypeGPU/fundamentals/data-schemas).
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 const countBuffer = root.createBuffer(d.u32);
@@ -87,8 +85,7 @@ To be able to use these buffers in WGSL shaders, we have to declare their usage
 
 ```ts twoslash
 // @noErrors
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 const buffer = root.createBuffer(d.u32)
@@ -101,8 +98,7 @@ You can also add all flags in a single `$usage()`.
 
 ```ts twoslash
 // @noErrors
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 const buffer = root.createBuffer(d.u32)
@@ -113,8 +109,7 @@ const buffer = root.createBuffer(d.u32)
 :::note
 Along with passing the appropriate flags to WebGPU, the methods will also embed type information into the buffer.
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 
@@ -131,8 +126,7 @@ or indirectly through the `.$usage` method.
 
 ```ts twoslash
 /// <reference types="@webgpu/types" />
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 const buffer = root.createBuffer(d.f32);
 // ---cut---
@@ -153,8 +147,7 @@ You can also pass an initial value to the `root.createBuffer` function.
 When the buffer is created, it will be mapped at creation, and the initial value will be written to the buffer.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu. { d } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 // Will be initialized to `100`
@@ -173,8 +166,7 @@ You can also create a buffer using an existing WebGPU buffer. This is useful whe
 
 ```ts twoslash {7}
 /// <reference types="@webgpu/types" />
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 const device = root.device;
 // ---cut---
@@ -200,8 +192,7 @@ method's arguments.
 
 ```ts twoslash
 // @noErrors
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 const Particle = d.struct({
@@ -240,8 +231,7 @@ The format of the `data` value depends on your schema type:
   - `value`: the new value for that element.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 const Planet = d.struct({
@@ -268,8 +258,7 @@ There's also an option to copy value from another typed buffer using the `.copyF
 as long as both buffers have a matching data schema.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 
 const Particle = d.struct({
@@ -289,8 +278,7 @@ To read data from a buffer on the CPU, you can use the `.read()` method.
 It returns a promise that resolves to the data read from the buffer.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 const buffer = root.createBuffer(d.arrayOf(d.u32, 10));
@@ -321,8 +309,7 @@ TypeGPU also allows for the use of index buffers. An index buffer is a buffer co
 You may refer to the [pipelines](/TypeGPU/fundamentals/pipelines/#drawing-with-drawindexed) section for usage details.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 // ---cut---
@@ -343,8 +330,7 @@ The default option is to create bind group layouts and bind your buffers via bin
 Read more in the chapter dedicated to [bind groups](/TypeGPU/fundamentals/bind-groups).
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 // ---cut---
@@ -382,8 +368,7 @@ Fixed buffers are created using dedicated root methods.
 | `var<storage, read_write>` | `root.createMutable()`  |
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 // ---cut---
diff --git a/apps/typegpu-docs/src/content/docs/fundamentals/data-schemas.mdx b/apps/typegpu-docs/src/content/docs/fundamentals/data-schemas.mdx
index 4810262e2a..43d7ad8abc 100644
--- a/apps/typegpu-docs/src/content/docs/fundamentals/data-schemas.mdx
+++ b/apps/typegpu-docs/src/content/docs/fundamentals/data-schemas.mdx
@@ -26,7 +26,7 @@ Schemas can be called to cast a value to a given type.
 This works both in TGSL, and in plain JavaScript.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 d.u32(31.1); // 31
 d.u32(-1); // 4294967295
@@ -39,7 +39,7 @@ d.bool(0.01); // true
 On JavaScript side, the type of any number remains a number regardless of any casts.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 const myUnsignedInt = d.u32(1);
 //    ^?
@@ -55,7 +55,7 @@ For vector WGSL types `vec2f`, `vec2u`, `vec2i`, `vec2h` and `vec2<bool>`, TypeG
 Just like scalar schemas, vector schemas can be called to create values of corresponding types.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 const v1 = d.vec3f(1, 2, 3); // a vector of three elements [1, 2, 3]
 //    ^?
@@ -68,7 +68,7 @@ const v4 = d.vec4f(0, v3, 3); // a vector of four elements [0, 1, 2, 3]
 Be mindful not to confuse the schema (e.g. `d.vec2f`), a schema instance (`d.vec2f()`), the schema type (`d.Vec2f`), and the instance type (`d.v2f`).
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 const VectorSchema = d.vec2f;
 //    ^?
@@ -83,7 +83,7 @@ For matrix WGSL types `mat2x2f`, `mat3x3f` and `mat4x4f`, TypeGPU provides `d.ma
 Matrices of other sizes, as well as matrices of `f16`, are currently not supported by TypeGPU.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 const mat1 = d.mat2x2f(); // empty matrix
 //    ^?
@@ -109,7 +109,7 @@ For `wgpu-matrix` integration, matrix instances implement array access.
 Matrix array access is not supported in TGSL.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 const mat = d.mat2x2f(1.1, 2.2, 3.3, 4.4);
 const firstElement = mat[0]; // 1.1 in JS, but resolves to invalid WGSL!
@@ -124,8 +124,7 @@ As you may know, it is currently impossible to overload operators in JavaScript.
 For that reason, TypeGPU provides `std` functions imitating those.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 
 const vec1 = d.vec3f(1, 2, 3);
 const vec2 = std.add(vec1, 3); // d.vec3f(4, 5, 6)
@@ -156,7 +155,7 @@ the purpose of these `std` functions is to enable working on vectors and matrice
 For arithmetic operators, you can also use the infix notation.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 const v1 = d.vec2f(1, 2);
 const v2 = d.vec2f(3, 4);
@@ -174,7 +173,7 @@ Infix operators return completely new objects, they don't modify in-place.
 Here is an example of defining a custom compound data type using the `d.struct` function.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 
 const Circle = d.struct({
   centerPos: d.vec3i,
@@ -194,7 +193,7 @@ When reading from or writing data to the GPU, the type of the JavaScript value i
 ```ts twoslash
 // @errors: 2740 2322 2339 2345
 
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 
 const Circle = d.struct({
   centerPos: d.vec3i,
@@ -223,7 +222,7 @@ Struct schemas also allow for default value creation and code autocompletion.
 
 ```ts twoslash
 // @noErrors
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 
 const Boid = d.struct({
   position: d.vec3u,
@@ -247,7 +246,7 @@ const boid = Boid({
 Structs can also be nested.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 //---cut---
 const FishState = d.struct({
   pos: d.vec3f,
@@ -270,8 +269,7 @@ You cannot use nested structs in [vertex layouts](/TypeGPU/fundamentals/vertex-l
 If you wish to extract the JS type equivalent of a TypeGPU schema, you can do so with `d.Infer`:
 
 ```ts twoslash
-import * as d from 'typegpu/data';
-import { sizeOf, alignmentOf } from 'typegpu/data';
+import { d } from 'typegpu';
 
 const Circle = d.struct({
   centerPos: d.vec3i,
@@ -287,7 +285,7 @@ type Circle = d.Infer<typeof Circle>;
 Defined data structures automatically measure and hold information about their memory layout parameters.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 
 const Circle = d.struct({
   centerPos: d.vec3i,
@@ -305,7 +303,7 @@ Struct schemas adjust the padding and alignment automatically, so that they comp
 It is also possible to override default byte alignment and size for particular fields via the `d.align` and `d.size` functions.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 const Boid = d.struct({
   position: d.align(32, d.vec3u), // Aligned to multiples of 32 bytes
@@ -320,7 +318,7 @@ const Boid = d.struct({
 To define arrays of known constant length, use the `d.arrayOf` function with the schema representing the element type and with the length of the array.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 const MyArray = d.arrayOf(d.f32, 4);
 
@@ -333,7 +331,7 @@ const myInitializedArray = MyArray([1, 0, 0.5, 20]);
 You can also call `d.arrayOf` without specifying the array length. This returns a partially applied schema function, allowing you to provide the length later or use the schema to declare WGSL [runtime-sized arrays](/TypeGPU/fundamentals/bind-groups#runtime-sized-example).
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 
 // ---cut---
 const ArrayPartialSchema = d.arrayOf(d.f32);
@@ -350,9 +348,7 @@ Texture schemas serve two main purposes:
  - providing argument types for user defined functions
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 const root = await tgpu.init();
 const texture = root['~unstable'].createTexture({
@@ -400,7 +396,7 @@ Sampled texture schemas are created using one of the following constructors:
 The `sampleType` parameter can be `d.f32`, `d.i32`, or `d.u32`, determining how the texture data will be interpreted. If omitted, it defaults to `d.f32`.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 const tex1 = d.texture2d(d.f32); // float texture (default)
 //    ^?
@@ -423,7 +419,7 @@ For depth comparison operations, TypeGPU provides specialized depth texture sche
 - **`d.textureDepthCubeArray()`** - A cube array depth texture
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 const depthTex = d.textureDepth2d();
 //    ^?
@@ -441,7 +437,7 @@ Storage texture schemas are created using dimension-specific constructors, with
 The `format` parameter specifies the texture format (e.g., `'rgba8unorm'`, `'rgba16float'`, `'r32float'`), and the `access` parameter can be `'write-only'`, `'read-only'`, or `'read-write'`. If `access` is omitted, it defaults to `'write-only'`.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 const storageTex1 = d.textureStorage2d('rgba8unorm');
 //    ^?
@@ -458,7 +454,7 @@ const storageTex3 = d.textureStorage3d('r32float', 'read-write');
 To create a schema corresponding to an atomic data type, wrap `d.i32` or `d.u32` with `d.atomic`.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 const AtomicI32 = d.atomic(d.i32);
 //    ^?
@@ -468,9 +464,7 @@ const AtomicI32 = d.atomic(d.i32);
 The `std` module provides functions for manipulating atomic data in TGSL.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 // ---cut---
 const count = tgpu.workgroupVar(d.atomic(d.u32));
 
@@ -488,7 +482,7 @@ To create a schema corresponding to a pointer data type, wrap the inner schema w
 For address spaces `function`, `private`, `workgroup`, `storage` and `uniform`, use `d.ptrFn`, `d.ptrPrivate`, `d.ptrWorkgroup`, `d.ptrStorage` and `d.ptrUniform` respectively.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 // ---cut---
 const vecPtrFn = d.ptrFn(d.vec3f);
 //    ^?
@@ -510,8 +504,7 @@ One of the biggest differences between JavaScript and WGSL is the existence of v
 Let's take a look at a simple TGSL function and the WGSL code it resolves to.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 // TGSL
 const MyStruct = d.struct({ n: d.u32 });
@@ -542,8 +535,7 @@ On the WGSL side, the assignment operator copies the value of s1, and thus s1 is
 To help with this issue, schema calls can be used as "copy constructors", that copy the value on the JS side, and disappear on the WGSL side:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 // TGSL
 const MyStruct = d.struct({ n: d.u32 });
diff --git a/apps/typegpu-docs/src/content/docs/fundamentals/functions/index.mdx b/apps/typegpu-docs/src/content/docs/fundamentals/functions/index.mdx
index a7c2c4fc24..e1185c98d8 100644
--- a/apps/typegpu-docs/src/content/docs/fundamentals/functions/index.mdx
+++ b/apps/typegpu-docs/src/content/docs/fundamentals/functions/index.mdx
@@ -25,8 +25,7 @@ though we recommend reading through anyway.
 The simplest and most powerful way to define TypeGPU functions is to just place `'use gpu'` at the beginning of the function body.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 const neighborhood = (a: number, r: number) => {
   'use gpu';
@@ -41,8 +40,7 @@ the same on the CPU and GPU.
 There are three main ways to use TypeGPU functions.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 
 const neighborhood = (a: number, r: number) => {
@@ -138,7 +136,7 @@ that the user provided in the function signature, **but that's not the case**.
 While generating WGSL, TypeGPU infers the type of each expression, which means it knows the types of values passed in at each call site.
 
 ```ts twoslash "1.1, 0.5"
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 const neighborhood = (a: number, r: number) => {
   'use gpu';
   return d.vec2f(a - r, a + r);
@@ -159,7 +157,7 @@ If it cannot unify them into a single type, it will throw an error.
 For each set of input types, TypeGPU generates a specialized version of the function.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 const neighborhood = (a: number, r: number) => {
   'use gpu';
   return d.vec2f(a - r, a + r);
@@ -197,9 +195,7 @@ Since TypeScript types not taken into account when generating the shader code, t
 limitation on use of generic types.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 // ---cut---
 const double = <T extends d.v2f | d.v3f | d.v4f>(a: T): T => {
   'use gpu';
@@ -215,8 +211,7 @@ Things from the outer scope can be referenced inside TypeGPU functions, and they
 generated shader code.
 
 ```ts twoslash
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 
 // ---cut---
 const from = d.vec3f(1, 0, 0);
@@ -254,8 +249,7 @@ After seeing this, you might be tempted to use this mechanism for sharing data b
 global variables used across functions, but values referenced by TypeGPU functions *are assumed to be constant*.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 // ---cut---
@@ -314,8 +308,7 @@ TypeGPU provides a set of standard functions under `typegpu/std`, which you can
 behavior on the CPU and GPU, which unlocks many possibilities (shader unit testing, shared business logic, and more...).
 
 ```ts twoslash
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 
 function manhattanDistance(a: d.v3f, b: d.v3f) {
   'use gpu';
@@ -337,8 +330,7 @@ It accepts two arguments:
 - (Optionally) a schema representing the return type.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const neighborhood = (a: number, r: number) => {
   'use gpu';
   return d.vec2f(a - r, a + r);
@@ -353,8 +345,7 @@ const neighborhoodF32 = neighborhoodShell(neighborhood);
 Although you can define the function and shell separately, the most common way to use shells is immediately wrapping functions with them:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 const neighborhood = tgpu.fn([d.f32, d.f32], d.vec2f)((a, r) => {
   'use gpu';
@@ -373,8 +364,7 @@ We assume that you are familiar with the following concepts:
 Instead of passing JavaScript functions to shells, you can pass WGSL code directly:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 const neighborhood = tgpu.fn([d.f32, d.f32], d.vec2f)`(a: f32, r: f32) -> vec2f {
   return vec2f(a - r, a + r);
@@ -384,8 +374,7 @@ const neighborhood = tgpu.fn([d.f32, d.f32], d.vec2f)`(a: f32, r: f32) -> vec2f
 Since type information is already present in the shell, the WGSL header can be simplified to include only the argument names.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 // ---cut---
 const neighborhood = tgpu.fn([d.f32, d.f32], d.vec2f)`(a, r) {
@@ -398,8 +387,7 @@ const neighborhood = tgpu.fn([d.f32, d.f32], d.vec2f)`(a, r) {
 If you're using Visual Studio Code, you can use [this extension](https://marketplace.visualstudio.com/items?itemName=ggsimm.wgsl-literal) that brings syntax highlighting to code fragments marked with `/* wgsl */` comments.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 const neighborhood = tgpu.fn([d.f32, d.f32], d.vec2f)/* wgsl */`(a, r) {
   return vec2f(a - r, a + r);
@@ -413,8 +401,7 @@ Shelled WGSL functions can use external resources passed via the `$uses` method.
 *Externals* can include anything that can be resolved to WGSL by TypeGPU (numbers, vectors, matrices, constants, TypeGPU functions, buffer usages, textures, samplers, slots, accessors etc.).
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 // ---cut---
 const getBlue = tgpu.fn([], d.vec4f)`() {
@@ -508,8 +495,7 @@ Since TypeGPU wraps `IORecord`s into automatically generated structs, you can al
 - `workgroupSize` -- a JS array of 1-3 numbers that corresponds to the `@workgroup_size` attribute.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 
@@ -568,8 +554,7 @@ struct mainCompute_Input {
 - `out` -- `d.vec4f`, or an `IORecord` describing the output of the function.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const getGradientColor = tgpu.fn([d.f32], d.vec4f)``;
 // ---cut---
@@ -650,8 +635,7 @@ Pipelines are an *unstable* feature. The API may be subject to change in the nea
 Typed functions are crucial for simplified [pipeline](/TypeGPU/fundamentals/pipelines) creation offered by TypeGPU. You can define and run pipelines as follows:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const context = undefined as any;
 const presentationFormat = "rgba8unorm";
diff --git a/apps/typegpu-docs/src/content/docs/fundamentals/pipelines.mdx b/apps/typegpu-docs/src/content/docs/fundamentals/pipelines.mdx
index ddd85a6692..3fbf4d90c7 100644
--- a/apps/typegpu-docs/src/content/docs/fundamentals/pipelines.mdx
+++ b/apps/typegpu-docs/src/content/docs/fundamentals/pipelines.mdx
@@ -22,8 +22,7 @@ A pipeline definition starts with the [root](/TypeGPU/fundamentals/roots) object
 
 ```ts twoslash
 /// <reference types="@webgpu/types" />
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 
@@ -65,8 +64,7 @@ If the vertex shader does not use vertex attributes, then the latter argument sh
 The compatibility between vertex input types and vertex attribute formats is validated at the type level.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 
@@ -115,8 +113,7 @@ The difference is that when there are multiple targets, they should be passed in
 This way each target is identified by a name and can be validated against the outputs of the fragment function.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const mainVertex = tgpu['~unstable'].vertexFn({
   in: { vertexIndex: d.builtin.vertexIndex },
@@ -172,8 +169,7 @@ When a custom location is provided by the user (via the `d.location` attribute f
 as long as there is no conflict between vertex and fragment location value.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const vertex = tgpu['~unstable'].vertexFn({
   out: {
@@ -331,8 +327,7 @@ Compute pipelines are executed using the `dispatchWorkgroups` method, which acce
 The `drawIndexed` is analogous to draw, but takes advantage of [index buffer](/TypeGPU/fundamentals/buffers/#index-buffers) to explicitly map vertex data onto primitives. When using an index buffer, you don't need to list every vertex for every primitive explicitly. Instead, you provide a list of unique vertices in a vertex buffer. Then, the index buffer defines how these vertices are connected to form primitives.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 const presentationFormat = "rgba8unorm";
@@ -411,8 +406,7 @@ That way, they can be used with a regular WebGPU API, but unlike the `root['~uns
 resources.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 
diff --git a/apps/typegpu-docs/src/content/docs/fundamentals/resolve.mdx b/apps/typegpu-docs/src/content/docs/fundamentals/resolve.mdx
index cb7247ba1c..367f8aab4b 100644
--- a/apps/typegpu-docs/src/content/docs/fundamentals/resolve.mdx
+++ b/apps/typegpu-docs/src/content/docs/fundamentals/resolve.mdx
@@ -15,8 +15,7 @@ The `tgpu.resolve` API takes in TypeGPU resources (and optionally a WGSL templat
 The first `tgpu.resolve` overload takes in an array of items to resolve, and an optional argument with options. Here's a simple example:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 const Boid = d.struct({
   size: d.f32,
@@ -58,8 +57,7 @@ As you may note, the resolved WGSL code contains exactly the set of definitions
 You can also resolve other resources, like consts, buffers, textures, entry point functions or even entire pipelines. Here's an example with a pipeline:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 const root = await tgpu.init();
 
@@ -120,8 +118,7 @@ Use it when you are already provided with existing WGSL code and want to extend
 Here's an example:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 // ---cut---
@@ -161,8 +158,7 @@ As you may note, in this case `tgpu.resolve` uses the structure of the `external
 Here is another example. Assume, that the bind group index `0` is already taken by some existing code:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 const LightSource = d.struct({
   ambientColor: d.vec3f,
@@ -275,8 +271,7 @@ For these cases, you can use `tgpu.resolveWithContext`, which has the same input
 An example, where the "catchall" bind group is created:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 // ---cut---
@@ -300,8 +295,7 @@ console.log(catchall?.[1]); // the catchall bind group
 An example, where a bind group layout is automatically included via a TGSL function:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 // ---cut---
diff --git a/apps/typegpu-docs/src/content/docs/fundamentals/slots.mdx b/apps/typegpu-docs/src/content/docs/fundamentals/slots.mdx
index 346ea07a3e..07920c90fc 100644
--- a/apps/typegpu-docs/src/content/docs/fundamentals/slots.mdx
+++ b/apps/typegpu-docs/src/content/docs/fundamentals/slots.mdx
@@ -20,8 +20,7 @@ Main use cases for slots include:
 A slot is created using the `tgpu.slot()` function and can optionally take a default value:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 const filterColorSlot = tgpu.slot<d.v3f>(); // Slot for a 3D vector.
 const mySlot = tgpu.slot<number>(42); // Slot with a default value.
@@ -57,15 +56,13 @@ Instead, you can bind it in one of two ways.
 The first way to bind a value to a slot is to call the `with` method on a `TgpuFn` instance:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import { mul } from 'typegpu/std';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 const filterColorSlot = tgpu.slot<d.v3f>();
 
 const filter = tgpu.fn([d.vec3f], d.vec3f)((color) => {
   const filterColor = filterColorSlot.$;
-  return mul(color, filterColor);
+  return color.mul(filterColor);
 });
 
 // Bind the filter function with a red color.
@@ -96,8 +93,7 @@ fn filter_1(color: vec3f) ->  vec3f{
 The other way to fill in a slot is to call the `with` method during the creation of a `TgpuComputePipeline` or `TgpuRenderPipeline`:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 // ---cut---
@@ -137,8 +133,7 @@ They enable internal behavior to be modified without sacrificing type safety or
 
 ```ts twoslash
 // physics.ts
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 import { add, mul } from 'typegpu/std';
 
 const root = await tgpu.init();
@@ -195,8 +190,7 @@ Slots can be used for conditional compilation of segments of shaders.
 When the slot holding a boolean value is filled with `false`, all `if` statements depending on the value of that slot will be pruned by our tree-shaking mechanism.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 import { max } from 'typegpu/std';
 
 const root = await tgpu.init();
@@ -232,8 +226,7 @@ const processObjects = tgpu.fn([])(() => {
 It is possible to use slots even in TypeGPU functions that are implemented in WGSL:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 const colorSlot = tgpu.slot(d.vec3f(1, 0, 0));
 
diff --git a/apps/typegpu-docs/src/content/docs/fundamentals/textures.mdx b/apps/typegpu-docs/src/content/docs/fundamentals/textures.mdx
index efe54c73d4..d6d42b4bd2 100644
--- a/apps/typegpu-docs/src/content/docs/fundamentals/textures.mdx
+++ b/apps/typegpu-docs/src/content/docs/fundamentals/textures.mdx
@@ -17,8 +17,7 @@ TypeGPU textures serve as a wrapper that provides type safety and higher level u
 Let's look at an example of creating and using a typed texture.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 
@@ -240,8 +239,7 @@ The `generateMipmaps()` method requires both `'sampled'` and `'render'` usage fl
 To create a view - which will also serve as fixed texture usage - you can use one of the available [texture schemas](/TypeGPU/fundamentals/data-schemas/#textures). You can pass it to the `.createView` method of the texture.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 const texture = root['~unstable'].createTexture({
@@ -259,8 +257,7 @@ const sampledView = texture.createView(d.texture2d(d.f32));
 If type information is available the view schema will be staticly checked against the texture properties.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 const texture = root['~unstable'].createTexture({
@@ -273,8 +270,7 @@ const sampledView = texture.createView(d.texture2d(d.f32));
 ```
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 const texture = root['~unstable'].createTexture({
@@ -313,8 +309,7 @@ Textures can be used in shaders through bind groups or as fixed resources, simil
 ### Manual binding
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 const texture = root['~unstable'].createTexture({
@@ -345,9 +340,7 @@ const bindGroup = root.createBindGroup(bindGroupLayout, {
 For textures that remain consistent across operations, you can create fixed texture views:
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 const texture = root['~unstable'].createTexture({
diff --git a/apps/typegpu-docs/src/content/docs/fundamentals/utils.mdx b/apps/typegpu-docs/src/content/docs/fundamentals/utils.mdx
index 5c68c0ecb8..2754f63d84 100644
--- a/apps/typegpu-docs/src/content/docs/fundamentals/utils.mdx
+++ b/apps/typegpu-docs/src/content/docs/fundamentals/utils.mdx
@@ -10,8 +10,7 @@ Under the hood, it creates a compute pipeline that calls the provided callback o
 Since the pipeline is reused, there’s no additional overhead for subsequent calls.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 const data = root.createMutable(d.arrayOf(d.u32, 8), [0, 1, 2, 3, 4, 5, 6, 7]);
@@ -40,8 +39,7 @@ Buffer initialization commonly uses random number generators.
 For that, you can use the [`@typegpu/noise`](TypeGPU/ecosystem/typegpu-noise) library.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 import { randf } from '@typegpu/noise';
 
@@ -66,9 +64,7 @@ console.log(await waterLevelMutable.read());
 The result of `createGuardedComputePipeline` can have bind groups bound using the `with` method.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 const layout = tgpu.bindGroupLayout({
@@ -134,8 +130,7 @@ tgpu.resolve([innerPipeline]);
 This can be used to precompute and inject a value into the final shader code.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 // ---cut---
 const color = tgpu['~unstable']
@@ -169,8 +164,7 @@ When working on top of some existing shader code, sometimes you may know for cer
 In such scenario you can use `tgpu['~unstable'].rawCodeSnippet` -- an advanced API that creates a typed shader expression which can be injected into the final shader bundle upon use.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 // ---cut---
 // `EXISTING_GLOBAL` is an identifier that we know will be in the
@@ -213,8 +207,7 @@ Yes, you read that correctly, TypeGPU implements logging to the console on the G
 Just call `console.log` like you would in plain JavaScript, and open the console to see the results.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 // ---cut---
@@ -241,8 +234,7 @@ The buffer is of fixed size, which may limit the total amount of information tha
 If that's an issue, you may specify the size manually when creating the `root` object.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const presentationFormat = undefined as any;
 const canvas = undefined as any;
diff --git a/apps/typegpu-docs/src/content/docs/fundamentals/variables.mdx b/apps/typegpu-docs/src/content/docs/fundamentals/variables.mdx
index 8726b83e0b..9f21530861 100644
--- a/apps/typegpu-docs/src/content/docs/fundamentals/variables.mdx
+++ b/apps/typegpu-docs/src/content/docs/fundamentals/variables.mdx
@@ -11,8 +11,7 @@ For example, in the code snippet below, the external `counter` is automatically
 In this case, the group and index match the automatically generated "catchall" bind group, used for fixed, "bindless" resources.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 // ---cut---
@@ -54,8 +53,7 @@ struct increment_Input {
 For variables of `private` and `workgroup` address spaces, TypeGPU provides `tgpu.privateVar()` and `tgpu.workgroupVar()` constructor functions.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 // ---cut---
@@ -84,8 +82,7 @@ In JS, a `const` is a reference that cannot be reassigned, while in WGSL, it mea
 Therefore, to use the WGSL `const`, TypeGPU provides `tgpu.const()`, an interface analogous to `tgpu.privateVar()` and `tgpu.workgroupVar()`, with the only difference being that the previously optional init value is now required.
 
 ```ts twoslash
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // ---cut---
 const Boid = d.struct({
   pos: d.vec3f,
diff --git a/apps/typegpu-docs/src/content/docs/fundamentals/vertex-layouts.mdx b/apps/typegpu-docs/src/content/docs/fundamentals/vertex-layouts.mdx
index 95aa549ecb..41312b0f35 100644
--- a/apps/typegpu-docs/src/content/docs/fundamentals/vertex-layouts.mdx
+++ b/apps/typegpu-docs/src/content/docs/fundamentals/vertex-layouts.mdx
@@ -18,8 +18,7 @@ Vertex layouts are much like bind group layouts, in that they define the relatio
 To create a vertex layout, use the `tgpu.vertexLayout` function. It takes an array schema constructor, i.e., partially applied `d.arrayOf` or `d.disarrayOf`. To determine what each element of the array corresponds to, you can pass an optional `stepMode` argument, which can be either `vertex` (default) or `instance`.
 
 ```ts
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const ParticleGeometry = d.struct({
   tilt: d.f32,
diff --git a/apps/typegpu-docs/src/content/docs/integration/react-native/index.mdx b/apps/typegpu-docs/src/content/docs/integration/react-native/index.mdx
index 404c649418..8d951e5f37 100644
--- a/apps/typegpu-docs/src/content/docs/integration/react-native/index.mdx
+++ b/apps/typegpu-docs/src/content/docs/integration/react-native/index.mdx
@@ -113,8 +113,7 @@ that you can use in your app:
 ```ts
 import { useEffect } from 'react';
 import { Canvas, useDevice, useGPUContext } from 'react-native-wgpu';
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const mainVertex = tgpu['~unstable'].vertexFn({
   in: { vertexIndex: d.builtin.vertexIndex },
diff --git a/apps/typegpu-docs/src/content/docs/integration/webgpu-interoperability.mdx b/apps/typegpu-docs/src/content/docs/integration/webgpu-interoperability.mdx
index 845a9f207d..3ce2f47388 100644
--- a/apps/typegpu-docs/src/content/docs/integration/webgpu-interoperability.mdx
+++ b/apps/typegpu-docs/src/content/docs/integration/webgpu-interoperability.mdx
@@ -12,8 +12,7 @@ The **non-contagious** nature of TypeGPU means that ejecting out, in case raw We
 Some of the following code snippets assume that TypeGPU is already initialized.
 
 ```ts
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 // ...or pass in an existing WebGPU device
diff --git a/apps/typegpu-docs/src/content/docs/integration/wesl-interoperability.mdx b/apps/typegpu-docs/src/content/docs/integration/wesl-interoperability.mdx
index 59d69ab2cc..f3c905610b 100644
--- a/apps/typegpu-docs/src/content/docs/integration/wesl-interoperability.mdx
+++ b/apps/typegpu-docs/src/content/docs/integration/wesl-interoperability.mdx
@@ -105,8 +105,7 @@ reified references to any struct definition.
 import { Fish } from './shaders/shared.wesl?typegpu';
 // ---cut-start---
 // @filename: ./main.ts
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 const BoidState = d.struct({
   position: d.vec3f,
diff --git a/apps/typegpu-docs/src/content/docs/integration/working-with-wgpu-matrix.mdx b/apps/typegpu-docs/src/content/docs/integration/working-with-wgpu-matrix.mdx
index 7cd1affd83..3c9d43bad2 100644
--- a/apps/typegpu-docs/src/content/docs/integration/working-with-wgpu-matrix.mdx
+++ b/apps/typegpu-docs/src/content/docs/integration/working-with-wgpu-matrix.mdx
@@ -17,7 +17,7 @@ Because elements in TypeGPU vectors and matrices can be accessed with the `[]` o
 For example, you can create a vector and normalize it like this:
 
 ```ts
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 import { vec2 } from 'wgpu-matrix';
 
 const v = d.vec2f(1, 2);
@@ -34,7 +34,7 @@ If we didn't, we would get a `Float32Array` without modifying the original vecto
 If you wanted to initialize a matrix as an identity matrix, you could do it like this:
 
 ```ts
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 import { mat4 } from 'wgpu-matrix';
 
 const m = mat4.identity(d.mat4x4f()); // returns a mat4x4f
diff --git a/apps/typegpu-docs/src/content/docs/reference/shader-generation.mdx b/apps/typegpu-docs/src/content/docs/reference/shader-generation.mdx
index 70ba5b9fb4..94c2ea7d71 100644
--- a/apps/typegpu-docs/src/content/docs/reference/shader-generation.mdx
+++ b/apps/typegpu-docs/src/content/docs/reference/shader-generation.mdx
@@ -16,7 +16,7 @@ We found that we don't always have enough information to do both phases as a bui
 For example, the type of a struct could only be known at runtime, or could be imported from another file, which complicates static analysis:
 
 ```ts twoslash
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 
 declare const getUserSettings: () => Promise<{ halfPrecision: boolean }>;
 // ---cut---
diff --git a/apps/typegpu-docs/src/content/docs/tooling/unplugin-typegpu.mdx b/apps/typegpu-docs/src/content/docs/tooling/unplugin-typegpu.mdx
index f77eb7f0d4..081d524def 100644
--- a/apps/typegpu-docs/src/content/docs/tooling/unplugin-typegpu.mdx
+++ b/apps/typegpu-docs/src/content/docs/tooling/unplugin-typegpu.mdx
@@ -13,8 +13,7 @@ The package includes the following functionalities:
   The parsing of JavaScript happens ahead of time, emitting a highly compact AST format, called [tinyest](https://www.npmjs.com/package/tinyest).
 
   ```ts
-  import tgpu from 'typegpu';
-  import * as d from 'typegpu/data';
+  import tgpu, { d } from 'typegpu';
 
   // Found by the plugin and decorated with 'tinyest' metadata
   const add = (a: number, b: number) => {
diff --git a/apps/typegpu-docs/src/content/docs/tutorials/triangle-to-boids/index.mdx b/apps/typegpu-docs/src/content/docs/tutorials/triangle-to-boids/index.mdx
index 9216a8a312..438be5ba52 100644
--- a/apps/typegpu-docs/src/content/docs/tutorials/triangle-to-boids/index.mdx
+++ b/apps/typegpu-docs/src/content/docs/tutorials/triangle-to-boids/index.mdx
@@ -85,7 +85,7 @@ import { LinkCard } from '@astrojs/starlight/components';
 Now that we have our canvas setup, we can start drawing on it. We will start by creating a simple shader that will draw a triangle.
 
 ```ts
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 
 const VertexOutput = d.ioStruct({
   position: tgpu.builtin.position,
@@ -1500,4 +1500,3 @@ import step9webgpu from 'code/step9-webgpu.ts?raw';
 
 Congratulations! You've successfully implemented the boids flocking algorithm in WebGPU using TypeGPU.
 Along the way, you learned about creating and using a TypeGPU runtime, writing shader code, managing buffers, creating pipelines, and using slots. For more information, refer to the TypeGPU documentation. Thank you for following along and happy coding!
-
diff --git a/apps/typegpu-docs/src/examples/algorithms/jump-flood-distance/index.ts b/apps/typegpu-docs/src/examples/algorithms/jump-flood-distance/index.ts
index 3bf0f3046a..625492621a 100644
--- a/apps/typegpu-docs/src/examples/algorithms/jump-flood-distance/index.ts
+++ b/apps/typegpu-docs/src/examples/algorithms/jump-flood-distance/index.ts
@@ -1,7 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
-import { fullScreenTriangle } from 'typegpu/common';
+import tgpu, { common, d, std } from 'typegpu';
 import { distanceFrag } from './visualization.ts';
 import {
   BrushParams,
@@ -285,7 +282,7 @@ const createDistanceField = root['~unstable'].createGuardedComputePipeline(
 
 const distancePipeline = root['~unstable']
   .with(paramsAccess, paramsUniform)
-  .withVertex(fullScreenTriangle)
+  .withVertex(common.fullScreenTriangle)
   .withFragment(distanceFrag, { format: presentationFormat })
   .createPipeline();
 
diff --git a/apps/typegpu-docs/src/examples/algorithms/jump-flood-distance/types.ts b/apps/typegpu-docs/src/examples/algorithms/jump-flood-distance/types.ts
index 64d2bcc3da..fcce28735b 100644
--- a/apps/typegpu-docs/src/examples/algorithms/jump-flood-distance/types.ts
+++ b/apps/typegpu-docs/src/examples/algorithms/jump-flood-distance/types.ts
@@ -1,9 +1,9 @@
 import tgpu, {
+  d,
   type SampledFlag,
   type StorageFlag,
   type TgpuTexture,
 } from 'typegpu';
-import * as d from 'typegpu/data';
 
 export const VisualizationParams = d.struct({
   showInside: d.u32,
diff --git a/apps/typegpu-docs/src/examples/algorithms/jump-flood-distance/visualization.ts b/apps/typegpu-docs/src/examples/algorithms/jump-flood-distance/visualization.ts
index e5a46486ce..1ec41eb461 100644
--- a/apps/typegpu-docs/src/examples/algorithms/jump-flood-distance/visualization.ts
+++ b/apps/typegpu-docs/src/examples/algorithms/jump-flood-distance/visualization.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import { distSampleLayout, paramsAccess } from './types.ts';
 
 const outsideGradient = tgpu.const(d.arrayOf(d.vec3f, 5), [
diff --git a/apps/typegpu-docs/src/examples/algorithms/jump-flood-voronoi/index.ts b/apps/typegpu-docs/src/examples/algorithms/jump-flood-voronoi/index.ts
index fb5a44dce9..32ee2aa85d 100644
--- a/apps/typegpu-docs/src/examples/algorithms/jump-flood-voronoi/index.ts
+++ b/apps/typegpu-docs/src/examples/algorithms/jump-flood-voronoi/index.ts
@@ -1,12 +1,6 @@
-import tgpu, {
-  type SampledFlag,
-  type StorageFlag,
-  type TgpuTexture,
-} from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
 import { randf } from '@typegpu/noise';
-import { fullScreenTriangle } from 'typegpu/common';
+import tgpu, { common, d, std } from 'typegpu';
+import type { SampledFlag, StorageFlag, TgpuTexture } from 'typegpu';
 
 const root = await tgpu.init();
 
@@ -222,7 +216,7 @@ const voronoiFrag = tgpu['~unstable'].fragmentFn({
 );
 
 const voronoiPipeline = root['~unstable']
-  .withVertex(fullScreenTriangle, {})
+  .withVertex(common.fullScreenTriangle, {})
   .withFragment(voronoiFrag, { format: presentationFormat })
   .createPipeline();
 
diff --git a/apps/typegpu-docs/src/examples/algorithms/matrix-multiplication/index.ts b/apps/typegpu-docs/src/examples/algorithms/matrix-multiplication/index.ts
index 5351f473e8..53f22bb131 100644
--- a/apps/typegpu-docs/src/examples/algorithms/matrix-multiplication/index.ts
+++ b/apps/typegpu-docs/src/examples/algorithms/matrix-multiplication/index.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const WORKGROUP_SIZE = [8, 8] as [number, number];
 const MAX_MATRIX_SIZE = 6;
diff --git a/apps/typegpu-docs/src/examples/algorithms/matrix-next/computeShared.ts b/apps/typegpu-docs/src/examples/algorithms/matrix-next/computeShared.ts
index 6517f89894..51eda17858 100644
--- a/apps/typegpu-docs/src/examples/algorithms/matrix-next/computeShared.ts
+++ b/apps/typegpu-docs/src/examples/algorithms/matrix-next/computeShared.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import { TILE_SIZE, WORKGROUP_SIZE } from './params.ts';
 import { computeLayout } from './types.ts';
 
diff --git a/apps/typegpu-docs/src/examples/algorithms/matrix-next/computeSimple.ts b/apps/typegpu-docs/src/examples/algorithms/matrix-next/computeSimple.ts
index 442fd66e8e..80d05a33df 100644
--- a/apps/typegpu-docs/src/examples/algorithms/matrix-next/computeSimple.ts
+++ b/apps/typegpu-docs/src/examples/algorithms/matrix-next/computeSimple.ts
@@ -1,8 +1,7 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
+import { getIndex } from './computeShared.ts';
 import { WORKGROUP_SIZE } from './params.ts';
 import { computeLayout } from './types.ts';
-import { getIndex } from './computeShared.ts';
 
 export const computeSimple = tgpu['~unstable'].computeFn({
   workgroupSize: WORKGROUP_SIZE,
diff --git a/apps/typegpu-docs/src/examples/algorithms/matrix-next/types.ts b/apps/typegpu-docs/src/examples/algorithms/matrix-next/types.ts
index dd9f781105..e42da30090 100644
--- a/apps/typegpu-docs/src/examples/algorithms/matrix-next/types.ts
+++ b/apps/typegpu-docs/src/examples/algorithms/matrix-next/types.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 export type CalculationStrategy = 'gpu-optimized' | 'gpu-simple' | 'cpu';
 
diff --git a/apps/typegpu-docs/src/examples/algorithms/mnist-inference/data.ts b/apps/typegpu-docs/src/examples/algorithms/mnist-inference/data.ts
index 1e3686868d..7f9ddd7694 100644
--- a/apps/typegpu-docs/src/examples/algorithms/mnist-inference/data.ts
+++ b/apps/typegpu-docs/src/examples/algorithms/mnist-inference/data.ts
@@ -1,5 +1,4 @@
-import tgpu, { type StorageFlag, type TgpuBuffer } from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d, type StorageFlag, type TgpuBuffer } from 'typegpu';
 
 export const ReadonlyFloats = {
   storage: d.arrayOf(d.f32),
diff --git a/apps/typegpu-docs/src/examples/algorithms/mnist-inference/helpers.ts b/apps/typegpu-docs/src/examples/algorithms/mnist-inference/helpers.ts
index 505d3fbbe3..01edbc87b6 100644
--- a/apps/typegpu-docs/src/examples/algorithms/mnist-inference/helpers.ts
+++ b/apps/typegpu-docs/src/examples/algorithms/mnist-inference/helpers.ts
@@ -1,6 +1,5 @@
-import type { TgpuRoot } from 'typegpu';
+import { d, type TgpuRoot } from 'typegpu';
 import type { LayerData } from './data.ts';
-import * as d from 'typegpu/data';
 
 /**
  * The function extracts the header, shape and data from the layer
diff --git a/apps/typegpu-docs/src/examples/algorithms/mnist-inference/index.ts b/apps/typegpu-docs/src/examples/algorithms/mnist-inference/index.ts
index c29fb2490b..777aa9641d 100644
--- a/apps/typegpu-docs/src/examples/algorithms/mnist-inference/index.ts
+++ b/apps/typegpu-docs/src/examples/algorithms/mnist-inference/index.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import {
   ioLayout,
   type LayerData,
diff --git a/apps/typegpu-docs/src/examples/algorithms/probability/executor.ts b/apps/typegpu-docs/src/examples/algorithms/probability/executor.ts
index 75d588e414..854bc5db08 100644
--- a/apps/typegpu-docs/src/examples/algorithms/probability/executor.ts
+++ b/apps/typegpu-docs/src/examples/algorithms/probability/executor.ts
@@ -1,4 +1,4 @@
-import tgpu from 'typegpu';
+import { randf } from '@typegpu/noise';
 import type {
   StorageFlag,
   TgpuBindGroup,
@@ -10,8 +10,7 @@ import type {
   TgpuRoot,
   TgpuSlot,
 } from 'typegpu';
-import * as d from 'typegpu/data';
-import { randf } from '@typegpu/noise';
+import tgpu, { d } from 'typegpu';
 
 export class Executor {
   // don't exceed max workgroup grid X dimension size
diff --git a/apps/typegpu-docs/src/examples/algorithms/probability/helpers.ts b/apps/typegpu-docs/src/examples/algorithms/probability/helpers.ts
index d9e3f9a2f2..f214cdb2f2 100644
--- a/apps/typegpu-docs/src/examples/algorithms/probability/helpers.ts
+++ b/apps/typegpu-docs/src/examples/algorithms/probability/helpers.ts
@@ -1,9 +1,8 @@
-import tgpu from 'typegpu';
 import { randf } from '@typegpu/noise';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
-import { Distribution, PlotType, type PRNG } from './types.ts';
 import * as c from './constants.ts';
+import { Distribution, PlotType, type PRNG } from './types.ts';
 
 const normal = d.vec3f(1.41, 1.41, 0);
 const z2D = 0.5;
diff --git a/apps/typegpu-docs/src/examples/common/setup-orbit-camera.ts b/apps/typegpu-docs/src/examples/common/setup-orbit-camera.ts
index b1dbe74493..838cc4cc85 100644
--- a/apps/typegpu-docs/src/examples/common/setup-orbit-camera.ts
+++ b/apps/typegpu-docs/src/examples/common/setup-orbit-camera.ts
@@ -1,6 +1,5 @@
 import * as m from 'wgpu-matrix';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 
 export const Camera = d.struct({
   position: d.vec4f,
diff --git a/apps/typegpu-docs/src/examples/geometry/circles/index.ts b/apps/typegpu-docs/src/examples/geometry/circles/index.ts
index 4061b2fff3..dc3f1a9029 100644
--- a/apps/typegpu-docs/src/examples/geometry/circles/index.ts
+++ b/apps/typegpu-docs/src/examples/geometry/circles/index.ts
@@ -1,8 +1,5 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as s from 'typegpu/std';
-
 import { circle, circleVertexCount } from '@typegpu/geometry';
+import tgpu, { d, std as s } from 'typegpu';
 
 const presentationFormat = navigator.gpu.getPreferredCanvasFormat();
 const canvas = document.querySelector('canvas');
diff --git a/apps/typegpu-docs/src/examples/image-processing/ascii-filter/index.ts b/apps/typegpu-docs/src/examples/image-processing/ascii-filter/index.ts
index a163aeaa31..806343b937 100644
--- a/apps/typegpu-docs/src/examples/image-processing/ascii-filter/index.ts
+++ b/apps/typegpu-docs/src/examples/image-processing/ascii-filter/index.ts
@@ -1,7 +1,4 @@
-import tgpu, { type TgpuBindGroup } from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
-import { fullScreenTriangle } from 'typegpu/common';
+import tgpu, { common, d, std, type TgpuBindGroup } from 'typegpu';
 
 const root = await tgpu.init();
 
@@ -165,7 +162,7 @@ context.configure({
 });
 
 const pipeline = root['~unstable']
-  .withVertex(fullScreenTriangle, {})
+  .withVertex(common.fullScreenTriangle, {})
   .withFragment(fragmentFn, { format: presentationFormat })
   .createPipeline();
 
diff --git a/apps/typegpu-docs/src/examples/image-processing/background-segmentation/index.ts b/apps/typegpu-docs/src/examples/image-processing/background-segmentation/index.ts
index 7c54f50c71..497153882f 100644
--- a/apps/typegpu-docs/src/examples/image-processing/background-segmentation/index.ts
+++ b/apps/typegpu-docs/src/examples/image-processing/background-segmentation/index.ts
@@ -1,12 +1,12 @@
-import tgpu, {
-  type RenderFlag,
-  type SampledFlag,
-  type StorageFlag,
-  type TgpuBindGroup,
-  type TgpuTexture,
+import type {
+  RenderFlag,
+  SampledFlag,
+  StorageFlag,
+  TgpuBindGroup,
+  TgpuTexture,
 } from 'typegpu';
-import { fullScreenTriangle } from 'typegpu/common';
-import * as d from 'typegpu/data';
+import tgpu, { common, d } from 'typegpu';
+
 import { MODEL_HEIGHT, MODEL_WIDTH, MODELS, prepareSession } from './model.ts';
 import {
   blockDim,
@@ -168,7 +168,7 @@ const blurPipelines = [false, true].map((flip) =>
 
 const drawWithMaskPipeline = root['~unstable']
   .with(paramsAccess, paramsUniform)
-  .withVertex(fullScreenTriangle, {})
+  .withVertex(common.fullScreenTriangle, {})
   .withFragment(drawWithMaskFragment, { format: presentationFormat })
   .createPipeline();
 
diff --git a/apps/typegpu-docs/src/examples/image-processing/background-segmentation/schemas.ts b/apps/typegpu-docs/src/examples/image-processing/background-segmentation/schemas.ts
index 2d518d29ea..2500f8194c 100644
--- a/apps/typegpu-docs/src/examples/image-processing/background-segmentation/schemas.ts
+++ b/apps/typegpu-docs/src/examples/image-processing/background-segmentation/schemas.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 // constants
 
diff --git a/apps/typegpu-docs/src/examples/image-processing/background-segmentation/shaders.ts b/apps/typegpu-docs/src/examples/image-processing/background-segmentation/shaders.ts
index 51618f6819..a9c0208928 100644
--- a/apps/typegpu-docs/src/examples/image-processing/background-segmentation/shaders.ts
+++ b/apps/typegpu-docs/src/examples/image-processing/background-segmentation/shaders.ts
@@ -1,6 +1,5 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
+import { MODEL_HEIGHT, MODEL_WIDTH } from './model.ts';
 import {
   blockDim,
   blurLayout,
@@ -11,7 +10,6 @@ import {
   paramsAccess,
   prepareModelInputLayout,
 } from './schemas.ts';
-import { MODEL_HEIGHT, MODEL_WIDTH } from './model.ts';
 
 export const prepareModelInput = (x: number, y: number) => {
   'use gpu';
diff --git a/apps/typegpu-docs/src/examples/image-processing/blur/index.ts b/apps/typegpu-docs/src/examples/image-processing/blur/index.ts
index 2023960861..ef067a14b4 100644
--- a/apps/typegpu-docs/src/examples/image-processing/blur/index.ts
+++ b/apps/typegpu-docs/src/examples/image-processing/blur/index.ts
@@ -1,10 +1,7 @@
 // Original implementation:
 // https://webgpu.github.io/webgpu-samples/?sample=imageBlur
 
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
-import { fullScreenTriangle } from 'typegpu/common';
+import tgpu, { common, d, std } from 'typegpu';
 
 const root = await tgpu.init();
 const device = root.device;
@@ -163,7 +160,7 @@ const computePipeline = root['~unstable']
   .createPipeline();
 
 const renderPipeline = root['~unstable']
-  .withVertex(fullScreenTriangle, {})
+  .withVertex(common.fullScreenTriangle, {})
   .withFragment(renderFragment, { format: presentationFormat })
   .createPipeline();
 
diff --git a/apps/typegpu-docs/src/examples/image-processing/camera-thresholding/index.ts b/apps/typegpu-docs/src/examples/image-processing/camera-thresholding/index.ts
index 4f236b1118..1348f21f9b 100644
--- a/apps/typegpu-docs/src/examples/image-processing/camera-thresholding/index.ts
+++ b/apps/typegpu-docs/src/examples/image-processing/camera-thresholding/index.ts
@@ -1,8 +1,5 @@
 import { rgbToYcbcrMatrix } from '@typegpu/color';
-import tgpu from 'typegpu';
-import { fullScreenTriangle } from 'typegpu/common';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { common, d, std } from 'typegpu';
 
 const textureLayout = tgpu.bindGroupLayout({
   inputTexture: { externalTexture: d.textureExternal() },
@@ -71,7 +68,7 @@ const sampler = root['~unstable'].createSampler({
 });
 
 const renderPipeline = root['~unstable']
-  .withVertex(fullScreenTriangle, {})
+  .withVertex(common.fullScreenTriangle, {})
   .withFragment(mainFrag, { format: presentationFormat })
   .createPipeline();
 
diff --git a/apps/typegpu-docs/src/examples/image-processing/chroma-keying/index.ts b/apps/typegpu-docs/src/examples/image-processing/chroma-keying/index.ts
index 49683cc623..b2fe9578cf 100644
--- a/apps/typegpu-docs/src/examples/image-processing/chroma-keying/index.ts
+++ b/apps/typegpu-docs/src/examples/image-processing/chroma-keying/index.ts
@@ -1,6 +1,5 @@
 import { rgbToYcbcrMatrix } from '@typegpu/color';
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const rareLayout = tgpu.bindGroupLayout({
   sampling: { sampler: 'filtering' },
diff --git a/apps/typegpu-docs/src/examples/image-processing/image-tuning/index.ts b/apps/typegpu-docs/src/examples/image-processing/image-tuning/index.ts
index 0369a44d82..8f39f8c646 100644
--- a/apps/typegpu-docs/src/examples/image-processing/image-tuning/index.ts
+++ b/apps/typegpu-docs/src/examples/image-processing/image-tuning/index.ts
@@ -1,5 +1,4 @@
-import tgpu, { type SampledFlag, type TgpuTexture } from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d, type SampledFlag, type TgpuTexture } from 'typegpu';
 
 type LUTData = {
   title: string;
diff --git a/apps/typegpu-docs/src/examples/rendering/3d-fish/compute.ts b/apps/typegpu-docs/src/examples/rendering/3d-fish/compute.ts
index 9f6144b07a..2dc239cdf0 100644
--- a/apps/typegpu-docs/src/examples/rendering/3d-fish/compute.ts
+++ b/apps/typegpu-docs/src/examples/rendering/3d-fish/compute.ts
@@ -1,5 +1,4 @@
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 import * as p from './params.ts';
 import { computeBindGroupLayout as layout } from './schemas.ts';
 import { projectPointOnLine } from './tgsl-helpers.ts';
diff --git a/apps/typegpu-docs/src/examples/rendering/3d-fish/index.ts b/apps/typegpu-docs/src/examples/rendering/3d-fish/index.ts
index 64fa6ffef8..3f3c8258a0 100644
--- a/apps/typegpu-docs/src/examples/rendering/3d-fish/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/3d-fish/index.ts
@@ -1,7 +1,5 @@
 import { randf } from '@typegpu/noise';
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import * as m from 'wgpu-matrix';
 import { simulate } from './compute.ts';
 import { loadModel } from './load-model.ts';
diff --git a/apps/typegpu-docs/src/examples/rendering/3d-fish/load-model.ts b/apps/typegpu-docs/src/examples/rendering/3d-fish/load-model.ts
index b9ce70a7dc..5e4a6a3acc 100644
--- a/apps/typegpu-docs/src/examples/rendering/3d-fish/load-model.ts
+++ b/apps/typegpu-docs/src/examples/rendering/3d-fish/load-model.ts
@@ -1,7 +1,6 @@
 import { load } from '@loaders.gl/core';
 import { OBJLoader } from '@loaders.gl/obj';
-import type { TgpuRoot } from 'typegpu';
-import * as d from 'typegpu/data';
+import { d, type TgpuRoot } from 'typegpu';
 import { modelVertexLayout } from './schemas.ts';
 
 export async function loadModel(
diff --git a/apps/typegpu-docs/src/examples/rendering/3d-fish/params.ts b/apps/typegpu-docs/src/examples/rendering/3d-fish/params.ts
index dc92b84152..90b3dfcd59 100644
--- a/apps/typegpu-docs/src/examples/rendering/3d-fish/params.ts
+++ b/apps/typegpu-docs/src/examples/rendering/3d-fish/params.ts
@@ -1,5 +1,4 @@
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 
 export const fishAmount = 1024 * 8;
 export const fishModelScale = 0.07;
diff --git a/apps/typegpu-docs/src/examples/rendering/3d-fish/render.ts b/apps/typegpu-docs/src/examples/rendering/3d-fish/render.ts
index 77f58cbb49..ab5e44c964 100644
--- a/apps/typegpu-docs/src/examples/rendering/3d-fish/render.ts
+++ b/apps/typegpu-docs/src/examples/rendering/3d-fish/render.ts
@@ -1,7 +1,5 @@
 import { hsvToRgb, rgbToHsv } from '@typegpu/color';
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import * as p from './params.ts';
 import {
   ModelVertexInput,
diff --git a/apps/typegpu-docs/src/examples/rendering/3d-fish/schemas.ts b/apps/typegpu-docs/src/examples/rendering/3d-fish/schemas.ts
index 75a462b460..46243d951d 100644
--- a/apps/typegpu-docs/src/examples/rendering/3d-fish/schemas.ts
+++ b/apps/typegpu-docs/src/examples/rendering/3d-fish/schemas.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 // schemas
 
diff --git a/apps/typegpu-docs/src/examples/rendering/3d-fish/tgsl-helpers.ts b/apps/typegpu-docs/src/examples/rendering/3d-fish/tgsl-helpers.ts
index 33635171ed..8860c939c3 100644
--- a/apps/typegpu-docs/src/examples/rendering/3d-fish/tgsl-helpers.ts
+++ b/apps/typegpu-docs/src/examples/rendering/3d-fish/tgsl-helpers.ts
@@ -1,4 +1,4 @@
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 import { add, cos, dot, normalize, sin } from 'typegpu/std';
 import type { Line3 } from './schemas.ts';
 
diff --git a/apps/typegpu-docs/src/examples/rendering/box-raytracing/index.ts b/apps/typegpu-docs/src/examples/rendering/box-raytracing/index.ts
index 1136fade8a..38090917a1 100644
--- a/apps/typegpu-docs/src/examples/rendering/box-raytracing/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/box-raytracing/index.ts
@@ -1,6 +1,5 @@
 import { linearToSrgb, srgbToLinear } from '@typegpu/color';
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 import {
   add,
   discard,
diff --git a/apps/typegpu-docs/src/examples/rendering/caustics/index.ts b/apps/typegpu-docs/src/examples/rendering/caustics/index.ts
index c6a3d844b0..2e0b65078d 100644
--- a/apps/typegpu-docs/src/examples/rendering/caustics/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/caustics/index.ts
@@ -1,7 +1,5 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
 import { perlin3d } from '@typegpu/noise';
+import tgpu, { d, std } from 'typegpu';
 
 const mainVertex = tgpu['~unstable'].vertexFn({
   in: { vertexIndex: d.builtin.vertexIndex },
diff --git a/apps/typegpu-docs/src/examples/rendering/clouds/consts.ts b/apps/typegpu-docs/src/examples/rendering/clouds/consts.ts
index 7151565690..b4b5defdcd 100644
--- a/apps/typegpu-docs/src/examples/rendering/clouds/consts.ts
+++ b/apps/typegpu-docs/src/examples/rendering/clouds/consts.ts
@@ -1,4 +1,4 @@
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 
 export const FOV_FACTOR = 1;
 
diff --git a/apps/typegpu-docs/src/examples/rendering/clouds/index.ts b/apps/typegpu-docs/src/examples/rendering/clouds/index.ts
index 0479f1a51d..1a5af036d4 100644
--- a/apps/typegpu-docs/src/examples/rendering/clouds/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/clouds/index.ts
@@ -1,7 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
-import { fullScreenTriangle } from 'typegpu/common';
+import tgpu, { common, d, std } from 'typegpu';
 import {
   FOV_FACTOR,
   NOISE_TEXTURE_SIZE,
@@ -113,7 +110,7 @@ const mainFragment = tgpu['~unstable'].fragmentFn({
 });
 
 const pipeline = root['~unstable']
-  .withVertex(fullScreenTriangle)
+  .withVertex(common.fullScreenTriangle)
   .withFragment(mainFragment, { format: presentationFormat })
   .createPipeline();
 
diff --git a/apps/typegpu-docs/src/examples/rendering/clouds/types.ts b/apps/typegpu-docs/src/examples/rendering/clouds/types.ts
index e9d298c8c7..c4945fb27c 100644
--- a/apps/typegpu-docs/src/examples/rendering/clouds/types.ts
+++ b/apps/typegpu-docs/src/examples/rendering/clouds/types.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 export const CloudsParams = d.struct({
   time: d.f32,
diff --git a/apps/typegpu-docs/src/examples/rendering/clouds/utils.ts b/apps/typegpu-docs/src/examples/rendering/clouds/utils.ts
index d354a62262..67a7db8a64 100644
--- a/apps/typegpu-docs/src/examples/rendering/clouds/utils.ts
+++ b/apps/typegpu-docs/src/examples/rendering/clouds/utils.ts
@@ -1,7 +1,5 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
 import { randf } from '@typegpu/noise';
+import tgpu, { d, std } from 'typegpu';
 import {
   CLOUD_AMPLITUDE,
   CLOUD_BRIGHT,
diff --git a/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/cubemap.ts b/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/cubemap.ts
index 836c135d9d..a6d5979885 100644
--- a/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/cubemap.ts
+++ b/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/cubemap.ts
@@ -1,5 +1,4 @@
-import type { TgpuTexture } from 'typegpu';
-import * as d from 'typegpu/data';
+import { d, type TgpuTexture } from 'typegpu';
 import { CubeVertex } from './dataTypes.ts';
 
 function vert(position: [number, number, number], uv: [number, number]) {
diff --git a/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/dataTypes.ts b/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/dataTypes.ts
index 142eac330f..755e130861 100644
--- a/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/dataTypes.ts
+++ b/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/dataTypes.ts
@@ -1,4 +1,4 @@
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 
 export const Camera = d.struct({
   view: d.mat4x4f,
diff --git a/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/helpers.ts b/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/helpers.ts
index b5e16ef1f4..c74479e897 100644
--- a/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/helpers.ts
+++ b/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/helpers.ts
@@ -1,5 +1,4 @@
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 
 export const unpackVec2u = (packed: d.v2u): d.v4f => {
   'use gpu';
diff --git a/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/icosphere.ts b/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/icosphere.ts
index 8a99b66ef9..675ca6b64a 100644
--- a/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/icosphere.ts
+++ b/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/icosphere.ts
@@ -1,12 +1,11 @@
-import tgpu, {
-  type TgpuBuffer,
-  type TgpuComputePipeline,
-  type TgpuRoot,
-  type UniformFlag,
-  type VertexFlag,
+import type {
+  TgpuBuffer,
+  TgpuComputePipeline,
+  TgpuRoot,
+  UniformFlag,
+  VertexFlag,
 } from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import { ComputeVertex, Vertex } from './dataTypes.ts';
 import {
   calculateMidpoint,
diff --git a/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/index.ts b/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/index.ts
index 4ae8f334e3..bf39ac8dff 100644
--- a/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/cubemap-reflection/index.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import * as m from 'wgpu-matrix';
 import { type CubemapNames, cubeVertices, loadCubemap } from './cubemap.ts';
 import {
diff --git a/apps/typegpu-docs/src/examples/rendering/disco/consts.ts b/apps/typegpu-docs/src/examples/rendering/disco/consts.ts
index 227e9be884..88f7948ee6 100644
--- a/apps/typegpu-docs/src/examples/rendering/disco/consts.ts
+++ b/apps/typegpu-docs/src/examples/rendering/disco/consts.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 export const timeAccess = tgpu['~unstable'].accessor(d.f32);
 export const resolutionAccess = tgpu['~unstable'].accessor(d.vec2f); // (width, height)
diff --git a/apps/typegpu-docs/src/examples/rendering/disco/index.ts b/apps/typegpu-docs/src/examples/rendering/disco/index.ts
index 0a69c1edc3..9159fab679 100644
--- a/apps/typegpu-docs/src/examples/rendering/disco/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/disco/index.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 import { resolutionAccess, timeAccess } from './consts.ts';
 import {
   mainFragment1,
diff --git a/apps/typegpu-docs/src/examples/rendering/disco/shaders/fragment.ts b/apps/typegpu-docs/src/examples/rendering/disco/shaders/fragment.ts
index 00691258da..849e434d0e 100644
--- a/apps/typegpu-docs/src/examples/rendering/disco/shaders/fragment.ts
+++ b/apps/typegpu-docs/src/examples/rendering/disco/shaders/fragment.ts
@@ -1,8 +1,6 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
-import { palette } from '../utils.ts';
+import tgpu, { d, std } from 'typegpu';
 import { resolutionAccess, timeAccess } from '../consts.ts';
+import { palette } from '../utils.ts';
 
 const aspectCorrected = (uv: d.v2f): d.v2f => {
   'use gpu';
diff --git a/apps/typegpu-docs/src/examples/rendering/disco/shaders/vertex.ts b/apps/typegpu-docs/src/examples/rendering/disco/shaders/vertex.ts
index 3316ba5280..a0f545176f 100644
--- a/apps/typegpu-docs/src/examples/rendering/disco/shaders/vertex.ts
+++ b/apps/typegpu-docs/src/examples/rendering/disco/shaders/vertex.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 export const mainVertex = tgpu['~unstable'].vertexFn({
   in: { vertexIndex: d.builtin.vertexIndex },
diff --git a/apps/typegpu-docs/src/examples/rendering/disco/utils.ts b/apps/typegpu-docs/src/examples/rendering/disco/utils.ts
index c6efbb372b..eff57d77f9 100644
--- a/apps/typegpu-docs/src/examples/rendering/disco/utils.ts
+++ b/apps/typegpu-docs/src/examples/rendering/disco/utils.ts
@@ -1,5 +1,4 @@
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 
 export const palette = (t: number): d.v3f => {
   'use gpu';
diff --git a/apps/typegpu-docs/src/examples/rendering/function-visualizer/index.ts b/apps/typegpu-docs/src/examples/rendering/function-visualizer/index.ts
index a4647cb6e2..777724a75a 100644
--- a/apps/typegpu-docs/src/examples/rendering/function-visualizer/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/function-visualizer/index.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import { mat4 } from 'wgpu-matrix';
 
 // Globals and init
diff --git a/apps/typegpu-docs/src/examples/rendering/jelly-slider/camera.ts b/apps/typegpu-docs/src/examples/rendering/jelly-slider/camera.ts
index 4d7436b92b..0b93312a5e 100644
--- a/apps/typegpu-docs/src/examples/rendering/jelly-slider/camera.ts
+++ b/apps/typegpu-docs/src/examples/rendering/jelly-slider/camera.ts
@@ -1,5 +1,5 @@
 import type { TgpuRoot, TgpuUniform } from 'typegpu';
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 import * as m from 'wgpu-matrix';
 
 const Camera = d.struct({
diff --git a/apps/typegpu-docs/src/examples/rendering/jelly-slider/constants.ts b/apps/typegpu-docs/src/examples/rendering/jelly-slider/constants.ts
index d3529a7c44..90cefb4751 100644
--- a/apps/typegpu-docs/src/examples/rendering/jelly-slider/constants.ts
+++ b/apps/typegpu-docs/src/examples/rendering/jelly-slider/constants.ts
@@ -1,4 +1,4 @@
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 
 // Rendering constants
 export const MAX_STEPS = 64;
diff --git a/apps/typegpu-docs/src/examples/rendering/jelly-slider/dataTypes.ts b/apps/typegpu-docs/src/examples/rendering/jelly-slider/dataTypes.ts
index 3eb87db43c..47cf5a4f2f 100644
--- a/apps/typegpu-docs/src/examples/rendering/jelly-slider/dataTypes.ts
+++ b/apps/typegpu-docs/src/examples/rendering/jelly-slider/dataTypes.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 export const DirectionalLight = d.struct({
   direction: d.vec3f,
diff --git a/apps/typegpu-docs/src/examples/rendering/jelly-slider/index.ts b/apps/typegpu-docs/src/examples/rendering/jelly-slider/index.ts
index dfa87ceee4..c8bd4c8397 100644
--- a/apps/typegpu-docs/src/examples/rendering/jelly-slider/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/jelly-slider/index.ts
@@ -1,8 +1,5 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
 import * as sdf from '@typegpu/sdf';
-import { fullScreenTriangle } from 'typegpu/common';
+import tgpu, { common, d, std } from 'typegpu';
 
 import { randf } from '@typegpu/noise';
 import { Slider } from './slider.ts';
@@ -843,12 +840,12 @@ const fragmentMain = tgpu['~unstable'].fragmentFn({
 });
 
 const rayMarchPipeline = root['~unstable']
-  .withVertex(fullScreenTriangle, {})
+  .withVertex(common.fullScreenTriangle, {})
   .withFragment(raymarchFn, { format: 'rgba8unorm' })
   .createPipeline();
 
 const renderPipeline = root['~unstable']
-  .withVertex(fullScreenTriangle, {})
+  .withVertex(common.fullScreenTriangle, {})
   .withFragment(fragmentMain, { format: presentationFormat })
   .createPipeline();
 
diff --git a/apps/typegpu-docs/src/examples/rendering/jelly-slider/slider.ts b/apps/typegpu-docs/src/examples/rendering/jelly-slider/slider.ts
index 2f071099ae..e0abe49ddc 100644
--- a/apps/typegpu-docs/src/examples/rendering/jelly-slider/slider.ts
+++ b/apps/typegpu-docs/src/examples/rendering/jelly-slider/slider.ts
@@ -8,8 +8,7 @@ import type {
   TgpuTexture,
   TgpuUniform,
 } from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 
 const BEZIER_TEXTURE_SIZE = [256, 128] as const;
 
diff --git a/apps/typegpu-docs/src/examples/rendering/jelly-slider/taa.ts b/apps/typegpu-docs/src/examples/rendering/jelly-slider/taa.ts
index 8fb82642fd..186b2846c8 100644
--- a/apps/typegpu-docs/src/examples/rendering/jelly-slider/taa.ts
+++ b/apps/typegpu-docs/src/examples/rendering/jelly-slider/taa.ts
@@ -1,7 +1,5 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
 import type { TgpuComputePipeline, TgpuRoot, TgpuTextureView } from 'typegpu';
+import tgpu, { d, std } from 'typegpu';
 import { taaResolveLayout } from './dataTypes.ts';
 
 export const taaResolveFn = tgpu['~unstable'].computeFn({
diff --git a/apps/typegpu-docs/src/examples/rendering/jelly-slider/utils.ts b/apps/typegpu-docs/src/examples/rendering/jelly-slider/utils.ts
index a3e3d0e221..53ac506bb7 100644
--- a/apps/typegpu-docs/src/examples/rendering/jelly-slider/utils.ts
+++ b/apps/typegpu-docs/src/examples/rendering/jelly-slider/utils.ts
@@ -1,7 +1,5 @@
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std, type TgpuRoot } from 'typegpu';
 import { BoxIntersection } from './dataTypes.ts';
-import type { TgpuRoot } from 'typegpu';
 
 export const fresnelSchlick = (
   cosTheta: number,
diff --git a/apps/typegpu-docs/src/examples/rendering/jelly-switch/camera.ts b/apps/typegpu-docs/src/examples/rendering/jelly-switch/camera.ts
index 4d7436b92b..68f8ab2fb8 100644
--- a/apps/typegpu-docs/src/examples/rendering/jelly-switch/camera.ts
+++ b/apps/typegpu-docs/src/examples/rendering/jelly-switch/camera.ts
@@ -1,5 +1,4 @@
-import type { TgpuRoot, TgpuUniform } from 'typegpu';
-import * as d from 'typegpu/data';
+import { d, type TgpuRoot, type TgpuUniform } from 'typegpu';
 import * as m from 'wgpu-matrix';
 
 const Camera = d.struct({
diff --git a/apps/typegpu-docs/src/examples/rendering/jelly-switch/constants.ts b/apps/typegpu-docs/src/examples/rendering/jelly-switch/constants.ts
index da3aed6e8b..97c30f1692 100644
--- a/apps/typegpu-docs/src/examples/rendering/jelly-switch/constants.ts
+++ b/apps/typegpu-docs/src/examples/rendering/jelly-switch/constants.ts
@@ -1,4 +1,4 @@
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 import type { SpringProperties } from './spring.ts';
 
 // Rendering constants
diff --git a/apps/typegpu-docs/src/examples/rendering/jelly-switch/dataTypes.ts b/apps/typegpu-docs/src/examples/rendering/jelly-switch/dataTypes.ts
index 64e7f5df01..2830776156 100644
--- a/apps/typegpu-docs/src/examples/rendering/jelly-switch/dataTypes.ts
+++ b/apps/typegpu-docs/src/examples/rendering/jelly-switch/dataTypes.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 export const DirectionalLight = d.struct({
   direction: d.vec3f,
diff --git a/apps/typegpu-docs/src/examples/rendering/jelly-switch/index.ts b/apps/typegpu-docs/src/examples/rendering/jelly-switch/index.ts
index b24d51f502..5c96072e7b 100644
--- a/apps/typegpu-docs/src/examples/rendering/jelly-switch/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/jelly-switch/index.ts
@@ -1,8 +1,5 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { common, d, std } from 'typegpu';
 import * as sdf from '@typegpu/sdf';
-import { fullScreenTriangle } from 'typegpu/common';
 
 import { randf } from '@typegpu/noise';
 import { SwitchBehavior } from './switch.ts';
@@ -556,12 +553,12 @@ const fragmentMain = tgpu['~unstable'].fragmentFn({
 });
 
 const rayMarchPipeline = root['~unstable']
-  .withVertex(fullScreenTriangle, {})
+  .withVertex(common.fullScreenTriangle, {})
   .withFragment(raymarchFn, { format: 'rgba8unorm' })
   .createPipeline();
 
 const renderPipeline = root['~unstable']
-  .withVertex(fullScreenTriangle, {})
+  .withVertex(common.fullScreenTriangle, {})
   .withFragment(fragmentMain, { format: presentationFormat })
   .createPipeline();
 
diff --git a/apps/typegpu-docs/src/examples/rendering/jelly-switch/taa.ts b/apps/typegpu-docs/src/examples/rendering/jelly-switch/taa.ts
index c5beeb4f58..feb6c7fedc 100644
--- a/apps/typegpu-docs/src/examples/rendering/jelly-switch/taa.ts
+++ b/apps/typegpu-docs/src/examples/rendering/jelly-switch/taa.ts
@@ -1,7 +1,5 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
 import type { TgpuComputePipeline, TgpuRoot, TgpuTextureView } from 'typegpu';
+import tgpu, { d, std } from 'typegpu';
 import { taaResolveLayout } from './dataTypes.ts';
 
 export const taaResolveFn = tgpu['~unstable'].computeFn({
diff --git a/apps/typegpu-docs/src/examples/rendering/jelly-switch/utils.ts b/apps/typegpu-docs/src/examples/rendering/jelly-switch/utils.ts
index ed5b0fa35d..d9df719504 100644
--- a/apps/typegpu-docs/src/examples/rendering/jelly-switch/utils.ts
+++ b/apps/typegpu-docs/src/examples/rendering/jelly-switch/utils.ts
@@ -1,6 +1,4 @@
-import type { TgpuRoot } from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std, type TgpuRoot } from 'typegpu';
 import { type BoundingBox, BoxIntersection } from './dataTypes.ts';
 
 export const fresnelSchlick = (
diff --git a/apps/typegpu-docs/src/examples/rendering/perlin-noise/index.ts b/apps/typegpu-docs/src/examples/rendering/perlin-noise/index.ts
index be354dc6cc..ee7b7f8690 100644
--- a/apps/typegpu-docs/src/examples/rendering/perlin-noise/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/perlin-noise/index.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import { fullScreenTriangle } from 'typegpu/common';
+import tgpu, { common, d } from 'typegpu';
 import { perlin3d } from '@typegpu/noise';
 import { abs, mix, mul, pow, sign, tanh } from 'typegpu/std';
 
@@ -80,12 +78,12 @@ const renderPipelineBase = root['~unstable']
 const renderPipelines = {
   exponential: renderPipelineBase
     .with(sharpenFnSlot, exponentialSharpen)
-    .withVertex(fullScreenTriangle, {})
+    .withVertex(common.fullScreenTriangle, {})
     .withFragment(mainFragment, { format: presentationFormat })
     .createPipeline(),
   tanh: renderPipelineBase
     .with(sharpenFnSlot, tanhSharpen)
-    .withVertex(fullScreenTriangle, {})
+    .withVertex(common.fullScreenTriangle, {})
     .withFragment(mainFragment, { format: presentationFormat })
     .createPipeline(),
 };
diff --git a/apps/typegpu-docs/src/examples/rendering/phong-reflection/index.ts b/apps/typegpu-docs/src/examples/rendering/phong-reflection/index.ts
index 3fe4c55e94..9bcfdcefa8 100644
--- a/apps/typegpu-docs/src/examples/rendering/phong-reflection/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/phong-reflection/index.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import * as p from './params.ts';
 import {
   ExampleControls,
diff --git a/apps/typegpu-docs/src/examples/rendering/phong-reflection/load-model.ts b/apps/typegpu-docs/src/examples/rendering/phong-reflection/load-model.ts
index 248b4fafb0..bec107eec3 100644
--- a/apps/typegpu-docs/src/examples/rendering/phong-reflection/load-model.ts
+++ b/apps/typegpu-docs/src/examples/rendering/phong-reflection/load-model.ts
@@ -1,7 +1,6 @@
 import { load } from '@loaders.gl/core';
 import { OBJLoader } from '@loaders.gl/obj';
-import type { TgpuRoot } from 'typegpu';
-import * as d from 'typegpu/data';
+import { d, type TgpuRoot } from 'typegpu';
 import { modelVertexLayout } from './schemas.ts';
 
 export async function loadModel(
diff --git a/apps/typegpu-docs/src/examples/rendering/phong-reflection/params.ts b/apps/typegpu-docs/src/examples/rendering/phong-reflection/params.ts
index 4b68693edb..945b929741 100644
--- a/apps/typegpu-docs/src/examples/rendering/phong-reflection/params.ts
+++ b/apps/typegpu-docs/src/examples/rendering/phong-reflection/params.ts
@@ -1,4 +1,4 @@
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 import { ExampleControls } from './schemas.ts';
 
 export const backgroundColor = d.vec3f(28, 28, 28).div(255);
diff --git a/apps/typegpu-docs/src/examples/rendering/phong-reflection/schemas.ts b/apps/typegpu-docs/src/examples/rendering/phong-reflection/schemas.ts
index 34843d1919..6b294234b9 100644
--- a/apps/typegpu-docs/src/examples/rendering/phong-reflection/schemas.ts
+++ b/apps/typegpu-docs/src/examples/rendering/phong-reflection/schemas.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 // schemas
 
diff --git a/apps/typegpu-docs/src/examples/rendering/point-light-shadow/box-geometry.ts b/apps/typegpu-docs/src/examples/rendering/point-light-shadow/box-geometry.ts
index 0c1049e960..6e7d19ea13 100644
--- a/apps/typegpu-docs/src/examples/rendering/point-light-shadow/box-geometry.ts
+++ b/apps/typegpu-docs/src/examples/rendering/point-light-shadow/box-geometry.ts
@@ -1,5 +1,5 @@
 import type { IndexFlag, TgpuBuffer, TgpuRoot, VertexFlag } from 'typegpu';
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 import type { GeometryData } from './types.ts';
 import { InstanceData, VertexData } from './types.ts';
 
diff --git a/apps/typegpu-docs/src/examples/rendering/point-light-shadow/camera.ts b/apps/typegpu-docs/src/examples/rendering/point-light-shadow/camera.ts
index 9f561207f8..0f0f5773fd 100644
--- a/apps/typegpu-docs/src/examples/rendering/point-light-shadow/camera.ts
+++ b/apps/typegpu-docs/src/examples/rendering/point-light-shadow/camera.ts
@@ -1,5 +1,4 @@
-import type { TgpuRoot } from 'typegpu';
-import * as d from 'typegpu/data';
+import { d, type TgpuRoot } from 'typegpu';
 import * as m from 'wgpu-matrix';
 import { CameraData } from './types.ts';
 
diff --git a/apps/typegpu-docs/src/examples/rendering/point-light-shadow/index.ts b/apps/typegpu-docs/src/examples/rendering/point-light-shadow/index.ts
index 3db845e1f9..b0607d2f36 100644
--- a/apps/typegpu-docs/src/examples/rendering/point-light-shadow/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/point-light-shadow/index.ts
@@ -1,7 +1,4 @@
-import tgpu from 'typegpu';
-import { fullScreenTriangle } from 'typegpu/common';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { common, d, std } from 'typegpu';
 import { BoxGeometry } from './box-geometry.ts';
 import { Camera } from './camera.ts';
 import { PointLight } from './point-light.ts';
@@ -336,7 +333,7 @@ const pipelineMain = root['~unstable']
   .createPipeline();
 
 const pipelinePreview = root['~unstable']
-  .withVertex(fullScreenTriangle)
+  .withVertex(common.fullScreenTriangle)
   .withFragment(previewFragment, { format: presentationFormat })
   .createPipeline();
 
diff --git a/apps/typegpu-docs/src/examples/rendering/point-light-shadow/point-light.ts b/apps/typegpu-docs/src/examples/rendering/point-light-shadow/point-light.ts
index 1e728dc5ca..79d9fe81a6 100644
--- a/apps/typegpu-docs/src/examples/rendering/point-light-shadow/point-light.ts
+++ b/apps/typegpu-docs/src/examples/rendering/point-light-shadow/point-light.ts
@@ -4,7 +4,7 @@ import type {
   TgpuRenderPipeline,
   TgpuRoot,
 } from 'typegpu';
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 import { BoxGeometry } from './box-geometry.ts';
 import { Camera } from './camera.ts';
 import type { Scene } from './scene.ts';
diff --git a/apps/typegpu-docs/src/examples/rendering/point-light-shadow/scene.ts b/apps/typegpu-docs/src/examples/rendering/point-light-shadow/scene.ts
index f8e88ea7c2..fdfd24709f 100644
--- a/apps/typegpu-docs/src/examples/rendering/point-light-shadow/scene.ts
+++ b/apps/typegpu-docs/src/examples/rendering/point-light-shadow/scene.ts
@@ -1,5 +1,5 @@
 import type { TgpuRoot } from 'typegpu';
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 import type { BoxGeometry } from './box-geometry.ts';
 import { InstanceData } from './types.ts';
 
diff --git a/apps/typegpu-docs/src/examples/rendering/point-light-shadow/types.ts b/apps/typegpu-docs/src/examples/rendering/point-light-shadow/types.ts
index efd1f86637..2a554d69f2 100644
--- a/apps/typegpu-docs/src/examples/rendering/point-light-shadow/types.ts
+++ b/apps/typegpu-docs/src/examples/rendering/point-light-shadow/types.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 export const CameraData = d.struct({
   viewProjectionMatrix: d.mat4x4f,
diff --git a/apps/typegpu-docs/src/examples/rendering/ray-marching/index.ts b/apps/typegpu-docs/src/examples/rendering/ray-marching/index.ts
index 990f10203c..6648bc8884 100644
--- a/apps/typegpu-docs/src/examples/rendering/ray-marching/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/ray-marching/index.ts
@@ -1,7 +1,5 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
 import { sdBoxFrame3d, sdPlane, sdSphere } from '@typegpu/sdf';
+import tgpu, { d, std } from 'typegpu';
 
 const canvas = document.querySelector('canvas') as HTMLCanvasElement;
 const context = canvas.getContext('webgpu') as GPUCanvasContext;
diff --git a/apps/typegpu-docs/src/examples/rendering/simple-shadow/geometry.ts b/apps/typegpu-docs/src/examples/rendering/simple-shadow/geometry.ts
index 7bbcde335b..00e3af235e 100644
--- a/apps/typegpu-docs/src/examples/rendering/simple-shadow/geometry.ts
+++ b/apps/typegpu-docs/src/examples/rendering/simple-shadow/geometry.ts
@@ -5,7 +5,7 @@ import type {
   TgpuRoot,
   VertexFlag,
 } from 'typegpu';
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 import { mat4 } from 'wgpu-matrix';
 import {
   bindGroupLayout,
diff --git a/apps/typegpu-docs/src/examples/rendering/simple-shadow/index.ts b/apps/typegpu-docs/src/examples/rendering/simple-shadow/index.ts
index 262fba6989..83afd216a2 100644
--- a/apps/typegpu-docs/src/examples/rendering/simple-shadow/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/simple-shadow/index.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import { mat4 } from 'wgpu-matrix';
 import { createCuboid, createPlane } from './geometry.ts';
 import {
diff --git a/apps/typegpu-docs/src/examples/rendering/simple-shadow/schema.ts b/apps/typegpu-docs/src/examples/rendering/simple-shadow/schema.ts
index e3d0896a1c..f8fd4a6ddc 100644
--- a/apps/typegpu-docs/src/examples/rendering/simple-shadow/schema.ts
+++ b/apps/typegpu-docs/src/examples/rendering/simple-shadow/schema.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 // Data structures
 export const Material = d.struct({
diff --git a/apps/typegpu-docs/src/examples/rendering/two-boxes/index.ts b/apps/typegpu-docs/src/examples/rendering/two-boxes/index.ts
index 8495f023c8..f29918fbdb 100644
--- a/apps/typegpu-docs/src/examples/rendering/two-boxes/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/two-boxes/index.ts
@@ -1,12 +1,11 @@
-import tgpu, {
-  type RenderFlag,
-  type TgpuBindGroup,
-  type TgpuBuffer,
-  type TgpuTexture,
-  type VertexFlag,
+import type {
+  RenderFlag,
+  TgpuBindGroup,
+  TgpuBuffer,
+  TgpuTexture,
+  VertexFlag,
 } from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import * as m from 'wgpu-matrix';
 
 // Initialization
diff --git a/apps/typegpu-docs/src/examples/rendering/xor-dev-centrifuge-2/index.ts b/apps/typegpu-docs/src/examples/rendering/xor-dev-centrifuge-2/index.ts
index e54963fdde..5f5887e09c 100644
--- a/apps/typegpu-docs/src/examples/rendering/xor-dev-centrifuge-2/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/xor-dev-centrifuge-2/index.ts
@@ -10,8 +10,7 @@
  * ```
  */
 
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // deno-fmt-ignore: just a list of standard functions
 import { abs, atan2, cos, gt, length, normalize, select, sign, sub, tanh } from 'typegpu/std';
 
diff --git a/apps/typegpu-docs/src/examples/rendering/xor-dev-runner/index.ts b/apps/typegpu-docs/src/examples/rendering/xor-dev-runner/index.ts
index 11494df9a1..ed0f17f002 100644
--- a/apps/typegpu-docs/src/examples/rendering/xor-dev-runner/index.ts
+++ b/apps/typegpu-docs/src/examples/rendering/xor-dev-runner/index.ts
@@ -12,8 +12,7 @@
  * ```
  */
 
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 // deno-fmt-ignore: just a list of standard functions
 import { abs, add, cos, max, min, mul, normalize, select, sign, sin, sub, tanh } from 'typegpu/std';
 
diff --git a/apps/typegpu-docs/src/examples/simple/gradient-tiles/index.ts b/apps/typegpu-docs/src/examples/simple/gradient-tiles/index.ts
index 68fef9bba7..85e308d7a3 100644
--- a/apps/typegpu-docs/src/examples/simple/gradient-tiles/index.ts
+++ b/apps/typegpu-docs/src/examples/simple/gradient-tiles/index.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const Span = d.struct({
   x: d.u32,
diff --git a/apps/typegpu-docs/src/examples/simple/increment/index.ts b/apps/typegpu-docs/src/examples/simple/increment/index.ts
index 23bd44ca9d..09a8668947 100644
--- a/apps/typegpu-docs/src/examples/simple/increment/index.ts
+++ b/apps/typegpu-docs/src/examples/simple/increment/index.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 // Allocating memory for the counter
diff --git a/apps/typegpu-docs/src/examples/simple/liquid-glass/index.ts b/apps/typegpu-docs/src/examples/simple/liquid-glass/index.ts
index e28b417e05..68b150c019 100644
--- a/apps/typegpu-docs/src/examples/simple/liquid-glass/index.ts
+++ b/apps/typegpu-docs/src/examples/simple/liquid-glass/index.ts
@@ -1,8 +1,5 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
-import { fullScreenTriangle } from 'typegpu/common';
 import { sdRoundedBox2d } from '@typegpu/sdf';
+import tgpu, { common, d, std } from 'typegpu';
 
 const root = await tgpu.init();
 const device = root.device;
@@ -166,7 +163,7 @@ const fragmentShader = tgpu['~unstable'].fragmentFn({
 });
 
 const pipeline = root['~unstable']
-  .withVertex(fullScreenTriangle, {})
+  .withVertex(common.fullScreenTriangle, {})
   .withFragment(fragmentShader, {
     format: presentationFormat,
   })
diff --git a/apps/typegpu-docs/src/examples/simple/oklab/index.ts b/apps/typegpu-docs/src/examples/simple/oklab/index.ts
index 0e47c77de5..0c443ce8ef 100644
--- a/apps/typegpu-docs/src/examples/simple/oklab/index.ts
+++ b/apps/typegpu-docs/src/examples/simple/oklab/index.ts
@@ -5,9 +5,7 @@ import {
   oklabToLinearRgb,
   oklabToRgb,
 } from '@typegpu/color';
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import { any, cos, floor, gt, lt, mul, select, sin } from 'typegpu/std';
+import tgpu, { common, d, std } from 'typegpu';
 
 const cssProbePosition = d.vec2f(0.5, 0.5);
 
@@ -39,30 +37,10 @@ document.addEventListener(
   },
 );
 
-const fullScreenTriangle = tgpu['~unstable'].vertexFn({
-  in: { vertexIndex: d.builtin.vertexIndex },
-  out: { pos: d.builtin.position, uv: d.vec2f },
-})((input) => {
-  const pos = [d.vec2f(-1, -1), d.vec2f(3, -1), d.vec2f(-1, 3)];
-
-  return {
-    pos: d.vec4f(pos[input.vertexIndex], 0.0, 1.0),
-    uv: pos[input.vertexIndex],
-  };
-});
-
-const Uniforms = d.struct({
-  hue: d.f32,
-  alpha: d.f32,
-});
-
-const layout = tgpu.bindGroupLayout({
-  uniforms: { uniform: Uniforms },
-});
-
-const scaleView = tgpu.fn([d.vec2f], d.vec2f)((pos) => {
+const scaleView = (pos: d.v2f): d.v2f => {
+  'use gpu';
   return d.vec2f(0.3 * pos.x, (pos.y * 1.2 + 1) * 0.5);
-});
+};
 
 // #region Patterns
 
@@ -70,16 +48,20 @@ const patternFn = tgpu.fn([d.vec2f, d.vec3f], d.f32);
 
 const patternCheckers = patternFn((uv) => {
   'use gpu';
-  const suv = floor(mul(20, uv));
-  return suv.x + suv.y - 2 * floor((suv.x + suv.y) * 0.5);
+  const suv = std.floor(uv.mul(20));
+  return suv.x + suv.y - 2 * std.floor((suv.x + suv.y) * 0.5);
 });
 
-const patternL0ProjectionLines =
-  patternFn /* wgsl */`(uv: vec2f, clipLab: vec3f) -> f32 {
-    let thickness = fwidth(clipLab.x);
-    let Lgrid = 0.02 - thickness - abs(clipLab.x % 0.04 - 0.02);
-    return select(clamp(Lgrid / fwidth(Lgrid), 0, 1), 1, thickness < 0.0002);
-  }`;
+const patternL0ProjectionLines = patternFn((_uv, clipLab) => {
+  'use gpu';
+  const thickness = std.fwidth(clipLab.x);
+  const Lgrid = 0.02 - thickness - std.abs((clipLab.x % 0.04) - 0.02);
+  return std.select(
+    std.clamp(Lgrid / std.fwidth(Lgrid), 0, 1),
+    1,
+    thickness < 0.0002,
+  );
+});
 
 const patternSolid = patternFn(() => {
   'use gpu';
@@ -94,42 +76,45 @@ const mainFragment = tgpu['~unstable'].fragmentFn({
   in: { uv: d.vec2f },
   out: d.vec4f,
 })((input) => {
-  const hue = layout.$.uniforms.hue;
-  const pos = scaleView(input.uv);
-  const lab = d.vec3f(pos.y, mul(pos.x, d.vec2f(cos(hue), sin(hue))));
+  // remapping to (-1, 1)
+  const uv = input.uv.sub(0.5).mul(d.vec2f(2, -2));
+
+  const hue = uniforms.$.hue;
+  const pos = scaleView(uv);
+  const yzDir = d.vec2f(std.cos(hue), std.sin(hue));
+  const lab = d.vec3f(pos.y, yzDir.mul(pos.x));
   const rgb = oklabToLinearRgb(lab);
-  const outOfGamut = any(lt(rgb, d.vec3f(0))) || any(gt(rgb, d.vec3f(1)));
+  const outOfGamut = std.any(std.lt(rgb, d.vec3f(0))) ||
+    std.any(std.gt(rgb, d.vec3f(1)));
 
   const clipLab = oklabGamutClipSlot.$(lab);
   const color = oklabToRgb(lab);
 
-  const patternScaled = patternSlot.$(input.uv, clipLab) * 0.1 + 0.9;
+  const patternScaled = patternSlot.$(uv, clipLab) * 0.1 + 0.9;
 
-  return d.vec4f(select(color, mul(patternScaled, color), outOfGamut), 1);
+  return d.vec4f(std.select(color, color.mul(patternScaled), outOfGamut), 1);
 });
 
-const alphaFromUniforms = tgpu.fn([], d.f32)(() => layout.$.uniforms.alpha);
-
 const root = await tgpu.init();
 
+const uniforms = root.createUniform(d.struct({
+  hue: d.f32,
+  alpha: d.f32,
+}));
+
 context.configure({
   device: root.device,
   format: presentationFormat,
   alphaMode: 'premultiplied',
 });
 
-const uniforms = Uniforms({
+const uniformsValue = {
   hue: 0.7,
   alpha: 0.05,
-});
-
-const uniformsBuffer = root.createBuffer(Uniforms, uniforms).$usage('uniform');
-const bindGroup = root.createBindGroup(layout, {
-  uniforms: uniformsBuffer,
-});
+};
 
 let pipeline = root['~unstable']
-  .withVertex(fullScreenTriangle, {})
+  .withVertex(common.fullScreenTriangle, {})
   .withFragment(mainFragment, {
     format: presentationFormat,
   })
@@ -145,8 +130,8 @@ function setPipeline({
   pipeline = root['~unstable']
     .with(patternSlot, outOfGamutPattern)
     .with(oklabGamutClipSlot, gamutClip)
-    .with(oklabGamutClipAlphaAccess, alphaFromUniforms)
-    .withVertex(fullScreenTriangle, {})
+    .with(oklabGamutClipAlphaAccess, () => uniforms.$.alpha)
+    .withVertex(common.fullScreenTriangle, {})
     .withFragment(mainFragment, {
       format: presentationFormat,
     })
@@ -159,21 +144,20 @@ function draw() {
   );
   const lightness = pos.y;
   const chroma = pos.x;
-  const a = chroma * Math.cos(uniforms.hue);
-  const b = chroma * Math.sin(uniforms.hue);
+  const a = chroma * Math.cos(uniformsValue.hue);
+  const b = chroma * Math.sin(uniformsValue.hue);
   cssProbe.style.setProperty('--x', `${cssProbePosition.x * 100}%`);
   cssProbe.style.setProperty('--y', `${cssProbePosition.y * 100}%`);
   canvas.parentElement?.style.setProperty('--l', `${lightness}`);
   canvas.parentElement?.style.setProperty('--a', `${a}`);
   canvas.parentElement?.style.setProperty('--b', `${b}`);
-  canvas.parentElement?.style.setProperty('--hue', `${uniforms.hue}rad`);
+  canvas.parentElement?.style.setProperty('--hue', `${uniformsValue.hue}rad`);
 
   probePositionText.innerText = `
     oklab(${lightness.toFixed(2)} ${a.toFixed(2)} ${b.toFixed(2)})
   `;
 
   pipeline
-    .with(bindGroup)
     .withColorAttachment({
       view: context.getCurrentTexture().createView(),
       clearValue: [0, 0, 0, 0],
@@ -213,8 +197,8 @@ export const controls = {
     max: 2 * Math.PI,
     step: 0.001,
     onSliderChange: (hue: number) => {
-      uniforms.hue = hue;
-      uniformsBuffer.writePartial({ hue });
+      uniformsValue.hue = hue;
+      uniforms.writePartial({ hue });
       draw();
     },
   },
@@ -232,8 +216,8 @@ export const controls = {
     max: 1,
     step: 0.001,
     onSliderChange: (alpha: number) => {
-      uniforms.alpha = alpha;
-      uniformsBuffer.writePartial({ alpha });
+      uniformsValue.alpha = alpha;
+      uniforms.writePartial({ alpha });
       draw();
     },
   },
diff --git a/apps/typegpu-docs/src/examples/simple/square/index.ts b/apps/typegpu-docs/src/examples/simple/square/index.ts
index 9290629e15..98c1832ad7 100644
--- a/apps/typegpu-docs/src/examples/simple/square/index.ts
+++ b/apps/typegpu-docs/src/examples/simple/square/index.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const presentationFormat = navigator.gpu.getPreferredCanvasFormat();
 const canvas = document.querySelector('canvas') as HTMLCanvasElement;
diff --git a/apps/typegpu-docs/src/examples/simple/stencil/index.ts b/apps/typegpu-docs/src/examples/simple/stencil/index.ts
index df8c3d569f..f7c99b01c2 100644
--- a/apps/typegpu-docs/src/examples/simple/stencil/index.ts
+++ b/apps/typegpu-docs/src/examples/simple/stencil/index.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 const canvas = document.querySelector('canvas') as HTMLCanvasElement;
diff --git a/apps/typegpu-docs/src/examples/simple/triangle/index.ts b/apps/typegpu-docs/src/examples/simple/triangle/index.ts
index d9553b6fd5..a7716c5dad 100644
--- a/apps/typegpu-docs/src/examples/simple/triangle/index.ts
+++ b/apps/typegpu-docs/src/examples/simple/triangle/index.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const purple = d.vec4f(0.769, 0.392, 1.0, 1);
 const blue = d.vec4f(0.114, 0.447, 0.941, 1);
diff --git a/apps/typegpu-docs/src/examples/simple/vaporrave/constants.ts b/apps/typegpu-docs/src/examples/simple/vaporrave/constants.ts
index 345f642499..93d979d67e 100644
--- a/apps/typegpu-docs/src/examples/simple/vaporrave/constants.ts
+++ b/apps/typegpu-docs/src/examples/simple/vaporrave/constants.ts
@@ -1,4 +1,4 @@
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 
 export const MAX_STEPS = 1000;
 export const MAX_DIST = 19;
diff --git a/apps/typegpu-docs/src/examples/simple/vaporrave/floor.ts b/apps/typegpu-docs/src/examples/simple/vaporrave/floor.ts
index ece50989ed..88b11845e2 100644
--- a/apps/typegpu-docs/src/examples/simple/vaporrave/floor.ts
+++ b/apps/typegpu-docs/src/examples/simple/vaporrave/floor.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 import * as c from './constants.ts';
 
diff --git a/apps/typegpu-docs/src/examples/simple/vaporrave/helpers.ts b/apps/typegpu-docs/src/examples/simple/vaporrave/helpers.ts
index 9c01957dbc..f34f03bc14 100644
--- a/apps/typegpu-docs/src/examples/simple/vaporrave/helpers.ts
+++ b/apps/typegpu-docs/src/examples/simple/vaporrave/helpers.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as std from 'typegpu/std';
+import tgpu, { std } from 'typegpu';
 
 import { Ray } from './types.ts';
 
diff --git a/apps/typegpu-docs/src/examples/simple/vaporrave/index.ts b/apps/typegpu-docs/src/examples/simple/vaporrave/index.ts
index 171923a170..56bb905791 100644
--- a/apps/typegpu-docs/src/examples/simple/vaporrave/index.ts
+++ b/apps/typegpu-docs/src/examples/simple/vaporrave/index.ts
@@ -1,14 +1,12 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
-import { sdPlane } from '@typegpu/sdf';
 import { perlin3d } from '@typegpu/noise';
+import { sdPlane } from '@typegpu/sdf';
+import tgpu, { d, std } from 'typegpu';
 
-import { circles, grid } from './floor.ts';
 import * as c from './constants.ts';
-import { LightRay, Ray } from './types.ts';
-import { getSphere } from './sphere.ts';
+import { circles, grid } from './floor.ts';
 import { rayUnion } from './helpers.ts';
+import { getSphere } from './sphere.ts';
+import { LightRay, Ray } from './types.ts';
 
 // == INIT ==
 const canvas = document.querySelector('canvas') as HTMLCanvasElement;
diff --git a/apps/typegpu-docs/src/examples/simple/vaporrave/sphere.ts b/apps/typegpu-docs/src/examples/simple/vaporrave/sphere.ts
index 6aa44411b1..2689c336f7 100644
--- a/apps/typegpu-docs/src/examples/simple/vaporrave/sphere.ts
+++ b/apps/typegpu-docs/src/examples/simple/vaporrave/sphere.ts
@@ -1,11 +1,9 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
 import { perlin3d } from '@typegpu/noise';
 import { sdSphere } from '@typegpu/sdf';
+import tgpu, { d, std } from 'typegpu';
 
-import { Ray } from './types.ts';
 import * as c from './constants.ts';
+import { Ray } from './types.ts';
 
 /**
  * Returns a transformation matrix that represents an `angle` rotation
diff --git a/apps/typegpu-docs/src/examples/simple/vaporrave/types.ts b/apps/typegpu-docs/src/examples/simple/vaporrave/types.ts
index 4d95ee44af..cb6daecc01 100644
--- a/apps/typegpu-docs/src/examples/simple/vaporrave/types.ts
+++ b/apps/typegpu-docs/src/examples/simple/vaporrave/types.ts
@@ -1,4 +1,4 @@
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 
 export const Ray = d.struct({
   color: d.vec3f,
diff --git a/apps/typegpu-docs/src/examples/simulation/boids-next/index.ts b/apps/typegpu-docs/src/examples/simulation/boids-next/index.ts
index 7b9b358b04..c4b784769c 100644
--- a/apps/typegpu-docs/src/examples/simulation/boids-next/index.ts
+++ b/apps/typegpu-docs/src/examples/simulation/boids-next/index.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 const triangleAmount = 1000;
 const triangleSize = 0.03;
diff --git a/apps/typegpu-docs/src/examples/simulation/boids/index.ts b/apps/typegpu-docs/src/examples/simulation/boids/index.ts
index 783bcf7b0d..3ee2fce9e3 100644
--- a/apps/typegpu-docs/src/examples/simulation/boids/index.ts
+++ b/apps/typegpu-docs/src/examples/simulation/boids/index.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const triangleAmount = 1000;
 const triangleSize = 0.03;
diff --git a/apps/typegpu-docs/src/examples/simulation/confetti/index.ts b/apps/typegpu-docs/src/examples/simulation/confetti/index.ts
index c8fbb6d8aa..b05c538e75 100644
--- a/apps/typegpu-docs/src/examples/simulation/confetti/index.ts
+++ b/apps/typegpu-docs/src/examples/simulation/confetti/index.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import { cos, sin } from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 // constants
 
@@ -87,8 +85,8 @@ const dataLayout = tgpu.vertexLayout(
 
 const rotate = tgpu.fn([d.vec2f, d.f32], d.vec2f)((v, angle) => {
   const pos = d.vec2f(
-    (v.x * cos(angle)) - (v.y * sin(angle)),
-    (v.x * sin(angle)) + (v.y * cos(angle)),
+    (v.x * std.cos(angle)) - (v.y * std.sin(angle)),
+    (v.x * std.sin(angle)) + (v.y * std.cos(angle)),
   );
 
   return pos;
diff --git a/apps/typegpu-docs/src/examples/simulation/fluid-double-buffering/index.ts b/apps/typegpu-docs/src/examples/simulation/fluid-double-buffering/index.ts
index ce72e5caf7..91a9c43d0d 100644
--- a/apps/typegpu-docs/src/examples/simulation/fluid-double-buffering/index.ts
+++ b/apps/typegpu-docs/src/examples/simulation/fluid-double-buffering/index.ts
@@ -1,7 +1,10 @@
 import { randf } from '@typegpu/noise';
-import tgpu, { type TgpuBufferMutable, type TgpuBufferReadonly } from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, {
+  d,
+  std,
+  type TgpuBufferMutable,
+  type TgpuBufferReadonly,
+} from 'typegpu';
 
 const MAX_GRID_SIZE = 1024;
 
diff --git a/apps/typegpu-docs/src/examples/simulation/fluid-with-atomics/index.ts b/apps/typegpu-docs/src/examples/simulation/fluid-with-atomics/index.ts
index 0a51e12ac9..e6b6e6f25d 100644
--- a/apps/typegpu-docs/src/examples/simulation/fluid-with-atomics/index.ts
+++ b/apps/typegpu-docs/src/examples/simulation/fluid-with-atomics/index.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 const root = await tgpu.init();
 
diff --git a/apps/typegpu-docs/src/examples/simulation/game-of-life/index.ts b/apps/typegpu-docs/src/examples/simulation/game-of-life/index.ts
index f2844fe3ad..1a6993578a 100644
--- a/apps/typegpu-docs/src/examples/simulation/game-of-life/index.ts
+++ b/apps/typegpu-docs/src/examples/simulation/game-of-life/index.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 
 const root = await tgpu.init();
 const device = root.device;
diff --git a/apps/typegpu-docs/src/examples/simulation/gravity/compute.ts b/apps/typegpu-docs/src/examples/simulation/gravity/compute.ts
index eb79d0fa32..6b99712a96 100644
--- a/apps/typegpu-docs/src/examples/simulation/gravity/compute.ts
+++ b/apps/typegpu-docs/src/examples/simulation/gravity/compute.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import { collisionBehaviors } from './enums.ts';
 import { radiusOf } from './helpers.ts';
 import { CelestialBody, computeLayout, timeAccess } from './schemas.ts';
diff --git a/apps/typegpu-docs/src/examples/simulation/gravity/helpers.ts b/apps/typegpu-docs/src/examples/simulation/gravity/helpers.ts
index 6739084417..e2b15c457e 100644
--- a/apps/typegpu-docs/src/examples/simulation/gravity/helpers.ts
+++ b/apps/typegpu-docs/src/examples/simulation/gravity/helpers.ts
@@ -1,7 +1,6 @@
 import { load } from '@loaders.gl/core';
 import { OBJLoader } from '@loaders.gl/obj';
-import type { TgpuRoot } from 'typegpu';
-import * as d from 'typegpu/data';
+import { d, type TgpuRoot } from 'typegpu';
 import { sphereTextureNames } from './enums.ts';
 import {
   type CelestialBody,
diff --git a/apps/typegpu-docs/src/examples/simulation/gravity/index.ts b/apps/typegpu-docs/src/examples/simulation/gravity/index.ts
index 0bbb4584e3..1f7483fbb1 100644
--- a/apps/typegpu-docs/src/examples/simulation/gravity/index.ts
+++ b/apps/typegpu-docs/src/examples/simulation/gravity/index.ts
@@ -1,9 +1,9 @@
 import tgpu, {
+  d,
   type StorageFlag,
   type TgpuBindGroup,
   type TgpuBuffer,
 } from 'typegpu';
-import * as d from 'typegpu/data';
 import { computeCollisionsShader, computeGravityShader } from './compute.ts';
 import {
   collisionBehaviors,
diff --git a/apps/typegpu-docs/src/examples/simulation/gravity/presets.ts b/apps/typegpu-docs/src/examples/simulation/gravity/presets.ts
index c582153a87..23ea0c924d 100644
--- a/apps/typegpu-docs/src/examples/simulation/gravity/presets.ts
+++ b/apps/typegpu-docs/src/examples/simulation/gravity/presets.ts
@@ -1,5 +1,4 @@
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 import type { CollisionBehavior, Preset, SphereTextureName } from './enums.ts';
 
 export interface PresetData {
diff --git a/apps/typegpu-docs/src/examples/simulation/gravity/render.ts b/apps/typegpu-docs/src/examples/simulation/gravity/render.ts
index b88d7e1238..fb022300bc 100644
--- a/apps/typegpu-docs/src/examples/simulation/gravity/render.ts
+++ b/apps/typegpu-docs/src/examples/simulation/gravity/render.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import { radiusOf } from './helpers.ts';
 import {
   cameraAccess,
diff --git a/apps/typegpu-docs/src/examples/simulation/gravity/schemas.ts b/apps/typegpu-docs/src/examples/simulation/gravity/schemas.ts
index 323d1fc596..bccd5628da 100644
--- a/apps/typegpu-docs/src/examples/simulation/gravity/schemas.ts
+++ b/apps/typegpu-docs/src/examples/simulation/gravity/schemas.ts
@@ -1,5 +1,4 @@
-import tgpu, { type TgpuSampler } from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d, type TgpuSampler } from 'typegpu';
 import { Camera } from '../../common/setup-orbit-camera.ts';
 
 export type CelestialBody = d.Infer<typeof CelestialBody>;
diff --git a/apps/typegpu-docs/src/examples/simulation/slime-mold-3d/index.ts b/apps/typegpu-docs/src/examples/simulation/slime-mold-3d/index.ts
index 2057ca8c2f..f3b25b88be 100644
--- a/apps/typegpu-docs/src/examples/simulation/slime-mold-3d/index.ts
+++ b/apps/typegpu-docs/src/examples/simulation/slime-mold-3d/index.ts
@@ -1,8 +1,5 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
-import { fullScreenTriangle } from 'typegpu/common';
 import { randf } from '@typegpu/noise';
+import tgpu, { common, d, std } from 'typegpu';
 import * as m from 'wgpu-matrix';
 
 const root = await tgpu.init({
@@ -451,7 +448,7 @@ const fragmentShader = tgpu['~unstable'].fragmentFn({
 });
 
 const renderPipeline = root['~unstable']
-  .withVertex(fullScreenTriangle, {})
+  .withVertex(common.fullScreenTriangle, {})
   .withFragment(fragmentShader, { format: presentationFormat })
   .createPipeline();
 
diff --git a/apps/typegpu-docs/src/examples/simulation/slime-mold/index.ts b/apps/typegpu-docs/src/examples/simulation/slime-mold/index.ts
index 61ddfcfdb8..14859ce328 100644
--- a/apps/typegpu-docs/src/examples/simulation/slime-mold/index.ts
+++ b/apps/typegpu-docs/src/examples/simulation/slime-mold/index.ts
@@ -1,7 +1,5 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
 import { randf } from '@typegpu/noise';
+import tgpu, { d, std } from 'typegpu';
 
 const root = await tgpu.init();
 const device = root.device;
diff --git a/apps/typegpu-docs/src/examples/simulation/stable-fluid/index.ts b/apps/typegpu-docs/src/examples/simulation/stable-fluid/index.ts
index b014728fe0..b1fc67b25b 100644
--- a/apps/typegpu-docs/src/examples/simulation/stable-fluid/index.ts
+++ b/apps/typegpu-docs/src/examples/simulation/stable-fluid/index.ts
@@ -1,9 +1,9 @@
 import tgpu, {
+  d,
   type TgpuBindGroup,
   type TgpuComputeFn,
   type TgpuFragmentFn,
 } from 'typegpu';
-import * as d from 'typegpu/data';
 import * as p from './params.ts';
 import {
   fragmentImageFn,
diff --git a/apps/typegpu-docs/src/examples/simulation/stable-fluid/params.ts b/apps/typegpu-docs/src/examples/simulation/stable-fluid/params.ts
index 365acb3cec..51145118b5 100644
--- a/apps/typegpu-docs/src/examples/simulation/stable-fluid/params.ts
+++ b/apps/typegpu-docs/src/examples/simulation/stable-fluid/params.ts
@@ -1,4 +1,4 @@
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 import type { SimulationParams } from './types.ts';
 
 export const N = 2048;
diff --git a/apps/typegpu-docs/src/examples/simulation/stable-fluid/render.ts b/apps/typegpu-docs/src/examples/simulation/stable-fluid/render.ts
index 1c9137d790..add970af48 100644
--- a/apps/typegpu-docs/src/examples/simulation/stable-fluid/render.ts
+++ b/apps/typegpu-docs/src/examples/simulation/stable-fluid/render.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import { SIM_N } from './params.ts';
 
 export const renderLayout = tgpu.bindGroupLayout({
diff --git a/apps/typegpu-docs/src/examples/simulation/stable-fluid/simulation.ts b/apps/typegpu-docs/src/examples/simulation/stable-fluid/simulation.ts
index 574ddafd7b..d1606521eb 100644
--- a/apps/typegpu-docs/src/examples/simulation/stable-fluid/simulation.ts
+++ b/apps/typegpu-docs/src/examples/simulation/stable-fluid/simulation.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 import * as p from './params.ts';
 
 const getNeighbors = tgpu.fn([d.vec2i, d.vec2i], d.arrayOf(d.vec2i, 4))(
diff --git a/apps/typegpu-docs/src/examples/tests/dispatch/index.ts b/apps/typegpu-docs/src/examples/tests/dispatch/index.ts
index f4e993bd57..41936d1886 100644
--- a/apps/typegpu-docs/src/examples/tests/dispatch/index.ts
+++ b/apps/typegpu-docs/src/examples/tests/dispatch/index.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 const root = await tgpu.init();
 
diff --git a/apps/typegpu-docs/src/examples/tests/log-test/index.ts b/apps/typegpu-docs/src/examples/tests/log-test/index.ts
index bd8d7380b5..0bc9fc4e44 100644
--- a/apps/typegpu-docs/src/examples/tests/log-test/index.ts
+++ b/apps/typegpu-docs/src/examples/tests/log-test/index.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 const root = await tgpu.init({
   unstable_logOptions: {
diff --git a/apps/typegpu-docs/src/examples/tests/texture-test/index.ts b/apps/typegpu-docs/src/examples/tests/texture-test/index.ts
index 4213bc3fb1..03830b1696 100644
--- a/apps/typegpu-docs/src/examples/tests/texture-test/index.ts
+++ b/apps/typegpu-docs/src/examples/tests/texture-test/index.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import { fullScreenTriangle } from 'typegpu/common';
+import tgpu, { common, d } from 'typegpu';
 
 const root = await tgpu.init();
 const canvas = document.querySelector('canvas') as HTMLCanvasElement;
@@ -116,7 +114,7 @@ function createPipelineForFormat(format: TestFormat) {
   });
 
   const pipeline = root['~unstable']
-    .withVertex(fullScreenTriangle)
+    .withVertex(common.fullScreenTriangle)
     .withFragment(fragmentFunction, { format: presentationFormat })
     .createPipeline();
 
diff --git a/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/array-and-struct-constructors.ts b/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/array-and-struct-constructors.ts
index d0e11e0499..a1d1f5fb44 100644
--- a/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/array-and-struct-constructors.ts
+++ b/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/array-and-struct-constructors.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 const SimpleStruct = d.struct({ vec: d.vec2f });
 const SimpleArray = d.arrayOf(d.i32, 2);
diff --git a/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/index.ts b/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/index.ts
index e87c91d49d..6ecde16923 100644
--- a/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/index.ts
+++ b/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/index.ts
@@ -1,5 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
+import tgpu, { d } from 'typegpu';
 import { arrayAndStructConstructorsTest } from './array-and-struct-constructors.ts';
 import { infixOperatorsTests } from './infix-operators.ts';
 import { logicalExpressionTests } from './logical-expressions.ts';
diff --git a/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/infix-operators.ts b/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/infix-operators.ts
index c65f95f1dd..474aa3eb3f 100644
--- a/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/infix-operators.ts
+++ b/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/infix-operators.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 const getVec = tgpu.fn([], d.vec3f)(() => d.vec3f(1, 2, 3));
 
diff --git a/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/logical-expressions.ts b/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/logical-expressions.ts
index 2e5aa04a26..cc1fce51e6 100644
--- a/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/logical-expressions.ts
+++ b/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/logical-expressions.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 const Schema = d.struct({
   vec2b: d.vec2b,
diff --git a/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/matrix-ops.ts b/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/matrix-ops.ts
index 5694ae0b44..c90a67f508 100644
--- a/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/matrix-ops.ts
+++ b/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/matrix-ops.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 // TODO: replace `s = s &&` with `s &&=` when implemented
 export const matrixOpsTests = tgpu.fn([], d.bool)(() => {
diff --git a/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/pointers.ts b/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/pointers.ts
index 9c6b1fdbc0..b2e9d3e336 100644
--- a/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/pointers.ts
+++ b/apps/typegpu-docs/src/examples/tests/tgsl-parsing-test/pointers.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 const SimpleStruct = d.struct({ vec: d.vec2f });
 
diff --git a/apps/typegpu-docs/src/examples/tests/wgsl-resolution/index.ts b/apps/typegpu-docs/src/examples/tests/wgsl-resolution/index.ts
index 25de40e497..523eea1750 100644
--- a/apps/typegpu-docs/src/examples/tests/wgsl-resolution/index.ts
+++ b/apps/typegpu-docs/src/examples/tests/wgsl-resolution/index.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 const root = await tgpu.init();
 
diff --git a/apps/typegpu-docs/src/examples/threejs/attractors/index.ts b/apps/typegpu-docs/src/examples/threejs/attractors/index.ts
index 759359b004..3ab5ca1155 100644
--- a/apps/typegpu-docs/src/examples/threejs/attractors/index.ts
+++ b/apps/typegpu-docs/src/examples/threejs/attractors/index.ts
@@ -11,8 +11,7 @@ import {
 } from 'three/addons/controls/TransformControls.js';
 import { color, uniform } from 'three/tsl';
 import * as THREE from 'three/webgpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 
 const canvas = document.querySelector('canvas') as HTMLCanvasElement;
 
diff --git a/apps/typegpu-docs/src/examples/threejs/compute-cloth/index.ts b/apps/typegpu-docs/src/examples/threejs/compute-cloth/index.ts
index 1ccaffd9fe..68c6987833 100644
--- a/apps/typegpu-docs/src/examples/threejs/compute-cloth/index.ts
+++ b/apps/typegpu-docs/src/examples/threejs/compute-cloth/index.ts
@@ -2,11 +2,9 @@
  * Based on: https://github.com/mrdoob/three.js/blob/dev/examples/webgpu_compute_cloth.html
  */
 
-import * as d from 'typegpu/data';
+import { d, std } from 'typegpu';
 import * as THREE from 'three/webgpu';
 import * as t3 from '@typegpu/three';
-import * as std from 'typegpu/std';
-
 import * as TSL from 'three/tsl';
 
 import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
diff --git a/apps/typegpu-docs/src/examples/threejs/compute-cloth/triNoise.ts b/apps/typegpu-docs/src/examples/threejs/compute-cloth/triNoise.ts
index 6fb1e71992..f217af49d6 100644
--- a/apps/typegpu-docs/src/examples/threejs/compute-cloth/triNoise.ts
+++ b/apps/typegpu-docs/src/examples/threejs/compute-cloth/triNoise.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 const tri = (x: number): number => {
   'use gpu';
diff --git a/apps/typegpu-docs/src/examples/threejs/compute-cloth/verlet.ts b/apps/typegpu-docs/src/examples/threejs/compute-cloth/verlet.ts
index 96d4f76b06..dc63c20db4 100644
--- a/apps/typegpu-docs/src/examples/threejs/compute-cloth/verlet.ts
+++ b/apps/typegpu-docs/src/examples/threejs/compute-cloth/verlet.ts
@@ -1,7 +1,6 @@
 import * as t3 from '@typegpu/three';
 import * as THREE from 'three/webgpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 import { triNoise3D } from './triNoise.ts';
 
 export type Vertex = {
diff --git a/apps/typegpu-docs/src/examples/threejs/compute-geometry/index.ts b/apps/typegpu-docs/src/examples/threejs/compute-geometry/index.ts
index 8a3f09ab55..5a9a290ef9 100644
--- a/apps/typegpu-docs/src/examples/threejs/compute-geometry/index.ts
+++ b/apps/typegpu-docs/src/examples/threejs/compute-geometry/index.ts
@@ -6,8 +6,7 @@ import * as TSL from 'three/tsl';
 import { type GLTF, GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
 import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
 import * as t3 from '@typegpu/three';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 
 const canvas = document.querySelector('canvas') as HTMLCanvasElement;
 const renderer = new THREE.WebGPURenderer({ canvas, antialias: true });
diff --git a/apps/typegpu-docs/src/examples/threejs/compute-particles-snow/entities.ts b/apps/typegpu-docs/src/examples/threejs/compute-particles-snow/entities.ts
index c187427042..e8bf859caa 100644
--- a/apps/typegpu-docs/src/examples/threejs/compute-particles-snow/entities.ts
+++ b/apps/typegpu-docs/src/examples/threejs/compute-particles-snow/entities.ts
@@ -3,8 +3,7 @@ import * as TSL from 'three/tsl';
 import { TeapotGeometry } from 'three/addons/geometries/TeapotGeometry.js';
 
 import * as t3 from '@typegpu/three';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 
 export const dirLight = (() => {
   const dirLight = new THREE.DirectionalLight(0xf9ff9b, 9);
diff --git a/apps/typegpu-docs/src/examples/threejs/compute-particles-snow/index.ts b/apps/typegpu-docs/src/examples/threejs/compute-particles-snow/index.ts
index d698849317..3e97c7eeba 100644
--- a/apps/typegpu-docs/src/examples/threejs/compute-particles-snow/index.ts
+++ b/apps/typegpu-docs/src/examples/threejs/compute-particles-snow/index.ts
@@ -7,8 +7,7 @@ import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
 import { gaussianBlur } from 'three/addons/tsl/display/GaussianBlurNode.js';
 
 import * as t3 from '@typegpu/three';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu';
 import { randf } from '@typegpu/noise';
 
 import * as e from './entities.ts';
diff --git a/apps/typegpu-docs/src/examples/threejs/compute-particles/index.ts b/apps/typegpu-docs/src/examples/threejs/compute-particles/index.ts
index 5a38a5850d..2ed38cf462 100644
--- a/apps/typegpu-docs/src/examples/threejs/compute-particles/index.ts
+++ b/apps/typegpu-docs/src/examples/threejs/compute-particles/index.ts
@@ -5,8 +5,7 @@ import * as THREE from 'three/webgpu';
 import * as TSL from 'three/tsl';
 import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
 import * as t3 from '@typegpu/three';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import { d, std } from 'typegpu/data';
 import { randf } from '@typegpu/noise';
 
 const canvas = document.querySelector('canvas') as HTMLCanvasElement;
diff --git a/apps/typegpu-docs/src/examples/threejs/simple/index.ts b/apps/typegpu-docs/src/examples/threejs/simple/index.ts
index 9692011d13..add4cd520f 100644
--- a/apps/typegpu-docs/src/examples/threejs/simple/index.ts
+++ b/apps/typegpu-docs/src/examples/threejs/simple/index.ts
@@ -2,8 +2,7 @@ import * as THREE from 'three/webgpu';
 import * as TSL from 'three/tsl';
 import * as t3 from '@typegpu/three';
 import { perlin3d } from '@typegpu/noise';
-import * as d from 'typegpu/data';
-import { tanh } from 'typegpu/std';
+import { d, std } from 'typegpu';
 
 const canvas = document.querySelector('canvas') as HTMLCanvasElement;
 
@@ -26,7 +25,7 @@ material.colorNode = t3.toTSL(() => {
   'use gpu';
   const coords = t3.uv().$.mul(2);
   const pattern = perlin3d.sample(d.vec3f(coords, t3.time.$ * 0.2));
-  return d.vec4f(tanh(pattern * 5), 0.2, 0.4, 1);
+  return d.vec4f(std.tanh(pattern * 5), 0.2, 0.4, 1);
 });
 
 // Undulating vertices
diff --git a/apps/typegpu-docs/src/examples/threejs/test-mismatched-types/index.ts b/apps/typegpu-docs/src/examples/threejs/test-mismatched-types/index.ts
index f362789329..e8001b4880 100644
--- a/apps/typegpu-docs/src/examples/threejs/test-mismatched-types/index.ts
+++ b/apps/typegpu-docs/src/examples/threejs/test-mismatched-types/index.ts
@@ -1,7 +1,7 @@
 import * as t3 from '@typegpu/three';
 import { instancedArray, uniform, uniformArray } from 'three/tsl';
 import * as THREE from 'three/webgpu';
-import * as d from 'typegpu/data';
+import { d } from 'typegpu';
 
 // THREE.TSL.struct, array
 
diff --git a/apps/typegpu-docs/src/examples/threejs/test-reused-functions/functions.ts b/apps/typegpu-docs/src/examples/threejs/test-reused-functions/functions.ts
index 12843410f8..650cbda179 100644
--- a/apps/typegpu-docs/src/examples/threejs/test-reused-functions/functions.ts
+++ b/apps/typegpu-docs/src/examples/threejs/test-reused-functions/functions.ts
@@ -1,6 +1,4 @@
-import tgpu from 'typegpu';
-import * as d from 'typegpu/data';
-import * as std from 'typegpu/std';
+import tgpu, { d, std } from 'typegpu';
 
 export const getColorA = () => {
   'use gpu';
diff --git a/packages/typegpu/tests/accessor.test.ts b/packages/typegpu/tests/accessor.test.ts
index 26bec93403..6df02d7686 100644
--- a/packages/typegpu/tests/accessor.test.ts
+++ b/packages/typegpu/tests/accessor.test.ts
@@ -1,8 +1,6 @@
 /** biome-ignore-all lint/style/noNonNullAssertion: it's useful for array access */
 import { describe, expect } from 'vitest';
-import * as d from '../src/data/index.ts';
-import * as std from '../src/std/index.ts';
-import tgpu from '../src/index.ts';
+import { d, std, tgpu } from '../src/index.ts';
 import { it } from './utils/extendedIt.ts';
 
 const RED = d.vec3f(1, 0, 0);
diff --git a/packages/typegpu/tests/align.test.ts b/packages/typegpu/tests/align.test.ts
index c5a90cde4e..b9242eb747 100644
--- a/packages/typegpu/tests/align.test.ts
+++ b/packages/typegpu/tests/align.test.ts
@@ -1,7 +1,5 @@
 import { describe, expect, expectTypeOf, it } from 'vitest';
-import { alignmentOf } from '../src/data/alignmentOf.ts';
-import * as d from '../src/data/index.ts';
-import tgpu from '../src/index.ts';
+import { d, tgpu } from '../src/index.ts';
 
 describe('d.align', () => {
   it('adds @align attribute for custom aligned struct members', () => {
@@ -18,7 +16,7 @@ describe('d.align', () => {
 
   it('changes alignment of a struct containing aligned member', () => {
     expect(
-      alignmentOf(
+      d.alignmentOf(
         d.struct({
           a: d.u32,
           b: d.u32,
@@ -28,7 +26,7 @@ describe('d.align', () => {
     ).toBe(4);
 
     expect(
-      alignmentOf(
+      d.alignmentOf(
         d.struct({
           a: d.u32,
           b: d.align(16, d.u32),
diff --git a/packages/typegpu/tests/array.test.ts b/packages/typegpu/tests/array.test.ts
index e8220da979..2d9ad23fa9 100644
--- a/packages/typegpu/tests/array.test.ts
+++ b/packages/typegpu/tests/array.test.ts
@@ -2,8 +2,7 @@ import { attest } from '@ark/attest';
 import { BufferReader, BufferWriter } from 'typed-binary';
 import { describe, expect, expectTypeOf, it } from 'vitest';
 import { readData, writeData } from '../src/data/dataIO.ts';
-import * as d from '../src/data/index.ts';
-import tgpu from '../src/index.ts';
+import { d, tgpu } from '../src/index.ts';
 import { namespace } from '../src/core/resolve/namespace.ts';
 import { resolve } from '../src/resolutionCtx.ts';
 import type { Infer } from '../src/shared/repr.ts';
diff --git a/packages/typegpu/tests/attributes.test.ts b/packages/typegpu/tests/attributes.test.ts
index 9af1770335..0a2e7274b0 100644
--- a/packages/typegpu/tests/attributes.test.ts
+++ b/packages/typegpu/tests/attributes.test.ts
@@ -1,6 +1,5 @@
 import { describe, expect, expectTypeOf, it } from 'vitest';
-import * as d from '../src/data/index.ts';
-import tgpu from '../src/index.ts';
+import { d, tgpu } from '../src/index.ts';
 
 describe('attributes', () => {
   it('adds attributes in the correct order', () => {
diff --git a/packages/typegpu/tests/bindGroupLayout.test.ts b/packages/typegpu/tests/bindGroupLayout.test.ts
index 6ee5ce6c70..1a5845f773 100644
--- a/packages/typegpu/tests/bindGroupLayout.test.ts
+++ b/packages/typegpu/tests/bindGroupLayout.test.ts
@@ -1,6 +1,7 @@
 import { beforeEach, describe, expect, expectTypeOf } from 'vitest';
-import * as d from '../src/data/index.ts';
-import tgpu, {
+import {
+  d,
+  tgpu,
   type TgpuBindGroupLayout,
   type TgpuBuffer,
   type TgpuBufferMutable,
diff --git a/packages/typegpu/tests/bufferUsage.test.ts b/packages/typegpu/tests/bufferUsage.test.ts
index f619c91013..c88b1a933a 100644
--- a/packages/typegpu/tests/bufferUsage.test.ts
+++ b/packages/typegpu/tests/bufferUsage.test.ts
@@ -1,8 +1,6 @@
 import { describe, expect, expectTypeOf } from 'vitest';
 
-import tgpu from '../src/index.ts';
-
-import * as d from '../src/data/index.ts';
+import { d, tgpu } from '../src/index.ts';
 import type { Infer } from '../src/shared/repr.ts';
 import { it } from './utils/extendedIt.ts';
 
diff --git a/packages/typegpu/tests/computePipeline.test.ts b/packages/typegpu/tests/computePipeline.test.ts
index f83661af96..276252a51d 100644
--- a/packages/typegpu/tests/computePipeline.test.ts
+++ b/packages/typegpu/tests/computePipeline.test.ts
@@ -1,8 +1,9 @@
 import { describe, expect, expectTypeOf, vi } from 'vitest';
 import type { TgpuQuerySet } from '../src/core/querySet/querySet.ts';
-import * as d from '../src/data/index.ts';
-import tgpu, {
+import {
+  d,
   MissingBindGroupsError,
+  tgpu,
   type TgpuComputePipeline,
 } from '../src/index.ts';
 import { $internal } from '../src/shared/symbols.ts';
diff --git a/packages/typegpu/tests/constant.test.ts b/packages/typegpu/tests/constant.test.ts
index f5dffb0638..4f464c78df 100644
--- a/packages/typegpu/tests/constant.test.ts
+++ b/packages/typegpu/tests/constant.test.ts
@@ -1,6 +1,5 @@
 import { describe, expect, it } from 'vitest';
-import * as d from '../src/data/index.ts';
-import tgpu from '../src/index.ts';
+import { d, tgpu } from '../src/index.ts';
 
 const Boid = d.struct({
   pos: d.vec3f,
diff --git a/packages/typegpu/tests/data/ptr.test.ts b/packages/typegpu/tests/data/ptr.test.ts
index 9e175031b5..bd2f8c4616 100644
--- a/packages/typegpu/tests/data/ptr.test.ts
+++ b/packages/typegpu/tests/data/ptr.test.ts
@@ -1,6 +1,5 @@
 import { describe, expect, expectTypeOf, it } from 'vitest';
-import * as d from '../../src/data/index.ts';
-import tgpu from '../../src/index.ts';
+import { d, tgpu } from '../../src/index.ts';
 
 describe('d.ptrFn', () => {
   it('wraps a schema and infers type properly', () => {
diff --git a/packages/typegpu/tests/declare.test.ts b/packages/typegpu/tests/declare.test.ts
index 3985550671..3e292aadc9 100644
--- a/packages/typegpu/tests/declare.test.ts
+++ b/packages/typegpu/tests/declare.test.ts
@@ -1,6 +1,5 @@
 import { describe, expect, it } from 'vitest';
-import * as d from '../src/data/index.ts';
-import tgpu from '../src/index.ts';
+import { d, tgpu } from '../src/index.ts';
 
 describe('tgpu.declare', () => {
   it('should inject provided declaration when resolving a function', () => {
diff --git a/packages/typegpu/tests/examples/individual/oklab.test.ts b/packages/typegpu/tests/examples/individual/oklab.test.ts
index 2d4a8f9dc7..1d8292d8f9 100644
--- a/packages/typegpu/tests/examples/individual/oklab.test.ts
+++ b/packages/typegpu/tests/examples/individual/oklab.test.ts
@@ -17,26 +17,28 @@ describe('oklab example', () => {
     }, device);
 
     expect(shaderCodes).toMatchInlineSnapshot(`
-      "struct fullScreenTriangle_Output {
+      "struct fullScreenTriangle_Input {
+        @builtin(vertex_index) vertexIndex: u32,
+      }
+
+      struct fullScreenTriangle_Output {
         @builtin(position) pos: vec4f,
         @location(0) uv: vec2f,
       }
 
-      struct fullScreenTriangle_Input {
-        @builtin(vertex_index) vertexIndex: u32,
-      }
+      @vertex fn fullScreenTriangle(in: fullScreenTriangle_Input) -> fullScreenTriangle_Output {
+        const pos = array<vec2f, 3>(vec2f(-1, -1), vec2f(3, -1), vec2f(-1, 3));
+        const uv = array<vec2f, 3>(vec2f(0, 1), vec2f(2, 1), vec2f(0, -1));
 
-      @vertex fn fullScreenTriangle(input: fullScreenTriangle_Input) -> fullScreenTriangle_Output {
-        var pos = array<vec2f, 3>(vec2f(-1), vec2f(3, -1), vec2f(-1, 3));
-        return fullScreenTriangle_Output(vec4f(pos[input.vertexIndex], 0f, 1f), pos[input.vertexIndex]);
+        return fullScreenTriangle_Output(vec4f(pos[in.vertexIndex], 0, 1), uv[in.vertexIndex]);
       }
 
-      struct Uniforms {
+      struct item {
         hue: f32,
         alpha: f32,
       }
 
-      @group(0) @binding(0) var<uniform> uniforms: Uniforms;
+      @group(0) @binding(0) var<uniform> uniforms: item;
 
       fn scaleView(pos: vec2f) -> vec2f {
         return vec2f((0.3f * pos.x), (((pos.y * 1.2f) + 1f) * 0.5f));
@@ -217,7 +219,7 @@ describe('oklab example', () => {
         return linearToSrgb(oklabToLinearRgb(gamutClipAdaptiveL05(lab)));
       }
 
-      fn item(_arg_0: vec2f, _arg_1: vec3f) -> f32 {
+      fn item_1(_arg_0: vec2f, _arg_1: vec3f) -> f32 {
         return 1f;
       }
 
@@ -226,15 +228,17 @@ describe('oklab example', () => {
       }
 
       @fragment fn mainFragment(input: mainFragment_Input) -> @location(0) vec4f {
+        var uv = ((input.uv - 0.5) * vec2f(2, -2));
         let hue = uniforms.hue;
-        var pos = scaleView(input.uv);
-        var lab = vec3f(pos.y, (pos.x * vec2f(cos(hue), sin(hue))));
+        var pos = scaleView(uv);
+        var yzDir = vec2f(cos(hue), sin(hue));
+        var lab = vec3f(pos.y, (yzDir * pos.x));
         var rgb = oklabToLinearRgb(lab);
         let outOfGamut = (any((rgb < vec3f())) || any((rgb > vec3f(1))));
         var clipLab = gamutClipAdaptiveL05(lab);
         var color = oklabToRgb(lab);
-        let patternScaled = ((item(input.uv, clipLab) * 0.1f) + 0.9f);
-        return vec4f(select(color, (patternScaled * color), outOfGamut), 1f);
+        let patternScaled = ((item_1(uv, clipLab) * 0.1f) + 0.9f);
+        return vec4f(select(color, (color * patternScaled), outOfGamut), 1f);
       }"
     `);
   });

From a67f9cfc7df6f617b795ba74c4cbc14e9bba9fa8 Mon Sep 17 00:00:00 2001
From: Iwo Plaza <iwoplaza@gmail.com>
Date: Fri, 16 Jan 2026 16:10:10 +0100
Subject: [PATCH 5/6] Update index.ts

---
 .../src/examples/threejs/compute-particles/index.ts             | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/typegpu-docs/src/examples/threejs/compute-particles/index.ts b/apps/typegpu-docs/src/examples/threejs/compute-particles/index.ts
index 2ed38cf462..d8ded2e1a3 100644
--- a/apps/typegpu-docs/src/examples/threejs/compute-particles/index.ts
+++ b/apps/typegpu-docs/src/examples/threejs/compute-particles/index.ts
@@ -5,7 +5,7 @@ import * as THREE from 'three/webgpu';
 import * as TSL from 'three/tsl';
 import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
 import * as t3 from '@typegpu/three';
-import { d, std } from 'typegpu/data';
+import { d, std } from 'typegpu';
 import { randf } from '@typegpu/noise';
 
 const canvas = document.querySelector('canvas') as HTMLCanvasElement;

From 57f07c00464c571e3f56667e3204bad078ad1e27 Mon Sep 17 00:00:00 2001
From: Iwo Plaza <iwoplaza@gmail.com>
Date: Fri, 16 Jan 2026 16:17:16 +0100
Subject: [PATCH 6/6] Update buffers.mdx

---
 apps/typegpu-docs/src/content/docs/fundamentals/buffers.mdx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/typegpu-docs/src/content/docs/fundamentals/buffers.mdx b/apps/typegpu-docs/src/content/docs/fundamentals/buffers.mdx
index 0a5d704a88..07b6ed5fe2 100644
--- a/apps/typegpu-docs/src/content/docs/fundamentals/buffers.mdx
+++ b/apps/typegpu-docs/src/content/docs/fundamentals/buffers.mdx
@@ -147,7 +147,7 @@ You can also pass an initial value to the `root.createBuffer` function.
 When the buffer is created, it will be mapped at creation, and the initial value will be written to the buffer.
 
 ```ts twoslash
-import tgpu. { d } from 'typegpu';
+import tgpu, { d } from 'typegpu';
 const root = await tgpu.init();
 // ---cut---
 // Will be initialized to `100`