@axium/server 0.22.7 → 0.22.9

package/web/lib/Popover.svelte

@@ -1,46 +0,0 @@
-<script lang="ts">
-	import Icon from './Icon.svelte';
-	const { children, toggle }: { children(): any; toggle?(): any } = $props();
-
-	let popover = $state<HTMLDivElement>();
-
-	function onclick(e: MouseEvent) {
-		e.stopPropagation();
-		popover?.togglePopover();
-	}
-</script>
-
-<div onclick={e => e.stopPropagation()}>
-	<div style:display="contents" {onclick}>
-		{#if toggle}
-			{@render toggle()}
-		{:else}
-			<span class="popover-toggle">
-				<Icon i="ellipsis" />
-			</span>
-		{/if}
-	</div>
-
-	<div popover bind:this={popover}>
-		{@render children()}
-	</div>
-</div>
-
-<style>
-	.popover-toggle:hover {
-		cursor: pointer;
-	}
-
-	[popover] :global(.menu-item) {
-		display: inline-flex;
-		align-items: center;
-		padding: 0.5em 0.75em;
-		gap: 1em;
-		border-radius: 0.5em;
-
-		&:hover {
-			background-color: #223;
-			cursor: pointer;
-		}
-	}
-</style>

package/web/lib/Register.svelte

@@ -1,32 +0,0 @@
-<script lang="ts">
-	import { register } from '@axium/client/user';
-	import FormDialog from './FormDialog.svelte';
-
-	let { dialog = $bindable(), fullPage = false }: { dialog?: HTMLDialogElement; fullPage?: boolean } = $props();
-</script>
-
-<FormDialog bind:dialog submitText="Register" submit={register} pageMode={fullPage}>
-	<div>
-		<label for="name">Display Name</label>
-		<input name="name" type="text" required />
-	</div>
-	<div>
-		<label for="email">Email</label>
-		<input name="email" type="email" required />
-	</div>
-	{#snippet footer()}
-		{#if fullPage}
-			<div class="footer">
-				<a href="/login">Login instead</a>
-			</div>
-		{/if}
-	{/snippet}
-</FormDialog>
-
-<style>
-	.footer {
-		margin-bottom: 1em;
-		text-align: center;
-		background: none;
-	}
-</style>

package/web/lib/Toast.svelte

@@ -1,35 +0,0 @@
-<script lang="ts">
-	import { fade } from 'svelte/transition';
-
-	const { enabled, children, delay = 5000, duration = 1000, ...rest } = $props();
-
-	let hiding = $state(false);
-
-	const show = $derived(enabled && !hiding);
-</script>
-
-{#if show}
-	<div
-		class="Toast"
-		in:fade|global={{ duration }}
-		onintroend={() => (hiding = true)}
-		out:fade|global={{ delay, duration }}
-		onoutroend={() => (hiding = false)}
-		{...rest}
-	>
-		{@render children()}
-	</div>
-{/if}
-
-<style>
-	.Toast {
-		position: fixed;
-		bottom: 1em;
-		left: calc(50% - 10em);
-		right: calc(50% - 10em);
-		width: 20em;
-		padding: 0.5em 1em;
-		border-radius: 1em;
-		opacity: 0.5;
-	}
-</style>

package/web/lib/Upload.svelte

@@ -1,60 +0,0 @@
-<script lang="ts">
-	import { forMime } from '@axium/core/icons';
-	import type { HTMLInputAttributes } from 'svelte/elements';
-	import Icon from './Icon.svelte';
-
-	let {
-		name = 'files',
-		input = $bindable(),
-		files = $bindable(),
-		...rest
-	}: HTMLInputAttributes & { input?: HTMLInputElement } = $props();
-
-	const id = $props.id();
-</script>
-
-<div>
-	<label for={id} class={[files?.length && 'file']}>
-		{#each files! as file}
-			<Icon i={forMime(file.type)} />
-			<span>{file.name}</span>
-			<button
-				onclick={e => {
-					e.preventDefault();
-					const dt = new DataTransfer();
-					for (let f of files!) if (file !== f) dt.items.add(f);
-					input!.files = files = dt.files;
-				}}
-				style:display="contents"
-			>
-				<Icon i="trash" />
-			</button>
-		{:else}
-			<Icon i="upload" /> Upload
-		{/each}
-	</label>
-
-	<input bind:this={input} bind:files {name} {id} type="file" {...rest} />
-</div>
-
-<style>
-	input {
-		display: none;
-	}
-
-	label {
-		padding: 0.5em 1em;
-		border: 1px solid #cccc;
-		cursor: pointer;
-		display: flex;
-		align-items: center;
-		gap: 0.5em;
-		border-radius: 0.5em;
-		width: 20em;
-	}
-
-	label.file {
-		display: grid;
-		grid-template-columns: 2em 1fr 2em;
-	}
-</style>

package/web/lib/UserCard.svelte

@@ -1,48 +0,0 @@
-<script lang="ts">
-	import type { User } from '@axium/core/user';
-	import { getUserImage } from '@axium/core';
-
-	const {
-		user,
-		compact = false,
-		self = false,
-		href = `/users/${user.id}`,
-		you = false,
-	}: {
-		user: Partial<User>;
-		/** If true, don't show the picture */
-		compact?: boolean;
-		/** Whether the user is viewing their own profile */
-		self?: boolean;
-		/** The URL to link to */
-		href?: string;
-		/** Whether to display a "You" label if `self` */
-		you?: boolean;
-	} = $props();
-</script>
-
-<a class={['User', self && 'self']} {href}>
-	{#if !compact}
-		<img src={getUserImage(user)} alt={user.name} />
-	{/if}
-	{user.name}
-	{#if self && you}
-		<span class="subtle">(You)</span>
-	{/if}
-</a>
-
-<style>
-	.User {
-		cursor: pointer;
-		width: max-content;
-		height: max-content;
-	}
-
-	img {
-		width: 2em;
-		height: 2em;
-		border-radius: 50%;
-		vertical-align: middle;
-		margin-right: 0.5em;
-	}
-</style>

package/web/lib/WithContextMenu.svelte

@@ -1,73 +0,0 @@
-<script lang="ts">
-	import type { HTMLAttributes } from 'svelte/elements';
-	import Icon from './Icon.svelte';
-
-	interface Props extends HTMLAttributes<HTMLDivElement> {
-		children(): any;
-		menu(
-			/**
-			 * Shortcut to quickly create a generic action in the context menu.
-			 */
-			action: (icon: string, text: string, action: (event: MouseEvent) => void) => any
-		): any;
-		actions: Record<string, () => void>;
-	}
-
-	let { children, menu, actions, ...rest }: Props = $props();
-
-	let popover = $state<HTMLDivElement>();
-
-	function oncontextmenu(e: MouseEvent) {
-		e.preventDefault();
-		e.stopPropagation();
-		popover!.togglePopover();
-		_forcePopover = true;
-	}
-
-	let _forcePopover = false;
-
-	/**
-	 * Workaround for https://github.com/whatwg/html/issues/10905
-	 * @todo Remove when the problem is fixed.
-	 */
-	function onpointerup(e: PointerEvent) {
-		if (!_forcePopover) return;
-		e.stopPropagation();
-		e.preventDefault();
-		popover!.togglePopover();
-		_forcePopover = false;
-	}
-</script>
-
-{#snippet action(i: string, text: string, action: (event: MouseEvent) => void)}
-	<div
-		onclick={e => {
-			e.stopPropagation();
-			e.preventDefault();
-			action(e);
-		}}
-		class="action"
-	>
-		{#if i}<Icon {i} --size="14px" />{/if}
-		{text}
-	</div>
-{/snippet}
-
-<div data-axium-context-menu {oncontextmenu} {onpointerup} {...rest}>
-	{@render children()}
-	<div popover bind:this={popover}>
-		{@render menu(action)}
-	</div>
-</div>
-
-<style>
-	[data-axium-context-menu] {
-		display: contents;
-	}
-
-	div.action:hover {
-		cursor: pointer;
-		background-color: #223;
-		border-radius: 0.25em;
-	}
-</style>

package/web/lib/index.ts

@@ -1,16 +0,0 @@
-export { default as AccessControl } from './AccessControl.svelte';
-export { default as AccessControlDialog } from './AccessControlDialog.svelte';
-export { default as AppMenu } from './AppMenu.svelte';
-export { default as ClipboardCopy } from './ClipboardCopy.svelte';
-export { default as Dialog } from './Dialog.svelte';
-export { default as FormDialog } from './FormDialog.svelte';
-export { default as Icon } from './Icon.svelte';
-export { default as Login } from './Login.svelte';
-export { default as Logout } from './Logout.svelte';
-export { default as NumberBar } from './NumberBar.svelte';
-export { default as Popover } from './Popover.svelte';
-export { default as Register } from './Register.svelte';
-export { default as Toast } from './Toast.svelte';
-export { default as Upload } from './Upload.svelte';
-export { default as UserCard } from './UserCard.svelte';
-export { default as WithContextMenu } from './WithContextMenu.svelte';