@svadmin/core 0.7.0 → 0.9.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@svadmin/core",
-  "version": "0.7.0",
+  "version": "0.9.0",
   "description": "Core SDK — hooks, types, context, i18n, permissions, router",
   "type": "module",
   "sideEffects": false,

package/src/chatProvider.svelte.ts

@@ -0,0 +1,65 @@
+// Chat provider — headless interface for AI chat integration
+
+/** Describes an actionable button rendered in assistant messages (tool-call UX). */
+export interface ChatAction {
+  label: string;
+  /** Optional variant for styling (e.g. 'destructive' renders red) */
+  variant?: 'default' | 'destructive' | 'outline';
+  /** Arbitrary payload forwarded to the onAction handler */
+  payload?: Record<string, unknown>;
+}
+
+export interface ChatMessage {
+  id: string;
+  role: 'user' | 'assistant' | 'system';
+  content: string;
+  timestamp: number;
+  /** Tool-call action buttons rendered below the message bubble */
+  actions?: ChatAction[];
+}
+
+/** Admin context automatically injected into chat system messages. */
+export interface ChatContext {
+  currentResource?: string;
+  selectedRecordId?: string;
+  currentView?: 'list' | 'edit' | 'create' | 'show';
+  pathname?: string;
+}
+
+/**
+ * ChatProvider interface for integrating AI chat into admin panels.
+ * Implement `sendMessage` to connect to any AI backend (OpenAI, self-hosted, etc.)
+ *
+ * Return a `string` for non-streaming responses, or an `AsyncGenerator<string>`
+ * for streaming (SSE / chunked) responses.
+ */
+export interface ChatProvider {
+  sendMessage(
+    messages: ChatMessage[],
+    options?: { signal?: AbortSignal },
+  ): Promise<string> | AsyncGenerator<string, void, unknown>;
+}
+
+// ─── Chat Provider singleton ───────────────────────────────────
+
+let chatProvider: ChatProvider | null = $state(null);
+
+export function setChatProvider(provider: ChatProvider): void {
+  chatProvider = provider;
+}
+
+export function getChatProvider(): ChatProvider | null {
+  return chatProvider;
+}
+
+// ─── Chat Context singleton ────────────────────────────────────
+
+let chatContext = $state<ChatContext>({});
+
+export function setChatContext(ctx: ChatContext): void {
+  chatContext = ctx;
+}
+
+export function getChatContext(): ChatContext {
+  return chatContext;
+}

package/src/chatProvider.test.ts

@@ -0,0 +1,168 @@
+// Unit tests for ChatProvider types and ChatContext logic
+// Since chatProvider.svelte.ts uses $state runes (requires Svelte compiler),
+// we test the pure type shapes and serialization here — matching the project's
+// pattern in i18n.test.ts of testing extracted logic.
+
+import { describe, test, expect } from 'bun:test';
+
+/** Mirror of ChatAction from chatProvider.svelte.ts */
+interface ChatAction {
+  label: string;
+  variant?: 'default' | 'destructive' | 'outline';
+  payload?: Record<string, unknown>;
+}
+
+/** Mirror of ChatMessage from chatProvider.svelte.ts */
+interface ChatMessage {
+  id: string;
+  role: 'user' | 'assistant' | 'system';
+  content: string;
+  timestamp: number;
+  actions?: ChatAction[];
+}
+
+/** Mirror of ChatContext from chatProvider.svelte.ts */
+interface ChatContext {
+  currentResource?: string;
+  selectedRecordId?: string;
+  currentView?: 'list' | 'edit' | 'create' | 'show';
+  pathname?: string;
+}
+
+/** Build context system message (mirrors logic in ChatDialog.svelte) */
+function buildContextSystemMessage(ctx: ChatContext): ChatMessage | null {
+  if (!ctx.currentResource) return null;
+
+  const parts: string[] = [];
+  parts.push(`Resource: ${ctx.currentResource}`);
+  if (ctx.currentView) parts.push(`View: ${ctx.currentView}`);
+  if (ctx.selectedRecordId) parts.push(`Selected Record ID: ${ctx.selectedRecordId}`);
+  if (ctx.pathname) parts.push(`Path: ${ctx.pathname}`);
+
+  return {
+    id: 'ctx-system',
+    role: 'system',
+    content: `[Admin Context] ${parts.join(' | ')}`,
+    timestamp: Date.now(),
+  };
+}
+
+describe('ChatMessage with actions', () => {
+  test('message with actions serializes to JSON and back', () => {
+    const actions: ChatAction[] = [
+      { label: 'Delete Record', variant: 'destructive', payload: { id: '42' } },
+      { label: 'View Details' },
+    ];
+    const msg: ChatMessage = {
+      id: 'msg-1',
+      role: 'assistant',
+      content: 'I found a record to delete.',
+      timestamp: 1711500000000,
+      actions,
+    };
+
+    const serialized = JSON.stringify(msg);
+    const deserialized = JSON.parse(serialized) as ChatMessage;
+
+    expect(deserialized.actions).toHaveLength(2);
+    expect(deserialized.actions![0].label).toBe('Delete Record');
+    expect(deserialized.actions![0].variant).toBe('destructive');
+    expect(deserialized.actions![0].payload).toEqual({ id: '42' });
+    expect(deserialized.actions![1].variant).toBeUndefined();
+  });
+
+  test('message without actions has undefined actions', () => {
+    const msg: ChatMessage = {
+      id: 'msg-2',
+      role: 'user',
+      content: 'Hello',
+      timestamp: 1711500000000,
+    };
+    expect(msg.actions).toBeUndefined();
+  });
+
+  test('system message persists correctly', () => {
+    const msg: ChatMessage = {
+      id: 'ctx-1',
+      role: 'system',
+      content: '[Admin Context] Resource: posts | View: edit',
+      timestamp: 1711500000000,
+    };
+    const parsed = JSON.parse(JSON.stringify(msg)) as ChatMessage;
+    expect(parsed.role).toBe('system');
+    expect(parsed.content).toContain('posts');
+  });
+});
+
+describe('buildContextSystemMessage', () => {
+  test('returns null when no resource', () => {
+    expect(buildContextSystemMessage({})).toBeNull();
+  });
+
+  test('builds message with resource only', () => {
+    const msg = buildContextSystemMessage({ currentResource: 'users' });
+    expect(msg).not.toBeNull();
+    expect(msg!.role).toBe('system');
+    expect(msg!.content).toContain('Resource: users');
+  });
+
+  test('includes all context fields', () => {
+    const msg = buildContextSystemMessage({
+      currentResource: 'posts',
+      currentView: 'edit',
+      selectedRecordId: '42',
+      pathname: '/posts/edit/42',
+    });
+    expect(msg!.content).toContain('Resource: posts');
+    expect(msg!.content).toContain('View: edit');
+    expect(msg!.content).toContain('Selected Record ID: 42');
+    expect(msg!.content).toContain('Path: /posts/edit/42');
+  });
+
+  test('omits undefined fields', () => {
+    const msg = buildContextSystemMessage({
+      currentResource: 'users',
+      currentView: 'list',
+    });
+    expect(msg!.content).not.toContain('Selected Record ID');
+    expect(msg!.content).not.toContain('Path');
+  });
+});
+
+describe('ChatContext shape', () => {
+  test('empty context is valid', () => {
+    const ctx: ChatContext = {};
+    expect(ctx.currentResource).toBeUndefined();
+  });
+
+  test('full context preserves all fields', () => {
+    const ctx: ChatContext = {
+      currentResource: 'orders',
+      selectedRecordId: '99',
+      currentView: 'show',
+      pathname: '/orders/show/99',
+    };
+    expect(ctx.currentResource).toBe('orders');
+    expect(ctx.selectedRecordId).toBe('99');
+    expect(ctx.currentView).toBe('show');
+    expect(ctx.pathname).toBe('/orders/show/99');
+  });
+});
+
+describe('localStorage persistence simulation', () => {
+  test('messages array round-trips through JSON', () => {
+    const messages: ChatMessage[] = [
+      { id: '1', role: 'user', content: 'Hello', timestamp: 1000 },
+      {
+        id: '2', role: 'assistant', content: 'Hi!', timestamp: 1001,
+        actions: [{ label: 'Create Post', variant: 'default', payload: { resource: 'posts' } }],
+      },
+    ];
+    const json = JSON.stringify(messages);
+    const restored = JSON.parse(json) as ChatMessage[];
+
+    expect(restored).toHaveLength(2);
+    expect(restored[0].role).toBe('user');
+    expect(restored[1].actions![0].label).toBe('Create Post');
+  });
+});

package/src/i18n.svelte.ts

@@ -129,6 +129,12 @@ const locales: Record<string, Locale> = {
     // DevTools
     'devtools.title': '开发者工具 (Ctrl+Shift+D)',
     // Validation
+    // Chat
+    'chat.contextInfo': '当前上下文：{resource}',
+    'chat.actionButton': '执行',
+    'chat.historyRestored': '已恢复聊天记录',
+    'chat.historyClear': '聊天记录已清除',
+    // Validation
     'validation.required': '此字段为必填项',
     'validation.minLength': '最少 {min} 个字符',
     'validation.maxLength': '最多 {max} 个字符',
@@ -261,6 +267,12 @@ const locales: Record<string, Locale> = {
     // DevTools
     'devtools.title': 'DevTools (Ctrl+Shift+D)',
     // Validation
+    // Chat
+    'chat.contextInfo': 'Current context: {resource}',
+    'chat.actionButton': 'Execute',
+    'chat.historyRestored': 'Chat history restored',
+    'chat.historyClear': 'Chat history cleared',
+    // Validation
     'validation.required': 'This field is required',
     'validation.minLength': 'Minimum {min} characters',
     'validation.maxLength': 'Maximum {max} characters',

package/src/index.ts

@@ -35,10 +35,10 @@ export { notify, closeNotification, setNotificationProvider, getNotificationProv
 export { t, setLocale, getLocale, getAvailableLocales, addTranslations, useTranslation } from './i18n.svelte';
 export { audit, setAuditHandler, setAuditLogProvider, getAuditLogProvider } from './audit';
 export type { AuditLogProvider } from './audit';
-export { setChatProvider, getChatProvider } from './chatProvider';
-export type { ChatProvider, ChatMessage } from './chatProvider';
-export { getTheme, setTheme, toggleTheme, getResolvedTheme, getColorTheme, setColorTheme, colorThemes } from './theme.svelte';
-export type { ThemeMode, ColorTheme } from './theme.svelte';
+export { setChatProvider, getChatProvider, setChatContext, getChatContext } from './chatProvider.svelte';
+export type { ChatProvider, ChatMessage, ChatContext, ChatAction } from './chatProvider.svelte';
+export { getTheme, setTheme, toggleTheme, getResolvedTheme, getColorTheme, setColorTheme, colorThemes, configureTheme, getThemeConfig, clearCssOverrides } from './theme.svelte';
+export type { ThemeMode, ColorTheme, ThemeStrategy, ThemeConfig } from './theme.svelte';
 export { setUnsavedChanges, getUnsavedChanges, initUnsavedChangesNotifier } from './unsaved-changes.svelte';
 export { setAdminOptions, getAdminOptions, getTextTransformers } from './options';
 export type { AdminOptions, TextTransformers, OvertimeConfig } from './options';

package/src/theme.svelte.ts

@@ -1,11 +1,75 @@
 // Theme — dark/light/system mode + color theme management (Svelte 5 runes)
+//
+// Supports two class strategies:
+//   - 'standard' (default): adds 'dark' class for dark mode (light-first)
+//   - 'dark-first': adds 'light' class for light mode (dark-first, e.g. Elygate-style)
 
 export type ThemeMode = 'light' | 'dark' | 'system';
 export type ColorTheme = 'blue' | 'green' | 'rose' | 'orange' | 'violet' | 'zinc';
 
+/** Controls how the theme class is applied to <html> */
+export type ThemeStrategy = 'standard' | 'dark-first';
+
+export interface ThemeConfig {
+  /** Class strategy: 'standard' toggles '.dark', 'dark-first' toggles '.light' */
+  strategy?: ThemeStrategy;
+  /** Custom CSS variables to inject as overrides on <html> */
+  cssOverrides?: Record<string, string>;
+  /** Whether to disable the built-in color-scheme attribute */
+  disableColorScheme?: boolean;
+}
+
 const STORAGE_KEY = 'svadmin-theme';
 const COLOR_STORAGE_KEY = 'svadmin-color-theme';
 
+// ── Theme configuration ──────────────────────────────────
+let themeConfig: ThemeConfig = {};
+
+/**
+ * Configure the theme system. Must be called before setTheme() or
+ * automatically via AdminApp's themeConfig prop.
+ */
+export function configureTheme(config: ThemeConfig): void {
+  themeConfig = { ...config };
+  // Re-apply the current theme with new strategy
+  applyTheme(mode);
+  // Apply CSS overrides
+  if (config.cssOverrides) {
+    applyCssOverrides(config.cssOverrides);
+  }
+}
+
+/** Get current theme configuration */
+export function getThemeConfig(): ThemeConfig {
+  return { ...themeConfig };
+}
+
+function applyCssOverrides(overrides: Record<string, string>): void {
+  if (typeof document === 'undefined') return;
+  const root = document.documentElement;
+  for (const [key, value] of Object.entries(overrides)) {
+    const cssVar = key.startsWith('--') ? key : `--${key}`;
+    root.style.setProperty(cssVar, value);
+  }
+}
+
+/** Remove previously applied CSS overrides */
+export function clearCssOverrides(keys?: string[]): void {
+  if (typeof document === 'undefined') return;
+  const root = document.documentElement;
+  if (keys) {
+    for (const key of keys) {
+      const cssVar = key.startsWith('--') ? key : `--${key}`;
+      root.style.removeProperty(cssVar);
+    }
+  } else if (themeConfig.cssOverrides) {
+    for (const key of Object.keys(themeConfig.cssOverrides)) {
+      const cssVar = key.startsWith('--') ? key : `--${key}`;
+      root.style.removeProperty(cssVar);
+    }
+  }
+}
+
 // ── Color themes (display metadata) ──────────────────────
 export const colorThemes: { id: ColorTheme; label: string; color: string }[] = [
   { id: 'blue',   label: 'Blue',   color: '#3b82f6' },
@@ -32,8 +96,24 @@ let mode = $state<ThemeMode>(getStoredTheme());
 
 function applyTheme(m: ThemeMode): void {
   const resolved = m === 'system' ? getSystemPreference() : m;
-  if (typeof document !== 'undefined') {
-    document.documentElement.classList.toggle('dark', resolved === 'dark');
+  if (typeof document === 'undefined') return;
+
+  const strategy = themeConfig.strategy ?? 'standard';
+  const el = document.documentElement;
+
+  if (strategy === 'dark-first') {
+    // Dark-first: default is dark, add 'light' class for light mode
+    el.classList.toggle('light', resolved === 'light');
+    el.classList.remove('dark'); // ensure no conflict
+  } else {
+    // Standard: default is light, add 'dark' class for dark mode
+    el.classList.toggle('dark', resolved === 'dark');
+    el.classList.remove('light'); // ensure no conflict
+  }
+
+  // Set color-scheme attribute unless disabled
+  if (!themeConfig.disableColorScheme) {
+    el.style.colorScheme = resolved;
   }
 }
 

package/src/chatProvider.ts

@@ -1,32 +0,0 @@
-// Chat provider — headless interface for AI chat integration
-
-export interface ChatMessage {
-  id: string;
-  role: 'user' | 'assistant' | 'system';
-  content: string;
-  timestamp: number;
-}
-
-/**
- * ChatProvider interface for integrating AI chat into admin panels.
- * Implement `sendMessage` to connect to any AI backend (OpenAI, self-hosted, etc.)
- *
- * Return a `string` for non-streaming responses, or an `AsyncGenerator<string>`
- * for streaming (SSE / chunked) responses.
- */
-export interface ChatProvider {
-  sendMessage(
-    messages: ChatMessage[],
-    options?: { signal?: AbortSignal },
-  ): Promise<string> | AsyncGenerator<string, void, unknown>;
-}
-
-let chatProvider: ChatProvider | null = null;
-
-export function setChatProvider(provider: ChatProvider): void {
-  chatProvider = provider;
-}
-
-export function getChatProvider(): ChatProvider | null {
-  return chatProvider;
-}