@axium/client 0.26.2 → 0.27.0

package/assets/styles.css

@@ -113,6 +113,35 @@ pre {
 	border-radius: 0.5em;
 }
 
+details {
+	& > summary {
+		list-style: none;
+		cursor: pointer;
+
+		&::-webkit-details-marker {
+			display: none;
+		}
+
+		&::before {
+			content: '';
+			display: inline-block;
+			width: 1em;
+			height: 1em;
+			background-color: currentColor;
+			mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'><path d='M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z'/></svg>");
+			mask-size: contain;
+			mask-repeat: no-repeat;
+			mask-position: center;
+			margin-right: 0.5em;
+			vertical-align: -0.125em;
+		}
+	}
+
+	&:open > summary::before {
+		mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'><path d='M201.4 374.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 306.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z'/></svg>");
+	}
+}
+
 dialog {
 	border-radius: 1em;
 	background: var(--bg-menu);

package/dist/access.js

@@ -1,14 +1,20 @@
+import * as cache from './cache.js';
 import { fetchAPI } from './requests.js';
-import { useCache } from './cache.js';
 export async function updateACL(itemType, itemId, target, permissions) {
-    return await fetchAPI('PATCH', 'acl/:itemType/:itemId', { target, permissions }, itemType, itemId);
+    const result = await fetchAPI('PATCH', 'acl/:itemType/:itemId', { target, permissions }, itemType, itemId);
+    cache.invalidate('acl', `${itemType}/${itemId}`);
+    return result;
 }
 export async function getACL(itemType, itemId) {
-    return await useCache('acl', `${itemType}/${itemId}`, () => fetchAPI('GET', 'acl/:itemType/:itemId', {}, itemType, itemId));
+    return await cache.use('acl', `${itemType}/${itemId}`, () => fetchAPI('GET', 'acl/:itemType/:itemId', {}, itemType, itemId));
 }
 export async function addToACL(itemType, itemId, target) {
-    return await fetchAPI('PUT', 'acl/:itemType/:itemId', target, itemType, itemId);
+    const result = await fetchAPI('PUT', 'acl/:itemType/:itemId', target, itemType, itemId);
+    cache.invalidate('acl', `${itemType}/${itemId}`);
+    return result;
 }
 export async function removeFromACL(itemType, itemId, target) {
-    return await fetchAPI('DELETE', 'acl/:itemType/:itemId', target, itemType, itemId);
+    const result = await fetchAPI('DELETE', 'acl/:itemType/:itemId', target, itemType, itemId);
+    cache.invalidate('acl', `${itemType}/${itemId}`);
+    return result;
 }

package/dist/apps.js

@@ -1,11 +1,11 @@
 import { appPreferences } from '@axium/core';
+import * as cache from './cache.js';
 import { fetchAPI } from './requests.js';
-import { useCache } from './cache.js';
 export async function getAppPreferences(userId, appId) {
     const schema = appPreferences.get(appId);
     if (!schema)
         throw new Error(`Missing schema for "${appId}"`);
-    const pref = await useCache('app_preferences', userId + ':' + appId, async () => {
+    const pref = await cache.use('app_preferences', userId + ':' + appId, async () => {
         const result = await fetchAPI('GET', 'users/:id/preferences/:appId', {}, userId, appId);
         return schema.parse(result);
     });
@@ -16,6 +16,7 @@ export async function setAppPreferences(userId, appId, preferences) {
     if (!schema)
         throw new Error(`Missing schema for "${appId}"`);
     const result = await fetchAPI('POST', 'users/:id/preferences/:appId', preferences, userId, appId);
+    cache.update('app_preferences', userId + ':' + appId, result);
     return schema.parse(result);
 }
 export async function clearAppPreferences(userId, appId) {
@@ -23,6 +24,7 @@ export async function clearAppPreferences(userId, appId) {
     if (!schema)
         throw new Error(`Missing schema for "${appId}"`);
     const result = await fetchAPI('DELETE', 'users/:id/preferences/:appId', {}, userId, appId);
+    cache.invalidate('app_preferences', userId + ':' + appId);
     return schema.parse(result);
 }
 export async function appPref(userId, appId, key) {

package/dist/cache.d.ts

@@ -1,11 +1,11 @@
-export interface CacheOptions {
+export interface Options {
     /** Maximum number of items the cache can hold */
     itemLimit: number;
 }
 /**
  * Create a cache manually. Only useful when you want to specify different options.
  */
-export declare function createCache(cacheName: string, options?: Partial<CacheOptions>): void;
+export declare function create(cacheName: string, options?: Partial<Options>): void;
 /**
  * Use a cache for some arbitrary operation.
  * This is primarily intended for de-duplicating API requests
@@ -15,4 +15,6 @@ export declare function createCache(cacheName: string, options?: Partial<CacheOp
  * @remarks
  * Note that a cache will automatically be created if it doesn't already exist
  */
-export declare function useCache<Key, Result>(cacheName: string, key: Key, miss: () => Result): Result;
+export declare function use<Key, Result>(cacheName: string, key: Key, miss: () => Result): Result;
+export declare function invalidate(cacheName: string, key: any): void;
+export declare function update(cacheName: string, key: any, value: any): void;

package/dist/cache.js

@@ -5,7 +5,7 @@ const defaultCacheOptions = {
 /**
  * Create a cache manually. Only useful when you want to specify different options.
  */
-export function createCache(cacheName, options = {}) {
+export function create(cacheName, options = {}) {
     if (_caches[cacheName])
         throw new Error('Multiple caches with the same name are not allowed');
     _caches[cacheName] = {
@@ -23,7 +23,7 @@ export function createCache(cacheName, options = {}) {
  * @remarks
  * Note that a cache will automatically be created if it doesn't already exist
  */
-export function useCache(cacheName, key, miss) {
+export function use(cacheName, key, miss) {
     const cache = (_caches[cacheName] ||= { items: new Map(), ...defaultCacheOptions });
     const cached = cache.items.get(key);
     if (cached)
@@ -32,3 +32,17 @@ export function useCache(cacheName, key, miss) {
     cache.items.set(key, result);
     return result;
 }
+export function invalidate(cacheName, key) {
+    const cache = _caches[cacheName];
+    if (!cache)
+        throw new ReferenceError("Can't invalidate key in non-existent cache: " + cacheName);
+    if (cache)
+        cache.items.delete(key);
+}
+export function update(cacheName, key, value) {
+    const cache = _caches[cacheName];
+    if (!cache)
+        throw new ReferenceError("Can't update key in non-existent cache: " + cacheName);
+    if (cache)
+        cache.items.set(key, value);
+}

package/dist/cli/index.js

@@ -218,7 +218,7 @@ axiumPlugin
         return;
     }
     if (!opt.long) {
-        console.log(Array.from(plugins.keys()).join(', '));
+        console.log(plugins.keys().toArray().join(', '));
         return;
     }
     console.log(styleText('whiteBright', plugins.size + ' plugin(s) loaded:'));

package/dist/config.d.ts

@@ -1,6 +1,6 @@
 import * as z from 'zod';
 export declare const ClientConfig: z.ZodObject<{
-    token: z.ZodOptional<z.ZodNullable<z.ZodBase64>>;
+    token: z.ZodOptional<z.ZodNullable<z.ZodBase64URL>>;
     server: z.ZodOptional<z.ZodNullable<z.ZodURL>>;
     cache: z.ZodOptional<z.ZodNullable<z.ZodObject<{
         fetched: z.ZodInt;

package/dist/config.js

@@ -2,7 +2,7 @@ import { debug, warn } from 'ioium';
 import { App, Session, User } from '@axium/core';
 import * as z from 'zod';
 export const ClientConfig = z.looseObject({
-    token: z.base64().nullish(),
+    token: z.base64url().nullish(),
     server: z.url().nullish(),
     // Cache to reduce server load:
     cache: z

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 export * from './access.js';
 export * from './apps.js';
-export * from './cache.js';
+export * as cache from './cache.js';
 export * from './config.js';
 export * from './locales.js';
 export * from './requests.js';

package/dist/index.js

@@ -1,6 +1,6 @@
 export * from './access.js';
 export * from './apps.js';
-export * from './cache.js';
+export * as cache from './cache.js';
 export * from './config.js';
 export * from './locales.js';
 export * from './requests.js';

package/dist/locales.d.ts

@@ -19,6 +19,12 @@ declare let currentLoaded: {
         readonly failed: "Couldn't load apps.";
         readonly none: "No apps available.";
     };
+    readonly AppPreferences: {
+        readonly title: "Preferences for {name}";
+        readonly save: "Save";
+        readonly toast_saved: "Preferences saved";
+        readonly dialog_toggle: "Settings";
+    };
     readonly Discovery: {
         readonly no_results: "No results";
     };
@@ -30,10 +36,6 @@ declare let currentLoaded: {
         readonly back: "Take me back";
         readonly question: "Are you sure you want to log out?";
     };
-    readonly AppPreferences: {
-        readonly title: "Preferences for {name}";
-        readonly save: "Save";
-    };
     readonly Register: {
         readonly email: "Email";
         readonly login: "Login instead";

package/dist/user.js

@@ -1,7 +1,7 @@
 import { startAuthentication, startRegistration } from '@simplewebauthn/browser';
 import * as z from 'zod';
 import { fetchAPI } from './requests.js';
-import { useCache } from './cache.js';
+import * as cache from './cache.js';
 export async function login(userId) {
     const options = await fetchAPI('PUT', 'users/:id/auth', { type: 'login' }, userId);
     const response = await startAuthentication({ optionsJSON: options });
@@ -22,8 +22,10 @@ export async function loginByEmail(email) {
     });
     return await login(userId);
 }
+let _currentSession = null;
 export async function getCurrentSession() {
-    return await fetchAPI('GET', 'session');
+    _currentSession ||= await fetchAPI('GET', 'session');
+    return _currentSession;
 }
 export async function getSessions(userId) {
     _checkId(userId);
@@ -62,11 +64,13 @@ function _checkId(userId) {
 }
 export async function userInfo(userId) {
     _checkId(userId);
-    return await useCache('user', userId, () => fetchAPI('GET', 'users/:id', {}, userId));
+    return await cache.use('user', userId, () => fetchAPI('GET', 'users/:id', {}, userId));
 }
 export async function updateUser(userId, data) {
     _checkId(userId);
-    return await fetchAPI('PATCH', 'users/:id', data, userId);
+    const result = await fetchAPI('PATCH', 'users/:id', data, userId);
+    cache.update('user', userId, result);
+    return result;
 }
 export async function fullUserInfo(userId) {
     _checkId(userId);
@@ -81,7 +85,9 @@ export async function deleteUser(userId, deletingId = userId) {
     const options = await fetchAPI('PUT', 'users/:id/auth', { type: 'action' }, deletingId);
     const response = await startAuthentication({ optionsJSON: options });
     await fetchAPI('POST', 'users/:id/auth', response, deletingId);
-    return await fetchAPI('DELETE', 'users/:id', response, userId);
+    const result = await fetchAPI('DELETE', 'users/:id', response, userId);
+    cache.invalidate('user', userId);
+    return result;
 }
 export async function emailVerificationEnabled(userId) {
     _checkId(userId);

package/lib/AppPreferences.svelte

@@ -3,18 +3,28 @@
 	import { structurallyEqual } from 'utilium';
 	import type { ZodObject } from 'zod';
 	import ZodInput from './ZodInput.svelte';
+	import { toast } from './toast.js';
 
-	const { userId, appId, schema }: { userId: string; appId: string; schema: ZodObject } = $props();
+	const {
+		userId,
+		appId,
+		schema,
+		_parentDialog,
+	}: { userId: string; appId: string; schema: ZodObject; _parentDialog?: HTMLDialogElement } = $props();
 
 	let initialValue = $state(await getAppPreferences(userId, appId));
 	let currentValue = $state({ ...initialValue });
 
 	function cancel() {
 		currentValue = { ...initialValue };
+		_parentDialog?.close();
 	}
 
 	async function save() {
 		initialValue = await setAppPreferences(userId, appId, currentValue);
+		if (!_parentDialog) return;
+		_parentDialog.close();
+		toast('success', text('AppPreferences.toast_saved'));
 	}
 </script>
 

package/lib/AppPreferencesDialog.svelte

@@ -0,0 +1,21 @@
+<script lang="ts">
+	import type { ZodObject } from 'zod';
+	import AppPreferences from './AppPreferences.svelte';
+	import Icon from './Icon.svelte';
+	import { text } from '@axium/client';
+
+	const { userId, appId, schema }: { userId: string; appId: string; schema: ZodObject } = $props();
+
+	const id = 'AppPreferencesDialog:' + appId;
+
+	let _parentDialog = $state<HTMLDialogElement>();
+</script>
+
+<button class="icon-text" command="show-modal" commandfor={id}>
+	<Icon i="gear-complex" />
+	<span>{text('AppPreferences.dialog_toggle')}</span>
+</button>
+
+<dialog bind:this={_parentDialog} {id}>
+	<AppPreferences {userId} {appId} {schema} {_parentDialog} />
+</dialog>

package/lib/Popover.svelte

@@ -6,12 +6,15 @@
 		toggle,
 		showToggle,
 		popover,
+		cascadeHover = false,
 		...rest
 	}: {
 		children(): any;
 		toggle?(): any;
 		showToggle?: 'hover' | 'always';
 		popover?: 'auto' | 'hint' | 'manual';
+		/** If set, popover toggles for parent elements will also be shown on hover (only applies for `showToggle="hover"`) */
+		cascadeHover?: boolean;
 	} & HTMLAttributes<HTMLDivElement> = $props();
 
 	let popoverElement = $state<HTMLDivElement>();
@@ -27,7 +30,7 @@
 	{#if toggle}
 		{@render toggle()}
 	{:else}
-		<span class={[showToggle == 'hover' && 'toggle-hover']}>
+		<span class={[showToggle == 'hover' && 'toggle-hover', cascadeHover && 'cascade-hover']}>
 			<Icon i="ellipsis" />
 		</span>
 	{/if}
@@ -59,6 +62,10 @@
 		:global(:hover) > div > .toggle-hover {
 			visibility: visible;
 		}
+
+		:global(:hover:has(:hover > .Popover > .toggle-hover)) > div > .toggle-hover:not(.cascade-hover) {
+			visibility: hidden;
+		}
 	}
 
 	:popover-open {

package/lib/index.ts

@@ -1,6 +1,7 @@
 export { default as AccessControlDialog } from './AccessControlDialog.svelte';
 export { default as AppMenu } from './AppMenu.svelte';
 export { default as AppPreferences } from './AppPreferences.svelte';
+export { default as AppPreferencesDialog } from './AppPreferencesDialog.svelte';
 export { default as Audio } from './Audio.svelte';
 export { default as ColorPicker } from './ColorPicker.svelte';
 export { default as ClipboardCopy } from './ClipboardCopy.svelte';

package/locales/en.json

@@ -13,6 +13,12 @@
 		"failed": "Couldn't load apps.",
 		"none": "No apps available."
 	},
+	"AppPreferences": {
+		"title": "Preferences for {name}",
+		"save": "Save",
+		"toast_saved": "Preferences saved",
+		"dialog_toggle": "Settings"
+	},
 	"Discovery": {
 		"no_results": "No results"
 	},
@@ -24,10 +30,6 @@
 		"back": "Take me back",
 		"question": "Are you sure you want to log out?"
 	},
-	"AppPreferences": {
-		"title": "Preferences for {name}",
-		"save": "Save"
-	},
 	"Register": {
 		"email": "Email",
 		"login": "Login instead",

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@axium/client",
-	"version": "0.26.2",
+	"version": "0.27.0",
 	"author": "James Prevett <jp@jamespre.dev>",
 	"funding": {
 		"type": "individual",