Skip to content

FE-43: Add alternative OBB and polar distance map filters for refractive#8552

Draft
kube wants to merge 7 commits intomainfrom
cf/fe-43-refractive-make-svg-filter-use-objectboundingbox
Draft

FE-43: Add alternative OBB and polar distance map filters for refractive#8552
kube wants to merge 7 commits intomainfrom
cf/fe-43-refractive-make-svg-filter-use-objectboundingbox

Conversation

@kube
Copy link
Collaborator

@kube kube commented Mar 15, 2026

🌟 What is the purpose of this PR?

🔗 Related links

  • ...

🚫 Blocked by

  • ...

🔍 What does this change?

  • ...

Pre-Merge Checklist 🚀

🚢 Has this modified a publishable library?

This PR:

  • does not modify any publishable blocks or libraries, or modifications do not need publishing
  • modifies an npm-publishable library and I have added a changeset file(s)
  • modifies a Cargo-publishable library and I have amended the version
  • modifies a Cargo-publishable library, but it is not yet ready to publish
  • modifies a block that will need publishing via GitHub action once merged
  • I am unsure / need advice

📜 Does this require a change to the docs?

The changes in this PR:

  • are internal and do not require a docs change
  • are in a state where docs changes are not yet required but will be
  • require changes to docs which are made as part of this PR
  • require changes to docs which are not made in this PR
    • Provide more detail here
  • I am unsure / need advice

🕸️ Does this require a change to the Turbo Graph?

The changes in this PR:

  • do not affect the execution graph
  • affected the execution graph, and the turbo.json's have been updated to reflect this
  • I am unsure / need advice

⚠️ Known issues

🐾 Next steps

🛡 What tests cover this?

❓ How to test this?

  1. Checkout the branch / view the deployment
  2. Try X
  3. Confirm that Y

📹 Demo

@vercel
Copy link

vercel bot commented Mar 15, 2026 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
hash Ready Ready Preview, Comment Mar 19, 2026 5:31pm
hashdotdesign Ready Ready Preview, Comment Mar 19, 2026 5:31pm
petrinaut Ready Ready Preview, Comment Mar 19, 2026 5:31pm
1 Skipped Deployment
Project Deployment Actions Updated (UTC)
hashdotdesign-tokens Ignored Ignored Preview Mar 19, 2026 5:31pm

@github-actions github-actions bot added area/libs Relates to first-party libraries/crates/packages (area) type/eng > frontend Owned by the @frontend team area/apps > hash.design Affects the `hash.design` design site (app) labels Mar 15, 2026
@kube Graphite App
Copy link
Collaborator Author

kube commented Mar 15, 2026 •
edited
Loading

This stack of pull requests is managed by Graphite. Learn more about stacking.

@kube kube mentioned this pull request Mar 15, 2026
Merged
3 tasks
@kube kube force-pushed the cf/fe-518-add-storybook-and-update-build-setup branch from 4c2a6f1 to 4c01fe1 Compare March 17, 2026 01:29
@kube kube force-pushed the cf/fe-43-refractive-make-svg-filter-use-objectboundingbox branch from ba63941 to 9266132 Compare March 17, 2026 01:29
@kube kube force-pushed the cf/fe-43-refractive-make-svg-filter-use-objectboundingbox branch from 9266132 to 5a5c7c2 Compare March 17, 2026 13:35
@kube kube force-pushed the cf/fe-518-add-storybook-and-update-build-setup branch from 4c01fe1 to 3cbf28d Compare March 17, 2026 13:35
@kube kube changed the base branch from cf/fe-518-add-storybook-and-update-build-setup to graphite-base/8552 March 17, 2026 14:18
@kube kube force-pushed the cf/fe-43-refractive-make-svg-filter-use-objectboundingbox branch from 5a5c7c2 to dccbe1b Compare March 17, 2026 15:02
@kube kube force-pushed the graphite-base/8552 branch from a079f04 to 32992dd Compare March 17, 2026 15:07
@kube kube force-pushed the cf/fe-43-refractive-make-svg-filter-use-objectboundingbox branch from dccbe1b to 80a2296 Compare March 17, 2026 15:07
@graphite-app graphite-app bot changed the base branch from graphite-base/8552 to cf/fe-518-add-storybook-and-update-build-setup March 17, 2026 15:07
@kube kube force-pushed the cf/fe-43-refractive-make-svg-filter-use-objectboundingbox branch from 80a2296 to 2d6282e Compare March 17, 2026 15:07
Base automatically changed from cf/fe-518-add-storybook-and-update-build-setup to main March 17, 2026 15:54
@kube kube force-pushed the cf/fe-43-refractive-make-svg-filter-use-objectboundingbox branch from 2d6282e to 0fb2e60 Compare March 17, 2026 16:03
kube and others added 4 commits March 19, 2026 02:07
@kube @claude
FE-43: Add alternative OBB and polar distance map filters for refractive
45978a5 
Add experimental filter variants that use objectBoundingBox sizing
(no ResizeObserver needed) via composite SVG data URLs, and a polar
distance map encoding displacement as (distance, angle) channels.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@kube
PARTIAL
3da3a88
@kube @claude
FE-518: Update stories to use renamed camelCase surface equation exports
a8d8a1f 
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@kube @claude
FE-43: Add switchable background to filter stories
cb7b082 
Default background is now the scrollable ExampleArticle with a sticky
glass overlay. A "background" radio control lets you switch to the
checkerboard pattern.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@kube kube force-pushed the cf/fe-43-refractive-make-svg-filter-use-objectboundingbox branch from 0fb2e60 to cb7b082 Compare March 19, 2026 01:07
hash and others added 3 commits March 19, 2026 15:12
@claude
FE-43: Implement polar coordinate indirection filter and remove specular
6d29d68 
Add FilterPolar with SVG filter math to decouple shape geometry from
optical parameters. The geometric polar map (distance ratio + angle) is
rasterized once per shape, then Snell's law refraction is applied via
feComponentTransfer lookup tables and polar-to-cartesian conversion uses
feColorMatrix + feComposite arithmetic signed multiplication.

Remove specular props and computation from all filter components (Filter,
FilterOBB, FilterPolar) and the refractive HOC. Add filter evolution
roadmap to CLAUDE.md.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@claude
FE-43: Fix hardcoded borderRadius in filter stories
8c47333 
The GlassPane had borderRadius: 20 hardcoded, causing the CSS border
radius to drift from the filter's radius when adjusted via controls.
Now the radius prop flows through FilterShowcase to GlassPane.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@claude
FE-43: Add hi-res single-image polar filter
6a4fb20 
FilterPolarHiRes pre-computes a 513×513 geometric polar map once at
module load and reuses it for any radius. On render, only cheap string
operations run (SVG composite URL + magnitude lookup table). The bezel
width always equals the radius.

Export buildCompositeSvgUrl from composite-image so the hi-res filter
can split at reference resolution but position at actual radius.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@github-actions github-actions bot added the area/infra Relates to version control, CI, CD or IaC (area) label Mar 19, 2026
@CLAassistant
Copy link

CLAassistant commented Mar 19, 2026

CLA assistant check
Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you all sign our Contributor License Agreement before we can accept your contribution.
1 out of 2 committers have signed the CLA.

✅ kube
❌ hash

hash seems not to be a GitHub user. You need a GitHub account to be able to sign the CLA. If you have already a GitHub account, please add the email address used for this commit to your account.
You have signed the CLA already but the status is still pending? Let us recheck it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

@kube kube

Labels

area/apps > hash.design Affects the `hash.design` design site (app) area/infra Relates to version control, CI, CD or IaC (area) area/libs Relates to first-party libraries/crates/packages (area) type/eng > frontend Owned by the @frontend team

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@kube @CLAassistant