@svadmin/core 0.22.0 → 0.23.0

package/src/table-hooks.svelte.ts

@@ -1,8 +1,9 @@
 import { useParsed } from './useParsed.svelte';
 import { useList } from './query-hooks.svelte';
 import { readURLState, writeURLState } from './url-sync';
+import { getAdminOptions } from './options.svelte';
 import type { Pagination, Sort, Filter, BaseRecord, HttpError, KnownResources, GetListResult } from './types';
-import type { UseListOptions } from './query-hooks.svelte';
+import type { UseListOptions, MaybeGetter } from './query-hooks.svelte';
 
 export type FilterSetMode = 'merge' | 'replace';
 
@@ -27,22 +28,26 @@ export function useTable<
   TQueryFnData extends BaseRecord = BaseRecord,
   TError = HttpError,
   TSearchVariables = Record<string, unknown>
->(options: UseTableOptions<TQueryFnData, TError, TSearchVariables> = {}) {
+>(optionsOrGetter: MaybeGetter<UseTableOptions<TQueryFnData, TError, TSearchVariables>> = {}) {
+  const getOptions = () => typeof optionsOrGetter === 'function' ? optionsOrGetter() : optionsOrGetter;
   const parsed = useParsed();
-  const resource = options.resource ?? parsed.resource ?? '';
-  const { meta, syncWithLocation = false, dataProviderName, pagination: _p, sorters: _s, filters: _f, ...restOptions } = options;
   
-  const paginationMode = options.pagination?.mode ?? 'server';
-  const sortersMode = options.sorters?.mode ?? 'server';
-  const filtersMode = options.filters?.mode ?? 'server';
-  const filterDefaultBehavior = options.filters?.defaultBehavior ?? 'replace';
+  // Use a local derived to compute these since they are used to initialize state
+  // Even if options change, init values are only used once, which makes sense for initial state
+  const initialOpts = getOptions();
+  const syncWithLocation = initialOpts.syncWithLocation ?? getAdminOptions().syncWithLocation;
+  
+  const paginationMode = $derived(getOptions().pagination?.mode ?? 'server');
+  const sortersMode = $derived(getOptions().sorters?.mode ?? 'server');
+  const filtersMode = $derived(getOptions().filters?.mode ?? 'server');
+  const filterDefaultBehavior = $derived(getOptions().filters?.defaultBehavior ?? 'replace');
 
-  const permanentSorters = options.sorters?.permanent ?? [];
-  const permanentFilters = options.filters?.permanent ?? [];
+  const permanentSorters = $derived(getOptions().sorters?.permanent ?? []);
+  const permanentFilters = $derived(getOptions().filters?.permanent ?? []);
 
-  let initPagination = options.pagination ?? { current: 1, pageSize: 10 };
-  let initSorters = options.sorters?.initial ?? [];
-  let initFilters = options.filters?.initial ?? [];
+  let initPagination = initialOpts.pagination ?? { current: 1, pageSize: 10 };
+  let initSorters = initialOpts.sorters?.initial ?? [];
+  let initFilters = initialOpts.filters?.initial ?? [];
 
   if (syncWithLocation && typeof window !== 'undefined') {
     const urlState = readURLState();
@@ -73,26 +78,31 @@ export function useTable<
     ? pagination
     : { current: 1, pageSize: 999999, mode: paginationMode as 'client' | 'off' });
 
-  const tableQueryInfo = useList<TQueryFnData, TError>({
-    resource,
-    get pagination() { return queryPagination; },
-    get sorters() { return querySorters; },
-    get filters() { return queryFilters; },
-    meta,
-    dataProviderName,
-    ...restOptions
+  const tableQueryInfo = useList<TQueryFnData, TError>(() => {
+    const currentOpts = getOptions();
+    const { meta, syncWithLocation, dataProviderName, pagination: _p, sorters: _s, filters: _f, ...restOptions } = currentOpts;
+    return {
+      resource: currentOpts.resource ?? parsed.resource ?? '',
+      pagination: queryPagination,
+      sorters: querySorters,
+      filters: queryFilters,
+      meta,
+      dataProviderName,
+      ...restOptions
+    };
   });
 
   const query = tableQueryInfo;
   const overtime = tableQueryInfo.overtime;
 
-  function setSorters(newSorters: Sort[]) { currentSorters = newSorters; }
+  function setSorters(newSorters: Sort[]) { currentSorters = newSorters; pagination = { ...pagination, current: 1 }; }
   function setFilters(newFilters: Filter[], mode?: FilterSetMode) {
     const behavior = mode ?? filterDefaultBehavior;
     if (behavior === 'merge') {
       const merged = [...currentFilters];
       for (const nf of newFilters) {
-        const idx = merged.findIndex(f => f.field === nf.field && f.operator === nf.operator);
+        if (!('field' in nf)) { merged.push(nf); continue; }
+        const idx = merged.findIndex(f => 'field' in f && f.field === nf.field && f.operator === nf.operator);
         if (idx >= 0) {
           if (nf.value === undefined || nf.value === null || nf.value === '') merged.splice(idx, 1);
           else merged[idx] = nf;
@@ -120,6 +130,39 @@ export function useTable<
         filters: currentFilters,
       });
     });
+
+    $effect(() => {
+      const handler = () => {
+        const urlState = readURLState();
+        const newPage = urlState.page ?? 1;
+        if (newPage !== pagination.current) {
+          pagination = { ...pagination, current: newPage };
+        }
+        const newPageSize = urlState.pageSize ?? initialOpts.pagination?.pageSize ?? getAdminOptions().defaultPageSize ?? 10;
+        if (newPageSize !== pagination.pageSize) {
+          pagination = { ...pagination, pageSize: newPageSize };
+        }
+        if (urlState.sortField) {
+          const newSorter: Sort = { field: urlState.sortField, order: (urlState.sortOrder as 'asc' | 'desc') ?? 'asc' };
+          if (JSON.stringify([newSorter]) !== JSON.stringify(currentSorters)) {
+            currentSorters = [newSorter];
+          }
+        } else if (currentSorters.length > 0) {
+          currentSorters = [];
+        }
+        if (urlState.filters && JSON.stringify(urlState.filters) !== JSON.stringify(currentFilters)) {
+          currentFilters = urlState.filters;
+        } else if (!urlState.filters && currentFilters.length > 0) {
+          currentFilters = [];
+        }
+      };
+      window.addEventListener('popstate', handler);
+      window.addEventListener('hashchange', handler);
+      return () => {
+        window.removeEventListener('popstate', handler);
+        window.removeEventListener('hashchange', handler);
+      };
+    });
   }
 
   function createLinkForSyncWithLocation(): string {
@@ -153,23 +196,33 @@ export function useTable<
     get pageSize() { return pagination.pageSize ?? 10; },
     get pageCount() { return Math.ceil(((query.data as GetListResult<TQueryFnData> | undefined)?.total ?? 0) / (pagination.pageSize ?? 10)); },
     get clientData(): TQueryFnData[] {
-      if (paginationMode !== 'client') return [];
+      if (paginationMode === 'server') return [];
       const allData = ((query.data as GetListResult<TQueryFnData> | undefined)?.data ?? []) as TQueryFnData[];
-      const start = ((pagination.current ?? 1) - 1) * (pagination.pageSize ?? 10);
-      const end = start + (pagination.pageSize ?? 10);
       let sorted = [...allData];
-      const activeSorters = sortersMode === 'off' ? effectiveSorters : currentSorters;
+      const activeSorters = sortersMode === 'off' ? effectiveSorters : [];
       if (activeSorters.length > 0) {
-        const { field, order } = activeSorters[0];
         sorted.sort((a, b) => {
-          const va = (a as Record<string, unknown>)[field];
-          const vb = (b as Record<string, unknown>)[field];
-          if (va == null) return 1;
-          if (vb == null) return -1;
-          const cmp = va < vb ? -1 : va > vb ? 1 : 0;
-          return order === 'desc' ? -cmp : cmp;
+          for (const { field, order } of activeSorters) {
+            const va = (a as Record<string, unknown>)[field];
+            const vb = (b as Record<string, unknown>)[field];
+            if (va == null && vb != null) return 1;
+            if (vb == null && va != null) return -1;
+            if (va == null && vb == null) continue;
+            
+            let cmp = 0;
+            if (typeof va === 'number' && typeof vb === 'number') cmp = va - vb;
+            else if (va instanceof Date && vb instanceof Date) cmp = va.getTime() - vb.getTime();
+            else if (typeof va === 'string' && typeof vb === 'string' && !isNaN(Number(va)) && !isNaN(Number(vb))) cmp = Number(va) - Number(vb);
+            else cmp = String(va).localeCompare(String(vb));
+            
+            if (cmp !== 0) return order === 'desc' ? -cmp : cmp;
+          }
+          return 0;
         });
       }
+      if (paginationMode === 'off') return sorted;
+      const start = ((pagination.current ?? 1) - 1) * (pagination.pageSize ?? 10);
+      const end = start + (pagination.pageSize ?? 10);
       return sorted.slice(start, end);
     },
   };

package/src/table-state.svelte.ts

@@ -200,7 +200,8 @@ export class TableState<TData extends BaseRecord = BaseRecord, TError = HttpErro
     if (behavior === 'merge') {
       const merged = [...this.currentFilters];
       for (const nf of newFilters) {
-        const idx = merged.findIndex(f => f.field === nf.field && f.operator === nf.operator);
+        if (!('field' in nf)) { merged.push(nf); continue; }
+          const idx = merged.findIndex(f => 'field' in f && f.field === nf.field && f.operator === nf.operator);
         if (idx >= 0) {
           if (nf.value === undefined || nf.value === null || nf.value === '') merged.splice(idx, 1);
           else merged[idx] = nf;

package/src/theme.svelte.ts

@@ -5,7 +5,7 @@
 //   - 'dark-first': adds 'light' class for light mode (dark-first)
 
 export type ThemeMode = 'light' | 'dark' | 'system';
-export type ColorTheme = 'blue' | 'green' | 'rose' | 'orange' | 'violet' | 'zinc';
+export type ColorTheme = 'blue' | 'green' | 'rose' | 'orange' | 'violet' | 'neutral';
 
 /** Controls how the theme class is applied to <html> */
 export type ThemeStrategy = 'standard' | 'dark-first';
@@ -134,13 +134,13 @@ export const builtinPresets: Record<string, ColorPreset> = $state({
       '--chart-1': 'oklch(0.577 0.245 27.325)',
     },
     dark: {
-      '--primary': 'oklch(0.577 0.245 27.325)',
-      '--primary-foreground': 'oklch(0.985 0 0)',
-      '--ring': 'oklch(0.577 0.245 27.325)',
-      '--sidebar-primary': 'oklch(0.577 0.245 27.325)',
+      '--primary': 'oklch(0.685 0.22 27)',
+      '--primary-foreground': 'oklch(0.15 0.04 27)',
+      '--ring': 'oklch(0.55 0.18 27)',
+      '--sidebar-primary': 'oklch(0.685 0.22 27)',
       '--sidebar-primary-foreground': 'oklch(0.985 0 0)',
-      '--sidebar-ring': 'oklch(0.577 0.245 27.325)',
-      '--chart-1': 'oklch(0.577 0.245 27.325)',
+      '--sidebar-ring': 'oklch(0.55 0.18 27)',
+      '--chart-1': 'oklch(0.685 0.22 27)',
     },
   },
   orange: {
@@ -157,13 +157,13 @@ export const builtinPresets: Record<string, ColorPreset> = $state({
       '--chart-1': 'oklch(0.646 0.222 41.116)',
     },
     dark: {
-      '--primary': 'oklch(0.646 0.222 41.116)',
-      '--primary-foreground': 'oklch(0.985 0 0)',
-      '--ring': 'oklch(0.646 0.222 41.116)',
-      '--sidebar-primary': 'oklch(0.646 0.222 41.116)',
+      '--primary': 'oklch(0.73 0.195 41)',
+      '--primary-foreground': 'oklch(0.15 0.04 41)',
+      '--ring': 'oklch(0.6 0.18 41)',
+      '--sidebar-primary': 'oklch(0.73 0.195 41)',
       '--sidebar-primary-foreground': 'oklch(0.985 0 0)',
-      '--sidebar-ring': 'oklch(0.646 0.222 41.116)',
-      '--chart-1': 'oklch(0.646 0.222 41.116)',
+      '--sidebar-ring': 'oklch(0.6 0.18 41)',
+      '--chart-1': 'oklch(0.73 0.195 41)',
     },
   },
   violet: {
@@ -180,13 +180,13 @@ export const builtinPresets: Record<string, ColorPreset> = $state({
       '--chart-1': 'oklch(0.541 0.281 293.009)',
     },
     dark: {
-      '--primary': 'oklch(0.541 0.281 293.009)',
-      '--primary-foreground': 'oklch(0.985 0 0)',
-      '--ring': 'oklch(0.541 0.281 293.009)',
-      '--sidebar-primary': 'oklch(0.541 0.281 293.009)',
+      '--primary': 'oklch(0.65 0.25 293)',
+      '--primary-foreground': 'oklch(0.15 0.04 293)',
+      '--ring': 'oklch(0.52 0.2 293)',
+      '--sidebar-primary': 'oklch(0.65 0.25 293)',
       '--sidebar-primary-foreground': 'oklch(0.985 0 0)',
-      '--sidebar-ring': 'oklch(0.541 0.281 293.009)',
-      '--chart-1': 'oklch(0.541 0.281 293.009)',
+      '--sidebar-ring': 'oklch(0.52 0.2 293)',
+      '--chart-1': 'oklch(0.65 0.25 293)',
     },
   },
 });
@@ -194,11 +194,6 @@ export const builtinPresets: Record<string, ColorPreset> = $state({
 /** Register a custom color preset. Overwrites any built-in preset with the same name. */
 export function registerColorPreset(preset: ColorPreset): void {
   builtinPresets[preset.name] = preset;
-  // Update colorThemes display list
-  const idx = colorThemes.findIndex(ct => ct.id === preset.name);
-  const entry = { id: preset.name as ColorTheme, label: preset.label, color: preset.color };
-  if (idx >= 0) colorThemes[idx] = entry;
-  else colorThemes.push(entry);
 }
 
 /** Resolve a preset by name or return the preset object directly. */
@@ -208,14 +203,21 @@ function resolvePreset(preset: ColorPreset | string): ColorPreset | undefined {
 }
 
 /** Apply a color preset's CSS variables based on current resolved theme. */
+let activePresetVars: string[] = [];
+
 function applyColorPreset(preset: ColorPreset): void {
   if (typeof document === 'undefined') return;
   const resolved = mode === 'system' ? getSystemPreference() : mode;
   const vars = resolved === 'dark' ? preset.dark : preset.light;
   const root = document.documentElement;
+  for (const key of activePresetVars) {
+    root.style.removeProperty(key);
+  }
+  activePresetVars = [];
   for (const [key, value] of Object.entries(vars)) {
     const cssVar = key.startsWith('--') ? key : `--${key}`;
     root.style.setProperty(cssVar, value);
+    activePresetVars.push(cssVar);
   }
 }
 
@@ -292,7 +294,7 @@ export function clearCssOverrides(keys?: string[]): void {
 }
 
 // ── Color themes (display metadata, derived from presets) ──
-export const colorThemes: { id: ColorTheme | string; label: string; color: string }[] = $state(Object.values(builtinPresets).map(p => ({
+export const colorThemes: { id: ColorTheme | string; label: string; color: string }[] = $derived(Object.values(builtinPresets).map(p => ({
   id: p.name as ColorTheme,
   label: p.label,
   color: p.color,

package/src/toast.svelte.ts

@@ -2,6 +2,7 @@ export type ToastType = 'success' | 'error' | 'info' | 'warning' | 'undoable';
 
 export interface ToastItem {
   id: number;
+  key?: string;
   type: ToastType;
   message: string;
   duration?: number;
@@ -10,18 +11,16 @@ export interface ToastItem {
 }
 
 let nextId = 0;
+const undoableTimers = new Map<number, ReturnType<typeof setTimeout>>();
 
-// Queue for simple toasts (consumed by UI Toast bridge)
 let queue = $state<ToastItem[]>([]);
 export function getToastQueue() { return queue; }
 export function consumeToastQueue() { queue = []; }
 
-// Promise Queue
 let promiseQueue = $state<{ id: number; promise: Promise<any>; opts: { loading: string; success: string; error: string } }[]>([]);
 export function getPromiseQueue() { return promiseQueue; }
 export function consumePromiseQueue() { promiseQueue = []; }
 
-// Legacy compatibility — kept for existing consumers (Undoable)
 let toasts = $state<ToastItem[]>([]);
 export function getToasts(): ToastItem[] { return toasts; }
 
@@ -29,29 +28,41 @@ export function addToast(
   type: ToastType, 
   message: string, 
   duration = 3000, 
-  options?: { onUndo?: () => void, onTimeout?: () => void }
+  options?: { key?: string, onUndo?: () => void, onTimeout?: () => void }
 ): void {
+  if (options?.key) {
+    if (queue.some(q => q.key === options.key) || toasts.some(t => t.key === options.key)) return;
+  }
   if (type !== 'undoable') {
-    queue.push({ id: nextId++, type, message, duration });
+    queue.push({ id: nextId++, type, message, duration, key: options?.key });
     return;
   }
   const id = nextId++;
   toasts = [...toasts, { id, type, message, duration, ...options }];
+  const timer = setTimeout(() => {
+    undoableTimers.delete(id);
+    options?.onTimeout?.();
+    removeToast(id);
+  }, duration);
+  undoableTimers.set(id, timer);
 }
 
 export function removeToast(id: number): void {
+  const timer = undoableTimers.get(id);
+  if (timer) {
+    clearTimeout(timer);
+    undoableTimers.delete(id);
+  }
   toasts = toasts.filter(t => t.id !== id);
 }
 
-// Convenience methods — backward compatible
 export const toast = {
-  success: (msg: string, duration?: number) => addToast('success', msg, duration),
-  error: (msg: string, duration?: number) => addToast('error', msg, duration ?? 5000),
-  info: (msg: string, duration?: number) => addToast('info', msg, duration),
-  warning: (msg: string, duration?: number) => addToast('warning', msg, duration ?? 4000),
+  success: (msg: string, duration?: number, opts?: { key?: string }) => addToast('success', msg, duration, opts),
+  error: (msg: string, duration?: number, opts?: { key?: string }) => addToast('error', msg, duration ?? 5000, opts),
+  info: (msg: string, duration?: number, opts?: { key?: string }) => addToast('info', msg, duration, opts),
+  warning: (msg: string, duration?: number, opts?: { key?: string }) => addToast('warning', msg, duration ?? 4000, opts),
   undoable: (msg: string, duration: number, onUndo: () => void, onTimeout: () => void) =>
     addToast('undoable', msg, duration, { onUndo, onTimeout }),
-  /** Promise toast — shows loading → success/error automatically */
   promise: <T>(promise: Promise<T>, opts: { loading: string; success: string; error: string }) => {
     promiseQueue.push({ id: nextId++, promise, opts });
     return promise;

package/src/types.ts

@@ -48,12 +48,14 @@ export type CrudOperator =
   | 'null' | 'nnull'
   | 'between' | 'nbetween';
 
-export interface Filter {
+export interface FieldFilter {
   field: string;
   operator: CrudOperator;
   value: unknown;
 }
 
+export type Filter = FieldFilter | LogicalFilter;
+
 export interface LogicalFilter {
   operator: 'or' | 'and';
   value: Filter[];

package/src/url-sync.ts

@@ -19,10 +19,10 @@ export function readURLState(): URLState {
   const state: URLState = {};
 
   const page = params['page'];
-  if (page) state.page = parseInt(page, 10);
+  if (page) { const n = parseInt(page, 10); if (!isNaN(n) && n > 0) state.page = n; }
 
   const pageSize = params['pageSize'];
-  if (pageSize) state.pageSize = parseInt(pageSize, 10);
+  if (pageSize) { const n = parseInt(pageSize, 10); if (!isNaN(n) && n > 0) state.pageSize = n; }
 
   const sortField = params['sort'];
   if (sortField) state.sortField = sortField;
@@ -51,25 +51,37 @@ export function writeURLState(state: URLState): void {
   const current = rp.parse();
   const params: Record<string, string> = { ...current.params };
 
-  if (state.page && state.page > 1) params['page'] = String(state.page);
-  else delete params['page'];
+  if ('page' in state) {
+    if (state.page && state.page > 1) params['page'] = String(state.page);
+    else delete params['page'];
+  }
 
-  if (state.pageSize && state.pageSize !== 10) params['pageSize'] = String(state.pageSize);
-  else delete params['pageSize'];
+  if ('pageSize' in state) {
+    if (state.pageSize && state.pageSize !== 10) params['pageSize'] = String(state.pageSize);
+    else delete params['pageSize'];
+  }
 
-  if (state.sortField) params['sort'] = state.sortField;
-  else delete params['sort'];
+  if ('sortField' in state) {
+    if (state.sortField) params['sort'] = state.sortField;
+    else delete params['sort'];
+  }
 
-  if (state.sortOrder) params['order'] = state.sortOrder;
-  else delete params['order'];
+  if ('sortOrder' in state) {
+    if (state.sortOrder) params['order'] = state.sortOrder;
+    else delete params['order'];
+  }
 
-  if (state.search) params['q'] = state.search;
-  else delete params['q'];
+  if ('search' in state) {
+    if (state.search) params['q'] = state.search;
+    else delete params['q'];
+  }
 
-  if (state.filters && state.filters.length > 0) {
-    params['filters'] = JSON.stringify(state.filters);
-  } else {
-    delete params['filters'];
+  if ('filters' in state) {
+    if (state.filters && state.filters.length > 0) {
+      params['filters'] = JSON.stringify(state.filters);
+    } else {
+      delete params['filters'];
+    }
   }
 
   // Prevent redundant navigation if nothing actually changed

package/src/useCan.ts

@@ -1,7 +1,7 @@
 // useCan — reactive permission check hook with TanStack Query integration
 
 import { createQuery } from '@tanstack/svelte-query';
-import { canAccessAsync } from './permissions';
+import { canAccessAsync, getAccessControlProvider } from './permissions';
 import type { Action, CanResult } from './permissions';
 
 export interface UseCanOptions {
@@ -42,7 +42,11 @@ export function useCan(options: () => UseCanOptions): UseCanResult {
   });
 
   return {
-    get allowed() { return (query.data as CanResult | undefined)?.can ?? true; },
+    get allowed() { 
+      const p = getAccessControlProvider();
+      if (!p) return true;
+      return (query.data as CanResult | undefined)?.can ?? false; 
+    },
     get reason() { return (query.data as CanResult | undefined)?.reason; },
     get isLoading() { return query.isLoading; },
   };

package/src/useParsed.svelte.ts

@@ -5,6 +5,7 @@ import { getResources } from './context.svelte';
 
 interface ParsedRoute {
   resource?: string;
+  resourcePath?: string;
   action?: 'list' | 'create' | 'edit' | 'show' | 'clone';
   id?: string;
   params: Record<string, string>;
@@ -60,6 +61,7 @@ export function useParsed(): ParsedRoute {
 
     if (resourceIndex !== -1) {
       result.resource = segments[resourceIndex];
+      result.resourcePath = segments.slice(0, resourceIndex + 1).join('/');
 
       // Add parent path params based on `<parentResource>/<parentId>` structure
       for (let i = 0; i < resourceIndex; i += 2) {
@@ -92,6 +94,7 @@ export function useParsed(): ParsedRoute {
     } else {
       // Fallback if resource definitions are not loaded yet
       result.resource = segments[0];
+      result.resourcePath = segments[0];
 
       if (segments.length === 1) {
         result.action = 'list';
@@ -117,6 +120,7 @@ export function useParsed(): ParsedRoute {
 
   return {
     get resource() { return parsed.resource; },
+    get resourcePath() { return parsed.resourcePath; },
     get action() { return parsed.action; },
     get id() { return parsed.id; },
     get params() { return parsed.params; },

package/src/useStepsForm.svelte.ts

@@ -7,6 +7,8 @@ export interface UseStepsFormOptions<
   TData extends BaseRecord = BaseRecord,
   TError = HttpError,
 > extends UseFormOptions<TVariables, TData, TError> {
+  /** Total number of steps. Defaults to 1 */
+  stepsCount?: number;
   /** Default step index. Starts at 0. */
   defaultStep?: number;
   /** Validate the form when navigating back? */
@@ -17,15 +19,20 @@ export interface UseStepsFormReturn<
   TVariables extends Record<string, unknown> = Record<string, unknown>,
   TData extends BaseRecord = BaseRecord,
 > extends UseFormReturn<TVariables, TData> {
-  currentStep: number;
-  gotoStep: (step: number) => void;
-  next: () => void;
-  prev: () => void;
+  steps: {
+    currentStep: number;
+    totalSteps: number;
+    canGoNext: boolean;
+    canGoPrev: boolean;
+    gotoStep: (step: number) => void;
+    nextStep: () => void;
+    prevStep: () => void;
+  };
 }
 
 /**
  * useStepsForm
- * Extends `useForm` with step navigation state (currentStep, next, prev, gotoStep).
+ * Extends `useForm` with a nested `steps` object tracking navigation state.
  */
 export function useStepsForm<
   TVariables extends Record<string, unknown> = Record<string, unknown>,
@@ -35,33 +42,36 @@ export function useStepsForm<
   const form = useForm<TVariables, TData, TError>(options);
 
   let currentStep = $state(options.defaultStep ?? 0);
+  const totalSteps = options.stepsCount ?? 1;
 
   function gotoStep(step: number) {
-    currentStep = Math.max(0, step);
+    currentStep = Math.max(0, Math.min(step, totalSteps - 1));
   }
 
-  function next() {
-    gotoStep(currentStep + 1);
+  function nextStep() {
+    if (currentStep < totalSteps - 1) gotoStep(currentStep + 1);
   }
 
-  function prev() {
-    if (currentStep > 0) {
-      gotoStep(currentStep - 1);
-    }
+  function prevStep() {
+    if (currentStep > 0) gotoStep(currentStep - 1);
   }
 
-  // Inject stepping features into the returned useForm object while preserving its reactive getters.
   const result = form as unknown as UseStepsFormReturn<TVariables, TData>;
 
-  Object.defineProperty(result, 'currentStep', {
-    get: () => currentStep,
-    enumerable: true,
-    configurable: true
-  });
+  const steps = {
+    get currentStep() { return currentStep; },
+    get totalSteps() { return totalSteps; },
+    get canGoNext() { return currentStep < totalSteps - 1; },
+    get canGoPrev() { return currentStep > 0; },
+    gotoStep,
+    nextStep,
+    prevStep,
+  };
 
-  result.gotoStep = gotoStep;
-  result.next = next;
-  result.prev = prev;
+  Object.defineProperty(result, 'steps', {
+    get: () => steps,
+    enumerable: true
+  });
 
   return result;
 }

package/src/utility-hooks.svelte.ts

@@ -56,7 +56,8 @@ export function useModalForm<
     visible = false;
     formState.reset();
     if (options.autoSave?.invalidateOnClose) {
-      queryClient.invalidateQueries({ queryKey: [formState.resource] });
+      queryClient.invalidateQueries({ predicate: (q) => q.queryKey[1] === formState.resource && (q.queryKey[2] === 'list' || q.queryKey[2] === 'infiniteList' || q.queryKey[2] === 'select') });
+      queryClient.invalidateQueries({ predicate: (q) => q.queryKey[1] === formState.resource && q.queryKey[2] === 'many' });
     }
   }
 
@@ -83,11 +84,11 @@ export interface MenuConfig {
 }
 
 export function useMenu() {
-  const adminOptions = getAdminOptions();
-  const resources = getResources();
   const parsed = useParsed();
 
   const menuItems = $derived.by<MenuConfig[]>(() => {
+    const adminOptions = getAdminOptions();
+    const resources = getResources();
     let items: MenuConfig[] = resources
       .filter((r: ResourceDefinition) => r.showInMenu !== false)
       .map((r: ResourceDefinition): MenuConfig => ({
@@ -127,7 +128,16 @@ export function useBreadcrumb() {
 
     try {
       const res = getResource(parsed.resource);
-      list.push({ label: res.label || res.name, link: `/${res.name}`, icon: res.icon });
+      const chain: { label: string; link: string; icon?: string }[] = [];
+      let current: typeof res | undefined = res;
+      const visited = new Set<string>();
+      while (current) {
+        if (visited.has(current.name)) break;
+        visited.add(current.name);
+        chain.unshift({ label: current.label || current.name, link: `/${current.name}`, icon: current.icon });
+        current = current.parentName ? getResource(current.parentName) : undefined;
+      }
+      list.push(...chain);
 
       if (parsed.action === 'create') {
         list.push({ label: t('common.create') });