Skip to content

Add selectionWrapper prop for customizable selection styling#2745

Open
LeeSeongJinCa wants to merge 3 commits into
bigcalendar:masterfrom
LeeSeongJinCa:feature/custom-selection
Open

Add selectionWrapper prop for customizable selection styling#2745
LeeSeongJinCa wants to merge 3 commits into
bigcalendar:masterfrom
LeeSeongJinCa:feature/custom-selection

Conversation

@LeeSeongJinCa
Copy link
Copy Markdown

Problem:
The current react-big-calendar does not allow developers to customize the appearance of the selection overlay that appears when dragging to select cells.

Solution:

  • Added a new selectionWrapper prop under the components option.
  • selectionWrapper accepts a React component that wraps the default selection overlay, allowing full control over its rendering and styles.
  • Updated stories/Calendar.stories.js with a CustomSelection example demonstrating how to use selectionWrapper to apply custom background colors, borders, shadows, etc.

Usage Example:

import CustomSelectionWrapper from './CustomSelectionWrapper';

<Calendar
  components={{
    selectionWrapper: CustomSelectionWrapper
  }}
  /* ...other props... */
/>

@LeeSeongJinCa
Copy link
Copy Markdown
Author

@cutterbl Hello there :) ,

Could you take a look at this PR when you have a sec?
Would love your thoughts.

Thanks!

@cutterbl
Copy link
Copy Markdown
Collaborator

@LeeSeongJinCa There are some conflicts that must be resolved, prior to bringing this in.

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