@svadmin/core 0.0.3 → 0.3.0

package/src/useParsed.ts

@@ -0,0 +1,110 @@
+// useParsed — parse current URL hash into structured route info
+
+import { currentPath } from './router';
+import { getResources } from './context';
+
+interface ParsedRoute {
+  resource?: string;
+  action?: 'list' | 'create' | 'edit' | 'show';
+  id?: string;
+  params: Record<string, string>;
+}
+
+/**
+ * Parse the current hash URL into a structured route object.
+ * Returns reactive properties that update when the URL changes.
+ *
+ * Usage:
+ *   const parsed = useParsed();
+ *   // parsed.resource === 'posts'
+ *   // parsed.action === 'edit'
+ *   // parsed.id === '123'
+ */
+export function useParsed(): ParsedRoute {
+  const path = $derived(currentPath());
+  const resources = $derived((() => { try { return getResources(); } catch { return []; } })());
+
+  const parsed = $derived.by(() => {
+    const p = path;
+    const result: ParsedRoute = { params: {} };
+
+    // Parse query params from hash
+    const [pathname, queryString] = p.split('?');
+    if (queryString) {
+      const sp = new URLSearchParams(queryString);
+      for (const [k, v] of sp.entries()) {
+        result.params[k] = v;
+      }
+    }
+
+    const segments = pathname.split('/').filter(Boolean);
+    if (segments.length === 0) return result;
+
+    // Find the rightmost segment that matches a known resource name
+    const resourceNames = resources.map(r => r.name);
+    let resourceIndex = -1;
+    for (let i = segments.length - 1; i >= 0; i--) {
+      if (resourceNames.includes(segments[i])) {
+        resourceIndex = i;
+        break;
+      }
+    }
+
+    if (resourceIndex !== -1) {
+      result.resource = segments[resourceIndex];
+
+      // Add parent path params based on `<parentResource>/<parentId>` structure
+      for (let i = 0; i < resourceIndex; i += 2) {
+        if (segments[i] && segments[i + 1]) {
+          const parentName = segments[i];
+          const singular = parentName.endsWith('s') ? parentName.slice(0, -1) : parentName;
+          result.params[`${singular}Id`] = segments[i + 1];
+        }
+      }
+
+      const restSegments = segments.slice(resourceIndex + 1);
+      if (restSegments.length === 0) {
+        result.action = 'list';
+      } else if (restSegments[0] === 'create') {
+        result.action = 'create';
+      } else if (restSegments[0] === 'edit' && restSegments[1]) {
+        result.action = 'edit';
+        result.id = restSegments[1];
+      } else if (restSegments[0] === 'show' && restSegments[1]) {
+        result.action = 'show';
+        result.id = restSegments[1];
+      } else if (restSegments[0]) {
+        // Legacy: /:resource/:id
+        result.action = 'show';
+        result.id = restSegments[0];
+      }
+    } else {
+      // Fallback if resource definitions are not loaded yet
+      result.resource = segments[0];
+
+      if (segments.length === 1) {
+        result.action = 'list';
+      } else if (segments[1] === 'create') {
+        result.action = 'create';
+      } else if (segments[1] === 'edit' && segments[2]) {
+        result.action = 'edit';
+        result.id = segments[2];
+      } else if (segments[1] === 'show' && segments[2]) {
+        result.action = 'show';
+        result.id = segments[2];
+      } else if (segments[1]) {
+        result.action = 'show';
+        result.id = segments[1];
+      }
+    }
+
+    return result;
+  });
+
+  return {
+    get resource() { return parsed.resource; },
+    get action() { return parsed.action; },
+    get id() { return parsed.id; },
+    get params() { return parsed.params; },
+  };
+}

package/src/useStepsForm.svelte.ts

@@ -0,0 +1,71 @@
+import { useForm } from './form-hooks.svelte';
+import type { UseFormOptions, UseFormResult } from './form-hooks.svelte';
+import type { BaseRecord, HttpError } from './types';
+
+export interface UseStepsFormOptions<
+  TQueryFnData extends BaseRecord = BaseRecord,
+  TError = HttpError,
+  TVariables = Record<string, unknown>,
+  TData extends BaseRecord = TQueryFnData
+> extends UseFormOptions<TQueryFnData, TError, TVariables, TData> {
+  /** Default step index. Starts at 0. */
+  defaultStep?: number;
+  /** Validate the form when navigating back? */
+  isBackValidate?: boolean;
+}
+
+export interface UseStepsFormResult<
+  TQueryFnData extends BaseRecord = BaseRecord,
+  TError = HttpError,
+  TVariables = Record<string, unknown>,
+  TData extends BaseRecord = TQueryFnData
+> extends UseFormResult<TQueryFnData, TError, TVariables, TData> {
+  currentStep: number;
+  gotoStep: (step: number) => void;
+  next: () => void;
+  prev: () => void;
+}
+
+/**
+ * useStepsForm
+ * Extends `useForm` with step navigation state (currentStep, next, prev, gotoStep).
+ */
+export function useStepsForm<
+  TQueryFnData extends BaseRecord = BaseRecord,
+  TError = HttpError,
+  TVariables = Record<string, unknown>,
+  TData extends BaseRecord = TQueryFnData
+>(options: UseStepsFormOptions<TQueryFnData, TError, TVariables, TData> = {} as any): UseStepsFormResult<TQueryFnData, TError, TVariables, TData> {
+  const form = useForm<TQueryFnData, TError, TVariables, TData>(options);
+  
+  let currentStep = $state(options.defaultStep ?? 0);
+  
+  function gotoStep(step: number) {
+    currentStep = Math.max(0, step);
+  }
+  
+  function next() {
+    gotoStep(currentStep + 1);
+  }
+  
+  function prev() {
+    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 UseStepsFormResult<TQueryFnData, TError, TVariables, TData>;
+  
+  Object.defineProperty(result, 'currentStep', {
+    get: () => currentStep,
+    enumerable: true,
+    configurable: true
+  });
+  
+  result.gotoStep = gotoStep;
+  result.next = next;
+  result.prev = prev;
+
+  return result;
+}

package/src/utility-hooks.svelte.ts

@@ -0,0 +1,161 @@
+import { useForm, type UseFormOptions } from './form-hooks.svelte';
+import { useQueryClient } from '@tanstack/svelte-query';
+import { useParsed } from './useParsed';
+import { getResource, getResources } from './context';
+import { getAdminOptions } from './options';
+import { navigate } from './router';
+import { t } from './i18n.svelte';
+import type { BaseRecord, HttpError, Filter, KnownResources, ResourceDefinition } from './types';
+import { useList, type UseListOptions } from './query-hooks.svelte';
+import { toast } from './toast.svelte';
+
+// ─── useModal ─────────────────────────────────────────────────
+export function useModal(options?: { defaultVisible?: boolean }) {
+  let visible = $state(options?.defaultVisible ?? false);
+  return {
+    get visible() { return visible; },
+    show() { visible = true; },
+    close() { visible = false; },
+  };
+}
+
+// ─── useModalForm ─────────────────────────────────────────────
+
+export interface UseModalFormOptions<TQueryFnData extends BaseRecord = BaseRecord, TError = HttpError, TVariables = Record<string, unknown>, TData extends BaseRecord = TQueryFnData> extends UseFormOptions<TQueryFnData, TError, TVariables, TData> {
+  defaultVisible?: boolean;
+  autoSave?: UseFormOptions<TQueryFnData, TError, TVariables, TData>['autoSave'] & {
+    invalidateOnClose?: boolean;
+  };
+}
+
+export function useModalForm<
+  TQueryFnData extends BaseRecord = BaseRecord,
+  TError = HttpError,
+  TVariables = Record<string, unknown>,
+  TData extends BaseRecord = TQueryFnData
+>(options: UseModalFormOptions<TQueryFnData, TError, TVariables, TData> = {}) {
+  const queryClient = useQueryClient();
+  const formState = useForm(options);
+  let visible = $state(options.defaultVisible ?? false);
+
+  function show(id?: string | number) {
+    if (id !== undefined) formState.setId(id);
+    visible = true;
+  }
+
+  function close() {
+    visible = false;
+    formState.clearErrors();
+    if (options.autoSave?.invalidateOnClose) {
+      queryClient.invalidateQueries({ queryKey: [formState.resource] });
+    }
+  }
+
+  return {
+    get visible() { return visible; },
+    show,
+    close,
+    get modalProps() { return { visible, close }; },
+    formState,
+  };
+}
+
+export const useDrawerForm = useModalForm; // Alias for UI variations
+
+// ─── useMenu ──────────────────────────────────────────────────
+
+export interface MenuConfig {
+  name: string;
+  route: string;
+  label: string;
+  icon?: string;
+  parentName?: string;
+  order?: number;
+}
+
+export function useMenu() {
+  const adminOptions = getAdminOptions();
+  const resources = getResources();
+  const parsed = useParsed();
+
+  const menuItems = $derived.by<MenuConfig[]>(() => {
+    let items: MenuConfig[] = resources
+      .filter((r: ResourceDefinition) => r.showInMenu !== false)
+      .map((r: ResourceDefinition): MenuConfig => ({
+        name: r.name,
+        route: `/${r.name}`,
+        label: r.label || r.name, // Usually handled by i18n label mapping
+        icon: r.icon,
+        parentName: r.parentName,
+        order: r.menuOrder ?? 999,
+      }));
+
+    if (adminOptions.menuItems) items = adminOptions.menuItems(items);
+    items.sort((a, b) => (a.order ?? 999) - (b.order ?? 999));
+    return items;
+  });
+
+  return {
+    get menuItems() { return menuItems; },
+    get selectedKey() { return parsed.resource ?? '/'; },
+  };
+}
+
+// ─── useBreadcrumb ────────────────────────────────────────────
+
+export interface BreadcrumbItem {
+  label: string;
+  link?: string;
+  icon?: string;
+}
+
+export function useBreadcrumb() {
+  const parsed = useParsed();
+  
+  const items = $derived.by<BreadcrumbItem[]>(() => {
+    const list: BreadcrumbItem[] = [];
+    if (!parsed.resource) return list;
+
+    try {
+      const res = getResource(parsed.resource);
+      list.push({ label: res.label || res.name, link: `/${res.name}`, icon: res.icon });
+
+      if (parsed.action === 'create') {
+        list.push({ label: t('common.create') });
+      } else if (parsed.action === 'edit' && parsed.id) {
+        list.push({ label: t('common.edit') });
+        list.push({ label: String(parsed.id) });
+      } else if (parsed.action === 'show' && parsed.id) {
+        list.push({ label: t('common.show') });
+        list.push({ label: String(parsed.id) });
+      }
+    } catch {
+      // Ignored
+    }
+    return list;
+  });
+
+  return { get items() { return items; } };
+}
+
+// ─── useRelation ───────────────────────────────────────────
+
+export interface UseRelationOptions<TData extends BaseRecord = BaseRecord, TError = HttpError> {
+  resource: KnownResources;
+  id?: string | number;
+  pagination?: { current?: number; pageSize?: number };
+  sorters?: { field: string; order: 'asc' | 'desc' }[];
+  filters?: Filter[];
+  queryOptions?: { enabled?: boolean; staleTime?: number };
+}
+
+export function useRelation<TData extends BaseRecord = BaseRecord, TError = HttpError>(options: UseRelationOptions<TData, TError>) {
+  return useList<TData, TError>({
+    ...options
+  });
+}
+
+// ─── useNotification ────────────────────────────────────────
+export function useNotification() {
+  return { open: toast.info, success: toast.success, error: toast.error, warning: toast.warning };
+}