Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Typescript error (3.4.3) #475

Closed
ivanov-v opened this issue Jan 27, 2020 · 6 comments · Fixed by ludovicwyffels/blog#242
Closed

Typescript error (3.4.3) #475

ivanov-v opened this issue Jan 27, 2020 · 6 comments · Fixed by ludovicwyffels/blog#242

Comments

@ivanov-v
Copy link

  • polished version: 3.4.3
  • JSS-in_CSS library and version: styled-components 5.0
  • Any relevant JS library and version: 16.12.0

Mixin/Helper/Shorthand you were using and how you were using it:

export const NativeInput = styled.input<{
  variant: InputVariant;
  hasAdornment: boolean;
}>`
  ${ellipsis()};
`;

What you are seeing:
Type 'Styles' is not assignable to type 'string'.

image

What you expected to see:

Types must match

@leocavalcante
Copy link

+1 here. Just updated my deps and grabbed 3.4.3, now a previously working code shouts:

27:5 Argument of type 'Styles' is not assignable to parameter of type 'Interpolation<ThemeProps<DefaultTheme>>'.
  Type 'Styles' is not assignable to type 'string'.
    25 | 
    26 | const GlobalStyle = createGlobalStyle`
  > 27 |   ${din}
       |     ^
    28 |   ${dinBold}
    29 |   ${dinCondensed}
    30 |   ${dinCondensedBold}

The code uses fontFace + createGlobalStyle

import {createGlobalStyle} from "styled-components";
import {fontFace} from "polished";

const din = fontFace({
  fontFamily: 'Din',
  fontFilePath: '/assets/fonts/d-din-webfont',
});

const dinBold = fontFace({
  fontFamily: 'Din',
  fontFilePath: '/assets/fonts/d-din-bold-webfont',
  fontWeight: 'bold',
});

const dinCondensed = fontFace({
  fontFamily: 'Din Condensed',
  fontFilePath: '/assets/fonts/d-dincondensed-webfont',
});

const dinCondensedBold = fontFace({
  fontFamily: 'Din Condensed',
  fontFilePath: '/assets/fonts/d-dincondensed-bold-webfont',
  fontWeight: 'bold',
});

const GlobalStyle = createGlobalStyle`
  ${din}
  ${dinBold}
  ${dinCondensed}
  ${dinCondensedBold}

  body {
    margin: 0;
    background-color: #383838;
    color: white;
  }
`;

export default GlobalStyle;

@ivanov-v
Copy link
Author

Maybe this line breaks?

@bhough
Copy link
Contributor

bhough commented Jan 28, 2020

🎉 This issue has been resolved in version 3.4.4 🎉

The release is available on:

Your semantic-release bot 📦🚀

@bhough
Copy link
Contributor

bhough commented Jan 28, 2020

@ivanov-v @leocavalcante Apologies, our TS test harness didn't catch this for some reason. v3.4.4 should address this, but we will await confirmation before closing.

@bhough bhough reopened this Jan 28, 2020
@ivanov-v
Copy link
Author

@ivanov-v @leocavalcante Apologies, our TS test harness didn't catch this for some reason. v3.4.4 should address this, but we will await confirmation before closing.

Now work without errors

@bhough bhough closed this as completed Jan 28, 2020
@leocavalcante
Copy link

@ivanov-v @leocavalcante Apologies, our TS test harness didn't catch this for some reason. v3.4.4 should address this, but we will await confirmation before closing.

Thank you very much for the prompt fix.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
3 participants