@useavalon/avalon 0.1.12 → 0.1.13

package/src/islands/universal-css-collector.ts

@@ -0,0 +1,157 @@
+/**
+ * Universal CSS Collector
+ * 
+ * Collects and manages CSS from all framework integrations (Vue, Svelte, Solid, Preact)
+ * during SSR rendering. Provides a unified interface for CSS injection into the document head.
+ */
+
+declare global {
+  var __universalSSRCSS: Map<string, UniversalCSSEntry> | undefined;
+}
+
+export interface UniversalCSSEntry {
+  css: string;
+  scopeId: string;
+  src: string;
+  framework: string;
+  timestamp: number;
+}
+
+// Initialize global CSS collector
+if (typeof globalThis !== "undefined" && !globalThis.__universalSSRCSS) {
+  globalThis.__universalSSRCSS = new Map();
+}
+
+/**
+ * Add CSS from any framework integration to the global collection
+ */
+export function addUniversalCSS(
+  css: string,
+  src: string,
+  framework: string,
+  scopeId?: string,
+): void {
+  if (!css || !css.trim()) {
+    return;
+  }
+
+  if (!globalThis.__universalSSRCSS) {
+    globalThis.__universalSSRCSS = new Map();
+  }
+
+  // Generate a unique key for this CSS entry
+  const key = scopeId || `${framework}-${src}`;
+
+  const entry: UniversalCSSEntry = {
+    css: css.trim(),
+    scopeId: key,
+    src,
+    framework,
+    timestamp: Date.now(),
+  };
+
+  globalThis.__universalSSRCSS.set(key, entry);
+}
+
+/**
+ * Get all collected CSS from all frameworks
+ */
+export function getUniversalCSS(clear = false): string {
+  if (!globalThis.__universalSSRCSS || globalThis.__universalSSRCSS.size === 0) {
+    return "";
+  }
+
+  const entries = Array.from(globalThis.__universalSSRCSS.values());
+
+  // Sort by timestamp to maintain render order
+  entries.sort((a, b) => a.timestamp - b.timestamp);
+
+  // Group by framework for better organization
+  const cssByFramework = entries.reduce((acc, entry) => {
+    if (!acc[entry.framework]) {
+      acc[entry.framework] = [];
+    }
+    acc[entry.framework].push(entry);
+    return acc;
+  }, {} as Record<string, UniversalCSSEntry[]>);
+
+  // Build CSS string with framework sections
+  const cssBlocks: string[] = [];
+
+  for (const [framework, frameworkEntries] of Object.entries(cssByFramework)) {
+    const frameworkCSS = frameworkEntries.map((entry) => {
+      const comment = `/* ${framework}: ${entry.src} (${entry.scopeId}) */`;
+      return `${comment}\n${entry.css}`;
+    }).join("\n\n");
+
+    cssBlocks.push(frameworkCSS);
+  }
+
+  const combinedCSS = cssBlocks.join("\n\n");
+
+  if (clear) {
+    globalThis.__universalSSRCSS.clear();
+  }
+
+  return combinedCSS;
+}
+
+/**
+ * Get CSS formatted for document head injection
+ */
+export function getUniversalCSSForHead(clear = false): string {
+  const css = getUniversalCSS(clear);
+
+  if (!css.trim()) {
+    return "";
+  }
+
+  const timestamp = new Date().toISOString();
+  const styleTag =
+    `<style data-universal-ssr="true" data-generated="${timestamp}">\n${css}\n</style>`;
+
+  return styleTag;
+}
+
+/**
+ * Clear all collected CSS
+ */
+export function clearUniversalCSS(): void {
+  if (globalThis.__universalSSRCSS) {
+    globalThis.__universalSSRCSS.clear();
+  }
+}
+
+/**
+ * Get CSS statistics
+ */
+export function getUniversalCSSStats(): {
+  totalComponents: number;
+  byFramework: Record<string, number>;
+  totalCSSSize: number;
+  averageCSSSize: number;
+} {
+  if (!globalThis.__universalSSRCSS || globalThis.__universalSSRCSS.size === 0) {
+    return {
+      totalComponents: 0,
+      byFramework: {},
+      totalCSSSize: 0,
+      averageCSSSize: 0,
+    };
+  }
+
+  const entries = Array.from(globalThis.__universalSSRCSS.values());
+  const byFramework = entries.reduce((acc, entry) => {
+    acc[entry.framework] = (acc[entry.framework] || 0) + 1;
+    return acc;
+  }, {} as Record<string, number>);
+
+  const totalCSSSize = entries.reduce((sum, entry) => sum + entry.css.length, 0);
+
+  return {
+    totalComponents: entries.length,
+    byFramework,
+    totalCSSSize,
+    averageCSSSize: entries.length > 0 ? Math.round(totalCSSSize / entries.length) : 0,
+  };
+}

package/src/islands/universal-head-collector.ts

@@ -0,0 +1,137 @@
+/**
+ * Universal Head Content Collector for SSR
+ * 
+ * Collects head content (scripts, meta tags, etc.) from framework integrations
+ * during SSR and injects them into the HTML head.
+ * 
+ * Similar to universal-css-collector.ts but for head content.
+ */
+
+interface HeadEntry {
+  content: string;
+  src: string;
+  framework: string;
+  type: 'script' | 'meta' | 'link' | 'other';
+}
+
+declare global {
+  var __universalSSRHead: Map<string, HeadEntry>;
+}
+
+/**
+ * Initialize the global head collector if it doesn't exist
+ */
+function initHeadCollector(): Map<string, HeadEntry> {
+  if (!globalThis.__universalSSRHead) {
+    globalThis.__universalSSRHead = new Map();
+  }
+  return globalThis.__universalSSRHead;
+}
+
+/**
+ * Add head content to the universal collector
+ * 
+ * @param content - The head content (script, meta tag, etc.)
+ * @param src - Source component path
+ * @param framework - Framework name
+ * @param type - Type of head content
+ */
+export function addUniversalHead(
+  content: string,
+  src: string,
+  framework: string,
+  type: 'script' | 'meta' | 'link' | 'other' = 'other'
+): void {
+  const collector = initHeadCollector();
+  
+  // Generate a unique key for this head entry
+  const key = `${framework}-${src}-${type}`;
+  
+  collector.set(key, {
+    content,
+    src,
+    framework,
+    type,
+  });
+}
+
+/**
+ * Get all collected head content formatted for injection into HTML head
+ * 
+ * @param clear - Whether to clear the collector after getting content
+ * @returns Formatted head content string
+ */
+export function getUniversalHeadForInjection(clear = false): string {
+  const collector = initHeadCollector();
+  
+  if (collector.size === 0) {
+    return '';
+  }
+  
+  const entries = Array.from(collector.values());
+  
+  // Group by type for better organization
+  const scripts = entries.filter(e => e.type === 'script');
+  const metas = entries.filter(e => e.type === 'meta');
+  const links = entries.filter(e => e.type === 'link');
+  const others = entries.filter(e => e.type === 'other');
+  
+  const parts: string[] = [];
+  
+  // Add meta tags first
+  if (metas.length > 0) {
+    parts.push('<!-- Framework Meta Tags -->');
+    parts.push(...metas.map(e => e.content));
+  }
+  
+  // Add links
+  if (links.length > 0) {
+    parts.push('<!-- Framework Links -->');
+    parts.push(...links.map(e => e.content));
+  }
+  
+  // Add scripts
+  if (scripts.length > 0) {
+    parts.push('<!-- Framework Hydration Scripts -->');
+    // Wrap script content in <script> tags if not already wrapped
+    parts.push(...scripts.map(e => {
+      const content = e.content.trim();
+      // Check if already wrapped in script tags
+      if (content.startsWith('<script')) {
+        return content;
+      }
+      // Wrap in script tags
+      return `<script>${content}</script>`;
+    }));
+  }
+  
+  // Add other content
+  if (others.length > 0) {
+    parts.push('<!-- Framework Head Content -->');
+    parts.push(...others.map(e => e.content));
+  }
+  
+  const result = parts.join('\n    ');
+  
+  if (clear) {
+    collector.clear();
+  }
+  
+  return result;
+}
+
+/**
+ * Clear all collected head content
+ */
+export function clearUniversalHead(): void {
+  const collector = initHeadCollector();
+  collector.clear();
+}
+
+/**
+ * Get the current size of the head collector
+ */
+export function getHeadCollectorSize(): number {
+  const collector = initHeadCollector();
+  return collector.size;
+}

package/src/layout-system.ts

@@ -0,0 +1,218 @@
+/**
+ * Advanced Layout System - Complete Export Index
+ *
+ * This file provides a comprehensive export index for the entire layout system,
+ * making it easy to import all layout-related functionality from a single location.
+ */
+
+// === Core Layout System ===
+
+// Layout Discovery
+export { LayoutDiscovery } from './core/layout/layout-discovery.ts';
+export type { LayoutDiscoveryOptions, LayoutRoute } from './schemas/layout.ts';
+
+// Layout Data Loading
+export {
+	LayoutDataLoader,
+	LayoutDataLoadingError,
+	loadSingleLayoutData,
+	mergeLayoutData,
+	getParentLayoutData,
+	defaultLayoutDataLoader,
+} from './core/layout/layout-data-loader.ts';
+export type { LayoutDataLoadingResult, LayoutDataLoadingOptions } from './core/layout/layout-data-loader.ts';
+
+// Layout Matching and Conditional Rendering
+export { LayoutMatcher as LayoutMatcherClass, BuiltInLayoutRules } from './core/layout/layout-matcher.ts';
+export type { LayoutRule, RouteInfo } from './schemas/layout.ts';
+
+// Layout Composition Control
+export { LayoutComposer } from './core/layout/layout-composer.ts';
+export type { LayoutConfig } from './schemas/layout.ts';
+
+// Enhanced Layout Resolver
+export {
+	EnhancedLayoutResolver,
+	createEnhancedLayoutResolver,
+	EnhancedLayoutResolverUtils,
+} from './core/layout/enhanced-layout-resolver.ts';
+export type { EnhancedLayoutResolverOptions } from './core/layout/enhanced-layout-resolver.ts';
+
+// === Persistent Islands System ===
+
+export { IslandPersistence, defaultIslandPersistence } from './core/islands/island-persistence.ts';
+export { IslandStateSerializer } from './core/islands/island-state-serializer.ts';
+export {
+	createPersistentIslandContext,
+	usePersistentIslandContext,
+	PersistentIslandProvider,
+} from './core/islands/persistent-island-context.tsx';
+export { PersistentIsland } from './components/PersistentIsland.tsx';
+export type { IslandState, PersistentIslandProps, PersistentIslandContext } from './schemas/layout.ts';
+
+// === Error Boundary System ===
+
+export { LayoutErrorBoundary } from './components/LayoutErrorBoundary.tsx';
+export { LayoutDataErrorBoundary } from './components/LayoutDataErrorBoundary.tsx';
+export { IslandErrorBoundary, withIslandErrorBoundary } from './components/IslandErrorBoundary.tsx';
+export { StreamingErrorBoundary, withStreamingErrorBoundary } from './components/StreamingErrorBoundary.tsx';
+export type { LayoutErrorInfo, LayoutErrorBoundaryProps, ErrorRecoveryStrategy } from './schemas/layout.ts';
+
+// === Streaming System ===
+
+export { StreamingLayout, StreamingSuspense, withStreaming, useStreamingState } from './components/StreamingLayout.tsx';
+export type { StreamingLayoutProps, StreamingComponent } from './schemas/layout.ts';
+
+// === Layout Utilities (Essential Only) ===
+// Debug and performance utilities are available via lazy import from './core/layout/layout-utilities.ts'
+// when needed in development mode
+
+export { LayoutCacheManager } from './core/layout/layout-cache-manager.ts';
+export type {
+	CacheEntry,
+	CacheStats,
+	CacheConfig,
+} from './core/layout/layout-cache-manager.ts';
+
+// === Core Types and Schemas ===
+
+export type {
+	LayoutContext,
+	LayoutData,
+	LayoutHandler,
+	LayoutProps,
+	LayoutLoader,
+	ResolvedLayout,
+	LayoutCache,
+	EnhancedLayoutContext,
+	LayoutMatcherFunction,
+	LayoutErrorHandler,
+	LayoutRetryFunction,
+	LayoutFallbackRenderer,
+	IslandStateSaver,
+	IslandStateLoader,
+	IslandStateClearer,
+	StreamingReadyCheck,
+} from './schemas/layout.ts';
+
+// === Advanced Interface Types ===
+
+export type {
+	ILayoutDiscovery,
+	ILayoutMatcher,
+	ILayoutComposer,
+	IIslandPersistence,
+	ILayoutErrorRecovery,
+	ILayoutStreaming,
+	IEnhancedLayoutResolver,
+	ILayoutComponent,
+	IPersistentIslandComponent,
+	ILayoutErrorBoundaryComponent,
+	IStreamingLayoutComponent,
+	LayoutModule,
+	PageModule,
+	LayoutResolutionContext,
+	LayoutPerformanceMetrics,
+	LayoutDebugInfo,
+	LayoutEventType,
+	LayoutEventData,
+	LayoutEventHandler,
+	ILayoutEventEmitter,
+} from './types/layout.ts';
+
+// === Validation Schemas ===
+
+export {
+	LayoutContextSchema,
+	LayoutDataSchema,
+	LayoutRouteSchema,
+	LayoutHandlerSchema,
+	LayoutPropsSchema,
+	LayoutDiscoveryOptionsSchema,
+	RouteInfoSchema,
+	LayoutRuleSchema,
+	LayoutConfigSchema,
+	IslandStateSchema,
+	PersistentIslandPropsSchema,
+	PersistentIslandContextSchema,
+	LayoutErrorInfoSchema,
+	LayoutErrorBoundaryPropsSchema,
+	ErrorRecoveryStrategySchema,
+	StreamingLayoutPropsSchema,
+	StreamingComponentSchema,
+	ResolvedLayoutSchema,
+	LayoutCacheSchema,
+	EnhancedLayoutContextSchema,
+} from './schemas/layout.ts';
+
+// === Convenience Re-exports ===
+
+// Main layout system class for easy access
+export { EnhancedLayoutResolver as LayoutSystem } from './core/layout/enhanced-layout-resolver.ts';
+
+// Default instances for quick setup
+export { defaultIslandPersistence as defaultPersistence } from './core/islands/island-persistence.ts';
+// Note: defaultLayoutUtilities removed to reduce cold start overhead
+// Import directly from './core/layout/layout-utilities.ts' if needed
+
+// Factory functions for custom setups
+export { createEnhancedLayoutResolver as createLayoutSystem } from './core/layout/enhanced-layout-resolver.ts';
+
+/**
+ * Layout System Version Information
+ */
+export const LAYOUT_SYSTEM_VERSION = '1.0.0';
+
+/**
+ * Layout System Feature Flags
+ */
+export const LAYOUT_SYSTEM_FEATURES = {
+	DISCOVERY: true,
+	DATA_LOADING: true,
+	CONDITIONAL_RENDERING: true,
+	COMPOSITION_CONTROL: true,
+	PERSISTENT_ISLANDS: true,
+	ERROR_BOUNDARIES: true,
+	STREAMING: true,
+	CACHING: true,
+	PERFORMANCE_MONITORING: true,
+	DEBUG_UTILITIES: true,
+} as const;
+
+/**
+ * Layout System Configuration Defaults
+ */
+export const LAYOUT_SYSTEM_DEFAULTS = {
+	DISCOVERY: {
+		baseDirectory: 'src/pages',
+		filePattern: '_layout.tsx',
+		excludeDirectories: ['node_modules', '.git', 'dist'],
+		enableWatching: false,
+		developmentMode: false,
+	},
+	CACHING: {
+		enabled: true,
+		ttl: 300000, // 5 minutes
+		maxSize: 100,
+		cleanupInterval: 60000, // 1 minute
+	},
+	STREAMING: {
+		enabled: true,
+		priority: 'medium' as const,
+		timeout: 5000,
+	},
+	ERROR_BOUNDARIES: {
+		enabled: true,
+		maxRetries: 3,
+		fallbackStrategy: 'component' as const,
+	},
+	PERFORMANCE: {
+		monitoring: true,
+		thresholds: {
+			discoveryTime: 100,
+			dataLoadingTime: 500,
+			renderingTime: 200,
+			totalTime: 1000,
+		},
+	},
+} as const;