swaf/src/assets/views/utils/Form.svelte

40 lines
1.0 KiB
Svelte
Raw Normal View History

2021-06-01 16:14:24 +02:00
<script context="module">
let nextAvailableFormId = 0;
</script>
<script lang="ts">
import CsrfTokenField from "./CsrfTokenField.svelte";
import Icon from "./Icon.svelte";
import {setContext} from "svelte";
export let action: string;
export let button: boolean = false;
export let submitText: string;
export let submitIcon: string;
export let submitClass: string = undefined;
export let confirm: string = undefined;
const formId = nextAvailableFormId++;
setContext('formId', formId);
function handleSubmit(e) {
if (confirm && !window.confirm(confirm)) {
e.preventDefault();
}
}
</script>
<form {action} method="POST" id="{formId}-form" on:submit={handleSubmit}>
<CsrfTokenField/>
<slot/>
<button type="submit" class={submitClass}>
{#if submitIcon}
<Icon name={submitIcon}/>
{/if}
{#if button}
<span class="tip">{submitText}</span>
{:else}
{submitText}
{/if}
</button>
</form>