@shohojdhara/atomix 0.3.6 → 0.3.8

package/src/lib/theme/core/ThemeRegistry.ts

@@ -1,297 +1,93 @@
 /**
- * Theme Registry
- * 
- * Central registry for all themes with discovery and dependency management
+ * Theme Metadata interface
  */
+export interface ThemeMetadata {
+  name: string;
+  class: string;
+  description?: string;
+  version?: string;
+  [key: string]: any;
+}
 
-import type { Theme, ThemeMetadata } from '../types';
-import type { ThemeDefinition, LoadedThemeConfig } from '../config/types';
-import { loadThemeConfig } from '../config/loader';
+/**
+ * Theme Registry type - a record of theme IDs to metadata
+ */
+export type ThemeRegistry = Record<string, ThemeMetadata>;
 
 /**
- * Registry entry
+ * Create a new theme registry
  */
-interface RegistryEntry {
-  /** Theme ID */
-  id: string;
-  /** Theme definition from config */
-  definition: ThemeDefinition;
-  /** Resolved theme object (for JS themes) */
-  theme?: Theme;
-  /** Whether theme is loaded */
-  loaded: boolean;
-  /** Loading promise (if currently loading) */
-  loading?: Promise<Theme | void>;
-  /** Dependencies */
-  dependencies: string[];
-  /** Dependent themes (themes that depend on this one) */
-  dependents: string[];
+export function createThemeRegistry(): ThemeRegistry {
+  return {};
 }
 
 /**
- * Theme Registry
- * 
- * Manages theme registration, discovery, and dependency resolution
+ * Register a theme
+ * @param registry - Theme registry object
+ * @param id - Theme identifier
+ * @param metadata - Theme metadata
  */
-export class ThemeRegistry {
-  private entries: Map<string, RegistryEntry> = new Map();
-  private config: LoadedThemeConfig | null = null;
-  private initialized: boolean = false;
-
-  /**
-   * Initialize registry from config
-   */
-  async initialize(config?: LoadedThemeConfig): Promise<void> {
-    if (this.initialized) {
-      return;
-    }
-
-    // Load config if not provided
-    if (!config) {
-      try {
-        this.config = loadThemeConfig();
-      } catch (error) {
-        // In browser environments, config loading will fail
-        // Use empty config as fallback
-        this.config = {
-          themes: {},
-          build: {
-            output: { directory: 'themes', formats: { expanded: '.css', compressed: '.min.css' } },
-            sass: { style: 'expanded', sourceMap: true, loadPaths: ['src'] },
-          },
-          runtime: {
-            basePath: '',
-            defaultTheme: undefined, // No default - use built-in styles
-          },
-          integration: {
-            cssVariables: { colorMode: '--color-mode' },
-            classNames: { theme: 'data-theme', colorMode: 'data-color-mode' },
-          },
-          dependencies: {},
-          validated: false,
-          errors: [],
-          warnings: [],
-          __tokens: {},
-          __extend: {},
-        };
-      }
-    } else {
-      this.config = config;
-    }
-
-    // Register all themes from config
-    for (const [themeId, definition] of Object.entries(this.config.themes)) {
-      this.register(themeId, definition);
-    }
-
-    // Resolve dependencies
-    this.resolveDependencies();
-
-    this.initialized = true;
-  }
-
-  /**
-   * Register a theme
-   */
-  register(themeId: string, definition: ThemeDefinition): void {
-    // Get dependencies from config or definition
-    const dependencies = 
-      this.config?.dependencies?.[themeId] || 
-      definition.dependencies || 
-      [];
-
-    const entry: RegistryEntry = {
-      id: themeId,
-      definition,
-      loaded: false,
-      dependencies: [...dependencies],
-      dependents: [],
-    };
-
-    this.entries.set(themeId, entry);
-  }
-
-  /**
-   * Get theme entry
-   */
-  get(themeId: string): RegistryEntry | undefined {
-    return this.entries.get(themeId);
-  }
-
-  /**
-   * Check if theme exists
-   */
-  has(themeId: string): boolean {
-    return this.entries.has(themeId);
-  }
-
-  /**
-   * Get all theme IDs
-   */
-  getAllIds(): string[] {
-    return Array.from(this.entries.keys());
-  }
-
-  /**
-   * Get all theme metadata
-   */
-  getAllMetadata(): ThemeMetadata[] {
-    return Array.from(this.entries.values()).map(entry => ({
-      id: entry.id,
-      name: entry.definition.name,
-      type: entry.definition.type,
-      class: entry.definition.class,
-      description: entry.definition.description,
-      author: entry.definition.author,
-      version: entry.definition.version,
-      tags: entry.definition.tags,
-      supportsDarkMode: entry.definition.supportsDarkMode,
-      status: entry.definition.status,
-      a11y: entry.definition.a11y,
-      color: entry.definition.color,
-      features: entry.definition.features,
-      dependencies: entry.dependencies,
-    }));
-  }
-
-  /**
-   * Get theme definition
-   */
-  getDefinition(themeId: string): ThemeDefinition | undefined {
-    return this.entries.get(themeId)?.definition;
-  }
-
-  /**
-   * Check if a theme is loaded
-   */
-  isThemeLoaded(themeId: string): boolean {
-    const entry = this.entries.get(themeId);
-    return entry ? entry.loaded : false;
-  }
-
-  /**
-   * Mark a theme as loaded
-   */
-  markLoaded(themeId: string, theme?: Theme): void {
-    const entry = this.entries.get(themeId);
-    if (entry) {
-      entry.loaded = true;
-      if (theme) {
-        entry.theme = theme;
-      }
-    }
-  }
-
-  /**
-   * Get theme object (for JS themes)
-   */
-  getTheme(themeId: string): Theme | undefined {
-    const entry = this.entries.get(themeId);
-    return entry?.loaded ? entry.theme : undefined;
-  }
-
-  /**
-   * Get dependencies for a theme
-   */
-  getDependencies(themeId: string): string[] {
-    return this.entries.get(themeId)?.dependencies || [];
-  }
-
-  /**
-   * Get dependents for a theme (themes that depend on this one)
-   */
-  getDependents(themeId: string): string[] {
-    return this.entries.get(themeId)?.dependents || [];
-  }
-
-  /**
-   * Resolve all dependencies in correct order
-   */
-  resolveDependencyOrder(themeId: string): string[] {
-    const resolved: string[] = [];
-    const visited = new Set<string>();
-    const visiting = new Set<string>();
-
-    const visit = (id: string): void => {
-      if (visiting.has(id)) {
-        throw new Error(`Circular dependency detected involving theme: ${id}`);
-      }
-      if (visited.has(id)) {
-        return;
-      }
-
-      visiting.add(id);
-      const entry = this.entries.get(id);
-      if (entry) {
-        for (const dep of entry.dependencies) {
-          if (!this.has(dep)) {
-            throw new Error(`Theme "${id}" depends on non-existent theme: ${dep}`);
-          }
-          visit(dep);
-        }
-      }
-      visiting.delete(id);
-      visited.add(id);
-      resolved.push(id);
-    };
+export function registerTheme(registry: ThemeRegistry, id: string, metadata: ThemeMetadata): void {
+  registry[id] = metadata;
+}
 
-    visit(themeId);
-    return resolved;
-  }
+/**
+ * Unregister a theme
+ * @param registry - Theme registry object
+ * @param id - Theme identifier
+ */
+export function unregisterTheme(registry: ThemeRegistry, id: string): boolean {
+  const exists = id in registry;
+  delete registry[id];
+  return exists;
+}
 
-  /**
-   * Resolve dependencies and build dependency graph
-   */
-  private resolveDependencies(): void {
-    // Build dependents map
-    for (const entry of this.entries.values()) {
-      for (const dep of entry.dependencies) {
-        const depEntry = this.entries.get(dep);
-        if (depEntry) {
-          if (!depEntry.dependents.includes(entry.id)) {
-            depEntry.dependents.push(entry.id);
-          }
-        }
-      }
-    }
-  }
+/**
+ * Check if a theme is registered
+ * @param registry - Theme registry object
+ * @param id - Theme identifier
+ */
+export function hasTheme(registry: ThemeRegistry, id: string): boolean {
+  return id in registry;
+}
 
-  /**
-   * Validate all themes
-   */
-  validate(): { valid: boolean; errors: string[] } {
-    const errors: string[] = [];
+/**
+ * Get theme metadata
+ * @param registry - Theme registry object
+ * @param id - Theme identifier
+ */
+export function getTheme(registry: ThemeRegistry, id: string): ThemeMetadata | undefined {
+  return registry[id];
+}
 
-    // Check for circular dependencies
-    for (const themeId of this.entries.keys()) {
-      try {
-        this.resolveDependencyOrder(themeId);
-      } catch (error) {
-        errors.push(error instanceof Error ? error.message : String(error));
-      }
-    }
+/**
+ * Get all registered theme metadata
+ * @param registry - Theme registry object
+ */
+export function getAllThemes(registry: ThemeRegistry): ThemeMetadata[] {
+  return Object.values(registry);
+}
 
-    // Check for missing dependencies
-    for (const [themeId, entry] of this.entries.entries()) {
-      for (const dep of entry.dependencies) {
-        if (!this.has(dep)) {
-          errors.push(`Theme "${themeId}" depends on non-existent theme: ${dep}`);
-        }
-      }
-    }
+/**
+ * Get all registered theme IDs
+ * @param registry - Theme registry object
+ */
+export function getThemeIds(registry: ThemeRegistry): string[] {
+  return Object.keys(registry);
+}
 
-    return {
-      valid: errors.length === 0,
-      errors,
-    };
-  }
+/**
+ * Clear all registered themes
+ * @param registry - Theme registry object
+ */
+export function clearThemes(registry: ThemeRegistry): void {
+  Object.keys(registry).forEach(key => delete registry[key]);
+}
 
-  /**
-   * Clear registry
-   */
-  clear(): void {
-    this.entries.clear();
-    this.config = null;
-    this.initialized = false;
-  }
+/**
+ * Get the number of registered themes
+ * @param registry - Theme registry object
+ */
+export function getThemeCount(registry: ThemeRegistry): number {
+  return Object.keys(registry).length;
 }

package/src/lib/theme/core/composeTheme.ts

@@ -1,12 +1,9 @@
 /**
  * Theme Composition Utilities
- * 
- * Utilities for composing, merging, and extending themes.
+ *
+ * Simplified utilities for composing and merging DesignTokens.
  */
 
-import type { Theme, ThemeOptions } from '../types';
-import { createThemeObject } from './createThemeObject';
-
 // ============================================================================
 // Deep Merge Utility
 // ============================================================================
@@ -22,7 +19,7 @@ function isObject(item: any): item is Record<string, any> {
  * Deep merge multiple objects
  * Later objects override earlier ones
  */
-export function deepMerge<T extends Record<string, any>>(...objects: Partial<T>[]): T {
+export function deepMerge<T extends Record<string, unknown>>(...objects: Partial<T>[]): T {
     if (objects.length === 0) return {} as T;
     if (objects.length === 1) return objects[0] as T;
 
@@ -40,10 +37,10 @@ export function deepMerge<T extends Record<string, any>>(...objects: Partial<T>[
 
             if (isObject(targetValue) && isObject(sourceValue)) {
                 // Recursively merge objects
-                result[key] = deepMerge(targetValue as any, sourceValue as any) as any;
+                result[key] = deepMerge(targetValue as Record<string, unknown>, sourceValue as Record<string, unknown>) as T[Extract<keyof T, string>];
             } else {
                 // Override with source value
-                result[key] = sourceValue as any;
+                result[key] = sourceValue as T[Extract<keyof T, string>];
             }
         }
     }
@@ -52,100 +49,45 @@ export function deepMerge<T extends Record<string, any>>(...objects: Partial<T>[
 }
 
 // ============================================================================
-// Theme Merging
+// DesignTokens Merging
 // ============================================================================
 
+import type { DesignTokens } from '../tokens/tokens';
+
 /**
- * Merge multiple theme options into a single theme options object
- * 
- * @param themes - Theme options to merge
- * @returns Merged theme options
- * 
+ * Merge multiple DesignTokens objects into a single DesignTokens object
+ *
+ * @param tokens - DesignTokens objects to merge
+ * @returns Merged DesignTokens object
+ *
  * @example
  * ```typescript
- * const baseTheme = { palette: { primary: { main: '#000' } } };
- * const customTheme = { palette: { secondary: { main: '#fff' } } };
- * const merged = mergeTheme(baseTheme, customTheme);
+ * const baseTokens = { 'primary': '#000', 'spacing-4': '1rem' };
+ * const customTokens = { 'secondary': '#fff', 'spacing-4': '1.5rem' };
+ * const merged = mergeTheme(baseTokens, customTokens);
+ * // Returns: { 'primary': '#000', 'secondary': '#fff', 'spacing-4': '1.5rem' }
  * ```
  */
-export function mergeTheme(...themes: ThemeOptions[]): ThemeOptions {
-    return deepMerge({}, ...themes);
+export function mergeTheme(...tokens: Partial<DesignTokens>[]): Partial<DesignTokens> {
+    return deepMerge({}, ...tokens);
 }
 
 /**
- * Extend an existing theme with new options
- * 
- * @param baseTheme - Base theme to extend (can be Theme or ThemeOptions)
- * @param extension - Theme options to extend with
- * @returns New theme with extended options
- * 
+ * Extend DesignTokens with additional tokens
+ *
+ * @param baseTokens - Base DesignTokens to extend
+ * @param extension - Additional DesignTokens to merge
+ * @returns Extended DesignTokens object
+ *
  * @example
  * ```typescript
- * const base = createTheme({ palette: { primary: { main: '#000' } } });
- * const extended = extendTheme(base, {
- *   palette: { secondary: { main: '#fff' } }
- * });
+ * const base = { 'primary': '#000' };
+ * const extended = extendTheme(base, { 'secondary': '#fff' });
+ * // Returns: { 'primary': '#000', 'secondary': '#fff' }
  * ```
  */
-export function extendTheme(baseTheme: Theme | ThemeOptions, extension: ThemeOptions): Theme {
-    // If baseTheme is a complete Theme, extract the options
-    const baseOptions: ThemeOptions = (baseTheme as any).__isJSTheme
-        ? extractThemeOptions(baseTheme as Theme)
-        : (baseTheme as ThemeOptions);
-
-    const merged = mergeTheme(baseOptions, extension);
-    return createThemeObject(merged);
-}
-
-/**
- * Extract theme options from a complete Theme object
- */
-function extractThemeOptions(theme: Theme): ThemeOptions {
-    return {
-        name: theme.name,
-        class: theme.class,
-        description: theme.description,
-        author: theme.author,
-        version: theme.version,
-        tags: theme.tags,
-        supportsDarkMode: theme.supportsDarkMode,
-        status: theme.status,
-        a11y: theme.a11y,
-        color: theme.color,
-        features: theme.features,
-        dependencies: theme.dependencies,
-        palette: {
-            primary: theme.palette.primary,
-            secondary: theme.palette.secondary,
-            error: theme.palette.error,
-            warning: theme.palette.warning,
-            info: theme.palette.info,
-            success: theme.palette.success,
-            background: theme.palette.background,
-            text: theme.palette.text,
-        },
-        typography: {
-            fontFamily: theme.typography.fontFamily,
-            fontSize: theme.typography.fontSize,
-            fontWeightLight: theme.typography.fontWeightLight,
-            fontWeightRegular: theme.typography.fontWeightRegular,
-            fontWeightMedium: theme.typography.fontWeightMedium,
-            fontWeightSemiBold: theme.typography.fontWeightSemiBold,
-            fontWeightBold: theme.typography.fontWeightBold,
-            h1: theme.typography.h1,
-            h2: theme.typography.h2,
-            h3: theme.typography.h3,
-            h4: theme.typography.h4,
-            h5: theme.typography.h5,
-            h6: theme.typography.h6,
-            body1: theme.typography.body1,
-            body2: theme.typography.body2,
-        },
-        shadows: theme.shadows,
-        transitions: theme.transitions,
-        zIndex: theme.zIndex,
-        custom: theme.custom,
-    };
+export function extendTheme(baseTokens: Partial<DesignTokens>, extension: Partial<DesignTokens>): Partial<DesignTokens> {
+    return mergeTheme(baseTokens, extension);
 }
 
 export default {