@stacksjs/stx/dist/server-components.d.ts

A performant UI Framework. Powered by Bun.

import type { CustomDirective } from './types';
/**
 * Register a server component.
 */
export declare function registerServerComponent(component: ServerComponent): void;
/**
 * Register a client component.
 */
export declare function registerClientComponent(component: ClientComponent): void;
/**
 * Get a registered component.
 */
export declare function getComponent(name: string): ComponentEntry | undefined;
/**
 * Check if a component is registered.
 */
export declare function hasComponent(name: string): boolean;
/**
 * Get all registered component names.
 */
export declare function getComponentNames(): string[];
/**
 * Clear all registered components.
 */
export declare function clearComponents(): void;
/**
 * Clear component cache.
 */
export declare function clearComponentCache(name?: string): void;
/**
 * Render a server component.
 */
export declare function renderServerComponent(name: string, options?: RenderOptions): Promise<RenderResult>;
/**
 * Render a client component (server-side with hydration markers).
 */
export declare function renderClientComponent(name: string, options?: RenderOptions): Promise<RenderResult>;
/**
 * Render any registered component.
 */
export declare function renderComponent(name: string, options?: RenderOptions): Promise<RenderResult>;
/**
 * Create a suspense boundary.
 */
export declare function createSuspenseBoundary(id: string, fallback: string): { wrap: (promise: Promise<string>) => Promise<string>, getFallback: () => string };
/**
 * Get suspense state by ID.
 */
export declare function getSuspenseState(id: string): SuspenseState | undefined;
/**
 * Clear suspense state.
 */
export declare function clearSuspenseState(id?: string): void;
/**
 * Create a streaming renderer for server components.
 */
export declare function createStreamingRenderer(components: string[], options?: RenderOptions): {
    renderToStream: () => ReadableStream<string>
    renderToString: () => Promise<string>
  };
/**
 * Register all server component directives.
 */
export declare function registerServerComponentDirectives(): CustomDirective[];
/**
 * Generate client-side runtime for server components hydration.
 */
export declare function generateServerComponentsRuntime(): string;
/**
 * @serverComponent directive for defining server components inline.
 */
export declare const serverComponentDirective: CustomDirective;
/**
 * @clientComponent directive for defining client components inline.
 */
export declare const clientComponentDirective: CustomDirective;
/**
 * @suspense directive for async boundaries.
 */
export declare const suspenseDirective: CustomDirective;
/** Server component definition */
export declare interface ServerComponent {
  name: string
  template: string
  loader?: (props: Record<string, unknown>) => Promise<Record<string, unknown>>
  dependencies?: string[]
  cache?: CacheConfig
  errorBoundary?: string
  suspenseFallback?: string
}
/** Client component definition */
export declare interface ClientComponent {
  name: string
  template: string
  clientScript?: string
  clientProps?: string[]
  priority?: 'eager' | 'lazy' | 'idle'
}
/** Cache configuration */
export declare interface CacheConfig {
  enabled: boolean
  ttl?: number
  keyGenerator?: (props: Record<string, unknown>) => string
  staleWhileRevalidate?: boolean
}
/** Server component rendering options */
export declare interface RenderOptions {
  props?: Record<string, unknown>
  streaming?: boolean
  request?: { url: string, headers: Record<string, string> }
  signal?: AbortSignal
}
/** Server component render result */
export declare interface RenderResult {
  html: string
  renderTime: number
  data?: Record<string, unknown>
  dependencies: string[]
  cached: boolean
  hydrationScript?: string
}
/** Component registry entry */
declare interface ComponentEntry {
  component: ServerComponent | ClientComponent
  type: 'server' | 'client'
}
/** Suspense boundary state */
declare interface SuspenseState {
  id: string
  status: 'pending' | 'resolved' | 'error'
  promise?: Promise<unknown>
  result?: string
  error?: Error
}