Playing around with an idea for a React library that makes building frontends for smart contracts a lot easier, inspired by Radix Primitives (https://www.radix-ui.com/) 

Not sure if it's even feasible (sooo many potential use cases to think through) but at least an interesting challenge https://i.imgur.com/5mXdRph.png

I like baking /goodbread and building apps on web3 protocols. DevRel @ ENS Labs. gregskril.com

Very cool idea!

I think Contract.Input and Contract.Button need to be wrapped in Contract.Function which would validate the number and types of inputs as you’re working.

Packaging the wagmi usePrepareContractWrite>useContractWrite>useWaitForTransaction stack into Contract.Function would be so much easier for new de

Founder and CTO of BackedBy, a subscription platform for artists and creators. https://backed.by

I've got a version working like this too - specify the function on the button. Less code but maybe also less intuitive? Curious to hear your thoughts if you have - actively working through it https://i.imgur.com/jsh2LNp.png

I like that it’s less code! My initial thought was something like:
<C.Root>
<C.WriteFn>
<C.Input/>
<C.Input/>
<C.Button/>
</C.WriteFn>
</C.Root>

<C.Root>
<C.ReadFn>
<C.Input/>
<C.Input/>
<DataDisplay/>
</C.ReadFn>
</C.Root>

<C.Root>
<C.Event>
<DataDisplay/>
</C.Event>
</C.Root>

Your example feels less boilerplate-

Excited to see how you build this out. The syntax for the components looks very close to what anyone who knows basic react is already familiar with, just magically web3-enabled.

ahhh I see, definitely useful for read/write distinction and whatnot