jsfe
jsfe copied to clipboard
Custom submit button
Great job with this project! I'm trying to use it with svelte and velte kit and it seems that customizing submit button is not supported yet, this can be a good enhancement to make it more customizable.
Hello, and thank you :D Good idea. We might be able to customise the text, button variant or size in a pinch (via the element API), for convenience.
In the meantime, it's possible to:
Disable the submit button, make your own + hook it up with the form. Maybe I would need to expose the <form> DOMElement reference (it's #private for now). E.g. .submitButton=${false}
https://github.com/json-schema-form-element/jsfe/blob/32f9f7dd5034788c0eb82e130481a9c197f538ce/packages/form/src/json-schema-form.ts#L416C12-L416C12
https://github.com/json-schema-form-element/jsfe/blob/32f9f7dd5034788c0eb82e130481a9c197f538ce/packages/form/src/json-schema-form.ts#L53
Or you can override the widget altogether
https://github.com/json-schema-form-element/jsfe/blob/32f9f7dd5034788c0eb82e130481a9c197f538ce/packages/form/src/json-schema-form.ts#L400
This is the Shoelace one:
https://github.com/json-schema-form-element/jsfe/blob/main/packages/shoelace/src/widgets/submit.ts
Please note the widgets API is still pretty crude, it needs a tad of re-work
https://github.com/json-schema-form-element/jsfe/issues/6
Customising the label is now possible.
<json-schema-form
submitButtonLabel="Submit me!"
></json-schema-form>
Also in Widget['submit']'s options:
https://github.com/json-schema-form-element/jsfe/blob/7483287e785ada08c7577c94e6f1f5c2d91e2c1a/packages/types/src/widgets.ts#L149
Available in:
- @jsfe/carbon => 0.1.5-next.3+7483287
- @jsfe/form => 0.3.2-next.3+7483287
- @jsfe/material => 0.2.3-next.3+7483287
- @jsfe/shoelace => 0.3.2-next.3+7483287
- @jsfe/spectrum => 0.1.3-next.3+7483287
- @jsfe/system => 0.2.3-next.3+7483287
- @jsfe/wired => 0.2.3-next.3+7483287