40 lines
1.0 KiB
Svelte
40 lines
1.0 KiB
Svelte
|
<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>
|