Skip to content

feat: Tile.tsx: add a <div> element wrapper to tileContent to separate it from other nodes and enable passing down className #974

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 12 commits into
base: main
Choose a base branch
from

Conversation

alexrah
Copy link

@alexrah alexrah commented Feb 18, 2025

In the component when using tileContent prop to inject multiple content inside a Tile, can be useful to have a wrapper element to separate the injected content from the default children nodes.
Moreover, having a wrapper allow to customize styling by passing down classNames to it

this is an example rendered Tile.tsx

<button class="react-calendar__tile react-calendar__tile--active react-calendar__tile--range react-calendar__tile--rangeStart react-calendar__tile--rangeEnd react-calendar__tile--rangeBothEnds react-calendar__month-view__days__day" style="flex: 0 0 14.2857%; overflow: hidden; margin-inline-end: 0px;" type="button">
<abbr aria-label="February 20, 2025">20</abbr>
<!-- wrapper -->
<div class="absolute flex gap-0.5">
<!-- added by TileContent -->
<span class="rounded-full w-2 h-2 block" style="background-color: rgb(163, 29, 24);"></span>
<!-- added by TileContent -->
<span class="rounded-full w-2 h-2 block" style="background-color: rgb(219, 89, 40);"></span>
</div>
</button>

wojtekmaj and others added 12 commits December 20, 2024 00:04
Bumps [nanoid](https://github.com/ai/nanoid) from 3.3.7 to 3.3.8.
- [Release notes](https://github.com/ai/nanoid/releases)
- [Changelog](https://github.com/ai/nanoid/blob/main/CHANGELOG.md)
- [Commits](ai/nanoid@3.3.7...3.3.8)

---
updated-dependencies:
- dependency-name: nanoid
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
…WrapperClassName to pass className to tileContent <div> wrapper
…eContentWrapperClassName to pass down to Tile and define className for tileContent <div> wrap
@alexrah
Copy link
Author

alexrah commented Apr 14, 2025

Can someone at least provide some feedback on this? It doesn't seem like something requiring too much testing and it greatly simplify customization on tileContent

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants