fuma 2.0.49 → 2.1.0

package/dist/popover/popover.svelte.d.ts

@@ -0,0 +1,26 @@
+type Alignement = 'start' | 'end';
+type Position = 'left' | 'right' | 'top' | 'bottom';
+export type Placement = Position | `${Position}-${Alignement}`;
+export type PopoverType = ReturnType<typeof usePopover>;
+export type PopoverOptions = {
+    mode?: 'auto' | 'hint' | 'manual';
+    placement?: Placement;
+    listenClick?: boolean;
+    listenFocus?: boolean;
+    listenHover?: boolean;
+    /** Only when listenHover={true} */
+    hideDelay?: number;
+};
+export declare function usePopover({ mode, placement, listenClick, listenFocus, listenHover, hideDelay }?: PopoverOptions): {
+    show: () => void;
+    hide: () => void;
+    readonly isOpen: boolean;
+    content: {
+        [x: symbol]: (node: HTMLElement) => () => void;
+        popover: "auto" | "hint" | "manual";
+    };
+    trigger: {
+        [x: symbol]: (node: HTMLElement) => () => void;
+    };
+};
+export {};

package/dist/popover/popover.svelte.js

@@ -0,0 +1,101 @@
+import debounce from 'debounce';
+import { createAttachmentKey } from 'svelte/attachments';
+import { on } from 'svelte/events';
+const placements = {
+    top: 'top',
+    'top-end': 'top span-left',
+    'top-start': 'top span-right',
+    bottom: 'bottom',
+    'bottom-end': 'bottom span-left',
+    'bottom-start': 'bottom span-right',
+    left: 'left',
+    'left-end': 'left span-top',
+    'left-start': 'left span-bottom',
+    right: 'right',
+    'right-end': 'right span-top',
+    'right-start': 'right span-bottom'
+};
+let popoverInstanceCount = 0;
+export function usePopover({ mode = 'auto', placement = 'bottom-start', listenClick = true, listenFocus = true, listenHover = false, hideDelay = 400 } = {}) {
+    const uid = popoverInstanceCount++;
+    const anchorName = `--anchor-${uid}`;
+    let popover = $state();
+    let isOpen = $state(!!popover?.matches(':popover-open'));
+    const hideDebounced = debounce(hide, hideDelay);
+    function show() {
+        popover?.showPopover();
+    }
+    function hide() {
+        popover?.hidePopover();
+    }
+    function onMouseEnter() {
+        hideDebounced.clear();
+        show();
+    }
+    function onToggle(event) {
+        isOpen = event.newState === 'open';
+    }
+    function attachTriggerListeners(activator) {
+        const cleanups = [];
+        if (listenClick) {
+            cleanups.push(on(activator, 'click', show));
+        }
+        if (listenFocus) {
+            cleanups.push(on(activator, 'focusin', show));
+            // TODO: handle focusout ???
+        }
+        if (listenHover) {
+            cleanups.push(on(activator, 'mouseenter', onMouseEnter));
+            cleanups.push(on(activator, 'mouseleave', hideDebounced));
+        }
+        return () => {
+            for (const cleanup of cleanups)
+                cleanup();
+        };
+    }
+    function attachPopoverListeners(node) {
+        const cleanups = [];
+        cleanups.push(on(node, 'toggle', onToggle));
+        if (listenHover) {
+            cleanups.push(on(node, 'mouseenter', onMouseEnter));
+            cleanups.push(on(node, 'mouseleave', hideDebounced));
+        }
+        return () => {
+            for (const cleanup of cleanups)
+                cleanup();
+        };
+    }
+    return {
+        show,
+        hide,
+        get isOpen() {
+            return isOpen;
+        },
+        content: {
+            popover: mode,
+            [createAttachmentKey()]: (node) => {
+                popover = node;
+                // biome-ignore lint/suspicious/noTsIgnore: await for a svelte-check update
+                // @ts-ignore
+                popover.style.positionAnchor = anchorName;
+                // biome-ignore lint/suspicious/noTsIgnore: await for a svelte-check update
+                // @ts-ignore
+                popover.style.positionArea = placements[placement];
+                popover.style.inset = 'auto';
+                // biome-ignore lint/suspicious/noTsIgnore: await for a svelte-check update
+                // @ts-ignore
+                popover.style.positionTry = 'flip-x, flip-y';
+                popover.style.position = 'relative';
+                return attachPopoverListeners(node);
+            }
+        },
+        trigger: {
+            [createAttachmentKey()]: (node) => {
+                // biome-ignore lint/suspicious/noTsIgnore: await for a svelte-check update
+                // @ts-ignore
+                node.style.anchorName = anchorName;
+                return attachTriggerListeners(node);
+            }
+        }
+    };
+}

package/dist/remote/useForm.d.ts

@@ -0,0 +1,6 @@
+import type { RemoteForm, RemoteFormInput } from '@sveltejs/kit';
+import type { StandardSchemaV1 } from 'runed/kit';
+/**
+ * Enable preflight and run validation on input
+ */
+export declare function useForm<Input extends RemoteFormInput | undefined, Output>(remoteForm: RemoteForm<Input, Output>, schema: StandardSchemaV1<Input>, debounceMs?: number): RemoteForm<Input, Output>;

package/dist/remote/useForm.js

@@ -0,0 +1,22 @@
+import debounce from 'debounce';
+import { createAttachmentKey } from 'svelte/attachments';
+import { on } from 'svelte/events';
+/**
+ * Enable preflight and run validation on input
+ */
+export function useForm(remoteForm, schema, debounceMs = 1000) {
+    const validation = (formElement) => {
+        const debouncedValidate = debounce(() => remoteForm.validate(), debounceMs);
+        return on(formElement, 'input', ({ target }) => {
+            if (target instanceof HTMLInputElement || target instanceof HTMLSelectElement) {
+                const instantValidation = target.ariaInvalid === 'true' ||
+                    target.type === 'checkbox' ||
+                    target.type === 'radio' ||
+                    target.tagName === 'SELECT';
+                instantValidation ? remoteForm.validate() : debouncedValidate();
+            }
+        });
+    };
+    Object.assign(remoteForm, { [createAttachmentKey()]: validation });
+    return remoteForm.preflight(schema);
+}

package/dist/search/Spans.svelte

@@ -0,0 +1,15 @@
+<script lang="ts">
+	import type { SearchQueryResultSpan } from './search.ts'
+
+	let { spans }: { spans: SearchQueryResultSpan[] } = $props()
+</script>
+
+{#each spans as { value, isMatch }}
+	<span
+		class={isMatch ? 'rounded-xs text-secondary' : ''}
+		class:ml-px={value.startsWith(' ')}
+		class:mr-px={value.endsWith(' ')}
+	>
+		{value}
+	</span>
+{/each}

package/dist/search/Spans.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { SearchQueryResultSpan } from './search.ts';
+type $$ComponentProps = {
+    spans: SearchQueryResultSpan[];
+};
+declare const Spans: import("svelte").Component<$$ComponentProps, {}, "">;
+type Spans = ReturnType<typeof Spans>;
+export default Spans;

package/dist/search/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Spans } from './Spans.svelte';
+export * from './search.ts';

package/dist/search/index.js

@@ -0,0 +1,2 @@
+export { default as Spans } from './Spans.svelte';
+export * from './search.ts';

package/dist/search/search.js

@@ -0,0 +1,96 @@
+import Fuse from 'fuse.js';
+import { mergeRanges } from 'perod';
+export function useSearch({ items = [], keys, ...fuseOptions }) {
+    const fuse = new Fuse(items, {
+        includeMatches: true,
+        keys: Object.entries(keys).map(([name, param]) => ({
+            name,
+            ...(param || {})
+        })),
+        ...fuseOptions
+    });
+    function query(value, { tokensSeparator = ' ', tokensMaxCount = 4 } = {}) {
+        const tokens = value.split(tokensSeparator).slice(0, tokensMaxCount);
+        const fuseResults = multiTokenFuseSearch(fuse, tokens);
+        const queryResults = [];
+        for (const { item, matches, score } of fuseResults) {
+            const spans = {};
+            for (const key of Object.keys(keys)) {
+                if (typeof value !== 'string')
+                    throw new Error('Value is not a string');
+                spans[key] = getSpans(key, matches);
+            }
+            queryResults.push({
+                item,
+                score,
+                spans: spans
+            });
+        }
+        return queryResults;
+    }
+    return {
+        ...fuse,
+        query
+    };
+}
+function getSpans(key, matches) {
+    const { indices, value = '' } = matches?.find((m) => m.key === key) || {};
+    if (!indices?.length) {
+        return [{ value, isMatch: false }];
+    }
+    const spans = [];
+    if (indices[0][0] !== 0) {
+        spans.push({ value: value.slice(0, indices[0][0]), isMatch: false });
+    }
+    const len = indices.length;
+    for (let index = 0; index < len; index++) {
+        const [start, end] = indices[index];
+        const nextStart = index === len - 1 ? undefined : indices[index + 1][0];
+        spans.push({ value: value.slice(start, end + 1), isMatch: true });
+        if (end < value.length) {
+            spans.push({ value: value.slice(end + 1, nextStart), isMatch: false });
+        }
+    }
+    return spans;
+}
+function multiTokenFuseSearch(fuse, tokens) {
+    const resultsMap = new Map();
+    function ensureEntry(item) {
+        let entry = resultsMap.get(item);
+        if (entry)
+            return entry;
+        entry = { item, score: 0, matches: [] };
+        resultsMap.set(item, entry);
+        return entry;
+    }
+    for (const token of tokens) {
+        const results = fuse.search(token);
+        for (const { item, score, matches } of results) {
+            const entry = ensureEntry(item);
+            if (!matches)
+                continue;
+            entry.score += score || 0;
+            entry.matches = mergeMatches(entry.matches, matches);
+        }
+    }
+    return [...resultsMap.values()].sort((a, b) => a.score - b.score);
+}
+function mergeMatches(a, b) {
+    if (!b || b.length === 0)
+        return a;
+    const merged = [...a];
+    for (const match of b) {
+        const existing = merged.find((m) => m.key === match.key);
+        if (existing) {
+            // TODO: update perod package to handle tuple and export types
+            existing.indices = mergeRanges([...existing.indices, ...match.indices].map(([start, end]) => ({
+                start,
+                end
+            }))).map(({ start, end }) => [start, end]);
+        }
+        else {
+            merged.push({ ...match });
+        }
+    }
+    return merged;
+}

package/dist/server/index.d.ts

@@ -1,7 +1,3 @@
-export * from './json.js';
-export * from './parseFormData.js';
 export * from './parseQuery.js';
 export * from './sse.js';
-export * from './try.js';
-export * from './formAction.js';
 export * from './table.js';

package/dist/server/index.js

@@ -1,7 +1,3 @@
-export * from './json.js';
-export * from './parseFormData.js';
 export * from './parseQuery.js';
 export * from './sse.js';
-export * from './try.js';
-export * from './formAction.js';
 export * from './table.js';

package/dist/server/parseQuery.js

@@ -1,5 +1,5 @@
-import z from 'zod';
 import { error } from '@sveltejs/kit';
+import z from 'zod';
 export function parseQuery(url, shape) {
     const queryRaw = {};
     Object.keys(shape).forEach((name) => {

package/dist/server/sse.js

@@ -12,13 +12,13 @@ export function createSSE(last_id = 0, retry = 0) {
             if (event)
                 msg += `event: ${event}\n`;
             if (typeof data === 'string') {
-                msg += 'data: ' + data.trim().replace(/\n+/gm, '\ndata: ') + '\n';
+                msg += `data: ${data.trim().replace(/\n+/gm, '\ndata: ')}\n`;
             }
             else {
                 msg += `data: ${JSON.stringify(data)}\n`;
             }
-            controller.enqueue(msg + '\n');
-        },
+            controller.enqueue(`${msg}\n`);
+        }
     });
     const writer = writable.getWriter();
     return {
@@ -30,6 +30,6 @@ export function createSSE(last_id = 0, retry = 0) {
             eventEmitter.on(event, listener);
             await writer.closed.catch(() => { });
             eventEmitter.off(event, listener);
-        },
+        }
     };
 }

package/dist/server/table.js

@@ -1,6 +1,6 @@
 import { redirect } from '@sveltejs/kit';
-import { jsonParse } from '../utils/jsonParse.js';
 import { createKeys } from '../ui/table/context.js';
+import { jsonParse } from '../utils/jsonParse.js';
 export function ensureFieldsWithFilterAreVisibles(tableKey, url, isFilterKey) {
     const { KEY_FIELDS_VISIBLE, KEY_FIELDS_HIDDEN } = createKeys(tableKey);
     const fieldsVisible = jsonParse(url.searchParams.get(KEY_FIELDS_VISIBLE), []);

package/dist/state/index.d.ts

@@ -0,0 +1 @@
+export * from './param.svelte.js';

package/dist/state/index.js

@@ -0,0 +1 @@
+export * from './param.svelte.js';

package/dist/state/param.svelte.d.ts

@@ -0,0 +1,18 @@
+export declare const param: {
+    readonly with: (params: Record<string, string | number>, ...keysToRemove: string[]) => string;
+    readonly without: (...keys: string[]) => string;
+    readonly toggle: (params: Record<string, string>, ...keysToRemove: string[]) => string;
+    readonly has: (key: string) => boolean;
+    readonly get: (key: string) => string | null;
+    readonly hasValue: (key: string, value: string) => boolean;
+    readonly keys: () => URLSearchParamsIterator<string>;
+};
+export declare const urlParam: {
+    with: (params: Record<string, string | number>, ...keysToRemove: string[]) => string;
+    without: (...args: string[]) => string;
+    toggle: (params: Record<string, string>, ...keysToRemove: string[]) => string;
+    has: (key: string) => boolean;
+    get: (key: string) => string | null;
+    hasValue: (key: string, value: string) => boolean;
+    keys: () => URLSearchParamsIterator<string>;
+};

package/dist/state/param.svelte.js

@@ -0,0 +1,66 @@
+import { page } from '$app/state';
+export const param = {
+    get with() {
+        return (params, ...keysToRemove) => {
+            const url = new URL(page.url);
+            Object.entries(params).forEach(([key, value]) => {
+                url.searchParams.set(key, String(value));
+            });
+            keysToRemove.forEach((key) => {
+                url.searchParams.delete(key);
+            });
+            return url.search;
+        };
+    },
+    get without() {
+        return (...keys) => {
+            const url = new URL(page.url);
+            keys.forEach((key) => {
+                url.searchParams.delete(key);
+            });
+            return url.search;
+        };
+    },
+    get toggle() {
+        return (params, ...keysToRemove) => {
+            const url = new URL(page.url);
+            Object.entries(params).forEach(([key, value]) => {
+                if (url.searchParams.get(key) === value)
+                    url.searchParams.delete(key);
+                else
+                    url.searchParams.set(key, value);
+            });
+            keysToRemove.forEach((key) => {
+                url.searchParams.delete(key);
+            });
+            return url.search;
+        };
+    },
+    get has() {
+        return (key) => page.url.searchParams.has(key);
+    },
+    get get() {
+        return (key) => page.url.searchParams.get(key);
+    },
+    get hasValue() {
+        return (key, value) => page.url.searchParams.get(key) === value;
+    },
+    get keys() {
+        return () => page.url.searchParams.keys();
+    }
+};
+function addPathname(fn) {
+    return (...args) => page.url.pathname + fn(...args);
+}
+export const urlParam = {
+    ...param,
+    get with() {
+        return addPathname(param.with);
+    },
+    get without() {
+        return addPathname(param.without);
+    },
+    get toggle() {
+        return addPathname(param.toggle);
+    }
+};

package/dist/ui/button/ButtonDelete.svelte

@@ -1,45 +1,66 @@
 <script lang="ts">
-	let klass = ''
-	export { klass as class }
-	export let formaction: string
-	export let disabled = false
-	export let btn = true
+	import type { Snippet } from 'svelte'
+	import type { HTMLButtonAttributes, MouseEventHandler } from 'svelte/elements'
+
+	let {
+		btn = true,
+		children,
+		formaction = '',
+		onclick: onclickProp,
+		onmouseleave: onmouseleaveProp,
+		...props
+	}: {
+		/** Form action URL triggered on confirmation */
+		formaction: string
+		/** Apply button styles */
+		btn?: boolean
+		/** Custom button content */
+		children?: Snippet<[{ waitConfirmation: boolean }]>
+	} & HTMLButtonAttributes = $props()
 
 	let button: HTMLButtonElement
-	let width = 0
-	let ready = false
+	let waitConfirmation = $state(false)
 	let timeout: NodeJS.Timeout
-	function handleClick(event: MouseEvent) {
-		if (ready) return
-		width = button.offsetWidth
+
+	const onclick: MouseEventHandler<HTMLButtonElement> = (event) => {
+		onclickProp?.(event)
+		if (waitConfirmation) return
 		event.preventDefault()
-		ready = true
-		timeout = setTimeout(() => (ready = false), 2000)
+		button.style.width = `${button.offsetWidth}px`
+		waitConfirmation = true
+		timeout = setTimeout(() => {
+			waitConfirmation = false
+			button.style.width = ''
+		}, 2000)
 	}
 
-	function handleLeave() {
-		ready = false
+	const onmouseleave: MouseEventHandler<HTMLButtonElement> = (event) => {
+		onmouseleaveProp?.(event)
+		waitConfirmation = false
+		button.style.width = ''
 		clearTimeout(timeout)
 	}
 </script>
 
 <button
 	bind:this={button}
-	class={klass}
-	class:btn
-	class:btn-error={btn && ready}
-	class:btn-outline={btn && ready}
-	class:text-error={btn && !ready}
-	class:btn-ghost={btn && !ready}
-	class:btn-disabled={disabled}
-	style:width={ready ? `${width}px` : ''}
-	on:click={handleClick}
-	on:mouseleave={handleLeave}
-	formaction={ready ? formaction : undefined}
+	class={[
+		btn && [
+			'btn',
+			waitConfirmation ? 'btn-outline btn-error' : 'text-error btn-ghost',
+			props.disabled && 'btn-disabled'
+		]
+	]}
+	formaction={waitConfirmation ? formaction : undefined}
+	{onclick}
+	{onmouseleave}
+	{...props}
 >
-	{#if ready}
-		<slot name="ready"><span>T'es sur ?</span></slot>
+	{#if children}
+		{@render children({ waitConfirmation })}
+	{:else if waitConfirmation}
+		<span>T'es sur ?</span>
 	{:else}
-		<slot>Supprimer</slot>
+		<span>Supprimer</span>
 	{/if}
 </button>

package/dist/ui/button/ButtonDelete.svelte.d.ts

@@ -1,34 +1,15 @@
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
-    default: any;
-} ? Props extends Record<string, never> ? any : {
-    children?: any;
-} : {});
-declare const ButtonDelete: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
-    class?: string;
+import type { Snippet } from 'svelte';
+import type { HTMLButtonAttributes } from 'svelte/elements';
+type $$ComponentProps = {
+    /** Form action URL triggered on confirmation */
     formaction: string;
-    disabled?: boolean;
+    /** Apply button styles */
     btn?: boolean;
-}, {
-    ready: {};
-    default: {};
-}>, {
-    [evt: string]: CustomEvent<any>;
-}, {
-    ready: {};
-    default: {};
-}, {}, string>;
-type ButtonDelete = InstanceType<typeof ButtonDelete>;
+    /** Custom button content */
+    children?: Snippet<[{
+        waitConfirmation: boolean;
+    }]>;
+} & HTMLButtonAttributes;
+declare const ButtonDelete: import("svelte").Component<$$ComponentProps, {}, "">;
+type ButtonDelete = ReturnType<typeof ButtonDelete>;
 export default ButtonDelete;

package/dist/ui/button/index.d.ts

@@ -1,2 +1 @@
-export { default as ButtonCopy } from './ButtonCopy.svelte';
 export { default as ButtonDelete } from './ButtonDelete.svelte';

package/dist/ui/button/index.js

@@ -1,2 +1 @@
-export { default as ButtonCopy } from './ButtonCopy.svelte';
 export { default as ButtonDelete } from './ButtonDelete.svelte';

package/dist/ui/copy/ButtonCopy.svelte

@@ -0,0 +1,43 @@
+<script lang="ts">
+	import { CopyIcon, type IconProps } from '@lucide/svelte'
+	import type { Component } from 'svelte'
+	import type { ClassValue } from 'svelte/elements'
+	import { tip } from '../../action/tip.js'
+	import { type UseCopyOptions, useCopy } from './useCopy.svelte.ts'
+
+	let {
+		title = '',
+		label = '',
+		Icon = CopyIcon,
+		class: klass = '',
+		...copyOptions
+	}: {
+		/** Tooltip text */
+		title?: string
+		/** Button label */
+		label?: string
+		/** Icon component */
+		Icon?: Component<IconProps>
+		/** Additional CSS classes */
+		class?: ClassValue
+	} & UseCopyOptions = $props()
+
+	const copy = $derived(useCopy(copyOptions))
+</script>
+
+<div class="relative">
+	{#if copy.isLoading}
+		<span class="loading absolute top-1 left-1 scale-125 loading-spinner opacity-25"></span>
+	{/if}
+	<button
+		type="button"
+		class={klass ? klass : `btn btn-sm ${label ? '' : ' btn-square'}`}
+		{...copy}
+		use:tip={{ content: title }}
+	>
+		<Icon size={20} class="transition-transform {copy.isLoading ? 'scale-75' : ''}" />
+		{#if label}
+			<span>{label}</span>
+		{/if}
+	</button>
+</div>

package/dist/ui/copy/ButtonCopy.svelte.d.ts

@@ -0,0 +1,17 @@
+import { type IconProps } from '@lucide/svelte';
+import type { Component } from 'svelte';
+import type { ClassValue } from 'svelte/elements';
+import { type UseCopyOptions } from './useCopy.svelte.ts';
+type $$ComponentProps = {
+    /** Tooltip text */
+    title?: string;
+    /** Button label */
+    label?: string;
+    /** Icon component */
+    Icon?: Component<IconProps>;
+    /** Additional CSS classes */
+    class?: ClassValue;
+} & UseCopyOptions;
+declare const ButtonCopy: Component<$$ComponentProps, {}, "">;
+type ButtonCopy = ReturnType<typeof ButtonCopy>;
+export default ButtonCopy;

package/dist/ui/copy/index.d.ts

@@ -0,0 +1,2 @@
+export { default as ButtonCopy } from './ButtonCopy.svelte';
+export * from './useCopy.svelte.ts';

package/dist/ui/copy/index.js

@@ -0,0 +1,2 @@
+export { default as ButtonCopy } from './ButtonCopy.svelte';
+export * from './useCopy.svelte.ts';