Closed franky47 closed 5 years ago
Hi @franky47 I just wanted to give you a heads up that there's some issue with those typings. Here's an example which is not working for me:
${media.greaterThan('xl')`
position: fixed;
top: 50%; left: 0;
${size('100vh')} // <--- TS error here
`}
TypeScript error:
Argument of type '{ width: string | number; height: string | number; }' is not assignable to parameter of type 'InterpolationFunction<{}, any> | FlattenInterpolation<ThemeProps<any>>'.
Type '{ width: string | number; height: string | number; }' is missing the following properties from type 'FlattenInterpolation<ThemeProps<any>>': length, concat, join, slice, and 18 more.
Interesting, I can't replicate that error, do you have a link to a project I can clone to take a look ?
Sure, I'll create reproduction repository for you later. Btw, I am using Typescript 3.2.2
@franky47 Thank you so much for the PR! 😍 One question, have you tested it in a TS project yourself? As currently, I don't have a TS React project myself.
@franky47 Here's the repo - https://github.com/sqal/styled-media-query-types-bug
@sqal thanks, it should work now.
can this be merged?
Great work on these, are they ready to be merged? would love to have them in the package rather than in my custom typings.
when will this be released :) ?
@JClackett Published! Could you please try it and let me know? 🙌✨
styled-media-query@2.1.2
working! 👍 Thanks
Relates to issue #3.
Brings the following TypeScript features:
import media from 'styled-media-query'
in a TypeScript filestyled-components
to default or custommedia
objectI'll edit this message with the usage API for documentation once the depending PRs (#14, #15 and DefinitelyTyped#30511) have been merged.