Fix Charts text backdrop on Safari

[tannerlinsley]

Safari can render the text backdrop as a hard-edged blob because the canvas blur used to feather its mask is unavailable. Detect canvas filter support before generating the mask and use a feathered radial white or black backdrop when it is missing.

Browsers with canvas blur support keep the existing text-shaped backdrop. Verified both rendering paths on a mobile viewport by disabling canvas filter support, and ran the required checks.

[changeset-bot]

⚠️ No Changeset found

Latest commit: f35578f

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[coderabbitai]

Note

Currently processing new changes in this PR. This may take a few minutes, please wait...

⚙️ Run configuration

• Configuration used: defaults
• Review profile: CHILL
• Plan: Advanced
• Run ID: a815a452-5f89-42ee-94fe-b8015144659e

📥 Commits

Reviewing files that changed from the base of the PR and between e36d5f3 and f35578f.

📒 Files selected for processing (1)

• src/components/landing/ChartsTextBackdrop.tsx

 __________________________
< // TODO: Find more bugs. >
 --------------------------
  \
   \   \
        \ /\
        ( )
      .( o ).

✨ Finishing Touches

📝 Generate docstrings

• Commit to this branch
• Create a new PR

🧪 Generate unit tests (beta)

• Commit to this branch
• Create a new PR

• Autopilot · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}