FazBrowse GitHub Viewer | Trending |
URL:
| Home
Tools: [Download Repo ZIP]   [Original HTTPS Page]

Resolve type errors when using the library in a typescript react application by jstolwijk · Pull Request #1 · rough-stuff/wired-elements-react · GitHub

Repository navigation

Resolve type errors when using the library in a typescript react application - #1

Open
jstolwijk wants to merge 2 commits into
rough-stuff:mainfrom
jstolwijk:main
Open

jstolwijk wants to merge 2 commits into
rough-stuff:mainfrom
jstolwijk:main

Conversation

jstolwijk commented Jun 19, 2021 •
edited
Loading

Copy link
Copy Markdown

@lit-labs/react v1.0.0-rc.1generates invalid typescript type definitions, this issue seems to be resolved in rc.2

Example

<WiredButton elevation={1}>Submit</WiredButton>

Results in the following error:

'WiredButton' components don't accept text as child elements. Text in JSX has the type 'string', but the expected type of 'children' is '(HTMLCollection & (boolean | ReactChild | ReactFragment | ReactPortal | null)) | undefined'.

Copy link
Copy Markdown

Thanks for this! I just tried using wired-elements-react and it's great, but the type definitions have some serious issues. I tried this PR and it solves the children problem, but there seem to still be some issues with event handlers: I haven't checked all of them, but WiredButton's onClick handler is not present in the types--instead it suggests onclick, but if I use that, the handler does not actually fire. If I do

const WB = WiredButton as any;

return <WB onClick={handleClick}>click me</WB>

this works correctly but is obviously not ideal. I know React pretty well but I am not at all familiar with @lit-labs/react or with wired-elements-react--do you know what the issue might be @jstolwijk ?

msakrejda commented Jul 23, 2021 •
edited
Loading

Copy link
Copy Markdown

After playing around with this some more, I think this wrapper is really hard to work with. I'm dropping it from my prototype.The elements are inconsistent and don't conform to React conventions (e.g., the WiredComboBox has an onselected callback instead of onChange and the value in event.currentTarget.value is not the value in the value attribute of the selected item). The elements are gorgeous but they're really hard to work with, especially when trying to prototype something quickly. I've also found that the WiredTextarea elements don't work as controlled elements: if I update the value prop, the elements are not re-rendered (a sibling native textarea I added re-renders fine).

This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants


Back | FazBrowse Home | New Git URL