TypeScript compilation error when using array for @font-face

[patrickjtoy]

Expected behavior: According to the documentation the following should work:

// Multiple font faces.
const styles = {
  '@font-face': [
    {
      fontFamily: 'MyWebFont',
      src: 'url(webfont.eot)'
    },
    {
      fontFamily: 'MySecondFont',
      src: 'url(webfont2.eot)'
    }
  ]
}

From that, I expect that the following should also work:

const useStyles = createUseStyles({
  "@font-face": [
    {
      fontFamily: "MyWebFont",
      src: "url(webfont.eot)"
    },
    {
      fontFamily: "MySecondFont",
      src: "url(webfont2.eot)"
    }
  ]
});

Describe the bug:

(property) "@font-face": string | JssStyle | Func<string | JssStyle | null | undefined>
Type '{ fontFamily: string; src: string; }[]' is not assignable to type 'string | JssStyle | Func<string | JssStyle | null | undefined>'.
  Type '{ fontFamily: string; src: string; }[]' is not assignable to type 'JssStyle'.
    Index signature is missing in type '{ fontFamily: string; src: string; }[]'.ts(2322)

Codesandbox link: https://codesandbox.io/s/stupefied-chandrasekhar-quii5?file=/src/App.tsx

Versions (please complete the following information):

• jss: react-jss@10.4.0
• Browser [e.g. chrome, safari]: Firefox
• OS [e.g. Windows, macOS]: macOS Feel free to add any additional versions which you may think are relevant to the bug.

[kof]

Feel free to send a PR for the type fix

[PetrBorisov]

looks like it might be helpful https://github.com/cssinjs/jss/pull/1521

[kof]

released in https://github.com/cssinjs/jss/releases/tag/v10.7.0