Weird inconsistent behaviour with dynamics value

Codesandbox link: https://codesandbox.io/s/p2wljkm9zm

In this example you can see

const styles = () =>
  createStyles({
    text: {
      backgroundColor: "red", // WORKING
      color: () => "blue", // WORKING
      "&:hover": {
        marginLeft: 20, // WORKING,
        marginRight: () => 20 // WORKING,
      }
    },
    someText: () => ({
      backgroundColor: "red", // WORKING
      color: () => "blue", // NOT WORKING
      "&:hover": {
        marginLeft: 20, // WORKING, 
        marginRight: () => 20 // WORKING,
      }
    }),
    otherText: {
      backgroundColor: "red", // WORKING
      color: () => "blue", // WORKING
      "&:hover": () => ({
        marginLeft: 20, // NOT WORKING,
        marginRight: () => 20 // NOT WORKING,
      })
    },
    finalText: () => ({
      backgroundColor: "red", // WORKING
      color: () => "blue", // NOT WORKING
      "&:hover": () => ({
        marginLeft: 20, // WORKING,
        marginRight: () => 20 // NOT WORKING,
      })
    })
  });

I understand the fact function inside function does not work, like color of someText, but in this case why marginRight of someText does work ? And why marginLeft of otherText does not work ? Even weirder, it works for finalText…

If it works when it shouldn’t at least it’s not a big deal. But I think the case of marginLeft of otherText should be a correct one, and actually it doesn’t work.

[kof]

We are not supporting value functions inside of rule functions, it just worked by accident I think.

[kof]

released in 10.1.0