chore(clerk-js): Add borders to color inputs #6116
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
🦋 Changeset detectedLatest commit: b79babf The changes in this PR will be included in the next version bump. This PR includes changesets to release 0 packagesWhen changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
📝 WalkthroughWalkthroughA changeset file was added without content, and the HTML template in the sandbox was updated to apply a border styling class to all color input fields in the sidebar. No changes were made to exported or public entities. Changes
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
packages/clerk-js/sandbox/template.html (1)
308-407: Enhance focus states for accessibility.To improve keyboard navigation visibility, consider extending the class with a focus ring. Example diff:
- class="border border-gray-200" + class="border border-gray-200 focus:outline-none focus:ring-2 focus:ring-blue-500"
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
.changeset/tangy-garlics-say.md(1 hunks)packages/clerk-js/sandbox/template.html(12 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (5)
- GitHub Check: semgrep-cloud-platform/scan
- GitHub Check: Formatting | Dedupe | Changeset
- GitHub Check: Build Packages
- GitHub Check: semgrep/ci
- GitHub Check: Analyze (javascript-typescript)
🔇 Additional comments (1)
packages/clerk-js/sandbox/template.html (1)
308-407: Borders added to all color inputs.Applying
border border-gray-200ensures white color pickers are distinguishable and clickable in the sidebar. The change is consistent across all<input type="color">elements and aligns with the PR objective.
| --- | ||
| --- |
There was a problem hiding this comment.
Empty changeset file: missing content.
This changeset contains only the YAML delimiters without any summary or change type (patch, minor, or major). Please add a descriptive summary and specify the version bump type to ensure the release process picks up this change.
🤖 Prompt for AI Agents
In the file .changeset/tangy-garlics-say.md at lines 1 to 2, the changeset is
empty with only YAML delimiters present. Add a descriptive summary of the change
and specify the version bump type (patch, minor, or major) between the
delimiters to properly document the change and enable the release process to
recognize it.
There was a problem hiding this comment.
The empty changeset is intentional. This PR doesn't affect any of the files included in released versions of the packages.
There was a problem hiding this comment.
@dstaley Got it—thanks for clarifying. An empty changeset is perfectly valid here as a “no-release” indicator, so no action needed. I’ll keep this convention in mind to avoid flagging it in future reviews. 🐇💡
✏️ Learnings added
Learnt from: dstaley
PR: clerk/javascript#6116
File: .changeset/tangy-garlics-say.md:1-2
Timestamp: 2025-06-13T16:09:53.014Z
Learning: In the Clerk JavaScript repository, contributors create intentionally empty changeset files (containing only the YAML delimiters) when a PR touches only non-published parts of the codebase (e.g., sandbox assets). This signals that no package release is required, so such changesets should not be flagged as missing content.
Note: Learnings are effective only in the context of similar code segments. To apply general coding guidelines, please configure review instructions. You can manage existing learnings in the app.
@clerk/agent-toolkit
@clerk/astro
@clerk/backend
@clerk/chrome-extension
@clerk/clerk-js
@clerk/dev-cli
@clerk/elements
@clerk/clerk-expo
@clerk/expo-passkeys
@clerk/express
@clerk/fastify
@clerk/localizations
@clerk/nextjs
@clerk/nuxt
@clerk/clerk-react
@clerk/react-router
@clerk/remix
@clerk/shared
@clerk/tanstack-react-start
@clerk/testing
@clerk/themes
@clerk/types
@clerk/upgrade
@clerk/vue
commit: |
Description
This PR adds borders to the color inputs in the
clerk-jssandbox to make it easier to click on them when they use pure white (which is the default for a few of the colors).Checklist
pnpm testruns as expected.pnpm buildruns as expected.Type of change
Summary by CodeRabbit