{"action":"closed","issue":{"url":"https://api.github.com/repos/styled-components/styled-components/issues/1978","repository_url":"https://api.github.com/repos/styled-components/styled-components","labels_url":"https://api.github.com/repos/styled-components/styled-components/issues/1978/labels{/name}","comments_url":"https://api.github.com/repos/styled-components/styled-components/issues/1978/comments","events_url":"https://api.github.com/repos/styled-components/styled-components/issues/1978/events","html_url":"https://github.com/styled-components/styled-components/issues/1978","id":357788565,"node_id":"MDU6SXNzdWUzNTc3ODg1NjU=","number":1978,"title":"Writing a Definition (d.ts) file for my UI library that is using regular Javascript","user":{"login":"andrewhartwig","id":42554343,"node_id":"MDQ6VXNlcjQyNTU0MzQz","avatar_url":"https://avatars0.githubusercontent.com/u/42554343?v=4","gravatar_id":"","url":"https://api.github.com/users/andrewhartwig","html_url":"https://github.com/andrewhartwig","followers_url":"https://api.github.com/users/andrewhartwig/followers","following_url":"https://api.github.com/users/andrewhartwig/following{/other_user}","gists_url":"https://api.github.com/users/andrewhartwig/gists{/gist_id}","starred_url":"https://api.github.com/users/andrewhartwig/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/andrewhartwig/subscriptions","organizations_url":"https://api.github.com/users/andrewhartwig/orgs","repos_url":"https://api.github.com/users/andrewhartwig/repos","events_url":"https://api.github.com/users/andrewhartwig/events{/privacy}","received_events_url":"https://api.github.com/users/andrewhartwig/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":1,"created_at":"2018-09-06T19:14:07Z","updated_at":"2018-09-06T19:18:37Z","closed_at":"2018-09-06T19:18:37Z","author_association":"NONE","body":"### Preface\r\nI'm sorry guys I know this isn't the right place but I'm just so lost and have no clue what to google to achieve this. I'm also very new to Typescript so combining this with trying to learn how to write definition files is just hurting my brain.\r\n\r\n### Issue\r\nI'm trying to add definitions to my UI library to help myself and others be able to use the UI library quickly and efficiently in vscode or w/e they use. We're not using typescript in our application or the UI library, its strictly to offer intellisence / documentation to our library.\r\n\r\nBasic react components took a bit of tinkering, but I've figured it out.\r\n\r\nBut unfortunately I've just hit my first styled component. I actually got extremely close following the typescript guide. I had it working, but then typescript linter in vscode got mad at me for  `[ts] A 'const' initializer in an ambient context must be a string or numeric literal.`\r\n\r\nDEFINITION:\r\n```typescript\r\nexport interface ButtonProps {\r\n  /**\r\n   * Style the button as per the secondary theme\r\n   */\r\n  secondary?: boolean,\r\n  /**\r\n   * Style the button as per the alert theme\r\n   */\r\n  alert?: boolean,\r\n  /**\r\n   * Makes the button have equal width and height. Useful for icons.\r\n   */\r\n  square?: boolean\r\n}\r\n\r\ndeclare const Button = styled.default<ButtonProps, 'button'>('button')``;\r\n\r\nexport default Button;\r\n```\r\n^^^ This actually works, when I import Button elsewhere, I get all the expected prop autocompletes. But this is an \"ambient\" definition file. https://basarat.gitbooks.io/typescript/content/docs/types/ambient/d.ts.html\r\n so vscode turns the file red and blows everything up (even though it actually works).\r\n\r\nSOURCE:\r\n```javascript\r\nimport styled from 'styled-components';\r\n\r\nconst Button = styled.button` ...stuf using secondary, alert, square...`;\r\n\r\nButton.propTypes = {\r\n  secondary: PropTypes.bool,\r\n};\r\n\r\nButton.displayName = \"Button\";\r\n\r\nexport default Button;\r\n```\r\n\r\nHonestly the hardest part for me is that i can't find any good resources for how to actually figure this stuff out, so an acceptable helpful answer to me would be just giving me some resources that I can read to help learn stuff related to react / typescript / styled-components, and regular definitions / class extensions / types.\r\n\r\nAny help is greatly appreciated :) "}}
{"actor":{"display_login":"probablyup"}}