Function Values in Keyframes

RobertAron commented 4 years ago

I've been stuck on this for a few days and I believe that it is a bug.

Thanks for making this awesome library!

Expected behavior: Function values used in @keyframes do not appear to attach correctly to the style sheet.

Describe the bug: The function is run, but not applied to the style sheet. Looking in chrome's inspector I can see that the keyframe is setup, but does not have properties inside of it.

Codesandbox link: https://codesandbox.io/s/react-jss-playground-5w8nc?fontsize=14

Basically this:

"@keyframes my-animation": {
    "25%": {
      backgroundColor: ({ customColor }) => customColor
    }
}

Versions (please complete the following information): 10.0.0

Based on issue https://github.com/cssinjs/jss/issues/471 I thought this problem was fixed. I could be using the tool incorrectly.

jasonsoden commented 4 years ago

Same issue here. We really need to support values coming in via props.

CodySchaaf commented 3 years ago

Anyone able to come up with a workaround in the meantime?

ashkanahrabi commented 3 years ago

Any update on this? Still can't pass props to keyframes!

cssinjs / jss

Function Values in Keyframes #1216