Open theetrain opened 1 year ago
Added proposal 2 above with a demo based on https://github.com/carbon-design-system/carbon-components-svelte/pull/1628#issuecomment-1383310189
Check out the demo; feedback is welcome.
If defined, renders a
<form>
element, wrapping the target component
That does not seem right. If you want a form you can just add one; other components should not be concerned with this. If someone actually needs the feature of single-button forms a lot, that can just be implemented in user land.
If a property for attributes is added, that should in my opinion refer to the element at hand and could just be called attributes
.
So if you want a button and a form with a Svelte action:
<Form action="?/kit-action" attributes={ useAction: enhance }>
<Button type="submit">Submit</Button>
</Form>
@brunnerh agreed; I reached a similar conclusion (not fully defined, though) in my <Button>
proposal in #1622. Single-element components like <Button>
can have the user wrap the <form>
themselves, or spread attributes such as formaction
if they like.
For complex components with multiple buttons, such as the sortable DataTable, the user should be able to provide an href
to pass in the same route with searchParams, or formaction
and related attributes to each individual sortable button; allowing a user to sort a table without JS or hydration.
Let's add a way to pass actions to components, especially Form and FluidForm.
Rejected Proposal 1: `use` prop
**This is flawed since you cannot specify ``** Proposed prop name is `use`. Example component: ```htmlProposal 2:
formAttributes
Specify a
formAttributes
prop. If present, will render an outer<form>
element.HTMLFormAttributes | { useAction: () => {} }
<form>
element, wrapping the target componentuseAction
is defined, it will be desconstructed fromformAttributes
and applied to the form element withuse:useAction
Pagination
we can haveitemsPerPageFormAttributes
for the 'items per page' dropdown (though an 'update' button may need to be rendered alongside<select>
elements)Demo: https://svelte.dev/repl/a1f1eec629f141a9a3373dafa075dd8a?version=3.55.0
Related #1622