@svadmin/ui 0.78.1 → 0.79.0

package/dist/components/list-deletion.svelte.js

@@ -0,0 +1,111 @@
+import { tick } from 'svelte';
+import { DeleteManyPartialError, getAdminOptions } from '@svadmin/core';
+export function createListDeletion(options) {
+    let request = $state(null);
+    let open = $state(false);
+    let message = $state('');
+    let pending = $state(false);
+    let activeDelete;
+    $effect(() => {
+        if (request && !options.permission().isLoading && !options.permission().allowed) {
+            open = false;
+            request = null;
+            options.reportError(options.messages.failure());
+        }
+    });
+    $effect(() => () => { activeDelete = undefined; });
+    function requestDelete(id) {
+        if (!options.canRequestSingle() || pending)
+            return;
+        message = options.messages.single();
+        request = { ids: [id], batch: false };
+        options.reportError(null);
+        open = true;
+    }
+    function requestBatchDelete() {
+        const ids = [...options.selection().selectedIds];
+        if (!options.canRequestBatch() || ids.length === 0 || pending)
+            return;
+        message = options.messages.batch(ids.length);
+        request = { ids, batch: true };
+        options.reportError(null);
+        open = true;
+    }
+    function cancel() {
+        if (pending)
+            return;
+        open = false;
+        request = null;
+    }
+    function cancelBatchOnCriteriaChange() {
+        if (request?.batch && !pending)
+            cancel();
+    }
+    function reset() {
+        activeDelete = undefined;
+        open = false;
+        pending = false;
+        request = null;
+        options.reportError(null);
+    }
+    async function confirm() {
+        if (!open || !options.canConfirm() || pending || !request)
+            return;
+        const confirmedRequest = request;
+        const selection = options.selection();
+        if (confirmedRequest.batch && JSON.stringify(confirmedRequest.ids) !== JSON.stringify(selection.selectedIds)) {
+            cancel();
+            return;
+        }
+        const scopeIsCurrent = options.captureScope();
+        const token = {};
+        activeDelete = token;
+        pending = true;
+        open = false;
+        const clearBeforeMutation = confirmedRequest.batch && getAdminOptions().mutationMode === 'undoable';
+        const selectionBeforeDelete = clearBeforeMutation ? selection.captureExplicit() : undefined;
+        if (clearBeforeMutation)
+            options.clearSelection();
+        const current = () => activeDelete === token && scopeIsCurrent();
+        try {
+            await options.mutate([...confirmedRequest.ids]);
+            if (!current())
+                return;
+            options.clearSelection();
+            await tick();
+            if (!current())
+                return;
+            open = false;
+        }
+        catch (error) {
+            if (!current())
+                return;
+            if (error instanceof DeleteManyPartialError) {
+                selection.retainFailedIds(error.failedIds);
+                options.reportError(options.messages.partial(error.failedIds.length, confirmedRequest.ids.length));
+            }
+            else {
+                if (selectionBeforeDelete)
+                    selection.restoreExplicit(selectionBeforeDelete);
+                options.reportError(options.messages.failure());
+            }
+            open = false;
+        }
+        finally {
+            if (activeDelete === token) {
+                activeDelete = undefined;
+                pending = false;
+                request = null;
+            }
+            await tick();
+            await tick();
+        }
+    }
+    return {
+        get request() { return request; },
+        get open() { return open; },
+        get pending() { return pending; },
+        get message() { return message; },
+        requestDelete, requestBatchDelete, confirm, cancel, cancelBatchOnCriteriaChange, reset,
+    };
+}

package/dist/components/list-selection.svelte.d.ts

@@ -0,0 +1,31 @@
+import type { Filter, Sort } from '@svadmin/core';
+import type { RowSelectionState } from '@tanstack/svelte-table';
+import { type BatchSelection } from './table-contract.js';
+interface ListSelectionOptions {
+    filters: () => Filter[];
+    sorters: () => Sort[];
+    total: () => number;
+    selectable: () => boolean;
+    allowAllMatching: () => boolean;
+    onCriteriaChange: () => void;
+}
+export declare function createListSelection(options: ListSelectionOptions): {
+    rowSelection: RowSelectionState;
+    readonly allMatchingSelected: boolean;
+    readonly selectedIds: (string | number)[];
+    readonly selectedCount: number;
+    rowIsSelected: (key: string) => boolean;
+    trackRow: (key: string, id: string | number, selected: boolean) => void;
+    toggleExcluded: (key: string, id: string | number) => void;
+    selectAllMatching: () => void;
+    snapshot: (page: ReadonlyArray<{
+        key: string;
+        id: string | number;
+    }>) => BatchSelection;
+    reset: () => void;
+    clearExplicit: () => void;
+    captureExplicit: () => Map<string, string | number>;
+    restoreExplicit: (ids: ReadonlyMap<string, string | number>) => void;
+    retainFailedIds: (ids: (string | number)[]) => void;
+};
+export {};

package/dist/components/list-selection.svelte.js

@@ -0,0 +1,100 @@
+import { untrack } from 'svelte';
+import { SvelteMap } from 'svelte/reactivity';
+import { tableRowKey } from './table-contract.js';
+import { cloneListFilter } from './list-state.svelte.js';
+export function createListSelection(options) {
+    let rowSelection = $state({});
+    let allMatchingSelected = $state(false);
+    const selectedIdValueByKey = new SvelteMap();
+    const excludedMatchingIds = new SvelteMap();
+    const selectedIds = $derived(Object.keys(rowSelection).filter(key => rowSelection[key] === true).flatMap(key => {
+        const id = selectedIdValueByKey.get(key);
+        return id === undefined ? [] : [id];
+    }));
+    const selectedCount = $derived(allMatchingSelected
+        ? Math.max(0, options.total() - excludedMatchingIds.size) : selectedIds.length);
+    const criteria = $derived(JSON.stringify(options.filters()));
+    let previousCriteria = untrack(() => criteria);
+    $effect.pre(() => {
+        const nextCriteria = criteria;
+        if (nextCriteria !== previousCriteria) {
+            reset();
+            options.onCriteriaChange();
+        }
+        previousCriteria = nextCriteria;
+    });
+    $effect.pre(() => {
+        if (!options.selectable() || !options.allowAllMatching())
+            clearMatching();
+        if (!options.selectable())
+            clearExplicit();
+    });
+    function clearMatching() {
+        allMatchingSelected = false;
+        excludedMatchingIds.clear();
+    }
+    function clearExplicit() {
+        selectedIdValueByKey.clear();
+        rowSelection = {};
+    }
+    function reset() {
+        clearMatching();
+        clearExplicit();
+    }
+    function rowIsSelected(key) {
+        return allMatchingSelected ? !excludedMatchingIds.has(key) : rowSelection[key] === true;
+    }
+    function trackRow(key, id, selected) {
+        if (selected)
+            selectedIdValueByKey.set(key, id);
+        else
+            selectedIdValueByKey.delete(key);
+    }
+    function toggleExcluded(key, id) {
+        if (excludedMatchingIds.has(key))
+            excludedMatchingIds.delete(key);
+        else
+            excludedMatchingIds.set(key, id);
+    }
+    function selectAllMatching() {
+        clearExplicit();
+        excludedMatchingIds.clear();
+        allMatchingSelected = true;
+    }
+    function snapshot(page) {
+        if (allMatchingSelected)
+            return {
+                scope: 'all',
+                filters: options.filters().map(cloneListFilter),
+                sorters: options.sorters().map(sorter => ({ ...sorter })),
+                total: options.total(),
+                excludedIds: [...excludedMatchingIds.values()],
+            };
+        return {
+            scope: 'selected',
+            ids: [...selectedIds],
+            currentPageIds: page.filter(row => rowSelection[row.key] === true).map(row => row.id),
+        };
+    }
+    function captureExplicit() {
+        return new Map(selectedIdValueByKey);
+    }
+    function restoreExplicit(ids) {
+        selectedIdValueByKey.clear();
+        for (const [key, id] of ids)
+            selectedIdValueByKey.set(key, id);
+        rowSelection = Object.fromEntries([...ids.keys()].map(key => [key, true]));
+    }
+    function retainFailedIds(ids) {
+        restoreExplicit(new Map(ids.map(id => [tableRowKey(id), id])));
+    }
+    return {
+        get rowSelection() { return rowSelection; },
+        set rowSelection(value) { rowSelection = value; },
+        get allMatchingSelected() { return allMatchingSelected; },
+        get selectedIds() { return selectedIds; },
+        get selectedCount() { return selectedCount; },
+        rowIsSelected, trackRow, toggleExcluded, selectAllMatching, snapshot,
+        reset, clearExplicit, captureExplicit, restoreExplicit, retainFailedIds,
+    };
+}

package/dist/components/list-state.svelte.d.ts

@@ -0,0 +1,49 @@
+import type { FieldDefinition, Filter, Pagination, Sort, readURLState, writeURLState } from '@svadmin/core';
+import type { SavedListViewState } from './saved-list-views.js';
+type URLState = ReturnType<typeof readURLState>;
+type ListStateSnapshot = Pick<SavedListViewState, 'search' | 'filters' | 'sorters' | 'pagination'>;
+interface ListStateOptions {
+    fields: () => FieldDefinition[];
+    defaultPageSize: () => number;
+    defaultSort: () => Sort | undefined;
+    externalPagination: () => Pagination | undefined;
+    externalSorters: () => Sort[] | undefined;
+    initialURLState: URLState;
+    initialViewState: SavedListViewState | undefined;
+    syncWithLocation: () => boolean;
+    writeURLState: (state: Parameters<typeof writeURLState>[0]) => void;
+    onDirty: () => void;
+}
+export declare function cloneListFilter(filter: Filter): Filter;
+export declare function createListState(options: ListStateOptions): {
+    pagination: Pagination;
+    sorters: Sort[];
+    readonly searchText: string;
+    readonly appliedSearchText: string;
+    readonly filterValues: Record<string, string>;
+    readonly searchableFields: FieldDefinition[];
+    readonly filterableFields: FieldDefinition[];
+    readonly activeFilterCount: number;
+    readonly activeFilterItems: {
+        index: number;
+        label: string;
+    }[];
+    readonly activeFilters: Filter[];
+    readonly queryPagination: Pagination;
+    readonly querySorters: {
+        field: string;
+        order: "desc" | "asc";
+    }[];
+    readonly queryFilters: Filter[];
+    scheduleSearch: (value: string) => void;
+    flushSearch: () => void;
+    cancelSearch: () => void;
+    clearSearch: () => void;
+    clearFilters: () => void;
+    setFilterValue: (field: string, value: string) => void;
+    removeActiveFilter: (index: number) => void;
+    captureState: () => ListStateSnapshot;
+    applyState: (state: ListStateSnapshot) => void;
+    resetToDefaults: () => void;
+};
+export {};

package/dist/components/list-state.svelte.js

@@ -0,0 +1,225 @@
+import { untrack } from 'svelte';
+import { definedOptions } from '@svadmin/core/options';
+import { snapshotPlainData } from '@svadmin/core/schema';
+export function cloneListFilter(filter) {
+    if ('field' in filter) {
+        return {
+            field: filter.field,
+            operator: filter.operator,
+            value: filter.value === undefined ? undefined : snapshotPlainData(filter.value),
+        };
+    }
+    return { operator: filter.operator, value: filter.value.map(cloneListFilter) };
+}
+function editableValues(filters, fields) {
+    const keys = new Set(fields.filter(field => field.filterable).map(field => field.key));
+    const counts = new Map();
+    const values = {};
+    for (const filter of filters) {
+        if ('field' in filter && filter.operator === 'contains' && typeof filter.value === 'string' && keys.has(filter.field)) {
+            counts.set(filter.field, (counts.get(filter.field) ?? 0) + 1);
+        }
+    }
+    for (const filter of filters) {
+        if ('field' in filter && filter.operator === 'contains' && typeof filter.value === 'string' && counts.get(filter.field) === 1) {
+            values[filter.field] = filter.value;
+        }
+    }
+    return values;
+}
+export function createListState(options) {
+    const url = options.initialURLState;
+    const initialView = options.initialViewState;
+    let pagination = $state(untrack(() => options.externalPagination() ?? {
+        current: url.page ?? initialView?.pagination.current ?? 1,
+        pageSize: url.pageSize ?? initialView?.pagination.pageSize ?? options.defaultPageSize(),
+    }));
+    let sorters = $state(untrack(() => {
+        const defaultSort = options.defaultSort();
+        return options.externalSorters() ?? (url.sortField
+            ? [{ field: url.sortField, order: url.sortOrder ?? 'asc' }]
+            : initialView?.sorters ?? (defaultSort ? [defaultSort] : []));
+    }));
+    let filters = $state(url.filters ?? initialView?.filters ?? []);
+    let filterValues = $state(untrack(() => editableValues(filters, options.fields())));
+    let searchText = $state(url.search ?? initialView?.search ?? '');
+    let appliedSearchText = $state(untrack(() => searchText));
+    let searchTimer;
+    const searchableFields = $derived(options.fields().filter(field => field.searchable));
+    const filterableFields = $derived(options.fields().filter(field => field.filterable));
+    const activeFilterItems = $derived.by(() => {
+        const labels = new Map(options.fields().map(field => [field.key, field.label]));
+        return filters.map((filter, index) => ({
+            index,
+            label: 'field' in filter
+                ? `${labels.get(filter.field) ?? filter.field}: ${String(filter.value)}`
+                : filter.operator,
+        }));
+    });
+    const activeFilters = $derived.by(() => {
+        const result = [...filters];
+        if (appliedSearchText.trim() && searchableFields.length > 0) {
+            const first = searchableFields[0];
+            if (searchableFields.length === 1 && first) {
+                result.push({ field: first.key, operator: 'contains', value: appliedSearchText });
+            }
+            else {
+                result.push({
+                    operator: 'or',
+                    value: searchableFields.map(field => ({
+                        field: field.key, operator: 'contains', value: appliedSearchText,
+                    })),
+                });
+            }
+        }
+        return result;
+    });
+    const queryPagination = $derived(definedOptions({
+        current: pagination.current, pageSize: pagination.pageSize, mode: pagination.mode,
+    }));
+    const querySorters = $derived(sorters.map(sorter => ({ field: sorter.field, order: sorter.order })));
+    const queryFilters = $derived(activeFilters.map(cloneListFilter));
+    $effect(() => {
+        const external = options.externalPagination();
+        if (external)
+            pagination = external;
+    });
+    $effect(() => {
+        const external = options.externalSorters();
+        if (external)
+            sorters = external;
+    });
+    $effect(() => {
+        if (!options.syncWithLocation())
+            return;
+        options.writeURLState({
+            page: pagination.current,
+            pageSize: pagination.pageSize,
+            sortField: sorters[0]?.field,
+            sortOrder: sorters[0]?.order,
+            search: appliedSearchText || undefined,
+            filters,
+        });
+    });
+    $effect(() => cancelSearch);
+    function cancelSearch() {
+        if (searchTimer !== undefined)
+            clearTimeout(searchTimer);
+        searchTimer = undefined;
+    }
+    function scheduleSearch(value) {
+        options.onDirty();
+        searchText = value;
+        cancelSearch();
+        searchTimer = setTimeout(() => {
+            appliedSearchText = searchText;
+            options.onDirty();
+            pagination = { ...pagination, current: 1 };
+            searchTimer = undefined;
+        }, 300);
+    }
+    function flushSearch() {
+        if (searchTimer === undefined)
+            return;
+        cancelSearch();
+        appliedSearchText = searchText;
+    }
+    function clearSearch() {
+        searchText = '';
+        appliedSearchText = '';
+        pagination = { ...pagination, current: 1 };
+    }
+    function clearFilters() {
+        options.onDirty();
+        cancelSearch();
+        clearSearch();
+        filters = [];
+        filterValues = {};
+    }
+    function setFilterValue(field, value) {
+        options.onDirty();
+        const trimmedValue = value.trim();
+        const nextFilter = { field, operator: 'contains', value: trimmedValue };
+        let replaced = false;
+        filters = filters.flatMap(filter => {
+            if (!('field' in filter) || filter.field !== field || filter.operator !== 'contains')
+                return [filter];
+            if (!trimmedValue || replaced)
+                return [];
+            replaced = true;
+            return [nextFilter];
+        });
+        if (trimmedValue && !replaced)
+            filters = [...filters, nextFilter];
+        filterValues[field] = value;
+        pagination = { ...pagination, current: 1 };
+    }
+    function removeActiveFilter(index) {
+        options.onDirty();
+        const filter = filters[index];
+        if (!filter)
+            return;
+        const nextFilters = filters.filter((_, filterIndex) => filterIndex !== index);
+        filters = nextFilters;
+        if ('field' in filter && filter.operator === 'contains') {
+            const remaining = nextFilters.filter(candidate => ('field' in candidate && candidate.field === filter.field
+                && candidate.operator === 'contains' && typeof candidate.value === 'string'));
+            const first = remaining[0];
+            filterValues[filter.field] = remaining.length === 1 && first && 'field' in first
+                ? String(first.value) : '';
+        }
+        pagination = { ...pagination, current: 1 };
+    }
+    function captureState() {
+        return {
+            search: appliedSearchText,
+            filters: filters.map(cloneListFilter),
+            sorters: sorters.map(sorter => ({ ...sorter })),
+            pagination: {
+                current: pagination.current ?? 1,
+                pageSize: pagination.pageSize ?? options.defaultPageSize(),
+            },
+        };
+    }
+    function applyState(state) {
+        cancelSearch();
+        searchText = state.search;
+        appliedSearchText = state.search;
+        filters = state.filters;
+        filterValues = editableValues(state.filters, options.fields());
+        pagination = { ...pagination, ...state.pagination };
+        sorters = state.sorters;
+    }
+    function resetToDefaults() {
+        cancelSearch();
+        searchText = '';
+        appliedSearchText = '';
+        filters = [];
+        filterValues = {};
+        if (!options.externalPagination())
+            pagination = { current: 1, pageSize: options.defaultPageSize() };
+        if (!options.externalSorters()) {
+            const defaultSort = options.defaultSort();
+            sorters = defaultSort ? [{ ...defaultSort }] : [];
+        }
+    }
+    return {
+        get pagination() { return pagination; },
+        set pagination(value) { pagination = value; },
+        get sorters() { return sorters; },
+        set sorters(value) { sorters = value; },
+        get searchText() { return searchText; },
+        get appliedSearchText() { return appliedSearchText; },
+        get filterValues() { return filterValues; },
+        get searchableFields() { return searchableFields; },
+        get filterableFields() { return filterableFields; },
+        get activeFilterCount() { return filters.length; },
+        get activeFilterItems() { return activeFilterItems; },
+        get activeFilters() { return activeFilters; },
+        get queryPagination() { return queryPagination; },
+        get querySorters() { return querySorters; },
+        get queryFilters() { return queryFilters; },
+        scheduleSearch, flushSearch, cancelSearch, clearSearch, clearFilters, setFilterValue, removeActiveFilter,
+        captureState, applyState, resetToDefaults,
+    };
+}

package/dist/components/saved-list-views.svelte.d.ts

@@ -0,0 +1,42 @@
+import { SvelteMap } from 'svelte/reactivity';
+import { type ListPreferenceScope, type SavedListView, type SavedListViewAccess, type SavedListViewProvider, type SavedListViewState, type SavedListViewSubject } from './saved-list-views.js';
+interface SavedListViewsOptions {
+    scope: () => ListPreferenceScope;
+    columns: () => Set<string>;
+    provider: () => SavedListViewProvider | undefined;
+    isScopeLoaded: () => boolean;
+    readPreference: (scope: ListPreferenceScope, key: string, legacyKey: string) => string | null;
+    hasExplicitURLState: boolean;
+    canApplyRemoteDefault: () => boolean;
+    captureState: () => SavedListViewState;
+    applyState: (state: SavedListViewState) => void;
+}
+export declare function createSavedListViews(options: SavedListViewsOptions): {
+    initialSavedView: SavedListView | undefined;
+    readonly availableSavedViews: SavedListView[];
+    readonly activeSavedViewId: string | undefined;
+    readonly activeSavedViewName: string | undefined;
+    savedViewName: string;
+    savedViewsOpen: boolean;
+    savedViewSource: "local" | "team" | "system";
+    readonly remoteViewsLoading: boolean;
+    readonly remoteViewsFailed: boolean;
+    readonly savedViewMutationPending: boolean;
+    readonly savedViewMutationError: "failure" | "conflict" | undefined;
+    accessDrafts: SvelteMap<string, SavedListViewAccess>;
+    accessSubjects: SvelteMap<string, SavedListViewSubject[]>;
+    accessSubjectsLoading: SvelteMap<string, boolean>;
+    accessSubjectsFailed: SvelteMap<string, boolean>;
+    accessSubjectQueries: SvelteMap<string, string>;
+    restoreScope: (scope: ListPreferenceScope) => SavedListView | undefined;
+    markSavedViewDirty: () => void;
+    clearActiveSavedView: () => void;
+    applySavedView: (view: SavedListView) => void;
+    saveCurrentView: () => void;
+    deleteSavedView: (id: string) => void;
+    setRemoteDefault: (view: SavedListView) => void;
+    saveRemoteAccess: (view: SavedListView) => void;
+    loadAccessSubjects: (view: SavedListView, query?: string) => void;
+    reload(): void;
+};
+export {};