feat: add theme option for today in datepicker #1627

jonasho · 2025-09-18T12:09:48Z

I have followed the Your First Code Contribution section of the Contributing guide

Updated Days.tsx to detect the current day and apply a theme attribute, giving users an easy reference.

Summary by CodeRabbit

New Features
- Datepicker component now supports theme customization for today's date. Developers can apply custom CSS styling to visually distinguish the current date from other dates in the calendar view, improving visual clarity and enabling consistent design implementation across applications.

changeset-bot · 2025-09-18T12:09:52Z

🦋 Changeset detected

Latest commit: 488f050

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
flowbite-react	Patch

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

vercel · 2025-09-18T12:09:53Z

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

Project	Deployment	Preview	Comments	Updated (UTC)
flowbite-react	Ready	Preview	Comment	Sep 18, 2025 0:12am
flowbite-react-storybook	Ready	Preview	Comment	Sep 18, 2025 0:12am

jonasho · 2025-09-18T12:17:51Z

The preview‑deployment docs don’t appear to include the new "today" key in the theme configuration. Is there anything missing that needs updating?

rluders · 2025-09-18T12:22:38Z

@jonasho Nope, forgot about it, I'm seeing it there. Mobile app for github is terrible. Where don't you see the today in the docs?

jonasho · 2025-09-18T12:25:47Z

@rluders—never mind, I found it. The search on the preview stage redirected me to the official site; I didn’t notice that earlier. Looks good now.

SutuSebastian

thanks for this!

only thing left to add is a changeset that bump the flowbite-react package as a patch.
u can do that by running bun changeset and the CLI will prompt to select the package first, then what version to bump, just press enter, patch is the last.

vercel · 2025-11-12T07:04:19Z

@jonasho is attempting to deploy a commit to the Themesberg Team on Vercel.

A member of the Team first needs to authorize it.

coderabbitai · 2025-11-12T07:04:25Z

Walkthrough

This PR introduces a new "today" theme option for the Datepicker component. It adds a helper function to identify today's date, extends the theme interface to include today styling, and applies the today class to the current date in the Days view.

Changes

Cohort / File(s)	Summary
Changeset entry `.changeset/curly-turtles-carry.md`	Documents a patch release for flowbite-react with the feature: "add theme option for today in datepicker."
Datepicker helper `packages/ui/src/components/Datepicker/helpers.ts`	Added new exported function `isDateToday(date: Date): boolean` that determines if a date equals today using the existing `isDateEqual` utility.
Datepicker theme `packages/ui/src/components/Datepicker/theme.ts`	Extended `DatepickerTheme` to include new `today` property (empty string) under `days.items.item` for styling the current date.
Datepicker Days view `packages/ui/src/components/Datepicker/Views/Days.tsx`	Imported `isDateToday` helper, expanded `DatepickerViewsDaysTheme` with `today` property, and applied conditional `today` class to date elements via `isToday && theme.items.item.today`.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Localized changes confined to the Datepicker component
Straightforward helper function logic using existing date comparison utilities
Consistent pattern of theme extension and conditional class application

Possibly related PRs

feat: Add 'filterDate' prop function on Datepicker #1587 — Modifies Datepicker Days view with filterDate-based logic; shares the same view file and related styling concerns.
fix(Datepicker): switch hardcoded color cyan -> primary #1579 — Modifies Datepicker theme properties; directly related to theme structure changes.

Suggested reviewers

rluders
SutuSebastian

Poem

🐰 Today shines bright in the picker's view,
With a helper so clever to know what's new,
Themes now bloom with a "today" so fine,
Making current days clearly align! ✨

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run `@coderabbitai generate docstrings` to improve docstring coverage.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The pull request title directly and clearly summarizes the main change: adding a theme option for the 'today' styling in the datepicker component.

✨ Finishing touches

📝 Generate docstrings

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 7b2e0e8 and 488f050.

📒 Files selected for processing (4)

.changeset/curly-turtles-carry.md (1 hunks)
packages/ui/src/components/Datepicker/Views/Days.tsx (4 hunks)
packages/ui/src/components/Datepicker/helpers.ts (1 hunks)
packages/ui/src/components/Datepicker/theme.ts (1 hunks)

🧰 Additional context used

🧠 Learnings (1)

📚 Learning: 2024-07-27T04:19:32.056Z

Learnt from: rluders
Repo: themesberg/flowbite-react PR: 1314
File: packages/ui/src/components/Datepicker/helpers.ts:112-119
Timestamp: 2024-07-27T04:19:32.056Z
Learning: The `getFormattedDate` function in `packages/ui/src/components/Datepicker/helpers.ts` should use `DateFNSFormat` directly with the date and format string for proper localization support, mapping language codes to locale objects from `date-fns/locale`.

Applied to files:

packages/ui/src/components/Datepicker/helpers.ts
packages/ui/src/components/Datepicker/Views/Days.tsx

🧬 Code graph analysis (1)

packages/ui/src/components/Datepicker/Views/Days.tsx (1)

packages/ui/src/components/Datepicker/helpers.ts (1)

isDateToday (47-50)

🔇 Additional comments (7)

.changeset/curly-turtles-carry.md (1)

1-5: LGTM!

The changeset properly documents this patch release feature addition.

packages/ui/src/components/Datepicker/helpers.ts (1)

47-50: LGTM!

The helper function is well-implemented and correctly reuses the existing isDateEqual utility. Using local timezone via new Date() is appropriate for a UI datepicker component where "today" is relative to the user's local time.

packages/ui/src/components/Datepicker/theme.ts (1)

52-52: LGTM!

The today theme property follows the library's pattern of providing empty string defaults, giving users full control over styling without imposing default classes. This is consistent with how other optional styling properties like disabled are handled.

packages/ui/src/components/Datepicker/Views/Days.tsx (4)

12-12: LGTM!

The isDateToday import is correctly added to the existing helper imports.

27-27: LGTM!

The theme interface is properly extended to include the today property, ensuring type safety.

67-67: LGTM!

The isToday computation is correctly placed alongside other day properties and properly uses the helper function to identify the current date.

74-79: LGTM!

The conditional class application is well-structured. The ordering (base → today → selected → disabled) ensures that selected and disabled states appropriately take precedence over the today indicator, which is the correct UX behavior.

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

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

feat: add theme option for today in datepicker

5d6c69b

vercel bot deployed to Preview – flowbite-react-storybook September 18, 2025 12:10 View deployment

vercel bot deployed to Preview – flowbite-react September 18, 2025 12:12 View deployment

rluders requested review from SutuSebastian and rluders September 18, 2025 12:13

rluders previously approved these changes Sep 18, 2025

View reviewed changes

SutuSebastian requested changes Oct 25, 2025

View reviewed changes

chore: update changeset

350e846

jonasho dismissed rluders’s stale review via 350e846 November 12, 2025 07:04

Merge branch 'main' into feature/datepicker-theme-today

488f050

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

feat: add theme option for today in datepicker #1627

feat: add theme option for today in datepicker #1627

Uh oh!

jonasho commented Sep 18, 2025 •

edited by coderabbitai bot

Loading

Uh oh!

changeset-bot bot commented Sep 18, 2025 •

edited

Loading

Uh oh!

vercel bot commented Sep 18, 2025 •

edited

Loading

Uh oh!

jonasho commented Sep 18, 2025

Uh oh!

rluders commented Sep 18, 2025

Uh oh!

jonasho commented Sep 18, 2025

Uh oh!

SutuSebastian left a comment

Uh oh!

vercel bot commented Nov 12, 2025

Uh oh!

coderabbitai bot commented Nov 12, 2025 •

edited

Loading

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Uh oh!

feat: add theme option for today in datepicker #1627

Are you sure you want to change the base?

feat: add theme option for today in datepicker #1627

Uh oh!

Conversation

jonasho commented Sep 18, 2025 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

changeset-bot bot commented Sep 18, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

vercel bot commented Sep 18, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jonasho commented Sep 18, 2025

Uh oh!

rluders commented Sep 18, 2025

Uh oh!

jonasho commented Sep 18, 2025

Uh oh!

SutuSebastian left a comment

Choose a reason for hiding this comment

Uh oh!

vercel bot commented Nov 12, 2025

Uh oh!

coderabbitai bot commented Nov 12, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested reviewers

Poem

Pre-merge checks and finishing touches

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

jonasho commented Sep 18, 2025 •

edited by coderabbitai bot

Loading

changeset-bot bot commented Sep 18, 2025 •

edited

Loading

vercel bot commented Sep 18, 2025 •

edited

Loading

coderabbitai bot commented Nov 12, 2025 •

edited

Loading