Skip to content

feat: integrate gl-react-blur into the monorepo#514

Merged
gre merged 1 commit into
masterfrom
feat/gl-react-blur
Jun 12, 2026
Merged

feat: integrate gl-react-blur into the monorepo#514
gre merged 1 commit into
masterfrom
feat/gl-react-blur

Conversation

@gre

@gre gre commented Jun 12, 2026

Copy link
Copy Markdown
Owner

Summary

Imports gre/gl-react-blur as packages/gl-react-blur, modernized to the current stack, and refactors the cookbook blur examples to consume it.

Package

  • Rewritten from Flow + Babel 6 to TypeScript on the gl-react v6 API: Blur, Blur1D, BlurV, BlurV1D, directionForPassDefault (+ exported prop types)
  • Components now use connectSize (size inherited from parent) instead of requiring explicit width/height, while keeping the original multi-pass API (factor, passes, directionForPass) — effectively merging the old library API with the proven implementations that lived in the cookbook
  • Version 6.0.0 like the family — published automatically on merge by changeset publish (version absent from npm)

Cookbook

The blur examples carried local copies of these exact components; they now import from gl-react-blur:

  • blurmulti and blurmap use the library directly (and gain a passes control)
  • blurimgtitle, blurmapdyn, blurvideo, blurmapmouse import Blur/Blur1D/BlurV from the package
  • blurxy intentionally keeps its educational inline implementation ("write your own blur")

Tests

  • New pixel test in the shared suite: blurring a constant color is a no-op (gaussian weights sum to 1) — 42/42 pass

⚠️ Before merging

Add gl-react-blur as a trusted publisher on npmjs.com (repo gre/gl-react, workflow publish.yml) — same step as gl-react-image, otherwise the Release workflow will fail to publish.

Verification

  • pnpm build + pnpm test: 42/42 ✅
  • Cookbook vite build ✅, examples reviewed locally on the dev server ✅

🤖 Generated with Claude Code
Copilot AI review requested due to automatic review settings June 12, 2026 21:11
@gre @claude
feat: integrate gl-react-blur into the monorepo
e19bade 
Imports https://github.com/gre/gl-react-blur as packages/gl-react-blur,
modernized from Flow/babel-6 to TypeScript on the gl-react v6 API:
Blur, Blur1D, BlurV, BlurV1D, directionForPassDefault. Components now
use connectSize (inheriting size from parent) instead of requiring
explicit width/height, while keeping the old multi-pass API
(factor, passes, directionForPass). Version 6.0.0 like the family;
published automatically on merge by changeset publish.

The cookbook blur examples consumed local copies of these components:
blurmulti, blurmap, blurimgtitle, blurmapdyn, blurvideo, blurmapmouse
now import from gl-react-blur (blurxy keeps its educational inline
implementation). blurmulti/blurmap gain a "passes" control.

Adds a Blur pixel test to the shared suite (blur of a constant color
is a no-op). Also gitignore packages/cookbook/dist (vite build output)
which was accidentally committed.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@gre gre force-pushed the feat/gl-react-blur branch from 64b8207 to e19bade Compare June 12, 2026 21:12
Copilot AI reviewed Jun 12, 2026
View reviewed changes

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR integrates gl-react-blur as a first-class package in the gl-react monorepo and refactors cookbook blur examples and the shared test suite to consume it.

Changes:

  • Added new workspace package packages/gl-react-blur (TypeScript) implementing multi-pass gaussian blur (Blur, Blur1D, BlurV, BlurV1D) plus directionForPassDefault.
  • Updated cookbook examples/config and the shared Jest suite to depend on and validate gl-react-blur.
  • Updated workspace TS references / path aliases and CI build loop to include the new package.

Reviewed changes

Copilot reviewed 23 out of 26 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
tsconfig.json Adds TS path alias + project reference for gl-react-blur.
pnpm-lock.yaml Adds workspace links and dependency entries for gl-react-blur.
packages/tests/package.json Adds gl-react-blur dependency for the shared test suite.
packages/tests/tests/all.js Adds a pixel test validating blur is a no-op on constant color.
packages/gl-react-blur/tsconfig.json New package TS project config (composite + declarations).
packages/gl-react-blur/src/index.ts Barrel exports for blur components + prop types.
packages/gl-react-blur/src/directionForPassDefault.ts Default pass-direction strategy for multi-pass blur.
packages/gl-react-blur/src/BlurV1D.tsx Variable-per-pixel (map-driven) single-pass blur shader node.
packages/gl-react-blur/src/BlurV.tsx Multi-pass variable blur composition over BlurV1D.
packages/gl-react-blur/src/Blur1D.tsx Single-pass blur shader node.
packages/gl-react-blur/src/Blur.tsx Multi-pass blur composition over Blur1D.
packages/gl-react-blur/README.md New package documentation and usage examples.
packages/gl-react-blur/package.json New publishable package metadata (v6.0.0, peers).
packages/gl-react-blur/LICENSE New package license file.
packages/cookbook/vite.config.ts Adds Vite alias for gl-react-blur source imports.
packages/cookbook/src/examples/index.ts Updates blur example descriptions and adds passes controls.
packages/cookbook/src/examples/blurvideo.tsx Switches to importing BlurV from gl-react-blur.
packages/cookbook/src/examples/blurmulti.tsx Refactors example to use gl-react-blur’s Blur.
packages/cookbook/src/examples/blurmapmouse.tsx Switches to importing BlurV from gl-react-blur.
packages/cookbook/src/examples/blurmapdyn.tsx Switches to importing BlurV from gl-react-blur.
packages/cookbook/src/examples/blurmap.tsx Removes inline implementation; imports BlurV from gl-react-blur.
packages/cookbook/src/examples/blurimgtitle.tsx Switches to importing blur components from gl-react-blur.
packages/cookbook/package.json Adds gl-react-blur dependency to the cookbook app.
packages/cookbook/dist/index.html Adds cookbook build output (generated).
packages/cookbook/dist/assets/webcampersistence-DTKA1VxG.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/webcampersistence-DTKA1VxG.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/webcam-BFHsfm3m.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/webcam-BFHsfm3m.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/video-DnVzELhf.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/video-DnVzELhf.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/transitions-CV95zkud.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/transitions-CV95zkud.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/textfunky-BaMJSZYx.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/textfunky-BaMJSZYx.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/textanimated-CQYi2T57.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/textanimated-CQYi2T57.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/sdf1-C43j1rFH.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/sdf1-C43j1rFH.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/saturation-s7btQp3v.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/saturation-s7btQp3v.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/reactmotion-CdWaQaoG.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/reactmotion-CdWaQaoG.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/pixeleditor-Bs02ibrG.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/paint-AtMLcNaE.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/paint-AtMLcNaE.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/NearestCopy-UkPh1q2L.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/NearestCopy-UkPh1q2L.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/mergechannelsfun-CIJqQgW6.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/mergechannelsfun-CIJqQgW6.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/mergechannels-DUluNz7h.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/mergechannels-DUluNz7h.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/index-gWmnG88S.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/index-gWmnG88S.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/imageresizemodes-CTOppAkB.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/imageresizemodes-CTOppAkB.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/imageeffects-BUTO8im4.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/imageeffects-BUTO8im4.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/hellogl-CXReOxmA.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/hellogl-CXReOxmA.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/helloblueanim-BWpuhNhv.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/helloblueanim-BWpuhNhv.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/helloblue-CpT6RYME.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/helloblue-CpT6RYME.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/heart-DK5WI53N.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/heart-DK5WI53N.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/gradients-BsMFsQRE.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/gradients-BsMFsQRE.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/golwebcam-CHK4Qolk.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/golwebcam-CHK4Qolk.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/golrotscu-CfeE_pnW.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/golrotscu-CfeE_pnW.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/golrot-DU5oHQf9.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/golrot-DU5oHQf9.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/golglider-CGun9ae4.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/golglider-CGun9ae4.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/gol-BUI8CiQw.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/gol-BUI8CiQw.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/glsledit-D-CP-XCP.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/glsledit-D-CP-XCP.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/distortion-B0XsU5Pn.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/distortion-B0XsU5Pn.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/diamondhello-CD4iwERY.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/diamondhello-CD4iwERY.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/diamondcrop-NLB1upqt.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/diamondcrop-NLB1upqt.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/diamondanim-C4O-4MOm.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/diamondanim-C4O-4MOm.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/demotunnel-vzIw_2kj.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/demotunnel-vzIw_2kj.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/connectSize-DzSerJBo.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/connectSize-DzSerJBo.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/colorscale-1aPJI18d.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/colorscale-1aPJI18d.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/colordisc-1aki_5rw.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/colordisc-1aki_5rw.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurxydownscale-B5GIWfAa.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurxydownscale-B5GIWfAa.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurxy-DKElCu_X.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurxy-DKElCu_X.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurvideo-BKo1TDph.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurvideo-BKo1TDph.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/BlurV-c2r3qIHH.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurmulti-DBMcNBQ9.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurmulti-DBMcNBQ9.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurmapmouse-B2RIip3y.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurmapmouse-B2RIip3y.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurmapdyn-CSpzxMtF.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurmapdyn-CSpzxMtF.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurmap-pxKMWvZg.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurmap-pxKMWvZg.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurimgtitle-CUAFJ9NY.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurimgtitle-CUAFJ9NY.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurfeedback-CrxVqKre.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/blurfeedback-CrxVqKre.js Cookbook build output (generated asset).
packages/cookbook/dist/assets/animated-Cy1RkPJC.js.map Cookbook build output (generated asset).
packages/cookbook/dist/assets/animated-Cy1RkPJC.js Cookbook build output (generated asset).
CLAUDE.md Documents the new gl-react-blur package in repo overview.
.github/workflows/ci-tests.yml Includes gl-react-blur in the CI build step.
Files not reviewed (1)
  • pnpm-lock.yaml: Generated file

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Comment thread packages/gl-react-blur/src/Blur.tsx
Comment on lines +23 to +38
({
children,
factor,
passes = 2,
directionForPass = directionForPassDefault,
}: any) => {
const rec = (pass: number): any =>
pass <= 0 ? (
children
) : (
<Blur1D direction={directionForPass(pass, factor, passes)}>
{rec(pass - 1)}
</Blur1D>
);
return rec(passes);
}
Comment thread packages/gl-react-blur/src/BlurV.tsx
Comment on lines +25 to +41
({
children,
factor,
map,
passes = 2,
directionForPass = directionForPassDefault,
}: any) => {
const rec = (pass: number): any =>
pass <= 0 ? (
children
) : (
<BlurV1D map={map} direction={directionForPass(pass, factor, passes)}>
{rec(pass - 1)}
</BlurV1D>
);
return rec(passes);
}
@gre gre merged commit c9d99e5 into master Jun 12, 2026
3 checks passed
@gre gre mentioned this pull request Jun 12, 2026
Merged
@gre gre deleted the feat/gl-react-blur branch June 24, 2026 11:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

2 participants

@gre