@useavalon/avalon 0.1.11 → 0.1.13

package/src/client/types/framework-runtime.d.ts

@@ -1,68 +1,68 @@
-/**
- * Type declarations for framework runtime imports
- * 
- * These are dynamic imports that are resolved by Vite at runtime in the browser.
- * The actual packages are provided by the user's project dependencies.
- */
-
-declare module 'react' {
-  export function createElement<P = Record<string, unknown>>(
-    component: unknown,
-    props: P | null,
-    ...children: unknown[]
-  ): unknown;
-  export const version: string;
-}
-
-declare module 'react-dom/client' {
-  export interface Root {
-    render(element: unknown): void;
-    unmount(): void;
-  }
-  
-  export function hydrateRoot(
-    container: HTMLElement,
-    element: unknown,
-    options?: {
-      onRecoverableError?: (error: Error) => void;
-    }
-  ): Root;
-  
-  export function createRoot(container: HTMLElement): Root;
-}
-
-declare module 'vue' {
-  export interface App {
-    mount(rootContainer: HTMLElement | string, isHydrate?: boolean): unknown;
-    unmount(): void;
-    use(plugin: unknown, ...options: unknown[]): App;
-    component(name: string, component: unknown): App;
-    directive(name: string, directive: unknown): App;
-    provide(key: string | symbol, value: unknown): App;
-    config: {
-      errorHandler?: (err: Error, instance: unknown, info: string) => void;
-      warnHandler?: (msg: string, instance: unknown, trace: string) => void;
-    };
-  }
-  
-  export function createApp(rootComponent: unknown, rootProps?: Record<string, unknown>): App;
-  export const version: string;
-}
-
-
-declare module 'svelte' {
-  export interface SvelteComponent {
-    new (options: {
-      target: HTMLElement;
-      props?: Record<string, unknown>;
-      hydrate?: boolean;
-      intro?: boolean;
-      anchor?: Element | null;
-      context?: Map<unknown, unknown>;
-    }): {
-      $set(props: Record<string, unknown>): void;
-      $destroy(): void;
-      $on?(event: string, handler: (...args: unknown[]) => void): () => void;
-    };
-  }
-}
+/**
+ * Type declarations for framework runtime imports
+ * 
+ * These are dynamic imports that are resolved by Vite at runtime in the browser.
+ * The actual packages are provided by the user's project dependencies.
+ */
+
+declare module 'react' {
+  export function createElement<P = Record<string, unknown>>(
+    component: unknown,
+    props: P | null,
+    ...children: unknown[]
+  ): unknown;
+  export const version: string;
+}
+
+declare module 'react-dom/client' {
+  export interface Root {
+    render(element: unknown): void;
+    unmount(): void;
+  }
+  
+  export function hydrateRoot(
+    container: HTMLElement,
+    element: unknown,
+    options?: {
+      onRecoverableError?: (error: Error) => void;
+    }
+  ): Root;
+  
+  export function createRoot(container: HTMLElement): Root;
+}
+
+declare module 'vue' {
+  export interface App {
+    mount(rootContainer: HTMLElement | string, isHydrate?: boolean): unknown;
+    unmount(): void;
+    use(plugin: unknown, ...options: unknown[]): App;
+    component(name: string, component: unknown): App;
+    directive(name: string, directive: unknown): App;
+    provide(key: string | symbol, value: unknown): App;
+    config: {
+      errorHandler?: (err: Error, instance: unknown, info: string) => void;
+      warnHandler?: (msg: string, instance: unknown, trace: string) => void;
+    };
+  }
+  
+  export function createApp(rootComponent: unknown, rootProps?: Record<string, unknown>): App;
+  export const version: string;
+}
+
+
+declare module 'svelte' {
+  export interface SvelteComponent {
+    new (options: {
+      target: HTMLElement;
+      props?: Record<string, unknown>;
+      hydrate?: boolean;
+      intro?: boolean;
+      anchor?: Element | null;
+      context?: Map<unknown, unknown>;
+    }): {
+      $set(props: Record<string, unknown>): void;
+      $destroy(): void;
+      $on?(event: string, handler: (...args: unknown[]) => void): () => void;
+    };
+  }
+}

package/src/client/types/vite-hmr.d.ts

@@ -1,46 +1,46 @@
-/**
- * Type definitions for Vite HMR API
- */
-
-declare module 'vite/types/hmrPayload' {
-  export interface HMRPayload {
-    type: 'update' | 'full-reload' | 'prune' | 'error' | 'connected' | 'custom';
-    updates?: Update[];
-    timestamp?: number;
-    path?: string;
-    err?: Error;
-    data?: unknown;
-    event?: string;
-  }
-
-  export interface Update {
-    type: 'js-update' | 'css-update';
-    path: string;
-    acceptedPath: string;
-    timestamp: number;
-    explicitImportRequired?: boolean;
-  }
-}
-
-declare global {
-  interface ImportMeta {
-    hot?: {
-      accept(): void;
-      accept(cb: (mod: unknown) => void): void;
-      accept(dep: string, cb: (mod: unknown) => void): void;
-      accept(deps: readonly string[], cb: (mods: unknown[]) => void): void;
-      
-      dispose(cb: (data: unknown) => void): void;
-      decline(): void;
-      invalidate(): void;
-      
-      on(event: string, cb: (payload: unknown) => void): void;
-      off(event: string, cb: (payload: unknown) => void): void;
-      send(event: string, data?: unknown): void;
-      
-      data: unknown;
-    };
-  }
-}
-
-export {};
+/**
+ * Type definitions for Vite HMR API
+ */
+
+declare module 'vite/types/hmrPayload' {
+  export interface HMRPayload {
+    type: 'update' | 'full-reload' | 'prune' | 'error' | 'connected' | 'custom';
+    updates?: Update[];
+    timestamp?: number;
+    path?: string;
+    err?: Error;
+    data?: unknown;
+    event?: string;
+  }
+
+  export interface Update {
+    type: 'js-update' | 'css-update';
+    path: string;
+    acceptedPath: string;
+    timestamp: number;
+    explicitImportRequired?: boolean;
+  }
+}
+
+declare global {
+  interface ImportMeta {
+    hot?: {
+      accept(): void;
+      accept(cb: (mod: unknown) => void): void;
+      accept(dep: string, cb: (mod: unknown) => void): void;
+      accept(deps: readonly string[], cb: (mods: unknown[]) => void): void;
+      
+      dispose(cb: (data: unknown) => void): void;
+      decline(): void;
+      invalidate(): void;
+      
+      on(event: string, cb: (payload: unknown) => void): void;
+      off(event: string, cb: (payload: unknown) => void): void;
+      send(event: string, data?: unknown): void;
+      
+      data: unknown;
+    };
+  }
+}
+
+export {};

package/src/client/types/vite-virtual-modules.d.ts

@@ -1,60 +1,70 @@
-/**
- * Type declarations for Vite virtual modules
- * 
- * These modules are resolved by Vite at runtime in the browser.
- * They don't exist as actual files but are provided by Vite's plugin system.
- */
-
-declare module '/@useavalon/preact/client' {
-  export function hydrate(
-    container: Element,
-    component: unknown,
-    props?: Record<string, unknown>
-  ): void;
-  export function getHydrationScript(): string;
-}
-
-declare module '/@useavalon/react/client' {
-  export function hydrate(
-    container: Element,
-    component: unknown,
-    props?: Record<string, unknown>
-  ): void;
-  export function getHydrationScript(): string;
-}
-
-declare module '/@useavalon/vue/client' {
-  export function hydrate(
-    container: Element,
-    component: unknown,
-    props?: Record<string, unknown>
-  ): void;
-  export function getHydrationScript(): string;
-}
-
-declare module '/@useavalon/svelte/client' {
-  export function hydrate(
-    container: Element,
-    component: unknown,
-    props?: Record<string, unknown>
-  ): void;
-  export function getHydrationScript(): string;
-}
-
-declare module '/@useavalon/solid/client' {
-  export function hydrate(
-    container: Element,
-    component: unknown,
-    props?: Record<string, unknown>
-  ): void;
-  export function getHydrationScript(): string;
-}
-
-declare module '/@useavalon/lit/client' {
-  export function hydrate(
-    container: Element,
-    component: unknown,
-    props?: Record<string, unknown>
-  ): void;
-  export function getHydrationScript(): string;
-}
+/**
+ * Type declarations for Vite virtual modules
+ *
+ * These modules are resolved by Vite at runtime in the browser.
+ * They don't exist as actual files but are provided by Vite's plugin system.
+ */
+
+declare module '/@useavalon/preact/client' {
+	export function hydrate(container: Element, component: unknown, props?: Record<string, unknown>): void;
+	export function getHydrationScript(): string;
+}
+
+declare module '/@useavalon/react/client' {
+	export function hydrate(container: Element, component: unknown, props?: Record<string, unknown>): void;
+	export function getHydrationScript(): string;
+}
+
+declare module '/@useavalon/vue/client' {
+	export function hydrate(container: Element, component: unknown, props?: Record<string, unknown>): void;
+	export function getHydrationScript(): string;
+}
+
+declare module '/@useavalon/svelte/client' {
+	export function hydrate(container: Element, component: unknown, props?: Record<string, unknown>): void;
+	export function getHydrationScript(): string;
+}
+
+declare module '/@useavalon/solid/client' {
+	export function hydrate(container: Element, component: unknown, props?: Record<string, unknown>): void;
+	export function getHydrationScript(): string;
+}
+
+declare module '/@useavalon/lit/client' {
+	export function hydrate(container: Element, component: unknown, props?: Record<string, unknown>): void;
+	export function getHydrationScript(): string;
+}
+
+declare module '/@useavalon/qwik/client' {
+	export function hydrate(container: Element, component: unknown, props?: Record<string, unknown>): void;
+	export function getHydrationScript(): string;
+}
+
+// HMR adapter virtual modules
+declare module '/@useavalon/react/client/hmr' {
+	export { reactAdapter } from '@useavalon/react/client/hmr';
+}
+
+declare module '/@useavalon/preact/client/hmr' {
+	export { preactAdapter } from '@useavalon/preact/client/hmr';
+}
+
+declare module '/@useavalon/vue/client/hmr' {
+	export { vueAdapter } from '@useavalon/vue/client/hmr';
+}
+
+declare module '/@useavalon/svelte/client/hmr' {
+	export { svelteAdapter } from '@useavalon/svelte/client/hmr';
+}
+
+declare module '/@useavalon/solid/client/hmr' {
+	export { solidAdapter } from '@useavalon/solid/client/hmr';
+}
+
+declare module '/@useavalon/lit/client/hmr' {
+	export { litAdapter } from '@useavalon/lit/client/hmr';
+}
+
+declare module '/@useavalon/qwik/client/hmr' {
+	export { qwikAdapter } from '@useavalon/qwik/client/hmr';
+}

package/src/components/Image.tsx

@@ -1,123 +1,123 @@
-/**
- * Image Component for Avalon
- *
- * A responsive image component that works with vite-imagetools to provide
- * optimized images with automatic srcset generation.
- *
- * Usage:
- * ```tsx
- * import { Image } from '@useavalon/avalon/client';
- * import heroSrc from './hero.jpg?w=400;800;1200&format=webp&as=srcset';
- *
- * <Image
- *   src={heroSrc}
- *   alt="Hero image"
- *   sizes="(max-width: 600px) 400px, (max-width: 1200px) 800px, 1200px"
- * />
- * ```
- *
- * Or with the simpler single-image approach:
- * ```tsx
- * import heroSrc from './hero.jpg?w=800&format=webp';
- *
- * <Image src={heroSrc} alt="Hero image" width={800} height={600} />
- * ```
- */
-
-import type { JSX } from "preact";
-
-export interface ImageProps {
-  /** 
-   * Image source - can be:
-   * - A string URL (single image)
-   * - A srcset string from ?as=srcset (contains " Xw" width descriptors)
-   * - An object with src/srcset/width/height from vite-imagetools
-   */
-  src: string | { src: string; srcset?: string; width?: number; height?: number };
-
-  /** Alt text for accessibility (required) */
-  alt: string;
-
-  /** Sizes attribute for responsive images (required when using srcset) */
-  sizes?: string;
-
-  /** Loading strategy */
-  loading?: "lazy" | "eager";
-
-  /** Decoding hint */
-  decoding?: "async" | "sync" | "auto";
-
-  /** Optional width (auto-detected from srcset if available) */
-  width?: number | string;
-
-  /** Optional height (auto-detected from srcset if available) */
-  height?: number | string;
-
-  /** CSS class name */
-  className?: string;
-
-  /** Inline styles */
-  style?: string | Record<string, string | number>;
-}
-
-/**
- * Check if a string looks like a srcset (contains width descriptors like "400w")
- */
-function isSrcsetString(value: string): boolean {
-  return /\s\d+w/.test(value);
-}
-
-/**
- * Responsive image component with built-in optimization support
- */
-export function Image({
-  src,
-  alt,
-  sizes,
-  loading = "lazy",
-  decoding = "async",
-  width,
-  height,
-  className,
-  style,
-}: Readonly<ImageProps>): JSX.Element {
-  let imgSrc: string | undefined;
-  let srcSet: string | undefined;
-  let autoWidth: number | undefined;
-  let autoHeight: number | undefined;
-
-  if (typeof src === "object" && src !== null) {
-    // Object from vite-imagetools (e.g., ?as=metadata or custom output)
-    imgSrc = src.src;
-    srcSet = src.srcset;
-    autoWidth = src.width;
-    autoHeight = src.height;
-  } else if (typeof src === "string") {
-    if (isSrcsetString(src)) {
-      // srcset string from ?as=srcset - use first URL as fallback src
-      srcSet = src;
-      const firstUrl = src.split(",")[0]?.trim().split(" ")[0];
-      imgSrc = firstUrl;
-    } else {
-      // Regular URL string
-      imgSrc = src;
-    }
-  }
-
-  return (
-    <img
-      src={imgSrc}
-      srcSet={srcSet}
-      sizes={sizes}
-      alt={alt}
-      loading={loading}
-      decoding={decoding}
-      width={width ?? autoWidth}
-      height={height ?? autoHeight}
-      className={className}
-      style={style}
-    />
-  );
-}
-
-export default Image;
+/**
+ * Image Component for Avalon
+ *
+ * A responsive image component that works with vite-imagetools to provide
+ * optimized images with automatic srcset generation.
+ *
+ * Usage:
+ * ```tsx
+ * import { Image } from '@useavalon/avalon/client';
+ * import heroSrc from './hero.jpg?w=400;800;1200&format=webp&as=srcset';
+ *
+ * <Image
+ *   src={heroSrc}
+ *   alt="Hero image"
+ *   sizes="(max-width: 600px) 400px, (max-width: 1200px) 800px, 1200px"
+ * />
+ * ```
+ *
+ * Or with the simpler single-image approach:
+ * ```tsx
+ * import heroSrc from './hero.jpg?w=800&format=webp';
+ *
+ * <Image src={heroSrc} alt="Hero image" width={800} height={600} />
+ * ```
+ */
+
+import type { JSX } from "preact";
+
+export interface ImageProps {
+  /** 
+   * Image source - can be:
+   * - A string URL (single image)
+   * - A srcset string from ?as=srcset (contains " Xw" width descriptors)
+   * - An object with src/srcset/width/height from vite-imagetools
+   */
+  src: string | { src: string; srcset?: string; width?: number; height?: number };
+
+  /** Alt text for accessibility (required) */
+  alt: string;
+
+  /** Sizes attribute for responsive images (required when using srcset) */
+  sizes?: string;
+
+  /** Loading strategy */
+  loading?: "lazy" | "eager";
+
+  /** Decoding hint */
+  decoding?: "async" | "sync" | "auto";
+
+  /** Optional width (auto-detected from srcset if available) */
+  width?: number | string;
+
+  /** Optional height (auto-detected from srcset if available) */
+  height?: number | string;
+
+  /** CSS class name */
+  className?: string;
+
+  /** Inline styles */
+  style?: string | Record<string, string | number>;
+}
+
+/**
+ * Check if a string looks like a srcset (contains width descriptors like "400w")
+ */
+function isSrcsetString(value: string): boolean {
+  return /\s\d+w/.test(value);
+}
+
+/**
+ * Responsive image component with built-in optimization support
+ */
+export function Image({
+  src,
+  alt,
+  sizes,
+  loading = "lazy",
+  decoding = "async",
+  width,
+  height,
+  className,
+  style,
+}: Readonly<ImageProps>): JSX.Element {
+  let imgSrc: string | undefined;
+  let srcSet: string | undefined;
+  let autoWidth: number | undefined;
+  let autoHeight: number | undefined;
+
+  if (typeof src === "object" && src !== null) {
+    // Object from vite-imagetools (e.g., ?as=metadata or custom output)
+    imgSrc = src.src;
+    srcSet = src.srcset;
+    autoWidth = src.width;
+    autoHeight = src.height;
+  } else if (typeof src === "string") {
+    if (isSrcsetString(src)) {
+      // srcset string from ?as=srcset - use first URL as fallback src
+      srcSet = src;
+      const firstUrl = src.split(",")[0]?.trim().split(" ")[0];
+      imgSrc = firstUrl;
+    } else {
+      // Regular URL string
+      imgSrc = src;
+    }
+  }
+
+  return (
+    <img
+      src={imgSrc}
+      srcSet={srcSet}
+      sizes={sizes}
+      alt={alt}
+      loading={loading}
+      decoding={decoding}
+      width={width ?? autoWidth}
+      height={height ?? autoHeight}
+      className={className}
+      style={style}
+    />
+  );
+}
+
+export default Image;