📝 Commit Details:

backend/node_modules/preact/hooks/src/index.d.ts

@@ -0,0 +1,141 @@
+import { ErrorInfo, PreactContext, Ref as PreactRef } from '../..';
+
+type Inputs = ReadonlyArray<unknown>;
+
+export type StateUpdater<S> = (value: S | ((prevState: S) => S)) => void;
+/**
+ * Returns a stateful value, and a function to update it.
+ * @param initialState The initial value (or a function that returns the initial value)
+ */
+export function useState<S>(initialState: S | (() => S)): [S, StateUpdater<S>];
+
+export function useState<S = undefined>(): [
+	S | undefined,
+	StateUpdater<S | undefined>
+];
+
+export type Reducer<S, A> = (prevState: S, action: A) => S;
+/**
+ * An alternative to `useState`.
+ *
+ * `useReducer` is usually preferable to `useState` when you have complex state logic that involves
+ * multiple sub-values. It also lets you optimize performance for components that trigger deep
+ * updates because you can pass `dispatch` down instead of callbacks.
+ * @param reducer Given the current state and an action, returns the new state
+ * @param initialState The initial value to store as state
+ */
+export function useReducer<S, A>(
+	reducer: Reducer<S, A>,
+	initialState: S
+): [S, (action: A) => void];
+
+/**
+ * An alternative to `useState`.
+ *
+ * `useReducer` is usually preferable to `useState` when you have complex state logic that involves
+ * multiple sub-values. It also lets you optimize performance for components that trigger deep
+ * updates because you can pass `dispatch` down instead of callbacks.
+ * @param reducer Given the current state and an action, returns the new state
+ * @param initialArg The initial argument to pass to the `init` function
+ * @param init A function that, given the `initialArg`, returns the initial value to store as state
+ */
+export function useReducer<S, A, I>(
+	reducer: Reducer<S, A>,
+	initialArg: I,
+	init: (arg: I) => S
+): [S, (action: A) => void];
+
+/** @deprecated Use the `Ref` type instead. */
+type PropRef<T> = MutableRef<T>;
+interface Ref<T> {
+	readonly current: T | null;
+}
+
+interface MutableRef<T> {
+	current: T;
+}
+
+/**
+ * `useRef` returns a mutable ref object whose `.current` property is initialized to the passed argument
+ * (`initialValue`). The returned object will persist for the full lifetime of the component.
+ *
+ * Note that `useRef()` is useful for more than the `ref` attribute. It’s handy for keeping any mutable
+ * value around similar to how you’d use instance fields in classes.
+ *
+ * @param initialValue the initial value to store in the ref object
+ */
+export function useRef<T>(initialValue: T): MutableRef<T>;
+export function useRef<T>(initialValue: T | null): Ref<T>;
+export function useRef<T = undefined>(): MutableRef<T | undefined>;
+
+type EffectCallback = () => void | (() => void);
+/**
+ * Accepts a function that contains imperative, possibly effectful code.
+ * The effects run after browser paint, without blocking it.
+ *
+ * @param effect Imperative function that can return a cleanup function
+ * @param inputs If present, effect will only activate if the values in the list change (using ===).
+ */
+export function useEffect(effect: EffectCallback, inputs?: Inputs): void;
+
+type CreateHandle = () => object;
+
+/**
+ * @param ref The ref that will be mutated
+ * @param create The function that will be executed to get the value that will be attached to
+ * ref.current
+ * @param inputs If present, effect will only activate if the values in the list change (using ===).
+ */
+export function useImperativeHandle<T, R extends T>(
+	ref: PreactRef<T>,
+	create: () => R,
+	inputs?: Inputs
+): void;
+
+/**
+ * Accepts a function that contains imperative, possibly effectful code.
+ * Use this to read layout from the DOM and synchronously re-render.
+ * Updates scheduled inside `useLayoutEffect` will be flushed synchronously, after all DOM mutations but before the browser has a chance to paint.
+ * Prefer the standard `useEffect` hook when possible to avoid blocking visual updates.
+ *
+ * @param effect Imperative function that can return a cleanup function
+ * @param inputs If present, effect will only activate if the values in the list change (using ===).
+ */
+export function useLayoutEffect(effect: EffectCallback, inputs?: Inputs): void;
+
+/**
+ * Returns a memoized version of the callback that only changes if one of the `inputs`
+ * has changed (using ===).
+ */
+export function useCallback<T extends Function>(callback: T, inputs: Inputs): T;
+
+/**
+ * Pass a factory function and an array of inputs.
+ * useMemo will only recompute the memoized value when one of the inputs has changed.
+ * This optimization helps to avoid expensive calculations on every render.
+ * If no array is provided, a new value will be computed whenever a new function instance is passed as the first argument.
+ */
+// for `inputs`, allow undefined, but don't make it optional as that is very likely a mistake
+export function useMemo<T>(factory: () => T, inputs: Inputs | undefined): T;
+
+/**
+ * Returns the current context value, as given by the nearest context provider for the given context.
+ * When the provider updates, this Hook will trigger a rerender with the latest context value.
+ *
+ * @param context The context you want to use
+ */
+export function useContext<T>(context: PreactContext<T>): T;
+
+/**
+ * Customize the displayed value in the devtools panel.
+ *
+ * @param value Custom hook name or object that is passed to formatter
+ * @param formatter Formatter to modify value before sending it to the devtools
+ */
+export function useDebugValue<T>(value: T, formatter?: (value: T) => any): void;
+
+export function useErrorBoundary(
+	callback?: (error: any, errorInfo: ErrorInfo) => Promise<void> | void
+): [any, () => void];
+
+export function useId(): string;

backend/node_modules/preact/hooks/src/index.js

@@ -0,0 +1,486 @@
+import { options } from 'preact';
+
+/** @type {number} */
+let currentIndex;
+
+/** @type {import('./internal').Component} */
+let currentComponent;
+
+/** @type {import('./internal').Component} */
+let previousComponent;
+
+/** @type {number} */
+let currentHook = 0;
+
+/** @type {Array<import('./internal').Component>} */
+let afterPaintEffects = [];
+
+let EMPTY = [];
+
+let oldBeforeDiff = options._diff;
+let oldBeforeRender = options._render;
+let oldAfterDiff = options.diffed;
+let oldCommit = options._commit;
+let oldBeforeUnmount = options.unmount;
+
+const RAF_TIMEOUT = 100;
+let prevRaf;
+
+options._diff = vnode => {
+	currentComponent = null;
+	if (oldBeforeDiff) oldBeforeDiff(vnode);
+};
+
+options._render = vnode => {
+	if (oldBeforeRender) oldBeforeRender(vnode);
+
+	currentComponent = vnode._component;
+	currentIndex = 0;
+
+	const hooks = currentComponent.__hooks;
+	if (hooks) {
+		if (previousComponent === currentComponent) {
+			hooks._pendingEffects = [];
+			currentComponent._renderCallbacks = [];
+			hooks._list.forEach(hookItem => {
+				if (hookItem._nextValue) {
+					hookItem._value = hookItem._nextValue;
+				}
+				hookItem._pendingValue = EMPTY;
+				hookItem._nextValue = hookItem._pendingArgs = undefined;
+			});
+		} else {
+			hooks._pendingEffects.forEach(invokeCleanup);
+			hooks._pendingEffects.forEach(invokeEffect);
+			hooks._pendingEffects = [];
+		}
+	}
+	previousComponent = currentComponent;
+};
+
+options.diffed = vnode => {
+	if (oldAfterDiff) oldAfterDiff(vnode);
+
+	const c = vnode._component;
+	if (c && c.__hooks) {
+		if (c.__hooks._pendingEffects.length) afterPaint(afterPaintEffects.push(c));
+		c.__hooks._list.forEach(hookItem => {
+			if (hookItem._pendingArgs) {
+				hookItem._args = hookItem._pendingArgs;
+			}
+			if (hookItem._pendingValue !== EMPTY) {
+				hookItem._value = hookItem._pendingValue;
+			}
+			hookItem._pendingArgs = undefined;
+			hookItem._pendingValue = EMPTY;
+		});
+	}
+	previousComponent = currentComponent = null;
+};
+
+options._commit = (vnode, commitQueue) => {
+	commitQueue.some(component => {
+		try {
+			component._renderCallbacks.forEach(invokeCleanup);
+			component._renderCallbacks = component._renderCallbacks.filter(cb =>
+				cb._value ? invokeEffect(cb) : true
+			);
+		} catch (e) {
+			commitQueue.some(c => {
+				if (c._renderCallbacks) c._renderCallbacks = [];
+			});
+			commitQueue = [];
+			options._catchError(e, component._vnode);
+		}
+	});
+
+	if (oldCommit) oldCommit(vnode, commitQueue);
+};
+
+options.unmount = vnode => {
+	if (oldBeforeUnmount) oldBeforeUnmount(vnode);
+
+	const c = vnode._component;
+	if (c && c.__hooks) {
+		let hasErrored;
+		c.__hooks._list.forEach(s => {
+			try {
+				invokeCleanup(s);
+			} catch (e) {
+				hasErrored = e;
+			}
+		});
+		c.__hooks = undefined;
+		if (hasErrored) options._catchError(hasErrored, c._vnode);
+	}
+};
+
+/**
+ * Get a hook's state from the currentComponent
+ * @param {number} index The index of the hook to get
+ * @param {number} type The index of the hook to get
+ * @returns {any}
+ */
+function getHookState(index, type) {
+	if (options._hook) {
+		options._hook(currentComponent, index, currentHook || type);
+	}
+	currentHook = 0;
+
+	// Largely inspired by:
+	// * https://github.com/michael-klein/funcy.js/blob/f6be73468e6ec46b0ff5aa3cc4c9baf72a29025a/src/hooks/core_hooks.mjs
+	// * https://github.com/michael-klein/funcy.js/blob/650beaa58c43c33a74820a3c98b3c7079cf2e333/src/renderer.mjs
+	// Other implementations to look at:
+	// * https://codesandbox.io/s/mnox05qp8
+	const hooks =
+		currentComponent.__hooks ||
+		(currentComponent.__hooks = {
+			_list: [],
+			_pendingEffects: []
+		});
+
+	if (index >= hooks._list.length) {
+		hooks._list.push({ _pendingValue: EMPTY });
+	}
+	return hooks._list[index];
+}
+
+/**
+ * @param {import('./index').StateUpdater<any>} [initialState]
+ */
+export function useState(initialState) {
+	currentHook = 1;
+	return useReducer(invokeOrReturn, initialState);
+}
+
+/**
+ * @param {import('./index').Reducer<any, any>} reducer
+ * @param {import('./index').StateUpdater<any>} initialState
+ * @param {(initialState: any) => void} [init]
+ * @returns {[ any, (state: any) => void ]}
+ */
+export function useReducer(reducer, initialState, init) {
+	/** @type {import('./internal').ReducerHookState} */
+	const hookState = getHookState(currentIndex++, 2);
+	hookState._reducer = reducer;
+	if (!hookState._component) {
+		hookState._value = [
+			!init ? invokeOrReturn(undefined, initialState) : init(initialState),
+
+			action => {
+				const currentValue = hookState._nextValue
+					? hookState._nextValue[0]
+					: hookState._value[0];
+				const nextValue = hookState._reducer(currentValue, action);
+
+				if (currentValue !== nextValue) {
+					hookState._nextValue = [nextValue, hookState._value[1]];
+					hookState._component.setState({});
+				}
+			}
+		];
+
+		hookState._component = currentComponent;
+
+		if (!currentComponent._hasScuFromHooks) {
+			currentComponent._hasScuFromHooks = true;
+			const prevScu = currentComponent.shouldComponentUpdate;
+
+			// This SCU has the purpose of bailing out after repeated updates
+			// to stateful hooks.
+			// we store the next value in _nextValue[0] and keep doing that for all
+			// state setters, if we have next states and
+			// all next states within a component end up being equal to their original state
+			// we are safe to bail out for this specific component.
+			currentComponent.shouldComponentUpdate = function(p, s, c) {
+				if (!hookState._component.__hooks) return true;
+
+				const stateHooks = hookState._component.__hooks._list.filter(
+					x => x._component
+				);
+				const allHooksEmpty = stateHooks.every(x => !x._nextValue);
+				// When we have no updated hooks in the component we invoke the previous SCU or
+				// traverse the VDOM tree further.
+				if (allHooksEmpty) {
+					return prevScu ? prevScu.call(this, p, s, c) : true;
+				}
+
+				// We check whether we have components with a nextValue set that
+				// have values that aren't equal to one another this pushes
+				// us to update further down the tree
+				let shouldUpdate = false;
+				stateHooks.forEach(hookItem => {
+					if (hookItem._nextValue) {
+						const currentValue = hookItem._value[0];
+						hookItem._value = hookItem._nextValue;
+						hookItem._nextValue = undefined;
+						if (currentValue !== hookItem._value[0]) shouldUpdate = true;
+					}
+				});
+
+				return shouldUpdate || hookState._component.props !== p
+					? prevScu
+						? prevScu.call(this, p, s, c)
+						: true
+					: false;
+			};
+		}
+	}
+
+	return hookState._nextValue || hookState._value;
+}
+
+/**
+ * @param {import('./internal').Effect} callback
+ * @param {any[]} args
+ */
+export function useEffect(callback, args) {
+	/** @type {import('./internal').EffectHookState} */
+	const state = getHookState(currentIndex++, 3);
+	if (!options._skipEffects && argsChanged(state._args, args)) {
+		state._value = callback;
+		state._pendingArgs = args;
+
+		currentComponent.__hooks._pendingEffects.push(state);
+	}
+}
+
+/**
+ * @param {import('./internal').Effect} callback
+ * @param {any[]} args
+ */
+export function useLayoutEffect(callback, args) {
+	/** @type {import('./internal').EffectHookState} */
+	const state = getHookState(currentIndex++, 4);
+	if (!options._skipEffects && argsChanged(state._args, args)) {
+		state._value = callback;
+		state._pendingArgs = args;
+
+		currentComponent._renderCallbacks.push(state);
+	}
+}
+
+export function useRef(initialValue) {
+	currentHook = 5;
+	return useMemo(() => ({ current: initialValue }), []);
+}
+
+/**
+ * @param {object} ref
+ * @param {() => object} createHandle
+ * @param {any[]} args
+ */
+export function useImperativeHandle(ref, createHandle, args) {
+	currentHook = 6;
+	useLayoutEffect(
+		() => {
+			if (typeof ref == 'function') {
+				ref(createHandle());
+				return () => ref(null);
+			} else if (ref) {
+				ref.current = createHandle();
+				return () => (ref.current = null);
+			}
+		},
+		args == null ? args : args.concat(ref)
+	);
+}
+
+/**
+ * @param {() => any} factory
+ * @param {any[]} args
+ */
+export function useMemo(factory, args) {
+	/** @type {import('./internal').MemoHookState} */
+	const state = getHookState(currentIndex++, 7);
+	if (argsChanged(state._args, args)) {
+		state._pendingValue = factory();
+		state._pendingArgs = args;
+		state._factory = factory;
+		return state._pendingValue;
+	}
+
+	return state._value;
+}
+
+/**
+ * @param {() => void} callback
+ * @param {any[]} args
+ */
+export function useCallback(callback, args) {
+	currentHook = 8;
+	return useMemo(() => callback, args);
+}
+
+/**
+ * @param {import('./internal').PreactContext} context
+ */
+export function useContext(context) {
+	const provider = currentComponent.context[context._id];
+	// We could skip this call here, but than we'd not call
+	// `options._hook`. We need to do that in order to make
+	// the devtools aware of this hook.
+	/** @type {import('./internal').ContextHookState} */
+	const state = getHookState(currentIndex++, 9);
+	// The devtools needs access to the context object to
+	// be able to pull of the default value when no provider
+	// is present in the tree.
+	state._context = context;
+	if (!provider) return context._defaultValue;
+	// This is probably not safe to convert to "!"
+	if (state._value == null) {
+		state._value = true;
+		provider.sub(currentComponent);
+	}
+	return provider.props.value;
+}
+
+/**
+ * Display a custom label for a custom hook for the devtools panel
+ * @type {<T>(value: T, cb?: (value: T) => string | number) => void}
+ */
+export function useDebugValue(value, formatter) {
+	if (options.useDebugValue) {
+		options.useDebugValue(formatter ? formatter(value) : value);
+	}
+}
+
+/**
+ * @param {(error: any, errorInfo: import('preact').ErrorInfo) => void} cb
+ */
+export function useErrorBoundary(cb) {
+	/** @type {import('./internal').ErrorBoundaryHookState} */
+	const state = getHookState(currentIndex++, 10);
+	const errState = useState();
+	state._value = cb;
+	if (!currentComponent.componentDidCatch) {
+		currentComponent.componentDidCatch = (err, errorInfo) => {
+			if (state._value) state._value(err, errorInfo);
+			errState[1](err);
+		};
+	}
+	return [
+		errState[0],
+		() => {
+			errState[1](undefined);
+		}
+	];
+}
+
+export function useId() {
+	const state = getHookState(currentIndex++, 11);
+	if (!state._value) {
+		// Grab either the root node or the nearest async boundary node.
+		/** @type {import('./internal.d').VNode} */
+		let root = currentComponent._vnode;
+		while (root !== null && !root._mask && root._parent !== null) {
+			root = root._parent;
+		}
+
+		let mask = root._mask || (root._mask = [0, 0]);
+		state._value = 'P' + mask[0] + '-' + mask[1]++;
+	}
+
+	return state._value;
+}
+/**
+ * After paint effects consumer.
+ */
+function flushAfterPaintEffects() {
+	let component;
+	while ((component = afterPaintEffects.shift())) {
+		if (!component._parentDom || !component.__hooks) continue;
+		try {
+			component.__hooks._pendingEffects.forEach(invokeCleanup);
+			component.__hooks._pendingEffects.forEach(invokeEffect);
+			component.__hooks._pendingEffects = [];
+		} catch (e) {
+			component.__hooks._pendingEffects = [];
+			options._catchError(e, component._vnode);
+		}
+	}
+}
+
+let HAS_RAF = typeof requestAnimationFrame == 'function';
+
+/**
+ * Schedule a callback to be invoked after the browser has a chance to paint a new frame.
+ * Do this by combining requestAnimationFrame (rAF) + setTimeout to invoke a callback after
+ * the next browser frame.
+ *
+ * Also, schedule a timeout in parallel to the the rAF to ensure the callback is invoked
+ * even if RAF doesn't fire (for example if the browser tab is not visible)
+ *
+ * @param {() => void} callback
+ */
+function afterNextFrame(callback) {
+	const done = () => {
+		clearTimeout(timeout);
+		if (HAS_RAF) cancelAnimationFrame(raf);
+		setTimeout(callback);
+	};
+	const timeout = setTimeout(done, RAF_TIMEOUT);
+
+	let raf;
+	if (HAS_RAF) {
+		raf = requestAnimationFrame(done);
+	}
+}
+
+// Note: if someone used options.debounceRendering = requestAnimationFrame,
+// then effects will ALWAYS run on the NEXT frame instead of the current one, incurring a ~16ms delay.
+// Perhaps this is not such a big deal.
+/**
+ * Schedule afterPaintEffects flush after the browser paints
+ * @param {number} newQueueLength
+ */
+function afterPaint(newQueueLength) {
+	if (newQueueLength === 1 || prevRaf !== options.requestAnimationFrame) {
+		prevRaf = options.requestAnimationFrame;
+		(prevRaf || afterNextFrame)(flushAfterPaintEffects);
+	}
+}
+
+/**
+ * @param {import('./internal').EffectHookState} hook
+ */
+function invokeCleanup(hook) {
+	// A hook cleanup can introduce a call to render which creates a new root, this will call options.vnode
+	// and move the currentComponent away.
+	const comp = currentComponent;
+	let cleanup = hook._cleanup;
+	if (typeof cleanup == 'function') {
+		hook._cleanup = undefined;
+		cleanup();
+	}
+
+	currentComponent = comp;
+}
+
+/**
+ * Invoke a Hook's effect
+ * @param {import('./internal').EffectHookState} hook
+ */
+function invokeEffect(hook) {
+	// A hook call can introduce a call to render which creates a new root, this will call options.vnode
+	// and move the currentComponent away.
+	const comp = currentComponent;
+	hook._cleanup = hook._value();
+	currentComponent = comp;
+}
+
+/**
+ * @param {any[]} oldArgs
+ * @param {any[]} newArgs
+ */
+function argsChanged(oldArgs, newArgs) {
+	return (
+		!oldArgs ||
+		oldArgs.length !== newArgs.length ||
+		newArgs.some((arg, index) => arg !== oldArgs[index])
+	);
+}
+
+function invokeOrReturn(arg, f) {
+	return typeof f == 'function' ? f(arg) : f;
+}

backend/node_modules/preact/hooks/src/internal.d.ts

@@ -0,0 +1,85 @@
+import {
+	Component as PreactComponent,
+	PreactContext,
+	ErrorInfo,
+	VNode as PreactVNode
+} from '../../src/internal';
+import { Reducer } from '.';
+
+export { PreactContext };
+
+/**
+ * The type of arguments passed to a Hook function. While this type is not
+ * strictly necessary, they are given a type name to make it easier to read
+ * the following types and trace the flow of data.
+ */
+export type HookArgs = any;
+
+/**
+ * The return type of a Hook function. While this type is not
+ * strictly necessary, they are given a type name to make it easier to read
+ * the following types and trace the flow of data.
+ */
+export type HookReturnValue = any;
+
+/** The public function a user invokes to use a Hook */
+export type Hook = (...args: HookArgs[]) => HookReturnValue;
+
+// Hook tracking
+
+export interface ComponentHooks {
+	/** The list of hooks a component uses */
+	_list: HookState[];
+	/** List of Effects to be invoked after the next frame is rendered */
+	_pendingEffects: EffectHookState[];
+}
+
+export interface Component extends PreactComponent<any, any> {
+	__hooks?: ComponentHooks;
+}
+
+export interface VNode extends PreactVNode {
+	_mask?: [number, number];
+}
+
+export type HookState =
+	| EffectHookState
+	| MemoHookState
+	| ReducerHookState
+	| ContextHookState
+	| ErrorBoundaryHookState;
+
+export type Effect = () => void | Cleanup;
+export type Cleanup = () => void;
+
+export interface EffectHookState {
+	_value?: Effect;
+	_args?: any[];
+	_pendingArgs?: any[];
+	_cleanup?: Cleanup | void;
+}
+
+export interface MemoHookState {
+	_value?: any;
+	_pendingValue?: any;
+	_args?: any[];
+	_pendingArgs?: any[];
+	_factory?: () => any;
+}
+
+export interface ReducerHookState {
+	_nextValue?: any;
+	_value?: any;
+	_component?: Component;
+	_reducer?: Reducer<any, any>;
+}
+
+export interface ContextHookState {
+	/** Whether this hooks as subscribed to updates yet */
+	_value?: boolean;
+	_context?: PreactContext;
+}
+
+export interface ErrorBoundaryHookState {
+	_value?: (error: any, errorInfo: ErrorInfo) => void;
+}