extend onSubmit to press of button for useSearchField

[PixeledCode]

I was wondering what would be the most efficient way to extend the ability to trigger the onSubmit callback when using a submit button as well.
Right now, I can think of creating another callback for just the button, but if possible, I would like to prevent that.

Thanks again for this fantastic library.

[snowystinger]

I'm not quite sure what you're asking for. onSubmit is a form event. https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/submit_event so you wouldn't put it on a button. You'd put it on a form and you'd have a submit button inside that form.
Let me know if that answers your question.

[PixeledCode]

okay, so just found a solution that I think will work

<Button
 className="search-submit"
 type="submit"
 onPress={() => props.onSubmit(ref.current.value)     // <-- ref of input field
 iconOnly
 icon={<SearchIcon />}
>
 submit search
</Button>

[snowystinger]

I mean, you could also do something more like this so you don't need to track the ref
https://codesandbox.io/s/modest-kilby-wx6ck9?file=/src/App.js

[PixeledCode]

Yes that's better way to do it but it might not work for uncontrolled search field right?

[snowystinger]

It'd work for uncontrolled as well, I updated the codesandbox for uncontrolled.

[PixeledCode]

Yes that would work perfectly fine as well. Thanks for helping out!