Dynamic inline-styles for buttons(tiles)

[BrianWahinya]

Before you start - checklist

• [X] I have checked if this feature request is not already reported

Description

I would like to add dynamic inline-styling to a specific tile/button without assigning a className or changing tileContent. In React it is possible to do this:

const userColor = getUserInput()
return <>
  <button>10<button>
  <button style={{ backgroundColor: userColor}}>11<button>
  <button>12<button>
</>

Assigning a tileClassName isn't sufficient because you need to already have defined the colors in an external CSS file for that particular class. This isn't dynamic. My goal is to let the user decide the color of a particular tile from a color-palette within the program.

Proposed solution

Similar to how we assign a className using tileClassName, there can be a method such as tileStyle to handle inline styling.

  const tileStyle= ({ date }) => {
      if(compare(date, targetDate)){
        return {
          backgroundColor: "#000",
          fontSize: "15px"
        }
      }
  }

 return <ReactCalendar tileStyle={tileStyle} />

Alternatives

No response

Additional information

No response