summaryrefslogtreecommitdiffstatshomepage
path: root/frontend/src/lib/forms/NamespaceForm.svelte
blob: c05b6d87bfc9ff34ad7387340387ae0344db083f (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<script lang="ts">
	import { type NamespaceInput } from '$gql/Mutations';
	import { type OmitIdentifiers } from '$gql/Utils';
	import { type Namespace } from '$gql/graphql';
	import Labelled from '$lib/components/Labelled.svelte';
	import { createEventDispatcher } from 'svelte';

	const dispatch = createEventDispatcher<{ submit: NamespaceInput }>();

	export let namespace: OmitIdentifiers<Namespace>;

	function submit() {
		dispatch('submit', { name: namespace.name, sortName: namespace.sortName });
	}
</script>

<form on:submit|preventDefault={submit}>
	<div class="grid-labels">
		<Labelled label="Name" let:id>
			<!-- svelte-ignore a11y-autofocus -->
			<input required autofocus {id} bind:value={namespace.name} />
		</Labelled>
		<Labelled label="Sort name" let:id>
			<input {id} bind:value={namespace.sortName} />
		</Labelled>
	</div>
	<slot />
</form>