DateRangePicker animation 'slideDown' causes errors when compiled

[EdwardAW]

What version of rsuite are you using?

5.59.2

What version of React are you using?

18.2.0

What version of TypeScript are you using (if any)?

3.7.5

What browser are you using?

Chrome

Describe the Bug

When trying to add a custom styling to a date range picker using less, I import the default stylings and then override the stylings I want to alter the final component. This works fine, but when the file gets built it causes an error because some of the animations are written differently. As such they are missing from the mapping and are replaced with

I'm not sure if this syntax is valid for certain css extensions, or if it is simply and error, but looking through the package code it seems it could be fixed simply by reordering these lines:


to instead read

.rs-calendar-time-view &-content {
  animation: slideDown 0.3s linear;
}

Please let me know if i've made some mistake or if my approach is flawed, thank you.

Expected Behavior

When compiled there shouldn't be any errors in the index.css.

To Reproduce

create a copy of the .less file for DateRangePicker and build it. The resulting build files should have an error in index.css.

[simonguo]

Hi @EdwardAW .

I think it should be related to the build tool you are using. We did not encounter the above situation during the less compilation process. The following is the compiled css file, which can be viewed in npm. You can compare it.